/* SF-SPORT theme layer
   One file controls light/dark colors across dashboard surfaces. */

:root,
:root[data-theme="light"] {
    color-scheme: light;
    --color-bg: #ffffff;
    --color-bg-muted: #f5f7fb;
    --color-surface: #ffffff;
    --color-surface-raised: #fbfcff;
    --color-text: #111827;
    --color-text-muted: #667085;
    --color-primary: #0f8f72;
    --color-primary-dark: #096956;
    --color-primary-soft: #dff7ef;
    --color-accent: #2563eb;
    --color-accent-soft: #eaf1ff;
    --color-border: #dde5ef;
    --color-success: #0f8f72;
    --color-error: #b42318;
    --color-warning: #9a5b00;
    --theme-focus: rgba(15, 143, 114, 0.18);
    --theme-shadow: 0 12px 32px rgba(16, 24, 40, 0.07);
    --theme-shadow-strong: 0 22px 60px rgba(16, 24, 40, 0.14);
    --theme-body-bg: linear-gradient(180deg, #f7fafc 0%, #eef4f8 100%);
    --theme-topbar-bg: rgba(255, 255, 255, 0.92);
    --theme-card-bg: rgba(255, 255, 255, 0.96);
    --theme-card-border: rgba(221, 229, 239, 0.95);
    --theme-input-bg: #ffffff;
    --theme-table-head-bg: #f6f8fb;
    --theme-table-hover-bg: #fbfdfc;
    --theme-sidebar-bg: #0f172a;
    --theme-sidebar-border: rgba(255, 255, 255, 0.06);
    --theme-sidebar-text: #94a3b8;
    --theme-sidebar-text-strong: #f8fafc;
    --theme-sidebar-muted: #64748b;
    --theme-sidebar-hover-bg: rgba(255, 255, 255, 0.07);
    --theme-sidebar-active-bg: rgba(99, 102, 241, 0.18);
    --theme-sidebar-active-text: #c4d0ff;
    --theme-success-bg: #dff7ef;
    --theme-success-text: #067356;
    --theme-warning-bg: #fff3d6;
    --theme-warning-text: #9a5b00;
    --theme-error-bg: #ffe4e4;
    --theme-error-text: #b42318;
    --theme-neutral-bg: #f1f5f9;
    --theme-neutral-text: #475569;
}

:root[data-theme="dark"] {
    color-scheme: dark;
    --color-bg: #0b1220;
    --color-bg-muted: #070d18;
    --color-surface: #111827;
    --color-surface-raised: #162033;
    --color-text: #eef4ff;
    --color-text-muted: #aab7ca;
    --color-primary: #28d2a3;
    --color-primary-dark: #72f2cf;
    --color-primary-soft: rgba(40, 210, 163, 0.16);
    --color-accent: #7aa7ff;
    --color-accent-soft: rgba(122, 167, 255, 0.16);
    --color-border: #2a384d;
    --color-success: #5ee2af;
    --color-error: #ff9b9b;
    --color-warning: #ffd37a;
    --theme-focus: rgba(40, 210, 163, 0.24);
    --theme-shadow: 0 14px 36px rgba(0, 0, 0, 0.38);
    --theme-shadow-strong: 0 26px 70px rgba(0, 0, 0, 0.48);
    --theme-body-bg: linear-gradient(180deg, #08101d 0%, #0b1220 100%);
    --theme-topbar-bg: rgba(12, 20, 34, 0.92);
    --theme-card-bg: rgba(17, 24, 39, 0.96);
    --theme-card-border: rgba(83, 103, 132, 0.58);
    --theme-input-bg: #0f172a;
    --theme-table-head-bg: #162033;
    --theme-table-hover-bg: rgba(122, 167, 255, 0.08);
    --theme-sidebar-bg: #070d18;
    --theme-sidebar-border: rgba(148, 163, 184, 0.16);
    --theme-sidebar-text: #b7c3d7;
    --theme-sidebar-text-strong: #ffffff;
    --theme-sidebar-muted: #8ea0bb;
    --theme-sidebar-hover-bg: rgba(255, 255, 255, 0.08);
    --theme-sidebar-active-bg: rgba(40, 210, 163, 0.18);
    --theme-sidebar-active-text: #8df6d7;
    --theme-success-bg: rgba(40, 210, 163, 0.18);
    --theme-success-text: #8df6d7;
    --theme-warning-bg: rgba(255, 211, 122, 0.16);
    --theme-warning-text: #ffd37a;
    --theme-error-bg: rgba(255, 155, 155, 0.16);
    --theme-error-text: #ffb4b4;
    --theme-neutral-bg: #182235;
    --theme-neutral-text: #cbd5e1;
}

body.site-body {
    background: var(--theme-body-bg);
    color: var(--color-text);
}

.topbar {
    background: var(--theme-topbar-bg);
    border-bottom-color: var(--color-border);
}

.topbar__brand,
.topbar__link,
.portal-nav__link,
.card,
.data-table,
.form-group__label,
.filter-field__label,
.portal__title,
.portal-section__title,
.auth-card__title {
    color: var(--color-text);
}

.topbar__link:hover,
.portal-section__title a:hover,
.btn-link {
    color: var(--color-primary-dark);
}

.text-muted,
.portal__subtitle,
.academy-detail__meta,
.form-group__help,
.finance-kpi-card span,
.finance-detail-card span,
.finance-detail-card small {
    color: var(--color-text-muted);
}

.card,
.auth-card,
.portal-section,
.data-table-wrap,
.stat-card,
.finance-kpi-card,
.finance-detail-card,
.finance-gateway-item {
    background: var(--theme-card-bg);
    border-color: var(--theme-card-border);
    box-shadow: var(--theme-shadow);
}

.btn--primary {
    background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
    color: #ffffff;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--color-primary) 24%, transparent);
}

.btn--primary:hover {
    background: linear-gradient(135deg, var(--color-primary-dark), var(--color-accent));
    color: #ffffff;
}

.btn--ghost {
    background: var(--color-surface);
    color: var(--color-text);
    border-color: var(--color-border);
}

.btn--ghost:hover {
    background: var(--color-primary-soft);
    color: var(--color-primary-dark);
    border-color: color-mix(in srgb, var(--color-primary) 45%, var(--color-border));
}

.lang-toggle,
.filter-field__input,
.form-group input,
.form-group select,
.form-group textarea,
.auth-form input[type="text"],
.auth-form input[type="email"],
.auth-form input[type="password"],
.auth-form select,
input,
select,
textarea {
    background: var(--theme-input-bg);
    color: var(--color-text);
    border-color: var(--color-border);
}

.lang-toggle:focus-visible,
.filter-field__input:focus,
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus,
input:focus,
select:focus,
textarea:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--theme-focus);
    outline: none;
}

