@import '_content/Microsoft.FluentUI.AspNetCore.Components/Microsoft.FluentUI.AspNetCore.Components.lcdo7z9xd2.bundle.scp.css';

/* /Components/Layout/MainLayout.razor.rz.scp.css */
.shell[b-8pgkgjii30] {
    min-height: 100vh;
    background:
        radial-gradient(circle at top right, rgba(244, 188, 77, 0.18), transparent 22rem),
        linear-gradient(180deg, #fffdfa 0%, #ffffff 28%, #f6f9fc 100%);
    color: var(--lemaro-ink);
}

.shell__header[b-8pgkgjii30] {
    position: sticky;
    top: 0;
    z-index: 10;
    border-bottom: 1px solid rgba(14, 79, 138, 0.08);
    background: rgba(255, 255, 255, 0.97);
    backdrop-filter: blur(12px);
    box-shadow: 0 10px 24px rgba(14, 79, 138, 0.04);
}

.shell__header-inner[b-8pgkgjii30] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    padding: 1rem clamp(1rem, 2vw, 2rem) 0.95rem;
}

.shell__brand[b-8pgkgjii30] {
    display: inline-flex;
    align-items: center;
    gap: 0.85rem;
    color: inherit;
    text-decoration: none;
    min-width: 0;
}

.shell__logo[b-8pgkgjii30] {
    width: 3.4rem;
    height: 3.4rem;
    object-fit: contain;
    filter: drop-shadow(0 8px 16px rgba(14, 79, 138, 0.12));
}

.shell__brand-copy[b-8pgkgjii30] {
    display: grid;
    gap: 0.08rem;
    min-width: 0;
}

.shell__brand-name[b-8pgkgjii30] {
    font-family: var(--lemaro-heading-font);
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    color: var(--lemaro-navy);
}

.shell__brand-subtitle[b-8pgkgjii30] {
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--lemaro-muted);
    white-space: nowrap;
}

.shell__header-actions[b-8pgkgjii30] {
    flex: 1;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1.5rem;
}

.shell__header-actions--guest[b-8pgkgjii30] {
    flex: 0 0 auto;
    display: flex;
    justify-content: flex-end;
}

.shell__nav[b-8pgkgjii30] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1.75rem;
    flex-wrap: wrap;
}

.shell__nav a[b-8pgkgjii30] {
    position: relative;
    display: inline-flex;
    align-items: center;
    color: var(--lemaro-navy);
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    padding: 0.35rem 0;
    transition: color 0.18s ease;
}

.shell__nav a[b-8pgkgjii30]::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -0.55rem;
    height: 3px;
    border-radius: 999px;
    background: var(--lemaro-orange);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.18s ease;
}

.shell__nav a:hover[b-8pgkgjii30] {
    color: var(--lemaro-orange);
}

.shell__nav a.active[b-8pgkgjii30] {
    color: var(--lemaro-navy);
    font-weight: 700;
}

.shell__nav a:hover[b-8pgkgjii30]::after,
.shell__nav a.active[b-8pgkgjii30]::after {
    transform: scaleX(1);
}

.shell__utility[b-8pgkgjii30] {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    flex-shrink: 0;
}

.shell__user[b-8pgkgjii30] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.08rem;
    min-width: 0;
}

.shell__user-meta[b-8pgkgjii30] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.shell__context-link[b-8pgkgjii30] {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    margin-top: 0.18rem;
    color: var(--lemaro-orange);
    text-decoration: none;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.01em;
}

.shell__context-link:hover[b-8pgkgjii30] {
    color: var(--lemaro-orange-hover);
    text-decoration: underline;
}

.shell__user-label[b-8pgkgjii30] {
    color: var(--lemaro-muted);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.shell__user-meta strong[b-8pgkgjii30] {
    color: var(--lemaro-ink);
    font-size: 0.92rem;
}

.shell__logout-form[b-8pgkgjii30] {
    margin: 0;
}

.shell__logout[b-8pgkgjii30],
.shell__login[b-8pgkgjii30] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.35rem;
    padding: 0.55rem 1rem;
    border-radius: 999px;
    border: 1px solid rgba(14, 79, 138, 0.14);
    background: #ffffff;
    color: var(--lemaro-blue);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(14, 79, 138, 0.05);
    transition: border-color 0.18s ease, background-color 0.18s ease, color 0.18s ease;
}

.shell__logout:hover[b-8pgkgjii30],
.shell__login:hover[b-8pgkgjii30] {
    background: #f7fafc;
    border-color: rgba(242, 129, 41, 0.34);
    color: var(--lemaro-orange);
}

.shell__logout:focus-visible[b-8pgkgjii30],
.shell__login:focus-visible[b-8pgkgjii30],
.shell__nav a:focus-visible[b-8pgkgjii30],
.shell__context-link:focus-visible[b-8pgkgjii30] {
    outline: 2px solid rgba(242, 129, 41, 0.3);
    outline-offset: 4px;
}

.shell__content[b-8pgkgjii30] {
    width: 100%;
    max-width: none;
    padding: 2.2rem clamp(1rem, 2vw, 2rem) 3.5rem;
}

.shell__content--wide[b-8pgkgjii30] {
    width: 100%;
    padding-left: clamp(1rem, 2vw, 2rem);
    padding-right: clamp(1rem, 2vw, 2rem);
}

#blazor-error-ui[b-8pgkgjii30] {
    color-scheme: light only;
    background: #8f1d1d;
    color: #ffffff;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.75rem 1.25rem 0.85rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .reload[b-8pgkgjii30] {
    color: #ffffff;
    font-weight: 700;
}

#blazor-error-ui .dismiss[b-8pgkgjii30] {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

@media (max-width: 980px) {
    .shell__header-inner[b-8pgkgjii30] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .shell__header-actions[b-8pgkgjii30] {
        width: 100%;
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .shell__nav[b-8pgkgjii30] {
        justify-content: flex-start;
        gap: 1.15rem 1.4rem;
    }

    .shell__utility[b-8pgkgjii30] {
        justify-content: space-between;
    }
}

@media (max-width: 640px) {
    .shell__header-inner[b-8pgkgjii30] {
        padding: 0.9rem 1rem;
    }

    .shell__brand[b-8pgkgjii30] {
        align-items: flex-start;
    }

    .shell__brand-subtitle[b-8pgkgjii30] {
        white-space: normal;
    }

    .shell__logo[b-8pgkgjii30] {
        width: 3.2rem;
        height: 3.2rem;
    }

    .shell__header-actions[b-8pgkgjii30] {
        gap: 0.85rem;
    }

    .shell__nav[b-8pgkgjii30] {
        gap: 0.8rem 1.1rem;
    }

    .shell__nav a[b-8pgkgjii30]::after {
        bottom: -0.4rem;
    }

    .shell__utility[b-8pgkgjii30] {
        align-items: stretch;
        flex-direction: column;
        gap: 0.7rem;
    }

    .shell__user[b-8pgkgjii30] {
        width: 100%;
    }

    .shell__logout[b-8pgkgjii30],
    .shell__login[b-8pgkgjii30] {
        width: 100%;
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-p8eefr1iug],
.components-reconnect-repeated-attempt-visible[b-p8eefr1iug],
.components-reconnect-failed-visible[b-p8eefr1iug],
.components-pause-visible[b-p8eefr1iug],
.components-resume-failed-visible[b-p8eefr1iug],
.components-rejoining-animation[b-p8eefr1iug] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-p8eefr1iug],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-p8eefr1iug],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-p8eefr1iug],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-p8eefr1iug],
#components-reconnect-modal.components-reconnect-retrying[b-p8eefr1iug],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-p8eefr1iug],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-p8eefr1iug],
#components-reconnect-modal.components-reconnect-failed[b-p8eefr1iug],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-p8eefr1iug] {
    display: block;
}


#components-reconnect-modal[b-p8eefr1iug] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-p8eefr1iug 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-p8eefr1iug 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-p8eefr1iug 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-p8eefr1iug]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-p8eefr1iug 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-p8eefr1iug {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-p8eefr1iug {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-p8eefr1iug {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-p8eefr1iug] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-p8eefr1iug] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-p8eefr1iug] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-p8eefr1iug] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-p8eefr1iug] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-p8eefr1iug] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-p8eefr1iug] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-p8eefr1iug 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-p8eefr1iug] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-p8eefr1iug {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/AccessDenied.razor.rz.scp.css */
/* ============================================================
   LEMARO DASHBOARD — ACCESS DENIED PAGE
   Harmonized to match Customers.razor clean enterprise style.
   ============================================================ */

.access-denied[b-27nlojmjos] {
    max-width: 480px;
    padding: 2rem 2rem 2.25rem;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-top: 3px solid var(--lemaro-navy);
    border-radius: 1rem;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06), 0 4px 12px rgba(15,23,42,0.06);
    display: grid;
    gap: 1rem;
}

.access-denied__eyebrow[b-27nlojmjos] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--lemaro-navy);
}

.access-denied h1[b-27nlojmjos] {
    margin: 0 0 0.25rem;
    font-size: 1.75rem;
    color: var(--lemaro-navy);
    letter-spacing: -0.02em;
}

.access-denied p[b-27nlojmjos] {
    margin: 0;
    color: #64748B;
    font-size: 0.95rem;
}

.access-denied__path[b-27nlojmjos] {
    color: #334155;
    font-size: 0.9rem;
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 0.75rem;
    padding: 0.75rem 0.9rem;
}

.access-denied__path strong[b-27nlojmjos] {
    color: var(--lemaro-navy);
    font-weight: 700;
}

.access-denied__actions[b-27nlojmjos] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 0.25rem;
}

.access-denied__primary[b-27nlojmjos],
.access-denied__secondary[b-27nlojmjos] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.375rem;
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.875rem;
    border: 1px solid transparent;
    transition: background 100ms ease, border-color 100ms ease, color 100ms ease;
}

.access-denied__primary[b-27nlojmjos] {
    background: var(--lemaro-orange);
    color: #ffffff;
    border-color: var(--lemaro-orange);
}

.access-denied__primary:hover[b-27nlojmjos] {
    background: var(--lemaro-orange-hover);
    border-color: var(--lemaro-orange-hover);
    color: #ffffff;
}

.access-denied__secondary[b-27nlojmjos] {
    background: #F1F5F9;
    color: #1E293B;
    border-color: #E2E8F0;
}

.access-denied__secondary:hover[b-27nlojmjos] {
    background: #E2E8F0;
    border-color: #CBD5E1;
    color: #1E293B;
}
/* /Components/Pages/Account.razor.rz.scp.css */
/* ============================================================
   LEMARO DASHBOARD — ACCOUNT PAGE
   ============================================================ */

.account-page[b-umq5f7sia2] {
    padding: 0 0 3rem;
}

.account-grid[b-umq5f7sia2] {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: 1fr;
    max-width: 52rem;
}

@media (min-width: 640px) {
    .account-grid[b-umq5f7sia2] {
        grid-template-columns: 1fr 1fr;
    }
}

.account-card[b-umq5f7sia2] {
    padding: 1.5rem;
}

.account-card__header[b-umq5f7sia2] {
    margin-bottom: 1.25rem;
}

.account-card__header h2[b-umq5f7sia2] {
    margin: 0;
    font-size: 1.05rem;
    color: var(--lemaro-navy);
    font-weight: 700;
}

.account-info-list[b-umq5f7sia2] {
    display: grid;
    gap: 0.75rem;
    margin: 0;
}

.account-info-list__row[b-umq5f7sia2] {
    display: grid;
    gap: 0.25rem;
}

.account-info-list__row dt[b-umq5f7sia2] {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748B;
}

.account-info-list__row dd[b-umq5f7sia2] {
    margin: 0;
    color: var(--lemaro-navy);
    font-weight: 500;
    font-size: 0.9rem;
    word-break: break-all;
}

.account-alert[b-umq5f7sia2] {
    margin-bottom: 1rem;
}

.account-form[b-umq5f7sia2] {
    display: grid;
    gap: 0.5rem;
}

.account-fluent-field[b-umq5f7sia2] {
    width: 100%;
}

.account-fluent-submit[b-umq5f7sia2] {
    width: 100%;
    margin-top: 0.5rem;
}

.account-validation[b-umq5f7sia2] {
    color: #C0392B;
    font-size: 0.85rem;
}
/* /Components/Pages/AgendaKoppeling.razor.rz.scp.css */
/* ============================================================
   LEMARO DASHBOARD — AGENDA KOPPELING PAGE
   Consistent met Users.razor clean aesthetic.
   ============================================================ */

.agenda-koppeling-page[b-gq1r51lhlm] {
    display: grid;
    gap: 1.25rem;
    padding-bottom: 1.5rem;
}

/* ── Header ────────────────────────────────────────────────── */
.agenda-koppeling-header[b-gq1r51lhlm] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 1rem;
    padding: 1.5rem 1.75rem;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06), 0 1px 2px rgba(15,23,42,0.04);
}

.agenda-koppeling-header__copy[b-gq1r51lhlm] {
    min-width: 0;
}

.agenda-koppeling-header h1[b-gq1r51lhlm] {
    margin: 0.25rem 0 0.4rem;
    font-size: clamp(1.4rem, 2.5vw, 1.9rem);
    color: var(--lemaro-navy);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.15;
}

.agenda-koppeling-header p[b-gq1r51lhlm] {
    margin: 0;
    color: #64748B;
    font-size: 0.9rem;
}

.agenda-koppeling-eyebrow[b-gq1r51lhlm] {
    display: block;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #94A3B8;
    margin-bottom: 0.1rem;
}

/* ── Alerts ────────────────────────────────────────────────── */
.agenda-koppeling-alert[b-gq1r51lhlm] {
    border-radius: 0.6rem;
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    font-weight: 500;
}

.agenda-koppeling-alert--error[b-gq1r51lhlm] {
    background: #FEF2F2;
    border: 1px solid #FCA5A5;
    color: #991B1B;
}

.agenda-koppeling-alert--success[b-gq1r51lhlm] {
    background: #F0FDF4;
    border: 1px solid #86EFAC;
    color: #166534;
}

.agenda-koppeling-placeholder[b-gq1r51lhlm] {
    color: #94A3B8;
    font-size: 0.875rem;
    padding: 1rem 0;
}

/* ── Inspector list card ───────────────────────────────────── */
.agenda-koppeling-card[b-gq1r51lhlm] {
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 1rem;
    padding: 1.5rem 1.75rem;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06), 0 1px 2px rgba(15,23,42,0.04);
    display: grid;
    gap: 1.25rem;
}

.agenda-koppeling-card__header h2[b-gq1r51lhlm] {
    margin: 0.2rem 0 0.4rem;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--lemaro-navy);
}

.agenda-koppeling-card__header p[b-gq1r51lhlm] {
    margin: 0;
    font-size: 0.85rem;
    color: #64748B;
}

/* ── Inspector list ────────────────────────────────────────── */
.agenda-koppeling-list[b-gq1r51lhlm] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.5rem;
}

.agenda-koppeling-list__item[b-gq1r51lhlm] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding: 0.875rem 1rem;
    border-radius: 0.75rem;
    border: 1px solid #E2E8F0;
    background: #F8FAFC;
    transition: border-color 0.15s, background 0.15s;
}

.agenda-koppeling-list__item--linked[b-gq1r51lhlm] {
    background: #F0FDF4;
    border-color: #86EFAC;
}

.agenda-koppeling-inspector-dot[b-gq1r51lhlm] {
    flex-shrink: 0;
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,0.6);
    box-shadow: 0 0 0 1px rgba(0,0,0,0.12);
}

.agenda-koppeling-inspector-info[b-gq1r51lhlm] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.agenda-koppeling-inspector-name[b-gq1r51lhlm] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--lemaro-navy);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.agenda-koppeling-inspector-email[b-gq1r51lhlm] {
    font-size: 0.78rem;
    color: #64748B;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Toggle switch (scoped copy of users-switch) ───────────── */
.agenda-toggle[b-gq1r51lhlm] {
    position: relative;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    cursor: pointer;
}

.agenda-toggle__input[b-gq1r51lhlm] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.agenda-toggle__track[b-gq1r51lhlm] {
    display: inline-flex;
    align-items: center;
    width: 5rem;
    height: 1.75rem;
    border-radius: 2rem;
    background: #CBD5E1;
    position: relative;
    transition: background 0.2s;
    overflow: hidden;
    border: 1px solid #94A3B8;
}

.agenda-toggle__input:checked ~ .agenda-toggle__track[b-gq1r51lhlm] {
    background: var(--lemaro-accent, #E65100);
    border-color: var(--lemaro-accent, #E65100);
}

.agenda-toggle__input:disabled ~ .agenda-toggle__track[b-gq1r51lhlm] {
    opacity: 0.5;
    cursor: not-allowed;
}

.agenda-toggle__segment[b-gq1r51lhlm] {
    flex: 1;
    text-align: center;
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    color: #FFFFFF;
    text-shadow: 0 1px 1px rgba(0,0,0,0.15);
    user-select: none;
    transition: opacity 0.15s;
}

.agenda-toggle__segment--on[b-gq1r51lhlm] {
    opacity: 0;
    padding-right: 0.25rem;
}

.agenda-toggle__segment--off[b-gq1r51lhlm] {
    opacity: 1;
    padding-left: 0.25rem;
}

.agenda-toggle__input:checked ~ .agenda-toggle__track .agenda-toggle__segment--on[b-gq1r51lhlm] {
    opacity: 1;
}

.agenda-toggle__input:checked ~ .agenda-toggle__track .agenda-toggle__segment--off[b-gq1r51lhlm] {
    opacity: 0;
}

.agenda-toggle--busy[b-gq1r51lhlm] {
    opacity: 0.6;
    pointer-events: none;
}

/* ── Bulk action toolbar ───────────────────────────────────── */
.agenda-koppeling-bulk-toolbar[b-gq1r51lhlm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 0.625rem 0.25rem 0.875rem;
    border-bottom: 1px solid #E2E8F0;
}

.agenda-koppeling-bulk-counter[b-gq1r51lhlm] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #64748B;
    white-space: nowrap;
}

.agenda-koppeling-bulk-actions[b-gq1r51lhlm] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}
/* /Components/Pages/CustomerContactDetail.razor.rz.scp.css */
.customer-entity-page[b-oyon6qc4sp] {
    --customer-entity-ink: #10263a;
    --customer-entity-muted: #587086;
    --customer-entity-line: rgba(14, 79, 138, 0.14);
    --customer-entity-panel: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 249, 252, 0.98));
    --customer-entity-shadow: 0 20px 48px rgba(14, 79, 138, 0.08);
    display: grid;
    gap: 1.25rem;
    padding-bottom: 1rem;
}

.customer-entity-hero[b-oyon6qc4sp],
.customer-entity-card[b-oyon6qc4sp],
.customer-entity-form[b-oyon6qc4sp],
.customer-entity-confirm[b-oyon6qc4sp] {
    background: var(--customer-entity-panel);
    border: 1px solid var(--customer-entity-line);
    border-radius: 1.5rem;
    box-shadow: var(--customer-entity-shadow);
}

.customer-entity-hero[b-oyon6qc4sp] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: start;
    padding: 1.55rem 1.6rem;
    background:
        radial-gradient(circle at top left, rgba(14, 79, 138, 0.12), transparent 34%),
        radial-gradient(circle at bottom right, rgba(242, 129, 41, 0.12), transparent 30%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 250, 252, 0.98));
}

.customer-entity-hero h1[b-oyon6qc4sp],
.customer-entity-card h2[b-oyon6qc4sp],
.customer-entity-form h2[b-oyon6qc4sp] {
    margin: 0;
    color: var(--customer-entity-ink);
}

.customer-entity-hero h1[b-oyon6qc4sp] {
    font-size: clamp(2rem, 3vw, 2.8rem);
    line-height: 1.02;
    margin-top: 0.55rem;
}

.customer-entity-hero p[b-oyon6qc4sp],
.customer-entity-card p[b-oyon6qc4sp],
.customer-entity-confirm p[b-oyon6qc4sp],
.customer-entity-placeholder[b-oyon6qc4sp] {
    margin: 0;
    color: var(--customer-entity-muted);
}

.customer-entity-eyebrow[b-oyon6qc4sp],
.customer-entity-field span[b-oyon6qc4sp],
.customer-entity-context-item span[b-oyon6qc4sp] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #003366;
}

.customer-entity-hero__meta[b-oyon6qc4sp],
.customer-entity-actions[b-oyon6qc4sp],
.customer-entity-card__header[b-oyon6qc4sp],
.customer-entity-context-list[b-oyon6qc4sp] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
}

.customer-entity-actions[b-oyon6qc4sp] {
    justify-content: flex-end;
}

.customer-entity-action[b-oyon6qc4sp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1rem;
    border: 1px solid #003366;
    border-radius: 999px;
    background: transparent;
    color: #003366;
    font-weight: 700;
    cursor: pointer;
    transition: background 100ms ease;
}

.customer-entity-action:hover[b-oyon6qc4sp] {
    background: #fff;
}

.customer-entity-action--primary[b-oyon6qc4sp] {
    background: #E65100;
    color: #fff;
    border-color: #E65100;
}

.customer-entity-action--primary:hover[b-oyon6qc4sp] {
    background: #CF4900;
    border-color: #CF4900;
}

.customer-entity-action--danger[b-oyon6qc4sp] {
    color: #DC2626;
    border-color: rgba(220, 38, 38, 0.4);
    background: transparent;
}

.customer-entity-action--danger:hover[b-oyon6qc4sp] {
    background: #FEF2F2;
}

.customer-entity-action:disabled[b-oyon6qc4sp] {
    opacity: 0.72;
    cursor: wait;
}

.customer-entity-grid[b-oyon6qc4sp] {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.customer-entity-card[b-oyon6qc4sp],
.customer-entity-form[b-oyon6qc4sp] {
    display: grid;
    gap: 1rem;
    padding: 1.3rem;
}

.customer-entity-card--wide[b-oyon6qc4sp] {
    grid-column: 1 / -1;
}

.customer-entity-context-list[b-oyon6qc4sp] {
    display: grid;
    gap: 0.9rem;
}

.customer-entity-context-item[b-oyon6qc4sp] {
    display: grid;
    gap: 0.4rem;
    padding: 1rem;
    border-radius: 1rem;
    background: rgba(14, 79, 138, 0.04);
    border: 1px solid rgba(14, 79, 138, 0.08);
}

.customer-entity-context-item strong[b-oyon6qc4sp] {
    color: var(--customer-entity-ink);
    font-size: 1.1rem;
}

.customer-entity-form__grid[b-oyon6qc4sp] {
    display: grid;
    gap: 0.95rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.customer-entity-field[b-oyon6qc4sp] {
    display: grid;
    gap: 0.45rem;
}

.customer-entity-field-error[b-oyon6qc4sp] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #b91c1c;
    letter-spacing: 0.01em;
    padding: 0.1rem 0;
}

.customer-entity-field span abbr[b-oyon6qc4sp] {
    color: #b91c1c;
    text-decoration: none;
    margin-left: 0.15rem;
    font-weight: 800;
}

.customer-entity-field--readonly[b-oyon6qc4sp] {
    display: grid;
    gap: 0.35rem;
    align-content: start;
}

.customer-entity-field--readonly .customer-entity-field-hint[b-oyon6qc4sp] {
    font-size: 0.7rem;
    color: var(--customer-entity-muted);
    margin: 0;
}

.customer-entity-field[b-oyon6qc4sp]  .customer-entity-input {
    width: 100%;
    box-sizing: border-box;
    min-height: 3rem;
    padding: 0.8rem 0.95rem;
    border: 1px solid rgba(14, 79, 138, 0.18);
    border-radius: 0.95rem;
    background: #fff;
    color: var(--customer-entity-ink);
    font: inherit;
    box-shadow: inset 0 1px 2px rgba(16, 38, 58, 0.04);
    transition: border-color 120ms ease, box-shadow 120ms ease, background-color 120ms ease;
}

.customer-entity-field[b-oyon6qc4sp]  .customer-entity-input::placeholder {
    color: rgba(88, 112, 134, 0.78);
}

.customer-entity-field[b-oyon6qc4sp]  .customer-entity-input:focus {
    outline: none;
    border-color: #E65100;
    box-shadow: 0 0 0 0.2rem rgba(230, 81, 0, 0.18);
}

.customer-entity-field--checkbox[b-oyon6qc4sp] {
    align-content: end;
}

.customer-entity-field--checkbox[b-oyon6qc4sp]  .customer-entity-checkbox {
    width: 1.15rem;
    height: 1.15rem;
    min-height: 1.15rem;
    margin: 0.1rem 0 0;
    accent-color: #003366;
    justify-self: start;
}

.customer-entity-actions--form[b-oyon6qc4sp] {
    margin-top: 0.25rem;
}

.customer-entity-confirm[b-oyon6qc4sp] {
    display: grid;
    gap: 0.8rem;
    padding: 0.9rem 1rem;
    background: linear-gradient(180deg, rgba(192, 57, 43, 0.08), rgba(255, 255, 255, 0.98));
    box-shadow: none;
}

.customer-entity-alert[b-oyon6qc4sp] {
    padding: 0.9rem 1rem;
    border-radius: 1rem;
    font-weight: 600;
}

.customer-entity-alert--error[b-oyon6qc4sp] {
    color: #8a2d2d;
    background: rgba(192, 57, 43, 0.12);
    border: 1px solid rgba(192, 57, 43, 0.18);
}

.customer-entity-badge[b-oyon6qc4sp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    padding: 0.35rem 0.7rem;
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 800;
}

.customer-entity-badge--active[b-oyon6qc4sp] {
    color: #0e6a4a;
    background: rgba(39, 174, 96, 0.13);
}

.customer-entity-badge--inactive[b-oyon6qc4sp] {
    color: #8a2d2d;
    background: rgba(192, 57, 43, 0.12);
}

.customer-entity-badge--new[b-oyon6qc4sp] {
    color: #9b5c00;
    background: rgba(244, 188, 77, 0.22);
}

.customer-entity-validation[b-oyon6qc4sp] {
    margin: 0;
    padding-left: 1.25rem;
    color: #8a2d2d;
}

/* ── Two-column above-the-fold edit layout ────────────────── */

.contact-edit-layout[b-oyon6qc4sp] {
    display: grid;
    grid-template-columns: minmax(200px, 35%) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

/* ── Left sidebar ─────────────────────────────────────────── */

.contact-edit-sidebar[b-oyon6qc4sp] {
    position: sticky;
    top: 1rem;
    display: grid;
    gap: 1rem;
    padding: 1.25rem;
    background: var(--customer-entity-panel);
    border: 1px solid var(--customer-entity-line);
    border-radius: 1.5rem;
    box-shadow: var(--customer-entity-shadow);
    border-top: 3px solid #003366;
}

.contact-edit-sidebar__identity[b-oyon6qc4sp] {
    display: grid;
    gap: 0.4rem;
}

.contact-edit-sidebar__name[b-oyon6qc4sp] {
    color: var(--customer-entity-ink);
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.contact-edit-sidebar__section[b-oyon6qc4sp] {
    display: grid;
    gap: 0.25rem;
    padding: 0.85rem;
    background: rgba(14, 79, 138, 0.04);
    border: 1px solid rgba(14, 79, 138, 0.08);
    border-radius: 1rem;
}

.contact-edit-sidebar__section strong[b-oyon6qc4sp] {
    color: var(--customer-entity-ink);
    font-weight: 700;
    font-size: 0.95rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.contact-edit-sidebar__stats[b-oyon6qc4sp] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
}

.contact-edit-sidebar__stat[b-oyon6qc4sp] {
    display: grid;
    gap: 0.2rem;
    padding: 0.6rem 0.75rem;
    border-radius: 0.9rem;
    background: rgba(14, 79, 138, 0.04);
    border: 1px solid rgba(14, 79, 138, 0.08);
}

.contact-edit-sidebar__stat span[b-oyon6qc4sp] {
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--customer-entity-muted);
}

.contact-edit-sidebar__stat strong[b-oyon6qc4sp] {
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--customer-entity-ink);
    line-height: 1.2;
}

.contact-edit-sidebar__danger[b-oyon6qc4sp] {
    padding-top: 0.75rem;
    border-top: 1px solid rgba(192, 57, 43, 0.12);
}

.contact-edit-sidebar__danger-btn[b-oyon6qc4sp] {
    width: 100%;
    justify-content: center;
    border-radius: 0.9rem;
}

/* ── Right column ─────────────────────────────────────────── */

.contact-edit-main[b-oyon6qc4sp] {
    display: grid;
    gap: 0;
}

.contact-edit-form[b-oyon6qc4sp] {
    display: grid;
    gap: 0;
    background: var(--customer-entity-panel);
    border: 1px solid var(--customer-entity-line);
    border-top: 3px solid #003366;
    border-radius: 1.5rem;
    box-shadow: var(--customer-entity-shadow);
    overflow: hidden;
}

.contact-form-grid-wrapper[b-oyon6qc4sp] {
    padding: 1.25rem;
}

/* FluentUI overrides */
.contact-edit-form[b-oyon6qc4sp]  fluent-grid {
    width: 100%;
}

.contact-edit-form[b-oyon6qc4sp]  fluent-text-field.customer-fluent-field {
    width: 100%;
}

.contact-edit-actions[b-oyon6qc4sp]  fluent-button::part(control) {
    min-height: 2.375rem;
    font-weight: 700;
    border-radius: 0.5rem;
    padding-inline: 1.125rem;
}

/* Checkboxes + readonly badge as a horizontal flags row */
.contact-form__flags[b-oyon6qc4sp] {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr);
    gap: 1.25rem;
    align-items: start;
    padding: 0.9rem 1rem;
    background: rgba(14, 79, 138, 0.03);
    border: 1px solid rgba(14, 79, 138, 0.08);
    border-radius: 0.95rem;
}

