:root {
  color-scheme: light;
  --light-bg: #f7f8f8;
  --light-surface: #ffffff;
  --light-surface-soft: #f4f4f4;
  --light-surface-muted: #eef3f3;
  --light-surface-strong: #d5dadd;
  --light-border: #e9ecef;
  --light-border-soft: #f0f0f0;
  --light-border-strong: #bdbdbd;
  --light-text: #333333;
  --light-text-soft: #626366;
  --light-text-muted: #939191;
  --light-text-faint: #a3a3a3;
  --light-accent: #4cbdcf;
  --light-accent-strong: #2f9fb0;
  --light-accent-soft: #eff9fa;
  --light-accent-soft-strong: #d6f0f3;
  --light-success-soft: #eff9fa;
  --light-success-text: #2f9fb0;
  --light-danger-soft: #eff9fa;
  --light-danger-text: #2f9fb0;
  --light-warning-soft: #eff9fa;
  --light-warning-text: #2f9fb0;
  --light-overlay: rgba(17, 24, 39, 0.34);
  --light-shadow: 0 18px 48px rgba(15, 23, 42, 0.08);

  --dark-bg: #050606;
  --dark-surface: #0d1113;
  --dark-surface-soft: #111619;
  --dark-surface-muted: #161d20;
  --dark-surface-strong: #1f292d;
  --dark-border: #273034;
  --dark-border-soft: #1b2326;
  --dark-border-strong: #39474c;
  --dark-text: #f7f9f9;
  --dark-text-soft: #d7ddde;
  --dark-text-muted: #aab3b5;
  --dark-text-faint: #7f8b8e;
  --dark-accent: #b34230;
  --dark-accent-strong: #d65a43;
  --dark-accent-soft: #25110e;
  --dark-accent-soft-strong: #3a1812;
  --dark-success-soft: #25110e;
  --dark-success-text: #d65a43;
  --dark-danger-soft: #25110e;
  --dark-danger-text: #d65a43;
  --dark-warning-soft: #25110e;
  --dark-warning-text: #d65a43;
  --dark-overlay: rgba(0, 0, 0, 0.78);
  --dark-shadow: 0 24px 64px rgba(0, 0, 0, 0.5);

  --theme-bg: var(--light-bg);
  --theme-surface: var(--light-surface);
  --theme-surface-soft: var(--light-surface-soft);
  --theme-surface-muted: var(--light-surface-muted);
  --theme-surface-strong: var(--light-surface-strong);
  --theme-border: var(--light-border);
  --theme-border-soft: var(--light-border-soft);
  --theme-border-strong: var(--light-border-strong);
  --theme-text: var(--light-text);
  --theme-text-soft: var(--light-text-soft);
  --theme-text-muted: var(--light-text-muted);
  --theme-text-faint: var(--light-text-faint);
  --theme-accent: var(--light-accent);
  --theme-accent-strong: var(--light-accent-strong);
  --theme-accent-soft: var(--light-accent-soft);
  --theme-accent-soft-strong: var(--light-accent-soft-strong);
  --theme-success-soft: var(--light-success-soft);
  --theme-success-text: var(--light-success-text);
  --theme-danger-soft: var(--light-danger-soft);
  --theme-danger-text: var(--light-danger-text);
  --theme-warning-soft: var(--light-warning-soft);
  --theme-warning-text: var(--light-warning-text);
  --theme-overlay: var(--light-overlay);
  --theme-shadow: var(--light-shadow);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --theme-bg: var(--dark-bg);
  --theme-surface: var(--dark-surface);
  --theme-surface-soft: var(--dark-surface-soft);
  --theme-surface-muted: var(--dark-surface-muted);
  --theme-surface-strong: var(--dark-surface-strong);
  --theme-border: var(--dark-border);
  --theme-border-soft: var(--dark-border-soft);
  --theme-border-strong: var(--dark-border-strong);
  --theme-text: var(--dark-text);
  --theme-text-soft: var(--dark-text-soft);
  --theme-text-muted: var(--dark-text-muted);
  --theme-text-faint: var(--dark-text-faint);
  --theme-accent: var(--dark-accent);
  --theme-accent-strong: var(--dark-accent-strong);
  --theme-accent-soft: var(--dark-accent-soft);
  --theme-accent-soft-strong: var(--dark-accent-soft-strong);
  --theme-success-soft: var(--dark-success-soft);
  --theme-success-text: var(--dark-success-text);
  --theme-danger-soft: var(--dark-danger-soft);
  --theme-danger-text: var(--dark-danger-text);
  --theme-warning-soft: var(--dark-warning-soft);
  --theme-warning-text: var(--dark-warning-text);
  --theme-overlay: var(--dark-overlay);
  --theme-shadow: var(--dark-shadow);
}