.data-table th {
    background: var(--theme-table-head-bg);
    color: var(--color-text-muted);
    border-bottom-color: var(--color-border);
}

.data-table td {
    color: var(--color-text);
    border-bottom-color: var(--color-border);
}

.data-table tbody tr:hover td {
    background: var(--theme-table-hover-bg);
}

.status--active,
.status--paid {
    background: var(--theme-success-bg);
    color: var(--theme-success-text);
}

.status--pending,
.status--partial {
    background: var(--theme-warning-bg);
    color: var(--theme-warning-text);
}

.status--unpaid,
.status--expired,
.status--cancelled {
    background: var(--theme-error-bg);
    color: var(--theme-error-text);
}

.status {
    background: var(--theme-neutral-bg);
    color: var(--theme-neutral-text);
}

.site-footer {
    background: var(--color-surface);
    border-top-color: var(--color-border);
    color: var(--color-text-muted);
}

.theme-toggle {
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    color: var(--color-text);
    border-radius: 999px;
    width: 38px;
    height: 38px;
    min-height: 38px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-family: inherit;
    font-weight: 800;
    line-height: 1;
    transition: background 0.16s ease, color 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
}

.theme-toggle:hover {
    background: var(--color-primary-soft);
    color: var(--color-primary-dark);
    border-color: color-mix(in srgb, var(--color-primary) 42%, var(--color-border));
    transform: translateY(-1px);
}