/* Sticky action bar at the bottom of the form card */
.contact-edit-actions[b-oyon6qc4sp] {
    display: flex;
    gap: 0.65rem;
    align-items: center;
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--customer-entity-line);
    background: var(--customer-entity-panel);
    position: sticky;
    bottom: 0;
    border-radius: 0 0 1.5rem 1.5rem;
}

@media (max-width: 960px) {
    .contact-edit-layout[b-oyon6qc4sp],
    .contact-form__flags[b-oyon6qc4sp] {
        grid-template-columns: 1fr;
    }

    .contact-edit-sidebar[b-oyon6qc4sp] {
        position: static;
    }

    .contact-edit-sidebar__stats[b-oyon6qc4sp] {
        grid-template-columns: 1fr 1fr;
    }

    .customer-entity-hero[b-oyon6qc4sp] {
        flex-direction: column;
    }

    .customer-entity-actions[b-oyon6qc4sp] {
        justify-content: flex-start;
    }
}
/* /Components/Pages/CustomerDetailPage.razor.rz.scp.css */
/* ── Page layout ───────────────────────────────────── */
.customer-detail-page[b-mzl1urthza] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.5rem 2rem 4rem;
    max-width: 1400px;
    margin: 0 auto;
}

/* ── Top bar / back button + hero ───────────────── */
.customer-detail-topbar[b-mzl1urthza] {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 1rem;
    padding: 0.75rem 1.25rem;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
}

.customer-detail-topbar__hero[b-mzl1urthza] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex: 1;
    min-width: 0;
}

.customer-detail-topbar__name[b-mzl1urthza] {
    color: var(--brand-navy);
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    margin: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.customer-detail-back[b-mzl1urthza] {
    background: transparent;
    border: 1px solid var(--brand-navy);
    border-radius: 0.5rem;
    color: var(--brand-navy);
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 500;
    padding: 0.4rem 1rem;
    transition: background 0.15s, color 0.15s;
}

.customer-detail-back:hover[b-mzl1urthza] {
    background: var(--brand-navy);
    color: #fff;
}

/* ── Alert messages ────────────────────────────────── */
.customer-detail-alert[b-mzl1urthza] {
    border-radius: 0.5rem;
    font-size: 0.9rem;
    padding: 0.75rem 1.25rem;
}

.customer-detail-alert--success[b-mzl1urthza] {
    background: #ecfdf5;
    border: 1px solid #6ee7b7;
    color: #065f46;
}

.customer-detail-alert--error[b-mzl1urthza] {
    background: #fef2f2;
    border: 1px solid #fca5a5;
    color: #991b1b;
}

/* ── Two-column layout ─────────────────────────────── */
.customer-detail-layout[b-mzl1urthza] {
    display: grid;
    grid-template-columns: 35fr 65fr;
    gap: 1.5rem;
    align-items: start;
}

@media (max-width: 900px) {
    .customer-detail-layout[b-mzl1urthza] {
        grid-template-columns: 1fr;
    }
}

/* ── Sidebar ───────────────────────────────────────── */
.customer-detail-sidebar[b-mzl1urthza] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-top: 3px solid var(--brand-navy);
    border-radius: 1.5rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.5rem;
    position: sticky;
    top: 1rem;
}

.customer-detail-sidebar__identity[b-mzl1urthza] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    align-items: flex-start;
}

.customer-detail-sidebar__name[b-mzl1urthza] {
    color: var(--brand-navy);
    font-size: 1.2rem;
    font-weight: 700;
    margin: 0;
}

.customer-detail-sidebar__address[b-mzl1urthza] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.customer-detail-sidebar__address p[b-mzl1urthza] {
    color: #374151;
    font-size: 0.88rem;
    margin: 0;
}

.customer-detail-sidebar__stats[b-mzl1urthza] {
    border-top: 1px solid #e5e7eb;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding-top: 1rem;
}

.customer-detail-sidebar__stat[b-mzl1urthza] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.88rem;
    color: #374151;
}

.customer-detail-sidebar__stat strong[b-mzl1urthza] {
    color: var(--brand-navy);
    font-size: 1rem;
    font-weight: 700;
}

.customer-detail-sidebar__action[b-mzl1urthza] {
    margin-top: 0.5rem;
}

/* ── Right content area ────────────────────────────── */
.customer-detail-content[b-mzl1urthza] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* ── Tab navigation ────────────────────────────────── */
.customer-detail-tabs[b-mzl1urthza] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    display: flex;
    gap: 0.25rem;
    overflow: hidden;
    padding: 0.35rem;
}

.customer-detail-tab[b-mzl1urthza] {
    background: transparent;
    border: none;
    border-radius: 0.5rem;
    color: #4b5563;
    cursor: pointer;
    font-size: 0.88rem;
    font-weight: 500;
    padding: 0.5rem 1rem;
    transition: background 0.15s, color 0.15s;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.customer-detail-tab:hover[b-mzl1urthza] {
    background: #f3f4f6;
    color: var(--brand-navy);
}

.customer-detail-tab--active[b-mzl1urthza] {
    background: var(--brand-navy);
    color: #fff;
}

.customer-detail-tab--active:hover[b-mzl1urthza] {
    background: var(--brand-navy);
    color: #fff;
}

.customer-detail-tab__count[b-mzl1urthza] {
    background: rgba(255,255,255,0.25);
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    min-width: 1.4em;
    padding: 0.1em 0.45em;
    text-align: center;
}

.customer-detail-tab--active .customer-detail-tab__count[b-mzl1urthza] {
    background: rgba(255,255,255,0.25);
}

/* ── Cards ─────────────────────────────────────────── */
.customer-detail-card[b-mzl1urthza] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-top: 3px solid var(--brand-navy);
    border-radius: 1.5rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.5rem;
}

.customer-detail-card--edit[b-mzl1urthza] {
    border-top-color: var(--brand-orange);
}

.customer-detail-card__header[b-mzl1urthza] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.customer-detail-card__header div[b-mzl1urthza] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.customer-detail-card__header h3[b-mzl1urthza] {
    color: var(--brand-navy);
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
}

.customer-detail-card__header p[b-mzl1urthza] {
    color: #6b7280;
    font-size: 0.85rem;
    margin: 0;
}

/* ── Key-value grid ─────────────────────────────────── */
.customer-detail-kv-grid[b-mzl1urthza] {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: 1fr 1fr;
    margin: 0;
}

.customer-detail-kv-grid > div[b-mzl1urthza] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.customer-detail-kv-grid dt[b-mzl1urthza] {
    color: #6b7280;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.customer-detail-kv-grid dd[b-mzl1urthza] {
    color: #111827;
    font-size: 0.9rem;
    margin: 0;
}

/* ── Context stack ─────────────────────────────────── */
.customer-detail-context-stack[b-mzl1urthza] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.customer-detail-context-item[b-mzl1urthza] {
    border-left: 3px solid #e5e7eb;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding-left: 0.75rem;
}

.customer-detail-context-item span[b-mzl1urthza] {
    color: #6b7280;
    font-size: 0.78rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.customer-detail-context-item strong[b-mzl1urthza] {
    color: var(--brand-navy);
    font-size: 0.9rem;
}

.customer-detail-context-item p[b-mzl1urthza] {
    color: #6b7280;
    font-size: 0.85rem;
    margin: 0;
}

/* ── Edit form ──────────────────────────────────────── */
/* FluentUI overrides */
.customer-detail-form[b-mzl1urthza]  fluent-grid {
    width: 100%;
}

.customer-detail-form[b-mzl1urthza]  fluent-text-field.customer-fluent-field {
    width: 100%;
}

.customer-detail-edit-actions[b-mzl1urthza]  fluent-button::part(control) {
    min-height: 2.375rem;
    font-weight: 700;
    border-radius: 0.5rem;
    padding-inline: 1.125rem;
}

.customer-detail-field[b-mzl1urthza] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.customer-detail-field span[b-mzl1urthza] {
    color: var(--brand-navy);
    font-size: 0.85rem;
    font-weight: 600;
}

.customer-detail-field abbr[b-mzl1urthza] {
    color: var(--brand-orange);
    text-decoration: none;
}

.customer-detail-input[b-mzl1urthza] {
    background: #fff;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    color: #111827;
    font-size: 0.9rem;
    padding: 0.55rem 0.75rem;
    transition: border-color 0.15s, box-shadow 0.15s;
    width: 100%;
}

.customer-detail-input:focus[b-mzl1urthza] {
    border-color: var(--brand-orange);
    box-shadow: 0 0 0 3px rgba(230, 81, 0, 0.18);
    outline: none;
}

.customer-detail-field-error[b-mzl1urthza] {
    color: #dc2626;
    font-size: 0.8rem;
}

.customer-detail-field--checkbox[b-mzl1urthza] {
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
}

.customer-detail-checkbox[b-mzl1urthza] {
    accent-color: var(--brand-navy);
    height: 1rem;
    width: 1rem;
}

.customer-detail-edit-actions[b-mzl1urthza] {
    border-top: 1px solid #e5e7eb;
    display: flex;
    gap: 0.75rem;
    padding-top: 1rem;
}

/* ── Buttons / actions ─────────────────────────────── */
.customer-detail-action[b-mzl1urthza] {
    background: transparent;
    border: 1px solid var(--brand-navy);
    border-radius: 0.5rem;
    color: var(--brand-navy);
    cursor: pointer;
    font-size: 0.88rem;
    font-weight: 500;
    padding: 0.55rem 1.25rem;
    text-decoration: none;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
}

.customer-detail-action:hover[b-mzl1urthza] {
    background: var(--brand-navy);
    color: #fff;
}

.customer-detail-action--primary[b-mzl1urthza] {
    background: var(--brand-orange);
    border-color: var(--brand-orange);
    color: #fff;
}

.customer-detail-action--primary:hover[b-mzl1urthza] {
    background: var(--brand-orange-hover);
    border-color: var(--brand-orange-hover);
    color: #fff;
}

.customer-detail-action--compact[b-mzl1urthza] {
    font-size: 0.82rem;
    padding: 0.35rem 0.9rem;
}

/* ── Entity list / cards ───────────────────────────── */
.customer-detail-entity-list[b-mzl1urthza] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.customer-detail-entity-card[b-mzl1urthza] {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1rem;
}

.customer-detail-entity-card__row[b-mzl1urthza] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.customer-detail-entity-card__row strong[b-mzl1urthza] {
    color: var(--brand-navy);
    font-size: 0.95rem;
    display: block;
}

.customer-detail-entity-card__row p[b-mzl1urthza] {
    color: #6b7280;
    font-size: 0.85rem;
    margin: 0;
}

.customer-detail-entity-card__badges[b-mzl1urthza] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    justify-content: flex-end;
}

.customer-detail-entity-card__meta[b-mzl1urthza] {
    color: #9ca3af;
    display: flex;
    font-size: 0.82rem;
    gap: 0.75rem;
    margin: 0;
}

.customer-detail-entity-card__footer[b-mzl1urthza] {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
}

/* ── Badges ────────────────────────────────────────── */
.customer-detail-badge[b-mzl1urthza] {
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    padding: 0.2em 0.65em;
    white-space: nowrap;
}

.customer-detail-badge--active[b-mzl1urthza] {
    background: #d1fae5;
    color: #065f46;
}

.customer-detail-badge--inactive[b-mzl1urthza] {
    background: #f3f4f6;
    color: #6b7280;
}

.customer-detail-badge--mail[b-mzl1urthza] {
    background: #e0e7ff;
    color: #3730a3;
}

.customer-detail-badge--user[b-mzl1urthza] {
    background: #fef3c7;
    color: #92400e;
}

/* ── Empty state ───────────────────────────────────── */
.customer-detail-empty-state[b-mzl1urthza] {
    color: #6b7280;
    padding: 2rem 0 1rem;
    text-align: center;
}

.customer-detail-empty-state h4[b-mzl1urthza] {
    color: var(--brand-navy);
    font-size: 0.95rem;
    margin: 0 0 0.35rem;
}

.customer-detail-empty-state p[b-mzl1urthza] {
    font-size: 0.88rem;
    margin: 0;
}

/* ── Misc ──────────────────────────────────────────── */
.customer-detail-eyebrow[b-mzl1urthza] {
    color: #6b7280;
    font-size: 0.73rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.customer-detail-placeholder[b-mzl1urthza] {
    color: #9ca3af;
    font-size: 0.9rem;
    padding: 1rem 0;
    text-align: center;
}

.customer-detail-tab-panel[b-mzl1urthza] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* ── Action cards grid (Overview dashboard) ────── */
.customer-detail-action-grid[b-mzl1urthza] {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1100px) {
    .customer-detail-action-grid[b-mzl1urthza] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .customer-detail-action-grid[b-mzl1urthza] {
        grid-template-columns: 1fr;
    }
}

.customer-detail-action-card[b-mzl1urthza] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-top: 3px solid var(--brand-navy);
    border-radius: 1.5rem;
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    padding: 1.25rem;
}

.customer-detail-action-card__head[b-mzl1urthza] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.customer-detail-action-card__count[b-mzl1urthza] {
    background: var(--brand-navy);
    border-radius: 999px;
    color: #fff;
    font-size: 0.78rem;
    font-weight: 700;
    min-width: 1.6em;
    padding: 0.15em 0.55em;
    text-align: center;
}

.customer-detail-action-card__primary[b-mzl1urthza] {
    background: #f9fafb;
    border-left: 3px solid var(--brand-navy);
    border-radius: 0 0.5rem 0.5rem 0;
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 0.2rem;
    padding: 0.65rem 0.85rem;
}

.customer-detail-action-card__primary strong[b-mzl1urthza] {
    color: var(--brand-navy);
    font-size: 0.9rem;
    font-weight: 700;
}

.customer-detail-action-card__primary p[b-mzl1urthza] {
    color: #6b7280;
    font-size: 0.83rem;
    margin: 0;
}

.customer-detail-action-card__primary span[b-mzl1urthza] {
    color: #9ca3af;
    font-size: 0.8rem;
}

.customer-detail-action-card__empty[b-mzl1urthza] {
    color: #9ca3af;
    flex: 1;
    font-size: 0.85rem;
    margin: 0;
}

.customer-detail-action--full[b-mzl1urthza] {
    box-sizing: border-box;
    justify-content: center;
    margin-top: auto;
    text-align: center;
    width: 100%;
}
/* /Components/Pages/CustomerDocuments.razor.rz.scp.css */
/* ── CustomerDocuments page ──────────────────────────────────────────── */

.customer-docs-page[b-uzjrm6d7j4] {
    padding: 2rem 1.5rem;
}

.customer-docs-header[b-uzjrm6d7j4] {
    margin-bottom: 1.5rem;
    padding: 1.5rem 1.75rem;
    border-top: 3px solid var(--brand-navy);
}

.customer-docs-header h1[b-uzjrm6d7j4] {
    margin: 0.25rem 0 0.35rem;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--brand-navy);
}

.customer-docs-header p[b-uzjrm6d7j4] {
    margin: 0;
    color: var(--c-text-muted, #6b7280);
    font-size: 0.875rem;
}

/* ── Action Center banner ─────────────────────────────────────────────── */

.action-center[b-uzjrm6d7j4] {
    display: flex;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-radius: 0.625rem;
    margin-bottom: 1.25rem;
    border: 1px solid transparent;
}

.action-center--critical[b-uzjrm6d7j4] {
    background: #fff7ed;
    border-color: var(--lemaro-orange, #e06b25);
    border-left: 4px solid var(--lemaro-orange, #e06b25);
}

.action-center--warning[b-uzjrm6d7j4] {
    background: #fffbeb;
    border-color: #d97706;
    border-left: 4px solid #d97706;
}

.action-center__icon[b-uzjrm6d7j4] {
    flex-shrink: 0;
    font-size: 1.375rem;
    line-height: 1;
    color: var(--lemaro-orange, #e06b25);
    padding-top: 0.1rem;
}

.action-center--warning .action-center__icon[b-uzjrm6d7j4] {
    color: #d97706;
}

.action-center__body[b-uzjrm6d7j4] {
    flex: 1;
    min-width: 0;
}

.action-center__title[b-uzjrm6d7j4] {
    display: block;
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--brand-navy);
    margin-bottom: 0.5rem;
}

.action-center__list[b-uzjrm6d7j4] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.action-center__item[b-uzjrm6d7j4] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.35rem;
    font-size: 0.8125rem;
    color: var(--c-text-muted, #374151);
}

.action-center__doc-type[b-uzjrm6d7j4] {
    font-weight: 600;
    color: var(--brand-navy);
}

.action-center__separator[b-uzjrm6d7j4] {
    color: var(--c-border, #d1d5db);
}

.action-center__date[b-uzjrm6d7j4] {
    font-variant-numeric: tabular-nums;
}

.action-center__date--overdue[b-uzjrm6d7j4] {
    color: var(--lemaro-orange, #e06b25);
    font-weight: 600;
}

.action-center__cta[b-uzjrm6d7j4] {
    margin-top: 0.75rem;
    padding-top: 0.625rem;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.action-center__contact-link[b-uzjrm6d7j4] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--lemaro-orange, #e06b25);
    text-decoration: none;
}

.action-center__contact-link:hover[b-uzjrm6d7j4] {
    text-decoration: underline;
}

/* ── Table wrap ──────────────────────────────────────────────────────── */

.customer-docs-table-wrap[b-uzjrm6d7j4] {
    overflow-x: auto;
    padding: 0;
    border-top: 3px solid var(--brand-navy);
}

.customer-docs-table[b-uzjrm6d7j4] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.customer-docs-table thead th[b-uzjrm6d7j4] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--c-text-muted, #6b7280);
    border-bottom: 1px solid var(--c-border, #e5e7eb);
    white-space: nowrap;
}

.customer-docs-table tbody tr[b-uzjrm6d7j4] {
    border-bottom: 1px solid var(--c-border, #f3f4f6);
    transition: background 0.1s ease;
}

.customer-docs-table tbody tr:hover[b-uzjrm6d7j4] {
    background: #f9fafb;
}

.customer-docs-row--expired[b-uzjrm6d7j4] {
    background: #fff7ed !important;
}

.customer-docs-cell[b-uzjrm6d7j4] {
    padding: 0.75rem 1rem;
    vertical-align: middle;
}

.customer-docs-cell--type[b-uzjrm6d7j4] {
    font-weight: 500;
    max-width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.customer-docs-cell--muted[b-uzjrm6d7j4] {
    color: var(--c-text-muted, #6b7280);
}

.customer-docs-cell--date[b-uzjrm6d7j4] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.customer-docs-cell--action[b-uzjrm6d7j4] {
    white-space: nowrap;
}

.customer-docs-action-link[b-uzjrm6d7j4] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.4rem 0.8rem;
    border: 1px solid #cdd9e5;
    border-radius: 999px;
    color: var(--brand-navy);
    font-size: 0.8125rem;
    font-weight: 600;
    text-decoration: none;
    background: #f8fbff;
}

.customer-docs-action-link:hover[b-uzjrm6d7j4] {
    background: #eef5fb;
    border-color: var(--brand-navy);
}

.customer-docs-action-state[b-uzjrm6d7j4] {
    font-size: 0.8125rem;
    color: var(--c-text-muted, #6b7280);
}

/* Status badges */
.customer-docs-badge[b-uzjrm6d7j4] {
    display: inline-block;
    padding: 0.2em 0.65em;
    border-radius: 0.35rem;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.customer-docs-badge--expired[b-uzjrm6d7j4] {
    background: #fef2f2;
    color: #b91c1c;
}

.customer-docs-badge--expiring[b-uzjrm6d7j4] {
    background: #fff7ed;
    color: #c2410c;
}

.customer-docs-badge--valid[b-uzjrm6d7j4] {
    background: #f0fdf4;
    color: #15803d;
}

.customer-docs-badge--none[b-uzjrm6d7j4] {
    background: #f3f4f6;
    color: #6b7280;
}

/* Empty / error / loading states */
.customer-docs-empty[b-uzjrm6d7j4] {
    padding: 2rem;
    text-align: center;
    color: var(--c-text-muted, #6b7280);
}

.customer-docs-loading[b-uzjrm6d7j4] {
    padding: 2rem;
    text-align: center;
    color: var(--c-text-muted, #6b7280);
}

.customer-docs-alert[b-uzjrm6d7j4] {
    padding: 0.875rem 1.25rem;
    border-radius: 0.5rem;
    margin-bottom: 1rem;
    font-size: 0.875rem;
}

.customer-docs-alert--error[b-uzjrm6d7j4] {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}
/* /Components/Pages/CustomerLocationDetail.razor.rz.scp.css */
/* ── Page shell ─────────────────────────────────────── */
.loc-detail-page[b-3ngcr9d2hm] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.5rem 2rem 4rem;
    max-width: 1400px;
    margin: 0 auto;
}

.loc-detail-placeholder[b-3ngcr9d2hm] {
    color: #64748b;
    padding: 2rem 0;
}

/* ── Topbar ─────────────────────────────────────────── */
.loc-detail-topbar[b-3ngcr9d2hm] {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 1rem;
    padding: 0.75rem 1.25rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .04);
}

.loc-detail-topbar__hero[b-3ngcr9d2hm] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex: 1;
    min-width: 0;
}

.loc-detail-topbar__name[b-3ngcr9d2hm] {
    color: var(--brand-navy);
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    margin: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.loc-detail-back[b-3ngcr9d2hm] {
    background: transparent;
    border: 1px solid var(--brand-navy);
    border-radius: 0.5rem;
    color: var(--brand-navy);
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 500;
    padding: 0.4rem 1rem;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
}

.loc-detail-back:hover[b-3ngcr9d2hm] {
    background: var(--brand-navy);
    color: #fff;
}

/* ── Alerts ─────────────────────────────────────────── */
.loc-detail-alert[b-3ngcr9d2hm] {
    border-radius: 0.5rem;
    font-size: 0.9rem;
    padding: 0.75rem 1.25rem;
}

.loc-detail-alert--error[b-3ngcr9d2hm] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #b91c1c;
}

/* ── Two-column layout ──────────────────────────────── */
.loc-detail-layout[b-3ngcr9d2hm] {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

@media (max-width: 900px) {
    .loc-detail-layout[b-3ngcr9d2hm] {
        grid-template-columns: 1fr;
    }
}

/* ── Sidebar ────────────────────────────────────────── */
.loc-detail-sidebar[b-3ngcr9d2hm] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-top: 3px solid var(--brand-navy);
    border-radius: 1.5rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.5rem;
    position: sticky;
    top: 1rem;
}

.loc-detail-sidebar__identity[b-3ngcr9d2hm] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.4rem;
}

.loc-detail-sidebar__name[b-3ngcr9d2hm] {
    color: var(--brand-navy);
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0;
    line-height: 1.2;
}

.loc-detail-sidebar__customer[b-3ngcr9d2hm] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
}

.loc-detail-sidebar__customer-name[b-3ngcr9d2hm] {
    font-weight: 600;
    color: #1e293b;
    margin: 0.3rem 0 0;
    font-size: 0.95rem;
}

.loc-detail-sidebar__customer-address[b-3ngcr9d2hm] {
    color: #64748b;
    font-size: 0.85rem;
    margin: 0;
}

.loc-detail-sidebar__address[b-3ngcr9d2hm] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
}

.loc-detail-sidebar__address p[b-3ngcr9d2hm] {
    color: #1e293b;
    font-size: 0.9rem;
    margin: 0.2rem 0 0;
}

/* ── Main column ────────────────────────────────────── */
.loc-detail-main[b-3ngcr9d2hm] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* ── Cards ──────────────────────────────────────────── */
.loc-detail-card[b-3ngcr9d2hm] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-top: 3px solid var(--brand-navy);
    border-radius: 1.5rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.5rem;
}

.loc-detail-card--danger[b-3ngcr9d2hm] {
    border-top-color: #dc2626;
}

.loc-detail-card__head[b-3ngcr9d2hm] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.loc-detail-card__title[b-3ngcr9d2hm] {
    color: var(--brand-navy);
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
}

.loc-detail-card--danger .loc-detail-card__title[b-3ngcr9d2hm] {
    color: #b91c1c;
}

.loc-detail-card__desc[b-3ngcr9d2hm] {
    color: #64748b;
    font-size: 0.875rem;
    margin: 0;
}

/* ── Eyebrow ────────────────────────────────────────── */
.loc-detail-eyebrow[b-3ngcr9d2hm] {
    display: inline-flex;
    align-items: center;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--brand-navy);
}

.loc-detail-eyebrow--danger[b-3ngcr9d2hm] {
    color: #dc2626;
}

/* ── Badges ─────────────────────────────────────────── */
.loc-detail-badge[b-3ngcr9d2hm] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.loc-detail-badge--active[b-3ngcr9d2hm] {
    background: #dcfce7;
    color: #15803d;
}

.loc-detail-badge--inactive[b-3ngcr9d2hm] {
    background: #fee2e2;
    color: #dc2626;
}

.loc-detail-badge--new[b-3ngcr9d2hm] {
    background: #fef9c3;
    color: #854d0e;
}

/* ── Form ───────────────────────────────────────────── */
.loc-detail-form[b-3ngcr9d2hm] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* FluentUI overrides */
.loc-detail-form[b-3ngcr9d2hm]  fluent-grid {
    width: 100%;
}

.loc-detail-form[b-3ngcr9d2hm]  fluent-text-field.customer-fluent-field {
    width: 100%;
}

.loc-detail-form-actions[b-3ngcr9d2hm]  fluent-button::part(control) {
    min-height: 2.375rem;
    font-weight: 700;
    border-radius: 0.5rem;
    padding-inline: 1.125rem;
}

.loc-detail-field[b-3ngcr9d2hm] {
    display: grid;
    gap: 0.4rem;
}

.loc-detail-field span[b-3ngcr9d2hm] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
}

.loc-detail-field span abbr[b-3ngcr9d2hm] {
    color: #dc2626;
    text-decoration: none;
    margin-left: 0.15rem;
}

.loc-detail-field[b-3ngcr9d2hm]  .loc-detail-input {
    width: 100%;
    box-sizing: border-box;
    min-height: 2.75rem;
    padding: 0.65rem 0.9rem;
    border: 1px solid #d1d5db;
    border-radius: 0.6rem;
    background: #fff;
    color: #111827;
    font: inherit;
    font-size: 0.9rem;
    transition: border-color 0.12s, box-shadow 0.12s;
}

.loc-detail-field[b-3ngcr9d2hm]  .loc-detail-input:focus {
    outline: none;
    border-color: var(--brand-navy);
    box-shadow: 0 0 0 3px rgba(0, 51, 102, 0.1);
}

.loc-detail-field-error[b-3ngcr9d2hm] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #dc2626;
}

.loc-detail-field--checkbox[b-3ngcr9d2hm] {
    align-content: end;
    padding-bottom: 0.5rem;
}

.loc-detail-field--checkbox[b-3ngcr9d2hm]  .loc-detail-checkbox {
    width: 1.1rem;
    height: 1.1rem;
    accent-color: var(--brand-navy);
    cursor: pointer;
}

/* ── Form actions ───────────────────────────────────── */
.loc-detail-form-actions[b-3ngcr9d2hm] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

/* ── Buttons ────────────────────────────────────────── */
.loc-detail-action[b-3ngcr9d2hm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.5rem;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 600;
    padding: 0.5rem 1.25rem;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.loc-detail-action--primary[b-3ngcr9d2hm] {
    background: var(--brand-orange);
    border: 1px solid var(--brand-orange);
    color: #fff;
}

.loc-detail-action--primary:hover:not(:disabled)[b-3ngcr9d2hm] {
    background: var(--brand-orange-hover);
    border-color: var(--brand-orange-hover);
}

.loc-detail-action--primary:disabled[b-3ngcr9d2hm] {
    opacity: 0.6;
    cursor: wait;
}

.loc-detail-action--ghost[b-3ngcr9d2hm] {
    background: transparent;
    border: 1px solid #d1d5db;
    color: #374151;
}

.loc-detail-action--ghost:hover[b-3ngcr9d2hm] {
    background: #f9fafb;
    border-color: #9ca3af;
}

.loc-detail-action--danger[b-3ngcr9d2hm] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #dc2626;
}

.loc-detail-action--danger:hover:not(:disabled)[b-3ngcr9d2hm] {
    background: #fee2e2;
    border-color: #f87171;
}

.loc-detail-action--danger:disabled[b-3ngcr9d2hm] {
    opacity: 0.6;
    cursor: wait;
}

/* ── Delete confirm ─────────────────────────────────── */
.loc-detail-confirm[b-3ngcr9d2hm] {
    background: #fef9f9;
    border: 1px solid #fecaca;
    border-radius: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem 1.25rem;
}

.loc-detail-confirm p[b-3ngcr9d2hm] {
    color: #374151;
    font-size: 0.9rem;
    margin: 0;
}

.loc-detail-confirm strong[b-3ngcr9d2hm] {
    color: #b91c1c;
}

.customer-entity-hero[b-3ngcr9d2hm] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: start;
    padding: 1.55rem 1.6rem;
    background:
        radial-gradient(circle at top left, rgba(14, 79, 138, 0.12), transparent 34%),
        radial-gradient(circle at bottom right, rgba(242, 129, 41, 0.12), transparent 30%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 250, 252, 0.98));
}

