/* /Components/Layout/AdminLayout.razor.rz.scp.css */
.fd-admin-shell[b-68o0shr12h] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: var(--fd-color-surface-alt);
    color: var(--fd-color-text);
}

.fd-admin-shell__header[b-68o0shr12h] {
    background-color: var(--fd-color-surface);
    border-bottom: 1px solid var(--fd-color-border);
    padding: var(--fd-space-3) var(--fd-space-4);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--fd-space-3);
    min-height: 56px;
    position: sticky;
    top: 0;
    z-index: 200;
}

@media (min-width: 768px) {
    .fd-admin-shell__header[b-68o0shr12h] {
        padding: var(--fd-space-3) var(--fd-space-6);
        min-height: 64px;
    }
}

.fd-admin-shell__header-start[b-68o0shr12h] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-3);
    min-width: 0;
}

/* Hamburger — only visible on mobile (<= 1024px) */
.fd-admin-shell__menu-btn[b-68o0shr12h] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: var(--fd-radius-sm);
    background-color: transparent;
    border: 1px solid var(--fd-color-border);
    color: var(--fd-color-text-muted);
    cursor: pointer;
    flex: 0 0 auto;
    transition: background-color var(--fd-transition-fast),
                color var(--fd-transition-fast);
}

.fd-admin-shell__menu-btn:hover[b-68o0shr12h] {
    background-color: var(--fd-color-cream-100);
    color: var(--fd-color-text);
}

.fd-admin-shell__menu-btn:focus-visible[b-68o0shr12h] {
    outline: 2px solid var(--fd-color-primary-strong);
    outline-offset: 2px;
    box-shadow: var(--fd-input-focus-shadow);
}

@media (min-width: 1024px) {
    .fd-admin-shell__menu-btn[b-68o0shr12h] {
        display: none;
    }
}

.fd-admin-shell__brand[b-68o0shr12h] {
    color: var(--fd-color-text);
    font-family: var(--fd-font-sans);
    font-weight: var(--fd-weight-semibold);
    font-size: var(--fd-text-sm);
    letter-spacing: 0.01em;
    text-decoration: none;
    transition: color var(--fd-transition-fast);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 60vw;
}

.fd-admin-shell__brand:hover[b-68o0shr12h],
.fd-admin-shell__brand:focus-visible[b-68o0shr12h] {
    color: var(--fd-color-primary-strong);
    text-decoration: none;
}

.fd-admin-shell__header-tools[b-68o0shr12h] {
    display: none;
    align-items: center;
    gap: var(--fd-space-2);
}

@media (min-width: 768px) {
    .fd-admin-shell__header-tools[b-68o0shr12h] {
        display: inline-flex;
    }
}

.fd-admin-shell__header-btn[b-68o0shr12h] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: var(--fd-radius-pill);
    background-color: var(--fd-color-surface);
    border: 1px solid var(--fd-color-border);
    color: var(--fd-color-text-muted);
    cursor: default;
    pointer-events: none;
}

.fd-admin-shell__header-dot[b-68o0shr12h] {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--fd-color-accent);
    border: 1.5px solid var(--fd-color-surface);
}

.fd-admin-shell__user[b-68o0shr12h] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-2);
    padding: 0 var(--fd-space-2);
}

.fd-admin-shell__user-avatar[b-68o0shr12h] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: var(--fd-radius-pill);
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
    font-size: var(--fd-text-xs);
    font-weight: var(--fd-weight-bold);
    letter-spacing: 0.05em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.fd-admin-shell__user-meta[b-68o0shr12h] {
    display: none;
    flex-direction: column;
    line-height: 1.15;
}

@media (min-width: 1024px) {
    .fd-admin-shell__user-meta[b-68o0shr12h] {
        display: inline-flex;
    }
}

.fd-admin-shell__user-name[b-68o0shr12h] {
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-text);
}

.fd-admin-shell__user-role[b-68o0shr12h] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--fd-color-text-muted);
    font-weight: var(--fd-weight-medium);
}

/* Drawer overlay — mobile only, behind the nav, above main */
.fd-admin-shell__overlay[b-68o0shr12h] {
    position: fixed;
    inset: 0;
    background-color: rgba(31, 42, 36, 0.45);
    z-index: 299;
    animation: fd-overlay-in-b-68o0shr12h var(--fd-transition-base) ease-out both;
}

@keyframes fd-overlay-in-b-68o0shr12h {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@media (min-width: 1024px) {
    .fd-admin-shell__overlay[b-68o0shr12h] {
        display: none;
    }
}

.fd-admin-shell__body[b-68o0shr12h] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.fd-admin-shell__main[b-68o0shr12h] {
    flex: 1;
    padding: var(--fd-space-4) var(--fd-space-3);
    min-width: 0;
    background-color: var(--fd-color-surface-alt);
}

@media (min-width: 768px) {
    .fd-admin-shell__main[b-68o0shr12h] {
        padding: var(--fd-space-5) var(--fd-space-5);
    }
}

@media (min-width: 1024px) {
    .fd-admin-shell__header[b-68o0shr12h] {
        display: none;
    }

    .fd-admin-shell[b-68o0shr12h] {
        height: 100vh;
        overflow: hidden;
        --fd-admin-header-h: 0px;
        /* slice adm36: header top padding is now space-6 (was space-3) since the scroll container's
           top padding moved here; keep the token in sync so sticky panel-title offsets stay accurate.
           This is the RESTING (generous) header height. */
        --fd-admin-page-header-h: calc(var(--fd-space-6) + var(--fd-space-3) + 2.5rem);
        /* slice adm37: the CONDENSED (slim-on-scroll) header height. When scrolled, the header
           pins as a compact bar: padding-block space-3/space-3 around a single ~1.75rem (text-lg
           line @ leading-tight) title row. This is the height that jump-to-section anchors must
           clear, because the header is condensed whenever the container is scrolled. */
        --fd-admin-page-header-h-condensed: calc(var(--fd-space-3) + var(--fd-space-3) + 1.75rem);
        /* Sticky offsets target the condensed bar (the state the header is actually in once scrolled). */
        --fd-admin-sticky-offset: calc(var(--fd-admin-page-header-h-condensed) + var(--fd-space-3));
    }

    .fd-admin-shell__body[b-68o0shr12h] {
        flex-direction: row;
        align-items: stretch;
        min-height: 0;
        overflow: hidden;
        height: 100vh;
    }

    [b-68o0shr12h] .fd-admin-side-nav {
        flex: 0 0 16rem;
        width: 16rem;
        max-width: 16rem;
    }

    .fd-admin-shell__main[b-68o0shr12h] {
        flex: 1 1 auto;
        /* slice adm36: padding-top is 0 so the sticky page header pins flush to the true top of the
           scroll container. With a top padding, content scrolled into that strip showed ABOVE the
           sticky header (it sticks at the padding edge) — the "peek" on scroll. The resting top air
           is now provided by the page header's own padding-block-start instead. */
        padding: 0 var(--fd-space-6) var(--fd-space-6);
        /* slice adm38: kill the slim-on-scroll JITTER ("rebeg"). The sticky page header is in-flow
           at the top of THIS scroll container and animates its own height via a scroll-timeline
           (admin.css fd-admin-page-header-condense). Every height change shifts the content below;
           the browser's scroll anchoring (overflow-anchor: auto) then re-adjusts scrollTop to keep
           the anchored content stable → that shifts the scroll-timeline progress → the header
           re-resizes → feedback oscillation, worst in the 0–96px condense zone (esp. scrolling up).
           Disabling scroll anchoring on the scroll container breaks that loop: the condense becomes
           a pure function of scrollTop with no compensating scrollTop adjustment. */
        overflow-anchor: none;
        overflow-y: auto;
        scrollbar-gutter: stable;
        overscroll-behavior-y: contain;
        overscroll-behavior-x: none;
        scrollbar-width: thin;
        scrollbar-color: transparent transparent;
        /* slice adm34: explicit scroll-padding-top reinforces the sticky offset so keyboard/jump anchors clear the
           page-header + a space-2 breathing buffer; falls back to the same offset token used elsewhere. */
        scroll-padding-top: calc(var(--fd-admin-sticky-offset, calc(var(--fd-admin-header-h) + var(--fd-admin-page-header-h) + var(--fd-space-3))) + var(--fd-space-2));
        scroll-padding-bottom: var(--fd-space-5);
        scroll-behavior: smooth;
        /* slice adm36: removed the top/bottom `mask-image` fade and `scroll-snap-type`.
           The top fade made content near the top edge transparent — it "peeked/floated"
           above the sticky page header, and a CSS mask on a scroll container also breaks the
           sticky positioning of a child (the header appeared to drift up on scroll). A clean
           opaque scroll with no mask is the modern admin pattern (Linear / Notion / Stripe).
           scroll-snap proximity on a long dashboard added noise without benefit; dropped. */
    }

    /* slice 24 */
    .fd-admin-shell__main:hover[b-68o0shr12h],
    .fd-admin-shell__main:focus-within[b-68o0shr12h] {
        scrollbar-color: var(--fd-color-border) transparent;
    }
}

@media (prefers-reduced-motion: reduce) {
    .fd-admin-shell__main[b-68o0shr12h],
    .fd-admin-side-nav[b-68o0shr12h] {
        scroll-behavior: auto !important;
    }
}

@media (min-width: 1280px) {
    [b-68o0shr12h] .fd-admin-side-nav {
        flex-basis: 17rem;
        width: 17rem;
        max-width: 17rem;
    }

    .fd-admin-shell__main[b-68o0shr12h] {
        scrollbar-gutter: stable both-edges;
    }
}

/* slice adm34: ultrawide rail — extra horizontal headroom keeps long labels on a single line. */
@media (min-width: 1536px) {
    [b-68o0shr12h] .fd-admin-side-nav {
        flex-basis: 18rem;
        width: 18rem;
        max-width: 18rem;
    }
}

/* === Ergonomic Refinements: scroll-affordance & rhythm === */
@media (min-width: 1024px) {
    /* P1: low-opacity resting scrollbar thumb on the main scroll container.
       Extends the existing :hover/:focus-within rule (which lifts the thumb to the
       full border token) by providing a faint resting state instead of fully transparent. */
    .fd-admin-shell__main[b-68o0shr12h] {
        scrollbar-color: color-mix(in srgb, var(--fd-color-border) 35%, transparent) transparent;
    }

    /* P4 (slice adm37): the scroll-driven depth cue is now folded into the slim-on-scroll
       condense animation in admin.css (`fd-admin-page-header-condense`), so the header's
       box-shadow strengthens as part of the same scroll timeline that condenses it. The
       scoped duplicate here was removed — it would have overridden the consolidated
       animation shorthand, and scoped CSS doesn't reliably reach the child-rendered
       AdminPageHeader anyway. */
}

/* ===== Search bar ===== */
.fd-admin-shell__search[b-68o0shr12h] {
    display: none;
    align-items: center;
    gap: var(--fd-space-2);
    flex: 1 1 auto;
    max-width: 22rem;
    margin: 0 var(--fd-space-4);
    padding: var(--fd-space-1) var(--fd-space-3);
    background-color: var(--fd-color-surface-alt);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-md);
}

@media (min-width: 768px) {
    .fd-admin-shell__search[b-68o0shr12h] {
        display: flex;
    }
}

.fd-admin-shell__search-icon[b-68o0shr12h] {
    flex: 0 0 auto;
    color: var(--fd-color-text-muted);
    width: 1rem;
    height: 1rem;
}

.fd-admin-shell__search-input[b-68o0shr12h] {
    flex: 1 1 auto;
    min-width: 0;
    border: none;
    background: transparent;
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text-muted);
    outline: none;
    padding: 0;
    cursor: default;
}

.fd-admin-shell__search-input[b-68o0shr12h]::placeholder {
    color: var(--fd-color-text-muted);
}

/* ===== User dropdown ===== */
.fd-admin-shell__user[b-68o0shr12h] {
    position: relative;
}

.fd-admin-shell__user-btn[b-68o0shr12h] {
    appearance: none;
    background: none;
    border: none;
    margin: 0;
    font-family: inherit;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-2);
    padding: var(--fd-space-1) var(--fd-space-2);
    border-radius: var(--fd-radius-md);
    color: inherit;
    transition: background-color var(--fd-transition-fast);
}

.fd-admin-shell__user-btn:hover[b-68o0shr12h] {
    background-color: var(--fd-color-cream-100);
}

.fd-admin-shell__user-btn:focus-visible[b-68o0shr12h] {
    outline: 2px solid var(--fd-color-primary-strong);
    outline-offset: 2px;
}

.fd-admin-shell__user-chevron[b-68o0shr12h] {
    color: var(--fd-color-text-muted);
    width: 1rem;
    height: 1rem;
    transition: transform var(--fd-transition-fast);
}

.fd-admin-shell__user--open .fd-admin-shell__user-chevron[b-68o0shr12h] {
    transform: rotate(180deg);
}

.fd-admin-shell__user-menu[b-68o0shr12h] {
    position: absolute;
    top: calc(100% + var(--fd-space-2));
    right: 0;
    min-width: 10rem;
    background-color: var(--fd-color-surface);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-md);
    box-shadow: var(--fd-shadow-md);
    z-index: 400;
    padding: var(--fd-space-1);
}

.fd-admin-shell__user-menu-item[b-68o0shr12h] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-2);
    padding: var(--fd-space-2) var(--fd-space-3);
    border-radius: var(--fd-radius-sm);
    color: var(--fd-color-text-muted);
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-medium);
    text-decoration: none;
    transition: background-color var(--fd-transition-fast),
                color var(--fd-transition-fast);
}

.fd-admin-shell__user-menu-item:hover[b-68o0shr12h] {
    background-color: var(--fd-color-cream-50);
    color: var(--fd-color-text);
    text-decoration: none;
}

.fd-admin-shell__user-menu-item:focus-visible[b-68o0shr12h] {
    outline: 2px solid var(--fd-color-primary-strong);
    outline-offset: -2px;
    background-color: var(--fd-color-cream-50);
    color: var(--fd-color-text);
    text-decoration: none;
}

/* ===== Blazor error UI ===== */
#blazor-error-ui[b-68o0shr12h] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-68o0shr12h] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Pages/About.razor.rz.scp.css */
.fd-about-hero-section[b-muegpgmm6s] {
    padding-top: var(--fd-space-5);
}

.fd-about-hero[b-muegpgmm6s] {
    display: grid;
    gap: var(--fd-space-5);
}

.fd-about-hero__visual[b-muegpgmm6s] {
    position: relative;
    border-radius: var(--fd-radius-lg);
    overflow: hidden;
    min-height: 320px;
    /* Meleg, márka-hangolású fallback: ha a fotó nem töltődik be, akkor is
       szándékosnak tűnik a vizuál (nem üres, tört kép). */
    background-color: var(--fd-color-cream-100);
    background-image: linear-gradient(135deg, var(--fd-color-green-100), var(--fd-color-cream-100));
    border: 1px solid var(--fd-color-border);
    box-shadow: var(--fd-shadow-md);
}

.fd-about-hero__visual img[b-muegpgmm6s] {
    width: 100%;
    height: 100%;
    min-height: 320px;
    object-fit: cover;
}

.fd-about-hero__visual-card[b-muegpgmm6s] {
    position: absolute;
    left: var(--fd-space-4);
    right: var(--fd-space-4);
    bottom: var(--fd-space-4);
    display: grid;
    gap: var(--fd-space-2);
    padding: var(--fd-space-4);
    border-radius: var(--fd-radius-md);
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.85);
}

.fd-about-hero__visual-label[b-muegpgmm6s] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-accent-strong);
}

.fd-about-hero__copy[b-muegpgmm6s] {
    display: grid;
    gap: var(--fd-space-4);
    align-content: center;
}

.fd-about-hero__eyebrow[b-muegpgmm6s] {
    display: inline-flex;
    align-items: center;
    justify-self: flex-start;
    padding: var(--fd-space-2) var(--fd-space-4);
    border-radius: var(--fd-radius-pill);
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.fd-about-hero__title[b-muegpgmm6s] {
    margin: 0;
}

.fd-about-hero__lead[b-muegpgmm6s] {
    margin: 0;
    color: var(--fd-color-ink-700);
    font-size: var(--fd-text-lg);
}

.fd-about-hero__actions[b-muegpgmm6s] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fd-space-3);
}

.fd-about-narrative[b-muegpgmm6s] {
    max-width: 68ch;
    margin-inline: auto;
    line-height: var(--fd-leading-normal);
}

.fd-about-narrative h2[b-muegpgmm6s] {
    margin-top: var(--fd-space-6);
    margin-bottom: var(--fd-space-3);
}

.fd-about-narrative h2:first-child[b-muegpgmm6s] {
    margin-top: 0;
}

.fd-about-narrative p[b-muegpgmm6s] {
    margin: 0 0 var(--fd-space-4);
    color: var(--fd-color-ink-700);
}

.fd-about-stats[b-muegpgmm6s] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--fd-space-4);
}

/* Sötétzöld StatCard háttér + fehér érték az About oldalon. ::deep szükséges,
   mert a StatCard belső CSS isolation alá esik. */
.fd-about-stats[b-muegpgmm6s]  .fd-stat-card {
    background-color: var(--fd-color-primary-strong);
    border-color: var(--fd-color-primary-strong);
    color: #fff;
}

.fd-about-stats[b-muegpgmm6s]  .fd-stat-card__value {
    color: #fff;
}

.fd-about-stats[b-muegpgmm6s]  .fd-stat-card__label {
    color: rgba(255, 255, 255, 0.9);
}

/* Alcím — "Szia, Fanni vagyok!" emelés. */
.fd-about-hero__intro-name[b-muegpgmm6s] {
    margin: 0;
    font-family: var(--fd-font-display);
    font-size: var(--fd-text-xl);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-primary-strong);
    font-style: italic;
}

@media (min-width: 600px) {
    .fd-about-stats[b-muegpgmm6s] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 768px) {
    .fd-about-hero[b-muegpgmm6s] {
        grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
        align-items: center;
    }
}

@media (min-width: 1024px) {
    .fd-about-hero[b-muegpgmm6s] {
        grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
        gap: var(--fd-space-7);
    }

    .fd-about-hero-section[b-muegpgmm6s] {
        padding-top: var(--fd-space-6);
    }

    .fd-about-hero__visual[b-muegpgmm6s] {
        min-height: 520px;
    }

    .fd-about-stats[b-muegpgmm6s] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
/* /Components/Pages/Admin/AdminForgotPassword.razor.rz.scp.css */
/* Admin forgot/reset — minimal scoped styles, EmptyLayout (no admin chrome). */

.fd-admin-auth[b-ogn618mbzq] {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--fd-space-5) var(--fd-space-4);
    background-color: #dbeefb;
    background-image: linear-gradient(180deg, #cfe8f7 0%, #e6f2fa 45%, #f5fbff 100%);
}

.fd-admin-auth__card[b-ogn618mbzq] {
    width: 100%;
    max-width: 440px;
    background-color: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 20px;
    box-shadow:
        0 1px 2px rgba(15, 38, 63, 0.04),
        0 8px 24px rgba(15, 38, 63, 0.08);
    padding: 32px;
}

.fd-admin-auth__header[b-ogn618mbzq] {
    text-align: center;
    margin-bottom: var(--fd-space-5);
}

.fd-admin-auth__eyebrow[b-ogn618mbzq] {
    display: block;
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--fd-color-text-muted);
    font-weight: var(--fd-weight-medium);
    margin-bottom: var(--fd-space-2);
}

.fd-admin-auth__title[b-ogn618mbzq] {
    margin: 0 0 var(--fd-space-2);
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-2xl);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-text);
}

.fd-admin-auth__lead[b-ogn618mbzq] {
    margin: 0;
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text-muted);
}

.fd-admin-auth__form[b-ogn618mbzq] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
}

.fd-admin-auth__field[b-ogn618mbzq] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.fd-admin-auth__label[b-ogn618mbzq] {
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-medium);
    color: var(--fd-color-ink-700);
}

[b-ogn618mbzq] .fd-admin-auth__input {
    display: block;
    width: 100%;
    min-height: 48px;
    padding: 12px 14px;
    border: 1.5px solid #c8dccd;
    border-radius: 10px;
    background-color: #fbfdfa;
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-base);
    box-sizing: border-box;
}

[b-ogn618mbzq] .fd-admin-auth__input:focus,
[b-ogn618mbzq] .fd-admin-auth__input:focus-visible {
    outline: none;
    border-color: var(--fd-color-primary);
    background-color: #ffffff;
    box-shadow: 0 0 0 4px rgba(61, 122, 42, 0.18);
}

.fd-admin-auth__error[b-ogn618mbzq] {
    font-size: var(--fd-text-xs);
    color: var(--fd-color-accent-strong);
}

.fd-admin-auth__alert[b-ogn618mbzq] {
    padding: var(--fd-space-3) var(--fd-space-4);
    border-radius: var(--fd-radius-md);
    border: 1px solid rgba(229, 62, 62, 0.20);
    border-left: 4px solid #e53e3e;
    background-color: #fff5f5;
    color: var(--fd-color-accent-strong);
    font-size: var(--fd-text-sm);
}

.fd-admin-auth__alert p[b-ogn618mbzq] {
    margin: 0 0 var(--fd-space-2);
}

.fd-admin-auth__alert ul[b-ogn618mbzq] {
    margin: 0;
    padding-left: var(--fd-space-4);
}

.fd-admin-auth__notice[b-ogn618mbzq] {
    padding: var(--fd-space-4);
    border-radius: var(--fd-radius-md);
    background-color: #f0f9ff;
    border: 1px solid rgba(29, 99, 209, 0.18);
    color: var(--fd-color-text);
    font-size: var(--fd-text-sm);
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
    align-items: flex-start;
}

.fd-admin-auth__notice--success[b-ogn618mbzq] {
    background-color: #f0fdf4;
    border-color: rgba(34, 139, 34, 0.22);
}

.fd-admin-auth__notice p[b-ogn618mbzq] {
    margin: 0;
}

.fd-admin-auth__submit[b-ogn618mbzq] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 48px;
    padding: 12px 18px;
    border: 1px solid #0b0f17;
    border-radius: 12px;
    background: linear-gradient(180deg, #2a2f3a 0%, #15181f 100%);
    color: #ffffff;
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-base);
    font-weight: var(--fd-weight-semibold);
    cursor: pointer;
    margin-top: var(--fd-space-2);
}

.fd-admin-auth__submit:disabled[b-ogn618mbzq],
.fd-admin-auth__submit[disabled][b-ogn618mbzq] {
    opacity: 0.6;
    cursor: not-allowed;
}

.fd-admin-auth__footer-row[b-ogn618mbzq] {
    margin-top: var(--fd-space-2);
    text-align: center;
}

.fd-admin-auth__back-link[b-ogn618mbzq] {
    font-size: var(--fd-text-sm);
    color: var(--fd-color-ink-700);
    text-decoration: none;
}

.fd-admin-auth__back-link:hover[b-ogn618mbzq] {
    text-decoration: underline;
    text-underline-offset: 3px;
}
/* /Components/Pages/Admin/AdminLogin.razor.rz.scp.css */
/* Admin login — scoped styles (EmptyLayout, no .fd-admin-page wrapper) */

/* ---- Viewport wrapper ---- */
.fd-admin-login[b-y71a9vgpxy] {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--fd-space-5) var(--fd-space-4);
    background-color: #dbeefb;
    background-image:
        linear-gradient(180deg, #cfe8f7 0%, #e6f2fa 45%, #f5fbff 100%),
        radial-gradient(ellipse 70% 40% at 50% 95%, rgba(255,255,255,0.85) 0%, transparent 65%);
    background-blend-mode: normal, screen;
}

/* ---- Card ---- */
.fd-admin-login__card[b-y71a9vgpxy] {
    width: 100%;
    max-width: 440px;
    background-color: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.85);
    border-radius: 20px;
    box-shadow:
        0 1px 2px rgba(15, 38, 63, 0.04),
        0 8px 24px rgba(15, 38, 63, 0.08),
        0 24px 56px rgba(15, 38, 63, 0.10);
    padding: 32px;
}

@media (min-width: 480px) {
    .fd-admin-login__card[b-y71a9vgpxy] {
        padding: 48px;
    }
}

/* ---- Brand mark ---- */
.fd-admin-login__brand[b-y71a9vgpxy] {
    display: flex;
    justify-content: center;
    margin-bottom: var(--fd-space-6);
}

.fd-admin-login__brand-mark[b-y71a9vgpxy] {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* The brand logo is a self-contained badge (its own ring) on a transparent
   background — show it directly, no coloured box behind it. */
.fd-admin-login__brand-img[b-y71a9vgpxy] {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* ---- Header ---- */
.fd-admin-login__header[b-y71a9vgpxy] {
    text-align: center;
    margin-bottom: var(--fd-space-6);
}

.fd-admin-login__eyebrow[b-y71a9vgpxy] {
    display: block;
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--fd-color-text-muted);
    font-weight: var(--fd-weight-medium);
    margin-bottom: var(--fd-space-2);
}

.fd-admin-login__title[b-y71a9vgpxy] {
    margin: 0 0 var(--fd-space-2);
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-2xl);
    font-weight: var(--fd-weight-semibold);
    letter-spacing: -0.025em;
    color: var(--fd-color-text);
    line-height: var(--fd-leading-tight);
}

.fd-admin-login__lead[b-y71a9vgpxy] {
    margin: 0;
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text-muted);
    line-height: var(--fd-leading-normal);
}

/* ---- Form ---- */
.fd-admin-login__form[b-y71a9vgpxy] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
}

/* ---- Field ---- */
.fd-admin-login__field[b-y71a9vgpxy] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.fd-admin-login__field + .fd-admin-login__field[b-y71a9vgpxy] {
    margin-top: var(--fd-space-1);
}

.fd-admin-login__label[b-y71a9vgpxy] {
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-medium);
    color: var(--fd-color-ink-700);
    line-height: 1;
}

/* ---- Input wrapper ---- */
.fd-admin-login__input-wrap[b-y71a9vgpxy] {
    position: relative;
    display: block;
}

.fd-admin-login__input-icon[b-y71a9vgpxy] {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: #8a9591;
    transition: color 160ms ease;
}

.fd-admin-login__input-icon--left[b-y71a9vgpxy] {
    left: 14px;
}

.fd-admin-login__input-wrap:focus-within .fd-admin-login__input-icon[b-y71a9vgpxy] {
    color: #276749;
}

/* ---- Eye toggle ---- */
.fd-admin-login__eye-toggle[b-y71a9vgpxy] {
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    border-radius: 8px;
    color: #8a9591;
    cursor: pointer;
    padding: 0;
    transition:
        background-color 160ms ease,
        color 160ms ease;
}

.fd-admin-login__eye-toggle:hover[b-y71a9vgpxy] {
    background: rgba(39, 103, 73, 0.06);
    color: #276749;
}

.fd-admin-login__eye-toggle:focus-visible[b-y71a9vgpxy] {
    outline: 2px solid #1d63d1;
    outline-offset: 2px;
}

/* ---- Input ---- */
[b-y71a9vgpxy] .fd-admin-login__input {
    display: block;
    width: 100%;
    min-height: 52px;
    padding: 14px 16px;
    border: 1.5px solid #c8dccd;
    border-radius: 10px;
    background-color: #fbfdfa;
    color: var(--fd-color-text);
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-base);
    line-height: 1.4;
    box-shadow: 0 1px 2px rgba(31, 42, 36, 0.04);
    transition:
        border-color var(--fd-transition-fast),
        box-shadow var(--fd-transition-fast),
        background-color var(--fd-transition-fast);
    box-sizing: border-box;
}

[b-y71a9vgpxy] .fd-admin-login__input:hover {
    border-color: #8fb89a;
    background-color: #ffffff;
    box-shadow:
        0 1px 2px rgba(31, 42, 36, 0.04),
        0 2px 8px rgba(61, 122, 42, 0.08);
}

[b-y71a9vgpxy] .fd-admin-login__input:focus,
[b-y71a9vgpxy] .fd-admin-login__input:focus-visible {
    outline: none;
    border-color: var(--fd-color-primary);
    background-color: #ffffff;
    box-shadow:
        0 0 0 1px #ffffff,
        0 0 0 4px rgba(61, 122, 42, 0.18),
        0 0 0 5px rgba(61, 122, 42, 0.08);
}

[b-y71a9vgpxy] .fd-admin-login__input--has-left-icon {
    padding: 14px 16px 14px 44px;
}

[b-y71a9vgpxy] .fd-admin-login__input--has-icons {
    padding: 14px 44px 14px 44px;
}

/* ---- Placeholder hierarchy ---- */
[b-y71a9vgpxy] .fd-admin-login__input::placeholder {
    color: #8a9591;
    opacity: 1;
}

/* Blazor validation: invalid class on input */
[b-y71a9vgpxy] .fd-admin-login__input.invalid,
.fd-admin-login__input[aria-invalid='true'][b-y71a9vgpxy] {
    border-color: var(--fd-color-accent-strong);
}

[b-y71a9vgpxy] .fd-admin-login__input.invalid:focus,
.fd-admin-login__input[aria-invalid='true']:focus[b-y71a9vgpxy] {
    box-shadow: var(--fd-input-focus-shadow-error);
}

/* ---- Validation error ---- */
.fd-admin-login__error[b-y71a9vgpxy] {
    font-size: var(--fd-text-xs);
    color: var(--fd-color-accent-strong);
    line-height: var(--fd-leading-snug);
}

/* ---- Remember me ---- */
.fd-admin-login__remember[b-y71a9vgpxy] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-2);
    cursor: pointer;
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text-muted);
    user-select: none;
}

[b-y71a9vgpxy] .fd-admin-login__remember input[type='checkbox'] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    cursor: pointer;
    accent-color: var(--fd-color-primary);
    /* iOS zoom-on-focus guard (m2): a sub-16px effective font-size makes mobile Safari auto-zoom
       when the checkbox is focused. Pin to 16px; the box size is fixed above, so no visual change. */
    font-size: 16px;
}

/* ---- Error alert ---- */
.fd-admin-login__alert[b-y71a9vgpxy] {
    display: flex;
    align-items: flex-start;
    gap: var(--fd-space-2);
    padding: var(--fd-space-3) var(--fd-space-4);
    border-radius: var(--fd-radius-md);
    border: 1px solid rgba(229, 62, 62, 0.20);
    border-left: 4px solid #e53e3e;
    background-color: #fff5f5;
    color: var(--fd-color-accent-strong);
    font-size: var(--fd-text-sm);
    line-height: var(--fd-leading-normal);
}

.fd-admin-login__alert-icon[b-y71a9vgpxy] {
    flex-shrink: 0;
    margin-top: 1px;
    color: var(--fd-color-accent-strong);
}

/* ---- Submit button ---- */
.fd-admin-login__submit[b-y71a9vgpxy] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--fd-space-2);
    width: 100%;
    min-height: 48px;
    padding: 14px 20px;
    border: 1px solid #0b0f17;
    border-radius: 12px;
    background: linear-gradient(180deg, #2a2f3a 0%, #15181f 100%);
    color: #ffffff;
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-base);
    font-weight: var(--fd-weight-semibold);
    line-height: 1.2;
    letter-spacing: 0.01em;
    cursor: pointer;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 6px 16px rgba(15, 24, 40, 0.22);
    transition:
        background-color var(--fd-transition-fast),
        box-shadow var(--fd-transition-fast),
        transform var(--fd-transition-fast);
    margin-top: var(--fd-space-2);
}

.fd-admin-login__submit:hover:not(:disabled)[b-y71a9vgpxy] {
    background: linear-gradient(180deg, #343a47 0%, #1b1f28 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.10),
        0 10px 24px rgba(15, 24, 40, 0.28);
    transform: translateY(-1px);
}

.fd-admin-login__submit:active:not(:disabled)[b-y71a9vgpxy] {
    transform: translateY(0);
    background: linear-gradient(180deg, #1b1f28 0%, #0f131a 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 3px 8px rgba(15, 24, 40, 0.24);
}

.fd-admin-login__submit:focus-visible[b-y71a9vgpxy] {
    outline: 2px solid #1d63d1;
    outline-offset: 2px;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 0 0 4px rgba(29, 99, 209, 0.22);
}

.fd-admin-login__submit:disabled[b-y71a9vgpxy],
.fd-admin-login__submit[disabled][b-y71a9vgpxy] {
    background: #2a2f3a;
    color: rgba(255, 255, 255, 0.65);
    opacity: 0.7;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

/* ---- Remember + forgot row ---- */
.fd-admin-login__row[b-y71a9vgpxy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--fd-space-2);
    margin-top: var(--fd-space-1);
}

/* ---- Forgot password ---- */
.fd-admin-login__forgot[b-y71a9vgpxy] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    column-gap: var(--fd-space-2);
    row-gap: var(--fd-space-1);
}

/* Visual separator between the two helper links so they never run together when they sit on one
   line (the dot is suppressed on mobile, where they stack — see the mobile block below). */
.fd-admin-login__forgot-link + .fd-admin-login__forgot-link[b-y71a9vgpxy]::before {
    content: "·";
    margin-inline-end: var(--fd-space-2);
    color: var(--fd-color-ink-300);
}

.fd-admin-login__forgot-link[b-y71a9vgpxy] {
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-medium);
    color: var(--fd-color-ink-700);
    text-decoration: none;
    border-radius: 4px;
    padding: 2px 4px;
    transition: color var(--fd-transition-fast);
}

.fd-admin-login__forgot-link:hover[b-y71a9vgpxy] {
    color: #15181f;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.fd-admin-login__forgot-link:focus-visible[b-y71a9vgpxy] {
    outline: 2px solid #1d63d1;
    outline-offset: 2px;
    text-decoration: none;
}

/* ---- Divider ---- */
.fd-admin-login__divider[b-y71a9vgpxy] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: var(--fd-space-4) 0 var(--fd-space-3);
}

.fd-admin-login__divider[b-y71a9vgpxy]::before,
.fd-admin-login__divider[b-y71a9vgpxy]::after {
    content: '';
    flex: 1;
    border-top: 1.5px dotted rgba(15, 24, 40, 0.22);
}

.fd-admin-login__divider-text[b-y71a9vgpxy] {
    padding: 0 var(--fd-space-3);
    font-size: var(--fd-text-xs);
    letter-spacing: 0.02em;
    color: var(--fd-color-text-muted);
}

/* ---- Social buttons ---- */
.fd-admin-login__socials[b-y71a9vgpxy] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--fd-space-3);
}

.fd-admin-login__social[b-y71a9vgpxy] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 10px 12px;
    border: 1px solid rgba(15, 24, 40, 0.10);
    border-radius: 12px;
    background-color: #ffffff;
    cursor: pointer;
    box-shadow:
        0 1px 2px rgba(15, 24, 40, 0.04),
        0 2px 8px rgba(15, 24, 40, 0.04);
    transition:
        border-color var(--fd-transition-fast),
        box-shadow var(--fd-transition-fast),
        transform var(--fd-transition-fast),
        background-color var(--fd-transition-fast);
}

