/**
 * TN Design Tokens — the canonical --tn-* brand palette.
 *
 * Single source of truth for the palette, enqueued site-wide by the tn-mu-assets
 * loader so it resolves on every page and can't be deactivated. Every tn-*
 * component sheet (tent-tabs, floorplan-modal, tn-bundles, tn-preorder, range
 * strips…) references these via var(--tn-*, #hexfallback); the hex fallbacks
 * stay as belt-and-braces for anywhere this file somehow doesn't reach.
 *
 * A duplicate :root block remains in tn-tent-tabs' tent-tabs.css through C1 to
 * avoid a flash during rollout; it is removed there in C2. See roadmap §6.
 */

:root {
    --tn-text:         #1f2937;
    --tn-muted:        #6b7280;
    --tn-light:        #9ca3af;
    --tn-accent:       #317397;
    --tn-accent-hover: #255d7a;
    /* Interactive-accent unification (roadmap D2): the brand teal is the single
       hover/focus accent now. This previously held a blue (#2563eb); it is kept
       as a teal alias for back-compat so any lingering var(--tn-accent-bright)
       reference resolves on-brand. Prefer --tn-accent in new code. */
    --tn-accent-bright: var(--tn-accent);
    --tn-border:       #e5e7eb;
    --tn-bg:           #FFFFFF;
    --tn-bg-muted:     #F7F9FA;
    --tn-separator:    #d1d5db;
    --tn-tooltip-bg:   #1f2937;
    --tn-tooltip-text: #FFFFFF;

    /* ── Scales (roadmap D1) ───────────────────────────────────────────────
       Added so components stop hardcoding radius / size / spacing / shadow /
       z-index. Consumers migrate onto these incrementally; nothing here changes
       rendering until a component references it. */

    /* Border radius */
    --tn-radius-xs:   4px;    /* focus rings, small chips       */
    --tn-radius-sm:   6px;    /* badges, small pills            */
    --tn-radius-md:   8px;    /* tooltips, buttons, inputs      */
    --tn-radius-lg:   20px;   /* mobile cards                   */
    --tn-radius-xl:   25px;   /* primary cards, modals, dialogs */
    --tn-radius-pill: 999px;  /* pills, dots, circular controls */

    /* Font weight */
    --tn-weight-normal:    400;
    --tn-weight-medium:    500;
    --tn-weight-semibold:  600;
    --tn-weight-bold:      700;
    --tn-weight-extrabold: 800;

    /* Font size (rem type scale) */
    --tn-size-2xs:  0.625rem; /* 10px  micro-labels        */
    --tn-size-xs:   0.75rem;  /* 12px  tooltip, captions   */
    --tn-size-sm:   0.875rem; /* 14px  body-small, buttons */
    --tn-size-base: 1rem;     /* 16px                      */
    --tn-size-md:   1.15rem;  /* ~18px card values         */
    --tn-size-lg:   1.25rem;  /* 20px  section headings    */
    --tn-size-xl:   1.5rem;   /* 24px  popup titles        */
    --tn-size-2xl:  1.75rem;  /* 28px  close ×             */

    /* Font family — the brand font is set by the theme (Poppins); tn components
       inherit it. Tokenised so the few sheets that hardcode a system-ui stack can
       point at one source. Policy: font-size in rem, line-height unitless,
       letter-spacing in em — never px. */
    --tn-font: inherit;

    /* Line height (unitless) */
    --tn-lh-tight:   1;     /* numeric stats, single-line labels */
    --tn-lh-heading: 1.2;   /* headings, titles                  */
    --tn-lh-snug:    1.4;   /* dense UI text                     */
    --tn-lh-body:    1.5;   /* paragraphs                        */

    /* Letter spacing (em, so it tracks font size) */
    --tn-ls-normal: 0;
    --tn-ls-wide:   0.05em; /* uppercase labels         */
    --tn-ls-wider:  0.1em;  /* small uppercase eyebrows */

    /* Spacing (4px base) */
    --tn-space-1:  4px;
    --tn-space-2:  6px;
    --tn-space-3:  8px;
    --tn-space-4:  10px;
    --tn-space-5:  12px;
    --tn-space-6:  16px;   /* absorbs the stray 15px      */
    --tn-space-7:  20px;
    --tn-space-8:  24px;
    --tn-space-9:  32px;   /* section rhythm              */
    --tn-space-10: 40px;
    --tn-space-12: 64px;   /* major carousel-section gap (was 100px) */

    /* Box shadow */
    --tn-shadow-card:       var(--theme-box-shadow, 0 1px 3px rgba(0, 0, 0, .08));
    --tn-shadow-card-hover: 0 12px 20px -5px rgba(0, 0, 0, .1);
    --tn-shadow-btn-hover:  0 4px 10px -2px rgba(0, 0, 0, .1);
    --tn-shadow-modal:      0 8px 32px rgba(0, 0, 0, .2);
    --tn-shadow-overlay:    0 8px 32px rgba(0, 0, 0, .4);  /* lightbox over dark scrim */
    --tn-shadow-dot-ring:   inset 0 0 0 1px rgba(0, 0, 0, .08);

    /* Z-index. Overlays sit in a high tier on purpose: they must clear app
       chrome and any third-party widgets (the existing overlays used 999999;
       the floorplan used 9998/9999). Kept high to avoid a "modal behind a
       cookie/chat widget" regression — can be lowered to a 1000-tier once the
       third-party z-index landscape is audited. */
    --tn-z-raised:           2;       /* carousel arrows, in-card controls */
    --tn-z-tooltip:          10;
    --tn-z-overlay-backdrop: 999998;
    --tn-z-overlay:          999999;  /* dialogs, lightbox, award popup    */

    /* Accent tint (consolidates rgba(49,115,151,.07–.12)) */
    --tn-accent-tint:        rgba(49, 115, 151, .08);
    --tn-accent-tint-strong: rgba(49, 115, 151, .12);

    /* Semantic feedback (currently hardcoded in tn-bundles) */
    --tn-success: #16a34a;
    --tn-error:   #dc2626;
}