.customer-entity-hero h1[b-3ngcr9d2hm],
.customer-entity-card h2[b-3ngcr9d2hm],
.customer-entity-form h2[b-3ngcr9d2hm] {
    margin: 0;
    color: var(--customer-entity-ink);
}

.customer-entity-hero h1[b-3ngcr9d2hm] {
    font-size: clamp(2rem, 3vw, 2.8rem);
    line-height: 1.02;
    margin-top: 0.55rem;
}

.customer-entity-hero p[b-3ngcr9d2hm],
.customer-entity-card p[b-3ngcr9d2hm],
.customer-entity-confirm p[b-3ngcr9d2hm],
.customer-entity-placeholder[b-3ngcr9d2hm] {
    margin: 0;
    color: var(--customer-entity-muted);
}

.customer-entity-eyebrow[b-3ngcr9d2hm],
.customer-entity-field span[b-3ngcr9d2hm],
.customer-entity-context-item span[b-3ngcr9d2hm] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #0e4f8a;
}

.customer-entity-hero__meta[b-3ngcr9d2hm],
.customer-entity-actions[b-3ngcr9d2hm],
.customer-entity-card__header[b-3ngcr9d2hm],
.customer-entity-context-list[b-3ngcr9d2hm] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
}

.customer-entity-actions[b-3ngcr9d2hm] {
    justify-content: flex-end;
}

.customer-entity-action[b-3ngcr9d2hm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1rem;
    border: 1px solid rgba(14, 79, 138, 0.16);
    border-radius: 999px;
    background: #fff;
    color: #0e4f8a;
    font-weight: 700;
    cursor: pointer;
}

.customer-entity-action--primary[b-3ngcr9d2hm] {
    border-color: transparent;
    background: linear-gradient(135deg, rgba(14, 79, 138, 0.94), rgba(242, 129, 41, 0.92));
    color: #fff;
}

.customer-entity-action--danger[b-3ngcr9d2hm] {
    color: #8a2d2d;
    border-color: rgba(192, 57, 43, 0.18);
    background: rgba(255, 245, 245, 0.98);
}

.customer-entity-action:disabled[b-3ngcr9d2hm] {
    opacity: 0.72;
    cursor: wait;
}

.customer-entity-grid[b-3ngcr9d2hm] {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.customer-entity-card[b-3ngcr9d2hm],
.customer-entity-form[b-3ngcr9d2hm] {
    display: grid;
    gap: 1rem;
    padding: 1.3rem;
}

.customer-entity-card--wide[b-3ngcr9d2hm] {
    grid-column: 1 / -1;
}

.customer-entity-context-list[b-3ngcr9d2hm] {
    display: grid;
    gap: 0.9rem;
}

.customer-entity-context-item[b-3ngcr9d2hm] {
    display: grid;
    gap: 0.4rem;
    padding: 1rem;
    border-radius: 1rem;
    background: rgba(14, 79, 138, 0.04);
    border: 1px solid rgba(14, 79, 138, 0.08);
}

.customer-entity-context-item strong[b-3ngcr9d2hm] {
    color: var(--customer-entity-ink);
    font-size: 1.1rem;
}

.customer-entity-form__grid[b-3ngcr9d2hm] {
    display: grid;
    gap: 0.95rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.customer-entity-form__grid--location[b-3ngcr9d2hm] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.customer-entity-field[b-3ngcr9d2hm] {
    display: grid;
    gap: 0.45rem;
}

.customer-entity-field-error[b-3ngcr9d2hm] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #b91c1c;
    letter-spacing: 0.01em;
    padding: 0.1rem 0;
}

.customer-entity-field span abbr[b-3ngcr9d2hm] {
    color: #b91c1c;
    text-decoration: none;
    margin-left: 0.15rem;
    font-weight: 800;
}

.customer-entity-field[b-3ngcr9d2hm]  .customer-entity-input {
    width: 100%;
    box-sizing: border-box;
    min-height: 3rem;
    padding: 0.8rem 0.95rem;
    border: 1px solid rgba(14, 79, 138, 0.18);
    border-radius: 0.95rem;
    background: #fff;
    color: var(--customer-entity-ink);
    font: inherit;
    box-shadow: inset 0 1px 2px rgba(16, 38, 58, 0.04);
    transition: border-color 120ms ease, box-shadow 120ms ease, background-color 120ms ease;
}

.customer-entity-field[b-3ngcr9d2hm]  .customer-entity-input::placeholder {
    color: rgba(88, 112, 134, 0.78);
}

.customer-entity-field[b-3ngcr9d2hm]  .customer-entity-input:focus {
    outline: 2px solid rgba(242, 129, 41, 0.18);
    border-color: rgba(242, 129, 41, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(242, 129, 41, 0.12);
}

.customer-entity-field--checkbox[b-3ngcr9d2hm] {
    align-content: end;
}

.customer-entity-field--checkbox[b-3ngcr9d2hm]  .customer-entity-checkbox {
    width: 1.15rem;
    height: 1.15rem;
    min-height: 1.15rem;
    margin: 0.1rem 0 0;
    accent-color: #0e4f8a;
    justify-self: start;
}

.customer-entity-actions--form[b-3ngcr9d2hm] {
    margin-top: 0.25rem;
}

.customer-entity-confirm[b-3ngcr9d2hm] {
    display: grid;
    gap: 0.8rem;
    padding: 0.9rem 1rem;
    background: linear-gradient(180deg, rgba(192, 57, 43, 0.08), rgba(255, 255, 255, 0.98));
    box-shadow: none;
}

.customer-entity-alert[b-3ngcr9d2hm] {
    padding: 0.9rem 1rem;
    border-radius: 1rem;
    font-weight: 600;
}

.customer-entity-alert--error[b-3ngcr9d2hm] {
    color: #8a2d2d;
    background: rgba(192, 57, 43, 0.12);
    border: 1px solid rgba(192, 57, 43, 0.18);
}

.customer-entity-badge[b-3ngcr9d2hm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    padding: 0.35rem 0.7rem;
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 800;
}

.customer-entity-badge--active[b-3ngcr9d2hm] {
    color: #0e6a4a;
    background: rgba(39, 174, 96, 0.13);
}

.customer-entity-badge--inactive[b-3ngcr9d2hm] {
    color: #8a2d2d;
    background: rgba(192, 57, 43, 0.12);
}

.customer-entity-badge--new[b-3ngcr9d2hm] {
    color: #9b5c00;
    background: rgba(244, 188, 77, 0.22);
}

.customer-entity-validation[b-3ngcr9d2hm] {
    margin: 0;
    padding-left: 1.25rem;
    color: #8a2d2d;
}

@media (max-width: 960px) {
    .customer-entity-grid[b-3ngcr9d2hm],
    .customer-entity-form__grid[b-3ngcr9d2hm],
    .customer-entity-form__grid--location[b-3ngcr9d2hm] {
        grid-template-columns: 1fr;
    }

    .customer-entity-hero[b-3ngcr9d2hm] {
        flex-direction: column;
    }

    .customer-entity-actions[b-3ngcr9d2hm] {
        justify-content: flex-start;
    }
}
/* /Components/Pages/CustomerLocations.razor.rz.scp.css */
.customer-locations-page[b-5llrfaybzw] {
    align-content: start;
}

.customer-locations-header__stats[b-5llrfaybzw] {
    display: flex;
    align-items: stretch;
}

.customer-locations-state[b-5llrfaybzw],
.customer-locations-empty[b-5llrfaybzw] {
    text-align: center;
    padding: 2.5rem 1.5rem;
}

.customer-locations-empty h2[b-5llrfaybzw] {
    margin: 0 0 0.5rem;
    color: var(--lemaro-navy);
}

.customer-locations-grid[b-5llrfaybzw] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1rem;
}

.customer-locations-card[b-5llrfaybzw] {
    padding: 1.4rem 1.5rem;
    display: grid;
    gap: 1.1rem;
}

.customer-locations-card__header[b-5llrfaybzw] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.customer-locations-card__header h2[b-5llrfaybzw] {
    margin: 0.35rem 0 0;
    color: var(--lemaro-navy);
    font-size: 1.15rem;
}

.customer-locations-badge[b-5llrfaybzw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.9rem;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    white-space: nowrap;
}

.customer-locations-badge--active[b-5llrfaybzw] {
    background: #F0FDF4;
    color: #15803D;
    border: 1px solid #A7F3D0;
}

.customer-locations-badge--inactive[b-5llrfaybzw] {
    background: #F8FAFC;
    color: #64748B;
    border: 1px solid #CBD5E1;
}

.customer-locations-details[b-5llrfaybzw] {
    margin: 0;
    display: grid;
    gap: 0.9rem;
}

.customer-locations-details div[b-5llrfaybzw] {
    display: grid;
    gap: 0.2rem;
}

.customer-locations-details dt[b-5llrfaybzw] {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748B;
}

.customer-locations-details dd[b-5llrfaybzw] {
    margin: 0;
    color: #0F172A;
    font-size: 0.96rem;
    font-weight: 600;
}

@media (max-width: 640px) {
    .customer-locations-card[b-5llrfaybzw] {
        padding: 1.2rem;
    }

    .customer-locations-card__header[b-5llrfaybzw] {
        flex-direction: column;
    }
}
/* /Components/Pages/Customers.razor.rz.scp.css */
/* ============================================================
   LEMARO DASHBOARD — CUSTOMERS PAGE
   Clean enterprise aesthetic (Stripe / Linear)
   Scoped via Blazor CSS isolation — tokens on .customers-page
   ============================================================ */

.customers-page[b-jhgnqtw0dm] {
    /* ── Color Tokens ─────────────────────────────────────── */
    --c-surface:           #FFFFFF;
    --c-surface-2:         #F8FAFC;   /* Slate-50  */
    --c-border:            #E2E8F0;   /* Slate-200 */
    --c-border-strong:     #CBD5E1;   /* Slate-300 */

    --c-ink:               #0F172A;   /* Slate-900 — primary text    */
    --c-ink-2:             #1E293B;   /* Slate-800 */
    --c-muted:             #64748B;   /* Slate-500 */
    --c-subtle:            #94A3B8;   /* Slate-400 */

    /* ── Lemaro Brand Tokens ──────────────────────────────── */
    --brand-navy:          #003366;
    --brand-orange:        #E65100;
    --brand-orange-hover:  #CF4900;   /* 10% donkerder               */
    --brand-text-main:     #1E293B;

    --c-accent:            var(--brand-navy);          /* navy — actief accent  */
    --c-accent-subtle:     rgba(0, 51, 102, 0.06);
    --c-accent-border:     rgba(0, 51, 102, 0.25);

    --c-primary:           var(--brand-orange);        /* oranje — primaire btn */
    --c-primary-hover:     var(--brand-orange-hover);
    --c-secondary:         #F1F5F9;   /* Slate-100 — secondary btn   */
    --c-secondary-hover:   #E2E8F0;   /* Slate-200 */

    --c-danger:            #DC2626;
    --c-danger-subtle:     #FEF2F2;
    --c-danger-border:     #FECACA;

    --c-success:           #059669;
    --c-success-subtle:    #F0FDF4;
    --c-success-border:    #A7F3D0;

    /* ── Shadow Tokens ────────────────────────────────────── */
    --c-shadow-sm:         0 1px 3px rgba(15,23,42,0.06), 0 1px 2px rgba(15,23,42,0.04);
    --c-shadow-md:         0 4px 12px rgba(15,23,42,0.08), 0 2px 4px rgba(15,23,42,0.04);

    /* ── Radius Tokens ────────────────────────────────────── */
    --c-radius-sm:         0.5rem;
    --c-radius-md:         0.75rem;
    --c-radius-lg:         1rem;

    /* ── Legacy aliases ───────────────────────────────────── */
    --customers-ink:       var(--c-ink);
    --customers-muted:     var(--c-muted);
    --customers-brand:     var(--c-accent);

    /* ── Page layout ──────────────────────────────────────── */
    display: grid;
    gap: 1.25rem;
    padding-bottom: 1.5rem;
}

.customers-header[b-jhgnqtw0dm],
.customers-toolbar[b-jhgnqtw0dm],
.customers-panel[b-jhgnqtw0dm],
.customers-detail-hero[b-jhgnqtw0dm],
.customers-snapshot-card[b-jhgnqtw0dm],
.customers-section-card[b-jhgnqtw0dm],
.customers-form[b-jhgnqtw0dm],
.customers-inline-confirm[b-jhgnqtw0dm] {
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--c-radius-lg);
    box-shadow: var(--c-shadow-sm);
}

.customers-header[b-jhgnqtw0dm] {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 1.5rem 1.75rem;
    align-items: center;
}

.customers-header h1[b-jhgnqtw0dm],
.customers-panel h2[b-jhgnqtw0dm],
.customers-detail-hero h2[b-jhgnqtw0dm],
.customers-section-card h3[b-jhgnqtw0dm],
.customers-form h3[b-jhgnqtw0dm],
.customers-empty-state h3[b-jhgnqtw0dm] {
    margin: 0;
    color: var(--brand-navy);
    font-weight: 700;
    letter-spacing: -0.02em;
}

.customers-header h1[b-jhgnqtw0dm] {
    font-size: clamp(1.5rem, 2.5vw, 2rem);
    line-height: 1.1;
    margin-top: 0.25rem;
}

.customers-header p[b-jhgnqtw0dm],
.customers-panel p[b-jhgnqtw0dm],
.customers-detail-hero p[b-jhgnqtw0dm],
.customers-section-card p[b-jhgnqtw0dm],
.customers-form p[b-jhgnqtw0dm],
.customers-empty-state p[b-jhgnqtw0dm],
.customers-placeholder[b-jhgnqtw0dm] {
    margin: 0;
    color: var(--c-muted);
    font-size: 0.9rem;
    line-height: 1.5;
}

.customers-panel__eyebrow[b-jhgnqtw0dm] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--c-accent);
}

.customers-header__actions[b-jhgnqtw0dm] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.customers-toolbar[b-jhgnqtw0dm] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
    align-items: center;
    padding: 0.875rem 1.25rem;
}

.customers-search[b-jhgnqtw0dm] {
    flex: 1 1 220px;
    min-width: 0;
    position: relative;
}

.customers-sort[b-jhgnqtw0dm] {
    flex: 0 0 auto;
    min-width: 160px;
    position: relative;
}

/* Visually hidden labels — accessible to screen readers */
.customers-search > span[b-jhgnqtw0dm],
.customers-sort > span[b-jhgnqtw0dm] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.customers-field[b-jhgnqtw0dm] {
    display: grid;
    gap: 0.45rem;
}

.customers-field-error[b-jhgnqtw0dm] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #b91c1c;
    letter-spacing: 0.01em;
    padding: 0.1rem 0;
}

.customers-field span abbr[b-jhgnqtw0dm] {
    color: #b91c1c;
    text-decoration: none;
    margin-left: 0.15rem;
    font-weight: 800;
}

.customers-field[b-jhgnqtw0dm]  .customers-input.invalid,
.customers-field[b-jhgnqtw0dm]  .customers-input:user-invalid {
    border-color: rgba(185, 28, 28, 0.55);
    box-shadow: 0 0 0 3px rgba(185, 28, 28, 0.09);
}

.customers-field span[b-jhgnqtw0dm],
.customers-snapshot-card span[b-jhgnqtw0dm],
.customers-context-item span[b-jhgnqtw0dm],
.customers-key-value-grid dt[b-jhgnqtw0dm],
.customers-toolbar__stats span[b-jhgnqtw0dm] {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--c-muted);
}

.customers-search[b-jhgnqtw0dm]  .customers-input,
.customers-sort[b-jhgnqtw0dm]  .customers-select,
.customers-field[b-jhgnqtw0dm]  .customers-input,
.customers-field[b-jhgnqtw0dm]  .customers-select,
.customers-field[b-jhgnqtw0dm]  .customers-textarea {
    width: 100%;
    box-sizing: border-box;
    min-height: 2.375rem;
    padding: 0.5rem 0.875rem;
    border: 1px solid var(--c-border);
    border-radius: var(--c-radius-sm);
    background: var(--c-surface);
    color: var(--c-ink);
    font: inherit;
    font-size: 0.9rem;
    box-shadow: none;
    transition: border-color 120ms ease, box-shadow 120ms ease;
    -webkit-appearance: none;
    appearance: none;
}

.customers-search[b-jhgnqtw0dm]  .customers-input::placeholder,
.customers-field[b-jhgnqtw0dm]  .customers-input::placeholder,
.customers-field[b-jhgnqtw0dm]  .customers-textarea::placeholder {
    color: var(--c-subtle);
}

.customers-search[b-jhgnqtw0dm]  .customers-input:focus,
.customers-sort[b-jhgnqtw0dm]  .customers-select:focus,
.customers-field[b-jhgnqtw0dm]  .customers-input:focus,
.customers-field[b-jhgnqtw0dm]  .customers-select:focus,
.customers-field[b-jhgnqtw0dm]  .customers-textarea:focus {
    outline: none;
    border-color: var(--c-accent);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

.customers-sort[b-jhgnqtw0dm]  .customers-select {
    padding-right: 2.25rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.625rem center;
    background-size: 1rem;
}

/* ── Filter group — individuele pill-knoppen ────────────── */
.customers-filter-group[b-jhgnqtw0dm] {
    display: flex;
    gap: 0.375rem;
    flex-wrap: nowrap;
    padding: 0;
    background: transparent;
    border: none;
}

.customers-filter[b-jhgnqtw0dm],
.customers-tab[b-jhgnqtw0dm],
.customers-action[b-jhgnqtw0dm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--c-radius-sm);
    font-weight: 600;
    font-size: 0.875rem;
    cursor: pointer;
    white-space: nowrap;
    transition: background 100ms ease, color 100ms ease,
                border-color 100ms ease, box-shadow 100ms ease;
}

.customers-filter[b-jhgnqtw0dm] {
    padding: 0.35rem 0.75rem;
    border: 1px solid rgba(30, 41, 59, 0.2);
    background: var(--c-surface);
    color: var(--brand-text-main);
}

.customers-action[b-jhgnqtw0dm] {
    padding: 0.5rem 0.875rem;
    border: 1px solid var(--c-border);
    background: var(--c-surface);
    color: var(--c-ink);
}

.customers-filter:hover[b-jhgnqtw0dm] {
    background: var(--c-surface-2);
    color: var(--c-ink);
    border-color: rgba(30, 41, 59, 0.35);
}

.customers-action:hover[b-jhgnqtw0dm],
.customers-tab:hover[b-jhgnqtw0dm] {
    background: var(--c-secondary-hover);
    color: var(--c-ink);
}

.customers-list__item:hover[b-jhgnqtw0dm] {
    background: var(--c-surface-2);
    border-color: var(--c-border-strong);
}

/* Actief filter: Lemaro Navy */
.customers-filter--active[b-jhgnqtw0dm] {
    background: var(--brand-navy);
    border-color: var(--brand-navy);
    color: #FFFFFF;
    font-weight: 700;
    box-shadow: none;
}

.customers-filter--active:hover[b-jhgnqtw0dm] {
    background: #002855;
    border-color: #002855;
    color: #FFFFFF;
}

/* ── Toolbar stats strip ───────────────────────────────── */
.customers-toolbar__stats[b-jhgnqtw0dm] {
    display: flex;
    gap: 1.25rem;
    margin-left: auto;
    padding-left: 0.875rem;
    border-left: 1px solid var(--c-border);
}

.customers-toolbar__stats article[b-jhgnqtw0dm] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    text-align: left;
    background: var(--c-surface);
    border-radius: var(--c-radius-sm);
    padding: 0.625rem 0.875rem;
    box-shadow: var(--c-shadow-sm);
    border-top: 3px solid var(--brand-navy);
    min-width: 5rem;
}

