@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.boiwgh0w5b.bundle.scp.css';

/* /Components/Admin/TemplateEditorPage.razor.rz.scp.css */
/* .hf-input has no vertical padding (it is sized for single-line inputs); a multi-line
   editing surface needs it, otherwise the first line touches the border. Tokens only.
   Templates are edited as raw text with {{Placeholders}}: a monospace face keeps the braces
   legible. The 16px font-size of the textarea is left alone on purpose - it is what stops
   iOS Safari from zooming the viewport on focus. */
.template-textarea[b-1wvcj8ynrh] {
    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
    padding-block: var(--space-3);
    line-height: 24px;
    resize: vertical;
}
/* /Components/Layout/HomeLayout.razor.rz.scp.css */
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/*
    App chrome for MainLayout.

    The shell (hf-shell), sidebar (hf-sidenav), bottom bar (hf-bottomnav) and nav items
    (hf-nav-item) come from the HEIFIT design system (wwwroot/css/heifit-components.css). Only what
    the design system does not provide lives here: the slim header with brand, notification bell and
    profile menu, and the framework error banner. Values come from heifit-tokens.css.
*/

/*
    The main column holds the header, the routed page and the footer. It is the second grid column
    of .hf-shell on desktop.
*/
.main-column[b-5sajud6lau] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 100vh;
}

main[b-5sajud6lau] {
    flex: 1;
}

.page-content[b-5sajud6lau] {
    padding: var(--space-4);
}

/* Sidebar navigation list: only stacks the nav items; each item is styled by hf-nav-item. */
.nav-list[b-5sajud6lau] {
    display: grid;
    gap: var(--space-1);
}

/* Bottom bar: long labels must never push the pill wider than the screen. */
.hf-bottomnav[b-5sajud6lau]  .hf-nav-item {
    min-width: 0;
}

.hf-bottomnav[b-5sajud6lau]  .hf-nav-label {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.top-row[b-5sajud6lau] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    height: 3.5rem;
    padding: 0 var(--space-4);
    background-color: var(--surface-200);
    border-bottom: 1px solid var(--divider);
}

.top-row .brand[b-5sajud6lau] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-height: var(--size-touch);
    font-family: var(--font-display);
    font-size: 1.75rem;
    letter-spacing: .04em;
    color: var(--ink);
    text-decoration: none;
}

.user-area[b-5sajud6lau] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

/*
    Profile menu: a data-hf-popover trigger (hf-btn hf-btn--ghost, see MainLayout.razor) inside a
    .hf-popwrap, opening a .hf-pop panel. Position, background, border and shadow all come from the
    bundle's .hf-popwrap/.hf-pop; only the app-specific label styling and item spacing stay here.
*/
.profile-trigger[b-5sajud6lau] {
    font-family: var(--font-sans);
    font-size: 0.875rem;
}

.profile-dropdown[b-5sajud6lau] {
    padding: var(--space-1) 0;
}

.profile-dropdown[b-5sajud6lau]  .profile-item,
.profile-dropdown .profile-item[b-5sajud6lau] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    width: 100%;
    min-height: var(--size-touch);
    padding: var(--space-2) var(--space-3);
    font-family: var(--font-sans);
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--ink);
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

.profile-dropdown[b-5sajud6lau]  .profile-item:hover,
.profile-dropdown .profile-item:hover[b-5sajud6lau] {
    background-color: var(--surface-300);
    text-decoration: none;
}

.profile-dropdown[b-5sajud6lau]  .profile-item-active {
    color: var(--brand-ink);
    font-weight: 700;
}

/*
    Replaces the former inline style="border: none; background: transparent;" on the logout
    submit button. Presentation only - the form, antiforgery token, method and action are
    unchanged.
*/
.profile-logout-button[b-5sajud6lau] {
    border: none;
    background: transparent;
}

.profile-dropdown form[b-5sajud6lau] {
    margin: 0;
}

/* The sidebar carries the brand from 1024px, so the header brand is only needed below it. */
@media (min-width: 1024px) {
    .top-row[b-5sajud6lau] {
        position: sticky;
        top: 0;
        z-index: 30;
        justify-content: flex-end;
        padding: 0 var(--space-6);
    }

    .top-row .brand[b-5sajud6lau] {
        display: none;
    }
}

/*
    hf-errorbar (heifit-components.css) supplies the fixed position, layout, background and text
    colour. Only the framework's default hidden state stays app-specific: blazor.web.js toggles this
    inline style to show the banner on an error.
*/
#blazor-error-ui[b-5sajud6lau] {
    display: none;
}

/* Literal light-theme focus colour (same as --focus in light): the banner background is fixed, the dark token would be too pale on it. */
#blazor-error-ui :focus-visible[b-5sajud6lau] {
    outline: 2px solid #4340d2;
    outline-offset: 2px;
}

/*
    Below the desktop breakpoint the floating bottom bar (z-index 40) sits near the bottom edge and
    this banner (hf-errorbar, z-index 70) would cover it. Lift the banner by the space
    hf-has-bottomnav reserves so both stay operable.
*/
@media (max-width: 1023.98px) {
    #blazor-error-ui[b-5sajud6lau] {
        bottom: calc(96px + env(safe-area-inset-bottom, 0px));
    }
}

/*
    Phones: the header must never be wider than the screen. A long e-mail address in the profile
    trigger used to widen the whole page; browsers then zoom out / scroll sideways and the fixed
    bottom bar (anchored to the wide layout viewport) ended up off-screen. The row may shrink, the
    profile name truncates with an ellipsis (the full name stays in the accessible name), and
    overflow-x is clipped on the shell as a safety net (clip, unlike hidden, keeps sticky working).
*/
.hf-shell[b-5sajud6lau] {
    overflow-x: clip;
}

.top-row[b-5sajud6lau],
.user-area[b-5sajud6lau] {
    min-width: 0;
}

.top-row .brand[b-5sajud6lau] {
    flex: none;
}

.profile-trigger[b-5sajud6lau] {
    max-width: 100%;
    min-width: 0;
}

.profile-trigger span[b-5sajud6lau] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 1023.98px) {
    .top-row[b-5sajud6lau] {
        gap: var(--space-2);
        padding: 0 var(--space-3);
    }

    .profile-trigger span[b-5sajud6lau] {
        max-width: 7.5rem;
    }
}
/* /Components/Pages/Members/MemberActivityOverview.razor.rz.scp.css */
/*
    The frozen columns (.ui-col-frozen and .ui-col-frozen-right) are defined once in
    wwwroot/css/heifit-app.css. Nothing page-specific is left in this file.
*/
/* /Components/Pages/Members/MyReservations.razor.rz.scp.css */
/*
    The frozen columns (.ui-col-frozen and .ui-col-frozen-right) are defined once in
    wwwroot/css/heifit-app.css. Nothing page-specific is left in this file.
*/