/* SovereignS3nc Design Tokens */

:root {
  /* Brand & Status Colors (WCAG AA Compliant) */
  --sov-primary: #1260cc;
  --sov-primary-hover: #0f52b0;
  --sov-primary-light: #e8f0fe;
  --sov-primary-contrast: #ffffff;

  --sov-secondary: #495057;
  --sov-secondary-hover: #343a40;
  --sov-secondary-contrast: #ffffff;

  --sov-success: #198754;
  --sov-success-bg: #d1e7dd;
  --sov-success-border: #a3cfbb;
  --sov-success-contrast: #ffffff;

  --sov-warning: #996500;
  --sov-warning-bg: #fff3cd;
  --sov-warning-border: #ffe69c;
  --sov-warning-contrast: #ffffff;

  --sov-danger: #dc3545;
  --sov-danger-bg: #f8d7da;
  --sov-danger-border: #f1aeb5;
  --sov-danger-contrast: #ffffff;

  --sov-info: #0d6efd;
  --sov-info-bg: #cff4fc;
  --sov-info-border: #9eeaf9;
  --sov-info-contrast: #ffffff;

  /* Surfaces & Backgrounds */
  --sov-bg: #f8f9fa;
  --sov-surface: #ffffff;
  --sov-surface-elevated: #ffffff;
  --sov-border: #dee2e6;
  --sov-border-subtle: #e9ecef;

  /* Text & Typography */
  --sov-text: #212529;
  --sov-text-muted: #595959;
  --sov-text-disabled: #8c8c8c;
  --sov-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --sov-font-mono: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  /* Spacing Scale */
  --sov-space-1: 4px;
  --sov-space-2: 8px;
  --sov-space-3: 12px;
  --sov-space-4: 16px;
  --sov-space-5: 20px;
  --sov-space-6: 24px;
  --sov-space-8: 32px;

  /* Radii & Shadows */
  --sov-radius-sm: 4px;
  --sov-radius-md: 8px;
  --sov-radius-lg: 12px;
  --sov-radius-pill: 9999px;

  --sov-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --sov-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --sov-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  --sov-shadow-focus: 0 0 0 3px rgba(18, 96, 204, 0.25);

  /* Transitions */
  --sov-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --sov-transition-base: 250ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* Dark Theme Tokens */
[data-theme="dark"],
.dark-theme {
  --sov-bg: #0d1117;
  --sov-surface: #161b22;
  --sov-surface-elevated: #21262d;
  --sov-border: #30363d;
  --sov-border-subtle: #21262d;

  --sov-text: #c9d1d9;
  --sov-text-muted: #8b949e;
  --sov-text-disabled: #6e7681;

  --sov-primary: #58a6ff;
  --sov-primary-hover: #79b8ff;
  --sov-primary-light: rgba(56, 139, 253, 0.15);
  --sov-primary-contrast: #0d1117;

  --sov-secondary: #8b949e;
  --sov-secondary-hover: #c9d1d9;
  --sov-secondary-contrast: #0d1117;

  --sov-success: #3fb950;
  --sov-success-bg: rgba(46, 160, 67, 0.15);
  --sov-success-border: rgba(56, 139, 253, 0.4);
  --sov-success-contrast: #0d1117;

  --sov-warning: #d29922;
  --sov-warning-bg: rgba(187, 128, 9, 0.15);
  --sov-warning-border: rgba(187, 128, 9, 0.4);
  --sov-warning-contrast: #0d1117;

  --sov-danger: #f85149;
  --sov-danger-bg: rgba(248, 81, 73, 0.15);
  --sov-danger-border: rgba(248, 81, 73, 0.4);
  --sov-danger-contrast: #0d1117;

  --sov-info: #58a6ff;
  --sov-info-bg: rgba(56, 139, 253, 0.15);
  --sov-info-border: rgba(56, 139, 253, 0.4);

  --sov-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --sov-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.5);
  --sov-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.6);
  --sov-shadow-focus: 0 0 0 3px rgba(88, 166, 255, 0.35);
}

@media (prefers-color-scheme: dark) {
  [data-theme="auto"] {
    --sov-bg: #0d1117;
    --sov-surface: #161b22;
    --sov-surface-elevated: #21262d;
    --sov-border: #30363d;
    --sov-border-subtle: #21262d;
    --sov-text: #c9d1d9;
    --sov-text-muted: #8b949e;
    --sov-text-disabled: #6e7681;
    --sov-primary: #58a6ff;
    --sov-primary-hover: #79b8ff;
    --sov-primary-light: rgba(56, 139, 253, 0.15);
    --sov-primary-contrast: #0d1117;
    --sov-success: #3fb950;
    --sov-warning: #d29922;
    --sov-danger: #f85149;
  }
}

/* Surface & Component Dark Mode Overrides */
[data-theme="dark"],
[data-bs-theme="dark"],
.dark-theme {
  color-scheme: dark;
}

[data-theme="dark"] body,
[data-bs-theme="dark"] body,
.dark-theme body,
body.dark-theme {
  background-color: var(--sov-bg) !important;
  color: var(--sov-text) !important;
}

[data-theme="dark"] .card,
[data-bs-theme="dark"] .card,
.dark-theme .card {
  background-color: var(--sov-surface) !important;
  border-color: var(--sov-border) !important;
  color: var(--sov-text) !important;
}

[data-theme="dark"] .modal-content,
[data-bs-theme="dark"] .modal-content,
.dark-theme .modal-content {
  background-color: var(--sov-surface-elevated) !important;
  border-color: var(--sov-border) !important;
  color: var(--sov-text) !important;
}

[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select,
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select,
.dark-theme .form-control,
.dark-theme .form-select {
  background-color: var(--sov-surface-elevated) !important;
  border-color: var(--sov-border) !important;
  color: var(--sov-text) !important;
}

[data-theme="dark"] .kanban-column,
.dark-theme .kanban-column {
  background-color: var(--sov-surface) !important;
  border-color: var(--sov-border) !important;
}

[data-theme="dark"] .kanban-task,
.dark-theme .kanban-task {
  background-color: var(--sov-surface-elevated) !important;
  border-color: var(--sov-border) !important;
  color: var(--sov-text) !important;
}

[data-theme="dark"] .list-group-item,
[data-bs-theme="dark"] .list-group-item,
.dark-theme .list-group-item {
  background-color: var(--sov-surface) !important;
  border-color: var(--sov-border) !important;
  color: var(--sov-text) !important;
}