.customers-toolbar__stats strong[b-jhgnqtw0dm],
.customers-snapshot-card strong[b-jhgnqtw0dm],
.customers-context-item strong[b-jhgnqtw0dm] {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--c-ink);
    line-height: 1.2;
    letter-spacing: -0.02em;
}

.customers-grid[b-jhgnqtw0dm] {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: minmax(260px, 300px) minmax(0, 1fr);
    align-items: start;
}

.customers-panel[b-jhgnqtw0dm] {
    display: grid;
    gap: 1rem;
    padding: 1.25rem;
}

.customers-panel--list[b-jhgnqtw0dm] {
    position: sticky;
    top: 1rem;
}

.customers-panel__header[b-jhgnqtw0dm],
.customers-form__header[b-jhgnqtw0dm],
.customers-detail-hero[b-jhgnqtw0dm],
.customers-entity-card__header[b-jhgnqtw0dm],
.customers-section-card__actions[b-jhgnqtw0dm],
.customers-inline-confirm__actions[b-jhgnqtw0dm] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: start;
}

.customers-panel__header--stacked[b-jhgnqtw0dm] {
    align-items: end;
}

.customers-panel__header--detail[b-jhgnqtw0dm] {
    align-items: center;
}

.customers-list[b-jhgnqtw0dm] {
    display: grid;
    gap: 0.375rem;
}

/* ── Card-based customer list items ─────────────────────── */
.customers-list__item[b-jhgnqtw0dm] {
    display: grid;
    gap: 0.25rem;
    width: 100%;
    padding: 0.875rem 1rem;
    border: 1px solid var(--c-border);
    border-radius: var(--c-radius-md);
    background: var(--c-surface);
    text-align: left;
    cursor: pointer;
    overflow: hidden;
    transition: background 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.customers-list__item--selected[b-jhgnqtw0dm] {
    border-color: var(--c-accent);
    border-left: 3px solid var(--c-accent);
    background: var(--c-accent-subtle);
    box-shadow: none;
}

.customers-list__item--selected:hover[b-jhgnqtw0dm] {
    background: var(--c-accent-subtle);
    border-color: var(--c-accent);
}

.customers-list__row[b-jhgnqtw0dm],
.customers-entity-card__actions[b-jhgnqtw0dm],
.customers-entity-card__meta[b-jhgnqtw0dm] {
    display: flex;
    gap: 0.5rem;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap; /* enforce single row for truncation */
    min-width: 0;
}

/* ── Text safety: truncation + native tooltip (via title attr) ─ */
.customers-list__name[b-jhgnqtw0dm],
.customers-entity-card strong[b-jhgnqtw0dm],
.customers-key-value-grid dd[b-jhgnqtw0dm] {
    color: var(--c-ink);
    font-weight: 600;
    font-size: 0.9rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    min-width: 0;
    flex: 1 1 0;
}

.customers-list__meta[b-jhgnqtw0dm],
.customers-list__hint[b-jhgnqtw0dm],
.customers-entity-card__meta[b-jhgnqtw0dm] {
    color: var(--c-muted);
    font-size: 0.82rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    min-width: 0;
}

.customers-list__hint[b-jhgnqtw0dm] {
    font-size: 0.78rem;
    color: var(--c-subtle);
}

.customers-detail-shell[b-jhgnqtw0dm],
.customers-tab-panel[b-jhgnqtw0dm],
.customers-overview-layout[b-jhgnqtw0dm],
.customers-entity-list[b-jhgnqtw0dm],
.customers-context-stack[b-jhgnqtw0dm] {
    display: grid;
    gap: 1rem;
}

.customers-detail-hero[b-jhgnqtw0dm] {
    padding: 1.25rem 1.5rem;
    background: var(--c-surface);
}

.customers-detail-hero--create[b-jhgnqtw0dm] {
    align-items: center;
}

.customers-detail-hero__meta[b-jhgnqtw0dm],
.customers-tabs[b-jhgnqtw0dm] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
}

.customers-detail-hero__actions[b-jhgnqtw0dm] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
}

.customers-snapshot-grid[b-jhgnqtw0dm],
.customers-overview-layout[b-jhgnqtw0dm] {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.customers-snapshot-card[b-jhgnqtw0dm],
.customers-section-card[b-jhgnqtw0dm],
.customers-form[b-jhgnqtw0dm] {
    display: grid;
    gap: 1rem;
    padding: 1.25rem;
}

.customers-section-card--wide[b-jhgnqtw0dm] {
    grid-column: 1 / -1;
}

.customers-form--inline[b-jhgnqtw0dm] {
    background: var(--c-surface-2);
    border-color: var(--c-border);
    box-shadow: none;
}

.customers-key-value-grid[b-jhgnqtw0dm] {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;
}

.customers-key-value-grid div[b-jhgnqtw0dm],
.customers-context-item[b-jhgnqtw0dm],
.customers-entity-card[b-jhgnqtw0dm] {
    display: grid;
    gap: 0.35rem;
    padding: 0.875rem 1rem;
    border-radius: var(--c-radius-md);
    background: var(--c-surface-2);
    border: 1px solid var(--c-border);
    min-width: 0;
    overflow: hidden;
}

/* ── Text-overflow veiligheid voor klantgegevens ─────────── */
.customers-key-value-grid dd[b-jhgnqtw0dm],
.customers-context-item strong[b-jhgnqtw0dm],
.customers-context-item p[b-jhgnqtw0dm],
.customers-snapshot-card strong[b-jhgnqtw0dm],
.customers-snapshot-card p[b-jhgnqtw0dm],
.customers-field__value[b-jhgnqtw0dm] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    min-width: 0;
}

.customers-key-value-grid dd[b-jhgnqtw0dm] {
    margin: 0;
    font-size: 1rem;
}

.customers-form__grid[b-jhgnqtw0dm] {
    display: grid;
    gap: 0.95rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.customers-form__grid--compact[b-jhgnqtw0dm] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.customers-field--checkbox[b-jhgnqtw0dm] {
    align-content: end;
}

.customers-field--checkbox[b-jhgnqtw0dm]  .customers-checkbox {
    width: 1.1rem;
    height: 1.1rem;
    min-height: 1.1rem;
    margin: 0.1rem 0 0;
    accent-color: var(--c-accent);
    justify-self: start;
}

.customers-form__actions[b-jhgnqtw0dm] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.customers-tab[b-jhgnqtw0dm] {
    padding: 0.5rem 0.875rem;
    border: 1px solid transparent;
    background: transparent;
    color: var(--c-muted);
    font-size: 0.875rem;
}

.customers-tab--active[b-jhgnqtw0dm] {
    background: var(--c-accent-subtle);
    border-color: var(--c-accent-border);
    color: var(--c-accent);
    font-weight: 700;
}

.customers-entity-list[b-jhgnqtw0dm] {
    gap: 0.85rem;
}

.customers-inline-confirm[b-jhgnqtw0dm] {
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    background: var(--c-danger-subtle);
    border-color: var(--c-danger-border);
    box-shadow: none;
}

.customers-alert[b-jhgnqtw0dm] {
    padding: 0.75rem 1rem;
    border-radius: var(--c-radius-md);
    font-weight: 500;
    font-size: 0.9rem;
    border: 1px solid;
}

.customers-alert--error[b-jhgnqtw0dm] {
    color: var(--c-danger);
    background: var(--c-danger-subtle);
    border-color: var(--c-danger-border);
}

.customers-alert--success[b-jhgnqtw0dm] {
    color: var(--c-success);
    background: var(--c-success-subtle);
    border-color: var(--c-success-border);
}

.customers-empty-state[b-jhgnqtw0dm] {
    display: grid;
    gap: 0.5rem;
    place-items: start;
    padding: 1.25rem;
    border-radius: var(--c-radius-md);
    background: var(--c-surface-2);
    border: 1px dashed var(--c-border-strong);
}

.customers-empty-state--compact[b-jhgnqtw0dm] {
    place-items: start;
}

.customers-placeholder[b-jhgnqtw0dm] {
    padding: 0.5rem 0;
    color: var(--c-muted);
}

.customers-validation[b-jhgnqtw0dm] {
    margin: 0;
    padding-left: 1.25rem;
    color: var(--c-danger);
    font-size: 0.85rem;
}

.customers-badge[b-jhgnqtw0dm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: fit-content;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    white-space: nowrap;
    border: 1px solid;
}

.customers-badge--active[b-jhgnqtw0dm] {
    color: var(--c-success);
    background: var(--c-success-subtle);
    border-color: var(--c-success-border);
}

.customers-badge--inactive[b-jhgnqtw0dm] {
    color: var(--c-muted);
    background: var(--c-secondary);
    border-color: var(--c-border);
}

.customers-badge--mail[b-jhgnqtw0dm] {
    color: #92400E;
    background: #FFFBEB;
    border-color: #FDE68A;
}

.customers-badge--user[b-jhgnqtw0dm] {
    color: #5B21B6;
    background: #F5F3FF;
    border-color: #DDD6FE;
}

.customers-action:disabled[b-jhgnqtw0dm] {
    opacity: 0.45;
    cursor: not-allowed;
    pointer-events: none;
}

.customers-action--compact[b-jhgnqtw0dm] {
    padding: 0.375rem 0.75rem;
    font-size: 0.8rem;
}

/* Primary: Lemaro Orange */
.customers-action--primary[b-jhgnqtw0dm] {
    background: var(--brand-orange);
    color: #FFFFFF;
    border-color: var(--brand-orange);
    font-weight: 600;
}

.customers-action--primary:hover[b-jhgnqtw0dm] {
    background: var(--brand-orange-hover);
    border-color: var(--brand-orange-hover);
    color: #FFFFFF;
}

/* Secondary */
.customers-action--secondary[b-jhgnqtw0dm] {
    background: var(--c-secondary);
    color: var(--c-ink);
    border-color: var(--c-border);
}

.customers-action--secondary:hover[b-jhgnqtw0dm] {
    background: var(--c-secondary-hover);
}

/* Danger */
.customers-action--danger[b-jhgnqtw0dm] {
    color: var(--c-danger);
    border-color: var(--c-danger-border);
    background: var(--c-danger-subtle);
}

.customers-action--danger:hover[b-jhgnqtw0dm] {
    background: #FEE2E2;
}

/* ── Edit layout — two-column above-the-fold ─────────────── */

.customers-edit-layout[b-jhgnqtw0dm] {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
    align-items: start;
}

.customers-edit-sidebar[b-jhgnqtw0dm] {
    position: sticky;
    top: 1rem;
    display: grid;
    gap: 1rem;
    padding: 1.25rem;
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--c-radius-lg);
    box-shadow: var(--c-shadow-sm);
    border-top: 3px solid var(--brand-navy);
}

.customers-edit-sidebar__identity[b-jhgnqtw0dm] {
    display: grid;
    gap: 0.4rem;
}

.customers-edit-sidebar__identity h2[b-jhgnqtw0dm] {
    margin: 0;
    color: var(--brand-navy);
    font-weight: 700;
    font-size: 1.1rem;
    letter-spacing: -0.02em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.customers-edit-sidebar__context[b-jhgnqtw0dm] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
}

.customers-edit-sidebar__stat[b-jhgnqtw0dm] {
    display: grid;
    gap: 0.2rem;
    padding: 0.6rem 0.75rem;
    border-radius: var(--c-radius-md);
    background: var(--c-surface-2);
    border: 1px solid var(--c-border);
}

.customers-edit-sidebar__stat span[b-jhgnqtw0dm] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--c-muted);
}

.customers-edit-sidebar__stat strong[b-jhgnqtw0dm] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--c-ink);
    letter-spacing: -0.02em;
    line-height: 1;
}

.customers-edit-sidebar__actions[b-jhgnqtw0dm] {
    display: grid;
    gap: 0.5rem;
}

.customers-action--full[b-jhgnqtw0dm] {
    width: 100%;
    justify-content: center;
}

.customers-edit-main[b-jhgnqtw0dm] {
    display: grid;
    gap: 1rem;
}

.customers-form__section[b-jhgnqtw0dm] {
    display: grid;
    gap: 0.85rem;
}

.customers-form__section h3[b-jhgnqtw0dm] {
    margin: 0;
    color: var(--brand-navy);
    font-weight: 700;
    font-size: 0.95rem;
    letter-spacing: -0.01em;
}

/* Edit grid: Naam en Adres full-width, Postcode+Plaats naast elkaar */
.customers-form__grid--edit[b-jhgnqtw0dm] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.customers-form__grid--edit .customers-field--wide[b-jhgnqtw0dm] {
    grid-column: 1 / -1;
}

@media (max-width: 1180px) {
    .customers-grid[b-jhgnqtw0dm],
    .customers-snapshot-grid[b-jhgnqtw0dm],
    .customers-overview-layout[b-jhgnqtw0dm],
    .customers-key-value-grid[b-jhgnqtw0dm],
    .customers-form__grid[b-jhgnqtw0dm],
    .customers-form__grid--compact[b-jhgnqtw0dm],
    .customers-edit-layout[b-jhgnqtw0dm] {
        grid-template-columns: 1fr;
    }

    .customers-edit-sidebar[b-jhgnqtw0dm] {
        position: static;
    }

    .customers-edit-sidebar__actions[b-jhgnqtw0dm] {
        grid-template-columns: 1fr 1fr;
    }

    .customers-toolbar__stats[b-jhgnqtw0dm] {
        order: -1;
        margin-left: 0;
        padding-left: 0;
        border-left: none;
        border-bottom: 1px solid var(--c-border);
        padding-bottom: 0.625rem;
        width: 100%;
        gap: 1rem;
    }

    .customers-panel--list[b-jhgnqtw0dm] {
        position: static;
    }
}

@media (max-width: 760px) {
    .customers-header[b-jhgnqtw0dm],
    .customers-panel[b-jhgnqtw0dm],
    .customers-detail-hero[b-jhgnqtw0dm],
    .customers-snapshot-card[b-jhgnqtw0dm],
    .customers-section-card[b-jhgnqtw0dm],
    .customers-form[b-jhgnqtw0dm],
    .customers-toolbar[b-jhgnqtw0dm] {
        padding: 1rem;
    }

    .customers-header[b-jhgnqtw0dm],
    .customers-panel__header[b-jhgnqtw0dm],
    .customers-form__header[b-jhgnqtw0dm],
    .customers-detail-hero[b-jhgnqtw0dm],
    .customers-detail-hero__actions[b-jhgnqtw0dm],
    .customers-entity-card__header[b-jhgnqtw0dm],
    .customers-form__actions[b-jhgnqtw0dm],
    .customers-section-card__actions[b-jhgnqtw0dm],
    .customers-inline-confirm__actions[b-jhgnqtw0dm] {
        grid-template-columns: 1fr;
        flex-direction: column;
        align-items: stretch;
    }

    .customers-toolbar[b-jhgnqtw0dm] {
        flex-direction: column;
        align-items: stretch;
    }

    .customers-search[b-jhgnqtw0dm],
    .customers-sort[b-jhgnqtw0dm] {
        flex: 1 1 auto;
        min-width: 0;
    }

    .customers-filter-group[b-jhgnqtw0dm] {
        flex-wrap: wrap;
    }

    .customers-toolbar__stats[b-jhgnqtw0dm] {
        order: 0;
        flex-wrap: wrap;
        gap: 0.75rem 1.25rem;
    }
}

@media (max-width: 560px) {
    .customers-toolbar__stats[b-jhgnqtw0dm] {
        gap: 0.5rem 1rem;
    }

    .customers-detail-hero__meta[b-jhgnqtw0dm],
    .customers-tabs[b-jhgnqtw0dm],
    .customers-entity-card__actions[b-jhgnqtw0dm],
    .customers-list__row[b-jhgnqtw0dm],
    .customers-entity-card__meta[b-jhgnqtw0dm] {
        flex-wrap: wrap;
    }
}

/* ============================================================
   DATA GRID — Clean List-to-Detail layout
   Used by the rewritten Customers.razor (list-only view)
   NOTE: Blazor CSS isolation scopes :root selectors incorrectly,
   so the grid-template-columns is defined inline on each rule.
   Column order: [Klant+Adres flex] [Status 110px] [Contacten 90px] [Locaties 90px] [Acties 110px]
   ============================================================ */

/* ── Create panel ─────────────────────────────────── */
.customers-create-panel[b-jhgnqtw0dm] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-width: 720px;
}

.customers-create-panel__header[b-jhgnqtw0dm] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
}

.customers-create-card[b-jhgnqtw0dm] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-top: 3px solid var(--brand-orange);
    border-radius: 1.5rem;
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.5rem;
}

/* ── List panel — unified card wrapping header + all rows ─── */
.customers-list-panel[b-jhgnqtw0dm] {
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--c-radius-lg);
    box-shadow: var(--c-shadow-sm);
    overflow: hidden;
}

/* ── FluentUI overrides ───────────────────────────────────── */

/* Toolbar: search fills flex container */
.customers-toolbar[b-jhgnqtw0dm]  fluent-text-field.customers-search {
    flex: 1 1 220px;
    min-width: 0;
}

/* Toolbar: sort compact width */
.customers-toolbar[b-jhgnqtw0dm]  fluent-select.customers-sort {
    flex: 0 0 auto;
    min-width: 160px;
}

/* Create form: FluentTextField fills grid cell */
.customers-create-card[b-jhgnqtw0dm]  fluent-text-field.customers-fluent-field {
    width: 100%;
}

/* FluentGrid fills card width */
.customers-create-card[b-jhgnqtw0dm]  fluent-grid {
    width: 100%;
}

/* FluentButton sizing in form actions */
.customers-form__actions[b-jhgnqtw0dm]  fluent-button::part(control) {
    min-height: 2.5rem;
    font-weight: 600;
    font-size: 0.875rem;
    border-radius: var(--c-radius-sm, 0.5rem);
    padding-inline: 1.25rem;
}

/* ── Grid header row ──────────────────────────────── */
.customers-grid-header[b-jhgnqtw0dm] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 110px 90px 90px 110px;
    align-items: center;
    padding: 0.45rem 1.25rem;
    background: #F1F5F9;
    border-bottom: 1px solid var(--c-border);
    color: var(--brand-navy);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* Status / count / actions header cells align with their data columns */
.customers-grid-header span:nth-child(2)[b-jhgnqtw0dm] { /* Status */
    text-align: left;
}
.customers-grid-header span:nth-child(3)[b-jhgnqtw0dm],
.customers-grid-header span:nth-child(4)[b-jhgnqtw0dm] { /* Contacten / Locaties */
    text-align: center;
}
.customers-grid-header span:nth-child(5)[b-jhgnqtw0dm] { /* Acties — empty */
    text-align: right;
}

/* ── Grid rows list ───────────────────────────────── */
.customers-grid-list[b-jhgnqtw0dm] {
    display: flex;
    flex-direction: column;
}

/* ── Individual data row ──────────────────────────── */
.customers-grid-row[b-jhgnqtw0dm] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 110px 90px 90px 110px;
    align-items: center;
    padding: 0.55rem 1.25rem;
    border-bottom: 1px solid var(--c-border);
    background: var(--c-surface);
    cursor: pointer;
    transition: background 100ms ease;
}

.customers-grid-row:last-child[b-jhgnqtw0dm] {
    border-bottom: none;
}

.customers-grid-row:hover[b-jhgnqtw0dm] {
    background: #F8FAFC;
}

/* ── Col 1: Identity cell — Name (bold navy) + ZipCode·Place (muted) */
.customers-grid-row__identity[b-jhgnqtw0dm] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    padding-right: 1rem;
}

.customers-grid-row__identity strong[b-jhgnqtw0dm] {
    color: var(--brand-navy);
    font-size: 0.95rem;
    font-weight: 700;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    letter-spacing: -0.01em;
}

.customers-grid-row__identity-sub[b-jhgnqtw0dm] {
    color: var(--c-muted);
    font-size: 0.8rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* ── Col 2: Status badge — left-aligned ──────────── */
.customers-grid-row__status[b-jhgnqtw0dm] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

/* ── Col 3 + 4: Count cells — icon + number, centered ── */
.customers-grid-row__count[b-jhgnqtw0dm] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    color: var(--c-ink-2);
    font-size: 0.88rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.customers-grid-row__count svg[b-jhgnqtw0dm] {
    color: var(--c-subtle);
    flex-shrink: 0;
}

/* ── Col 5: Actions — right-aligned ──────────────── */
.customers-grid-row__actions[b-jhgnqtw0dm] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

/* ── Manage button: compact Navy outline ──────────── */
.customers-action--manage[b-jhgnqtw0dm] {
    padding: 0.3rem 0.75rem;
    font-size: 0.8rem;
    font-weight: 600;
    background: transparent;
    border: 1px solid var(--brand-navy);
    color: var(--brand-navy);
    border-radius: var(--c-radius-sm);
}

.customers-action--manage:hover[b-jhgnqtw0dm] {
    background: var(--brand-navy);
    color: #fff;
    border-color: var(--brand-navy);
}

/* ── Eyebrow label (stats strip / section headings) ─ */
.customers-eyebrow[b-jhgnqtw0dm] {
    color: #6b7280;
    font-size: 0.73rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

/* ── Responsive collapse ──────────────────────────── */
@media (max-width: 768px) {
    .customers-grid-header[b-jhgnqtw0dm],
    .customers-grid-row__count[b-jhgnqtw0dm] {
        display: none;
    }

    .customers-grid-row[b-jhgnqtw0dm] {
        grid-template-columns: minmax(0, 1fr) auto auto;
    }

    .customers-grid-row__identity strong[b-jhgnqtw0dm] {
        white-space: normal;
    }
}
/* /Components/Pages/Documents.razor.rz.scp.css */
/* ============================================================
   LEMARO DASHBOARD — DOCUMENTS PAGE
   Scoped via Blazor CSS isolation
   ============================================================ */

.docs-page[b-rbdp2auabv] {
    --c-surface:           #FFFFFF;
    --c-surface-2:         #F8FAFC;
    --c-border:            #E2E8F0;
    --c-ink:               #0F172A;
    --c-muted:             #64748B;
    --brand-navy:          #003366;
    --brand-orange:        #E65100;
    --c-danger:            #DC2626;
    --c-danger-subtle:     #FEF2F2;
    --c-danger-border:     #FECACA;
    --c-warning:           #D97706;
    --c-warning-subtle:    #FFFBEB;
    --c-warning-border:    #FDE68A;
    --c-success:           #059669;
    --c-success-subtle:    #F0FDF4;
    --c-success-border:    #A7F3D0;
    --c-shadow-sm:         0 1px 3px rgba(15,23,42,0.06);
    --c-shadow-md:         0 4px 12px rgba(15,23,42,0.08);
    --c-radius-sm:         0.5rem;
    --c-radius-md:         0.75rem;
    --c-radius-lg:         1rem;

    display: grid;
    gap: 1.25rem;
    padding-bottom: 1.5rem;
}

/* ── Header ───────────────────────────────────────────────── */
.docs-header[b-rbdp2auabv] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--c-radius-lg);
    padding: 1.5rem 1.75rem;
    box-shadow: var(--c-shadow-sm);
}

.docs-header__copy h1[b-rbdp2auabv] {
    margin: 0.35rem 0 0.4rem;
    font-size: clamp(1.5rem, 3vw, 2.2rem);
    color: var(--brand-navy);
}

.docs-header__copy p[b-rbdp2auabv] {
    margin: 0;
    color: var(--c-muted);
    max-width: 60ch;
}

.docs-eyebrow[b-rbdp2auabv] {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--brand-navy);
}

/* ── Toolbar ──────────────────────────────────────────────── */
.docs-toolbar[b-rbdp2auabv] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
    align-items: center;
    padding: 0.875rem 1.25rem;
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--c-radius-lg);
    box-shadow: var(--c-shadow-sm);
}

.docs-search[b-rbdp2auabv] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--c-muted);
    min-width: 14rem;
    flex: 1 1 14rem;
}

.docs-input[b-rbdp2auabv] {
    height: 2.5rem;
    padding: 0 0.75rem;
    border: 1px solid var(--c-border);
    border-radius: var(--c-radius-sm);
    font-size: 0.9rem;
    background: var(--c-surface);
    color: var(--c-ink);
    transition: border-color 0.15s;
    width: 100%;
}

.docs-input:focus[b-rbdp2auabv] {
    outline: none;
    border-color: var(--brand-navy);
    box-shadow: 0 0 0 3px rgba(0, 51, 102, 0.12);
}

.docs-filter-group[b-rbdp2auabv] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.docs-filter[b-rbdp2auabv] {
    height: 2.375rem;
    padding: 0.35rem 0.75rem;
    border: 1px solid rgba(30, 41, 59, 0.2);
    border-radius: var(--c-radius-sm);
    background: var(--c-surface);
    color: #1E293B;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 100ms ease, color 100ms ease, border-color 100ms ease;
}

.docs-filter:hover[b-rbdp2auabv] { border-color: var(--brand-navy); color: var(--brand-navy); }
.docs-filter--active[b-rbdp2auabv] {
    background: var(--brand-navy);
    border-color: var(--brand-navy);
    color: #ffffff;
}

/* ── Alerts ───────────────────────────────────────────────── */
.docs-alert[b-rbdp2auabv] {
    padding: 0.85rem 1rem;
    border-radius: var(--c-radius-sm);
    font-size: 0.9rem;
}

.docs-alert--error[b-rbdp2auabv] {
    background: var(--c-danger-subtle);
    border: 1px solid var(--c-danger-border);
    color: var(--c-danger);
}

/* ── Table ────────────────────────────────────────────────── */
.docs-table-wrap[b-rbdp2auabv] {
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-top: 3px solid var(--brand-navy);
    border-radius: var(--c-radius-lg);
    box-shadow: var(--c-shadow-sm);
    overflow-x: auto;
}

.docs-table[b-rbdp2auabv] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.docs-table thead tr[b-rbdp2auabv] {
    background: var(--c-surface-2);
    border-bottom: 2px solid var(--c-border);
}

.docs-table th[b-rbdp2auabv] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--c-muted);
    white-space: nowrap;
}

.docs-row[b-rbdp2auabv] {
    border-bottom: 1px solid var(--c-border);
    transition: background 0.12s;
}

.docs-row:hover[b-rbdp2auabv] { background: var(--c-surface-2); }

.docs-row--expired[b-rbdp2auabv] {
    background: var(--c-danger-subtle);
}