.theme-toggle__icon {
    font-size: 1.05rem;
    line-height: 1;
}

.entity-picker-modal {
    position: fixed;
    inset: 0;
    z-index: 2500;
    display: grid;
    place-items: center;
    min-height: 100dvh;
    padding: clamp(1rem, 4vw, 2rem);
    opacity: 0;
    pointer-events: none;
    overflow-y: auto;
    transition: opacity 0.18s ease;
}

.entity-picker-modal.is-open {
    opacity: 1;
    pointer-events: auto;
}

.entity-picker-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(2, 6, 23, 0.68);
    backdrop-filter: blur(8px);
}

.entity-picker-modal__card {
    position: relative;
    width: min(720px, 100%);
    max-height: calc(100dvh - 2rem);
    overflow-y: auto;
    padding: clamp(1.15rem, 3vw, 1.7rem);
    border: 1px solid color-mix(in srgb, var(--color-primary) 18%, var(--color-border));
    border-radius: 22px;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--color-primary-soft) 22%, transparent), transparent 34%),
        var(--color-surface);
    color: var(--color-text);
    box-shadow: var(--theme-shadow-strong);
}

.entity-picker-modal__close {
    position: absolute;
    inset-block-start: 0.85rem;
    inset-inline-end: 0.85rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.1rem;
    height: 2.1rem;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    background: var(--color-surface);
    color: var(--color-text);
    font: inherit;
    font-size: 1.35rem;
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
}

.entity-picker-modal__eyebrow {
    display: inline-flex;
    width: fit-content;
    margin-bottom: 0.7rem;
    padding: 0.28rem 0.65rem;
    border-radius: 999px;
    background: var(--color-primary-soft);
    color: var(--color-primary-dark);
    font-size: 0.76rem;
    font-weight: 900;
}

.entity-picker-modal h2 {
    margin: 0;
    padding-inline-end: 2.6rem;
    margin-bottom: 1.05rem;
    color: var(--color-text);
    font-size: clamp(1.35rem, 2.6vw, 1.85rem);
    font-weight: 900;
    line-height: 1.3;
    letter-spacing: 0;
}

.entity-picker-modal__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.entity-picker-option {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.85rem;
    align-items: center;
    min-height: 142px;
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--color-primary) 18%, var(--theme-card-border));
    border-radius: 20px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(248, 250, 252, 0.86)),
        var(--theme-card-bg);
    color: var(--color-text);
    text-decoration: none;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08);
    transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.entity-picker-option:hover {
    transform: translateY(-3px);
    border-color: color-mix(in srgb, var(--color-primary) 42%, var(--color-border));
    box-shadow: 0 22px 46px color-mix(in srgb, var(--color-primary) 16%, transparent);
}

.entity-picker-option__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4.1rem;
    height: 4.1rem;
    border-radius: 18px;
    background:
        radial-gradient(circle at 35% 25%, rgba(255, 255, 255, 0.82), transparent 34%),
        linear-gradient(135deg, #0f8f72, #1f6feb);
    color: #fff;
    box-shadow: inset 0 -12px 24px rgba(15, 23, 42, 0.16), 0 16px 28px rgba(15, 143, 114, 0.18);
}

.entity-picker-option__icon svg {
    width: 2rem;
    height: 2rem;
}

