html[data-theme="dark"] {
  color-scheme: dark;
  --bs-body-color: #e6edf9;
  --bs-body-bg: #09111f;
  --bs-border-color: rgba(137, 161, 206, 0.18);
  --app-surface: rgba(13, 24, 44, 0.82);
  --app-surface-strong: #111d34;
  --app-surface-tint: rgba(17, 29, 52, 0.68);
  --app-text-muted: #9aa9c6;
  --app-border-strong: rgba(137, 161, 206, 0.2);
  --app-gradient: linear-gradient(135deg, #09111f 0%, #0d1930 52%, #1b223c 100%);
  --app-accent-gradient: linear-gradient(135deg, #6c8cff 0%, #4db8ff 100%);
}

html[data-theme="dark"] body {
  background:
    radial-gradient(circle at top left, rgba(108, 140, 255, 0.24), transparent 30%),
    radial-gradient(circle at top right, rgba(77, 184, 255, 0.18), transparent 24%),
    var(--app-gradient);
}

html[data-theme="dark"] a {
  color: #8eb2ff;
}

html[data-theme="dark"] a:hover {
  color: #b4cbff;
}

html[data-theme="dark"] .page-title,
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6,
html[data-theme="dark"] .app-brand,
html[data-theme="dark"] .app-brand:hover,
html[data-theme="dark"] .app-navbar .nav-link:hover,
html[data-theme="dark"] .app-navbar .nav-link:focus,
html[data-theme="dark"] .app-navbar .nav-link.active {
  color: #f4f7ff;
}

html[data-theme="dark"] .app-navbar {
  background: rgba(10, 19, 35, 0.82) !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.32);
}

html[data-theme="dark"] .app-navbar .nav-link {
  color: #b4c0d9;
}

html[data-theme="dark"] .app-navbar .nav-link:hover,
html[data-theme="dark"] .app-navbar .nav-link:focus,
html[data-theme="dark"] .app-navbar .nav-link.active {
  background-color: rgba(108, 140, 255, 0.16);
}

html[data-theme="dark"] .app-navbar .navbar-toggler,
html[data-theme="dark"] .app-theme-toggle {
  background: rgba(108, 140, 255, 0.12);
  border-color: rgba(108, 140, 255, 0.16);
}

html[data-theme="dark"] .app-brand-mark {
  color: #101826;
}

html[data-theme="dark"] .card,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .list-group-item,
html[data-theme="dark"] .accordion-item,
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] .searchable-dropdown__trigger,
html[data-theme="dark"] .searchable-dropdown__menu,
html[data-theme="dark"] .searchable-dropdown__search,
html[data-theme="dark"] .accordion-button {
  background: var(--app-surface-strong);
  color: var(--bs-body-color);
}

html[data-theme="dark"] .card-header,
html[data-theme="dark"] .modal-header {
  background: linear-gradient(180deg, rgba(108, 140, 255, 0.18), rgba(108, 140, 255, 0.04));
}

html[data-theme="dark"] .form-control::placeholder,
html[data-theme="dark"] textarea::placeholder,
html[data-theme="dark"] .autosuggest-input__field::placeholder,
html[data-theme="dark"] .searchable-dropdown__search::placeholder {
  color: #aebbd6;
  opacity: 1;
}

html[data-theme="dark"] .dropdown-item,
html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .form-text,
html[data-theme="dark"] .form-label-hint,
html[data-theme="dark"] .table thead th {
  color: var(--app-text-muted) !important;
}

html[data-theme="dark"] .dropdown-item:hover,
html[data-theme="dark"] .dropdown-item:focus {
  background: rgba(108, 140, 255, 0.12);
  color: #f4f7ff !important;
}

html[data-theme="dark"] .searchable-dropdown__menu {
  border-color: rgba(137, 161, 206, 0.24);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.34);
}

html[data-theme="dark"] .searchable-dropdown__search {
  border-color: rgba(137, 161, 206, 0.24);
}

html[data-theme="dark"] .searchable-dropdown__option,
html[data-theme="dark"] .searchable-dropdown__empty {
  color: var(--bs-body-color);
}

html[data-theme="dark"] .searchable-dropdown__option-subtitle {
  color: var(--app-text-muted);
}

