/*
 * Admin theme refinements.
 * The active theme continues to use html[data-theme] and localStorage("theme").
 */

:root {
    color-scheme: light;
    --admin-bg: #f5f6fa;
    --admin-surface: #ffffff;
    --admin-surface-raised: #f8fafc;
    --admin-text: #0f172a;
    --admin-muted: #475569;
    --admin-border: rgba(148, 163, 184, 0.35);
    --admin-focus: #2563eb;
    --admin-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
}

html[data-theme="dark"] {
    color-scheme: dark;
    --admin-bg: #111827;
    --admin-surface: #1e293b;
    --admin-surface-raised: #263449;
    --admin-text: #f8fafc;
    --admin-muted: #cbd5e1;
    --admin-border: rgba(148, 163, 184, 0.24);
    --admin-focus: #60a5fa;
    --admin-shadow: 0 16px 38px rgba(2, 6, 23, 0.28);

    /* Map the existing template tokens to the consolidated admin palette. */
    --bg-color: var(--admin-bg);
    --white: var(--admin-surface);
    --black: var(--admin-text);
    --text-primary-light: var(--admin-text);
    --text-secondary-light: var(--admin-muted);
    --input-bg: var(--admin-surface-raised);
    --input-form-light: #64748b;
    --input-form-dark: var(--admin-muted);
    --input-stroke: var(--admin-border);
    --border-color: var(--admin-border);
}

html.theme-initializing *,
html.theme-initializing *::before,
html.theme-initializing *::after {
    transition: none !important;
}

html:not(.theme-initializing) body,
html:not(.theme-initializing) .navbar-header,
html:not(.theme-initializing) .sidebar,
html:not(.theme-initializing) .card,
html:not(.theme-initializing) .dropdown-menu,
html:not(.theme-initializing) .modal-content,
html:not(.theme-initializing) .form-control,
html:not(.theme-initializing) .form-select {
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease,
        box-shadow 0.2s ease;
}

body :is(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid rgba(37, 99, 235, 0.38);
    outline-offset: 2px;
}

html[data-theme="dark"] body :is(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline-color: rgba(96, 165, 250, 0.55);
}

[data-theme-toggle] {
    border: 1px solid transparent;
}

[data-theme-toggle][data-theme-icon="dark"]::after,
html[data-theme="dark"] [data-theme-toggle]::after {
    content: "\ef6f";
    color: #f8fafc;
}

[data-theme-toggle][data-theme-icon="light"]::after {
    content: "\f1bf";
    color: var(--text-primary-light);
}

html[data-theme="dark"] body,
html[data-theme="dark"] .dashboard-main,
html[data-theme="dark"] .dashboard-main-body {
    background-color: var(--admin-bg);
    color: var(--admin-muted);
}

html[data-theme="dark"] .navbar-header,
html[data-theme="dark"] .sidebar,
html[data-theme="dark"] .card,
html[data-theme="dark"] .card .card-header,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .dropdown-menu {
    border-color: var(--admin-border);
    background-color: var(--admin-surface);
    color: var(--admin-muted);
}

html[data-theme="dark"] .navbar-header {
    box-shadow: 0 8px 24px rgba(2, 6, 23, 0.2);
}

html[data-theme="dark"] .sidebar {
    border-inline-end: 1px solid var(--admin-border);
}

html[data-theme="dark"] .card {
    border: 1px solid var(--admin-border);
    box-shadow: var(--admin-shadow);
}

html[data-theme="dark"] :is(h1, h2, h3, h4, h5, h6, .card-title, .modal-title) {
    color: var(--admin-text);
}

/* Division member count button */
.division-user-button {
    border-color: #bfdbfe !important;
    background-color: #eff6ff !important;
    color: #1d4ed8 !important;
    box-shadow: 0 4px 10px rgba(37, 99, 235, 0.1) !important;
    transition: background-color 0.2s ease, border-color 0.2s ease,
        color 0.2s ease, box-shadow 0.2s ease;
}

.division-user-button:hover,
.division-user-button:focus-visible {
    border-color: #93c5fd !important;
    background-color: #dbeafe !important;
    color: #1e40af !important;
    box-shadow: 0 6px 14px rgba(37, 99, 235, 0.18) !important;
}

.division-user-button iconify-icon {
    color: currentColor;
}

html[data-theme="dark"] .division-user-button {
    border-color: rgba(96, 165, 250, 0.42) !important;
    background-color: rgba(37, 99, 235, 0.2) !important;
    color: #bfdbfe !important;
    box-shadow: 0 4px 12px rgba(2, 6, 23, 0.3) !important;
}