.entity-picker-option--gym .entity-picker-option__icon {
    background:
        radial-gradient(circle at 35% 25%, rgba(255, 255, 255, 0.82), transparent 34%),
        linear-gradient(135deg, #111827, #0f8f72);
}

.entity-picker-option__content {
    display: grid;
    gap: 0.34rem;
    min-width: 0;
}

.entity-picker-option strong {
    color: var(--color-text);
    font-size: 1.08rem;
    font-weight: 900;
    line-height: 1.35;
}

.entity-picker-option small {
    color: var(--color-text-muted);
    font-size: 0.84rem;
    font-weight: 700;
    line-height: 1.55;
}

.entity-picker-option__arrow {
    width: 2rem;
    height: 2rem;
    display: inline-grid;
    place-items: center;
    border-radius: 50%;
    background: color-mix(in srgb, var(--color-primary-soft) 72%, #fff);
    color: var(--color-primary-dark);
}

.entity-picker-option__arrow svg,
.entity-picker-modal__close svg {
    width: 1.15rem;
    height: 1.15rem;
}

html[dir="ltr"] .entity-picker-option__arrow svg {
    transform: scaleX(-1);
}

.google-map-picker {
    display: grid;
    gap: 0.5rem;
    margin-top: 0;
    padding: 0.7rem;
    border: 1px solid var(--color-border);
    border-radius: 16px;
    background: var(--theme-card-bg);
    box-shadow: var(--theme-shadow-sm);
}

.google-map-picker__canvas {
    width: 100%;
    min-height: 330px;
    border-radius: 12px;
    overflow: hidden;
    background: var(--theme-neutral-bg);
}

.google-address-search {
    display: block;
}

.google-address-preview {
    display: grid;
    gap: 0.2rem;
    padding: 0.75rem 0.85rem;
    border-radius: 12px;
    background: var(--theme-neutral-bg);
    color: var(--color-text);
}

.google-address-preview strong {
    font-size: 0.9rem;
    font-weight: 900;
}

.google-address-preview span {
    color: var(--color-text-muted);
    font-size: 0.82rem;
    font-weight: 700;
}

.google-address-preview.is-loading {
    opacity: 0.75;
}

.google-map-picker__hint {
    margin: 0;
    color: var(--color-text-muted);
    font-size: 0.82rem;
    font-weight: 700;
}

.wizard-country-note {
    display: grid;
    gap: 0.25rem;
    margin-bottom: 1rem;
    padding: 0.85rem 1rem;
    border: 1px solid var(--color-border);
    border-radius: 0.75rem;
    background: var(--color-bg-muted);
}

.wizard-country-note strong {
    color: var(--color-text);
    font-size: 0.9rem;
}

.wizard-country-note span {
    color: var(--color-text-muted);
    font-size: 0.88rem;
    line-height: 1.7;
}

/* Academy/control-panel shell */
.academy-portal {
    background: var(--color-bg-muted);
}

.academy-portal .portal__main {
    background: var(--color-bg-muted);
    color: var(--color-text);
    scrollbar-color: var(--color-border) transparent;
}

.academy-portal .academy-sidebar {
    background: var(--theme-sidebar-bg);
    border-inline-end-color: var(--theme-sidebar-border);
    scrollbar-color: var(--theme-sidebar-border) transparent;
}

.academy-sidebar__brand {
    border-bottom-color: var(--theme-sidebar-border);
}

.academy-sidebar__brand-name {
    color: var(--theme-sidebar-text-strong);
}

.academy-sidebar__brand-sub,
.acad-nav-section__label,
.academy-portal .academy-sidebar__role,
.academy-portal .portal-nav__title,
.academy-portal .portal-nav__link.acad-signout {
    color: var(--theme-sidebar-muted);
}

.academy-portal .portal-nav__link {
    color: var(--theme-sidebar-text);
}

.academy-portal .portal-nav__link:hover {
    background: var(--theme-sidebar-hover-bg);
    color: var(--theme-sidebar-text-strong);
}

.academy-portal .portal-nav__link.is-active {
    background: var(--theme-sidebar-active-bg);
    color: var(--theme-sidebar-active-text);
}

.academy-sidebar__foot {
    border-top-color: var(--theme-sidebar-border);
}

.acad-user-card {
    background: color-mix(in srgb, var(--theme-sidebar-text-strong) 7%, transparent);
}

.acad-user-name {
    color: var(--theme-sidebar-text-strong);
}

.academy-sidebar__foot .theme-toggle {
    width: 100%;
    margin-bottom: 0.5rem;
    background: color-mix(in srgb, var(--theme-sidebar-text-strong) 7%, transparent);
    color: var(--theme-sidebar-text-strong);
    border-color: var(--theme-sidebar-border);
}

.acad-topbar {
    background: var(--color-surface);
    border-bottom-color: var(--color-border);
}

.acad-topbar__breadcrumb,
.acad-topbar__breadcrumb a,
.acad-topbar__sep,
.acad-topbar .lang-toggle {
    color: var(--color-text-muted);
}

.acad-topbar__current,
.academy-portal .portal__title,
.academy-portal .portal-section__title,
.academy-portal .stat-card__value,
.finance-kpi-card strong,
.finance-detail-card strong,
.finance-gateway-panel h2,
.finance-section-head h2,
.finance-gateway-item span {
    color: var(--color-text);
}

.academy-portal .card,
.academy-portal .stat-card,
.academy-portal .finance-kpi-card,
.academy-portal .finance-gateway-item,
.academy-portal .directory__filters {
    background: var(--theme-card-bg);
    border-color: var(--theme-card-border);
}

.academy-portal .portal__header,
.academy-portal .portal-section__title,
.academy-portal .data-table th,
.academy-portal .data-table td {
    border-color: var(--color-border);
}

.academy-portal .data-table th {
    background: var(--theme-table-head-bg);
    color: var(--color-text-muted);
}

.academy-portal .data-table td,
.academy-portal .data-table a {
    color: var(--color-text);
}

.academy-portal .data-table a {
    color: var(--color-accent);
}

.academy-portal .data-table a:hover,
.finance-gateway-item strong {
    color: var(--color-primary-dark);
}

.academy-portal .data-table tbody tr:hover td {
    background: var(--theme-table-hover-bg);
}

.academy-help-modal__backdrop {
    background: rgba(2, 6, 23, 0.68);
}

.academy-help-modal__card {
    background: var(--color-surface);
    color: var(--color-text);
    border: 1px solid var(--color-border);
    box-shadow: var(--theme-shadow-strong);
}

.academy-help-modal__intro,
.academy-help-modal__list,
.academy-help-modal__eyebrow {
    color: var(--color-text-muted);
}

.academy-dashboard-v2,
.academy-portal {
    color: var(--color-text);
}

body:has(.academy-portal) .site-main,
.academy-portal,
.academy-portal .portal__main {
    background: var(--color-bg-muted);
}

.acad-command-hero {
    background:
        radial-gradient(circle at 12% 10%, color-mix(in srgb, var(--color-primary) 22%, transparent), transparent 30%),
        linear-gradient(135deg, var(--color-surface) 0%, var(--color-surface-raised) 58%, color-mix(in srgb, var(--color-accent) 10%, var(--color-surface)) 100%);
    border-color: var(--theme-card-border);
    box-shadow: var(--theme-shadow);
    color: var(--color-text);
}

.acad-command-hero::after {
    background: conic-gradient(from 180deg, color-mix(in srgb, var(--color-primary) 28%, transparent), color-mix(in srgb, var(--color-accent) 22%, transparent), transparent);
}

.acad-kicker,
.academy-screen-help,
.academy-help-modal__eyebrow {
    background: var(--color-primary-soft);
    color: var(--color-primary-dark);
    border-color: color-mix(in srgb, var(--color-primary) 38%, var(--color-border));
}

.academy-screen-help::before,
.academy-help-modal__list li::before {
    background: var(--color-primary);
    color: #ffffff;
}

.acad-command-hero h1,
.acad-command-hero__meta span,
.acad-metric strong,
.acad-panel__head h2,
.acad-progress-card strong,
.acad-session-row__body strong,
.acad-invoice-list strong,
.acad-team-list strong,
.acad-task-list a span:last-child,
.acad-empty-state strong,
.equipment-summary__card strong,
.academy-help-modal h2,
.academy-help-modal h3 {
    color: var(--color-text);
}

.acad-command-hero p,
.acad-metric__label,
.acad-metric small,
.acad-progress-card span,
.acad-session-row__body small,
.acad-invoice-list small,
.acad-team-list small,
.acad-empty-state span,
.equipment-summary__card span,
.academy-help-modal__list li,
.academy-help-modal__intro {
    color: var(--color-text-muted);
}

.acad-command-hero__meta span,
.acad-panel,
.acad-metric,
.acad-progress-card,
.acad-session-row,
.acad-invoice-list a,
.acad-task-list a,
.acad-team-list a,
.acad-module-grid a,
.acad-empty-state,
.equipment-summary__card,
.academy-help-modal__grid > div {
    background: var(--theme-card-bg);
    border-color: var(--theme-card-border);
    color: var(--color-text);
    box-shadow: var(--theme-shadow);
}

.acad-progress {
    background: var(--theme-neutral-bg);
}

.acad-progress span,
.acad-metric::before,
.stat-card::before {
    background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
}

.acad-session-row__time,
.acad-module-grid span,
.stat-card__icon {
    background: var(--color-primary-soft);
    color: var(--color-primary-dark);
}

.acad-session-row__attendance,
.acad-invoice-list b,
.acad-team-list b,
.acad-panel__head a {
    color: var(--color-primary-dark);
}

.acad-session-row:hover,
.acad-invoice-list a:hover,
.acad-task-list a:hover,
.acad-team-list a:hover,
.acad-module-grid a:hover,
.acad-quicklink:hover {
    border-color: color-mix(in srgb, var(--color-primary) 42%, var(--color-border));
    box-shadow: 0 10px 22px color-mix(in srgb, var(--color-primary) 14%, transparent);
}

.acad-money-card {
    background: linear-gradient(135deg, color-mix(in srgb, var(--color-primary) 35%, #06131f), color-mix(in srgb, var(--color-accent) 24%, #071420));
    color: #ffffff;
}

.acad-money-card span,
.acad-money-card small {
    color: rgba(255, 255, 255, 0.76);
}

.acad-money-card strong {
    color: #ffffff;
}

.academy-help-modal__close {
    background: var(--color-surface);
    color: var(--color-text);
    border-color: var(--color-border);
}

.academy-help-modal__grid > div {
    box-shadow: none;
}

.acad-task-list__dot {
    background: var(--theme-neutral-text);
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--theme-neutral-text) 16%, transparent);
}

.acad-task-list__dot.is-amber {
    background: var(--theme-warning-text);
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--theme-warning-text) 16%, transparent);
}

