/**
 * Legacy Log — ll-core.css  (v3.8.0)
 * ONE source of truth: fonts, design tokens, base typography.
 * Warm, calm SaaS. Thin lines, soft shadows, gentle glows.
 *
 * Load order (every surface):  ll-core.css → ll-ui.css → page styles
 * Legacy variable names (--ud-*, --t1, --primary-gold …) are bridged at
 * the bottom so older page styles inherit the new palette automatically.
 *
 * Digitalis Creative
 */

/* ── FONTS (self-hosted, variable) ─────────────────────────────── */
@font-face {
    font-family: 'Inter';
    src: url('../fonts/inter-var.woff2') format('woff2');
    font-weight: 100 900; font-style: normal; font-display: swap;
}
@font-face {
    font-family: 'Fraunces';
    src: url('../fonts/fraunces-var.woff2') format('woff2');
    font-weight: 100 900; font-style: normal; font-display: swap;
}
@font-face {   /* v3.8.3: one mono everywhere — code, consoles, IDs (SIL OFL 1.1) */
    font-family: 'JetBrains Mono';
    src: url('../fonts/jetbrains-mono-var.woff2') format('woff2');
    font-weight: 100 800; font-style: normal; font-display: swap;
}

/* ── TOKENS ────────────────────────────────────────────────────── */
:root {
    /* surfaces */
    --bg:        #F8F5F0;
    --surface:   #FFFFFF;
    --surface-2: #FBF9F6;
    --surface-3: #F3EFE8;

    /* lines */
    --line:      #ECE6DC;
    --line-2:    #DDD4C6;

    /* ink */
    --ink-1: #2B2622;
    --ink-2: #6E655B;
    --ink-3: #8C8276;

    /* accent — warm honey (user templates may override --accent) */
    --accent:        #B98A3E;
    --accent-strong: #A26B23;   /* button fill — 4.5:1 with white */
    --accent-ink:    #8A5A1C;   /* links / text on white — 5.9:1  */
    --accent-soft:   rgba(185,138,62,0.12);
    --accent-tint:   #FBF4E8;
    --accent-glow:   0 0 0 4px rgba(185,138,62,0.16);

    /* status */
    --success: #3E7A57;  --success-soft: rgba(62,122,87,0.10);
    --danger:  #B5483A;  --danger-soft:  rgba(181,72,58,0.09);
    --warning: #B7791F;  --warning-soft: rgba(183,121,31,0.11);
    --info:    #4A6C94;  --info-soft:    rgba(74,108,148,0.10);
    /* v3.8.13: text on a tinted status panel (readable in light and dark) */
    --success-ink: #2C5B40; --danger-ink: #8A3327; --warning-ink: #72490F; --info-ink: #2C4F77;

    /* chart palette (warm categorical — see ll-charts.js) */
    --c1: #B47A22; --c2: #3B78B8; --c3: #C4553A; --c4: #1E8A58; --c5: #A04F96; --c6: #7D7F20;  /* validated: dataviz validate_palette, light surface */

    /* type */
    --font-ui:      'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
    --font-mono:    'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;

    --fs-xs: .75rem;  --fs-sm: .875rem; --fs-md: 1rem;
    --fs-lg: 1.125rem; --fs-xl: 1.375rem; --fs-2xl: 1.75rem; --fs-3xl: 2.25rem;

    /* shape */
    --rad-sm: 6px; --rad: 10px; --rad-lg: 14px; --rad-pill: 999px;

    /* depth — layered, warm, barely-there */
    --shadow-xs: 0 1px 2px rgba(60,42,20,0.04);
    --shadow-sm: 0 1px 2px rgba(60,42,20,0.04), 0 2px 8px rgba(60,42,20,0.04);
    --shadow-md: 0 1px 2px rgba(60,42,20,0.05), 0 8px 24px rgba(60,42,20,0.07);
    --shadow-lg: 0 2px 4px rgba(60,42,20,0.05), 0 18px 48px rgba(60,42,20,0.12);

    /* layout */
    --nav-h:   60px;
    --page-max: 1320px;
    --ease: cubic-bezier(.2,.7,.2,1);

    /* text-size control (ll-a11y.js) */
    --ll-font-scale: 1;
}

