:root {
  color-scheme: light;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --gtep-bg: #0f172a;
  --gtep-surface: #1e293b;
  --gtep-surface-raised: #273449;
  --gtep-border: #526176;
  --gtep-text: #f8fafc;
  --gtep-text-muted: #cbd5e1;
  --gtep-link: #7dd3fc;
  --gtep-focus: #38bdf8;
}

:root[data-theme="dark"] body,
:root[data-theme="dark"] #content-wrapper,
:root[data-theme="dark"] #content,
:root[data-theme="dark"] .container,
:root[data-theme="dark"] .container-fluid {
  background-color: var(--gtep-bg);
  color: var(--gtep-text);
}

:root[data-theme="dark"] .card,
:root[data-theme="dark"] .card-body,
:root[data-theme="dark"] .modal-content,
:root[data-theme="dark"] .dropdown-menu,
:root[data-theme="dark"] .list-group-item,
:root[data-theme="dark"] .popover,
:root[data-theme="dark"] .jumbotron,
:root[data-theme="dark"] .bg-white,
:root[data-theme="dark"] footer.bg-white,
:root[data-theme="dark"] .sidebar .collapse-inner {
  background-color: var(--gtep-surface) !important;
  border-color: var(--gtep-border) !important;
  color: var(--gtep-text) !important;
}

:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3,
:root[data-theme="dark"] h4,
:root[data-theme="dark"] h5,
:root[data-theme="dark"] h6,
:root[data-theme="dark"] p,
:root[data-theme="dark"] label,
:root[data-theme="dark"] legend,
:root[data-theme="dark"] .text-gray-600,
:root[data-theme="dark"] .text-gray-700,
:root[data-theme="dark"] .text-gray-800,
:root[data-theme="dark"] .dropdown-item,
:root[data-theme="dark"] .modal-title,
:root[data-theme="dark"] .close {
  color: var(--gtep-text) !important;
}

:root[data-theme="dark"] .text-muted,
:root[data-theme="dark"] small,
:root[data-theme="dark"] .form-text,
:root[data-theme="dark"] .dataTables_info,
:root[data-theme="dark"] .dataTables_length,
:root[data-theme="dark"] .dataTables_filter {
  color: var(--gtep-text-muted) !important;
}

:root[data-theme="dark"] .sidebar .collapse-inner .collapse-header {
  color: var(--gtep-text-muted) !important;
}

:root[data-theme="dark"] .sidebar .collapse-inner .collapse-item,
:root[data-theme="dark"] .sidebar .collapse-inner .collapse-item i {
  color: var(--gtep-text) !important;
}

:root[data-theme="dark"] .sidebar .collapse-inner .collapse-item.active {
  background-color: #334155 !important;
  color: #fff !important;
  font-weight: 700;
}

:root[data-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item):not(.collapse-item) {
  color: var(--gtep-link);
}

:root[data-theme="dark"] a:not(.btn):hover,
:root[data-theme="dark"] a:not(.btn):focus {
  color: #bae6fd;
}

:root[data-theme="dark"] .dropdown-item:hover,
:root[data-theme="dark"] .dropdown-item:focus,
:root[data-theme="dark"] .sidebar .collapse-item:hover,
:root[data-theme="dark"] .sidebar .collapse-item:focus {
  background-color: #3b4a61 !important;
  color: #fff !important;
}

:root[data-theme="dark"] .form-control,
:root[data-theme="dark"] .custom-select,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
:root[data-theme="dark"] .input-group-text,
:root[data-theme="dark"] .custom-file-label {
  background-color: #111c2f !important;
  border-color: var(--gtep-border) !important;
  color: var(--gtep-text) !important;
}

:root[data-theme="dark"] .form-control::placeholder,
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder {
  color: #aebdd0 !important;
  opacity: 1;
}

:root[data-theme="dark"] .form-control:focus,
:root[data-theme="dark"] .custom-select:focus,
:root[data-theme="dark"] select:focus,
:root[data-theme="dark"] textarea:focus,
:root[data-theme="dark"] input:focus {
  border-color: var(--gtep-focus) !important;
  box-shadow: 0 0 0 .2rem rgba(56, 189, 248, .3) !important;
  outline: 0;
}