.acad-task-list__dot.is-blue {
    background: var(--color-accent);
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--color-accent) 16%, transparent);
}

.acad-task-list__dot.is-green {
    background: var(--color-primary);
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--color-primary) 16%, transparent);
}

:root[data-theme="dark"] .topbar__logo img,
:root[data-theme="dark"] .academy-sidebar__brand-logo img {
    filter: none;
}

:root[data-theme="dark"] .academy-portal .btn--danger {
    background: var(--theme-error-bg);
    border-color: color-mix(in srgb, var(--theme-error-text) 30%, var(--color-border));
    color: var(--theme-error-text);
}

@media (max-width: 768px) {
    .topbar__nav {
        background: var(--theme-topbar-bg);
        border: 1px solid var(--color-border);
    }

    .entity-picker-modal__grid {
        grid-template-columns: 1fr;
    }

    .entity-picker-modal__card {
        width: min(100%, 430px);
        max-height: calc(100dvh - 1.5rem);
    }

    .entity-picker-modal h2 {
        padding-inline-end: 2rem;
    }

    .entity-picker-option {
        min-height: 112px;
        border-radius: 18px;
        padding: 0.85rem;
    }

    .entity-picker-option__icon {
        width: 3.4rem;
        height: 3.4rem;
        border-radius: 16px;
        font-size: 1.45rem;
    }
}

