/* SFSPORT360 Design System — Gate 1
   Shared tokens and primitives for public, tenant, player, guardian,
   onboarding, and platform experiences. New UI should use the sf-* API. */

:root {
    /* Typography */
    --sf-font-sans: "Thmanyah", system-ui, -apple-system, "Segoe UI", sans-serif;
    --sf-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    --sf-text-xs: 0.75rem;
    --sf-text-sm: 0.875rem;
    --sf-text-md: 1rem;
    --sf-text-lg: 1.125rem;
    --sf-text-xl: clamp(1.25rem, 1.1rem + 0.45vw, 1.5rem);
    --sf-text-2xl: clamp(1.55rem, 1.3rem + 0.8vw, 2rem);
    --sf-text-3xl: clamp(2rem, 1.55rem + 1.5vw, 2.75rem);
    --sf-leading-tight: 1.25;
    --sf-leading-normal: 1.65;

    /* Spacing — 4px base grid */
    --sf-space-0: 0;
    --sf-space-1: 0.25rem;
    --sf-space-2: 0.5rem;
    --sf-space-3: 0.75rem;
    --sf-space-4: 1rem;
    --sf-space-5: 1.25rem;
    --sf-space-6: 1.5rem;
    --sf-space-8: 2rem;
    --sf-space-10: 2.5rem;
    --sf-space-12: 3rem;
    --sf-space-16: 4rem;
    --sf-space-20: 5rem;

    /* Shape and layout */
    --sf-radius-xs: 0.45rem;
    --sf-radius-sm: 0.7rem;
    --sf-radius-md: 0.95rem;
    --sf-radius-lg: 1.25rem;
    --sf-radius-xl: 1.75rem;
    --sf-radius-pill: 999px;
    --sf-container-sm: 48rem;
    --sf-container-md: 72rem;
    --sf-container-lg: 82rem;
    --sf-control-sm: 2.5rem;
    --sf-control-md: 2.875rem;
    --sf-control-lg: 3.25rem;

    /* Motion */
    --sf-duration-fast: 140ms;
    --sf-duration-normal: 220ms;
    --sf-duration-slow: 360ms;
    --sf-ease-standard: cubic-bezier(0.2, 0.75, 0.25, 1);
    --sf-ease-emphasized: cubic-bezier(0.16, 1, 0.3, 1);

    /* Brand spectrum */
    --sf-brand-50: #ecfdf7;
    --sf-brand-100: #d3f8ea;
    --sf-brand-200: #aaf0d6;
    --sf-brand-300: #72dfbd;
    --sf-brand-400: #36c49d;
    --sf-brand-500: #13a57f;
    --sf-brand-600: #0b8769;
    --sf-brand-700: #096c57;
    --sf-brand-800: #095645;
    --sf-brand-900: #08473b;
    --sf-blue-500: #2f6fed;
    --sf-blue-600: #255bd0;
    --sf-blue-700: #214aa8;
    /* One calm, recognisable background for every section banner. */
    --sf-banner-bg: #0b3039;
    --sf-banner-text: #ffffff;
    --sf-banner-muted: rgba(255, 255, 255, 0.74);
}

:root,
:root[data-theme="light"] {
    color-scheme: light;
    --sf-canvas: #f4f7fb;
    --sf-canvas-subtle: #eef3f8;
    --sf-surface: #ffffff;
    --sf-surface-raised: #ffffff;
    --sf-surface-sunken: #f7f9fc;
    --sf-surface-overlay: rgba(255, 255, 255, 0.96);
    --sf-text: #101828;
    --sf-text-secondary: #475467;
    --sf-text-muted: #667085;
    --sf-text-disabled: #98a2b3;
    --sf-border: #d9e2ec;
    --sf-border-strong: #bac7d5;
    --sf-brand: var(--sf-brand-600);
    --sf-brand-hover: var(--sf-brand-700);
    --sf-brand-soft: #e7f8f2;
    --sf-accent: var(--sf-blue-600);
    --sf-accent-hover: var(--sf-blue-700);
    --sf-accent-soft: #eaf0ff;
    --sf-success: #087a5b;
    --sf-success-soft: #e7f8f1;
    --sf-success-border: #a8e4cd;
    --sf-warning: #925400;
    --sf-warning-soft: #fff5dc;
    --sf-warning-border: #f2d18a;
    --sf-danger: #b42318;
    --sf-danger-soft: #fff0ef;
    --sf-danger-border: #f6b8b2;
    --sf-info: #2458b8;
    --sf-info-soft: #edf3ff;
    --sf-info-border: #b9cdf7;
    --sf-focus: rgba(11, 135, 105, 0.22);
    --sf-scrim: rgba(16, 24, 40, 0.56);
    --sf-shadow-xs: 0 1px 2px rgba(16, 24, 40, 0.05);
    --sf-shadow-sm: 0 6px 18px rgba(16, 24, 40, 0.07);
    --sf-shadow-md: 0 16px 38px rgba(16, 24, 40, 0.1);
    --sf-shadow-lg: 0 30px 80px rgba(16, 24, 40, 0.16);
    --sf-page-glow: radial-gradient(circle at 82% -8%, rgba(47, 111, 237, 0.11), transparent 34%), radial-gradient(circle at 12% 5%, rgba(19, 165, 127, 0.09), transparent 30%);
}

:root[data-theme="dark"] {
    color-scheme: dark;
    --sf-canvas: #07111f;
    --sf-canvas-subtle: #0a1626;
    --sf-surface: #0f1c2e;
    --sf-surface-raised: #14243a;
    --sf-surface-sunken: #0b1728;
    --sf-surface-overlay: rgba(15, 28, 46, 0.96);
    --sf-text: #f2f6fc;
    --sf-text-secondary: #c5d0df;
    --sf-text-muted: #9cabc0;
    --sf-text-disabled: #6f8098;
    --sf-border: #293b52;
    --sf-border-strong: #40536c;
    --sf-brand: #53d6b1;
    --sf-brand-hover: #82e7cb;
    --sf-brand-soft: rgba(83, 214, 177, 0.14);
    --sf-accent: #82aaff;
    --sf-accent-hover: #aac3ff;
    --sf-accent-soft: rgba(130, 170, 255, 0.15);
    --sf-success: #7ee0bd;
    --sf-success-soft: rgba(60, 202, 157, 0.14);
    --sf-success-border: rgba(83, 214, 177, 0.34);
    --sf-warning: #ffd27d;
    --sf-warning-soft: rgba(255, 190, 70, 0.13);
    --sf-warning-border: rgba(255, 210, 125, 0.34);
    --sf-danger: #ffaaa4;
    --sf-danger-soft: rgba(255, 117, 107, 0.14);
    --sf-danger-border: rgba(255, 170, 164, 0.34);
    --sf-info: #a6c1ff;
    --sf-info-soft: rgba(130, 170, 255, 0.14);
    --sf-info-border: rgba(166, 193, 255, 0.34);
    --sf-focus: rgba(83, 214, 177, 0.28);
    --sf-scrim: rgba(0, 5, 13, 0.76);
    --sf-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.2);
    --sf-shadow-sm: 0 8px 22px rgba(0, 0, 0, 0.24);
    --sf-shadow-md: 0 18px 46px rgba(0, 0, 0, 0.34);
    --sf-shadow-lg: 0 34px 90px rgba(0, 0, 0, 0.48);
    --sf-page-glow: radial-gradient(circle at 82% -8%, rgba(77, 126, 232, 0.16), transparent 36%), radial-gradient(circle at 12% 5%, rgba(40, 194, 151, 0.12), transparent 32%);
}

/* Compatibility aliases while legacy screens migrate to sf-* tokens. */
:root {
    --color-bg: var(--sf-surface);
    --color-bg-muted: var(--sf-canvas);
    --color-surface: var(--sf-surface);
    --color-surface-raised: var(--sf-surface-raised);
    --color-text: var(--sf-text);
    --color-text-muted: var(--sf-text-muted);
    --color-primary: var(--sf-brand);
    --color-primary-dark: var(--sf-brand-hover);
    --color-primary-soft: var(--sf-brand-soft);
    --color-accent: var(--sf-accent);
    --color-accent-soft: var(--sf-accent-soft);
    --color-border: var(--sf-border);
    --color-success: var(--sf-success);
    --color-warning: var(--sf-warning);
    --color-error: var(--sf-danger);
    --theme-focus: var(--sf-focus);
    --theme-shadow: var(--sf-shadow-sm);
    --theme-shadow-strong: var(--sf-shadow-lg);
    --theme-body-bg: var(--sf-page-glow), var(--sf-canvas);
    --theme-topbar-bg: var(--sf-surface-overlay);
    --theme-card-bg: var(--sf-surface);
    --theme-card-border: var(--sf-border);
    --theme-input-bg: var(--sf-surface-sunken);
    --theme-table-head-bg: var(--sf-surface-sunken);
    --theme-table-hover-bg: var(--sf-brand-soft);
    --theme-success-bg: var(--sf-success-soft);
    --theme-success-text: var(--sf-success);
    --theme-warning-bg: var(--sf-warning-soft);
    --theme-warning-text: var(--sf-warning);
    --theme-error-bg: var(--sf-danger-soft);
    --theme-error-text: var(--sf-danger);
    --theme-neutral-bg: var(--sf-canvas-subtle);
    --theme-neutral-text: var(--sf-text-secondary);
    --font-sans: var(--sf-font-sans);
    --radius: var(--sf-radius-md);
    --radius-lg: var(--sf-radius-lg);
    --radius-xl: var(--sf-radius-xl);
    --shadow-sm: var(--sf-shadow-xs);
    --shadow: var(--sf-shadow-sm);
    --shadow-md: var(--sf-shadow-md);
    --shadow-lg: var(--sf-shadow-lg);
    --transition: var(--sf-duration-normal) var(--sf-ease-standard);
}

/* Foundation */
html {
    background: var(--sf-canvas);
    color: var(--sf-text);
    scrollbar-color: var(--sf-border-strong) var(--sf-canvas-subtle);
}

body.site-body {
    background: var(--sf-page-glow), var(--sf-canvas);
    color: var(--sf-text);
    font-family: var(--sf-font-sans);
    line-height: var(--sf-leading-normal);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

body.site-body ::selection {
    background: var(--sf-brand-soft);
    color: var(--sf-text);
}

body.site-body :where(button, input, select, textarea) {
    font: inherit;
}

body.site-body :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--sf-focus);
    outline-offset: 3px;
}

body.site-body :where(a) {
    text-underline-offset: 0.18em;
    text-decoration-thickness: 0.08em;
}

body.site-body :where(h1, h2, h3, h4) {
    color: var(--sf-text);
    line-height: var(--sf-leading-tight);
    text-wrap: balance;
}

body.site-body :where(p) {
    text-wrap: pretty;
}

body.site-body :where(code, kbd, samp) {
    font-family: var(--sf-font-mono);
}

.sf-skip-link {
    position: fixed;
    inset-block-start: var(--sf-space-3);
    inset-inline-start: var(--sf-space-3);
    z-index: 10000;
    transform: translateY(-180%);
    min-block-size: var(--sf-control-md);
    padding: var(--sf-space-3) var(--sf-space-4);
    border: 1px solid var(--sf-brand);
    border-radius: var(--sf-radius-sm);
    background: var(--sf-surface-raised);
    color: var(--sf-text);
    box-shadow: var(--sf-shadow-md);
    font-weight: 800;
    text-decoration: none;
    transition: transform var(--sf-duration-fast) var(--sf-ease-standard);
}

