/* =====================================================================
   Nirvaan Design System — Design Tokens
   Single source of truth for color, spacing, radius, shadow, type, motion.
   Consumed by ds-theme.css, ds-components.css, ds-login.css, ds-pages.css.
   Never put hardcoded hex in component files — always use these vars.
   ===================================================================== */

:root {
  /* ---- Brand + "aurora" signature ---- */
  --c-primary:            #4f6ef7;
  --c-primary-rgb:        79, 110, 247;
  --c-primary-hover:      #4460e8;
  --c-primary-active:     #3a55d9;
  --c-primary-soft:       #ecefff;
  --c-primary-contrast:   #ffffff;

  --c-accent:             #8b7cf6;
  --c-accent-rgb:         139, 124, 246;
  --c-accent-hover:       #7d6df2;
  --c-accent-soft:        #f1eefe;
  --c-accent-contrast:    #ffffff;

  --aurora:      linear-gradient(100deg, #4f6ef7 0%, #7d6ef7 55%, #8b7cf6 100%);
  --aurora-soft: linear-gradient(100deg, rgba(79,110,247,.14), rgba(139,124,246,.14));
  --aurora-glow: 0 8px 22px -6px rgba(79, 110, 247, 0.45);

  /* ---- Semantic ---- */
  --c-success:  #16b981; --c-success-rgb: 22, 185, 129;  --c-success-soft: #e3f7ef;
  --c-warning:  #f5a524; --c-warning-rgb: 245, 165, 36;  --c-warning-soft: #fef3e2;
  --c-danger:   #f04438; --c-danger-rgb:  240, 68, 56;   --c-danger-soft:  #fde7e6;
  --c-info:     #12b5cb; --c-info-rgb:    18, 181, 203;   --c-info-soft:    #e1f6f9;

  /* ---- Neutral surfaces / borders / text (light content) ---- */
  --c-bg:                 #f4f7fc;
  --c-surface:            #ffffff;
  --c-surface-2:          #f7f9fd;
  --c-surface-3:          #eef2f9;
  --c-border:             #e6eaf2;
  --c-border-strong:      #d3d9e6;
  --c-text:               #1a2233;
  --c-text-muted:         #667085;
  --c-text-subtle:        #98a2b3;
  --c-text-invert:        #ffffff;

  /* ---- Sidebar = dark "chrome" in EVERY theme ---- */
  --c-sidebar-bg:         #131a2c;
  --c-sidebar-bg-2:       #0e1422;
  --c-sidebar-border:     rgba(255, 255, 255, 0.07);
  --c-sidebar-text:       rgba(233, 238, 248, 0.66);
  --c-sidebar-text-hover: #ffffff;
  --c-sidebar-muted:      rgba(233, 238, 248, 0.40);
  --c-sidebar-hover-bg:   rgba(255, 255, 255, 0.06);
  --c-sidebar-active-txt: #ffffff;

  /* ---- Header ---- */
  --c-header-bg:          rgba(255, 255, 255, 0.80);
  --c-header-border:      #e6eaf2;

  /* ---- Focus ring ---- */
  --c-focus:              rgba(79, 110, 247, 0.35);
  --focus-ring:           0 0 0 3px var(--c-focus);

  /* ---- Spacing (8px rhythm) ---- */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 20px;  --sp-6: 24px;  --sp-8: 32px;  --sp-10: 40px; --sp-12: 48px;

  /* ---- Radius ---- */
  --radius-sm:   6px;
  --radius-btn:  6px;
  --radius-input:6px;
  --radius-menu: 10px;
  --radius-table:12px;
  --radius-card: 14px;
  --radius-badge:8px;
  --radius-modal:16px;
  --radius-pill: 999px;

  /* ---- Elevation (soft, layered) ---- */
  --shadow-1: 0 1px 2px rgba(16, 24, 40, 0.05), 0 1px 3px rgba(16, 24, 40, 0.04);
  --shadow-2: 0 4px 16px -2px rgba(16, 24, 40, 0.10);
  --shadow-3: 0 24px 48px -12px rgba(16, 24, 40, 0.20);

  /* ---- Typography ---- */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
               Arial, "Apple Color Emoji", "Segoe UI Emoji", sans-serif;
  --fs-11: 11px; --fs-12: 12px; --fs-13: 13px; --fs-14: 14px;
  --fs-16: 16px; --fs-20: 20px; --fs-24: 24px; --fs-30: 30px;
  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700;
  --lh-tight: 1.25; --lh-normal: 1.5;

  /* ---- Motion ---- */
  --motion-fast: 150ms;
  --motion:      200ms;
  --motion-slow: 250ms;
  --ease:        cubic-bezier(0.4, 0, 0.2, 1);

  /* ---- Layout metrics ---- */
  --sidebar-w:           260px;
  --sidebar-w-collapsed: 76px;
  --header-h:            60px;
}

/* Respect users who prefer reduced motion — kill all transitions/animations */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}
