/* ============================================================
   DESIGN TOKENS — Baseado no sistema visual base-css
   Paleta bronze (#D4A27F), dark-first, glassmorphism
   ============================================================ */

/* === TEMA DARK (padrão) === */
:root {
    color-scheme: dark;

    /* Brand Colors */
    --primary: #D4A27F;
    --primary-hover: #C08E6A;
    --primary-active: #A87858;
    --primary-glow: rgba(212, 162, 127, 0.25);
    --primary-glow-strong: rgba(212, 162, 127, 0.35);
    --primary-container: rgba(212, 162, 127, 0.08);
    --primary-container-strong: rgba(212, 162, 127, 0.14);
    --on-primary: #09090B;

    /* Background Colors */
    --bg: #09090B;
    --bg-surface: #111113;
    --bg-surface-2: #1A1A1D;
    --bg-surface-3: #2A2A2E;
    --bg-hover: rgba(212, 162, 127, 0.04);
    --bg-glass: rgba(9, 9, 11, 0.88);
    --bg-glass-solid: rgba(9, 9, 11, 0.92);

    /* Text Colors */
    --text: #FDFDF7;
    --text-secondary: #9E9E9E;
    --text-muted: #5E5E5E;

    /* Border Colors */
    --border: rgba(255, 255, 255, 0.06);
    --border-strong: rgba(255, 255, 255, 0.12);
    --border-glow: rgba(212, 162, 127, 0.35);

    /* Accent Colors */
    --accent-warm: #E8A87C;
    --accent-rose: #C9897D;
    --accent-green: #8BBF7A;
    --accent-green-bg: rgba(139, 191, 122, 0.07);

    /* Shadows */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.4);
    --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.5);
    --shadow-glow: 0 0 40px rgba(212, 162, 127, 0.08);

    /* Border Radius */
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;
    --radius-xl: 20px;
    --radius-full: 50px;

    /* Typography */
    --font-primary: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-display: 'Geist', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-mono: 'Geist Mono', 'Fira Code', monospace;

    /* Fluid Font Sizes */
    --font-size-display: clamp(2rem, 1.54rem + 1.96vw, 3.5rem);
    --font-size-h2: clamp(1.5rem, 1.32rem + 0.73vw, 2rem);
    --font-size-h3: clamp(1.25rem, 1.17rem + 0.33vw, 1.5rem);
    --font-size-body: clamp(1rem, 0.96rem + 0.16vw, 1.125rem);
    --font-size-small: clamp(0.875rem, 0.85rem + 0.11vw, 0.9375rem);
    --font-size-caption: clamp(0.6875rem, 0.67rem + 0.08vw, 0.75rem);

    /* Spacing Scale */
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;
    --space-2xl: 48px;
    --space-3xl: 64px;
    --space-4xl: 96px;
    --space-5xl: 128px;

    /* Semantic Colors */
    --success: #8BBF7A;
    --success-dark: #6a9e5c;
    --success-light: #1a2e15;
    --error: #e87070;
    --error-dark: #c55050;
    --error-light: #2e1515;
    --warning: #D4A27F;
    --warning-light: #2e2218;
    --info: #70a5e8;
    --info-dark: #5085c8;
    --info-light: #151e2e;

    /* Delivery-Specific */
    --whatsapp: #25D366;
    --whatsapp-dark: #1DA851;
    --star: #FFB800;
    --status-open: #16A34A;
    --status-closed: #6b7280;
    --danger: #dc2626;
    --danger-light: #2e1515;

    /* Transitions */
    --transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-fast: all 0.15s ease;
    --transition-slow: all 0.4s ease;
    --transition-menu: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s ease, visibility 0.3s ease;

    /* Animation */
    --bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
    --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);

    /* Z-Index Scale */
    --z-base: 1;
    --z-dropdown: 100;
    --z-sticky: 200;
    --z-modal-backdrop: 900;
    --z-modal: 1000;
    --z-toast: 1100;

    /* Navbar */
    --nav-h: 64px;

    /* Selection */
    --selection-bg: rgba(212, 162, 127, 0.35);
    --selection-color: var(--bg);

    /* Scrollbar */
    --scrollbar-thumb: var(--bg-surface-3);
    --scrollbar-track: transparent;

    /* Aliases de compatibilidade (tokens antigos) */
    --primary-dark: var(--primary-hover);
    --primary-light: var(--primary-active);
    --primary-subtle: var(--primary-container-strong);
    --secondary: #9E9E9E;
    --secondary-dark: #707070;
    --secondary-light: #BEBEBE;
    --white: var(--text);
    --black: var(--text);
    --light: var(--bg-surface-2);
    --lighter: var(--bg-surface);
    --dark: var(--text-secondary);
    --darker: var(--text-muted);
    --text-primary: var(--text);
    --text-inverse: var(--bg);
    --border-subtle: var(--border);
    --border-medium: var(--border-strong);
    --surface-elevated: var(--bg-surface);
    --surface-sunken: var(--bg-surface-2);
    --accent: var(--accent-warm);
    --accent-light: var(--primary-container);
    --card-hover-scale: 1.02;
}