/* ==========================================================
   AC Floating Switchers – ABSOLUTE NUCLEAR OVERRIDE
   Dropdowns restyled to match Seed City UI (SC-PO / Herbies)
   ========================================================== */

:root{
  --acfs-size: 44px;
  --acfs-radius: 18px;
  --acfs-radius-pill: 999px;

  /* Using your actual color tokens */
  --acfs-leaf: #AFEA80;
  --acfs-forest: #1C3A2A;
  --acfs-gold: #FFD600;
  --acfs-ink: #111827;
  --acfs-card: #ffffff;
  --acfs-muted: #6B7280;

  --acfs-shadow: 0 10px 18px rgba(0,0,0,.08);
  --acfs-shadow-panel: 0 14px 26px rgba(0,0,0,.12);

  /* UNIFIED dropdown height - SAME for both */
  --acfs-dropdown-max-height: min(420px, calc(100vh - 120px));

  /* UNIFIED scrollbar width - SAME for both */
  --acfs-scrollbar-width: 24px;

  /* Dropdown row system — subtle / minimal / professional */
  --acfs-row-radius: 14px;

  /* pills: basically white with whisper of leaf */
  --acfs-row-bg: rgba(175,234,128,.02);
  --acfs-row-border: rgba(28,58,42,.09);
  --acfs-row-shadow: 0 1px 0 rgba(0,0,0,.02);

  /* Hover/Active: BRAND GOLD, fully opaque */
  --acfs-row-hover-bg: #FFF4A8;      /* gold-tinted but not nuclear */
  --acfs-row-hover-border: #FFD600; /* exact brand gold */

  --acfs-row-active-bg: #FFE56B;     /* stronger gold for active */
  --acfs-row-active-ring: 0 0 0 2px rgba(28,58,42,.08);

  /* subtle separator inside rows */
  --acfs-row-sep: rgba(28,58,42,.06);

  /* Panel border so it reads on white pages */
  --acfs-panel-border: rgba(17,24,39,.08);
}

/* ==========================================================
   FLOATING BUTTON CONTAINER
   ========================================================== */

#acfs-wrap{
  position: fixed;
  z-index: 999999;

  /* Desktop: Vertically centered, close to left edge */
  left: 20px;
  top: 50%;
  transform: translateY(-50%);

  display: flex;
  flex-direction: column;
  gap: 8px;
  touch-action: none;
  pointer-events: all;
}

#acfs-wrap.acfs-pos-manual{
  /* Position set by drag */
  transform: none; /* Remove centering transform when manually positioned */
}

#acfs-wrap.acfs-pos-right{
  left: auto;
  right: 20px;
}

#acfs-wrap .acfs-btn{
  width: var(--acfs-size);
  height: var(--acfs-size);
  border-radius: var(--acfs-radius-pill);
  background: color-mix(in srgb, var(--acfs-leaf) 14%, #fff);
  border: 1px solid color-mix(in srgb, var(--acfs-leaf) 40%, #E5E7EB);
  box-shadow: var(--acfs-shadow);
  cursor: pointer;
  color: var(--acfs-forest);
  display: grid;
  place-items: center;
  padding: 0;
  -webkit-tap-highlight-color: transparent;
  transition: all 0.15s ease;
  pointer-events: all;
}

#acfs-wrap .acfs-btn:hover{
  background: color-mix(in srgb, var(--acfs-gold) 18%, #fff);
  border-color: color-mix(in srgb, var(--acfs-gold) 45%, #E5E7EB);
  transform: translateY(-1px);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--acfs-gold) 25%, #fff);
}

#acfs-wrap .acfs-btn:active{
  transform: translateY(0);
}

#acfs-wrap .acfs-btn[data-active="false"]{
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

#acfs-wrap .acfs-flag{
  width: 20px;
  height: 20px;
  border-radius: 5px;
  box-shadow: 0 1px 2px rgba(0,0,0,.10);
  display: block;
  object-fit: cover;
  flex-shrink: 0;
}

#acfs-wrap .acfs-currency-text{
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .02em;
  line-height: 1;
  color: var(--acfs-forest);
  opacity: 0;
  transition: opacity .12s ease;
}

/* ==========================================================
   WIDGET CONTAINERS - 100% IDENTICAL FOR BOTH
   ========================================================== */

