/* MailTrace theme tokens only.
   Ownership: colors, shadows, aliases, and shared spacing/radius variables.
   Do not add global UI foundation rules here. */
:root {
  color-scheme: dark;
  --mt-bg-app: #07101f;
  --mt-bg-sidebar: linear-gradient(180deg, #050b16 0%, #07101f 100%);
  --mt-bg-surface: rgba(14, 25, 43, 0.82);
  --mt-bg-card: rgba(18, 31, 49, 0.88);
  --mt-bg-card-elevated: rgba(22, 38, 60, 0.96);

  --mt-text-primary: #f7f9ff;
  --mt-text-secondary: #d7e2f7;
  --mt-text-muted: #94a3b8;
  --mt-text-inverse: #07101f;

  --mt-border-subtle: rgba(148, 163, 184, 0.18);
  --mt-border-strong: rgba(148, 163, 184, 0.3);

  --mt-accent-primary: #6473ff;
  --mt-accent-secondary: #9a73ff;
  --mt-accent-success: #34d399;
  --mt-accent-warning: #fbbf24;
  --mt-accent-danger: #f87171;
  --mt-accent-info: #5ed8ff;

  --mt-status-success-bg: color-mix(in srgb, var(--mt-accent-success) 16%, transparent);
  --mt-status-success-text: #8ff5c5;
  --mt-status-warning-bg: color-mix(in srgb, var(--mt-accent-warning) 16%, transparent);
  --mt-status-warning-text: #facc15;
  --mt-status-danger-bg: color-mix(in srgb, var(--mt-accent-danger) 16%, transparent);
  --mt-status-danger-text: #fecaca;
  --mt-status-info-bg: color-mix(in srgb, var(--mt-accent-info) 16%, transparent);
  --mt-status-info-text: #bae6fd;

  --mt-evidence-available-bg: var(--mt-bg-card);
  --mt-evidence-downloaded-bg: color-mix(in srgb, var(--mt-accent-success) 18%, var(--mt-bg-card));
  --mt-evidence-pending-bg: color-mix(in srgb, var(--mt-accent-warning) 16%, var(--mt-bg-card));

  --mt-nav-active-bg: rgba(100, 115, 255, 0.18);
  --mt-nav-active-text: #f8fbff;
  --mt-button-primary-bg: linear-gradient(135deg, #6473ff, #9a73ff);
  --mt-button-primary-text: #f8fbff;
  --mt-card-shadow: 0 18px 40px rgba(1, 6, 18, 0.34);
  --mt-focus-ring: 0 0 0 3px rgba(91, 124, 250, 0.34);

  --mt-sidebar-text: #f8fbff;
  --mt-sidebar-muted: #94a3b8;
  --mt-field-bg: rgba(255, 255, 255, 0.04);
  --mt-surface-muted: rgba(255, 255, 255, 0.06);
  --mt-surface-soft: rgba(255, 255, 255, 0.04);
  --mt-overlay: rgba(2, 6, 23, 0.62);
  --mt-space-1: 4px;
  --mt-space-2: 8px;
  --mt-space-3: 12px;
  --mt-space-4: 16px;
  --mt-space-5: 20px;
  --mt-space-6: 24px;

  --mt-blue: var(--mt-accent-primary);
  --mt-purple: var(--mt-accent-secondary);
  --mt-green: var(--mt-accent-success);
  --mt-orange: var(--mt-accent-warning);
  --mt-red: var(--mt-accent-danger);
  --mt-teal: #14b8a6;
  --mt-amber: var(--mt-accent-warning);
  --mt-navy: #081427;
  --mt-navy-2: #0c1930;
  --mt-radius: 14px;
  --mt-radius-sm: 8px;
  --mt-radius-md: 12px;
  --mt-radius-lg: 16px;
  --mt-radius-xl: 20px;
  --mt-shadow: var(--mt-card-shadow);
  --mt-border: var(--mt-border-subtle);
  --mt-border-soft: var(--mt-border-subtle);
  --mt-line: var(--mt-border-subtle);
  --mt-ink: var(--mt-text-primary);
  --mt-text: var(--mt-text-primary);
  --mt-muted: var(--mt-text-muted);

  --bg: var(--mt-bg-app);
  --bg-2: #0b1526;
  --panel: var(--mt-bg-card);
  --panel-2: var(--mt-bg-card-elevated);
  --panel-strong: var(--mt-bg-card-elevated);
  --surface: var(--mt-bg-card);
  --card: var(--mt-bg-card-elevated);
  --border: var(--mt-border-subtle);
  --line: var(--mt-border-subtle);
  --text: var(--mt-text-primary);
  --ink: var(--mt-text-primary);
  --muted: var(--mt-text-muted);
  --faint: color-mix(in srgb, var(--mt-text-muted) 82%, transparent);
  --accent-blue: var(--mt-accent-primary);
  --accent-purple: var(--mt-accent-secondary);
  --green: var(--mt-accent-success);
  --orange: var(--mt-accent-warning);
  --amber: var(--mt-accent-warning);
  --red: var(--mt-accent-danger);
  --blue: var(--mt-accent-primary);
  --purple: var(--mt-accent-secondary);
  --sidebar-bg: var(--mt-bg-sidebar);
  --sidebar-text: var(--mt-sidebar-text);
  --sidebar-muted: var(--mt-sidebar-muted);
  --sidebar-active: var(--mt-nav-active-bg);
  --shell-bg:
    radial-gradient(circle at top left, rgba(100, 115, 255, 0.16), transparent 34%),
    radial-gradient(circle at top right, rgba(94, 216, 255, 0.1), transparent 26%),
    linear-gradient(135deg, #050b16 0%, #07101f 50%, #091426 100%);
  --page-gradient:
    radial-gradient(circle at top right, rgba(100, 115, 255, 0.12), transparent 32%),
    radial-gradient(circle at top left, rgba(94, 216, 255, 0.06), transparent 24%),
    linear-gradient(180deg, #07101f, #0a1322 54%, #07101f);
  --card-gradient: linear-gradient(180deg, rgba(25, 43, 66, 0.82), rgba(18, 31, 49, 0.82));
  --field-bg: var(--mt-field-bg);
  --shadow: var(--mt-card-shadow);
}

:root[data-theme="light"] {
  color-scheme: light;
  --mt-bg-app: #f4f7fb;
  --mt-bg-sidebar: linear-gradient(180deg, #071226 0%, #0d1834 100%);
  --mt-bg-surface: rgba(255, 255, 255, 0.82);
  --mt-bg-card: rgba(255, 255, 255, 0.92);
  --mt-bg-card-elevated: rgba(255, 255, 255, 0.98);

  --mt-text-primary: #111c32;
  --mt-text-secondary: #42506a;
  --mt-text-muted: #66758d;
  --mt-text-inverse: #f8fbff;

  --mt-border-subtle: rgba(15, 23, 42, 0.1);
  --mt-border-strong: rgba(15, 23, 42, 0.18);

  --mt-accent-primary: #5f72ff;
  --mt-accent-secondary: #8d63ff;
  --mt-accent-success: #10b981;
  --mt-accent-warning: #f59e0b;
  --mt-accent-danger: #ef4444;
  --mt-accent-info: #57d6ff;

  --mt-status-success-bg: color-mix(in srgb, var(--mt-accent-success) 13%, transparent);
  --mt-status-success-text: #047857;
  --mt-status-warning-bg: color-mix(in srgb, var(--mt-accent-warning) 15%, transparent);
  --mt-status-warning-text: #a16207;
  --mt-status-danger-bg: color-mix(in srgb, var(--mt-accent-danger) 13%, transparent);
  --mt-status-danger-text: #b91c1c;
  --mt-status-info-bg: color-mix(in srgb, var(--mt-accent-info) 13%, transparent);
  --mt-status-info-text: #0369a1;

  --mt-evidence-downloaded-bg: color-mix(in srgb, var(--mt-accent-success) 14%, var(--mt-bg-card));
  --mt-evidence-pending-bg: color-mix(in srgb, var(--mt-accent-warning) 14%, var(--mt-bg-card));

  --mt-nav-active-bg: rgba(95, 114, 255, 0.14);
  --mt-nav-active-text: #2131a8;
  --mt-button-primary-bg: linear-gradient(135deg, #5f72ff, #8d63ff);
  --mt-button-primary-text: #f8fbff;
  --mt-card-shadow: 0 10px 28px rgba(15, 23, 42, 0.055);
  --mt-focus-ring: 0 0 0 3px rgba(79, 110, 247, 0.28);

  --mt-sidebar-text: #eef4ff;
  --mt-sidebar-muted: #9fb0cb;
  --mt-field-bg: rgba(255, 255, 255, 0.88);
  --mt-surface-muted: #eef3fb;
  --mt-surface-soft: #f8fbff;
  --mt-overlay: rgba(2, 6, 23, 0.52);

  --bg-2: color-mix(in srgb, var(--mt-bg-app) 82%, var(--mt-text-inverse));
  --shell-bg:
    radial-gradient(circle at top left, rgba(95, 114, 255, 0.1), transparent 34%),
    radial-gradient(circle at top right, rgba(87, 214, 255, 0.08), transparent 28%),
    linear-gradient(180deg, #ffffff, #edf2ff 100%);
  --page-gradient:
    radial-gradient(circle at top right, rgba(95, 114, 255, 0.08), transparent 34%),
    radial-gradient(circle at top left, rgba(87, 214, 255, 0.06), transparent 24%),
    linear-gradient(180deg, #f8faff, #eef3ff 58%, #f8faff);
  --card-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(250, 252, 255, 0.94));
}