/* Admin Portal – Redesign UI foundation (Ligi Africa Editor Dashboard) */

:root {
    /* Brand (aliases to ligi-tokens.css) */
    --admin-primary: var(--color-brand-red);
    --admin-primary-hover: var(--color-brand-red-bright);
    --admin-primary-active: var(--color-brand-red-deep);
    --admin-primary-light: #fef2f2;
    --admin-primary-ring: rgba(161, 2, 2, 0.12);

    /* Shell */
    --admin-sidebar-width: 240px;
    --admin-sidebar-width-collapsed: 64px;
    --admin-sidebar-bg: var(--color-brand-night);
    --admin-sidebar-border: var(--color-brand-slate-dark);
    --admin-sidebar-text: #94a3b8;
    --admin-sidebar-text-active: #ffffff;
    --admin-sidebar-active-bg: var(--color-brand-slate-dark);
    --admin-sidebar-active-border: var(--color-brand-red);
    --admin-topbar-height: 56px;
    --admin-topbar-bg: #ffffff;
    --admin-topbar-border: var(--color-brand-ash);
    --admin-main-bg: var(--color-brand-offwhite);
    --admin-bg-dark: var(--color-brand-night);

    /* Motion */
    --admin-motion-duration: 280ms;
    --admin-motion-duration-slow: 420ms;
    --admin-motion-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
    --admin-motion-ease-out: cubic-bezier(0, 0, 0.2, 1);
}

body.admin-body {
    margin: 0;
    padding: 0;
    height: 100vh;
    overflow: hidden;
    background-color: var(--admin-main-bg);
    font-family: 'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
    font-size: 14px;
}

.font-outfit {
    font-family: 'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
}

/* Sidebar */
.admin-sidebar {
    width: var(--admin-sidebar-width);
    background-color: var(--admin-sidebar-bg);
    color: var(--admin-sidebar-text);
    display: flex;
    flex-direction: column;
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    z-index: 1000;
    border-right: 1px solid var(--admin-sidebar-border);
    transition: width 0.3s ease;
}

.admin-sidebar.collapsed {
    width: var(--admin-sidebar-width-collapsed);
}

.admin-sidebar.collapsed .admin-sidebar-header .admin-sidebar-brand,
.admin-sidebar.collapsed .admin-nav-link span:not(.material-symbols-outlined),
.admin-sidebar.collapsed .admin-sidebar-footer-content,
.admin-sidebar.collapsed .admin-sidebar-link span:last-child {
    display: none !important;
}

.admin-sidebar:not(.collapsed) .admin-sidebar-logo-collapsed {
    display: none !important;
}

.admin-sidebar.collapsed .admin-sidebar-header {
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
}

.admin-sidebar.collapsed .admin-nav-link {
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
}

.admin-sidebar-header {
    height: var(--admin-topbar-height);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--admin-sidebar-border);
}

.admin-sidebar-brand {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.admin-sidebar-logo-img {
    max-height: 32px;
    width: auto;
    display: block;
}

.admin-sidebar-logo-collapsed {
    display: none;
}

.admin-sidebar.collapsed .admin-sidebar-logo-collapsed {
    display: flex;
    align-items: center;
    justify-content: center;
}

.admin-sidebar.collapsed .admin-sidebar-logo-collapsed img {
    max-height: 28px;
    width: auto;
}

.admin-sidebar-toggle {
    padding: 0.25rem;
    color: var(--admin-sidebar-text);
    background: none;
    border: none;
    border-radius: 0.375rem;
    cursor: pointer;
    transition: background-color 0.2s, color 0.2s;
}

.admin-sidebar-toggle:hover {
    background-color: #334155;
    color: #fff;
}

.admin-sidebar-content {
    overflow-y: auto;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem 0.5rem;
}

.admin-sidebar-content .flex-grow-1 {
    flex-grow: 1;
}

/* Nav */
.admin-nav-section-title {
    color: #fff !important;
}

.admin-nav-group {
    list-style: none;
    margin-bottom: 0.5rem;
}

.admin-nav-group-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0.5rem 1rem;
    margin: 0;
    border: none;
    background: transparent;
    color: #e2e8f0;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
    border-radius: 0.375rem;
    transition: background-color var(--admin-motion-duration) var(--admin-motion-ease),
        color var(--admin-motion-duration) var(--admin-motion-ease);
}

.admin-nav-group-header:hover {
    background-color: rgba(51, 65, 85, 0.5);
    color: #fff;
}

.admin-nav-group-chevron {
    font-size: 1.125rem !important;
    opacity: 0.7;
    transition: transform var(--admin-motion-duration-slow) var(--admin-motion-ease);
}

.admin-nav-group-header[aria-expanded='true'] .admin-nav-group-chevron {
    transform: rotate(180deg);
}

.admin-nav-group-collapse {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows var(--admin-motion-duration-slow) var(--admin-motion-ease);
}

.admin-nav-group-collapse.is-open {
    grid-template-rows: 1fr;
}

.admin-nav-group-collapse > .admin-nav-group-items {
    overflow: hidden;
    min-height: 0;
}

.admin-nav-group-items {
    padding-left: 0.25rem;
    margin-bottom: 0.25rem;
}

.admin-sidebar.collapsed .admin-nav-group-header,
.admin-sidebar.collapsed .admin-nav-group-collapse {
    display: none;
}

.admin-nav {
    list-style: none;
    padding: 0;
    margin: 0;
}

.admin-nav-item {
    margin-bottom: 0.25rem;
}

.admin-nav-link {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    color: var(--admin-sidebar-text);
    text-decoration: none;
    border-radius: 0.5rem;
    transition: all 0.2s ease;
    font-size: 0.875rem;
    font-weight: 500;
}

.admin-nav-link:hover {
    background-color: #334155;
    color: #fff;
}

.admin-nav-link.active {
    background-color: var(--admin-sidebar-active-bg);
    color: var(--admin-sidebar-text-active);
    border-left: 3px solid var(--admin-sidebar-active-border);
}

.admin-nav-link .material-symbols-outlined,
.admin-nav-link .fas {
    font-size: 20px;
    width: 20px;
    flex-shrink: 0;
    text-align: center;
}

.admin-nav-link.active .material-symbols-outlined {
    color: var(--admin-primary);
}

.admin-sidebar-link {
    color: var(--admin-sidebar-text);
    border-radius: 0.5rem;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 1rem;
    text-decoration: none;
    font-size: 0.875rem;
}

.admin-sidebar-link:hover {
    background-color: #334155;
    color: #fff;
}

/* Sidebar footer (role badge) */
.admin-sidebar-footer {
    padding-top: 1rem;
    border-top: 1px solid var(--admin-sidebar-border);
}

.admin-role-badge {
    background-color: #334155;
    padding: 0.75rem;
    border-radius: 0.5rem;
}

.admin-role-badge-label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    color: #94a3b8;
}

.admin-role-badge-label .material-symbols-outlined {
    color: var(--admin-primary);
    font-size: 14px;
}

.admin-role-progress {
    width: 100%;
    height: 6px;
    background-color: #475569;
    border-radius: 9999px;
    overflow: hidden;
}

.admin-role-progress-bar {
    height: 100%;
    width: 75%;
    background-color: var(--admin-primary);
    border-radius: 9999px;
}

.admin-role-badge-quote {
    font-size: 10px;
    margin-top: 0.5rem;
    color: #94a3b8;
    font-style: italic;
}

/* Main content area */
.admin-main-content {
    margin-left: var(--admin-sidebar-width);
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: var(--admin-main-bg);
    transition: margin-left 0.3s ease;
}

.admin-sidebar.collapsed ~ .admin-main-content {
    margin-left: var(--admin-sidebar-width-collapsed);
}

.admin-topbar {
    height: var(--admin-topbar-height);
    background-color: var(--admin-topbar-bg);
    flex-shrink: 0;
    border-bottom: 1px solid var(--admin-topbar-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    position: sticky;
    top: 0;
    z-index: 30;
}

.admin-topbar-logo {
    display: flex;
    align-items: center;
    flex-shrink: 1;
    min-width: 0;
    text-decoration: none;
}

.admin-topbar-logo img {
    display: block;
    height: auto;
    max-height: 28px;
    max-width: min(9rem, 38vw);
    width: auto;
    object-fit: contain;
}

.admin-topbar-search {
    flex: 1;
    max-width: 32rem;
}

.admin-topbar-search .form-control {
    padding-left: 2.5rem;
    height: 40px;
    border: none;
    background-color: #f1f5f9;
    border-radius: 9999px;
    font-size: 0.875rem;
}

.admin-topbar-search .form-control:focus {
    background-color: #fff;
    box-shadow: 0 0 0 2px var(--admin-primary-ring);
}

.admin-topbar-actions {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.admin-topbar-actions .btn-link {
    padding: 0.5rem;
    color: #64748b;
    border-radius: 9999px;
    position: relative;
}

.admin-topbar-actions .btn-link:hover {
    background-color: #f1f5f9;
    color: #475569;
}

.admin-main {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 1rem;
}

@media (min-width: 768px) {
    .admin-main {
        padding: 1.5rem;
    }
}

/* Sidebar overlay (mobile) */
.admin-sidebar-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 999;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.admin-sidebar-overlay.show {
    display: block;
    opacity: 1;
}

/* Reusable components – stat cards */
.admin-stat-card {
    background: #fff;
    border: 1px solid #f1f5f9;
    border-radius: 1rem;
    padding: 1.25rem;
    height: 100%;
    transition: box-shadow 0.2s ease;
}

.admin-stat-card:hover {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
}

.admin-stat-card-label {
    font-size: 0.875rem;
    color: #64748b;
    margin-bottom: 0.25rem;
}

.admin-stat-card-value {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
}

.admin-stat-card-meta {
    font-size: 0.75rem;
    color: #94a3b8;
    margin-top: 0.25rem;
}

.admin-stat-card-trend {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--admin-primary);
    background-color: var(--admin-primary-light);
    padding: 0.25rem 0.5rem;
    border-radius: 9999px;
}

.admin-stat-card-meta-inline {
    font-size: 0.625rem;
    color: #94a3b8;
    margin-left: 0.25rem;
}

/* Panel cards */
.admin-panel-card {
    background: #fff;
    border: 1px solid #f1f5f9;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05);
    transition: box-shadow var(--admin-motion-duration) var(--admin-motion-ease),
        transform var(--admin-motion-duration) var(--admin-motion-ease);
}

.admin-panel-card:hover {
    box-shadow: 0 4px 12px -2px rgba(15, 23, 42, 0.08);
}

.admin-panel-card-header {
    padding: 1.5rem 1.5rem;
    border-bottom: 1px solid #f1f5f9;
    font-weight: 700;
    font-size: 1.125rem;
    color: #0f172a;
}

.admin-panel-card-body {
    padding: 1.25rem;
}

/* Status badges */
.admin-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 9999px;
}

