/* SideEye Admin Panel — Design Tokens
   Extracted from the main app's design system */

:root {
    /* === Colors === */
    --color-black: #0a0a0a;
    --color-black-hover: #0d0d0d;
    --color-black-muted: #080808;
    --color-dark-gray: #171717;
    --color-heavy-gray: #2d2d2d;
    --color-medium-gray: #4d4d4d;
    --color-light-gray: #b0b0b0;
    --color-off-white: #ffffff;
    --color-gray: #808080;
    --color-gray-hover: #6e6e6e;
    --color-gray-muted: #5a5a5a;

    --color-black-opacity50: rgb(10 10 10 / 50%);
    --color-black-opacity40: rgb(10 10 10 / 40%);
    --color-black-opacity25: rgb(10 10 10 / 25%);
    --color-black-opacity15: rgb(10 10 10 / 15%);

    /* Primary */
    --color-primary: #f5f5f5;
    --color-primary-hover: #e0e0e0;
    --color-primary-muted: #cccccc;
    --color-primary-dark: #d9d9d9;
    --color-primary-light: #ffffff;

    /* Semantic */
    --color-success: #2ECC71;
    --color-success-hover: #27ae60;
    --color-warning: #F39C12;
    --color-warning-hover: #d68910;
    --color-danger: #ff6363;
    --color-danger-hover: #e74c3c;
    --color-info: #3498DB;
    --color-info-hover: #2980b9;

    --color-secondary: #666666;

    /* Muted backgrounds */
    --color-success-muted: #0E1E15;
    --color-warning-muted: #22190B;
    --color-danger-muted: #2c1617;
    --color-info-muted: #0B1F2A;

    /* Boost */
    --boost-primary: #6d8cff;
    --boost-gradient: linear-gradient(90deg, #6d8cff 0%, #b96bff 100%);

    /* === Backgrounds === */
    --bg-dark: var(--color-black);
    --bg-card: var(--color-dark-gray);
    --bg-card-hover: var(--color-black-opacity40);
    --bg-input: #121212;
    --bg-header: var(--color-dark-gray);

    /* === Text === */
    --text-primary: var(--color-off-white);
    --text-secondary: #cccccc;
    --text-muted: #888888;
    --text-on-primary: #ffffff;

    /* === Borders === */
    --border-color: #1f1f1f;
    --border-color-light: #2a2a2a;

    /* === Shadows === */
    --shadow-color: rgba(0, 0, 0, 0.8);
    --shadow-color-soft: rgba(0, 0, 0, 0.4);
    --color-primary-shadow: #ffffff20;
    --color-primary-glow: #ffffff40;

    /* === Border Radius === */
    --border-radius-sm: 4px;
    --border-radius-md: 8px;
    --border-radius-lg: 12px;
    --border-radius-xl: 18px;
    --border-radius-xxl: 50px;

    /* === Transitions === */
    --transition-fast: 0.15s ease;
    --transition-smooth: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-bounce: 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

    /* === Fonts === */
    --font-primary: 'Space Mono', monospace;
    --font-secondary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-tertiary: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;

    /* === Layout === */
    --sidebar-width: 260px;
    --header-height: 56px;
}