html:not(.theme-ready) body,
html:not(.theme-ready) .theme-auth-card,
html:not(.theme-ready) .theme-toggle-button {
  transition: none !important;
}

html,
body {
  min-height: 100%;
}

body {
  background-color: var(--theme-bg);
  color: var(--theme-text);
  transition:
    background-color 0.28s ease,
    color 0.28s ease,
    border-color 0.28s ease,
    box-shadow 0.28s ease;
}

body.theme-shell {
  background:
    radial-gradient(circle at top left, rgba(76, 189, 207, 0.08), transparent 28%),
    radial-gradient(circle at top right, rgba(47, 159, 176, 0.035), transparent 24%),
    var(--theme-bg) !important;
}

body.theme-auth-page {
  background:
    radial-gradient(circle at 18% 10%, rgba(76, 189, 207, 0.1), transparent 30%),
    radial-gradient(circle at 82% 0%, rgba(47, 159, 176, 0.04), transparent 28%),
    var(--theme-bg) !important;
}

html[data-theme="dark"] body.theme-shell,
html[data-theme="dark"] body.theme-auth-page {
  background:
    radial-gradient(circle at 18% 10%, rgba(179, 66, 48, 0.14), transparent 28%),
    radial-gradient(circle at 82% 0%, rgba(126, 46, 34, 0.1), transparent 24%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0)),
    var(--theme-bg) !important;
}

::selection {
  background: rgba(76, 189, 207, 0.22);
}

html[data-theme="dark"] ::selection {
  background: rgba(179, 66, 48, 0.28);
}

.theme-auth-card {
  transition:
    background-color 0.28s ease,
    border-color 0.28s ease,
    box-shadow 0.28s ease;
}

html[data-theme="dark"] .theme-auth-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.025), rgba(255, 255, 255, 0)),
    var(--theme-surface) !important;
  border-color: var(--theme-border) !important;
  box-shadow: var(--theme-shadow) !important;
}

.theme-toggle-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.625rem;
  height: 2.625rem;
  padding: 0;
  border-radius: 999px;
  border: 1px solid var(--theme-border);
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
  backdrop-filter: blur(16px);
  transition:
    transform 0.2s ease,
    background-color 0.28s ease,
    border-color 0.28s ease,
    box-shadow 0.28s ease;
}

.theme-toggle-button:hover {
  transform: translateY(-1px);
  background: var(--theme-surface-soft);
}

.theme-toggle-button:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px rgba(76, 189, 207, 0.2);
}

html[data-theme="dark"] .theme-toggle-button {
  background: rgba(13, 17, 19, 0.9);
  border-color: var(--theme-border);
  box-shadow: 0 14px 30px rgba(6, 8, 14, 0.28);
}

html[data-theme="dark"] .theme-toggle-button:hover {
  background: var(--theme-surface-soft);
}

html[data-theme="dark"] .theme-toggle-button:focus-visible {
  box-shadow: 0 0 0 4px rgba(179, 66, 48, 0.24);
}

.theme-toggle-icon {
  width: 1.45rem;
  height: 1.45rem;
  display: block;
}

.theme-toggle-floating {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 40;
}

@media (max-width: 768px) {
  .theme-toggle-floating {
    top: 0.875rem;
    right: 0.875rem;
  }
}

/* Official Sirius University palette for Tailwind utilities in light mode. */
html:not([data-theme="dark"]) :is(.bg-indigo-50, .bg-indigo-50\/40, .bg-indigo-50\/50, .bg-indigo-50\/60, .bg-indigo-50\/70) {
  background-color: var(--theme-accent-soft) !important;
}

