/* ══════════════════════════════════════════════════════════
   Hasight Design System — CSS Custom Properties (Tokens)
   Haori UI Transformation Palette
   ══════════════════════════════════════════════════════════ */

:root {
  /* ── Core Colors (Haori Palette) ── */
  --color-primary: #0078D4;
  --color-primary-light: #2B88D8;
  --color-primary-dark: #005A9E;
  --color-secondary: #605E5C;
  --color-secondary-light: #8A8886;
  --color-secondary-dark: #484644;
  --color-accent: #0078D4;
  --color-accent-light: #DEECF9;
  --color-surface: #FFFFFF;
  --color-background: #F3F2F1;

  /* ── Semantic Colors ── */
  --color-success: #107C10;
  --color-warning: #FFB900;
  --color-danger: #D13438;
  --color-info: #0078D4;

  /* ── Status Badge Colors (core 5) ── */
  --badge-active-bg: #DFF6DD;
  --badge-active-fg: #107C10;
  --badge-pending-bg: #FFF4CE;
  --badge-pending-fg: #835C00;
  --badge-rejected-bg: #FDE7E9;
  --badge-rejected-fg: #A80000;
  --badge-draft-bg: #F3F2F1;
  --badge-draft-fg: #605E5C;
  --badge-completed-bg: #DEECF9;
  --badge-completed-fg: #005A9E;

  /* ── Extended Status Badge Colors (domain-specific, token-backed) ── */
  --badge-approved-bg: #DFF6DD;
  --badge-approved-fg: #107C10;
  --badge-submitted-bg: #EFF6FC;
  --badge-submitted-fg: #0078D4;
  --badge-under-review-bg: #FFF4CE;
  --badge-under-review-fg: #835C00;
  --badge-cancelled-bg: #F3F2F1;
  --badge-cancelled-fg: #605E5C;
  --badge-expired-bg: #FDE7E9;
  --badge-expired-fg: #A80000;
  --badge-on-hold-bg: #F4E6FF;
  --badge-on-hold-fg: #6B2FA0;
  --badge-in-progress-bg: #DEECF9;
  --badge-in-progress-fg: #005A9E;
  --badge-overdue-bg: #FDE7E9;
  --badge-overdue-fg: #A80000;
  --badge-returned-bg: #DFF6DD;
  --badge-returned-fg: #107C10;
  --badge-partial-bg: #FFF4CE;
  --badge-partial-fg: #835C00;
  --badge-reserved-bg: #F4E6FF;
  --badge-reserved-fg: #6B2FA0;
  --badge-signed-bg: #DFF6DD;
  --badge-signed-fg: #107C10;
  --badge-handed-over-bg: #DEECF9;
  --badge-handed-over-fg: #005A9E;

  /* ── Severity Badge Colors ── */
  --badge-critical-bg: #FDE7E9;
  --badge-critical-fg: #A80000;
  --badge-high-bg: #FFF4CE;
  --badge-high-fg: #7D3F00;
  --badge-medium-bg: #EFF6FC;
  --badge-medium-fg: #005A9E;
  --badge-low-bg: #F3F2F1;
  --badge-low-fg: #484644;

  /* ── Material Lifecycle Badge Colors ── */
  --badge-consumed-bg: #F3F2F1;
  --badge-consumed-fg: #484644;
  --badge-fongible-bg: #DEECF9;
  --badge-fongible-fg: #005A9E;
  --badge-non-fongible-bg: #FFF4CE;
  --badge-non-fongible-fg: #835C00;

  /* ── Chart Data Colors ── */
  --chart-1: #0078D4;
  --chart-2: #8764B8;
  --chart-3: #00B7C3;
  --chart-4: #107C10;
  --chart-5: #FFB900;
  --chart-6: #D13438;
  --chart-7: #E3008C;
  --chart-8: #00AD56;

  /* ── Text Colors ── */
  --color-text-primary: #323130;
  --color-text-secondary: #605E5C;
  --color-text-muted: #A19F9D;
  --color-text-inverse: #FFFFFF;

  /* ── Border Colors ── */
  --color-border: #EDEBE9;
  --color-border-light: #F3F2F1;
  --color-border-focus: #0078D4;

  /* ── Type Scale ── */
  --font-family-sans: 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-family-mono: 'Cascadia Code', 'JetBrains Mono', 'Fira Code', monospace;
  --text-xs: 0.75rem;
  --text-sm: 0.8125rem;
  --text-base: 0.875rem;
  --text-lg: 1rem;
  --text-xl: 1.125rem;
  --text-2xl: 1.25rem;
  --text-3xl: 1.5rem;
  --text-4xl: 1.75rem;

  /* ── Spacing ── */
  --space-0: 0;
  --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;

  /* ── Border Radius (flat/square) ── */
  --radius-sm: 2px;
  --radius-md: 2px;
  --radius-lg: 4px;
  --radius-xl: 4px;
  --radius-full: 9999px;

  /* ── Shadows (subtle) ── */
  --shadow-sm: 0 1.6px 3.6px 0 rgba(0,0,0,0.132), 0 0.3px 0.9px 0 rgba(0,0,0,0.108);
  --shadow-md: 0 3.2px 7.2px 0 rgba(0,0,0,0.132), 0 0.6px 1.8px 0 rgba(0,0,0,0.108);
  --shadow-lg: 0 6.4px 14.4px 0 rgba(0,0,0,0.132), 0 1.2px 3.6px 0 rgba(0,0,0,0.108);

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

  /* ── Layout ── */
  --sidebar-width: 260px;
  --sidebar-collapsed-width: 48px;
  --topnav-height: 48px;

  /* ── Haori-Specific Tokens ── */
  --haori-topbar-bg: #002050;
  --haori-topbar-height: 48px;
  --haori-sidebar-bg: #FFFFFF;
  --haori-sidebar-width: 260px;
  --haori-sidebar-collapsed-width: 48px;
  --haori-sidebar-active-bg: #DEECF9;
  --haori-sidebar-active-border: #0078D4;
  --haori-sidebar-hover-bg: #F3F2F1;
  --haori-sidebar-group-text: #605E5C;
  --haori-commandbar-height: 44px;
  --haori-commandbar-bg: #FFFFFF;
  --haori-commandbar-border: #EDEBE9;
  --haori-grid-header-bg: #FAF9F8;
  --haori-grid-header-border: #0078D4;
  --haori-grid-row-height: 34px;
  --haori-grid-row-hover: #F3F2F1;
  --haori-grid-font-size: 13px;
  --haori-grid-link-color: #0078D4;
  --haori-stage-completed: #107C10;
  --haori-stage-active: #0078D4;
  --haori-stage-inactive: #C8C6C4;
  --haori-stage-size: 24px;
  --haori-stage-line-height: 2px;
  --haori-workspace-banner-start: #002050;
  --haori-workspace-banner-end: #0078D4;
  --haori-tile-size: 180px;
  --haori-pivot-active: #0078D4;
  --haori-pivot-border-width: 2px;

  /* ── Breakpoints ── */
  --breakpoint-sm: 576px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 1024px;
  --breakpoint-xl: 1280px;
  --breakpoint-2xl: 1536px;

  /* ── Animation / Transition ── */
  --transition-fast: 100ms ease;
  --transition-base: 200ms ease;
  --transition-slow: 300ms ease;

  /* ── Form Layout ── */
  --form-label-width: 200px;
  --form-input-max-width: 480px;
  --form-section-gap: var(--space-8);

  /* ── Component Sizing ── */
  --avatar-sm: 28px;
  --avatar-md: 36px;
  --avatar-lg: 48px;
  --avatar-xl: 64px;
  --skeleton-bg: #EDEBE9;
  --skeleton-shimmer: #F3F2F1;
}

