/* ==========================================================================
   _tokens.css
   Strata Luxury design tokens — :root and .dark custom properties.
   Sourced from Strata theme.css. Alias layer maps short names to source.
   ========================================================================== */

/* Source-of-truth token definitions (long-form names from Strata @theme inline) */
:root {
    --font-size: 16px;

    /* Font Families */
    --font-family-display: 'Playfair Display', Georgia, serif;
    --font-family-sans: 'Raleway', system-ui, -apple-system, sans-serif;
    --font-family-brand: 'Cinzel', 'Times New Roman', serif;

    /* Surfaces — Light (default) */
    --background: #F5F0E8;
    --foreground: #1C1612;
    --card: #FDFAF4;
    --card-foreground: #1C1612;
    --popover: #FDFAF4;
    --popover-foreground: #1C1612;

    /* Primary — Obsidian */
    --primary: #1C1612;
    --primary-foreground: #F5F0E8;

    /* Secondary — Parchment */
    --secondary: #EDE4D0;
    --secondary-foreground: #3D3020;

    /* Muted — Bone */
    --muted: #DDD4BC;
    --muted-foreground: #7A6A52;

    /* Accent — warm parchment (hover tint via bg-accent) */
    --accent: #EDE4D0;
    --accent-foreground: #3D3020;
    --hover-bg: rgba(28, 22, 18, 0.04);
    --hover-text: #8B6220;

    /* Semantic */
    --destructive: #8B2F2F;
    --destructive-foreground: #F5F0E8;
    --border: rgba(28, 22, 18, 0.1);
    --input: rgba(28, 22, 18, 0.1);
    --input-background: #FDFAF4;
    --switch-background: #C4B49C;
    --font-weight-medium: 500;
    --font-weight-normal: 400;
    --ring: #B8893A;

    /* Extended Palette — Fossil Amber Gold */
    --gold-pale: #F0DBA8;
    --gold-light: #D4A85C;
    --gold: #B8893A;
    --gold-dark: #8B6220;
    --stone-light: #C4B49C;
    --stone: #A89880;
    --sand: #7A6A52;
    --walnut: #3D3020;
    --obsidian: #1C1612;
    --bone: #DDD4BC;
    --parchment: #EDE4D0;
    --ivory: #F5F0E8;

    /* Charts */
    --chart-1: #B8893A;
    --chart-2: #7A6A52;
    --chart-3: #3D3020;
    --chart-4: #C4B49C;
    --chart-5: #D4A85C;

    /* Radius — tiered system */
    --radius: 0.75rem;
    --radius-sm: calc(var(--radius) - 2px);
    --radius-md: var(--radius);
    --radius-lg: calc(var(--radius) + 4px);
    --radius-xl: calc(var(--radius) + 8px);
    --radius-full: 9999px;

    /* Motion tokens — luxury timing curves */
    --ease-out-expo: cubic-bezier(0.16, 1, 0.5, 1);
    --ease-out-quart: cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --ease-in-out-smooth: cubic-bezier(0.45, 0, 0.2, 1);
    --ease-enter-premium: cubic-bezier(0, 0, 0.2, 1);
    --ease-exit-gentle: cubic-bezier(0.4, 0, 1, 1);
    --ease-spring-soft: cubic-bezier(0.34, 1.3, 0.64, 1);
    --motion-duration-fast: 0.15s;
    --motion-duration-normal: 0.3s;
    --motion-duration-slow: 0.6s;
    --motion-duration-ambient: 1.2s;

    /* Sidebar tokens (for future use) */
    --sidebar: #1C1612;
    --sidebar-foreground: #F5F0E8;
    --sidebar-primary: #B8893A;
    --sidebar-primary-foreground: #1C1612;
    --sidebar-accent: #2A2218;
    --sidebar-accent-foreground: #EDE4D0;
    --sidebar-border: rgba(245, 240, 232, 0.08);
    --sidebar-ring: #B8893A;

    /* Theme-layer aliases (short names used by existing theme CSS) */
    --color-bg: var(--background);
    --color-surface: var(--card);
    --color-surface-2: var(--secondary);
    --color-border-2: rgba(28, 22, 18, 0.2);
    --color-text: var(--foreground);
    --color-text-muted: var(--muted-foreground);
    --color-text-inverse: var(--primary-foreground);
    --color-link: var(--gold);
    --color-link-hover: var(--gold-dark);
    --color-error: var(--destructive);
    --color-accent: var(--gold);
    --color-accent-soft: var(--gold-light);
    --font-sans: var(--font-family-sans);
    --font-serif: var(--font-family-display);
    --font-mono: ui-monospace, 'SF Mono', 'Fira Code', 'Fira Mono', monospace;

    /* Type scale */
    --text-xs: 0.75rem;
    --text-sm: 0.8125rem;
    --text-base: 0.875rem;
    --text-md: 1rem;
    --text-lg: 1.125rem;
    --text-xl: 1.25rem;
    --text-2xl: 1.5rem;
    --text-hero: 2.25rem;

    /* Spacing scale */
    --sp-1: 0.25rem;
    --sp-2: 0.5rem;
    --sp-3: 0.75rem;
    --sp-4: 1rem;
    --sp-5: 1.25rem;
    --sp-6: 1.5rem;
    --sp-7: 1.75rem;
    --sp-8: 2rem;
    --sp-9: 2.5rem;

    /* Layout */
    --max-w: 80rem;
    --gutter: var(--sp-4);
    --header-h: 5rem;
    --nav-h: 4rem;

    /* Shadows */
    --shadow-sm: 0 1px 2px rgba(28, 22, 18, 0.06);
    --shadow-md: 0 4px 16px rgba(28, 22, 18, 0.08);
    --shadow-lg: 0 12px 40px rgba(28, 22, 18, 0.15);
    --shadow-xs: 0 1px 1px rgba(28, 22, 18, 0.04);
    --shadow-hover: 0 8px 24px rgba(28, 22, 18, 0.12);
    --shadow-featured: 0 20px 60px rgba(28, 22, 18, 0.18);
}