.fd-admin-login__social:hover:not(:disabled)[b-y71a9vgpxy] {
    border-color: rgba(15, 24, 40, 0.20);
    box-shadow:
        0 2px 4px rgba(15, 24, 40, 0.06),
        0 6px 16px rgba(15, 24, 40, 0.10);
    transform: translateY(-1px);
}

.fd-admin-login__social:active:not(:disabled)[b-y71a9vgpxy] {
    transform: translateY(0);
    background-color: #f7f9fc;
}

.fd-admin-login__social:focus-visible[b-y71a9vgpxy] {
    outline: 2px solid #1d63d1;
    outline-offset: 2px;
}

.fd-admin-login__social:disabled[b-y71a9vgpxy],
.fd-admin-login__social[disabled][b-y71a9vgpxy] {
    opacity: 0.65;
    cursor: not-allowed;
    transform: none;
}

.fd-admin-login__social-icon[b-y71a9vgpxy] {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

/* ---- Mobile (max-width: 479px) ---- */
@media (max-width: 479px) {
    .fd-admin-login[b-y71a9vgpxy] {
        padding: var(--fd-space-4) var(--fd-space-3);
        align-items: stretch;
    }

    .fd-admin-login__card[b-y71a9vgpxy] {
        padding: var(--fd-space-5);
        border-radius: 16px;
        max-width: 100%;
    }

    .fd-admin-login__brand[b-y71a9vgpxy] {
        margin-bottom: var(--fd-space-4);
    }

    .fd-admin-login__brand-mark[b-y71a9vgpxy] {
        width: 52px;
        height: 52px;
        border-radius: 14px;
    }

    .fd-admin-login__header[b-y71a9vgpxy] {
        margin-bottom: var(--fd-space-5);
    }

    .fd-admin-login__title[b-y71a9vgpxy] {
        font-size: var(--fd-text-xl);
    }

    .fd-admin-login__form[b-y71a9vgpxy] {
        gap: var(--fd-space-3);
    }

    [b-y71a9vgpxy] .fd-admin-login__input {
        font-size: 16px;
        min-height: 50px;
    }

    [b-y71a9vgpxy] .fd-admin-login__input--has-icons {
        padding-right: 52px;
    }

    .fd-admin-login__eye-toggle[b-y71a9vgpxy] {
        width: 40px;
        height: 40px;
        right: 6px;
    }

    .fd-admin-login__row[b-y71a9vgpxy] {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: var(--fd-space-2);
        row-gap: var(--fd-space-2);
    }

    /* On mobile the remember/forgot row wraps; stack the two helper links vertically (each on its
       own line, right-aligned) with clear spacing so they never run together. The inline dot
       separator is suppressed here since the links no longer share a line. */
    .fd-admin-login__forgot[b-y71a9vgpxy] {
        margin-top: 0;
        margin-bottom: 0;
        flex-direction: column;
        align-items: flex-end;
        row-gap: var(--fd-space-1);
    }

    .fd-admin-login__forgot-link + .fd-admin-login__forgot-link[b-y71a9vgpxy]::before {
        content: none;
    }

    .fd-admin-login__remember[b-y71a9vgpxy] {
        min-height: 44px;
        padding: 4px 0;
    }

    .fd-admin-login__forgot-link[b-y71a9vgpxy] {
        padding: 10px 8px;
        margin: -10px -8px;
    }

    .fd-admin-login__submit[b-y71a9vgpxy] {
        min-height: 52px;
    }

    .fd-admin-login__socials[b-y71a9vgpxy] {
        gap: var(--fd-space-2);
    }

    .fd-admin-login__social[b-y71a9vgpxy] {
        min-height: 44px;
    }

    .fd-admin-login__title[b-y71a9vgpxy] {
        overflow-wrap: anywhere;
    }
}

@media (max-width: 380px) {
    .fd-admin-login[b-y71a9vgpxy] {
        padding: var(--fd-space-3);
    }

    .fd-admin-login__card[b-y71a9vgpxy] {
        padding: var(--fd-space-4);
    }

    .fd-admin-login__socials[b-y71a9vgpxy] { gap: 6px; }

    .fd-admin-login__social[b-y71a9vgpxy] { min-height: 44px; padding: 8px 10px; }
}

/* ---- Loading spinner ---- */
.fd-admin-login__spinner[b-y71a9vgpxy] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: #fff;
    border-radius: 50%;
    animation: fd-login-spin-b-y71a9vgpxy 0.7s linear infinite;
    flex-shrink: 0;
}

@keyframes fd-login-spin-b-y71a9vgpxy {
    to { transform: rotate(360deg); }
}

/* ---- Footer note ---- */
.fd-admin-login__footer[b-y71a9vgpxy] {
    margin-top: var(--fd-space-6);
    padding-top: var(--fd-space-4);
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    text-align: center;
    font-size: var(--fd-text-xs);
    color: var(--fd-color-ink-300);
    letter-spacing: 0.02em;
}
/* /Components/Pages/Admin/AdminResetPassword.razor.rz.scp.css */
/* Admin forgot/reset — minimal scoped styles, EmptyLayout (no admin chrome). */

.fd-admin-auth[b-d30rp2at5t] {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--fd-space-5) var(--fd-space-4);
    background-color: #dbeefb;
    background-image: linear-gradient(180deg, #cfe8f7 0%, #e6f2fa 45%, #f5fbff 100%);
}

.fd-admin-auth__card[b-d30rp2at5t] {
    width: 100%;
    max-width: 440px;
    background-color: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 20px;
    box-shadow:
        0 1px 2px rgba(15, 38, 63, 0.04),
        0 8px 24px rgba(15, 38, 63, 0.08);
    padding: 32px;
}

.fd-admin-auth__header[b-d30rp2at5t] {
    text-align: center;
    margin-bottom: var(--fd-space-5);
}

.fd-admin-auth__eyebrow[b-d30rp2at5t] {
    display: block;
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--fd-color-text-muted);
    font-weight: var(--fd-weight-medium);
    margin-bottom: var(--fd-space-2);
}

.fd-admin-auth__title[b-d30rp2at5t] {
    margin: 0 0 var(--fd-space-2);
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-2xl);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-text);
}

.fd-admin-auth__lead[b-d30rp2at5t] {
    margin: 0;
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text-muted);
}

.fd-admin-auth__form[b-d30rp2at5t] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
}

.fd-admin-auth__field[b-d30rp2at5t] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.fd-admin-auth__label[b-d30rp2at5t] {
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-medium);
    color: var(--fd-color-ink-700);
}

[b-d30rp2at5t] .fd-admin-auth__input {
    display: block;
    width: 100%;
    min-height: 48px;
    padding: 12px 14px;
    border: 1.5px solid #c8dccd;
    border-radius: 10px;
    background-color: #fbfdfa;
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-base);
    box-sizing: border-box;
}

[b-d30rp2at5t] .fd-admin-auth__input:focus,
[b-d30rp2at5t] .fd-admin-auth__input:focus-visible {
    outline: none;
    border-color: var(--fd-color-primary);
    background-color: #ffffff;
    box-shadow: 0 0 0 4px rgba(61, 122, 42, 0.18);
}

.fd-admin-auth__error[b-d30rp2at5t] {
    font-size: var(--fd-text-xs);
    color: var(--fd-color-accent-strong);
}

.fd-admin-auth__alert[b-d30rp2at5t] {
    padding: var(--fd-space-3) var(--fd-space-4);
    border-radius: var(--fd-radius-md);
    border: 1px solid rgba(229, 62, 62, 0.20);
    border-left: 4px solid #e53e3e;
    background-color: #fff5f5;
    color: var(--fd-color-accent-strong);
    font-size: var(--fd-text-sm);
}

.fd-admin-auth__alert p[b-d30rp2at5t] {
    margin: 0 0 var(--fd-space-2);
}

.fd-admin-auth__alert ul[b-d30rp2at5t] {
    margin: 0;
    padding-left: var(--fd-space-4);
}

.fd-admin-auth__notice[b-d30rp2at5t] {
    padding: var(--fd-space-4);
    border-radius: var(--fd-radius-md);
    background-color: #f0f9ff;
    border: 1px solid rgba(29, 99, 209, 0.18);
    color: var(--fd-color-text);
    font-size: var(--fd-text-sm);
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
    align-items: flex-start;
}

.fd-admin-auth__notice--success[b-d30rp2at5t] {
    background-color: #f0fdf4;
    border-color: rgba(34, 139, 34, 0.22);
}

.fd-admin-auth__notice p[b-d30rp2at5t] {
    margin: 0;
}

.fd-admin-auth__submit[b-d30rp2at5t] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 48px;
    padding: 12px 18px;
    border: 1px solid #0b0f17;
    border-radius: 12px;
    background: linear-gradient(180deg, #2a2f3a 0%, #15181f 100%);
    color: #ffffff;
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-base);
    font-weight: var(--fd-weight-semibold);
    cursor: pointer;
    margin-top: var(--fd-space-2);
}

.fd-admin-auth__submit:disabled[b-d30rp2at5t],
.fd-admin-auth__submit[disabled][b-d30rp2at5t] {
    opacity: 0.6;
    cursor: not-allowed;
}

.fd-admin-auth__footer-row[b-d30rp2at5t] {
    margin-top: var(--fd-space-2);
    text-align: center;
}

.fd-admin-auth__back-link[b-d30rp2at5t] {
    font-size: var(--fd-text-sm);
    color: var(--fd-color-ink-700);
    text-decoration: none;
}

.fd-admin-auth__back-link:hover[b-d30rp2at5t] {
    text-decoration: underline;
    text-underline-offset: 3px;
}
/* /Components/Pages/Admin/Availability.razor.rz.scp.css */
/* Availability (Foglalási szabályok) — page-specific layout.
   Shared chrome (.fd-input, .fd-button, .fd-field, .fd-admin-panel) comes from the
   global admin.css design system; this file only handles the page-specific bits:
   fieldset/legend tokenization, the weekday grid, and the timeslot row layout.
   slice adm35. */

/* Form is a single vertical stack inside the panel. */
.fd-admin-availability__form[b-dfaqcss2f6] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-5);
}

/* Generic submit-error alert (validation errors render per-field below). */
.fd-admin-availability__alert--error[b-dfaqcss2f6] {
    padding: var(--fd-space-3) var(--fd-space-4);
    border-radius: var(--fd-radius-md);
    font-size: var(--fd-text-sm);
    line-height: var(--fd-leading-normal);
    border-left: 4px solid var(--fd-color-accent-strong);
    background-color: var(--fd-color-error-bg);
    color: var(--fd-color-accent-strong);
}

/* Per-field validation message. */
.fd-admin-availability__field-error[b-dfaqcss2f6] {
    font-size: var(--fd-text-xs);
    color: var(--fd-color-accent-strong);
}

/* Min lead days is a small count — keep it tight, don't let it stretch.
   Ancestor selector raises specificity above the global `.fd-admin-page .fd-input`
   measure-cap (both classes carry the scope attribute, so this wins the cascade). */
.fd-admin-availability .fd-admin-availability__lead-input[b-dfaqcss2f6] {
    max-width: 8rem;
}

/* ---------- Fieldset / legend tokenization ----------
   Replace the browser-default fieldset border with a tokenized card edge. */
.fd-admin-availability__field--weekdays[b-dfaqcss2f6],
.fd-admin-availability__field--slots[b-dfaqcss2f6] {
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-md);
    padding: var(--fd-space-4);
    margin: 0;
}

.fd-admin-availability__field--weekdays legend[b-dfaqcss2f6],
.fd-admin-availability__field--slots legend[b-dfaqcss2f6] {
    padding: 0 var(--fd-space-2);
    margin-left: calc(var(--fd-space-2) * -1);
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-medium);
    color: var(--fd-color-ink-700);
}

/* ---------- Weekday checkboxes ---------- */
.fd-admin-availability__field--weekdays[b-dfaqcss2f6] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
}

.fd-admin-availability__field--weekdays legend + .fd-admin-availability__weekday[b-dfaqcss2f6] {
    margin-top: var(--fd-space-2);
}

.fd-admin-availability__weekday[b-dfaqcss2f6] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-2);
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text);
    cursor: pointer;
}

@media (min-width: 560px) {
    .fd-admin-availability__field--weekdays[b-dfaqcss2f6] {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(7rem, max-content));
        gap: var(--fd-space-3) var(--fd-space-5);
        align-items: center;
    }

    /* legend spans the whole grid so the checkboxes wrap cleanly below it */
    .fd-admin-availability__field--weekdays legend[b-dfaqcss2f6] {
        grid-column: 1 / -1;
    }
}

/* ---------- Timeslots ---------- */
.fd-admin-availability__field--slots[b-dfaqcss2f6] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
}

.fd-admin-availability__slots-empty[b-dfaqcss2f6] {
    margin: 0;
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text-muted);
}

.fd-admin-availability__slot-list[b-dfaqcss2f6] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
}

.fd-admin-availability__slot[b-dfaqcss2f6] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-3);
}

/* A timeslot is just "09:00-10:00" — it needs ~10rem, not the full row.
   Ancestor selector raises specificity above the global `.fd-admin-page .fd-input`. */
.fd-admin-availability .fd-admin-availability__slot-input[b-dfaqcss2f6] {
    max-width: 10rem;
    flex: 0 0 auto;
}

/* The add button is a self-contained action — don't let it stretch full width. */
.fd-admin-availability__slot-add[b-dfaqcss2f6] {
    align-self: flex-start;
}

/* ---------- Actions ---------- */
.fd-admin-availability__actions[b-dfaqcss2f6] {
    display: flex;
    gap: var(--fd-space-3);
    align-items: center;
    margin-top: var(--fd-space-2);
    padding-top: var(--fd-space-4);
    border-top: 1px solid var(--fd-color-border);
}
/* /Components/Pages/Admin/Bookings.razor.rz.scp.css */
/* Bookings page-scoped styles (slice adm41).
   The results now live in a single flush card (.fd-admin-panel--flush) that reuses the shared
   .fd-admin-table-card__header strip (title + search + result count) and a light-head table —
   mirroring the dashboard recent-recipes card. The shared look + the flush-card filter-empty
   override live in admin.css; only genuinely page-scoped tweaks belong here.

   Inside the flush card the table-wrap must NOT add its own rounded corners (the card already
   clips to its radius via overflow:clip), otherwise the light-head thead's rounded top corners
   would peek a hairline against the header divider. */
.fd-admin-bookings__results-card .fd-admin-bookings__table-wrap[b-4npoqa4nlm] {
    border-radius: 0;
}

/* The whole booking row is clickable → opens the read-only detail modal. The eye-icon button in
   the trailing actions column is the visible affordance and the keyboard/screen-reader trigger
   (a clickable <tr> alone isn't focusable). */
.fd-admin-bookings__row[b-4npoqa4nlm] {
    cursor: pointer;
}

/* Keep the actions column tight and right-aligned, like the recipes table. */
.fd-admin-bookings__actions-cell[b-4npoqa4nlm] {
    width: 1%;
    white-space: nowrap;
    text-align: right;
}
/* /Components/Pages/Admin/Categories.razor.rz.scp.css */
/* The .fd-admin-modal structural styles (backdrop + __panel + __header/__body/__footer + the
   --sm variant and reduced-motion fallback) were promoted to the shared admin.css so other admin
   pages (e.g. the bookings detail modal) can reuse the same skeleton. */

/* The category list now lives in a single flush card (.fd-admin-panel--flush) that reuses the
   shared .fd-admin-table-card__header strip (title "Összes kategória" + live count) and a
   light-head table — mirroring the Recipes/Bookings/Leads results card. The shared look lives in
   admin.css; only the table-wrap radius reset below is genuinely page-scoped. */

/* Inside the flush card the table-wrap must NOT add its own rounded corners (the card already
   clips to its radius via overflow:clip), otherwise the light-head thead's rounded top corners
   would peek a hairline against the header divider. (Mirrors the Recipes results-card rule.) */
.fd-admin-categories__results-card .fd-admin-categories__table-wrap[b-18xls9dedw] {
    border-radius: 0;
}
/* /Components/Pages/Admin/Dashboard.razor.rz.scp.css */
/* ===== Stat tiles ===== */
.fd-admin-dashboard__stats[b-ahxr7tt7om] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--fd-space-4);
    margin-bottom: var(--fd-space-6);
}

@media (min-width: 768px) {
    .fd-admin-dashboard__stats[b-ahxr7tt7om] {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* ===== Recent-recipes panel (flush): unified card header + lighter table head =====
   slice adm41: the card-header strip (title + "Összes recept" link + divider) and the padded
   empty-hint were PROMOTED to the shared .fd-admin-table-card__header / __title / __link /
   __empty-hint pattern in admin.css so the bookings results card can reuse the exact same look.
   The dashboard markup now consumes those shared classes directly; the rendered result is
   unchanged. The recipes table still uses the shared .fd-admin-table--light-head modifier
   (admin.css) to drop the cream thead band. Nothing dashboard-specific remains here. */

/* ===== Middle row: chart + leads ===== */
.fd-admin-dashboard__middle[b-ahxr7tt7om] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--fd-space-4);
    margin-bottom: var(--fd-space-6);
}

@media (min-width: 1024px) {
    .fd-admin-dashboard__middle[b-ahxr7tt7om] {
        grid-template-columns: 1fr 1fr;
        gap: var(--fd-space-5);
    }
}

.fd-admin-dashboard__chart-panel[b-ahxr7tt7om] {
    min-height: 20rem;
    display: flex;
    flex-direction: column;
}

/* ===== Lead list in panel ===== */
.fd-admin-dashboard__lead-list[b-ahxr7tt7om] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
}

.fd-admin-dashboard__lead-item[b-ahxr7tt7om] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-3);
}

.fd-admin-dashboard__lead-avatar[b-ahxr7tt7om] {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--fd-radius-pill);
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
    font-size: var(--fd-text-xs);
    font-weight: var(--fd-weight-bold);
    letter-spacing: 0.05em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.fd-admin-dashboard__lead-info[b-ahxr7tt7om] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.fd-admin-dashboard__lead-name[b-ahxr7tt7om] {
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fd-admin-dashboard__lead-email[b-ahxr7tt7om] {
    font-size: var(--fd-text-xs);
    color: var(--fd-color-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ===== Recent registrations list (flush card) =====
   Mirrors the leads panel's avatar + stacked name/email layout, extended with the Tagok-page role
   status badges + an e-mail-confirmed indicator and a right-aligned registration date. On narrow
   widths the badges/date drop below the identity block so nothing is clipped. */
.fd-admin-dashboard__reg-list[b-ahxr7tt7om] {
    list-style: none;
    margin: 0;
    padding: var(--fd-space-4) var(--fd-space-5);
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-4);
}

.fd-admin-dashboard__reg-item[b-ahxr7tt7om] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-3);
    flex-wrap: wrap;
}

.fd-admin-dashboard__reg-avatar[b-ahxr7tt7om] {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--fd-radius-pill);
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
    font-size: var(--fd-text-xs);
    font-weight: var(--fd-weight-bold);
    letter-spacing: 0.05em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.fd-admin-dashboard__reg-info[b-ahxr7tt7om] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1 1 12rem;
}

.fd-admin-dashboard__reg-name[b-ahxr7tt7om] {
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fd-admin-dashboard__reg-email[b-ahxr7tt7om] {
    font-size: var(--fd-text-xs);
    color: var(--fd-color-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fd-admin-dashboard__reg-badges[b-ahxr7tt7om] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fd-space-2);
    flex: 0 0 auto;
}

.fd-admin-dashboard__reg-date[b-ahxr7tt7om] {
    font-size: var(--fd-text-xs);
    color: var(--fd-color-text-muted);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    flex: 0 0 auto;
    margin-left: auto;
}

/* ===== Empty hint ===== */
.fd-admin-empty-hint[b-ahxr7tt7om] {
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text-muted);
    padding: var(--fd-space-4) 0;
}

/* ===== Recent-recipes table: responsive column disclosure on mobile =====
   The Recipes list page collapses its wide table at narrow widths, but those rules live in
   Recipes.razor.css (component-scoped) so they never reach this dashboard table — it kept all
   five columns and scrolled sideways on a phone. Mirror the disclosure here (scoped to the
   dashboard): below 640px drop the three secondary columns so only Cím + Műveletek remain — the
   full data is one tap away via the row's eye action / "Összes recept". */
@media (max-width: 639.98px) {
    .fd-admin-table .fd-admin-recipes__col--category[b-ahxr7tt7om],
    .fd-admin-table .fd-admin-recipes__col--difficulty[b-ahxr7tt7om],
    .fd-admin-table .fd-admin-recipes__col--featured[b-ahxr7tt7om] {
        display: none;
    }
}
/* /Components/Pages/Admin/FoodCategories.razor.rz.scp.css */
/* The food-category list reuses the shared admin design system: the flush table-card
   (.fd-admin-panel--flush + .fd-admin-table-card__*), the light-head table, a sortable Név header
   (.fd-admin-sort), the colour-coded icon-button actions (.fd-admin-icon-btn--edit/--danger) and the
   shared modal skeleton (.fd-admin-modal). Only the category-specific layout bits live here. */

/* Inside the flush card the table-wrap must NOT add its own rounded corners (the card clips to its
   radius), mirroring the Foods/Recipes results-card rule. */
.fd-admin-food-categories__results-card .fd-admin-food-categories__table-wrap[b-7na19v6pod] {
    border-radius: 0;
}

/* ---- Action cell (mirrors .fd-admin-foods__actions) ---- */
.fd-admin-food-categories__col--actions[b-7na19v6pod] {
    width: 1%;
    white-space: nowrap;
    text-align: right;
}

.fd-admin-food-categories__actions-cell[b-7na19v6pod] {
    white-space: nowrap;
    text-align: right;
}

.fd-admin-food-categories__actions[b-7na19v6pod] {
    display: inline-flex;
    gap: var(--fd-space-1);
    align-items: center;
    justify-content: flex-end;
}
/* /Components/Pages/Admin/FoodEdit.razor.rz.scp.css */
/* Az Új/Szerkesztés alapanyag oldal panele — a recept-create panel mintáját követi: egy beágyazott
   form-kártya, korlátozott szélességgel, hogy a mezők ne nyúljanak túl szélesre nagy képernyőn. */
.fd-admin-food-form-page__panel[b-k3q3l7fecb] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-4);
    max-width: 42rem;
}
/* /Components/Pages/Admin/FoodNew.razor.rz.scp.css */
/* Az Új/Szerkesztés alapanyag oldal panele — a recept-create panel mintáját követi: egy beágyazott
   form-kártya, korlátozott szélességgel, hogy a mezők ne nyúljanak túl szélesre nagy képernyőn. */
.fd-admin-food-form-page__panel[b-9wdof5caar] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-4);
    max-width: 42rem;
}
/* /Components/Pages/Admin/Foods.razor.rz.scp.css */
/* The food catalog list reuses the shared admin design system: the flush table-card
   (.fd-admin-panel--flush + .fd-admin-table-card__*), the light-head table, sortable headers
   (.fd-admin-sort), the colour-coded icon-button actions (.fd-admin-icon-btn--edit/--danger) and
   the shared modal skeleton (.fd-admin-modal, still used by the delete-confirm). Only the food-list
   specific bits live here: numeric column alignment, the unit/category chips, and the category
   filter bar. The toggleable .fd-admin-filter-chip is now shared (admin.css) — used by both this
   filter bar and the FoodForm multi-select on the dedicated create/edit pages. */

/* Inside the flush card the table-wrap must NOT add its own rounded corners (the card clips to its
   radius), mirroring the Recipes/Categories results-card rule. */
.fd-admin-foods__results-card .fd-admin-foods__table-wrap[b-8dagavk57q] {
    border-radius: 0;
}

/* ---- Numeric macro columns: right-aligned, tabular figures ---- */
.fd-admin-foods__col--num[b-8dagavk57q] {
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

/* Right-align the sort button in a numeric header so the label hugs the column edge. */
.fd-admin-foods .fd-admin-sort--end[b-8dagavk57q] {
    justify-content: flex-end;
    width: 100%;
}

/* The "/100 g" hint + value unit sit muted and small next to the figure. */
.fd-admin-foods__col-unit[b-8dagavk57q],
.fd-admin-foods__num-unit[b-8dagavk57q] {
    color: var(--fd-color-text-muted);
    font-weight: var(--fd-weight-regular);
    font-size: var(--fd-text-xs);
}

.fd-admin-foods__col--units[b-8dagavk57q] {
    min-width: 12rem;
}

.fd-admin-foods__col--categories[b-8dagavk57q] {
    min-width: 10rem;
}

/* ---- Category filter bar (under the table-card header) ---- */
.fd-admin-foods__filter-bar[b-8dagavk57q] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--fd-space-2);
    padding: var(--fd-space-3) var(--fd-space-4);
    border-bottom: 1px solid var(--fd-color-border);
    background-color: var(--fd-color-surface-subtle, var(--fd-color-green-50));
}

.fd-admin-foods__filter-label[b-8dagavk57q] {
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-medium);
    color: var(--fd-color-text-muted);
}

.fd-admin-foods__units-empty[b-8dagavk57q] {
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
}

/* ---- Unit + category chips in the list ("1 db = 50 g", category names) ---- */
.fd-admin-foods__chips[b-8dagavk57q] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fd-space-1);
}

.fd-admin-chip[b-8dagavk57q] {
    display: inline-flex;
    align-items: center;
    padding: 2px var(--fd-space-2);
    border-radius: var(--fd-radius-pill);
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
    font-size: var(--fd-text-xs);
    font-weight: var(--fd-weight-medium);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

/* ---- Action cell (mirrors .fd-admin-recipes__actions) ---- */
.fd-admin-foods__col--actions[b-8dagavk57q] {
    width: 1%;
    white-space: nowrap;
    text-align: right;
}

.fd-admin-foods__actions-cell[b-8dagavk57q] {
    white-space: nowrap;
    text-align: right;
}

.fd-admin-foods__actions[b-8dagavk57q] {
    display: inline-flex;
    gap: var(--fd-space-1);
    align-items: center;
    justify-content: flex-end;
}

/* ---- Narrow-view progressive column disclosure (mirrors Recipes) ----
   At desktop the 8-column table (Név, Kcal, Fehérje, Szénhidrát, Zsír, Egységek, Kategóriák,
   Műveletek) is far wider than a ~364px admin card, so the flush card would clip the actions
   column and leave only sideways scroll. Fix = the wrap scrolls as a safety net + drop the
   lower-priority columns at narrow widths so the remaining columns fill the card cleanly with the
   actions always visible. All hidden data is still reachable via the edit action (the detail form).

   Disclosure plan:
     - wide (>=1024px): all 8 columns.
     - <=1023px: hide the three secondary macros (Fehérje/Szénhidrát/Zsír) + Egységek + Kategóriák,
       and release those columns' min-widths. Keep Név, Kcal, Műveletek.
     - <=639px: tighten horizontal cell padding so Név + Kcal + the action icons fit a ~390px card
       with a right gutter. */
.fd-admin-foods__results-card .fd-admin-foods__table-wrap[b-8dagavk57q] {
    overflow-x: auto;
}

@media (max-width: 1023px) {
    .fd-admin-foods__table .fd-admin-foods__col--macro[b-8dagavk57q],
    .fd-admin-foods__table .fd-admin-foods__col--units[b-8dagavk57q],
    .fd-admin-foods__table .fd-admin-foods__col--categories[b-8dagavk57q] {
        display: none;
    }

    /* Released so the remaining columns fill the card instead of forcing horizontal scroll. */
    .fd-admin-foods__col--units[b-8dagavk57q],
    .fd-admin-foods__col--categories[b-8dagavk57q] {
        min-width: 0;
    }
}

@media (max-width: 639px) {
    .fd-admin-foods__table thead th[b-8dagavk57q],
    .fd-admin-foods__table tbody td[b-8dagavk57q] {
        padding-inline: var(--fd-space-2);
    }
}
/* /Components/Pages/Admin/LeadAdminPage.razor.rz.scp.css */
/* Leads page-scoped styles.
   The results now live in a single flush card (.fd-admin-panel--flush) that reuses the shared
   .fd-admin-table-card__header strip (title + embedded search + result count) and a light-head
   table — mirroring the Bookings results card. The topic-filter chips sit in a dedicated filter
   row inside the card, between the header strip and the table. The shared look (header strip,
   light-head, flush-card filter-empty override) lives in admin.css; only genuinely page-scoped
   tweaks belong here. */

/* Inside the flush card the table-wrap must NOT add its own rounded corners (the card already
   clips to its radius via overflow:clip), otherwise the light-head thead's rounded top corners
   would peek a hairline against the header divider. */
.fd-admin-leads__results-card .fd-admin-leads__table-wrap[b-q1g7j8c5h3] {
    border-radius: 0;
}

/* Topic-filter chip row: a clean wrap-friendly band between the header strip and the table.
   A hairline bottom rule separates it from the table head; chips reflow on narrow viewports. */
.fd-admin-leads__filter-row[b-q1g7j8c5h3] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--fd-space-2);
    padding: var(--fd-space-3) var(--fd-space-5);
    border-bottom: 1px solid var(--fd-color-border);
}

/* The whole lead row is clickable → opens the read-only detail modal. The eye-icon button in the
   trailing actions column is the visible affordance and the keyboard/screen-reader trigger
   (a clickable <tr> alone isn't focusable). */
.fd-admin-leads__row[b-q1g7j8c5h3] {
    cursor: pointer;
}

/* Keep the actions column tight and right-aligned. */
.fd-admin-leads__actions-cell[b-q1g7j8c5h3] {
    width: 1%;
    white-space: nowrap;
    text-align: right;
}

/* Account (Fiók) column: the badge + conversion action. Wrap the badge and the CTA so a narrow cell
   stacks them instead of overflowing; the muted "Nincs regisztrált fiók" note wraps to its own lines. */
.fd-admin-leads__account[b-q1g7j8c5h3] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--fd-space-2);
}

.fd-admin-leads__account-cell[b-q1g7j8c5h3] {
    white-space: normal;
}

/* Message column: cap its width on wide viewports so the cream-table stays readable and the row
   height stays even. Single-line with ellipsis on wide screens (the full text lives in the detail
   modal). The trailing actions column + the wrap's overflow-x keep every column reachable. */
.fd-admin-leads__col--message[b-q1g7j8c5h3] {
    max-width: 24rem;
}

@media (min-width: 768px) {
    .fd-admin-leads__col--message[b-q1g7j8c5h3] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

/* Narrow-view fix (owner: "keskeny nézetben a jobb oldali része a szövegeknek ne csússzon ki
   és ne tapadjon az oldal vonalhoz"). The flush card clips its overflow, so a too-wide table
   used to push the eye-actions column off the right edge and leave Dátum flush to the border.
   Fix = progressive column disclosure (mirrors the Bookings table in admin.css): drop the long,
   modal-available columns at narrow widths and release the 52rem min-width once they're gone, so
   the remaining columns fill the card with no horizontal scroll and a clean right gutter.

   Disclosure plan (full data always reachable via the row-detail modal):
     - wide (>=1024px): all 6 columns — unchanged.
     - 640–1023px: hide E-mail (long + in modal). Keep Név, Téma, Üzenet, Dátum, eye.
     - <=639px: also hide Üzenet. Keep Név, Téma, Dátum, eye. */
.fd-admin-leads__results-card .fd-admin-leads__table-wrap[b-q1g7j8c5h3] {
    overflow-x: auto;
}

.fd-admin-leads__table[b-q1g7j8c5h3] {
    /* Bumped from 52rem when the Fiók (account) column was added, so the wide-view columns keep
       breathing room before the progressive-disclosure breakpoints kick in. */
    min-width: 60rem;
}

/* Below the wide breakpoint the message column wraps (no nowrap) so rows stay legible. */
@media (max-width: 767px) {
    .fd-admin-leads__col--message[b-q1g7j8c5h3] {
        white-space: normal;
    }
}

/* Mid/narrow zone: hide E-mail and let the remaining 5 columns fill the card (no min-width
   forcing scroll). The actions column keeps its right padding so Dátum/eye never touch the
   border. */
@media (max-width: 1023px) {
    .fd-admin-leads__table .fd-admin-leads__col--email[b-q1g7j8c5h3] {
        display: none;
    }

    .fd-admin-leads__table[b-q1g7j8c5h3] {
        min-width: 0;
    }
}

/* Narrowest: also drop the Üzenet preview, keeping Név + Téma + Dátum + eye. The remaining four
   columns' intrinsic widths (name, the topic badge, the two-line date, the eye) plus the shared
   1rem cell padding still overflow a ~400px card, which clips the trailing eye action off the
   right edge. Tighten the horizontal cell padding here so the four columns fit with a right gutter
   and the eye stays visible/reachable. Vertical padding and the wide view are untouched. */
@media (max-width: 639px) {
    .fd-admin-leads__table .fd-admin-leads__col--message[b-q1g7j8c5h3] {
        display: none;
    }

    .fd-admin-leads__table thead th[b-q1g7j8c5h3],
    .fd-admin-leads__table tbody td[b-q1g7j8c5h3] {
        padding-inline: var(--fd-space-2);
    }
}

/* Detail modal: the full message can be long — let it wrap and preserve author line breaks. */
.fd-admin-leads__detail-message dd[b-q1g7j8c5h3] {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}
/* /Components/Pages/Admin/MealPlanEditor.razor.rz.scp.css */
/* MealPlanEditor — a mintaétrend-építő elrendezése. A megosztott design-system tokeneket használja
   (.fd-input, .fd-field, .fd-button, .fd-admin-panel, spacing/szín tokenek); csak az építő-specifikus
   szerkezetet definiálja itt (meta + napok panel, nap-kártyák, étkezés-sorok). */

/* Meta panel a napok fölött; széles nézeten két oszlop (meta bal, napok jobb), keskenyen egymás alá. */
.fd-admin-meal-plan-editor__grid[b-xls940r677] {
    display: grid;
    grid-template-columns: minmax(0, 22rem) minmax(0, 1fr);
    gap: var(--fd-space-5);
    align-items: start;
}

@media (max-width: 60rem) {
    .fd-admin-meal-plan-editor__grid[b-xls940r677] {
        grid-template-columns: 1fr;
    }
}

.fd-admin-meal-plan-editor__status[b-xls940r677] {
    margin-bottom: var(--fd-space-4);
}

.fd-admin-meal-plan-editor__status:empty[b-xls940r677] {
    display: none;
}

.fd-admin-meal-plan-editor__toggle[b-xls940r677] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-2);
    cursor: pointer;
}