:root[data-theme="dark"] table,
:root[data-theme="dark"] .table,
:root[data-theme="dark"] .table td,
:root[data-theme="dark"] .table th,
:root[data-theme="dark"] table.dataTable td,
:root[data-theme="dark"] table.dataTable th {
  border-color: var(--gtep-border) !important;
  color: var(--gtep-text) !important;
}

:root[data-theme="dark"] .table,
:root[data-theme="dark"] table.dataTable,
:root[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) {
  background-color: var(--gtep-surface) !important;
}

:root[data-theme="dark"] .table-hover tbody tr:hover,
:root[data-theme="dark"] table.dataTable tbody tr:hover,
:root[data-theme="dark"] .table-active {
  background-color: #334155 !important;
  color: #fff !important;
}

:root[data-theme="dark"] .page-link {
  background-color: var(--gtep-surface);
  border-color: var(--gtep-border);
  color: var(--gtep-link);
}

:root[data-theme="dark"] .page-item.active .page-link {
  background-color: #0369a1;
  border-color: #38bdf8;
  color: #fff;
}

:root[data-theme="dark"] .page-item.disabled .page-link,
:root[data-theme="dark"] .btn:disabled,
:root[data-theme="dark"] .btn.disabled {
  color: #d1d5db !important;
  opacity: .7;
}

:root[data-theme="dark"] .btn-light,
:root[data-theme="dark"] .btn-outline-secondary {
  background-color: #334155;
  border-color: #94a3b8;
  color: #fff;
}

:root[data-theme="dark"] .btn-light:hover,
:root[data-theme="dark"] .btn-outline-secondary:hover {
  background-color: #475569;
  border-color: #cbd5e1;
  color: #fff;
}

:root[data-theme="dark"] .btn-primary {
  background-color: #0369a1;
  border-color: #38bdf8;
  color: #fff;
}

:root[data-theme="dark"] .btn-success {
  background-color: #047857;
  border-color: #34d399;
  color: #fff;
}

:root[data-theme="dark"] .btn-danger {
  background-color: #b91c1c;
  border-color: #f87171;
  color: #fff;
}

:root[data-theme="dark"] .modal-header,
:root[data-theme="dark"] .modal-footer,
:root[data-theme="dark"] hr,
:root[data-theme="dark"] .dropdown-divider {
  border-color: var(--gtep-border) !important;
}

:root[data-theme="dark"] .alert-info {
  background-color: #164e63;
  border-color: #22d3ee;
  color: #ecfeff;
}

:root[data-theme="dark"] .alert-warning {
  background-color: #713f12;
  border-color: #fbbf24;
  color: #fffbeb;
}

:root[data-theme="dark"] .alert-danger {
  background-color: #7f1d1d;
  border-color: #f87171;
  color: #fef2f2;
}

:root[data-theme="dark"] .alert-success {
  background-color: #14532d;
  border-color: #4ade80;
  color: #f0fdf4;
}

.theme-toggle {
  align-items: center;
  background: transparent;
  border: 0;
  color: #6b7280;
  cursor: pointer;
  display: inline-flex;
  gap: .45rem;
  padding: .45rem;
}

.theme-toggle:focus-visible {
  border-radius: 999px;
  box-shadow: 0 0 0 3px rgba(52, 152, 219, .35);
  outline: 0;
}

.theme-toggle__track {
  background: #d1d5db;
  border-radius: 999px;
  height: 1.45rem;
  padding: 3px;
  transition: background-color .2s ease;
  width: 2.65rem;
}

.theme-toggle__thumb {
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .3);
  display: block;
  height: 1.075rem;
  transform: translateX(0);
  transition: transform .2s ease;
  width: 1.075rem;
}

:root[data-theme="dark"] .theme-toggle {
  color: #f8fafc;
}

:root[data-theme="dark"] .theme-toggle__track {
  background: #3498db;
}

:root[data-theme="dark"] .theme-toggle__thumb {
  transform: translateX(1.2rem);
}

.theme-toggle--login {
  position: fixed;
  right: 1rem;
  top: 1rem;
  z-index: 1050;
}

@media (prefers-reduced-motion: reduce) {
  .theme-toggle__track,
  .theme-toggle__thumb {
    transition: none;
  }
}
