/* ============================================================================
   CambridgePortal — Design Tokens
   Single source of truth for the design system.
   Every other CSS file in the project must reference these variables and must
   never hardcode colour, spacing, font, radius, shadow, transition, or layout
   values. If a value is missing, add it here first — never inline.
   ============================================================================ */

:root {
    /* ------------------------------------------------------------------------
       Colour Tokens — Brand
       ------------------------------------------------------------------------ */
    --color-primary: #006CD8;
    --color-navy: #003F72;
    --color-gold: #F2B826;
    --color-white: #FFFFFF;

    /* ------------------------------------------------------------------------
       Colour Tokens — Client Surface (light, brand-forward)
       ------------------------------------------------------------------------ */
    --client-bg: #FFFFFF;
    --client-bg-subtle: #F4F7FC;
    --client-text-primary: #003F72;
    --client-text-secondary: #4A6380;
    --client-text-muted: #8A9BB0;
    --client-border: #D0DCF0;
    --client-input-bg: #FFFFFF;
    --client-input-focus: #006CD8;
    --client-step-inactive: #D0DCF0;
    --client-step-active: #006CD8;
    --client-step-complete: #003F72;

    /* ------------------------------------------------------------------------
       Colour Tokens — Admin Surface (dark, utilitarian)
       ------------------------------------------------------------------------ */
    --admin-bg: #0A1628;
    --admin-bg-surface: #0F2040;
    --admin-bg-elevated: #163058;
    --admin-text-primary: #E8EEF7;
    --admin-text-secondary: #8FA8C8;
    --admin-text-muted: #4A6380;
    --admin-border: #1E3A5F;
    --admin-input-bg: #0F2040;
    --admin-input-border: #1E3A5F;
    --admin-input-focus: #006CD8;

    /* ------------------------------------------------------------------------
       Colour Tokens — Semantic States (shared)
       ------------------------------------------------------------------------ */
    --color-success: #1A9E5C;
    --color-success-subtle: #E6F7EE;
    --color-warning: #F2B826;
    --color-warning-subtle: #FEF8E6;
    --color-error: #D93025;
    --color-error-subtle: #FDECEA;
    --color-info: #006CD8;
    --color-info-subtle: #E6F0FC;

    /* ------------------------------------------------------------------------
       Colour Tokens — Action Buttons (admin row actions)
       ------------------------------------------------------------------------ */
    --btn-view-color: #006CD8;
    --btn-view-border: rgba(0, 108, 216, 0.4);
    --btn-trello-color: #0079BF;
    --btn-trello-border: rgba(0, 121, 191, 0.4);
    --btn-pdf-color: #D93025;
    --btn-pdf-border: rgba(217, 48, 37, 0.4);
    --btn-pushed-color: #1A9E5C;
    --btn-pushed-border: rgba(26, 158, 92, 0.4);
    --btn-failed-color: #F2B826;
    --btn-failed-border: rgba(242, 184, 38, 0.4);

    /* ------------------------------------------------------------------------
       Typography
       ------------------------------------------------------------------------ */
    --font-heading: 'Playfair Display', Georgia, serif;
    --font-body: 'Lexend', system-ui, sans-serif;
    --font-mono: 'Courier New', monospace;

    /* Font Size Scale */
    --text-xs: 0.75rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-xl: 1.25rem;
    --text-2xl: 1.5rem;
    --text-3xl: 1.875rem;
    --text-4xl: 2.25rem;

    /* Font Weight */
    --weight-regular: 400;
    --weight-medium: 500;
    --weight-semibold: 600;
    --weight-bold: 700;

    /* Line Height */
    --leading-tight: 1.25;
    --leading-normal: 1.5;
    --leading-relaxed: 1.75;

    /* ------------------------------------------------------------------------
       Spacing Scale — never hardcode spacing values, always use these.
       ------------------------------------------------------------------------ */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-20: 5rem;

    /* ------------------------------------------------------------------------
       Border Radius
       ------------------------------------------------------------------------ */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-full: 9999px;

    /* ------------------------------------------------------------------------
       Shadows
       ------------------------------------------------------------------------ */
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.12);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.16);
    --shadow-admin-card: 0 4px 16px rgba(0, 0, 0, 0.4);

    /* ------------------------------------------------------------------------
       Transitions
       ------------------------------------------------------------------------ */
    --transition-fast: 150ms ease;
    --transition-base: 250ms ease;
    --transition-slow: 400ms ease;

    /* ------------------------------------------------------------------------
       Z-Index Scale
       ------------------------------------------------------------------------ */
    --z-base: 0;
    --z-dropdown: 100;
    --z-sticky: 200;
    --z-modal-backdrop: 300;
    --z-modal: 400;
    --z-toast: 500;

    /* ------------------------------------------------------------------------
       Layout
       ------------------------------------------------------------------------ */
    --form-max-width: 720px;
    --admin-sidebar-width: 260px;
    --container-max: 1280px;
}