.docs-row--expired:hover[b-rbdp2auabv] {
    background: #fee2e2;
}

.docs-cell[b-rbdp2auabv] {
    padding: 0.75rem 1rem;
    color: var(--c-ink);
    vertical-align: middle;
}

.docs-cell--name[b-rbdp2auabv]  { font-weight: 700; color: var(--brand-navy); max-width: 200px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.docs-cell--type[b-rbdp2auabv]  { font-weight: 600; max-width: 160px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.docs-cell--muted[b-rbdp2auabv] { color: var(--c-muted); }
.docs-cell--date[b-rbdp2auabv]  { font-variant-numeric: tabular-nums; white-space: nowrap; }
.docs-cell--center[b-rbdp2auabv] { text-align: center; }
.docs-cell--attachment[b-rbdp2auabv] { min-width: 12rem; }

/* ── Status badges ────────────────────────────────────────── */
.docs-badge[b-rbdp2auabv] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.docs-badge--expired[b-rbdp2auabv]  { background: var(--c-danger-subtle);  color: var(--c-danger);  border: 1px solid var(--c-danger-border); }
.docs-badge--expiring[b-rbdp2auabv] {
    background: var(--c-warning-subtle);
    color: var(--c-warning);
    border: 1px solid var(--c-warning-border);
    justify-content: center;
    max-width: 8.75rem;
    line-height: 1.15;
    text-align: center;
    white-space: normal;
}
.docs-badge--valid[b-rbdp2auabv]    { background: var(--c-success-subtle); color: var(--c-success); border: 1px solid var(--c-success-border); }
.docs-badge--none[b-rbdp2auabv]     { background: var(--c-surface-2);      color: var(--c-muted);   border: 1px solid var(--c-border); }

/* ── Ready indicator ──────────────────────────────────────── */
.docs-ready[b-rbdp2auabv] {
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    text-align: center;
    line-height: 1.5rem;
    font-size: 0.85rem;
    font-weight: 700;
}

.docs-ready--yes[b-rbdp2auabv] { background: var(--c-success-subtle); color: var(--c-success); }
.docs-ready--no[b-rbdp2auabv]  { background: var(--c-surface-2); color: var(--c-muted); }

/* ── Action buttons in table ──────────────────────────────── */
.docs-cell--actions[b-rbdp2auabv] { white-space: nowrap; }

.docs-action-btn[b-rbdp2auabv] {
    padding: 0.3rem 0.75rem;
    border-radius: var(--c-radius-sm);
    border: 1px solid var(--c-border);
    background: var(--c-surface);
    color: var(--brand-navy);
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
    margin-right: 0.35rem;
    transition: all 0.15s;
}

.docs-action-btn:hover[b-rbdp2auabv] { border-color: var(--brand-navy); background: rgba(0,51,102,0.04); }
.docs-action-btn--danger[b-rbdp2auabv] { color: var(--c-danger); border-color: var(--c-danger-border); }
.docs-action-btn--danger:hover[b-rbdp2auabv] { background: var(--c-danger-subtle); }

.docs-attachment-link[b-rbdp2auabv] {
    display: inline-flex;
    align-items: center;
    padding: 0.3rem 0.75rem;
    border-radius: var(--c-radius-sm);
    border: 1px solid rgba(0, 51, 102, 0.15);
    background: rgba(0, 51, 102, 0.04);
    color: var(--brand-navy);
    font-size: 0.78rem;
    font-weight: 700;
    text-decoration: none;
}

.docs-attachment-link:hover[b-rbdp2auabv] {
    border-color: var(--brand-navy);
    background: rgba(0, 51, 102, 0.08);
}

.docs-attachment-name[b-rbdp2auabv] {
    margin-top: 0.35rem;
    font-size: 0.74rem;
    color: var(--c-muted);
    word-break: break-word;
}

.docs-attachment-state[b-rbdp2auabv] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.55rem;
    border-radius: 999px;
    background: var(--c-surface-2);
    color: var(--c-muted);
    font-size: 0.72rem;
    font-weight: 700;
}

.docs-attachment-state--missing[b-rbdp2auabv] {
    background: var(--c-warning-subtle);
    color: var(--c-warning);
}

/* ── Empty & loading states ───────────────────────────────── */
.docs-empty[b-rbdp2auabv] {
    padding: 3rem 1rem;
    text-align: center;
    color: var(--c-muted);
    font-size: 0.95rem;
}

.docs-loading[b-rbdp2auabv] {
    text-align: center;
    padding: 3rem;
    color: var(--c-muted);
}

.docs-count[b-rbdp2auabv] {
    text-align: right;
    font-size: 0.8rem;
    color: var(--c-muted);
    padding: 0 0.25rem;
}

/* ── Primary/ghost buttons ────────────────────────────────── */
.docs-btn[b-rbdp2auabv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 2.75rem;
    padding: 0 1.25rem;
    border-radius: var(--c-radius-sm);
    font-size: 0.875rem;
    font-weight: 700;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background 100ms ease, color 100ms ease, border-color 100ms ease;
    text-decoration: none;
}

.docs-btn--primary[b-rbdp2auabv] { background: var(--brand-orange); color: #ffffff; }
.docs-btn--primary:hover:not(:disabled)[b-rbdp2auabv] { background: #CF4900; }
.docs-btn--primary:disabled[b-rbdp2auabv] { opacity: 0.5; cursor: not-allowed; }
.docs-btn--ghost[b-rbdp2auabv] { background: transparent; border-color: var(--c-border); color: var(--c-ink); }
.docs-btn--ghost:hover[b-rbdp2auabv] { background: var(--c-surface-2); }
.docs-btn--danger[b-rbdp2auabv] { background: var(--c-danger); color: #ffffff; border-color: var(--c-danger); }
.docs-btn--danger:hover:not(:disabled)[b-rbdp2auabv] { background: #b91c1c; }
.docs-btn--danger:disabled[b-rbdp2auabv] { opacity: 0.5; cursor: not-allowed; }

/* ── Drawer ───────────────────────────────────────────────── */
.docs-modal[b-rbdp2auabv] {
    position: fixed;
    inset: 0;
    z-index: 200;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: clamp(1rem, 2.5vw, 2rem);
    overflow-y: auto;
}

.docs-drawer-backdrop[b-rbdp2auabv] {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.35);
    z-index: 0;
    animation: docs-fade-in-b-rbdp2auabv 0.15s ease;
}

.docs-drawer[b-rbdp2auabv] {
    position: relative;
    z-index: 1;
    width: min(1080px, 100%);
    margin: max(2rem, 4vh) auto;
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--c-radius-lg);
    box-shadow: 0 24px 60px rgba(15,23,42,0.2);
    overflow: visible;
    padding: 1.75rem clamp(1rem, 2vw, 1.75rem);
    animation: docs-slide-in-b-rbdp2auabv 0.2s ease;
}

@keyframes docs-fade-in-b-rbdp2auabv {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes docs-slide-in-b-rbdp2auabv {
    from {
        opacity: 0;
        transform: translateY(1rem);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.docs-drawer__header[b-rbdp2auabv] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.docs-drawer__header-copy[b-rbdp2auabv] {
    display: grid;
    gap: 0.35rem;
    min-width: 0;
}

.docs-drawer__header h2[b-rbdp2auabv] {
    margin: 0;
    font-size: 1.3rem;
    color: var(--brand-navy);
}

.docs-drawer__close[b-rbdp2auabv] {
    position: static;
    width: 2rem;
    height: 2rem;
    background: none;
    border: none;
    font-size: 1.1rem;
    color: var(--c-muted);
    cursor: pointer;
    border-radius: var(--c-radius-sm);
    transition: background 0.12s;
}

.docs-drawer__close:hover[b-rbdp2auabv] { background: var(--c-surface-2); color: var(--c-ink); }

/* ── Form ─────────────────────────────────────────────────── */
.docs-form[b-rbdp2auabv] { display: grid; gap: 1.5rem; }

.docs-form__grid[b-rbdp2auabv] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem 1.5rem;
}

.docs-field[b-rbdp2auabv] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--c-muted);
}

.docs-field--span-2[b-rbdp2auabv] {
    grid-column: span 2;
}

.docs-field--full-width[b-rbdp2auabv] {
    grid-column: 1 / -1;
}

.docs-field[b-rbdp2auabv]  fluent-select.docs-select,
.docs-field[b-rbdp2auabv]  fluent-text-field.docs-text-field {
    width: 100%;
    min-width: 0;
}

.docs-upload[b-rbdp2auabv] {
    width: 100%;
    padding: 0.65rem 0.75rem;
    border: 1px dashed var(--c-border);
    border-radius: var(--c-radius-sm);
    background: var(--c-surface-2);
    color: var(--c-ink);
    font-size: 0.9rem;
}

.docs-date-input[b-rbdp2auabv] {
    height: 2.5rem;
    padding: 0 0.75rem;
    border: 1px solid var(--c-border);
    border-radius: var(--c-radius-sm);
    font-size: 0.9rem;
    font-family: inherit;
    background: var(--c-surface);
    color: var(--c-ink);
    width: 100%;
    box-sizing: border-box;
    transition: border-color 0.15s;
}

.docs-date-input:focus[b-rbdp2auabv] {
    outline: none;
    border-color: var(--brand-navy);
    box-shadow: 0 0 0 3px rgba(0, 51, 102, 0.12);
}

.docs-field-hint[b-rbdp2auabv] {
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--c-muted);
}

.docs-field[b-rbdp2auabv]  fluent-select.docs-select::part(control),
.docs-field[b-rbdp2auabv]  fluent-text-field.docs-text-field::part(control) {
    min-height: 2.5rem;
    border-radius: var(--c-radius-sm);
    border-color: var(--c-border);
    background: var(--c-surface);
}

.docs-field[b-rbdp2auabv]  fluent-select.docs-select::part(control):focus-within,
.docs-field[b-rbdp2auabv]  fluent-text-field.docs-text-field::part(control):focus-within {
    border-color: var(--brand-navy);
    box-shadow: 0 0 0 3px rgba(0, 51, 102, 0.12);
}

.docs-field[b-rbdp2auabv]  fluent-select.docs-select::part(selected-value),
.docs-field[b-rbdp2auabv]  fluent-text-field.docs-text-field::part(control) {
    font-size: 0.9rem;
    color: var(--c-ink);
}

.docs-field[b-rbdp2auabv]  .validation-message {
    font-size: 0.78rem;
    color: var(--c-danger);
}

.docs-form__switches[b-rbdp2auabv] {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.docs-form__switches[b-rbdp2auabv]  fluent-checkbox {
    font-size: 0.875rem;
}

.docs-switch-row[b-rbdp2auabv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    cursor: pointer;
}

.docs-form__footer[b-rbdp2auabv] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    align-items: center;
    padding-top: 0.75rem;
    border-top: 1px solid var(--c-border);
}

.docs-form__footer[b-rbdp2auabv]  fluent-button::part(control) {
    height: 2.75rem;
    padding: 0 1.25rem;
    font-weight: 700;
    font-size: 0.875rem;
    border-radius: var(--c-radius-sm);
    cursor: pointer;
}

.docs-validation[b-rbdp2auabv] {
    font-size: 0.82rem;
    color: var(--c-danger);
    padding: 0.5rem 0;
}

/* ── Confirm dialog ───────────────────────────────────────── */
.docs-confirm[b-rbdp2auabv] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--c-radius-lg);
    box-shadow: var(--c-shadow-md);
    padding: 1.75rem;
    z-index: 220;
    max-width: 420px;
    width: 90vw;
}

.docs-confirm p[b-rbdp2auabv] { margin: 0 0 1.25rem; font-size: 0.95rem; }

.docs-confirm__actions[b-rbdp2auabv] {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
}

/* ── Accessibility ────────────────────────────────────────── */
.sr-only[b-rbdp2auabv] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 1100px) {
    .docs-form__grid[b-rbdp2auabv] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .docs-field--span-2[b-rbdp2auabv] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 768px) {
    .docs-modal[b-rbdp2auabv] {
        padding: 0.75rem;
    }

    .docs-drawer[b-rbdp2auabv] {
        margin: 0;
        width: 100%;
        padding: 1.25rem 1rem;
    }

    .docs-form__grid[b-rbdp2auabv] {
        grid-template-columns: 1fr;
        gap: 0.9rem;
    }

    .docs-field--span-2[b-rbdp2auabv],
    .docs-field--full-width[b-rbdp2auabv] {
        grid-column: 1 / -1;
    }

    .docs-header[b-rbdp2auabv] {
        flex-direction: column;
    }

    .docs-header__actions[b-rbdp2auabv] {
        width: 100%;
    }

    .docs-drawer__header[b-rbdp2auabv],
    .docs-form__footer[b-rbdp2auabv] {
        grid-template-columns: 1fr;
    }

    .docs-form__footer[b-rbdp2auabv] {
        display: grid;
    }

    .docs-btn[b-rbdp2auabv] {
        width: 100%;
    }
}
/* /Components/Pages/ForgotPassword.razor.rz.scp.css */
/* ============================================================
   LEMARO DASHBOARD — FORGOT PASSWORD PAGE
   Aligned with ResetPassword.razor and Login.razor aesthetic.
   ============================================================ */

/* ── Achtergrond ── */
.forgot-password-bg[b-flkb5l10rg] {
    position: fixed;
    inset: 0;
    z-index: 0;
    background-image: url('/images/face-the-beast-2021-08-30-05-15-57-utc-scaled-1.jpg');
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
}

.forgot-password-bg[b-flkb5l10rg]::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(8, 24, 50, 0.52);
}

.forgot-password-shell[b-flkb5l10rg] {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 3rem 1rem;
    min-height: 60vh;
}

.forgot-password-card[b-flkb5l10rg] {
    width: 100%;
    max-width: 28rem;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-top: 3px solid var(--lemaro-navy);
    border-radius: 1rem;
    padding: 2rem 2rem 2.25rem;
    box-shadow: 0 4px 12px rgba(15,23,42,0.08), 0 2px 4px rgba(15,23,42,0.04);
    display: grid;
    gap: 1rem;
}

.forgot-password-eyebrow[b-flkb5l10rg] {
    display: inline-flex;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--lemaro-navy);
}

.forgot-password-card h1[b-flkb5l10rg] {
    margin: 0;
    font-size: 1.4rem;
    color: var(--lemaro-navy);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.forgot-password-intro[b-flkb5l10rg] {
    margin: 0;
    color: #64748B;
    font-size: 0.9rem;
    line-height: 1.5;
}

/* ── Alerts ── */
.forgot-password-alert[b-flkb5l10rg] {
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    font-size: 0.875rem;
    line-height: 1.5;
}

.forgot-password-alert--success[b-flkb5l10rg] {
    background: #F0FDF4;
    border: 1px solid #BBF7D0;
    color: #166534;
}

.forgot-password-alert--error[b-flkb5l10rg] {
    background: #FFF5F5;
    border: 1px solid #FED7D7;
    color: #C53030;
}

/* ── Form ── */
.forgot-password-form[b-flkb5l10rg] {
    display: grid;
    gap: 0.875rem;
}

.forgot-password-field[b-flkb5l10rg] {
    display: grid;
    gap: 0.35rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748B;
}

.forgot-password-input[b-flkb5l10rg] {
    width: 100%;
    box-sizing: border-box;
    min-height: 2.5rem;
    padding: 0.5rem 0.875rem;
    border: 1px solid #E2E8F0;
    border-radius: 0.5rem;
    background: #FFFFFF;
    color: #0F172A;
    font: inherit;
    font-size: 0.9rem;
    transition: border-color 120ms ease, box-shadow 120ms ease;
}

.forgot-password-input:focus[b-flkb5l10rg] {
    outline: none;
    border-color: var(--lemaro-navy);
    box-shadow: 0 0 0 3px rgba(0, 51, 102, 0.12);
}

/* Neutraliseer Blazor globale validatie-outlines */
.forgot-password-input.valid[b-flkb5l10rg],
.forgot-password-input.valid.modified[b-flkb5l10rg] {
    outline: none !important;
    border-color: #E2E8F0;
}

.forgot-password-input.valid.modified:focus[b-flkb5l10rg] {
    border-color: var(--lemaro-navy);
    box-shadow: 0 0 0 3px rgba(0, 51, 102, 0.12);
}

.forgot-password-input.invalid[b-flkb5l10rg] {
    outline: none !important;
    border-color: #FECACA;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1);
}

.forgot-password-validation-msg[b-flkb5l10rg] {
    font-size: 0.78rem;
    color: #C53030;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    margin-top: 0.1rem;
}

.forgot-password-submit[b-flkb5l10rg] {
    width: 100%;
    min-height: 2.625rem;
    padding: 0.6rem 1rem;
    border: none;
    border-radius: 0.5rem;
    background: var(--lemaro-navy);
    color: #ffffff;
    font-family: var(--lemaro-heading-font);
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 100ms ease;
}

.forgot-password-submit:hover:not(:disabled)[b-flkb5l10rg] {
    background: #002244;
}

.forgot-password-submit:disabled[b-flkb5l10rg] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Footer ── */
.forgot-password-footer[b-flkb5l10rg] {
    display: flex;
    justify-content: center;
}

.forgot-password-back[b-flkb5l10rg] {
    font-size: 0.85rem;
    color: var(--lemaro-navy);
    text-decoration: none;
    font-weight: 600;
}

.forgot-password-back:hover[b-flkb5l10rg] {
    text-decoration: underline;
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* ── Hero layout ──────────────────────────────────────────── */
.home-hero[b-jzq31ev9wv] {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(18rem, 0.9fr);
    gap: 1.5rem;
    align-items: stretch;
}

.home-hero__copy[b-jzq31ev9wv],
.home-hero__panel[b-jzq31ev9wv],
.home-card[b-jzq31ev9wv] {
    background: var(--lemaro-surface);
    border: 1px solid var(--lemaro-border);
    border-radius: 1rem;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06), 0 1px 2px rgba(15,23,42,0.04);
}

.home-hero__copy[b-jzq31ev9wv] {
    padding: 2rem;
    background: #FFFFFF;
    border-top: 3px solid var(--lemaro-navy);
}

.home-hero__label[b-jzq31ev9wv],
.home-card__kicker[b-jzq31ev9wv] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--lemaro-navy);
}

.home-hero h1[b-jzq31ev9wv] {
    margin: 0.85rem 0 1rem;
    font-size: clamp(1.8rem, 4vw, 3rem);
    line-height: 1.05;
    color: var(--lemaro-navy);
}

.home-hero p[b-jzq31ev9wv] {
    max-width: 58ch;
    color: var(--lemaro-muted);
    font-size: 1.04rem;
}

.home-hero__actions[b-jzq31ev9wv] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-top: 1.5rem;
}

.home-hero__hint[b-jzq31ev9wv] {
    margin: 1rem 0 0;
    color: var(--lemaro-navy);
    font-weight: 700;
}

/* ── Hero panel (week summary) ────────────────────────────── */
.home-hero__panel[b-jzq31ev9wv] {
    padding: 1.5rem;
    background: var(--lemaro-navy);
    color: #ffffff;
}

.home-hero__panel h2[b-jzq31ev9wv] {
    color: #ffffff;
    margin-bottom: 1.25rem;
    font-size: 1.1rem;
    letter-spacing: 0.02em;
}

.home-hero__panel-loading[b-jzq31ev9wv],
.home-hero__panel-error[b-jzq31ev9wv] {
    font-size: 0.95rem;
    opacity: 0.8;
    margin: 0;
}

.home-hero__panel-error[b-jzq31ev9wv] {
    color: #ffc0b3;
}

.home-hero__panel-stats[b-jzq31ev9wv] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 1rem;
}

.home-hero__panel-stats li[b-jzq31ev9wv] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.home-hero__panel-stat-value[b-jzq31ev9wv] {
    font-size: 1.85rem;
    font-weight: 900;
    color: #ffffff;
    line-height: 1;
}

.home-hero__panel-stat-label[b-jzq31ev9wv] {
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: rgba(255, 255, 255, 0.65);
    text-transform: uppercase;
}

/* ── KPI row ──────────────────────────────────────────────── */
.home-kpi-row[b-jzq31ev9wv] {
    margin-top: 1.5rem;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1rem;
}

.home-kpi-card[b-jzq31ev9wv] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.1rem 1.3rem;
    background: var(--lemaro-surface);
    border: 1px solid var(--lemaro-border);
    border-top: 3px solid var(--lemaro-navy);
    border-radius: 1rem;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06), 0 1px 2px rgba(15,23,42,0.04);
}

.home-kpi-card--review[b-jzq31ev9wv]   { border-top-color: #d97706; }
.home-kpi-card--report[b-jzq31ev9wv]   { border-top-color: #0369a1; }
.home-kpi-card--billing[b-jzq31ev9wv]  { border-top-color: #15803d; }
.home-kpi-card--final[b-jzq31ev9wv]    { border-top-color: #7c3aed; }

.home-kpi-card__icon[b-jzq31ev9wv] {
    font-size: 1.65rem;
    flex-shrink: 0;
    line-height: 1;
}

.home-kpi-card__body[b-jzq31ev9wv] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.home-kpi-card__label[b-jzq31ev9wv] {
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--lemaro-muted);
}

.home-kpi-card__value[b-jzq31ev9wv] {
    font-size: 2rem;
    font-weight: 900;
    line-height: 1;
    color: var(--lemaro-navy);
}

.home-kpi-card__sub[b-jzq31ev9wv] {
    font-size: 0.78rem;
    color: var(--lemaro-muted);
}

/* ── Certificate placeholder ──────────────────────────────── */
.home-certificates[b-jzq31ev9wv] {
    margin-top: 1.5rem;
    background: var(--lemaro-surface);
    border: 1px solid var(--lemaro-border);
    border-top: 3px solid var(--lemaro-navy);
    border-radius: 1rem;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06), 0 1px 2px rgba(15,23,42,0.04);
    overflow: hidden;
}

.home-certificates__header[b-jzq31ev9wv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem 0;
}

.home-certificates__title[b-jzq31ev9wv] {
    margin: 0.35rem 0 0;
    font-size: 1.25rem;
    color: var(--lemaro-navy);
}

.home-certificates__badge[b-jzq31ev9wv] {
    display: inline-flex;
    align-items: center;
    padding: 0.3rem 0.85rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    background: rgba(0, 51, 102, 0.07);
    color: var(--lemaro-navy);
    border: 1px solid rgba(0, 51, 102, 0.12);
}

.home-certificates__badge--link[b-jzq31ev9wv] {
    text-decoration: none;
    transition: background 100ms ease, color 100ms ease, border-color 100ms ease;
}

.home-certificates__badge--link:hover[b-jzq31ev9wv] {
    background: rgba(242, 129, 41, 0.09);
    color: var(--lemaro-orange);
    border-color: rgba(242, 129, 41, 0.22);
}

.home-certificates__content[b-jzq31ev9wv] {
    padding: 1.25rem 1.5rem 1.5rem;
}

.home-certificates__loading[b-jzq31ev9wv],
.home-certificates__error[b-jzq31ev9wv] {
    margin: 0;
    color: var(--lemaro-muted);
}

.home-certificates__error[b-jzq31ev9wv] {
    color: #B91C1C;
}

.home-certificates__empty[b-jzq31ev9wv] {
    border: 2px dashed var(--lemaro-border);
    border-radius: 1rem;
    padding: 1.75rem 1.5rem;
    display: grid;
    gap: 0.75rem;
    justify-items: start;
}

.home-certificates__empty-title[b-jzq31ev9wv] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--lemaro-navy);
}

.home-certificates__empty-copy[b-jzq31ev9wv] {
    margin: 0;
    color: var(--lemaro-muted);
    max-width: 60ch;
}

.home-certificates__customer-list[b-jzq31ev9wv] {
    display: grid;
    gap: 0.85rem;
}

.home-certificates__staff-table[b-jzq31ev9wv],
.home-certificates__staff-rows[b-jzq31ev9wv] {
    display: grid;
    gap: 0.75rem;
}

.home-certificates__staff-header[b-jzq31ev9wv],
.home-certificates__staff-row[b-jzq31ev9wv] {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.2fr) minmax(0, 1.2fr) minmax(8rem, 0.8fr) auto;
    gap: 1rem;
    align-items: center;
}

.home-certificates__staff-header[b-jzq31ev9wv] {
    padding: 0 0.25rem 0.35rem;
    border-bottom: 1px solid var(--lemaro-border);
}

.home-certificates__staff-header span[b-jzq31ev9wv] {
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--lemaro-muted);
}

.home-certificates__staff-row[b-jzq31ev9wv] {
    padding: 1rem 1.1rem;
    border: 1px solid var(--lemaro-border);
    border-radius: 0.85rem;
    background: #ffffff;
}

.home-certificates__staff-cell[b-jzq31ev9wv] {
    min-width: 0;
}

.home-certificates__staff-cell strong[b-jzq31ev9wv] {
    color: var(--lemaro-navy);
}

.home-certificates__staff-cell--status[b-jzq31ev9wv] {
    display: flex;
    justify-content: flex-end;
}

.home-certificates__customer-row[b-jzq31ev9wv] {
    display: grid;
    grid-template-columns: minmax(0, 1.8fr) minmax(9rem, 0.8fr) auto;
    gap: 1rem;
    align-items: center;
    padding: 1rem 1.1rem;
    border: 1px solid var(--lemaro-border);
    border-radius: 0.85rem;
    background: #ffffff;
}

.home-certificates__customer-main[b-jzq31ev9wv],
.home-certificates__customer-date[b-jzq31ev9wv] {
    display: grid;
    gap: 0.2rem;
}

.home-certificates__customer-main strong[b-jzq31ev9wv],
.home-certificates__customer-date strong[b-jzq31ev9wv] {
    color: var(--lemaro-navy);
}

.home-certificates__customer-main span[b-jzq31ev9wv],
.home-certificates__customer-date span[b-jzq31ev9wv] {
    color: var(--lemaro-muted);
    font-size: 0.84rem;
}

.home-certificates__customer-status-wrap[b-jzq31ev9wv] {
    display: flex;
    justify-content: flex-end;
}

.home-certificates__status[b-jzq31ev9wv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.9rem;
    padding: 0.22rem 0.7rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    white-space: nowrap;
}

.home-certificates__status--expired[b-jzq31ev9wv] {
    background: #FEF2F2;
    border: 1px solid #FECACA;
    color: #DC2626;
}