html[data-theme="dark"] .autosuggest-input__field {
  background: var(--app-surface-strong);
  border-color: rgba(137, 161, 206, 0.24);
  color: var(--bs-body-color);
}

html[data-theme="dark"] .autosuggest-input__field:focus {
  border-color: rgba(108, 140, 255, 0.42);
  box-shadow: 0 0 0 0.3rem rgba(108, 140, 255, 0.18);
}

html[data-theme="dark"] .autosuggest-input__panel {
  background: rgba(17, 29, 52, 0.98);
  border-color: rgba(137, 161, 206, 0.24);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.34);
}

html[data-theme="dark"] .autosuggest-input__item,
html[data-theme="dark"] .autosuggest-input__empty {
  color: var(--bs-body-color);
}

html[data-theme="dark"] .autosuggest-input__item:hover,
html[data-theme="dark"] .autosuggest-input__item:focus,
html[data-theme="dark"] .autosuggest-input__item.is-selected {
  background: rgba(108, 140, 255, 0.12);
}

html[data-theme="dark"] .searchable-dropdown__option:hover,
html[data-theme="dark"] .searchable-dropdown__option:focus,
html[data-theme="dark"] .searchable-dropdown__option.is-selected {
  background: rgba(108, 140, 255, 0.12);
}

html[data-theme="dark"] .searchable-dropdown__clear {
  border-color: rgba(217, 75, 99, 0.28);
  background: rgba(217, 75, 99, 0.12);
  color: #ffafbf;
}

html[data-theme="dark"] .searchable-dropdown__clear:hover,
html[data-theme="dark"] .searchable-dropdown__clear:focus {
  background: rgba(217, 75, 99, 0.2);
  border-color: rgba(217, 75, 99, 0.36);
}

html[data-theme="dark"] .table {
  --bs-table-color: var(--bs-body-color);
  --bs-table-border-color: rgba(137, 161, 206, 0.14);
  --bs-table-hover-bg: rgba(108, 140, 255, 0.08);
  --bs-table-hover-color: var(--bs-body-color);
}

html[data-theme="dark"] .table-hover > tbody > tr:hover > * {
  color: var(--bs-body-color);
}

html[data-theme="dark"] .btn-outline-primary,
html[data-theme="dark"] .btn-outline-secondary,
html[data-theme="dark"] .btn-outline-success,
html[data-theme="dark"] .btn-outline-danger,
html[data-theme="dark"] .btn-outline-warning,
html[data-theme="dark"] .btn-outline-info {
  background: rgba(17, 29, 52, 0.78);
}

html[data-theme="dark"] .btn-outline-secondary {
  --bs-btn-color: #d3ddf2;
  --bs-btn-border-color: rgba(137, 161, 206, 0.32);
  --bs-btn-hover-bg: rgba(137, 161, 206, 0.16);
  --bs-btn-hover-border-color: rgba(137, 161, 206, 0.42);
  --bs-btn-hover-color: #f4f7ff;
  --bs-btn-active-bg: rgba(137, 161, 206, 0.22);
  --bs-btn-active-border-color: rgba(137, 161, 206, 0.48);
  --bs-btn-active-color: #f4f7ff;
}

html[data-theme="dark"] .btn-secondary {
  --bs-btn-bg: #2b3a57;
  --bs-btn-border-color: #2b3a57;
  --bs-btn-hover-bg: #34476b;
  --bs-btn-hover-border-color: #34476b;
  --bs-btn-active-bg: #3b527c;
  --bs-btn-active-border-color: #3b527c;
}

html[data-theme="dark"] .alert-info {
  background: rgba(108, 140, 255, 0.15);
  border-color: rgba(108, 140, 255, 0.22);
  color: #cbd8ff;
}

html[data-theme="dark"] .alert-success {
  background: rgba(35, 193, 132, 0.12);
  border-color: rgba(35, 193, 132, 0.18);
  color: #8ce9bd;
}

html[data-theme="dark"] .alert-warning {
  background: rgba(240, 173, 48, 0.14);
  border-color: rgba(240, 173, 48, 0.18);
  color: #ffd78b;
}

html[data-theme="dark"] .alert-danger {
  background: rgba(217, 75, 99, 0.14);
  border-color: rgba(217, 75, 99, 0.18);
  color: #ffafbf;
}

html[data-theme="dark"] .btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
}

