/* Sidebar follows the global automatic day/night theme. */
html:not([data-theme="dark"]):not(.react-student-embedded) body .shell > .sidebar {
  color: #20324a !important;
  background:
    radial-gradient(circle at 40% 4%, rgba(37, 99, 235, 0.1), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #f5f8fc 58%, #edf3fa 100%) !important;
  border-right: 1px solid rgba(71, 103, 139, 0.14) !important;
  box-shadow: 8px 0 28px rgba(31, 62, 96, 0.07) !important;
}

html:not([data-theme="dark"]):not(.react-student-embedded) body .sidebar .brand-subtitle-text,
html:not([data-theme="dark"]):not(.react-student-embedded) body .sidebar .menu-item,
html:not([data-theme="dark"]):not(.react-student-embedded) body .sidebar .menu-item-label,
html:not([data-theme="dark"]):not(.react-student-embedded) body .sidebar .menu-item-icon {
  color: #526b86 !important;
}

html:not([data-theme="dark"]):not(.react-student-embedded) body .sidebar .sidebar-toggle {
  color: #39536f !important;
  background: rgba(230, 238, 248, 0.92) !important;
  box-shadow: 0 6px 18px rgba(30, 64, 99, 0.1) !important;
}

html:not([data-theme="dark"]):not(.react-student-embedded) body .sidebar .menu-item:hover {
  color: #174f94 !important;
  background: rgba(37, 99, 235, 0.08) !important;
}

html:not([data-theme="dark"]):not(.react-student-embedded) body .sidebar .menu-item.active {
  color: #ffffff !important;
  background: linear-gradient(90deg, #2563eb, #7c3aed) !important;
  box-shadow: 0 12px 28px rgba(37, 99, 235, 0.24) !important;
}

html:not([data-theme="dark"]):not(.react-student-embedded) body .sidebar .menu-item.active .menu-item-label,
html:not([data-theme="dark"]):not(.react-student-embedded) body .sidebar .menu-item.active .menu-item-icon {
  color: #ffffff !important;
}

html:not([data-theme="dark"]):not(.react-student-embedded) body .sidebar .sidebar-account-card,
html:not([data-theme="dark"]):not(.react-student-embedded) body .sidebar .sidebar-account-button {
  color: #20324a !important;
  background: rgba(255, 255, 255, 0.88) !important;
  border-color: rgba(71, 103, 139, 0.16) !important;
  box-shadow: 0 10px 24px rgba(31, 62, 96, 0.08) !important;
}

html[data-theme="dark"]:not(.react-student-embedded) body .shell > .sidebar {
  color: #dbe7f5 !important;
  background:
    radial-gradient(circle at 42% 5%, rgba(91, 75, 220, 0.22), transparent 32%),
    linear-gradient(180deg, #111b38 0%, #081426 56%, #06101f 100%) !important;
  border-right: 1px solid rgba(148, 163, 184, 0.12) !important;
  box-shadow: 8px 0 30px rgba(2, 8, 23, 0.26) !important;
}

html[data-theme="dark"]:not(.react-student-embedded) body .sidebar .menu-item,
html[data-theme="dark"]:not(.react-student-embedded) body .sidebar .menu-item-label,
html[data-theme="dark"]:not(.react-student-embedded) body .sidebar .menu-item-icon {
  color: #aebfd3 !important;
}

html[data-theme="dark"]:not(.react-student-embedded) body .sidebar .menu-item.active,
html[data-theme="dark"]:not(.react-student-embedded) body .sidebar .menu-item.active .menu-item-label,
html[data-theme="dark"]:not(.react-student-embedded) body .sidebar .menu-item.active .menu-item-icon {
  color: #ffffff !important;
}

html[data-theme="dark"]:not(.react-student-embedded) body .sidebar .sidebar-account-card,
html[data-theme="dark"]:not(.react-student-embedded) body .sidebar .sidebar-account-button {
  color: #e5eef9 !important;
  background: rgba(8, 20, 38, 0.78) !important;
  border-color: rgba(148, 163, 184, 0.14) !important;
}