.home-certificates__status--expiring[b-jzq31ev9wv] {
    background: #FFFBEB;
    border: 1px solid #FDE68A;
    color: #D97706;
}

.home-certificates__status--valid[b-jzq31ev9wv] {
    background: #F0FDF4;
    border: 1px solid #A7F3D0;
    color: #15803D;
}

.home-certificates__status--none[b-jzq31ev9wv] {
    background: #F8FAFC;
    border: 1px solid #CBD5E1;
    color: #64748B;
}

.home-certificates__footer[b-jzq31ev9wv] {
    margin-top: 1rem;
    display: flex;
    justify-content: flex-start;
}

.home-certificates__placeholder[b-jzq31ev9wv] {
    padding: 1.25rem 1.5rem 1.5rem;
}

.home-certificates__placeholder-inner[b-jzq31ev9wv] {
    border: 2px dashed var(--lemaro-border);
    border-radius: 1rem;
    padding: 1.5rem;
}

.home-certificates__placeholder-icon[b-jzq31ev9wv] {
    font-size: 2rem;
    display: block;
    margin-bottom: 0.75rem;
}

.home-certificates__placeholder-text[b-jzq31ev9wv] {
    margin: 0 0 1.5rem;
    color: var(--lemaro-muted);
    max-width: 64ch;
    font-size: 0.95rem;
}

.home-certificates__placeholder-columns[b-jzq31ev9wv] {
    display: grid;
    grid-template-columns: 2fr 2fr 2fr 1fr 1fr;
    gap: 0.5rem 1rem;
}

.home-certificates__placeholder-col--header[b-jzq31ev9wv] {
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--lemaro-muted);
    padding-bottom: 0.4rem;
    border-bottom: 1px solid var(--lemaro-border);
}

.home-certificates__placeholder-col--skeleton[b-jzq31ev9wv] {
    height: 1.25rem;
    border-radius: 0.5rem;
    background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);
    background-size: 200% 100%;
    animation: home-shimmer-b-jzq31ev9wv 1.6s ease-in-out infinite;
}

.home-certificates__placeholder-col--status[b-jzq31ev9wv] {
    width: 70%;
}

@keyframes home-shimmer-b-jzq31ev9wv {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 1100px) {
    .home-kpi-row[b-jzq31ev9wv] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 940px) {
    .home-hero[b-jzq31ev9wv] {
        grid-template-columns: 1fr;
    }

    .home-kpi-row[b-jzq31ev9wv] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-certificates__placeholder-columns[b-jzq31ev9wv] {
        grid-template-columns: 2fr 2fr 1fr;
    }

    .home-certificates__staff-header[b-jzq31ev9wv] {
        display: none;
    }

    .home-certificates__staff-row[b-jzq31ev9wv] {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .home-certificates__staff-cell--status[b-jzq31ev9wv] {
        justify-content: flex-start;
    }

    .home-certificates__customer-row[b-jzq31ev9wv] {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .home-certificates__customer-status-wrap[b-jzq31ev9wv] {
        justify-content: flex-start;
    }
}

@media (max-width: 580px) {
    .home-kpi-row[b-jzq31ev9wv] {
        grid-template-columns: 1fr 1fr;
    }
}
/* /Components/Pages/Login.razor.rz.scp.css */
/* ============================================================
   LEMARO DASHBOARD — LOGIN PAGE
   Harmonized to match Customers.razor clean enterprise style.
   ============================================================ */

/* ── Achtergrond (alleen login-pagina) ── */
.login-bg[b-imbivilu38] {
    position: fixed;
    inset: 0;
    z-index: 0;
    background-image: url('/images/fireman-2021-08-27-09-22-33-utc-scaled-1.jpg');
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
}

.login-bg[b-imbivilu38]::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(8, 24, 50, 0.52);
}

.login-shell[b-imbivilu38] {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 4rem 1rem;
    min-height: calc(100vh - var(--header-height, 4rem));
}

.login-card__eyebrow[b-imbivilu38] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--lemaro-navy);
    margin-bottom: 0.25rem;
}

.login-card h2[b-imbivilu38] {
    margin: 0.25rem 0 0.5rem;
    color: var(--lemaro-navy);
    letter-spacing: -0.02em;
}

.login-card p[b-imbivilu38],
.login-card__hint[b-imbivilu38] {
    color: #64748B;
    font-size: 0.9rem;
    margin: 0;
}

.login-card[b-imbivilu38] {
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-top: 3px solid var(--lemaro-navy);
    border-radius: 1rem;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06), 0 4px 12px rgba(15,23,42,0.06);
    padding: 1.75rem;
    width: 100%;
    max-width: 26rem;
}

.login-form[b-imbivilu38] {
    display: grid;
    gap: 0.875rem;
    margin-top: 1rem;
}

.login-form__footer[b-imbivilu38] {
    display: flex;
    justify-content: flex-end;
}

.login-form__forgot[b-imbivilu38] {
    font-size: 0.82rem;
    color: var(--lemaro-navy);
    text-decoration: none;
    font-weight: 600;
    opacity: 0.8;
    transition: opacity 100ms ease;
}

.login-form__forgot:hover[b-imbivilu38] {
    opacity: 1;
    text-decoration: underline;
}

.login-form__field[b-imbivilu38] {
    display: grid;
    gap: 0.4rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748B;
}

.login-form__field input[b-imbivilu38] {
    min-height: 2.375rem;
    padding: 0.5rem 0.875rem;
    border-radius: 0.5rem;
    border: 1px solid #E2E8F0;
    background: #FFFFFF;
    color: #0F172A;
    font: inherit;
    font-size: 0.9rem;
    width: 100%;
    box-sizing: border-box;
    transition: border-color 120ms ease, box-shadow 120ms ease;
}

.login-form__field input:focus[b-imbivilu38] {
    outline: none;
    border-color: var(--lemaro-navy);
    box-shadow: 0 0 0 3px rgba(0, 51, 102, 0.12);
}

.login-form__submit[b-imbivilu38] {
    min-height: 2.375rem;
    padding: 0.5rem 0.875rem;
    border: 1px solid var(--lemaro-orange);
    border-radius: 0.5rem;
    background: var(--lemaro-orange);
    color: #ffffff;
    font-family: var(--lemaro-heading-font);
    font-size: 0.875rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 100ms ease, border-color 100ms ease;
}

.login-form__submit:hover[b-imbivilu38] {
    background: var(--lemaro-orange-hover);
    border-color: var(--lemaro-orange-hover);
}

.login-alert[b-imbivilu38] {
    padding: 0.85rem 1rem;
    border-radius: 0.5rem;
    border: 1px solid transparent;
    font-size: 0.9rem;
}

.login-alert--error[b-imbivilu38] {
    background: #FEF2F2;
    border-color: #FECACA;
    color: #DC2626;
}

.login-alert--warning[b-imbivilu38] {
    background: #FFFBEB;
    border-color: #FDE68A;
    color: #92400E;
}

.login-form__remember[b-imbivilu38] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: #64748B;
    cursor: pointer;
    user-select: none;
}

.login-form__remember input[type="checkbox"][b-imbivilu38] {
    width: 1rem;
    height: 1rem;
    accent-color: var(--lemaro-navy);
    cursor: pointer;
    flex-shrink: 0;
}

.login-card__hint[b-imbivilu38] {
    margin: 1rem 0 0;
    font-size: 0.85rem;
}


/* /Components/Pages/Planning.razor.rz.scp.css */
.planning-page[b-rdl2cif8su] {
    display: grid;
    gap: 1rem;
    --brand-navy:         #003366;
    --brand-orange:       #E65100;
    --brand-orange-hover: #CF4900;
    --brand-text-main:    #1E293B;
}

.planning-toolbar-actions[b-rdl2cif8su],
.planning-resource-filter-list[b-rdl2cif8su],
.planning-workflow-grid[b-rdl2cif8su],
.planning-workflow-summary__grid[b-rdl2cif8su] {
    display: grid;
}

.planning-panel__eyebrow[b-rdl2cif8su],
.planning-stat__label[b-rdl2cif8su] {
    display: inline-block;
    color: var(--lemaro-orange);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.planning-panel__copy[b-rdl2cif8su],
.planning-stat__copy[b-rdl2cif8su],
.planning-confirmation-copy[b-rdl2cif8su] {
    margin: 0;
    color: var(--lemaro-muted);
}

.planning-stat[b-rdl2cif8su],
.planning-panel[b-rdl2cif8su] {
    background: var(--lemaro-surface);
    border: 1px solid var(--lemaro-border);
    border-radius: 0.625rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 2px 8px rgba(0, 0, 0, 0.04);
}

.planning-stat[b-rdl2cif8su] {
    padding: 1.1rem 1.15rem;
    border-top: 3px solid var(--brand-navy);
}

.planning-stat__value[b-rdl2cif8su] {
    display: block;
    margin: 0.35rem 0 0.45rem;
    color: var(--brand-navy);
    font-family: var(--lemaro-heading-font);
    font-size: clamp(1.7rem, 3vw, 2.2rem);
}

.planning-panel[b-rdl2cif8su] {
    padding: 1.3rem;
}

.planning-panel--planner[b-rdl2cif8su] {
    display: grid;
    gap: 1rem;
}

.planning-calendar-body[b-rdl2cif8su] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.2rem;
    align-items: start;
    overflow: hidden;
}

.planning-planner__topbar[b-rdl2cif8su] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 1rem 1.5rem;
}

.planning-planner__title h1[b-rdl2cif8su] {
    margin: 0.35rem 0 0;
    color: var(--brand-navy);
    font-size: clamp(2rem, 3.4vw, 2.7rem);
    line-height: 1.05;
}

.planning-planner__actions[b-rdl2cif8su] {
    display: grid;
    grid-template-columns: minmax(15rem, 17.5rem) auto auto;
    align-items: end;
    justify-content: flex-end;
    gap: 0.8rem 1rem;
}

.planning-toolbar-actions[b-rdl2cif8su],
.planning-panel__actions[b-rdl2cif8su],
.planning-form__actions[b-rdl2cif8su] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
}

.planning-planner__jump-field[b-rdl2cif8su] {
    display: grid;
    gap: 0.35rem;
    min-width: 15rem;
    color: var(--brand-navy);
    font-size: 0.8rem;
    font-weight: 800;
}

.planning-planner__jump-field span[b-rdl2cif8su] {
    letter-spacing: 0.02em;
    line-height: 1.1;
}

.planning-input[b-rdl2cif8su] {
    width: 100%;
    min-height: 2.375rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--lemaro-border, rgba(30, 41, 59, 0.2));
    border-radius: 0.5rem;
    background: #ffffff;
    color: var(--brand-navy);
    font: inherit;
    font-size: 0.9rem;
    box-sizing: border-box;
    transition: border-color 120ms ease, box-shadow 120ms ease;
}

.planning-input:focus[b-rdl2cif8su] {
    outline: none;
    border-color: var(--lemaro-navy);
    box-shadow: 0 0 0 3px rgba(0, 51, 102, 0.12);
}

.planning-resource-filter-list[b-rdl2cif8su] {
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
    gap: 0.7rem;
}

.planning-resource-filter[b-rdl2cif8su] {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 2.95rem;
    padding: 0.82rem 0.95rem;
    border-radius: 0.5rem;
    border: 1px solid rgba(30, 41, 59, 0.2);
    background: #ffffff;
    color: var(--brand-navy);
    font-weight: 800;
}

.planning-resource-filter input[b-rdl2cif8su] {
    position: relative;
    width: 0.88rem;
    height: 0.88rem;
    margin: 0;
    appearance: none;
    border-radius: 0.2rem;
    border: 1px solid rgba(14, 79, 138, 0.28);
    background: #ffffff;
    flex-shrink: 0;
}

.planning-resource-filter input:checked[b-rdl2cif8su] {
    background: var(--brand-navy);
    border-color: var(--brand-navy);
}

.planning-resource-filter input:checked[b-rdl2cif8su]::after {
    content: "";
    position: absolute;
    left: 0.24rem;
    top: 0.08rem;
    width: 0.22rem;
    height: 0.42rem;
    border: solid #ffffff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.planning-resource-filter__swatch[b-rdl2cif8su] {
    width: 0.85rem;
    height: 0.85rem;
    border-radius: 999px;
}

.planning-resource-filter__meta[b-rdl2cif8su] {
    min-width: 0;
}

.planning-button[b-rdl2cif8su] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.8rem;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    padding: 0.7rem 1.12rem;
    background: var(--brand-orange);
    color: #ffffff;
    font-family: var(--lemaro-heading-font);
    font-size: 0.92rem;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.planning-button:hover:not(:disabled)[b-rdl2cif8su] {
    background: var(--brand-orange-hover);
    border-color: var(--brand-orange-hover);
}

.planning-button:disabled[b-rdl2cif8su] {
    opacity: 0.6;
    cursor: not-allowed;
    box-shadow: none;
}

.planning-button--secondary[b-rdl2cif8su] {
    background: var(--brand-navy);
    border-color: var(--brand-navy);
}

.planning-button--secondary:hover:not(:disabled)[b-rdl2cif8su] {
    background: #002855;
    border-color: #002855;
}

.planning-button--ghost[b-rdl2cif8su] {
    background: #ffffff;
    color: var(--brand-navy);
    border: 1px solid rgba(30, 41, 59, 0.2);
}

.planning-button--ghost:hover:not(:disabled)[b-rdl2cif8su] {
    background: var(--lemaro-surface);
    border-color: rgba(30, 41, 59, 0.35);
}

.planning-button--danger[b-rdl2cif8su] {
    background: #cb5230;
    border-color: #cb5230;
}

.planning-button--danger:hover:not(:disabled)[b-rdl2cif8su] {
    background: #a73a1f;
    border-color: #a73a1f;
}

.planning-alert[b-rdl2cif8su],
.planning-empty-state[b-rdl2cif8su],
.planning-validation[b-rdl2cif8su] {
    padding: 0.95rem 1rem;
    border-radius: 1rem;
    border: 1px solid transparent;
}

.planning-alert--success[b-rdl2cif8su] {
    background: rgba(22, 163, 74, 0.08);
    border-color: rgba(22, 163, 74, 0.22);
    color: #15622b;
}

.planning-alert--error[b-rdl2cif8su] {
    background: rgba(203, 82, 48, 0.08);
    border-color: rgba(203, 82, 48, 0.18);
    color: #8b2f1b;
}

.planning-alert--info[b-rdl2cif8su] {
    background: rgba(0, 51, 102, 0.06);
    border-color: rgba(0, 51, 102, 0.14);
    color: var(--brand-navy);
}

.planning-empty-state[b-rdl2cif8su],
.planning-validation[b-rdl2cif8su] {
    background: rgba(247, 249, 251, 0.8);
    border-color: rgba(14, 79, 138, 0.12);
    color: var(--lemaro-muted);
}

.planning-empty-state--compact[b-rdl2cif8su] {
    min-height: auto;
}

.planning-modal[b-rdl2cif8su] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    background: rgba(14, 32, 50, 0.48);
    backdrop-filter: blur(10px);
    z-index: 50;
}

.planning-modal__surface[b-rdl2cif8su] {
    width: min(72rem, 100%);
    max-height: calc(100vh - 3rem);
    overflow: auto;
    padding: 1.4rem;
    border-radius: 0.75rem;
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, 0.12);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.14);
}

.planning-modal__surface--confirm[b-rdl2cif8su] {
    width: min(32rem, 100%);
}

.planning-modal__header[b-rdl2cif8su] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1rem;
}

.planning-form[b-rdl2cif8su] {
    display: grid;
    gap: 1rem;
}

/* FluentGrid fills the form width */
.planning-form[b-rdl2cif8su]  fluent-grid {
    width: 100%;
}

/* Each FluentGridItem field fills its cell */
.planning-form[b-rdl2cif8su]  fluent-text-field.planning-fluent-field,
.planning-form[b-rdl2cif8su]  fluent-select.planning-fluent-field {
    width: 100%;
}

/* Datetime-local label + input inside FluentGridItem */
.planning-field[b-rdl2cif8su] {
    display: grid;
    gap: 0.4rem;
    color: var(--brand-navy);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.planning-datetime-input[b-rdl2cif8su] {
    width: 100%;
    min-height: 2.5rem;
    padding: 0.55rem 0.75rem;
    border: 1px solid var(--lemaro-border, rgba(30, 41, 59, 0.2));
    border-radius: 0.375rem;
    background: #ffffff;
    color: var(--brand-navy);
    font: inherit;
    font-size: 0.9rem;
    box-sizing: border-box;
}

.planning-datetime-input:focus[b-rdl2cif8su] {
    outline: 2px solid rgba(0, 51, 102, 0.18);
    border-color: rgba(0, 51, 102, 0.42);
}

/* Each FluentGridItem field fills its cell */
.planning-form[b-rdl2cif8su]  fluent-text-field.planning-fluent-field,
.planning-form[b-rdl2cif8su]  fluent-select.planning-fluent-field {
    width: 100%;
}

.planning-form[b-rdl2cif8su]  fluent-text-area.planning-fluent-textarea {
    width: 100%;
}

.planning-form[b-rdl2cif8su]  fluent-text-area.planning-fluent-textarea::part(control) {
    min-height: 7rem;
    resize: vertical;
}

/* FluentButton sizing in form actions */
.planning-form__actions[b-rdl2cif8su]  fluent-button::part(control) {
    min-height: 2.75rem;
    font-weight: 700;
    font-size: 0.92rem;
    border-radius: 0.5rem;
    padding-inline: 1.25rem;
}

.planning-workflow-panel[b-rdl2cif8su] {
    display: grid;
    gap: 0.8rem;
    padding: 1rem;
    border-radius: 0.625rem;
    background: var(--lemaro-surface);
    border: 1px solid rgba(30, 41, 59, 0.1);
}

.planning-workflow-panel__header h3[b-rdl2cif8su],
.planning-workflow-summary__header h3[b-rdl2cif8su] {
    margin: 0.3rem 0 0;
}

.planning-workflow-grid[b-rdl2cif8su] {
    grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
    gap: 0.8rem;
}

.planning-switch-card[b-rdl2cif8su] {
    display: grid;
    gap: 0.55rem;
    align-content: start;
    justify-items: start;
    padding: 0.9rem;
    border-radius: 0.5rem;
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, 0.12);
    min-height: 100%;
}

.planning-switch-card__label[b-rdl2cif8su] {
    color: #8d6850;
    font-size: 0.8rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.planning-switch[b-rdl2cif8su] {
    position: relative;
    display: inline-flex;
}

.planning-switch__input[b-rdl2cif8su] {
    position: absolute;
    inset: 0;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}

.planning-switch__track[b-rdl2cif8su] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 0.16rem;
    width: 4.35rem;
    min-height: 2rem;
    padding: 0.16rem;
    border-radius: 0.6rem;
    background: linear-gradient(180deg, #fee2e2, #fecaca);
    border: 1px solid rgba(220, 38, 38, 0.22);
    transition: background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.planning-switch__segment[b-rdl2cif8su] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.5rem;
    border-radius: 0.38rem;
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    transition: background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.planning-switch__segment--on[b-rdl2cif8su] {
    background: rgba(220, 252, 231, 0.96);
    color: #166534;
}

.planning-switch__segment--off[b-rdl2cif8su] {
    background: #dc2626;
    color: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.planning-switch__input:checked + .planning-switch__track[b-rdl2cif8su] {
    background: linear-gradient(180deg, #dcfce7, #bbf7d0);
    border-color: rgba(22, 163, 74, 0.28);
}

.planning-switch__input:checked + .planning-switch__track .planning-switch__segment--on[b-rdl2cif8su] {
    background: #16a34a;
    color: #ffffff;
    box-shadow: none;
}

.planning-switch__input:checked + .planning-switch__track .planning-switch__segment--off[b-rdl2cif8su] {
    background: rgba(254, 226, 226, 0.78);
    color: #b91c1c;
    box-shadow: none;
}

.planning-switch__input:focus-visible + .planning-switch__track[b-rdl2cif8su] {
    outline: 2px solid rgba(22, 163, 74, 0.24);
    outline-offset: 2px;
}

.planning-workflow-summary[b-rdl2cif8su] {
    display: grid;
    gap: 0.8rem;
    padding: 1rem;
    border-radius: 0.625rem;
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, 0.1);
    border-top: 3px solid var(--brand-navy);
}

.planning-workflow-summary__grid[b-rdl2cif8su] {
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    gap: 0.75rem;
}

.planning-workflow-summary__item[b-rdl2cif8su] {
    display: grid;
    gap: 0.22rem;
    padding: 0.9rem;
    border-radius: 0.5rem;
    background: #ffffff;
    border: 1px solid rgba(30, 41, 59, 0.08);
}

.planning-workflow-summary__item span[b-rdl2cif8su] {
    color: var(--lemaro-muted);
    font-size: 0.8rem;
}

.planning-workflow-summary__item strong[b-rdl2cif8su] {
    color: var(--brand-navy);
}

.planning-confirmation-copy strong[b-rdl2cif8su] {
    color: var(--brand-navy);
}

@media (max-width: 960px) {
    .planning-workflow-grid[b-rdl2cif8su],
    .planning-workflow-summary__grid[b-rdl2cif8su],
    .planning-resource-filter-list[b-rdl2cif8su] {
        grid-template-columns: 1fr;
    }

    .planning-planner__topbar[b-rdl2cif8su],
    .planning-modal__header[b-rdl2cif8su] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .planning-planner__actions[b-rdl2cif8su] {
        flex-direction: column;
        align-items: stretch;
    }

    .planning-planner__actions[b-rdl2cif8su],
    .planning-toolbar-actions[b-rdl2cif8su] {
        justify-content: flex-start;
    }

    .planning-planner__jump-field[b-rdl2cif8su] {
        min-width: 0;
    }

    /* Modal: full-height on small screens, scrollable inside */
    .planning-modal[b-rdl2cif8su] {
        align-items: flex-end;
        padding: 0;
    }

    .planning-modal__surface[b-rdl2cif8su] {
        width: 100%;
        max-height: 92dvh;
        border-radius: 1.25rem 1.25rem 0 0;
        padding: 1.25rem 1rem 1.5rem;
        -webkit-overflow-scrolling: touch;
    }

    .planning-modal__surface--confirm[b-rdl2cif8su] {
        width: 100%;
    }
}
/* /Components/Pages/Profile.razor.rz.scp.css */
.profile-page[b-jqskl5843e] {
    align-content: start;
}

.profile-grid[b-jqskl5843e] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
}

.profile-card[b-jqskl5843e] {
    padding: 1.5rem 1.75rem;
}

.profile-card__header[b-jqskl5843e] {
    display: grid;
    gap: 0.25rem;
    margin-bottom: 1.25rem;
}

.profile-card__header h2[b-jqskl5843e] {
    margin: 0;
    color: var(--lemaro-navy);
    font-size: 1.2rem;
}

.profile-list[b-jqskl5843e] {
    margin: 0;
    display: grid;
    gap: 1rem;
}

.profile-list__row[b-jqskl5843e] {
    display: grid;
    gap: 0.25rem;
    padding-bottom: 0.9rem;
    border-bottom: 1px solid #E2E8F0;
}

.profile-list__row:last-child[b-jqskl5843e] {
    padding-bottom: 0;
    border-bottom: none;
}

.profile-list__row dt[b-jqskl5843e] {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748B;
}

.profile-list__row dd[b-jqskl5843e] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #0F172A;
}

.profile-company[b-jqskl5843e] {
    display: grid;
    gap: 0.35rem;
    color: #334155;
}

.profile-company strong[b-jqskl5843e] {
    color: var(--lemaro-navy);
    font-size: 1.05rem;
}

.profile-company__meta[b-jqskl5843e] {
    margin-top: 0.5rem;
    display: inline-flex;
    width: fit-content;
    padding: 0.3rem 0.65rem;
    border-radius: 999px;
    background: #EFF6FF;
    color: #1D4ED8;
    font-size: 0.78rem;
    font-weight: 700;
}

.profile-card__empty[b-jqskl5843e] {
    margin: 0;
    color: #64748B;
    font-size: 0.95rem;
}

@media (max-width: 768px) {
    .profile-grid[b-jqskl5843e] {
        grid-template-columns: 1fr;
    }

    .profile-card[b-jqskl5843e] {
        padding: 1.25rem;
    }
}
/* /Components/Pages/Reports.razor.rz.scp.css */
.reports-page[b-wyz0wrmgbn] {
    --c-surface: #FFFFFF;
    --c-surface-2: #F8FAFC;
    --c-border: #E2E8F0;
    --c-border-strong: #CBD5E1;
    --c-ink: #0F172A;
    --c-muted: #64748B;
    --c-subtle: #94A3B8;
    --brand-navy: #003366;
    --brand-orange: #E65100;
    --brand-orange-hover: #CF4900;
    --c-success: #059669;
    --c-success-subtle: #F0FDF4;
    --c-success-border: #A7F3D0;
    --c-warning: #B45309;
    --c-warning-subtle: #FFFBEB;
    --c-warning-border: #FDE68A;
    --c-danger: #DC2626;
    --c-danger-subtle: #FEF2F2;
    --c-danger-border: #FECACA;
    --c-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
    --c-radius-sm: 0.5rem;
    --c-radius-md: 0.75rem;
    --c-radius-lg: 1rem;

    display: grid;
    gap: 1.25rem;
    padding-bottom: 1.5rem;
}

.reports-header[b-wyz0wrmgbn],
.reports-toolbar[b-wyz0wrmgbn],
.reports-list-panel[b-wyz0wrmgbn] {
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--c-radius-lg);
    box-shadow: var(--c-shadow-sm);
}

.reports-header[b-wyz0wrmgbn] {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 1.5rem 1.75rem;
    align-items: center;
}

.reports-header h1[b-wyz0wrmgbn],
.reports-empty-state h3[b-wyz0wrmgbn] {
    margin: 0;
    color: var(--brand-navy);
    font-weight: 700;
    letter-spacing: -0.02em;
}

.reports-header h1[b-wyz0wrmgbn] {
    font-size: clamp(1.5rem, 2.5vw, 2rem);
    line-height: 1.1;
    margin-top: 0.25rem;
}