/* ── BASE ──────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html {
    font-size: calc(17px * var(--ll-font-scale));
    -webkit-text-size-adjust: 100%;
    transition: font-size 180ms ease-out;
}
body {
    margin: 0;
    background: var(--bg);
    color: var(--ink-1);
    font-family: var(--font-ui);
    font-size: var(--fs-md);
    line-height: 1.6;
    font-feature-settings: 'cv11', 'ss01';
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}
img, svg, video, canvas { max-width: 100%; }
img { height: auto; }

/* ── TYPE SCALE ────────────────────────────────────────────────── */
h1, h2, h3, .h1, .h2, .h3, .display {
    font-family: var(--font-display);
    font-weight: 420;
    letter-spacing: -0.015em;
    line-height: 1.2;
    color: var(--ink-1);
    margin: 0 0 .5em;
    font-optical-sizing: auto;
}
h1, .h1 { font-size: var(--fs-3xl); font-weight: 400; }
h2, .h2 { font-size: var(--fs-2xl); }
h3, .h3 { font-size: var(--fs-xl); }
h4, h5, h6, .h4 {
    font-family: var(--font-ui);
    font-size: var(--fs-md);
    font-weight: 600;
    letter-spacing: -0.005em;
    line-height: 1.35;
    color: var(--ink-1);
    margin: 0 0 .5em;
}
p  { margin: 0 0 1em; line-height: 1.65; }
li { line-height: 1.65; }
small, .text-sm { font-size: var(--fs-sm); }
.eyebrow {                                  /* sub-header / section label */
    font-family: var(--font-ui);
    font-size: var(--fs-xs);
    font-weight: 550;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--ink-3);
}
.lead  { font-size: var(--fs-lg); color: var(--ink-2); line-height: 1.6; }
.muted { color: var(--ink-2); }
.faint { color: var(--ink-3); }
.num   { font-variant-numeric: tabular-nums; }

a { color: var(--accent-ink); text-decoration: none; transition: color 140ms ease; }
a:hover { color: var(--ink-1); }

hr { border: 0; border-top: 1px solid var(--line); margin: 1.5rem 0; }
code, kbd, pre { font-family: var(--font-mono); font-size: .9em; }

::selection { background: rgba(185,138,62,0.22); }

/* v3.8.3 type polish — balanced headings, no orphan words, thin warm scrollbars */
h1, h2, h3, .h1, .h2, .h3, .display { text-wrap: balance; }
p, li, .lead { text-wrap: pretty; }
html { scrollbar-width: thin; scrollbar-color: var(--line-2) transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: var(--line-2); border-radius: 10px; border: 3px solid transparent; background-clip: padding-box; }
::-webkit-scrollbar-thumb:hover { background-color: var(--ink-3); }
::-webkit-scrollbar-track { background: transparent; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }

@media (prefers-reduced-motion: reduce) {
    html { transition: none; }
    *, *::before, *::after { animation-duration: .001s !important; transition-duration: .001s !important; }
}

/* ── LEGACY BRIDGE ─────────────────────────────────────────────────
   Older page styles reference these names. They now resolve to the
   tokens above, so every page inherits the new palette. Remove a
   line only after no page references it. */