.admin-badge-draft { background-color: #f1f5f9; color: #475569; }
.admin-badge-submitted { background-color: #dbeafe; color: #1d4ed8; }
.admin-badge-under-review { background-color: #fef3c7; color: #b45309; }
.admin-badge-needs-revision { background-color: #fee2e2; color: #b91c1c; }
.admin-badge-approved { background-color: #fee2e2; color: #b91c1c; }
.admin-badge-published { background-color: #e0e7ff; color: #3730a3; }
.admin-badge-scheduled { background-color: #f1f5f9; color: #475569; }
.admin-badge-archived { background-color: #e2e8f0; color: #64748b; }

/* Tables */
.admin-table-wrapper {
    overflow-x: auto;
}

.admin-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.admin-table th {
    text-align: left;
    padding: 1rem 1.5rem;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    border-bottom: 1px solid #f1f5f9;
    background-color: #f8fafc;
}

.admin-table td {
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #f1f5f9;
    color: #334155;
}

.admin-table tbody tr:hover {
    background-color: #f8fafc;
}

/* Collapsible filters — collapsed behind a toggle on mobile only */
.collapsible-filters {
    margin-bottom: 1rem;
}

.collapsible-filters__toggle {
    display: none;
    width: 100%;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    margin-bottom: 0;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    background: #fff;
    color: #0f172a;
    font-size: 0.875rem;
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
    cursor: pointer;
    text-align: left;
}

.collapsible-filters__toggle:hover {
    background: #f8fafc;
}

.collapsible-filters__icon {
    font-size: 1.25rem;
    color: var(--admin-primary);
}

.collapsible-filters__label {
    flex: 1;
}

.collapsible-filters__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.35rem;
    height: 1.35rem;
    padding: 0 0.35rem;
    border-radius: 9999px;
    background: var(--admin-primary);
    color: #fff;
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1;
}

.collapsible-filters__chevron {
    font-size: 1.25rem;
    color: #94a3b8;
}

.collapsible-filters__body {
    display: block;
}

/* Players / custom filter rows — white card surface */
.collapsible-filters__body > .admin-filter-row {
    background: #ffffff;
    border: 1px solid #f1f5f9;
    border-radius: 1rem;
    padding: 0.875rem 1rem;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
    margin-bottom: 0;
}

@media (max-width: 767.98px) {
    .collapsible-filters__toggle {
        display: flex;
        margin-bottom: 0.75rem;
    }

    .collapsible-filters__body {
        display: none;
    }

    .collapsible-filters__body.is-open {
        display: block;
    }

    .collapsible-filters__body .admin-filter-bar-modern {
        margin-bottom: 0;
    }
}

/* Filter controls */
.admin-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.admin-filter-row .form-control,
.admin-filter-row .form-select {
    font-size: 0.75rem;
    line-height: 1.25;
    min-height: 2rem;
    padding: 0.25rem 0.5rem;
    border-radius: 0.5rem;
    border-color: #e2e8f0;
}

.admin-filter-row .form-label {
    font-size: 0.6875rem;
    font-weight: 600;
    margin-bottom: 0.2rem;
    color: #64748b;
}

.admin-filter-row .form-control:focus,
.admin-filter-row .form-select:focus {
    border-color: var(--admin-primary);
    box-shadow: 0 0 0 2px var(--admin-primary-ring);
}

/* Buttons – primary alignment */
.btn-primary,
.bg-primary {
    background-color: var(--admin-primary) !important;
    border-color: var(--admin-primary) !important;
}

.btn-primary:hover {
    background-color: var(--admin-primary-hover) !important;
    border-color: var(--admin-primary-hover) !important;
    filter: brightness(1.1);
}

/* Compact admin buttons (ligi.Academy + reos.Web.Admin via brand CSS) */
.btn {
    --bs-btn-padding-y: 0.28rem;
    --bs-btn-padding-x: 0.65rem;
    --bs-btn-font-size: 0.8125rem;
    --bs-btn-border-radius: 0.5rem;
    padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
    font-size: var(--bs-btn-font-size);
    line-height: 1.35;
    border-radius: var(--bs-btn-border-radius);
}

.btn-sm,
.btn.btn-sm {
    --bs-btn-padding-y: 0.2rem;
    --bs-btn-padding-x: 0.5rem;
    --bs-btn-font-size: 0.75rem;
    padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
    font-size: var(--bs-btn-font-size);
}

.btn-lg,
.btn.btn-lg {
    --bs-btn-padding-y: 0.4rem;
    --bs-btn-padding-x: 0.85rem;
    --bs-btn-font-size: 0.875rem;
    padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
    font-size: var(--bs-btn-font-size);
}

.btn .material-symbols-outlined,
.organiser-btn-primary-cta .material-symbols-outlined,
.organiser-btn-filter .material-symbols-outlined {
    font-size: 1rem !important;
    line-height: 1;
}

.btn-sm .material-symbols-outlined {
    font-size: 0.9375rem !important;
}

.text-primary {
    color: var(--admin-primary) !important;
}

/* Mobile bottom navigation */
.mobile-bottom-nav {
    display: none;
}

.mobile-bottom-nav-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.125rem;
    padding: 0.375rem 0.25rem;
    border: none;
    background: transparent;
    color: #64748b;
    text-decoration: none;
    font-size: 0.625rem;
    font-weight: 600;
    cursor: pointer;
    transition: color 0.15s ease;
}

.mobile-bottom-nav-item .material-symbols-outlined {
    font-size: 1.375rem;
}

.mobile-bottom-nav-item:hover,
.mobile-bottom-nav-item.active {
    color: var(--admin-primary);
}

.mobile-bottom-nav-item.active .material-symbols-outlined {
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.mobile-more-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 1050;
}

.mobile-more-overlay.show {
    display: block;
}

.mobile-more-sheet {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 64px;
    max-height: 70vh;
    overflow-y: auto;
    background-color: var(--admin-sidebar-bg);
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
    box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.15);
    z-index: 1100;
    padding-bottom: 0.5rem;
}

.mobile-more-sheet-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem 0.5rem;
    border-bottom: 1px solid var(--admin-sidebar-border);
}

.mobile-more-sheet-title {
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--admin-sidebar-text);
}

.mobile-more-sheet-close {
    color: var(--admin-sidebar-text-muted);
    padding: 0.25rem;
}

.mobile-more-sheet-close:hover {
    color: var(--admin-sidebar-text);
}

.mobile-more-sheet-nav {
    padding: 0.5rem 0;
}

/* Responsive – mobile sidebar */
@media (max-width: 767.98px) {
    .admin-topbar-search {
        display: none;
    }

    .mobile-bottom-nav {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: calc(64px + env(safe-area-inset-bottom, 0px));
        padding-bottom: env(safe-area-inset-bottom, 0px);
        z-index: 1000;
        border-top: 1px solid var(--admin-topbar-border);
        background-color: var(--admin-topbar-bg);
        box-sizing: border-box;
    }

    .mobile-more-sheet {
        bottom: calc(64px + env(safe-area-inset-bottom, 0px));
    }

    .admin-sidebar {
        transform: translateX(-100%);
        transition: transform 0.3s ease;
        box-shadow: 2px 0 8px rgba(0, 0, 0, 0.15);
    }

    .admin-sidebar.show {
        transform: translateX(0);
    }

    .admin-sidebar.collapsed {
        width: var(--admin-sidebar-width);
    }

    .admin-main-content {
        margin-left: 0;
    }

    .admin-sidebar.collapsed ~ .admin-main-content {
        margin-left: 0;
    }

    .admin-sidebar-overlay.show {
        display: block;
    }

    /* Phone-first content densification */
    .admin-main {
        padding: 0.75rem;
    }

    /* Must follow .admin-main padding shorthand so bottom content clears the fixed nav */
    .admin-main.admin-layout--mobile-nav {
        padding-bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px));
    }

    .admin-page-header-card {
        padding: 1rem;
        border-radius: 1rem;
    }

    .admin-page-header-card .organiser-page-title {
        font-size: 1.25rem;
    }

    .organiser-page-subtitle,
    .admin-page-header-card .organiser-page-subtitle {
        font-size: 0.8125rem;
    }

    .organiser-page-actions {
        width: 100%;
    }

    .organiser-page-actions > * {
        flex: 1 1 auto;
    }

    .organiser-btn-primary-cta {
        width: 100%;
        justify-content: center;
        min-height: 40px;
    }

    .admin-club-picker {
        width: 100%;
        min-width: 0;
    }

    .admin-filter-bar-inner {
        flex-direction: column;
        align-items: stretch !important;
    }

    .admin-filter-bar-inner .btn {
        width: 100%;
        min-height: 40px;
    }

    .admin-filter-search {
        width: 100%;
    }

    .admin-panel-header-extra {
        width: 100%;
    }

    .admin-panel-header-extra .form-control,
    .admin-panel-header-extra .form-select {
        max-width: none !important;
        width: 100%;
    }

    .admin-panel-card-header,
    .admin-panel-header-modern {
        padding: 0.875rem 1rem;
    }

    .admin-panel-card-body,
    .admin-panel-body-modern {
        padding: 1rem;
    }

    .admin-stat-card-modern,
    .admin-stat-card {
        padding: 1rem;
    }

    .admin-stat-card-value-modern {
        font-size: 1.5rem;
    }

    .admin-table-wrapper,
    .table-responsive,
    .organiser-table-card {
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
    }

    .admin-table th,
    .admin-table td,
    .organiser-table-card thead th,
    .organiser-table-card tbody td,
    .table > :not(caption) > * > * {
        padding: 0.75rem 0.875rem;
        white-space: nowrap;
    }

    /* Standings must keep a readable team column on phones */
    .standings-table-container table {
        min-width: 40rem;
        table-layout: auto;
    }

    .standings-table-container td.standings-team-cell .cell-title,
    .standings-table-container td.standings-team-cell span.fw-semibold {
        max-width: 11rem;
        display: inline-block;
        overflow: hidden;
        text-overflow: ellipsis;
        vertical-align: bottom;
    }

    .admin-table th:first-child,
    .admin-table td:first-child,
    .organiser-table-card thead th:first-child,
    .organiser-table-card tbody td:first-child {
        position: sticky;
        left: 0;
        background: #fff;
        z-index: 1;
        box-shadow: 4px 0 8px -4px rgba(15, 23, 42, 0.08);
    }

    .admin-table thead th:first-child,
    .organiser-table-card thead th:first-child {
        background: #f8fafc;
        z-index: 2;
    }

    .admin-fixture-card-body {
        gap: 0.5rem;
    }

    .admin-fixture-card-team {
        font-size: 0.875rem;
        word-break: break-word;
    }

    .admin-panel-list-item {
        padding: 0.875rem 1rem;
        gap: 0.75rem;
        align-items: flex-start;
    }

    .admin-panel-list-trailing {
        align-self: center;
    }

    .admin-btn-modern,
    .btn-sm.admin-btn-modern {
        min-height: 40px;
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .form-control,
    .form-select {
        min-height: 44px;
        font-size: 16px; /* prevents iOS zoom on focus */
    }

    .tm-profile-hero {
        padding: 1rem;
    }
}

@media (min-width: 768px) {
    .admin-sidebar-overlay {
        display: none !important;
    }
}

/* Dark mode support */
[data-bs-theme="dark"] {
    --admin-main-bg: var(--admin-bg-dark);
}

[data-bs-theme="dark"] .admin-topbar {
    background-color: #1e293b;
    border-bottom-color: #334155;
}

[data-bs-theme="dark"] .admin-main {
    background-color: var(--admin-bg-dark);
    color: #e2e8f0;
}

/* Scrollbar */
.admin-sidebar-content::-webkit-scrollbar {
    width: 6px;
}

.admin-sidebar-content::-webkit-scrollbar-track {
    background: transparent;
}

.admin-sidebar-content::-webkit-scrollbar-thumb {
    background: #475569;
    border-radius: 10px;
}

.admin-main::-webkit-scrollbar {
    width: 6px;
}

.admin-main::-webkit-scrollbar-track {
    background: #f1f5f9;
}

.admin-main::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 10px;
}

.admin-main::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Standings: scrollable table; keep team names visible on narrow screens */
.standings-table-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    scrollbar-width: thin;
}
.standings-table-container::-webkit-scrollbar {
    height: 4px;
}
.standings-table-container::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 999px;
}
.standings-table-container table {
    table-layout: auto;
    width: 100%;
    min-width: 40rem;
    border-collapse: collapse;
}
.standings-table-container tbody tr {
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.standings-table-container tbody tr:last-child {
    border-bottom-width: 1px;
}

/* Rank sticky at left; team sticky after rank so names stay visible while scrolling stats */
.standings-table-container th.standings-col-num,
.standings-table-container td.standings-col-num {
    position: sticky;
    left: 0;
    z-index: 3;
    background: #fff;
    width: 2.75rem;
    min-width: 2.75rem;
}
.standings-table-container thead th.standings-col-num {
    z-index: 4;
    background: #f8fafc;
}
.standings-table-container th.standings-team-cell,
.standings-table-container td.standings-team-cell {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 10rem;
    max-width: 14rem;
    position: sticky;
    left: 2.75rem;
    z-index: 2;
    background: #fff;
    box-shadow: 4px 0 8px -4px rgba(15, 23, 42, 0.12);
}
.standings-table-container thead th.standings-team-cell {
    z-index: 4;
    background: #f8fafc;
}
.card-body .standings-table-container th.standings-team-cell,
.card-body .standings-table-container td.standings-team-cell,
.card-body .standings-table-container th.standings-col-num,
.card-body .standings-table-container td.standings-col-num {
    background: #fff;
}
.card-body .standings-table-container thead th.standings-team-cell,
.card-body .standings-table-container thead th.standings-col-num {
    background: #f8fafc;
}
.standings-table-container .standings-col-num { width: 2.75rem; }
.standings-table-container .standings-col-team { width: 35%; min-width: 10rem; }
.standings-table-container .standings-col-stat { width: 2.25rem; text-align: center; }
.standings-table-container .standings-col-pts { width: 2.5rem; text-align: center; font-weight: 600; }

/* Modern organiser standings */
.standings-table-modern {
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}
.standings-table-modern .standings-table thead tr {
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    border-bottom: 1px solid #e2e8f0;
}
.standings-table-modern .standings-table thead th {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
    padding: 0.875rem 0.5rem;
    border: none;
}
.standings-table-modern .standings-table tbody tr {
    transition: background 0.15s ease;
}
.standings-table-modern .standings-table tbody tr:hover {
    background: #f8fafc;
}
.standings-table-modern .standings-table tbody tr.standings-row--highlight {
    background: rgba(161, 2, 2, 0.03);
}
.standings-table-modern .standings-table tbody tr.standings-row--highlight:hover {
    background: rgba(161, 2, 2, 0.06);
}
.standings-table-modern .standings-stat {
    font-variant-numeric: tabular-nums;
    color: #475569;
    font-size: 0.875rem;
}
.standings-rank-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.75rem;
    height: 1.75rem;
    border-radius: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #64748b;
    background: #f1f5f9;
}
.standings-rank-badge.standings-rank--gold {
    background: linear-gradient(135deg, #fef3c7, #fde68a);
    color: #92400e;
}
.standings-rank-badge.standings-rank--silver {
    background: linear-gradient(135deg, #f1f5f9, #e2e8f0);
    color: #475569;
}
.standings-rank-badge.standings-rank--bronze {
    background: linear-gradient(135deg, #ffedd5, #fed7aa);
    color: #9a3412;
}
.standings-pts-pill {
    display: inline-flex;
    min-width: 2rem;
    justify-content: center;
    padding: 0.2rem 0.5rem;
    border-radius: 9999px;
    background: var(--color-brand-night, #0f172a);
    color: #fff;
    font-weight: 700;
    font-size: 0.8125rem;
    font-variant-numeric: tabular-nums;
}
.standings-form-chips {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
}
.standings-form-chip {
    width: 1.5rem;
    height: 1.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    font-size: 0.625rem;
    font-weight: 800;
    border: 1px solid transparent;
}
.standings-form-chip--win {
    background: #dcfce7;
    color: #166534;
    border-color: #bbf7d0;
}
.standings-form-chip--draw {
    background: #f1f5f9;
    color: #475569;
    border-color: #e2e8f0;
}
.standings-form-chip--loss {
    background: #fee2e2;
    color: #991b1b;
    border-color: #fecaca;
}
.standings-form-chip--neutral {
    background: #f8fafc;
    color: #94a3b8;
    border-color: #e2e8f0;
}
.standings-col-form {
    min-width: 6.5rem;
}

/* Sortable table headers */
.admin-sortable-th {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0;
    border: none;
    background: none;
    font: inherit;
    font-weight: inherit;
    color: inherit;
    cursor: pointer;
    text-transform: inherit;
    letter-spacing: inherit;
}
.admin-sortable-th:hover {
    color: var(--admin-primary, var(--color-brand-primary, #a10202));
}
.admin-sortable-th-icon {
    font-size: 1rem !important;
    opacity: 0.35;
    vertical-align: middle;
}
.admin-sortable-th-icon.is-active {
    opacity: 1;
    color: var(--admin-primary, var(--color-brand-primary, #a10202));
}

/* ========== Organiser UI (new-organizer-ui look and feel) ========== */
.organiser-page-title { font-size: 1.125rem; font-weight: 600; color: #0f172a; }
.organiser-action-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.organiser-search-wrap { position: relative; flex: 1; max-width: 28rem; }
.organiser-search-wrap .form-control { padding-left: 2.5rem; border-radius: 0.75rem; border: 1px solid #e2e8f0; background: #fff; font-size: 0.875rem; box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
.organiser-search-wrap .form-control:focus { border-color: var(--admin-primary); box-shadow: 0 0 0 2px var(--admin-primary-ring); }
.organiser-search-icon { position: absolute; left: 0.75rem; top: 50%; transform: translateY(-50%); color: #94a3b8; pointer-events: none; }
.organiser-actions-right { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.organiser-btn-filter { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.28rem 0.7rem; background: #fff; border: 1px solid #e2e8f0; border-radius: 0.5rem; font-size: 0.8125rem; font-weight: 500; color: #475569; box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
.organiser-btn-filter:hover { background: #f8fafc; color: #334155; }
.organiser-btn-primary-cta { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.28rem 0.85rem; background: var(--admin-primary); color: #fff; border: none; border-radius: 0.5rem; font-size: 0.8125rem; font-weight: 600; box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
.organiser-btn-primary-cta:hover { background: var(--admin-primary-hover); color: #fff; transform: scale(0.98); }

/* List table – slate styling */
.organiser-table-card { background: #fff; border-radius: 1rem; box-shadow: 0 1px 3px rgba(0,0,0,0.05); border: 1px solid #f1f5f9; overflow: hidden; }
.organiser-table-card .table { margin-bottom: 0; }
.organiser-table-card thead tr { background: #f8fafc; border-bottom: 1px solid #f1f5f9; }
.organiser-table-card thead th { padding: 1rem 1.5rem; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #64748b; border: none; }
.organiser-table-card tbody tr { border-bottom: 1px solid #f1f5f9; transition: background 0.2s; cursor: pointer; }
.organiser-table-card tbody tr:hover { background: #f8fafc; }
.organiser-table-card tbody td { padding: 1rem 1.5rem; font-size: 0.875rem; color: #334155; vertical-align: middle; }
.organiser-table-card .cell-icon { width: 2.5rem; height: 2.5rem; border-radius: 0.5rem; background: #f1f5f9; display: flex; align-items: center; justify-content: center; color: #94a3b8; flex-shrink: 0; }
.organiser-table-card tbody tr:hover .cell-icon { background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
.organiser-table-card .cell-title { font-weight: 600; color: #0f172a; }
.organiser-table-card .cell-meta { font-size: 0.75rem; color: #94a3b8; }
.organiser-badge-status { display: inline-flex; align-items: center; padding: 0.25rem 0.625rem; border-radius: 9999px; font-size: 0.75rem; font-weight: 700; }
.organiser-badge-active { background: #dcfce7; color: #166534; }
.organiser-badge-completed { background: #dbeafe; color: #1e40af; }
.organiser-badge-draft { background: #f1f5f9; color: #475569; }
.organiser-badge-upcoming { background: #fef3c7; color: #b45309; }
.organiser-badge-public { color: #3b82f6; }
.organiser-badge-private { color: #94a3b8; }
.organiser-table-actions { display: flex; align-items: center; justify-content: flex-end; gap: 0.25rem; }
.organiser-table-actions .btn { padding: 0.5rem; color: #94a3b8; border: none; background: none; border-radius: 0.5rem; }
.organiser-table-actions .btn:hover { color: #475569; background: #f1f5f9; }

/* Portal table / hero action dropdowns — 2px smaller than default (14px → 12px) */
.portal-table-actions-toggle,
.portal-hero-actions-toggle {
  font-size: 0.75rem;
  padding: 0.25rem 0.625rem;
}

.portal-table-dropdown-menu,
.portal-hero-dropdown-menu {
  font-size: 0.75rem;
  min-width: 9rem;
}

.portal-table-dropdown-item,
.portal-hero-dropdown-item {
  font-size: 0.75rem;
  line-height: 1.25;
  padding: 0.35rem 0.75rem;
}

.portal-table-dropdown-icon,
.portal-hero-dropdown-icon {
  font-size: 1rem !important;
}

/* Detail – back link */
.organiser-back-link { display: inline-flex; align-items: center; gap: 0.5rem; color: #64748b; font-weight: 500; font-size: 0.875rem; text-decoration: none; margin-bottom: 1rem; }
.organiser-back-link:hover { color: #0f172a; }

/* Detail – hero card (competition/tournament/team) */
.organiser-hero-card { background: #fff; border-radius: 1.5rem; box-shadow: 0 1px 3px rgba(0,0,0,0.05); border: 1px solid #f1f5f9; overflow: hidden; margin-bottom: 0; }
.organiser-hero-body { padding: 2rem; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 1.5rem; }
.organiser-hero-left { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; }
.organiser-hero-icon { width: 5rem; height: 5rem; border-radius: 1rem; background: #f8fafc; border: 1px solid #f1f5f9; display: flex; align-items: center; justify-content: center; color: #94a3b8; flex-shrink: 0; }
.organiser-hero-icon.hero-trophy { color: #b45309; }
.organiser-hero-icon.hero-medal { background: #f5f3ff; border-color: #e9e5ff; color: #7c3aed; }
.organiser-hero-icon.hero-team { border-radius: 0.75rem; overflow: hidden; }
.organiser-hero-title { font-size: 1.5rem; font-weight: 800; color: #0f172a; margin-bottom: 0.25rem; }
.organiser-hero-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; font-size: 0.875rem; color: #64748b; font-weight: 500; }
.organiser-hero-meta .meta-sep { color: #cbd5e1; }
.organiser-hero-badges { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.organiser-hero-status { padding: 0.25rem 0.75rem; border-radius: 9999px; font-size: 0.625rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
.organiser-hero-status.status-active { background: #22c55e; color: #fff; }
.organiser-hero-status.status-completed { background: #2563eb; color: #fff; }
.organiser-hero-status.status-inactive { background: #94a3b8; color: #fff; }
.organiser-hero-status.status-draft { background: #94a3b8; color: #fff; }
.organiser-hero-actions { display: flex; align-items: center; gap: 0.5rem; }
.organiser-hero-actions .btn { border-radius: 0.75rem; font-size: 0.75rem; font-weight: 700; }
.organiser-tabs-wrap { padding: 0 2rem; border-top: 1px solid #f1f5f9; background: #f8fafc; display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 0; }
.organiser-tabs-wrap .nav-link { white-space: nowrap; padding: 1rem 1.5rem; font-size: 0.75rem; font-weight: 700; border: none; border-bottom: 2px solid transparent; background: none; color: #94a3b8; border-radius: 0; transition: all 0.2s; }
.organiser-tabs-wrap .nav-link:hover { color: #475569; }
.organiser-tabs-wrap .nav-link.active { color: var(--admin-primary); border-bottom-color: var(--admin-primary); background: transparent; }
.organiser-tabs-wrap .nav-link.tab-purple.active { color: #7c3aed; border-bottom-color: #7c3aed; }

/* Team detail – banner hero (optional) */
.organiser-team-banner { position: relative; height: 12rem; background: #0f172a; overflow: hidden; }
.organiser-team-banner img.banner-bg { width: 100%; height: 100%; object-fit: cover; opacity: 0.4; }
.organiser-team-banner .banner-gradient { position: absolute; inset: 0; background: linear-gradient(to top, #fff, transparent); }
.organiser-team-banner .banner-content { position: absolute; bottom: -3rem; left: 2.5rem; display: flex; align-items: flex-end; gap: 1.5rem; }
.organiser-team-banner .banner-logo { width: 8rem; height: 8rem; border-radius: 1rem; background: #fff; padding: 0.5rem; box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1); border: 4px solid #fff; overflow: hidden; }
.organiser-team-banner .banner-logo img { width: 100%; height: 100%; object-fit: cover; border-radius: 0.5rem; }
.organiser-team-banner .banner-text { margin-bottom: 1rem; }
.organiser-team-banner .banner-title { font-size: 1.875rem; font-weight: 800; color: #0f172a; }
.organiser-team-banner .banner-meta { color: #64748b; font-weight: 500; display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.25rem; }
.organiser-team-banner .banner-meta .short-name { color: var(--admin-primary); font-weight: 700; letter-spacing: 0.05em; }

/* Content cards */
.organiser-content-card { background: #fff; border-radius: 1rem; border: 1px solid #f1f5f9; box-shadow: 0 1px 3px rgba(0,0,0,0.05); padding: 1.5rem; margin-bottom: 1.5rem; }
.organiser-content-card h3, .organiser-content-card h5 { font-weight: 700; color: #0f172a; margin-bottom: 1rem; }
.organiser-sidebar-card { background: #fff; border-radius: 1rem; border: 1px solid #f1f5f9; box-shadow: 0 1px 3px rgba(0,0,0,0.05); padding: 1.5rem; margin-bottom: 1.5rem; }
.organiser-sidebar-card.dark { background: #0f172a; color: #fff; }
.organiser-sidebar-card.dark h3, .organiser-sidebar-card.dark h5 { color: #fff; }
.organiser-sidebar-card.dark .text-muted { color: #94a3b8 !important; }
.scrollbar-hide { scrollbar-width: none; -ms-overflow-style: none; }
.scrollbar-hide::-webkit-scrollbar { display: none; }

.organiser-page-header .organiser-page-title { font-size: 1.5rem; font-weight: 800; color: #0f172a; }
.organiser-page-subtitle { font-size: 0.875rem; color: #64748b; }
.organiser-stat-icon { width: 3rem; height: 3rem; }
.organiser-stat-icon .material-symbols-outlined { font-size: 1.5rem; }
.organiser-tab-pill {
    padding: 0.5rem 1rem;
    border-radius: 9999px;
    font-size: 0.8125rem;
    font-weight: 600;
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #64748b;
    transition: all 0.15s ease;
}
.organiser-tab-pill:hover { border-color: #cbd5e1; color: #334155; }
.organiser-tab-pill.active {
    background: var(--admin-primary);
    border-color: var(--admin-primary);
    color: #fff;
    box-shadow: 0 2px 8px var(--admin-primary-ring);
}

.organiser-tab-dropdown {
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #334155;
    padding: 0.625rem 2.25rem 0.625rem 0.875rem;
    background-color: #fff;
    cursor: pointer;
}

.organiser-tab-dropdown:focus {
    border-color: var(--admin-primary);
    box-shadow: 0 0 0 2px var(--admin-primary-ring);
    outline: none;
}
.organiser-empty-state .organiser-empty-icon {
    width: 4rem;
    height: 4rem;
    background: #f8fafc;
    border: 1px dashed #e2e8f0;
    color: #94a3b8;
}
.organiser-empty-state .organiser-empty-icon .material-symbols-outlined { font-size: 2rem; }
.organiser-avatar-placeholder { background: #f1f5f9; border: 1px solid #e2e8f0; }
.organiser-alert-banner { padding: 1rem 1.25rem; border: 1px solid transparent; }
.organiser-alert-warning { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.organiser-alert-info { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
.organiser-alert-success { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.organiser-alert-icon { font-size: 1.25rem; }
.organiser-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 700;
}
.organiser-badge-success { background: #dcfce7; color: #166534; }
.organiser-badge-warning { background: #fef3c7; color: #b45309; }
.organiser-badge-danger { background: #fee2e2; color: #b91c1c; }
.organiser-badge-neutral { background: #f1f5f9; color: #475569; }
.organiser-score-card {
    background: #fff;
    border: 1px solid #f1f5f9;
    border-radius: 1rem;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}
.organiser-score-meta { font-size: 0.625rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: #94a3b8; }
.organiser-score-team { font-size: 1.125rem; font-weight: 700; color: #0f172a; margin: 0.25rem 0; }
.organiser-score-value { font-size: 2.5rem; font-weight: 800; color: var(--admin-primary); line-height: 1; }
.organiser-score-vs { font-size: 0.875rem; }
.organiser-list-link {
    display: block;
    padding: 1rem 1.25rem;
    text-decoration: none;
    color: inherit;
    border-bottom: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}
.organiser-list-link:hover { background: #f8fafc; }
.organiser-list-link:last-child { border-bottom: none; }
.organiser-form-shell .admin-panel-card-body { padding: 1.5rem; }

/* Searchable select (organiser forms) */
.organiser-searchable-select {
    position: relative;
}
.organiser-searchable-select__trigger-wrap {
    position: relative;
}
.organiser-searchable-select__trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
    cursor: pointer;
    background-color: #fff;
}
.organiser-searchable-select__value {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.organiser-searchable-select__trigger-actions {
    display: flex;
    align-items: center;
    gap: 0.125rem;
    flex-shrink: 0;
}
.organiser-searchable-select__chevron {
    font-size: 1.25rem;
    color: #64748b;
    transition: transform 0.15s ease;
}
.organiser-searchable-select__trigger.show .organiser-searchable-select__chevron {
    transform: rotate(180deg);
}
.organiser-searchable-select__clear {
    display: inline-flex;
    padding: 0.125rem;
    color: #94a3b8;
    border-radius: 0.25rem;
    cursor: pointer;
    line-height: 1;
}
.organiser-searchable-select__clear:hover {
    color: #64748b;
    background: #f1f5f9;
}
.organiser-searchable-select__clear .material-symbols-outlined {
    font-size: 1.125rem;
}
.organiser-searchable-select__menu {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 4px);
    z-index: 1050;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    overflow: hidden;
}
.organiser-searchable-select__menu--portal {
    position: fixed;
    z-index: 1060;
    box-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.12), 0 4px 10px -2px rgba(15, 23, 42, 0.06);
}
.organiser-searchable-select__options {
    max-height: 220px;
    overflow-y: auto;
}
.organiser-searchable-select__option {
    text-align: left;
    border: none;
    background: transparent;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    color: #0f172a;
    transition: background 0.12s ease;
}
.organiser-searchable-select__option:hover,
.organiser-searchable-select__option.active {
    background: #f1f5f9;
}
.organiser-searchable-select__option.active {
    font-weight: 600;
    color: var(--bs-primary, #0d6efd);
}

/* ——— Admin motion system ——— */
@keyframes adminFadeUp {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes adminFadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes adminScaleIn {
    from {
        opacity: 0;
        transform: scale(0.98);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.admin-page-transition {
    animation: adminFadeUp var(--admin-motion-duration-slow) var(--admin-motion-ease) both;
}

.admin-page-header-animate {
    animation: adminFadeUp var(--admin-motion-duration-slow) var(--admin-motion-ease) both;
}

.admin-panel-animate {
    animation: adminFadeUp var(--admin-motion-duration-slow) var(--admin-motion-ease) both;
}

.admin-stat-animate {
    animation: adminScaleIn var(--admin-motion-duration-slow) var(--admin-motion-ease) both;
}

.admin-loading-state {
    animation: adminFadeIn var(--admin-motion-duration) var(--admin-motion-ease) both;
}

.admin-content-reveal,
.admin-fade-in {
    animation: adminFadeUp var(--admin-motion-duration-slow) var(--admin-motion-ease) both;
}

.admin-alert-animate {
    animation: adminFadeIn var(--admin-motion-duration) var(--admin-motion-ease) both;
}

/* Stagger stat cards and panels inside dashboard shells */
.organiser-page .row > [class*='col']:nth-child(1) .admin-stat-animate {
    animation-delay: 0ms;
}

.organiser-page .row > [class*='col']:nth-child(2) .admin-stat-animate {
    animation-delay: 60ms;
}

.organiser-page .row > [class*='col']:nth-child(3) .admin-stat-animate {
    animation-delay: 120ms;
}

.organiser-page .row > [class*='col']:nth-child(4) .admin-stat-animate {
    animation-delay: 180ms;
}

.organiser-page .admin-panel-animate:nth-of-type(2) {
    animation-delay: 80ms;
}

.organiser-page .admin-panel-animate:nth-of-type(3) {
    animation-delay: 140ms;
}

/* Buttons & form controls */
.btn {
    transition: background-color var(--admin-motion-duration) var(--admin-motion-ease),
        border-color var(--admin-motion-duration) var(--admin-motion-ease),
        color var(--admin-motion-duration) var(--admin-motion-ease),
        box-shadow var(--admin-motion-duration) var(--admin-motion-ease),
        transform var(--admin-motion-duration) var(--admin-motion-ease);
}

.btn:active:not(:disabled) {
    transform: scale(0.98);
}

.form-control,
.form-select {
    transition: border-color var(--admin-motion-duration) var(--admin-motion-ease),
        box-shadow var(--admin-motion-duration) var(--admin-motion-ease);
}

/* Tables */
.table tbody tr {
    transition: background-color var(--admin-motion-duration) var(--admin-motion-ease);
}

/* Top bar */
.admin-topbar {
    transition: box-shadow var(--admin-motion-duration) var(--admin-motion-ease);
}

.admin-topbar .btn-link {
    transition: color var(--admin-motion-duration) var(--admin-motion-ease),
        opacity var(--admin-motion-duration) var(--admin-motion-ease);
}

.admin-topbar .btn-link:hover {
    opacity: 0.85;
}

/* ========== Modern dashboard (Team Manager & Organiser) ========== */
.admin-dashboard-page,
.organiser-page {
    position: relative;
}

.admin-dashboard-page::before,
.organiser-page::before {
    content: '';
    position: absolute;
    inset: -1rem -0.5rem auto;
    height: 12rem;
    background: radial-gradient(ellipse 80% 60% at 20% 0%, rgba(161, 2, 2, 0.06), transparent 70%),
        radial-gradient(ellipse 60% 50% at 90% 10%, rgba(15, 23, 42, 0.04), transparent 65%);
    pointer-events: none;
    z-index: 0;
}

.admin-dashboard-page > *,
.organiser-page > * {
    position: relative;
    z-index: 1;
}

.admin-dashboard-greeting {
    font-size: clamp(1.125rem, 2vw, 1.375rem);
    color: #0f172a;
    letter-spacing: -0.02em;
    margin: 0;
}

.admin-page-header-card {
    background: linear-gradient(135deg, #ffffff 0%, #fafbfc 100%);
    border: 1px solid #f1f5f9;
    border-radius: 1.25rem;
    padding: 1.25rem 1.5rem;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}

.admin-page-eyebrow {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--admin-primary);
    margin: 0;
}

.admin-page-header-card .organiser-page-title {
    font-size: clamp(1.375rem, 2.5vw, 1.75rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.admin-back-link-modern {
    color: #64748b;
    font-weight: 600;
    transition: color var(--admin-motion-duration) var(--admin-motion-ease);
}

.admin-back-link-modern:hover {
    color: var(--admin-primary);
}

/* Stat cards */
.admin-stat-card-modern {
    position: relative;
    overflow: hidden;
    border: 1px solid #f1f5f9;
    padding: 1.25rem;
    background: #fff;
}

.admin-stat-card-accent {
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    border-radius: 4px 0 0 4px;
    opacity: 0.85;
}

.admin-stat-icon-modern {
    width: 2.75rem;
    height: 2.75rem;
}

.admin-stat-icon-modern .material-symbols-outlined {
    font-size: 1.375rem;
}

.admin-stat-card-label {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
}

.admin-stat-card-value-modern {
    font-size: 1.75rem;
    font-weight: 800;
    color: #0f172a;
    line-height: 1.1;
}

.admin-stat-card-helper {
    font-size: 0.75rem;
    color: #94a3b8;
}

.admin-hero-stat-card {
    background: linear-gradient(145deg, #ffffff 0%, #fff8f8 55%, #ffffff 100%);
    border: 1px solid rgba(161, 2, 2, 0.12);
    border-radius: 1rem;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
    transition: box-shadow var(--admin-motion-duration) var(--admin-motion-ease),
        transform var(--admin-motion-duration) var(--admin-motion-ease);
}

.admin-hero-stat-card:hover {
    box-shadow: 0 8px 24px -8px rgba(161, 2, 2, 0.15);
    transform: translateY(-1px);
}

.admin-hero-stat-logo {
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 0.875rem;
    background: var(--admin-primary-light);
    border: 1px solid rgba(161, 2, 2, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--admin-primary);
    overflow: hidden;
}

.admin-hero-stat-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 0.25rem;
}

.admin-hero-stat-logo .material-symbols-outlined {
    font-size: 1.75rem;
}

.admin-hero-stat-eyebrow {
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--admin-primary);
}

.admin-hero-stat-title {
    font-size: 1.375rem;
    font-weight: 800;
    color: #0f172a;
    line-height: 1.2;
}

.admin-hero-stat-subtitle {
    font-size: 0.8125rem;
    color: #64748b;
}

.admin-hero-stat-meta,
.admin-hero-stat-footer {
    font-size: 0.8125rem;
    color: #64748b;
}

.admin-hero-stat-footer {
    font-weight: 600;
    color: #475569;
}

/* Panels */
.admin-panel-modern {
    border: 1px solid #f1f5f9;
    background: #fff;
}

.admin-panel-header-modern {
    background: linear-gradient(to bottom, #fafbfc, #fff);
    padding: 1.125rem 1.5rem;
}

.admin-panel-title {
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a;
}

.admin-panel-subtitle {
    font-size: 0.8125rem;
    color: #94a3b8;
}

.admin-panel-body-modern {
    padding: 1.25rem 1.5rem;
}

.admin-panel-body-flush {
    padding: 0;
}

.admin-panel-meta {
    font-size: 0.75rem;
    font-weight: 600;
    color: #94a3b8;
    background: #f8fafc;
    padding: 0.25rem 0.625rem;
    border-radius: 9999px;
}

.admin-section-label {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #94a3b8;
}

/* Panel lists */
.admin-panel-list-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #f1f5f9;
    transition: background-color var(--admin-motion-duration) var(--admin-motion-ease);
}

.admin-panel-list-item:last-child {
    border-bottom: none;
}

.admin-panel-list-item:hover {
    background: #f8fafc;
}

.admin-panel-list-primary {
    font-weight: 600;
    color: #0f172a;
    font-size: 0.9375rem;
}

.admin-panel-list-secondary {
    font-size: 0.8125rem;
    color: #64748b;
    margin-top: 0.25rem;
}

.admin-panel-list-footer {
    font-size: 0.75rem;
    color: #94a3b8;
    margin-top: 0.35rem;
}

.admin-panel-list-meta {
    font-size: 0.75rem;
    color: #94a3b8;
}

/* Fixture cards */
.admin-fixture-card {
    background: #f8fafc;
    border: 1px solid #f1f5f9;
    border-radius: 0.875rem;
    padding: 1rem 1.125rem;
    margin-bottom: 0.75rem;
    transition: border-color var(--admin-motion-duration) var(--admin-motion-ease),
        box-shadow var(--admin-motion-duration) var(--admin-motion-ease),
        transform var(--admin-motion-duration) var(--admin-motion-ease);
}

.admin-fixture-card:last-child {
    margin-bottom: 0;
}

.admin-fixture-card:hover {
    border-color: #e2e8f0;
    box-shadow: 0 4px 12px -4px rgba(15, 23, 42, 0.08);
    transform: translateY(-1px);
}

.admin-fixture-card--recent {
    background: #fff;
}

.admin-fixture-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.admin-fixture-card-competition {
    font-size: 0.75rem;
    font-weight: 700;
    color: #475569;
}

.admin-fixture-card-date {
    font-size: 0.75rem;
    color: #94a3b8;
}

.admin-fixture-card-body {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 0.75rem;
}

.admin-fixture-card-role {
    display: block;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #94a3b8;
    margin-bottom: 0.15rem;
}

.admin-fixture-card-team {
    font-weight: 700;
    color: #0f172a;
    font-size: 0.9375rem;
}

.admin-fixture-kickoff {
    display: inline-flex;
    padding: 0.35rem 0.75rem;
    border-radius: 9999px;
    background: var(--admin-primary-light);
    color: var(--admin-primary);
    font-size: 0.8125rem;
    font-weight: 700;
}

.admin-fixture-score {
    font-size: 1.25rem;
    font-weight: 800;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

.admin-fixture-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.admin-fixture-list .admin-fixture-card {
    margin-bottom: 0;
}

.admin-fixture-venue,
.admin-fixture-outcome {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.admin-club-picker {
    min-width: 10rem;
    max-width: 100%;
}

/* Form chips */
.admin-form-chips {
    padding-top: 0.25rem;
}

.admin-form-chip {
    display: inline-flex;
    flex-direction: column;
    gap: 0.125rem;
    padding: 0.5rem 1rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    min-width: 5rem;
}

.admin-form-chip-label {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #94a3b8;
}

.admin-form-chip-value {
    font-size: 0.9375rem;
    font-weight: 700;
    color: #0f172a;
}

/* Alerts */
.admin-alert-banner-modern {
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.admin-alert-icon-wrap {
    width: 2.25rem;
    height: 2.25rem;
    background: rgba(255, 255, 255, 0.65);
}

.admin-alert-action {
    border-radius: 0.5rem;
    font-weight: 600;
}

.organiser-alert-warning .admin-alert-action {
    border-color: #d97706;
    color: #92400e;
}

/* Filter bar */
.admin-filter-bar-modern {
    background: #fff;
    border: 1px solid #f1f5f9;
    border-radius: 1rem;
    padding: 0.875rem 1rem;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}

.admin-filter-search-icon {
    position: absolute;
    left: 0.875rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.25rem;
    color: #94a3b8;
    pointer-events: none;
}

.admin-filter-input {
    padding-left: 2.75rem !important;
    border-radius: 0.75rem !important;
    border-color: #e2e8f0 !important;
    font-size: 0.875rem;
}

.admin-filter-input:focus {
    border-color: var(--admin-primary) !important;
    box-shadow: 0 0 0 3px var(--admin-primary-ring) !important;
}

.admin-btn-modern {
    border-radius: 0.75rem !important;
    font-weight: 600;
    font-size: 0.875rem;
}

.admin-club-picker {
    border-radius: 0.75rem;
    border-color: #e2e8f0;
    font-weight: 600;
    font-size: 0.875rem;
    min-width: 10rem;
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
}

.admin-club-picker:focus {
    border-color: var(--admin-primary);
    box-shadow: 0 0 0 3px var(--admin-primary-ring);
}

.admin-empty-state-modern .admin-empty-icon-modern {
    width: 4.5rem;
    height: 4.5rem;
    background: linear-gradient(145deg, #f8fafc, #fff);
    border: 1px dashed #e2e8f0;
}

.admin-badge-captain {
    background: #fef3c7;
    color: #b45309;
    font-weight: 600;
}

.admin-badge-position {
    background: var(--admin-primary-light);
    color: var(--admin-primary);
    font-weight: 600;
}

/* TeamManager modern shell */
.teammanager-page {
    position: relative;
}

.tm-content-animate-in {
    animation: adminFadeUp var(--admin-motion-duration-slow) var(--admin-motion-ease) both;
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    .admin-page-transition,
    .admin-page-header-animate,
    .admin-panel-animate,
    .admin-stat-animate,
    .admin-loading-state,
    .admin-content-reveal,
    .admin-fade-in,
    .admin-alert-animate,
    .tm-content-animate-in {
        animation: none !important;
    }

    .admin-nav-group-collapse {
        transition: none !important;
    }

    .btn:active:not(:disabled) {
        transform: none;
    }
}

/* TeamManager profile – modern hero */
.tm-profile-hero {
    background: linear-gradient(135deg, rgba(161, 2, 2, 0.08), rgba(248, 239, 239, 0.55));
    border: 1px solid rgba(161, 2, 2, 0.15);
    border-radius: 1.25rem;
    padding: 1.25rem 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

.tm-profile-hero-title {
    font-size: 1.125rem;
    font-weight: 800;
    color: #0f172a;
}

.tm-profile-hero-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 4rem;
    padding: 0.5rem 0.75rem;
    border-radius: 9999px;
    font-size: 0.8125rem;
    font-weight: 800;
    border: 1px solid transparent;
}

.tm-profile-hero-pill.complete {
    background: #dcfce7;
    color: #166534;
    border-color: #bbf7d0;
}

.tm-profile-hero-pill.incomplete {
    background: #fffbeb;
    color: #92400e;
    border-color: #fde68a;
}

.tm-profile-progress {
    height: 10px;
    border-radius: 9999px;
    background: #e2e8f0;
    overflow: hidden;
}

.tm-profile-progress-bar {
    height: 100%;
    background: var(--admin-primary);
    border-radius: 9999px;
    transition: width 0.4s ease;
}

/* Brand status badges (§6.3) */
.ligi-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.5rem;
    border-radius: var(--border-radius-full);
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}
.ligi-badge-live { background: #dcfce7; color: var(--color-brand-green); }
.ligi-badge-pending { background: #fef9c3; color: #854d0e; }
.ligi-badge-inactive { background: var(--color-brand-parchment); color: var(--color-brand-slate); }
.ligi-badge-error { background: #fef2f2; color: var(--color-brand-red-destructive); }

/* Alert banners (§6.4) */
.ligi-alert {
    padding: var(--space-4);
    border-left: 3px solid;
    border-radius: var(--border-radius-sm);
    font-size: var(--text-body-sm);
}
.ligi-alert-info { background: #eff6ff; border-color: var(--color-brand-info); color: #1e3a8a; }
.ligi-alert-warning { background: #fefce8; border-color: var(--color-brand-gold); color: #713f12; }
.ligi-alert-error { background: #fef2f2; border-color: var(--color-brand-red); color: #7f1d1d; }
.ligi-alert-success { background: #f0fdf4; border-color: var(--color-brand-green); color: #14532d; }

/* Table row states */
.organiser-table-card tbody tr:hover { background: var(--color-brand-parchment); }
.organiser-table-card tbody tr.selected {
    background: #fef2f2;
    border-left: 2px solid var(--color-brand-red);
}

/* Team Manager transfer player cards */
.tm-transfer-card-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
}
@media (min-width: 576px) {
    .tm-transfer-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (min-width: 992px) {
    .tm-transfer-card-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
.tm-transfer-player-card {
    display: flex;
    flex-direction: column;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    background: #fff;
    overflow: hidden;
    min-height: 100%;
}
.tm-transfer-player-card__body {
    display: flex;
    gap: 0.75rem;
    padding: 1rem;
    flex: 1 1 auto;
}
.tm-transfer-player-card__avatar {
    width: 3rem;
    height: 3rem;
    border-radius: 999px;
    background: #f1f5f9;
    color: #64748b;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
}
.tm-transfer-player-card__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.tm-transfer-player-card__avatar .material-symbols-outlined {
    font-size: 1.5rem;
}
.tm-transfer-player-card__name {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.3;
    color: #0f172a;
}
.tm-transfer-player-card__position {
    margin-top: 0.15rem;
    font-size: 0.8125rem;
    color: #64748b;
}
.tm-transfer-player-card__club {
    margin-top: 0.35rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #334155;
}
.tm-transfer-player-card__footer {
    margin-top: auto;
    border-top: 1px solid #e2e8f0;
}
.tm-transfer-player-card__request {
    display: block;
    width: 100%;
    border: 0;
    border-radius: 0;
    padding: 0.85rem 1rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    font-size: 0.8125rem;
    background: var(--color-brand-red, #c1121f);
    color: #fff;
}
.tm-transfer-player-card__request:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}
.tm-transfer-player-card__request:not(:disabled):hover {
    filter: brightness(0.95);
}
.tm-transfer-player-card__request--secondary {
    background: #fff;
    color: var(--color-brand-red, #c1121f);
}

/* Academy management entity cards */
.academy-entity-card {
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 8px 24px rgba(15, 23, 42, 0.04);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.academy-entity-card--clickable:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}
.academy-entity-card--inactive {
    opacity: 0.72;
}
.academy-entity-card__media {
    height: 120px;
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 55%, var(--color-brand-red, #a10202) 160%);
}
.academy-entity-card__placeholder {
    color: rgba(255, 255, 255, 0.55);
}
.academy-entity-card__avatar {
    background: #f1f5f9;
}
.academy-entity-card--compact {
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.academy-dashboard-hero {
    position: relative;
    overflow: hidden;
    border-radius: 1rem;
    background: linear-gradient(120deg, #0f172a 0%, #1e293b 45%, #3f0d0d 100%);
    color: #fff;
    min-height: 180px;
}
.academy-dashboard-hero__banner {
    position: absolute;
    inset: 0;
    opacity: 0.35;
    object-fit: cover;
    width: 100%;
    height: 100%;
}
.academy-dashboard-hero__content {
    position: relative;
    z-index: 1;
}
.academy-dashboard-table th {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
}

/* Academy modals — portaled to body, not clipped by admin-main overflow */
.academy-modal-root {
    position: fixed;
    inset: 0;
    z-index: 1080;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}
.academy-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
}
.academy-modal-dialog {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 100%;
    display: flex;
    justify-content: center;
}
.academy-modal-panel {
    background: #fff;
    border-radius: 0.75rem;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.2);
    width: 100%;
    max-height: min(92vh, 720px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.academy-modal-panel--md { max-width: 28rem; }
.academy-modal-panel--lg { max-width: 36rem; }
.academy-modal-panel--xl { max-width: 44rem; }
.academy-modal-header,
.academy-modal-footer {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.85rem 1.1rem;
    border-bottom: 1px solid #e2e8f0;
}
.academy-modal-footer {
    border-bottom: 0;
    border-top: 1px solid #e2e8f0;
    justify-content: flex-end;
}
.academy-modal-title {
    font-size: 1.05rem;
    font-weight: 700;
}
.academy-modal-body {
    padding: 1rem 1.1rem;
    overflow: visible;
}
.academy-modal-body .row {
    --bs-gutter-y: 0.65rem;
}
.academy-modal-body .form-label {
    margin-bottom: 0.25rem;
    font-size: 0.8125rem;
}
.academy-modal-body .form-control,
.academy-modal-body .form-select {
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
    font-size: 0.875rem;
}
.academy-day-select .btn {
    min-width: 2.6rem;
}

.academy-link-form {
    max-width: 28rem;
}

/* =============================================================================
   App shell (top menu) — CareOps-style layout with Ligi brand tokens
   Used by reos.Web.Mvc ClientApp AppLayout
   ============================================================================= */

body.app-spa-body {
    margin: 0;
    min-height: 100vh;
    background: var(--admin-main-bg);
    color: var(--color-brand-night);
    font-family: var(--font-primary);
    font-size: 13px;
    -webkit-font-smoothing: antialiased;
}

.app-shell {
    --app-container-max: 1280px;
    --app-gutter: 1.5rem;
    --app-font: 13px;
    --app-font-sm: 12px;
    --app-font-xs: 11px;
    --app-radius: 12px;
    --app-control-h: 2rem;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--admin-main-bg);
    font-family: var(--font-primary);
    font-size: var(--app-font);
    color: var(--color-brand-night);
}

.app-shell-container {
    width: 100%;
    max-width: var(--app-container-max);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--app-gutter);
    padding-right: var(--app-gutter);
    box-sizing: border-box;
}

.app-shell-chrome {
    position: sticky;
    top: 0;
    z-index: 1040;
    background: #ffffff;
    border-bottom: 1px solid var(--color-brand-ash);
    overflow: visible;
}

.app-shell-header {
    background: #ffffff;
    border-bottom: 1px solid rgba(232, 230, 224, 0.9);
}

.app-shell-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 3.25rem;
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
}

.app-shell-header-start,
.app-shell-header-end {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.app-shell-brand {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    line-height: 0;
}

.app-shell-logo {
    display: block;
    height: 28px;
    width: auto;
}

.app-shell-menu-toggle {
    display: none;
    width: 2rem;
    height: 2rem;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--color-brand-ash);
    border-radius: 8px;
    background: #fff;
    color: var(--color-brand-night);
    cursor: pointer;
}

.app-shell-menu-toggle:hover {
    background: var(--color-brand-parchment);
}

.app-shell-user {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.app-shell-avatar {
    width: 2rem;
    height: 2rem;
    border-radius: 9999px;
    background: var(--admin-primary-light);
    color: var(--admin-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: var(--app-font-xs);
    font-weight: 700;
    flex-shrink: 0;
}

.app-shell-user-meta {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.app-shell-user-name {
    font-size: var(--app-font);
    font-weight: 600;
    color: var(--color-brand-night);
}

.app-shell-user-role {
    font-size: var(--app-font-xs);
    color: var(--color-brand-slate);
}

.app-shell-logout {
    width: 1.85rem;
    height: 1.85rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    color: var(--color-brand-slate);
    text-decoration: none;
}

.app-shell-logout:hover {
    background: var(--color-brand-parchment);
    color: var(--admin-primary);
}

.app-shell-categories-row {
    position: relative;
    z-index: 1055;
    background: #ffffff;
    padding-top: 0.55rem;
    padding-bottom: 0.65rem;
    overflow: visible;
}

.app-shell-categories {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.app-shell-category-wrap {
    position: relative;
    flex-shrink: 0;
}

.app-shell-category {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.75rem;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--color-brand-slate-mid);
    font-family: inherit;
    font-size: var(--app-font);
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color var(--transition-fast), color var(--transition-fast);
}

.app-shell-category i {
    font-size: 0.8rem;
    opacity: 0.9;
}

.app-shell-category-caret {
    font-size: 0.55rem !important;
    opacity: 0.7;
    margin-left: 0.1rem;
}

.app-shell-category:hover,
.app-shell-category.is-open {
    background: var(--color-brand-parchment);
    color: var(--color-brand-night);
}

.app-shell-category.is-active {
    background: var(--admin-primary-light);
    color: var(--admin-primary-active);
    font-weight: 600;
}

.app-shell-category.is-active i {
    color: var(--admin-primary);
}

.app-mega-panel {
    position: absolute;
    top: calc(100% + 0.65rem);
    left: 0;
    z-index: 1060;
    min-width: min(34rem, calc(100vw - 2rem));
    max-width: min(42rem, calc(100vw - 2rem));
    padding: 1.15rem 1.25rem 1.25rem;
    background: #fff;
    border: 1px solid var(--color-brand-ash);
    border-radius: 14px;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.14);
}

.app-mega-panel::before {
    content: '';
    position: absolute;
    top: -7px;
    left: 1.4rem;
    width: 14px;
    height: 14px;
    background: #fff;
    border-left: 1px solid var(--color-brand-ash);
    border-top: 1px solid var(--color-brand-ash);
    transform: rotate(45deg);
}

.app-mega-panel.is-multi {
    left: 0;
    min-width: min(48rem, calc(100vw - 2rem));
    max-width: min(56rem, calc(100vw - 2rem));
}

.app-shell-category-wrap:nth-last-child(-n+2) .app-mega-panel {
    left: auto;
    right: 0;
}

.app-shell-category-wrap:nth-last-child(-n+2) .app-mega-panel::before {
    left: auto;
    right: 1.4rem;
}

.app-mega-panel-inner {
    display: flex;
    flex-direction: column;
    gap: 1.15rem;
}

.app-mega-section-title {
    margin: 0 0 0.75rem;
    color: var(--color-brand-slate);
    font-size: var(--app-font-xs);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.app-mega-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.35rem 1rem;
}

.app-mega-panel.is-multi .app-mega-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.app-mega-item {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    padding: 0.55rem 0.6rem;
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    transition: background-color var(--transition-fast);
}

.app-mega-item:hover,
.app-mega-item.is-active {
    background: var(--color-brand-parchment);
}

.app-mega-item-icon {
    flex-shrink: 0;
    width: 2.15rem;
    height: 2.15rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: var(--admin-primary-light);
    color: var(--admin-primary);
    font-size: 0.85rem;
}

.app-mega-item-copy {
    display: flex;
    flex-direction: column;
    gap: 0.12rem;
    min-width: 0;
    padding-top: 0.1rem;
}

.app-mega-item-title {
    color: var(--color-brand-night);
    font-size: var(--app-font);
    font-weight: 700;
    line-height: 1.25;
}

.app-mega-item-desc {
    color: var(--color-brand-slate);
    font-size: var(--app-font-xs);
    line-height: 1.35;
}

.app-shell-backdrop {
    display: none;
}

.app-shell.is-mega-open .app-shell-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 1035;
    border: 0;
    padding: 0;
    background: transparent;
    cursor: default;
}

.app-shell-body {
    flex: 1;
    width: 100%;
    padding-top: 1.25rem;
    padding-bottom: 1.75rem;
}

.app-shell-page-head {
    margin-bottom: 1rem;
}

.app-shell-page-title {
    margin: 0;
    font-size: clamp(1.35rem, 2vw, 1.65rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    color: var(--color-brand-night);
    line-height: 1.15;
}

.app-shell-main {
    min-width: 0;
}

.app-shell-footer {
    margin-top: auto;
    border-top: 1px solid var(--color-brand-ash);
    background: #fff;
}

.app-shell-footer-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
    color: var(--color-brand-slate);
    font-size: var(--app-font-xs);
    line-height: 1.4;
}

/* Content surfaces */
.app-panel {
    background: #ffffff;
    border: 1px solid var(--color-brand-ash);
    border-radius: var(--app-radius);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    overflow: hidden;
}

.app-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--color-brand-ash);
}

.app-panel-body {
    padding: 1rem;
}

.app-panel-footer {
    padding: 0.6rem 1rem;
    border-top: 1px solid var(--color-brand-ash);
    background: #fff;
}

.app-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    margin-bottom: 0.85rem;
}

.app-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
    margin-left: auto;
}

.app-filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.85rem;
}

.app-filter-bar .form-control,
.app-filter-bar .form-select,
.app-filter-bar .input-group {
    max-width: 100%;
}

.app-kpi-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

@media (min-width: 768px) {
    .app-kpi-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 1200px) {
    .app-kpi-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.app-kpi-card {
    background: #ffffff;
    border: 1px solid var(--color-brand-ash);
    border-radius: var(--app-radius);
    padding: 0.95rem 1rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.app-kpi-card:hover {
    border-color: #ddd9d0;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
}

.app-kpi-label {
    font-size: var(--app-font-xs);
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--color-brand-slate);
    margin: 0 0 0.3rem;
}

.app-kpi-value {
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: var(--color-brand-night);
    line-height: 1.1;
    margin: 0;
}

.app-section-title {
    margin: 0 0 0.3rem;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--color-brand-night);
}

.app-section-subtitle {
    margin: 0 0 0.85rem;
    font-size: var(--app-font);
    color: var(--color-brand-slate);
}

.app-table-wrap {
    overflow-x: auto;
}

.app-shell .admin-table {
    font-size: var(--app-font);
}

.app-shell .admin-table th {
    background: var(--color-brand-offwhite);
    color: var(--color-brand-slate);
    border-bottom: 1px solid var(--color-brand-ash);
    padding: 0.65rem 1rem;
    font-size: var(--app-font-xs);
    letter-spacing: 0.06em;
}

.app-shell .admin-table td {
    border-bottom: 1px solid #f0eee8;
    color: var(--color-brand-slate-mid);
    padding: 0.7rem 1rem;
    vertical-align: middle;
}

.app-shell .admin-table tbody tr:last-child td {
    border-bottom: 0;
}

.app-shell .admin-table tbody tr:hover {
    background: #faf9f6;
}

.app-shell .admin-table .fw-semibold {
    color: var(--color-brand-night);
    font-weight: 600;
}

.app-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.45rem;
    border-radius: 9999px;
    font-size: 0.5625rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.app-badge-draft { background: var(--color-brand-parchment); color: var(--color-brand-slate-mid); }
.app-badge-published { background: #dcfce7; color: var(--color-brand-green); }
.app-badge-scheduled { background: #eff6ff; color: var(--color-brand-info); }
.app-badge-archived { background: #e2e8f0; color: var(--color-brand-slate); }
.app-badge-active { background: #dcfce7; color: var(--color-brand-green); }
.app-badge-inactive { background: var(--color-brand-parchment); color: var(--color-brand-slate); }

.app-page-title {
    margin: 0 0 0.2rem;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--color-brand-night);
}

.app-page-meta {
    margin: 0 0 0.85rem;
    font-size: var(--app-font);
    color: var(--color-brand-slate);
}

.app-form-card {
    background: #fff;
    border: 1px solid var(--color-brand-ash);
    border-radius: var(--app-radius);
    padding: 1rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.app-empty,
.app-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 2rem 1rem;
    color: var(--color-brand-slate);
    font-size: var(--app-font);
}

.app-alert {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.7rem 0.85rem;
    border-radius: 10px;
    border-left: 3px solid var(--admin-primary);
    background: #fef2f2;
    color: #7f1d1d;
    font-size: var(--app-font);
}

/* Modernized controls inside the shell */
.app-shell .btn {
    --bs-btn-padding-y: 0.3rem;
    --bs-btn-padding-x: 0.7rem;
    --bs-btn-font-size: var(--app-font);
    --bs-btn-border-radius: 8px;
    font-weight: 600;
    letter-spacing: -0.01em;
}

.app-shell .btn-sm,
.app-shell .btn.btn-sm {
    --bs-btn-padding-y: 0.2rem;
    --bs-btn-padding-x: 0.45rem;
    --bs-btn-font-size: var(--app-font-sm);
}

.app-shell .btn-outline-secondary {
    border-color: var(--color-brand-ash);
    color: var(--color-brand-slate-mid);
    background: #fff;
}

.app-shell .btn-outline-secondary:hover {
    background: var(--color-brand-parchment);
    border-color: #ddd9d0;
    color: var(--color-brand-night);
}

.app-shell .form-control,
.app-shell .form-select,
.app-filter-bar .form-control,
.app-filter-bar .form-select {
    min-height: var(--app-control-h);
    padding: 0.3rem 0.65rem;
    border: 1px solid var(--color-brand-ash);
    border-radius: 8px;
    background: #fff;
    color: var(--color-brand-night);
    font-family: var(--font-primary);
    font-size: var(--app-font);
    box-shadow: none;
}

.app-shell .form-control::placeholder {
    color: #94a3b8;
}

.app-shell .form-control:focus,
.app-shell .form-select:focus,
.app-filter-bar .form-control:focus,
.app-filter-bar .form-select:focus {
    border-color: var(--admin-primary);
    box-shadow: 0 0 0 3px var(--admin-primary-ring);
}

.app-shell .input-group .btn {
    border-radius: 0 8px 8px 0;
}

.app-shell .input-group .form-control {
    border-radius: 8px 0 0 8px;
}

.app-shell .form-label {
    font-size: var(--app-font-sm);
    font-weight: 600;
    color: var(--color-brand-slate-mid);
    margin-bottom: 0.3rem;
}

.app-shell .card {
    background: #ffffff;
    border: 1px solid var(--color-brand-ash);
    border-radius: var(--app-radius);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.app-shell .card-header,
.app-shell .card-footer {
    background: #fff;
    border-color: var(--color-brand-ash);
    padding: 0.75rem 1rem;
}

.app-shell .card-body {
    padding: 1rem;
}

.app-shell .modal-content {
    border: 1px solid var(--color-brand-ash);
    border-radius: var(--app-radius);
    font-family: var(--font-primary);
    font-size: var(--app-font);
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.14);
}

.app-shell .modal-header,
.app-shell .modal-footer {
    border-color: var(--color-brand-ash);
    padding: 0.75rem 1rem;
}

.app-shell .modal-title {
    font-size: 0.95rem;
    font-weight: 700;
}

.app-shell .table {
    font-family: var(--font-primary);
    font-size: var(--app-font);
}

@media (max-width: 991.98px) {
    .app-shell {
        --app-gutter: 1rem;
    }

    .app-shell-menu-toggle {
        display: inline-flex;
    }

    .app-shell-categories-row {
        display: none;
        position: fixed;
        top: 3.25rem;
        left: 0;
        right: 0;
        z-index: 1050;
        padding: 0;
        background: transparent;
    }

    .app-shell.is-mobile-nav-open .app-shell-categories-row {
        display: block;
    }

    .app-shell.is-mobile-nav-open .app-shell-categories-row .app-shell-container {
        padding-top: 0.75rem;
        padding-bottom: 0.75rem;
    }

    .app-shell-categories {
        flex-direction: column;
        align-items: stretch;
        gap: 0.25rem;
        padding: 0.75rem;
        max-height: min(78vh, 40rem);
        overflow: auto;
        background: #fff;
        border: 1px solid var(--color-brand-ash);
        border-radius: var(--app-radius);
        box-shadow: 0 12px 32px rgba(15, 23, 42, 0.14);
    }

    .app-shell-category-wrap {
        width: 100%;
    }

    .app-shell.is-mobile-nav-open .app-shell-backdrop,
    .app-shell.is-mega-open .app-shell-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1045;
        border: 0;
        padding: 0;
        background: rgba(15, 23, 42, 0.35);
        cursor: pointer;
    }

    .app-shell-category {
        width: 100%;
        justify-content: flex-start;
    }

    .app-shell-category-caret {
        margin-left: auto;
    }

    .app-mega-panel,
    .app-mega-panel.is-multi {
        position: static;
        top: auto;
        left: auto;
        min-width: 0;
        max-width: none;
        width: 100%;
        margin-top: 0.35rem;
        margin-bottom: 0.35rem;
        padding: 0.75rem;
        border-radius: 10px;
        box-shadow: none;
        background: var(--color-brand-parchment);
    }

    .app-mega-panel::before {
        display: none;
    }

    .app-mega-panel-inner {
        gap: 0.9rem;
    }

    .app-mega-grid,
    .app-mega-panel.is-multi .app-mega-grid {
        grid-template-columns: 1fr;
        gap: 0.2rem;
    }

    .app-mega-item {
        padding: 0.45rem 0.5rem;
    }

    .app-shell-user-meta {
        display: none;
    }

    .app-shell-page-title {
        font-size: 1.3rem;
    }

    .app-shell-footer-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }
}

@media (max-width: 575.98px) {
    .app-shell {
        --app-gutter: 0.85rem;
    }

    .app-shell-logo {
        height: 24px;
    }
}

/* Team Manager — printable player list (frameless) */
.tm-players-print {
    min-height: 100vh;
    background: #f8fafc;
    color: #0f172a;
    font-family: var(--font-family-base, "Space Grotesk", system-ui, sans-serif);
}

.tm-players-print-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    padding: 0.85rem 1.25rem;
    background: #fff;
    border-bottom: 1px solid #e2e8f0;
    position: sticky;
    top: 0;
    z-index: 10;
}

.tm-players-print-sheet {
    max-width: 960px;
    margin: 0 auto;
    padding: 1.5rem 1.25rem 2.5rem;
}

.tm-players-print-heading {
    margin-bottom: 1.25rem;
}

.tm-players-print-heading h1 {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.tm-players-print-heading p {
    margin: 0.25rem 0 0;
    color: #64748b;
    font-size: 0.9rem;
}

.tm-players-print-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 1rem;
}

.tm-players-print-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    padding: 1rem 0.85rem 1.1rem;
    text-align: center;
    break-inside: avoid;
    page-break-inside: avoid;
}

.tm-players-print-photo-wrap {
    position: relative;
    width: 88px;
    height: 88px;
    margin: 0 auto 0.75rem;
}

.tm-players-print-photo,
.tm-players-print-photo-fallback {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    object-fit: cover;
}

.tm-players-print-photo-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f1f5f9;
    color: #94a3b8;
}

.tm-players-print-photo-fallback .material-symbols-outlined {
    font-size: 40px;
}

.tm-players-print-name {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 650;
    line-height: 1.25;
}

.tm-players-print-position,
.tm-players-print-age {
    margin: 0.2rem 0 0;
    font-size: 0.8rem;
    color: #64748b;
}

.tm-players-print-position {
    font-weight: 550;
    color: #334155;
}

@media print {
    .no-print {
        display: none !important;
    }

    .tm-players-print {
        background: #fff;
        min-height: 0;
    }

    .tm-players-print-sheet {
        max-width: none;
        margin: 0;
        padding: 0;
    }

    .tm-players-print-card {
        border-color: #cbd5e1;
        box-shadow: none;
    }

    .tm-players-print-grid {
        gap: 0.75rem;
    }
}