.reports-header p[b-wyz0wrmgbn],
.reports-empty-state p[b-wyz0wrmgbn],
.reports-placeholder[b-wyz0wrmgbn] {
    margin: 0;
    color: var(--c-muted);
    font-size: 0.9rem;
    line-height: 1.5;
}

.reports-eyebrow[b-wyz0wrmgbn],
.reports-week-card span[b-wyz0wrmgbn],
.reports-toolbar__stats span[b-wyz0wrmgbn],
.reports-grid-row__date span[b-wyz0wrmgbn],
.reports-grid-row__inspector span[b-wyz0wrmgbn],
.reports-grid-row__status span:last-child[b-wyz0wrmgbn] {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--c-muted);
}

.reports-eyebrow[b-wyz0wrmgbn] {
    color: var(--brand-navy);
}

.reports-header__actions[b-wyz0wrmgbn] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.reports-week-card[b-wyz0wrmgbn] {
    display: grid;
    gap: 0.25rem;
    min-width: 11rem;
    padding: 0.875rem 1rem;
    border-radius: var(--c-radius-md);
    background: var(--c-surface-2);
    border: 1px solid var(--c-border);
}

.reports-week-card strong[b-wyz0wrmgbn],
.reports-toolbar__stats strong[b-wyz0wrmgbn],
.reports-grid-row__identity strong[b-wyz0wrmgbn],
.reports-grid-row__date strong[b-wyz0wrmgbn],
.reports-grid-row__inspector strong[b-wyz0wrmgbn] {
    color: var(--c-ink);
    font-weight: 700;
    letter-spacing: -0.02em;
}

.reports-week-card strong[b-wyz0wrmgbn] {
    font-size: 1rem;
}

.reports-toolbar[b-wyz0wrmgbn] {
    display: grid;
    gap: 0.75rem;
    padding: 0.875rem 1.25rem;
}

/* FluentGrid fills toolbar width */
.reports-toolbar[b-wyz0wrmgbn]  fluent-grid {
    width: 100%;
}

/* FluentUI text-field and select fill their grid cells */
.reports-toolbar[b-wyz0wrmgbn]  fluent-text-field.reports-fluent-search {
    width: 100%;
}

.reports-toolbar[b-wyz0wrmgbn]  fluent-select.reports-fluent-select {
    width: 100%;
}

/* Native date inputs inside FluentGridItem labels */
.reports-date[b-wyz0wrmgbn] {
    display: grid;
    gap: 0.35rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--c-muted);
}

.reports-date[b-wyz0wrmgbn]  .reports-input,
.reports-date .reports-input[b-wyz0wrmgbn] {
    width: 100%;
    box-sizing: border-box;
    min-height: 2.375rem;
    padding: 0.5rem 0.875rem;
    border: 1px solid var(--c-border);
    border-radius: var(--c-radius-sm);
    background: var(--c-surface);
    color: var(--c-ink);
    font: inherit;
    font-size: 0.9rem;
    -webkit-appearance: none;
    appearance: none;
}

/* Fluent button in toolbar */
.reports-toolbar[b-wyz0wrmgbn]  fluent-button.reports-fluent-action::part(control) {
    min-height: 2.375rem;
    font-size: 0.875rem;
    border-radius: var(--c-radius-sm);
    padding-inline: 0.875rem;
}

.reports-empty-state[b-wyz0wrmgbn]  fluent-button.reports-fluent-action::part(control) {
    min-height: 2.375rem;
    font-size: 0.875rem;
    border-radius: var(--c-radius-sm);
    padding-inline: 0.875rem;
}

.reports-search[b-wyz0wrmgbn]  .reports-input,
.reports-date[b-wyz0wrmgbn]  .reports-input,
.reports-inspector[b-wyz0wrmgbn]  .reports-select {
    width: 100%;
    box-sizing: border-box;
    min-height: 2.375rem;
    padding: 0.5rem 0.875rem;
    border: 1px solid var(--c-border);
    border-radius: var(--c-radius-sm);
    background: var(--c-surface);
    color: var(--c-ink);
    font: inherit;
    font-size: 0.9rem;
    transition: border-color 120ms ease, box-shadow 120ms ease;
    -webkit-appearance: none;
    appearance: none;
}

.reports-search[b-wyz0wrmgbn]  .reports-input::placeholder {
    color: var(--c-subtle);
}

.reports-search[b-wyz0wrmgbn]  .reports-input:focus,
.reports-date[b-wyz0wrmgbn]  .reports-input:focus,
.reports-inspector[b-wyz0wrmgbn]  .reports-select:focus {
    outline: none;
    border-color: var(--brand-navy);
    box-shadow: 0 0 0 3px rgba(0, 51, 102, 0.12);
}

.reports-inspector[b-wyz0wrmgbn]  .reports-select {
    padding-right: 2.25rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.625rem center;
    background-size: 1rem;
}

.reports-action[b-wyz0wrmgbn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 0.875rem;
    border-radius: var(--c-radius-sm);
    border: 1px solid var(--c-border);
    background: var(--c-surface);
    color: var(--c-ink);
    font-weight: 600;
    font-size: 0.875rem;
    cursor: pointer;
    white-space: nowrap;
    transition: background 100ms ease, border-color 100ms ease;
}

.reports-action:hover[b-wyz0wrmgbn] {
    background: var(--c-surface-2);
    border-color: var(--c-border-strong);
}

.reports-action:disabled[b-wyz0wrmgbn] {
    opacity: 0.45;
    cursor: not-allowed;
    pointer-events: none;
}

.reports-toolbar__stats[b-wyz0wrmgbn] {
    display: flex;
    gap: 1.25rem;
    margin-left: auto;
    padding-left: 0.875rem;
    border-left: 1px solid var(--c-border);
}

.reports-toolbar__stats article[b-wyz0wrmgbn] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    text-align: left;
    background: var(--c-surface);
    border-radius: var(--c-radius-sm);
    padding: 0.625rem 0.875rem;
    box-shadow: var(--c-shadow-sm);
    border-top: 3px solid var(--brand-navy);
    min-width: 5rem;
}

.reports-toolbar__stats strong[b-wyz0wrmgbn] {
    font-size: 1.2rem;
    line-height: 1.2;
}

.reports-alert[b-wyz0wrmgbn] {
    padding: 0.75rem 1rem;
    border: 1px solid var(--c-danger-border);
    border-radius: var(--c-radius-md);
    color: var(--c-danger);
    background: var(--c-danger-subtle);
    font-size: 0.9rem;
    font-weight: 500;
}

.reports-list-panel[b-wyz0wrmgbn] {
    display: grid;
    gap: 1rem;
    padding: 1.25rem;
}

.reports-placeholder[b-wyz0wrmgbn] {
    padding: 0.5rem 0;
}

.reports-empty-state[b-wyz0wrmgbn] {
    display: grid;
    gap: 0.5rem;
    place-items: start;
    padding: 1.25rem;
    border-radius: var(--c-radius-md);
    background: var(--c-surface-2);
    border: 1px dashed var(--c-border-strong);
}

.reports-grid-header[b-wyz0wrmgbn] {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 2.2fr) minmax(8rem, 0.9fr) minmax(10rem, 1fr) minmax(10rem, 0.9fr);
    padding: 0 1rem;
    color: var(--c-muted);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.reports-grid-list[b-wyz0wrmgbn] {
    display: grid;
    gap: 0.625rem;
}

.reports-grid-row[b-wyz0wrmgbn] {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 2.2fr) minmax(8rem, 0.9fr) minmax(10rem, 1fr) minmax(10rem, 0.9fr);
    align-items: center;
    padding: 0.95rem 1rem;
    border: 1px solid var(--c-border);
    border-radius: var(--c-radius-md);
    background: var(--c-surface);
    transition: background 120ms ease, border-color 120ms ease;
}

.reports-grid-row:hover[b-wyz0wrmgbn] {
    background: var(--c-surface-2);
    border-color: var(--c-border-strong);
}

.reports-grid-row__identity[b-wyz0wrmgbn],
.reports-grid-row__date[b-wyz0wrmgbn],
.reports-grid-row__inspector[b-wyz0wrmgbn],
.reports-grid-row__status[b-wyz0wrmgbn] {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

.reports-grid-row__subline[b-wyz0wrmgbn] {
    color: var(--c-muted);
    font-size: 0.82rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.reports-grid-row__identity strong[b-wyz0wrmgbn],
.reports-grid-row__inspector strong[b-wyz0wrmgbn],
.reports-grid-row__date strong[b-wyz0wrmgbn] {
    font-size: 0.95rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.reports-badge[b-wyz0wrmgbn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    white-space: nowrap;
    border: 1px solid;
}

.reports-badge--ready[b-wyz0wrmgbn] {
    color: var(--c-success);
    background: var(--c-success-subtle);
    border-color: var(--c-success-border);
}

.reports-badge--pending[b-wyz0wrmgbn] {
    color: var(--c-warning);
    background: var(--c-warning-subtle);
    border-color: var(--c-warning-border);
}

@media (max-width: 1180px) {
    .reports-toolbar__stats[b-wyz0wrmgbn] {
        order: -1;
        margin-left: 0;
        padding-left: 0;
        border-left: none;
        border-bottom: 1px solid var(--c-border);
        padding-bottom: 0.625rem;
        width: 100%;
        gap: 1rem;
    }

    .reports-grid-header[b-wyz0wrmgbn],
    .reports-grid-row[b-wyz0wrmgbn] {
        grid-template-columns: 1.5fr 1fr;
    }
}

@media (max-width: 760px) {
    .reports-header[b-wyz0wrmgbn],
    .reports-toolbar[b-wyz0wrmgbn],
    .reports-list-panel[b-wyz0wrmgbn] {
        padding: 1rem;
    }

    .reports-header[b-wyz0wrmgbn] {
        grid-template-columns: 1fr;
    }

    .reports-header__actions[b-wyz0wrmgbn] {
        justify-content: stretch;
    }

    .reports-week-card[b-wyz0wrmgbn] {
        min-width: 0;
    }

    .reports-toolbar[b-wyz0wrmgbn] {
        flex-direction: column;
        align-items: stretch;
    }

    .reports-search[b-wyz0wrmgbn],
    .reports-date[b-wyz0wrmgbn],
    .reports-inspector[b-wyz0wrmgbn] {
        min-width: 0;
    }

    .reports-grid-header[b-wyz0wrmgbn] {
        display: none;
    }

    .reports-grid-row[b-wyz0wrmgbn] {
        grid-template-columns: 1fr;
    }
}

/* ─── Inspection overview: 9-column grid ──────────────────────────────────── */

.reports-grid-header--inspection[b-wyz0wrmgbn] {
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.5fr) minmax(7rem, 0.8fr) minmax(8rem, 1fr) minmax(6rem, 0.75fr) repeat(4, minmax(4.5rem, 0.6fr));
    align-items: center;
}

.reports-grid-row--inspection[b-wyz0wrmgbn] {
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.5fr) minmax(7rem, 0.8fr) minmax(8rem, 1fr) minmax(6rem, 0.75fr) repeat(4, minmax(4.5rem, 0.6fr));
}

.reports-grid-row__location[b-wyz0wrmgbn],
.reports-grid-row__type[b-wyz0wrmgbn] {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

.reports-grid-row__location span[b-wyz0wrmgbn],
.reports-grid-row__type span[b-wyz0wrmgbn] {
    font-size: 0.9rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: var(--c-ink);
}

.reports-grid-row__flag[b-wyz0wrmgbn] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.reports-flag[b-wyz0wrmgbn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    font-size: 0.85rem;
    font-weight: 700;
    border: 1.5px solid;
}

.reports-flag--done[b-wyz0wrmgbn] {
    color: var(--c-success);
    background: var(--c-success-subtle);
    border-color: var(--c-success-border);
}

.reports-flag--open[b-wyz0wrmgbn] {
    color: var(--c-muted);
    background: var(--c-surface-2);
    border-color: var(--c-border);
}

/* Sortable column headers */
.reports-sort-header[b-wyz0wrmgbn] {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--c-muted);
    padding: 0;
    text-align: left;
    white-space: nowrap;
    transition: color 100ms ease;
}

.reports-sort-header:hover[b-wyz0wrmgbn] {
    color: var(--brand-navy);
}

.reports-sort-header--active[b-wyz0wrmgbn] {
    color: var(--brand-navy);
}

/* Pagination controls */
.reports-pagination[b-wyz0wrmgbn] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0.5rem 0;
    border-top: 1px solid var(--c-border);
    flex-wrap: wrap;
}

.reports-pagination__info[b-wyz0wrmgbn] {
    font-size: 0.82rem;
    color: var(--c-muted);
    flex: 1;
    text-align: center;
}

.reports-toolbar[b-wyz0wrmgbn]  fluent-select.reports-pagesize-select {
    min-width: 7rem;
}

@media (max-width: 1180px) {
    .reports-grid-header--inspection[b-wyz0wrmgbn],
    .reports-grid-row--inspection[b-wyz0wrmgbn] {
        grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.5fr) minmax(6rem, 0.7fr) repeat(4, minmax(3.5rem, 0.5fr));
    }
}

@media (max-width: 760px) {
    .reports-grid-header--inspection[b-wyz0wrmgbn] {
        display: none;
    }

    .reports-grid-row--inspection[b-wyz0wrmgbn] {
        grid-template-columns: 1fr 1fr;
    }
}
/* /Components/Pages/ResetPassword.razor.rz.scp.css */
/* ============================================================
   LEMARO DASHBOARD — RESET PASSWORD PAGE
   Aligned with Login.razor aesthetic.
   ============================================================ */

.reset-password-shell[b-1igxdelly5] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 3rem 1rem;
    min-height: 60vh;
}

.reset-password-card[b-1igxdelly5] {
    width: 100%;
    max-width: 28rem;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-top: 3px solid var(--lemaro-navy);
    border-radius: 1rem;
    padding: 2rem 2rem 2.25rem;
    box-shadow: 0 4px 12px rgba(15,23,42,0.08), 0 2px 4px rgba(15,23,42,0.04);
    display: grid;
    gap: 1rem;
}

.reset-password-eyebrow[b-1igxdelly5] {
    display: inline-flex;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--lemaro-navy);
}

.reset-password-card h1[b-1igxdelly5] {
    margin: 0;
    font-size: 1.4rem;
    color: var(--lemaro-navy);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.reset-password-intro[b-1igxdelly5] {
    margin: 0;
    color: #64748B;
    font-size: 0.9rem;
}

.reset-password-form[b-1igxdelly5] {
    display: grid;
    gap: 1rem;
}

.reset-password-field[b-1igxdelly5] {
    display: grid;
    gap: 0.35rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748B;
}

.reset-password-input[b-1igxdelly5] {
    width: 100%;
    box-sizing: border-box;
    min-height: 2.5rem;
    padding: 0.5rem 0.875rem;
    border: 1px solid #E2E8F0;
    border-radius: 0.5rem;
    background: #FFFFFF;
    color: #0F172A;
    font: inherit;
    font-size: 0.9rem;
    transition: border-color 120ms ease, box-shadow 120ms ease;
}

.reset-password-input:focus[b-1igxdelly5] {
    outline: none;
    border-color: var(--lemaro-navy);
    box-shadow: 0 0 0 3px rgba(0, 51, 102, 0.12);
}

/* FluentUI overrides */
.reset-password-form[b-1igxdelly5]  fluent-grid {
    width: 100%;
}

.reset-password-form[b-1igxdelly5]  fluent-text-field.reset-fluent-field {
    width: 100%;
}

.reset-password-form[b-1igxdelly5]  fluent-button.reset-fluent-submit::part(control) {
    width: 100%;
    min-height: 2.625rem;
    font-size: 0.9rem;
    font-weight: 600;
    border-radius: 0.5rem;
}

.reset-password-submit[b-1igxdelly5] {
    width: 100%;
    min-height: 2.625rem;
    padding: 0.6rem 1rem;
    border: none;
    border-radius: 0.5rem;
    background: var(--lemaro-navy);
    color: #ffffff;
    font-family: var(--lemaro-heading-font);
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 100ms ease;
}

.reset-password-submit:hover[b-1igxdelly5] { background: #002244; }
.reset-password-submit:disabled[b-1igxdelly5] { opacity: 0.5; cursor: not-allowed; }

/* ── Footer / back-link ── */
.reset-password-footer[b-1igxdelly5] {
    display: flex;
    justify-content: center;
}

.reset-password-back[b-1igxdelly5] {
    font-size: 0.85rem;
    color: var(--lemaro-navy);
    text-decoration: none;
    font-weight: 600;
}

.reset-password-back:hover[b-1igxdelly5] {
    text-decoration: underline;
}

.reset-password-alert[b-1igxdelly5],
.reset-password-validation[b-1igxdelly5] {
    padding: 0.85rem 1rem;
    border-radius: 0.5rem;
    border: 1px solid transparent;
    font-size: 0.9rem;
}

.reset-password-alert--success[b-1igxdelly5] { background: #F0FDF4; border-color: #A7F3D0; color: #059669; }
.reset-password-alert--error[b-1igxdelly5],
.reset-password-validation[b-1igxdelly5]    { background: #FEF2F2; border-color: #FECACA; color: #DC2626; }

.reset-password-link[b-1igxdelly5] {
    color: var(--lemaro-navy);
    font-weight: 700;
    text-decoration: underline;
}
/* /Components/Pages/SelectCustomer.razor.rz.scp.css */
/* ── Company Selection Page ──────────────────────────────────────────── */

.company-select[b-rbnusmqow0] {
    max-width: 680px;
    margin: 0 auto;
    padding: 2.5rem 1.5rem;
}

/* Intro block */
.company-select__intro[b-rbnusmqow0] {
    margin-bottom: 2rem;
}

.company-select__eyebrow[b-rbnusmqow0] {
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--lemaro-orange);
    margin-bottom: 0.4rem;
}

.company-select__heading[b-rbnusmqow0] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--brand-navy);
    margin: 0 0 0.5rem;
}

.company-select__lead[b-rbnusmqow0] {
    color: var(--c-text-muted, #6b7280);
    margin: 0;
}

/* Loading / empty */
.company-select__loading[b-rbnusmqow0],
.company-select__empty[b-rbnusmqow0] {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--c-text-muted, #6b7280);
}

.company-select__back-link[b-rbnusmqow0] {
    display: inline-block;
    margin-top: 1rem;
    color: var(--lemaro-orange);
    font-weight: 600;
    text-decoration: none;
}

.company-select__back-link:hover[b-rbnusmqow0] {
    text-decoration: underline;
}

/* Card list */
.company-select__list[b-rbnusmqow0] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

/* Individual company card */
.company-card[b-rbnusmqow0] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    width: 100%;
    padding: 1.25rem 1.5rem;
    background: #fff;
    border: 1px solid var(--c-border, #e5e7eb);
    border-radius: 0.75rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    cursor: pointer;
    text-align: left;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.1s ease;
}

.company-card:hover[b-rbnusmqow0] {
    border-color: var(--brand-navy);
    box-shadow: 0 4px 16px rgba(0, 40, 86, 0.12);
    transform: translateY(-1px);
}

.company-card:focus-visible[b-rbnusmqow0] {
    outline: 2px solid var(--lemaro-orange);
    outline-offset: 2px;
}

/* Logo area — initials fallback */
.company-card__logo-area[b-rbnusmqow0] {
    flex-shrink: 0;
    width: 3rem;
    height: 3rem;
    border-radius: 0.5rem;
    background: var(--brand-navy);
    display: flex;
    align-items: center;
    justify-content: center;
}

.company-card__logo-placeholder[b-rbnusmqow0] {
    font-size: 1rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.02em;
}

/* Body text */
.company-card__body[b-rbnusmqow0] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.company-card__name[b-rbnusmqow0] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--brand-navy);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.company-card__address[b-rbnusmqow0] {
    font-size: 0.8125rem;
    color: var(--c-text-muted, #6b7280);
}

/* Chevron */
.company-card__arrow[b-rbnusmqow0] {
    flex-shrink: 0;
    font-size: 1.5rem;
    color: var(--c-text-muted, #9ca3af);
    transition: color 0.15s ease, transform 0.15s ease;
}

.company-card:hover .company-card__arrow[b-rbnusmqow0] {
    color: var(--lemaro-orange);
    transform: translateX(3px);
}
/* /Components/Pages/UserForm.razor.rz.scp.css */
/* ============================================================
   LEMARO DASHBOARD — USER FORM PAGE
   Aanmaken en bewerken van een dashboardgebruiker.
   Routes: /beheer/gebruikers/nieuw
           /beheer/gebruikers/{id}/bewerken
   ============================================================ */

.userform-page[b-uy2zhshqck] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.25rem;
    padding: 3rem 1rem 4rem;
}

/* ── Header ────────────────────────────────────────────────── */
.userform-header[b-uy2zhshqck] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    width: 100%;
    max-width: 600px;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 1rem;
    padding: 1.5rem 1.75rem;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06), 0 1px 2px rgba(15,23,42,0.04);
}

.userform-header__copy[b-uy2zhshqck] {
    min-width: 0;
}

.userform-header h1[b-uy2zhshqck] {
    margin: 0.25rem 0 0.4rem;
    font-size: clamp(1.3rem, 2.5vw, 1.75rem);
    color: var(--lemaro-navy);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.15;
}

.userform-header p[b-uy2zhshqck] {
    margin: 0;
    color: #64748B;
    font-size: 0.9rem;
}

/* ── Eyebrow label ─────────────────────────────────────────── */
.userform-eyebrow[b-uy2zhshqck] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--lemaro-navy);
}

/* ── Content panel ─────────────────────────────────────────── */
.userform-panel[b-uy2zhshqck] {
    width: 100%;
    max-width: 600px;
    padding: 2.5rem;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-top: 3px solid var(--lemaro-navy);
    border-radius: 1rem;
    box-shadow: 0 4px 20px rgba(15,23,42,0.10), 0 1px 4px rgba(15,23,42,0.06);
}

/* ── Form ──────────────────────────────────────────────────── */
.userform-form[b-uy2zhshqck] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.userform-form[b-uy2zhshqck]  fluent-grid {
    width: 100%;
}

.userform-form[b-uy2zhshqck]  fluent-text-field.userform-fluent-field {
    width: 100%;
}

.userform-form[b-uy2zhshqck]  fluent-button::part(control) {
    min-height: 2.375rem;
    font-weight: 700;
    border-radius: 0.5rem;
    padding-inline: 1.125rem;
}

/* ── Status / toggle sections ──────────────────────────────── */
.userform-section[b-uy2zhshqck] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    border-radius: 0.5rem;
    border: 1px solid #E2E8F0;
    background: #F8FAFC;
}

.userform-section--row[b-uy2zhshqck] {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.userform-section__copy[b-uy2zhshqck] {
    display: grid;
    gap: 0.15rem;
    min-width: 0;
}

.userform-section__copy p[b-uy2zhshqck] {
    margin: 0;
    color: #64748B;
    font-size: 0.875rem;
}

.userform-field-hint[b-uy2zhshqck] {
    margin-top: 0.3rem !important;
    font-size: 0.8rem !important;
    color: #94A3B8 !important;
    line-height: 1.4;
}

.userform-section__label[b-uy2zhshqck] {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--lemaro-navy);
}

/* ── Toggle switch ─────────────────────────────────────────── */
.userform-switch[b-uy2zhshqck] {
    position: relative;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

.userform-switch__input[b-uy2zhshqck] {
    position: absolute;
    inset: 0;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}

.userform-switch__track[b-uy2zhshqck] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 0.15rem;
    width: 4.5rem;
    min-height: 2rem;
    padding: 0.15rem;
    border-radius: 0.5rem;
    background: #CBD5E1;
    border: 1px solid #94A3B8;
    transition: background 0.18s ease, border-color 0.18s ease;
}

.userform-switch__segment[b-uy2zhshqck] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.5rem;
    border-radius: 0.35rem;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
}

.userform-switch__segment--on[b-uy2zhshqck]  { background: rgba(100,116,139,0.5); color: #ffffff; }
.userform-switch__segment--off[b-uy2zhshqck] { background: #ffffff; color: #64748B; box-shadow: 0 1px 3px rgba(0,0,0,0.08); }

.userform-switch__input:checked + .userform-switch__track[b-uy2zhshqck] {
    background: #059669;
    border-color: #047857;
}

.userform-switch__input:checked + .userform-switch__track .userform-switch__segment--on[b-uy2zhshqck] {
    background: rgba(255,255,255,0.25);
    color: #ffffff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.userform-switch__input:checked + .userform-switch__track .userform-switch__segment--off[b-uy2zhshqck] {
    background: transparent;
    color: rgba(255,255,255,0.7);
    box-shadow: none;
}

.userform-switch__input:focus-visible + .userform-switch__track[b-uy2zhshqck] {
    outline: 2px solid var(--lemaro-navy);
    outline-offset: 2px;
}

/* ── Roles ─────────────────────────────────────────────────── */
.userform-roles[b-uy2zhshqck] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    border-radius: 0.5rem;
    border: 1px solid #E2E8F0;
    background: #F8FAFC;
    margin: 0.5rem 0 0;
}

.userform-roles__legend[b-uy2zhshqck] {
    display: block;
    padding: 0;
    color: var(--lemaro-navy);
    font-weight: 700;
    font-size: 0.875rem;
}

.userform-roles__hint[b-uy2zhshqck] {
    margin: 0;
    color: #64748B;
    font-size: 0.85rem;
}

.userform-roles__grid[b-uy2zhshqck] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
}

.userform-role-option[b-uy2zhshqck] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    width: 100%;
    min-height: 2.5rem;
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
    border: 1px solid #E2E8F0;
    background: #FFFFFF;
    color: #1E293B;
    cursor: pointer;
    transition: border-color 120ms ease, background 120ms ease;
}

