/* =========================================================================
   Fishkill Cannabis WP site — design tokens (Phase 2)
   Ported verbatim from the Emergent reference's compiled :root, per
   projects/fishkill/wp-site/docs/BUILD-BRIEF.md section 5.
   ========================================================================= */

:root {
  --background: 220 7% 8%;        /* ~#141517 near-black */
  --foreground: 120 9% 96%;       /* ~#F4F6F4 off-white */
  --card: 225 7% 12%;             /* ~#1C1D20 */
  --card-foreground: 120 9% 96%;
  --popover: 225 7% 12%;
  --popover-foreground: 120 9% 96%;
  --primary: 40 45% 70%;          /* ~#D8C08C gold */
  --primary-foreground: 150 28% 6%;
  --secondary: 220 5% 16%;
  --secondary-foreground: 120 9% 96%;
  --muted: 220 5% 16%;
  --muted-foreground: 105 8% 65%;
  --accent: 40 45% 70%;           /* same as primary */
  --accent-foreground: 150 28% 6%;
  --destructive: 0 62.8% 45%;
  --destructive-foreground: 0 0% 98%;
  --border: 220 6% 15%;
  --input: 220 6% 17%;
  --ring: 40 45% 70%;
  --radius: 0.75rem;

  /* Named colors used directly as hex in the reference (not HSL vars) */
  --fk-gold: #D8C08C;
  --fk-gold-light: #E6D3A3;
  --fk-gold-gradient-mid: #D8C08C;
  --fk-gold-gradient-end: #C5A059;
  --fk-bg: #141517;
  --fk-card: #1C1D20;
  --fk-border: #26272A;
  --fk-border-subtle: #33353A;
  --fk-glass-1: #26272A;
  --fk-glass-2: #1C1D20;
  --fk-glass-3: #191A1D;
  --fk-offwhite: #F4F6F4;
  --fk-sage: rgb(161 173 159);
  --fk-moss: rgb(110 122 108);

  /* Fonts */
  --fk-font-body: 'Outfit', ui-sans-serif, system-ui, sans-serif;
  --fk-font-serif: 'Cormorant Garamond', serif;
  --fk-font-display: 'Cabinet Grotesk', sans-serif;
  --fk-font-mono: 'JetBrains Mono', ui-monospace, monospace;
}

*{
  border-color: hsl(var(--border));
}

html {
  scroll-behavior: auto;
}

body{
  --tw-bg-opacity: 1;
  background-color: rgb(20 21 23 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(244 246 244 / var(--tw-text-opacity, 1));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: var(--fk-font-body);
}

::selection {
  background: #d8c08c;
  color: #141517;
}

::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: #141517;
}

/* ---------- Named utility classes ported verbatim ---------- */