/* ---- Napok panel ---- */
.fd-admin-meal-plan-editor__days-head[b-xls940r677] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--fd-space-3);
    margin-bottom: var(--fd-space-3);
}

.fd-admin-meal-plan-editor__plan-total[b-xls940r677] {
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-medium);
    color: var(--fd-color-text-muted);
}

.fd-admin-meal-plan-editor__plan-total:empty[b-xls940r677] {
    display: none;
}

/* ---- Nap-kártya ---- */
.fd-admin-meal-plan-editor__day-card[b-xls940r677] {
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-md, 0.5rem);
    padding: var(--fd-space-4);
    margin-bottom: var(--fd-space-4);
    background: var(--fd-color-surface-muted, #f6f6f4);
}

.fd-admin-meal-plan-editor__day-head[b-xls940r677] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-3);
    margin-bottom: var(--fd-space-3);
}

.fd-admin-meal-plan-editor__day-label-field[b-xls940r677] {
    flex: 1 1 0;
    min-width: 0;
    margin-bottom: 0;
}

.fd-admin-meal-plan-editor__day-tools[b-xls940r677] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-1);
    flex: 0 0 auto;
}

.fd-admin-meal-plan-editor__day-kcal[b-xls940r677] {
    font-size: var(--fd-text-xs);
    color: var(--fd-color-text-muted);
    margin-right: var(--fd-space-2);
    white-space: nowrap;
}

.fd-admin-meal-plan-editor__day-kcal:empty[b-xls940r677] {
    display: none;
}

/* ---- Étkezés-sorok a napon belül ---- */
.fd-admin-meal-plan-editor__meals[b-xls940r677] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
}

.fd-admin-meal-plan-editor__meal-row[b-xls940r677] {
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-sm, 0.375rem);
    padding: var(--fd-space-3);
    background: var(--fd-color-surface, #fff);
}

.fd-admin-meal-plan-editor__meal-top[b-xls940r677] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-2);
    flex-wrap: wrap;
}

.fd-admin-meal-plan-editor__meal-label-field[b-xls940r677] {
    flex: 1 1 10rem;
    min-width: 0;
    margin-bottom: 0;
}

.fd-admin-meal-plan-editor__meal-type[b-xls940r677] {
    display: inline-flex;
    flex: 0 0 auto;
    gap: 0;
}

/* Type-switch: two segmented buttons sit flush against each other. */
.fd-admin-meal-plan-editor__meal-type .fd-button + .fd-button[b-xls940r677] {
    margin-left: -1px;
}

.fd-admin-meal-plan-editor__meal-detail[b-xls940r677] {
    display: flex;
    gap: var(--fd-space-2);
    margin-top: var(--fd-space-3);
    flex-wrap: wrap;
}

.fd-admin-meal-plan-editor__meal-recipe[b-xls940r677],
.fd-admin-meal-plan-editor__meal-freetext[b-xls940r677] {
    flex: 1 1 14rem;
    min-width: 0;
    margin-bottom: 0;
}

.fd-admin-meal-plan-editor__meal-servings[b-xls940r677],
.fd-admin-meal-plan-editor__meal-kcal[b-xls940r677] {
    flex: 0 0 8rem;
    margin-bottom: 0;
}

@media (max-width: 32rem) {
    .fd-admin-meal-plan-editor__meal-servings[b-xls940r677],
    .fd-admin-meal-plan-editor__meal-kcal[b-xls940r677] {
        flex: 1 1 100%;
    }
}

/* ---- Kompakt gombok + add-sorok ---- */
.fd-button--sm[b-xls940r677] {
    padding: var(--fd-space-1) var(--fd-space-3);
    font-size: var(--fd-text-sm);
}

.fd-admin-meal-plan-editor__add-meal[b-xls940r677],
.fd-admin-meal-plan-editor__add-day[b-xls940r677] {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-1);
}

.fd-admin-meal-plan-editor__add-meal[b-xls940r677] {
    margin-top: var(--fd-space-1);
}

.fd-admin-meal-plan-editor__add-day[b-xls940r677] {
    margin-top: var(--fd-space-2);
}

.fd-admin-meal-plan-editor__actions[b-xls940r677] {
    grid-column: 1 / -1;
}
/* /Components/Pages/Admin/MealPlans.razor.rz.scp.css */
/* The meal-plans list reuses the shared admin design system: the flush table-card
   (.fd-admin-panel--flush + .fd-admin-table-card__*), the light-head table, the status badges
   (.fd-admin-badge / --yes / --no), the colour-coded icon-button actions (.fd-admin-icon-btn) and the
   shared modal skeleton (.fd-admin-modal). Only the meal-plans-specific layout bits live here. */

/* Inside the flush card the table-wrap must NOT add its own rounded corners (the card clips to its
   radius), mirroring the Members/Foods results-card rule. */
.fd-admin-meal-plans__results-card .fd-admin-meal-plans__table-wrap[b-oyobxey1sq] {
    border-radius: 0;
}

/* Numeric count columns (Napok / Étkezések) stay compact and right-aligned. */
.fd-admin-meal-plans__col--num[b-oyobxey1sq] {
    white-space: nowrap;
    text-align: right;
}

/* Updated timestamp column stays on one line. */
.fd-admin-meal-plans__col--updated[b-oyobxey1sq] {
    white-space: nowrap;
    color: var(--fd-color-text-muted);
}

/* ---- Action cell (mirrors .fd-admin-members__actions) ---- */
.fd-admin-meal-plans__col--actions[b-oyobxey1sq] {
    width: 1%;
    white-space: nowrap;
    text-align: right;
}

.fd-admin-meal-plans__actions-cell[b-oyobxey1sq] {
    white-space: nowrap;
    text-align: right;
}

.fd-admin-meal-plans__actions[b-oyobxey1sq] {
    display: inline-flex;
    gap: var(--fd-space-1);
    align-items: center;
    justify-content: flex-end;
}

/* ---- View toggle (Ügyféltervek / Sablonok), a wrap of shared filter chips ---- */
.fd-admin-meal-plans__filter-bar[b-oyobxey1sq] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--fd-space-2);
    margin-bottom: var(--fd-space-4);
}

/* "—" placeholder for a template's (irrelevant) status. */
.fd-admin-meal-plans__status-na[b-oyobxey1sq] {
    color: var(--fd-color-text-muted);
}

/* Lead paragraph atop the instantiate modal body. */
.fd-admin-meal-plans__instantiate-lead[b-oyobxey1sq] {
    margin-top: 0;
    color: var(--fd-color-text-muted);
}
/* /Components/Pages/Admin/Members.razor.rz.scp.css */
/* The members list reuses the shared admin design system: the flush table-card
   (.fd-admin-panel--flush + .fd-admin-table-card__*), the light-head table, the status badges
   (.fd-admin-badge / --yes / --no), the colour-coded icon-button actions (.fd-admin-icon-btn) and the
   shared modal skeleton (.fd-admin-modal). Only the members-specific layout bits live here. */

/* Inside the flush card the table-wrap must NOT add its own rounded corners (the card clips to its
   radius), mirroring the Foods/FoodCategories results-card rule. */
.fd-admin-members__results-card .fd-admin-members__table-wrap[b-ry41e63gxm] {
    border-radius: 0;
}

/* Status badges wrap and keep a small gap when a member carries several roles. */
.fd-admin-members__badges[b-ry41e63gxm] {
    display: inline-flex;
    flex-wrap: wrap;
    gap: var(--fd-space-1);
    align-items: center;
}

/* Muted em-dash placeholder for a missing display name. */
.fd-admin-members__muted[b-ry41e63gxm] {
    color: var(--fd-color-ink-400);
}

/* The "E-mail megerősítve" column stays compact and centered. */
.fd-admin-members__col--confirmed[b-ry41e63gxm] {
    white-space: nowrap;
    text-align: center;
}

/* ---- Action cell (mirrors .fd-admin-foods__actions) ---- */
.fd-admin-members__col--actions[b-ry41e63gxm] {
    width: 1%;
    white-space: nowrap;
    text-align: right;
}

.fd-admin-members__actions-cell[b-ry41e63gxm] {
    white-space: nowrap;
    text-align: right;
}

.fd-admin-members__actions[b-ry41e63gxm] {
    display: inline-flex;
    gap: var(--fd-space-1);
    align-items: center;
    justify-content: flex-end;
}
/* /Components/Pages/Admin/Recipes.razor.rz.scp.css */
/* Recipes list page-scoped styles.
   The list now lives in a single flush card (.fd-admin-panel--flush) that reuses the shared
   .fd-admin-table-card__header strip (title "Összes recept" + embedded search + result count)
   and a light-head table — mirroring the Bookings/Leads results card. The shared look (header
   strip, light-head, sort triggers, flush-card filter-empty override) lives in admin.css; only
   genuinely page-scoped tweaks belong here. */

/* Inside the flush card the table-wrap must NOT add its own rounded corners (the card already
   clips to its radius via overflow:clip), otherwise the light-head thead's rounded top corners
   would peek a hairline against the header divider. */
.fd-admin-recipes__results-card .fd-admin-recipes__table-wrap[b-g99fllyuif] {
    border-radius: 0;
}

/* The numeric cells ("12 adag", "35 perc") must not wrap awkwardly into two lines. */
.fd-admin-recipes__col--servings[b-g99fllyuif],
.fd-admin-recipes__col--minutes[b-g99fllyuif] {
    white-space: nowrap;
}

/* Narrow-view fix (mirrors Leads): the flush card clips its overflow, so a too-wide table would
   push the eye/edit/trash actions column off the right edge and leave the last visible column
   flush to the border. Fix = the inner wrap scrolls (overflow-x) as a safety net + progressive
   column disclosure that drops the secondary columns at narrow widths and releases the min-width
   once they're gone, so the remaining columns fill the card with a clean right gutter and the
   actions column stays visible/reachable.

   Disclosure plan (all data still reachable on the detail page via the eye action):
     - wide (>=1024px): all 7 columns — Cím, Kategória, Nehézség, Adag, Elkészítés, Kiemelt,
       Műveletek.
     - 640–1023px: hide Adag + Elkészítés (numeric, secondary). Keep Cím, Kategória, Nehézség,
       Kiemelt, Műveletek.
     - <=639px: also hide Kategória. Keep Cím, Nehézség, Kiemelt, Műveletek. */
.fd-admin-recipes__results-card .fd-admin-recipes__table-wrap[b-g99fllyuif] {
    overflow-x: auto;
}

.fd-admin-recipes__table[b-g99fllyuif] {
    min-width: 56rem;
}

/* Mid/narrow zone: hide the two numeric columns and let the remaining 5 columns fill the card
   (no min-width forcing scroll). The actions column keeps its right padding so nothing touches
   the border. */
@media (max-width: 1023px) {
    .fd-admin-recipes__table .fd-admin-recipes__col--servings[b-g99fllyuif],
    .fd-admin-recipes__table .fd-admin-recipes__col--minutes[b-g99fllyuif] {
        display: none;
    }

    .fd-admin-recipes__table[b-g99fllyuif] {
        min-width: 0;
    }
}

/* Narrowest: also drop Kategória AND Kiemelt, keeping Cím + Nehézség + Műveletek — three icon
   actions (eye/edit/trash) are too wide to also fit the badge column on a ~400px card. Tighten the
   horizontal cell padding and clamp the (already-ellipsised) slug + the title's intrinsic width so
   the three columns fit with a right gutter and the trailing actions stay visible/reachable. The
   eye action still reaches the full detail (incl. category + featured). Vertical padding and the
   wide view are untouched. */
@media (max-width: 639px) {
    .fd-admin-recipes__table .fd-admin-recipes__col--category[b-g99fllyuif],
    .fd-admin-recipes__table .fd-admin-recipes__col--featured[b-g99fllyuif] {
        display: none;
    }

    .fd-admin-recipes__table thead th[b-g99fllyuif],
    .fd-admin-recipes__table tbody td[b-g99fllyuif] {
        padding-inline: var(--fd-space-2);
    }

    /* Let the title column give up width to the actions column instead of forcing overflow. */
    .fd-admin-recipes__slug[b-g99fllyuif] {
        max-width: 18ch;
    }
}
/* /Components/Pages/Booking.razor.rz.scp.css */
.fd-booking-page__form-grid[b-w36wboxx2v] {
    display: grid;
    gap: var(--fd-space-5);
}

.fd-booking-page__info-column[b-w36wboxx2v] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-4);
}

.fd-booking-page__fallback-actions[b-w36wboxx2v] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fd-space-3);
}

@media (min-width: 768px) {
    .fd-booking-page__form-grid[b-w36wboxx2v] {
        grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
        align-items: start;
        gap: var(--fd-space-6);
    }
}
/* /Components/Pages/Contact.razor.rz.scp.css */
.fd-contact-page__form-grid[b-ms2y1nfhdm] {
    display: grid;
    gap: var(--fd-space-5);
    align-items: start;
}

.fd-contact-page__booking-column[b-ms2y1nfhdm],
.fd-contact-page__form-column[b-ms2y1nfhdm] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-4);
}

/* Bal oszlop form-címe — a heading-hierarchia horgonya a ContactForm felett. */
.fd-contact-page__form-title[b-ms2y1nfhdm] {
    margin: 0;
    font-family: var(--fd-font-display);
    font-size: var(--fd-text-2xl);
}

/* Aktív foglalási kártya — a jobb oszlopban, on-brand tintált felület, az élő /booking oldalra visz. */
.fd-contact-page__booking-card[b-ms2y1nfhdm] {
    padding: var(--fd-space-5);
    border-radius: var(--fd-radius-lg);
    background-color: var(--fd-color-sage-50);
    border: 1px solid var(--fd-color-sage-100);
    display: grid;
    gap: var(--fd-space-3);
}

.fd-contact-page__booking-action[b-ms2y1nfhdm] {
    margin-top: var(--fd-space-2);
}

.fd-contact-page__booking-eyebrow[b-ms2y1nfhdm] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-accent-strong);
}

.fd-contact-page__booking-title[b-ms2y1nfhdm] {
    margin: 0;
    font-family: var(--fd-font-display);
    font-size: var(--fd-text-2xl);
}

.fd-contact-page__booking-lead[b-ms2y1nfhdm] {
    margin: 0;
    color: var(--fd-color-ink-700);
}

/* Info-blokkok a form alatt egy sorban (mobilon stack). */
.fd-contact-page__info-row[b-ms2y1nfhdm] {
    display: grid;
    gap: var(--fd-space-4);
    margin-top: var(--fd-space-6);
}

/* Alternatív kontakt kártyák — egyszerű email/instagram/telefon. */
.fd-contact-page__alt-contacts[b-ms2y1nfhdm] {
    display: grid;
    gap: var(--fd-space-4);
    grid-template-columns: 1fr;
}

.fd-contact-page__alt-card[b-ms2y1nfhdm] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-3);
    padding: var(--fd-space-4) var(--fd-space-5);
    border-radius: var(--fd-radius-lg);
    background-color: var(--fd-color-surface);
    border: 1px solid var(--fd-color-border);
    box-shadow: var(--fd-shadow-sm);
    color: var(--fd-color-ink-900);
    text-decoration: none;
    transition: transform var(--fd-transition-fast), box-shadow var(--fd-transition-fast);
}

.fd-contact-page__alt-card:hover[b-ms2y1nfhdm],
.fd-contact-page__alt-card:focus-visible[b-ms2y1nfhdm] {
    transform: translateY(-2px);
    box-shadow: var(--fd-shadow-md);
    text-decoration: none;
}

.fd-contact-page__alt-icon[b-ms2y1nfhdm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    background-color: var(--fd-color-sage-50);
    color: var(--fd-color-primary-strong);
    flex: none;
}

.fd-contact-page__alt-body[b-ms2y1nfhdm] {
    display: grid;
    gap: 0.15rem;
}

.fd-contact-page__alt-body strong[b-ms2y1nfhdm] {
    font-size: var(--fd-text-base);
}

.fd-contact-page__alt-body span[b-ms2y1nfhdm] {
    color: var(--fd-color-ink-700);
    font-size: var(--fd-text-sm);
}

@media (min-width: 600px) {
    .fd-contact-page__alt-contacts[b-ms2y1nfhdm] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .fd-contact-page__info-row[b-ms2y1nfhdm] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 960px) {
    .fd-contact-page__form-grid[b-ms2y1nfhdm] {
        /* Left: active ContactForm (1.5fr primary), right: active booking card → /booking (1fr secondary). */
        grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
        gap: var(--fd-space-7);
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
.fd-home-hero-section[b-y57xyrymgf] {
    padding-top: var(--fd-space-5);
}

.fd-home-hero[b-y57xyrymgf] {
    display: grid;
    gap: var(--fd-space-5);
}

.fd-home-hero__visual[b-y57xyrymgf] {
    position: relative;
    border-radius: var(--fd-radius-lg);
    overflow: hidden;
    min-height: 320px;
    /* Graceful fallback: ha a fotó nem töltődik be, a kártya így is szándékosnak hat. */
    background: linear-gradient(135deg, var(--fd-color-green-100), var(--fd-color-cream-100));
    border: 1px solid var(--fd-color-border);
    box-shadow: var(--fd-shadow-md);
}

.fd-home-hero__visual img[b-y57xyrymgf] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Sötét scrim az alsó sávban, hogy az overlay-címke jól olvasható legyen bármilyen fotón. */
.fd-home-hero__visual[b-y57xyrymgf]::after {
    content: "";
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    height: 45%;
    background: linear-gradient(to top, rgba(31, 42, 36, 0.55), transparent);
    pointer-events: none;
}

.fd-home-hero__visual-card[b-y57xyrymgf] {
    position: absolute;
    z-index: 1;
    left: var(--fd-space-4);
    right: var(--fd-space-4);
    bottom: var(--fd-space-4);
    display: grid;
    gap: var(--fd-space-2);
    padding: var(--fd-space-4);
    border-radius: var(--fd-radius-md);
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.85);
}

.fd-home-hero__visual-label[b-y57xyrymgf],
.fd-home-story-strip__eyebrow[b-y57xyrymgf],
.fd-home-tech-note__label[b-y57xyrymgf] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-accent-strong);
}

.fd-home-hero__copy[b-y57xyrymgf] {
    display: grid;
    gap: var(--fd-space-4);
    align-content: center;
}

.fd-home-hero__eyebrow[b-y57xyrymgf] {
    display: inline-flex;
    align-items: center;
    justify-self: flex-start;
    padding: var(--fd-space-2) var(--fd-space-4);
    border-radius: var(--fd-radius-pill);
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.fd-home-hero__title[b-y57xyrymgf],
.fd-home-story-strip__title[b-y57xyrymgf] {
    margin: 0;
}

.fd-home-hero__title[b-y57xyrymgf] {
    font-family: var(--fd-font-display);
    font-weight: var(--fd-weight-semibold);
    font-size: var(--fd-text-4xl);
    line-height: var(--fd-leading-tight);
    color: var(--fd-color-text);
    letter-spacing: -0.005em;
}

.fd-home-hero__title-accent[b-y57xyrymgf] {
    font-style: italic;
    font-family: var(--fd-font-display);
    color: var(--fd-color-primary-strong);
    font-weight: var(--fd-weight-semibold);
}

.fd-home-hero__lead[b-y57xyrymgf],
.fd-home-featured__note[b-y57xyrymgf] {
    margin: 0;
    color: var(--fd-color-ink-700);
    font-size: var(--fd-text-lg);
}

.fd-home-hero__actions[b-y57xyrymgf],
.fd-home-story-strip__actions[b-y57xyrymgf] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fd-space-3);
}

/* Mobil (<= 540px) — hero CTA-k egymás alatt, teljes szélességben. */
@media (max-width: 540px) {
    .fd-home-hero__actions[b-y57xyrymgf] {
        flex-direction: column;
        align-items: stretch;
    }

    .fd-home-hero__actions > *[b-y57xyrymgf] {
        width: 100%;
    }

    .fd-home-hero__actions .fd-cta[b-y57xyrymgf] {
        width: 100%;
        justify-content: center;
    }
}

.fd-home-hero__trust-list[b-y57xyrymgf] {
    list-style: none;
    display: grid;
    gap: var(--fd-space-3);
    margin: 0;
    padding: 0;
}

.fd-home-hero__trust-list li[b-y57xyrymgf] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-3);
    padding: var(--fd-space-3) var(--fd-space-4);
    border-radius: var(--fd-radius-md);
    background-color: var(--fd-color-surface);
    border: 1px solid var(--fd-color-border);
    box-shadow: var(--fd-shadow-sm);
}

.fd-home-hero__trust-list li[b-y57xyrymgf]::before {
    content: "•";
    color: var(--fd-color-accent);
    font-size: 1.35rem;
}

.fd-home-categories[b-y57xyrymgf] {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(120px, 1fr);
    gap: var(--fd-space-3);
    overflow-x: auto;
    padding-bottom: var(--fd-space-2);
    scrollbar-width: thin;
    scroll-snap-type: x mandatory;
}

.fd-home-categories__item[b-y57xyrymgf] {
    display: grid;
    gap: var(--fd-space-2);
    justify-items: center;
    text-align: center;
    padding: var(--fd-space-3);
    background: transparent;
    border: none;
    color: inherit;
    text-decoration: none;
    scroll-snap-align: start;
    transition: transform var(--fd-transition-fast);
}

.fd-home-categories__item:hover[b-y57xyrymgf],
.fd-home-categories__item:focus-visible[b-y57xyrymgf] {
    transform: translateY(-2px);
    text-decoration: none;
}

.fd-home-categories__item:focus-visible[b-y57xyrymgf] {
    outline: 2px solid var(--fd-color-primary);
    outline-offset: 4px;
    border-radius: var(--fd-radius-lg);
}

.fd-home-categories__avatar[b-y57xyrymgf] {
    width: 5rem;
    height: 5rem;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, var(--fd-color-green-100), var(--fd-color-cream-100));
    color: var(--fd-color-primary-strong);
    box-shadow: var(--fd-shadow-sm);
    font-size: 1.75rem;
    line-height: 1;
}

.fd-home-categories__item:hover .fd-home-categories__avatar[b-y57xyrymgf],
.fd-home-categories__item:focus-visible .fd-home-categories__avatar[b-y57xyrymgf] {
    box-shadow: var(--fd-shadow-md);
}

.fd-home-categories__name[b-y57xyrymgf] {
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-text);
    font-size: var(--fd-text-sm);
}

.fd-home-featured__header[b-y57xyrymgf] {
    display: grid;
    gap: var(--fd-space-3);
    margin-bottom: var(--fd-space-5);
}

.fd-home-featured-grid[b-y57xyrymgf] {
    grid-template-columns: 1fr;
}

.fd-home-usp-grid[b-y57xyrymgf] {
    align-items: stretch;
}

.fd-home-story-strip[b-y57xyrymgf] {
    display: grid;
    gap: var(--fd-space-4);
    margin-top: var(--fd-space-6);
    padding: var(--fd-space-5);
    border-radius: var(--fd-radius-lg);
    background: linear-gradient(135deg, var(--fd-color-surface), var(--fd-color-surface-alt));
    border: 1px solid var(--fd-color-border);
}

.fd-home-tech-note[b-y57xyrymgf] {
    margin-top: var(--fd-space-4);
    padding: var(--fd-space-4);
    border-radius: var(--fd-radius-md);
    border: 1px dashed var(--fd-color-border);
    background-color: rgba(255, 255, 255, 0.55);
}

.fd-home-tech-note__text[b-y57xyrymgf] {
    margin: var(--fd-space-2) 0 0;
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
}

@media (min-width: 768px) {
    .fd-home-hero[b-y57xyrymgf] {
        grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
        align-items: center;
    }

    .fd-home-categories[b-y57xyrymgf] {
        grid-auto-flow: initial;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        overflow: visible;
        /* A csoport összefogott egységként olvasódjon, ne feszüljön szélről szélre. */
        max-width: 48rem;
        margin-inline: auto;
    }

    .fd-home-featured__header[b-y57xyrymgf],
    .fd-home-story-strip[b-y57xyrymgf] {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
    }

    .fd-home-featured-grid[b-y57xyrymgf] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .fd-home-hero[b-y57xyrymgf] {
        grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
        gap: var(--fd-space-7);
    }

    .fd-home-hero-section[b-y57xyrymgf] {
        padding-top: var(--fd-space-6);
    }

    .fd-home-hero__visual[b-y57xyrymgf] {
        min-height: 520px;
    }

    .fd-home-hero__title[b-y57xyrymgf] {
        font-size: calc(var(--fd-text-4xl) + 0.5rem);
    }

    .fd-home-featured-grid[b-y57xyrymgf] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
/* /Components/Pages/MealPlanDetail.razor.rz.scp.css */
.fd-meal-plan-detail-page[b-vtekkixjrf] {
    display: grid;
    gap: var(--fd-space-5);
}

.fd-meal-plan-detail-page__status[b-vtekkixjrf] {
    margin: 0;
    color: var(--fd-color-text-muted);
}

.fd-meal-plan-detail-page__status--error[b-vtekkixjrf] {
    display: grid;
    gap: var(--fd-space-4);
    justify-items: start;
    color: var(--fd-color-ink-700);
}

.fd-meal-plan-detail-page__missing[b-vtekkixjrf] {
    display: grid;
    gap: var(--fd-space-4);
    justify-items: start;
    max-width: 60ch;
}

.fd-meal-plan-detail-page__missing h1[b-vtekkixjrf] {
    margin: 0;
}

.fd-meal-plan-detail-page__missing p[b-vtekkixjrf] {
    margin: 0;
    color: var(--fd-color-ink-700);
}

/* ── Article ─────────────────────────────────────────────────────────────── */
.fd-meal-plan-detail[b-vtekkixjrf] {
    display: grid;
    gap: var(--fd-space-6);
}

.fd-meal-plan-detail__header[b-vtekkixjrf] {
    display: grid;
    gap: var(--fd-space-3);
    max-width: 780px;
}

.fd-meal-plan-detail__eyebrow[b-vtekkixjrf] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-accent-strong);
}

.fd-meal-plan-detail__title[b-vtekkixjrf] {
    margin: 0;
}

.fd-meal-plan-detail__start[b-vtekkixjrf] {
    margin: 0;
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
}

.fd-meal-plan-detail__description[b-vtekkixjrf] {
    margin: 0;
    color: var(--fd-color-ink-700);
    white-space: pre-wrap;
}

/* ── Nutrition summary (mirrors the recipe detail nutrition grid) ─────────── */
.fd-meal-plan-detail__nutrition[b-vtekkixjrf] {
    display: grid;
    gap: var(--fd-space-3);
    padding: var(--fd-space-5);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-lg);
    background-color: var(--fd-color-surface);
}

.fd-meal-plan-detail__nutrition-title[b-vtekkixjrf] {
    margin: 0;
    font-size: var(--fd-text-md);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-ink-900);
}

.fd-meal-plan-detail__nutrition-grid[b-vtekkixjrf] {
    display: grid;
    gap: var(--fd-space-3);
    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
}

.fd-meal-plan-detail__nutrition-cell[b-vtekkixjrf] {
    display: grid;
    gap: 0.15rem;
}

.fd-meal-plan-detail__nutrition-label[b-vtekkixjrf] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--fd-color-text-muted);
}

.fd-meal-plan-detail__nutrition-value[b-vtekkixjrf] {
    font-size: var(--fd-text-lg);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-ink-900);
}

.fd-meal-plan-detail__nutrition-note[b-vtekkixjrf] {
    margin: 0;
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text-muted);
}

/* ── Days + meals ────────────────────────────────────────────────────────── */
.fd-meal-plan-detail__days[b-vtekkixjrf] {
    display: grid;
    gap: var(--fd-space-4);
}

.fd-meal-plan-day[b-vtekkixjrf] {
    display: grid;
    gap: var(--fd-space-3);
    padding: var(--fd-space-5);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-lg);
    background-color: var(--fd-color-surface);
    box-shadow: var(--fd-shadow-sm);
}

.fd-meal-plan-day__head[b-vtekkixjrf] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--fd-space-2);
    padding-bottom: var(--fd-space-3);
    border-bottom: 1px solid var(--fd-color-border);
}

.fd-meal-plan-day__label[b-vtekkixjrf] {
    margin: 0;
    font-size: var(--fd-text-lg);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-ink-900);
}

.fd-meal-plan-day__kcal[b-vtekkixjrf] {
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-medium);
    color: var(--fd-color-accent-strong);
}

.fd-meal-plan-day__meals[b-vtekkixjrf] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--fd-space-3);
}

.fd-meal-plan-meal[b-vtekkixjrf] {
    display: grid;
    grid-template-columns: minmax(84px, 132px) 1fr;
    gap: var(--fd-space-3);
    align-items: baseline;
}

.fd-meal-plan-meal__slot[b-vtekkixjrf] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-text-muted);
}

.fd-meal-plan-meal__body[b-vtekkixjrf] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--fd-space-2) var(--fd-space-3);
}

.fd-meal-plan-meal__recipe[b-vtekkixjrf] {
    font-weight: var(--fd-weight-medium);
    color: var(--fd-color-ink-900);
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.fd-meal-plan-meal__recipe:hover[b-vtekkixjrf],
.fd-meal-plan-meal__recipe:focus-visible[b-vtekkixjrf] {
    color: var(--fd-color-accent-strong);
}

.fd-meal-plan-meal__freetext[b-vtekkixjrf] {
    color: var(--fd-color-ink-900);
}

.fd-meal-plan-meal__servings[b-vtekkixjrf] {
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text-muted);
}

.fd-meal-plan-meal__orphan[b-vtekkixjrf] {
    font-style: italic;
    color: var(--fd-color-text-muted);
}

.fd-meal-plan-meal__kcal[b-vtekkixjrf] {
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text-muted);
    white-space: nowrap;
}

@media (max-width: 32rem) {
    .fd-meal-plan-meal[b-vtekkixjrf] {
        grid-template-columns: 1fr;
        gap: 0.15rem;
    }
}
/* /Components/Pages/MealPlans.razor.rz.scp.css */
.fd-meal-plans-page[b-xnrhf9k1vk] {
    display: grid;
    gap: var(--fd-space-5);
}

.fd-meal-plans-page__hero[b-xnrhf9k1vk] {
    display: grid;
    gap: var(--fd-space-3);
    max-width: 780px;
}

.fd-meal-plans-page__eyebrow[b-xnrhf9k1vk] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-accent-strong);
}

.fd-meal-plans-page__title[b-xnrhf9k1vk],
.fd-meal-plans-page__lead[b-xnrhf9k1vk] {
    margin: 0;
}

.fd-meal-plans-page__status[b-xnrhf9k1vk] {
    margin: 0;
    color: var(--fd-color-text-muted);
}

.fd-meal-plans-page__status--error[b-xnrhf9k1vk] {
    color: var(--fd-color-ink-700);
}

.fd-meal-plans-page__empty[b-xnrhf9k1vk] {
    display: grid;
    gap: var(--fd-space-4);
    justify-items: start;
    padding: var(--fd-space-6);
    border: 1px dashed var(--fd-color-border);
    border-radius: var(--fd-radius-lg);
    background-color: var(--fd-color-surface);
}

.fd-meal-plans-page__empty-text[b-xnrhf9k1vk] {
    margin: 0;
    max-width: 60ch;
    color: var(--fd-color-ink-700);
}

.fd-meal-plans-page__empty-actions[b-xnrhf9k1vk] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fd-space-3);
}

.fd-meal-plans-page__list[b-xnrhf9k1vk] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--fd-space-4);
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

.fd-meal-plan-card[b-xnrhf9k1vk] {
    display: grid;
    gap: var(--fd-space-4);
    align-content: start;
    height: 100%;
    padding: var(--fd-space-5);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-lg);
    background-color: var(--fd-color-surface);
    box-shadow: var(--fd-shadow-sm);
    text-decoration: none;
    color: inherit;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.fd-meal-plan-card:hover[b-xnrhf9k1vk],
.fd-meal-plan-card:focus-visible[b-xnrhf9k1vk] {
    border-color: var(--fd-color-accent-strong);
    box-shadow: var(--fd-shadow-md);
    transform: translateY(-2px);
}

.fd-meal-plan-card__title[b-xnrhf9k1vk] {
    margin: 0;
    font-size: var(--fd-text-lg);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-ink-900);
}

.fd-meal-plan-card__meta[b-xnrhf9k1vk] {
    margin: 0;
    display: grid;
    gap: var(--fd-space-3);
    grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
}

.fd-meal-plan-card__meta-cell[b-xnrhf9k1vk] {
    display: grid;
    gap: 0.15rem;
}

.fd-meal-plan-card__meta-cell dt[b-xnrhf9k1vk] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--fd-color-text-muted);
}

.fd-meal-plan-card__meta-cell dd[b-xnrhf9k1vk] {
    margin: 0;
    font-weight: var(--fd-weight-medium);
    color: var(--fd-color-ink-900);
}

.fd-meal-plan-card__cta[b-xnrhf9k1vk] {
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-accent-strong);
}
/* /Components/Pages/MyBookings.razor.rz.scp.css */
.fd-my-bookings-page[b-gwgf2hn7yx] {
    display: grid;
    gap: var(--fd-space-5);
}

.fd-my-bookings-page__hero[b-gwgf2hn7yx] {
    display: grid;
    gap: var(--fd-space-3);
    max-width: 780px;
}

.fd-my-bookings-page__eyebrow[b-gwgf2hn7yx] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-accent-strong);
}

.fd-my-bookings-page__title[b-gwgf2hn7yx],
.fd-my-bookings-page__lead[b-gwgf2hn7yx] {
    margin: 0;
}

.fd-my-bookings-page__status[b-gwgf2hn7yx] {
    margin: 0;
    color: var(--fd-color-text-muted);
}

.fd-my-bookings-page__status--error[b-gwgf2hn7yx] {
    display: grid;
    gap: var(--fd-space-4);
    justify-items: start;
    color: var(--fd-color-ink-700);
}

.fd-my-bookings-page__empty[b-gwgf2hn7yx] {
    display: grid;
    gap: var(--fd-space-4);
    justify-items: start;
    padding: var(--fd-space-6);
    border: 1px dashed var(--fd-color-border);
    border-radius: var(--fd-radius-lg);
    background-color: var(--fd-color-surface);
}

.fd-my-bookings-page__empty-text[b-gwgf2hn7yx] {
    margin: 0;
    max-width: 52ch;
    color: var(--fd-color-ink-700);
}

.fd-my-bookings-page__toolbar[b-gwgf2hn7yx] {
    display: flex;
    justify-content: flex-start;
}

.fd-my-bookings-page__list[b-gwgf2hn7yx] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--fd-space-4);
}

.fd-my-bookings-card[b-gwgf2hn7yx] {
    display: grid;
    gap: var(--fd-space-4);
    padding: var(--fd-space-5);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-lg);
    background-color: var(--fd-color-surface);
    box-shadow: var(--fd-shadow-sm);
}