.acfs-widget-container{
  position: fixed !important;
  z-index: 999998 !important;

  /* Solid base + VISIBLE sheen + faint edge vignette */
  background:
    /* top highlight band (this is what you’ll actually see) */
    linear-gradient(to bottom, rgba(255,255,255,.95) 0%, rgba(255,255,255,0) 55%),
    /* subtle edge vignette to separate from white pages */
    radial-gradient(120% 120% at 50% 0%, rgba(0,0,0,.06) 0%, rgba(0,0,0,0) 55%),
    /* solid base */
    #ffffff !important;

  border-radius: var(--acfs-radius) !important;
  box-shadow: var(--acfs-shadow-panel) !important;
  border: 1px solid var(--acfs-panel-border) !important;
  padding: 0 !important;

  /* UNIFIED dimensions - SAME for both */
  min-width: 240px !important;
  max-width: 320px !important;
  width: auto !important;
  height: auto !important;
  max-height: var(--acfs-dropdown-max-height) !important;

  overflow: hidden !important;
  display: none;
  flex-direction: column !important;
}

/* UNIFIED scroll area - STRICTLY IDENTICAL - THIS HANDLES ALL SCROLLING */
.acfs-widget-container .acfs-scroll-area,
.acfs-lang-widget .acfs-scroll-area,
.acfs-currency-widget .acfs-scroll-area{
  overflow-y: auto !important;
  overflow-x: hidden !important;
  height: auto !important;
  max-height: var(--acfs-dropdown-max-height) !important;
  padding: 8px !important;
  box-sizing: border-box !important;

  /* Put sheen BEHIND the list too (so it’s visible) */
  background:
    linear-gradient(to bottom, rgba(255,255,255,.55), rgba(255,255,255,0) 120px),
    transparent !important;

  /* lock scroll chaining (mobile + desktop) */
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;

  /* UNIFIED custom scrollbar - SAME WIDTH for both */
  scrollbar-width: thin !important;
  scrollbar-color: color-mix(in srgb, var(--acfs-leaf) 30%, #E5E7EB) transparent !important;
}

.acfs-widget-container .acfs-scroll-area::-webkit-scrollbar,
.acfs-lang-widget .acfs-scroll-area::-webkit-scrollbar,
.acfs-currency-widget .acfs-scroll-area::-webkit-scrollbar{
  width: var(--acfs-scrollbar-width) !important;
}

.acfs-widget-container .acfs-scroll-area::-webkit-scrollbar-track,
.acfs-lang-widget .acfs-scroll-area::-webkit-scrollbar-track,
.acfs-currency-widget .acfs-scroll-area::-webkit-scrollbar-track{
  background: transparent !important;
}

.acfs-widget-container .acfs-scroll-area::-webkit-scrollbar-thumb,
.acfs-lang-widget .acfs-scroll-area::-webkit-scrollbar-thumb,
.acfs-currency-widget .acfs-scroll-area::-webkit-scrollbar-thumb{
  background: color-mix(in srgb, var(--acfs-leaf) 30%, #E5E7EB) !important;
  border-radius: 3px !important;
}

/* Hide user's existing floating widgets */
#gt-wrapper,
.gt-float-switcher,
.gtranslate_wrapper,
.gt_float_switcher,
[class*="gt-float"]:not(.acfs-widget-container):not(.acfs-widget-container *){
  display: none !important;
}

#wcuCurrencySwitcherFloating{
  position: fixed !important;
  left: -9999px !important;
  top: -9999px !important;
  opacity: 0 !important;
  pointer-events: auto !important;
  visibility: visible !important;
}

/* ==========================================================
   TYPOGRAPHY — FORCE INTER (kills GTranslate Arial properly)
   ========================================================== */

.acfs-widget-container,
.acfs-widget-container *{
  font-family: var(--bde-body-font-family, "Inter", sans-serif) !important;
}

/* Extra-nuclear: GTranslate sometimes targets this exact selector */
.gt_float_switcher{
  font-family: var(--bde-body-font-family, "Inter", sans-serif) !important;
}

/* ==========================================================
   UNIVERSAL ITEM STYLING - 100% IDENTICAL
   Seed City look: "card rows" like .sc-po-item
   ========================================================== */

/* Base styles - NUCLEAR selectors to override everything */
.acfs-widget-item,
.acfs-currency-widget .acfs-widget-item,
.acfs-lang-widget a,
.acfs-lang-widget .gt_options a,
.acfs-lang-widget .gt_languages a,
.acfs-lang-widget [class*="gt"] a{
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;

  padding: 10px 12px !important;

  /* separation via spacing (matches your card stacks) */
  margin: 0 0 7px 0 !important;

  border-radius: var(--acfs-row-radius) !important;
  border: 1px solid var(--acfs-row-border) !important;
  background: var(--acfs-row-bg) !important;

  color: var(--acfs-ink) !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  text-decoration: none !important;

  transition:
    background .15s ease,
    border-color .15s ease,
    transform .08s ease,
    box-shadow .15s ease,
    color .15s ease !important;

  cursor: pointer !important;

  /* LOCK POSITION - no shifting allowed */
  position: relative !important;
  width: 100% !important;
  left: 0 !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;

  /* subtle separator inside the row (doesn't change layout) */
  box-shadow:
    var(--acfs-row-shadow),
    inset 0 -1px 0 var(--acfs-row-sep) !important;
}

/* remove bottom margin + separator on last item in a list */
.acfs-currency-list > li:last-child .acfs-widget-item,
.acfs-lang-widget .gt_options a:last-child,
.acfs-lang-widget .gt_languages a:last-child{
  margin-bottom: 0 !important;
  box-shadow: var(--acfs-row-shadow) !important;
}

/* Hover state - BRAND GOLD, opaque */
.acfs-widget-item:hover,
.acfs-currency-widget .acfs-widget-item:hover,
.acfs-lang-widget a:hover,
.acfs-lang-widget .gt_options a:hover,
.acfs-lang-widget .gt_languages a:hover,
.acfs-lang-widget [class*="gt"] a:hover{
  background: var(--acfs-row-hover-bg) !important;
  border-color: var(--acfs-row-hover-border) !important;
  transform: translateX(1px) !important;
  left: 0 !important;
}

/* Active/Current state - BRAND GOLD, opaque */
.acfs-widget-item.acfs-current,
.acfs-widget-item.is-active,
.acfs-currency-widget .acfs-widget-item.acfs-current,
.acfs-currency-widget .acfs-widget-item.is-active,
.acfs-lang-widget a.gt_current,
.acfs-lang-widget a.gt-active,
.acfs-lang-widget a.glink.selected,
.acfs-lang-widget a[class*="current"],
.acfs-lang-widget a[class*="active"],
.acfs-lang-widget a[class*="selected"],
.acfs-lang-widget .gt_options a.gt_current,
.acfs-lang-widget .gt_options a.gt-active,
.acfs-lang-widget .gt_options a.glink.selected,
.acfs-lang-widget .gt_options a[class*="current"],
.acfs-lang-widget .gt_options a[class*="active"],
.acfs-lang-widget .gt_languages a.gt_current,
.acfs-lang-widget .gt_languages a.gt-active,
.acfs-lang-widget .gt_languages a.glink.selected,
.acfs-lang-widget .gt_languages a[class*="current"],
.acfs-lang-widget .gt_languages a[class*="active"],
.acfs-lang-widget [class*="gt"] a.gt_current,
.acfs-lang-widget [class*="gt"] a.gt-active,
.acfs-lang-widget [class*="gt"] a.glink.selected,
.acfs-lang-widget [class*="gt"] a[class*="current"],
.acfs-lang-widget [class*="gt"] a[class*="active"]{
  background: var(--acfs-row-active-bg) !important;
  border-color: #FFD600 !important; /* exact brand gold */
  color: var(--acfs-forest) !important;
  font-weight: 700 !important;

  transform: none !important;
  left: 0 !important;

  box-shadow:
    var(--acfs-row-shadow),
    var(--acfs-row-active-ring),
    inset 0 -1px 0 rgba(28,58,42,.06) !important;
}

/* Flag styling - keep it clean, stable */
.acfs-widget-item img,
.acfs-widget-item .acfs-flag,
.acfs-currency-widget img,
.acfs-currency-widget .acfs-flag,
.acfs-lang-widget img,
.acfs-lang-widget a img,
.acfs-lang-widget .gt_options img,
.acfs-lang-widget .gt_languages img,
.acfs-lang-widget [class*="gt"] img{
  width: 24px !important;
  height: 18px !important;
  border-radius: 5px !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.10) !important;
  display: block !important;
  flex-shrink: 0 !important;
  object-fit: cover !important;
  margin: 0 !important;
  padding: 0 !important;

  /* LOCK POSITION */
  position: static !important;
  transform: none !important;
  left: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;

  opacity: 1 !important;
  visibility: visible !important;
}