.userform-role-option:hover[b-uy2zhshqck] { border-color: #CBD5E1; background: #F8FAFC; }

.userform-role-option--selected[b-uy2zhshqck] {
    border-color: var(--lemaro-navy);
    background: rgba(0, 51, 102, 0.04);
}

.userform-role-option__input[b-uy2zhshqck] {
    position: absolute;
    inset: 0;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}

.userform-role-option__indicator[b-uy2zhshqck] {
    position: relative;
    width: 1rem;
    height: 1rem;
    border-radius: 0.25rem;
    border: 1px solid #CBD5E1;
    background: #FFFFFF;
    flex-shrink: 0;
}

.userform-role-option--selected .userform-role-option__indicator[b-uy2zhshqck] {
    background: var(--lemaro-navy);
    border-color: var(--lemaro-navy);
}

.userform-role-option--selected .userform-role-option__indicator[b-uy2zhshqck]::after {
    content: "";
    position: absolute;
    left: 0.28rem;
    top: 0.08rem;
    width: 0.22rem;
    height: 0.45rem;
    border: solid #ffffff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.userform-role-option__label[b-uy2zhshqck] {
    color: var(--lemaro-navy);
    font-weight: 600;
    font-size: 0.85rem;
}

/* ── Action row ────────────────────────────────────────────── */
.userform-actions[b-uy2zhshqck] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
    justify-content: flex-end;
    padding-top: 0.5rem;
    border-top: 1px solid #E2E8F0;
    margin-top: 0.5rem;
}

.userform-btn--danger[b-uy2zhshqck]  fluent-button::part(control) {
    color: #DC2626;
}

/* ── Alerts & validation ───────────────────────────────────── */
.userform-alert[b-uy2zhshqck],
.userform-validation[b-uy2zhshqck] {
    width: 100%;
    max-width: 600px;
    padding: 0.85rem 1rem;
    border-radius: 0.5rem;
    border: 1px solid transparent;
    font-size: 0.9rem;
}

.userform-alert--success[b-uy2zhshqck] { background: #F0FDF4; border-color: #A7F3D0; color: #059669; }

.userform-alert--error[b-uy2zhshqck],
.userform-validation[b-uy2zhshqck] { background: #FEF2F2; border-color: #FECACA; color: #DC2626; }

/* ── Placeholder ───────────────────────────────────────────── */
.userform-placeholder[b-uy2zhshqck] {
    width: 100%;
    max-width: 600px;
    color: #64748B;
    font-size: 0.9rem;
    margin: 0;
}

/* ── Delete confirmation overlay ───────────────────────────── */
.userform-confirm-overlay[b-uy2zhshqck] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.userform-confirm-dialog[b-uy2zhshqck] {
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 1rem;
    padding: 2rem;
    max-width: 28rem;
    width: calc(100% - 2rem);
    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.25);
    display: grid;
    gap: 1.25rem;
}

.userform-confirm-dialog__title[b-uy2zhshqck] {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--lemaro-navy);
    letter-spacing: -0.02em;
}

.userform-confirm-dialog__body[b-uy2zhshqck] {
    margin: 0;
    font-size: 0.9rem;
    color: #334155;
    line-height: 1.5;
}

.userform-confirm-dialog__actions[b-uy2zhshqck] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

/* ── Responsive ────────────────────────────────────────────── */
@media (max-width: 900px) {
    .userform-header[b-uy2zhshqck] { grid-template-columns: 1fr; }
    .userform-section--row[b-uy2zhshqck] { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 580px) {
    .userform-roles__grid[b-uy2zhshqck] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Users.razor.rz.scp.css */
/* ============================================================
   LEMARO DASHBOARD — USERS PAGE
   Full-width data grid with search, pagination, and KPI cards.
   ============================================================ */

.users-page[b-8y7t0pz8ku] {
    display: grid;
    gap: 1.25rem;
    padding-bottom: 1.5rem;
}

/* ── Page header ───────────────────────────────────────────── */
.users-header[b-8y7t0pz8ku] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 1rem;
    padding: 1.5rem 1.75rem;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06), 0 1px 2px rgba(15,23,42,0.04);
}

.users-header__copy[b-8y7t0pz8ku] {
    min-width: 0;
}

.users-header h1[b-8y7t0pz8ku] {
    margin: 0.25rem 0 0.4rem;
    font-size: clamp(1.4rem, 2.5vw, 1.9rem);
    color: var(--lemaro-navy);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.15;
}

.users-header p[b-8y7t0pz8ku] {
    margin: 0;
    color: #64748B;
    font-size: 0.9rem;
    max-width: 80ch;
}

.users-header[b-8y7t0pz8ku]  fluent-button::part(control) {
    min-height: 2.375rem;
    font-weight: 700;
    border-radius: 0.5rem;
    padding-inline: 1.125rem;
}

/* ── Eyebrow label ─────────────────────────────────────────── */
.users-eyebrow[b-8y7t0pz8ku] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--lemaro-navy);
}

/* ── KPI row ───────────────────────────────────────────────── */
.users-kpi-row[b-8y7t0pz8ku] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.users-kpi[b-8y7t0pz8ku] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding: 1.125rem 1.25rem 1rem;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-top: 3px solid var(--lemaro-navy);
    border-radius: 1rem;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06), 0 1px 2px rgba(15,23,42,0.04);
}

.users-kpi--accent[b-8y7t0pz8ku] {
    border-top-color: #059669;
}

.users-kpi__label[b-8y7t0pz8ku] {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748B;
}

.users-kpi__value[b-8y7t0pz8ku] {
    font-size: 2rem;
    font-weight: 700;
    color: #0F172A;
    line-height: 1.1;
    letter-spacing: -0.03em;
    font-family: var(--lemaro-heading-font);
}

/* ── Main panel ────────────────────────────────────────────── */
.users-panel[b-8y7t0pz8ku] {
    width: 100%;
    padding: 1.5rem 1.75rem;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-top: 3px solid var(--lemaro-navy);
    border-radius: 1rem;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06), 0 1px 2px rgba(15,23,42,0.04);
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.users-panel__header[b-8y7t0pz8ku] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.8rem;
}

.users-panel__header h2[b-8y7t0pz8ku] {
    margin: 0.2rem 0 0;
    color: var(--lemaro-navy);
    font-weight: 700;
    letter-spacing: -0.02em;
    font-size: 1.05rem;
}

/* ── Search toolbar ────────────────────────────────────────── */
.users-search-toolbar[b-8y7t0pz8ku] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0;
}

.users-search-toolbar[b-8y7t0pz8ku]  fluent-text-field.users-search-field {
    width: 100%;
    max-width: 400px;
}

/* ── Data grid container ───────────────────────────────────── */
.users-grid-container[b-8y7t0pz8ku] {
    width: 100%;
    border: 1px solid #E2E8F0;
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(15,23,42,0.05);
}

/* Header cells: generous vertical padding, uppercase label */
.users-grid-container[b-8y7t0pz8ku]  fluent-data-grid-cell[cell-type="columnheader"] {
    padding: 0.9rem 1.25rem;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748B;
    background: #F8FAFC;
    border-bottom: 1px solid #E2E8F0;
}

/* Body cells: comfortable vertical padding */
.users-grid-container[b-8y7t0pz8ku]  fluent-data-grid-cell:not([cell-type="columnheader"]) {
    padding: 0.85rem 1.25rem;
    font-size: 0.875rem;
    align-items: center;
}

/* Clickable rows */
.users-grid-container[b-8y7t0pz8ku]  fluent-data-grid-row[row-type="default"] {
    cursor: pointer;
    transition: background 100ms ease;
}

/* Zebra striping — very subtle */
.users-grid-container[b-8y7t0pz8ku]  fluent-data-grid-row[row-type="default"]:nth-child(even) {
    background-color: #FAFBFC;
}

.users-grid-container[b-8y7t0pz8ku]  fluent-data-grid-row[row-type="default"]:nth-child(odd) {
    background-color: #FFFFFF;
}

/* Hover */
.users-grid-container[b-8y7t0pz8ku]  fluent-data-grid-row[row-type="default"]:hover {
    background-color: #F1F5F9 !important;
}

/* Selected row */
.users-grid-container[b-8y7t0pz8ku]  fluent-data-grid-row.users-row--selected {
    background-color: rgba(0, 51, 102, 0.05) !important;
    border-left: 3px solid var(--lemaro-navy);
}

/* ── Cell content helpers ──────────────────────────────────── */
.users-cell-name[b-8y7t0pz8ku] {
    display: grid;
    gap: 0.15rem;
    min-width: 0;
}

.users-cell-name__display[b-8y7t0pz8ku] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--lemaro-navy);
    font-weight: 700;
    font-size: 0.875rem;
}

.users-cell-name__email[b-8y7t0pz8ku] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #64748B;
    font-size: 0.8rem;
}

.users-cell-meta[b-8y7t0pz8ku] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    align-items: center;
}

/* ── Paginator ─────────────────────────────────────────────── */
.users-paginator-row[b-8y7t0pz8ku] {
    display: flex;
    justify-content: flex-end;
    margin-top: 0.25rem;
}

/* ── Placeholder ───────────────────────────────────────────── */
.users-placeholder[b-8y7t0pz8ku] {
    color: #64748B;
    font-size: 0.9rem;
    margin: 0;
}

/* ── Badges ────────────────────────────────────────────────── */
.users-badge[b-8y7t0pz8ku] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.users-badge--active[b-8y7t0pz8ku]    { background: #F0FDF4; color: #059669; border: 1px solid #A7F3D0; }
.users-badge--inactive[b-8y7t0pz8ku]  { background: #F8FAFC; color: #64748B; border: 1px solid #E2E8F0; }
.users-badge--role[b-8y7t0pz8ku]      { background: rgba(0,51,102,0.06); color: var(--lemaro-navy); border: 1px solid rgba(0,51,102,0.15); }
.users-badge--inspector[b-8y7t0pz8ku] { background: #FFF7ED; color: #C2410C; border: 1px solid #FED7AA; }
.users-badge--agenda[b-8y7t0pz8ku]    { background: #EFF6FF; color: #1D4ED8; border: 1px solid #BFDBFE; }

/* ── Alerts ────────────────────────────────────────────────── */
.users-alert[b-8y7t0pz8ku] {
    padding: 0.85rem 1rem;
    border-radius: 0.5rem;
    border: 1px solid transparent;
    font-size: 0.9rem;
}

.users-alert--success[b-8y7t0pz8ku] { background: #F0FDF4; border-color: #A7F3D0; color: #059669; }
.users-alert--error[b-8y7t0pz8ku]   { background: #FEF2F2; border-color: #FECACA; color: #DC2626; }

/* ── Edit action link ──────────────────────────────────────── */
.users-edit-link[b-8y7t0pz8ku] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.75rem;
    border-radius: 0.375rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--lemaro-navy);
    background: rgba(0, 51, 102, 0.06);
    border: 1px solid rgba(0, 51, 102, 0.15);
    text-decoration: none;
    transition: background 120ms ease, border-color 120ms ease;
}

.users-edit-link:hover[b-8y7t0pz8ku] {
    background: rgba(0, 51, 102, 0.12);
    border-color: var(--lemaro-navy);
    color: var(--lemaro-navy);
    text-decoration: none;
}

/* ── Responsive ────────────────────────────────────────────── */
@media (max-width: 900px) {
    .users-header[b-8y7t0pz8ku] { grid-template-columns: 1fr; }
    .users-panel[b-8y7t0pz8ku]  { padding: 1.25rem; }
}

@media (max-width: 580px) {
    .users-kpi-row[b-8y7t0pz8ku] { grid-template-columns: 1fr 1fr; }
    .users-kpi-row .users-kpi:last-child[b-8y7t0pz8ku] { grid-column: 1 / -1; }
    .users-search-toolbar[b-8y7t0pz8ku]  fluent-text-field.users-search-field { max-width: 100%; }
}
/* /Components/Planning/PlanningMiniCalendar.razor.rz.scp.css */
.planning-mini-calendar[b-4ih7uogohw] {
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
}

.planning-mini-calendar__month-header[b-4ih7uogohw] {
    padding: 0.2rem 0 0.35rem;
    font-size: 0.75rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--lemaro-muted);
    border-bottom: 1px solid var(--lemaro-border);
}

.planning-mini-calendar__grid[b-4ih7uogohw] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 1px;
    margin-top: 0.35rem;
}

.planning-mini-calendar__dow[b-4ih7uogohw] {
    font-size: 0.62rem;
    font-weight: 700;
    text-align: center;
    color: var(--lemaro-muted);
    padding: 0.1rem 0 0.25rem;
    text-transform: uppercase;
}

.planning-mini-calendar__day[b-4ih7uogohw] {
    all: unset;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    height: 1.55rem;
    border-radius: 0.2rem;
    cursor: pointer;
    color: var(--brand-text-main);
    transition: background 0.1s;
}

.planning-mini-calendar__day:hover[b-4ih7uogohw] {
    background: var(--lemaro-border);
}

.planning-mini-calendar__day--week[b-4ih7uogohw] {
    background: rgba(230, 81, 0, 0.13);
    color: var(--brand-orange);
    font-weight: 700;
}

.planning-mini-calendar__day--today[b-4ih7uogohw] {
    text-decoration: underline;
    font-weight: 900;
}
/* /Components/Planning/PlanningWeekCalendar.razor.rz.scp.css */
.planning-scheduler-shell[b-5ke57p9sav] {
    overflow-x: auto;
    padding-bottom: 0.35rem;
}

.planning-scheduler-grid[b-5ke57p9sav] {
    display: grid;
    grid-template-columns: clamp(10rem, 18vw, 12rem) repeat(5, minmax(12rem, 1fr));
    gap: 0.9rem;
    min-width: 74rem;
    align-items: start;
}

.planning-scheduler-grid__corner[b-5ke57p9sav],
.planning-scheduler-grid__day[b-5ke57p9sav],
.planning-scheduler-grid__resource[b-5ke57p9sav],
.planning-scheduler-grid__cell[b-5ke57p9sav] {
    min-width: 0;
}

.planning-scheduler-grid__corner[b-5ke57p9sav],
.planning-scheduler-grid__day[b-5ke57p9sav] {
    position: sticky;
    top: 0;
    z-index: 4;
    backdrop-filter: blur(14px);
}

.planning-scheduler-grid__corner[b-5ke57p9sav] {
    left: 0;
    z-index: 6;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.25rem;
    min-height: 5.25rem;
    padding: 1rem;
    border-radius: 1.3rem;
    background: linear-gradient(160deg, rgba(14, 79, 138, 0.94), rgba(14, 79, 138, 0.84));
    color: #fff9f2;
    box-shadow: 0 18px 34px rgba(14, 79, 138, 0.18);
}

.planning-scheduler-grid__corner span[b-5ke57p9sav],
.planning-scheduler-grid__day span[b-5ke57p9sav] {
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 0.72rem;
    font-weight: 800;
}

.planning-scheduler-grid__day[b-5ke57p9sav] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.25rem;
    min-height: 5.25rem;
    padding: 1rem;
    border-radius: 1.3rem;
    border: 1px solid var(--lemaro-border);
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 12px 26px rgba(14, 79, 138, 0.08);
}

.planning-scheduler-grid__day span[b-5ke57p9sav] {
    color: var(--lemaro-orange);
}

.planning-scheduler-grid__day strong[b-5ke57p9sav] {
    color: var(--lemaro-blue);
    font-size: 1.05rem;
}

.planning-scheduler-grid__resource[b-5ke57p9sav] {
    position: sticky;
    left: 0;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    min-height: 100%;
    padding: 0.95rem;
    border-radius: 1.3rem;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid color-mix(in srgb, var(--planning-resource-accent) 22%, var(--lemaro-border));
    box-shadow: 0 12px 26px rgba(14, 79, 138, 0.08);
}

.planning-scheduler-grid__resource--expander[b-5ke57p9sav] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-template-rows: auto auto;
    align-items: start;
    row-gap: 0.45rem;
}

.planning-scheduler-grid__resource-body[b-5ke57p9sav] {
    min-width: 0;
    display: grid;
    gap: 0.15rem;
}

.planning-scheduler-grid__resource-body strong[b-5ke57p9sav] {
    color: var(--lemaro-blue);
}

.planning-scheduler-grid__resource-body span[b-5ke57p9sav] {
    color: var(--lemaro-muted);
    font-size: 0.78rem;
}

.planning-scheduler-grid__resource--expander .planning-scheduler-grid__resource-body[b-5ke57p9sav] {
    grid-column: 1 / -1;
    grid-row: 2;
}

.planning-scheduler-grid__resource-toggle[b-5ke57p9sav] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border: 1px solid rgba(14, 79, 138, 0.14);
    border-radius: 999px;
    padding: 0.45rem 0.72rem;
    background: rgba(14, 79, 138, 0.08);
    color: var(--lemaro-blue);
    font-size: 0.72rem;
    font-weight: 800;
    cursor: pointer;
}

.planning-scheduler-grid__resource--expander .planning-scheduler-grid__resource-toggle[b-5ke57p9sav] {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
}

.planning-scheduler-grid__resource-toggle-icon[b-5ke57p9sav] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    font-size: 0.95rem;
    line-height: 1;
}

.planning-scheduler-grid__swatch[b-5ke57p9sav] {
    width: 0.9rem;
    height: 0.9rem;
    border-radius: 999px;
    background: var(--planning-resource-accent);
    flex-shrink: 0;
}

.planning-scheduler-grid__resource--expander .planning-scheduler-grid__swatch[b-5ke57p9sav] {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
}

.planning-scheduler-grid__cell[b-5ke57p9sav] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    min-height: 14rem;
    padding: 0.85rem;
    border-radius: 1.3rem;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid color-mix(in srgb, var(--planning-resource-accent) 18%, var(--lemaro-border));
}

.planning-scheduler-grid__cell--selected[b-5ke57p9sav] {
    border-color: color-mix(in srgb, var(--planning-resource-accent) 38%, var(--lemaro-blue));
    box-shadow: 0 16px 30px rgba(14, 79, 138, 0.1);
}

.planning-scheduler-grid__cell--collapsed[b-5ke57p9sav] {
    justify-content: center;
    min-height: 5.5rem;
    background: rgba(247, 249, 251, 0.9);
}

.planning-scheduler-grid__cell-summary[b-5ke57p9sav] {
    display: grid;
    gap: 0.22rem;
}

.planning-scheduler-grid__cell-summary strong[b-5ke57p9sav] {
    color: var(--lemaro-blue);
    font-size: 0.84rem;
}

.planning-scheduler-grid__cell-summary span[b-5ke57p9sav] {
    color: var(--lemaro-muted);
    font-size: 0.76rem;
}

.planning-scheduler-grid__cell-header[b-5ke57p9sav] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.planning-scheduler-grid__cell-header span[b-5ke57p9sav] {
    color: var(--lemaro-orange);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.planning-scheduler-grid__add[b-5ke57p9sav] {
    border: 1px solid rgba(14, 79, 138, 0.14);
    border-radius: 999px;
    padding: 0.45rem 0.7rem;
    background: rgba(14, 79, 138, 0.08);
    color: var(--lemaro-blue);
    font-size: 0.76rem;
    font-weight: 800;
    cursor: pointer;
}

.planning-resource-column__empty[b-5ke57p9sav],
.planning-day__empty[b-5ke57p9sav] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 7.5rem;
    border-radius: 1.1rem;
    border: 1px dashed rgba(14, 79, 138, 0.18);
    color: var(--lemaro-muted);
    font-size: 0.92rem;
    background: rgba(247, 249, 251, 0.72);
    text-align: center;
}

.planning-resource-column__empty--compact[b-5ke57p9sav] {
    min-height: 6rem;
    padding: 0.95rem;
}

.planning-resource-column__events[b-5ke57p9sav] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.planning-event[b-5ke57p9sav] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    padding: 0.8rem;
    padding-right: 2.9rem;
    border-radius: 1.1rem;
    background: #fffdf9;
    border: 1px solid rgba(14, 79, 138, 0.08);
    border-top: 4px solid var(--planning-resource-accent, var(--lemaro-orange));
    box-shadow: 0 10px 24px rgba(14, 79, 138, 0.08);
}

.planning-event--selected[b-5ke57p9sav] {
    border-color: color-mix(in srgb, var(--planning-resource-accent) 38%, var(--lemaro-blue));
}

.planning-event--draggable[b-5ke57p9sav] {
    cursor: grab;
    user-select: none;
}

.planning-event--draggable:active[b-5ke57p9sav] {
    cursor: grabbing;
}

.planning-event--dragging[b-5ke57p9sav] {
    opacity: 0.45;
    box-shadow: none;
}

.planning-scheduler-grid__cell--dragover[b-5ke57p9sav] {
    outline: 2px dashed var(--planning-resource-accent, var(--lemaro-orange));
    outline-offset: -2px;
    background: color-mix(in srgb, var(--planning-resource-accent, var(--lemaro-orange)) 7%, transparent);
    transition: background 0.1s;
}

.planning-event__time[b-5ke57p9sav] {
    color: var(--lemaro-orange);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.planning-event__delete[b-5ke57p9sav] {
    position: absolute;
    top: 0.6rem;
    right: 0.6rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.9rem;
    height: 1.9rem;
    border: 1px solid rgba(185, 28, 28, 0.22);
    border-radius: 999px;
    background: rgba(185, 28, 28, 0.07);
    cursor: pointer;
}

.planning-event__delete-icon[b-5ke57p9sav] {
    position: relative;
    display: block;
    width: 0.75rem;
    height: 0.75rem;
}

.planning-event__delete-icon[b-5ke57p9sav]::before,
.planning-event__delete-icon[b-5ke57p9sav]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0.8rem;
    height: 2px;
    border-radius: 999px;
    background: #b91c1c;
}

.planning-event__delete-icon[b-5ke57p9sav]::before {
    transform: translate(-50%, -50%) rotate(45deg);
}

.planning-event__delete-icon[b-5ke57p9sav]::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.planning-event__meta[b-5ke57p9sav] {
    color: var(--lemaro-muted);
    font-size: 0.82rem;
    line-height: 1.45;
}

.planning-event__meta--secondary[b-5ke57p9sav] {
    color: var(--lemaro-blue);
}

.planning-event__workflow[b-5ke57p9sav] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(5.8rem, 1fr));
    gap: 0.45rem;
}

.planning-event__workflow-item[b-5ke57p9sav] {
    display: grid;
    gap: 0.28rem;
}

.planning-event__workflow-label[b-5ke57p9sav] {
    color: var(--lemaro-muted, #64748b);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.planning-event__workflow-switch[b-5ke57p9sav] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 0.14rem;
    width: 100%;
    min-height: 1.7rem;
    padding: 0.14rem;
    border-radius: 0.52rem;
    background: linear-gradient(180deg, #fee2e2, #fecaca);
    border: 1px solid rgba(220, 38, 38, 0.22);
    cursor: pointer;
    transition: opacity 0.1s ease;
}

.planning-event__workflow-switch:hover[b-5ke57p9sav] {
    opacity: 0.85;
}

.planning-event__workflow-segment[b-5ke57p9sav] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.24rem;
    border-radius: 0.34rem;
    font-size: 0.58rem;
    font-weight: 900;
    letter-spacing: 0.04em;
}

.planning-event__workflow-segment--on[b-5ke57p9sav] {
    background: rgba(220, 252, 231, 0.96);
    color: #166534;
}

.planning-event__workflow-segment--off[b-5ke57p9sav] {
    background: #dc2626;
    color: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.planning-event__workflow-switch--complete[b-5ke57p9sav] {
    background: linear-gradient(180deg, #dcfce7, #bbf7d0);
    border-color: rgba(22, 163, 74, 0.28);
}

.planning-event__workflow-switch--complete .planning-event__workflow-segment--on[b-5ke57p9sav] {
    background: #16a34a;
    color: #ffffff;
    box-shadow: none;
}

.planning-event__workflow-switch--complete .planning-event__workflow-segment--off[b-5ke57p9sav] {
    background: rgba(254, 226, 226, 0.78);
    color: #b91c1c;
    box-shadow: none;
}

.planning-status-badge[b-5ke57p9sav] {
    display: inline-flex;
    align-items: center;
    min-height: 1.95rem;
    padding: 0.28rem 0.62rem;
    border-radius: 999px;
    border: 1px solid rgba(14, 79, 138, 0.12);
    background: rgba(14, 79, 138, 0.06);
    color: var(--lemaro-blue);
    font-size: 0.72rem;
    font-weight: 800;
}

.planning-status-badge--complete[b-5ke57p9sav] {
    border-color: rgba(242, 129, 41, 0.26);
    background: rgba(242, 129, 41, 0.14);
    color: #8f4d11;
}

.planning-status-badge--plain[b-5ke57p9sav] {
    background: rgba(244, 188, 77, 0.14);
    border-color: rgba(244, 188, 77, 0.28);
    color: #8a6208;
}

.planning-event__actions[b-5ke57p9sav] {
    display: flex;
    justify-content: flex-end;
}

/* Resize handle at the bottom of each editable appointment card */
.planning-event__resize-handle[b-5ke57p9sav] {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 2.5rem;
    height: 0.55rem;
    cursor: ns-resize;
    border-radius: 0 0 1.1rem 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
}

.planning-event__resize-handle[b-5ke57p9sav]::after {
    content: '';
    display: block;
    width: 1.8rem;
    height: 3px;
    border-radius: 2px;
    background: rgba(14, 79, 138, 0.2);
    transition: background 0.15s;
}

.planning-event:hover .planning-event__resize-handle[b-5ke57p9sav]::after,
.planning-event--draggable:hover .planning-event__resize-handle[b-5ke57p9sav]::after {
    background: var(--planning-resource-accent, var(--lemaro-orange));
    opacity: 0.6;
}

.planning-event__action[b-5ke57p9sav] {
    border: none;
    padding: 0.4rem 0.6rem;
    background: transparent;
    color: var(--lemaro-blue);
    font-size: 0.8rem;
    font-weight: 800;
    cursor: pointer;
    min-height: 2.2rem;
    border-radius: 0.35rem;
}

@media (max-width: 960px) {
    .planning-scheduler-grid[b-5ke57p9sav] {
        min-width: 52rem;
    }

    .planning-event__workflow[b-5ke57p9sav] {
        grid-template-columns: repeat(2, 1fr);
    }

    .planning-event__delete[b-5ke57p9sav],
    .planning-scheduler-grid__add[b-5ke57p9sav],
    .planning-scheduler-grid__resource-toggle[b-5ke57p9sav] {
        min-width: 2.75rem;
        min-height: 2.75rem;
    }
}

@media (max-width: 640px) {
    .planning-scheduler-grid[b-5ke57p9sav] {
        min-width: 42rem;
    }

    .planning-event[b-5ke57p9sav] {
        padding: 0.65rem;
        padding-right: 2.5rem;
    }

    .planning-event__workflow[b-5ke57p9sav] {
        display: none;
    }
}