/* ============================================================================
   ShareMoments — canonical design tokens  (FAZA R5, 2026-09-01)

   ONE place for the brand palette. New Blade <style> blocks and any CSS added
   from here on should use var(--sm-*). The existing per-layout :root blocks
   (layouts/guest, layouts/client, layouts/sharemoments/assets/global-styles,
   invitation/gallery-premium) are left untouched — this file sits alongside
   them, so there is zero regression. F2-1 (brand unification) then rewrites
   those blocks + the loose hex literals to var(--sm-*), guided by DESIGN_TOKENS.md.

   Emails can't rely on external CSS / :root — use the hex values from
   DESIGN_TOKENS.md directly (inline) there.
   ============================================================================ */

:root {
    /* — Core neutrals — */
    --sm-cream:        #FAF7F2;  /* page background */
    --sm-warm-white:   #FFFCF8;  /* card / raised surface */
    --sm-sand:         #EDE8DF;  /* borders, dividers, subtle fills */
    --sm-sand-strong:  #DDD5C8;  /* stronger border */
    --sm-taupe:        #C4B8A8;  /* muted icon / placeholder */
    --sm-brown:        #7A6652;  /* secondary text */
    --sm-dark:         #2C2420;  /* primary text / near-black */

    /* — Accent (terracotta) — */
    --sm-accent:        #B85C38;  /* canonical brand accent */
    --sm-accent-hover:  #A34E2E;  /* darker — button hover / active */
    --sm-accent-light:  #F0DDD5;  /* tint — chips, hover rows */
    --sm-accent-muted:  #E8C5B2;  /* softer tint */

    /* — Status — */
    --sm-success:       #4A7C59;
    --sm-success-light: #DDF0E4;
    --sm-warning:       #C9973A;
    --sm-warning-light: #F5EAD3;
    --sm-warning-text:  #7A5810;  /* tekst w kolorze ostrzeżenia - #C9973A jako tekst ma ~2,5:1 (audyt 2026-10-05) */
    --sm-danger:        #C0392B;  /* replaces loose red literals #DC2626/#EF4444 */
    --sm-danger-light:  #FFF0EE;
    --sm-info:          #3A6B8A;
    --sm-info-light:    #D8EAF5;

    /* — Warm grays (replace Tailwind's cool #6B7280 / #9CA3AF / #E5E7EB) — */
    --sm-gray-900: #2C2420;
    --sm-gray-700: #5A5048;
    --sm-gray-500: #8A7E72;
    --sm-gray-300: #C4B8A8;
    --sm-gray-100: #EDE8DF;

    /* — Elevation — */
    --sm-shadow-sm: 0 1px 2px rgba(44, 36, 32, 0.05);
    --sm-shadow:    0 2px 16px rgba(44, 36, 32, 0.08);
    --sm-shadow-md: 0 8px 40px rgba(44, 36, 32, 0.14);
    --sm-shadow-lg: 0 20px 60px rgba(44, 36, 32, 0.30);

    /* — Shape — */
    --sm-radius-sm: 8px;
    --sm-radius:    12px;
    --sm-radius-lg: 20px;
    --sm-radius-pill: 999px;

    /* — Type — */
    --sm-font-display: 'DM Serif Display', Georgia, 'Times New Roman', serif;
    --sm-font-body:    'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;

    /* — Type scale (Blok 0, 2026-09-11) — additive only, nothing above changes.
       Matches the sizes already in ad-hoc use across the panel (11px labels,
       13.5px table text, 24-30px headings) so adopting it in a migrated screen
       doesn't shift anything visually. --sm-text-* for body copy/UI text,
       --sm-heading-* for display-face headings. */
    --sm-text-xs:   11px;   /* eyebrow / uppercase label */
    --sm-text-sm:   12.5px; /* meta, hint, table secondary */
    --sm-text-base: 14px;   /* default UI text */
    --sm-text-md:   15.5px; /* emphasized body */
    --sm-text-lg:   18px;   /* card/section title */
    --sm-heading-sm: 20px;
    --sm-heading-md: 24px;
    --sm-heading-lg: 30px;
}
