/* ============================================================
   FINAL OVERRIDE - SEMUA GRADIEN HALAMAN PUBLIK -> WARNA BRAND
   Dimuat paling akhir (setelah brand-theme & buttons-rounded)
   supaya menang atas semua gradient !important lainnya.
   ============================================================ */

/* Tombol utama: solid var(--primary), tanpa gradient/glow */
.green-gradient-btn {
  background: var(--btn-primary-bg, var(--primary, #4e7661)) !important;
  background-image: none !important;
  color: var(--btn-primary-text, #ffffff) !important;
  -webkit-text-fill-color: var(--btn-primary-text, #ffffff) !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  filter: none !important;
}
.green-gradient-btn:hover,
.green-gradient-btn:focus {
  background: var(--btn-primary-dark, var(--primary-dark, #3a5948)) !important;
  background-image: none !important;
  color: var(--btn-primary-text, #ffffff) !important;
  -webkit-text-fill-color: var(--btn-primary-text, #ffffff) !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  filter: none !important;
}

/* Footer: solid var(--primary), tanpa gradient ungu */
.footer-luxury {
  background: var(--primary, #4e7661) !important;
  background-image: none !important;
  border-top-color: var(--primary, #4e7661) !important;
}

/* Section Sale: solid var(--primary) */
.sale-home-section,
.sale-gradient-bg {
  background: var(--primary, #4e7661) !important;
  background-image: none !important;
}

/* Info card Sale: solid brand, tanpa gradient lavender */
.sale-home-info {
  background: var(--primary-dark, #3a5948) !important;
  background-image: none !important;
}

/* Shop by Skin Type - body card: solid brand, tanpa gradient lavender */
.skin-type-product-card__body {
  background: var(--primary, #4e7661) !important;
  background-image: none !important;
}

/* Avatar header: solid brand */
.profile-avatar {
  background: var(--primary, #4e7661) !important;
  background-image: none !important;
}

/* Ranking badge: solid brand, tanpa glow */
.ranking-badge {
  background: var(--primary, #4e7661) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Gold text gradient -> teks solid brand */
.gold-text {
  background: none !important;
  background-image: none !important;
  color: var(--primary-dark, #3a5948) !important;
  -webkit-text-fill-color: var(--primary-dark, #3a5948) !important;
}

/* Hero overlay: solid scrim (kontras teks aman, tanpa gradient) */
.hero-overlay {
  background: rgba(0, 0, 0, .45) !important;
  background-image: none !important;
}

/* ============================================================
   HEADER — HOMEPAGE & INNER PAGES
   Homepage: transparan saat scroll 0, putih saat scroll.
   Inner pages: selalu putih, font #2a2034, hover/active primary.
   Semua warna primary mengambil dari website settings via var(--primary).
   ============================================================ */

/* Homepage: header transparan saat belum scroll */
body.has-landing-hero:not(.admin-dashboard) .site-header:not(.is-scrolled) {
  background: transparent !important;
  background-image: none !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
}

/* Homepage: header putih solid saat scroll — override dari purple-white-theme */
body.has-landing-hero .site-header.is-scrolled {
  background: #ffffff !important;
  background-image: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Inner pages: selalu putih, font #2a2034 */
.site-header.site-header--inner-page {
  background: #ffffff !important;
  background-image: none !important;
  border-bottom: 1px solid rgba(42, 32, 52, .10) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .04) !important;
}

.site-header.site-header--inner-page .site-logo strong,
.site-header.site-header--inner-page .site-nav a,
.site-header.site-header--inner-page .site-nav-shop-trigger,
.site-header.site-header--inner-page .profile-trigger strong,
.site-header.site-header--inner-page .profile-trigger i,
.site-header.site-header--inner-page .auth-actions a,
.site-header.site-header--inner-page .circle-action {
  color: #2a2034 !important;
}

.site-header.site-header--inner-page .site-logo span {
  color: rgba(42, 32, 52, .50) !important;
}

.site-header.site-header--inner-page .site-nav a:hover,
.site-header.site-header--inner-page .site-nav a.active,
.site-header.site-header--inner-page .site-nav-shop:hover .site-nav-shop-trigger,
.site-header.site-header--inner-page .site-nav-shop.active .site-nav-shop-trigger {
  color: var(--primary, #b23c7c) !important;
}

.site-header.site-header--inner-page .site-nav a::after,
.site-header.site-header--inner-page .site-nav-shop-trigger::after,
.site-header.site-header--inner-page .site-nav a.active::after,
.site-header.site-header--inner-page .site-nav-shop.active .site-nav-shop-trigger::after {
  background: var(--primary, #b23c7c) !important;
}

.site-header.site-header--inner-page .circle-action {
  border-color: rgba(42, 32, 52, .12) !important;
  background: rgba(0, 0, 0, .04) !important;
}

.site-header.site-header--inner-page .circle-action:hover {
  background: rgba(42, 32, 52, .06) !important;
  border-color: var(--primary, #b23c7c) !important;
  color: var(--primary, #b23c7c) !important;
}

.site-header.site-header--inner-page .profile-trigger {
  background: rgba(0, 0, 0, .04) !important;
  border-color: rgba(42, 32, 52, .12) !important;
}

.site-header.site-header--inner-page .profile-avatar {
  background: rgba(42, 32, 52, .10) !important;
}

.site-header.site-header--inner-page .auth-actions a {
  border-color: var(--primary, #4e7661) !important;
}

.site-header.site-header--inner-page .auth-actions a:first-child {
  background: var(--primary, #4e7661) !important;
  border-color: var(--primary, #4e7661) !important;
  color: #ffffff !important;
}

.site-header.site-header--inner-page .auth-actions a:first-child:hover {
  background: var(--primary-dark, #3a5948) !important;
  border-color: var(--primary-dark, #3a5948) !important;
}

.site-header.site-header--inner-page .auth-actions a:last-child {
  background: transparent !important;
  border-color: var(--primary, #4e7661) !important;
  color: var(--primary, #4e7661) !important;
}

.site-header.site-header--inner-page .auth-actions a:last-child:hover {
  background: var(--primary, #4e7661) !important;
  border-color: var(--primary, #4e7661) !important;
  color: #ffffff !important;
}

.site-header.site-header--inner-page .site-logo img {
  filter: none !important;
}

/* ============================================================
   ACTIVE / HOVER NAVBAR -> WARNA BRAND PRIMARY
   Menang atas hardcode hijau (var(--primary, #4e7661)/var(--primary-dark, #3a5948)) dari file
   override lain dengan specificity lebih tinggi.
   Berlaku saat header transparan (belum scroll) maupun is-scrolled.
   ============================================================ */
body.has-landing-hero .site-header .site-nav a.active,
body.has-landing-hero .site-header .site-nav a:hover,
body.has-landing-hero .site-header .site-nav-shop.active .site-nav-shop-trigger,
body.has-landing-hero .site-header .site-nav-shop-trigger:hover,
body.has-landing-hero .site-header.is-scrolled .site-nav a.active,
body.has-landing-hero .site-header.is-scrolled .site-nav a:hover,
body.has-landing-hero .site-header.is-scrolled .site-nav-shop.active .site-nav-shop-trigger,
body.has-landing-hero .site-header.is-scrolled .site-nav-shop-trigger:hover {
  color: var(--primary, #b23c7c) !important;
}

body.has-landing-hero .site-header .site-nav a.active::after,
body.has-landing-hero .site-header .site-nav a:hover::after,
body.has-landing-hero .site-header .site-nav-shop.active .site-nav-shop-trigger::after,
body.has-landing-hero .site-header .site-nav-shop-trigger:hover::after {
  background: var(--primary, #b23c7c) !important;
}

/* Inner pages: active/hover pakai warna primary dari settings */
.site-header.site-header--inner-page .site-nav a.active,
.site-header.site-header--inner-page .site-nav a:hover,
.site-header.site-header--inner-page .site-nav-shop.active .site-nav-shop-trigger,
.site-header.site-header--inner-page .site-nav-shop-trigger:hover {
  color: var(--primary, #b23c7c) !important;
}

.site-header.site-header--inner-page .site-nav a.active::after,
.site-header.site-header--inner-page .site-nav a:hover::after,
.site-header.site-header--inner-page .site-nav-shop.active .site-nav-shop-trigger::after,
.site-header.site-header--inner-page .site-nav-shop-trigger:hover::after {
  background: var(--primary, #b23c7c) !important;
}

/* Logo footer selalu putih walau file upload berwarna */
.footer-luxury .footer-brand img {
  filter: brightness(0) invert(1) !important;
}

/* ============================================================
   COMPACT BUTTON STYLE — SEMUA TOMBOL PUBLIC WEBSITE
   font:10px, min-height:32px, padding:0 12px, radius:8px
   ============================================================ */
.green-gradient-btn,
a.green-gradient-btn,
button.green-gradient-btn,
.sale-home-see,
.catalogue-btn,
.product-add-to-bag {
  min-height: 32px !important;
  padding: 0 12px !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}