/* ============================================
 * Titan Core — design tokens
 * Tesla-inspired minimalist dark + light themes.
 * ============================================ */

:root {
  /* Brand */
  --tc-red:        #E40E20;
  --tc-red-hover:  #C60C1A;
  --tc-red-press:  #A80A16;
  --tc-red-soft:   rgba(228, 14, 32, 0.12);
  --tc-red-glow:   rgba(228, 14, 32, 0.25);
  /* Alias semántico — varias vistas referencian --tc-primary; mapea a la marca. */
  --tc-primary:    var(--tc-red);

  /* Status */
  --tc-success:      #2FAF4E;
  --tc-success-soft: rgba(47, 175, 78, 0.14);
  --tc-warning:      #F5B82E;
  --tc-warning-soft: rgba(245, 184, 46, 0.14);
  --tc-danger:       #E40E20;

  /* Type scale */
  --tc-font:       'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --tc-font-mono:  ui-monospace, 'SF Mono', 'Cascadia Code', 'Roboto Mono', monospace;

  --tc-fs-xs:  11px;
  --tc-fs-sm:  13px;
  --tc-fs-md:  14px;
  --tc-fs-base: 14px; /* alias de --tc-fs-md: varias vistas usan --tc-fs-base */
  --tc-fs-lg:  16px;
  --tc-fs-xl:  20px;
  --tc-fs-2xl: 28px;
  --tc-fs-3xl: 42px;
  --tc-fs-4xl: 56px;

  --tc-lh-tight: 1.1;
  --tc-lh-snug:  1.35;
  --tc-lh-base:  1.55;

  /* Spacing */
  --tc-s-0:  2px;
  --tc-s-1:  4px;
  --tc-s-2:  8px;
  --tc-s-3:  12px;
  --tc-s-4:  16px;
  --tc-s-5:  24px;
  --tc-s-6:  32px;
  --tc-s-7:  48px;
  --tc-s-8:  64px;
  --tc-s-9:  96px;

  /* Layout */
  --tc-sidebar-w: 232px;
  --tc-topbar-h:  72px;
  --tc-radius-sm: 2px;
  --tc-radius:    6px;
  --tc-radius-lg: 10px;
  --tc-radius-xl: 14px;

  /* Motion */
  --tc-dur-fast:  120ms;
  --tc-dur:       180ms;
  --tc-dur-slow:  320ms;
  --tc-ease:      cubic-bezier(0.2, 0.6, 0.2, 1);
}

/* ---------- Dark theme (default) ---------- */
:root,
[data-theme="dark"] {
  --tc-bg-0:  #080808;   /* deepest */
  --tc-bg-1:  #0F0F10;   /* page */
  --tc-bg-2:  #16171A;   /* elevated (cards, sidebar) */
  --tc-bg-3:  #1F2024;   /* inputs, hover */
  --tc-bg-4:  #292A30;   /* pressed / selected */

  --tc-text-1: #F7F7F8;  /* primary */
  --tc-text-2: #A5A6AC;  /* secondary */
  --tc-text-3: #898A92;  /* muted — subido de #67686F para mejor contraste AA en texto informativo */

  --tc-border-1: rgba(255, 255, 255, 0.06);
  --tc-border-2: rgba(255, 255, 255, 0.12);
  --tc-border-3: rgba(255, 255, 255, 0.20);

  --tc-overlay: rgba(0, 0, 0, 0.72);
  --tc-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --tc-shadow:    0 8px 28px rgba(0, 0, 0, 0.48);
  --tc-shadow-lg: 0 24px 60px rgba(0, 0, 0, 0.6);
}

/* ---------- Light theme ---------- */
[data-theme="light"] {
  --tc-bg-0:  #FFFFFF;
  --tc-bg-1:  #F7F7F8;
  --tc-bg-2:  #FFFFFF;
  --tc-bg-3:  #F0F0F2;
  --tc-bg-4:  #E6E7EA;

  --tc-text-1: #0E0E10;
  --tc-text-2: #52525B;
  --tc-text-3: #8A8B92;

  --tc-border-1: rgba(14, 14, 16, 0.07);
  --tc-border-2: rgba(14, 14, 16, 0.14);
  --tc-border-3: rgba(14, 14, 16, 0.24);

  --tc-overlay: rgba(14, 14, 16, 0.48);
  --tc-shadow-sm: 0 1px 2px rgba(14, 14, 16, 0.06);
  --tc-shadow:    0 6px 24px rgba(14, 14, 16, 0.08);
  --tc-shadow-lg: 0 20px 48px rgba(14, 14, 16, 0.12);
}

/* Honor user motion preferences */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}