html:not([data-theme="dark"]) .bg-indigo-100 {
  background-color: var(--theme-accent-soft-strong) !important;
}

html:not([data-theme="dark"]) :is(.bg-indigo-300, .bg-indigo-400, .bg-indigo-500, .bg-indigo-600) {
  background-color: var(--theme-accent) !important;
}

html:not([data-theme="dark"]) :is(.bg-green-500, .bg-yellow-300, .bg-yellow-400, .bg-yellow-500, .bg-red-500) {
  background-color: var(--theme-accent) !important;
}

html:not([data-theme="dark"]) :is(.bg-green-600, .bg-green-700, .bg-yellow-600, .bg-red-600, .bg-red-700) {
  background-color: var(--theme-accent-strong) !important;
}

html:not([data-theme="dark"]) .bg-indigo-700 {
  background-color: var(--theme-accent-strong) !important;
}

html:not([data-theme="dark"]) :is(.text-indigo-400, .text-indigo-500, .text-indigo-500\/80, .text-indigo-600) {
  color: var(--theme-accent) !important;
}

html:not([data-theme="dark"]) :is(.text-indigo-700, .text-indigo-700\/70, .text-indigo-800, .text-indigo-800\/75, .text-indigo-900) {
  color: var(--theme-accent-strong) !important;
}

html:not([data-theme="dark"]) :is(.text-indigo-100, .text-indigo-100\/85, .text-indigo-200) {
  color: #ffffff !important;
}

html:not([data-theme="dark"]) :is(.border-indigo-50, .border-indigo-100, .border-indigo-100\/50, .border-indigo-100\/80, .border-indigo-200, .border-indigo-300) {
  border-color: var(--theme-accent-soft-strong) !important;
}

html:not([data-theme="dark"]) :is(.border-indigo-400, .border-indigo-400\/30, .border-indigo-500, .border-indigo-600) {
  border-color: var(--theme-accent) !important;
}

html:not([data-theme="dark"]) :is(.ring-indigo-100, .ring-indigo-500, .ring-indigo-500\/20, .ring-indigo-600\/20) {
  --tw-ring-color: rgba(76, 189, 207, 0.22) !important;
}

html:not([data-theme="dark"]) .from-indigo-500 {
  --tw-gradient-from: var(--theme-accent) !important;
  --tw-gradient-to: rgba(76, 189, 207, 0) !important;
}

html:not([data-theme="dark"]) .to-purple-600 {
  --tw-gradient-to: var(--theme-accent-strong) !important;
}

html:not([data-theme="dark"]) .hover\:bg-indigo-50:hover,
html:not([data-theme="dark"]) .hover\:bg-indigo-100:hover {
  background-color: var(--theme-accent-soft-strong) !important;
}

html:not([data-theme="dark"]) .hover\:bg-indigo-700:hover {
  background-color: var(--theme-accent-strong) !important;
}

html:not([data-theme="dark"]) :is(.hover\:text-indigo-600:hover, .hover\:text-indigo-800:hover) {
  color: var(--theme-accent-strong) !important;
}

html:not([data-theme="dark"]) .hover\:border-indigo-400:hover {
  border-color: var(--theme-accent-strong) !important;
}

html[data-theme="dark"] .bg-white {
  background-color: var(--theme-surface) !important;
}

html[data-theme="dark"] .bg-slate-50 {
  background-color: var(--theme-surface-soft) !important;
}

html[data-theme="dark"] .bg-slate-100 {
  background-color: var(--theme-surface-muted) !important;
}

html[data-theme="dark"] .bg-slate-50\/50 {
  background-color: rgba(17, 22, 25, 0.76) !important;
}

html[data-theme="dark"] .bg-slate-300 {
  background-color: var(--theme-surface-strong) !important;
}

html[data-theme="dark"] .bg-indigo-50 {
  background-color: var(--theme-accent-soft) !important;
}

html[data-theme="dark"] .bg-indigo-50\/50,
html[data-theme="dark"] .bg-indigo-50\/60,
html[data-theme="dark"] .bg-indigo-50\/70 {
  background-color: rgba(37, 17, 14, 0.84) !important;
}

