/* ==========================================================
   MIDNIGHT STATIC — THE STUDIO
   CENTRAL DESIGN SYSTEM
   BUILD 7.2A
   ========================================================== */

:root {

    /* ======================================================
       CORE BACKGROUNDS
       ====================================================== */

    --studio-bg: #08090b;
    --studio-sidebar: #0d0f12;
    --studio-workspace: #111318;

    --studio-surface: rgba(24, 27, 32, 0.92);
    --studio-surface-secondary: rgba(30, 33, 39, 0.78);
    --studio-surface-hover: rgba(39, 42, 49, 0.90);

    --studio-panel: #191c21;
    --studio-panel-alt: #24272d;


    /* ======================================================
       TYPOGRAPHY
       ====================================================== */

    --studio-text: #f1eee7;
    --studio-text-secondary: #b5afa4;
    --studio-text-muted: #77756f;
    --studio-text-soft: #918d85;


    /* ======================================================
       ACCENT
       ====================================================== */

    --studio-accent: #c8a765;
    --studio-accent-hover: #e1c487;
    --studio-accent-soft: rgba(200, 167, 101, 0.14);


    /* ======================================================
       STATUS
       ====================================================== */

    --studio-success: #6bb28a;
    --studio-success-soft: rgba(107, 178, 138, 0.14);

    --studio-warning: #d88932;
    --studio-danger: #c96f6f;
    --studio-info: #5d91d6;


    /* ======================================================
       BORDERS
       ====================================================== */

    --studio-border: rgba(255, 255, 255, 0.08);
    --studio-border-subtle: rgba(255, 255, 255, 0.07);
    --studio-border-medium: rgba(255, 255, 255, 0.11);


    /* ======================================================
       LAYOUT
       ====================================================== */

    --studio-sidebar-width: 265px;
    --studio-topbar-height: 112px;


    /* ======================================================
       RADIUS
       ====================================================== */

    --studio-radius-xs: 4px;
    --studio-radius-sm: 8px;
    --studio-radius-md: 14px;
    --studio-radius-lg: 22px;
    --studio-radius-xl: 28px;


    /* ======================================================
       SPACING
       ====================================================== */

    --studio-space-1: 4px;
    --studio-space-2: 8px;
    --studio-space-3: 12px;
    --studio-space-4: 16px;
    --studio-space-5: 24px;
    --studio-space-6: 32px;
    --studio-space-7: 48px;


    /* ======================================================
       SHADOWS
       ====================================================== */

    --studio-shadow-sm:
        0 2px 6px rgba(0, 0, 0, 0.20);

    --studio-shadow-md:
        0 8px 20px rgba(0, 0, 0, 0.28);

    --studio-shadow-lg:
        0 24px 70px rgba(0, 0, 0, 0.35);

    --studio-panel-shadow:
        0 18px 45px rgba(0, 0, 0, 0.24);


    /* ======================================================
       TRANSITIONS
       ====================================================== */

    --studio-transition-fast: 160ms ease;
    --studio-transition-normal: 260ms ease;
    --studio-transition-slow: 350ms ease;


    /* ======================================================
       LEGACY COMPATIBILITY

       Bestaande stylesheets blijven hierdoor werken terwijl
       we ze tijdens Build 7 gecontroleerd omzetten.
       ====================================================== */

    --background-deep: var(--studio-bg);
    --background-sidebar: var(--studio-sidebar);
    --background-workspace: var(--studio-workspace);

    --surface-primary: var(--studio-surface);
    --surface-secondary: var(--studio-surface-secondary);
    --surface-hover: var(--studio-surface-hover);

    --panel-background: var(--studio-panel);

    --text-primary: var(--studio-text);
    --text-secondary: var(--studio-text-secondary);
    --text-muted: var(--studio-text-muted);

    --accent-color: var(--studio-accent);
    --accent-light: var(--studio-accent-hover);

    --accent-gold: var(--studio-accent);
    --accent-gold-bright: var(--studio-accent-hover);
    --accent-gold-soft: var(--studio-accent-soft);

    --success: var(--studio-success);
    --success-soft: var(--studio-success-soft);
    --danger: var(--studio-danger);

    --border-color: var(--studio-border);
    --border-subtle: var(--studio-border-subtle);
    --border-medium: var(--studio-border-medium);

    --sidebar-width: var(--studio-sidebar-width);
    --topbar-height: var(--studio-topbar-height);

    --radius-small: var(--studio-radius-sm);
    --radius-medium: var(--studio-radius-md);
    --radius-large: var(--studio-radius-lg);

    --shadow-large: var(--studio-shadow-lg);
    --panel-shadow: var(--studio-panel-shadow);

    --transition-fast: var(--studio-transition-fast);
    --transition-normal: var(--studio-transition-normal);
}