html[data-theme="dark"] .division-user-button:hover,
html[data-theme="dark"] .division-user-button:focus-visible {
    border-color: rgba(147, 197, 253, 0.72) !important;
    background-color: rgba(59, 130, 246, 0.32) !important;
    color: #eff6ff !important;
    box-shadow: 0 6px 16px rgba(2, 6, 23, 0.42) !important;
}

html[data-theme="dark"] :is(.dropdown-item, .dropdown-item-text) {
    color: var(--admin-muted);
}

html[data-theme="dark"] .dropdown-item:hover,
html[data-theme="dark"] .dropdown-item:focus {
    background-color: var(--admin-surface-raised);
    color: var(--admin-text);
}

html[data-theme="dark"] :is(.form-control, .form-select, textarea, .dt-input) {
    border-color: #64748b;
    background-color: var(--admin-surface-raised);
    color: var(--admin-text);
}



html[data-theme="dark"] :is(.form-control, .form-select, textarea, .dt-input):focus {
    border-color: var(--admin-focus);
    background-color: var(--admin-surface-raised);
    box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.22);
}

html[data-theme="dark"] :is(.form-control, textarea)::placeholder {
    color: #94a3b8;
    opacity: 1;
}

html[data-theme="dark"] :is(.form-select, select, option) {
    background-color: var(--admin-surface-raised);
    color: var(--admin-text);
}

html[data-theme="dark"] .table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--admin-muted);
    --bs-table-border-color: var(--admin-border);
    --bs-table-hover-bg: rgba(96, 165, 250, 0.08);
    --bs-table-hover-color: var(--admin-text);
    color: var(--admin-muted);
}

html[data-theme="dark"] .table > :not(caption) > * > * {
    border-color: var(--admin-border);
    background-color: transparent;
    color: inherit;
}

html[data-theme="dark"] :is(.table, .dataTable, .colored-row-table) thead th {
    border-color: var(--admin-border);
    background-color: var(--admin-surface-raised);
    color: var(--admin-text);
}

html[data-theme="dark"] :is(.table, .dataTable, .colored-row-table) tbody tr:hover td {
    background-color: rgba(96, 165, 250, 0.06);
}

html[data-theme="dark"] .page-link,
html[data-theme="dark"] div.dt-container .dt-paging .dt-paging-button {
    border-color: var(--admin-border);
    background-color: var(--admin-surface);
    color: var(--admin-muted);
}

html[data-theme="dark"] .page-link:hover,
html[data-theme="dark"] .page-item.active .page-link,
html[data-theme="dark"] div.dt-container .dt-paging .dt-paging-button.current {
    border-color: var(--admin-focus);
    background-color: #1d4ed8;
    color: #ffffff;
}

html[data-theme="dark"] :is(.modal-header, .modal-footer) {
    border-color: var(--admin-border);
}

html[data-theme="dark"] .swal2-popup {
    border: 1px solid var(--admin-border);
    background: var(--admin-surface);
    color: var(--admin-muted);
}

html[data-theme="dark"] :is(.swal2-title, .swal2-html-container) {
    color: var(--admin-text);
}

html[data-theme="dark"] :is(.ql-toolbar.ql-snow, .ql-container.ql-snow) {
    border-color: var(--admin-border);
    background-color: var(--admin-surface-raised);
    color: var(--admin-text);
}

/* CKEditor 4 renders its toolbar in this document and its editable content in an iframe. */
html[data-theme="dark"] .cke_chrome {
    border-color: #64748b;
    background: var(--admin-surface-raised);
    box-shadow: none;
}

html[data-theme="dark"] :is(.cke_inner, .cke_top, .cke_bottom) {
    border-color: var(--admin-border);
    background: var(--admin-surface-raised);
    color: var(--admin-text);
}

html[data-theme="dark"] :is(.cke_toolgroup, .cke_combo_button) {
    border-color: var(--admin-border);
    background: var(--admin-surface);
    box-shadow: none;
}

html[data-theme="dark"] :is(
    .cke_button_off:hover,
    .cke_button_off:focus,
    .cke_button_off:active,
    .cke_button_on,
    .cke_combo_off a.cke_combo_button:hover,
    .cke_combo_off a.cke_combo_button:focus,
    .cke_combo_on a.cke_combo_button
) {
    border-color: #64748b;
    background: #334155;
    box-shadow: none;
}

html[data-theme="dark"] :is(.cke_combo_text, .cke_path_item, .cke_path_empty) {
    color: var(--admin-text);
    text-shadow: none;
}

html[data-theme="dark"] :is(.cke_button_icon, .cke_combo_open, .cke_resizer) {
    filter: invert(1) brightness(1.35);
}

html[data-theme="dark"] :is(.cke_toolbar_separator, .cke_combo_separator) {
    border-color: var(--admin-border);
    background-color: var(--admin-border);
}

