:root,
[data-theme='light'] {
  --bg: #f8fafc;
  --surface: #ffffff;
  --surface2: #f1f5f9;
  --border: rgba(0, 0, 0, 0.08);
  --accent: #4f46e5;
  --accent2: #6366f1;
  --text: #0f172a;
  --muted: #64748b;
  --success: #10b981;
  --warning: #f59e0b;
  --danger: #ef4444;
  --radius: 12px;
  --sidebar-w: 240px;
  --btn-close-filter: invert(0);

  /* Dropdown & Card custom theme properties */
  --card-bg: #ffffff;
  --border-color: rgba(0, 0, 0, 0.08);
  --text-primary: #0f172a;
  --hover-bg: #f1f5f9;
}

[data-theme='dark'] {
  --bg: #09090b;
  --surface: #18181b;
  --surface2: #27272a;
  --border: rgba(255, 255, 255, 0.1);
  --accent: #8b5cf6;
  --accent2: #a78bfa;
  --text: #f4f4f5;
  --muted: #a1a1aa;
  --success: #10b981;
  --warning: #f59e0b;
  --danger: #ef4444;
  --btn-close-filter: invert(1);

  /* Dropdown & Card custom theme properties */
  --card-bg: #18181b;
  --border-color: rgba(255, 255, 255, 0.1);
  --text-primary: #f4f4f5;
  --hover-bg: #27272a;
}

[data-theme='midnight'] {
  --bg: #020617;
  --surface: #0f172a;
  --surface2: #1e293b;
  --border: rgba(255, 255, 255, 0.05);
  --accent: #38bdf8;
  --accent2: #7dd3fc;
  --text: #f8fafc;
  --muted: #94a3b8;
  --success: #22c55e;
  --warning: #f59e0b;
  --danger: #ef4444;
  --btn-close-filter: invert(1);

  /* Dropdown & Card custom theme properties */
  --card-bg: #0f172a;
  --border-color: rgba(255, 255, 255, 0.05);
  --text-primary: #f8fafc;
  --hover-bg: #1e293b;
}

[data-theme='forest'] {
  --bg: #052e16;
  --surface: #064e3b;
  --surface2: #065f46;
  --border: rgba(255, 255, 255, 0.06);
  --accent: #10b981;
  --accent2: #34d399;
  --text: #ecfdf5;
  --muted: #a7f3d0;
  --success: #22c55e;
  --warning: #fbbf24;
  --danger: #f87171;
  --btn-close-filter: invert(1);

  /* Dropdown & Card custom theme properties */
  --card-bg: #064e3b;
  --border-color: rgba(255, 255, 255, 0.06);
  --text-primary: #ecfdf5;
  --hover-bg: #065f46;
}

/* Theme Selection Specific Styles */
.theme-selection-menu {
  min-width: 180px;
}

/* Force Bootstrap text-dark class to inherit the theme text color in dark/color modes */
[data-theme='dark'] .text-dark,
[data-theme='midnight'] .text-dark,
[data-theme='forest'] .text-dark {
  color: var(--text) !important;
}

/* Ensure background lights match surface/surface2 under non-light themes */
[data-theme='dark'] .bg-light,
[data-theme='midnight'] .bg-light,
[data-theme='forest'] .bg-light {
  background-color: var(--surface2) !important;
  color: var(--text) !important;
}

/* Fix text-dark inside bg-light badges and labels */
[data-theme='dark'] .bg-light.text-dark,
[data-theme='midnight'] .bg-light.text-dark,
[data-theme='forest'] .bg-light.text-dark {
  color: var(--text) !important;
}

/* Force hardcoded black/dark texts, labels, and icons to match theme's text color in dark/colored themes, unless the element has a custom background or is in user content */
[data-theme='dark'] .text-black,
[data-theme='midnight'] .text-black,
[data-theme='forest'] .text-black,
[data-theme='dark'] [style*="color: black"]:not([style*="background"]),
[data-theme='midnight'] [style*="color: black"]:not([style*="background"]),
[data-theme='forest'] [style*="color: black"]:not([style*="background"]),
[data-theme='dark'] [style*="color: #000000"]:not([style*="background"]),
[data-theme='midnight'] [style*="color: #000000"]:not([style*="background"]),
[data-theme='forest'] [style*="color: #000000"]:not([style*="background"]),
[data-theme='dark'] [style*="color: #000"]:not([style*="background"]),
[data-theme='midnight'] [style*="color: #000"]:not([style*="background"]),
[data-theme='forest'] [style*="color: #000"]:not([style*="background"]),
[data-theme='dark'] [style*="color:#000000"]:not([style*="background"]),
[data-theme='midnight'] [style*="color:#000000"]:not([style*="background"]),
[data-theme='forest'] [style*="color:#000000"]:not([style*="background"]),
[data-theme='dark'] [style*="color:#000"]:not([style*="background"]),
[data-theme='midnight'] [style*="color:#000"]:not([style*="background"]),
[data-theme='forest'] [style*="color:#000"]:not([style*="background"]) {
  color: var(--text) !important;
}