.fd-my-bookings-card__head[b-gwgf2hn7yx] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--fd-space-2);
}

.fd-my-bookings-card__service[b-gwgf2hn7yx] {
    margin: 0;
    font-size: var(--fd-text-lg);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-ink-900);
}

.fd-my-bookings-card__received[b-gwgf2hn7yx] {
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text-muted);
}

.fd-my-bookings-card__details[b-gwgf2hn7yx] {
    margin: 0;
    display: grid;
    gap: var(--fd-space-3);
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}

.fd-my-bookings-card__detail[b-gwgf2hn7yx] {
    display: grid;
    gap: 0.15rem;
}

.fd-my-bookings-card__detail dt[b-gwgf2hn7yx] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--fd-color-text-muted);
}

.fd-my-bookings-card__detail dd[b-gwgf2hn7yx] {
    margin: 0;
    font-weight: var(--fd-weight-medium);
    color: var(--fd-color-ink-900);
}

.fd-my-bookings-card__notes[b-gwgf2hn7yx] {
    margin: 0;
    padding-top: var(--fd-space-3);
    border-top: 1px solid var(--fd-color-border);
    color: var(--fd-color-ink-700);
    white-space: pre-wrap;
}
/* /Components/Pages/RecipeDetail.razor.rz.scp.css */
/* A lap függőleges ritmusa (szekció-közök) GLOBÁLISAN él a site.css-ben:
   `.fd-recipe-detail-page .fd-section__body`. Itt scoped szabállyal NEM megoldható, mert a
   .fd-recipe-detail-page a <Section ExtraClass> elemére kerül (nincs [b-hash] scope-attribútuma),
   és a tartalom a Section belső .fd-section__body-jában van. */

.fd-recipe-detail-page__missing[b-h1d0whlsps],
.fd-recipe-detail-page__content-card[b-h1d0whlsps],
.fd-recipe-detail-page__summary[b-h1d0whlsps] {
    padding: var(--fd-space-5);
    border-radius: var(--fd-radius-lg);
    border: 1px solid var(--fd-color-border);
    background-color: var(--fd-color-surface);
    box-shadow: var(--fd-shadow-sm);
}

.fd-recipe-detail-page__missing[b-h1d0whlsps] {
    display: grid;
    gap: var(--fd-space-3);
    justify-items: start;
}

.fd-recipe-detail-page__missing h1[b-h1d0whlsps],
.fd-recipe-detail-page__missing p[b-h1d0whlsps] {
    margin: 0;
}

.fd-recipe-detail-page__hero[b-h1d0whlsps] {
    display: grid;
    gap: var(--fd-space-4);
}

.fd-recipe-detail-page__image-wrap[b-h1d0whlsps] {
    overflow: hidden;
    border-radius: var(--fd-radius-lg);
    border: 1px solid var(--fd-color-border);
    background-color: var(--fd-color-cream-100);
    aspect-ratio: 4 / 5;
}

.fd-recipe-detail-page__image[b-h1d0whlsps] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.fd-recipe-detail-page__summary[b-h1d0whlsps] {
    display: grid;
    gap: var(--fd-space-4);
}

.fd-recipe-detail-page__eyebrow[b-h1d0whlsps],
.fd-recipe-detail-page__section-header span[b-h1d0whlsps],
.fd-recipe-detail-page__related-header span[b-h1d0whlsps] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-accent-strong);
}

.fd-recipe-detail-page__title[b-h1d0whlsps],
.fd-recipe-detail-page__lead[b-h1d0whlsps],
.fd-recipe-detail-page__section-header h2[b-h1d0whlsps],
.fd-recipe-detail-page__related-header h2[b-h1d0whlsps] {
    margin: 0;
}

.fd-recipe-detail-page__lead[b-h1d0whlsps],
.fd-recipe-detail-page__step-note[b-h1d0whlsps],
.fd-recipe-detail-page__ingredients li span[b-h1d0whlsps] {
    color: var(--fd-color-ink-700);
}

.fd-recipe-detail-page__badges[b-h1d0whlsps],
.fd-recipe-detail-page__tag-list[b-h1d0whlsps],
.fd-recipe-detail-page__summary-actions[b-h1d0whlsps] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fd-space-2);
}

.fd-recipe-detail-page__meta-grid[b-h1d0whlsps] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--fd-space-3);
}

.fd-recipe-detail-page__meta-grid div[b-h1d0whlsps] {
    display: grid;
    gap: var(--fd-space-1);
    padding: var(--fd-space-3);
    border-radius: var(--fd-radius-md);
    background-color: var(--fd-color-surface-alt);
    border: 1px solid var(--fd-color-border);
}

.fd-recipe-detail-page__meta-grid span[b-h1d0whlsps] {
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
}

/* Three sage-tinted meta cells (idő / adag / kalória) under the hero summary.
   A gutter SZÁNDÉKOSAN --fd-space-4 (16px) marad, NEM nagyobb: a 3 cella a hero
   fél-oszlopában ül (>=768px), ott ~80px-re szűkül, és --fd-space-5-nél a tartalom
   ("Belépés" pill / "KALÓRIA") túlcsordul. 16px-en a cellák minden törésponton (360–1440px)
   láthatóan elkülönülnek — mérve, nem érnek össze. Ne bővítsd. */
.fd-recipe-detail-page__meta-cells[b-h1d0whlsps] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--fd-space-4);
}

.fd-recipe-detail-page__meta-cell[b-h1d0whlsps] {
    display: grid;
    justify-items: center;
    text-align: center;
    gap: var(--fd-space-1);
    padding: var(--fd-space-3) var(--fd-space-2);
    border-radius: var(--fd-radius-lg);
    background-color: var(--fd-color-sage-100);
    color: var(--fd-color-primary-strong);
}

.fd-recipe-detail-page__meta-cell-icon[b-h1d0whlsps] {
    display: grid;
    place-items: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background-color: var(--fd-color-surface);
    color: var(--fd-color-primary-strong);
}

.fd-recipe-detail-page__meta-cell-label[b-h1d0whlsps] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--fd-color-primary-strong);
}

.fd-recipe-detail-page__meta-cell-value[b-h1d0whlsps] {
    font-size: var(--fd-text-base);
    color: var(--fd-color-ink-900);
}

/* "Részletek" definition list — másodlagos meta-adatok. */
.fd-recipe-detail-page__details-list[b-h1d0whlsps] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--fd-space-2) var(--fd-space-4);
    margin: 0;
    padding: var(--fd-space-3) 0 0 0;
    border-top: 1px dashed var(--fd-color-border);
}

.fd-recipe-detail-page__details-list > div[b-h1d0whlsps] {
    display: flex;
    justify-content: space-between;
    gap: var(--fd-space-3);
}

.fd-recipe-detail-page__details-list dt[b-h1d0whlsps] {
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
}

.fd-recipe-detail-page__details-list dd[b-h1d0whlsps] {
    margin: 0;
    color: var(--fd-color-ink-900);
    font-weight: var(--fd-weight-semibold);
    font-size: var(--fd-text-sm);
}

/* Mobil ugrólinkek a hosszú detail oldalon — csak mobilon látszik. */
.fd-recipe-detail-page__mobile-jumps[b-h1d0whlsps] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fd-space-2);
}

.fd-recipe-detail-page__mobile-jump[b-h1d0whlsps] {
    display: inline-flex;
    align-items: center;
    padding: var(--fd-space-2) var(--fd-space-3);
    background-color: var(--fd-color-cream-50);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-pill);
    color: var(--fd-color-primary-strong);
    text-decoration: none;
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
}

.fd-recipe-detail-page__mobile-jump:hover[b-h1d0whlsps],
.fd-recipe-detail-page__mobile-jump:focus-visible[b-h1d0whlsps] {
    background-color: var(--fd-color-green-100);
    text-decoration: none;
}

@media (min-width: 1024px) {
    .fd-recipe-detail-page__mobile-jumps[b-h1d0whlsps] {
        display: none;
    }
}

/* Save button + share-row. */
.fd-recipe-detail-page__save-btn[b-h1d0whlsps] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-2);
}

.fd-recipe-detail-page__save-btn[aria-pressed="true"][b-h1d0whlsps] {
    background-color: var(--fd-color-primary-strong);
}

.fd-recipe-detail-page__save-icon[b-h1d0whlsps] {
    display: inline-flex;
    align-items: center;
    line-height: 0;
}

.fd-recipe-detail-page__share-row[b-h1d0whlsps] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--fd-space-3);
    padding-top: var(--fd-space-3);
    padding-bottom: var(--fd-space-3);
    border-top: 1px solid var(--fd-color-border);
    border-bottom: 1px solid var(--fd-color-border);
}

.fd-recipe-detail-page__share-label[b-h1d0whlsps] {
    color: var(--fd-color-ink-700);
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
}

.fd-recipe-detail-page__share-btn[b-h1d0whlsps] {
    display: inline-grid;
    place-items: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background-color: var(--fd-color-surface);
    border: 1px solid var(--fd-color-border);
    color: var(--fd-color-primary-strong);
    cursor: pointer;
    transition: background-color var(--fd-transition-base),
                box-shadow var(--fd-transition-base),
                border-color var(--fd-transition-base);
    text-decoration: none;
}

.fd-recipe-detail-page__share-btn:hover[b-h1d0whlsps],
.fd-recipe-detail-page__share-btn:focus-visible[b-h1d0whlsps] {
    background-color: var(--fd-color-green-100);
    border-color: var(--fd-color-primary);
    box-shadow: var(--fd-shadow-sm);
    text-decoration: none;
}

.fd-recipe-detail-page__share-confirm[b-h1d0whlsps] {
    color: var(--fd-color-primary-strong);
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
}

/* Nutrition section. */
.fd-recipe-detail-page__nutrition[b-h1d0whlsps] {
    padding: var(--fd-space-5);
    border-radius: var(--fd-radius-lg);
    border: 1px solid var(--fd-color-border);
    background-color: var(--fd-color-surface);
    box-shadow: var(--fd-shadow-sm);
    display: grid;
    gap: var(--fd-space-3);
}

.fd-recipe-detail-page__nutrition-title[b-h1d0whlsps] {
    margin: 0;
}

/* Kitöltött (cream) tápérték-cellák. Ezek TELJES szélességű 2/3-oszlopos rácsban ülnek
   (nem a szűk hero-oszlopban), így elbírják a bővebb --fd-space-5 (24px) gutter-t anélkül,
   hogy a tartalom túlcsordulna — a kitöltött dobozok köze így egyértelműen levegős.
   (A meta-cells ezzel szemben szűk, ott 16px a biztonságos maximum — lásd fentebb.) */
.fd-recipe-detail-page__nutrition-grid[b-h1d0whlsps] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--fd-space-5);
}

.fd-recipe-detail-page__nutrition-cell[b-h1d0whlsps] {
    display: grid;
    gap: var(--fd-space-1);
    padding: var(--fd-space-3);
    border-radius: var(--fd-radius-md);
    background-color: var(--fd-color-cream-50);
    border: 1px solid var(--fd-color-border);
}

.fd-recipe-detail-page__nutrition-label[b-h1d0whlsps] {
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
}

.fd-recipe-detail-page__nutrition-value[b-h1d0whlsps] {
    color: var(--fd-color-ink-900);
    font-size: var(--fd-text-lg);
}

.fd-recipe-detail-page__nutrition-context[b-h1d0whlsps] {
    margin: 0;
    padding: var(--fd-space-2) var(--fd-space-3);
    border-radius: var(--fd-radius-md);
    background: linear-gradient(135deg, rgba(107, 166, 41, 0.12), rgba(230, 243, 218, 0.85));
    border: 1px solid rgba(61, 122, 42, 0.18);
    color: var(--fd-color-ink-700);
    font-size: var(--fd-text-sm);
}

.fd-recipe-detail-page__nutrition-context strong[b-h1d0whlsps] {
    color: var(--fd-color-primary-strong);
}

.fd-recipe-detail-page__nutrition-note[b-h1d0whlsps] {
    margin: 0;
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
}

/* Login-gate teaser — anonim látogatónak a kalória/tápérték + adag-skálázó + fiókba mentés helyett.
   A nutrition-kártyával egységes felület (surface + keret + árnyék), de invitáló, sage-akcentussal. */
.fd-recipe-detail-page__teaser[b-h1d0whlsps] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: var(--fd-space-4);
    padding: var(--fd-space-5);
    border-radius: var(--fd-radius-lg);
    border: 1px solid var(--fd-color-border);
    background: linear-gradient(135deg, var(--fd-color-sage-100), var(--fd-color-surface) 70%);
    box-shadow: var(--fd-shadow-sm);
}

.fd-recipe-detail-page__teaser-icon[b-h1d0whlsps] {
    display: grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    flex: none;
    border-radius: 50%;
    background-color: var(--fd-color-surface);
    color: var(--fd-color-primary-strong);
    box-shadow: var(--fd-shadow-sm);
}

.fd-recipe-detail-page__teaser-body[b-h1d0whlsps] {
    display: grid;
    gap: var(--fd-space-2);
    flex: 1 1 16rem;
    min-width: 0;
}

.fd-recipe-detail-page__teaser-title[b-h1d0whlsps] {
    margin: 0;
    color: var(--fd-color-ink-900);
}

.fd-recipe-detail-page__teaser-text[b-h1d0whlsps] {
    margin: 0;
    color: var(--fd-color-ink-700);
    max-width: 52ch;
}

.fd-recipe-detail-page__teaser-actions[b-h1d0whlsps] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fd-space-3);
    margin-top: var(--fd-space-2);
}

/* Kalória meta-cella lezárva (anonim) — kattintható "Belépés" pill a "—" érték helyett. */
.fd-recipe-detail-page__meta-lock[b-h1d0whlsps] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-1);
    padding: var(--fd-space-1) var(--fd-space-3);
    border-radius: var(--fd-radius-pill);
    background-color: var(--fd-color-surface);
    border: 1px solid var(--fd-color-primary);
    color: var(--fd-color-primary-strong);
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    text-decoration: none;
    line-height: 1;
}

.fd-recipe-detail-page__meta-lock:hover[b-h1d0whlsps],
.fd-recipe-detail-page__meta-lock:focus-visible[b-h1d0whlsps] {
    background-color: var(--fd-color-green-100);
    text-decoration: none;
}

.fd-recipe-detail-page__content-grid[b-h1d0whlsps] {
    display: grid;
    gap: var(--fd-space-4);
}

.fd-recipe-detail-page__section-header[b-h1d0whlsps] {
    display: grid;
    gap: var(--fd-space-2);
    margin-bottom: var(--fd-space-4);
}

.fd-recipe-detail-page__ingredients[b-h1d0whlsps],
.fd-recipe-detail-page__steps[b-h1d0whlsps] {
    margin: 0;
    padding: 0;
}

/* Hozzávalók — lágyabb háttér + bal oldali színes accent, mennyiség kiemelve. */
.fd-recipe-detail-page__content-card:has(.fd-recipe-detail-page__ingredients)[b-h1d0whlsps] {
    background-color: var(--fd-color-cream-50);
    border-left: 4px solid var(--fd-color-primary);
}

.fd-recipe-detail-page__ingredients[b-h1d0whlsps] {
    list-style: none;
    display: grid;
    gap: var(--fd-space-3);
}

.fd-recipe-detail-page__ingredients li[b-h1d0whlsps] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--fd-space-3);
    padding: var(--fd-space-3) 0;
    border-bottom: 1px dashed var(--fd-color-border);
}

.fd-recipe-detail-page__ingredients li:first-child[b-h1d0whlsps] {
    padding-top: 0;
}

.fd-recipe-detail-page__ingredients li:last-child[b-h1d0whlsps] {
    padding-bottom: 0;
    border-bottom: 0;
}

.fd-recipe-detail-page__ingredients li > div[b-h1d0whlsps] {
    display: grid;
    gap: var(--fd-space-1);
    flex: 1;
    min-width: 0;
}

.fd-recipe-detail-page__ingredients li strong[b-h1d0whlsps] {
    color: var(--fd-color-ink-900);
    font-weight: var(--fd-weight-semibold);
    line-height: var(--fd-leading-snug);
}

.fd-recipe-detail-page__ingredients li span[b-h1d0whlsps] {
    font-size: var(--fd-text-sm);
    line-height: var(--fd-leading-snug);
}

.fd-recipe-detail-page__ingredients li em[b-h1d0whlsps] {
    font-style: normal;
    font-weight: var(--fd-weight-bold);
    color: var(--fd-color-primary-strong);
    background-color: var(--fd-color-green-100);
    border-radius: var(--fd-radius-pill);
    padding: var(--fd-space-1) var(--fd-space-3);
    font-size: var(--fd-text-sm);
    white-space: nowrap;
    flex: none;
}

/* Adag-skálázó (− 1 +) */
.fd-recipe-detail-page__servings-adjuster[b-h1d0whlsps] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-3);
    margin-bottom: var(--fd-space-4);
    padding: var(--fd-space-2) var(--fd-space-3);
    border-radius: var(--fd-radius-pill);
    background-color: var(--fd-color-surface);
    border: 1px solid var(--fd-color-border);
}

.fd-recipe-detail-page__servings-btn[b-h1d0whlsps] {
    inline-size: 2rem;
    block-size: 2rem;
    border-radius: 50%;
    border: 1px solid var(--fd-color-primary-strong);
    background-color: transparent;
    color: var(--fd-color-primary-strong);
    font-size: var(--fd-text-lg);
    line-height: 1;
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: background-color var(--fd-transition-fast);
}

.fd-recipe-detail-page__servings-btn:hover:not(:disabled)[b-h1d0whlsps],
.fd-recipe-detail-page__servings-btn:focus-visible:not(:disabled)[b-h1d0whlsps] {
    background-color: var(--fd-color-green-100);
}

.fd-recipe-detail-page__servings-btn:disabled[b-h1d0whlsps] {
    opacity: 0.4;
    cursor: not-allowed;
}

.fd-recipe-detail-page__servings-value[b-h1d0whlsps] {
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-ink-900);
    min-width: 4.5rem;
    text-align: center;
}

/* Hozzávalók — checkbox-os pipa lista. A meglévő li szelektor maradjon működőképes. */
.fd-recipe-detail-page__ingredient-check[b-h1d0whlsps] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.fd-recipe-detail-page__ingredient-label[b-h1d0whlsps] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--fd-space-3);
    width: 100%;
    cursor: pointer;
    position: relative;
    padding-left: 2rem;
}

.fd-recipe-detail-page__ingredient-label[b-h1d0whlsps]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.15rem;
    width: 1.25rem;
    height: 1.25rem;
    border: 2px solid var(--fd-color-border);
    border-radius: var(--fd-radius-sm);
    background-color: var(--fd-color-surface);
    transition: background-color var(--fd-transition-fast), border-color var(--fd-transition-fast);
}

.fd-recipe-detail-page__ingredient-check:checked + .fd-recipe-detail-page__ingredient-label[b-h1d0whlsps]::before {
    background-color: var(--fd-color-primary-strong);
    border-color: var(--fd-color-primary-strong);
}

.fd-recipe-detail-page__ingredient-check:checked + .fd-recipe-detail-page__ingredient-label[b-h1d0whlsps]::after {
    content: "";
    position: absolute;
    left: 0.42rem;
    top: 0.35rem;
    width: 0.4rem;
    height: 0.7rem;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.fd-recipe-detail-page__ingredient-check:checked + .fd-recipe-detail-page__ingredient-label strong[b-h1d0whlsps] {
    text-decoration: line-through;
    color: var(--fd-color-ink-500);
}

.fd-recipe-detail-page__ingredient-check:focus-visible + .fd-recipe-detail-page__ingredient-label[b-h1d0whlsps]::before {
    outline: 2px solid var(--fd-color-primary);
    outline-offset: 2px;
}

/* Elkészítés — számozott körök, lépés-szám tipográfiailag kiemelve, megfelelő sortávolság. */
.fd-recipe-detail-page__steps[b-h1d0whlsps] {
    list-style: none;
    display: grid;
    gap: var(--fd-space-5);
}

.fd-recipe-detail-page__steps li[b-h1d0whlsps] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: var(--fd-space-4);
    align-items: start;
    padding-bottom: var(--fd-space-5);
    border-bottom: 1px solid var(--fd-color-border);
}

.fd-recipe-detail-page__steps li:last-child[b-h1d0whlsps] {
    border-bottom: none;
    padding-bottom: 0;
}

.fd-recipe-detail-page__steps h3[b-h1d0whlsps] {
    margin: 0;
    font-size: var(--fd-text-lg);
    color: var(--fd-color-ink-900);
    line-height: var(--fd-leading-snug);
}

.fd-recipe-detail-page__steps p[b-h1d0whlsps] {
    margin: 0;
    color: var(--fd-color-ink-700);
    line-height: var(--fd-leading-normal);
    max-width: 60ch;
}

.fd-recipe-detail-page__steps div:last-child[b-h1d0whlsps] {
    display: grid;
    gap: var(--fd-space-2);
    min-width: 0;
}

.fd-recipe-detail-page__step-number[b-h1d0whlsps] {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background-color: var(--fd-color-primary-strong);
    color: #fff;
    font-family: var(--fd-font-display);
    font-weight: var(--fd-weight-bold);
    font-size: var(--fd-text-lg);
    line-height: 1;
    flex: none;
}

.fd-recipe-detail-page__step-note[b-h1d0whlsps] {
    color: var(--fd-color-accent-strong);
    font-size: var(--fd-text-sm);
    font-style: italic;
}

.fd-recipe-detail-page__info-grid[b-h1d0whlsps],
.fd-recipe-detail-page__related-grid[b-h1d0whlsps] {
    grid-template-columns: 1fr;
}

.fd-recipe-detail-page__related-section[b-h1d0whlsps] {
    display: grid;
    gap: var(--fd-space-4);
}

.fd-recipe-detail-page__related-header[b-h1d0whlsps] {
    display: grid;
    gap: var(--fd-space-3);
}

@media (min-width: 768px) {
    .fd-recipe-detail-page__image-wrap[b-h1d0whlsps] {
        aspect-ratio: 5 / 4;
    }

    .fd-recipe-detail-page__hero[b-h1d0whlsps],
    .fd-recipe-detail-page__content-grid[b-h1d0whlsps] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: start;
    }

    .fd-recipe-detail-page__meta-grid[b-h1d0whlsps] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .fd-recipe-detail-page__nutrition-grid[b-h1d0whlsps] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .fd-recipe-detail-page__related-grid[b-h1d0whlsps] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .fd-recipe-detail-page__related-header[b-h1d0whlsps] {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
    }
}

@media (min-width: 1024px) {
    /* Hozzávalók blokk sticky, hogy a hosszú lépéslista görgetése közben látható maradjon. */
    .fd-recipe-detail-page__content-grid[b-h1d0whlsps] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
        align-items: start;
    }

    .fd-recipe-detail-page__content-grid > .fd-recipe-detail-page__content-card:first-child[b-h1d0whlsps] {
        position: sticky;
        top: calc(var(--fd-header-height) + var(--fd-space-4));
        align-self: start;
    }
}

/* ---- Mobile touch ergonomics (m1, m2) ----
   The interactive controls on this public page are small by design at desktop density. On coarse
   pointers (phones/tablets) grow their tap targets toward the ~44px guideline WITHOUT enlarging the
   glyphs, so desktop layout is untouched. */
@media (pointer: coarse) {
    /* Servings steppers: 32px → 44px tap box. */
    .fd-recipe-detail-page__servings-btn[b-h1d0whlsps] {
        inline-size: 2.75rem;
        block-size: 2.75rem;
    }

    /* Share buttons: 40px → 44px tap box. */
    .fd-recipe-detail-page__share-btn[b-h1d0whlsps] {
        width: 2.75rem;
        height: 2.75rem;
    }

    /* Ingredient checkbox: the whole label is already a full-width tap target; reserve a comfortable
       row height and a slightly larger visible checkmark box so the affordance reads big enough. */
    .fd-recipe-detail-page__ingredient-label[b-h1d0whlsps] {
        min-height: 2.75rem;
        align-items: center;
    }

    .fd-recipe-detail-page__ingredient-label[b-h1d0whlsps]::before {
        width: 1.5rem;
        height: 1.5rem;
        top: 50%;
        margin-top: -0.75rem;
    }

    .fd-recipe-detail-page__ingredient-check:checked + .fd-recipe-detail-page__ingredient-label[b-h1d0whlsps]::after {
        left: 0.5rem;
        top: 50%;
        margin-top: -0.45rem;
    }
}

/* iOS zoom-on-focus guard (m2): the visually-hidden ingredient checkbox inherits a sub-16px
   font-size, which makes mobile Safari auto-zoom the page when it receives focus. Pin it to 16px;
   the input is offscreen/opacity:0 so this has no visual effect. */
.fd-recipe-detail-page__ingredient-check[b-h1d0whlsps] {
    font-size: 16px;
}
/* /Components/Pages/Recipes.razor.rz.scp.css */
.fd-recipes-page__hero[b-ovqgzw6e37] {
    display: grid;
    gap: var(--fd-space-4);
}

.fd-recipes-page__intro[b-ovqgzw6e37] {
    display: grid;
    gap: var(--fd-space-3);
    max-width: 780px;
}

.fd-recipes-page__eyebrow[b-ovqgzw6e37],
.fd-recipes-page__summary-label[b-ovqgzw6e37],
.fd-recipes-page__filter-label[b-ovqgzw6e37],
.fd-recipes-page__field span[b-ovqgzw6e37],
.fd-recipes-page__related-label[b-ovqgzw6e37] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: var(--fd-weight-semibold);
}

.fd-recipes-page__eyebrow[b-ovqgzw6e37],
.fd-recipes-page__summary-label[b-ovqgzw6e37],
.fd-recipes-page__filter-label[b-ovqgzw6e37],
.fd-recipes-page__field span[b-ovqgzw6e37] {
    color: var(--fd-color-accent-strong);
}

.fd-recipes-page__title[b-ovqgzw6e37],
.fd-recipes-page__lead[b-ovqgzw6e37],
.fd-recipes-page__summary-card p[b-ovqgzw6e37] {
    margin: 0;
}

.fd-recipes-page__lead[b-ovqgzw6e37],
.fd-recipes-page__summary-card p[b-ovqgzw6e37] {
    color: var(--fd-color-ink-700);
}

.fd-recipes-page__summary-card[b-ovqgzw6e37],
.fd-recipes-page__filters[b-ovqgzw6e37],
.fd-recipes-page__empty-state[b-ovqgzw6e37] {
    padding: var(--fd-space-5);
    border-radius: var(--fd-radius-lg);
    border: 1px solid var(--fd-color-border);
    background-color: var(--fd-color-surface);
    box-shadow: var(--fd-shadow-sm);
}

/* Konszolidált szűrő-sáv: sage háttér + lágy ritmus. A meglévő .fd-recipes-page__filters
   szelektor visszafelé kompatibilisen megmarad; ez csak az új wrapper hozzáadásával színez. */
.fd-recipes-page__filter-bar[b-ovqgzw6e37] {
    background-color: var(--fd-color-sage-50);
    border-color: var(--fd-color-sage-100);
}

.fd-recipes-page__summary-card[b-ovqgzw6e37] {
    display: grid;
    gap: var(--fd-space-2);
}

.fd-recipes-page__summary-card strong[b-ovqgzw6e37] {
    font-size: var(--fd-text-xl);
}

.fd-recipes-page__filters[b-ovqgzw6e37] {
    display: grid;
    /* space-5 (was space-4): the three filter groups each open with a small
       uppercase label, so a tighter inter-group gap let them read as one block —
       give them clear separation from one another. */
    gap: var(--fd-space-5);
}

.fd-recipes-page__filter-group[b-ovqgzw6e37],
.fd-recipes-page__toolbar[b-ovqgzw6e37] {
    display: grid;
    gap: var(--fd-space-3);
}

/* The diet group's head carries the right-aligned "Nekem valók" button (a 36px
   pill). With the default space-3 head→chips gap it crowded / overlapped the chip
   sitting directly beneath it (most visible at mid widths). Give the head extra
   clearance so the button clearly separates from the chip row. */
.fd-recipes-page__filter-group--diet[b-ovqgzw6e37] {
    gap: var(--fd-space-4);
}

.fd-recipes-page__chips[b-ovqgzw6e37] {
    display: flex;
    gap: var(--fd-space-2);
    overflow-x: auto;
    /* overflow-x:auto forces overflow-y to compute to auto too, so this row is a
       scroll container that clips vertically — which cut off the chips' hover lift
       (translateY -1px) + drop shadow (var(--fd-shadow-md)) at the top edge. Pad the
       scrollport on every side so the lifted chip and its shadow render inside the
       (un-clipped) padding box, then pull the box back with an equal negative margin
       so the chips stay flush with the rest of the column and horizontal scroll when
       the chips overflow is preserved. */
    padding: var(--fd-space-3);
    margin: calc(var(--fd-space-3) * -1);
}

/* Étrend fejléc: a "Étrend" címke + a jobbra igazított "Nekem valók" gomb egy sorban. */
.fd-recipes-page__diet-head[b-ovqgzw6e37] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--fd-space-3);
    flex-wrap: wrap;
}

/* "Nekem valók" gomb: pill, akcentus-keret, a chip-nyelvezethez illeszkedik. */
.fd-recipes-page__nekem-valok[b-ovqgzw6e37] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-2);
    min-height: 36px;
    padding: 0.4rem 0.9rem;
    border-radius: var(--fd-radius-pill);
    border: 1.5px solid var(--fd-color-accent);
    background-color: var(--fd-color-surface);
    color: var(--fd-color-accent-strong);
    font: inherit;
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    cursor: pointer;
    transition:
        background-color var(--fd-transition-fast),
        color var(--fd-transition-fast),
        box-shadow var(--fd-transition-fast),
        transform var(--fd-transition-fast);
}

.fd-recipes-page__nekem-valok:hover[b-ovqgzw6e37] {
    background-color: var(--fd-color-accent);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: var(--fd-shadow-md);
}

.fd-recipes-page__nekem-valok:focus-visible[b-ovqgzw6e37] {
    outline: 2px solid var(--fd-color-accent);
    outline-offset: 2px;
}

/* Finom hint, amikor a profilon nincs beállított étrendi preferencia. */
.fd-recipes-page__diet-hint[b-ovqgzw6e37] {
    margin: 0;
    font-size: var(--fd-text-sm);
    color: var(--fd-color-ink-700);
}

.fd-recipes-page__diet-hint a[b-ovqgzw6e37] {
    color: var(--fd-color-primary-strong);
    font-weight: var(--fd-weight-semibold);
}

/* "Szűrők törlése" — a keresőmező mellé simuló link-gomb. */
.fd-recipes-page__toolbar[b-ovqgzw6e37] {
    align-items: end;
}

.fd-recipes-page__clear-filters[b-ovqgzw6e37] {
    justify-self: start;
    padding: 0.4rem 0;
    border: none;
    background: none;
    color: var(--fd-color-primary-strong);
    font: inherit;
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    text-decoration: underline;
    cursor: pointer;
}

.fd-recipes-page__clear-filters:hover[b-ovqgzw6e37] {
    color: var(--fd-color-primary);
}

.fd-recipes-page__clear-filters:focus-visible[b-ovqgzw6e37] {
    outline: 2px solid var(--fd-color-accent);
    outline-offset: 2px;
    border-radius: var(--fd-radius-sm);
}

/* Üres állapot reset gomb — másodlagos, kontúros stílus. */
.fd-recipes-page__empty-reset[b-ovqgzw6e37] {
    align-self: start;
    min-height: 44px;
    padding: var(--fd-space-3) var(--fd-space-5);
    border-radius: var(--fd-radius-md);
    border: 1.5px solid var(--fd-color-primary);
    background-color: var(--fd-color-surface);
    color: var(--fd-color-primary-strong);
    font: inherit;
    font-weight: var(--fd-weight-semibold);
    cursor: pointer;
    transition: background-color var(--fd-transition-fast), color var(--fd-transition-fast);
}

.fd-recipes-page__empty-reset:hover[b-ovqgzw6e37] {
    background-color: var(--fd-color-primary);
    color: #fff;
}

.fd-recipes-page__empty-reset:focus-visible[b-ovqgzw6e37] {
    outline: 2px solid var(--fd-color-accent);
    outline-offset: 2px;
}

.fd-recipes-page__field[b-ovqgzw6e37] {
    display: grid;
    gap: var(--fd-space-2);
}

.fd-recipes-page__field select[b-ovqgzw6e37],
.fd-recipes-page__field input[b-ovqgzw6e37] {
    width: 100%;
    min-height: 44px;
    border-radius: var(--fd-radius-md);
    border: 1px solid var(--fd-color-border);
    background-color: var(--fd-color-surface-alt);
    color: var(--fd-color-text);
    font: inherit;
    padding: var(--fd-space-3) var(--fd-space-4);
    transition: border-color var(--fd-transition-base), box-shadow var(--fd-transition-base);
}

.fd-recipes-page__field select:hover[b-ovqgzw6e37],
.fd-recipes-page__field input:hover[b-ovqgzw6e37] {
    border-color: var(--fd-color-ink-300);
}

.fd-recipes-page__field select:focus[b-ovqgzw6e37],
.fd-recipes-page__field select:focus-visible[b-ovqgzw6e37],
.fd-recipes-page__field input:focus[b-ovqgzw6e37],
.fd-recipes-page__field input:focus-visible[b-ovqgzw6e37] {
    outline: none;
    border-color: var(--fd-color-primary);
    box-shadow: var(--fd-input-focus-shadow);
}

.fd-recipes-page__grid[b-ovqgzw6e37] {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    /* space-5 (was the .fd-grid default space-4): the results cards carry space-5
       (24px) inner padding, so a 16px inter-card gutter read narrower than the
       card's own breathing room — the large cards looked cramped side by side.
       Match the gutter to the padding rhythm. Single 24px value is comfortable at
       every width, incl. the single-column mobile stack (not over-spaced). */
    gap: var(--fd-space-5);
}

.fd-recipe-skeleton[b-ovqgzw6e37] {
    display: flex;
    flex-direction: column;
    border-radius: var(--fd-radius-lg);
    background-color: var(--fd-color-surface);
    border: 1px solid var(--fd-color-border);
    overflow: hidden;
    animation: pulse-b-ovqgzw6e37 1.5s infinite ease-in-out;
}

.fd-recipe-skeleton__image[b-ovqgzw6e37] {
    aspect-ratio: 4/3;
    background-color: var(--fd-color-surface-alt);
}

.fd-recipe-skeleton__content[b-ovqgzw6e37] {
    padding: var(--fd-space-4);
    display: grid;
    gap: var(--fd-space-2);
}

.fd-recipe-skeleton__title[b-ovqgzw6e37] {
    height: 24px;
    width: 80%;
    background-color: var(--fd-color-surface-alt);
    border-radius: var(--fd-radius-sm);
}