html[data-theme="dark"] .cke_wysiwyg_frame {
    background-color: var(--admin-surface-raised);
}

html[data-theme="dark"] :is(.flatpickr-calendar, .flatpickr-months, .flatpickr-innerContainer) {
    border-color: var(--admin-border);
    background: var(--admin-surface);
    color: var(--admin-text);
}

html[data-theme="dark"] :is(.flatpickr-day, .flatpickr-weekday, .flatpickr-current-month) {
    color: var(--admin-muted);
}

html[data-theme="dark"] .apexcharts-xaxis-label,
html[data-theme="dark"] .apexcharts-yaxis-label,
html[data-theme="dark"] .apexcharts-text,
html[data-theme="dark"] .apexcharts-legend-text {
    fill: var(--admin-muted);
    color: var(--admin-muted);
}

html[data-theme="dark"] .apexcharts-gridline {
    stroke: var(--admin-border);
}

html[data-theme="dark"] .apexcharts-tooltip,
html[data-theme="dark"] .apexcharts-tooltip.apexcharts-theme-light,
html[data-theme="dark"] .apexcharts-menu {
    border-color: var(--admin-border);
    background: var(--admin-surface-raised);
    color: var(--admin-text);
    box-shadow: var(--admin-shadow);
}

html[data-theme="dark"] .apexcharts-tooltip-title {
    border-color: var(--admin-border);
    background: var(--admin-surface);
    color: var(--admin-text);
}

/* Dashboard statistic cards */

.admin-stat-card {
    border: 1px solid transparent;
}

.admin-stat-card__title {
    color: #475569;
}

.admin-stat-card__value {
    color: #0f172a;
    font-size: clamp(1.5rem, 2vw, 1.875rem);
    line-height: 1.15;
}

.admin-stat-card__description {
    color: #475569;
}

.admin-stat-card__icon {
    border: 1px solid currentColor;
}

.admin-stat-card--blue .admin-stat-card__icon {
    background: #dbeafe;
    color: #2563eb;
}

.admin-stat-card--purple .admin-stat-card__icon {
    background: #ede9fe;
    color: #7c3aed;
}

.admin-stat-card--green .admin-stat-card__icon {
    background: #dcfce7;
    color: #15803d;
}

.admin-stat-card--orange .admin-stat-card__icon {
    background: #ffedd5;
    color: #c2410c;
}

html[data-theme="dark"] .admin-stat-card {
    background: var(--admin-stat-bg);
    border-color: var(--admin-stat-border);
    box-shadow: 0 14px 30px rgba(2, 6, 23, 0.2);
}

html[data-theme="dark"] .admin-stat-card--blue {
    --admin-stat-bg: linear-gradient(135deg, rgba(30, 64, 175, 0.4), rgba(30, 41, 59, 0.97));
    --admin-stat-border: rgba(96, 165, 250, 0.42);
    --admin-stat-accent: #93c5fd;
    --admin-stat-icon-bg: rgba(37, 99, 235, 0.28);
}

html[data-theme="dark"] .admin-stat-card--purple {
    --admin-stat-bg: linear-gradient(135deg, rgba(88, 28, 135, 0.42), rgba(30, 41, 59, 0.97));
    --admin-stat-border: rgba(192, 132, 252, 0.4);
    --admin-stat-accent: #d8b4fe;
    --admin-stat-icon-bg: rgba(147, 51, 234, 0.26);
}

html[data-theme="dark"] .admin-stat-card--green {
    --admin-stat-bg: linear-gradient(135deg, rgba(6, 95, 70, 0.42), rgba(30, 41, 59, 0.97));
    --admin-stat-border: rgba(52, 211, 153, 0.4);
    --admin-stat-accent: #6ee7b7;
    --admin-stat-icon-bg: rgba(5, 150, 105, 0.25);
}

html[data-theme="dark"] .admin-stat-card--orange {
    --admin-stat-bg: linear-gradient(135deg, rgba(154, 52, 18, 0.4), rgba(30, 41, 59, 0.97));
    --admin-stat-border: rgba(251, 146, 60, 0.42);
    --admin-stat-accent: #fdba74;
    --admin-stat-icon-bg: rgba(234, 88, 12, 0.25);
}

html[data-theme="dark"] .admin-stat-card__title {
    color: #e5e7eb;
}

html[data-theme="dark"] .admin-stat-card__value {
    color: #ffffff;
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.22);
}

html[data-theme="dark"] .admin-stat-card__description {
    color: #cbd5e1;
}

html[data-theme="dark"] .admin-stat-card__icon {
    border-color: var(--admin-stat-border);
    background: var(--admin-stat-icon-bg);
    color: var(--admin-stat-accent);
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}