/* Prevent broken image icon while lazy loading */
.acfs-lang-widget img[data-gt-lazy-src]:not([src]),
.acfs-lang-widget img[data-lazy-src]:not([src]){
  background: color-mix(in srgb, var(--acfs-leaf) 8%, #E5E7EB) !important;
  min-height: 18px !important;
}

/* Currency symbol styling - accommodate longer qualified symbols */
.acfs-currency-symbol{
  min-width: 40px !important;
  height: 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-shrink: 0 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--acfs-forest) !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Text styling */
.acfs-widget-item .acfs-item-text,
.acfs-currency-widget .acfs-item-text,
.acfs-lang-widget span{
  flex: 1 !important;
  min-width: 0 !important;
  color: inherit !important;
  font-size: 14px !important;
  font-weight: inherit !important;
  line-height: 1.3 !important;
}

/* ==========================================================
   GTRANSLATE WIDGET - ABSOLUTE NUCLEAR OVERRIDE
   KILL ALL SCROLLING ON GTRANSLATE ELEMENTS
   LET PARENT .acfs-scroll-area HANDLE IT
   ========================================================== */

.acfs-lang-widget *{
  box-sizing: border-box !important;
}

/* KILL max-height and overflow on ALL GTranslate elements - parent will handle scrolling */
.acfs-lang-widget .gt_switcher,
.acfs-lang-widget .gt_options,
.acfs-lang-widget .gt_languages,
.acfs-lang-widget [class*="gt"]:not(a){
  position: static !important;
  display: block !important;
  transform: none !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  width: 100% !important;
  height: auto !important;

  /* CRITICAL: Remove ALL scrolling from GTranslate elements */
  max-height: none !important;
  overflow: hidden !important;
  overflow-y: visible !important;
  overflow-x: visible !important;

  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;

  opacity: 1 !important;
  visibility: visible !important;

  scrollbar-width: auto !important;
  scrollbar-color: auto !important;
}

/* Force all content visible but don't override link display */
.acfs-lang-widget .gt_switcher *:not(a),
.acfs-lang-widget .gt_options *:not(a),
.acfs-lang-widget .gt_languages *:not(a){
  opacity: 1 !important;
  visibility: visible !important;
}

/* Links MUST stay flex (handled by earlier rule) */
.acfs-lang-widget a,
.acfs-lang-widget .gt_options a,
.acfs-lang-widget .gt_languages a{
  opacity: 1 !important;
  visibility: visible !important;
  display: flex !important;
}

/* Remove webkit scrollbar from GTranslate elements */
.acfs-lang-widget .gt_switcher::-webkit-scrollbar,
.acfs-lang-widget .gt_options::-webkit-scrollbar,
.acfs-lang-widget .gt_languages::-webkit-scrollbar{
  display: none !important;
  width: 0 !important;
}

/* ONLY hide the trigger button/selected language - NOT the list */
.acfs-lang-widget > a:first-child:only-child,
.acfs-lang-widget .gt-current-lang:not(.gt_options *):not(.gt_languages *),
.acfs-lang-widget .gt-selected:not(.gt_options *):not(.gt_languages *){
  display: none !important;
  visibility: hidden !important;
}

/* ==========================================================
   WOOCURRENCY WIDGET - AGGRESSIVE CLEANUP
   ========================================================== */

.acfs-currency-widget *{
  box-sizing: border-box !important;
}

/* Hide visual WooCurrency elements but keep functional */
.acfs-currency-widget > .wcuCurrencySwitcher,
.acfs-currency-widget > .chosen-container,
.acfs-currency-widget > select,
.acfs-currency-widget > table,
.acfs-currency-widget .wcuCurrencySwitcher{
  position: absolute !important;
  left: -9999px !important;
  top: -9999px !important;
  opacity: 0 !important;
  pointer-events: auto !important;
  visibility: visible !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.acfs-currency-widget .wcuCurrencySwitcherButton{
  display: none !important;
}

.acfs-currency-list{
  display: block !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}

/* ==========================================================
   MOBILE RESPONSIVENESS
   ========================================================== */

@media (max-width: 767px) {
  #acfs-wrap {
    left: 10px;
    top: auto;
    bottom: 20px;
    transform: none;
  }

  :root {
    --acfs-size: 48px;
    --acfs-dropdown-max-height: min(380px, calc(100vh - 100px));
  }

  .acfs-widget-container{
    max-width: calc(100vw - 80px) !important;
  }
}

/* ==========================================================
   ACCESSIBILITY
   ========================================================== */

@media (prefers-reduced-motion: reduce) {
  #acfs-wrap .acfs-btn,
  .acfs-widget-item,
  .acfs-lang-widget a {
    transition: none !important;
  }

  #acfs-wrap .acfs-btn:hover,
  .acfs-widget-item:hover,
  .acfs-lang-widget a:hover {
    transform: none !important;
  }
}

@media (prefers-contrast: high) {
  #acfs-wrap .acfs-btn {
    border-width: 2px;
  }

  .acfs-widget-container {
    border: 2px solid var(--acfs-forest) !important;
  }
}

@media (hover: none), (pointer: coarse) {
  #acfs-wrap .acfs-btn:hover,
  .acfs-widget-item:hover,
  .acfs-lang-widget a:hover{
    transform: none !important;
  }
}


/* Reveal currency label only once we’ve set it client-side */
#acfs-wrap.acfs-currency-ready .acfs-currency-text{ opacity: 1; }