.fd-recipe-skeleton__meta[b-ovqgzw6e37] {
    height: 16px;
    width: 60%;
    background-color: var(--fd-color-surface-alt);
    border-radius: var(--fd-radius-sm);
}

@keyframes pulse-b-ovqgzw6e37 {
    0% { opacity: 0.6; }
    50% { opacity: 1; }
    100% { opacity: 0.6; }
}

.fd-recipes-page__load-more[b-ovqgzw6e37] {
    display: flex;
    justify-content: center;
}

.fd-recipes-page__load-more-button[b-ovqgzw6e37] {
    min-height: 48px;
    padding: 0.8rem 1.5rem;
    border-radius: var(--fd-radius-pill);
    border: 1px solid var(--fd-color-primary-strong);
    background-color: transparent;
    color: var(--fd-color-primary-strong);
    font: inherit;
    font-weight: var(--fd-weight-semibold);
    cursor: pointer;
    transition: background-color var(--fd-transition-fast), color var(--fd-transition-fast), transform var(--fd-transition-fast);
}

.fd-recipes-page__load-more-button:hover[b-ovqgzw6e37],
.fd-recipes-page__load-more-button:focus-visible[b-ovqgzw6e37] {
    background-color: var(--fd-color-green-100);
    transform: translateY(-1px);
}

.fd-recipes-page__empty-state[b-ovqgzw6e37] {
    display: grid;
    gap: var(--fd-space-3);
    justify-items: start;
}

.fd-recipes-page__empty-state p[b-ovqgzw6e37],
.fd-recipes-page__empty-state h2[b-ovqgzw6e37] {
    margin: 0;
}

@media (min-width: 768px) {
    .fd-recipes-page__hero[b-ovqgzw6e37],
    .fd-recipes-page__toolbar[b-ovqgzw6e37] {
        grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
        align-items: end;
    }

    .fd-recipes-page__field--search[b-ovqgzw6e37] {
        grid-column: span 2;
    }
}

@media (min-width: 1024px) {
    .fd-recipes-page__hero[b-ovqgzw6e37] {
        grid-template-columns: minmax(0, 1fr) 320px;
        align-items: start;
    }

    .fd-recipes-page__toolbar[b-ovqgzw6e37] {
        grid-template-columns: 220px minmax(0, 1fr);
    }

    .fd-recipes-page__field--search[b-ovqgzw6e37] {
        grid-column: auto;
    }
}
/* /Components/Pages/SavedRecipes.razor.rz.scp.css */
.fd-saved-recipes-page[b-bmb9usj8tz] {
    display: grid;
    gap: var(--fd-space-5);
}

.fd-saved-recipes-page__hero[b-bmb9usj8tz] {
    display: grid;
    gap: var(--fd-space-3);
    max-width: 780px;
}

.fd-saved-recipes-page__eyebrow[b-bmb9usj8tz] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-accent-strong);
}

.fd-saved-recipes-page__title[b-bmb9usj8tz],
.fd-saved-recipes-page__lead[b-bmb9usj8tz] {
    margin: 0;
}

/*
    auto-FILL (not auto-fit) so a single/few saved cards keep the ~300px card width instead of
    stretching to fill the row; empty tracks stay collapsed. Matches the public recipe-card sizing.
*/
.fd-saved-recipes-page__grid[b-bmb9usj8tz] {
    grid-template-columns: repeat(auto-fill, minmax(280px, 320px));
    justify-content: start;
}

.fd-saved-recipes-page__status[b-bmb9usj8tz] {
    margin: 0;
    color: var(--fd-color-text-muted);
}

.fd-saved-recipes-page__status--error[b-bmb9usj8tz] {
    display: grid;
    gap: var(--fd-space-4);
    justify-items: start;
    color: var(--fd-color-ink-700);
}

.fd-saved-recipes-page__empty[b-bmb9usj8tz] {
    display: grid;
    gap: var(--fd-space-4);
    justify-items: start;
    padding: var(--fd-space-6);
    border: 1px dashed var(--fd-color-border);
    border-radius: var(--fd-radius-lg);
    background-color: var(--fd-color-surface);
}

.fd-saved-recipes-page__empty-text[b-bmb9usj8tz] {
    margin: 0;
    max-width: 52ch;
    color: var(--fd-color-ink-700);
}
/* /Components/Pages/Services.razor.rz.scp.css */
.fd-services__detail-list[b-gev9akobd7] {
    margin: 0;
    padding-left: 1.15rem;
    display: grid;
    gap: var(--fd-space-2);
    color: var(--fd-color-ink-700);
}

.fd-services__detail-list li[b-gev9akobd7] {
    line-height: var(--fd-leading-snug);
}

/* Részletes szolgáltatás blokk (kép + copy + CTA). */
.fd-services__detail-block[b-gev9akobd7] {
    display: grid;
    gap: var(--fd-space-5);
    align-items: center;
}

.fd-services__detail-visual[b-gev9akobd7] {
    border-radius: var(--fd-radius-lg);
    overflow: hidden;
    background-color: var(--fd-color-cream-100);
}

.fd-services__detail-visual img[b-gev9akobd7] {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 3 / 2;
    object-fit: cover;
}

.fd-services__detail-copy[b-gev9akobd7] {
    display: grid;
    gap: var(--fd-space-4);
}

.fd-services__detail-block-list[b-gev9akobd7] {
    margin: 0;
    padding-left: 1.15rem;
    display: grid;
    gap: var(--fd-space-2);
    color: var(--fd-color-ink-700);
}

.fd-services__detail-block-list li[b-gev9akobd7] {
    line-height: var(--fd-leading-snug);
}

.fd-services__detail-copy p[b-gev9akobd7] {
    margin: 0;
    color: var(--fd-color-ink-700);
    line-height: var(--fd-leading-normal);
}

.fd-services__detail-copy .fd-cta[b-gev9akobd7] {
    justify-self: start;
}

@media (min-width: 960px) {
    .fd-services__detail-block[b-gev9akobd7] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    }

    .fd-services__detail-block--reverse .fd-services__detail-visual[b-gev9akobd7] {
        order: 2;
    }

    .fd-services__detail-block--reverse .fd-services__detail-copy[b-gev9akobd7] {
        order: 1;
    }
}

.fd-services__booking-layout[b-gev9akobd7] {
    display: grid;
    gap: var(--fd-space-6);
}

.fd-services__booking-copy[b-gev9akobd7] {
    display: grid;
    gap: var(--fd-space-4);
}

.fd-services__booking-actions[b-gev9akobd7] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fd-space-3);
}

.fd-services__booking-form[b-gev9akobd7] {
    margin-top: var(--fd-space-6);
}

.fd-services__intro-copy[b-gev9akobd7] {
    margin: 0;
    color: var(--fd-color-ink-700);
    line-height: var(--fd-leading-normal);
    font-size: var(--fd-text-lg);
}

/* Folyamat (process steps) — számozott körök világos hierarchiával. */
.fd-services__process[b-gev9akobd7] {
    list-style: none;
    margin: 0 0 var(--fd-space-6) 0;
    padding: 0;
    display: grid;
    gap: var(--fd-space-4);
    counter-reset: fd-process;
}

.fd-services__process-step[b-gev9akobd7] {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: var(--fd-space-4);
    align-items: start;
    padding: var(--fd-space-4) var(--fd-space-5);
    background-color: var(--fd-color-surface);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-lg);
    box-shadow: var(--fd-shadow-sm);
}

.fd-services__process-number[b-gev9akobd7] {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background-color: var(--fd-color-primary);
    color: #fff;
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-xl);
    font-weight: var(--fd-weight-bold);
    line-height: 1;
    box-shadow: var(--fd-shadow-sm);
    justify-self: start;
}

.fd-services__process-body[b-gev9akobd7] {
    display: grid;
    gap: var(--fd-space-2);
}

.fd-services__process-title[b-gev9akobd7] {
    margin: 0;
    font-size: var(--fd-text-lg);
    color: var(--fd-color-ink-900);
}

.fd-services__process-copy[b-gev9akobd7] {
    margin: 0;
    color: var(--fd-color-ink-700);
    line-height: var(--fd-leading-snug);
}

@media (min-width: 768px) {
    .fd-services__process[b-gev9akobd7] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: var(--fd-space-5);
    }

    .fd-services__process-step[b-gev9akobd7] {
        grid-template-columns: 1fr;
        text-align: left;
        gap: var(--fd-space-3);
    }
}

@media (min-width: 960px) {
    .fd-services__booking-layout[b-gev9akobd7] {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
    }
}
/* /Components/Shared/AdminDonutChart.razor.rz.scp.css */
.fd-admin-donut[b-t8bols8cih] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--fd-space-4);
    width: 100%;
}

@media (min-width: 640px) {
    .fd-admin-donut[b-t8bols8cih] {
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        gap: var(--fd-space-5);
    }
}

.fd-admin-donut__chart[b-t8bols8cih] {
    position: relative;
    width: 160px;
    height: 160px;
    flex: 0 0 auto;
}

.fd-admin-donut__svg[b-t8bols8cih] {
    width: 100%;
    height: 100%;
    display: block;
}

.fd-admin-donut__track[b-t8bols8cih] {
    stroke: var(--fd-color-cream-100);
}

.fd-admin-donut__segment[b-t8bols8cih] {
    transition: stroke var(--fd-transition-fast);
}

.fd-admin-donut__center[b-t8bols8cih] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    pointer-events: none;
}

.fd-admin-donut__center-value[b-t8bols8cih] {
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-2xl);
    font-weight: var(--fd-weight-bold);
    color: var(--fd-color-text);
    line-height: var(--fd-leading-tight);
}

.fd-admin-donut__center-label[b-t8bols8cih] {
    font-size: var(--fd-text-xs);
    color: var(--fd-color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-top: 2px;
}

.fd-admin-donut__legend[b-t8bols8cih] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-2);
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
}

.fd-admin-donut__legend-item[b-t8bols8cih] {
    display: grid;
    grid-template-columns: 12px 1fr auto;
    align-items: center;
    gap: var(--fd-space-2);
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text);
}

.fd-admin-donut__legend-dot[b-t8bols8cih] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.fd-admin-donut__legend-label[b-t8bols8cih] {
    color: var(--fd-color-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fd-admin-donut__legend-value[b-t8bols8cih] {
    color: var(--fd-color-text-muted);
    font-variant-numeric: tabular-nums;
}
/* /Components/Shared/AdminIcon.razor.rz.scp.css */
.fd-admin-icon[b-1dx1nvfj70] {
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    flex: 0 0 auto;
    vertical-align: middle;
    color: currentColor;
}

.fd-admin-icon--md[b-1dx1nvfj70] {
    width: 1.5rem;
    height: 1.5rem;
}

.fd-admin-icon--lg[b-1dx1nvfj70] {
    width: 1.75rem;
    height: 1.75rem;
}
/* /Components/Shared/AdminIconPicker.razor.rz.scp.css */
/* AdminIconPicker — kompakt IKON-trigger + lebegő, csoportosított, görgethető popover.
   A trigger egy flat ghost ikon-gomb (.fd-admin-icon-btn), ami az Ikon-input VÉGÉN ül
   (input-group, trailing); a popover saját FIXED overlay rétegen nyílik (backdrop + panel),
   így kikerüli a .fd-admin-modal__body overflow-y:auto vágását. */

/* ----- Trigger (nyugalmi állapot) — a .fd-admin-icon-btn flat ghost ikon-stílusra épül -----
   A méret/szín onnan jön; itt csak az input-group-on belüli viselkedést rögzítjük: ne zsugorodjon
   és legyen egy halk fókusz-gyűrűje a modalon belül is (a globális :focus-visible csak
   .fd-admin-page-re szól, a modalra nem). */
.fd-icon-picker__trigger[b-wuuqst85bx] {
    flex: 0 0 auto;
    /* slice adm44: a megosztott .fd-admin-icon-btn 2rem (32px) magas, de a társ .fd-input 44px
       (min-height) — így a trigger alacsonyabb volt, és megtörte a mező vonalát. Itt SCOPED
       módon (csak a picker-trigger, a táblázat akció-ikonjai érintetlenek) az input magasságára
       igazítjuk: 44×44 négyzet, így a teteje/alja egy vonalban ül az inputtal. A radius
       (--fd-radius-sm) már egyezik az inputtal, a flat ghost + fókuszgyűrű marad. */
    width: 44px;
    height: 44px;
}

.fd-icon-picker__trigger:focus-visible[b-wuuqst85bx] {
    outline: 2px solid var(--fd-color-primary-strong);
    outline-offset: 2px;
}

/* ----- Overlay (nyitott állapot) — saját fixed réteg a modal FÖLÖTT ----- */
.fd-icon-picker__overlay[b-wuuqst85bx] {
    position: fixed;
    inset: 0;
    z-index: 360; /* a .fd-admin-modal (310) fölött */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--fd-space-4);
}

.fd-icon-picker__backdrop[b-wuuqst85bx] {
    position: fixed;
    inset: 0;
    background-color: rgba(31, 42, 36, 0.45);
    animation: fd-modal-backdrop-in var(--fd-transition-base) ease-out both;
}

.fd-icon-picker__popover[b-wuuqst85bx] {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 24rem;
    max-height: min(20rem, calc(100dvh - var(--fd-space-8)));
    background-color: var(--fd-color-surface);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-lg);
    box-shadow: var(--fd-shadow-lg);
    animation: fd-modal-panel-in var(--fd-transition-base) ease-out both;
}

.fd-icon-picker__popover-header[b-wuuqst85bx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--fd-space-3);
    padding: var(--fd-space-3) var(--fd-space-4);
    border-bottom: 1px solid var(--fd-color-border);
    flex: 0 0 auto;
}

.fd-icon-picker__popover-title[b-wuuqst85bx] {
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-text);
}

.fd-icon-picker__popover-close[b-wuuqst85bx] {
    appearance: none;
    background: none;
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-sm);
    width: 1.75rem;
    height: 1.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--fd-color-text-muted);
    cursor: pointer;
    flex: 0 0 auto;
    font-size: var(--fd-text-lg);
    line-height: 1;
    transition: background-color var(--fd-transition-fast), color var(--fd-transition-fast);
}

.fd-icon-picker__popover-close:hover[b-wuuqst85bx] {
    background-color: var(--fd-color-cream-100);
    color: var(--fd-color-text);
}

.fd-icon-picker__popover-close:focus-visible[b-wuuqst85bx] {
    outline: 2px solid var(--fd-color-primary-strong);
    outline-offset: 2px;
    box-shadow: var(--fd-input-focus-shadow);
}

/* ----- Görgethető tartalom: a csoportok itt görögnek belül ----- */
.fd-icon-picker__scroll[b-wuuqst85bx] {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: var(--fd-space-3) var(--fd-space-4) var(--fd-space-4);
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
}

.fd-icon-picker__group-heading[b-wuuqst85bx] {
    margin: 0 0 var(--fd-space-2);
    font-size: var(--fd-text-xs);
    font-weight: var(--fd-weight-semibold);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--fd-color-text-muted);
}

.fd-icon-picker__grid[b-wuuqst85bx] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(2.25rem, 1fr));
    gap: var(--fd-space-2);
}

.fd-icon-picker__option[b-wuuqst85bx] {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1 / 1;
    min-width: 2.25rem;
    padding: 0;
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-md);
    background-color: var(--fd-color-surface);
    cursor: pointer;
    line-height: 1;
    transition: border-color var(--fd-transition-fast),
                background-color var(--fd-transition-fast),
                transform var(--fd-transition-fast);
}

.fd-icon-picker__glyph[b-wuuqst85bx] {
    font-size: 1.25rem;
}

.fd-icon-picker__option:hover[b-wuuqst85bx] {
    border-color: var(--fd-color-primary);
    background-color: var(--fd-color-green-100);
}

.fd-icon-picker__option:focus-visible[b-wuuqst85bx] {
    outline: 2px solid var(--fd-color-primary-strong);
    outline-offset: 2px;
    box-shadow: var(--fd-input-focus-shadow);
}

.fd-icon-picker__option--active[b-wuuqst85bx] {
    border-color: var(--fd-color-primary-strong);
    background-color: var(--fd-color-green-100);
    box-shadow: inset 0 0 0 1px var(--fd-color-primary-strong);
}

@media (prefers-reduced-motion: reduce) {
    .fd-icon-picker__backdrop[b-wuuqst85bx],
    .fd-icon-picker__popover[b-wuuqst85bx],
    .fd-icon-picker__option[b-wuuqst85bx] {
        animation: none;
        transition: none;
    }
}
/* /Components/Shared/AdminImageUpload.razor.rz.scp.css */
.fd-image-upload[b-5zw3mvosfr] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-2);
}

.fd-image-upload__label[b-5zw3mvosfr] {
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-text);
}

.fd-image-upload__row[b-5zw3mvosfr] {
    display: flex;
    align-items: flex-start;
    gap: var(--fd-space-4);
    flex-wrap: wrap;
}

.fd-image-upload__preview[b-5zw3mvosfr] {
    flex: 0 0 auto;
    width: 96px;
    height: 96px;
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-md);
    background-color: var(--fd-color-cream-100);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fd-image-upload__thumb[b-5zw3mvosfr] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.fd-image-upload__placeholder[b-5zw3mvosfr] {
    color: var(--fd-color-text-muted);
    display: inline-flex;
}

.fd-image-upload__placeholder[b-5zw3mvosfr]  .fd-admin-icon {
    width: 32px;
    height: 32px;
}

.fd-image-upload__controls[b-5zw3mvosfr] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-2);
}

/* A natív InputFile chrome-ot elrejtjük; a burkoló label adja a brand-gombot. */
.fd-image-upload__button[b-5zw3mvosfr] {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.fd-image-upload__button--busy[b-5zw3mvosfr] {
    cursor: progress;
    opacity: 0.7;
}

/* The <input> is rendered by the InputFile child component, so it does NOT carry this component's
   scoped-CSS attribute — ::deep (after the host-scoped label) is required for the rule to apply,
   otherwise the native file-picker chrome shows through next to the brand label. */
.fd-image-upload__button[b-5zw3mvosfr]  .fd-image-upload__input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: inherit;
}

.fd-image-upload__hint[b-5zw3mvosfr] {
    font-size: var(--fd-text-xs);
    color: var(--fd-color-text-muted);
}

.fd-image-upload__spinner[b-5zw3mvosfr] {
    width: 14px;
    height: 14px;
    margin-right: var(--fd-space-2);
    border: 2px solid currentColor;
    border-top-color: transparent;
    border-radius: 50%;
    display: inline-block;
    animation: fd-image-upload-spin-b-5zw3mvosfr 0.7s linear infinite;
}

@keyframes fd-image-upload-spin-b-5zw3mvosfr {
    to {
        transform: rotate(360deg);
    }
}

.fd-image-upload__error[b-5zw3mvosfr] {
    margin: 0;
    font-size: var(--fd-text-sm);
    color: var(--fd-color-accent-strong);
}
/* /Components/Shared/AdminLineChart.razor.rz.scp.css */
.fd-admin-linechart[b-peg10euxnf] {
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-2);
    width: 100%;
}

.fd-admin-linechart__svg[b-peg10euxnf] {
    width: 100%;
    height: 180px;
    display: block;
}

@media (min-width: 768px) {
    .fd-admin-linechart__svg[b-peg10euxnf] {
        height: 220px;
    }
}

.fd-admin-linechart__grid[b-peg10euxnf] {
    stroke: var(--fd-color-border);
    stroke-width: 0.5;
    stroke-dasharray: 2 4;
    vector-effect: non-scaling-stroke;
}

.fd-admin-linechart__line[b-peg10euxnf] {
    fill: none;
    stroke: var(--fd-color-primary);
    stroke-width: 1.5;
    vector-effect: non-scaling-stroke;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.fd-admin-linechart__area[b-peg10euxnf] {
    fill: var(--fd-color-green-100);
    opacity: 0.55;
}

.fd-admin-linechart__dot[b-peg10euxnf] {
    fill: var(--fd-color-surface);
    stroke: var(--fd-color-primary-strong);
    stroke-width: 1.25;
    vector-effect: non-scaling-stroke;
}

.fd-admin-linechart__axis[b-peg10euxnf] {
    display: flex;
    justify-content: space-between;
    gap: var(--fd-space-2);
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-xs);
}

.fd-admin-linechart__axis-label[b-peg10euxnf] {
    flex: 1 1 auto;
    text-align: center;
}

.fd-admin-linechart__axis-label:first-child[b-peg10euxnf] { text-align: left; }
.fd-admin-linechart__axis-label:last-child[b-peg10euxnf]  { text-align: right; }
/* /Components/Shared/AdminMiniSparkline.razor.rz.scp.css */
.fd-admin-sparkline[b-00uubgwvzg] {
    display: block;
    width: 100%;
    max-width: 6rem;
    height: 1.5rem;
}

.fd-admin-sparkline__line[b-00uubgwvzg] {
    fill: none;
    stroke-width: 1.4;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.fd-admin-sparkline__area[b-00uubgwvzg] {
    opacity: 0.45;
}

.fd-admin-sparkline--green .fd-admin-sparkline__line[b-00uubgwvzg]  { stroke: var(--fd-color-primary-strong); }
.fd-admin-sparkline--green .fd-admin-sparkline__area[b-00uubgwvzg]  { fill: var(--fd-color-green-100); }

.fd-admin-sparkline--orange .fd-admin-sparkline__line[b-00uubgwvzg] { stroke: var(--fd-color-accent-strong); }
.fd-admin-sparkline--orange .fd-admin-sparkline__area[b-00uubgwvzg] { fill: var(--fd-color-orange-100); }

.fd-admin-sparkline--cream .fd-admin-sparkline__line[b-00uubgwvzg]  { stroke: var(--fd-color-ink-700); }
.fd-admin-sparkline--cream .fd-admin-sparkline__area[b-00uubgwvzg]  { fill: var(--fd-color-cream-200); }

.fd-admin-sparkline--sage .fd-admin-sparkline__line[b-00uubgwvzg]   { stroke: var(--fd-color-ink-700); }
.fd-admin-sparkline--sage .fd-admin-sparkline__area[b-00uubgwvzg]   { fill: var(--fd-color-sage-100); }
/* /Components/Shared/AdminPager.razor.rz.scp.css */
/* Shared admin-list pager. Sits in the table-card footer area: a page-size selector on the left,
   the "X–Y / Z" range status, and the numbered Előző / 1…N / Következő nav on the right. The whole
   bar wraps cleanly on narrow viewports (the size selector and the nav stack onto their own rows).
   Visual tokens mirror the rest of admin.css. */

.fd-admin-pager[b-yg0so1t43u] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--fd-space-3) var(--fd-space-5);
    padding: var(--fd-space-4) var(--fd-space-5);
    border-top: 1px solid var(--fd-color-border);
}

/* ---- Page-size selector ---- */
.fd-admin-pager__size[b-yg0so1t43u] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-2);
    flex: 0 0 auto;
}

.fd-admin-pager__size-label[b-yg0so1t43u],
.fd-admin-pager__size-suffix[b-yg0so1t43u] {
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text-muted);
    white-space: nowrap;
}

/* Compact select that reads as an inline control, not a full-width form field. ::deep so the
   admin.css .fd-input rules (which the select also carries) don't force it to the 36rem measure. */
.fd-admin-pager__size-select.fd-input[b-yg0so1t43u] {
    width: auto;
    min-width: 5rem;
    max-width: 8rem;
    min-height: 40px;
    padding-block: var(--fd-space-1);
}

/* ---- Range status ("26–50 / 60") ---- */
.fd-admin-pager__status[b-yg0so1t43u] {
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text-muted);
    white-space: nowrap;
    margin-inline-end: auto; /* push the nav to the trailing edge on wide viewports */
}

/* ---- Numbered nav ---- */
.fd-admin-pager__nav[b-yg0so1t43u] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-2);
    flex: 0 0 auto;
    flex-wrap: wrap;
}

.fd-admin-pager__pages[b-yg0so1t43u] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-1);
    margin: 0;
    padding: 0;
    list-style: none;
}

.fd-admin-pager__page[b-yg0so1t43u] {
    min-width: 2.25rem;
    text-align: center;
}

/* Current page: solid primary chip, non-interactive feel. */
.fd-admin-pager__page--current[b-yg0so1t43u] {
    pointer-events: none;
    font-weight: var(--fd-weight-semibold);
}

.fd-admin-pager__gap[b-yg0so1t43u] {
    padding-inline: var(--fd-space-1);
    color: var(--fd-color-text-muted);
    user-select: none;
}

/* Narrow viewports (e.g. 390px): let the bar stack into rows. The status keeps its own line and the
   nav wraps below the size selector. The auto margin is dropped so nothing is pushed off-screen. */
@media (max-width: 639px) {
    .fd-admin-pager[b-yg0so1t43u] {
        gap: var(--fd-space-3);
    }

    .fd-admin-pager__status[b-yg0so1t43u] {
        margin-inline-end: 0;
    }

    .fd-admin-pager__size[b-yg0so1t43u] {
        flex: 1 1 100%;
    }

    .fd-admin-pager__nav[b-yg0so1t43u] {
        flex: 1 1 100%;
        justify-content: center;
    }
}
/* /Components/Shared/AdminSideNav.razor.rz.scp.css */
/* Browser button-reset: megszünteti a natív border/background/padding-ot,
   hogy a .fd-admin-side-nav__footer-link vizuálisan ne törjön. */
.fd-admin-side-nav__footer-link[b-m9jkwu27o3] {
    appearance: none;
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    color: inherit;
    width: auto;
    box-sizing: border-box;
}

/* ===== Mobile base: drawer (off-canvas, hidden by default) ===== */
.fd-admin-side-nav[b-m9jkwu27o3] {
    background-color: var(--fd-color-surface);
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
    /* Off-canvas on mobile */
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: min(17rem, 85vw);
    z-index: 300;
    padding: var(--fd-space-4) var(--fd-space-3) var(--fd-space-4);
    overflow-y: auto;
    transform: translateX(-100%);
    transition: transform var(--fd-transition-base);
    box-shadow: var(--fd-shadow-lg);
    border-right: 1px solid var(--fd-color-border);
}

.fd-admin-side-nav--drawer-open[b-m9jkwu27o3] {
    transform: translateX(0);
}

/* Drawer brand/group-title/footer always visible in drawer */
.fd-admin-side-nav__brand[b-m9jkwu27o3],
.fd-admin-side-nav__group-title[b-m9jkwu27o3],
.fd-admin-side-nav__footer[b-m9jkwu27o3] {
    display: block;
}

.fd-admin-side-nav__group[b-m9jkwu27o3] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-1);
}

.fd-admin-side-nav__list[b-m9jkwu27o3] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 2px;
}

.fd-admin-side-nav__item[b-m9jkwu27o3] {
    width: 100%;
}

.fd-admin-side-nav__link[b-m9jkwu27o3] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-3);
    width: 100%;
    min-height: 44px;
    padding: var(--fd-space-2) var(--fd-space-3);
    border-radius: var(--fd-radius-md);
    color: var(--fd-color-text-muted);
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-medium);
    text-decoration: none;
    line-height: 1.2;
    transition: background-color var(--fd-transition-fast),
                color var(--fd-transition-fast),
                outline-offset var(--fd-transition-fast);
}

.fd-admin-side-nav__link-icon[b-m9jkwu27o3] {
    color: currentColor;
    flex: 0 0 auto;
}

.fd-admin-side-nav__link-label[b-m9jkwu27o3] {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fd-admin-side-nav__link:hover[b-m9jkwu27o3] {
    color: var(--fd-color-text);
    background-color: var(--fd-color-cream-50);
    text-decoration: none;
}

.fd-admin-side-nav__link:focus-visible[b-m9jkwu27o3] {
    outline: 2px solid var(--fd-color-primary-strong);
    outline-offset: -2px;
    background-color: var(--fd-color-cream-50);
    color: var(--fd-color-text);
    text-decoration: none;
}

.fd-admin-side-nav__link--active[b-m9jkwu27o3] {
    color: var(--fd-color-primary-strong);
    background-color: var(--fd-color-green-100);
    font-weight: var(--fd-weight-semibold);
    scroll-margin-block: var(--fd-space-4);
}

.fd-admin-side-nav__link--active:hover[b-m9jkwu27o3] {
    color: var(--fd-color-primary-strong);
    background-color: var(--fd-color-green-100);
}

.fd-admin-side-nav__link--active:focus-visible[b-m9jkwu27o3] {
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
    outline-offset: -2px;
}

.fd-admin-side-nav__link--active .fd-admin-side-nav__link-icon[b-m9jkwu27o3] {
    color: var(--fd-color-primary);
}

.fd-admin-side-nav__link:not(.fd-admin-side-nav__link--active):active[b-m9jkwu27o3] {
    background-color: var(--fd-color-cream-100);
    color: var(--fd-color-text);
}

/* ----- Brand ----- */
.fd-admin-side-nav__brand[b-m9jkwu27o3] {
    padding: 0 var(--fd-space-2) var(--fd-space-3);
    border-bottom: 1px solid var(--fd-color-border);
}

.fd-admin-side-nav__brand-link[b-m9jkwu27o3] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-2);
    color: var(--fd-color-text);
    text-decoration: none;
    border-radius: var(--fd-radius-md);
    padding: var(--fd-space-1) var(--fd-space-1);
    transition: background-color var(--fd-transition-fast),
                color var(--fd-transition-fast),
                outline-offset var(--fd-transition-fast);
}

.fd-admin-side-nav__brand-link:hover[b-m9jkwu27o3] {
    color: var(--fd-color-primary-strong);
    background-color: var(--fd-color-cream-50);
    text-decoration: none;
}

.fd-admin-side-nav__brand-link:focus-visible[b-m9jkwu27o3] {
    color: var(--fd-color-primary-strong);
    background-color: var(--fd-color-cream-50);
    outline: 2px solid var(--fd-color-primary-strong);
    /* slice adm34: normalised to 2px (was 3px) so brand / footer / nav focus rings share offset */
    outline-offset: 2px;
    text-decoration: none;
}

.fd-admin-side-nav__brand-mark[b-m9jkwu27o3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    flex: 0 0 auto;
}

/* The brand logo is a self-contained badge (its own ring) on a transparent
   background — show it directly, no coloured box behind it. */
.fd-admin-side-nav__brand-img[b-m9jkwu27o3] {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.fd-admin-side-nav__brand-text[b-m9jkwu27o3] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    line-height: 1.1;
}

.fd-admin-side-nav__brand-name[b-m9jkwu27o3] {
    font-family: var(--fd-font-display);
    font-weight: var(--fd-weight-semibold);
    font-size: var(--fd-text-lg);
    color: var(--fd-color-text);
    letter-spacing: -0.005em;
}

.fd-admin-side-nav__brand-tag[b-m9jkwu27o3] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--fd-color-text-muted);
    font-weight: var(--fd-weight-medium);
}

/* ----- Group title ----- */
.fd-admin-side-nav__group-title[b-m9jkwu27o3] {
    margin: var(--fd-space-2) var(--fd-space-3) var(--fd-space-1);
    font-size: var(--fd-text-xs);
    font-weight: var(--fd-weight-semibold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--fd-color-text-muted);
}

/* ----- Footer ----- */
.fd-admin-side-nav__footer[b-m9jkwu27o3] {
    margin-top: auto;
    padding-top: var(--fd-space-3);
    border-top: 1px solid var(--fd-color-border);
}

/* Logout is a plain, understated link — NOT a menu item: no full-width block,
   no inset accent bar, no block hover background. Subtle muted text + an icon,
   underline on hover. */
.fd-admin-side-nav__footer-link[b-m9jkwu27o3] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-2);
    margin-top: var(--fd-space-2);
    padding: var(--fd-space-1) var(--fd-space-2);
    border-radius: var(--fd-radius-sm);
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-xs);
    font-weight: var(--fd-weight-medium);
    text-decoration: none;
    transition: color var(--fd-transition-fast),
                outline-offset var(--fd-transition-fast);
}

.fd-admin-side-nav__footer-link:hover[b-m9jkwu27o3] {
    color: var(--fd-color-text);
    text-decoration: underline;
    background: none;
}

.fd-admin-side-nav__footer-link:focus-visible[b-m9jkwu27o3] {
    outline: 2px solid var(--fd-color-primary-strong);
    outline-offset: 2px;
    color: var(--fd-color-text);
    text-decoration: none;
}

/* ===== Desktop sidebar (>=1024px): sticky vertical sidebar ===== */
@media (min-width: 1024px) {
    .fd-admin-side-nav[b-m9jkwu27o3] {
        /* Reset drawer positioning */
        position: static;
        left: auto;
        bottom: auto;
        width: auto;
        transform: none;
        transition: none;
        /* Sidebar layout */
        flex-direction: column;
        border-right: 1px solid var(--fd-color-border);
        border-bottom: none;
        box-shadow: none;
        overflow-y: auto;
        padding: var(--fd-space-4) var(--fd-space-4) var(--fd-space-3) var(--fd-space-3);
        scrollbar-width: thin;
        scrollbar-color: transparent transparent;
        scrollbar-gutter: stable;
        overscroll-behavior: contain;
        scroll-snap-type: y proximity;
        scroll-padding-block-start: var(--fd-space-5);
        /* slice 28: footer is ~53px (border + space-3 + link); space-4 left items obscured — match real height */
        scroll-padding-block-end: calc(var(--fd-space-3) + 2.75rem);
        scroll-behavior: smooth;
    }

    .fd-admin-side-nav__group-title[b-m9jkwu27o3] {
        scroll-snap-align: start;
        /* slice 26 */
        scroll-margin-block-start: var(--fd-space-5);
    }

    /* slice 28: stronger group rhythm — hairline border + increased gap makes sections scannable on long sidebars */
    .fd-admin-side-nav__group + .fd-admin-side-nav__group[b-m9jkwu27o3] {
        margin-top: var(--fd-space-4);
        padding-top: var(--fd-space-2);
        border-top: 1px solid var(--fd-color-border);
    }

    .fd-admin-side-nav__link[b-m9jkwu27o3] {
        scroll-snap-align: start;
        scroll-margin-block-start: var(--fd-space-3);
    }

    .fd-admin-side-nav__link--active[b-m9jkwu27o3] {
        position: sticky;
        /* slice adm33-3: align sticky top with the point where the top fade mask becomes fully opaque (var(--fd-space-3) + 2px) so the active link visually "locks" exactly at the opaque boundary.
           slice adm34: bumped top to var(--fd-space-4) to match the recalibrated main panel top fade and soften the entrance. */
        top: var(--fd-space-4);
        z-index: 10;
        /* Sticky depth cue only — the green left accent bar is gone; selection now reads as the
           rounded green-100 highlight box. A subtle ambient shadow keeps the sticky "lock-in" legible. */
        box-shadow: 0 2px 8px color-mix(in srgb, var(--fd-color-border) 55%, transparent), 0 -1px 0 color-mix(in srgb, var(--fd-color-border) 60%, transparent);
        will-change: transform;
        /* slice adm34: explicit transition so the sticky lock-in animates the depth cue rather than snapping */
        transition: box-shadow var(--fd-transition-fast), transform var(--fd-transition-fast);
        scroll-margin-block-start: var(--fd-space-4);
        /* slice 28: mirror block-start so footer doesn't clip active item on scroll-into-view */
        scroll-margin-block-end: var(--fd-space-4);
    }

    .fd-admin-side-nav__link:focus-visible[b-m9jkwu27o3] {
        outline: 2px solid var(--fd-color-primary-strong);
        /* slice adm34: normalised desktop focus offset to 2px so brand / nav / footer focus rings agree (inset -2px remains the inline-active pattern) */
        outline-offset: 2px;
        z-index: 2;
        scroll-margin-block: var(--fd-space-5);
    }

    /* Sticky footer pinned to the sidebar bottom — solid surface (no transparency/
       backdrop-blur), a single hairline separator above it. */
    .fd-admin-side-nav__footer[b-m9jkwu27o3] {
        position: sticky;
        bottom: 0;
        background-color: var(--fd-color-surface);
        margin-top: auto;
        box-shadow: none;
        border-top: 1px solid var(--fd-color-border);
        padding-top: var(--fd-space-3);
        padding-bottom: var(--fd-space-1);
    }

    /* slice 24 */
    .fd-admin-side-nav:hover[b-m9jkwu27o3],
    .fd-admin-side-nav:focus-within[b-m9jkwu27o3] {
        scrollbar-color: var(--fd-color-border) transparent;
    }
}

