/*
 * Autopharm - Per-tenant color overrides for Cartzilla template
 * Style ID: 1 (farmapì - xn--farmapi-41a.it, v3.autopharm.it)
 *
 * Override only the variables that differ from Cartzilla defaults.
 * Cartzilla default primary: #f55266 (red/pink)
 * Reference: templates/frontend/cartzilla/assets/css/theme.css :root block
 */

:root,
[data-bs-theme="light"] {
	/* -----------------------------------------------------------------------
	   PRIMARY COLOR
	   Change these three to set the brand color.
	   Use https://www.w3schools.com/colors/colors_rgb.asp to get the RGB triplet.
	----------------------------------------------------------------------- */
	--cz-primary: #33b36b;
	--cz-primary-rgb: 51, 179, 107;

	/* -----------------------------------------------------------------------
	   DERIVED PRIMARY TONES
	   Sourced from theme.css success-* values (same base color #33b36b).
	----------------------------------------------------------------------- */
	--cz-primary-text-emphasis: rgb(39.69, 139.31, 83.27); /* shade-color($primary, 40%) */
	--cz-primary-bg-subtle: rgb(234.6, 247.4, 240.2);      /* tint-color($primary, 90%) */
	--cz-primary-border-subtle: rgb(214.2, 239.8, 225.4);  /* tint-color($primary, 80%) */

	/* -----------------------------------------------------------------------
	   SUCCESS COLOR — kept explicitly green so it isn't overridden
	----------------------------------------------------------------------- */
	--cz-success: #33b36b;
	--cz-success-rgb: 51, 179, 107;

	/* -----------------------------------------------------------------------
	   LINKS  (typically follow primary)
	----------------------------------------------------------------------- */
	--cz-link-color: var(--cz-primary);
	--cz-link-color-rgb: var(--cz-primary-rgb);
	--cz-link-hover-color: var(--cz-primary);
	--cz-link-hover-color-rgb: var(--cz-primary-rgb);

	/* -----------------------------------------------------------------------
	   FOCUS RING  (10% opacity of primary)
	----------------------------------------------------------------------- */
	--cz-focus-ring-color: rgba(var(--cz-primary-rgb), 0.1);

	/* -----------------------------------------------------------------------
	   LAYOUT
	   --ap-header-height: logo 45px + py-lg-3 (16×2) + border 1px = 78px
	----------------------------------------------------------------------- */
	--ap-header-height: 78px;
	--ap-sticky-gap: 20px;
	--ap-sticky-pt: 20px;
}

/* -----------------------------------------------------------------------
   BUTTONS — component-scoped vars (must be on the element, not :root)
----------------------------------------------------------------------- */
.btn-primary {
	--cz-btn-bg: #33b36b;
	--cz-btn-border-color: #33b36b;
	--cz-btn-hover-bg: rgb(39.69, 139.31, 83.27);
	--cz-btn-hover-border-color: rgb(39.69, 139.31, 83.27);
	--cz-btn-active-bg: rgb(39.69, 139.31, 83.27);
	--cz-btn-active-border-color: rgb(39.69, 139.31, 83.27);
	--cz-btn-disabled-bg: #33b36b;
	--cz-btn-disabled-border-color: #33b36b;
	--cz-btn-color: #fff;
	--cz-btn-hover-color: #fff;
	--cz-btn-active-color: #fff;
}

.btn-outline-primary {
	--cz-btn-color: #33b36b;
	--cz-btn-border-color: #33b36b;
	--cz-btn-hover-bg: #33b36b;
	--cz-btn-hover-border-color: #33b36b;
	--cz-btn-hover-color: #fff;
	--cz-btn-active-bg: rgb(39.69, 139.31, 83.27);
	--cz-btn-active-border-color: rgb(39.69, 139.31, 83.27);
	--cz-btn-active-color: #fff;
}

/* -----------------------------------------------------------------------
   DISCOUNT BADGES — bg-danger is used for "- X%" labels in product cards.
   Override to brand color; does NOT affect alert-danger (different selector).
----------------------------------------------------------------------- */
.badge.bg-danger {
	background-color: var(--cz-primary) !important;
	color: #fff !important;
}

/* -----------------------------------------------------------------------
   BODY BACKGROUND
----------------------------------------------------------------------- */
[data-bs-theme="light"] body {
	--ap-content-pt: 1.25rem;
}