.sf-skip-link:focus {
    transform: translateY(0);
}

/* Theme switch */
.sf-theme-toggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--sf-space-2);
    inline-size: auto;
    min-inline-size: 2.75rem;
    min-block-size: 2.75rem;
    padding: 0 var(--sf-space-3);
    border: 1px solid var(--sf-border);
    border-radius: var(--sf-radius-pill);
    background: var(--sf-surface-sunken);
    color: var(--sf-text-secondary);
    box-shadow: var(--sf-shadow-xs);
    cursor: pointer;
    transition: color var(--sf-duration-fast) var(--sf-ease-standard), border-color var(--sf-duration-fast) var(--sf-ease-standard), background var(--sf-duration-fast) var(--sf-ease-standard), transform var(--sf-duration-fast) var(--sf-ease-emphasized);
}

.sf-theme-toggle:hover {
    border-color: var(--sf-brand);
    background: var(--sf-brand-soft);
    color: var(--sf-brand-hover);
    transform: translateY(-1px);
}

.sf-theme-toggle__icons {
    display: grid;
    inline-size: 1.15rem;
    block-size: 1.15rem;
    place-items: center;
}

.sf-theme-toggle__icons svg {
    grid-area: 1 / 1;
    inline-size: 100%;
    block-size: 100%;
    transition: opacity var(--sf-duration-normal) var(--sf-ease-standard), transform var(--sf-duration-normal) var(--sf-ease-emphasized);
}

:root[data-theme="light"] .sf-theme-toggle__moon,
:root[data-theme="dark"] .sf-theme-toggle__sun {
    opacity: 0;
    transform: scale(0.55) rotate(-30deg);
}

:root[data-theme="light"] .sf-theme-toggle__sun,
:root[data-theme="dark"] .sf-theme-toggle__moon {
    opacity: 1;
    transform: scale(1) rotate(0deg);
}

.topbar__lang,
.topbar__mobile-actions {
    align-items: center;
    gap: var(--sf-space-2);
}

.topbar__lang .sf-theme-toggle {
    margin-inline-end: var(--sf-space-2);
}

/* Layout primitives */
.sf-container {
    inline-size: min(calc(100% - clamp(1.25rem, 4vw, 3rem)), var(--sf-container-lg));
    margin-inline: auto;
}

.sf-stack {
    display: flex;
    flex-direction: column;
    gap: var(--sf-stack-gap, var(--sf-space-4));
}

.sf-cluster {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sf-cluster-gap, var(--sf-space-3));
}

.sf-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--sf-grid-min, 16rem)), 1fr));
    gap: var(--sf-grid-gap, var(--sf-space-5));
}

/* Buttons */
.sf-button,
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--sf-space-2);
    min-block-size: var(--sf-control-md);
    padding: 0.68rem 1rem;
    border: 1px solid transparent;
    border-radius: var(--sf-radius-sm);
    font-family: var(--sf-font-sans);
    font-size: var(--sf-text-sm);
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: transform var(--sf-duration-fast) var(--sf-ease-emphasized), box-shadow var(--sf-duration-fast) var(--sf-ease-standard), background var(--sf-duration-fast) var(--sf-ease-standard), border-color var(--sf-duration-fast) var(--sf-ease-standard), color var(--sf-duration-fast) var(--sf-ease-standard);
}

.sf-button:hover,
.btn:hover {
    transform: translateY(-1px);
}

.sf-button:active,
.btn:active {
    transform: translateY(0);
}

.sf-button:disabled,
.sf-button[aria-disabled="true"],
.btn:disabled,
.btn[aria-disabled="true"] {
    opacity: 0.54;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

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

.sf-button--primary:hover,
.btn--primary:hover {
    background: linear-gradient(135deg, var(--sf-brand-hover), color-mix(in srgb, var(--sf-brand-hover) 60%, var(--sf-accent-hover)));
    color: #ffffff;
    box-shadow: 0 14px 30px color-mix(in srgb, var(--sf-brand) 28%, transparent);
}

.sf-button--secondary,
.btn--ghost {
    border-color: var(--sf-border);
    background: var(--sf-surface);
    color: var(--sf-text);
    box-shadow: var(--sf-shadow-xs);
}

.sf-button--secondary:hover,
.btn--ghost:hover {
    border-color: color-mix(in srgb, var(--sf-brand) 55%, var(--sf-border));
    background: var(--sf-brand-soft);
    color: var(--sf-brand-hover);
}

.sf-button--danger {
    background: var(--sf-danger);
    color: #ffffff;
}

.sf-button--sm,
.btn--sm {
    min-block-size: var(--sf-control-sm);
    padding: 0.5rem 0.8rem;
    font-size: var(--sf-text-xs);
}

.sf-button--lg,
.btn--lg {
    min-block-size: var(--sf-control-lg);
    padding-inline: 1.35rem;
    font-size: var(--sf-text-md);
}

.sf-button--block,
.btn--block {
    inline-size: 100%;
}

/* Cards and section headers */
.sf-card,
.card {
    border: 1px solid var(--sf-border);
    border-radius: var(--sf-radius-lg);
    background: var(--sf-surface);
    color: var(--sf-text);
    box-shadow: var(--sf-shadow-sm);
}

.sf-card {
    padding: clamp(var(--sf-space-4), 2.5vw, var(--sf-space-6));
}

.sf-card--interactive {
    transition: transform var(--sf-duration-normal) var(--sf-ease-emphasized), box-shadow var(--sf-duration-normal) var(--sf-ease-standard), border-color var(--sf-duration-normal) var(--sf-ease-standard);
}

.sf-card--interactive:hover {
    border-color: color-mix(in srgb, var(--sf-brand) 42%, var(--sf-border));
    box-shadow: var(--sf-shadow-md);
    transform: translateY(-3px);
}

.sf-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--sf-space-4);
    margin-block-end: var(--sf-space-5);
}

.sf-section-head__copy {
    display: grid;
    gap: var(--sf-space-1);
}

.sf-section-head__eyebrow {
    color: var(--sf-brand);
    font-size: var(--sf-text-xs);
    font-weight: 900;
    letter-spacing: 0.02em;
}

.sf-section-head__title {
    margin: 0;
    font-size: var(--sf-text-xl);
}

.sf-section-head__description {
    margin: 0;
    color: var(--sf-text-muted);
    font-size: var(--sf-text-sm);
}

/* Form controls */
.sf-field {
    display: grid;
    gap: var(--sf-space-2);
}

.sf-field__label,
.form-group__label,
.filter-field__label {
    color: var(--sf-text-secondary);
    font-size: var(--sf-text-sm);
    font-weight: 800;
}

.sf-input,
body.site-body :where(.filter-field__input, .form-group input:not([type="checkbox"]):not([type="radio"]), .form-group select, .form-group textarea) {
    inline-size: 100%;
    min-block-size: var(--sf-control-md);
    padding: 0.7rem 0.85rem;
    border: 1px solid var(--sf-border);
    border-radius: var(--sf-radius-sm);
    background: var(--sf-surface-sunken);
    color: var(--sf-text);
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--sf-text) 3%, transparent);
    transition: border-color var(--sf-duration-fast) var(--sf-ease-standard), box-shadow var(--sf-duration-fast) var(--sf-ease-standard), background var(--sf-duration-fast) var(--sf-ease-standard);
}

.sf-input::placeholder,
body.site-body :where(input, textarea)::placeholder {
    color: var(--sf-text-disabled);
    opacity: 1;
}

.sf-input:hover,
body.site-body :where(.filter-field__input, .form-group input, .form-group select, .form-group textarea):hover {
    border-color: var(--sf-border-strong);
}

.sf-input:focus,
body.site-body :where(.filter-field__input, .form-group input, .form-group select, .form-group textarea):focus {
    border-color: var(--sf-brand);
    background: var(--sf-surface);
    box-shadow: 0 0 0 4px var(--sf-focus);
    outline: none;
}

.sf-field__help,
.form-group__help,
.form-group__hint {
    color: var(--sf-text-muted);
    font-size: var(--sf-text-xs);
}

.sf-field__error,
.form-group__error {
    color: var(--sf-danger);
    font-size: var(--sf-text-xs);
    font-weight: 750;
}

/* Status and feedback */
.sf-badge,
.status {
    display: inline-flex;
    align-items: center;
    gap: var(--sf-space-1);
    min-block-size: 1.75rem;
    padding: 0.25rem 0.62rem;
    border: 1px solid var(--sf-border);
    border-radius: var(--sf-radius-pill);
    background: var(--sf-canvas-subtle);
    color: var(--sf-text-secondary);
    font-size: var(--sf-text-xs);
    font-weight: 800;
    line-height: 1.2;
}

.sf-badge--success,
.status--active,
.status--paid {
    border-color: var(--sf-success-border);
    background: var(--sf-success-soft);
    color: var(--sf-success);
}

.sf-badge--warning,
.status--pending,
.status--partial {
    border-color: var(--sf-warning-border);
    background: var(--sf-warning-soft);
    color: var(--sf-warning);
}

.sf-badge--danger,
.status--unpaid,
.status--expired,
.status--cancelled {
    border-color: var(--sf-danger-border);
    background: var(--sf-danger-soft);
    color: var(--sf-danger);
}

.sf-badge--info {
    border-color: var(--sf-info-border);
    background: var(--sf-info-soft);
    color: var(--sf-info);
}

.sf-alert,
.alert {
    display: grid;
    gap: var(--sf-space-1);
    padding: var(--sf-space-4);
    border: 1px solid var(--sf-info-border);
    border-radius: var(--sf-radius-md);
    background: var(--sf-info-soft);
    color: var(--sf-info);
}

.sf-alert--success,
.alert--success {
    border-color: var(--sf-success-border);
    background: var(--sf-success-soft);
    color: var(--sf-success);
}

.sf-alert--warning,
.alert--warning {
    border-color: var(--sf-warning-border);
    background: var(--sf-warning-soft);
    color: var(--sf-warning);
}

.sf-alert--danger,
.alert--error {
    border-color: var(--sf-danger-border);
    background: var(--sf-danger-soft);
    color: var(--sf-danger);
}

.sf-empty {
    display: grid;
    justify-items: center;
    gap: var(--sf-space-3);
    padding: clamp(var(--sf-space-8), 7vw, var(--sf-space-16));
    border: 1px dashed var(--sf-border-strong);
    border-radius: var(--sf-radius-lg);
    background: var(--sf-surface-sunken);
    color: var(--sf-text-muted);
    text-align: center;
}

.sf-empty h2,
.sf-empty h3,
.sf-empty p {
    margin: 0;
}

/* Data tables */
.sf-table-wrap,
.data-table-wrap {
    max-inline-size: 100%;
    overflow-x: auto;
    border: 1px solid var(--sf-border);
    border-radius: var(--sf-radius-lg);
    background: var(--sf-surface);
    box-shadow: var(--sf-shadow-xs);
}

.sf-table,
.data-table {
    inline-size: 100%;
    border-collapse: collapse;
    color: var(--sf-text);
}