@media (min-width: 1280px) {
    .fd-admin-side-nav[b-m9jkwu27o3] {
        scrollbar-gutter: stable both-edges;
    }
}

/* === Ergonomic Refinements: scroll-affordance & rhythm === */
@media (min-width: 1024px) {
    /* P1: low-opacity resting scrollbar thumb on the sidebar scroll container.
       Pairs with the existing :hover/:focus-within rule that promotes the thumb
       to the full border token. */
    .fd-admin-side-nav[b-m9jkwu27o3] {
        scrollbar-color: color-mix(in srgb, var(--fd-color-border) 35%, transparent) transparent;
    }

    /* P3: group-title contrast lift (Option B — non-sticky).
       Lifts color one notch darker than the muted token and reserves headroom
       for jump anchors landing on the title. */
    .fd-admin-side-nav__group-title[b-m9jkwu27o3] {
        color: var(--fd-color-text);
        scroll-margin-top: var(--fd-space-3);
    }

}

/* ===== Forced-colors / high-contrast fallback ===== */
@media (forced-colors: active) {
    .fd-admin-side-nav__link:focus-visible[b-m9jkwu27o3],
    .fd-admin-side-nav__footer-link:focus-visible[b-m9jkwu27o3],
    .fd-admin-side-nav__brand-link:focus-visible[b-m9jkwu27o3] {
        outline: 3px solid ButtonText;
        outline-offset: 2px;
        box-shadow: none;
    }

    .fd-admin-side-nav__link--active[b-m9jkwu27o3] {
        outline: 2px solid ButtonText;
        outline-offset: -2px;
    }

    .fd-admin-side-nav__link--active:hover[b-m9jkwu27o3] {
        outline: 2px solid ButtonText;
        outline-offset: -2px;
        box-shadow: none;
    }

    .fd-admin-side-nav__link:hover[b-m9jkwu27o3],
    .fd-admin-side-nav__footer-link:hover[b-m9jkwu27o3],
    .fd-admin-side-nav__brand-link:hover[b-m9jkwu27o3] {
        outline: 2px solid ButtonText;
        outline-offset: -2px;
        box-shadow: none;
    }

    .fd-admin-side-nav__link--active:focus-visible[b-m9jkwu27o3] {
        outline: 3px solid ButtonText;
        outline-offset: 2px;
    }

    .fd-admin-side-nav__link:active[b-m9jkwu27o3],
    .fd-admin-side-nav__footer-link:active[b-m9jkwu27o3] {
        outline: 2px solid Highlight;
        outline-offset: -2px;
        box-shadow: none;
    }

    .fd-admin-side-nav__link:hover:focus-visible[b-m9jkwu27o3],
    .fd-admin-side-nav__footer-link:hover:focus-visible[b-m9jkwu27o3] {
        outline: 3px solid ButtonText;
        outline-offset: 2px;
        box-shadow: none;
    }

    .fd-admin-side-nav__link--active:active[b-m9jkwu27o3] {
        outline: 2px solid Highlight;
        outline-offset: -2px;
        box-shadow: none;
    }

    .fd-admin-side-nav__brand-link:active[b-m9jkwu27o3] {
        outline: 2px solid Highlight;
        outline-offset: -2px;
        box-shadow: none;
    }
}

/* === Sidebar brand row with toggle === */
.fd-admin-side-nav__brand-row[b-m9jkwu27o3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--fd-space-2);
    padding: var(--fd-space-4) var(--fd-space-4) var(--fd-space-3);
    border-bottom: 1px solid var(--fd-color-border);
}

.fd-admin-side-nav__toggle-btn[b-m9jkwu27o3] {
    appearance: none;
    background: none;
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-sm);
    width: 2rem;
    height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--fd-color-text-muted);
    cursor: pointer;
    flex: 0 0 auto;
    transition: background-color var(--fd-transition-fast), color var(--fd-transition-fast);
}

.fd-admin-side-nav__toggle-btn:hover[b-m9jkwu27o3] {
    background-color: var(--fd-color-cream-100);
    color: var(--fd-color-text);
}

.fd-admin-side-nav__toggle-btn:focus-visible[b-m9jkwu27o3] {
    outline: 2px solid var(--fd-color-primary-strong);
    outline-offset: 2px;
}

/* === Collapsed state (desktop only) === */
@media (min-width: 1024px) {
    .fd-admin-side-nav--collapsed[b-m9jkwu27o3] {
        width: 3.5rem !important;
        min-width: 3.5rem !important;
        max-width: 3.5rem !important;
        flex-basis: 3.5rem !important;
        /* symmetric, tight padding so the icon rail centres cleanly at 3.5rem */
        padding-left: var(--fd-space-2);
        padding-right: var(--fd-space-2);
    }

    .fd-admin-side-nav--collapsed .fd-admin-side-nav__brand-row[b-m9jkwu27o3] {
        justify-content: center;
        padding-left: 0;
        padding-right: 0;
    }

    .fd-admin-side-nav--collapsed .fd-admin-side-nav__link-label[b-m9jkwu27o3] {
        display: none;
    }

    .fd-admin-side-nav--collapsed .fd-admin-side-nav__brand-label[b-m9jkwu27o3] {
        display: none;
    }

    /* Hide the "Menü" group title when collapsed — only the centered icon rail remains. */
    .fd-admin-side-nav--collapsed .fd-admin-side-nav__group-title[b-m9jkwu27o3] {
        display: none;
    }

    .fd-admin-side-nav--collapsed .fd-admin-side-nav__brand-link[b-m9jkwu27o3] {
        display: none;
    }

    .fd-admin-side-nav--collapsed .fd-admin-side-nav__user-info[b-m9jkwu27o3] {
        display: none;
    }

    /* Collapsed rail: every row becomes a centered, label-less icon button.
       (The links use __link — the old __nav-link selector matched nothing, so the
       icons never re-centered when collapsed.) */
    .fd-admin-side-nav--collapsed .fd-admin-side-nav__link[b-m9jkwu27o3],
    .fd-admin-side-nav--collapsed .fd-admin-side-nav__group-icon-btn[b-m9jkwu27o3],
    .fd-admin-side-nav--collapsed .fd-admin-side-nav__footer-link[b-m9jkwu27o3],
    .fd-admin-side-nav--collapsed .fd-admin-side-nav__user[b-m9jkwu27o3] {
        justify-content: center;
        gap: 0;
        padding-left: 0;
        padding-right: 0;
    }

    /* Collapsed active item: keep the rounded green-100 highlight a tidy ~square around the
       centered icon (the rail is 3.5rem wide with space-2 padding each side). Without this the
       full-width 44px-tall link would read as a tall thin bar rather than a clean highlight box. */
    .fd-admin-side-nav--collapsed .fd-admin-side-nav__link--active[b-m9jkwu27o3] {
        width: 2.5rem;
        height: 2.5rem;
        min-height: 2.5rem;
        margin-inline: auto;
    }
}

/* === User block in sidebar footer === */
.fd-admin-side-nav__user[b-m9jkwu27o3] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-2);
    padding: var(--fd-space-2) var(--fd-space-3);
}

.fd-admin-side-nav__user-avatar[b-m9jkwu27o3] {
    width: 2rem;
    height: 2rem;
    border-radius: var(--fd-radius-pill);
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
    font-size: var(--fd-text-xs);
    font-weight: var(--fd-weight-bold);
    letter-spacing: 0.05em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.fd-admin-side-nav__user-info[b-m9jkwu27o3] {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
    min-width: 0;
}

.fd-admin-side-nav__user-name[b-m9jkwu27o3] {
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fd-admin-side-nav__user-role[b-m9jkwu27o3] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--fd-color-text-muted);
    font-weight: var(--fd-weight-medium);
}


/* === Receptek section — Direction 1 ("indented children + active connector rail") ===
   Approved mockup: "Behúzott gyermekek aktív összekötő-sávval".
   Expanded = the Receptek parent is a real nav LINK (icon + label → /admin/recipes) styled like
   the top-level links; the 3 children sit always-visible and indented beneath it, bound by a
   faint vertical connector line (--fd-color-border). The active child gets a short green
   active-rail marker (--fd-color-primary) running alongside the connector + green text.
   Collapsed = the same recipes icon as a flyout trigger carrying a small MUTED right-pointing
   chevron cue (--fd-color-text-muted) on its right edge — "expands to the right (flyout)", not a
   notification — with the children in a hover/focus floating panel. */

/* Expanded parent link: Receptek now BLENDS IN as a normal top-level nav item in the MENÜ list.
   It inherits the plain .fd-admin-side-nav__link box wholesale — muted icon + muted label +
   normal medium weight + the standard cream hover. The former .parent-static emphasis (dark bold
   label + always-green book icon) is gone: the indented children + connector rail are the only
   cue that this row owns a submenu, and the active child's green ::after marker carries the
   "where am I" signal. We deliberately do NOT add any route-driven active pill to the parent —
   on a recipes route only the active child reads as active (no double highlight). The
   .fd-admin-side-nav__parent-link hook is kept solely so the collapsed @media block can swap the
   link for the icon flyout trigger; it adds no visual overrides of its own. */

/* === Expanded-mode accordion (collapsible groups) ===
   In the EXPANDED sidebar each group header is a toggle <button> (still carrying the
   .fd-admin-side-nav__link + .fd-admin-side-nav__parent-link hooks so it inherits the plain
   nav-link box and so the collapsed @media block can still swap it for the icon flyout trigger).
   The button needs the browser button-reset since it replaces an <a>. */
button.fd-admin-side-nav__parent-link[b-m9jkwu27o3] {
    appearance: none;
    background: none;
    border: none;
    font-family: inherit;
    text-align: left;
    cursor: pointer;
    /* full-width like the <a> nav-links so the WHOLE header is the toggle hit-area */
    width: 100%;
}

/* Trailing accordion chevron (expanded mode only). chevron-down points DOWN when the group is
   collapsed; it rotates 180deg to point UP when the group is open. aria-hidden in markup. */
.fd-admin-side-nav__accordion-cue[b-m9jkwu27o3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    margin-left: auto;
    color: var(--fd-color-text-muted);
    transition: transform var(--fd-transition-fast),
                color var(--fd-transition-fast);
}

/* The chevron SVG is rendered by the AdminIcon child component, so pierce the scope with ::deep. */
[b-m9jkwu27o3] .fd-admin-side-nav__accordion-cue-icon {
    width: 14px;
    height: 14px;
}

.fd-admin-side-nav__parent-link--open .fd-admin-side-nav__accordion-cue[b-m9jkwu27o3] {
    transform: rotate(180deg);
    color: var(--fd-color-text);
}

/* Accordion collapse mechanism — EXPANDED sidebar only (guarded with :not(--collapsed) so the
   icon-mode flyout, which fully re-styles the submenu in the collapsed @media block, is NEVER
   gated by accordion state). Sub-links stay in the DOM; we animate max-height + opacity and
   suppress the connector rail / pointer-events when collapsed. */
.fd-admin-side-nav:not(.fd-admin-side-nav--collapsed) .fd-admin-side-nav__submenu[b-m9jkwu27o3] {
    overflow: hidden;
    transition: max-height var(--fd-transition-base),
                opacity var(--fd-transition-fast),
                margin var(--fd-transition-base);
}

.fd-admin-side-nav:not(.fd-admin-side-nav--collapsed) .fd-admin-side-nav__submenu--open[b-m9jkwu27o3] {
    /* generous ceiling — well above the tallest group (3 sub-links + title); animates smoothly */
    max-height: 20rem;
    opacity: 1;
}

.fd-admin-side-nav:not(.fd-admin-side-nav--collapsed) .fd-admin-side-nav__submenu--collapsed[b-m9jkwu27o3] {
    max-height: 0;
    opacity: 0;
    margin-top: 0;
    margin-bottom: 0;
    pointer-events: none;
}

/* Reduced-motion: snap open/closed (no height/opacity tween). */
@media (prefers-reduced-motion: reduce) {
    .fd-admin-side-nav:not(.fd-admin-side-nav--collapsed) .fd-admin-side-nav__submenu[b-m9jkwu27o3] {
        transition: none;
    }

    .fd-admin-side-nav__accordion-cue[b-m9jkwu27o3] {
        transition: color var(--fd-transition-fast);
    }
}

/* Collapsed-only flyout trigger: a label-less icon button (the recipes AdminIcon).
   Hidden in expanded mode (the parent link replaces it); shown only when collapsed. */
.fd-admin-side-nav__group-icon-btn[b-m9jkwu27o3] {
    appearance: none;
    background: none;
    border: none;
    display: none; /* expanded default — revealed in the collapsed @media block below */
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 44px;
    padding: var(--fd-space-2) var(--fd-space-3);
    border-radius: var(--fd-radius-md);
    color: var(--fd-color-text-muted);
    cursor: pointer;
    position: relative; /* anchors the orange has-children dot */
    transition: background-color var(--fd-transition-fast),
                color var(--fd-transition-fast);
}

/* "Has-submenu" cue on the collapsed Receptek icon: a small MUTED right-pointing chevron (›) on the
   icon's right edge, vertically centered. It reads as "this expands to the right (flyout)" — NOT a
   notification badge (we deliberately dropped the old orange has-children dot, which looked like an
   alert). Muted border-token tint so it blends into the soft cream/green rail rather than shouting.
   Hidden in expanded mode (the always-open children are the affordance there); revealed in the
   collapsed @media block below. */
.fd-admin-side-nav__submenu-cue[b-m9jkwu27o3] {
    display: none;
    position: absolute;
    top: 50%;
    right: 2px;
    transform: translateY(-50%);
    color: var(--fd-color-text-muted);
    pointer-events: none;
    transition: color var(--fd-transition-fast),
                transform var(--fd-transition-fast);
}

/* The chevron SVG itself is rendered by the AdminIcon child component, so its root <svg> does NOT
   carry this component's scoped attribute — pierce with ::deep. chevron-down rotated -90deg points
   RIGHT (›). Small (~11px) so it stays a subtle affordance, not a glyph competing with the icon. */
[b-m9jkwu27o3] .fd-admin-side-nav__submenu-cue-icon {
    width: 11px;
    height: 11px;
    transform: rotate(-90deg);
}

.fd-admin-side-nav__group-icon-btn:hover[b-m9jkwu27o3] {
    background-color: var(--fd-color-cream-50);
    color: var(--fd-color-text);
}

/* On hover/active of the trigger the cue lifts slightly to the brand green and nudges right,
   reinforcing the "expands to the right" reading without ever reading as an alert. */
.fd-admin-side-nav__group-icon-btn:hover .fd-admin-side-nav__submenu-cue[b-m9jkwu27o3],
.fd-admin-side-nav__item--group:focus-within .fd-admin-side-nav__submenu-cue[b-m9jkwu27o3] {
    color: var(--fd-color-primary);
    transform: translate(1px, -50%);
}

.fd-admin-side-nav__group-icon-btn--active[b-m9jkwu27o3] {
    color: var(--fd-color-primary-strong);
    background-color: var(--fd-color-green-100);
}

.fd-admin-side-nav__group-icon-btn--active .fd-admin-side-nav__submenu-cue[b-m9jkwu27o3] {
    color: var(--fd-color-primary);
}

.fd-admin-side-nav__group-icon-btn:focus-visible[b-m9jkwu27o3] {
    outline: 2px solid var(--fd-color-primary-strong);
    outline-offset: -2px;
    background-color: var(--fd-color-cream-50);
    color: var(--fd-color-text);
}

/* Expanded submenu: always-open inline list (no accordion height animation, no flyout).
   The collapsed @media block below overrides these to turn it back into a floating panel. */
.fd-admin-side-nav__submenu[b-m9jkwu27o3] {
    list-style: none;
    margin: 2px 0 var(--fd-space-2);
    padding: 0;
    /* Always-open inline: override the legacy accordion/flyout defaults. */
    position: relative;
    max-height: none;
    overflow: visible;
    opacity: 1;
    visibility: visible;
}

/* D1 connector rail: a thin faint vertical line down the left of the children group, in the
   border token — this is what binds the indented children to the parent link above. The
   sub-links indent past it (the AdminIcon column of the parent ≈ icon + space-3 gap). */
.fd-admin-side-nav__submenu--rail[b-m9jkwu27o3]::before {
    content: "";
    position: absolute;
    left: calc(var(--fd-space-3) + 9px);
    top: 2px;
    bottom: calc(var(--fd-space-2) + 4px);
    width: 1.5px;
    border-radius: 2px;
    background-color: var(--fd-color-border);
}

/* The flyout panel header ("Receptek") is shown ONLY in the collapsed desktop flyout —
   in the expanded always-open list the __section-title above is the section label. */
.fd-admin-side-nav__submenu-title-item[b-m9jkwu27o3] {
    display: none;
}

.fd-admin-side-nav__submenu-title[b-m9jkwu27o3] {
    display: block;
    padding: var(--fd-space-1) var(--fd-space-2) var(--fd-space-2);
    margin-bottom: var(--fd-space-1);
    border-bottom: 1px solid var(--fd-color-border);
    font-size: var(--fd-text-xs);
    font-weight: var(--fd-weight-semibold);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--fd-color-text-muted);
}

/* Expanded sub-links (D1): indented past the connector rail. Active = green text + a short
   green active-rail marker (::after) that overlays the connector segment beside the row, so the
   active child reads as "bound to" the parent rather than a free-floating green pill. */
/* NOTE: the sub-links are rendered by the <NavLink> child component, whose root <a> does NOT
   receive THIS component's scoped-CSS attribute. Plain `.fd-admin-side-nav__sub-link` rules are
   therefore dropped (the anchor falls back to display:inline, zero padding, no active pill — the
   exact bug the screenshots showed). We pierce the scope with ::deep, anchored on the scoped
   __submenu container, so the rules reach the NavLink anchor. */
[b-m9jkwu27o3] .fd-admin-side-nav__sub-link {
    display: block;
    position: relative;
    padding: var(--fd-space-2) var(--fd-space-3) var(--fd-space-2) calc(var(--fd-space-3) + 26px);
    border-radius: var(--fd-radius-md);
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-medium);
    color: var(--fd-color-text-muted);
    text-decoration: none;
    transition: background-color var(--fd-transition-fast),
                color var(--fd-transition-fast);
}

[b-m9jkwu27o3] .fd-admin-side-nav__sub-link:hover {
    background-color: var(--fd-color-cream-50);
    color: var(--fd-color-text);
    text-decoration: none;
}

[b-m9jkwu27o3] .fd-admin-side-nav__sub-link.active {
    color: var(--fd-color-primary-strong);
    font-weight: var(--fd-weight-semibold);
    text-decoration: none;
}

/* Green active-rail marker: a short rounded segment sitting over the connector, level with the
   active child row. This is the D1 cue that ties the active child to the connector line. */
[b-m9jkwu27o3] .fd-admin-side-nav__sub-link.active::after {
    content: "";
    position: absolute;
    left: calc(var(--fd-space-3) + 8px);
    top: var(--fd-space-2);
    bottom: var(--fd-space-2);
    width: 2.5px;
    border-radius: 2px;
    background-color: var(--fd-color-primary);
}

[b-m9jkwu27o3] .fd-admin-side-nav__sub-link.active:hover {
    background-color: var(--fd-color-cream-50);
    color: var(--fd-color-primary-strong);
}

[b-m9jkwu27o3] .fd-admin-side-nav__sub-link:focus-visible {
    outline: 2px solid var(--fd-color-primary-strong);
    outline-offset: -2px;
    background-color: var(--fd-color-cream-50);
    color: var(--fd-color-primary-strong);
    text-decoration: none;
}

/* === Collapsed Receptek flyout (desktop only, >=1024px) ===
   When the sidebar is collapsed to the 3.5rem icon rail the inline accordion is
   replaced by a floating popover that escapes to the RIGHT of the Receptek icon,
   revealed on hover (mouse) or focus-within (keyboard). Pure CSS — no JS toggle. */
@media (min-width: 1024px) {
    /* The rail has only a handful of icons; they fit within 100vh without scrolling,
       so we drop overflow:auto -> overflow:visible to let the flyout escape the nav.
       (The nav's overflow-y:auto would otherwise compute overflow-x:auto and CLIP a
       left:100% panel.) The footer stays pinned via the flex margin-top:auto layout,
       not via position:sticky — see the footer note below. */
    .fd-admin-side-nav--collapsed[b-m9jkwu27o3] {
        overflow: visible;
    }

    /* position:sticky on the footer needs a scroll container; with overflow:visible
       that container is gone, so re-pin the footer through the flex column layout
       (margin-top:auto already pushes it to the bottom of the 100vh-tall nav). */
    .fd-admin-side-nav--collapsed .fd-admin-side-nav__footer[b-m9jkwu27o3] {
        position: static;
    }

    .fd-admin-side-nav--collapsed .fd-admin-side-nav__item--group[b-m9jkwu27o3] {
        position: relative;
    }

    /* Collapsed: swap the expanded parent LINK for the icon flyout trigger (with its orange dot). */
    .fd-admin-side-nav--collapsed .fd-admin-side-nav__parent-link[b-m9jkwu27o3] {
        display: none;
    }

    .fd-admin-side-nav--collapsed .fd-admin-side-nav__group-icon-btn[b-m9jkwu27o3] {
        display: flex;
    }

    /* Reveal the muted right-chevron "has-submenu" cue only on the collapsed rail icon. */
    .fd-admin-side-nav--collapsed .fd-admin-side-nav__submenu-cue[b-m9jkwu27o3] {
        display: inline-flex;
    }

    /* Submenu becomes a floating panel anchored to the right of the icon, hidden by default.
       Drop the inline connector rail — it has no meaning in the flyout panel. */
    .fd-admin-side-nav--collapsed .fd-admin-side-nav__submenu--rail[b-m9jkwu27o3]::before {
        content: none;
    }

    .fd-admin-side-nav--collapsed .fd-admin-side-nav__submenu[b-m9jkwu27o3] {
        position: absolute;
        /* Anchor the panel FLUSH to the right edge of the icon rail (left:100%) instead of the
           old `left: calc(100% + space-2)`, which left a ~space-2 dead gap between the icon and
           the panel. Moving the pointer icon->panel crossed that non-hoverable gap, dropping
           :hover on the --group <li> and closing the flyout before the cursor arrived (the classic
           unreachable-flyout bug). Visual separation from the rail is restored by the panel's own
           internal left padding (padding-left below), not by an outer gap. A transparent hover
           "bridge" (::before) also spans the rail->panel seam so a slightly diagonal pointer path
           never leaves a hoverable surface. */
        left: 100%;
        top: 0;
        min-width: 12rem;
        margin: 0;
        padding: var(--fd-space-1);
        /* extra inner left padding gives the visual gap the old outer offset used to provide,
           while keeping the panel's hit-box flush against the rail (no dead zone). */
        padding-left: var(--fd-space-2);
        /* reset the accordion height-animation — this is a panel now, not a height list */
        max-height: none;
        overflow: visible;
        background: var(--fd-color-surface);
        border: 1px solid var(--fd-color-border);
        border-radius: var(--fd-radius-md);
        box-shadow: var(--fd-shadow-md);
        /* above the sticky footer (z-index 10 area) and the mobile overlay strata */
        z-index: 320;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateX(-0.25rem);
        transition: opacity var(--fd-transition-fast),
                    transform var(--fd-transition-fast),
                    visibility var(--fd-transition-fast);
    }

    /* Transparent hover bridge: a slim invisible strip on the panel's left edge, pulled back over
       the rail (left:-space-2) so the rail icon and the panel body form ONE continuous hoverable
       region. Without this, the translateX(-0.25rem) rest-offset plus sub-pixel seams could still
       briefly drop :hover mid-traverse. It only needs to exist while the flyout is interactive, so
       it inherits pointer-events from the panel (none when hidden, auto when shown). */
    .fd-admin-side-nav--collapsed .fd-admin-side-nav__submenu[b-m9jkwu27o3]::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: calc(-1 * var(--fd-space-2));
        width: var(--fd-space-2);
        /* transparent — purely a hit-area bridge, no visual */
        background: transparent;
    }

    .fd-admin-side-nav--collapsed .fd-admin-side-nav__item--group:hover .fd-admin-side-nav__submenu[b-m9jkwu27o3],
    .fd-admin-side-nav--collapsed .fd-admin-side-nav__item--group:focus-within .fd-admin-side-nav__submenu[b-m9jkwu27o3] {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateX(0);
    }

    /* Show the panel header only inside the collapsed flyout. */
    .fd-admin-side-nav--collapsed .fd-admin-side-nav__submenu-title-item[b-m9jkwu27o3] {
        display: block;
    }

    /* Flyout list styling — drop the expanded D1 indent + connector marker; inside the floating
       panel the active child reverts to the familiar green-100 rounded pill. */
    .fd-admin-side-nav--collapsed[b-m9jkwu27o3]  .fd-admin-side-nav__sub-link {
        border-radius: var(--fd-radius-sm);
        padding: var(--fd-space-2) var(--fd-space-3);
    }

    .fd-admin-side-nav--collapsed[b-m9jkwu27o3]  .fd-admin-side-nav__sub-link.active {
        background-color: var(--fd-color-green-100);
    }

    .fd-admin-side-nav--collapsed[b-m9jkwu27o3]  .fd-admin-side-nav__sub-link.active::after {
        content: none;
    }

    .fd-admin-side-nav--collapsed[b-m9jkwu27o3]  .fd-admin-side-nav__sub-link:hover {
        background-color: var(--fd-color-cream-50);
        color: var(--fd-color-primary-strong);
    }

    .fd-admin-side-nav--collapsed[b-m9jkwu27o3]  .fd-admin-side-nav__sub-link.active:hover {
        background-color: var(--fd-color-green-100);
    }

    .fd-admin-side-nav--collapsed[b-m9jkwu27o3]  .fd-admin-side-nav__sub-link:focus-visible {
        outline: 2px solid var(--fd-color-primary-strong);
        outline-offset: -2px;
        background-color: var(--fd-color-cream-50);
        color: var(--fd-color-primary-strong);
    }

    /* The global collapsed rule hides every __link-label (icon-only rail) — but the
       flyout sub-links wrap their text in __link-label too, which left the panel
       empty. Re-show the labels INSIDE the flyout so the items are visible.
       (::deep because the label span lives inside the NavLink child render.) */
    .fd-admin-side-nav--collapsed .fd-admin-side-nav__submenu[b-m9jkwu27o3]  .fd-admin-side-nav__link-label {
        display: block;
    }
}

/* Reduced-motion: no slide/fade — snap the flyout in. */
@media (min-width: 1024px) and (prefers-reduced-motion: reduce) {
    .fd-admin-side-nav--collapsed .fd-admin-side-nav__submenu[b-m9jkwu27o3] {
        transition: none;
        transform: none;
    }
}

/* === Logout toast === */
/* Lightweight fixed toast shown on in-process logout, before the redirect to /admin/login.
   Token-styled, no external dependency; auto-dismisses when the component redirects/unmounts. */
.fd-admin-side-nav__toast[b-m9jkwu27o3] {
    position: fixed;
    bottom: var(--fd-space-4);
    left: 50%;
    transform: translateX(-50%);
    z-index: 400;
    max-width: calc(100vw - var(--fd-space-4) * 2);
    padding: var(--fd-space-3) var(--fd-space-4);
    border-radius: var(--fd-radius-md);
    border: 1px solid var(--fd-color-green-500);
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    box-shadow: var(--fd-shadow-lg);
    animation: fd-admin-side-nav-toast-in-b-m9jkwu27o3 var(--fd-transition-base);
}

@keyframes fd-admin-side-nav-toast-in-b-m9jkwu27o3 {
    from {
        opacity: 0;
        transform: translate(-50%, var(--fd-space-3));
    }
    to {
        opacity: 1;
        transform: translate(-50%, 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .fd-admin-side-nav__toast[b-m9jkwu27o3] {
        animation: none;
    }
}
/* /Components/Shared/AdminStatTile.razor.rz.scp.css */
.fd-admin-stat-tile[b-3kto2rzpvq] {
    display: flex;
    align-items: flex-start;
    gap: var(--fd-space-3);
    padding: var(--fd-space-4);
    background-color: var(--fd-color-surface);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-md);
    box-shadow: var(--fd-shadow-sm);
    min-height: 96px;
}

@media (min-width: 768px) {
    .fd-admin-stat-tile[b-3kto2rzpvq] {
        padding: var(--fd-space-4) var(--fd-space-5);
    }
}

/* Navigable variant: rendered as an <a>. Reads as a card, not a text link (no
   underline / inherited link colour), with a clear hover lift + focus ring. */
.fd-admin-stat-tile--link[b-3kto2rzpvq] {
    text-decoration: none;
    color: inherit;
    cursor: pointer;
    transition:
        box-shadow var(--fd-transition-fast),
        border-color var(--fd-transition-fast),
        transform var(--fd-transition-fast);
}

.fd-admin-stat-tile--link:hover[b-3kto2rzpvq] {
    border-color: var(--fd-color-primary);
    box-shadow: var(--fd-shadow-md);
}

.fd-admin-stat-tile--link:focus-visible[b-3kto2rzpvq] {
    outline: none;
    border-color: var(--fd-color-primary);
    box-shadow: 0 0 0 3px var(--fd-color-primary-soft, rgba(61, 122, 42, 0.35));
}

@media (prefers-reduced-motion: no-preference) {
    .fd-admin-stat-tile--link:hover[b-3kto2rzpvq] {
        transform: translateY(-2px);
    }
}

.fd-admin-stat-tile__icon[b-3kto2rzpvq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: var(--fd-radius-md);
    flex: 0 0 auto;
}

.fd-admin-stat-tile--green .fd-admin-stat-tile__icon[b-3kto2rzpvq] {
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
}

.fd-admin-stat-tile--orange .fd-admin-stat-tile__icon[b-3kto2rzpvq] {
    background-color: var(--fd-color-orange-100);
    color: var(--fd-color-accent-strong);
}

.fd-admin-stat-tile--cream .fd-admin-stat-tile__icon[b-3kto2rzpvq] {
    background-color: var(--fd-color-cream-200);
    color: var(--fd-color-ink-700);
}

.fd-admin-stat-tile--sage .fd-admin-stat-tile__icon[b-3kto2rzpvq] {
    background-color: var(--fd-color-sage-50);
    color: var(--fd-color-ink-700);
}

.fd-admin-stat-tile__body[b-3kto2rzpvq] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-1);
    min-width: 0;
    flex: 1 1 auto;
}

.fd-admin-stat-tile__label[b-3kto2rzpvq] {
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-xs);
    font-weight: var(--fd-weight-medium);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.fd-admin-stat-tile__value[b-3kto2rzpvq] {
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-2xl);
    font-weight: var(--fd-weight-bold);
    line-height: var(--fd-leading-tight);
    color: var(--fd-color-text);
    letter-spacing: -0.01em;
}

@media (min-width: 768px) {
    .fd-admin-stat-tile__value[b-3kto2rzpvq] {
        font-size: var(--fd-text-3xl);
    }
}

.fd-admin-stat-tile__meta[b-3kto2rzpvq] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--fd-space-2);
    margin-top: var(--fd-space-1);
    min-width: 0;
}

.fd-admin-stat-tile__caption[b-3kto2rzpvq] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: var(--fd-text-xs);
    line-height: var(--fd-leading-snug);
    min-width: 0;
    flex: 1 1 auto;
}

.fd-admin-stat-tile__caption--neutral[b-3kto2rzpvq] { color: var(--fd-color-text-muted); }
.fd-admin-stat-tile__caption--positive[b-3kto2rzpvq] { color: var(--fd-color-primary-strong); }
.fd-admin-stat-tile__caption--negative[b-3kto2rzpvq] { color: var(--fd-color-accent-strong); }

.fd-admin-stat-tile__caption .fd-admin-icon[b-3kto2rzpvq] {
    width: 0.95rem;
    height: 0.95rem;
}
/* /Components/Shared/AuthShell.razor.rz.scp.css */
.fd-auth[b-xrwts9eflz] {
    display: flex;
    justify-content: center;
    padding-inline: var(--fd-space-4);
    padding-block: var(--fd-space-8);
    min-block-size: 60vh;
}

.fd-auth__card[b-xrwts9eflz] {
    inline-size: 100%;
    max-inline-size: 27rem;
    background: var(--fd-color-surface);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-lg);
    box-shadow: var(--fd-shadow-md);
    padding: var(--fd-space-6);
}

.fd-auth__header[b-xrwts9eflz] {
    text-align: center;
    margin-block-end: var(--fd-space-5);
}

.fd-auth__eyebrow[b-xrwts9eflz] {
    display: block;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--fd-text-xs);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-primary-strong);
    margin-block-end: var(--fd-space-2);
}

.fd-auth__title[b-xrwts9eflz] {
    font-family: var(--fd-font-display);
    font-size: var(--fd-text-2xl);
    font-weight: var(--fd-weight-bold);
    color: var(--fd-color-text);
    margin: 0;
}

.fd-auth__lead[b-xrwts9eflz] {
    margin-block-start: var(--fd-space-3);
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
    line-height: 1.5;
}