:root {
    /* user theme v3.4 */
    --ud-bg: var(--bg); --ud-surface: var(--surface); --ud-surface2: var(--surface-2); --ud-surface3: var(--surface-3);
    --ud-border: var(--line); --ud-border2: var(--line-2);
    --ud-text1: var(--ink-1); --ud-text2: var(--ink-2); --ud-text3: var(--ink-3);
    --ud-accent: var(--accent-ink); --ud-accent-dk: var(--accent-strong); --ud-accent-lo: var(--accent-soft); --ud-accent-med: rgba(185,138,62,0.2);
    --ud-success: var(--success); --ud-danger: var(--danger); --ud-warning: var(--warning);
    --ud-radius: var(--rad-sm); --ud-radius-lg: var(--rad);
    --ud-shadow-sm: var(--shadow-xs); --ud-shadow-md: var(--shadow-sm); --ud-shadow-lg: var(--shadow-md);
    --ud-font: var(--font-ui); --ud-font-disp: var(--font-display); --ud-trans: all .18s var(--ease);
    /* style.css v1 */
    --primary-gold: var(--accent); --primary-dark: var(--accent-strong); --primary-brown: var(--accent-ink);
    --deep-brown: var(--ink-1); --secondary-sepia: var(--ink-3); --secondary-light: var(--line-2);
    --warm-white: var(--surface-2); --warm-gray: var(--surface-3);
    --text-dark: var(--ink-1); --text-muted: var(--ink-2); --border-subtle: var(--line);
    --font-body: var(--font-ui);
    --shadow-soft: var(--shadow-sm); --shadow-medium: var(--shadow-md); --shadow-strong: var(--shadow-lg);
    --shadow-large: var(--shadow-lg); --shadow: var(--shadow-sm);
    --transition-smooth: all .25s var(--ease);
    --sage-green: var(--success); --secret-red: var(--danger);
    /* misc page-level names */
    --gold: var(--accent-ink); --gold-pale: var(--accent-tint);
    --primary: var(--accent-strong); --primary-color: var(--accent-strong);
    --secondary: var(--ink-2); --secondary-color: var(--ink-2);
    --text-primary: var(--ink-1); --text-secondary: var(--ink-2); --text-color: var(--ink-1); --text-body: var(--ink-1);
    --border: var(--line); --border-color: var(--line); --border-strong: var(--line-2);
    --bg-subtle: var(--surface-2); --section-bg: var(--surface); --container-bg: var(--surface);
    --green: var(--success);
    --t1: var(--ink-1); --t2: var(--ink-2); --t3: var(--ink-3);
    --serif: var(--font-display); --r: var(--rad-sm); --nav: rgba(255,255,255,0.88);
    --ll-gold: var(--accent); --ll-serif: var(--font-display);
    --ll-nav-h: var(--nav-h); --ll-nav-h-exp: calc(var(--nav-h) + 48px);
    --j-font: var(--font-ui);
}

/* ════════════════════════════════════════════════════════════════
   DARK MODE (v3.8.13: shared by admin + member dashboard; html.theme-dark)
   ════════════════════════════════════════════════════════════════ */
html.theme-dark {
    --bg:        #171411;
    --surface:   #211D19;
    --surface-2: #27221D;
    --surface-3: #2F2923;
    --line:      rgba(255,236,210,0.08);
    --line-2:    rgba(255,236,210,0.15);
    --ink-1: #F3ECE2;
    --ink-2: #BDB2A4;
    --ink-3: #8D8376;
    --accent:        #D3A45C;
    --accent-strong: #D3A45C;
    --accent-ink:    #E2BA7A;
    --accent-soft:   rgba(211,164,92,0.14);
    --accent-tint:   rgba(211,164,92,0.12);
    --accent-glow:   0 0 0 4px rgba(211,164,92,0.20);
    --on-accent:     #1B150E;
    --success: #5DB585; --success-soft: rgba(93,181,133,0.14);
    --danger:  #E07A6A; --danger-soft:  rgba(224,122,106,0.14);
    --warning: #E0A54A; --warning-soft: rgba(224,165,74,0.14);
    --info:    #7FA6D6; --info-soft:    rgba(127,166,214,0.14);
    --success-ink: #A9DDBF; --danger-ink: #F2B3A8; --warning-ink: #F0CC91; --info-ink: #BCD2EE;
    --shadow-xs: 0 1px 2px rgba(0,0,0,0.3);
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.3), 0 4px 14px rgba(0,0,0,0.18);
    --shadow-md: 0 2px 4px rgba(0,0,0,0.3), 0 10px 28px rgba(0,0,0,0.28);
    --shadow-lg: 0 4px 8px rgba(0,0,0,0.3), 0 20px 50px rgba(0,0,0,0.4);
    color-scheme: dark;
}
html.theme-dark .btn-primary, html.theme-dark .btn-confirm { color: var(--on-accent); }
html.theme-dark .btn-primary:hover { background: #E2BA7A; border-color: #E2BA7A; color: var(--on-accent); }
html.theme-dark :where(input, select, textarea)::placeholder { color: #7A7064; }
html.theme-dark .alert-success { background: var(--success-soft); color: #A9DDBF; border-color: rgba(93,181,133,0.25); }
html.theme-dark .alert-danger, html.theme-dark .alert-error { background: var(--danger-soft); color: #F2B3A8; border-color: rgba(224,122,106,0.25); }
html.theme-dark .alert-warning { background: var(--warning-soft); color: #F0CC91; border-color: rgba(224,165,74,0.25); }
html.theme-dark .alert-info { background: var(--info-soft); color: #BCD2EE; border-color: rgba(127,166,214,0.25); }
/* v3.8.13: shared dark refinements (were admin-only) */
html.theme-dark .btn-warning, html.theme-dark .badge-warning { color: var(--warning-ink); }