.sf-table :where(th, td),
.data-table :where(th, td) {
    padding: 0.85rem 1rem;
    border-block-end: 1px solid var(--sf-border);
    text-align: start;
    vertical-align: middle;
}

.sf-table th,
.data-table th {
    background: var(--sf-surface-sunken);
    color: var(--sf-text-muted);
    font-size: var(--sf-text-xs);
    font-weight: 850;
    white-space: nowrap;
}

.sf-table tbody tr:last-child td,
.data-table tbody tr:last-child td {
    border-block-end: 0;
}

.sf-table tbody tr:hover td,
.data-table tbody tr:hover td {
    background: var(--sf-brand-soft);
}

/* Cross-shell theme compatibility */
.topbar {
    background: var(--sf-surface-overlay);
    border-color: var(--sf-border);
    color: var(--sf-text);
    backdrop-filter: blur(18px) saturate(135%);
}

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

:root[data-theme="dark"] .platform-content,
:root[data-theme="dark"] .platform-main,
:root[data-theme="dark"] .platform-auth,
:root[data-theme="dark"] .wizard-main {
    background: var(--sf-page-glow), var(--sf-canvas);
    color: var(--sf-text);
}

:root[data-theme="light"] .platform-content,
:root[data-theme="light"] .platform-main,
:root[data-theme="light"] .platform-auth,
:root[data-theme="light"] .wizard-main {
    background: var(--sf-page-glow), var(--sf-canvas);
    color: var(--sf-text);
}

.platform-sidebar {
    background: #091526;
    border-inline-end: 1px solid rgba(255, 255, 255, 0.08);
}

.platform-sidebar__lang {
    display: grid;
    gap: var(--sf-space-2);
}

.platform-sidebar__lang .sf-theme-toggle {
    inline-size: 100%;
    border-color: rgba(255, 255, 255, 0.13);
    background: rgba(255, 255, 255, 0.06);
    color: #d9e5f4;
}

:root[data-theme="dark"] :where(.wizard-panel, .wizard-form, .wizard-success__card, .country-card, .plan-card, .gateway-summary, .payment-summary),
:root[data-theme="dark"] :where(.platform-section, .platform-auth__card) {
    border-color: var(--sf-border);
    background: var(--sf-surface);
    color: var(--sf-text);
    box-shadow: var(--sf-shadow-sm);
}

:root[data-theme="dark"] :where(.wizard-panel, .wizard-form, .country-card, .plan-card, .gateway-summary, .payment-summary, .platform-section) :where(p, span, small, label) {
    color: var(--sf-text-secondary);
}

:root[data-theme="dark"] .site-body--marketing {
    background: var(--sf-page-glow), var(--sf-canvas);
    color: var(--sf-text);
}

:root[data-theme="dark"] .site-main--marketing,
:root[data-theme="dark"] .mkt-home-flow {
    background: var(--sf-canvas);
    color: var(--sf-text);
}

:root[data-theme="dark"] .mkt-home-flow {
    background: var(--sf-canvas) !important;
}

:root[data-theme="dark"] .topbar--marketing {
    background: var(--sf-surface-overlay);
    border-color: var(--sf-border);
}

:root[data-theme="dark"] .mkt-home-flow > section:not(.mkt-cta-section--fresh) {
    color: var(--sf-text);
}

:root[data-theme="dark"] :where(.mkt-audience-section, .mkt-market-section, .mkt-apps-section--fresh, .mkt-journey-section) {
    background: var(--sf-canvas);
}

:root[data-theme="dark"] :where(.mkt-discovery-section, .mkt-command-section, .mkt-suite-section) {
    background: var(--sf-canvas-subtle);
}

:root[data-theme="dark"] .mkt-home-flow > section:not(.mkt-cta-section--fresh) :where(p, small, li, .mkt-section-sub) {
    color: var(--sf-text-secondary);
}

:root[data-theme="dark"] :where(.mkt-suite-card, .mkt-journey-grid > span, .mkt-audience-foot, .mkt-discovery-points > span, .mkt-command-points > span, .mkt-role-grid > span, .mkt-store-badge) {
    border-color: var(--sf-border);
    background: var(--sf-surface);
    color: var(--sf-text);
    box-shadow: var(--sf-shadow-xs);
}

:root[data-theme="dark"] :where(.mkt-suite-card, .mkt-journey-grid > span, .mkt-audience-foot, .mkt-discovery-points > span, .mkt-command-points > span, .mkt-role-grid > span, .mkt-store-badge) :where(p, small, span) {
    color: var(--sf-text-secondary);
}

:root[data-theme="dark"] :where(.mkt-home-flow, .mkt-features-section, .mkt-apps-section, .mkt-faq-page, .mkt-about-page, .mkt-contact-page, .dir-page, .academy-microsite, .auth-page, .mkt-login-flow) {
    background-color: transparent;
    color: var(--sf-text);
}

:root[data-theme="dark"] :where(.mkt-market-card, .mkt-audience-card, .mkt-feat-card, .mkt-faq-item, .mkt-about-content, .mkt-about-sidebar__card, .mkt-contact-content, .mkt-contact-channel, .mkt-contact-form-card, .mkt-login-flow__card, .dir-search, .dir-results, .academy-public-card, .academy-microsite__brand-card, .academy-microsite__quick-card, .academy-microsite__section, .auth-card) {
    border-color: var(--sf-border);
    background: var(--sf-surface);
    color: var(--sf-text);
    box-shadow: var(--sf-shadow-sm);
}

