/* ==========================================================================
   Camp Admin — Design Tokens
   CSS Custom Properties (variables) for the entire design system.
   ========================================================================== */

:root {
    /* ── Primary (Indigo) ─────────────────────────────────────────────── */
    --ca-primary-50:  #EEF2FF;
    --ca-primary-100: #E0E7FF;
    --ca-primary-200: #C7D2FE;
    --ca-primary-300: #A5B4FC;
    --ca-primary-400: #818CF8;
    --ca-primary-500: #6366F1;
    --ca-primary-600: #4F46E5;
    --ca-primary-700: #4338CA;
    --ca-primary-800: #3730A3;
    --ca-primary-900: #312E81;
    --ca-primary-950: #1E1B4B;

    /* ── Success (Emerald) ────────────────────────────────────────────── */
    --ca-success-50:  #ECFDF5;
    --ca-success-100: #D1FAE5;
    --ca-success-200: #A7F3D0;
    --ca-success-300: #6EE7B7;
    --ca-success-400: #34D399;
    --ca-success-500: #10B981;
    --ca-success-600: #059669;
    --ca-success-700: #047857;

    /* ── Warning (Amber) ──────────────────────────────────────────────── */
    --ca-warning-50:  #FFFBEB;
    --ca-warning-100: #FEF3C7;
    --ca-warning-200: #FDE68A;
    --ca-warning-300: #FCD34D;
    --ca-warning-400: #FBBF24;
    --ca-warning-500: #F59E0B;
    --ca-warning-600: #D97706;
    --ca-warning-700: #B45309;

    /* ── Danger (Rose) ────────────────────────────────────────────────── */
    --ca-danger-50:  #FFF1F2;
    --ca-danger-100: #FFE4E6;
    --ca-danger-200: #FECDD3;
    --ca-danger-300: #FDA4AF;
    --ca-danger-400: #FB7185;
    --ca-danger-500: #F43F5E;
    --ca-danger-600: #E11D48;
    --ca-danger-700: #BE123C;

    /* ── Info (Sky) ───────────────────────────────────────────────────── */
    --ca-info-50:  #F0F9FF;
    --ca-info-100: #E0F2FE;
    --ca-info-200: #BAE6FD;
    --ca-info-300: #7DD3FC;
    --ca-info-400: #38BDF8;
    --ca-info-500: #0EA5E9;
    --ca-info-600: #0284C7;
    --ca-info-700: #0369A1;

    /* ── Neutral (Warm Gray) ──────────────────────────────────────────── */
    --ca-neutral-0:   #FFFFFF;
    --ca-neutral-25:  #FCFCFD;
    --ca-neutral-50:  #F9FAFB;
    --ca-neutral-100: #F3F4F6;
    --ca-neutral-200: #E5E7EB;
    --ca-neutral-300: #D1D5DB;
    --ca-neutral-400: #9CA3AF;
    --ca-neutral-500: #6B7280;
    --ca-neutral-600: #4B5563;
    --ca-neutral-700: #374151;
    --ca-neutral-800: #1F2937;
    --ca-neutral-900: #111827;
    --ca-neutral-950: #030712;

    /* ── Typography ───────────────────────────────────────────────────── */
    --ca-font-family:      'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --ca-font-mono:        'JetBrains Mono', 'Fira Code', 'Consolas', monospace;

    /* Major Third scale (1.250) */
    --ca-text-xs:    0.75rem;    /* 12px */
    --ca-text-sm:    0.875rem;   /* 14px */
    --ca-text-base:  1rem;       /* 16px */
    --ca-text-md:    1.125rem;   /* 18px */
    --ca-text-lg:    1.25rem;    /* 20px */
    --ca-text-xl:    1.5rem;     /* 24px */
    --ca-text-2xl:   1.875rem;   /* 30px */
    --ca-text-3xl:   2.25rem;    /* 36px */

    --ca-leading-tight:  1.25;
    --ca-leading-normal: 1.5;
    --ca-leading-relaxed: 1.625;

    --ca-tracking-tight:  -0.025em;
    --ca-tracking-normal:  0;
    --ca-tracking-wide:    0.025em;
    --ca-tracking-wider:   0.05em;
    --ca-tracking-widest:  0.1em;

    /* ── Spacing (4px base) ───────────────────────────────────────────── */
    --ca-space-0:   0;
    --ca-space-1:   0.25rem;   /* 4px  */
    --ca-space-2:   0.5rem;    /* 8px  */
    --ca-space-3:   0.75rem;   /* 12px */
    --ca-space-4:   1rem;      /* 16px */
    --ca-space-5:   1.25rem;   /* 20px */
    --ca-space-6:   1.5rem;    /* 24px */
    --ca-space-8:   2rem;      /* 32px */
    --ca-space-10:  2.5rem;    /* 40px */
    --ca-space-12:  3rem;      /* 48px */
    --ca-space-16:  4rem;      /* 64px */
    --ca-space-20:  5rem;      /* 80px */
    --ca-space-24:  6rem;      /* 96px */

    /* ── Border Radius ────────────────────────────────────────────────── */
    --ca-radius-sm:   6px;
    --ca-radius-md:   8px;
    --ca-radius-lg:   12px;
    --ca-radius-xl:   16px;
    --ca-radius-2xl:  24px;
    --ca-radius-full: 9999px;

    /* ── Shadows ──────────────────────────────────────────────────────── */
    --ca-shadow-xs:  0 1px 2px 0 rgb(0 0 0 / 0.05);
    --ca-shadow-sm:  0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --ca-shadow-md:  0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --ca-shadow-lg:  0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --ca-shadow-xl:  0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --ca-shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);

    /* Colored shadows (for primary buttons, cards) */
    --ca-shadow-primary-sm: 0 1px 3px 0 rgb(99 102 241 / 0.2), 0 1px 2px -1px rgb(99 102 241 / 0.2);
    --ca-shadow-primary-md: 0 4px 6px -1px rgb(99 102 241 / 0.2), 0 2px 4px -2px rgb(99 102 241 / 0.15);
    --ca-shadow-primary-lg: 0 10px 15px -3px rgb(99 102 241 / 0.2), 0 4px 6px -4px rgb(99 102 241 / 0.15);

    --ca-shadow-danger-sm: 0 1px 3px 0 rgb(244 63 94 / 0.2), 0 1px 2px -1px rgb(244 63 94 / 0.2);

    /* ── Transitions ──────────────────────────────────────────────────── */
    --ca-duration-fast:    150ms;
    --ca-duration-normal:  200ms;
    --ca-duration-slow:    300ms;
    --ca-duration-spring:  500ms;
    --ca-ease-default:     cubic-bezier(0.4, 0, 0.2, 1);
    --ca-ease-in:          cubic-bezier(0.4, 0, 1, 1);
    --ca-ease-out:         cubic-bezier(0, 0, 0.2, 1);
    --ca-ease-spring:      cubic-bezier(0.34, 1.56, 0.64, 1);

    /* ── Z-Index Scale ────────────────────────────────────────────────── */
    --ca-z-dropdown:  1000;
    --ca-z-sticky:    1020;
    --ca-z-fixed:     1030;
    --ca-z-backdrop:  1040;
    --ca-z-modal:     1050;
    --ca-z-popover:   1060;
    --ca-z-tooltip:   1070;
    --ca-z-toast:     1080;

    /* ── Layout ───────────────────────────────────────────────────────── */
    --ca-navbar-height:    64px;
    --ca-sidebar-width:    280px;
    --ca-container-max:    1280px;

    /* ── Bootstrap Overrides ──────────────────────────────────────────── */
    --bs-primary:          #6366F1;
    --bs-primary-rgb:      99, 102, 241;
    --bs-secondary:        #4B5563;
    --bs-secondary-rgb:    75, 85, 99;
    --bs-success:          #10B981;
    --bs-success-rgb:      16, 185, 129;
    --bs-info:             #0EA5E9;
    --bs-info-rgb:         14, 165, 233;
    --bs-warning:          #F59E0B;
    --bs-warning-rgb:      245, 158, 11;
    --bs-danger:           #F43F5E;
    --bs-danger-rgb:       244, 63, 94;
    --bs-light:            #F9FAFB;
    --bs-light-rgb:        249, 250, 251;
    --bs-dark:             #111827;
    --bs-dark-rgb:         17, 24, 39;
    --bs-body-font-family: var(--ca-font-family);
    --bs-body-font-size:   var(--ca-text-base);
    --bs-body-color:       var(--ca-neutral-800);
    --bs-body-bg:          var(--ca-neutral-50);
    --bs-border-color:     var(--ca-neutral-200);
    --bs-border-radius:    var(--ca-radius-md);
    --bs-border-radius-sm: var(--ca-radius-sm);
    --bs-border-radius-lg: var(--ca-radius-lg);
    --bs-link-color:       var(--ca-primary-600);
    --bs-link-hover-color: var(--ca-primary-700);
}