.fd-auth__footer[b-xrwts9eflz] {
    margin-block-start: var(--fd-space-5);
    padding-block-start: var(--fd-space-4);
    border-block-start: 1px solid var(--fd-color-border);
    text-align: center;
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text-muted);
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-2);
}
/* /Components/Shared/Badge.razor.rz.scp.css */
.fd-badge[b-u4ibq0oe7p] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-2);
    min-height: 32px;
    padding: 0.35rem 0.75rem;
    border-radius: var(--fd-radius-pill);
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
}

.fd-badge--success[b-u4ibq0oe7p] {
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
}

.fd-badge--accent[b-u4ibq0oe7p] {
    background-color: var(--fd-color-orange-100);
    color: var(--fd-color-accent-strong);
}

.fd-badge--neutral[b-u4ibq0oe7p] {
    background-color: var(--fd-color-surface-alt);
    color: var(--fd-color-ink-700);
    border: 1px solid var(--fd-color-border);
}

.fd-badge__icon[b-u4ibq0oe7p] {
    font-size: 1rem;
    line-height: 1;
}
/* /Components/Shared/BookingRequestDraftForm.razor.rz.scp.css */
.fd-booking-draft[b-akxv8he3rs] {
    --pub-input-bg: #f4f2ee;
    --pub-input-border: #ccc8bc;
    --pub-input-border-hover: #a8a296;
    --pub-input-radius: 8px;
    --pub-input-ph-color: #9a9488;
    --pub-input-focus-shadow: 0 0 0 3px rgba(61, 122, 42, 0.18);

    display: grid;
    gap: var(--fd-space-5);
    padding: var(--fd-space-6);
    border-radius: var(--fd-radius-lg);
    background: linear-gradient(135deg, var(--fd-color-surface), var(--fd-color-cream-50));
    border: 1px solid var(--fd-color-border);
    box-shadow: var(--fd-shadow-sm);
}

[b-akxv8he3rs] .fd-booking-draft__copy {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
}

[b-akxv8he3rs] .fd-booking-draft__eyebrow {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--fd-color-accent-strong);
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
}

[b-akxv8he3rs] .fd-booking-draft__title,
[b-akxv8he3rs] .fd-booking-draft__description {
    margin: 0;
}

[b-akxv8he3rs] .fd-booking-draft__description {
    color: var(--fd-color-ink-700);
    line-height: var(--fd-leading-relaxed);
}

[b-akxv8he3rs] .fd-booking-draft__points {
    margin: 0;
    padding-left: 1.2rem;
    color: var(--fd-color-ink-700);
}

[b-akxv8he3rs] .fd-booking-draft__points li + li {
    margin-top: var(--fd-space-2);
}

[b-akxv8he3rs] .fd-booking-draft__form {
    display: grid;
    gap: var(--fd-space-4);
}

[b-akxv8he3rs] .fd-booking-draft__field,
[b-akxv8he3rs] .fd-booking-draft__field-grid {
    display: grid;
    gap: var(--fd-space-2);
}

[b-akxv8he3rs] .fd-booking-draft__field-grid {
    grid-template-columns: 1fr;
    align-items: start;
}

[b-akxv8he3rs] .fd-booking-draft__label {
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-ink-900);
    font-size: var(--fd-text-sm);
}

[b-akxv8he3rs] .fd-booking-draft__input {
    width: 100%;
    display: block;
    min-height: 44px;
    padding: 0 1rem;
    border-radius: var(--pub-input-radius);
    border: 1px solid var(--pub-input-border);
    background-color: var(--pub-input-bg);
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-base);
    line-height: 1;
    color: var(--fd-color-text);
    transition: border-color var(--fd-transition-fast), box-shadow var(--fd-transition-fast);
    box-sizing: border-box;
}

[b-akxv8he3rs] .fd-booking-draft__input::placeholder {
    color: var(--pub-input-ph-color);
}

[b-akxv8he3rs] .fd-booking-draft__input:hover {
    border-color: var(--pub-input-border-hover);
}

[b-akxv8he3rs] .fd-booking-draft__input:focus,
[b-akxv8he3rs] .fd-booking-draft__input:focus-visible {
    outline: none;
    border-color: var(--fd-color-primary);
    box-shadow: var(--pub-input-focus-shadow);
}

[b-akxv8he3rs] .fd-booking-draft__input.invalid,
[b-akxv8he3rs] .fd-booking-draft__input[aria-invalid='true'] {
    border-color: var(--fd-color-accent-strong);
    box-shadow: none;
}

[b-akxv8he3rs] .fd-booking-draft__input.invalid:focus,
[b-akxv8he3rs] .fd-booking-draft__input[aria-invalid='true']:focus {
    box-shadow: var(--fd-input-focus-shadow-error);
}

[b-akxv8he3rs] .fd-booking-draft__textarea {
    padding: 0.8rem 1rem;
    resize: vertical;
    min-height: 7rem;
    line-height: var(--fd-leading-snug);
}

[b-akxv8he3rs] .fd-booking-draft__meta {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--fd-space-3);
    flex-wrap: wrap;
}

[b-akxv8he3rs] .fd-booking-draft__counter {
    font-size: var(--fd-text-xs);
    color: var(--fd-color-text-muted);
    margin-left: auto;
}

[b-akxv8he3rs] .fd-booking-draft__error {
    color: var(--fd-color-accent-strong);
    font-size: var(--fd-text-sm);
}

[b-akxv8he3rs] .fd-booking-draft__submit-error {
    padding: var(--fd-space-3) var(--fd-space-4);
    background-color: var(--fd-color-error-bg);
    border: 1px solid rgba(159, 51, 15, 0.2);
    border-radius: var(--fd-radius-md);
    color: var(--fd-color-accent-strong);
    font-size: var(--fd-text-sm);
}

[b-akxv8he3rs] .fd-booking-draft__success {
    display: grid;
    gap: var(--fd-space-3);
    padding: var(--fd-space-5);
    border-radius: var(--fd-radius-lg);
    background: linear-gradient(135deg, rgba(107, 166, 41, 0.12), rgba(230, 243, 218, 0.9));
    border: 1px solid rgba(61, 122, 42, 0.18);
}

[b-akxv8he3rs] .fd-booking-draft__success-title {
    color: var(--fd-color-primary-strong);
    font-size: var(--fd-text-lg);
}

[b-akxv8he3rs] .fd-booking-draft__success-text,
[b-akxv8he3rs] .fd-booking-draft__success-summary {
    margin: 0;
    color: var(--fd-color-ink-700);
    line-height: var(--fd-leading-snug);
}

[b-akxv8he3rs] .fd-booking-draft__success-summary {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fd-space-2);
}

[b-akxv8he3rs] .fd-booking-draft__success-summary span {
    padding: 0.35rem 0.6rem;
    border-radius: 999px;
    background-color: rgba(255, 255, 255, 0.6);
    border: 1px solid rgba(61, 122, 42, 0.16);
    font-size: var(--fd-text-xs);
}

[b-akxv8he3rs] .fd-booking-draft__reset {
    justify-self: start;
    border: 0;
    background: transparent;
    color: var(--fd-color-primary-strong);
    font-weight: var(--fd-weight-semibold);
    cursor: pointer;
    padding: 0;
}

@media (min-width: 960px) {
    [b-akxv8he3rs] .fd-booking-draft__field-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
/* /Components/Shared/Breadcrumb.razor.rz.scp.css */
.fd-breadcrumb__list[b-dgsjapfmbg] {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: var(--fd-space-2);
    margin: 0;
    padding: 0;
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
}

.fd-breadcrumb__item[b-dgsjapfmbg] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-2);
}

.fd-breadcrumb__item:not(:last-child)[b-dgsjapfmbg]::after {
    content: "/";
    color: var(--fd-color-ink-300);
}

.fd-breadcrumb__link[b-dgsjapfmbg] {
    color: var(--fd-color-primary-strong);
}

.fd-breadcrumb__current[b-dgsjapfmbg] {
    color: var(--fd-color-ink-700);
    font-weight: var(--fd-weight-semibold);
}
/* /Components/Shared/CategoryIcon.razor.rz.scp.css */
.fd-category-icon[b-piudkoz9i9] {
    width: 48px;
    height: 48px;
    border-radius: var(--fd-radius-md);
    display: inline-grid;
    place-items: center;
    background: linear-gradient(135deg, var(--fd-color-green-100), var(--fd-color-cream-100));
    color: var(--fd-color-primary-strong);
    box-shadow: var(--fd-shadow-sm);
    font-size: 1.5rem;
}

.fd-category-icon--small[b-piudkoz9i9] {
    width: 36px;
    height: 36px;
    font-size: 1.125rem;
}
/* /Components/Shared/ContactForm.razor.rz.scp.css */
.fd-contact-form[b-yjajzh6f8l] {
    --pub-input-bg: #f4f2ee;
    --pub-input-border: #ccc8bc;
    --pub-input-border-hover: #a8a296;
    --pub-input-radius: 8px;
    --pub-input-ph-color: #9a9488;
    --pub-input-focus-shadow: 0 0 0 3px rgba(61, 122, 42, 0.18);

    display: flex;
    flex-direction: column;
    gap: var(--fd-space-4);
    background-color: var(--fd-color-surface);
    padding: var(--fd-space-6);
    border-radius: var(--fd-radius-lg);
    border: 1px solid var(--fd-color-border);
    box-shadow: var(--fd-shadow-sm);
}

[b-yjajzh6f8l] .fd-contact-form__field {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-2);
}

[b-yjajzh6f8l] .fd-contact-form__label {
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-ink-900);
    font-size: var(--fd-text-sm);
}

[b-yjajzh6f8l] .fd-contact-form__input {
    width: 100%;
    display: block;
    min-height: 44px;
    padding: 0 1rem;
    border-radius: var(--pub-input-radius);
    border: 1px solid var(--pub-input-border);
    background-color: var(--pub-input-bg);
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-base);
    line-height: 1;
    color: var(--fd-color-text);
    transition: border-color var(--fd-transition-fast), box-shadow var(--fd-transition-fast);
    box-sizing: border-box;
}

[b-yjajzh6f8l] .fd-contact-form__input::placeholder {
    color: var(--pub-input-ph-color);
}

[b-yjajzh6f8l] .fd-contact-form__input:hover {
    border-color: var(--pub-input-border-hover);
}

[b-yjajzh6f8l] .fd-contact-form__input:focus,
[b-yjajzh6f8l] .fd-contact-form__input:focus-visible {
    outline: none;
    border-color: var(--fd-color-primary);
    box-shadow: var(--pub-input-focus-shadow);
}

[b-yjajzh6f8l] .fd-contact-form__input.invalid,
[b-yjajzh6f8l] .fd-contact-form__input[aria-invalid='true'] {
    border-color: var(--fd-color-accent-strong);
    box-shadow: none;
}

[b-yjajzh6f8l] .fd-contact-form__input.invalid:focus,
[b-yjajzh6f8l] .fd-contact-form__input[aria-invalid='true']:focus {
    box-shadow: var(--fd-input-focus-shadow-error);
}

[b-yjajzh6f8l] .fd-contact-form__textarea {
    padding: 0.8rem 1rem;
    resize: vertical;
    min-height: 7rem;
    line-height: var(--fd-leading-snug);
}

[b-yjajzh6f8l] .fd-contact-form__meta {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--fd-space-3);
    flex-wrap: wrap;
}

[b-yjajzh6f8l] .fd-contact-form__counter {
    font-size: var(--fd-text-xs);
    color: var(--fd-color-text-muted);
    margin-left: auto;
}

[b-yjajzh6f8l] .fd-contact-form__error {
    color: var(--fd-color-accent-strong);
    font-size: var(--fd-text-sm);
}

[b-yjajzh6f8l] .fd-contact-form__submit-error {
    padding: var(--fd-space-3) var(--fd-space-4);
    background-color: var(--fd-color-error-bg);
    border: 1px solid rgba(159, 51, 15, 0.2);
    border-radius: var(--fd-radius-md);
    color: var(--fd-color-accent-strong);
    font-size: var(--fd-text-sm);
}

[b-yjajzh6f8l] .fd-contact-form__submit {
    align-self: flex-start;
}

[b-yjajzh6f8l] .fd-contact-form__submit[disabled] {
    opacity: 0.7;
    cursor: not-allowed;
}

[b-yjajzh6f8l] .fd-contact-form__privacy {
    margin: 0;
    font-size: var(--fd-text-xs);
    color: var(--fd-color-text-muted);
    line-height: var(--fd-leading-snug);
}

[b-yjajzh6f8l] .fd-contact-form__success {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-4);
    padding: var(--fd-space-6);
    border-radius: var(--fd-radius-lg);
    background: linear-gradient(135deg, rgba(107, 166, 41, 0.12), rgba(230, 243, 218, 0.9));
    border: 1px solid rgba(61, 122, 42, 0.18);
    box-shadow: var(--fd-shadow-sm);
}

[b-yjajzh6f8l] .fd-contact-form__success-title {
    margin: 0;
    color: var(--fd-color-primary-strong);
    font-size: var(--fd-text-2xl);
}

[b-yjajzh6f8l] .fd-contact-form__success-text {
    margin: 0;
    color: var(--fd-color-ink-700);
    line-height: var(--fd-leading-snug);
}
/* /Components/Shared/CtaButton.razor.rz.scp.css */
.fd-cta[b-cmzt3w0tov] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--fd-space-2);
    padding: var(--fd-space-3) var(--fd-space-5);
    min-height: 44px;
    font-family: inherit;
    font-size: var(--fd-text-base);
    font-weight: var(--fd-weight-semibold);
    line-height: 1;
    text-decoration: none;
    text-align: center;
    border-radius: var(--fd-radius-pill);
    border: 2px solid transparent;
    cursor: pointer;
    transition:
        background-color var(--fd-transition-base),
        color var(--fd-transition-base),
        border-color var(--fd-transition-base),
        transform var(--fd-transition-fast),
        box-shadow var(--fd-transition-base);
    white-space: nowrap;
}

.fd-cta:hover[b-cmzt3w0tov] {
    text-decoration: none;
    transform: translateY(-1px);
}

.fd-cta:active[b-cmzt3w0tov] {
    transform: translateY(0);
}

.fd-cta--lg[b-cmzt3w0tov] {
    padding: var(--fd-space-4) var(--fd-space-6);
    font-size: var(--fd-text-lg);
    min-height: 52px;
}

.fd-cta--primary[b-cmzt3w0tov] {
    background-color: var(--fd-color-accent);
    color: #fff;
    box-shadow: var(--fd-shadow-sm);
}

.fd-cta--primary:hover[b-cmzt3w0tov],
.fd-cta--primary:focus-visible[b-cmzt3w0tov] {
    background-color: var(--fd-color-accent-strong);
    color: #fff;
    box-shadow: var(--fd-shadow-md);
}

.fd-cta--secondary[b-cmzt3w0tov] {
    background-color: var(--fd-color-primary);
    color: #fff;
}

.fd-cta--secondary:hover[b-cmzt3w0tov],
.fd-cta--secondary:focus-visible[b-cmzt3w0tov] {
    background-color: var(--fd-color-primary-strong);
    color: #fff;
}

.fd-cta--ghost[b-cmzt3w0tov] {
    background-color: transparent;
    color: var(--fd-color-primary-strong);
    border-color: var(--fd-color-primary-strong);
}

.fd-cta--ghost:hover[b-cmzt3w0tov],
.fd-cta--ghost:focus-visible[b-cmzt3w0tov] {
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
}
/* /Components/Shared/FeaturedRecipesCarousel.razor.rz.scp.css */
.fd-featured-carousel[b-wmj5f5njsy] {
    display: grid;
    /* minmax(0, 1fr) is load-bearing: a default `auto` grid track sizes to the track's max-content
       (the sum of all cards), which would blow the carousel — and the whole page — out to the full
       scroll width instead of letting the track scroll internally. */
    grid-template-columns: minmax(0, 1fr);
    gap: var(--fd-space-4);
}

.fd-featured-carousel__viewport[b-wmj5f5njsy] {
    /* min-width:0 lets the scroll container actually clip/scroll instead of expanding to content. */
    min-width: 0;
    /* Let card shadows/hover-lift breathe without being clipped by the scroll container. */
    margin-inline: calc(var(--fd-space-2) * -1);
    padding-inline: var(--fd-space-2);
}

.fd-featured-carousel__track[b-wmj5f5njsy] {
    display: flex;
    gap: var(--fd-space-4);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding-block: var(--fd-space-2);
    /* Dots + arrows are the visible affordance; the scrollbar itself stays hidden for a clean look. */
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.fd-featured-carousel__track[b-wmj5f5njsy]::-webkit-scrollbar {
    display: none;
}

.fd-featured-carousel__track:focus-visible[b-wmj5f5njsy] {
    outline: 2px solid var(--fd-color-primary);
    outline-offset: 4px;
    border-radius: var(--fd-radius-lg);
}

.fd-featured-carousel__slide[b-wmj5f5njsy] {
    flex: 0 0 auto;
    /* Mobile: ~1 card with a peek of the next so the swipe affordance reads. */
    width: 85%;
    scroll-snap-align: start;
}

.fd-featured-carousel__slide > .fd-recipe-card[b-wmj5f5njsy] {
    height: 100%;
}

.fd-featured-carousel__controls[b-wmj5f5njsy] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--fd-space-4);
}

.fd-featured-carousel__arrow[b-wmj5f5njsy] {
    flex: 0 0 auto;
    display: inline-grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: var(--fd-radius-pill);
    border: 1px solid var(--fd-color-border);
    background-color: var(--fd-color-surface);
    color: var(--fd-color-primary-strong);
    box-shadow: var(--fd-shadow-sm);
    cursor: pointer;
    transition: transform var(--fd-transition-fast), box-shadow var(--fd-transition-fast),
        background-color var(--fd-transition-fast), color var(--fd-transition-fast);
}

.fd-featured-carousel__arrow:hover[b-wmj5f5njsy] {
    background-color: var(--fd-color-primary);
    color: #fff;
    box-shadow: var(--fd-shadow-md);
    transform: translateY(-1px);
}

.fd-featured-carousel__arrow:focus-visible[b-wmj5f5njsy] {
    outline: 2px solid var(--fd-color-primary);
    outline-offset: 3px;
}

.fd-featured-carousel__dots[b-wmj5f5njsy] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--fd-space-2);
}

.fd-featured-carousel__dot[b-wmj5f5njsy] {
    width: 0.6rem;
    height: 0.6rem;
    padding: 0;
    border: none;
    border-radius: var(--fd-radius-pill);
    background-color: var(--fd-color-cream-200);
    cursor: pointer;
    transition: width var(--fd-transition-fast), background-color var(--fd-transition-fast);
}

.fd-featured-carousel__dot:hover[b-wmj5f5njsy] {
    background-color: var(--fd-color-accent);
}

.fd-featured-carousel__dot.is-active[b-wmj5f5njsy] {
    width: 1.6rem;
    background-color: var(--fd-color-accent);
}

.fd-featured-carousel__dot:focus-visible[b-wmj5f5njsy] {
    outline: 2px solid var(--fd-color-primary);
    outline-offset: 3px;
}

@media (min-width: 640px) {
    .fd-featured-carousel__slide[b-wmj5f5njsy] {
        width: calc((100% - var(--fd-space-4)) / 2);
    }
}

@media (min-width: 1024px) {
    .fd-featured-carousel__slide[b-wmj5f5njsy] {
        /* Match the static featured grid: 4 across on desktop. */
        width: calc((100% - (3 * var(--fd-space-4))) / 4);
    }
}

/* Honor reduced-motion at the CSS layer too (the JS timer is disabled separately). */
@media (prefers-reduced-motion: reduce) {
    .fd-featured-carousel__track[b-wmj5f5njsy] {
        scroll-behavior: auto;
    }

    .fd-featured-carousel__arrow[b-wmj5f5njsy],
    .fd-featured-carousel__dot[b-wmj5f5njsy] {
        transition: none;
    }

    .fd-featured-carousel__arrow:hover[b-wmj5f5njsy] {
        transform: none;
    }
}
/* /Components/Shared/FilterChip.razor.rz.scp.css */
.fd-filter-chip[b-q6t1u15jkb] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-2);
    min-height: 40px;
    padding: 0.55rem 1rem;
    border-radius: var(--fd-radius-pill);
    border: 1.5px solid var(--fd-color-border);
    background-color: var(--fd-color-surface);
    color: var(--fd-color-ink-700);
    font: inherit;
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    cursor: pointer;
    transition:
        border-color var(--fd-transition-fast),
        background-color var(--fd-transition-fast),
        color var(--fd-transition-fast),
        box-shadow var(--fd-transition-fast),
        transform var(--fd-transition-fast);
}

.fd-filter-chip:not(.fd-filter-chip--selected):hover[b-q6t1u15jkb] {
    border-color: var(--fd-color-primary);
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
    transform: translateY(-1px);
    box-shadow: var(--fd-shadow-md);
}

.fd-filter-chip:focus-visible[b-q6t1u15jkb] {
    outline: 2px solid var(--fd-color-accent);
    outline-offset: 2px;
}

.fd-filter-chip--selected[b-q6t1u15jkb] {
    background-color: var(--fd-color-primary);
    border-color: var(--fd-color-primary);
    color: #fff;
    font-weight: var(--fd-weight-bold);
    box-shadow: 0 2px 8px rgba(61, 122, 42, 0.30);
}

.fd-filter-chip--selected:hover[b-q6t1u15jkb] {
    background-color: var(--fd-color-primary-strong);
    border-color: var(--fd-color-primary-strong);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(61, 122, 42, 0.40);
}

.fd-filter-chip__icon[b-q6t1u15jkb] {
    line-height: 1;
}
/* /Components/Shared/FoodForm.razor.rz.scp.css */
/* FoodForm — a megosztott alapanyag-űrlap stílusai (a korábbi Foods.razor modál mezőiből kiemelve,
   változatlan megjelenéssel). A megosztott design-system tokeneket használja (.fd-input, .fd-field,
   spacing). A .fd-admin-filter-chip (multi-select chip) és a .fd-admin-icon-btn (egység-törlés) a
   globális admin.css-ből jön. */

/* Két oszlopos makró-rács; keskeny nézeten egy oszlopra rendeződik. */
.fd-food-form__macros[b-7mqk4ecgi9] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--fd-space-4);
}

@media (max-width: 30rem) {
    .fd-food-form__macros[b-7mqk4ecgi9] {
        grid-template-columns: 1fr;
    }
}

/* ---- Repeatable unit-row editor ---- */
.fd-food-form__units-editor[b-7mqk4ecgi9] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-2);
    padding-top: var(--fd-space-2);
    /* Breathing room so the "Egység hozzáadása" button doesn't touch the divider (the
       categories section's border-top) that follows it. */
    padding-bottom: var(--fd-space-4);
    border-top: 1px solid var(--fd-color-border);
}

.fd-food-form__units-label[b-7mqk4ecgi9] {
    font-weight: var(--fd-weight-medium);
    color: var(--fd-color-text);
    font-size: var(--fd-text-sm);
}

.fd-food-form__units-hint[b-7mqk4ecgi9] {
    margin: 0;
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
}

.fd-food-form__unit-rows[b-7mqk4ecgi9] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-2);
}

.fd-food-form__unit-row[b-7mqk4ecgi9] {
    display: flex;
    align-items: flex-start;
    gap: var(--fd-space-2);
}

.fd-food-form__unit-field[b-7mqk4ecgi9] {
    flex: 1 1 0;
    min-width: 0;
}

.fd-food-form__unit-field--grams[b-7mqk4ecgi9] {
    flex: 0 0 9rem;
}

.fd-food-form__unit-eq[b-7mqk4ecgi9] {
    color: var(--fd-color-text-muted);
    line-height: 2.5rem;
    flex: 0 0 auto;
}

/* Grams input + a trailing "g" affix. */
.fd-food-form__grams-input[b-7mqk4ecgi9] {
    position: relative;
    display: flex;
    align-items: center;
}

.fd-food-form__grams-input .fd-input[b-7mqk4ecgi9] {
    padding-right: 1.75rem;
}

.fd-food-form__grams-suffix[b-7mqk4ecgi9] {
    position: absolute;
    right: var(--fd-space-2);
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
    pointer-events: none;
}

/* A törlés-ikongomb az input sorhoz igazodik (nem a hibaüzenethez). */
.fd-food-form__unit-remove[b-7mqk4ecgi9] {
    flex: 0 0 auto;
    margin-top: 0.3125rem;
}

.fd-food-form__unit-error[b-7mqk4ecgi9] {
    margin-top: var(--fd-space-1);
    font-size: var(--fd-text-xs);
}

/* Per-sor ehető-gramm súgó — finom, muted helper text a gramm-input alatt. */
.fd-food-form__unit-edible[b-7mqk4ecgi9] {
    margin-top: var(--fd-space-1);
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-xs);
}

/* ---- Hulladék % ---- */
/* Keskeny, számjegyhez méretezett input a trailing "%" affixszel — nem fut ki a teljes szélességre. */
.fd-food-form__waste-input[b-7mqk4ecgi9] {
    position: relative;
    display: flex;
    align-items: center;
    max-width: 9rem;
}

.fd-food-form__waste-input .fd-input[b-7mqk4ecgi9] {
    padding-right: 1.75rem;
}

.fd-food-form__waste-suffix[b-7mqk4ecgi9] {
    position: absolute;
    right: var(--fd-space-2);
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
    pointer-events: none;
}

/* "Egység hozzáadása" — kompakt, ikonos secondary gomb. */
.fd-button--sm[b-7mqk4ecgi9] {
    padding: var(--fd-space-1) var(--fd-space-3);
    font-size: var(--fd-text-sm);
}

.fd-food-form__add-unit[b-7mqk4ecgi9] {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-1);
}

/* ---- Vonalkódos gyorskitöltő panel: külön, tintelt dobozként elkülönül a kézi kitöltéstől ---- */
.fd-food-form__scan-panel[b-7mqk4ecgi9] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
    padding: var(--fd-space-4);
    margin-bottom: var(--fd-space-5);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-md, 0.5rem);
    background: var(--fd-color-surface-muted, #f6f6f4);
}

.fd-food-form__scan-head[b-7mqk4ecgi9] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-1);
}

.fd-food-form__scan-title[b-7mqk4ecgi9] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-2);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-text);
}

.fd-food-form__scan-desc[b-7mqk4ecgi9] {
    margin: 0;
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
    line-height: 1.45;
}

/* Input + a két gomb egy sorban; keskeny nézeten a gombok a mező alá törnek. */
.fd-food-form__barcode-row[b-7mqk4ecgi9] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--fd-space-2);
}

.fd-food-form__barcode-input[b-7mqk4ecgi9] {
    flex: 1 1 12rem;
    min-width: 0;
}

.fd-food-form__barcode-row .fd-button[b-7mqk4ecgi9] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-1);
}

.fd-food-form__barcode-note[b-7mqk4ecgi9],
.fd-food-form__barcode-existing[b-7mqk4ecgi9] {
    margin-top: var(--fd-space-2);
}

/* In-page kamera panel — a <video> a felület szélességéhez igazodik, ésszerű magassággal. */
.fd-food-form__camera[b-7mqk4ecgi9] {
    margin-top: var(--fd-space-3);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--fd-space-2);
    padding: var(--fd-space-3);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-md, 0.5rem);
    background: var(--fd-color-surface-muted, #f6f6f4);
}

.fd-food-form__camera-video[b-7mqk4ecgi9] {
    width: 100%;
    max-width: 28rem;
    aspect-ratio: 4 / 3;
    background: #000;
    border-radius: var(--fd-radius-sm, 0.375rem);
    object-fit: cover;
}

.fd-food-form__camera-hint[b-7mqk4ecgi9] {
    margin: 0;
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
}

/* ---- Category multi-select ---- */
.fd-food-form__categories-editor[b-7mqk4ecgi9] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-2);
    padding-top: var(--fd-space-2);
    border-top: 1px solid var(--fd-color-border);
}

.fd-food-form__category-chips[b-7mqk4ecgi9] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fd-space-2);
}
/* /Components/Shared/Hero.razor.rz.scp.css */
.fd-hero[b-jcochzweeg] {
    background:
        radial-gradient(circle at 85% 15%, var(--fd-color-orange-100) 0%, transparent 55%),
        radial-gradient(circle at 10% 90%, var(--fd-color-green-100) 0%, transparent 50%),
        var(--fd-color-cream-50);
    padding-block: var(--fd-space-7) var(--fd-space-8);
    position: relative;
    overflow: hidden;
}

.fd-hero__inner[b-jcochzweeg] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-6);
    align-items: stretch;
}

.fd-hero__copy[b-jcochzweeg] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-4);
    max-width: 640px;
}

.fd-hero__eyebrow[b-jcochzweeg] {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: var(--fd-space-2);
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
    font-weight: var(--fd-weight-semibold);
    font-size: var(--fd-text-sm);
    padding: var(--fd-space-2) var(--fd-space-4);
    border-radius: var(--fd-radius-pill);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.fd-hero__title[b-jcochzweeg] {
    margin: 0;
    font-size: var(--fd-text-3xl);
    line-height: var(--fd-leading-tight);
    color: var(--fd-color-ink-900);
}

.fd-hero__lead[b-jcochzweeg] {
    margin: 0;
    font-size: var(--fd-text-lg);
    color: var(--fd-color-ink-700);
    line-height: var(--fd-leading-snug);
}

.fd-hero__actions[b-jcochzweeg] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fd-space-3);
    margin-top: var(--fd-space-2);
}

.fd-hero__visual[b-jcochzweeg] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 220px;
}

/* Valódi fotó variáns: lekerekített kártya, cover kép + graceful fallback háttér. */
.fd-hero__visual--photo[b-jcochzweeg] {
    display: block;
    position: relative;
    width: 100%;
    min-height: 260px;
    border-radius: var(--fd-radius-lg);
    overflow: hidden;
    /* Fallback: ha a fotó nem töltődik be, a gradiens kártya így is szándékosnak hat. */
    background: linear-gradient(135deg, var(--fd-color-green-100), var(--fd-color-cream-100));
    border: 1px solid var(--fd-color-border);
    box-shadow: var(--fd-shadow-md);
}

.fd-hero__visual--photo img[b-jcochzweeg] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.fd-hero__bowl[b-jcochzweeg] {
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background:
        radial-gradient(circle at 50% 60%, var(--fd-color-cream-200) 0%, var(--fd-color-cream-100) 70%),
        var(--fd-color-cream-100);
    border: 6px solid #fff;
    box-shadow: var(--fd-shadow-lg);
    position: relative;
    display: grid;
    place-items: center;
}

.fd-hero__bowl-leaf[b-jcochzweeg] {
    position: absolute;
    width: 60px;
    height: 60px;
    background-color: var(--fd-color-green-500);
    border-radius: 0 100% 0 100%;
    top: 18%;
    left: 18%;
    transform: rotate(-25deg);
    box-shadow: inset -4px -4px 0 var(--fd-color-green-700);
}

.fd-hero__bowl-leaf--two[b-jcochzweeg] {
    top: 22%;
    left: auto;
    right: 18%;
    transform: rotate(40deg);
}

.fd-hero__bowl-heart[b-jcochzweeg] {
    font-size: 86px;
    color: var(--fd-color-accent);
    text-shadow: 0 6px 14px rgba(217, 78, 26, 0.3);
}

@media (min-width: 768px) {
    .fd-hero[b-jcochzweeg] {
        padding-block: var(--fd-space-9) var(--fd-space-9);
    }

    .fd-hero__inner[b-jcochzweeg] {
        flex-direction: row;
        align-items: center;
        gap: var(--fd-space-8);
    }

    .fd-hero__copy[b-jcochzweeg] {
        flex: 1 1 auto;
    }

    .fd-hero__visual[b-jcochzweeg] {
        flex: 0 0 320px;
        min-height: 320px;
    }

    .fd-hero__visual--photo[b-jcochzweeg] {
        flex-basis: 440px;
        min-height: 380px;
    }

    .fd-hero__bowl[b-jcochzweeg] {
        width: 320px;
        height: 320px;
    }

    .fd-hero__bowl-heart[b-jcochzweeg] {
        font-size: 128px;
    }

    .fd-hero__title[b-jcochzweeg] {
        font-size: var(--fd-text-4xl);
    }
}
/* /Components/Shared/InfoBox.razor.rz.scp.css */
.fd-info-box[b-yjx03e4q8o] {
    padding: var(--fd-space-5);
    border-radius: var(--fd-radius-lg);
    border: 1px solid var(--fd-color-border);
    background-color: var(--fd-color-surface);
    box-shadow: var(--fd-shadow-sm);
}

.fd-info-box--accent[b-yjx03e4q8o] {
    background: linear-gradient(135deg, rgba(255, 107, 53, 0.08), rgba(248, 239, 220, 0.85));
    border-color: rgba(217, 78, 26, 0.25);
}

.fd-info-box--success[b-yjx03e4q8o] {
    background: linear-gradient(135deg, rgba(107, 166, 41, 0.12), rgba(230, 243, 218, 0.9));
    border-color: rgba(61, 122, 42, 0.18);
}

.fd-info-box__header[b-yjx03e4q8o] {
    display: flex;
    gap: var(--fd-space-3);
    align-items: flex-start;
}

.fd-info-box__icon[b-yjx03e4q8o] {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: inline-grid;
    place-items: center;
    background-color: rgba(255, 255, 255, 0.85);
    font-size: 1.25rem;
    flex: 0 0 auto;
}

.fd-info-box__title[b-yjx03e4q8o],
.fd-info-box__description[b-yjx03e4q8o] {
    margin: 0;
}

.fd-info-box__description[b-yjx03e4q8o] {
    color: var(--fd-color-ink-700);
}

.fd-info-box__body[b-yjx03e4q8o] {
    margin-top: var(--fd-space-4);
    color: var(--fd-color-ink-700);
}
/* /Components/Shared/LeadMagnetBlock.razor.rz.scp.css */
.fd-lead-magnet[b-ntjwvnk3dg] {
    --pub-input-bg: #f4f2ee;
    --pub-input-border: #ccc8bc;
    --pub-input-border-hover: #a8a296;
    --pub-input-radius: 8px;
    --pub-input-ph-color: #9a9488;
    --pub-input-focus-shadow: 0 0 0 3px rgba(61, 122, 42, 0.18);

    display: grid;
    gap: var(--fd-space-5);
    padding: var(--fd-space-6);
    border-radius: var(--fd-radius-lg);
    background:
        radial-gradient(circle at top right, rgba(255, 228, 214, 0.8) 0%, transparent 35%),
        linear-gradient(135deg, var(--fd-color-surface), var(--fd-color-cream-50));
    border: 1px solid var(--fd-color-border);
    box-shadow: var(--fd-shadow-md);
}

[b-ntjwvnk3dg] .fd-lead-magnet__copy {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
}

