/* ============================================================================
   admin.css — minimal carry-over from the legacy admin theme.

   Most of this file used to define styles for AdminPageHeader / AdminStatCard /
   AdminEmptyState / AdminLoading / admin-scope-identity. Those components were
   retired in favour of the broadcast design system (PageIdentity, KpiStrip,
   EmptyState, PageLoading) — their styles deleted with them.

   What's left: link colouring for plain in-body links. The dark theme's browser
   defaults (visited purple, link saturated blue) read poorly on the management
   section's near-black surface; this pins all anchor states to the brand accent
   so visited vs unvisited stay legible. Buttons that render as anchors
   (RadzenButton/RadzenLink and our own PillButton) define their own colour and
   override this — these rules only affect plain in-body links (event titles,
   contact info, breadcrumb links, etc.).
   ============================================================================ */

a,
a:link,
a:visited {
    color: var(--accent-text);
    text-decoration-color: color-mix(in srgb, var(--accent) 50%, transparent);
}

a:hover,
a:focus {
    /* Shift toward --fg so the hover brightens on dark and darkens on light, instead of
       always fading toward white (which is invisible on the light surface). */
    color: color-mix(in srgb, var(--accent-text) 72%, var(--fg));
    text-decoration-color: currentColor;
}

a:active {
    color: var(--accent-text);
}

/* ----------------------------------------------------------------------------
   Dialog horizontal-scroll fix.

   Our dialogs size the .rz-dialog via DialogOptions.Width and ALSO set an inline
   `min-width: min(Npx, 90vw)` on their inner content wrapper. Radzen's
   .rz-dialog-content adds ~20px padding on EACH side, but the paired Width only
   budgeted one padding's worth — so the wrapper is ~20px wider than the padded
   inner area and every dialog shows a phantom horizontal scrollbar.

   The dialog's size already comes from DialogOptions.Width, so the wrapper's fixed
   min-width is redundant; zero it out so the content fills the padded inner width
   with symmetric padding and no overflow. (!important to beat the inline style.)
   ---------------------------------------------------------------------------- */
.rz-dialog-content > * {
    min-width: 0 !important;
}

/* ----------------------------------------------------------------------------
   Mobile "sheet" dialogs. Opt in with DialogOptions { CssClass = "cm-sheet-dialog" } for
   forms staff fill in on a phone at practice (e.g. Add player). On narrow screens the
   dialog becomes a full-screen sheet with its own scroll instead of a cramped centred
   box; on wider screens it's a normal dialog.
   ---------------------------------------------------------------------------- */
@media (max-width: 640px) {
    .rz-dialog.cm-sheet-dialog {
        width: 100vw !important;
        max-width: 100vw !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        top: 0 !important;
        left: 0 !important;
        transform: none !important;
        border-radius: 0 !important;
        display: flex;
        flex-direction: column;
    }

    .rz-dialog.cm-sheet-dialog .rz-dialog-content {
        flex: 1;
        overflow-y: auto;
        /* No bottom padding: a sheet's sticky action bar sits flush at the bottom and carries
           the safe-area inset itself, so scrolled content can't peek out underneath it. */
        padding: 1rem 1rem 0;
    }
}