/* Fix table header, cell text, borders and text-muted visibility in dark/color modes */
[data-theme='dark'] td,
[data-theme='dark'] th,
[data-theme='midnight'] td,
[data-theme='midnight'] th,
[data-theme='forest'] td,
[data-theme='forest'] th {
  color: var(--text) !important;
  border-color: var(--border) !important;
}

[data-theme='dark'] .text-muted,
[data-theme='midnight'] .text-muted,
[data-theme='forest'] .text-muted {
  color: var(--muted) !important;
}

/* Fix modal layouts and default headers under dark/color themes */
[data-theme='dark'] .modal-content,
[data-theme='midnight'] .modal-content,
[data-theme='forest'] .modal-content {
  background-color: var(--surface) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}

/* Fix cards and details with light borders and text */
[data-theme='dark'] .card,
[data-theme='midnight'] .card,
[data-theme='forest'] .card {
  background-color: var(--card-bg) !important;
  color: var(--text) !important;
  border-color: var(--border-color) !important;
}

[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='midnight'] h1,
[data-theme='midnight'] h2,
[data-theme='midnight'] h3,
[data-theme='midnight'] h4,
[data-theme='midnight'] h5,
[data-theme='midnight'] h6,
[data-theme='forest'] h1,
[data-theme='forest'] h2,
[data-theme='forest'] h3,
[data-theme='forest'] h4,
[data-theme='forest'] h5,
[data-theme='forest'] h6 {
  color: var(--text) !important;
}

/* ====== GLOBAL BOOTSTRAP 5 TABLE DARK THEME OVERRIDES ====== */
[data-theme='dark'] .table,
[data-theme='midnight'] .table,
[data-theme='forest'] .table {
  --bs-table-color: var(--text);
  --bs-table-bg: transparent;
  --bs-table-border-color: var(--border);
  --bs-table-striped-color: var(--text);
  --bs-table-striped-bg: rgba(255, 255, 255, 0.05);
  --bs-table-hover-color: var(--text);
  --bs-table-hover-bg: rgba(255, 255, 255, 0.075);
  color: var(--text) !important;
}

/* ====== NUCLEAR TABLE DARK THEME FIX ====== */
[data-theme='dark'] .table,
[data-theme='dark'] .table *,
[data-theme='midnight'] .table,
[data-theme='midnight'] .table *,
[data-theme='forest'] .table,
[data-theme='forest'] .table * {
  --bs-table-bg: transparent !important;
  --bs-table-color: var(--text) !important;
  --bs-table-striped-bg: rgba(255, 255, 255, 0.05) !important;
  --bs-table-striped-color: var(--text) !important;
  --bs-table-active-bg: rgba(255, 255, 255, 0.1) !important;
  --bs-table-active-color: var(--text) !important;
  --bs-table-hover-bg: rgba(255, 255, 255, 0.075) !important;
  --bs-table-hover-color: var(--text) !important;
}

[data-theme='dark'] tbody tr,
[data-theme='dark'] tbody td,
[data-theme='midnight'] tbody tr,
[data-theme='midnight'] tbody td,
[data-theme='forest'] tbody tr,
[data-theme='forest'] tbody td {
  background-color: transparent !important;
  color: var(--text) !important;
}

[data-theme='dark'] tbody tr:hover td,
[data-theme='midnight'] tbody tr:hover td,
[data-theme='forest'] tbody tr:hover td {
  background-color: rgba(255, 255, 255, 0.05) !important;
}

/* Allow badges and explicit colors to stay */
[data-theme='dark'] tbody td .badge,
[data-theme='midnight'] tbody td .badge,
[data-theme='forest'] tbody td .badge,
[data-theme='dark'] tbody td .text-success,
[data-theme='midnight'] tbody td .text-success,
[data-theme='forest'] tbody td .text-success,
[data-theme='dark'] tbody td .text-danger,
[data-theme='midnight'] tbody td .text-danger,
[data-theme='forest'] tbody td .text-danger {
  color: inherit;
}