html[data-theme="dark"] .bg-indigo-100 {
  background-color: var(--theme-accent-soft-strong) !important;
}

html[data-theme="dark"] .bg-indigo-300,
html[data-theme="dark"] .bg-indigo-400,
html[data-theme="dark"] .bg-indigo-600 {
  background: linear-gradient(135deg, var(--theme-accent), var(--theme-accent-strong)) !important;
}

html[data-theme="dark"] .bg-indigo-500 {
  background-color: var(--theme-accent) !important;
}

html[data-theme="dark"] .text-indigo-400 {
  color: var(--theme-accent) !important;
}

html[data-theme="dark"] .from-indigo-500 {
  --tw-gradient-from: var(--theme-accent) !important;
  --tw-gradient-to: rgba(179, 66, 48, 0) !important;
}

html[data-theme="dark"] .to-purple-600 {
  --tw-gradient-to: var(--theme-accent-strong) !important;
}

html[data-theme="dark"] .bg-blue-50 {
  background-color: var(--theme-accent-soft) !important;
}

html[data-theme="dark"] .bg-yellow-50,
html[data-theme="dark"] .bg-yellow-100,
html[data-theme="dark"] .bg-green-50,
html[data-theme="dark"] .bg-red-50,
html[data-theme="dark"] .bg-orange-100 {
  background-color: var(--theme-accent-soft) !important;
}

html[data-theme="dark"] .bg-yellow-300,
html[data-theme="dark"] .bg-yellow-400 {
  background-color: var(--theme-accent-strong) !important;
}

html[data-theme="dark"] .bg-slate-900\/50,
html[data-theme="dark"] .bg-slate-900\/60,
html[data-theme="dark"] .bg-slate-900\/90 {
  background-color: var(--theme-overlay) !important;
}

html[data-theme="dark"] .bg-white\/10 {
  background-color: rgba(255, 255, 255, 0.06) !important;
}

html[data-theme="dark"] .bg-white\/20 {
  background-color: rgba(255, 255, 255, 0.11) !important;
}

html[data-theme="dark"] .bg-white\/30 {
  background-color: rgba(255, 255, 255, 0.16) !important;
}

html[data-theme="dark"] .bg-white\/50 {
  background-color: rgba(13, 17, 19, 0.74) !important;
}

html[data-theme="dark"] .border-slate-200,
html[data-theme="dark"] .border-indigo-200 {
  border-color: var(--theme-border) !important;
}

html[data-theme="dark"] .border-blue-200,
html[data-theme="dark"] .border-yellow-200,
html[data-theme="dark"] .border-yellow-300,
html[data-theme="dark"] .border-green-200,
html[data-theme="dark"] .border-red-200 {
  border-color: var(--theme-border-strong) !important;
}

html[data-theme="dark"] .border-slate-100,
html[data-theme="dark"] .border-indigo-100 {
  border-color: var(--theme-border-soft) !important;
}

html[data-theme="dark"] .border-indigo-100\/50,
html[data-theme="dark"] .border-indigo-100\/80,
html[data-theme="dark"] .border-indigo-500\/50 {
  border-color: rgba(179, 66, 48, 0.72) !important;
}

html[data-theme="dark"] .border-white\/5 {
  border-color: rgba(255, 255, 255, 0.09) !important;
}

html[data-theme="dark"] .text-slate-900 {
  color: var(--theme-text) !important;
}

html[data-theme="dark"] .text-slate-800 {
  color: var(--theme-text) !important;
}

html[data-theme="dark"] .text-slate-700 {
  color: var(--theme-text-soft) !important;
}

html[data-theme="dark"] .text-slate-600,
html[data-theme="dark"] .text-slate-500 {
  color: var(--theme-text-muted) !important;
}

html[data-theme="dark"] .text-slate-400,
html[data-theme="dark"] .text-slate-300 {
  color: var(--theme-text-faint) !important;
}

html[data-theme="dark"] .text-indigo-600 {
  color: var(--theme-accent) !important;
}