/* 2026 dashboard shell refresh */
:root {
    --academy-app-bg: #eef4f3;
    --academy-app-bg-2: #f8fbfb;
    --academy-shell-border: #d8e4e1;
    --academy-sidebar-bg: #103b36;
    --academy-sidebar-bg-2: #122a3a;
    --academy-sidebar-panel: rgba(255, 255, 255, 0.08);
    --academy-sidebar-muted: #a8c7c1;
    --academy-sidebar-subtle: #789d97;
    --academy-sidebar-text: #e9fbf6;
    --academy-sidebar-active: rgba(52, 211, 153, 0.18);
    --academy-sidebar-active-border: rgba(52, 211, 153, 0.34);
}

:root[data-theme="dark"] {
    --academy-app-bg: #08111c;
    --academy-app-bg-2: #0c1724;
    --academy-shell-border: #1e3340;
    --academy-sidebar-bg: #071511;
    --academy-sidebar-bg-2: #0b1826;
    --academy-sidebar-panel: rgba(255, 255, 255, 0.07);
    --academy-sidebar-muted: #b8d7d1;
    --academy-sidebar-subtle: #7fa49d;
    --academy-sidebar-text: #eefdf8;
    --academy-sidebar-active: rgba(52, 211, 153, 0.2);
    --academy-sidebar-active-border: rgba(52, 211, 153, 0.38);
}