/* ====== GLOBAL THEME ALIGNMENT: Override Bootstrap Utilities in Dark Modes ====== */
[data-theme='dark'] .bg-white:not(.badge),
[data-theme='midnight'] .bg-white:not(.badge),
[data-theme='forest'] .bg-white:not(.badge),
[data-theme='dark'] .bg-light:not(.badge),
[data-theme='midnight'] .bg-light:not(.badge),
[data-theme='forest'] .bg-light:not(.badge) {
  background-color: var(--surface) !important;
}

[data-theme='dark'] .text-dark,
[data-theme='midnight'] .text-dark,
[data-theme='forest'] .text-dark {
  color: var(--text) !important;
}

/* Override inline white backgrounds often used for cards */
[data-theme='dark'] [style*="background: white"],
[data-theme='dark'] [style*="background-color: white"],
[data-theme='dark'] [style*="background: #fff"],
[data-theme='dark'] [style*="background-color: #fff"],
[data-theme='midnight'] [style*="background: white"],
[data-theme='midnight'] [style*="background-color: white"],
[data-theme='midnight'] [style*="background: #fff"],
[data-theme='midnight'] [style*="background-color: #fff"],
[data-theme='forest'] [style*="background: white"],
[data-theme='forest'] [style*="background-color: white"],
[data-theme='forest'] [style*="background: #fff"],
[data-theme='forest'] [style*="background-color: #fff"] {
  background-color: var(--surface) !important;
}

/* Fix generic borders that might have been hardcoded */
[data-theme='dark'] .border,
[data-theme='midnight'] .border,
[data-theme='forest'] .border,
[data-theme='dark'] .border-top,
[data-theme='midnight'] .border-top,
[data-theme='forest'] .border-top,
[data-theme='dark'] .border-bottom,
[data-theme='midnight'] .border-bottom,
[data-theme='forest'] .border-bottom {
  border-color: var(--border) !important;
}

/* ====== MODEL ANSWER BOX DARK THEME OVERRIDES ====== */
[data-theme='dark'] .model-answer-box {
  background-color: rgba(16, 185, 129, 0.1) !important;
  border-color: rgba(16, 185, 129, 0.2) !important;
  color: #6ee7b7 !important;
}
[data-theme='midnight'] .model-answer-box {
  background-color: rgba(34, 197, 94, 0.1) !important;
  border-color: rgba(34, 197, 94, 0.2) !important;
  color: #86efac !important;
}
[data-theme='forest'] .model-answer-box {
  background-color: rgba(52, 211, 153, 0.1) !important;
  border-color: rgba(52, 211, 153, 0.2) !important;
  color: #a7f3d0 !important;
}

/* ====== MAINS CONTENT VIEW DARK THEME OVERRIDES ====== */
[data-theme='dark'] .mains-content-view {
  background-color: var(--surface) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
}
[data-theme='midnight'] .mains-content-view {
  background-color: var(--surface) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
}
[data-theme='forest'] .mains-content-view {
  background-color: var(--surface) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
}

/* ====== QUILL EDITOR & VIEWER DARK THEME OVERRIDES ====== */
[data-theme='dark'] .ql-editor,
[data-theme='dark'] .ql-container,
[data-theme='midnight'] .ql-editor,
[data-theme='midnight'] .ql-container,
[data-theme='forest'] .ql-editor,
[data-theme='forest'] .ql-container {
  color: var(--text) !important;
}

/* Override the white background forced in admin editor wrapper */
[data-theme='dark'] .mains-editor-wrapper .ql-editor {
  background-color: var(--surface) !important;
  color: var(--text) !important;
}
[data-theme='midnight'] .mains-editor-wrapper .ql-editor {
  background-color: var(--surface) !important;
  color: var(--text) !important;
}
[data-theme='forest'] .mains-editor-wrapper .ql-editor {
  background-color: var(--surface) !important;
  color: var(--text) !important;
}

/* Ensure the toolbar icons adapt to dark theme */
[data-theme='dark'] .ql-toolbar,
[data-theme='midnight'] .ql-toolbar,
[data-theme='forest'] .ql-toolbar {
  background-color: var(--surface2) !important;
  border-color: var(--border) !important;
}