/* Dark theme — inherits .dark class on <body> */
.dark {
    --background: #0F0D0A;
    --foreground: #F0EAD8;
    --card: #1A1712;
    --card-foreground: #F0EAD8;
    --popover: #1A1712;
    --popover-foreground: #F0EAD8;
    --primary: #F0EAD8;
    --primary-foreground: #0F0D0A;
    --secondary: #2A2218;
    --secondary-foreground: #D4C9B0;
    --muted: #2A2218;
    --muted-foreground: #A89880;
    --accent: #2A2218;
    --accent-foreground: #D4C9B0;
    --hover-bg: rgba(240, 234, 216, 0.06);
    --hover-text: #D4A85C;
    --destructive: #7D2E2E;
    --destructive-foreground: #F0EAD8;
    --border: rgba(240, 234, 216, 0.1);
    --input: rgba(240, 234, 216, 0.12);
    --input-background: #1A1712;
    --switch-background: #4A3D2E;
    --ring: #C4963A;
    --gold: #C4963A;
    --gold-pale: rgba(196, 150, 58, 0.12);
    --gold-light: #D4A85C;
    --gold-dark: #8B6220;
    --stone: #A89880;
    --stone-light: #C4B49C;
    --sand: #A89880;
    --walnut: #3D3020;
    --obsidian: #0F0D0A;
    --bone: #DDD4BC;
    --parchment: #2A2218;
    --ivory: #F0EAD8;
    --chart-1: #C4963A;
    --chart-2: #A89880;
    --chart-3: #D4C9B0;
    --chart-4: #2A2218;
    --chart-5: #4A3D2E;
    --sidebar: #0A0806;
    --sidebar-foreground: #F0EAD8;
    --sidebar-primary: #C4963A;
    --sidebar-primary-foreground: #0A0806;
    --sidebar-accent: #1A1712;
    --sidebar-accent-foreground: #D4C9B0;
    --sidebar-border: rgba(240, 234, 216, 0.06);
    --sidebar-ring: #C4963A;

    --color-bg: var(--background);
    --color-surface: var(--card);
    --color-surface-2: var(--secondary);
    --color-border-2: rgba(240, 234, 216, 0.15);
    --color-text: var(--foreground);
    --color-text-muted: var(--muted-foreground);
    --color-text-inverse: var(--primary-foreground);
    --color-link: var(--gold);
    --color-link-hover: var(--gold-light);
    --color-error: var(--destructive);
    --color-accent: var(--gold);
    --color-accent-soft: var(--gold-light);
}