.text-gold{ --tw-text-opacity: 1; color: rgb(216 192 140 / var(--tw-text-opacity, 1)); }
.bg-gold{ --tw-bg-opacity: 1; background-color: rgb(216 192 140 / var(--tw-bg-opacity, 1)); }
.bg-gold\/0{ background-color: rgb(216 192 140 / 0); }
.bg-gold\/10{ background-color: rgb(216 192 140 / 0.1); }
.bg-gold\/15{ background-color: rgb(216 192 140 / 0.15); }
.bg-gold\/70{ background-color: rgb(216 192 140 / 0.7); }
.text-sage{ --tw-text-opacity: 1; color: rgb(161 173 159 / var(--tw-text-opacity, 1)); }
.text-moss{ --tw-text-opacity: 1; color: rgb(110 122 108 / var(--tw-text-opacity, 1)); }
.hover\:text-gold:hover{ --tw-text-opacity: 1; color: rgb(216 192 140 / var(--tw-text-opacity, 1)); }
.hover\:text-gold-light:hover{ --tw-text-opacity: 1; color: rgb(230 211 163 / var(--tw-text-opacity, 1)); }
.border-\[\#26272A\]{ border-color: #26272A; }
.border-\[\#33353A\]{ border-color: #33353A; }

/* Glossy glass card surface */
.glass-card {
  border-color: rgba(255, 255, 255, 0.08);
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0) 38%),
    linear-gradient(160deg, #26272a 0%, #1c1d20 58%, #191a1d 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.09),
    inset 0 -1px 0 rgba(0, 0, 0, 0.35),
    0 28px 56px -32px rgba(0, 0, 0, 0.75);
}

/* Editorial marquee */
.marquee-track {
  display: flex;
  width: max-content;
  align-items: center;
  animation: fk-marquee 48s linear infinite;
}
.marquee-track:hover {
  animation-play-state: paused;
}
@keyframes fk-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* Outlined display text */
.text-outline-gold {
  -webkit-text-stroke: 1.5px rgba(216, 192, 140, 0.35);
  color: transparent;
}

/* Spotlight imagery treatment */
.img-spotlight {
  filter: saturate(0.85) contrast(1.06) brightness(0.92);
}

/* Slow emblem rotation */
@keyframes fk-spin {
  to { transform: rotate(360deg); }
}
.animate-slow-spin {
  animation: fk-spin 42s linear infinite;
}

/* Gold button sheen */
.btn-gold {
  background-image: linear-gradient(120deg, #e6d3a3 0%, #d8c08c 45%, #c5a059 100%);
  color: #141517;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.4),
    0 8px 24px -10px rgba(216, 192, 140, 0.35);
  transition:
    transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1),
    filter 0.35s ease;
}
.btn-gold:hover {
  filter: brightness(1.08);
  transform: translateY(-2px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.5),
    0 14px 36px -8px rgba(216, 192, 140, 0.45);
}
.btn-gold:active {
  transform: translateY(0);
}

/* Dark map treatment (used on /get-here, owned by Nikko, kept here since it's a token) */
.map-dark {
  filter: grayscale(0.35) invert(0.9) hue-rotate(180deg) contrast(0.92) brightness(0.95);
}

/* === FK-TOKENS-BUGFIX-R15 (2026-09-13, interactive-state sweep) ===========
   .btn-gold is a bare single-class utility (specificity 0,1,0). The parent
   hello-elementor theme's reset.css ships ELEMENT-level state defaults that
   outrank it:
       a:hover              { color:#336 }                        (0,1,1)
       button:hover/:focus  { background-color:#c36; color:#fff }  (0,1,1)
   Measured live on fishkillnew before this fix:
     - a.fk-header__cta.btn-gold (the desktop header "Shop Menu" CTA, present
       on EVERY page incl. the pages owned by others) computed
       color: rgb(51,51,102) -- navy -- on hover, text and arrow icon alike.
     - button.fk-gate-yes-btn.btn-gold (age gate "Yes, I am 21+") computed
       background-color: rgb(204,51,102) on hover/focus. Currently masked by
       .btn-gold's own opaque gradient, so latent rather than visible, but it
       is the same leak and costs nothing to close.
   The Emergent reference puts NO hover:text-* / hover:bg-* utility on
   .btn-gold anywhere (checked on all 11 of its .btn-gold instances): the
   dark #141517 ink and the gradient are meant to hold in every state; only
   .btn-gold's own filter/transform/box-shadow change. Re-assert ink and
   background at (0,2,0)/(0,2,1) so no element-level default can win.
   Same bug family as FK-HF-BUGFIX-R14 (mobile nav CTA). */
.btn-gold:hover,.btn-gold:focus,.btn-gold:active,.btn-gold:focus-visible,
a.btn-gold:visited{
  color:#141517;
  background-color:transparent;
}
/* R15 addendum: reset.css's button rule is written as [type="button"]:hover,
   an ATTRIBUTE selector, so it is (0,2,0) -- an exact specificity tie with
   .btn-gold:hover above, and reset.css is enqueued later, so it still won
   the background-color. Re-assert one step higher with the element qualifier. */
button.btn-gold:hover,button.btn-gold:focus,button.btn-gold:active,
button.btn-gold:focus-visible{background-color:transparent;color:#141517;}