/* ====== INLINE DARK TEXT COLOR OVERRIDES FOR DARK THEMES ====== */
[data-theme='dark'] [style*="color: rgb(0,"]:not([style*="background"]),
[data-theme='dark'] [style*="color:rgb(0,"]:not([style*="background"]),
[data-theme='dark'] [style*="color: rgb(34,"]:not([style*="background"]),
[data-theme='dark'] [style*="color:rgb(34,"]:not([style*="background"]),
[data-theme='dark'] [style*="color: rgb(51,"]:not([style*="background"]),
[data-theme='dark'] [style*="color:rgb(51,"]:not([style*="background"]),
[data-theme='dark'] [style*="color: rgb(74,"]:not([style*="background"]),
[data-theme='dark'] [style*="color:rgb(74,"]:not([style*="background"]),
[data-theme='dark'] [style*="color: rgb(45,"]:not([style*="background"]),
[data-theme='dark'] [style*="color:rgb(45,"]:not([style*="background"]),
[data-theme='dark'] [style*="color: rgb(26,"]:not([style*="background"]),
[data-theme='dark'] [style*="color:rgb(26,"]:not([style*="background"]),
[data-theme='dark'] [style*="color: rgb(15,"]:not([style*="background"]),
[data-theme='dark'] [style*="color:rgb(15,"]:not([style*="background"]),
[data-theme='dark'] [style*="color: rgb(30,"]:not([style*="background"]),
[data-theme='dark'] [style*="color:rgb(30,"]:not([style*="background"]),
[data-theme='dark'] [style*="color: #333"]:not([style*="background"]),
[data-theme='dark'] [style*="color:#333"]:not([style*="background"]),
[data-theme='dark'] [style*="color: #222"]:not([style*="background"]),
[data-theme='dark'] [style*="color:#222"]:not([style*="background"]),
[data-theme='dark'] [style*="color: #111"]:not([style*="background"]),
[data-theme='dark'] [style*="color:#111"]:not([style*="background"]),

[data-theme='midnight'] [style*="color: rgb(0,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color:rgb(0,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color: rgb(34,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color:rgb(34,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color: rgb(51,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color:rgb(51,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color: rgb(74,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color:rgb(74,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color: rgb(45,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color:rgb(45,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color: rgb(26,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color:rgb(26,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color: rgb(15,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color:rgb(15,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color: rgb(30,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color:rgb(30,"]:not([style*="background"]),
[data-theme='midnight'] [style*="color: #333"]:not([style*="background"]),
[data-theme='midnight'] [style*="color:#333"]:not([style*="background"]),
[data-theme='midnight'] [style*="color: #222"]:not([style*="background"]),
[data-theme='midnight'] [style*="color:#222"]:not([style*="background"]),
[data-theme='midnight'] [style*="color: #111"]:not([style*="background"]),
[data-theme='midnight'] [style*="color:#111"]:not([style*="background"]),

[data-theme='forest'] [style*="color: rgb(0,"]:not([style*="background"]),
[data-theme='forest'] [style*="color:rgb(0,"]:not([style*="background"]),
[data-theme='forest'] [style*="color: rgb(34,"]:not([style*="background"]),
[data-theme='forest'] [style*="color:rgb(34,"]:not([style*="background"]),
[data-theme='forest'] [style*="color: rgb(51,"]:not([style*="background"]),
[data-theme='forest'] [style*="color:rgb(51,"]:not([style*="background"]),
[data-theme='forest'] [style*="color: rgb(74,"]:not([style*="background"]),
[data-theme='forest'] [style*="color:rgb(74,"]:not([style*="background"]),
[data-theme='forest'] [style*="color: rgb(45,"]:not([style*="background"]),
[data-theme='forest'] [style*="color:rgb(45,"]:not([style*="background"]),
[data-theme='forest'] [style*="color: rgb(26,"]:not([style*="background"]),
[data-theme='forest'] [style*="color:rgb(26,"]:not([style*="background"]),
[data-theme='forest'] [style*="color: rgb(15,"]:not([style*="background"]),
[data-theme='forest'] [style*="color:rgb(15,"]:not([style*="background"]),
[data-theme='forest'] [style*="color: rgb(30,"]:not([style*="background"]),
[data-theme='forest'] [style*="color:rgb(30,"]:not([style*="background"]),
[data-theme='forest'] [style*="color: #333"]:not([style*="background"]),
[data-theme='forest'] [style*="color:#333"]:not([style*="background"]),
[data-theme='forest'] [style*="color: #222"]:not([style*="background"]),
[data-theme='forest'] [style*="color:#222"]:not([style*="background"]),
[data-theme='forest'] [style*="color: #111"]:not([style*="background"]),
[data-theme='forest'] [style*="color:#111"]:not([style*="background"]) {
  color: var(--text) !important;
}

