/* ════════════════════════════════════════════════════════
   GLOBAL DARK MODE OVERRIDES
   ════════════════════════════════════════════════════════ */
[data-theme="dark"],
[data-theme="dark"] body,
[data-theme="dark"] .bg-tj-surface-base,
[data-theme="dark"] .bg-\[\#fcfcfa\],
[data-theme="dark"] .bg-\[\#fafaf7\],
[data-theme="dark"] .bg-\[\#fcfcf6\],
[data-theme="dark"] .bg-\[\#fdfcfb\] {
  background-color: #111118 !important;
  color: #f0f0f5 !important;
}

[data-theme="dark"] .bg-tj-surface-card,
[data-theme="dark"] .bg-white,
[data-theme="dark"] .bg-\[\#ffffff\],
[data-theme="dark"] [style*="background: white"],
[data-theme="dark"] [style*="background:white"],
[data-theme="dark"] [style*="background-color: white"],
[data-theme="dark"] [style*="background-color:white"],
[data-theme="dark"] [style*="background: #ffffff"],
[data-theme="dark"] [style*="background:#ffffff"],
[data-theme="dark"] .card,
[data-theme="dark"] .achievement-card,
[data-theme="dark"] .video-card,
[data-theme="dark"] .taja-level-card,
[data-theme="dark"] .level-stepper-card,
[data-theme="dark"] .completion-expander,
[data-theme="dark"] .health-upload-dialog,
[data-theme="dark"] .skill-modal-dialog,
[data-theme="dark"] .upload-modal-dialog,
[data-theme="dark"] .upload-modal-footer,
[data-theme="dark"] .skills-expand-panel,
[data-theme="dark"] header,
[data-theme="dark"] footer,
[data-theme="dark"] #drawer,
[data-theme="dark"] #mobile-drawer {
  background-color: #1e1e2a !important;
  border-color: #2e2e3e !important;
}

[data-theme="dark"] .bg-tj-surface-muted,
[data-theme="dark"] .bg-gray-50,
[data-theme="dark"] .bg-gray-100,
[data-theme="dark"] .bg-zinc-50,
[data-theme="dark"] .bg-zinc-100,
[data-theme="dark"] .bg-slate-50,
[data-theme="dark"] .bg-slate-100,
[data-theme="dark"] .bg-\[\#f7f5f2\],
[data-theme="dark"] .bg-\[\#f3f4f6\],
[data-theme="dark"] .bg-\[\#F7F7F1\],
[data-theme="dark"] .bg-\[\#f7f7f1\] {
  background-color: #1a1a26 !important;
}

[data-theme="dark"] .bg-tj-primary-surface,
[data-theme="dark"] .bg-\[\#faf5ff\] {
  background-color: #2a1b40 !important;
  border-color: #4a2b70 !important;
}

[data-theme="dark"] .bg-\[\#fff1f2\] {
  background-color: #3b181a !important;
  border-color: #632225 !important;
}

[data-theme="dark"] .video-card-body {
  background: linear-gradient(to top, #1e1e2a 85%, transparent) !important;
}

[data-theme="dark"] .text-tj-text,
[data-theme="dark"] .text-black,
[data-theme="dark"] .text-gray-900,
[data-theme="dark"] .text-gray-800,
[data-theme="dark"] .text-gray-700,
[data-theme="dark"] .text-zinc-900,
[data-theme="dark"] .text-zinc-800,
[data-theme="dark"] .text-zinc-700,
[data-theme="dark"] .text-\[\#1f2a37\],
[data-theme="dark"] .text-\[\#1F2A37\],
[data-theme="dark"] .text-\[\#161616\],
[data-theme="dark"] .text-\[\#141412\],
[data-theme="dark"] .text-\[\#1E1E1D\],
[data-theme="dark"] .text-\[\#0f0f10\],
[data-theme="dark"] .text-\[\#1a1a1a\],
[data-theme="dark"] h1, [data-theme="dark"] h2, [data-theme="dark"] h3, [data-theme="dark"] h4, [data-theme="dark"] h5, [data-theme="dark"] h6,
[data-theme="dark"] .section-title,
[data-theme="dark"] .bio-name,
[data-theme="dark"] .achievement-content h4,
[data-theme="dark"] .video-meta h4,
[data-theme="dark"] [style*="color:#374151"],
[data-theme="dark"] [style*="color: #374151"],
[data-theme="dark"] [style*="color:#1f2a37"],
[data-theme="dark"] [style*="color: #1f2a37"] {
  color: #f0f0f5 !important;
}

[data-theme="dark"] .text-tj-text-secondary,
[data-theme="dark"] .text-gray-600,
[data-theme="dark"] .text-gray-500,
[data-theme="dark"] .text-zinc-600,
[data-theme="dark"] .text-zinc-500,
[data-theme="dark"] .text-\[\#5e5e59\],
[data-theme="dark"] .text-\[\#5E5E59\],
[data-theme="dark"] p,
[data-theme="dark"] .bio-description,
[data-theme="dark"] .completion-item,
[data-theme="dark"] .achievement-content p {
  color: #a8a8be !important;
}

[data-theme="dark"] .text-tj-text-tertiary,
[data-theme="dark"] .text-gray-400,
[data-theme="dark"] .text-zinc-400,
[data-theme="dark"] .text-\[\#8c8c85\],
[data-theme="dark"] .text-\[\#9da4ae\] {
  color: #6e6e88 !important;
}

[data-theme="dark"] .border-tj-border,
[data-theme="dark"] .border-gray-100,
[data-theme="dark"] .border-gray-200,
[data-theme="dark"] .border-\[\#e6e6dc\],
[data-theme="dark"] .border-\[\#ece9e3\],
[data-theme="dark"] .border-\[\#d2d6db\] {
  border-color: #2e2e3e !important;
}

[data-theme="dark"] input,
[data-theme="dark"] textarea,
[data-theme="dark"] select {
  background-color: #181822 !important;
  color: #f0f0f5 !important;
  border-color: #2e2e3e !important;
}

/* Active states & navigation hovers */
[data-theme="dark"] .hover-purple:hover,
[data-theme="dark"] .nav-link:hover {
  color: #b670ff !important;
  background-color: #2a1b40 !important;
}

[data-theme="dark"] .nav-link-active {
  color: #b670ff !important;
  background-color: #2a1b40 !important;
}

[data-theme="dark"] .shadow-tj-card,
[data-theme="dark"] .shadow-sm {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
}

/* ════════════════════════════════════════════════════════
   CSS VARIABLES OVERRIDES FOR STYLES.CSS & OP.CSS
   ════════════════════════════════════════════════════════ */
[data-theme="dark"] {
  /* Surfaces */
  --surface-card: #1e1e2a !important;
  --surface-base: #111118 !important;
  --surface-bg: #111118 !important;
  --surface-white: #1e1e2a !important;
  --surface-neutral-100: #1a1a26 !important;

  /* Text */
  --text-primary: #f0f0f5 !important;
  --text-secondary: #a8a8be !important;
  --text-tertiary: #6e6e88 !important;
  --text-display: #f0f0f5 !important;
  --text-muted: #6e6e88 !important;
  --text-white: #ffffff !important;
  --text-hint: #4a4a62 !important;
  --text-soft: #6e6e88 !important;

  /* Border */
  --border-primary: #2e2e3e !important;
  --border-secondary: #2e2e3e !important;
  --border-neutral: #2e2e3e !important;
  --divider: #2a2a3a !important;
  --card-border: #2e2e3e !important;

  /* Grey */
  --grey-100: #1a1a26 !important;
  --grey-200: #2e2e3e !important;
  --grey-300: #4a4a62 !important;
  --grey-400: #6e6e88 !important;
  --grey-500: #a8a8be !important;
  --grey-600: #d1d1e0 !important;
  --grey-700: #f0f0f5 !important;
  --grey-base: #111118 !important;

  /* Misc */
  --page-bg: #111118 !important;
  --card-bg: #1e1e2a !important;
  --form-bg: #1e1e2a !important;
  --form-border: #3a3a52 !important;
  --nav-bg: #111118 !important;
  --nav-border: #2e2e3e !important;
}

/* ════════════════════════════════════════════════════════
   DESIGN-SYSTEM TUNING — second pass.
   The base overrides above set the global surface/text. The
   block below fixes specific spots where the contrast was off
   against the Tajah design system (purple accents, status
   badges, suggestion cards, hardcoded white bgs in styles.css).
   ════════════════════════════════════════════════════════ */

/* Surface tones — slightly warmer to keep the palette close to the light theme's purple-leaning neutrals. */
[data-theme="dark"] {
  --surface-card:    #1c1c28 !important;
  --surface-base:    #0f0f17 !important;
  --surface-white:   #1c1c28 !important;
  --card-bg:         #1c1c28 !important;
  --border-primary:  #3a3a4d !important;
  --border-secondary:#3a3a4d !important;
  --divider:         #3a3a4d !important;
}

/* Quick-stats strip has a hardcoded white bg in styles.css — re-tone it. */
[data-theme="dark"] .bio-quick-stats { background: #1c1c28 !important; }
[data-theme="dark"] .bio-quick-stats .bqs-value { color: #f0f0f5 !important; }
[data-theme="dark"] .bio-quick-stats .bqs-label { color: #a8a8be !important; }
[data-theme="dark"] .bqs-item:not(:last-child) { border-left-color: #3a3a4d !important; }

/* Platform suggestion card — boxed + readable on dark. */
[data-theme="dark"] .taja-level-card {
  background: #1f1830 !important;
  border: 1px solid #3a2b5a !important;
}
[data-theme="dark"] .taja-level-card .taja-level-item,
[data-theme="dark"] .taja-level-card .taja-level-item * { color: #f0f0f5 !important; }
[data-theme="dark"] .taja-step-highlight { color: #d4b3ff !important; }
[data-theme="dark"] .taja-close-btn2 { color: #a8a8be !important; }
[data-theme="dark"] .taja-close-btn2:hover { color: #f0f0f5 !important; }

/* Achievement card icon: keep purple accent visible on dark. */
[data-theme="dark"] .achievement-icon {
  background: #2a1b40 !important;
  color: #d4b3ff !important;
  border-color: #3a2b5a !important;
}

/* Upload "+" outline button on dark. */
[data-theme="dark"] .upload-btn {
  background: #2a1b40 !important;
  color: #d4b3ff !important;
  border-color: #b670ff !important;
}
[data-theme="dark"] .upload-btn:hover {
  background: #b670ff !important;
  color: #fff !important;
}

/* Status / chip badges (light theme tints) — invert for dark. */
[data-theme="dark"] .bg-tj-success-bg,
[data-theme="dark"] .bg-\[\#ecfdf3\],
[data-theme="dark"] .bg-\[\#e3f5e1\] { background-color: #0e2a1b !important; color: #74e8a7 !important; }
[data-theme="dark"] .text-tj-success,
[data-theme="dark"] .text-\[\#085d3a\],
[data-theme="dark"] .text-\[\#00a637\] { color: #74e8a7 !important; }

[data-theme="dark"] .bg-tj-info-bg,
[data-theme="dark"] .bg-\[\#eff8ff\],
[data-theme="dark"] .bg-\[\#e3f1ff\] { background-color: #0e2030 !important; color: #93c5fd !important; }
[data-theme="dark"] .text-tj-info,
[data-theme="dark"] .text-\[\#1849a9\],
[data-theme="dark"] .text-\[\#0094e3\] { color: #93c5fd !important; }

[data-theme="dark"] .bg-tj-accent-yellow-bg,
[data-theme="dark"] .bg-\[\#fff8d6\] { background-color: #2c2410 !important; color: #facc15 !important; }
[data-theme="dark"] .text-tj-accent-yellow,
[data-theme="dark"] .text-\[\#caa913\],
[data-theme="dark"] .text-\[\#7a5f00\] { color: #facc15 !important; }

[data-theme="dark"] .bg-tj-error-bg,
[data-theme="dark"] .bg-\[\#fff0f0\] { background-color: #2b1213 !important; color: #fca5a5 !important; }
[data-theme="dark"] .text-tj-error,
[data-theme="dark"] .text-\[\#9b1c1c\],
[data-theme="dark"] .text-\[\#b91c1c\] { color: #fca5a5 !important; }

/* Buttons painted with hardcoded purple stay legible on dark. */
[data-theme="dark"] [style*="background:#b670ff"],
[data-theme="dark"] [style*="background: #b670ff"] { color: #fff !important; }

/* Action-row buttons on opportunity / candidate cards — bordered look adapts. */
[data-theme="dark"] .opportunity-card { background: #1c1c28 !important; }
[data-theme="dark"] .opportunity-card:hover { box-shadow: 0 8px 24px rgba(182,112,255,0.18) !important; }
[data-theme="dark"] .opp-actions button,
[data-theme="dark"] .opp-actions a { background: #1c1c28 !important; }

/* Form fields inside modals on dark. */
[data-theme="dark"] .upload-field-input,
[data-theme="dark"] .upload-field-input:focus {
  background: #181822 !important;
  color: #f0f0f5 !important;
  border-color: #3a3a4d !important;
}
[data-theme="dark"] .upload-modal-dialog,
[data-theme="dark"] .upload-modal-footer { background: #1c1c28 !important; }

/* Skill chips. */
[data-theme="dark"] .skill-chip { background: #2a1b40 !important; color: #d4b3ff !important; border-color: #3a2b5a !important; }

/* Health-report status block inside edit-profile modal. */
[data-theme="dark"] #health-report-status { background: #181822 !important; border-color: #3a3a4d !important; }
[data-theme="dark"] #health-report-line1 { color: #f0f0f5 !important; }
[data-theme="dark"] #health-report-line2 { color: #a8a8be !important; }