body:has(.academy-portal) .site-main,
.academy-portal,
.academy-portal .container.portal__layout {
    background: var(--academy-app-bg);
}

.academy-portal .academy-sidebar {
    width: 280px;
    min-width: 280px;
    height: 100dvh;
    max-height: 100dvh;
    overflow: hidden;
    padding: 0;
    border: 0;
    border-inline-end: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 0;
    background: linear-gradient(180deg, var(--academy-sidebar-bg) 0%, var(--academy-sidebar-bg-2) 100%);
    box-shadow: 18px 0 42px rgba(16, 58, 54, 0.13);
}

html[dir="rtl"] .academy-portal .academy-sidebar {
    border-inline-end: 0;
    border-inline-start: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: -18px 0 42px rgba(16, 58, 54, 0.13);
}

.academy-sidebar__brand {
    min-height: 74px;
    margin: 0;
    padding: 0.85rem 0.9rem;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0;
    background: transparent;
}

.academy-sidebar__brand-logo {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}

.academy-sidebar__brand-name {
    color: var(--academy-sidebar-text);
    font-size: 0.9rem;
    font-weight: 900;
}

.academy-sidebar__brand-sub {
    color: var(--academy-sidebar-muted);
    font-size: 0.72rem;
    font-weight: 800;
}

.academy-portal .portal-nav__links {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0.8rem 0.75rem 1rem;
    scroll-padding-top: 0.8rem;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.24) transparent;
}

.academy-portal .portal-nav__links::-webkit-scrollbar {
    width: 8px;
}

.academy-portal .portal-nav__links::-webkit-scrollbar-track {
    background: transparent;
}

.academy-portal .portal-nav__links::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.22);
}

.academy-portal .portal-nav__links .acad-nav-section__label:first-child {
    margin-top: 0;
}

.acad-nav-section__label {
    display: block;
    margin: 0.9rem 0 0.35rem;
    padding: 0 0.65rem;
    color: var(--academy-sidebar-subtle);
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: none;
}

.academy-portal .portal-nav__link {
    min-height: 42px;
    margin-bottom: 0.22rem;
    padding: 0.5rem 0.58rem;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: var(--academy-sidebar-muted);
    font-size: 0.82rem;
    font-weight: 800;
    gap: 0.58rem;
}

.academy-portal .portal-nav__link:hover {
    background: var(--academy-sidebar-panel);
    color: var(--academy-sidebar-text);
}

.academy-portal .portal-nav__link.is-active {
    background: var(--academy-sidebar-active);
    border-color: var(--academy-sidebar-active-border);
    color: var(--academy-sidebar-text);
    box-shadow: inset 3px 0 0 #34d399;
}

html[dir="rtl"] .academy-portal .portal-nav__link.is-active {
    box-shadow: inset -3px 0 0 #34d399;
}