:root[data-theme="dark"] :where(.mkt-market-card, .mkt-audience-card, .mkt-feat-card, .mkt-faq-item, .mkt-about-content, .mkt-about-sidebar__card, .mkt-contact-content, .mkt-contact-channel, .mkt-contact-form-card, .mkt-login-flow__card, .dir-search, .dir-results, .academy-public-card, .academy-microsite__brand-card, .academy-microsite__quick-card, .academy-microsite__section, .auth-card) :where(p, small, span, label) {
    color: var(--sf-text-secondary);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-contact-form__consent {
    border-color: var(--sf-border);
    background: var(--sf-surface-sunken);
}

:root[data-theme="dark"] :where(.mkt-section-title, .mkt-market-title, .mkt-hero__title, .mkt-login-flow__head h1, .mkt-faq-page h1, .mkt-about-page h1, .mkt-contact-page h1, .dir-page h1, .academy-microsite h1, .auth-card__title) {
    color: var(--sf-text);
}

/* Public shell dark-mode compatibility. Public flows still contain legacy
   literal colors, so these mappings make the shared semantic theme decisive. */
:root[data-theme="dark"] body.site-body--marketing {
    --tb-bg: var(--sf-surface-overlay);
    --tb-border: var(--sf-border);
    --tb-text: var(--sf-text);
    --tb-muted: var(--sf-text-secondary);
    --tb-green: var(--sf-brand);
    --tb-green-dark: var(--sf-brand-hover);
    --tb-green-soft: var(--sf-brand-soft);
}

body.site-body--marketing {
    --tb-muted: #475467;
}

:root[data-theme="dark"] body.site-body--marketing .topbar--marketing :where(.topbar__more-btn, .topbar__beneficiary-actions, .topbar__account, .topbar__link--ghost, .topbar__join-panel, .topbar__lang .lang-toggle, .topbar__mobile-actions .lang-toggle) {
    border-color: var(--sf-border) !important;
    background: var(--sf-surface-raised) !important;
    color: var(--sf-text) !important;
    box-shadow: var(--sf-shadow-xs) !important;
}

:root[data-theme="dark"] body.site-body--marketing .topbar--marketing :where(.topbar__join-option--player, .topbar__join-option--guardian, .topbar__join-option--facility) {
    background: var(--sf-surface-sunken);
    color: var(--sf-text);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-home-flow :where(.mkt-section-title, .mkt-market-title) {
    color: var(--sf-text);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-home-flow :where(.mkt-section-sub, .mkt-market-card p, .mkt-suite-card p, .mkt-audience-card p) {
    color: var(--sf-text-secondary);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-home-flow :where(.mkt-audience-section, .mkt-market-section, .mkt-apps-section--fresh, .mkt-journey-section) {
    background: var(--sf-canvas);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-home-flow :where(.mkt-discovery-section, .mkt-athlete-section, .mkt-command-section, .mkt-suite-section) {
    background: var(--sf-canvas-subtle);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-home-flow :where(.mkt-audience-card, .mkt-market-card, .mkt-suite-card, .mkt-athlete-card, .mkt-discovery-demo, .mkt-discovery-form, .mkt-map-card, .mkt-map-place, .mkt-discovery-points > span, .mkt-command-points > span, .mkt-role-grid > span, .mkt-store-badge, .mkt-journey-grid > span) {
    border-color: var(--sf-border);
    background: var(--sf-surface);
    color: var(--sf-text);
    box-shadow: var(--sf-shadow-sm);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-home-flow :where(.mkt-audience-card, .mkt-market-card, .mkt-suite-card, .mkt-athlete-card, .mkt-map-place) :where(h3, strong) {
    color: var(--sf-text);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-home-flow .mkt-gulf-band--fresh {
    background: var(--sf-canvas);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-home-flow .mkt-gulf-band--fresh .container {
    border-color: var(--sf-border);
    background: var(--sf-surface);
    box-shadow: var(--sf-shadow-md);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-home-flow .mkt-gulf-copy h2 {
    color: var(--sf-text);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-home-flow .mkt-map-badge--open {
    background: #153c31;
    color: #aaf0d6;
}

:root[data-theme="dark"] body.site-body--marketing .mkt-home-flow .mkt-map-badge--busy {
    background: #463415;
    color: #ffe0a3;
}

:root[data-theme="dark"] body.site-body--marketing .mkt-home-flow .mkt-map-badge--full {
    background: #492321;
    color: #ffc2bd;
}

:root[data-theme="dark"] body.site-body--marketing .dir-page {
    --dir-green: var(--sf-brand);
    --dir-green-soft: var(--sf-brand-soft);
    --dir-green-dark: var(--sf-brand-hover);
    --dir-blue: var(--sf-accent);
    --dir-border: var(--sf-border);
    --dir-text: var(--sf-text);
    --dir-muted: var(--sf-text-secondary);
    --dir-surface: var(--sf-canvas-subtle);
    --dir-shadow: var(--sf-shadow-md);
    --dir-shadow-sm: var(--sf-shadow-xs);
    background: var(--sf-canvas-subtle);
    color: var(--sf-text);
}

:root[data-theme="dark"] body.site-body--marketing .dir-page :where(.dir-hero, .dir-map-section) {
    border-color: var(--sf-border);
    background: var(--sf-page-glow), var(--sf-canvas);
}

:root[data-theme="dark"] body.site-body--marketing .dir-page .dir-search-wrap {
    border-color: var(--sf-border);
    background: var(--sf-surface-overlay);
}

:root[data-theme="dark"] body.site-body--marketing .dir-page :where(.dir-search, .dir-search__primary, .dir-field__input, .dir-action, .dir-map-shell, .academy-card) {
    border-color: var(--sf-border);
    background-color: var(--sf-surface);
    color: var(--sf-text);
    box-shadow: var(--sf-shadow-xs);
}

:root[data-theme="dark"] body.site-body--marketing .dir-page :where(.dir-field__label, .dir-results__head p, .academy-card__meta) {
    color: var(--sf-text-secondary);
}

:root[data-theme="dark"] body.site-body--marketing .dir-page :where(.dir-results__head h2, .academy-card__link, .academy-card__title) {
    color: var(--sf-text);
}

:root[data-theme="dark"] body.site-body--marketing .dir-page :where(.tag, .tag--soft) {
    background: var(--sf-surface-raised);
    color: var(--sf-text-secondary);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-login-flow {
    --lf-bg: var(--sf-surface);
    --lf-surface: var(--sf-canvas-subtle);
    --lf-border: var(--sf-border);
    --lf-text: var(--sf-text);
    --lf-muted: var(--sf-text-secondary);
    --lf-green: var(--sf-brand);
    --lf-green-soft: var(--sf-brand-soft);
    --lf-green-dark: var(--sf-brand-hover);
    --lf-blue: var(--sf-accent);
    --lf-blue-soft: var(--sf-accent-soft);
    --lf-blue-dark: var(--sf-accent-hover);
    --lf-shadow: var(--sf-shadow-md);
    --lf-shadow-sm: var(--sf-shadow-xs);
    background: var(--sf-page-glow), var(--sf-canvas);
    color: var(--sf-text);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-login-flow :where(.mkt-login-flow__card, .mkt-login-flow__btn--ghost) {
    border-color: var(--sf-border);
    background: var(--sf-surface);
    color: var(--sf-text);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-login-flow :where(.mkt-login-flow__card h2, .mkt-login-flow__head h1) {
    color: var(--sf-text);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-login-flow :where(.mkt-login-flow__card p, .mkt-login-flow__head p, .mkt-login-flow__back) {
    color: var(--sf-text-secondary);
}

/* Wizard surfaces and selected options */
:root[data-theme="dark"] body.site-body--wizard {
    background: var(--sf-page-glow), var(--sf-canvas);
    color: var(--sf-text);
}

:root[data-theme="dark"] :where(.wizard-topbar, .wizard-steps) {
    border-color: var(--sf-border);
    background: var(--sf-surface-overlay);
    color: var(--sf-text);
    box-shadow: var(--sf-shadow-sm);
}

:root[data-theme="dark"] :where(.wizard-steps__heading, .wizard-panel__title, .country-card__name) {
    color: var(--sf-text);
}

:root[data-theme="dark"] :where(.wizard-steps__item, .country-card) {
    border-color: var(--sf-border);
    background: var(--sf-surface);
    color: var(--sf-text-secondary);
}

:root[data-theme="dark"] .country-card:has(input:checked),
:root[data-theme="dark"] .country-card.is-selected,
:root[data-theme="dark"] .wizard-steps__item.is-current {
    border-color: var(--sf-brand);
    background: var(--sf-surface-raised);
    color: var(--sf-text);
    box-shadow: 0 0 0 3px var(--sf-focus), var(--sf-shadow-sm);
}

:root[data-theme="dark"] .country-card__flag {
    border-color: var(--sf-border);
    background: var(--sf-surface-sunken);
}

:root[data-theme="dark"] .wizard-form__actions {
    border-color: var(--sf-border);
    background: var(--sf-surface-overlay);
}

/* Shared navigation contrast and compact-link touch areas. */
:root {
    --mbn-active: #08705a;
    --mbn-inactive: #64748b;
}

body.site-body--marketing .topbar--marketing .lang-toggle__mark {
    background: #08705a !important;
    color: #ffffff !important;
}

.lang-toggle__mark {
    background: #08705a !important;
    color: #ffffff !important;
}

:root[data-theme="dark"] {
    --mbn-active: #72dfbd;
    --mbn-inactive: #9cabc0;
    --mbn-label: #c5d0df;
    --mbn-surface: #0f1c2e;
    --mbn-border: #293b52;
}

:root[data-theme="dark"] :where(.brand-wordmark__sf) {
    color: #72dfbd;
}

:root[data-theme="dark"] :where(.brand-wordmark__sport) {
    color: var(--sf-text);
}

:root[data-theme="dark"] body.site-body--marketing .dir-page .dir-stat {
    border-color: var(--sf-border);
    background: var(--sf-surface);
    color: var(--sf-text);
}

:root[data-theme="dark"] .wizard-steps__item.is-current .wizard-steps__num {
    border-color: #08705a;
    background: #08705a;
    color: #ffffff;
}

/* Academy command center: accessible dashboard accents and mobile theme access. */
:root,
:root[data-theme="light"] {
    --cui-admin-info: #255bd0;
    --cui-admin-danger: #bd3636;
}

:root[data-theme="dark"] {
    --cui-admin-info: #73a5ff;
    --cui-admin-danger: #bd3636;
    --cui-admin-success: #7ee0bd;
}

:root[data-theme="light"] body.site-body--academy-admin .academy-portal .acad-topbar__current {
    color: var(--sf-blue-600) !important;
}

:root[data-theme="light"] body.site-body--academy-admin .academy-portal a:not(.btn):not(.portal-nav__link):not(.academy-sidebar__brand):not(.coreui-download):not(.coreui-stat-card) {
    color: var(--sf-blue-600) !important;
}

body.site-body--academy-admin section.academy-portal a.coreui-download.coreui-download {
    color: #ffffff !important;
}

:root[data-theme="light"] body.site-body--academy-admin .academy-portal .ops-readiness-item.is-done .ops-readiness-item__state {
    background: var(--sf-success-soft) !important;
    color: var(--sf-success) !important;
}

:root[data-theme="light"] body.site-body--academy-admin .academy-portal .ops-readiness-item.is-needed .ops-readiness-item__state {
    background: var(--sf-warning-soft) !important;
    color: #7a4500 !important;
}

:root[data-theme="dark"] body.site-body--academy-admin .academy-portal .ops-readiness-item.is-done .ops-readiness-item__state {
    background: var(--sf-success-soft) !important;
    color: var(--sf-success) !important;
}

:root[data-theme="dark"] body.site-body--academy-admin .academy-portal .ops-readiness-item.is-needed .ops-readiness-item__state {
    background: var(--sf-warning-soft) !important;
    color: var(--sf-warning) !important;
}

body.site-body--academy-admin .academy-portal .coreui-stat-card {
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 6.25rem !important;
    padding: 0.8rem !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    border: 1px solid var(--sf-ops-line) !important;
    background: var(--sf-ops-surface) !important;
    color: var(--sf-ops-text) !important;
    box-shadow: none !important;
    animation: none !important;
    transition: transform var(--sf-duration-fast) var(--sf-ease-standard), box-shadow var(--sf-duration-fast) var(--sf-ease-standard) !important;
}

body.site-body--academy-admin .academy-portal .coreui-stat-card--primary {
    border-block-start: 3px solid var(--sf-ops-green) !important;
    background: linear-gradient(145deg, color-mix(in srgb, var(--sf-ops-green) 9%, var(--sf-ops-surface)), var(--sf-ops-surface)) !important;
}

body.site-body--academy-admin .academy-portal .coreui-stat-card--info {
    border-block-start: 3px solid var(--sf-ops-blue) !important;
    background: linear-gradient(145deg, color-mix(in srgb, var(--sf-ops-blue) 9%, var(--sf-ops-surface)), var(--sf-ops-surface)) !important;
}

body.site-body--academy-admin .academy-portal .coreui-stat-card--warning {
    border-block-start: 3px solid #e5a43c !important;
    background: linear-gradient(145deg, color-mix(in srgb, #e5a43c 10%, var(--sf-ops-surface)), var(--sf-ops-surface)) !important;
}

body.site-body--academy-admin .academy-portal .coreui-stat-card--danger {
    border-block-start: 3px solid #d95561 !important;
    background: linear-gradient(145deg, color-mix(in srgb, #d95561 9%, var(--sf-ops-surface)), var(--sf-ops-surface)) !important;
}

body.site-body--academy-admin .academy-portal a.coreui-stat-card:hover {
    transform: translateY(-2px) !important;
    box-shadow: var(--sf-shadow-md) !important;
}

body.site-body--academy-admin .academy-portal .coreui-stat-card__meta {
    display: flex !important;
    align-items: baseline !important;
    gap: 0.3rem !important;
    margin-top: 0.28rem !important;
    color: var(--sf-ops-muted) !important;
}

body.site-body--academy-admin .academy-portal .coreui-stat-card__meta b {
    color: var(--sf-ops-text) !important;
    font: inherit !important;
    font-weight: 850 !important;
}

body.site-body--academy-admin .academy-portal .coreui-stat-card__head > div {
    width: 100% !important;
    min-width: 0 !important;
    text-align: start !important;
}

body.site-body--academy-admin .academy-portal .coreui-traffic {
    min-height: 0 !important;
}

body.site-body--academy-admin .academy-portal .coreui-progress-grid {
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)) !important;
}

body.site-body--academy-admin .academy-portal .coreui-reports-link {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

body.site-body--academy-admin .academy-portal .coreui-reports-link svg {
    width: 1rem;
    height: 1rem;
}

body.site-body--academy-admin .academy-portal .acad-dashboard-layout--single {
    grid-template-columns: minmax(0, 1fr) !important;
}

:root[data-theme="dark"] body.site-body--academy-admin .academy-portal .acad-money-card > :where(span, small) {
    color: var(--sf-text-secondary) !important;
}

@media (max-width: 48rem) {
    body.site-body--academy-admin .academy-portal .acad-topbar {
        min-height: 4rem !important;
        height: auto !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
        gap: 0.55rem !important;
        padding: 0.65rem 0.75rem !important;
        overflow: visible !important;
    }

    body.site-body--academy-admin .academy-portal .acad-topbar__breadcrumb {
        min-width: 0 !important;
        gap: 0.32rem !important;
        overflow: hidden !important;
        font-size: 0.82rem !important;
        white-space: nowrap !important;
    }

    body.site-body--academy-admin .academy-portal .acad-topbar__breadcrumb > span:last-child {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    body.site-body--academy-admin .academy-portal .acad-topbar__actions {
        min-width: 0 !important;
        margin-inline-start: 0 !important;
    }

    body.site-body--academy-admin .academy-portal .acad-topbar__actions .btn {
        max-width: 8.25rem !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
}

.ap-mobile-bar__title {
    flex: 1 1 auto;
}

.ap-mobile-bar .ap-mobile-bar__theme-toggle {
    flex: 0 0 auto;
    min-inline-size: 2.5rem;
    min-block-size: 2.5rem;
    padding: 0.55rem;
    border-color: var(--cui-admin-border-soft);
    border-radius: var(--cui-admin-radius);
    background: var(--cui-admin-surface-2);
    color: var(--cui-admin-text);
    box-shadow: none;
}

/* Guardian portal: legacy white cards now follow the shared semantic theme. */
:root[data-theme="dark"] .parent-dashboard {
    color: var(--sf-text);
}

:root[data-theme="dark"] .parent-dashboard :where(.parent-dashboard__hero, .parent-kpi, .parent-panel) {
    border-color: var(--sf-border);
    background: var(--sf-surface);
    color: var(--sf-text);
    box-shadow: var(--sf-shadow-sm);
}

:root[data-theme="dark"] .parent-dashboard .parent-dashboard__balance {
    border-color: var(--sf-info-border);
    background: var(--sf-info-soft);
}

:root[data-theme="dark"] .parent-dashboard .parent-dashboard__balance :where(span, small) {
    color: var(--sf-text-secondary);
}

:root[data-theme="dark"] .parent-dashboard .parent-dashboard__balance strong,
:root[data-theme="dark"] .parent-dashboard :where(.portal__title, .parent-kpi strong, .parent-panel__head h2, .parent-simple-list strong) {
    color: var(--sf-text);
}

:root[data-theme="dark"] .parent-dashboard :where(.parent-dashboard__eyebrow, .parent-panel__head a, .parent-academy h3 a) {
    color: var(--sf-brand);
}

:root[data-theme="dark"] .parent-dashboard :where(.text-muted, .parent-kpi span, .parent-kpi small, .parent-academy span, .parent-simple-list span) {
    color: var(--sf-text-muted);
}

:root[data-theme="dark"] .parent-dashboard :where(.parent-academy, .parent-simple-list li, .parent-link-form code, .parent-table code) {
    border-color: var(--sf-border);
    background: var(--sf-surface-sunken);
    color: var(--sf-text);
}

:root[data-theme="dark"] .parent-dashboard .parent-academy li a {
    border: 1px solid var(--sf-border);
    background: var(--sf-surface-raised);
    color: var(--sf-text);
}

:root[data-theme="dark"] .parent-dashboard :where(.data-table th, .data-table td) {
    border-color: var(--sf-border);
    color: var(--sf-text-secondary);
}

:root[data-theme="dark"] .parent-dashboard .data-table th {
    background: var(--sf-surface-sunken);
    color: var(--sf-text);
}

/* Player portal shares one preference with every other SFSPORT360 surface. */
:root[data-theme="light"] .player-desk.player-desk--transfermarkt #overview {
    --po-brand: #08705a;
    --overview-brand: #08705a;
}

:root[data-theme="dark"] .player-desk.player-desk--transfermarkt #overview {
    --po-brand: #72dfbd;
    --po-kicker: #9cabc0;
}

:root[data-theme="light"] .brand-wordmark__sf {
    color: #08705a;
}

:where(.dir-hero__back, .mkt-login-flow__back, .wizard-topbar__exit) {
    min-block-size: 2rem;
    padding-block: 0.3rem;
}

.text-muted {
    color: var(--sf-text-muted);
}

/* Utilities */
.sf-visually-hidden {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.sf-text-muted {
    color: var(--sf-text-muted);
}

.sf-text-success {
    color: var(--sf-success);
}

.sf-text-danger {
    color: var(--sf-danger);
}

.sf-divider {
    block-size: 1px;
    border: 0;
    background: var(--sf-border);
}

/* Gate 2 public-page accessibility: keep every legacy page token aligned
   with the semantic palette, including nested cards and helper panels. */
.site-body--marketing :where(.mkt-about-page__back, .mkt-faq-page__back, .mkt-contact-page__back) {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 2.75rem;
}

:root[data-theme="dark"] body.site-body--marketing .mkt-about-page {
    --about-green: var(--sf-brand);
    --about-green-soft: var(--sf-brand-soft);
    --about-green-dark: var(--sf-brand-hover);
    --about-blue: var(--sf-accent);
    --about-border: var(--sf-border);
    --about-text: var(--sf-text);
    --about-muted: var(--sf-text-secondary);
    background: var(--sf-page-glow), var(--sf-canvas);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-faq-page {
    --faq-green: var(--sf-brand);
    --faq-green-soft: var(--sf-brand-soft);
    --faq-green-dark: var(--sf-brand-hover);
    --faq-blue: var(--sf-accent);
    --faq-border: var(--sf-border);
    --faq-text: var(--sf-text);
    --faq-muted: var(--sf-text-secondary);
    background: var(--sf-canvas);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-faq-page__hero {
    background: var(--sf-page-glow), var(--sf-canvas-subtle);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-faq-page__nav,
:root[data-theme="dark"] body.site-body--marketing .mkt-faq-panel,
:root[data-theme="dark"] body.site-body--marketing .mkt-faq-page__cta {
    border-color: var(--sf-border);
    background: var(--sf-surface);
    color: var(--sf-text);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-faq-page__group-head h2 {
    color: var(--sf-text);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-contact-page {
    --ct-green: var(--sf-brand);
    --ct-green-soft: var(--sf-brand-soft);
    --ct-green-dark: var(--sf-brand-hover);
    --ct-blue: var(--sf-accent);
    --ct-border: var(--sf-border);
    --ct-text: var(--sf-text);
    --ct-muted: var(--sf-text-secondary);
    background: var(--sf-page-glow), var(--sf-canvas);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-about-content h2,
:root[data-theme="dark"] body.site-body--marketing .mkt-about-sidebar__card strong,
:root[data-theme="dark"] body.site-body--marketing .mkt-contact-content h2,
:root[data-theme="dark"] body.site-body--marketing .mkt-contact-form-card h2 {
    color: var(--sf-text);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-about-content :where(p, li),
:root[data-theme="dark"] body.site-body--marketing .mkt-about-sidebar__card p,
:root[data-theme="dark"] body.site-body--marketing .mkt-contact-content :where(p, li),
:root[data-theme="dark"] body.site-body--marketing .mkt-contact-form-card > p,
:root[data-theme="dark"] body.site-body--marketing .mkt-contact-form__consent label {
    color: var(--sf-text-secondary);
}

:root[data-theme="dark"] body.site-body--marketing .mkt-contact-form-card__eyebrow {
    background: var(--sf-brand-soft);
    color: var(--sf-brand-hover);
}

:root[data-theme="dark"] body.site-body--marketing:has(.academy-microsite) {
    background: var(--sf-page-glow), var(--sf-canvas);
}

:root[data-theme="dark"] body.site-body--marketing .academy-microsite__breadcrumbs {
    color: var(--sf-text-secondary);
}

:root[data-theme="dark"] body.site-body--marketing .academy-microsite__breadcrumbs a {
    color: var(--sf-accent-hover);
}

:root[data-theme="dark"] body.site-body--marketing .academy-page-nav {
    border-color: var(--sf-border);
    background: var(--sf-surface-overlay);
    box-shadow: var(--sf-shadow-md);
}

:root[data-theme="dark"] body.site-body--marketing .academy-page-nav a {
    color: var(--sf-text);
}

:root[data-theme="dark"] body.site-body--marketing .academy-page-nav a:is(:hover, :focus-visible) {
    background: var(--sf-brand-soft);
    color: var(--sf-brand-hover);
}

:root[data-theme="dark"] body.site-body--marketing .academy-microsite__brand-card > span {
    background: var(--sf-brand-soft);
    color: var(--sf-brand-hover);
}

:root[data-theme="dark"] body.site-body--marketing :where(
    .academy-microsite__stats div,
    .academy-official-grid article,
    .academy-public-card,
    .academy-price-card,
    .academy-coach-card,
    .academy-branch-card,
    .academy-public-map
) {
    border-color: var(--sf-border);
    background: var(--sf-surface);
    color: var(--sf-text);
    box-shadow: var(--sf-shadow-sm);
}

:root[data-theme="dark"] body.site-body--marketing .academy-gallery__mark {
    background: linear-gradient(135deg, var(--sf-surface-raised), var(--sf-brand-soft));
    color: var(--sf-brand-hover);
}

:root[data-theme="dark"] body.site-body--marketing :where(
    .academy-microsite__stats strong,
    .academy-official-grid strong,
    .academy-microsite__section-head h2,
    .academy-public-card h3,
    .academy-price-card h3,
    .academy-price-card strong,
    .academy-coach-card h3,
    .academy-branch-card h3,
    .academy-public-card__meta dd,
    .academy-public-map__info strong
) {
    color: var(--sf-text);
}

:root[data-theme="dark"] body.site-body--marketing :where(
    .academy-microsite__stats span,
    .academy-official-grid span,
    .academy-public-card p,
    .academy-price-card p,
    .academy-coach-card p,
    .academy-coach-card small,
    .academy-branch-card p,
    .academy-public-card__meta dt,
    .academy-public-map__info p
) {
    color: var(--sf-text-secondary);
}

:root[data-theme="dark"] body.site-body--marketing :where(
    .academy-microsite__section-head span,
    .academy-public-card__icon,
    .academy-public-map__info span
) {
    border-color: var(--sf-success-border);
    background: var(--sf-brand-soft);
    color: var(--sf-brand-hover);
}

:root[data-theme="dark"] body.site-body--marketing :where(
    .academy-price-card > span,
    .academy-branch-card > span,
    .academy-branch-card a:not(.btn)
) {
    color: var(--sf-brand-hover);
}

:root[data-theme="dark"] body.site-body--marketing .academy-public-card__meta div {
    border-color: var(--sf-border);
}

:root[data-theme="dark"] body.site-body--marketing .academy-public-map__canvas {
    background: var(--sf-surface-sunken);
}

:root[data-theme="dark"] body.site-body--marketing .academy-public-map__info {
    background: var(--sf-surface-sunken);
}

:root[data-theme="dark"] body.site-body--marketing .auth-summary--bullets span,
:root[data-theme="dark"] body.site-body--marketing .auth-inline-help {
    border-color: var(--sf-border);
    background: var(--sf-surface-sunken);
    color: var(--sf-text-secondary);
}

@media (max-width: 48rem) {
    .sf-section-head {
        align-items: stretch;
        flex-direction: column;
    }

    .topbar__mobile-actions .sf-theme-toggle {
        min-inline-size: 2.35rem;
        min-block-size: 2.35rem;
        padding-inline: var(--sf-space-2);
    }

    .player-mobile-tabs {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .player-mobile-tabs .player-mobile-theme {
        min-inline-size: 0;
        min-block-size: 3.25rem;
        padding: 0.28rem 0.18rem;
        border: 0;
        border-radius: 13px;
        background: transparent;
        box-shadow: none;
        color: inherit;
        font-size: 0.58rem;
        font-weight: 950;
    }

    .player-mobile-tabs .player-mobile-theme:hover {
        transform: none;
    }

    .player-mobile-tabs .player-mobile-theme .theme-toggle__text {
        display: block;
        font: inherit;
    }
}

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

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

@media (forced-colors: active) {
    .sf-button,
    .btn,
    .sf-card,
    .card,
    .sf-input,
    .sf-theme-toggle {
        border: 1px solid CanvasText;
    }
}

/* =====================================================================
   SFSPORT360 2026 operations shell
   Shared command structure for every academy/club administration screen.
   ===================================================================== */

:root,
:root[data-theme="light"] {
    --sf-ops-canvas: #f3f8f6;
    --sf-ops-surface: #ffffff;
    --sf-ops-surface-soft: #edf5f2;
    --sf-ops-surface-blue: #eef4ff;
    --sf-ops-line: #d9e7e2;
    --sf-ops-line-strong: #bfd6ce;
    --sf-ops-text: #102a36;
    --sf-ops-muted: #60747c;
    --sf-ops-green: #0b8769;
    --sf-ops-green-deep: #075e4c;
    --sf-ops-blue: #2869df;
    --sf-ops-lime: #b8e34a;
    --sf-ops-navy: #082c37;
    --sf-ops-navy-soft: #0b3942;
    --sf-ops-sidebar-text: #edf9f5;
    --sf-ops-sidebar-muted: #a7c8c2;
    --sf-ops-shadow: 0 16px 46px rgba(8, 44, 55, 0.08);
    --sf-ops-header-h: 68px;
    --sf-ops-sidebar-w: 276px;
}

:root[data-theme="dark"] {
    --sf-ops-canvas: #071820;
    --sf-ops-surface: #0e2731;
    --sf-ops-surface-soft: #12323c;
    --sf-ops-surface-blue: #102b42;
    --sf-ops-line: rgba(214, 240, 233, 0.13);
    --sf-ops-line-strong: rgba(214, 240, 233, 0.22);
    --sf-ops-text: #eff9f6;
    --sf-ops-muted: #9db8bc;
    --sf-ops-green: #31c79c;
    --sf-ops-green-deep: #83e5c4;
    --sf-ops-blue: #73a5ff;
    --sf-ops-lime: #c7ec66;
    --sf-ops-navy: #04171f;
    --sf-ops-navy-soft: #092a33;
    --sf-ops-shadow: 0 18px 52px rgba(0, 0, 0, 0.24);
}

body.site-body--academy-admin {
    display: flex !important;
    width: 100% !important;
    height: 100svh !important;
    min-height: 100svh !important;
    flex-direction: column !important;
    overflow: hidden !important;
    background: var(--sf-ops-canvas) !important;
    color: var(--sf-ops-text) !important;
    font-family: var(--sf-font-sans) !important;
}

body.site-body--academy-admin,
body.site-body--academy-admin :where(button, input, select, textarea) {
    font-family: var(--sf-font-sans) !important;
}

body.site-body--academy-admin .sf-opsbar {
    position: relative;
    z-index: 120;
    display: flex;
    width: 100%;
    min-height: var(--sf-ops-header-h);
    flex: 0 0 var(--sf-ops-header-h);
    align-items: center;
    gap: 1rem;
    padding: 0.62rem clamp(1rem, 2.2vw, 1.75rem);
    border-bottom: 1px solid rgba(255, 255, 255, 0.09);
    background:
        radial-gradient(circle at 15% -80%, rgba(184, 227, 74, 0.16), transparent 20rem),
        linear-gradient(92deg, #072a35, #0a3440 58%, #082936);
    color: #f3fbf8;
    box-shadow: 0 6px 24px rgba(5, 30, 40, 0.12);
}

.sf-opsbar__brand {
    display: flex;
    min-width: calc(var(--sf-ops-sidebar-w) - 1.75rem);
    align-items: center;
    gap: 0.65rem;
    color: #fff;
    text-decoration: none;
}

.sf-opsbar__brand img {
    width: 38px;
    height: 38px;
    padding: 0.2rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.07);
}

.sf-opsbar__wordmark {
    color: #fff;
    font-size: 0.95rem;
    font-weight: 950;
    letter-spacing: 0.015em;
}

.sf-opsbar__wordmark span { color: var(--sf-ops-lime); }

.sf-opsbar__context {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.8rem;
}

.sf-opsbar__status {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 0.42rem;
    padding: 0.34rem 0.6rem;
    border: 1px solid rgba(199, 236, 102, 0.18);
    border-radius: 999px;
    background: rgba(199, 236, 102, 0.08);
    color: var(--sf-ops-lime);
    font-size: 0.65rem;
    font-weight: 950;
}

.sf-opsbar__status i,
.academy-entity-card__status i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 0 4px color-mix(in srgb, currentColor 15%, transparent);
}

.sf-opsbar__divider {
    width: 1px;
    height: 30px;
    background: rgba(255, 255, 255, 0.13);
}

.sf-opsbar__academy {
    display: grid;
    min-width: 0;
    gap: 0.04rem;
}

.sf-opsbar__academy strong {
    overflow: hidden;
    color: #fff;
    font-size: 0.84rem;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sf-opsbar__academy small {
    color: rgba(225, 243, 238, 0.65);
    font-size: 0.64rem;
    font-weight: 700;
}

.sf-opsbar__actions {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.42rem;
    margin-inline-start: auto;
}

.sf-opsbar__action {
    position: relative;
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    gap: 0.45rem;
    padding: 0.42rem 0.68rem;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.055);
    color: rgba(242, 251, 248, 0.85);
    font-size: 0.7rem;
    font-weight: 850;
    text-decoration: none;
}

.sf-opsbar__action:hover {
    border-color: rgba(184, 227, 74, 0.24);
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.sf-opsbar__action .nav-icon {
    display: inline-grid;
    width: 20px;
    height: 20px;
    place-items: center;
    color: #8fe5ca;
}

.sf-opsbar__badge {
    display: grid;
    min-width: 18px;
    height: 18px;
    place-items: center;
    border-radius: 999px;
    background: var(--sf-ops-lime);
    color: #173622;
    font-size: 0.6rem;
}

.sf-opsbar__actions .lang-form { margin: 0; }
.sf-opsbar__actions .lang-toggle {
    min-width: 40px;
    min-height: 38px;
    border-color: rgba(255, 255, 255, 0.11);
    background: rgba(255, 255, 255, 0.055);
    color: #fff;
    box-shadow: none;
}
.sf-opsbar__actions .lang-toggle__text { display: none; }

body.site-body--academy-admin main.site-main#main-content.sf-workspace-main {
    width: 100% !important;
    height: calc(100svh - var(--sf-ops-header-h)) !important;
    min-height: 0 !important;
    max-height: calc(100svh - var(--sf-ops-header-h)) !important;
    flex: 0 0 calc(100svh - var(--sf-ops-header-h)) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: var(--sf-ops-canvas) !important;
}

body.site-body--academy-admin .academy-portal {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: var(--sf-ops-canvas) !important;
    color: var(--sf-ops-text) !important;
}

body.site-body--academy-admin .academy-portal > .container.portal__layout {
    display: grid !important;
    grid-template-columns: var(--sf-ops-sidebar-w) minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 1fr) !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
    background: var(--sf-ops-canvas) !important;
}

body.site-body--academy-admin .academy-portal .ap-shell {
    display: block !important;
    width: var(--sf-ops-sidebar-w) !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 0 !important;
}

body.site-body--academy-admin .academy-portal .academy-sidebar.card,
body.site-body--academy-admin .academy-portal aside.portal-nav.card,
body.site-body--academy-admin .academy-portal .academy-sidebar {
    position: relative !important;
    z-index: 100 !important;
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    flex-direction: column !important;
    overflow: hidden !important;
    border: 0 !important;
    border-inline-end: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 0 !important;
    background:
        radial-gradient(circle at 45% -8%, rgba(184, 227, 74, 0.12), transparent 15rem),
        linear-gradient(165deg, var(--sf-ops-navy-soft), var(--sf-ops-navy) 62%) !important;
    color: var(--sf-ops-sidebar-text) !important;
    box-shadow: none !important;
}

.academy-sidebar__head {
    display: grid;
    flex: 0 0 auto;
    gap: 0.72rem;
    padding: 0.9rem 0.85rem 0.72rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

body.site-body--academy-admin .academy-sidebar__brand {
    display: flex !important;
    width: 100% !important;
    height: auto !important;
    min-height: 44px !important;
    align-items: center !important;
    gap: 0.68rem !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #fff !important;
    text-decoration: none !important;
}

body.site-body--academy-admin .academy-sidebar__brand-logo {
    display: grid !important;
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px !important;
    place-items: center !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 13px !important;
    background: rgba(255, 255, 255, 0.07) !important;
}

body.site-body--academy-admin .academy-sidebar__brand-logo img {
    width: 34px !important;
    height: 34px !important;
    filter: none !important;
}

.academy-sidebar__brand-text { display: grid; min-width: 0; gap: 0.02rem; }
body.site-body--academy-admin .academy-sidebar__brand-name {
    color: #fff !important;
    font-size: 0.92rem !important;
    font-weight: 950 !important;
}
body.site-body--academy-admin .academy-sidebar__brand-name span { color: var(--sf-ops-lime) !important; }
body.site-body--academy-admin .academy-sidebar__brand-sub {
    color: var(--sf-ops-sidebar-muted) !important;
    font-size: 0.65rem !important;
    font-weight: 750 !important;
}

.academy-entity-card {
    position: relative;
    display: grid;
    gap: 0.14rem;
    padding: 0.78rem 0.8rem;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.055);
}

.academy-entity-card::before {
    position: absolute;
    inset-block: 0;
    inset-inline-start: 0;
    width: 3px;
    background: linear-gradient(var(--sf-ops-lime), #2acba0);
    content: "";
}

.academy-entity-card__status {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 0.4rem;
    color: var(--sf-ops-lime) !important;
    font-size: 0.62rem !important;
    font-weight: 950 !important;
}

.academy-entity-card > strong {
    margin-top: 0.18rem;
    overflow: hidden;
    color: #fff !important;
    font-size: 0.82rem !important;
    font-weight: 900 !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.academy-entity-card > span:last-child {
    overflow: hidden;
    color: var(--sf-ops-sidebar-muted) !important;
    font-size: 0.63rem !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.academy-sidebar__quick {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.35rem;
}

.academy-sidebar__quick > a {
    position: relative;
    display: grid;
    min-height: 36px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.045);
    color: #9ce6cf !important;
    text-decoration: none !important;
}

.academy-sidebar__quick > a:hover { background: rgba(255, 255, 255, 0.1); color: #fff !important; }
.academy-sidebar__quick > a b {
    position: absolute;
    inset-block-start: -4px;
    inset-inline-end: -4px;
    display: grid;
    min-width: 17px;
    height: 17px;
    place-items: center;
    border-radius: 999px;
    background: var(--sf-ops-lime);
    color: #173622;
    font-size: 0.56rem;
}

body.site-body--academy-admin .academy-sidebar__switch {
    display: flex;
    min-height: 38px;
    align-items: center;
    gap: 0.55rem;
    padding: 0.48rem 0.62rem;
    border: 1px dashed rgba(184, 227, 74, 0.24);
    border-radius: 10px;
    background: rgba(184, 227, 74, 0.055);
    color: #e9f8f3 !important;
    font-size: 0.72rem;
    font-weight: 850;
    text-decoration: none !important;
}

.academy-sidebar__switch-arrow { margin-inline-start: auto; color: var(--sf-ops-lime) !important; }

body.site-body--academy-admin .academy-portal .portal-nav__links {
    display: grid !important;
    flex: 1 1 auto !important;
    align-content: start !important;
    gap: 0.55rem !important;
    min-height: 0 !important;
    padding: 0.65rem 0.65rem 1rem !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background: transparent !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.16) transparent;
}

.academy-nav-group {
    display: grid;
    gap: 0.12rem;
    padding-bottom: 0.45rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.055);
}
.academy-nav-group:last-child { border-bottom: 0; }

body.site-body--academy-admin .academy-portal .acad-nav-section__label {
    display: block !important;
    margin: 0 !important;
    padding: 0.3rem 0.65rem 0.36rem !important;
    color: rgba(214, 237, 231, 0.5) !important;
    font-size: 0.61rem !important;
    font-weight: 950 !important;
    letter-spacing: 0.055em !important;
    line-height: 1.3 !important;
    text-transform: none !important;
}

body.site-body--academy-admin .academy-portal .portal-nav__link {
    position: relative !important;
    display: flex !important;
    width: 100% !important;
    min-height: 39px !important;
    align-items: center !important;
    gap: 0.58rem !important;
    margin: 0 !important;
    padding: 0.45rem 0.58rem !important;
    border: 1px solid transparent !important;
    border-radius: 10px !important;
    background: transparent !important;
    color: var(--sf-ops-sidebar-muted) !important;
    font-size: 0.75rem !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
}

body.site-body--academy-admin .academy-portal .portal-nav__link:hover {
    border-color: rgba(255, 255, 255, 0.08) !important;
    background: rgba(255, 255, 255, 0.065) !important;
    color: #fff !important;
}

body.site-body--academy-admin .academy-portal .portal-nav__link.is-active {
    border-color: rgba(184, 227, 74, 0.16) !important;
    background: linear-gradient(90deg, rgba(27, 185, 140, 0.2), rgba(184, 227, 74, 0.075)) !important;
    color: #fff !important;
    box-shadow: inset 3px 0 0 var(--sf-ops-lime) !important;
}
[dir="rtl"] body.site-body--academy-admin .academy-portal .portal-nav__link.is-active {
    box-shadow: inset -3px 0 0 var(--sf-ops-lime) !important;
}

.portal-nav__label {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.site-body--academy-admin .academy-portal .portal-nav__links .portal-nav__link .nav-icon,
body.site-body--academy-admin .academy-sidebar__quick .nav-icon,
body.site-body--academy-admin .sf-opsbar .nav-icon {
    display: inline-grid !important;
    width: 27px !important;
    min-width: 27px !important;
    height: 27px !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, 0.065) !important;
    color: #84d9c1 !important;
    font-size: 0 !important;
}

body.site-body--academy-admin .academy-portal .portal-nav__links .portal-nav__link .nav-icon::before,
body.site-body--academy-admin .academy-sidebar__quick .nav-icon::before,
body.site-body--academy-admin .sf-opsbar .nav-icon::before {
    display: block !important;
    width: auto !important;
    height: auto !important;
    background: none !important;
    color: currentColor !important;
    font-family: var(--sf-font-sans) !important;
    font-size: 0.88rem !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    -webkit-mask: none !important;
    mask: none !important;
}

.nav-icon--dashboard::before { content: "⌂" !important; }
.nav-icon--reports::before { content: "↗" !important; }
.nav-icon--settings::before { content: "⚙" !important; }
.nav-icon--switch::before { content: "⇄" !important; }
.nav-icon--players::before { content: "◉" !important; }
.nav-icon--guardians::before { content: "♢" !important; }
.nav-icon--coaches::before { content: "✦" !important; }
.nav-icon--staff::before { content: "♙" !important; }
.nav-icon--teams::before { content: "⬡" !important; }
.nav-icon--schedule::before { content: "▦" !important; }
.nav-icon--shifts::before { content: "◷" !important; }
.nav-icon--plans::before { content: "▤" !important; }
.nav-icon--subscriptions::before { content: "↻" !important; }
.nav-icon--invoices::before { content: "⌑" !important; }
.nav-icon--wallet::before { content: "▱" !important; }
.nav-icon--facilities::before { content: "▥" !important; }
.nav-icon--branches::before { content: "⌘" !important; }
.nav-icon--equipment::before { content: "◇" !important; }
.nav-icon--transport::before { content: "▰" !important; }
.nav-icon--drivers::before { content: "♙" !important; }
.nav-icon--routes::before { content: "⌁" !important; }
.nav-icon--notifications::before { content: "●" !important; }
.nav-icon--documents::before { content: "▧" !important; }
.nav-icon--consents::before { content: "✓" !important; }
.nav-icon--logout::before { content: "↪" !important; }
.nav-icon--external::before { content: "↗" !important; }

body.site-body--academy-admin .academy-portal .portal-nav__link.is-active .nav-icon,
body.site-body--academy-admin .academy-portal .portal-nav__link:hover .nav-icon {
    background: rgba(184, 227, 74, 0.1) !important;
    color: var(--sf-ops-lime) !important;
}

body.site-body--academy-admin .academy-portal .nav-badge {
    display: grid !important;
    min-width: 20px !important;
    height: 20px !important;
    place-items: center !important;
    margin-inline-start: auto !important;
    padding: 0 0.28rem !important;
    border-radius: 999px !important;
    background: var(--sf-ops-lime) !important;
    color: #173622 !important;
    font-size: 0.58rem !important;
    font-weight: 950 !important;
}

body.site-body--academy-admin .academy-sidebar__foot {
    position: static !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0.55rem !important;
    flex: 0 0 auto !important;
    padding: 0.72rem 0.8rem 0.8rem !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
    background: rgba(1, 18, 24, 0.2) !important;
}

body.site-body--academy-admin .academy-sidebar__foot .acad-user-card {
    display: grid !important;
    grid-template-columns: 36px minmax(0, 1fr) 7px !important;
    align-items: center !important;
    gap: 0.58rem !important;
}

body.site-body--academy-admin .academy-sidebar__foot .acad-user-avatar {
    display: grid !important;
    width: 36px !important;
    height: 36px !important;
    place-items: center !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 11px !important;
    background: rgba(255, 255, 255, 0.08) !important;
    color: #fff !important;
    font-size: 0.75rem !important;
    font-weight: 950 !important;
}

.acad-user-online {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--sf-ops-lime);
}

.academy-sidebar__preferences {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.4rem;
}

body.site-body--academy-admin .academy-sidebar__foot .academy-sidebar__theme-toggle,
body.site-body--academy-admin .academy-sidebar__foot .lang-toggle {
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 37px !important;
    min-height: 37px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.4rem !important;
    padding: 0.38rem 0.58rem !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 9px !important;
    background: rgba(255, 255, 255, 0.045) !important;
    color: var(--sf-ops-sidebar-muted) !important;
    font-size: 0.65rem !important;
    line-height: 1 !important;
    box-shadow: none !important;
}

body.site-body--academy-admin .academy-sidebar__foot .theme-toggle__icon { font-size: 0.9rem !important; }
body.site-body--academy-admin .academy-sidebar__foot .theme-toggle__text { display: inline !important; font-size: 0.65rem !important; }
body.site-body--academy-admin .academy-sidebar__foot .lang-toggle__text { display: none; }

body.site-body--academy-admin .academy-sidebar__foot .acad-signout {
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 38px !important;
    min-height: 38px !important;
    justify-content: flex-start !important;
    gap: 0.52rem !important;
    padding: 0.42rem 0.6rem !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
    border-radius: 9px !important;
    color: var(--sf-ops-sidebar-muted) !important;
    font-size: 0.68rem !important;
    line-height: 1 !important;
}

body.site-body--academy-admin .academy-sidebar__foot .acad-signout:hover {
    border-color: rgba(255, 132, 132, 0.22) !important;
    background: rgba(255, 93, 93, 0.07) !important;
    color: #ffb6b6 !important;
}

body.site-body--academy-admin .academy-portal .portal__main {
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 0 !important;
    flex-direction: column !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background:
        radial-gradient(circle at 90% 0%, color-mix(in srgb, var(--sf-ops-blue) 6%, transparent), transparent 25rem),
        var(--sf-ops-canvas) !important;
    color: var(--sf-ops-text) !important;
}

/* Page-level command bar: context at one side, current task actions at the other. */
body.site-body--academy-admin .academy-portal .acad-topbar {
    min-height: 58px !important;
    height: auto !important;
    flex: 0 0 auto !important;
    padding: 0.55rem clamp(0.9rem, 2vw, 1.45rem) !important;
    border-bottom: 1px solid var(--sf-ops-line) !important;
    background: color-mix(in srgb, var(--sf-ops-surface) 91%, transparent) !important;
    color: var(--sf-ops-text) !important;
    backdrop-filter: blur(14px);
}

body.site-body--academy-admin .academy-portal .acad-topbar__breadcrumb,
body.site-body--academy-admin .academy-portal .acad-topbar__current {
    color: var(--sf-ops-text) !important;
    font-weight: 850 !important;
}

/* Shared content primitives: surfaces, heroes, KPIs, forms and empty states. */
body.site-body--academy-admin .academy-portal :where(
    .card:not(.academy-sidebar):not(.portal-nav),
    .acad-panel,
    .portal-section,
    .finance-table-card,
    .finance-detail-card,
    .finance-invoice-card,
    .report-card,
    .report-insight-card,
    .ops-directory,
    .ops-filter-panel
) {
    border: 1px solid var(--sf-ops-line) !important;
    border-radius: 15px !important;
    background: var(--sf-ops-surface) !important;
    color: var(--sf-ops-text) !important;
    box-shadow: 0 1px 2px rgba(8, 44, 55, 0.035) !important;
}

body.site-body--academy-admin .academy-portal :where(
    [class$="-hero"],
    [class*="-hero "],
    .portal__header,
    .acad-page-head
) {
    position: relative !important;
    overflow: hidden !important;
    border: 1px solid color-mix(in srgb, var(--sf-banner-text) 14%, transparent) !important;
    border-radius: 16px !important;
    background: var(--sf-banner-bg) !important;
    color: var(--sf-banner-text) !important;
    box-shadow: none !important;
}

body.site-body--academy-admin .academy-portal :where([class$="-hero"], [class*="-hero "], .portal__header, .acad-page-head)::after {
    position: absolute;
    inset-block-start: 0;
    inset-inline: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--sf-ops-green), var(--sf-ops-blue), var(--sf-ops-lime));
    content: "";
}

body.site-body--academy-admin .academy-portal :where([class$="-hero"], [class*="-hero "], .portal__header, .acad-page-head) :where(h1, h2, h3, strong) {
    color: var(--sf-banner-text) !important;
}
body.site-body--academy-admin .academy-portal :where([class$="-hero"], [class*="-hero "], .portal__header, .acad-page-head) :where(p, .text-muted) {
    color: var(--sf-banner-muted) !important;
}

body.site-body--academy-admin .academy-portal :where(.stats-grid, [class$="-kpi-grid"], [class*="-kpi-grid "]) {
    gap: 0.75rem !important;
}

body.site-body--academy-admin .academy-portal :where(
    .stat-card,
    .coreui-stat-card,
    [class$="-kpi"],
    [class*="-kpi "]
) {
    position: relative !important;
    overflow: hidden !important;
    border: 1px solid var(--sf-ops-line) !important;
    border-radius: 14px !important;
    background: var(--sf-ops-surface) !important;
    color: var(--sf-ops-text) !important;
    box-shadow: none !important;
}

body.site-body--academy-admin .academy-portal :where(.stat-card, .coreui-stat-card, [class$="-kpi"], [class*="-kpi "])::before {
    position: absolute;
    inset-block: 0;
    inset-inline-start: 0;
    width: 3px;
    background: var(--sf-ops-green);
    content: "";
}

body.site-body--academy-admin .academy-portal :where(.stat-card, .coreui-stat-card, [class$="-kpi"], [class*="-kpi "]):nth-child(4n + 2)::before { background: var(--sf-ops-blue); }
body.site-body--academy-admin .academy-portal :where(.stat-card, .coreui-stat-card, [class$="-kpi"], [class*="-kpi "]):nth-child(4n + 3)::before { background: var(--sf-ops-lime); }
body.site-body--academy-admin .academy-portal :where(.stat-card, .coreui-stat-card, [class$="-kpi"], [class*="-kpi "]):nth-child(4n + 4)::before { background: #f1aa3e; }

body.site-body--academy-admin .academy-portal :where(.stat-card, .coreui-stat-card, [class$="-kpi"], [class*="-kpi "]) :where(p, span, small) {
    color: var(--sf-ops-muted) !important;
}
body.site-body--academy-admin .academy-portal :where(.stat-card, .coreui-stat-card, [class$="-kpi"], [class*="-kpi "]) :where(strong, b, .stat-card__value, .coreui-stat-card__value) {
    color: var(--sf-ops-text) !important;
}

body.site-body--academy-admin .academy-portal .coreui-stat-card strong,
body.site-body--academy-admin .academy-portal .coreui-stat-card b {
    color: var(--sf-ops-text) !important;
}

body.site-body--academy-admin .academy-portal .coreui-stat-card span,
body.site-body--academy-admin .academy-portal .coreui-stat-card small,
body.site-body--academy-admin .academy-portal .coreui-stat-card .coreui-stat-card__action {
    color: var(--sf-ops-muted) !important;
}

body.site-body--academy-admin .academy-portal :where(.btn, button.btn, a.btn) {
    min-height: 40px !important;
    border-radius: 10px !important;
    font-size: 0.76rem !important;
    font-weight: 900 !important;
    box-shadow: none !important;
}

body.site-body--academy-admin .academy-portal :where(.btn--primary, .btn-primary) {
    border-color: var(--sf-ops-green) !important;
    background: var(--sf-ops-green) !important;
    color: #fff !important;
}
body.site-body--academy-admin .academy-portal :where(.btn--primary, .btn-primary):hover {
    border-color: var(--sf-ops-green-deep) !important;
    background: var(--sf-ops-green-deep) !important;
}
body.site-body--academy-admin .academy-portal :where(.btn--ghost, .btn-secondary) {
    border-color: var(--sf-ops-line-strong) !important;
    background: var(--sf-ops-surface) !important;
    color: var(--sf-ops-text) !important;
}

body.site-body--academy-admin .academy-portal :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
    min-height: 42px !important;
    border: 1px solid var(--sf-ops-line-strong) !important;
    border-radius: 10px !important;
    background: var(--sf-ops-surface-soft) !important;
    color: var(--sf-ops-text) !important;
    box-shadow: none !important;
}
body.site-body--academy-admin .academy-portal :where(input, select, textarea):focus {
    border-color: var(--sf-ops-green) !important;
    outline: 0 !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--sf-ops-green) 18%, transparent) !important;
}
body.site-body--academy-admin .academy-portal :where(label, .filter-field__label, .form-group__label) {
    color: var(--sf-ops-muted) !important;
    font-size: 0.74rem !important;
    font-weight: 850 !important;
}

body.site-body--academy-admin .academy-portal .data-table-wrap {
    border-color: var(--sf-ops-line) !important;
    background: var(--sf-ops-surface) !important;
}
body.site-body--academy-admin .academy-portal .data-table {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: transparent !important;
}
body.site-body--academy-admin .academy-portal .data-table th {
    padding: 0.7rem 0.78rem !important;
    border-bottom: 1px solid var(--sf-ops-line) !important;
    background: var(--sf-ops-surface-soft) !important;
    color: var(--sf-ops-muted) !important;
    font-size: 0.68rem !important;
    font-weight: 950 !important;
    text-align: start !important;
    white-space: nowrap !important;
}
body.site-body--academy-admin .academy-portal .data-table td {
    padding: 0.74rem 0.78rem !important;
    border-bottom: 1px solid var(--sf-ops-line) !important;
    background: transparent !important;
    color: var(--sf-ops-text) !important;
    font-size: 0.76rem !important;
}
body.site-body--academy-admin .academy-portal .data-table tbody tr:hover td {
    background: color-mix(in srgb, var(--sf-ops-green) 5%, transparent) !important;
}

body.site-body--academy-admin .academy-portal :where(.empty-state, .ops-empty-state, .empty-panel, .no-results) {
    display: grid !important;
    min-height: 150px !important;
    place-items: center !important;
    align-content: center !important;
    gap: 0.4rem !important;
    padding: 1.25rem !important;
    border: 1px dashed var(--sf-ops-line-strong) !important;
    border-radius: 14px !important;
    background:
        radial-gradient(circle at 50% 25%, color-mix(in srgb, var(--sf-ops-green) 7%, transparent), transparent 9rem),
        var(--sf-ops-surface-soft) !important;
    color: var(--sf-ops-muted) !important;
    text-align: center !important;
}

body.site-body--academy-admin .academy-portal :where(.status, .badge, [class*="status--"]) {
    border-radius: 999px !important;
    font-size: 0.65rem !important;
    font-weight: 900 !important;
}

.ap-mobile-bar { display: none !important; }
.ap-drawer-backdrop { display: none; }

@media (max-width: 1180px) {
    .sf-opsbar__action span:not(.nav-icon),
    .sf-opsbar__action--public { display: none; }
    .sf-opsbar__action { width: 38px; justify-content: center; padding: 0; }
}

@media (max-width: 1024px) {
    body.site-body--academy-admin .sf-opsbar { display: none; }

    body.site-body--academy-admin .academy-portal > .container.portal__layout {
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-rows: 62px minmax(0, 1fr) !important;
    }

    body.site-body--academy-admin .academy-portal .ap-shell {
        width: 100% !important;
        max-width: 100% !important;
        height: 62px !important;
        flex: 0 0 auto !important;
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    body.site-body--academy-admin .academy-portal .ap-mobile-bar {
        position: relative !important;
        z-index: 60 !important;
        display: flex !important;
        width: 100% !important;
        height: 62px !important;
        align-items: center !important;
        gap: 0.7rem !important;
        padding: 0.58rem 0.78rem !important;
        border-bottom: 1px solid var(--sf-ops-line) !important;
        background: color-mix(in srgb, var(--sf-ops-surface) 92%, transparent) !important;
        color: var(--sf-ops-text) !important;
        box-shadow: 0 5px 18px rgba(8, 44, 55, 0.06) !important;
        backdrop-filter: blur(14px);
    }

    .ap-mobile-bar__menu {
        display: grid;
        width: 42px;
        height: 42px;
        flex: 0 0 42px;
        place-items: center;
        padding: 0;
        border: 1px solid var(--sf-ops-line) !important;
        border-radius: 11px !important;
        background: var(--sf-ops-surface-soft) !important;
        color: var(--sf-ops-text) !important;
    }
    .ap-mobile-bar__menu svg { width: 22px; height: 22px; }

    .ap-mobile-bar__identity {
        display: flex;
        min-width: 0;
        flex: 1 1 auto;
        align-items: center;
        gap: 0.52rem;
    }
    .ap-mobile-bar__identity img { width: 30px; height: 30px; }
    .ap-mobile-bar__identity > span { display: grid; min-width: 0; }
    .ap-mobile-bar__identity strong {
        overflow: hidden;
        color: var(--sf-ops-text) !important;
        font-size: 0.78rem;
        font-weight: 950;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .ap-mobile-bar__identity small { color: var(--sf-ops-muted) !important; font-size: 0.6rem; }

    .ap-mobile-bar__notice,
    .ap-mobile-bar__theme-toggle {
        position: relative;
        display: grid !important;
        width: 42px;
        min-width: 42px;
        height: 42px;
        place-items: center;
        padding: 0 !important;
        border: 1px solid var(--sf-ops-line) !important;
        border-radius: 11px !important;
        background: var(--sf-ops-surface-soft) !important;
        color: var(--sf-ops-text) !important;
        text-decoration: none !important;
    }
    .ap-mobile-bar__notice b {
        position: absolute;
        inset-block-start: -4px;
        inset-inline-end: -4px;
        display: grid;
        min-width: 18px;
        height: 18px;
        place-items: center;
        border-radius: 999px;
        background: var(--sf-ops-lime);
        color: #173622;
        font-size: 0.58rem;
    }

    body.site-body--academy-admin .academy-portal .academy-sidebar.card,
    body.site-body--academy-admin .academy-portal aside.portal-nav.card,
    body.site-body--academy-admin .academy-portal .academy-sidebar {
        position: fixed !important;
        z-index: 105 !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: auto !important;
        inset-inline-start: auto !important;
        inset-inline-end: auto !important;
        width: min(88vw, 320px) !important;
        max-width: 320px !important;
        height: 100svh !important;
        transform: translateX(108%) !important;
        box-shadow: 0 24px 70px rgba(0, 0, 0, 0.3) !important;
        transition: transform var(--sf-duration-normal) var(--sf-ease-standard) !important;
    }
    html[dir="ltr"] body.site-body--academy-admin .academy-portal .academy-sidebar.card,
    html[dir="ltr"] body.site-body--academy-admin .academy-portal aside.portal-nav.card,
    html[dir="ltr"] body.site-body--academy-admin .academy-portal .academy-sidebar {
        right: auto !important;
        left: 0 !important;
        transform: translateX(-108%) !important;
    }
    body.site-body--academy-admin .academy-portal .academy-sidebar.card.is-open,
    body.site-body--academy-admin .academy-portal aside.portal-nav.card.is-open,
    body.site-body--academy-admin .academy-portal .academy-sidebar.is-open,
    html[dir="ltr"] body.site-body--academy-admin .academy-portal .academy-sidebar.card.is-open,
    html[dir="ltr"] body.site-body--academy-admin .academy-portal aside.portal-nav.card.is-open,
    html[dir="ltr"] body.site-body--academy-admin .academy-portal .academy-sidebar.is-open { transform: translateX(0) !important; }

    body.site-body--academy-admin .academy-portal .ap-drawer-backdrop.is-visible {
        position: fixed;
        z-index: 104;
        inset: 0;
        display: block;
        background: rgba(2, 16, 22, 0.62) !important;
        backdrop-filter: blur(3px);
    }

    body.ap-drawer-open { overflow: hidden !important; }

    body.site-body--academy-admin main.site-main#main-content.sf-workspace-main {
        height: 100svh !important;
        max-height: 100svh !important;
        flex-basis: 100svh !important;
    }
    body.site-body--academy-admin .academy-portal .portal__main {
        grid-column: 1 !important;
        grid-row: 2 !important;
    }
}

@media (max-width: 768px) {
    body.site-body--academy-admin .academy-portal .acad-topbar {
        min-height: 56px !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        padding: 0.5rem 0.72rem !important;
    }

    body.site-body--academy-admin .academy-portal :where(.portal__main > .acad-content, .portal__main > [class$="-content"]) {
        padding: 0.85rem 0.72rem 1.35rem !important;
    }

    body.site-body--academy-admin .academy-portal :where([class$="-hero"], [class*="-hero "], .portal__header, .acad-page-head) {
        border-radius: 13px !important;
    }

    body.site-body--academy-admin .academy-portal :where(.stats-grid, [class$="-kpi-grid"], [class*="-kpi-grid "]) {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 480px) {
    body.site-body--academy-admin .academy-portal :where(.stats-grid, [class$="-kpi-grid"], [class*="-kpi-grid "]) {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}