html[data-theme="dark"] .page-link {
  background: var(--app-surface-strong);
  color: #d3ddf2;
  border-color: rgba(137, 161, 206, 0.2);
}

html[data-theme="dark"] .page-link:hover,
html[data-theme="dark"] .page-link:focus {
  background: rgba(108, 140, 255, 0.12);
  color: #f4f7ff;
  border-color: rgba(137, 161, 206, 0.28);
}

html[data-theme="dark"] .page-item.disabled .page-link {
  background: var(--app-surface-strong);
  color: #9aa9c6;
  border-color: rgba(137, 161, 206, 0.16);
}

html[data-theme="dark"] .feature-requests-hero {
  background:
    radial-gradient(circle at top right, rgba(77, 184, 255, 0.18), transparent 28%),
    linear-gradient(145deg, rgba(17, 29, 52, 0.82), rgba(17, 29, 52, 0.56));
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.28);
}

html[data-theme="dark"] .feature-requests-stat {
  background: rgba(17, 29, 52, 0.82);
}

html[data-theme="dark"] .feature-requests-stat__value,
html[data-theme="dark"] .feature-request-title {
  color: #f4f7ff;
}

html[data-theme="dark"] .feature-request-card {
  background: var(--app-surface-strong);
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.3);
}

html[data-theme="dark"] .feature-request-card:hover {
  box-shadow: 0 26px 58px rgba(0, 0, 0, 0.34);
}

html[data-theme="dark"] .votes-count,
html[data-theme="dark"] .expand-button {
  background: rgba(108, 140, 255, 0.14);
}

html[data-theme="dark"] .status-pending {
  background: rgba(240, 173, 48, 0.16);
  color: #ffd78b;
}

html[data-theme="dark"] .status-rolledout {
  background: rgba(35, 193, 132, 0.16);
  color: #8ce9bd;
}

html[data-theme="dark"] .feature-request-actions {
  border-top-color: rgba(137, 161, 206, 0.16);
}

html[data-theme="dark"] .btn-voted,
html[data-theme="dark"] .btn-vote:disabled {
  --bs-btn-bg: #2b3a57;
  --bs-btn-border-color: #2b3a57;
  --bs-btn-hover-bg: #2b3a57;
  --bs-btn-hover-border-color: #2b3a57;
  --bs-btn-active-bg: #2b3a57;
  --bs-btn-active-border-color: #2b3a57;
  --bs-btn-color: #d3ddf2;
}

html[data-theme="dark"] .feature-requests-empty-state {
  background: rgba(13, 24, 44, 0.52);
  border-color: rgba(137, 161, 206, 0.24);
}

html[data-theme="dark"] .feature-requests-empty-state__icon {
  background: rgba(108, 140, 255, 0.14);
}

html[data-theme="dark"] .border-top,
html[data-theme="dark"] hr {
  border-color: rgba(137, 161, 206, 0.14) !important;
}

html[data-theme="dark"] .campaigns-traffic-toggle {
  color: var(--bs-body-color);
}

html[data-theme="dark"] .campaigns-traffic-toggle__title {
  color: #f4f7ff;
}

html[data-theme="dark"] .campaigns-traffic-toggle__subtitle {
  color: var(--app-text-muted) !important;
}

html[data-theme="dark"] .campaigns-traffic-chart__grid-line {
  stroke: rgba(137, 161, 206, 0.08);
}

html[data-theme="dark"] .campaigns-traffic-chart__axis-line {
  stroke: rgba(137, 161, 206, 0.14);
}

html[data-theme="dark"] .campaigns-traffic-chart__legend-item {
  background: rgba(17, 29, 52, 0.88) !important;
  border-color: rgba(137, 161, 206, 0.18) !important;
}

html[data-theme="dark"] .reports-table .reports-table__group-separator {
  border-left-color: rgba(137, 161, 206, 0.34);
}

html[data-theme="dark"] .reports-presets-manager-item {
  background: rgba(17, 29, 52, 0.88);
  border-color: rgba(137, 161, 206, 0.24);
}

html[data-theme="dark"] .reports-presets-manager-handle {
  color: #9aa9c6;
}

html[data-theme="dark"] .config-preview {
  background: rgba(17, 29, 52, 0.88);
  border-color: rgba(137, 161, 206, 0.24);
  color: var(--bs-body-color);
}