/* =========================================================================
   EVER Wedding Collection - shared design tokens (single source of truth).
   Every surface links this file: the marketing pages AND the 14 back-office
   apps. It defines the whole EVER visual language as CSS custom properties -
   colour, a fluid type scale, spacing, radius, hairlines and shadows - plus a
   reusable section-background (texture) system. Nothing here changes layout;
   it only supplies values other stylesheets reference.

   Palette: warm ivory ground (never stark white), near-black body text with
   true black for headings and buttons, restrained dimensional champagne gold
   for the monogram, eyebrows, thin rules and small marks (never for filling
   areas, never for body text on ivory), and a soft sage as the one secondary
   accent. Fonts self-hosted at /assets/fonts.css: Bodoni Moda (display),
   Montserrat (body), Cormorant Garamond italic (taglines, sparingly).

   Load order: this file loads BEFORE the app shell bundles and before each
   marketing page's own inline CSS, so those layers can reference these tokens
   and, where they must, override them. Custom properties resolve at use time,
   so a later app*.css that re-states a token simply wins for that surface.
   ========================================================================= */
:root{
  /* -- ground and surfaces (warm ivory, never #fff) */
  --ground:#F1EEE7;          /* page ground */
  --card:#F8F6F1;            /* raised card / panel */
  --sunken:#E8E4DB;          /* recessed fill */
  --ivory:#F1EEE7;           /* named ivory (== ground) */
  --ivory-dim:rgba(241,238,231,.74);
  --dark:#0E0C0B;            /* near-black ground for .env-dark */

  /* -- ink (text) */
  --ink:#000000;             /* true black: headings, buttons */
  --text:#1A1917;            /* body copy on ivory */
  --ink-2:#2B2A27;           /* secondary text */
  --ink-3:#6F6D66;           /* tertiary / captions */
  --muted:#6B6963;           /* muted meta text */
  --ink-inv:#F1EEE7;         /* text on black / dark ground */

  /* -- lines / hairlines */
  --line:rgba(0,0,0,.12);
  --line-2:rgba(0,0,0,.07);
  --line-strong:rgba(0,0,0,.24);
  --hairline:1px solid var(--line);

  /* -- sage (the one secondary accent) */
  --sage:#80846A;
  --sage-wash:#E7E9DF;
  --sage-ink:#4F5340;

  /* -- champagne gold (accents only, never body text on ivory) */
  --gold:#C59A55;
  --gold-soft:#DAB56E;
  --gold-deep:#8F632D;
  /* dimensional foil: monogram, 2px feature edges */
  --foil:linear-gradient(110deg,#765023 0%,#A97737 18%,#E0BD78 35%,#F1DDAA 44%,#C59A55 58%,#8F632D 76%,#DAB56E 100%);
  /* deeper, text-safe gold gradient: eyebrows, thin rules, small clipped text */
  --gold-text:linear-gradient(110deg,#6E4A1F,#A97737 22%,#C59A55 42%,#B48643 58%,#8F632D 78%,#A97737);

  /* -- status (used sparingly; sage doubles as the calm "good") */
  --good:#80846A; --good-wash:#E7E9DF;
  --warn:#8F632D; --warn-wash:#F2EADB;
  --bad:#8C3A2E;  --bad-wash:#F0E4E0;

  /* -- form fields */
  --field:#F8F6F1;
  --field-line:rgba(0,0,0,.24);

  /* -- paper grain: a faint fractal-noise overlay at ~7% (felt, not seen) */
  --paper:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");

  /* -- type families (self-hosted, see /assets/fonts.css) */
  --serif:"Bodoni Moda",Didot,"Bodoni 72","Times New Roman",Georgia,serif;
  --sans:"Montserrat",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --script:"Cormorant Garamond",Georgia,"Times New Roman",serif;

  /* -- fluid type scale (clamp: min, preferred, max) */
  --fs-display:clamp(38px,6vw,60px);
  --fs-h1:clamp(30px,4.6vw,46px);
  --fs-h2:clamp(24px,3vw,32px);
  --fs-h3:clamp(19px,2vw,23px);
  --fs-eyebrow:11px;
  --fs-body:clamp(15px,1.15vw,17px);
  --fs-small:13px;
  --tracking-eyebrow:.22em;
  --tracking-caps:.16em;

  /* -- spacing scale (matches the app base scale) */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px;

  /* -- radius: deliberately restrained (no endless rounded rectangles) */
  --r-sm:2px; --r:3px; --r-lg:4px; --r-pill:2px;

  /* -- shadows: soft, used sparingly */
  --shadow-soft:0 1px 2px rgba(0,0,0,.06);
  --shadow-lift:0 6px 24px rgba(0,0,0,.08);
}

/* -------------------------------------------------------------------------
   Forced-dark defeat. A wedding site is LIGHT. Samsung Internet's forced dark
   and Chrome's auto-dark would otherwise repaint this ivory palette into a
   muddy grey. Declaring light+dark support opts out of both; the "dark theme"
   is the SAME ivory design, and form controls are pinned light so inputs stay
   legible. Any page that links this file inherits the opt-out.
   ------------------------------------------------------------------------- */
:root{color-scheme:light dark}
@media (prefers-color-scheme:dark){
  html{background:var(--ground)}
  input,select,textarea,button,iframe,video{color-scheme:light}
}

/* -------------------------------------------------------------------------
   Section-environment backgrounds. Drop one of these classes on a <section>
   (or any block) to seat it on an EVER-appropriate ground. Each layers, in
   order: the faint paper grain, an ivory (or near-black) wash that guarantees
   text contrast, then the fabric texture image UNDER them at low intensity so
   it is felt, not seen. Text colour is set explicitly so a section is always
   readable on its own.

   Only /assets/studio3d/lace.webp ships today. tex-silk / tex-veil / tex-paper
   / tex-dark do NOT exist yet: a missing CSS background-image simply does not
   paint (no broken-image icon), so each class degrades gracefully to its flat
   ivory or dark ground plus wash until the file is uploaded.
   ------------------------------------------------------------------------- */
.env-ivory{background:var(--paper),var(--ground);color:var(--text)}

/* Lace: the shipped bridal-lace tile, held back under a heavy ivory wash. */
.env-lace{
  background:
    var(--paper),
    linear-gradient(rgba(241,238,231,.90),rgba(241,238,231,.90)),
    url(/assets/studio3d/lace.webp) center top/1100px auto repeat,
    var(--ground);
  color:var(--text);
}

/* Silk: soft directional sheen. Texture pending -> flat ivory until uploaded. */
.env-silk{
  background:
    var(--paper),
    linear-gradient(rgba(241,238,231,.92),rgba(241,238,231,.92)),
    url(/assets/studio3d/tex-silk.webp) center/1200px auto no-repeat,
    var(--ground);
  color:var(--text);
}

/* Veil: airy, near-white gauze. Texture pending -> flat ivory until uploaded. */
.env-veil{
  background:
    var(--paper),
    linear-gradient(rgba(241,238,231,.92),rgba(241,238,231,.92)),
    url(/assets/studio3d/tex-veil.webp) center/1400px auto repeat,
    var(--ground);
  color:var(--text);
}

/* Paper: pressed cotton stock. Texture pending -> flat ivory until uploaded. */
.env-paper{
  background:
    var(--paper),
    linear-gradient(rgba(241,238,231,.94),rgba(241,238,231,.94)),
    url(/assets/studio3d/tex-paper.webp) center/900px auto repeat,
    var(--ground);
  color:var(--text);
}

/* Dark: near-black ground for a rare dramatic band. Texture pending -> flat
   near-black until uploaded. Text and hairlines flip to ivory for contrast. */
.env-dark{
  background:
    var(--paper),
    linear-gradient(rgba(14,12,11,.86),rgba(14,12,11,.86)),
    url(/assets/studio3d/tex-dark.webp) center/1200px auto no-repeat,
    var(--dark);
  color:var(--ink-inv);
  --line:rgba(255,255,255,.16);
  --line-2:rgba(255,255,255,.10);
}