/* Allow custom background colors to show through in dark/midnight/forest themes */
[data-theme='dark'] .model-answer-box .mains-content-view,
[data-theme='dark'] .question-container .mains-content-view,
[data-theme='dark'] [style*="background"] > .mains-content-view,
[data-theme='midnight'] .model-answer-box .mains-content-view,
[data-theme='midnight'] .question-container .mains-content-view,
[data-theme='midnight'] [style*="background"] > .mains-content-view,
[data-theme='forest'] .model-answer-box .mains-content-view,
[data-theme='forest'] .question-container .mains-content-view,
[data-theme='forest'] [style*="background"] > .mains-content-view {
  background-color: transparent !important;
  border: none !important;
}

/* ====== MAINS QUESTION BOX OVERRIDES FOR NON-LIGHT THEMES ====== */
[data-theme='dark'] .mains-question-box,
[data-theme='dark'] .question-rich-content,
[data-theme='midnight'] .mains-question-box,
[data-theme='midnight'] .question-rich-content,
[data-theme='forest'] .mains-question-box,
[data-theme='forest'] .question-rich-content {
  background-color: var(--surface2) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}

/* ====== LIST GROUP AND LIST ITEMS FOR DARK THEMES ====== */
[data-theme='dark'] .list-group-item,
[data-theme='midnight'] .list-group-item,
[data-theme='forest'] .list-group-item {
  background-color: var(--surface) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}

[data-theme='dark'] .list-group-item:hover,
[data-theme='midnight'] .list-group-item:hover,
[data-theme='forest'] .list-group-item:hover {
  background-color: var(--hover-bg) !important;
}

/* ====== BOOTSTRAP FORM CONTROLS & SELECT OVERRIDES FOR DARK/COLORED THEMES ====== */
[data-theme='dark'] .form-control,
[data-theme='dark'] .form-select,
[data-theme='midnight'] .form-control,
[data-theme='midnight'] .form-select,
[data-theme='forest'] .form-control,
[data-theme='forest'] .form-select {
  background-color: var(--surface2) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}

[data-theme='dark'] .form-control:focus,
[data-theme='dark'] .form-select:focus,
[data-theme='midnight'] .form-control:focus,
[data-theme='midnight'] .form-select:focus,
[data-theme='forest'] .form-control:focus,
[data-theme='forest'] .form-select:focus {
  background-color: var(--surface2) !important;
  color: var(--text) !important;
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2) !important;
}

[data-theme='dark'] .form-control::placeholder,
[data-theme='midnight'] .form-control::placeholder,
[data-theme='forest'] .form-control::placeholder {
  color: var(--muted) !important;
  opacity: 0.6;
}

/* ====== CONTRAST FIX FOR WARNING & INFO ELEMENTS UNDER DARK/COLORED THEMES ====== */
[data-theme='dark'] .bg-warning.text-dark,
[data-theme='midnight'] .bg-warning.text-dark,
[data-theme='forest'] .bg-warning.text-dark,
[data-theme='dark'] .bg-info.text-dark,
[data-theme='midnight'] .bg-info.text-dark,
[data-theme='forest'] .bg-info.text-dark,
[data-theme='dark'] .btn-warning.text-dark,
[data-theme='midnight'] .btn-warning.text-dark,
[data-theme='forest'] .btn-warning.text-dark,
[data-theme='dark'] .badge.bg-warning.text-dark,
[data-theme='midnight'] .badge.bg-warning.text-dark,
[data-theme='forest'] .badge.bg-warning.text-dark,
[data-theme='dark'] .badge.bg-info.text-dark,
[data-theme='midnight'] .badge.bg-info.text-dark,
[data-theme='forest'] .badge.bg-info.text-dark {
  color: #0f172a !important; /* Keep text dark for readability against bright backgrounds */
}

/* Preserve spaces and newlines exactly as entered in textareas */
.mains-content-view, .ql-view {
  white-space: pre-wrap !important;
}