[b-ntjwvnk3dg] .fd-lead-magnet__eyebrow {
    display: inline-flex;
    align-self: flex-start;
    align-items: center;
    padding: var(--fd-space-1) var(--fd-space-3);
    border-radius: var(--fd-radius-pill);
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--fd-text-xs);
    font-weight: var(--fd-weight-semibold);
}

[b-ntjwvnk3dg] .fd-lead-magnet__title,
[b-ntjwvnk3dg] .fd-lead-magnet__description {
    margin: 0;
}

[b-ntjwvnk3dg] .fd-lead-magnet__title {
    font-family: var(--fd-font-display);
    font-weight: var(--fd-weight-semibold);
    font-size: var(--fd-text-2xl);
    line-height: var(--fd-leading-snug);
    color: var(--fd-color-text);
}

[b-ntjwvnk3dg] .fd-lead-magnet__description {
    color: var(--fd-color-ink-700);
}

[b-ntjwvnk3dg] .fd-lead-magnet__benefits {
    margin: 0;
    padding-left: 1.2rem;
    color: var(--fd-color-ink-700);
}

[b-ntjwvnk3dg] .fd-lead-magnet__benefits li + li {
    margin-top: var(--fd-space-2);
}

[b-ntjwvnk3dg] .fd-lead-magnet__action {
    align-self: flex-start;
}

[b-ntjwvnk3dg] .fd-lead-magnet__action--inline {
    align-self: stretch;
    width: 100%;
}

[b-ntjwvnk3dg] .fd-lead-magnet__form {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
}

[b-ntjwvnk3dg] .fd-lead-magnet__field {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-2);
}

[b-ntjwvnk3dg] .fd-lead-magnet__label {
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-ink-900);
    font-size: var(--fd-text-sm);
}

[b-ntjwvnk3dg] .fd-lead-magnet__input {
    width: 100%;
    display: block;
    min-height: 44px;
    padding: 0 1rem;
    border-radius: var(--pub-input-radius);
    border: 1px solid var(--pub-input-border);
    background-color: var(--pub-input-bg);
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-base);
    line-height: 1;
    color: var(--fd-color-text);
    transition: border-color var(--fd-transition-fast), box-shadow var(--fd-transition-fast);
    box-sizing: border-box;
}

[b-ntjwvnk3dg] .fd-lead-magnet__input::placeholder {
    color: var(--pub-input-ph-color);
}

[b-ntjwvnk3dg] .fd-lead-magnet__input:hover {
    border-color: var(--pub-input-border-hover);
}

[b-ntjwvnk3dg] .fd-lead-magnet__input:focus,
[b-ntjwvnk3dg] .fd-lead-magnet__input:focus-visible {
    outline: none;
    border-color: var(--fd-color-primary);
    box-shadow: var(--pub-input-focus-shadow);
}

[b-ntjwvnk3dg] .fd-lead-magnet__input.invalid,
[b-ntjwvnk3dg] .fd-lead-magnet__input[aria-invalid='true'] {
    border-color: var(--fd-color-accent-strong);
    box-shadow: none;
}

[b-ntjwvnk3dg] .fd-lead-magnet__input.invalid:focus,
[b-ntjwvnk3dg] .fd-lead-magnet__input[aria-invalid='true']:focus {
    box-shadow: var(--fd-input-focus-shadow-error);
}

[b-ntjwvnk3dg] .fd-lead-magnet__error {
    color: var(--fd-color-accent-strong);
    font-size: var(--fd-text-sm);
}

[b-ntjwvnk3dg] .fd-lead-magnet__submit-error {
    padding: var(--fd-space-3) var(--fd-space-4);
    background-color: var(--fd-color-error-bg);
    border: 1px solid rgba(159, 51, 15, 0.2);
    border-radius: var(--fd-radius-md);
    color: var(--fd-color-accent-strong);
    font-size: var(--fd-text-sm);
}

/* A submit teljes megjelenését (accent bg, pill, padding, min-height, hover + disabled state, width:100%,
   középre igazított felirat) a globális .fd-lead-magnet__submit szabály adja a site.css-ben — egyetlen
   forrás, a .fd-auth-form__submit-tel azonos primary gomb. Itt már nincs külön deklaráció. */

[b-ntjwvnk3dg] .fd-lead-magnet__success {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-2);
    padding: var(--fd-space-4) var(--fd-space-5);
    border-radius: var(--fd-radius-md);
    background: linear-gradient(135deg, rgba(107, 166, 41, 0.12), rgba(230, 243, 218, 0.9));
    border: 1px solid rgba(61, 122, 42, 0.18);
}

[b-ntjwvnk3dg] .fd-lead-magnet__success-title {
    color: var(--fd-color-primary-strong);
    font-size: var(--fd-text-lg);
}

[b-ntjwvnk3dg] .fd-lead-magnet__success-text {
    margin: 0;
    color: var(--fd-color-ink-700);
    font-size: var(--fd-text-sm);
    line-height: var(--fd-leading-snug);
}

[b-ntjwvnk3dg] .fd-lead-magnet__visual {
    display: flex;
    justify-content: center;
    align-items: center;
}

[b-ntjwvnk3dg] .fd-lead-magnet__visual img {
    max-width: 100%;
    height: auto;
    border-radius: var(--fd-radius-md);
    box-shadow: var(--fd-shadow-md);
}

@media (min-width: 768px) {
    [b-ntjwvnk3dg] .fd-lead-magnet {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
    }

    [b-ntjwvnk3dg] .fd-lead-magnet--with-visual {
        grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
        align-items: center;
    }

    [b-ntjwvnk3dg] .fd-lead-magnet--with-visual .fd-lead-magnet__visual {
        grid-column: 1;
        grid-row: 1 / span 2;
    }

    [b-ntjwvnk3dg] .fd-lead-magnet--with-visual .fd-lead-magnet__copy {
        grid-column: 2;
    }

    [b-ntjwvnk3dg] .fd-lead-magnet--with-visual .fd-lead-magnet__action,
    [b-ntjwvnk3dg] .fd-lead-magnet--with-visual .fd-lead-magnet__action--inline {
        grid-column: 2;
    }

    [b-ntjwvnk3dg] .fd-lead-magnet__action--inline {
        min-width: 22rem;
    }
}
/* /Components/Shared/LegalPage.razor.rz.scp.css */
.fd-legal-header[b-vqfga5peux] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
    max-width: 68ch;
}

.fd-legal-header__eyebrow[b-vqfga5peux] {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-accent-strong);
}

.fd-legal-header__title[b-vqfga5peux] {
    margin: 0;
}

.fd-legal-header__lead[b-vqfga5peux] {
    margin: 0;
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-lg);
}

.fd-legal-header__meta[b-vqfga5peux] {
    margin: 0;
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
}

.fd-legal-prose[b-vqfga5peux] {
    max-width: 68ch;
    margin-inline: auto;
    line-height: var(--fd-leading-normal);
}

.fd-legal-prose[b-vqfga5peux]  h2 {
    margin-top: var(--fd-space-7);
    margin-bottom: var(--fd-space-3);
    scroll-margin-top: var(--fd-space-7);
}

.fd-legal-prose[b-vqfga5peux]  h2:first-child {
    margin-top: 0;
}

.fd-legal-prose[b-vqfga5peux]  h3 {
    margin-top: var(--fd-space-5);
    margin-bottom: var(--fd-space-2);
}

.fd-legal-prose[b-vqfga5peux]  p {
    margin: 0 0 var(--fd-space-4);
    color: var(--fd-color-ink-700);
}

.fd-legal-prose[b-vqfga5peux]  ul,
.fd-legal-prose[b-vqfga5peux]  ol {
    margin: 0 0 var(--fd-space-4);
    padding-left: 1.4rem;
    color: var(--fd-color-ink-700);
}

.fd-legal-prose[b-vqfga5peux]  li + li {
    margin-top: var(--fd-space-2);
}

.fd-legal-prose[b-vqfga5peux]  a {
    color: var(--fd-color-primary-strong);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.fd-legal-prose[b-vqfga5peux]  a:hover,
.fd-legal-prose[b-vqfga5peux]  a:focus-visible {
    color: var(--fd-color-accent-strong);
}

.fd-legal-prose[b-vqfga5peux]  nav[aria-label="Tartalomjegyzék"] {
    margin: 0 0 var(--fd-space-6);
    padding: var(--fd-space-4) var(--fd-space-5);
    background-color: var(--fd-color-cream-50);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-md);
}

.fd-legal-prose[b-vqfga5peux]  nav[aria-label="Tartalomjegyzék"] strong {
    display: block;
    margin-bottom: var(--fd-space-2);
    font-family: var(--fd-font-sans);
    font-size: var(--fd-text-sm);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--fd-color-text-muted);
}

.fd-legal-prose[b-vqfga5peux]  nav[aria-label="Tartalomjegyzék"] ol {
    margin: 0;
    padding-left: 1.2rem;
}

.fd-legal-prose[b-vqfga5peux]  nav[aria-label="Tartalomjegyzék"] li {
    color: var(--fd-color-ink-700);
}

/* /Components/Shared/MobileBottomNav.razor.rz.scp.css */
.fd-mobile-bottom-nav[b-ocrk9dwit0] {
    position: fixed;
    inset-inline: 0;
    bottom: 0;
    z-index: 90;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background-color: var(--fd-color-surface);
    border-top: 1px solid var(--fd-color-border);
    box-shadow: 0 -4px 14px rgba(31, 42, 36, 0.08);
    padding-bottom: env(safe-area-inset-bottom, 0);
}

.fd-mobile-bottom-nav__item[b-ocrk9dwit0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--fd-space-1);
    padding: var(--fd-space-2) var(--fd-space-1);
    color: var(--fd-color-text-muted);
    text-decoration: none;
    font-size: var(--fd-text-xs);
    font-weight: var(--fd-weight-medium);
    text-align: center;
    line-height: 1.1;
    min-height: 3.5rem;
}

.fd-mobile-bottom-nav__item:hover[b-ocrk9dwit0],
.fd-mobile-bottom-nav__item:focus-visible[b-ocrk9dwit0] {
    color: var(--fd-color-primary-strong);
    text-decoration: none;
    background-color: var(--fd-color-cream-50);
}

.fd-mobile-bottom-nav__item--active[b-ocrk9dwit0] {
    color: var(--fd-color-primary-strong);
    border-top: 4px solid var(--fd-color-primary-strong);
    padding-top: calc(var(--fd-space-2) - 4px);
}

.fd-mobile-bottom-nav__item--active .fd-mobile-bottom-nav__label[b-ocrk9dwit0] {
    font-weight: var(--fd-weight-semibold, 600);
}

.fd-mobile-bottom-nav__icon[b-ocrk9dwit0] {
    font-size: 1.25rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.fd-mobile-bottom-nav__icon svg[b-ocrk9dwit0] {
    width: 22px;
    height: 22px;
}

.fd-mobile-bottom-nav__label[b-ocrk9dwit0] {
    display: block;
}

@media (min-width: 768px) {
    .fd-mobile-bottom-nav[b-ocrk9dwit0] {
        display: none;
    }
}
/* /Components/Shared/RecipeCard.razor.rz.scp.css */
.fd-recipe-card[b-jgo5fj72de] {
    background-color: var(--fd-color-surface);
    border-radius: var(--fd-radius-lg);
    overflow: hidden;
    border: 1px solid var(--fd-color-border);
    box-shadow: none;
    display: flex;
    flex-direction: column;
    height: 100%;
    transition:
        transform var(--fd-transition-base),
        box-shadow var(--fd-transition-base),
        border-color var(--fd-transition-base);
}

.fd-recipe-card:hover[b-jgo5fj72de],
.fd-recipe-card:focus-within[b-jgo5fj72de] {
    transform: translateY(-3px);
    box-shadow: var(--fd-shadow-md);
    border-color: var(--fd-color-primary);
}

.fd-recipe-card__media[b-jgo5fj72de] {
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background-color: var(--fd-color-cream-100);
}

.fd-recipe-card__media img[b-jgo5fj72de] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.fd-recipe-card__content[b-jgo5fj72de] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-4);
    padding: var(--fd-space-5);
    flex: 1 1 auto;
}

.fd-recipe-card__topline[b-jgo5fj72de],
.fd-recipe-card__category[b-jgo5fj72de] {
    display: flex;
    gap: var(--fd-space-3);
}

.fd-recipe-card__topline[b-jgo5fj72de] {
    justify-content: space-between;
    align-items: center;
}

.fd-recipe-card__category[b-jgo5fj72de] {
    flex: 1 1 auto;
    align-items: center;
    /* Enged zsugorodni, hogy az ellipszis-levágás életbe léphessen (nem taszítja el a Kiemelt jelvényt). */
    min-width: 0;
}

/* A Kiemelt jelvény sosem zsugorodhat vagy lóghat ki a lekerekített kártyaélen. */
.fd-recipe-card__featured[b-jgo5fj72de] {
    flex-shrink: 0;
}

.fd-recipe-card__category-label[b-jgo5fj72de],
.fd-recipe-card__description[b-jgo5fj72de] {
    margin: 0;
}

.fd-recipe-card__category-label[b-jgo5fj72de] {
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-ink-900);
}

.fd-recipe-card__meta[b-jgo5fj72de],
.fd-recipe-card__tags[b-jgo5fj72de] {
    display: flex;
    gap: var(--fd-space-2);
    flex-wrap: wrap;
}

.fd-recipe-card__tags[b-jgo5fj72de] {
    align-items: center;
}

/* "+N" jelzés a levágott diétás címkékhez — visszafogott, nem versenyez a pill-ekkel. */
.fd-recipe-card__tags-more[b-jgo5fj72de] {
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
}

.fd-recipe-card__body[b-jgo5fj72de] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-2);
}

.fd-recipe-card__title[b-jgo5fj72de] {
    margin: 0;
    font-size: var(--fd-text-xl);
    /* Max 2 sor, ellipszissel — egyenletes ritmus a soron belüli kártyák közt. */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.fd-recipe-card__description[b-jgo5fj72de] {
    color: var(--fd-color-ink-700);
    /* Max 2 sor, ellipszissel — a hosszú leírás nem feszíti szét a kártyát. */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.fd-recipe-card__link[b-jgo5fj72de] {
    margin-top: auto;
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-2);
    font-weight: var(--fd-weight-semibold);
}

.fd-recipe-card__link span[b-jgo5fj72de] {
    transition: transform var(--fd-transition-fast);
}

.fd-recipe-card__link:hover span[b-jgo5fj72de],
.fd-recipe-card__link:focus-visible span[b-jgo5fj72de] {
    transform: translateX(3px);
}
/* /Components/Shared/RecipePublicMeta.razor.rz.scp.css */
/* A publikus recept meta-blokk (idő / nehézség / adag chipek) alap-elrendezése — a komponens
   SAJÁT scoped lapja. A gyökér-div-et maga a RecipePublicMeta rendereli, így ez a szabály a
   komponens saját scope-attribútumát kapja meg és mindig érvényesül, ExtraClass-tól függetlenül
   (a szülők — .fd-recipe-card__meta, .fd-recipe-detail-page__badges — csak eltérő értékeket
   írnak felül; a base flex/gap itt, a komponensben él). */
.fd-recipe-public-meta[b-i5grodh2h0] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--fd-space-2);
}
/* /Components/Shared/SavedRecipeCard.razor.rz.scp.css */
/*
    SavedRecipeCard visuals — mirrors RecipeCard.razor.css (scoped CSS doesn't cross component
    boundaries, so the shared fd-recipe-card* class names can't reuse that file's rules here). Adds
    the saved-card action row (open link + optional remove button).
*/

.fd-recipe-card[b-7lqt5t9wbp] {
    background-color: var(--fd-color-surface);
    border-radius: var(--fd-radius-lg);
    overflow: hidden;
    border: 1px solid var(--fd-color-border);
    box-shadow: none;
    display: flex;
    flex-direction: column;
    height: 100%;
    transition:
        transform var(--fd-transition-base),
        box-shadow var(--fd-transition-base),
        border-color var(--fd-transition-base);
}

.fd-recipe-card:hover[b-7lqt5t9wbp],
.fd-recipe-card:focus-within[b-7lqt5t9wbp] {
    transform: translateY(-3px);
    box-shadow: var(--fd-shadow-md);
    border-color: var(--fd-color-primary);
}

.fd-recipe-card__media[b-7lqt5t9wbp] {
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background-color: var(--fd-color-cream-100);
}

.fd-recipe-card__media img[b-7lqt5t9wbp] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.fd-recipe-card__content[b-7lqt5t9wbp] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-4);
    padding: var(--fd-space-5);
    flex: 1 1 auto;
}

.fd-recipe-card__topline[b-7lqt5t9wbp],
.fd-recipe-card__category[b-7lqt5t9wbp] {
    display: flex;
    gap: var(--fd-space-3);
}

.fd-recipe-card__topline[b-7lqt5t9wbp] {
    justify-content: space-between;
    align-items: flex-start;
}

.fd-recipe-card__category[b-7lqt5t9wbp] {
    flex: 1 1 auto;
}

.fd-recipe-card__category-label[b-7lqt5t9wbp],
.fd-recipe-card__description[b-7lqt5t9wbp] {
    margin: 0;
}

.fd-recipe-card__category-label[b-7lqt5t9wbp] {
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-ink-900);
}

.fd-recipe-card__meta[b-7lqt5t9wbp] {
    display: flex;
    gap: var(--fd-space-2);
    flex-wrap: wrap;
}

.fd-recipe-card__body[b-7lqt5t9wbp] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-2);
}

.fd-recipe-card__title[b-7lqt5t9wbp] {
    margin: 0;
    font-size: var(--fd-text-xl);
}

.fd-recipe-card__description[b-7lqt5t9wbp] {
    color: var(--fd-color-ink-700);
}

/* Action row pinned to the card foot: open link + optional remove. */
.fd-recipe-card__saved-actions[b-7lqt5t9wbp] {
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--fd-space-3);
    flex-wrap: wrap;
}

.fd-recipe-card__link[b-7lqt5t9wbp] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-2);
    font-weight: var(--fd-weight-semibold);
}

.fd-recipe-card__link span[b-7lqt5t9wbp] {
    transition: transform var(--fd-transition-fast);
}

.fd-recipe-card__link:hover span[b-7lqt5t9wbp],
.fd-recipe-card__link:focus-visible span[b-7lqt5t9wbp] {
    transform: translateX(3px);
}

.fd-recipe-card__remove[b-7lqt5t9wbp] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-2);
    background: none;
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-md);
    padding: var(--fd-space-2) var(--fd-space-3);
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    cursor: pointer;
    transition:
        color var(--fd-transition-fast),
        border-color var(--fd-transition-fast),
        background-color var(--fd-transition-fast);
}

.fd-recipe-card__remove:hover:not(:disabled)[b-7lqt5t9wbp],
.fd-recipe-card__remove:focus-visible:not(:disabled)[b-7lqt5t9wbp] {
    color: var(--fd-color-danger, #b3261e);
    border-color: var(--fd-color-danger, #b3261e);
}

.fd-recipe-card__remove:disabled[b-7lqt5t9wbp] {
    opacity: 0.6;
    cursor: default;
}
/* /Components/Shared/Section.razor.rz.scp.css */
.fd-section[b-7nzrrwylcg] {
    padding-block: var(--fd-space-7);
    background-color: transparent;
}

.fd-section--cream[b-7nzrrwylcg] {
    background-color: var(--fd-color-cream-100);
}

.fd-section--surface[b-7nzrrwylcg] {
    background-color: var(--fd-color-surface);
}

.fd-section--green[b-7nzrrwylcg] {
    background-color: var(--fd-color-green-100);
}

.fd-section--sage[b-7nzrrwylcg] {
    background-color: var(--fd-color-sage-50);
}

.fd-section__inner[b-7nzrrwylcg] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-6);
}

.fd-section__header[b-7nzrrwylcg] {
    max-width: 720px;
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
}

.fd-section__eyebrow[b-7nzrrwylcg] {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--fd-text-sm);
    font-weight: var(--fd-weight-semibold);
    color: var(--fd-color-accent-strong);
}

.fd-section__title[b-7nzrrwylcg] {
    margin: 0;
}

.fd-section__lead[b-7nzrrwylcg] {
    margin: 0;
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-lg);
}

@media (min-width: 768px) {
    .fd-section[b-7nzrrwylcg] {
        padding-block: var(--fd-space-8);
    }
}
/* /Components/Shared/ServiceCard.razor.rz.scp.css */
.fd-card[b-xdqhpyz9iw] {
    background-color: var(--fd-color-surface);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-lg);
    padding: var(--fd-space-5);
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
    box-shadow: var(--fd-shadow-sm);
    transition:
        transform var(--fd-transition-base),
        box-shadow var(--fd-transition-base),
        border-color var(--fd-transition-base);
    height: 100%;
}

.fd-card:hover[b-xdqhpyz9iw],
.fd-card:focus-within[b-xdqhpyz9iw] {
    transform: translateY(-2px);
    box-shadow: var(--fd-shadow-md);
    border-color: var(--fd-color-green-500);
}

.fd-card--featured[b-xdqhpyz9iw] {
    background:
        linear-gradient(135deg, var(--fd-color-cream-100) 0%, var(--fd-color-orange-100) 100%);
    border-color: var(--fd-color-accent);
}

.fd-card__icon[b-xdqhpyz9iw] {
    width: 56px;
    height: 56px;
    border-radius: var(--fd-radius-md);
    background-color: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
    display: grid;
    place-items: center;
    font-size: 28px;
    line-height: 1;
}

.fd-card--featured .fd-card__icon[b-xdqhpyz9iw] {
    background-color: var(--fd-color-accent);
    color: #fff;
}

.fd-card__tag[b-xdqhpyz9iw] {
    align-self: flex-start;
    font-size: var(--fd-text-xs);
    font-weight: var(--fd-weight-semibold);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--fd-color-accent-strong);
    background-color: var(--fd-color-orange-100);
    border-radius: var(--fd-radius-pill);
    padding: 4px var(--fd-space-3);
}

.fd-card__title[b-xdqhpyz9iw] {
    margin: 0;
    font-size: var(--fd-text-xl);
    color: var(--fd-color-ink-900);
}

.fd-card__description[b-xdqhpyz9iw] {
    margin: 0;
    color: var(--fd-color-ink-700);
    line-height: var(--fd-leading-snug);
}

.fd-card__body[b-xdqhpyz9iw] {
    color: var(--fd-color-ink-700);
}

[b-xdqhpyz9iw] .fd-card__cta {
    margin-top: auto;
    align-self: flex-start;
}
/* /Components/Shared/SiteFooter.razor.rz.scp.css */
.fd-site-footer[b-zq6qfjp0nr] {
    background: var(--fd-color-green-700);
    color: #fff;
    margin-top: var(--fd-space-8);
    /* Mobilon a fixált alsó nav (MobileBottomNav, ~58px, >=768px-en rejtve) elfedné a lábléc
       alját — mióta a nyelvváltó a legalsó sub-elem, ezt tartani kell. A main.fd-main 64px-es
       tartalék-mintáját tükrözzük; desktopon nincs alsó nav, ott nullázzuk. */
    padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px));
}

.fd-site-footer__inner[b-zq6qfjp0nr] {
    display: grid;
    gap: var(--fd-space-5);
    padding-block: var(--fd-space-6);
}

.fd-site-footer__brand p[b-zq6qfjp0nr] {
    margin-bottom: 0;
    color: rgba(255, 255, 255, 0.88);
}

.fd-site-footer__nav-group[b-zq6qfjp0nr] {
    display: grid;
    gap: var(--fd-space-3);
}

.fd-site-footer__label[b-zq6qfjp0nr] {
    font-size: var(--fd-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: rgba(255, 255, 255, 0.7);
    font-weight: var(--fd-weight-semibold);
}

.fd-site-footer__links[b-zq6qfjp0nr] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-2);
}

.fd-site-footer__links a[b-zq6qfjp0nr] {
    color: #fff;
}

.fd-site-footer__links a:hover[b-zq6qfjp0nr],
.fd-site-footer__links a:focus-visible[b-zq6qfjp0nr] {
    color: var(--fd-color-orange-100);
}

.fd-site-footer__sub[b-zq6qfjp0nr] {
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.fd-site-footer__sub-inner[b-zq6qfjp0nr] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-3);
    padding-block: var(--fd-space-4);
    font-size: var(--fd-text-sm);
}

.fd-site-footer__copyright[b-zq6qfjp0nr] {
    margin: 0;
    color: rgba(255, 255, 255, 0.7);
}

/* A legal linkek + nyelvváltó egy csoportban, hogy az alsó sávban jobbra
   kerüljenek (a copyright marad balra); mobilon a sub-inner oszlopba tör. */
.fd-site-footer__sub-actions[b-zq6qfjp0nr] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--fd-space-3);
}

.fd-site-footer__sub-nav[b-zq6qfjp0nr] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--fd-space-4);
}

.fd-site-footer__sub-nav a[b-zq6qfjp0nr] {
    color: rgba(255, 255, 255, 0.85);
    padding-block: var(--fd-space-2);
    display: inline-flex;
    align-items: center;
    min-height: 32px;
}

.fd-site-footer__sub-nav a:hover[b-zq6qfjp0nr],
.fd-site-footer__sub-nav a:focus-visible[b-zq6qfjp0nr] {
    color: #fff;
}

@media (min-width: 768px) {
    .fd-site-footer[b-zq6qfjp0nr] {
        /* Desktopon nincs fixált alsó nav — nem kell alsó tartalék. */
        padding-bottom: 0;
    }

    .fd-site-footer__inner[b-zq6qfjp0nr] {
        grid-template-columns: 2fr 1fr 1fr;
        align-items: start;
        gap: var(--fd-space-6);
    }

    .fd-site-footer__sub-inner[b-zq6qfjp0nr] {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

    .fd-site-footer__sub-actions[b-zq6qfjp0nr] {
        flex-direction: row;
        align-items: center;
        gap: var(--fd-space-5);
    }
}
/* /Components/Shared/SiteHeader.razor.rz.scp.css */
.fd-site-header[b-1a43gz2bv3] {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(253, 248, 239, 0.92);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--fd-color-border);
}

.fd-site-header__inner[b-1a43gz2bv3] {
    min-height: var(--fd-header-height);
    display: grid;
    grid-template-columns: 1fr auto;
    gap: var(--fd-space-3);
    padding-block: var(--fd-space-3);
    align-items: center;
}

.fd-site-header__brand[b-1a43gz2bv3] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-3);
    color: var(--fd-color-text);
    text-decoration: none;
}

.fd-site-header__brand strong[b-1a43gz2bv3],
.fd-site-header__brand small[b-1a43gz2bv3] {
    display: block;
}

.fd-site-header__brand small[b-1a43gz2bv3] {
    color: var(--fd-color-text-muted);
    font-size: var(--fd-text-sm);
}

.fd-site-header__mark[b-1a43gz2bv3] {
    inline-size: 2.75rem;
    block-size: 2.75rem;
    display: grid;
    place-items: center;
}

/* The brand logo is a self-contained badge (its own ring) on a transparent
   background — show it directly, no coloured circle behind it. */
.fd-site-header__mark-img[b-1a43gz2bv3] {
    inline-size: 100%;
    block-size: 100%;
    object-fit: contain;
}

.fd-site-header__nav[b-1a43gz2bv3] {
    display: none;
    gap: var(--fd-space-3);
}

.fd-site-header__nav a[b-1a43gz2bv3] {
    color: var(--fd-color-text);
    font-weight: var(--fd-weight-medium);
    text-decoration: none;
    padding-bottom: 2px;
    border-bottom: 2px solid transparent;
}

.fd-site-header__nav a[aria-current="page"][b-1a43gz2bv3] {
    color: var(--fd-color-primary-strong);
    font-weight: var(--fd-weight-semibold);
    border-bottom-color: var(--fd-color-primary-strong);
}

/* CTA / auth area — visible on ALL breakpoints (mobil: kompakt belépés/fiók a jobb felső sarokban,
   mert a hamburger + drawer megszűnt; a fő navigációt a fixált alsó nav viszi). */
.fd-site-header__cta[b-1a43gz2bv3] {
    display: flex;
    align-items: center;
    gap: var(--fd-space-2);
    justify-content: flex-end;
    min-inline-size: 0;
}

.fd-site-header__cta .fd-cta[b-1a43gz2bv3] {
    width: auto;
}

/* A nagy elsődleges CTA ("INGYENES MINTAÉTREND" / "Étrendjeim") mobilon rejtett — az oldalon belüli
   CTA-k viszik (hero lead-magnet), hogy ne zsúfolja a fejlécet. Csak ≥768px-en jelenik meg. */
.fd-site-header__cta-primary[b-1a43gz2bv3] {
    display: none;
}

/* Mobilon a Regisztráció túl szűk lenne a márka mellett ~360px-en; csak a Belépés marad, a
   regisztráció a belépő oldal "Nincs még fiókod? Regisztráció" linkjéről elérhető. ≥768px-en
   mindkettő látszik. */
.fd-site-header__auth-link--strong[b-1a43gz2bv3] {
    display: none;
}

/* ── Auth entries (desktop) ─────────────────────────────────────────────── */
.fd-site-header__auth-link[b-1a43gz2bv3] {
    color: var(--fd-color-text);
    font-weight: var(--fd-weight-medium);
    text-decoration: none;
    padding: var(--fd-space-2) var(--fd-space-3);
    border-radius: var(--fd-radius-sm);
    white-space: nowrap;
}

.fd-site-header__auth-link:hover[b-1a43gz2bv3],
.fd-site-header__auth-link:focus-visible[b-1a43gz2bv3] {
    color: var(--fd-color-primary-strong);
}

.fd-site-header__auth-link--strong[b-1a43gz2bv3] {
    border: 1px solid var(--fd-color-primary);
    color: var(--fd-color-primary-strong);
}

/* Account dropdown */
.fd-site-header__account[b-1a43gz2bv3] {
    position: relative;
}

.fd-site-header__account-toggle[b-1a43gz2bv3] {
    display: inline-flex;
    align-items: center;
    gap: var(--fd-space-2);
    background: transparent;
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-pill);
    padding: var(--fd-space-1) var(--fd-space-3) var(--fd-space-1) var(--fd-space-1);
    cursor: pointer;
    color: var(--fd-color-text);
    font-weight: var(--fd-weight-medium);
    max-inline-size: 12rem;
}

.fd-site-header__account-toggle:hover[b-1a43gz2bv3],
.fd-site-header__account-toggle:focus-visible[b-1a43gz2bv3] {
    border-color: var(--fd-color-primary);
}

.fd-site-header__account-avatar[b-1a43gz2bv3] {
    display: grid;
    place-items: center;
    inline-size: 1.9rem;
    block-size: 1.9rem;
    border-radius: 50%;
    background: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
    font-weight: var(--fd-weight-semibold);
    flex: none;
}

/* Mobilon a fiók-toggle kompakt: csak az avatar + karet látszik, a név ≥768px-en jelenik meg. */
.fd-site-header__account-name[b-1a43gz2bv3] {
    display: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--fd-text-sm);
}

.fd-site-header__account-caret[b-1a43gz2bv3] {
    font-size: var(--fd-text-xs);
    color: var(--fd-color-text-muted);
}

.fd-site-header__account-menu[b-1a43gz2bv3] {
    position: absolute;
    top: calc(100% + var(--fd-space-2));
    right: 0;
    min-inline-size: 14rem;
    /* Ne lógjon ki a jobb szélen kis kijelzőn: a jobbra igazított menü szélessége a viewporthoz kötve. */
    max-inline-size: min(16rem, calc(100vw - var(--fd-space-4)));
    background: var(--fd-color-surface);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-md);
    box-shadow: var(--fd-shadow-lg);
    padding: var(--fd-space-2);
    display: flex;
    flex-direction: column;
    gap: 2px;
    z-index: 220;
}

.fd-site-header__account-email[b-1a43gz2bv3] {
    padding: var(--fd-space-2) var(--fd-space-3);
    font-size: var(--fd-text-xs);
    color: var(--fd-color-text-muted);
    border-bottom: 1px solid var(--fd-color-border);
    margin-bottom: var(--fd-space-1);
    overflow: hidden;
    text-overflow: ellipsis;
}

.fd-site-header__account-menu a[b-1a43gz2bv3],
.fd-site-header__account-menu button[b-1a43gz2bv3] {
    display: block;
    text-align: left;
    width: 100%;
    padding: var(--fd-space-2) var(--fd-space-3);
    border: none;
    background: transparent;
    border-radius: var(--fd-radius-sm);
    color: var(--fd-color-text);
    font: inherit;
    font-size: var(--fd-text-sm);
    text-decoration: none;
    cursor: pointer;
}

.fd-site-header__account-menu a:hover[b-1a43gz2bv3],
.fd-site-header__account-menu a:focus-visible[b-1a43gz2bv3],
.fd-site-header__account-menu button:hover[b-1a43gz2bv3],
.fd-site-header__account-menu button:focus-visible[b-1a43gz2bv3] {
    background: var(--fd-color-green-100);
    color: var(--fd-color-primary-strong);
}

@media (min-width: 768px) {
    .fd-site-header__inner[b-1a43gz2bv3] {
        grid-template-columns: auto 1fr auto;
    }

    .fd-site-header__nav[b-1a43gz2bv3] {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    .fd-site-header__cta[b-1a43gz2bv3] {
        gap: var(--fd-space-3);
    }

    /* Desktopon a teljes CTA-készlet: elsődleges CTA, a fiók-név és a Regisztráció is megjelenik. */
    .fd-site-header__cta-primary[b-1a43gz2bv3] {
        display: block;
    }

    .fd-site-header__auth-link--strong[b-1a43gz2bv3] {
        display: inline-block;
    }

    .fd-site-header__account-name[b-1a43gz2bv3] {
        display: inline;
    }
}
/* /Components/Shared/StatCard.razor.rz.scp.css */
.fd-stat-card[b-9nal2agfid] {
    display: flex;
    flex-direction: column;
    gap: var(--fd-space-2);
    padding: var(--fd-space-5);
    background-color: var(--fd-color-surface);
    border: 1px solid var(--fd-color-border);
    border-radius: var(--fd-radius-lg);
    box-shadow: var(--fd-shadow-sm);
    text-align: left;
}

.fd-stat-card__value[b-9nal2agfid] {
    font-family: var(--fd-font-display);
    font-size: var(--fd-text-3xl);
    font-weight: var(--fd-weight-bold);
    line-height: var(--fd-leading-tight);
    color: var(--fd-color-primary-strong);
    letter-spacing: -0.02em;
}

.fd-stat-card__label[b-9nal2agfid] {
    font-size: var(--fd-text-sm);
    color: var(--fd-color-text-muted);
    line-height: var(--fd-leading-snug);
}

@media (min-width: 768px) {
    .fd-stat-card__value[b-9nal2agfid] {
        font-size: var(--fd-text-4xl);
    }
}