/* ── Dark Mode ── */
[data-theme="dark"] {
  --color-surface: #1B1A19;
  --color-background: #11100F;
  --color-text-primary: #F3F2F1;
  --color-text-secondary: #A19F9D;
  --color-text-muted: #8A8886;
  --color-border: #323130;
  --color-border-light: #252423;
  --shadow-sm: 0 1.6px 3.6px 0 rgba(0,0,0,0.4);
  --shadow-md: 0 3.2px 7.2px 0 rgba(0,0,0,0.4);
  --shadow-lg: 0 6.4px 14.4px 0 rgba(0,0,0,0.4);

  --haori-topbar-bg: #0F1923;
  --haori-sidebar-bg: #1B1A19;
  --haori-sidebar-active-bg: #1B3A5C;
  --haori-sidebar-hover-bg: #252423;
  --haori-sidebar-group-text: #A19F9D;
  --haori-commandbar-bg: #1B1A19;
  --haori-commandbar-border: #323130;
  --haori-grid-header-bg: #252423;
  --haori-grid-row-hover: #323130;
  --haori-workspace-banner-start: #0F1923;
  --haori-workspace-banner-end: #005A9E;
  --haori-stage-inactive: #484644;
  --skeleton-bg: #323130;
  --skeleton-shimmer: #3B3A39;
}

/* ── Base overrides for BS5 coexistence ── */
body {
  font-family: var(--font-family-sans);
  color: var(--color-text-primary);
  background-color: var(--color-background);
}

code, pre, kbd, samp {
  font-family: var(--font-family-mono);
}