/* ============================================================
   PODHAIR DISTRIBUIDORA — CSS VARIABLES
   Design System: Apple Style
   Cores: Dourado (#D2A444), Dourado Claro (#E2C485), Grafite (#333333), Branco (#FFFFFF)
   ============================================================ */

/* ---- Google Fonts ---- */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

/* ============================================================
   MODO CLARO (Default)
   ============================================================ */
:root {
    /* --- Brand Colors --- */
    --gold-primary: #D2A444;
    --gold-light: #E2C485;
    --gold-gradient: linear-gradient(135deg, #D2A444, #E2C485);
    --gold-soft: rgba(210, 164, 68, 0.10);
    --gold-hover: #A88336;
    --graphite: #333333;
    --white: #FFFFFF;

    /* --- Backgrounds --- */
    --bg-body: #F5F5F7;
    --bg-card: #FFFFFF;
    --bg-sidebar: rgba(255, 255, 255, 0.72);
    --bg-sidebar-solid: #FFFFFF;
    --bg-input: #F5F5F7;
    --bg-hover: rgba(210, 164, 68, 0.06);
    --bg-modal-overlay: rgba(0, 0, 0, 0.4);
    --bg-table-header: #FAFAFA;
    --bg-table-hover: rgba(210, 164, 68, 0.04);
    --bg-table-stripe: rgba(0, 0, 0, 0.02);
    --bg-badge: rgba(210, 164, 68, 0.10);
    --bg-tooltip: #1D1D1F;
    --bg-dropdown: #FFFFFF;
    --bg-code: #F5F5F7;

    /* --- Text Colors --- */
    --text-primary: #1D1D1F;
    --text-secondary: #6E6E73;
    --text-tertiary: #AEAEB2;
    --text-on-gold: #FFFFFF;
    --text-link: #D2A444;

    /* --- Borders --- */
    --border-color: rgba(0, 0, 0, 0.08);
    --border-input: rgba(0, 0, 0, 0.12);
    --border-focus: #D2A444;

    /* --- Shadows --- */
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.06);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.08);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.12);
    --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.16);
    --shadow-gold: 0 4px 16px rgba(210, 164, 68, 0.30);
    --shadow-card: 0 2px 12px rgba(0, 0, 0, 0.06);

    /* --- Status Colors --- */
    --success: #34C759;
    --success-bg: rgba(52, 199, 89, 0.1);
    --warning: #FF9500;
    --warning-bg: rgba(255, 149, 0, 0.1);
    --danger: #FF3B30;
    --danger-bg: rgba(255, 59, 48, 0.1);
    --info: #007AFF;
    --info-bg: rgba(0, 122, 255, 0.1);
    --pending: #FF9500;
    --pending-bg: rgba(255, 149, 0, 0.1);

    /* --- Spacing --- */
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;
    --space-2xl: 48px;

    /* --- Border Radius (Apple Standard) --- */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 20px;
    --radius-2xl: 24px;
    --radius-full: 9999px;

    /* --- Typography --- */
    --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-size-xs: 0.6875rem;   /* 11px */
    --font-size-sm: 0.8125rem;   /* 13px */
    --font-size-base: 0.9375rem; /* 15px */
    --font-size-md: 1rem;        /* 16px */
    --font-size-lg: 1.125rem;    /* 18px */
    --font-size-xl: 1.5rem;      /* 24px */
    --font-size-2xl: 2rem;       /* 32px */
    --font-size-3xl: 2.5rem;     /* 40px */

    /* --- Transitions (Apple-style cubic bezier) --- */
    --transition-fast: all 0.15s cubic-bezier(0.25, 0.1, 0.25, 1);
    --transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
    --transition-slow: all 0.5s cubic-bezier(0.25, 0.1, 0.25, 1);
    --transition-bounce: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);

    /* --- Layout --- */
    --sidebar-width: 260px;
    --sidebar-collapsed: 72px;
    --header-height: 64px;
    --content-max-width: 1440px;

    /* --- Z-Index Scale --- */
    --z-dropdown: 100;
    --z-sidebar: 200;
    --z-header: 300;
    --z-modal-overlay: 400;
    --z-modal: 500;
    --z-toast: 600;
    --z-tooltip: 700;

    /* --- Blur --- */
    --blur-sm: blur(8px);
    --blur-md: blur(16px);
    --blur-lg: blur(24px);
    --blur-sidebar: blur(20px);
    --blur-modal: blur(20px);

    /* --- Scrollbar --- */
    --scrollbar-width: 6px;
    --scrollbar-track: transparent;
    --scrollbar-thumb: rgba(0, 0, 0, 0.15);
    --scrollbar-thumb-hover: rgba(0, 0, 0, 0.25);
}

/* ============================================================
   MODO ESCURO
   ============================================================ */
[data-theme="dark"] {
    /* --- Backgrounds --- */
    --bg-body: #0D0D0D;
    --bg-card: #1C1C1E;
    --bg-sidebar: rgba(28, 28, 30, 0.72);
    --bg-sidebar-solid: #1C1C1E;
    --bg-input: #2C2C2E;
    --bg-hover: rgba(226, 196, 133, 0.08);
    --bg-modal-overlay: rgba(0, 0, 0, 0.6);
    --bg-table-header: #2C2C2E;
    --bg-table-hover: rgba(226, 196, 133, 0.06);
    --bg-table-stripe: rgba(255, 255, 255, 0.02);
    --bg-badge: rgba(210, 164, 68, 0.15);
    --bg-tooltip: #3A3A3C;
    --bg-dropdown: #2C2C2E;
    --bg-code: #2C2C2E;

    /* --- Text Colors --- */
    --text-primary: #F5F5F7;
    --text-secondary: #98989D;
    --text-tertiary: #636366;
    --text-link: #E2C485;

    /* --- Borders --- */
    --border-color: rgba(255, 255, 255, 0.08);
    --border-input: rgba(255, 255, 255, 0.12);
    --border-focus: #E2C485;

    /* --- Shadows (darker for dark mode) --- */
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.2);
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.25);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.4);
    --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.5);
    --shadow-gold: 0 4px 16px rgba(210, 164, 68, 0.25);
    --shadow-card: 0 2px 12px rgba(0, 0, 0, 0.2);

    /* --- Scrollbar --- */
    --scrollbar-thumb: rgba(255, 255, 255, 0.15);
    --scrollbar-thumb-hover: rgba(255, 255, 255, 0.25);
}