html[data-theme="dark"] .text-indigo-500 {
  color: var(--theme-accent) !important;
}

html[data-theme="dark"] .text-indigo-700,
html[data-theme="dark"] .text-indigo-800 {
  color: var(--theme-accent-strong) !important;
}

html[data-theme="dark"] .text-indigo-700\/70 {
  color: rgba(215, 221, 222, 0.76) !important;
}

html[data-theme="dark"] .text-indigo-900 {
  color: var(--theme-text) !important;
}

html[data-theme="dark"] .text-indigo-100,
html[data-theme="dark"] .text-indigo-200 {
  color: var(--theme-text) !important;
}

html[data-theme="dark"] .text-blue-700 {
  color: var(--theme-accent-strong) !important;
}

html[data-theme="dark"] .text-red-600 {
  color: var(--theme-accent-strong) !important;
}

html[data-theme="dark"] .text-red-700 {
  color: var(--theme-accent-strong) !important;
}

html[data-theme="dark"] .text-green-600,
html[data-theme="dark"] .text-green-700 {
  color: var(--theme-accent-strong) !important;
}

html[data-theme="dark"] .text-yellow-600,
html[data-theme="dark"] .text-yellow-800 {
  color: var(--theme-accent-strong) !important;
}

html[data-theme="dark"] .text-orange-600 {
  color: var(--theme-accent-strong) !important;
}

html[data-theme="dark"] .hover\:bg-slate-50:hover {
  background-color: var(--theme-surface-soft) !important;
}

html[data-theme="dark"] .hover\:bg-slate-100:hover {
  background-color: var(--theme-surface-muted) !important;
}

html[data-theme="dark"] .hover\:bg-indigo-50:hover {
  background-color: var(--theme-accent-soft) !important;
}

html[data-theme="dark"] .hover\:bg-indigo-100:hover {
  background-color: var(--theme-accent-soft-strong) !important;
}

html[data-theme="dark"] .hover\:bg-indigo-700:hover {
  background: linear-gradient(135deg, var(--theme-accent), var(--theme-accent-strong)) !important;
}

html[data-theme="dark"] .hover\:bg-red-50:hover {
  background-color: var(--theme-accent-soft) !important;
}

html[data-theme="dark"] .hover\:border-indigo-400:hover {
  border-color: var(--theme-accent) !important;
}

html[data-theme="dark"] .hover\:text-indigo-600:hover {
  color: var(--theme-accent) !important;
}

html[data-theme="dark"] .hover\:text-indigo-800:hover {
  color: var(--theme-accent-strong) !important;
}

html[data-theme="dark"] .hover\:text-slate-600:hover {
  color: var(--theme-text-soft) !important;
}

html[data-theme="dark"] .focus\:bg-white:focus {
  background-color: var(--theme-surface) !important;
}

html[data-theme="dark"] :is(input, select, textarea) {
  color: var(--theme-text);
  caret-color: var(--theme-accent);
}

html[data-theme="dark"] :is(input, select, textarea)::placeholder {
  color: var(--theme-text-faint);
}

html[data-theme="dark"] option {
  background-color: var(--theme-surface);
  color: var(--theme-text);
}

html[data-theme="dark"] input[type="file"]::file-selector-button {
  background: var(--theme-accent-soft);
  color: var(--theme-accent);
}

html[data-theme="dark"] .divide-slate-50 > :not([hidden]) ~ :not([hidden]),
html[data-theme="dark"] .divide-slate-100 > :not([hidden]) ~ :not([hidden]) {
  border-color: var(--theme-border-soft) !important;
}

html[data-theme="dark"] aside.bg-white,
html[data-theme="dark"] header.bg-white,
html[data-theme="dark"] nav.bg-white {
  background-color: rgba(8, 11, 12, 0.94) !important;
  backdrop-filter: blur(18px);
}

html[data-theme="dark"] .shadow-sm,
html[data-theme="dark"] .shadow-lg,
html[data-theme="dark"] .shadow-2xl {
  box-shadow: var(--theme-shadow) !important;
}

html[data-theme="dark"] {
  scrollbar-color: var(--theme-border-strong) var(--theme-surface-soft);
}

