/**
 * SuperDash design tokens — edit this file to re-theme the entire application.
 * All semantic colors, typography, radii, and layout constants live here.
 */
:root {
  /* ----- Brand ----- */
  --nx-color-brand: #00548b;
  --nx-color-brand-hover: #003d66;
  --nx-color-brand-muted: rgba(0, 84, 139, 0.12);

  /* ----- Surfaces ----- */
  --nx-color-bg-page: #ebf2f7;
  --nx-color-bg-sidebar: #ffffff;
  --nx-color-bg-card: #ffffff;
  --nx-color-bg-elevated: #ffffff;
  --nx-color-bg-muted: #f5f5f5;
  --nx-color-bg-row: #ffffff;
  --nx-color-bg-row-alt: #fafafa;
  --nx-color-bg-table-header: #f5f5f5;
  --nx-color-bg-table-footer: #f5f5f5;

  /* ----- Navigation ----- */
  --nx-color-nav-active: #ffede1;
  --nx-color-nav-text: #333333;
  --nx-color-nav-text-hover: #00548b;
  --nx-color-nav-border-active: transparent;

  /* ----- Text ----- */
  --nx-color-text-primary: #333333;
  --nx-color-text-secondary: #757575;
  --nx-color-text-muted: #9e9e9e;
  --nx-color-text-inverse: #ffffff;
  --nx-color-link: #00548b;
  --nx-color-link-hover: #003d66;

  /* ----- Borders & dividers ----- */
  --nx-color-border-subtle: #e8eef2;
  --nx-color-border-strong: #d0dae2;
  --nx-color-border-table: #eeeeee;

  /* ----- Semantic ----- */
  --nx-color-success: #28a745;
  --nx-color-warning: #ffc107;
  --nx-color-danger: #dc3545;
  --nx-color-info: #17a2b8;
  --nx-color-avatar: #333333;

  /* ----- Typography ----- */
  --nx-font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --nx-font-size-xs: 0.75rem;
  --nx-font-size-sm: 0.875rem;
  --nx-font-size-base: 1rem;
  --nx-font-size-lg: 1.125rem;
  --nx-font-size-xl: 1.25rem;
  --nx-font-size-2xl: 1.5rem;
  --nx-font-size-display: clamp(1.5rem, 2.5vw, 2rem);
  --nx-line-height-tight: 1.25;
  --nx-line-height-body: 1.5;
  --nx-font-weight-normal: 400;
  --nx-font-weight-medium: 500;
  --nx-font-weight-semibold: 600;
  --nx-font-weight-bold: 700;
  --nx-letter-spacing-brand: 0.04em;

  /* ----- Radius & shadow ----- */
  --nx-radius-sm: 6px;
  --nx-radius-md: 10px;
  --nx-radius-lg: 12px;
  --nx-radius-pill: 9999px;
  --nx-radius-input: 8px;
  --nx-shadow-card: 0 1px 3px rgba(0, 84, 139, 0.08);
  --nx-shadow-soft: 0 2px 12px rgba(0, 0, 0, 0.06);
  --nx-shadow-sidebar: 1px 0 0 var(--nx-color-border-subtle);

  /* ----- Layout ----- */
  --nx-sidebar-width: 260px;
  --nx-sidebar-width-collapsed: 72px;
  --nx-header-min-height: 3.5rem;
  --nx-spacing-page: 1.5rem;
  --nx-spacing-section: 1.25rem;
  --nx-content-max-width: 100%;

  /* ----- Motion ----- */
  --nx-duration-fast: 150ms;
  --nx-duration-normal: 220ms;
  --nx-easing-standard: cubic-bezier(0.4, 0, 0.2, 1);

  /* ----- Bootstrap bridge (optional; keeps BS components on-brand) ----- */
  --bs-primary: var(--nx-color-brand);
  --bs-primary-rgb: 0, 84, 139;
  --bs-body-bg: var(--nx-color-bg-page);
  --bs-body-color: var(--nx-color-text-primary);
  --bs-link-color: var(--nx-color-link);
  --bs-link-hover-color: var(--nx-color-link-hover);
  --bs-border-color: var(--nx-color-border-subtle);
}