.academy-portal .portal-nav__link .nav-icon,
.nav-icon {
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 8px;
    background: var(--academy-sidebar-panel);
    color: var(--academy-sidebar-text);
    font-size: 0.95rem;
    opacity: 1;
}

.academy-portal .portal-nav__link.is-active .nav-icon {
    background: rgba(52, 211, 153, 0.24);
}

.academy-sidebar__foot {
    flex: 0 0 auto;
    margin-top: 0;
    padding: 0.75rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(0, 0, 0, 0.1);
}

.acad-user-card {
    min-height: 42px;
    margin-bottom: 0.55rem;
    padding: 0.5rem 0.58rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: var(--academy-sidebar-panel);
}

.acad-user-avatar {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: linear-gradient(135deg, #34d399, #60a5fa);
}

.acad-user-name {
    color: var(--academy-sidebar-text);
    font-size: 0.8rem;
    font-weight: 900;
}

.academy-sidebar__foot .theme-toggle {
    width: 100%;
    justify-content: center;
    margin-bottom: 0.45rem;
    border-color: rgba(255, 255, 255, 0.12);
    background: var(--academy-sidebar-panel);
    color: var(--academy-sidebar-text);
}

.academy-portal .portal-nav__link.acad-signout {
    color: #f2b7bd;
}

.academy-portal .portal-nav__link.acad-signout:hover {
    color: #ffffff;
    background: rgba(239, 68, 68, 0.18);
}

.academy-portal .portal__main {
    background: linear-gradient(180deg, var(--academy-app-bg-2) 0%, var(--academy-app-bg) 100%);
}

.acad-topbar {
    height: 62px;
    min-height: 62px;
    border-bottom: 1px solid var(--academy-shell-border);
    background: color-mix(in srgb, var(--color-surface) 92%, transparent);
    backdrop-filter: blur(14px);
}

.acad-content {
    padding: 1.1rem;
}

.acad-command-hero,
.acad-panel,
.acad-metric,
.acad-progress-card,
.acad-module-grid a,
.acad-session-row,
.acad-invoice-list a,
.acad-task-list a,
.acad-team-list a,
.academy-portal .card,
.academy-portal .portal__header {
    border-radius: 8px;
    border-color: var(--theme-card-border);
    background: var(--theme-card-bg);
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05), 0 14px 34px color-mix(in srgb, var(--color-text) 5%, transparent);
}

.acad-command-hero {
    background: linear-gradient(135deg, color-mix(in srgb, var(--color-surface) 94%, var(--color-primary) 6%) 0%, var(--theme-card-bg) 100%);
}

.acad-metrics-row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.acad-metric {
    min-height: 112px;
}

.acad-dashboard-layout {
    grid-template-columns: minmax(0, 1.48fr) minmax(300px, 0.76fr);
}

:root[data-theme="dark"] .acad-command-hero,
:root[data-theme="dark"] .acad-panel,
:root[data-theme="dark"] .acad-metric,
:root[data-theme="dark"] .acad-progress-card,
:root[data-theme="dark"] .acad-module-grid a,
:root[data-theme="dark"] .acad-session-row,
:root[data-theme="dark"] .acad-invoice-list a,
:root[data-theme="dark"] .acad-task-list a,
:root[data-theme="dark"] .acad-team-list a,
:root[data-theme="dark"] .academy-portal .card,
:root[data-theme="dark"] .academy-portal .portal__header {
    box-shadow: none;
}

@media (max-width: 1180px) {
    .academy-portal .academy-sidebar {
        width: 248px;
        min-width: 248px;
    }

    .acad-metrics-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .acad-dashboard-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .academy-portal .academy-sidebar {
        width: 100%;
        min-width: 0;
        height: auto;
        max-height: none;
        border-inline: 0;
        border-bottom: 1px solid var(--academy-shell-border);
        box-shadow: none;
    }

    .academy-sidebar__brand {
        min-height: 60px;
        padding: 0.65rem 0.75rem;
    }

    .academy-portal .portal-nav__links,
    .academy-sidebar__foot {
        display: none;
    }

    .acad-content {
        padding: 0.75rem;
    }
}