/* ==========================================================================
   DESIGN TOKENS — Shastra IT Services Master Design System
   Three-layer architecture: primitive -> semantic -> component
   Style: "Trust & Authority" (marketing) + "Data-Dense Dashboard" (admin)
   ========================================================================== */

:root {
  /* ---------- Primitive: color ---------- */
  --p-navy-950: #020617;
  --p-navy-900: #0F172A;
  --p-navy-700: #334155;
  --p-navy-500: #64748B;
  --p-slate-200: #E2E8F0;
  --p-slate-100: #F1F5FD;
  --p-slate-50:  #F8FAFC;
  --p-white:     #FFFFFF;
  --p-blue-700:  #0369A1;
  --p-blue-600:  #2563EB;
  --p-blue-500:  #3B82F6;
  --p-green-600: #059669;
  --p-green-100: #D1FAE5;
  --p-amber-600: #D97706;
  --p-amber-100: #FEF3C7;
  --p-red-600:   #DC2626;
  --p-red-100:   #FEE2E2;
  --p-gray-500:  #6B7280;

  /* ---------- Primitive: type ---------- */
  --p-font-heading: 'Lexend', 'Segoe UI', Arial, sans-serif;
  --p-font-body: 'Source Sans 3', 'Segoe UI', Arial, sans-serif;

  /* ---------- Primitive: scale (4/8px rhythm) ---------- */
  --p-space-1: 4px;   --p-space-2: 8px;   --p-space-3: 12px;  --p-space-4: 16px;
  --p-space-5: 20px;  --p-space-6: 24px;  --p-space-8: 32px;  --p-space-10: 40px;
  --p-space-12: 48px; --p-space-16: 64px; --p-space-20: 80px; --p-space-24: 96px;

  --p-radius-sm: 6px;
  --p-radius-md: 10px;
  --p-radius-lg: 16px;
  --p-radius-xl: 24px;
  --p-radius-full: 999px;

  --p-shadow-sm: 0 1px 2px rgba(15,23,42,.06);
  --p-shadow-md: 0 4px 16px rgba(15,23,42,.08);
  --p-shadow-lg: 0 16px 40px rgba(15,23,42,.14);

  --p-duration-fast: 150ms;
  --p-duration-base: 220ms;
  --p-duration-slow: 320ms;
  --p-ease: cubic-bezier(.4,0,.2,1);

  /* ---------- Semantic ---------- */
  --color-primary: var(--p-navy-900);
  --color-primary-foreground: var(--p-white);
  --color-secondary: var(--p-navy-700);
  --color-accent: var(--p-blue-700);
  --color-accent-hover: #025680;
  --color-success: var(--p-green-600);
  --color-success-bg: var(--p-green-100);
  --color-warning: var(--p-amber-600);
  --color-warning-bg: var(--p-amber-100);
  --color-destructive: var(--p-red-600);
  --color-destructive-bg: var(--p-red-100);

  --color-background: var(--p-slate-50);
  --color-surface: var(--p-white);
  --color-foreground: var(--p-navy-950);
  --color-muted: var(--p-slate-100);
  --color-muted-foreground: var(--p-gray-500);
  --color-border: var(--p-slate-200);
  --color-ring: var(--p-blue-700);

  --font-heading: var(--p-font-heading);
  --font-body: var(--p-font-body);

  --radius-sm: var(--p-radius-sm);
  --radius: var(--p-radius-md);
  --radius-lg: var(--p-radius-lg);
  --radius-xl: var(--p-radius-xl);
  --radius-full: var(--p-radius-full);

  --shadow-sm: var(--p-shadow-sm);
  --shadow-md: var(--p-shadow-md);
  --shadow-lg: var(--p-shadow-lg);

  --duration-fast: var(--p-duration-fast);
  --duration-base: var(--p-duration-base);
  --ease: var(--p-ease);

  /* ---------- Bootstrap variable remap (component layer) ---------- */
  --bs-primary: var(--color-accent);
  --bs-primary-rgb: 3, 105, 161;
  --bs-success: var(--color-success);
  --bs-success-rgb: 5, 150, 105;
  --bs-warning: var(--color-warning);
  --bs-warning-rgb: 217, 119, 6;
  --bs-danger: var(--color-destructive);
  --bs-danger-rgb: 220, 38, 38;
  --bs-body-color: var(--color-foreground);
  --bs-body-bg: var(--color-background);
  --bs-border-color: var(--color-border);
  --bs-border-radius: var(--radius);
  --bs-link-color: var(--color-accent);
  --bs-link-hover-color: var(--color-accent-hover);
  --bs-font-sans-serif: var(--font-body);
}

/* Admin/dashboard surfaces opt into the denser, data-forward accent
   (component-level override, same primitive palette). */
[data-surface="admin"] {
  --color-accent: var(--p-blue-600);
  --color-accent-hover: #1D4ED8;
  --bs-primary: var(--color-accent);
  --bs-primary-rgb: 37, 99, 235;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}