/* /Components/Layout/AuthLayout.razor.rz.scp.css */
.e2c-auth[b-coqoxiqkf6] {
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    box-sizing: border-box;
    background: linear-gradient(135deg, #163E63 0%, #E36A1A 110%);
}

.e2c-auth-col[b-coqoxiqkf6] {
    width: min(420px, 92vw);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.e2c-auth-back[b-coqoxiqkf6] {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 14px;
    padding: 7px 14px 7px 11px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.28);
    color: #fff;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.15s ease;
}

.e2c-auth-back:hover[b-coqoxiqkf6] { background: rgba(255, 255, 255, 0.24); }
.e2c-auth-back-arrow[b-coqoxiqkf6] { font-size: 1.05rem; line-height: 1; }

.e2c-auth-brand[b-coqoxiqkf6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin-bottom: 22px;
}

.e2c-auth-logo[b-coqoxiqkf6] {
    width: 64px;
    height: 64px;
}

.e2c-auth-name[b-coqoxiqkf6] {
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .06em;
}

/* The card is a MudPaper child component. Scoped CSS does not stamp the layout's
   scope attribute onto a child component's root element, so `.e2c-auth-card` alone
   never matched and the card rendered with no padding/background/radius/shadow.
   `::deep` from the scoped parent (.e2c-auth-col, plain HTML in this layout) reaches
   through to the MudPaper root regardless of its own scope. */
.e2c-auth-col[b-coqoxiqkf6]  .e2c-auth-card {
    width: 100%;
    box-sizing: border-box;
    border-radius: 16px;
    padding: 36px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(15, 27, 45, 0.28);
}

@media (max-width: 560px) {
    .e2c-auth[b-coqoxiqkf6] {
        padding: 24px 16px;
    }

    .e2c-auth-col[b-coqoxiqkf6]  .e2c-auth-card {
        padding: 26px 22px;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-va9f4iofad] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-va9f4iofad] {
    flex: 1;
}

.sidebar[b-va9f4iofad] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-va9f4iofad] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-va9f4iofad]  a, .top-row[b-va9f4iofad]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-va9f4iofad]  a:hover, .top-row[b-va9f4iofad]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-va9f4iofad]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-va9f4iofad] {
        justify-content: space-between;
    }

    .top-row[b-va9f4iofad]  a, .top-row[b-va9f4iofad]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-va9f4iofad] {
        flex-direction: row;
    }

    .sidebar[b-va9f4iofad] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-va9f4iofad] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-va9f4iofad]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-va9f4iofad], article[b-va9f4iofad] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

/* ErrorBoundary fallback — full-viewport centered brand card (tokens flip with dark mode). */
.e2c-fatal[b-va9f4iofad] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    background: var(--paper, #FAF6EE);
}

.e2c-fatal-card[b-va9f4iofad] {
    max-width: 26rem;
    padding: 2rem 1.75rem;
    text-align: center;
    background: var(--surface, #FFFFFF);
    color: var(--text, #0F1B2D);
    border: 1px solid var(--border, rgba(15, 27, 45, 0.18));
    border-radius: 12px;
    box-shadow: 0 8px 24px var(--shadow, rgba(15, 27, 45, 0.10));
}

.e2c-fatal-logo[b-va9f4iofad] {
    height: 48px;
    margin-bottom: 1rem;
}

.e2c-fatal-card h1[b-va9f4iofad] {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.e2c-fatal-card p[b-va9f4iofad] {
    color: var(--text-muted, #46566B);
    margin-bottom: 1.25rem;
}

.e2c-fatal-reload[b-va9f4iofad] {
    padding: 0.5rem 1.5rem;
    font-weight: 600;
    color: var(--text, #0F1B2D);
    background: var(--surface, #FFFFFF);
    border: 1px solid var(--border-strong, rgba(15, 27, 45, 0.32));
    border-radius: 8px;
    cursor: pointer;
}

    .e2c-fatal-reload:hover[b-va9f4iofad] {
        border-color: var(--brand-orange, #F39125);
        color: var(--brand-orange-deep, #E36A1A);
    }

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

    #blazor-error-ui .dismiss[b-va9f4iofad] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-hakh7ixhog] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-hakh7ixhog] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-hakh7ixhog] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-hakh7ixhog] {
    font-size: 1.1rem;
}

.bi[b-hakh7ixhog] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-hakh7ixhog] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-hakh7ixhog] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-hakh7ixhog] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.bi-lock-nav-menu[b-hakh7ixhog] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2zM5 8h6a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
}

.bi-person-nav-menu[b-hakh7ixhog] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person' viewBox='0 0 16 16'%3E%3Cpath d='M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Zm-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h10Z'/%3E%3C/svg%3E");
}

.bi-person-badge-nav-menu[b-hakh7ixhog] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-badge' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492V2.5z'/%3E%3C/svg%3E");
}

.bi-person-fill-nav-menu[b-hakh7ixhog] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-fill' viewBox='0 0 16 16'%3E%3Cpath d='M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E");
}

.bi-arrow-bar-left-nav-menu[b-hakh7ixhog] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-bar-left' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 15a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5ZM10 8a.5.5 0 0 1-.5.5H3.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L3.707 7.5H9.5a.5.5 0 0 1 .5.5Z'/%3E%3C/svg%3E");
}

.nav-item[b-hakh7ixhog] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-hakh7ixhog] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-hakh7ixhog] {
        padding-bottom: 1rem;
    }

    .nav-item[b-hakh7ixhog]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-hakh7ixhog]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-hakh7ixhog]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-hakh7ixhog] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-hakh7ixhog] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-hakh7ixhog] {
        display: none;
    }

    .nav-scrollable[b-hakh7ixhog] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* /Components/Layout/PortalLayout.razor.rz.scp.css */
.e2c-portal[b-32fntp4ey9] {
    display: flex;
    flex-direction: row;
    height: 100vh;
    overflow: hidden;
    background: var(--paper, #FAF6EE);
}

/* ── Sidebar ──────────────────────────────────────────────────────────────────────── */
.e2c-side[b-32fntp4ey9] {
    flex: 0 0 240px;
    width: 240px;
    background: #0F1B2D;
    color: #fff;
    display: flex;
    flex-direction: column;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow: hidden;
}

.e2c-side-head[b-32fntp4ey9] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.e2c-side-logo[b-32fntp4ey9] {
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
}

.e2c-side-brand[b-32fntp4ey9] {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
    min-width: 0;
}

.e2c-side-name[b-32fntp4ey9] {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .04em;
}

.e2c-side-role[b-32fntp4ey9] {
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: rgba(255, 255, 255, .55);
}

/* Nav list */
.e2c-side-nav[b-32fntp4ey9] {
    flex: 1;
    overflow-y: auto;
    padding: 10px 12px 16px;
    scrollbar-width: thin;
}

/* List semantics added for a11y (1.3.1) — strip default list chrome so layout is unchanged. */
.e2c-side-list[b-32fntp4ey9] {
    list-style: none;
    margin: 0;
    padding: 0;
}
.e2c-side-list > li[b-32fntp4ey9] {
    margin: 0;
    padding: 0;
}

.e2c-side-section[b-32fntp4ey9] {
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: rgba(255, 255, 255, .4);
    padding: 16px 10px 6px;
}

.e2c-side-link[b-32fntp4ey9] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 11px;
    margin-bottom: 2px;
    border-radius: 8px;
    border-left: 3px solid transparent;
    color: rgba(255, 255, 255, .85);
    font-size: 13.5px;
    font-weight: 500;
    text-decoration: none;
    transition: background .12s ease, color .12s ease;
}

.e2c-side-link:hover[b-32fntp4ey9] {
    background: rgba(255, 255, 255, .06);
    color: #fff;
}

.e2c-side-link.active[b-32fntp4ey9] {
    background: color-mix(in srgb, var(--accent) 13%, transparent);
    border-left-color: var(--accent);
    /* 1.4.3 — the raw accent (#1F5A8A for students) on its own 13% tint over the ink-900 rail was
       2.19:1: the CURRENT page was the least readable item in the sidebar. The accent still marks
       it (left bar + tint); the label reads in near-white like its siblings. */
    color: #F6F1E5;
    font-weight: 700;
}

.e2c-side-ico[b-32fntp4ey9] {
    font-size: 1rem;
    width: 20px;
    text-align: center;
    flex: 0 0 auto;
}

.e2c-side-label[b-32fntp4ey9] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.e2c-side-badge[b-32fntp4ey9] {
    background: var(--accent);
    color: #fff;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1;
    padding: 3px 7px;
    border-radius: 999px;
    flex: 0 0 auto;
}

/* Footer user block */
.e2c-side-foot[b-32fntp4ey9] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 14px;
    border-top: 1px solid rgba(255, 255, 255, .08);
}

.e2c-side-user[b-32fntp4ey9] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.e2c-side-user-name[b-32fntp4ey9] {
    font-size: 13px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.e2c-side-user-email[b-32fntp4ey9] {
    font-size: 11.5px;
    color: rgba(255, 255, 255, .55);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[b-32fntp4ey9] .e2c-side-logout {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, .18);
    color: rgba(255, 255, 255, .85);
    flex: 0 0 auto;
}

[b-32fntp4ey9] .e2c-side-logout:hover {
    background: rgba(255, 255, 255, .12);
    color: #fff;
}

/* ── Content ──────────────────────────────────────────────────────────────────────── */
.e2c-portal-main[b-32fntp4ey9] {
    flex: 1;
    min-width: 0;
    height: 100vh;
    overflow-y: auto;
    overflow-x: hidden;
}

/* Mobile chip bar hidden on desktop */
.e2c-side-chips[b-32fntp4ey9] {
    display: none;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* List semantics added for a11y (1.3.1): the <li> wrappers shouldn't affect the
   flex chip layout — `display:contents` keeps the <a>/<button> as the flex items. */
.e2c-side-chips > li[b-32fntp4ey9] {
    display: contents;
}

/* ── Mobile (DESIGN_SCREENS_SPEC §4a) ───────────────────────────────────────────────── */
@media (max-width: 820px) {
    .e2c-portal[b-32fntp4ey9] {
        flex-direction: column;
        height: auto;
        overflow: visible;
    }

    .e2c-portal-main[b-32fntp4ey9] {
        height: auto;
        overflow-y: visible;
    }

    .e2c-side[b-32fntp4ey9] {
        display: none;
    }

    .e2c-side-chips[b-32fntp4ey9] {
        display: flex;
        gap: 8px;
        overflow-x: auto;
        padding: 10px 14px;
        background: #0F1B2D;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .e2c-side-chips[b-32fntp4ey9]::-webkit-scrollbar {
        display: none;
    }

    .e2c-chip-link[b-32fntp4ey9] {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        flex: 0 0 auto;
        padding: 8px 14px;
        border-radius: 999px;
        border: none;
        background: rgba(255, 255, 255, .08);
        color: rgba(255, 255, 255, .85);
        font-size: 13px;
        font-weight: 600;
        text-decoration: none;
        white-space: nowrap;
        cursor: pointer;
    }

    .e2c-chip-link.active[b-32fntp4ey9] {
        background: var(--accent);
        color: #fff;
    }

    .e2c-chip-badge[b-32fntp4ey9] {
        background: rgba(255, 255, 255, .25);
        color: #fff;
        font-size: 10.5px;
        font-weight: 700;
        line-height: 1;
        padding: 2px 6px;
        border-radius: 999px;
    }

    .e2c-chip-logout[b-32fntp4ey9] {
        background: transparent;
        border: 1px solid rgba(255, 255, 255, .3);
    }
}
/* /Components/Layout/PublicLayout.razor.rz.scp.css */
.e2c-public[b-lxj7vlmr1d] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--paper);
    color: var(--ink-900);
}

/* ── Nav ───────────────────────────────────────────────────────── */
.e2c-nav[b-lxj7vlmr1d] {
    position: sticky;
    top: 0;
    z-index: 1020;
    background: color-mix(in srgb, var(--surface) 85%, transparent);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border);
}

.e2c-nav-inner[b-lxj7vlmr1d] {
    max-width: 1240px;
    margin: 0 auto;
    padding: 12px 24px;
    display: flex;
    align-items: center;
    gap: 28px;
}

.e2c-brand[b-lxj7vlmr1d] {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    color: inherit;
}

.e2c-logo[b-lxj7vlmr1d] { height: 42px; width: auto; display: block; }

.e2c-brand-text[b-lxj7vlmr1d] { display: flex; flex-direction: column; line-height: 1.15; }
.e2c-brand-name[b-lxj7vlmr1d] { font-weight: 800; letter-spacing: 0.06em; font-size: 0.95rem; color: var(--ink-900); }
.e2c-brand-sub[b-lxj7vlmr1d] { font-size: 0.72rem; color: var(--ink-500); }

.e2c-nav-links[b-lxj7vlmr1d] {
    display: flex;
    align-items: center;
    gap: 22px;
    margin-left: auto;
}

.e2c-nav-links a[b-lxj7vlmr1d] {
    padding: 8px 2px; /* 2.5.8 — bare text was a ~14px target */
    text-decoration: none;
    color: var(--ink-700);
    font-size: 0.9rem;
    font-weight: 500;
    transition: color 0.15s ease;
}

.e2c-nav-links a:hover[b-lxj7vlmr1d] { color: var(--brand-orange-deep); }

/* ── "About E2CXC" dropdown (desktop) ──────────────────────────── */
.e2c-nav-dd[b-lxj7vlmr1d] { position: relative; }

.e2c-nav-dd-toggle[b-lxj7vlmr1d] {
    padding: 8px 2px; /* 2.5.8 */
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0;
    border: none;
    background: transparent;
    color: var(--ink-700);
    font-size: 0.9rem;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    transition: color 0.15s ease;
}
.e2c-nav-dd-toggle:hover[b-lxj7vlmr1d] { color: var(--brand-orange-deep); }
.e2c-nav-dd-toggle:focus-visible[b-lxj7vlmr1d] { outline: 2px solid var(--brand-orange-deep); outline-offset: 2px; }

.e2c-nav-dd-menu[b-lxj7vlmr1d] {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(-4px);
    min-width: 200px;
    padding: 8px;
    margin-top: 10px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    box-shadow: 0 14px 28px rgba(15, 27, 45, 0.14);
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s;
}

/* Keep the menu reachable while the pointer crosses the gap under the toggle. */
.e2c-nav-dd[b-lxj7vlmr1d]::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    height: 12px;
}

.e2c-nav-dd:hover .e2c-nav-dd-menu[b-lxj7vlmr1d],
.e2c-nav-dd.is-open .e2c-nav-dd-menu[b-lxj7vlmr1d],
.e2c-nav-dd:focus-within .e2c-nav-dd-menu[b-lxj7vlmr1d] {
    visibility: visible;
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.e2c-nav-dd-menu a[b-lxj7vlmr1d] {
    display: block;
    padding: 9px 12px;
    border-radius: 7px;
    text-decoration: none;
    color: var(--ink-700);
    font-size: 0.9rem;
    font-weight: 500;
    white-space: nowrap;
    transition: color 0.15s ease, background 0.15s ease;
}
.e2c-nav-dd-menu a:hover[b-lxj7vlmr1d] {
    color: var(--brand-orange-deep);
    background: color-mix(in srgb, var(--brand-orange-deep) 8%, transparent);
}

.e2c-nav-actions[b-lxj7vlmr1d] { display: flex; align-items: center; gap: 14px; }

.e2c-login[b-lxj7vlmr1d] {
    text-decoration: none;
    color: var(--text);
    font-weight: 600;
    font-size: 0.9rem;
}
.e2c-login:hover[b-lxj7vlmr1d] { color: var(--brand-orange-deep); }

.e2c-register[b-lxj7vlmr1d] { white-space: nowrap; }
.e2c-register-short[b-lxj7vlmr1d] { display: none; }

/* ── Mobile menu (hamburger, <=980px) ──────────────────────────── */
.e2c-nav-toggle[b-lxj7vlmr1d] {
    display: none;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: transparent;
    color: var(--ink-700);
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease;
}
.e2c-nav-toggle:hover[b-lxj7vlmr1d] { color: var(--brand-orange-deep); border-color: var(--border-strong); }

.e2c-nav-toggle:focus-visible[b-lxj7vlmr1d],
.e2c-mobile-menu a:focus-visible[b-lxj7vlmr1d] {
    outline: 2px solid var(--brand-orange-deep);
    outline-offset: 2px;
}

.e2c-mobile-menu[b-lxj7vlmr1d] {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    padding: 6px 24px 20px;
    background: var(--surface);
    border-bottom: 1px solid var(--border);
    box-shadow: 0 18px 32px rgba(15, 27, 45, 0.16);
    max-height: calc(100vh - 68px);
    overflow-y: auto;
    visibility: hidden;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
}
.e2c-mobile-menu.open[b-lxj7vlmr1d] { visibility: visible; opacity: 1; transform: none; }

.e2c-mobile-menu > a[b-lxj7vlmr1d] {
    display: block;
    padding: 13px 2px;
    text-decoration: none;
    color: var(--ink-700);
    font-size: 1rem;
    font-weight: 500;
    border-bottom: 1px solid var(--border);
    transition: color 0.15s ease;
}
.e2c-mobile-menu > a:hover[b-lxj7vlmr1d] { color: var(--brand-orange-deep); }

.e2c-mobile-menu-caption[b-lxj7vlmr1d] {
    padding: 16px 2px 6px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--ink-500);
}

.e2c-mobile-menu-ctas[b-lxj7vlmr1d] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding-top: 18px;
}

.e2c-mobile-login[b-lxj7vlmr1d] {
    text-decoration: none;
    color: var(--text);
    font-weight: 600;
    font-size: 0.95rem;
}
.e2c-mobile-login:hover[b-lxj7vlmr1d] { color: var(--brand-orange-deep); }

.e2c-main[b-lxj7vlmr1d] { flex: 1; }

/* ── Footer ────────────────────────────────────────────────────── */
.e2c-footer[b-lxj7vlmr1d] {
    background: var(--brand-blue-deep);
    color: #D9E0EA;
    padding: 56px 24px 24px;
}

.e2c-footer-grid[b-lxj7vlmr1d] {
    max-width: 1240px;
    margin: 0 auto;
    display: grid;
    /* #488 — FIVE tracks for five children: the brand block plus Learn / Register / About E2C /
       Company. With four, auto-placement started a second row and dropped Company into row 2
       column 1 — under the social icons, reading as part of the brand block. If a column is added
       here, widen this. */
    grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr;
    gap: 32px;
}

/* The footer logo is a link home, like the nav one. Scoped through .e2c-footer-brand on purpose:
   the column-link rule above (.e2c-footer-grid a) is more specific than a bare .e2c-footer-home,
   so without the extra class this anchor inherits display:block and stretches its hit area across
   the whole column. Visible focus ring because it is now a keyboard stop. */
.e2c-footer-brand .e2c-footer-home[b-lxj7vlmr1d] {
    display: inline-block;
    margin-bottom: 0;
    border-radius: 6px;
}
.e2c-footer-brand .e2c-footer-home:focus-visible[b-lxj7vlmr1d] {
    outline: 2px solid #F39125;
    outline-offset: 4px;
}
.e2c-footer-logo[b-lxj7vlmr1d] { height: 40px; margin-bottom: 14px; display: block; }
.e2c-footer-brand p[b-lxj7vlmr1d] { color: rgba(217, 224, 234, 0.75); font-size: 0.88rem; margin: 0 0 8px; max-width: 320px; }
.e2c-footer-contact span[b-lxj7vlmr1d] { font-size: 0.85rem; }

.e2c-footer h6[b-lxj7vlmr1d], .e2c-footer .e2c-footer-h[b-lxj7vlmr1d] {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.72rem;
    color: #F39125;
    margin-bottom: 14px;
}

.e2c-footer-grid a[b-lxj7vlmr1d] {
    display: block;
    text-decoration: none;
    color: rgba(217, 224, 234, 0.85);
    font-size: 0.88rem;
    margin-bottom: 8px;
    transition: color 0.15s ease;
}
.e2c-footer-grid a:hover[b-lxj7vlmr1d] { color: #fff; }

.e2c-footer-bar[b-lxj7vlmr1d] {
    max-width: 1240px;
    margin: 32px auto 0;
    padding-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 0.8rem;
    color: rgba(217, 224, 234, 0.78) /* 1.4.3: 0.6 was 4.05:1 at 0.8rem */;
}

.e2c-footer-legal[b-lxj7vlmr1d] { display: flex; flex-wrap: wrap; gap: 18px; }
.e2c-footer-legal a[b-lxj7vlmr1d] {
    text-decoration: none;
    color: rgba(217, 224, 234, 0.78) /* 1.4.3: 0.6 was 4.05:1 at 0.8rem */;
    transition: color 0.15s ease;
}
.e2c-footer-legal a:hover[b-lxj7vlmr1d] { color: #fff; }

.e2c-footer-social[b-lxj7vlmr1d] { display: flex; gap: 14px; margin-top: 16px; }
.e2c-footer-social a[b-lxj7vlmr1d] {
    display: inline-flex;
    margin-bottom: 0;
    color: rgba(217, 224, 234, 0.75);
    transition: color 0.15s ease;
}
.e2c-footer-social a:hover[b-lxj7vlmr1d] { color: #F39125; }

@media (max-width: 980px) {
    .e2c-nav-links[b-lxj7vlmr1d] { display: none; }
    .e2c-login[b-lxj7vlmr1d] { display: none; }
    .e2c-register-full[b-lxj7vlmr1d] { display: none; }
    .e2c-register-short[b-lxj7vlmr1d] { display: inline; }
    .e2c-nav-toggle[b-lxj7vlmr1d] { display: inline-flex; }
    .e2c-mobile-menu[b-lxj7vlmr1d] { display: block; }
    .e2c-footer-grid[b-lxj7vlmr1d] { grid-template-columns: 1fr 1fr; }
}

.e2c-footer-contact p[b-lxj7vlmr1d] { margin: 0 0 6px; font-size: 0.85rem; color: rgba(217, 224, 234, 0.85); }
.e2c-fc-ico[b-lxj7vlmr1d] { display: inline-block; width: 1.2em; }
.e2c-footer-hours[b-lxj7vlmr1d] { margin-top: 16px; }
.e2c-footer-hours h6[b-lxj7vlmr1d], .e2c-footer-hours .e2c-footer-h[b-lxj7vlmr1d] { margin-bottom: 8px; }
.e2c-footer-hours p[b-lxj7vlmr1d] { margin: 0 0 4px; font-size: 0.82rem; color: rgba(217, 224, 234, 0.7); }
.e2c-fh-closed[b-lxj7vlmr1d] { color: rgba(217, 224, 234, 0.7) /* 1.4.3: 0.45 was 2.96:1 */ !important; }

@media (max-width: 560px) {
    .e2c-brand-text[b-lxj7vlmr1d] { display: none; }
    .e2c-footer-grid[b-lxj7vlmr1d] { grid-template-columns: 1fr; }
}

/* Footer link columns became real <nav><ul> (1.3.1); keep the visual identical to the bare <a>s. */
.e2c-footer-list[b-lxj7vlmr1d] { list-style: none; margin: 0; padding: 0; }
.e2c-footer-list li[b-lxj7vlmr1d] { margin: 0; padding: 0; }
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-6xxyjhwahi],
.components-reconnect-repeated-attempt-visible[b-6xxyjhwahi],
.components-reconnect-failed-visible[b-6xxyjhwahi],
.components-pause-visible[b-6xxyjhwahi],
.components-resume-failed-visible[b-6xxyjhwahi],
.components-rejoining-animation[b-6xxyjhwahi] {
    display: none;
}

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


#components-reconnect-modal[b-6xxyjhwahi] {
    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-6xxyjhwahi 0.5s both;
    &[open]

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

@keyframes components-rejoining-animation-b-6xxyjhwahi {
    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/AboutAcademy.razor.rz.scp.css */
/* About the Academy. Reading-first like /our-story and /cotails, with the five faculties as cards
   so each is scannable on its own rather than buried in prose. Shared tokens only, so both themes
   work without a second palette. */

.aa-body[b-dmg2a37xfr] {
    max-width: 900px;
    margin: 0 auto;
    padding: 48px 24px 88px;
}

/* ── Intro ───────────────────────────────────────────────────────── */
.aa-intro[b-dmg2a37xfr] { padding-bottom: 30px; border-bottom: 1px solid var(--border); }
.aa-intro p[b-dmg2a37xfr] { color: var(--ink-700); line-height: 1.72; margin: 0 0 14px; }
.aa-intro p:last-child[b-dmg2a37xfr] { margin-bottom: 0; }
.aa-lead[b-dmg2a37xfr] { font-size: 1.08rem; color: var(--ink-900) !important; font-weight: 500; }
.aa-intro strong[b-dmg2a37xfr] { color: var(--ink-900); }

/* ── Faculty cards ───────────────────────────────────────────────── */
.aa-faculties[b-dmg2a37xfr] {
    display: grid;
    gap: 16px;
    margin-top: 32px;
}

@media (min-width: 760px) {
    .aa-faculties[b-dmg2a37xfr] { grid-template-columns: 1fr 1fr; }
    /* The first card leads the section, so it spans the row rather than sitting in a half-width
       column above four siblings. */
    .aa-faculties > .aa-faculty:first-child[b-dmg2a37xfr] { grid-column: 1 / -1; }
}

.aa-faculty[b-dmg2a37xfr] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 24px 26px;
    box-shadow: 0 1px 2px var(--shadow);
}

.aa-faculty-icon[b-dmg2a37xfr] { font-size: 1.6rem; line-height: 1; display: block; margin-bottom: 12px; }

.aa-faculty h2[b-dmg2a37xfr] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: 1.14rem;
    color: var(--ink-900);
    margin: 0 0 4px;
    letter-spacing: -.01em;
}

/* The trading name / tagline under each faculty title. */
.aa-faculty-alias[b-dmg2a37xfr] {
    font-size: .82rem;
    font-weight: 600;
    color: var(--brand-orange-text, #B4530A);
    margin: 0 0 12px !important;
}

.aa-faculty p[b-dmg2a37xfr] { color: var(--ink-700); line-height: 1.68; font-size: .95rem; margin: 0; }
.aa-faculty a[b-dmg2a37xfr] { color: var(--brand-blue); font-weight: 600; }

/* ── Closing + founder quote ─────────────────────────────────────── */
.aa-close[b-dmg2a37xfr] { margin-top: 44px; }

.aa-close-lead[b-dmg2a37xfr] {
    color: var(--ink-700);
    line-height: 1.72;
    margin: 0 0 26px;
}

.aa-quote[b-dmg2a37xfr] {
    background: linear-gradient(120deg, var(--brand-blue-deep, #163E63), var(--brand-blue, #1F5A8A));
    color: #fff;
    border-radius: 16px;
    padding: 34px 36px;
    margin: 0;
    box-shadow: 0 16px 40px rgba(22, 62, 99, 0.22);
}

.aa-quote blockquote[b-dmg2a37xfr] {
    font-size: clamp(1.15rem, 2.6vw, 1.5rem);
    line-height: 1.4;
    font-weight: 700;
    font-style: italic;
    margin: 0 0 22px;
}

.aa-quote figcaption[b-dmg2a37xfr] { display: flex; align-items: center; gap: 14px; }

.aa-quote-avatar[b-dmg2a37xfr] {
    width: 46px; height: 46px;
    border-radius: 50%;
    background: var(--brand-orange, #F39125);
    /* Ink on orange, not white: white on this orange is 2.4:1 (WCAG 1.4.3). */
    color: #0F1B2D;
    display: grid; place-items: center;
    font-weight: 800;
    font-size: .95rem;
    flex-shrink: 0;
}

.aa-quote-who[b-dmg2a37xfr] { display: flex; flex-direction: column; line-height: 1.35; }
.aa-quote-who strong[b-dmg2a37xfr] { font-size: 1rem; }
.aa-quote-who span[b-dmg2a37xfr] { font-size: .82rem; color: rgba(255, 255, 255, 0.82); }

.aa-signoff[b-dmg2a37xfr] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: 1.2rem;
    color: var(--ink-900);
    text-align: center;
    margin: 30px 0 0;
    letter-spacing: -.01em;
}

@media (max-width: 700px) {
    .aa-faculty[b-dmg2a37xfr] { padding: 20px 20px; }
    .aa-quote[b-dmg2a37xfr] { padding: 26px 22px; }
}
/* /Components/Pages/Admin/ApplicantDetail.razor.rz.scp.css */
.e2c-ad-page[b-lrgx6aw7ht] {
    padding: 28px;
}

.e2c-ad-grid[b-lrgx6aw7ht] {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 20px;
    align-items: start;
}

.e2c-ad-col[b-lrgx6aw7ht] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* ── Card ───────────────────────────────────────────────────── */
[b-lrgx6aw7ht] .e2c-ad-card {
    background: var(--surface);
    border: 1px solid var(--border) !important;
    border-radius: 16px;
    padding: 22px;
}

[b-lrgx6aw7ht] .e2c-ad-card.is-editing {
    border-color: #F39125 !important;
    box-shadow: 0 0 0 1px rgba(243, 145, 37, 0.4);
}

.e2c-ad-card-head[b-lrgx6aw7ht] { margin-bottom: 16px; }
.e2c-ad-card-head h3[b-lrgx6aw7ht] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.02rem;
    color: var(--text);
    margin: 0;
}
.e2c-ad-editing[b-lrgx6aw7ht] { color: #E36A1A; font-weight: 600; font-size: 0.85rem; }

/* ── Fields ─────────────────────────────────────────────────── */
.e2c-ad-fields[b-lrgx6aw7ht] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.e2c-ad-field[b-lrgx6aw7ht] { display: flex; flex-direction: column; gap: 4px; }
.e2c-ad-field-wide[b-lrgx6aw7ht] { grid-column: 1 / -1; }
.e2c-ad-key[b-lrgx6aw7ht] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
    font-weight: 700;
}
.e2c-ad-val[b-lrgx6aw7ht] { color: var(--text); font-size: 0.92rem; }

.e2c-ad-note[b-lrgx6aw7ht] {
    margin: 16px 0 0;
    font-size: 0.8rem;
    color: var(--text-muted);
    font-style: italic;
}

/* ── Subjects ───────────────────────────────────────────────── */
.e2c-ad-subjects[b-lrgx6aw7ht] { display: flex; flex-direction: column; gap: 10px; }
.e2c-ad-subj[b-lrgx6aw7ht], .e2c-ad-doc[b-lrgx6aw7ht] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
}
.e2c-ad-subj-icon[b-lrgx6aw7ht], .e2c-ad-doc-icon[b-lrgx6aw7ht] {
    width: 40px; height: 40px;
    border-radius: 10px;
    display: grid; place-items: center;
    background: rgba(243, 145, 37, 0.14);
    font-size: 1.1rem;
    flex-shrink: 0;
}
.e2c-ad-subj-body[b-lrgx6aw7ht] { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.e2c-ad-subj-name[b-lrgx6aw7ht] { font-weight: 600; color: var(--text); font-size: 0.92rem; }
.e2c-ad-subj-sub[b-lrgx6aw7ht] { font-size: 0.78rem; color: var(--text-muted); }
.e2c-ad-subj-price[b-lrgx6aw7ht] { font-weight: 700; color: #E36A1A; font-variant-numeric: tabular-nums; }

/* ── Notes ──────────────────────────────────────────────────── */
.e2c-ad-notes-foot[b-lrgx6aw7ht] { display: flex; justify-content: flex-end; margin-top: 12px; }

/* ── Timeline ───────────────────────────────────────────────── */
.e2c-ad-timeline[b-lrgx6aw7ht] { display: flex; flex-direction: column; gap: 14px; }
.e2c-ad-tl-row[b-lrgx6aw7ht] { display: flex; gap: 14px; align-items: baseline; }
.e2c-ad-tl-time[b-lrgx6aw7ht] {
    width: 100px;
    flex-shrink: 0;
    font-size: 0.76rem;
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
}
.e2c-ad-tl-msg[b-lrgx6aw7ht] { font-size: 0.88rem; color: var(--text); }

/* ── Status summary ─────────────────────────────────────────── */
.e2c-ad-status-row[b-lrgx6aw7ht] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0;
}
.e2c-ad-total[b-lrgx6aw7ht] { border-top: 1px solid var(--border); margin-top: 6px; padding-top: 14px; }
.e2c-ad-total-val[b-lrgx6aw7ht] {
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--text);
    font-variant-numeric: tabular-nums;
}
.e2c-ad-div[b-lrgx6aw7ht] { margin: 14px 0; }
.e2c-ad-override[b-lrgx6aw7ht] { display: flex; flex-direction: column; gap: 6px; margin-bottom: 12px; }

/* ── Quick actions ──────────────────────────────────────────── */
.e2c-ad-qa[b-lrgx6aw7ht] { display: flex; flex-direction: column; gap: 10px; }
.e2c-ad-qa-btn[b-lrgx6aw7ht] { text-transform: none; font-weight: 600; border-radius: 10px; justify-content: flex-start; }

/* ── Buttons / misc ─────────────────────────────────────────── */
.e2c-ad-btn[b-lrgx6aw7ht] { text-transform: none; font-weight: 600; border-radius: 10px; }
.e2c-ad-wa[b-lrgx6aw7ht] { color: #1B8a4d; border-color: rgba(37, 211, 102, 0.5); }

.e2c-ad-empty[b-lrgx6aw7ht] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 56px 24px;
    text-align: center;
}
.e2c-ad-empty-title[b-lrgx6aw7ht] { font-weight: 700; color: var(--text); margin: 0; }
.e2c-ad-empty-sub[b-lrgx6aw7ht] { color: var(--text-muted); font-size: 0.88rem; margin: 0; }

@media (max-width: 960px) {
    .e2c-ad-grid[b-lrgx6aw7ht] { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
    .e2c-ad-page[b-lrgx6aw7ht] { padding: 16px; }
    .e2c-ad-fields[b-lrgx6aw7ht] { grid-template-columns: 1fr; }
}

/* ── Receipts card (#443) ────────────────────────────────────── */
.e2c-ad-receipt-add[b-lrgx6aw7ht] {
    display: grid;
    gap: .5rem;
    margin-top: .75rem;
    padding-top: .75rem;
    border-top: 1px dashed var(--mud-palette-lines-default);
    justify-items: start;
}

.e2c-ad-card-head.has-count[b-lrgx6aw7ht] {
    display: flex;
    align-items: center;
    gap: 8px;
}
.e2c-ad-rc-count[b-lrgx6aw7ht] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--mud-palette-text-secondary);
    background: var(--mud-palette-action-default-hover);
    border-radius: 999px;
    padding: 2px 9px;
    line-height: 1.5;
}

.e2c-ad-rc-empty[b-lrgx6aw7ht], .e2c-ad-rc-hint[b-lrgx6aw7ht] {
    margin: 0;
    font-size: 0.82rem;
    color: var(--mud-palette-text-secondary);
}
.e2c-ad-rc-hint[b-lrgx6aw7ht] {
    margin-top: .5rem;
    font-style: italic;
}

.e2c-ad-rc-nofile[b-lrgx6aw7ht] {
    font-size: 0.75rem;
    color: var(--mud-palette-text-disabled);
    white-space: nowrap;
}

.e2c-ad-rc-official-sub[b-lrgx6aw7ht] {
    margin: .75rem 0 0;
    padding-top: .75rem;
    border-top: 1px solid var(--mud-palette-lines-default);
    font-size: 0.75rem;
    line-height: 1.45;
    color: var(--mud-palette-text-secondary);
}

/* ── Student correction requests (#424) ─────────────────────── */
.e2c-ad-corr-alert[b-lrgx6aw7ht] { margin-bottom: 16px; border-radius: 12px; }
.e2c-ad-corr-count[b-lrgx6aw7ht] {
    margin-left: 8px;
    font-size: 0.72rem;
    font-weight: 700;
    color: #8a5300;
    background: rgba(243, 145, 37, 0.16);
    border-radius: 999px;
    padding: 2px 8px;
}
.e2c-ad-corrs[b-lrgx6aw7ht] { display: flex; flex-direction: column; gap: 12px; }
.e2c-ad-corr[b-lrgx6aw7ht] {
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 12px;
    padding: 12px 14px;
}
.e2c-ad-corr.is-open[b-lrgx6aw7ht] { border-left: 3px solid #F39125; }
.e2c-ad-corr.is-handled[b-lrgx6aw7ht] { opacity: 0.75; }
.e2c-ad-corr-head[b-lrgx6aw7ht] { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.e2c-ad-corr-field[b-lrgx6aw7ht] { font-weight: 700; color: var(--text); }
.e2c-ad-corr-detail[b-lrgx6aw7ht] { margin: 6px 0 4px; color: var(--text); font-size: 0.9rem; white-space: pre-wrap; }
.e2c-ad-corr-meta[b-lrgx6aw7ht] { margin: 0; color: var(--text-muted); font-size: 0.78rem; }
.e2c-ad-corr-actions[b-lrgx6aw7ht] { display: flex; align-items: center; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
.e2c-ad-corr-actions .mud-input-control[b-lrgx6aw7ht] { flex: 1 1 220px; }

/* ── Quick-action groups (feature upgrade #2) ──────────────────────────────────
   The e-slip actions are grouped under their own heading so "Export PDF" reads as
   what it is — an e-slip export — rather than a general candidate export. */
.e2c-ad-qa-group + .e2c-ad-qa-group[b-lrgx6aw7ht] {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--border, rgba(0, 0, 0, .08));
}

.e2c-ad-qa-group-title[b-lrgx6aw7ht] {
    margin: 0 0 8px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-muted);
}

/* #526 — the deactivate card. Deliberately quiet and last on the page: removing a candidate is
   not part of the daily workflow, and a destructive-looking control competing with the ordinary
   ones invites the misclick it is trying to prevent. */
.e2c-ad-danger[b-lrgx6aw7ht] { margin-top: 20px; border-color: rgba(214, 58, 58, 0.35); }
.e2c-ad-danger-lede[b-lrgx6aw7ht] { font-size: 0.86rem; color: var(--text-muted, #5A6B82); line-height: 1.55; margin: 0 0 14px; }
.e2c-ad-danger-lede strong[b-lrgx6aw7ht] { color: var(--text, #0F1B2D); }
.e2c-ad-danger-actions[b-lrgx6aw7ht] { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
/* /Components/Pages/Admin/Applicants.razor.rz.scp.css */
.e2c-ap-page[b-pgty88wtod] {
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

/* ── Filter bar ─────────────────────────────────────────────── */
.e2c-ap-filters[b-pgty88wtod] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
}

.e2c-ap-search[b-pgty88wtod] {
    width: 260px;
    background: var(--surface);
    border-radius: 10px;
}

.e2c-ap-chips[b-pgty88wtod] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.e2c-ap-chip[b-pgty88wtod] {
    border-radius: 999px;
    text-transform: none;
    font-weight: 600;
    font-size: 0.82rem;
}

.e2c-ap-action[b-pgty88wtod] {
    text-transform: none;
    font-weight: 600;
    border-radius: 10px;
}

/* ── Grid ───────────────────────────────────────────────────── */
.e2c-ap-grid[b-pgty88wtod] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    box-shadow: 0 1px 2px rgba(15, 27, 45, 0.04);
    overflow: hidden;
}

.e2c-ap-grid[b-pgty88wtod]  th {
    font-size: 0.72rem !important;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted) !important;
    font-weight: 700 !important;
    background: var(--surface-2);
}

.e2c-ap-grid[b-pgty88wtod]  .e2c-ap-row {
    cursor: pointer;
}

.e2c-ap-grid[b-pgty88wtod]  td {
    font-size: 0.88rem;
    color: var(--text);
}

.e2c-ap-ref[b-pgty88wtod] {
    font-weight: 700;
    color: #E36A1A;
    text-decoration: underline;
    text-underline-offset: 2px;
    font-variant-numeric: tabular-nums;
}

.e2c-ap-num[b-pgty88wtod] {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

/* ── Empty / loading ────────────────────────────────────────── */
.e2c-ap-empty[b-pgty88wtod] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 56px 24px;
    text-align: center;
}

.e2c-ap-empty-glyph[b-pgty88wtod] { font-size: 2rem; opacity: 0.6; }
.e2c-ap-empty-title[b-pgty88wtod] { font-weight: 700; color: var(--text); margin: 6px 0 0; }
.e2c-ap-empty-sub[b-pgty88wtod] { color: var(--text-muted); font-size: 0.88rem; margin: 0; }

@media (max-width: 700px) {
    .e2c-ap-page[b-pgty88wtod] { padding: 16px; }
    .e2c-ap-search[b-pgty88wtod] { width: 100%; }
}

/* Open student correction request marker (#424). */
.e2c-ap-corr[b-pgty88wtod] {
    display: inline-flex;
    align-items: center;
    margin-left: 6px;
    color: #C46A00;
    vertical-align: middle;
}
/* /Components/Pages/Admin/BulkSignup.razor.rz.scp.css */
/* Bulk sign-up (D17) — admin portal. Brand orange accent #F39125, ink navy #0F1B2D. */

.e2c-bulk-wrap[b-e787alsc6o] { padding: 28px; }
@media (max-width: 720px) { .e2c-bulk-wrap[b-e787alsc6o] { padding: 16px; } }

.e2c-bulk-adminchip[b-e787alsc6o] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #F39125;
    color: #fff;
    border: 1px solid #E36A1A;
    border-radius: 999px;
    padding: 5px 14px;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .02em;
    line-height: 1.2;
}
.e2c-bulk-adminchip[b-e787alsc6o]::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #fff;
}

/* ── Two-column layout ──────────────────────────────────────────── */
.e2c-bulk-grid[b-e787alsc6o] {
    display: grid;
    grid-template-columns: 1.7fr 1fr;
    gap: 22px;
    align-items: start;
}
@media (max-width: 960px) {
    .e2c-bulk-grid[b-e787alsc6o] { grid-template-columns: 1fr; }
}

.e2c-bulk-left[b-e787alsc6o] { display: flex; flex-direction: column; gap: 14px; }

/* ── Student card ───────────────────────────────────────────────── */
[b-e787alsc6o] .e2c-bulk-card {
    padding: 20px;
    border-radius: 16px;
    border-color: var(--border);
}

.e2c-bulk-card-head[b-e787alsc6o] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}
.e2c-bulk-card-headl[b-e787alsc6o] { display: flex; align-items: center; gap: 12px; min-width: 0; }
.e2c-bulk-card-headr[b-e787alsc6o] { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }

.e2c-bulk-num[b-e787alsc6o] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: rgba(243, 145, 37, .14);
    color: #9C5A0F;
    font-weight: 800;
    font-size: .85rem;
    flex-shrink: 0;
}
.e2c-bulk-name[b-e787alsc6o] {
    font-weight: 700;
    font-size: 1.02rem;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.e2c-bulk-permo[b-e787alsc6o] {
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    font-size: .9rem;
    color: var(--text-muted);
}
.e2c-bulk-permo.is-on[b-e787alsc6o] { color: #E36A1A; }

.e2c-bulk-names[b-e787alsc6o] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 14px;
}
@media (max-width: 600px) { .e2c-bulk-names[b-e787alsc6o] { grid-template-columns: 1fr; } }

.e2c-bulk-sublabel[b-e787alsc6o] {
    text-transform: uppercase;
    letter-spacing: .05em;
    font-size: .72rem;
    font-weight: 700;
    color: var(--text-muted);
    margin-bottom: 10px;
}

/* ── Level filter chips ─────────────────────────────────────────── */
.e2c-bulk-filters[b-e787alsc6o] { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.e2c-bulk-fchip[b-e787alsc6o] {
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text-muted);
    border-radius: 999px;
    padding: 5px 14px;
    font-size: .8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all .12s ease;
}
.e2c-bulk-fchip:hover[b-e787alsc6o] { border-color: rgba(243, 145, 37, .5); }
.e2c-bulk-fchip.is-active[b-e787alsc6o] {
    background: #F39125;
    border-color: #F39125;
    color: #fff;
}

/* ── Class option grid ──────────────────────────────────────────── */
.e2c-bulk-optgrid[b-e787alsc6o] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}
@media (max-width: 700px) { .e2c-bulk-optgrid[b-e787alsc6o] { grid-template-columns: repeat(2, 1fr); } }

.e2c-bulk-opt[b-e787alsc6o] {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 9px;
    text-align: left;
    padding: 8px 10px;
    border-radius: 9px;
    border: 1.5px solid var(--border);
    background: var(--surface);
    cursor: pointer;
    transition: all .12s ease;
}
.e2c-bulk-opt:hover[b-e787alsc6o] { border-color: rgba(243, 145, 37, .45); background: rgba(243, 145, 37, .03); }
.e2c-bulk-opt.is-selected[b-e787alsc6o] {
    border-color: #F39125;
    background: rgba(243, 145, 37, .08);
}

.e2c-bulk-opt-iconwrap[b-e787alsc6o] {
    position: relative;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
}
.e2c-bulk-opt-check[b-e787alsc6o] {
    position: absolute;
    top: -5px;
    right: -5px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #F39125;
    border: 2px solid #fff;
    color: #fff;
    font-size: .56rem;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}
.e2c-bulk-opt-icon[b-e787alsc6o] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    font-size: .9rem;
}
.e2c-bulk-opt-text[b-e787alsc6o] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}
.e2c-bulk-opt-name[b-e787alsc6o] {
    font-weight: 700;
    font-size: .78rem;
    color: var(--text);
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.e2c-bulk-opt-sub[b-e787alsc6o] { font-size: .66rem; color: var(--text-muted); }

.e2c-bulk-empty[b-e787alsc6o] {
    padding: 24px;
    text-align: center;
    color: var(--text-muted);
    font-size: .88rem;
    background: var(--surface-2);
    border-radius: 12px;
}

.e2c-bulk-add[b-e787alsc6o] {
    text-transform: none;
    font-weight: 700;
    border-style: dashed;
    border-color: rgba(243, 145, 37, .5);
    color: #E36A1A;
    border-radius: 12px;
    padding: 14px;
}

/* ── Invoice summary (sticky) ───────────────────────────────────── */
.e2c-bulk-right[b-e787alsc6o] { position: sticky; top: 20px; }
@media (max-width: 960px) { .e2c-bulk-right[b-e787alsc6o] { position: static; } }

[b-e787alsc6o] .e2c-bulk-invoice {
    padding: 22px;
    border-radius: 16px;
    border-color: var(--border);
}

.e2c-bulk-inv-head[b-e787alsc6o] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 16px;
}
.e2c-bulk-inv-eyebrow[b-e787alsc6o] {
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: .72rem;
    font-weight: 800;
    color: #163E63;
}
.e2c-bulk-inv-count[b-e787alsc6o] { font-size: .82rem; color: var(--text-muted); }

.e2c-bulk-inv-lines[b-e787alsc6o] { display: flex; flex-direction: column; gap: 8px; }
.e2c-bulk-inv-line[b-e787alsc6o] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-size: .88rem;
    color: var(--text);
}
.e2c-bulk-inv-placeholder[b-e787alsc6o] {
    font-size: .85rem;
    color: var(--text-muted);
    padding: 6px 0;
}
.e2c-bulk-tnum[b-e787alsc6o] { font-variant-numeric: tabular-nums; font-weight: 600; }

.e2c-bulk-inv-div[b-e787alsc6o] { margin: 16px 0; }

.e2c-bulk-inv-total[b-e787alsc6o] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
}
.e2c-bulk-inv-total > span:first-child[b-e787alsc6o] { font-weight: 700; color: var(--text); }
.e2c-bulk-inv-totalval[b-e787alsc6o] {
    font-size: 1.5rem;
    font-weight: 800;
    color: #E36A1A;
}

.e2c-bulk-inv-fields[b-e787alsc6o] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 18px;
}

.e2c-bulk-send[b-e787alsc6o] { text-transform: none; font-weight: 700; border-radius: 12px; }

/* ── Sent confirmation ──────────────────────────────────────────── */
.e2c-bulk-sentcard[b-e787alsc6o] {
    max-width: 540px;
    margin: 40px auto;
    text-align: center;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 40px 32px;
}
.e2c-bulk-sent-check[b-e787alsc6o] {
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    border-radius: 50%;
    background: rgba(111, 174, 63, .16);
    color: #3F7321;
    font-size: 1.8rem;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}
.e2c-bulk-sentcard h2[b-e787alsc6o] { font-size: 1.4rem; font-weight: 800; color: var(--text); margin: 0 0 12px; }
.e2c-bulk-sentcard p[b-e787alsc6o] { color: var(--text-muted); line-height: 1.6; margin: 0 0 24px; }
.e2c-bulk-sentcard p strong[b-e787alsc6o] { color: var(--text); }
.e2c-bulk-sent-actions[b-e787alsc6o] { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* Manual invoice discount (percent / fixed) */
.e2c-bulk-discount[b-e787alsc6o] { display: flex; gap: 10px; margin: 12px 0 4px; }
.e2c-bulk-discount > *[b-e787alsc6o] { flex: 1; }
.e2c-bulk-inv-sub span[b-e787alsc6o] { color: var(--text-muted); }
.e2c-bulk-inv-disc span[b-e787alsc6o] { color: #3F7321; font-weight: 600; }
/* /Components/Pages/Admin/ClassDiscounts.razor.rz.scp.css */
.cdt-page[b-22l7lq9vgw] {
    display: grid;
    gap: 1rem;
    padding: 1.25rem 1.5rem 2rem;
    max-width: 60rem;
}

/* e2c-card has no global style — pad it here (::deep: MudPaper renders the element). */
.cdt-page[b-22l7lq9vgw]  .e2c-card {
    padding: 1.1rem 1.25rem;
    border-radius: 14px;
}

.cdt-loading[b-22l7lq9vgw] {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: 1.25rem;
    color: var(--mud-palette-text-secondary);
}

.cdt-empty[b-22l7lq9vgw] {
    text-align: center;
    padding: 2rem 1.5rem;
    display: grid;
    gap: .4rem;
    justify-items: center;
}

.cdt-empty p[b-22l7lq9vgw] {
    max-width: 34rem;
    color: var(--mud-palette-text-secondary);
    margin: 0;
}

.cdt-table[b-22l7lq9vgw] {
    width: 100%;
    border-collapse: collapse;
}

.cdt-table th[b-22l7lq9vgw] {
    text-align: left;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--mud-palette-text-secondary);
    padding: .55rem .75rem;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.cdt-table td[b-22l7lq9vgw] {
    padding: .65rem .75rem;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.cdt-row-off td[b-22l7lq9vgw] {
    opacity: .55;
}

.cdt-actions-col[b-22l7lq9vgw] {
    text-align: right;
    white-space: nowrap;
    width: 9rem;
}

.cdt-badge[b-22l7lq9vgw] {
    display: inline-block;
    padding: .12rem .55rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 600;
}

.cdt-badge-on[b-22l7lq9vgw] {
    background: rgba(111, 174, 63, 0.14);
    color: #4c7c28;
}

.cdt-badge-off[b-22l7lq9vgw] {
    background: rgba(154, 168, 188, 0.18);
    color: var(--mud-palette-text-secondary);
}

.cdt-note[b-22l7lq9vgw] {
    margin: .8rem .25rem 0;
    font-size: .85rem;
    color: var(--mud-palette-text-secondary);
}

.cdt-editor-h3[b-22l7lq9vgw] {
    margin: 0 0 .75rem;
}

.cdt-editor[b-22l7lq9vgw] {
    /* padding comes from the shared ::deep .e2c-card rule above */
}

.cdt-editor-grid[b-22l7lq9vgw] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: .9rem;
    align-items: center;
}

.cdt-editor-actions[b-22l7lq9vgw] {
    display: flex;
    gap: .6rem;
    margin-top: 1rem;
}
/* /Components/Pages/Admin/ClassSchedule.razor.rz.scp.css */
/* D20 — Class & Schedule Manager. Lives inside the dark portal shell; content area is warm paper. */

.cls-page[b-8vj98e4kjq] {
    padding: 28px 28px 48px;
    max-width: 1180px;
}

.cls-loading[b-8vj98e4kjq] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 40px 0;
    color: var(--text-muted);
    font-size: 14px;
}

/* ── Session list ───────────────────────────────────────────────── */
.cls-list[b-8vj98e4kjq] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

[b-8vj98e4kjq] .cls-card {
    border-radius: 14px;
    padding: 16px 18px;
    background: var(--surface);
}

.cls-card-row[b-8vj98e4kjq] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
}

.cls-card-ico[b-8vj98e4kjq] {
    width: 40px;
    height: 40px;
    border-radius: 11px;
    display: grid;
    place-items: center;
    font-size: 1.15rem;
    flex: 0 0 auto;
}

.cls-card-subject[b-8vj98e4kjq] {
    flex: 1.4 1 220px;
    min-width: 0;
}

.cls-card-name[b-8vj98e4kjq] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    font-size: 14.5px;
    font-weight: 700;
    color: var(--text);
}

.cls-card-sub[b-8vj98e4kjq] {
    font-size: 12.5px;
    color: var(--text-muted);
    margin-top: 4px;
}

.cls-card-zoom[b-8vj98e4kjq] {
    flex: 1 1 150px;
    min-width: 150px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
}

.cls-zoom-ico[b-8vj98e4kjq] {
    opacity: .7;
    flex: 0 0 auto;
}

.cls-zoom-link[b-8vj98e4kjq] {
    color: #1F5A8A;
    word-break: break-all;
}

.cls-zoom-none[b-8vj98e4kjq] {
    color: #9C5A0F;
    font-weight: 600;
}

.cls-card-actions[b-8vj98e4kjq] {
    display: flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
    margin-left: auto;
}

/* ── Empty state ────────────────────────────────────────────────── */
[b-8vj98e4kjq] .cls-empty {
    border-radius: 16px;
    padding: 48px 28px;
    text-align: center;
    background: var(--surface);
}

.cls-empty-ico[b-8vj98e4kjq] {
    font-size: 2.2rem;
    margin-bottom: 8px;
}

.cls-empty h3[b-8vj98e4kjq] {
    margin: 0 0 6px;
    font-size: 17px;
    font-weight: 800;
    color: var(--text);
}

.cls-empty p[b-8vj98e4kjq] {
    margin: 0 auto 18px;
    max-width: 460px;
    font-size: 13.5px;
    color: var(--text-muted);
    line-height: 1.5;
}

/* ── Form mode ──────────────────────────────────────────────────── */
[b-8vj98e4kjq] .cls-form {
    border-radius: 16px;
    padding: 24px 26px;
    max-width: 760px;
    background: var(--surface);
}

.cls-form-title[b-8vj98e4kjq] {
    margin: 0 0 18px;
    font-size: 18px;
    font-weight: 800;
    color: var(--text);
}

.cls-form-grid[b-8vj98e4kjq] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 18px;
}

.cls-form-divider[b-8vj98e4kjq] {
    margin: 22px 0 16px;
}

.cls-form-foot[b-8vj98e4kjq] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 820px) {
    .cls-page[b-8vj98e4kjq] {
        padding: 16px;
    }

    .cls-form-grid[b-8vj98e4kjq] {
        grid-template-columns: 1fr;
    }

    .cls-card-actions[b-8vj98e4kjq] {
        margin-left: 0;
    }
}
/* /Components/Pages/Admin/ClassStudents.razor.rz.scp.css */
.cs-page[b-vskggkczwe] {
    padding: 28px 28px 40px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.cs-alert[b-vskggkczwe] {
    border-radius: 14px;
    font-size: 13.5px;
}

/* Stat cards row */
.cs-stats[b-vskggkczwe] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

/* Panel wrapping the table / empty state */
[b-vskggkczwe] .cs-panel {
    border-radius: 16px;
    overflow: hidden;
    background: var(--surface);
}

/* ── Table ─────────────────────────────────────────────── */
.cs-table-wrap[b-vskggkczwe] {
    width: 100%;
    overflow-x: auto;
}

.cs-table[b-vskggkczwe] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13.5px;
    color: var(--text);
}

.cs-table thead th[b-vskggkczwe] {
    text-align: left;
    padding: 14px 18px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--text-muted);
    background: var(--surface-2);
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}

.cs-table tbody td[b-vskggkczwe] {
    padding: 14px 18px;
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}

.cs-table tbody tr:last-child td[b-vskggkczwe] {
    border-bottom: none;
}

.cs-table tbody tr:hover[b-vskggkczwe] {
    background: rgba(243, 145, 37, .04);
}

.cs-student[b-vskggkczwe] {
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
}

.cs-classes[b-vskggkczwe] {
    color: var(--text-muted);
    min-width: 220px;
}

.cs-since[b-vskggkczwe] {
    color: var(--text-muted);
    white-space: nowrap;
}

.cs-num[b-vskggkczwe] {
    text-align: right;
}

.cs-monthly[b-vskggkczwe] {
    font-weight: 700;
    color: var(--text);
    white-space: nowrap;
}

.cs-actions-col[b-vskggkczwe] {
    text-align: right;
    white-space: nowrap;
}

/* Screen-reader-only label for the otherwise-empty actions column header */
.cs-sr-only[b-vskggkczwe] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ── Empty state ───────────────────────────────────────── */
.cs-empty[b-vskggkczwe] {
    text-align: center;
    padding: 64px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.cs-empty-glyph[b-vskggkczwe] {
    font-size: 40px;
    width: 76px;
    height: 76px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    background: rgba(31, 90, 138, .10);
    margin-bottom: 6px;
}

.cs-empty h3[b-vskggkczwe] {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    color: var(--text);
}

.cs-empty p[b-vskggkczwe] {
    margin: 0 0 10px;
    max-width: 440px;
    font-size: 13.5px;
    line-height: 1.55;
    color: var(--text-muted);
}

@media (max-width: 760px) {
    .cs-page[b-vskggkczwe] {
        padding: 16px;
    }

    .cs-stats[b-vskggkczwe] {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ── #528: toolbar, drill-down and the manual-activation panel ─────────────── */

.cs-toolbar[b-vskggkczwe] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin: 0 0 16px;
}

.cs-search[b-vskggkczwe] { max-width: 320px; flex: 1 1 220px; }
.cs-filters[b-vskggkczwe] { flex: 0 0 auto; }

/* The row is a button: it must look and behave like one for a keyboard user too. */
.cs-row[b-vskggkczwe] { cursor: pointer; }
.cs-row:focus-visible[b-vskggkczwe] {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: -2px;
}
.cs-row.is-open[b-vskggkczwe] { background: var(--mud-palette-action-default-hover); }

.cs-expand-col[b-vskggkczwe] { width: 36px; text-align: center; }

.cs-detail-row > td[b-vskggkczwe] { padding: 0 !important; background: var(--mud-palette-background-grey); }

.cs-detail[b-vskggkczwe] { padding: 16px 20px 20px; }
.cs-detail-head[b-vskggkczwe] { margin-bottom: 12px; }
.cs-detail-head h4[b-vskggkczwe] { margin: 0 0 2px; font-size: 1rem; font-weight: 700; }
.cs-muted[b-vskggkczwe] { color: var(--mud-palette-text-secondary); margin: 0; font-size: .85rem; }
.cs-note[b-vskggkczwe] { margin-top: 10px; }

.cs-lines[b-vskggkczwe] { width: 100%; border-collapse: collapse; font-size: .86rem; }
.cs-lines th[b-vskggkczwe] {
    text-align: left;
    font-weight: 600;
    font-size: .74rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--mud-palette-text-secondary);
    padding: 6px 10px;
    border-bottom: 1px solid var(--mud-palette-divider);
}
.cs-lines td[b-vskggkczwe] {
    padding: 9px 10px;
    border-bottom: 1px solid var(--mud-palette-divider);
    vertical-align: middle;
}
.cs-lines tr:last-child td[b-vskggkczwe] { border-bottom: none; }

/* min-width: 0 + wrap so a long reference cannot overflow its track the way the activity
   log's email column did — same defect, same fix. */
.cs-ref[b-vskggkczwe] {
    font-family: ui-monospace, 'Cascadia Mono', monospace;
    font-size: .76rem;
    min-width: 0;
    overflow-wrap: anywhere;
}

.cs-state[b-vskggkczwe] {
    display: inline-block;
    padding: 2px 9px;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 700;
    white-space: nowrap;
}
.cs-state.is-active[b-vskggkczwe] { background: rgba(111, 174, 63, .16); color: #4E7D24; }
.cs-state.is-pending[b-vskggkczwe] { background: rgba(243, 145, 37, .16); color: #B26A00; }
.cs-state.is-cancelled[b-vskggkczwe] { background: rgba(90, 107, 130, .12); color: #5A6B82; }

.cs-link[b-vskggkczwe] { color: var(--mud-palette-primary); font-weight: 600; text-decoration: none; }
.cs-link:hover[b-vskggkczwe] { text-decoration: underline; }

[b-vskggkczwe] .cs-activate { margin: 4px 0 2px; }
.cs-activate-lead[b-vskggkczwe] { margin: 0 0 10px; font-size: .85rem; line-height: 1.5; }
.cs-activate-actions[b-vskggkczwe] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 10px;
}

@media (max-width: 720px) {
    .cs-search[b-vskggkczwe] { max-width: none; }
    .cs-detail[b-vskggkczwe] { padding: 12px; }
}
/* /Components/Pages/Admin/Council.razor.rz.scp.css */
/* Council submission (D21) — admin portal content. Light content area, orange accent. */

.e2c-council[b-rcdwamwxsb] {
    padding: 28px;
    max-width: 1040px;
    font-family: 'Inter', system-ui, sans-serif;
}

@media (max-width: 720px) {
    .e2c-council[b-rcdwamwxsb] { padding: 16px; }
}

.e2c-council-action[b-rcdwamwxsb] { text-transform: none; }

/* ── Stepper ───────────────────────────────────────────────────── */
.e2c-council-steps[b-rcdwamwxsb] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
    flex-wrap: wrap;
}

.e2c-step[b-rcdwamwxsb] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    border: 1.5px solid var(--border);
    border-radius: 999px;
    padding: 8px 14px;
    cursor: pointer;
    font: inherit;
    transition: all 0.15s ease;
}

.e2c-step:disabled[b-rcdwamwxsb] { cursor: default; }

.e2c-step-dot[b-rcdwamwxsb] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    font-size: 0.65rem;
    font-weight: 700;
    background: rgba(15, 27, 45, 0.12);
    color: #fff;
    transition: all 0.15s ease;
}

.e2c-step-label[b-rcdwamwxsb] { font-size: 0.78rem; font-weight: 700; color: var(--text-muted); }

.e2c-step-active[b-rcdwamwxsb] { background: rgba(243, 145, 37, 0.11); border-color: #F39125; }
.e2c-step-active .e2c-step-dot[b-rcdwamwxsb] { background: #F39125; color: #fff; }
.e2c-step-active .e2c-step-label[b-rcdwamwxsb] { color: #C2620B; }

.e2c-step-done .e2c-step-dot[b-rcdwamwxsb] { background: #6FAE3F; color: #fff; }
.e2c-step-done .e2c-step-label[b-rcdwamwxsb] { color: #3F7321; }

/* ── Card ──────────────────────────────────────────────────────── */
[b-rcdwamwxsb] .e2c-card {
    padding: 24px;
    border-radius: 16px;
    border-color: var(--border);
    background: var(--surface);
}

.e2c-card-head[b-rcdwamwxsb] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.e2c-card-title[b-rcdwamwxsb] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-size: 1.12rem;
    font-weight: 700;
    color: var(--text);
    margin: 0;
}

.e2c-card-sub[b-rcdwamwxsb] { font-size: 0.86rem; color: var(--text-muted); margin: 3px 0 0; }

.e2c-inline-head[b-rcdwamwxsb] {
    font-size: 0.86rem;
    color: var(--text-muted);
    padding-bottom: 14px;
    margin-bottom: 14px;
    border-bottom: 1px solid var(--border);
}

.e2c-inline-head strong[b-rcdwamwxsb] { color: var(--text); font-weight: 700; }

.e2c-link[b-rcdwamwxsb] { text-transform: none; color: #C2620B; font-weight: 600; }

.e2c-alert[b-rcdwamwxsb] { margin-bottom: 18px; border-radius: 12px; }

/* ── Candidate / log list ──────────────────────────────────────── */
.e2c-list[b-rcdwamwxsb] { display: flex; flex-direction: column; gap: 8px; }

.e2c-row[b-rcdwamwxsb] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--surface);
    cursor: pointer;
    transition: border-color 0.12s ease, background 0.12s ease;
}

.e2c-row.is-on[b-rcdwamwxsb] {
    border-color: rgba(243, 145, 37, 0.55);
    background: rgba(243, 145, 37, 0.05);
}

.e2c-row-main[b-rcdwamwxsb] { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.e2c-row-name[b-rcdwamwxsb] { font-weight: 600; color: var(--text); font-size: 0.95rem; }
.e2c-row-meta[b-rcdwamwxsb] { font-size: 0.82rem; color: var(--text-muted); }

.e2c-row-actions[b-rcdwamwxsb] { display: flex; align-items: center; gap: 10px; }

/* ── Mapping table ─────────────────────────────────────────────── */
.e2c-maptable[b-rcdwamwxsb] {
    border: 1px solid var(--border);
    border-radius: 12px;
    overflow: hidden;
    margin-top: 14px;
}

.e2c-maprow[b-rcdwamwxsb] {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 12px;
    padding: 12px 16px;
    border-top: 1px solid var(--border);
    align-items: center;
}

.e2c-maprow:first-child[b-rcdwamwxsb] { border-top: none; }

.e2c-maphead[b-rcdwamwxsb] {
    background: var(--surface-2);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--text-muted);
}

.e2c-mapours[b-rcdwamwxsb] { font-weight: 600; color: var(--text); font-size: 0.9rem; }

.e2c-maptheirs[b-rcdwamwxsb] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    color: #163E63;
}

.e2c-maptheirs.is-await[b-rcdwamwxsb] { color: #9C5A0F; font-style: italic; }

.e2c-map-ic[b-rcdwamwxsb] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    font-size: 0.7rem;
    flex: 0 0 auto;
}

.e2c-map-ok[b-rcdwamwxsb] { background: rgba(111, 174, 63, 0.16); color: #3F7321; }
.e2c-map-await[b-rcdwamwxsb] { background: rgba(243, 145, 37, 0.16); }

/* ── Footers ───────────────────────────────────────────────────── */
.e2c-card-foot[b-rcdwamwxsb] { margin-top: 20px; display: flex; justify-content: flex-end; }
.e2c-foot-split[b-rcdwamwxsb] { justify-content: space-between; }

.e2c-review-copy[b-rcdwamwxsb] {
    font-size: 0.92rem;
    line-height: 1.6;
    color: var(--text-muted);
    margin: 6px 0 18px;
    max-width: 64ch;
}

.e2c-submit[b-rcdwamwxsb] { text-transform: none; background: #6FAE3F; color: #fff; }
.e2c-submit:hover[b-rcdwamwxsb] { background: #5E9633; }

.e2c-foot-note[b-rcdwamwxsb] {
    margin: 16px 0 0;
    font-size: 0.82rem;
    color: var(--text-muted);
}

/* ── Empty state ───────────────────────────────────────────────── */
.e2c-empty[b-rcdwamwxsb] {
    text-align: center;
    padding: 44px 24px;
    color: var(--text-muted);
}

.e2c-empty-glyph[b-rcdwamwxsb] { font-size: 2.2rem; margin-bottom: 10px; }
.e2c-empty-title[b-rcdwamwxsb] { font-weight: 700; color: var(--text); margin: 0 0 6px; font-size: 1rem; }
.e2c-empty-sub[b-rcdwamwxsb] { font-size: 0.88rem; line-height: 1.55; margin: 0 auto; max-width: 46ch; }

@media (max-width: 560px) {
    .e2c-maprow[b-rcdwamwxsb] { grid-template-columns: 1fr; gap: 4px; }
    .e2c-card-head[b-rcdwamwxsb] { flex-direction: column; }
}

/* #463 — in-construction state. */
.e2c-council-wip[b-rcdwamwxsb] { margin-bottom: 18px; border-radius: 12px; }
.e2c-council-table[b-rcdwamwxsb] { overflow-x: auto; }
.e2c-council-table table[b-rcdwamwxsb] { width: 100%; border-collapse: collapse; font-size: .88rem; }
.e2c-council-table th[b-rcdwamwxsb] {
    text-align: left;
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--text-muted);
    padding: 8px 10px;
    border-bottom: 1px solid var(--border);
}
.e2c-council-table td[b-rcdwamwxsb] { padding: 10px; border-bottom: 1px solid var(--border); color: var(--text); }
.e2c-council-table code[b-rcdwamwxsb] { font-size: .82rem; }
/* /Components/Pages/Admin/Courses.razor.rz.scp.css */
/* ── Courses & lessons authoring (D23) ──────────────────────────── */
.crs-page[b-gc9fcjhbq1] { padding: 28px; display: flex; flex-direction: column; gap: 22px; }

@media (max-width: 820px) {
    .crs-page[b-gc9fcjhbq1] { padding: 16px; }
}

.crs-loading[b-gc9fcjhbq1] {
    display: flex; align-items: center; gap: 12px;
    color: var(--text-muted); font-size: 0.92rem; padding: 40px 0;
}

/* ── Empty state ────────────────────────────────────────────────── */
[b-gc9fcjhbq1] .crs-empty {
    text-align: center;
    padding: 56px 28px;
    border-radius: 16px;
    border-style: dashed;
}
.crs-empty-ico[b-gc9fcjhbq1] { font-size: 2.6rem; margin-bottom: 8px; }
.crs-empty h3[b-gc9fcjhbq1] { font-size: 1.2rem; font-weight: 700; color: var(--text); margin: 0 0 8px; }
.crs-empty p[b-gc9fcjhbq1] { color: var(--text-muted); max-width: 460px; margin: 0 auto 20px; font-size: 0.92rem; line-height: 1.55; }

/* ── Course list ────────────────────────────────────────────────── */
.crs-list[b-gc9fcjhbq1] { display: flex; flex-direction: column; gap: 12px; }

[b-gc9fcjhbq1] .crs-card {
    display: flex; align-items: center; gap: 16px;
    padding: 16px 18px;
    border-radius: 14px;
    cursor: pointer;
    transition: transform 0.12s ease, box-shadow 0.12s ease, border-color 0.12s ease;
}
[b-gc9fcjhbq1] .crs-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(15, 27, 45, 0.08);
    border-color: rgba(243, 145, 37, 0.4);
}

.crs-card-ico[b-gc9fcjhbq1] {
    flex: 0 0 46px; width: 46px; height: 46px;
    border-radius: 12px;
    display: grid; place-items: center;
    font-size: 1.4rem;
    color: #fff;
    background: linear-gradient(135deg, #163E63, #F39125);
}

.crs-card-main[b-gc9fcjhbq1] { flex: 1; min-width: 0; }
.crs-card-titlerow[b-gc9fcjhbq1] { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.crs-card-title[b-gc9fcjhbq1] { font-weight: 700; color: var(--text); font-size: 1.02rem; }
.crs-card-sub[b-gc9fcjhbq1] { color: var(--text-muted); font-size: 0.85rem; margin-top: 4px; }

.crs-level[b-gc9fcjhbq1] {
    font-size: 0.66rem; font-weight: 700; letter-spacing: 0.05em;
    padding: 3px 9px; border-radius: 999px;
}
.crs-level-csec[b-gc9fcjhbq1] { background: rgba(31, 90, 138, 0.12); color: #1F5A8A; }
.crs-level-cape[b-gc9fcjhbq1] { background: rgba(111, 174, 63, 0.16); color: #4E7D24; }

/* #392: list nudge — tutored course without a "Meet the teacher" video */
.crs-video-warn[b-gc9fcjhbq1] {
    font-size: 0.66rem; font-weight: 700; letter-spacing: 0.03em;
    padding: 3px 9px; border-radius: 999px; white-space: nowrap;
    background: rgba(217, 140, 15, 0.14); color: #9C5A0F;
}

.crs-card-price[b-gc9fcjhbq1] { text-align: right; white-space: nowrap; }
.crs-price-val[b-gc9fcjhbq1] { font-weight: 700; color: var(--text); font-size: 1.02rem; }
.crs-price-suffix[b-gc9fcjhbq1] { color: var(--text-muted); font-size: 0.78rem; margin-left: 1px; }
.crs-card-arrow[b-gc9fcjhbq1] { color: var(--text-muted); font-size: 1.2rem; font-weight: 700; margin-left: 4px; }

/* ── Editor grids ───────────────────────────────────────────────── */
.crs-editor-grid[b-gc9fcjhbq1] {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 20px;
    align-items: start;
}
.crs-lesson-grid[b-gc9fcjhbq1] {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 20px;
    align-items: start;
}
.crs-lesson-side[b-gc9fcjhbq1] { display: flex; flex-direction: column; gap: 20px; }
.crs-editor-left[b-gc9fcjhbq1] { display: flex; flex-direction: column; gap: 20px; }

[b-gc9fcjhbq1] .crs-panel { padding: 20px; border-radius: 16px; }
.crs-panel-head[b-gc9fcjhbq1] {
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 0.74rem;
    font-weight: 700;
    color: var(--text-muted);
    margin-bottom: 16px;
}
.crs-panel-head-row[b-gc9fcjhbq1] { display: flex; align-items: center; justify-content: space-between; }

.crs-fields[b-gc9fcjhbq1] { display: flex; flex-direction: column; gap: 16px; }

/* ── Upload field ───────────────────────────────────────────────── */
.crs-upload[b-gc9fcjhbq1] {
    display: flex; align-items: center; gap: 12px;
    border: 1.5px dashed var(--border);
    border-radius: 12px;
    padding: 14px 16px;
    cursor: pointer;
    transition: border-color 0.12s ease, background 0.12s ease;
}
.crs-upload:hover[b-gc9fcjhbq1] { border-color: rgba(243, 145, 37, 0.5); background: rgba(243, 145, 37, 0.04); }
.crs-upload-set[b-gc9fcjhbq1] { border-style: solid; border-color: rgba(111, 174, 63, 0.5); background: rgba(111, 174, 63, 0.06); }
.crs-upload-ico[b-gc9fcjhbq1] { font-size: 1.4rem; }
.crs-upload-text[b-gc9fcjhbq1] { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.crs-upload-name[b-gc9fcjhbq1] { font-weight: 600; color: var(--text); font-size: 0.9rem; }
.crs-upload-hint[b-gc9fcjhbq1] { color: var(--text-muted); font-size: 0.78rem; margin-top: 2px; }
.crs-upload-replace[b-gc9fcjhbq1] { color: #1F5A8A; font-weight: 600; font-size: 0.82rem; }
/* #420: a read-only summary of an already-uploaded file — the picker is its own button, so this
   tile is not itself clickable and must not pretend to be. */
.crs-upload-static[b-gc9fcjhbq1] { cursor: default; }
.crs-upload-static:hover[b-gc9fcjhbq1] { border-color: rgba(111, 174, 63, 0.5); background: rgba(111, 174, 63, 0.06); }

/* ── #409/#392: locks, month note, presentation video ───────────── */
.crs-lock-note[b-gc9fcjhbq1] {
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(15, 27, 45, 0.04);
    color: var(--text-muted);
    font-size: 0.82rem;
    padding: 10px 12px;
    margin-bottom: 14px;
}
.crs-month-note[b-gc9fcjhbq1], .crs-video-note[b-gc9fcjhbq1] {
    color: var(--text-muted);
    font-size: 0.82rem;
    line-height: 1.5;
    margin: 0;
}
.crs-field-hint[b-gc9fcjhbq1] {
    color: var(--text-muted);
    font-size: 0.78rem;
    margin: -6px 0 0;
}

/* ── Selling season (client rule, 20 Aug 2026) ───────────────────
   Sits directly under the start-month / months-of-lessons pair and reports what those two
   integers actually do. Boxed rather than a bare hint line because it is the only place the
   admin can see the calendar wrap and the 7-day roll-forward at all. */
.crs-season[b-gc9fcjhbq1] {
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(31, 90, 138, 0.05);
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: -6px;
}
.crs-season-window[b-gc9fcjhbq1] { font-weight: 700; color: var(--text); font-size: 0.9rem; }
.crs-season-note[b-gc9fcjhbq1] {
    color: var(--text-muted);
    font-size: 0.82rem;
    line-height: 1.5;
    margin: 0;
}
/* A refused payment is not a warning about our software — it is the configured season working.
   Amber, not red: nothing is broken, but the admin must not read past it. */
.crs-season-shut[b-gc9fcjhbq1] { color: #9C5A0F; font-weight: 600; }
.crs-season-quiet[b-gc9fcjhbq1] { font-size: 0.78rem; opacity: 0.85; }
.crs-video-actions[b-gc9fcjhbq1] { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

/* ── Lessons list ───────────────────────────────────────────────── */
.crs-lessons-empty[b-gc9fcjhbq1] {
    border: 1.5px dashed var(--border);
    border-radius: 12px;
    padding: 22px;
    text-align: center;
    color: var(--text-muted);
    font-size: 0.88rem;
}

.crs-lessons[b-gc9fcjhbq1] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.crs-lesson[b-gc9fcjhbq1] {
    display: flex; align-items: center; gap: 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 12px 14px;
}

.crs-lesson-reorder[b-gc9fcjhbq1] { display: flex; flex-direction: column; gap: 2px; }
.crs-reorder-btn[b-gc9fcjhbq1] {
    border: none; background: transparent; cursor: pointer;
    color: var(--text-muted); font-size: 0.7rem; line-height: 1; padding: 2px 4px;
    border-radius: 4px;
}
.crs-reorder-btn:hover:not(:disabled)[b-gc9fcjhbq1] { background: rgba(15, 27, 45, 0.06); color: var(--text); }
.crs-reorder-btn:disabled[b-gc9fcjhbq1] { opacity: 0.3; cursor: default; }

.crs-lesson-seq[b-gc9fcjhbq1] {
    flex: 0 0 26px; width: 26px; height: 26px;
    border-radius: 50%;
    display: grid; place-items: center;
    background: rgba(243, 145, 37, 0.14);
    color: #9C5A0F;
    font-weight: 700; font-size: 0.82rem;
}

.crs-lesson-main[b-gc9fcjhbq1] { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.crs-lesson-title[b-gc9fcjhbq1] {
    font-weight: 600; color: var(--text); font-size: 0.94rem;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.crs-lesson-meta[b-gc9fcjhbq1] { color: var(--text-muted); font-size: 0.8rem; margin-top: 2px; }

.crs-tier[b-gc9fcjhbq1] {
    font-size: 0.68rem; font-weight: 700; letter-spacing: 0.03em;
    padding: 4px 10px; border-radius: 999px; white-space: nowrap;
}
.crs-tier-free[b-gc9fcjhbq1] { background: rgba(31, 90, 138, 0.12); color: #163E63; }
.crs-tier-enrolled[b-gc9fcjhbq1] { background: rgba(15, 27, 45, 0.07); color: var(--text-muted); }

.crs-lesson-actions[b-gc9fcjhbq1] { display: flex; align-items: center; gap: 2px; }

/* ── Materials list ─────────────────────────────────────────────── */
.crs-materials[b-gc9fcjhbq1] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.crs-material[b-gc9fcjhbq1] {
    display: flex; align-items: center; gap: 10px;
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 8px 12px;
}
.crs-material-ico[b-gc9fcjhbq1] { font-size: 1.1rem; }
.crs-material-name[b-gc9fcjhbq1] { flex: 1; min-width: 0; color: var(--text); font-size: 0.88rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 1100px) {
    .crs-editor-grid[b-gc9fcjhbq1], .crs-lesson-grid[b-gc9fcjhbq1] { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
    [b-gc9fcjhbq1] .crs-card { flex-wrap: wrap; }
}

/* #446 — route to the one screen that owns the schedule. */
.crs-schedule-link[b-gc9fcjhbq1] { margin-top: -6px; }

/* ── #489 · list filter bar ────────────────────────────────────────────────── */
/* ::deep, because MudPaper renders the element — without it the scoped attribute never lands on
   the card and none of this applies, which is why it looked unpadded. Padding matches .crs-card
   (16px 18px) so the toolbar reads as part of the same stack, plus a little extra top room: the
   dense outlined inputs float their labels above the field box and 12px clipped them.
   No margin-bottom — .crs-page is a flex column with gap: 22px and the two would compound. */
[b-gc9fcjhbq1] .crs-filterbar {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 20px 18px 16px;
    border-radius: 14px;
}

[b-gc9fcjhbq1] .crs-filter-search { flex: 1 1 260px; min-width: 200px; }
[b-gc9fcjhbq1] .crs-filter-select { flex: 0 0 170px; }

@media (max-width: 640px) {
    [b-gc9fcjhbq1] .crs-filter-search,
    [b-gc9fcjhbq1] .crs-filter-select { flex: 1 1 100%; }
}
/* /Components/Pages/Admin/CxcData.razor.rz.scp.css */
/* ── CXC data manager — single source of truth for subjects, centres & fees ── */

.cxd-sr-only[b-68xarcem5h] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.cxd-page[b-68xarcem5h] {
    padding: 28px 28px 48px;
    /* Full available width (client request): tables use the viewport and only develop their
       own horizontal scroll when the screen is genuinely narrower than the columns. */
    max-width: none;
}

.cxd-loading[b-68xarcem5h] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 40px 0;
    color: var(--text-muted);
    font-size: 14px;
}

/* ── Tab strip (mirrors Site Content) ───────────────────────────── */
.cxd-tabs[b-68xarcem5h] {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 22px;
}

.cxd-tab[b-68xarcem5h] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 10px 16px 12px;
    margin-bottom: -1px;
    cursor: pointer;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--text-muted);
    transition: color .12s ease, border-color .12s ease;
}

.cxd-tab:hover[b-68xarcem5h] {
    color: var(--text);
}

.cxd-tab-active[b-68xarcem5h] {
    color: var(--text);
    border-bottom-color: #F39125;
}

.cxd-tab-ico[b-68xarcem5h] {
    font-size: 1rem;
}

.cxd-tab-count[b-68xarcem5h] {
    font-size: 11px;
    font-weight: 700;
    color: var(--text-muted);
    background: rgba(15, 27, 45, .08);
    border-radius: 999px;
    padding: 1px 8px;
    min-width: 20px;
    text-align: center;
}

.cxd-tab-active .cxd-tab-count[b-68xarcem5h] {
    color: #9C5A0F;
    background: rgba(243, 145, 37, .16);
}

/* ── Level filter pills ─────────────────────────────────────────── */
.cxd-pills[b-68xarcem5h] {
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
}

.cxd-pill[b-68xarcem5h] {
    border: 1px solid var(--border);
    background: var(--surface);
    border-radius: 999px;
    padding: 5px 14px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--text-muted);
    cursor: pointer;
    transition: color .12s ease, border-color .12s ease, background .12s ease;
}

.cxd-pill:hover[b-68xarcem5h] {
    color: var(--text);
}

.cxd-pill.is-active[b-68xarcem5h] {
    color: #9C5A0F;
    border-color: rgba(243, 145, 37, .5);
    background: rgba(243, 145, 37, .12);
}

/* ── Table card (MudPaper root → ::deep) ────────────────────────── */
[b-68xarcem5h] .cxd-card {
    border-radius: 16px;
    border-color: var(--border);
    padding: 0;
    overflow: hidden;
    background: var(--surface);
}

.cxd-table-scroll[b-68xarcem5h] {
    overflow-x: auto;
}

.cxd-table[b-68xarcem5h] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
}

.cxd-table thead th[b-68xarcem5h] {
    text-align: left;
    padding: 12px 18px;
    color: var(--text-muted);
    font-weight: 700;
    font-size: 0.74rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    background: var(--surface-2);
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}

.cxd-table tbody td[b-68xarcem5h] {
    padding: 13px 18px;
    color: var(--text);
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}

.cxd-table tbody tr:last-child td[b-68xarcem5h] {
    border-bottom: none;
}

.cxd-table tbody tr:hover[b-68xarcem5h] {
    background: rgba(243, 145, 37, 0.035);
}

/* Retired rows stay listed but visibly dimmed */
.cxd-row-off td[b-68xarcem5h] {
    opacity: .55;
}

.cxd-row-off td.cxd-actions-cell[b-68xarcem5h] {
    opacity: 1;
}

/* Subject cell: coloured icon tile + name + code */
.cxd-subject[b-68xarcem5h] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 220px;
}

.cxd-ico-tile[b-68xarcem5h] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    font-size: 1.1rem;
    flex: 0 0 auto;
}

.cxd-name[b-68xarcem5h] {
    display: block;
    font-weight: 700;
    color: var(--text);
}

.cxd-code[b-68xarcem5h] {
    display: block;
    margin-top: 2px;
    color: var(--text-muted);
    font-size: 0.78rem;
    font-variant-numeric: tabular-nums;
    letter-spacing: .04em;
}

.cxd-sched[b-68xarcem5h] {
    white-space: nowrap;
}

.cxd-muted[b-68xarcem5h] {
    color: var(--text-muted);
    font-size: 0.82rem;
}

.cxd-flags[b-68xarcem5h] {
    white-space: nowrap;
}

.cxd-chip[b-68xarcem5h] {
    display: inline-block;
    font-size: 11.5px;
    font-weight: 700;
    color: #1F5A8A;
    background: rgba(31, 90, 138, .12);
    border-radius: 999px;
    padding: 2px 10px;
    margin-right: 6px;
}

.cxd-chip-oral[b-68xarcem5h] {
    color: #9C5A0F;
    background: rgba(243, 145, 37, .16);
}

/* #404 — candidate-type availability restriction (e.g. "Resit only") */
.cxd-chip-restrict[b-68xarcem5h] {
    color: #B4530F;
    background: rgba(227, 106, 26, .14);
}

.cxd-chip-default[b-68xarcem5h] {
    color: #3F7321;
    background: rgba(111, 174, 63, .16);
}

.cxd-th-num[b-68xarcem5h],
.cxd-num[b-68xarcem5h] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.cxd-th-actions[b-68xarcem5h] {
    width: 1%;
}

.cxd-row-actions[b-68xarcem5h] {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    white-space: nowrap;
}

/* Footer note */
.cxd-footnote[b-68xarcem5h] {
    padding: 16px 18px;
    border-top: 1px solid var(--border);
    color: var(--text-muted);
    font-size: 0.85rem;
    line-height: 1.5;
}

/* Empty / loading states */
.cxd-empty[b-68xarcem5h] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
    padding: 48px 24px;
    color: var(--text-muted);
}

.cxd-empty-icon[b-68xarcem5h] {
    font-size: 2.2rem;
}

.cxd-empty h3[b-68xarcem5h] {
    margin: 0;
    color: var(--text);
    font-size: 1.05rem;
}

.cxd-empty p[b-68xarcem5h] {
    margin: 0;
    max-width: 460px;
    font-size: 0.88rem;
    line-height: 1.5;
}

/* ── Fees tab ───────────────────────────────────────────────────── */
.cxd-fee-grid[b-68xarcem5h] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    align-items: start;
}

[b-68xarcem5h] .cxd-fee-card {
    padding: 22px 24px;
    overflow: visible;
}

.cxd-fee-head[b-68xarcem5h] {
    margin-bottom: 16px;
}

.cxd-fee-title[b-68xarcem5h] {
    margin: 0 0 4px;
    font-size: 16px;
    font-weight: 800;
    color: var(--text);
}

.cxd-fee-sub[b-68xarcem5h] {
    margin: 0;
    font-size: 12.5px;
    color: var(--text-muted);
}

.cxd-fee-fields[b-68xarcem5h] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.cxd-fee-formula[b-68xarcem5h] {
    margin: 16px 0 0;
    padding: 10px 12px;
    border-radius: 10px;
    background: var(--surface-2);
    color: var(--text-muted);
    font-size: 0.8rem;
    line-height: 1.45;
    font-variant-numeric: tabular-nums;
}

.cxd-fee-foot[b-68xarcem5h] {
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
}

/* ── Dialogs ────────────────────────────────────────────────────── */
.cxd-dlg-title[b-68xarcem5h] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
}

.cxd-dlg-grid[b-68xarcem5h] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px 16px;
}

.cxd-span2[b-68xarcem5h] {
    grid-column: span 2;
}

.cxd-dlg-switch[b-68xarcem5h] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.86rem;
    color: var(--text);
}

.cxd-color-field[b-68xarcem5h] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cxd-color-field > :first-child[b-68xarcem5h] {
    flex: 1 1 auto;
}

.cxd-swatch[b-68xarcem5h] {
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    border: 1px solid var(--border);
}

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 900px) {
    .cxd-fee-grid[b-68xarcem5h] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 820px) {
    .cxd-page[b-68xarcem5h] {
        padding: 16px;
    }
}

@media (max-width: 560px) {
    .cxd-dlg-grid[b-68xarcem5h] {
        grid-template-columns: 1fr;
    }

    .cxd-span2[b-68xarcem5h] {
        grid-column: span 1;
    }
}
/* /Components/Pages/Admin/Dashboard.razor.rz.scp.css */
/* ── Dashboard layout ─────────────────────────────────────────────── */
.e2c-dash[b-dsk3kidqbc] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    /* Mockup AdminFrame wraps content in a 28px gutter below the full-bleed top bar (admin.jsx). */
    padding: 28px;
}

.e2c-dash-stats[b-dsk3kidqbc] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

.e2c-dash-grid[b-dsk3kidqbc] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 18px;
    align-items: start;
}

/* ── Card shell ───────────────────────────────────────────────────── */
[b-dsk3kidqbc] .e2c-card {
    padding: 22px;
    border-radius: 16px;
    border-color: var(--border);
    background: var(--surface);
}

/* ── Applications · last 30 days area chart ───────────────────────── */
.e2c-chart[b-dsk3kidqbc] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.e2c-chart-svg[b-dsk3kidqbc] {
    display: block;
    width: 100%;
    height: 180px;
}

.e2c-chart-axis[b-dsk3kidqbc] {
    stroke: var(--border-strong);
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}

.e2c-chart-ticks[b-dsk3kidqbc] {
    display: flex;
    justify-content: space-between;
    font-size: 0.72rem;
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
}

.e2c-chart-empty[b-dsk3kidqbc] {
    position: relative;
    display: grid;
    place-items: center;
}
.e2c-chart-empty .e2c-chart-svg[b-dsk3kidqbc] { grid-area: 1 / 1; opacity: 0.6; }
.e2c-chart-flat[b-dsk3kidqbc] {
    grid-area: 1 / 1;
    font-size: 0.84rem;
    color: var(--text-muted);
    margin: 0;
    text-align: center;
}

.e2c-card-head[b-dsk3kidqbc] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.e2c-card-title[b-dsk3kidqbc] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: 15px;
    color: var(--text);
    margin: 0;
}

.e2c-card-sub[b-dsk3kidqbc] {
    font-size: 0.82rem;
    color: var(--text-muted);
    margin: 4px 0 0;
}

.e2c-card-link[b-dsk3kidqbc] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--brand-orange-deep);
    text-decoration: none;
    white-space: nowrap;
}
.e2c-card-link:hover[b-dsk3kidqbc] { text-decoration: underline; }

/* ── Pending verification queue ───────────────────────────────────── */
.e2c-queue[b-dsk3kidqbc], .e2c-tasks[b-dsk3kidqbc] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.e2c-queue-row[b-dsk3kidqbc] { border-top: 1px solid var(--border); }
.e2c-queue-row:first-child[b-dsk3kidqbc] { border-top: none; }

/* Today's queue (tasks) rows carry the same hairline dividers as the verification queue. */
.e2c-tasks > li + li[b-dsk3kidqbc] { border-top: 1px solid var(--border); }

.e2c-queue-link[b-dsk3kidqbc], .e2c-task-row[b-dsk3kidqbc] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 4px;
    text-decoration: none;
    color: inherit;
    border-radius: 10px;
    transition: background 0.12s ease;
}
.e2c-queue-link:hover[b-dsk3kidqbc], .e2c-task-row:hover[b-dsk3kidqbc] { background: rgba(243, 145, 37, 0.06); }

.e2c-queue-icon[b-dsk3kidqbc], .e2c-task-icon[b-dsk3kidqbc] {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    font-size: 1rem;
    background: rgba(243, 145, 37, 0.14);
}

.e2c-queue-body[b-dsk3kidqbc], .e2c-task-body[b-dsk3kidqbc] {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
    flex: 1;
    min-width: 0;
}

.e2c-queue-title[b-dsk3kidqbc], .e2c-task-title[b-dsk3kidqbc] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--text);
}

.e2c-queue-meta[b-dsk3kidqbc], .e2c-task-sub[b-dsk3kidqbc] {
    font-size: 0.78rem;
    color: var(--text-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.e2c-queue-trail[b-dsk3kidqbc] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
}

.e2c-queue-arrow[b-dsk3kidqbc], .e2c-task-arrow[b-dsk3kidqbc] {
    color: var(--text-muted);
    font-size: 1.1rem;
}

/* ── Recent registrations table ───────────────────────────────────── */
.e2c-table-wrap[b-dsk3kidqbc] { overflow-x: auto; }

.e2c-table[b-dsk3kidqbc] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.86rem;
}

.e2c-table thead th[b-dsk3kidqbc] {
    text-align: left;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted);
    padding: 0 14px 10px;
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}

.e2c-table tbody td[b-dsk3kidqbc] {
    padding: 12px 14px;
    border-bottom: 1px solid var(--border);
    color: var(--text);
    vertical-align: middle;
}
.e2c-table tbody tr:last-child td[b-dsk3kidqbc] { border-bottom: none; }
.e2c-table tbody tr:hover[b-dsk3kidqbc] { background: var(--surface-2); }

.e2c-th-r[b-dsk3kidqbc], .e2c-td-r[b-dsk3kidqbc] { text-align: right; }

.e2c-ref[b-dsk3kidqbc] {
    font-family: ui-monospace, 'SFMono-Regular', Menlo, monospace;
    font-size: 0.8rem;
    color: var(--brand-blue);
    font-weight: 600;
}

.e2c-strong[b-dsk3kidqbc] { font-weight: 600; color: var(--text); }
.e2c-muted[b-dsk3kidqbc] { color: var(--text-muted); font-variant-numeric: tabular-nums; }

/* ── Empty states ─────────────────────────────────────────────────── */
.e2c-empty[b-dsk3kidqbc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 36px 16px;
    gap: 4px;
}
.e2c-empty-glyph[b-dsk3kidqbc] { font-size: 1.8rem; }
.e2c-empty-title[b-dsk3kidqbc] { font-weight: 700; color: var(--text); margin: 6px 0 0; }
.e2c-empty-sub[b-dsk3kidqbc] { font-size: 0.84rem; color: var(--text-muted); margin: 0; max-width: 320px; }

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 820px) {
    .e2c-dash[b-dsk3kidqbc] { padding: 16px; }
    .e2c-dash-grid[b-dsk3kidqbc] { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
    .e2c-dash-stats[b-dsk3kidqbc] { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 420px) {
    .e2c-dash-stats[b-dsk3kidqbc] { grid-template-columns: 1fr; }
}

/* Needs-attention: nothing outstanding, and the standing status line. */
.e2c-tasks-clear[b-dsk3kidqbc], .e2c-tasks-note[b-dsk3kidqbc] {
    margin: 0;
    font-size: 0.82rem;
    color: var(--text-muted);
}
.e2c-tasks-note[b-dsk3kidqbc] {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
}
/* /Components/Pages/Admin/EmailTemplates.razor.rz.scp.css */
.et-page[b-7elqkqmmxd] {
    padding: 28px 28px 56px;
}

@media (max-width: 820px) {
    .et-page[b-7elqkqmmxd] { padding: 16px; }
}

/* ── loading / empty ─────────────────────────────────────────── */
.et-loading[b-7elqkqmmxd] {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--text-muted);
    font-weight: 600;
    padding: 40px 4px;
}

[b-7elqkqmmxd] .et-empty {
    padding: 48px 32px;
    border-radius: 16px;
    text-align: center;
}

.et-empty-ico[b-7elqkqmmxd] {
    font-size: 40px;
    margin-bottom: 8px;
}

.et-empty h3[b-7elqkqmmxd] {
    margin: 0 0 6px;
    font-size: 18px;
    font-weight: 700;
    color: var(--text);
}

.et-empty p[b-7elqkqmmxd] {
    margin: 0 auto;
    max-width: 460px;
    color: var(--text-muted);
    font-size: 14px;
    line-height: 1.55;
}

/* ── layout ──────────────────────────────────────────────────── */
.et-grid[b-7elqkqmmxd] {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 20px;
    align-items: start;
}

@media (max-width: 880px) {
    .et-grid[b-7elqkqmmxd] {
        grid-template-columns: 1fr;
    }
}

.et-right[b-7elqkqmmxd] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 0;
}

/* ── left list ───────────────────────────────────────────────── */
[b-7elqkqmmxd] .et-list {
    border-radius: 16px;
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.et-list-row[b-7elqkqmmxd] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
    text-align: left;
    background: transparent;
    border: 0;
    border-radius: 10px;
    padding: 11px 12px;
    cursor: pointer;
    transition: background .12s ease;
}

.et-list-row:hover[b-7elqkqmmxd] {
    background: rgba(15, 27, 45, .04);
}

.et-list-row--sel[b-7elqkqmmxd] {
    background: rgba(243, 145, 37, .12);
}

.et-dot[b-7elqkqmmxd] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    margin-top: 5px;
    flex: 0 0 auto;
}

.et-list-text[b-7elqkqmmxd] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.et-list-name[b-7elqkqmmxd] {
    font-size: 14px;
    font-weight: 600;
    color: var(--text);
}

.et-list-row--sel .et-list-name[b-7elqkqmmxd] {
    font-weight: 700;
    color: var(--text);
}

.et-list-trigger[b-7elqkqmmxd] {
    font-size: 12px;
    color: var(--text-muted);
}

/* ── editor card ─────────────────────────────────────────────── */
[b-7elqkqmmxd] .et-editor {
    border-radius: 16px;
    padding: 22px 24px;
}

.et-editor-head[b-7elqkqmmxd] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.et-editor-title[b-7elqkqmmxd] {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: var(--text);
}

.et-editor-sub[b-7elqkqmmxd] {
    margin: 3px 0 0;
    font-size: 13px;
    color: var(--text-muted);
}

.et-toggle[b-7elqkqmmxd] {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    cursor: pointer;
    flex: 0 0 auto;
}

.et-toggle-label[b-7elqkqmmxd] {
    font-size: 13px;
    font-weight: 700;
}

.et-divider[b-7elqkqmmxd] {
    margin: 18px 0;
}

.et-body-wrap[b-7elqkqmmxd] {
    margin-top: 16px;
}

/* ── merge-tag chips ─────────────────────────────────────────── */
.et-tags[b-7elqkqmmxd] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.et-tag[b-7elqkqmmxd] {
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 12.5px;
    color: var(--text);
    background: rgba(31, 90, 138, .08);
    border: 1px solid rgba(31, 90, 138, .18);
    border-radius: 8px;
    padding: 5px 10px;
    cursor: pointer;
    transition: background .12s ease, border-color .12s ease;
}

.et-tag:hover[b-7elqkqmmxd] {
    background: rgba(243, 145, 37, .14);
    border-color: rgba(243, 145, 37, .4);
    color: #9C5A0F;
}

/* Universal tags read quieter than the trigger's own — they are always true, never the point. */
.et-tag--universal[b-7elqkqmmxd] {
    background: rgba(90, 107, 130, .07);
    border-color: rgba(90, 107, 130, .18);
    color: var(--text-muted);
}

.et-tag-group-label[b-7elqkqmmxd] {
    margin-top: 14px;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: var(--text-muted);
}

.et-tag-group-label + .et-tags[b-7elqkqmmxd] {
    margin-top: 7px;
}

/* Unresolved-tag warning: a blank in a customer's inbox is invisible, so this must not be. */
[b-7elqkqmmxd] .et-warn {
    margin-top: 16px;
    font-size: 13px;
    line-height: 1.55;
}

.et-warn-tags[b-7elqkqmmxd] {
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 12.5px;
    word-break: break-word;
}

.et-foot[b-7elqkqmmxd] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

/* ── live preview (framed-email look) ────────────────────────── */
[b-7elqkqmmxd] .et-preview {
    border-radius: 16px;
    overflow: hidden;
}

.et-preview-strip[b-7elqkqmmxd] {
    padding: 10px 18px;
    border-bottom: 1px solid var(--border);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .08em;
    font-weight: 700;
    color: var(--text-muted);
}

.et-preview-note[b-7elqkqmmxd] {
    text-transform: none;
    letter-spacing: 0;
    font-weight: 500;
}

.et-preview-note code[b-7elqkqmmxd] {
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 10.5px;
}

.et-preview-backdrop[b-7elqkqmmxd] {
    padding: 22px;
    background: var(--surface-2);
}

.et-preview-mail[b-7elqkqmmxd] {
    max-width: 520px;
    margin: 0 auto;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    overflow: hidden;
}

.et-preview-head[b-7elqkqmmxd] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 24px;
    background: linear-gradient(135deg, #163E63, #E36A1A);
    color: #fff;
}

.et-preview-logo[b-7elqkqmmxd] {
    height: 28px;
    width: auto;
    display: block;
}

.et-preview-brand[b-7elqkqmmxd] {
    font-weight: 800;
    letter-spacing: .06em;
    font-size: 13px;
}

.et-preview-body[b-7elqkqmmxd] {
    padding: 24px;
}

.et-preview-label[b-7elqkqmmxd] {
    font-size: 12px;
    color: var(--text-muted);
    margin-bottom: 4px;
}

.et-preview-subject[b-7elqkqmmxd] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 16px;
}

.et-preview-text[b-7elqkqmmxd] {
    white-space: pre-wrap;
    font-size: 13.5px;
    line-height: 1.65;
    color: var(--text);
}

/* ── Send log (#16) ─────────────────────────────────────────────────────────
   Proof that mail is actually leaving: what was queued, what left, what failed. */

/* ::deep is REQUIRED and its absence is why this card sat flush against the editor above it.
   .et-log is applied to a MudPaper, and MudBlazor renders that element itself, so it never
   carries this component's CSS-isolation scope attribute — the rule compiled to
   `.et-log[b-xxxxxxxxxx]` and matched nothing, taking the margin-top with it. The padding
   looked fine only because the global `.e2c-card` (wwwroot/app.css) supplies its own.
   Every other MudPaper class in this file already does this: ::deep .et-list, .et-editor,
   .et-warn, .et-preview, .et-empty. This one was missed.
   The CHILDREN (.et-log-head, .et-log-table, …) need no ::deep: they are rendered by this
   component into the MudPaper's ChildContent, so they do carry the scope attribute. */
[b-7elqkqmmxd] .et-log { padding: 18px 20px; margin-top: 24px; }

.et-log-head[b-7elqkqmmxd] { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 12px; }
.et-log-head > div:first-child[b-7elqkqmmxd] { flex: 1; }
.et-log-title[b-7elqkqmmxd] { font-size: 1rem; font-weight: 700; margin: 0 0 2px; }
.et-log-sub[b-7elqkqmmxd] { margin: 0; font-size: .82rem; color: var(--mud-palette-text-secondary); line-height: 1.5; }
.et-log-empty[b-7elqkqmmxd] { font-size: .86rem; color: var(--mud-palette-text-secondary); margin: 6px 0 0; }

.et-log-scroll[b-7elqkqmmxd] { overflow-x: auto; }
.et-log-table[b-7elqkqmmxd] { width: 100%; border-collapse: collapse; font-size: .84rem; }
.et-log-table th[b-7elqkqmmxd] {
    text-align: left; font-size: .68rem; font-weight: 800; text-transform: uppercase;
    letter-spacing: .07em; color: var(--mud-palette-text-secondary);
    padding: 6px 10px; border-bottom: 1px solid var(--mud-palette-divider); white-space: nowrap;
}
.et-log-table td[b-7elqkqmmxd] { padding: 8px 10px; border-bottom: 1px solid var(--mud-palette-divider); vertical-align: top; }
.et-log-to[b-7elqkqmmxd], .et-log-ref[b-7elqkqmmxd] { font-family: ui-monospace, 'Cascadia Mono', monospace; font-size: .78rem; }
.et-log-when[b-7elqkqmmxd] { white-space: nowrap; color: var(--mud-palette-text-secondary); }

.et-log-badge[b-7elqkqmmxd] {
    display: inline-block; font-size: .66rem; font-weight: 800; text-transform: uppercase;
    letter-spacing: .05em; padding: 2px 7px; border-radius: 999px; white-space: nowrap;
}
.et-log-badge.is-sent[b-7elqkqmmxd] { background: rgba(111,174,63,.16); color: #4E7D24; }
.et-log-badge.is-failed[b-7elqkqmmxd] { background: rgba(210,69,69,.14); color: #C33A3A; }
.et-log-badge.is-queued[b-7elqkqmmxd] { background: rgba(243,145,37,.16); color: #B26A00; }
.et-log-badge.is-skip[b-7elqkqmmxd] { background: rgba(90,107,130,.12); color: #5A6B82; }

.et-log-err[b-7elqkqmmxd] {
    display: inline-block; margin-left: 6px; font-size: .7rem; font-weight: 700;
    color: #C33A3A; cursor: help; text-decoration: underline dotted;
}
/* /Components/Pages/Admin/ESlips.razor.rz.scp.css */
/* ── E-Slips management (D5) ─────────────────────────────────────── */

/* Screen-reader-only label for the otherwise-empty actions column header */
.esl-sr-only[b-svkry139p5] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.esl-page[b-svkry139p5] {
    display: flex;
    flex-direction: column;
    gap: 22px;
    padding: 28px;
    max-width: 1280px;
}

@media (max-width: 820px) {
    .esl-page[b-svkry139p5] { padding: 16px; gap: 18px; }
}

/* Upload section heading */
.esl-uploads-head[b-svkry139p5] { display: flex; flex-direction: column; gap: 4px; }
.esl-uploads-head h2[b-svkry139p5] {
    margin: 0;
    font-weight: 800;
    font-size: 1.1rem;
    color: var(--text);
}
.esl-uploads-head p[b-svkry139p5] {
    margin: 0;
    font-size: 0.86rem;
    line-height: 1.45;
    color: var(--text-muted);
}

/* Upload dropzones */
.esl-uploads[b-svkry139p5] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

@media (max-width: 820px) { .esl-uploads[b-svkry139p5] { grid-template-columns: 1fr; } }

/* MudFileUpload wrapper around each dropzone — stretch to fill its grid cell */
.esl-dropwrap[b-svkry139p5] { width: 100%; margin: 0; }
.esl-dropwrap[b-svkry139p5]  .mud-input-control,
.esl-dropwrap[b-svkry139p5]  .mud-input-control-input-container,
.esl-dropwrap[b-svkry139p5]  label { width: 100%; margin: 0; display: block; cursor: pointer; }

/* Each CXC source file gets its own explanatory card (MudPaper → ::deep for the shell). */
[b-svkry139p5] .esl-upcard {
    display: flex;
    flex-direction: column;
    padding: 18px 20px 20px;
    border-radius: 14px;
    background: var(--surface);
    transition: border-color .15s ease, box-shadow .15s ease;
}
[b-svkry139p5] .esl-upcard:hover { border-color: #F39125; box-shadow: 0 2px 14px rgba(243, 145, 37, .10); }

.esl-upcardhead[b-svkry139p5] { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.esl-upicon[b-svkry139p5] {
    width: 36px; height: 36px;
    border-radius: 10px;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 1.1rem; line-height: 1; flex: 0 0 auto;
    background: var(--brand-blue-pale); color: var(--brand-blue);
}
.esl-upcardhead h3[b-svkry139p5] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--text); }

.esl-updesc[b-svkry139p5] { margin: 0 0 8px; color: var(--text-muted); font-size: 0.85rem; line-height: 1.5; }
.esl-upexample[b-svkry139p5] {
    margin: 0 0 8px;
    color: var(--text-muted);
    font-size: 0.78rem;
    font-style: italic;
    line-height: 1.4;
}
.esl-upfmt[b-svkry139p5] {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--text-muted);
}

.esl-upbtnrow[b-svkry139p5] { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
[b-svkry139p5] .esl-upbtn { text-transform: none; font-weight: 600; }
.esl-upfile[b-svkry139p5] {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.78rem;
    font-weight: 600;
    color: #3F7321;
}

/* Timetable parse outcome under the uploaded-file name (#412) */
.esl-upnote[b-svkry139p5] {
    font-size: 0.74rem;
    color: var(--text-muted);
}

.esl-upnote-bad[b-svkry139p5] { color: #A63A2B; font-weight: 600; }

/* Table card */
[b-svkry139p5] .esl-table-card {
    border-radius: 16px;
    padding: 0;
    overflow: hidden;
    background: var(--surface);
}

.esl-table-scroll[b-svkry139p5] { overflow-x: auto; }

.esl-table[b-svkry139p5] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
}

.esl-table thead th[b-svkry139p5] {
    text-align: left;
    padding: 12px 18px;
    color: var(--text-muted);
    font-weight: 700;
    font-size: 0.74rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    background: var(--surface-2);
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}

.esl-table tbody td[b-svkry139p5] {
    padding: 13px 18px;
    color: var(--text);
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}

.esl-table tbody tr:last-child td[b-svkry139p5] { border-bottom: none; }
.esl-table tbody tr:hover[b-svkry139p5] { background: rgba(243, 145, 37, 0.035); }

.esl-cand[b-svkry139p5] { font-weight: 700; color: var(--text); white-space: nowrap; }
.esl-sent[b-svkry139p5] { color: var(--text-muted); white-space: nowrap; }
.esl-th-actions[b-svkry139p5] { width: 1%; }
.esl-row-actions[b-svkry139p5] {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    white-space: nowrap;
}

/* Empty / loading states */
.esl-empty[b-svkry139p5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
    padding: 48px 24px;
    color: var(--text-muted);
}

.esl-empty-icon[b-svkry139p5] { font-size: 2.2rem; }
.esl-empty h3[b-svkry139p5] { margin: 0; color: var(--text); font-size: 1.05rem; }
.esl-empty p[b-svkry139p5] { margin: 0; max-width: 460px; font-size: 0.88rem; line-height: 1.5; }

/* Preview dialog */
.esl-dlg-title[b-svkry139p5] { display: flex; align-items: center; gap: 8px; font-weight: 700; }

.esl-preview[b-svkry139p5] { display: flex; flex-direction: column; gap: 18px; }

.esl-preview-band[b-svkry139p5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    border-radius: 12px;
    background: linear-gradient(120% 100% at 0% 0%, rgba(243, 145, 37, 0.12), rgba(31, 90, 138, 0.08));
}

.esl-preview-name[b-svkry139p5] { font-weight: 800; font-size: 1.1rem; color: var(--text); }
.esl-preview-meta[b-svkry139p5] { color: var(--text-muted); font-size: 0.85rem; margin-top: 2px; }

.esl-preview-grid[b-svkry139p5] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px 24px;
}

@media (max-width: 560px) { .esl-preview-grid[b-svkry139p5] { grid-template-columns: 1fr; } }

.esl-preview-grid > div[b-svkry139p5] { display: flex; flex-direction: column; gap: 2px; }
.esl-preview-grid span[b-svkry139p5] {
    color: var(--text-muted);
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-weight: 600;
}
.esl-preview-grid strong[b-svkry139p5] { color: var(--text); font-size: 0.92rem; }

.esl-preview-tt-label[b-svkry139p5] {
    font-weight: 700;
    color: var(--text);
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.esl-preview-tt-empty[b-svkry139p5] {
    color: var(--text-muted);
    font-size: 0.88rem;
    padding: 12px 0;
}

.esl-preview-tt[b-svkry139p5] {
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
}

/* ── Paid e-slip orders (straight-to-payment store, #399) ────────── */
.esl-orders-head[b-svkry139p5] { padding: 18px 18px 4px; display: flex; flex-direction: column; gap: 4px; }
.esl-orders-head h2[b-svkry139p5] { margin: 0; font-size: 1.05rem; font-weight: 800; color: var(--text); }
.esl-orders-head p[b-svkry139p5] { margin: 0; font-size: 0.85rem; color: var(--text-muted); line-height: 1.5; max-width: 82ch; }

.esl-orders-ref[b-svkry139p5] {
    font-family: 'Roboto Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.82rem;
    font-weight: 700;
    white-space: nowrap;
}
.esl-orders-cand[b-svkry139p5] { color: var(--text-muted); font-size: 0.82rem; margin-left: 4px; white-space: nowrap; }
.esl-orders-unmatched[b-svkry139p5] { color: #B23A22; font-size: 0.85rem; font-weight: 600; }
/* /Components/Pages/Admin/FormBuilder.razor.rz.scp.css */
/* ── Form builder (D6E) ──────────────────────────────────────────── */
.fb-loading[b-4yr5op33ve] {
    display: flex;
    justify-content: center;
    padding: 64px 0;
}

.fb-locked-banner[b-4yr5op33ve] {
    margin: 18px 28px 0;
    border-radius: 12px;
}

.fb-page[b-4yr5op33ve] { padding: 28px; }

/* Published share link (#316) */
.fb-share[b-4yr5op33ve] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 18px 28px 0;
    padding: 14px 18px;
    border-radius: 12px;
    border: 1px solid var(--border, rgba(15,27,45,0.1));
    background: var(--surface-2, rgba(243,145,37,0.06));
}
.fb-share-icon[b-4yr5op33ve] { font-size: 1.2rem; line-height: 1; }
.fb-share-body[b-4yr5op33ve] { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.fb-share-label[b-4yr5op33ve] {
    font-size: 0.72rem; font-weight: 700; letter-spacing: 0.06em;
    text-transform: uppercase; color: var(--ink-500, #5A6B82);
}
.fb-share-url[b-4yr5op33ve] {
    font-size: 0.9rem; font-weight: 600; color: #E36A1A;
    text-decoration: none; word-break: break-all;
}
.fb-share-url:hover[b-4yr5op33ve] { text-decoration: underline; }

/* Draft counterpart of the share row: says why there is no link yet, rather than leaving a gap
   that reads as a missing feature. */
.fb-share-pending[b-4yr5op33ve] {
    margin: 18px 28px 0;
    font-size: 0.82rem;
    color: var(--ink-500, #5A6B82);
}

/* Editable form name (supports new-form mode, #315) */
.fb-name-row[b-4yr5op33ve] { padding: 18px 28px 0; }
.fb-name-field[b-4yr5op33ve] { max-width: 480px; }

@media (max-width: 760px) {
    .fb-share[b-4yr5op33ve] { margin: 16px 16px 0; flex-wrap: wrap; }
    .fb-share-pending[b-4yr5op33ve] { margin: 16px 16px 0; }
    .fb-name-row[b-4yr5op33ve] { padding: 16px 16px 0; }
}

.fb-btn[b-4yr5op33ve] {
    text-transform: none;
    font-weight: 600;
    border-radius: 10px;
}

/* 3-column layout: 190px / 1fr / 250px */
.fb-layout[b-4yr5op33ve] {
    display: grid;
    grid-template-columns: 200px 1fr 260px;
    gap: 18px;
    padding: 22px 28px;
    align-items: start;
}

@media (max-width: 1100px) {
    .fb-layout[b-4yr5op33ve] { grid-template-columns: 180px 1fr; }
    .fb-props[b-4yr5op33ve] { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
    .fb-layout[b-4yr5op33ve] { grid-template-columns: 1fr; padding: 16px; }
    .fb-locked-banner[b-4yr5op33ve] { margin: 16px 16px 0; }
}

/* Shared panel chrome */
.fb-palette[b-4yr5op33ve],
.fb-props[b-4yr5op33ve],
.fb-card[b-4yr5op33ve] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    box-shadow: 0 1px 2px rgba(15, 27, 45, 0.04);
    padding: 18px;
}

/* Center field-list canvas card uses the warm paper tone to set it apart
   from the white side panels (matches the mockup's bgAlt canvas). */
.fb-card-canvas[b-4yr5op33ve] {
    background: var(--paper-warm);
}

.fb-panel-title[b-4yr5op33ve] {
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 700;
    color: var(--text-muted);
    margin: 0 0 4px;
}

.fb-panel-hint[b-4yr5op33ve] {
    font-size: 0.8rem;
    color: var(--text-muted);
    margin: 0 0 12px;
}

/* ── Left palette ────────────────────────────────────────────────── */
.fb-palette-list[b-4yr5op33ve] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fb-palette-item[b-4yr5op33ve] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    text-align: left;
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 9px 11px;
    cursor: grab;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text);
    transition: border-color .12s ease, background .12s ease, transform .12s ease;
}

.fb-palette-item:hover[b-4yr5op33ve] {
    border-color: #F39125;
    background: rgba(243, 145, 37, 0.06);
    transform: translateX(2px);
}

.fb-palette-icon[b-4yr5op33ve] { font-size: 1.05rem; line-height: 1; }

/* ── Center canvas ───────────────────────────────────────────────── */
.fb-canvas[b-4yr5op33ve] {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.fb-card-head[b-4yr5op33ve] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 14px;
}

.fb-card-title[b-4yr5op33ve] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: 1.05rem;
    color: var(--text);
    margin: 0;
}

.fb-card-count[b-4yr5op33ve] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-muted);
}

.fb-fieldlist[b-4yr5op33ve] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fb-fieldrow[b-4yr5op33ve] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 11px 14px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    cursor: pointer;
    transition: border-color .12s ease, background .12s ease;
}

.fb-fieldrow:hover[b-4yr5op33ve] { background: var(--surface-2); }

.fb-fieldrow.is-selected[b-4yr5op33ve] {
    border-color: #F39125;
    background: rgba(243, 145, 37, 0.06);
    box-shadow: inset 0 0 0 1px #F39125;
}

.fb-fieldrow-main[b-4yr5op33ve] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.fb-field-label[b-4yr5op33ve] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--text);
}

.fb-req[b-4yr5op33ve] { color: #D24545; font-weight: 700; margin-left: 2px; }

.fb-cond-chip[b-4yr5op33ve] {
    font-size: 0.68rem;
    font-weight: 700;
    color: #9C5A0F;
    background: rgba(243, 145, 37, 0.16);
    border-radius: 999px;
    padding: 3px 8px;
}

.fb-field-type[b-4yr5op33ve] {
    font-size: 0.76rem;
    color: var(--text-muted);
    white-space: nowrap;
}

.fb-addfield[b-4yr5op33ve],
.fb-addoption[b-4yr5op33ve] {
    margin-top: 14px;
    width: 100%;
    border: 1.5px dashed var(--border-strong);
    border-radius: 10px;
    background: transparent;
    padding: 10px;
    color: var(--text-muted);
    font-weight: 600;
    font-size: 0.85rem;
    cursor: pointer;
    transition: border-color .12s ease, color .12s ease;
}

.fb-addfield:hover[b-4yr5op33ve],
.fb-addoption:hover[b-4yr5op33ve] { border-color: #F39125; color: #9C5A0F; }

.fb-addoption[b-4yr5op33ve] { margin-top: 8px; padding: 7px; font-size: 0.8rem; }

/* ── Conditional logic ───────────────────────────────────────────── */
.fb-rule-empty[b-4yr5op33ve] {
    font-size: 0.86rem;
    color: var(--text-muted);
    margin: 0 0 12px;
}

.fb-rulelist[b-4yr5op33ve] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 12px;
}

.fb-rulerow[b-4yr5op33ve] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 12px;
    background: var(--surface-2);
    border-radius: 10px;
}

.fb-rule-text[b-4yr5op33ve] {
    font-size: 0.86rem;
    color: var(--text);
    line-height: 1.4;
}

.fb-rule-text strong[b-4yr5op33ve] { color: var(--text); }

.fb-rule-actions[b-4yr5op33ve] { display: flex; gap: 2px; flex-shrink: 0; }
.fb-rule-icon[b-4yr5op33ve] { color: var(--text-muted); }

.fb-rule-editor[b-4yr5op33ve] {
    margin-top: 4px;
    padding: 14px;
    border: 1px solid rgba(243, 145, 37, 0.3);
    border-radius: 12px;
    background: rgba(243, 145, 37, 0.04);
}

.fb-rule-grid[b-4yr5op33ve] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

@media (max-width: 560px) { .fb-rule-grid[b-4yr5op33ve] { grid-template-columns: 1fr; } }

.fb-rule-editor-actions[b-4yr5op33ve] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 12px;
}

.fb-addrule[b-4yr5op33ve] { margin-top: 4px; }

/* ── Right properties panel ──────────────────────────────────────── */
.fb-props-form[b-4yr5op33ve] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.fb-options[b-4yr5op33ve] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-top: 6px;
    border-top: 1px solid var(--border);
}

.fb-options-title[b-4yr5op33ve] {
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 700;
    color: var(--text-muted);
}

.fb-options-empty[b-4yr5op33ve] { font-size: 0.82rem; color: var(--text-muted); margin: 0; }

.fb-option-row[b-4yr5op33ve] {
    display: flex;
    align-items: center;
    gap: 4px;
}

/* #383 — per-option sublabel editor (radio-card SingleChoice); indented under its option row,
   leaving room for the remove-button column so the fields align. */
.fb-option-subrow[b-4yr5op33ve] {
    margin: -2px 32px 6px 12px;
}

.fb-props-actions[b-4yr5op33ve] {
    padding-top: 10px;
    border-top: 1px solid var(--border);
}

/* ── Empty states ────────────────────────────────────────────────── */
.fb-empty[b-4yr5op33ve] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 48px 24px;
    text-align: center;
}

.fb-empty-inline[b-4yr5op33ve] { padding: 32px 16px; }
.fb-empty-glyph[b-4yr5op33ve] { font-size: 2rem; opacity: 0.6; }
.fb-empty-title[b-4yr5op33ve] { font-weight: 700; color: var(--text); margin: 6px 0 0; }
.fb-empty-sub[b-4yr5op33ve] { color: var(--text-muted); font-size: 0.86rem; margin: 0 0 10px; }

/* Publish-validation + v1-migration banners (E2-C) */
.fb-alert-list[b-4yr5op33ve] { margin: 6px 0 0; padding-left: 18px; }
.fb-alert-list li[b-4yr5op33ve] { font-size: 0.84rem; line-height: 1.5; }
.fb-section-head[b-4yr5op33ve] { display: flex; align-items: center; gap: 10px; margin: 4px 0 8px; }
.fb-rule-op[b-4yr5op33ve] { margin: 0 4px; color: var(--text-muted); }
/* /Components/Pages/Admin/Forms.razor.rz.scp.css */
/* ::deep throughout: MudAlert and MudButton render these elements, so without it
   Blazor's scoped attribute never lands on them and the rule silently does nothing —
   the same isolation bug that made the courses filter bar look unpadded. */
/* ── Forms list (D6) ─────────────────────────────────────────────── */
.frm-page[b-fsb07w7w8l] {
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 28px;
    max-width: 1180px;
}

@media (max-width: 820px) {
    .frm-page[b-fsb07w7w8l] { padding: 16px; gap: 24px; }
}

.frm-loading[b-fsb07w7w8l] {
    display: flex;
    justify-content: center;
    padding: 64px 0;
}

/* ── Section heads ───────────────────────────────────────────────── */
.frm-section-head[b-fsb07w7w8l] {
    margin-bottom: 10px;
}

.frm-section-eyebrow[b-fsb07w7w8l] {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-muted);
    margin: 0;
}

.frm-action[b-fsb07w7w8l] {
    text-transform: none;
    font-weight: 600;
    border-radius: 10px;
}

/* ── Registration form cards ─────────────────────────────────────── */
.frm-cards[b-fsb07w7w8l] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
}

@media (max-width: 760px) { .frm-cards[b-fsb07w7w8l] { grid-template-columns: 1fr; } }

.frm-card[b-fsb07w7w8l] {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 14px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 20px;
    box-shadow: 0 1px 2px rgba(15, 27, 45, 0.04);
    transition: box-shadow .15s ease, transform .15s ease;
}

.frm-card:hover[b-fsb07w7w8l] {
    box-shadow: 0 12px 28px rgba(15, 27, 45, 0.1);
    transform: translateY(-2px);
}

.frm-card-icon[b-fsb07w7w8l] {
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    border-radius: 10px;
    display: grid;
    place-items: center;
    font-size: 1.25rem;
    background: rgba(243, 145, 37, 0.14);
    color: #F39125;
}

.frm-card-body[b-fsb07w7w8l] {
    flex: 1;
    min-width: 0;
}

.frm-card-name-row[b-fsb07w7w8l] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 4px;
}

.frm-card-name[b-fsb07w7w8l] {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text);
    margin: 0;
}

.frm-card-meta[b-fsb07w7w8l] {
    font-size: 0.84rem;
    color: var(--text-muted);
    margin: 0 0 14px;
}

.frm-card-actions[b-fsb07w7w8l] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.frm-btn[b-fsb07w7w8l] {
    text-transform: none;
    font-weight: 600;
    border-radius: 10px;
}

.frm-btn-text[b-fsb07w7w8l] {
    text-transform: none;
    font-weight: 600;
}

/* ── Ad-hoc forms table ──────────────────────────────────────────── */
.frm-table-wrap[b-fsb07w7w8l] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    box-shadow: 0 1px 2px rgba(15, 27, 45, 0.04);
    overflow-x: auto;
}

.frm-table[b-fsb07w7w8l] {
    width: 100%;
    border-collapse: collapse;
    min-width: 560px;
}

.frm-table thead th[b-fsb07w7w8l] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
    font-weight: 700;
    text-align: left;
    background: var(--surface-2);
    padding: 13px 18px;
    border-bottom: 1px solid var(--border);
}

.frm-table tbody td[b-fsb07w7w8l] {
    font-size: 0.88rem;
    color: var(--text);
    padding: 14px 18px;
    border-bottom: 1px solid var(--border);
}

.frm-table tbody tr:last-child td[b-fsb07w7w8l] { border-bottom: none; }

.frm-cell-name[b-fsb07w7w8l] { font-weight: 600; }

.frm-lock-mini[b-fsb07w7w8l] { margin-left: 6px; font-size: 0.78rem; }

.frm-num[b-fsb07w7w8l] {
    font-variant-numeric: tabular-nums;
    text-align: center;
}

.frm-right[b-fsb07w7w8l] { text-align: right; }

/* ── Empty states ────────────────────────────────────────────────── */
.frm-empty[b-fsb07w7w8l] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 44px 24px;
    text-align: center;
}

.frm-empty-glyph[b-fsb07w7w8l] { font-size: 2rem; opacity: 0.6; }
.frm-empty-title[b-fsb07w7w8l] { font-weight: 700; color: var(--text); margin: 6px 0 0; }
.frm-empty-sub[b-fsb07w7w8l] { color: var(--text-muted); font-size: 0.86rem; margin: 0; }

/* ── Delete-form dialog ──────────────────────────────────────────── */
[b-fsb07w7w8l] .frm-dlg-alert { margin-bottom: 14px; }

.frm-dlg-sub[b-fsb07w7w8l] {
    margin: 0 0 14px;
    font-size: 0.88rem;
    line-height: 1.5;
    color: var(--text-muted);
}
/* /Components/Pages/Admin/Inbox.razor.rz.scp.css */
/* ── Inbox (contact messages) ────────────────────────────────────── */
.inb-page[b-hb5pq4c7u9] {
    display: flex;
    flex-direction: column;
    gap: 22px;
    padding: 28px;
    max-width: 1280px;
}

@media (max-width: 820px) {
    .inb-page[b-hb5pq4c7u9] { padding: 16px; gap: 18px; }
}

/* Card */
[b-hb5pq4c7u9] .inb-card {
    border-radius: 16px;
    padding: 0;
    overflow: hidden;
    background: var(--surface);
}

/* Split: list left, detail right */
.inb-split[b-hb5pq4c7u9] {
    display: grid;
    grid-template-columns: minmax(280px, 380px) 1fr;
    min-height: 420px;
}

@media (max-width: 900px) {
    .inb-split[b-hb5pq4c7u9] { grid-template-columns: 1fr; }
}

/* ── Message list ────────────────────────────────────────────────── */
.inb-list[b-hb5pq4c7u9] {
    border-right: 1px solid var(--border);
    overflow-y: auto;
    max-height: 70vh;
}

@media (max-width: 900px) {
    .inb-list[b-hb5pq4c7u9] {
        border-right: none;
        border-bottom: 1px solid var(--border);
        max-height: 40vh;
    }
}

.inb-row[b-hb5pq4c7u9] {
    padding: 14px 18px;
    border-bottom: 1px solid var(--border);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.inb-row:last-child[b-hb5pq4c7u9] { border-bottom: none; }
.inb-row:hover[b-hb5pq4c7u9] { background: rgba(243, 145, 37, 0.035); }
.inb-row:focus-visible[b-hb5pq4c7u9] { outline: 2px solid #F39125; outline-offset: -2px; }
.inb-active[b-hb5pq4c7u9] { background: rgba(243, 145, 37, 0.08); }
.inb-active:hover[b-hb5pq4c7u9] { background: rgba(243, 145, 37, 0.08); }

.inb-row-top[b-hb5pq4c7u9] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 10px;
}

.inb-name[b-hb5pq4c7u9] { font-weight: 600; color: var(--text); font-size: 0.9rem; }
.inb-unread .inb-name[b-hb5pq4c7u9] { font-weight: 800; }
.inb-unread .inb-name[b-hb5pq4c7u9]::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #F39125;
    margin-right: 7px;
    vertical-align: middle;
}

.inb-when[b-hb5pq4c7u9] {
    color: var(--text-muted);
    font-size: 0.76rem;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.inb-row-mid[b-hb5pq4c7u9] {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

[b-hb5pq4c7u9] .inb-chip { margin: 0; flex-shrink: 0; }

.inb-email[b-hb5pq4c7u9] {
    color: var(--text-muted);
    font-size: 0.8rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.inb-subject[b-hb5pq4c7u9] {
    color: var(--text);
    font-size: 0.85rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.inb-unread .inb-subject[b-hb5pq4c7u9] { font-weight: 700; }

/* ── Detail pane ─────────────────────────────────────────────────── */
.inb-detail[b-hb5pq4c7u9] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 24px;
    min-width: 0;
}

.inb-detail-head[b-hb5pq4c7u9] { display: flex; justify-content: space-between; gap: 12px; }

.inb-detail-subject[b-hb5pq4c7u9] {
    margin: 0 0 4px;
    color: var(--text);
    font-size: 1.1rem;
    line-height: 1.3;
}

.inb-detail-meta[b-hb5pq4c7u9] {
    color: var(--text-muted);
    font-size: 0.84rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.inb-detail-meta strong[b-hb5pq4c7u9] { color: var(--text); }

.inb-message[b-hb5pq4c7u9] {
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 16px 18px;
    color: var(--text);
    font-size: 0.92rem;
    line-height: 1.6;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.inb-actions[b-hb5pq4c7u9] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: auto;
}

/* ── Empty states ────────────────────────────────────────────────── */
.inb-empty[b-hb5pq4c7u9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
    padding: 48px 24px;
    color: var(--text-muted);
}

.inb-empty-icon[b-hb5pq4c7u9] { font-size: 2.2rem; }
.inb-empty h3[b-hb5pq4c7u9] { margin: 0; color: var(--text); font-size: 1.05rem; }
.inb-empty p[b-hb5pq4c7u9] { margin: 0; max-width: 460px; font-size: 0.88rem; line-height: 1.5; }

.inb-detail-empty[b-hb5pq4c7u9] { justify-content: center; flex: 1; }
/* /Components/Pages/Admin/LeavePayroll.razor.rz.scp.css */
.lv-page[b-as4e0n80g6] {
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 22px;
}

@media (max-width: 720px) {
    .lv-page[b-as4e0n80g6] { padding: 16px; }
}

/* ── Stat row ──────────────────────────────────────────────────── */
.lv-stats[b-as4e0n80g6] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

@media (max-width: 1000px) {
    .lv-stats[b-as4e0n80g6] { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px) {
    .lv-stats[b-as4e0n80g6] { grid-template-columns: 1fr; }
}

/* ── "Payroll isn't set up" notice ─────────────────────────────── */
.lv-notice[b-as4e0n80g6] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 18px;
    border: 1px solid var(--border);
    border-left: 4px solid #1F5A8A;
    border-radius: 12px;
    background: rgba(31, 90, 138, 0.06);
    color: var(--text-muted);
    font-size: 0.88rem;
    line-height: 1.55;
}

.lv-notice strong[b-as4e0n80g6] {
    color: var(--text);
}

.lv-notice-glyph[b-as4e0n80g6] {
    font-size: 1.05rem;
    line-height: 1.4;
}

/* ── Pending-requests eyebrow heading ──────────────────────────── */
.lv-eyebrow[b-as4e0n80g6] {
    margin: 0;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--text-muted);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* ── Cards ────────────────────────────────────────────────────── */
[b-as4e0n80g6] .lv-card {
    border-radius: 16px;
    border-color: var(--border);
    background: var(--surface);
    overflow: hidden;
}

.lv-card-head[b-as4e0n80g6] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 22px 14px;
}

.lv-card-head h2[b-as4e0n80g6] {
    margin: 0;
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-size: 1.12rem;
    font-weight: 800;
    color: var(--text);
}

.lv-card-head p[b-as4e0n80g6] {
    margin: 4px 0 0;
    font-size: 0.85rem;
    color: var(--text-muted);
    line-height: 1.45;
}

.lv-pending-chip[b-as4e0n80g6] {
    flex: none;
    background: rgba(31, 90, 138, 0.12);
    color: #163E63;
    font-size: 0.74rem;
    font-weight: 700;
    padding: 5px 11px;
    border-radius: 999px;
    white-space: nowrap;
}

/* ── Table ────────────────────────────────────────────────────── */
.lv-table-scroll[b-as4e0n80g6] { overflow-x: auto; }
.lv-grid-table[b-as4e0n80g6] { border: none; }

.lv-emp[b-as4e0n80g6] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.lv-avatar[b-as4e0n80g6] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #163E63;
    color: #fff;
    display: grid;
    place-items: center;
    font-weight: 700;
    font-size: 0.74rem;
    flex: none;
}

.lv-avatar-lg[b-as4e0n80g6] {
    width: 46px;
    height: 46px;
    font-size: 0.95rem;
}

.lv-emp-text[b-as4e0n80g6] {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.lv-emp-name[b-as4e0n80g6] {
    font-weight: 700;
    color: var(--text);
}

.lv-emp-bal[b-as4e0n80g6] {
    font-size: 0.74rem;
    color: var(--text-muted);
}

.lv-type[b-as4e0n80g6] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 999px;
    white-space: nowrap;
}

.lv-type-plain[b-as4e0n80g6] {
    color: var(--text);
    font-size: 0.88rem;
}

.lv-type-vacation[b-as4e0n80g6] { background: rgba(111, 174, 63, 0.16); color: #3F7321; }
.lv-type-sick[b-as4e0n80g6]     { background: rgba(210, 69, 69, 0.14);  color: #9D2828; }
.lv-type-personal[b-as4e0n80g6] { background: rgba(31, 90, 138, 0.12);  color: #163E63; }

.lv-date[b-as4e0n80g6] {
    color: var(--text);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.lv-days[b-as4e0n80g6] {
    font-weight: 700;
    color: var(--text);
    font-variant-numeric: tabular-nums;
}

.lv-action-cell[b-as4e0n80g6] {
    text-align: right;
    white-space: nowrap;
}

/* ── Empty state ──────────────────────────────────────────────── */
.lv-empty[b-as4e0n80g6] {
    text-align: center;
    padding: 48px 24px;
}

.lv-empty-glyph[b-as4e0n80g6] {
    font-size: 2.2rem;
    margin-bottom: 10px;
}

.lv-empty h3[b-as4e0n80g6] {
    margin: 0 0 8px;
    font-weight: 700;
    color: var(--text);
}

.lv-empty p[b-as4e0n80g6] {
    margin: 0 auto;
    max-width: 420px;
    color: var(--text-muted);
    line-height: 1.55;
    font-size: 0.9rem;
}

/* ── Review dialog ────────────────────────────────────────────── */
.lv-dlg-title[b-as4e0n80g6] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 800;
    color: var(--text);
}

.lv-dlg-glyph[b-as4e0n80g6] { font-size: 1.2rem; }

.lv-dlg-body[b-as4e0n80g6] {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.lv-dlg-emp[b-as4e0n80g6] {
    display: flex;
    align-items: center;
    gap: 14px;
}

.lv-dlg-name[b-as4e0n80g6] {
    font-weight: 800;
    font-size: 1.05rem;
    color: var(--text);
    margin-bottom: 6px;
}

.lv-dlg-grid[b-as4e0n80g6] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px 16px;
}

.lv-dlg-grid > div[b-as4e0n80g6] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.lv-dlg-grid span[b-as4e0n80g6] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
}

.lv-dlg-grid strong[b-as4e0n80g6] {
    color: var(--text);
    font-variant-numeric: tabular-nums;
}

.lv-dlg-balance[b-as4e0n80g6] {
    background: rgba(111, 174, 63, 0.08);
    border: 1px solid rgba(111, 174, 63, 0.22);
    border-radius: 12px;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.lv-dlg-balance.is-over[b-as4e0n80g6] {
    background: rgba(210, 69, 69, 0.08);
    border-color: rgba(210, 69, 69, 0.26);
}

.lv-dlg-balance-top[b-as4e0n80g6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.88rem;
    color: var(--text);
}

.lv-dlg-balance-top strong[b-as4e0n80g6] { color: var(--text); font-variant-numeric: tabular-nums; }

.lv-dlg-bar[b-as4e0n80g6] { height: 7px; border-radius: 999px; }

.lv-dlg-hint[b-as4e0n80g6] { font-size: 0.78rem; color: #3F7321; }
.lv-dlg-warn[b-as4e0n80g6] { font-size: 0.78rem; color: #9D2828; font-weight: 600; }

.lv-dlg-reason span[b-as4e0n80g6] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
}

.lv-dlg-reason p[b-as4e0n80g6] {
    margin: 4px 0 0;
    color: var(--text);
    line-height: 1.5;
    font-size: 0.9rem;
}
/* /Components/Pages/Admin/Newsletter.razor.rz.scp.css */
/* Newsletter subscribers. An operating screen, not a document: the filter row is the audience
   picker and everything below it answers "who would this reach".

   ::deep on .nl-filters / .nl-empty / .nl-grid is REQUIRED, not stylistic. Those classes sit on
   MudPaper and MudDataGrid, so the elements are rendered by MudBlazor's components and never carry
   this file's scope attribute — a plain `.nl-filters { padding: … }` compiles to
   `.nl-filters[b-xxxxx]` and matches nothing at all. That is exactly how this shipped with no
   padding on the filter bar (25 Aug 2026). Anything targeting a child component's own root element
   needs ::deep; anything in this page's own markup must NOT have it. */

.nl-admin[b-i6cp5wjucp] {
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ── Filters ─────────────────────────────────────────────────────── */
[b-i6cp5wjucp] .nl-filters {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    padding: 16px 18px;
    border-radius: 14px;
}

[b-i6cp5wjucp] .nl-filters .mud-input-control { min-width: 240px; margin: 0; flex: 1 1 240px; }
[b-i6cp5wjucp] .nl-filters .mud-select { min-width: 170px; flex: 0 0 auto; }

.nl-chips[b-i6cp5wjucp] { display: flex; gap: 7px; flex-wrap: wrap; }
.nl-chips[b-i6cp5wjucp]  .mud-chip { margin: 0; cursor: pointer; }

/* ── Action row ──────────────────────────────────────────────────── */
.nl-actions[b-i6cp5wjucp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.nl-count[b-i6cp5wjucp] { font-size: .92rem; color: var(--mud-palette-text-secondary); }

.nl-count strong[b-i6cp5wjucp] {
    font-size: 1.15rem;
    color: var(--mud-palette-text-primary);
    font-variant-numeric: tabular-nums;
    margin-right: 3px;
}

.nl-count-of[b-i6cp5wjucp] { margin-left: 6px; opacity: .75; }

.nl-actions-right[b-i6cp5wjucp] { display: flex; gap: 9px; align-items: center; }

/* ── Grid ────────────────────────────────────────────────────────── */
[b-i6cp5wjucp] .nl-grid { border-radius: 14px; overflow: hidden; }

/* MudDataGrid's own cells carry no padding of their own at Dense, and the header sits flush
   against the card edge without this. */
[b-i6cp5wjucp] .nl-grid .mud-table-cell { padding: 10px 16px; }
[b-i6cp5wjucp] .nl-grid .mud-table-head .mud-table-cell { padding-top: 14px; padding-bottom: 14px; }

/* State reads at a glance, not by squinting at a date column. These spans ARE in this page's
   markup (inside CellTemplate render fragments), so they carry the scope and take no ::deep. */
.nl-on[b-i6cp5wjucp], .nl-off[b-i6cp5wjucp] {
    display: inline-block;
    font-size: .76rem;
    font-weight: 700;
    padding: 2px 9px;
    border-radius: 999px;
    white-space: nowrap;
}

.nl-on[b-i6cp5wjucp] { background: rgba(111, 174, 63, .16); color: #3F7A1E; }
.nl-off[b-i6cp5wjucp] { background: rgba(15, 27, 45, .08); color: var(--mud-palette-text-secondary); }

.nl-src[b-i6cp5wjucp] {
    font-size: .78rem;
    color: var(--mud-palette-text-secondary);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* ── States ──────────────────────────────────────────────────────── */
.nl-loading[b-i6cp5wjucp] {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 40px 0;
    color: var(--mud-palette-text-secondary);
    font-size: .92rem;
}

[b-i6cp5wjucp] .nl-empty {
    text-align: center;
    padding: 52px 32px;
    border-radius: 14px;
}

.nl-empty-icon[b-i6cp5wjucp] { font-size: 2.1rem; opacity: .35; margin-bottom: 14px; }

.nl-empty h3[b-i6cp5wjucp] {
    font-weight: 800;
    font-size: 1.12rem;
    color: var(--mud-palette-text-primary);
    margin: 0 0 9px;
}

.nl-empty p[b-i6cp5wjucp] {
    color: var(--mud-palette-text-secondary);
    font-size: .92rem;
    line-height: 1.65;
    max-width: 52ch;
    margin: 0 auto;
}

@media (max-width: 760px) {
    .nl-admin[b-i6cp5wjucp] { padding: 16px; }
    [b-i6cp5wjucp] .nl-filters { padding: 14px; }
    [b-i6cp5wjucp] .nl-filters .mud-input-control { min-width: 0; flex: 1 1 100%; }
    .nl-actions[b-i6cp5wjucp] { align-items: flex-start; flex-direction: column; }
    .nl-actions-right[b-i6cp5wjucp] { width: 100%; }
}
/* /Components/Pages/Admin/Orders.razor.rz.scp.css */
.ord-page[b-fwri4pxzfu] {
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 22px;
}

@media (max-width: 720px) {
    .ord-page[b-fwri4pxzfu] { padding: 16px; }
}

/* ── Stat row ─────────────────────────────────────────────────── */
.ord-stats[b-fwri4pxzfu] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

@media (max-width: 1100px) {
    .ord-stats[b-fwri4pxzfu] { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 560px) {
    .ord-stats[b-fwri4pxzfu] { grid-template-columns: 1fr; }
}

/* ── Table card ───────────────────────────────────────────────── */
[b-fwri4pxzfu] .ord-card {
    border-radius: 16px;
    border-color: var(--border);
    background: var(--surface);
    overflow: hidden;
}

.ord-table-scroll[b-fwri4pxzfu] {
    overflow-x: auto;
}

.ord-grid[b-fwri4pxzfu] {
    border: none;
}

.ord-ref[b-fwri4pxzfu] {
    font-weight: 700;
    color: var(--brand-blue);
    font-variant-numeric: tabular-nums;
}

.ord-items[b-fwri4pxzfu] {
    color: var(--text);
}

.ord-amount[b-fwri4pxzfu] {
    font-weight: 700;
    color: var(--text);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.ord-date[b-fwri4pxzfu] {
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.ord-action-cell[b-fwri4pxzfu] {
    text-align: right;
    white-space: nowrap;
}

/* ── Footer note ──────────────────────────────────────────────── */
.ord-footnote[b-fwri4pxzfu] {
    padding: 16px 18px;
    border-top: 1px solid var(--border);
    color: var(--text-muted);
    font-size: 0.85rem;
    line-height: 1.5;
}

/* ── Empty state ──────────────────────────────────────────────── */
.ord-empty[b-fwri4pxzfu] {
    text-align: center;
    padding: 56px 24px;
}

.ord-empty-glyph[b-fwri4pxzfu] {
    font-size: 2.4rem;
    margin-bottom: 12px;
}

.ord-empty h3[b-fwri4pxzfu] {
    margin: 0 0 8px;
    font-weight: 700;
    color: var(--text);
}

.ord-empty p[b-fwri4pxzfu] {
    margin: 0 auto;
    max-width: 440px;
    color: var(--text-muted);
    line-height: 1.55;
}
/* /Components/Pages/Admin/PaperSubmissions.razor.rz.scp.css */
.psub-page[b-xkuha582zk] {
    display: grid;
    gap: 1rem;
    padding: 1.25rem 1.5rem 2rem;
    max-width: 74rem;
}

/* e2c-card has no global style — pad it here (::deep: MudPaper renders the element). */
.psub-page[b-xkuha582zk]  .e2c-card {
    padding: 1.1rem 1.25rem;
    border-radius: 14px;
}

.psub-h3[b-xkuha582zk] {
    margin: 0 0 .5rem;
}

.psub-hint[b-xkuha582zk] {
    font-size: .85rem;
    color: var(--mud-palette-text-secondary);
    margin: .25rem 0 .75rem;
}

/* ── Empty / loading state ─────────────────────────────────────── */
.psub-empty[b-xkuha582zk] {
    display: grid;
    justify-items: center;
    gap: .4rem;
    text-align: center;
    padding: 2.5rem 1.5rem !important;
}

.psub-empty-glyph[b-xkuha582zk] {
    font-size: 2rem;
}

.psub-empty h2[b-xkuha582zk] {
    margin: 0;
    font-size: 1.2rem;
}

.psub-empty p[b-xkuha582zk] {
    margin: 0;
    max-width: 32rem;
    color: var(--mud-palette-text-secondary);
    font-size: .9rem;
}

/* ── Table ─────────────────────────────────────────────────────── */
.psub-scroll[b-xkuha582zk] {
    overflow-x: auto;
}

.psub-table[b-xkuha582zk] {
    width: 100%;
    border-collapse: collapse;
    margin-top: .5rem;
}

.psub-table th[b-xkuha582zk] {
    text-align: left;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--mud-palette-text-secondary);
    padding: .5rem .6rem;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    white-space: nowrap;
}

.psub-table td[b-xkuha582zk] {
    padding: .5rem .6rem;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    vertical-align: middle;
    font-size: .88rem;
}

.psub-subject[b-xkuha582zk] {
    font-weight: 600;
    min-width: 9rem;
}

.psub-dup[b-xkuha582zk] {
    display: block;
    margin-top: .15rem;
    font-size: .74rem;
    font-weight: 700;
    color: var(--mud-palette-warning-darken, #b26a00);
    white-space: nowrap;
    cursor: help;
}

/* Retention note in the reviewed history — the record is kept, the PDF was reclaimed. */
.psub-purged[b-xkuha582zk] {
    font-size: .74rem;
    font-weight: 600;
    color: var(--mud-palette-text-secondary, #6b7280);
    white-space: nowrap;
    cursor: help;
}

.psub-file[b-xkuha582zk] {
    max-width: 14rem;
}

.psub-filename[b-xkuha582zk] {
    display: block;
    overflow-wrap: anywhere;
    font-size: .84rem;
}

.psub-size[b-xkuha582zk] {
    font-size: .76rem;
    color: var(--mud-palette-text-secondary);
}

.psub-submitter[b-xkuha582zk] {
    max-width: 13rem;
}

.psub-submitter > span[b-xkuha582zk] {
    display: block;
}

.psub-email[b-xkuha582zk] {
    font-size: .78rem;
    color: var(--mud-palette-text-secondary);
    overflow-wrap: anywhere;
}

.psub-note[b-xkuha582zk] {
    font-size: .78rem;
    color: var(--mud-palette-text-secondary);
    font-style: italic;
    max-width: 12rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: help;
}

.psub-when[b-xkuha582zk] {
    white-space: nowrap;
    color: var(--mud-palette-text-secondary);
}

.psub-actions[b-xkuha582zk] {
    text-align: right;
    white-space: nowrap;
}

.psub-actions[b-xkuha582zk]  .psub-approve-group {
    margin: 0 .3rem;
    vertical-align: middle;
}

/* ── Inline reject row (Verification.razor pattern) ────────────── */
.psub-reject-row td[b-xkuha582zk] {
    background: var(--mud-palette-background-gray, rgba(0, 0, 0, .03));
}

.psub-reject[b-xkuha582zk] {
    display: grid;
    gap: .6rem;
    max-width: 36rem;
    margin-left: auto;
    padding: .35rem 0;
}

.psub-reject-actions[b-xkuha582zk] {
    display: flex;
    gap: .6rem;
    justify-content: flex-end;
}

/* ── Reviewed history ──────────────────────────────────────────── */
.psub-hist-toggle[b-xkuha582zk] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    font-weight: 600;
    color: inherit;
    cursor: pointer;
}

.psub-badge[b-xkuha582zk] {
    display: inline-block;
    font-size: .74rem;
    font-weight: 700;
    padding: .15rem .55rem;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.psub-badge.is-approved[b-xkuha582zk] {
    background: rgba(111, 174, 63, .16);
    color: #4E7D24;
}

.psub-badge.is-rejected[b-xkuha582zk] {
    background: rgba(210, 69, 69, .14);
    color: #B03030;
}

.psub-detail[b-xkuha582zk] {
    max-width: 16rem;
    font-size: .84rem;
    color: var(--mud-palette-text-secondary);
    overflow-wrap: anywhere;
}
/* /Components/Pages/Admin/Payments.razor.rz.scp.css */
/* D12 Payments — content area sits inside the dark portal main; cards are light surfaces. */

.e2c-pay[b-li8czvu46t] {
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 22px;
    max-width: 1240px;
}

.e2c-pay-action[b-li8czvu46t] {
    text-transform: none;
    font-weight: 600;
    border-color: rgba(255, 255, 255, 0.28);
    color: #fff;
}

/* ── Stat card grid ───────────────────────────────────────────────── */
.e2c-pay-stats[b-li8czvu46t] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

/* ── Table card ───────────────────────────────────────────────────── */
[b-li8czvu46t] .e2c-pay-card {
    border-radius: 16px;
    background: var(--surface);
    border-color: var(--border);
    overflow: hidden;
}

.e2c-pay-card-head[b-li8czvu46t] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 22px 14px;
}

.e2c-pay-card-title[b-li8czvu46t] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: 1.05rem;
    color: var(--text);
    margin: 0;
}

.e2c-pay-card-sub[b-li8czvu46t] {
    margin: 4px 0 0;
    font-size: 0.85rem;
    color: var(--text-muted);
}

.e2c-pay-count[b-li8czvu46t] {
    flex: none;
    background: var(--surface-2);
    color: var(--text-muted);
    font-size: 0.78rem;
    font-weight: 600;
    padding: 5px 12px;
    border-radius: 999px;
    white-space: nowrap;
}

.e2c-pay-tablewrap[b-li8czvu46t] {
    overflow-x: auto;
}

/* tabular figures for money + references */
.e2c-pay-amt[b-li8czvu46t],
.e2c-pay-ref[b-li8czvu46t],
.e2c-pay-date[b-li8czvu46t] {
    font-variant-numeric: tabular-nums;
}

.e2c-pay-ref[b-li8czvu46t] {
    font-weight: 600;
    color: var(--brand-blue);
}

.e2c-pay-amt[b-li8czvu46t] {
    font-weight: 700;
    color: var(--text);
}

.e2c-pay-date[b-li8czvu46t] {
    color: var(--text-muted);
    font-size: 0.85rem;
}

.e2c-pay-method[b-li8czvu46t] {
    display: inline-flex;
    align-items: center;
    color: var(--text);
    font-weight: 500;
    white-space: nowrap;
}

/* ── Empty state ──────────────────────────────────────────────────── */
.e2c-pay-empty[b-li8czvu46t] {
    text-align: center;
    padding: 46px 20px;
}

.e2c-pay-empty-ico[b-li8czvu46t] {
    font-size: 2.2rem;
    display: block;
    margin-bottom: 10px;
    opacity: 0.85;
}

.e2c-pay-empty-title[b-li8czvu46t] {
    font-weight: 700;
    color: var(--text);
    margin: 0 0 4px;
}

.e2c-pay-empty-sub[b-li8czvu46t] {
    color: var(--text-muted);
    font-size: 0.88rem;
    margin: 0 auto;
    max-width: 420px;
}

/* ── Footer note ──────────────────────────────────────────────────── */
.e2c-pay-foot[b-li8czvu46t] {
    padding: 14px 22px 18px;
    border-top: 1px solid var(--border);
    font-size: 0.82rem;
    color: var(--text-muted);
}

.e2c-pay-foot strong[b-li8czvu46t] {
    color: var(--text);
}

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 1100px) {
    .e2c-pay-stats[b-li8czvu46t] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .e2c-pay[b-li8czvu46t] {
        padding: 16px;
    }

    .e2c-pay-stats[b-li8czvu46t] {
        grid-template-columns: 1fr;
    }
}

/* ── Manual settlement (missed-webhook recovery) ──────────────────────────── */
.e2c-pay-manual[b-li8czvu46t] { padding: 16px 18px; margin-top: 16px; }
.e2c-pay-h3[b-li8czvu46t] { font-size: 1rem; font-weight: 700; margin: 0 0 4px; }
.e2c-pay-manual-hint[b-li8czvu46t] {
    margin: 0 0 14px;
    font-size: .84rem;
    line-height: 1.55;
    color: var(--mud-palette-text-secondary);
    max-width: 70ch;
}
.e2c-pay-manual-row[b-li8czvu46t] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 10px;
}
.e2c-pay-manual-row > *[b-li8czvu46t] { flex: 1 1 180px; min-width: 160px; }
[b-li8czvu46t] .e2c-pay-manual-row .mud-button { flex: 0 0 auto; margin-top: 4px; white-space: nowrap; }
/* /Components/Pages/Admin/PriorCandidates.razor.rz.scp.css */
.pcl-page[b-whbj577q7i] {
    display: grid;
    gap: 1rem;
    padding: 1.25rem 1.5rem 2rem;
    max-width: 64rem;
}

/* e2c-card has no global style — pad it here (::deep: MudPaper renders the element). */
.pcl-page[b-whbj577q7i]  .e2c-card {
    padding: 1.1rem 1.25rem;
    border-radius: 14px;
}

.pcl-h3[b-whbj577q7i] {
    margin: 0 0 .5rem;
}

.pcl-hint[b-whbj577q7i] {
    font-size: .85rem;
    color: var(--mud-palette-text-secondary);
    margin: .25rem 0 .75rem;
}

.pcl-table[b-whbj577q7i] {
    width: 100%;
    border-collapse: collapse;
    margin-top: .5rem;
}

.pcl-table th[b-whbj577q7i] {
    text-align: left;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--mud-palette-text-secondary);
    padding: .5rem .6rem;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.pcl-table td[b-whbj577q7i] {
    padding: .45rem .6rem;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    vertical-align: middle;
}

.pcl-file[b-whbj577q7i] {
    font-size: .85rem;
    max-width: 18rem;
    overflow-wrap: anywhere;
}

.pcl-year[b-whbj577q7i] {
    max-width: 7rem;
}

.pcl-err[b-whbj577q7i] {
    color: var(--mud-palette-error);
    font-size: .8rem;
}

.pcl-alert[b-whbj577q7i] {
    margin-top: .75rem;
}

.pcl-actions[b-whbj577q7i] {
    display: flex;
    gap: .6rem;
    margin-top: 1rem;
}

.pcl-row-actions[b-whbj577q7i] {
    text-align: right;
}

.pcl-pickrow[b-whbj577q7i] {
    display: flex;
    gap: .6rem;
    align-items: center;
    flex-wrap: wrap;
}

/* ── Imported-candidate browser ───────────────────────────────────────────── */
.pcl-filters[b-whbj577q7i] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin: 12px 0 14px;
}
[b-whbj577q7i] .pcl-search { max-width: 300px; flex: 1 1 220px; }
[b-whbj577q7i] .pcl-filter { max-width: 150px; }
[b-whbj577q7i] .pcl-filter-wide { max-width: 250px; }

.pcl-alert[b-whbj577q7i] { margin-bottom: 12px; }

.pcl-name[b-whbj577q7i] { font-weight: 600; font-size: .86rem; }
.pcl-sub[b-whbj577q7i] { font-size: .72rem; color: var(--mud-palette-text-secondary); }
[b-whbj577q7i] .pcl-mono {
    font-family: ui-monospace, 'Cascadia Mono', 'Consolas', monospace;
    font-size: .78rem;
}
[b-whbj577q7i] .pcl-subjects {
    font-size: .72rem;
    color: var(--mud-palette-text-secondary);
    max-width: 260px;
    overflow-wrap: anywhere;
}
.pcl-nodob[b-whbj577q7i] {
    font-size: .76rem;
    font-weight: 700;
    color: var(--mud-palette-warning-darken, #b26a00);
    cursor: help;
}
.pcl-empty[b-whbj577q7i] { text-align: center; padding: 26px 10px; }

/* ── "Test the sponsorship check" panel ───────────────────────────────────── */
.pcl-test-row[b-whbj577q7i] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 10px;
    margin: 12px 0 14px;
}
.pcl-test-row > *[b-whbj577q7i] { flex: 1 1 140px; min-width: 130px; }
[b-whbj577q7i] .pcl-test-row .mud-button { flex: 0 0 auto; margin-top: 4px; }

.pcl-explain[b-whbj577q7i] {
    background: var(--mud-palette-background-grey);
    border: 1px solid var(--mud-palette-divider);
    border-radius: 10px;
    padding: 12px 14px;
}
.pcl-explain dl[b-whbj577q7i] {
    margin: 0;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 4px 14px;
    font-size: .82rem;
}
.pcl-explain dt[b-whbj577q7i] { color: var(--mud-palette-text-secondary); white-space: nowrap; }
.pcl-explain dd[b-whbj577q7i] { margin: 0; font-weight: 600; overflow-wrap: anywhere; }

.pcl-samples[b-whbj577q7i] { margin-top: 12px; }
.pcl-samples-h[b-whbj577q7i] {
    display: block;
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: var(--mud-palette-text-secondary);
    margin-bottom: 5px;
}
.pcl-samples ul[b-whbj577q7i] { margin: 0; padding-left: 16px; }
.pcl-samples li[b-whbj577q7i] { font-size: .76rem; line-height: 1.55; }

/* ── Per-row match verdict ────────────────────────────────────────────────── */
.pcl-ok[b-whbj577q7i] {
    font-size: .74rem;
    color: var(--mud-palette-text-secondary);
}
.pcl-chip[b-whbj577q7i] {
    display: inline-block;
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .05em;
    padding: 2px 8px;
    border-radius: 999px;
    white-space: nowrap;
    cursor: help;
}
.pcl-chip-bad[b-whbj577q7i] {
    background: var(--mud-palette-error-hover, rgba(244, 67, 54, .14));
    color: var(--mud-palette-error-darken, #b71c1c);
}
.pcl-chip-warn[b-whbj577q7i] {
    background: var(--mud-palette-warning-hover, rgba(255, 152, 0, .14));
    color: var(--mud-palette-warning-darken, #b26a00);
}

/* ── Row correction editor ────────────────────────────────────────────────── */
.pcl-edit-grid[b-whbj577q7i] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 10px 12px;
    margin: 12px 0 14px;
}
[b-whbj577q7i] .pcl-edit-wide { grid-column: 1 / -1; }

.pcl-draft[b-whbj577q7i] { margin-bottom: .25rem; }
.pcl-draft-ok[b-whbj577q7i] {
    margin: 8px 0 0;
    font-size: .8rem;
    font-weight: 600;
    color: var(--mud-palette-success-darken, #1b5e20);
}
.pcl-draft-gaps[b-whbj577q7i] {
    margin: 8px 0 0;
    padding-left: 18px;
    font-size: .8rem;
    line-height: 1.5;
}
.pcl-draft-gaps li[b-whbj577q7i] { margin-bottom: 3px; }

.pcl-spacer[b-whbj577q7i] { flex: 1 1 auto; }
/* /Components/Pages/Admin/ProblemReports.razor.rz.scp.css */
.pr-page[b-2aj2zvn4is] { padding: 28px; display: flex; flex-direction: column; gap: 16px; }

[b-2aj2zvn4is] .pr-card {
    background: var(--surface);
    border: 1px solid var(--border) !important;
    border-radius: 16px;
    padding: 20px 22px;
}

.pr-filter[b-2aj2zvn4is] { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.pr-filter-select[b-2aj2zvn4is] { max-width: 240px; }
.pr-alert[b-2aj2zvn4is] { margin-top: 14px; border-radius: 10px; }

.pr-head[b-2aj2zvn4is] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}
.pr-title[b-2aj2zvn4is] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--text); }
.pr-meta[b-2aj2zvn4is] { margin: 4px 0 0; font-size: 0.76rem; color: var(--text-muted); }
.pr-meta code[b-2aj2zvn4is] {
    background: rgba(0, 0, 0, .05);
    border-radius: 5px;
    padding: 1px 5px;
}

.pr-body[b-2aj2zvn4is] {
    margin: 14px 0 0;
    font-size: 0.9rem;
    line-height: 1.55;
    color: var(--text);
    white-space: pre-wrap;
}

.pr-shot[b-2aj2zvn4is] { display: block; margin-top: 14px; }
.pr-shot img[b-2aj2zvn4is] {
    max-width: 100%;
    max-height: 320px;
    border-radius: 10px;
    border: 1px solid var(--border);
}
.pr-shot-missing[b-2aj2zvn4is] {
    margin: 14px 0 0;
    font-size: 0.78rem;
    font-style: italic;
    color: var(--text-muted);
}

.pr-actions[b-2aj2zvn4is] { display: flex; gap: 10px; margin-top: 16px; flex-wrap: wrap; }
.pr-triage[b-2aj2zvn4is] { margin: 14px 0 0; font-size: 0.78rem; color: var(--text-muted); }

.pr-empty[b-2aj2zvn4is] { text-align: center; padding: 48px 24px; }
.pr-empty-glyph[b-2aj2zvn4is] { font-size: 1.8rem; }
.pr-empty-title[b-2aj2zvn4is] { margin: 10px 0 4px; font-weight: 700; color: var(--text); }
.pr-empty-sub[b-2aj2zvn4is] { margin: 0; font-size: 0.86rem; color: var(--text-muted); }

@media (max-width: 700px) {
    .pr-page[b-2aj2zvn4is] { padding: 16px; }
}
/* /Components/Pages/Admin/QuizManager.razor.rz.scp.css */
/* ── CXC To Go Quiz Manager ──────────────────────────────────────── */
.qz-page[b-bc04ivi3e3] { padding: 28px; }

@media (max-width: 820px) {
    .qz-page[b-bc04ivi3e3] { padding: 16px; }
}

.qz-loading[b-bc04ivi3e3] {
    display: flex; align-items: center; gap: 12px;
    color: var(--text-muted); font-size: .92rem; padding: 40px 4px;
}

/* ── Stat cards ──────────────────────────────────────────────────── */
.qz-stats[b-bc04ivi3e3] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 18px;
}

/* ── Quiz list ───────────────────────────────────────────────────── */
.qz-list[b-bc04ivi3e3] { display: flex; flex-direction: column; gap: 10px; }

[b-bc04ivi3e3] .qz-row {
    padding: 14px 18px !important;
    cursor: pointer;
    border-radius: 14px !important;
    transition: transform .12s ease, box-shadow .12s ease;
}
[b-bc04ivi3e3] .qz-row:hover { transform: translateY(-1px); box-shadow: 0 8px 22px rgba(15, 27, 45, .08); }

.qz-row-inner[b-bc04ivi3e3] { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }

.qz-avatar[b-bc04ivi3e3] {
    width: 44px; height: 44px; border-radius: 10px;
    display: grid; place-items: center;
    background: linear-gradient(135deg, #25D366, #128C7E);
    color: #fff; font-size: 1.2rem; flex: none;
}

.qz-main[b-bc04ivi3e3] { flex: 1.5; min-width: 200px; }
.qz-title-line[b-bc04ivi3e3] { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.qz-title[b-bc04ivi3e3] { font-size: .94rem; font-weight: 700; color: var(--text); }
.qz-title-empty[b-bc04ivi3e3] { color: var(--text-muted); font-style: italic; }

.qz-level[b-bc04ivi3e3] {
    font-size: .655rem; font-weight: 800; letter-spacing: .06em;
    padding: 3px 8px; border-radius: 999px; text-transform: uppercase;
}
.qz-level-csec[b-bc04ivi3e3] { color: #1F5A8A; background: rgba(31, 90, 138, .08); }
.qz-level-cape[b-bc04ivi3e3] { color: #B5670F; background: rgba(243, 145, 37, .10); }

/* WCAG 1.4.3 — dark navy/brown text disappears on dark surfaces */
html[data-theme="dark"] .qz-level-csec[b-bc04ivi3e3] { color: #8EC2F0; background: rgba(94, 160, 224, .22); }
html[data-theme="dark"] .qz-level-cape[b-bc04ivi3e3] { color: #F6B25C; background: rgba(243, 145, 37, .24); }
/* .qz-back-btn (MudButton in PortalTopBar → no scope attr) lives in wwwroot/brand.css as a
   plain global rule; scoped :global(...) here compiled to invalid :global(...)[scope] and was dropped. */

.qz-meta[b-bc04ivi3e3] { font-size: .78rem; color: var(--text-muted); margin-top: 4px; }

.qz-chevron[b-bc04ivi3e3] { color: var(--text-muted); font-size: 1.1rem; flex: none; }

/* ── Empty state ─────────────────────────────────────────────────── */
[b-bc04ivi3e3] .qz-empty {
    padding: 48px 24px !important; text-align: center; border-radius: 16px !important;
}
.qz-empty-ico[b-bc04ivi3e3] { font-size: 2.4rem; margin-bottom: 10px; }
.qz-empty h3[b-bc04ivi3e3] { font-size: 1.05rem; font-weight: 700; color: var(--text); margin: 0 0 6px; }
.qz-empty p[b-bc04ivi3e3] { font-size: .88rem; color: var(--text-muted); max-width: 440px; margin: 0 auto 18px; }

/* ── Editor: two-column ──────────────────────────────────────────── */
.qz-editor[b-bc04ivi3e3] {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 18px;
    align-items: flex-start;
}
.qz-left[b-bc04ivi3e3] { display: flex; flex-direction: column; gap: 18px; min-width: 0; }

[b-bc04ivi3e3] .qz-card { padding: 22px !important; border-radius: 16px !important; }

.qz-section-head[b-bc04ivi3e3] {
    font-size: .8rem; font-weight: 700; color: var(--text-muted);
    letter-spacing: .08em; text-transform: uppercase; margin: 0 0 16px;
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
}

.qz-fields[b-bc04ivi3e3] { display: flex; flex-direction: column; gap: 14px; }
.qz-fields-grid[b-bc04ivi3e3] {
    display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 12px;
}

/* ── Question editor cards ───────────────────────────────────────── */
.qz-q-list[b-bc04ivi3e3] { display: flex; flex-direction: column; gap: 12px; }

.qz-q[b-bc04ivi3e3] {
    border: 1.5px solid var(--border); border-radius: 10px; padding: 16px;
    background: var(--surface-2); transition: border-color .12s ease;
}
.qz-q-active[b-bc04ivi3e3] { border-color: #F39125; }

.qz-q-top[b-bc04ivi3e3] { display: flex; align-items: center; gap: 10px; }
.qz-q-num[b-bc04ivi3e3] {
    width: 24px; height: 24px; border-radius: 50%; flex: none;
    display: grid; place-items: center;
    background: rgba(243, 145, 37, .11); color: #B5670F;
    font-size: .78rem; font-weight: 700;
}
html[data-theme="dark"] .qz-q-num[b-bc04ivi3e3] { background: rgba(243, 145, 37, .24); color: #F6B25C; }
.qz-q-text[b-bc04ivi3e3] { flex: 1; min-width: 0; }
.qz-q-wa[b-bc04ivi3e3] {
    border: none; background: transparent; cursor: pointer; padding: 4px;
    font-size: 1rem; line-height: 1; opacity: .45;
}
.qz-q-wa-on[b-bc04ivi3e3] { opacity: 1; }
.qz-q-del[b-bc04ivi3e3] {
    border: none; background: transparent; cursor: pointer; padding: 4px;
    color: #9D2828; font-size: 1rem; line-height: 1; font-weight: 700;
}

.qz-opts[b-bc04ivi3e3] {
    display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 14px 0 12px;
}
.qz-opt[b-bc04ivi3e3] {
    display: flex; align-items: center; gap: 10px;
    border: 1.5px solid var(--border); border-radius: 8px; padding: 8px 10px;
    background: var(--surface); cursor: pointer;
}
.qz-opt-correct[b-bc04ivi3e3] { border-color: #6FAE3F; background: rgba(111, 174, 63, .10); }
.qz-opt-badge[b-bc04ivi3e3] {
    width: 20px; height: 20px; border-radius: 50%; flex: none;
    display: grid; place-items: center;
    font-size: .68rem; font-weight: 700;
    background: rgba(15, 27, 45, .08); color: var(--text-muted);
}
.qz-opt-badge-correct[b-bc04ivi3e3] { background: #6FAE3F; color: #fff; }
.qz-opt-input[b-bc04ivi3e3] {
    border: none; outline: none; background: transparent; width: 100%;
    font-size: .85rem; color: var(--text);
}

.qz-q-helper[b-bc04ivi3e3] { font-size: .74rem; color: var(--text-muted); margin: 0; }

/* ── WhatsApp preview ────────────────────────────────────────────── */
.qz-right[b-bc04ivi3e3] { position: sticky; top: 18px; }
.qz-wa-label[b-bc04ivi3e3] {
    font-size: .68rem; font-weight: 700; letter-spacing: .08em;
    text-transform: uppercase; text-align: center; color: var(--text-muted); margin: 0 0 10px;
}

.qz-phone[b-bc04ivi3e3] {
    background: #0b141a; border-radius: 22px; border: 6px solid #11181c;
    max-width: 320px; margin: 0 auto; overflow: hidden;
    box-shadow: 0 18px 40px rgba(15, 27, 45, .22);
}
.qz-wa-head[b-bc04ivi3e3] {
    display: flex; align-items: center; gap: 10px;
    padding: 12px 14px; background: #1f2c33;
}
.qz-wa-avatar[b-bc04ivi3e3] {
    width: 34px; height: 34px; border-radius: 50%; flex: none;
    display: grid; place-items: center; color: #fff; font-size: .95rem;
    background: linear-gradient(135deg, #25D366, #128C7E);
}
.qz-wa-who[b-bc04ivi3e3] { flex: 1; min-width: 0; line-height: 1.2; }
.qz-wa-name[b-bc04ivi3e3] { color: #fff; font-weight: 700; font-size: .85rem; }
.qz-wa-status[b-bc04ivi3e3] { color: #8aa0ab; font-size: .7rem; }
.qz-wa-vid[b-bc04ivi3e3] { color: #8aa0ab; font-size: 1rem; }

.qz-wa-body[b-bc04ivi3e3] {
    background: #0d1418;
    background-image: radial-gradient(rgba(255, 255, 255, .03) 1px, transparent 1px);
    background-size: 16px 16px;
    padding: 14px 12px; min-height: 240px; border-radius: 0 0 12px 12px;
    display: flex; flex-direction: column; gap: 10px;
}
.qz-bubble[b-bc04ivi3e3] { max-width: 86%; border-radius: 10px; padding: 8px 10px; font-size: .8rem; line-height: 1.45; }
.qz-bubble-in[b-bc04ivi3e3] { background: #1f2c33; color: #e9edf0; align-self: flex-start; }
.qz-bubble-out[b-bc04ivi3e3] { background: #005c4b; color: #e9f7f0; align-self: flex-end; }
.qz-bubble-bot[b-bc04ivi3e3] { background: #1f2c33; color: #e9edf0; align-self: flex-start; }
.qz-bubble-title[b-bc04ivi3e3] { color: #7fdca4; font-weight: 700; margin-bottom: 4px; }
.qz-bubble-opt[b-bc04ivi3e3] { display: block; }
.qz-bubble-prompt[b-bc04ivi3e3] { color: #8aa0ab; margin-top: 6px; }
.qz-bubble-time[b-bc04ivi3e3] { text-align: right; font-size: .65rem; color: #8aa0ab; margin-top: 3px; }
.qz-bubble-streak[b-bc04ivi3e3] { color: #7fdca4; margin-top: 6px; display: block; }

.qz-wa-blank[b-bc04ivi3e3], .qz-q-empty[b-bc04ivi3e3] {
    border: 1.5px dashed var(--border); border-radius: 12px;
    padding: 28px 18px; text-align: center; color: var(--text-muted); font-size: .85rem;
}

@media (max-width: 1100px) {
    .qz-editor[b-bc04ivi3e3] { grid-template-columns: 1fr; }
    .qz-right[b-bc04ivi3e3] { position: static; }
    .qz-phone[b-bc04ivi3e3] { margin-top: 4px; }
}
@media (max-width: 900px) {
    .qz-stats[b-bc04ivi3e3] { grid-template-columns: 1fr 1fr; }
    .qz-fields-grid[b-bc04ivi3e3] { grid-template-columns: 1fr 1fr; }
    .qz-opts[b-bc04ivi3e3] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Admin/ReceiptImport.razor.rz.scp.css */
.ri-page[b-woya8lysc2] {
    display: grid;
    gap: 1rem;
    padding: 1.25rem 1.5rem 2rem;
}

/* e2c-card has no global style — every page provides its own internal padding (scoped,
   ::deep because MudPaper renders the element). */
.ri-page[b-woya8lysc2]  .e2c-card {
    padding: 1.1rem 1.25rem;
    border-radius: 14px;
}

.ri-h3[b-woya8lysc2] {
    margin: 0 0 .75rem;
}

.ri-upload-grid[b-woya8lysc2] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: 1rem;
}

.ri-upload-tile[b-woya8lysc2] {
    display: grid;
    gap: .35rem;
    justify-items: start;
}

.ri-hint[b-woya8lysc2] {
    font-size: .85rem;
    color: var(--mud-palette-text-secondary);
    margin: .35rem 0 0;
}

.ri-hint code[b-woya8lysc2] {
    font-size: .8rem;
}

.ri-mode[b-woya8lysc2] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem 1rem;
    margin-top: 1rem;
}

.ri-mode-label[b-woya8lysc2] {
    font-weight: 600;
    font-size: .9rem;
}

.ri-alert[b-woya8lysc2] {
    margin-top: .9rem;
}

.ri-actions[b-woya8lysc2] {
    display: flex;
    gap: .6rem;
    margin-top: 1rem;
    align-items: center;
}

.ri-table-wrap[b-woya8lysc2] {
    overflow-x: auto;
    margin-top: .5rem;
}

.ri-table[b-woya8lysc2] {
    width: 100%;
    border-collapse: collapse;
    min-width: 46rem;
}

.ri-table th[b-woya8lysc2] {
    text-align: left;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--mud-palette-text-secondary);
    padding: .5rem .6rem;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.ri-table td[b-woya8lysc2] {
    padding: .45rem .6rem;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    vertical-align: middle;
}

.ri-row-off td[b-woya8lysc2] {
    opacity: .5;
}

.ri-unit[b-woya8lysc2] {
    white-space: nowrap;
    font-weight: 600;
    font-size: .9rem;
}

.ri-note[b-woya8lysc2] {
    display: block;
    font-size: .78rem;
    color: var(--mud-palette-warning);
}

.ri-cand-col[b-woya8lysc2] {
    min-width: 16rem;
}

.ri-view[b-woya8lysc2] {
    font-weight: 600;
    white-space: nowrap;
}

.ri-done[b-woya8lysc2] {
    text-align: center;
    padding: 2rem 1.5rem;
    display: grid;
    justify-items: center;
    gap: .4rem;
}

.ri-done-ico[b-woya8lysc2] {
    font-size: 2rem;
}
/* /Components/Pages/Admin/Recruitment.razor.rz.scp.css */
/* D18 — Recruitment pipeline (Work With Us ATS). Dark portal shell; warm paper content area. */

.rec-page[b-vhod02mpc8] {
    padding: 28px 28px 48px;
    max-width: 1080px;
}

.rec-loading[b-vhod02mpc8] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 40px 0;
    color: var(--text-muted);
    font-size: 14px;
}

/* ── Stat cards ─────────────────────────────────────────────────── */
.rec-stats[b-vhod02mpc8] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 22px;
}

/* ── View switcher (Pipeline / Roles) ───────────────────────────── */
.rec-views[b-vhod02mpc8] {
    display: flex;
    gap: 8px;
    margin-bottom: 20px;
}

/* ── Filter chips ───────────────────────────────────────────────── */
.rec-chips[b-vhod02mpc8] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
}

.rec-chip[b-vhod02mpc8] {
    border-radius: 999px;
    text-transform: none;
    font-weight: 600;
}

/* ── Candidate list ─────────────────────────────────────────────── */
.rec-list[b-vhod02mpc8] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

[b-vhod02mpc8] .rec-card {
    border-radius: 14px;
    padding: 16px 18px;
    background: var(--surface);
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.rec-avatar[b-vhod02mpc8] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 800;
    flex: 0 0 auto;
}

.rec-body[b-vhod02mpc8] {
    flex: 1 1 260px;
    min-width: 0;
}

.rec-name-row[b-vhod02mpc8] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.rec-name[b-vhod02mpc8] {
    font-size: 14.5px;
    font-weight: 700;
    color: var(--text);
}

.rec-pill[b-vhod02mpc8] {
    display: inline-flex;
    align-items: center;
    font-size: 11px;
    font-weight: 700;
    border-radius: 999px;
    padding: 2px 10px;
}

.rec-meta[b-vhod02mpc8] {
    font-size: 12.5px;
    color: var(--text-muted);
    margin-top: 4px;
}

.rec-note[b-vhod02mpc8] {
    font-size: 12.5px;
    color: var(--text-muted);
    margin-top: 6px;
    line-height: 1.45;
}

.rec-actions[b-vhod02mpc8] {
    display: flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
    margin-left: auto;
}

.rec-nocv[b-vhod02mpc8] {
    font-size: 12px;
    color: var(--text-muted);
    font-style: italic;
    padding: 0 6px;
}

/* ── Roles (job postings) ───────────────────────────────────────── */
.rec-roles-head[b-vhod02mpc8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}

.rec-roles-hint[b-vhod02mpc8] {
    margin: 0;
    font-size: 13px;
    color: var(--text-muted);
    line-height: 1.45;
    max-width: 560px;
}

[b-vhod02mpc8] .rec-role-editor {
    border-radius: 14px;
    padding: 18px;
    background: var(--surface);
    margin-bottom: 14px;
}

[b-vhod02mpc8] .rec-role-editor h4 {
    margin: 0 0 12px;
    font-size: 14px;
    font-weight: 800;
    color: var(--text);
}

.rec-role-grid[b-vhod02mpc8] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.rec-role-editor-foot[b-vhod02mpc8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 10px;
    flex-wrap: wrap;
}

.rec-role-editor-btns[b-vhod02mpc8] {
    display: flex;
    gap: 8px;
}

[b-vhod02mpc8] .rec-role-switch {
    margin-right: 0;
}

/* ── Empty state ────────────────────────────────────────────────── */
[b-vhod02mpc8] .rec-empty {
    border-radius: 16px;
    padding: 48px 28px;
    text-align: center;
    background: var(--surface);
}

.rec-empty-ico[b-vhod02mpc8] {
    font-size: 2.2rem;
    margin-bottom: 8px;
}

.rec-empty h3[b-vhod02mpc8] {
    margin: 0 0 6px;
    font-size: 17px;
    font-weight: 800;
    color: var(--text);
}

.rec-empty p[b-vhod02mpc8] {
    margin: 0 auto 18px;
    max-width: 480px;
    font-size: 13.5px;
    color: var(--text-muted);
    line-height: 1.5;
}

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 900px) {
    .rec-stats[b-vhod02mpc8] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 900px) {
    .rec-role-grid[b-vhod02mpc8] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 820px) {
    .rec-page[b-vhod02mpc8] {
        padding: 16px;
    }

    .rec-actions[b-vhod02mpc8] {
        margin-left: 0;
        flex-wrap: wrap;
    }
}

/* The candidate's own one-line role preference (general applications). Its own line rather than
   more grey meta text — these are their words and the reason they applied. */
.rec-interest[b-vhod02mpc8] {
    margin-top: 5px;
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--text);
}
.rec-interest-label[b-vhod02mpc8] { font-weight: 700; color: var(--text-muted); margin-right: 5px; }
.rec-interest-text[b-vhod02mpc8] { font-style: italic; }
/* /Components/Pages/Admin/Responses.razor.rz.scp.css */
/* ::deep throughout: MudAlert and MudButton render these elements, so without it
   Blazor's scoped attribute never lands on them and the rule silently does nothing —
   the same isolation bug that made the courses filter bar look unpadded. */
/* ── Form responses (D7) ─────────────────────────────────────────── */
.resp-page[b-3wkwsztos9] {
    display: flex;
    flex-direction: column;
    gap: 22px;
    padding: 28px;
    max-width: 1280px;
}

@media (max-width: 820px) {
    .resp-page[b-3wkwsztos9] { padding: 16px; gap: 18px; }
}

/* Table card */
[b-3wkwsztos9] .resp-table-card {
    border-radius: 16px;
    padding: 0;
    overflow: hidden;
    background: var(--surface);
}

.resp-table-scroll[b-3wkwsztos9] { overflow-x: auto; }

.resp-table[b-3wkwsztos9] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
}

.resp-table thead th[b-3wkwsztos9] {
    text-align: left;
    padding: 12px 18px;
    color: var(--text-muted);
    font-weight: 700;
    font-size: 0.74rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    background: var(--surface-2);
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}

.resp-table tbody td[b-3wkwsztos9] {
    padding: 13px 18px;
    color: var(--text);
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}

.resp-table tbody tr:last-child td[b-3wkwsztos9] { border-bottom: none; }
.resp-table tbody tr:hover[b-3wkwsztos9] { background: rgba(243, 145, 37, 0.035); }

.resp-id[b-3wkwsztos9] {
    font-weight: 700;
    color: #163E63;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}
.resp-when[b-3wkwsztos9] { color: var(--text-muted); white-space: nowrap; }

.resp-form[b-3wkwsztos9] { color: var(--text-muted); white-space: nowrap; }

/* Two buttons now (Open + Delete), so they need a gap and must stay on one line. */
.resp-actions[b-3wkwsztos9] { text-align: right; white-space: nowrap; }
[b-3wkwsztos9] .resp-actions > * + * { margin-left: 6px; }

[b-3wkwsztos9] .resp-dlg-alert { margin-bottom: 14px; }

/* Filter card */
[b-3wkwsztos9] .resp-filters { padding: 18px; border-radius: 16px; }
.resp-filter-row[b-3wkwsztos9] { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
[b-3wkwsztos9] .resp-form-select { min-width: 260px; max-width: 360px; }
.resp-hint[b-3wkwsztos9] { margin: 12px 0 0; font-size: 0.8rem; color: var(--text-muted); line-height: 1.5; }

.resp-loading[b-3wkwsztos9] { display: flex; justify-content: center; padding: 40px; }

/* Detail dialog — question → answer */
.resp-dlg-lede[b-3wkwsztos9] { margin: 0 0 14px; font-size: 0.88rem; color: var(--text-muted); }
.resp-dlg-h4[b-3wkwsztos9] { margin: 20px 0 8px; font-size: 0.9rem; color: var(--text); }

.resp-answers[b-3wkwsztos9] { margin: 0; display: flex; flex-direction: column; gap: 2px; }

.resp-answer[b-3wkwsztos9] {
    display: grid;
    grid-template-columns: minmax(160px, 38%) 1fr;
    gap: 14px;
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
}

.resp-answer:last-child[b-3wkwsztos9] { border-bottom: none; }

.resp-answer dt[b-3wkwsztos9] {
    margin: 0;
    font-weight: 700;
    font-size: 0.84rem;
    color: var(--text-muted);
}

.resp-answer dd[b-3wkwsztos9] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--text);
    /* A long-text answer must wrap rather than stretch the dialog into a horizontal scroll. */
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.resp-blank[b-3wkwsztos9] { color: var(--text-muted); font-style: italic; }

.resp-file[b-3wkwsztos9] { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.resp-file-missing[b-3wkwsztos9] { color: var(--text-muted); font-style: italic; font-weight: 400; }

.resp-loose-files[b-3wkwsztos9] { margin: 0; padding-left: 20px; font-size: 0.88rem; }

@media (max-width: 640px) {
    .resp-answer[b-3wkwsztos9] { grid-template-columns: 1fr; gap: 4px; }
}

/* Empty state */
.resp-empty[b-3wkwsztos9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
    padding: 48px 24px;
    color: var(--text-muted);
}

.resp-empty-icon[b-3wkwsztos9] { font-size: 2.2rem; }
.resp-empty h3[b-3wkwsztos9] { margin: 0; color: var(--text); font-size: 1.05rem; }
.resp-empty p[b-3wkwsztos9] { margin: 0; max-width: 480px; font-size: 0.88rem; line-height: 1.5; }
/* /Components/Pages/Admin/Settings.razor.rz.scp.css */
/* Settings (D11) — admin portal. Left vertical tab nav + right config panels. */

.e2c-set[b-ujzff3861l] {
    padding: 28px;
    max-width: 1100px;
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 24px;
    align-items: start;
    font-family: 'Inter', system-ui, sans-serif;
}

/* The activity log is the one tab holding a wide, four-column data table; every other tab is a
   form, and forms read badly stretched across a 2560px monitor (a 40-character label with a
   2000px input beside it). So the extra width is scoped to this tab rather than raised globally
   — the form tabs keep the 1100px measure that was chosen for them. */
.e2c-set.is-wide[b-ujzff3861l] { max-width: 1600px; }

@media (max-width: 820px) {
    .e2c-set[b-ujzff3861l] { grid-template-columns: 1fr; padding: 16px; gap: 16px; }
}

/* ── Left vertical tab nav ──────────────────────────────────────────── */
.e2c-set-nav[b-ujzff3861l] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    position: sticky;
    top: 16px;
}

@media (max-width: 820px) {
    .e2c-set-nav[b-ujzff3861l] {
        position: static;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 6px;
    }
}

.e2c-set-tab[b-ujzff3861l] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    text-align: left;
    padding: 10px 12px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: var(--text-muted);
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}

.e2c-set-tab:hover[b-ujzff3861l] { background: var(--surface-2); color: var(--text); }

.e2c-set-tab.is-active[b-ujzff3861l] {
    background: rgba(243, 145, 37, 0.12);
    border-color: rgba(243, 145, 37, 0.4);
    color: #9C5A0F;
}

@media (max-width: 820px) {
    .e2c-set-tab[b-ujzff3861l] { width: auto; }
}

/* ── Panel shell ────────────────────────────────────────────────────── */
.e2c-set-panel-wrap[b-ujzff3861l] { min-width: 0; }

[b-ujzff3861l] .e2c-card {
    padding: 24px;
    border-radius: 16px;
    border-color: var(--border);
    background: var(--surface);
}

.e2c-card-head[b-ujzff3861l] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.e2c-card-title[b-ujzff3861l] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-size: 1.12rem;
    font-weight: 700;
    color: var(--text);
    margin: 0;
}

.e2c-card-sub[b-ujzff3861l] { font-size: 0.86rem; color: var(--text-muted); margin: 3px 0 0; }

.e2c-card-foot[b-ujzff3861l] {
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid var(--border);
    display: flex;
    justify-content: flex-start;
    gap: 10px;
}

.e2c-foot-note[b-ujzff3861l] { margin: 16px 0 0; font-size: 0.82rem; color: var(--text-muted); }

.e2c-set-action[b-ujzff3861l] { text-transform: none; }

/* ── Field grid ─────────────────────────────────────────────────────── */
.e2c-field-grid[b-ujzff3861l] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

@media (max-width: 560px) {
    .e2c-field-grid[b-ujzff3861l] { grid-template-columns: 1fr; }
    .e2c-card-head[b-ujzff3861l] { flex-direction: column; }
}

.e2c-field[b-ujzff3861l] { min-width: 0; }
.e2c-field.is-wide[b-ujzff3861l] { grid-column: 1 / -1; }

/* ── Monthly class billing: grace days + raise day, side by side ─────
   A narrow pair rather than the two-column card grid: they are one setting read together
   ("bill on the 25th, lock 7 days later"), and the resolution line beneath belongs to both. */
.e2c-billing-row[b-ujzff3861l] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: .5rem;
}
.e2c-billing-row .e2c-field[b-ujzff3861l] { flex: 1 1 14rem; max-width: 18rem; }

/* ── Notifications callout ──────────────────────────────────────────── */
.e2c-callout[b-ujzff3861l] {
    margin-top: 20px;
    padding: 16px;
    border: 1px solid rgba(31, 90, 138, 0.2);
    border-radius: 12px;
    background: rgba(31, 90, 138, 0.05);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.e2c-callout-main[b-ujzff3861l] { display: flex; align-items: center; gap: 14px; }

.e2c-callout-glyph[b-ujzff3861l] {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 11px;
    display: grid;
    place-items: center;
    font-size: 1.2rem;
    background: rgba(31, 90, 138, 0.12);
}

.e2c-callout-main strong[b-ujzff3861l] { color: var(--text); font-size: 0.95rem; }
.e2c-callout-main p[b-ujzff3861l] { margin: 2px 0 0; font-size: 0.84rem; color: var(--text-muted); }

/* ── Payment override block ─────────────────────────────────────────── */
.e2c-override[b-ujzff3861l] {
    margin-top: 24px;
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface-2);
}

.e2c-override-title[b-ujzff3861l] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--text);
    margin: 0;
}

.e2c-override-help[b-ujzff3861l] { font-size: 0.84rem; color: var(--text-muted); margin: 4px 0 0; line-height: 1.5; }

.e2c-pills[b-ujzff3861l] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 16px 0;
}

.e2c-pill[b-ujzff3861l] {
    padding: 9px 16px;
    border: 1px solid var(--border-strong);
    border-radius: 999px;
    background: var(--surface);
    color: var(--text-muted);
    font-size: 0.86rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}

.e2c-pill:hover:not(:disabled)[b-ujzff3861l] { border-color: rgba(243, 145, 37, 0.5); color: var(--text); }
.e2c-pill:disabled[b-ujzff3861l] { cursor: default; opacity: 0.7; }

.e2c-pill.is-active[b-ujzff3861l] {
    background: rgba(243, 145, 37, 0.14);
    border-color: #F39125;
    color: #9C5A0F;
}

.e2c-resolve-line[b-ujzff3861l] {
    margin: 10px 0 0;
    font-size: 0.82rem;
    color: var(--text-muted);
}

.e2c-resolve-line strong[b-ujzff3861l] { font-weight: 700; color: var(--text); }

/* ── Activity log ───────────────────────────────────────────────────── */
.e2c-audit[b-ujzff3861l] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--border);
    border-radius: 12px;
    overflow: hidden;
}

.e2c-audit-row[b-ujzff3861l] {
    display: grid;
    /* The "who" track was a FIXED 120px while it renders an email address — donisiayearwood01@
       gmail.com needs ~200px. A grid item's automatic minimum size is its content, so the text
       could not shrink and instead painted straight over the category chip beside it. Fixed by
       giving the track a real range AND letting the cell below shrink (min-width: 0), which is
       the pair that actually stops the overflow: the range alone still overflows once the
       address exceeds the maximum. .e2c-audit-detail already had the min-width half. */
    grid-template-columns: 92px minmax(0, 210px) auto minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    padding: 11px 16px;
    border-bottom: 1px solid var(--border);
    font-size: 0.86rem;
}

.e2c-audit-row:last-child[b-ujzff3861l] { border-bottom: none; }
.e2c-audit-row:nth-child(even)[b-ujzff3861l] { background: var(--surface-2); }

.e2c-audit-time[b-ujzff3861l] {
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* anywhere, not break-word: an email address has no spaces, so break-word finds no
   opportunity and the string still overflows. */
.e2c-audit-who[b-ujzff3861l] {
    font-weight: 700;
    color: var(--text);
    min-width: 0;
    overflow-wrap: anywhere;
}

.e2c-audit-action[b-ujzff3861l] {
    justify-self: start;
    padding: 2px 9px;
    border: 1px solid var(--border-strong);
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--text-muted);
    white-space: nowrap;
}

.e2c-audit-detail[b-ujzff3861l] { color: var(--text); min-width: 0; }

@media (max-width: 640px) {
    .e2c-audit-row[b-ujzff3861l] {
        grid-template-columns: 1fr;
        gap: 4px;
    }
    .e2c-audit-action[b-ujzff3861l] { justify-self: start; }
}

/* ── Empty state ────────────────────────────────────────────────────── */
.e2c-empty[b-ujzff3861l] { text-align: center; padding: 44px 24px; color: var(--text-muted); }
.e2c-empty-glyph[b-ujzff3861l] { font-size: 2.2rem; margin-bottom: 10px; }
.e2c-empty-title[b-ujzff3861l] { font-weight: 700; color: var(--text); margin: 0 0 6px; font-size: 1rem; }
.e2c-empty-sub[b-ujzff3861l] { font-size: 0.88rem; line-height: 1.55; margin: 0 auto; max-width: 46ch; }

/* ── Per-day opening hours (#449) ─────────────────────────────
   One row per weekday: day label, hours field, Closed switch. */
.e2c-hours[b-ujzff3861l] { display: flex; flex-direction: column; gap: 8px; }
.e2c-hours-row[b-ujzff3861l] {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
}
.e2c-hours-day[b-ujzff3861l] {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
@media (max-width: 640px) {
    .e2c-hours-row[b-ujzff3861l] { grid-template-columns: 44px minmax(0, 1fr); }
    .e2c-hours-row .mud-switch[b-ujzff3861l] { grid-column: 2; }
}

/* ── Integration status cards (#452) ──────────────────────────
   Replaces the old key-shaped rows: adapters bind at start-up from App Settings,
   so what matters here is whether each one is live, not a box to paste into. */
.e2c-int-grid[b-ujzff3861l] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 14px;
}
.e2c-int-card[b-ujzff3861l] {
    border: 1px solid var(--border);
    border-left: 3px solid var(--border);
    border-radius: 12px;
    padding: 14px 16px;
}
.e2c-int-card.is-live[b-ujzff3861l] { border-left-color: #3F7321; }
.e2c-int-card.is-off[b-ujzff3861l] { border-left-color: #C25A00; }
.e2c-int-head[b-ujzff3861l] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 6px;
}
.e2c-int-name[b-ujzff3861l] { margin: 0; font-size: 0.92rem; font-weight: 700; color: var(--text); }
.e2c-int-pill[b-ujzff3861l] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    border-radius: 999px;
    padding: 2px 9px;
    white-space: nowrap;
}
.is-live .e2c-int-pill[b-ujzff3861l] { color: #1E6B33; background: #EAF6EC; }
.is-off .e2c-int-pill[b-ujzff3861l] { color: #9A5B00; background: #FDF0DC; }
.e2c-int-what[b-ujzff3861l] { margin: 0; font-size: 0.82rem; line-height: 1.45; color: var(--text); }
.e2c-int-detail[b-ujzff3861l] {
    margin: 6px 0 0;
    font-size: 0.72rem;
    color: var(--text-muted);
    word-break: break-all;
}
/* /Components/Pages/Admin/SiteContent.razor.rz.scp.css */
/* D24 — Site Content CMS. Lives inside the dark admin shell; content area is warm paper. */

.cms-page[b-ayuwsg53zs] {
    padding: 28px 28px 48px;
    max-width: 1180px;
}

.cms-loading[b-ayuwsg53zs] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 40px 0;
    color: var(--text-muted);
    font-size: 14px;
}

/* ── Tab strip ──────────────────────────────────────────────────── */
.cms-tabs[b-ayuwsg53zs] {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 22px;
}

.cms-tab[b-ayuwsg53zs] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 10px 16px 12px;
    margin-bottom: -1px;
    cursor: pointer;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--text-muted);
    transition: color .12s ease, border-color .12s ease;
}

.cms-tab:hover[b-ayuwsg53zs] {
    color: var(--text);
}

.cms-tab-active[b-ayuwsg53zs] {
    color: var(--text);
    border-bottom-color: #F39125;
}

.cms-tab-ico[b-ayuwsg53zs] {
    font-size: 1rem;
}

.cms-tab-count[b-ayuwsg53zs] {
    font-size: 11px;
    font-weight: 700;
    color: var(--text-muted);
    background: rgba(15, 27, 45, .08);
    border-radius: 999px;
    padding: 1px 8px;
    min-width: 20px;
    text-align: center;
}

.cms-tab-active .cms-tab-count[b-ayuwsg53zs] {
    color: #9C5A0F;
    background: rgba(243, 145, 37, .16);
}

.cms-btn-glyph[b-ayuwsg53zs] {
    font-size: 1rem;
}

/* Per-tab "where this shows up" helper line, tucked under the tab strip. */
.cms-tab-note[b-ayuwsg53zs] {
    margin: -12px 0 18px;
    font-size: 12.5px;
    color: var(--text-muted);
}

/* ── List ───────────────────────────────────────────────────────── */
.cms-list[b-ayuwsg53zs] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

[b-ayuwsg53zs] .cms-card {
    display: flex;
    align-items: center;
    gap: 16px;
    border-radius: 14px;
    padding: 14px 18px;
    background: var(--surface);
}

.cms-card-ico[b-ayuwsg53zs] {
    width: 40px;
    height: 40px;
    border-radius: 11px;
    display: grid;
    place-items: center;
    font-size: 1.15rem;
    flex: 0 0 auto;
}

.cms-card-main[b-ayuwsg53zs] {
    flex: 1 1 auto;
    min-width: 0;
}

.cms-card-name[b-ayuwsg53zs] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    font-size: 14.5px;
    font-weight: 700;
    color: var(--text);
}

.cms-card-sub[b-ayuwsg53zs] {
    font-size: 12.5px;
    color: var(--text-muted);
    margin-top: 4px;
    word-break: break-word;
}

.cms-card-actions[b-ayuwsg53zs] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    margin-left: auto;
}

/* ── Status pill ────────────────────────────────────────────────── */
.cms-status[b-ayuwsg53zs] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11.5px;
    font-weight: 700;
    border-radius: 999px;
    padding: 2px 10px;
}

.cms-status-dot[b-ayuwsg53zs] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
}

.cms-chip-free[b-ayuwsg53zs] {
    font-size: 11px;
    font-weight: 700;
    color: #3F7321;
    background: rgba(111, 174, 63, .16);
    border-radius: 999px;
    padding: 2px 9px;
}

/* ── Empty state ────────────────────────────────────────────────── */
[b-ayuwsg53zs] .cms-empty {
    border-radius: 16px;
    padding: 48px 28px;
    text-align: center;
    background: var(--surface);
}

.cms-empty-ico[b-ayuwsg53zs] {
    font-size: 2.2rem;
    margin-bottom: 8px;
}

.cms-empty h3[b-ayuwsg53zs] {
    margin: 0 0 6px;
    font-size: 17px;
    font-weight: 800;
    color: var(--text);
}

.cms-empty p[b-ayuwsg53zs] {
    margin: 0 auto 18px;
    max-width: 460px;
    font-size: 13.5px;
    color: var(--text-muted);
    line-height: 1.5;
}

/* ── Form ───────────────────────────────────────────────────────── */
[b-ayuwsg53zs] .cms-form {
    border-radius: 16px;
    padding: 24px 26px;
    max-width: 720px;
    background: var(--surface);
}

.cms-form-title[b-ayuwsg53zs] {
    margin: 0 0 18px;
    font-size: 18px;
    font-weight: 800;
    color: var(--text);
}

.cms-form-grid[b-ayuwsg53zs] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 18px;
}

.cms-span2[b-ayuwsg53zs] {
    grid-column: 1 / -1;
}

.cms-form-divider[b-ayuwsg53zs] {
    margin: 22px 0 16px;
}

.cms-form-foot[b-ayuwsg53zs] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

/* ── Upload field ───────────────────────────────────────────────── */
.cms-upload[b-ayuwsg53zs] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cms-upload-label[b-ayuwsg53zs] {
    font-size: 12.5px;
    font-weight: 600;
    color: var(--text-muted);
}

.cms-upload-zone[b-ayuwsg53zs] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    text-align: left;
    border: 1.5px dashed var(--border);
    border-radius: 12px;
    background: var(--surface-2);
    padding: 14px 16px;
    cursor: pointer;
    transition: border-color .12s ease, background .12s ease;
}

/* MudFileUpload wraps the zone button; keep the wrapper invisible in the grid. */
[b-ayuwsg53zs] .cms-upload .mud-file-upload {
    margin: 0;
    width: 100%;
}

.cms-upload-zone:hover[b-ayuwsg53zs] {
    border-color: #F39125;
    background: rgba(243, 145, 37, .05);
}

.cms-upload-zone:disabled[b-ayuwsg53zs] {
    cursor: default;
    opacity: .7;
}

.cms-upload-thumb[b-ayuwsg53zs] {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    object-fit: cover;
    flex: 0 0 auto;
}

.cms-upload-remove[b-ayuwsg53zs] {
    align-self: flex-start;
    background: none;
    border: none;
    padding: 0;
    font-size: 12px;
    font-weight: 600;
    color: #9D2828;
    cursor: pointer;
}

.cms-upload-remove:hover[b-ayuwsg53zs] {
    text-decoration: underline;
}

.cms-upload-on[b-ayuwsg53zs] {
    border-style: solid;
    border-color: rgba(111, 174, 63, .5);
    background: rgba(111, 174, 63, .07);
}

.cms-upload-ico[b-ayuwsg53zs] {
    font-size: 1.3rem;
    flex: 0 0 auto;
}

.cms-upload-text[b-ayuwsg53zs] {
    display: flex;
    flex-direction: column;
    line-height: 1.35;
    min-width: 0;
}

.cms-upload-text strong[b-ayuwsg53zs] {
    font-size: 13px;
    font-weight: 700;
    color: var(--text);
    word-break: break-all;
}

.cms-upload-text em[b-ayuwsg53zs] {
    font-size: 11.5px;
    font-style: normal;
    color: var(--text-muted);
}

.cms-upload-on .cms-upload-text em[b-ayuwsg53zs] {
    color: #3F7321;
    font-weight: 600;
}

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 820px) {
    .cms-page[b-ayuwsg53zs] {
        padding: 16px;
    }

    .cms-form-grid[b-ayuwsg53zs] {
        grid-template-columns: 1fr;
    }

    [b-ayuwsg53zs] .cms-card {
        flex-wrap: wrap;
    }

    .cms-card-actions[b-ayuwsg53zs] {
        margin-left: 0;
        width: 100%;
    }
}
/* /Components/Pages/Admin/Staff.razor.rz.scp.css */
.e2c-st-page[b-5hwcnjev06] {
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

/* ── Stat cards ─────────────────────────────────────────────── */
.e2c-st-stats[b-5hwcnjev06] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.e2c-st-action[b-5hwcnjev06] {
    text-transform: none;
    font-weight: 600;
    border-radius: 10px;
}

/* ── Card grid ──────────────────────────────────────────────── */
.e2c-st-cards[b-5hwcnjev06] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

[b-5hwcnjev06] .e2c-st-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.e2c-st-card-top[b-5hwcnjev06] {
    display: flex;
    align-items: center;
    gap: 14px;
}

.e2c-st-avatar[b-5hwcnjev06] {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    border-radius: 50%;
    background: var(--brand-blue-deep);
    color: #fff;
    display: grid;
    place-items: center;
    font-weight: 700;
    font-size: 0.95rem;
}

.e2c-st-person-text[b-5hwcnjev06] {
    display: flex;
    flex-direction: column;
    line-height: 1.35;
    flex: 1;
    min-width: 0;
}

.e2c-st-name[b-5hwcnjev06] {
    font-weight: 700;
    color: var(--text);
    font-size: 0.95rem;
}

.e2c-st-role[b-5hwcnjev06] {
    font-size: 0.8rem;
    color: var(--text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.e2c-st-email[b-5hwcnjev06] {
    font-size: 0.76rem;
    color: var(--text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.e2c-st-card-meta[b-5hwcnjev06] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
    font-size: 0.78rem;
    color: var(--text-muted);
}

.e2c-st-emp[b-5hwcnjev06] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding: 4px 9px;
    border-radius: 999px;
    background: var(--surface-2);
    color: var(--text-muted);
}

.e2c-st-bal[b-5hwcnjev06] { font-variant-numeric: tabular-nums; }

.e2c-st-num[b-5hwcnjev06] {
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    color: var(--text);
}

/* ── Empty ──────────────────────────────────────────────────── */
[b-5hwcnjev06] .e2c-st-empty-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
}

.e2c-st-empty[b-5hwcnjev06] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 56px 24px;
    text-align: center;
}

.e2c-st-empty-glyph[b-5hwcnjev06] { font-size: 2rem; opacity: 0.6; }
.e2c-st-empty-title[b-5hwcnjev06] { font-weight: 700; color: var(--text); margin: 6px 0 0; }
.e2c-st-empty-sub[b-5hwcnjev06] { color: var(--text-muted); font-size: 0.88rem; margin: 0; }

@media (max-width: 1000px) {
    .e2c-st-stats[b-5hwcnjev06] { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 760px) {
    .e2c-st-cards[b-5hwcnjev06] { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
    .e2c-st-page[b-5hwcnjev06] { padding: 16px; }
    .e2c-st-stats[b-5hwcnjev06] { grid-template-columns: 1fr; }
}

/* #97: HR-editable extra details (public tutor credentials line) */
.e2c-st-details[b-5hwcnjev06] {
    margin: 10px 0 0;
    font-size: 12.5px;
    color: var(--text-muted, #5A6B82);
    line-height: 1.45;
}

.e2c-st-dlg-title[b-5hwcnjev06] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 700;
}

/* ── #409: portal login provisioning ────────────────────────── */
.e2c-st-login-row[b-5hwcnjev06] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
    font-size: 0.78rem;
}

.e2c-st-login-off[b-5hwcnjev06] { color: var(--text-muted); }

.e2c-st-login-on[b-5hwcnjev06] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 4px 9px;
    border-radius: 999px;
    background: rgba(111, 174, 63, 0.16);
    color: #4E7D24;
}

.e2c-st-role-chip[b-5hwcnjev06] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 4px 9px;
    border-radius: 999px;
    background: rgba(31, 90, 138, 0.12);
    color: #1F5A8A;
}

html[data-theme="dark"] .e2c-st-login-on[b-5hwcnjev06] { background: rgba(111, 174, 63, 0.26); color: #B5DE8F; }
html[data-theme="dark"] .e2c-st-role-chip[b-5hwcnjev06] { background: rgba(94, 160, 224, 0.24); color: #A9D0F5; }

[b-5hwcnjev06] .e2c-st-login-btn {
    margin-left: auto;
    text-transform: none;
    font-weight: 600;
}

.e2c-st-dlg-fields[b-5hwcnjev06] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-top: 4px;
}

.e2c-st-dlg-sub[b-5hwcnjev06] {
    color: var(--text-muted);
    font-size: 0.84rem;
    line-height: 1.5;
    margin: 0;
}

/* ── #435 per-user screen permissions ──────────────────────────────────────
   The picker itself styles its own internals; these rules only frame it inside
   the Staff dialogs. The permissions dialog is Medium width (not Small) because
   a two-column screen list is far easier to scan than one long column. */

.e2c-st-perm-block[b-5hwcnjev06] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    border-top: 1px solid var(--border, rgba(0, 0, 0, .08));
    padding-top: 12px;
}

.e2c-st-perm-head[b-5hwcnjev06] {
    margin: 0;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-muted);
}

/* Shown instead of the picker for an administrator, whose access is not grant-based.
   Deliberately an explanation, not a disabled all-ticked list: a greyed-out set of ticks
   would still imply the boxes are what grants their access. */
.e2c-st-admin-note[b-5hwcnjev06] {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    background: #eef4fb;
    border: 1px solid #c9dcf0;
    border-radius: 10px;
    padding: 12px 14px;
    font-size: 0.84rem;
    line-height: 1.55;
    color: #1f3d5c;
}

/* ── Staff form dialog (#450 / #433) ──────────────────────────
   Two columns on desktop; the details textarea spans both. */
.e2c-st-form[b-5hwcnjev06] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
.e2c-st-form-wide[b-5hwcnjev06] { grid-column: 1 / -1; }
.e2c-st-form-note[b-5hwcnjev06] {
    margin: 14px 0 0;
    font-size: 0.8rem;
    line-height: 1.5;
    color: var(--text-muted);
}
@media (max-width: 640px) {
    .e2c-st-form[b-5hwcnjev06] { grid-template-columns: 1fr; }
}

/* ── Two-stage removal: disabled staff, and the delete dialog ──────────────
   A disabled card is dimmed but NOT hidden and NOT unreadable: the client still
   needs to find the person to reinstate them, and greying a card into
   illegibility just moves the problem. Text stays at full opacity. */
[b-5hwcnjev06] .e2c-st-card.is-disabled {
    border-style: dashed;
    background: var(--surface-muted, rgba(15, 27, 45, .02));
}
[b-5hwcnjev06] .e2c-st-card.is-disabled .e2c-st-avatar { opacity: .55; }

.e2c-st-disabled-note[b-5hwcnjev06] {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    margin: 10px 0 0;
    font-size: 0.8rem;
    line-height: 1.5;
    color: var(--text-muted);
}

.e2c-st-login-blocked[b-5hwcnjev06] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 4px 9px;
    border-radius: 999px;
    background: rgba(210, 69, 69, 0.14);
    color: #A33636;
}
html[data-theme="dark"] .e2c-st-login-blocked[b-5hwcnjev06] { background: rgba(210, 69, 69, 0.26); color: #F0A9A9; }

/* Red variant of the shared note box, for the irreversible half of the dialog. */
.e2c-st-admin-note.is-danger[b-5hwcnjev06] {
    background: #fdf0f0;
    border-color: #f0c9c9;
    color: #7a2b2b;
}
html[data-theme="dark"] .e2c-st-admin-note.is-danger[b-5hwcnjev06] {
    background: rgba(210, 69, 69, .14);
    border-color: rgba(210, 69, 69, .38);
    color: #F3BDBD;
}

/* What blocks a delete / what a delete takes with it. One row per fact, because the
   admin reads this to decide whether to act, not to skim. */
.e2c-st-blockers[b-5hwcnjev06] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 0.84rem;
    line-height: 1.5;
}
.e2c-st-blockers li[b-5hwcnjev06] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 10px;
    padding: 8px 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
}
/* /Components/Pages/Admin/Students.razor.rz.scp.css */
/* Student portal accounts (/admin/students) */

.stu-page[b-yt0dp4xj1p] { display: flex; flex-direction: column; gap: 14px; }

[b-yt0dp4xj1p] .e2c-card { padding: 16px 18px; }

.stu-toolbar[b-yt0dp4xj1p] {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

[b-yt0dp4xj1p] .stu-search { max-width: 320px; flex: 1 1 240px; }

[b-yt0dp4xj1p] .stu-grid { --mud-elevation-0: none; }

.stu-name[b-yt0dp4xj1p] { font-weight: 700; font-size: .92rem; }

.stu-sub[b-yt0dp4xj1p] {
    font-size: .76rem;
    color: var(--mud-palette-text-secondary);
    line-height: 1.45;
}

.stu-mono[b-yt0dp4xj1p] {
    font-family: ui-monospace, 'Cascadia Mono', 'Consolas', monospace;
    font-size: .78rem;
    overflow-wrap: anywhere;
}

.stu-badge[b-yt0dp4xj1p] {
    display: inline-block;
    font-size: .66rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .05em;
    padding: 2px 8px;
    border-radius: 999px;
    white-space: nowrap;
}
.stu-badge.is-on[b-yt0dp4xj1p] { background: rgba(111, 174, 63, .16); color: #4E7D24; }
.stu-badge.is-off[b-yt0dp4xj1p] { background: rgba(90, 107, 130, .12); color: #5A6B82; }

.stu-dup[b-yt0dp4xj1p] {
    display: inline-block;
    margin-left: 6px;
    font-size: .7rem;
    font-weight: 700;
    color: var(--mud-palette-warning-darken, #b26a00);
    cursor: help;
    white-space: nowrap;
}

[b-yt0dp4xj1p] .stu-actions { white-space: nowrap; text-align: right; }

.stu-empty[b-yt0dp4xj1p] { text-align: center; padding: 48px 20px; }
.stu-empty-glyph[b-yt0dp4xj1p] { font-size: 2rem; display: block; margin-bottom: 8px; }
.stu-empty h3[b-yt0dp4xj1p] { margin: 0 0 6px; font-size: 1.05rem; font-weight: 700; }
.stu-empty p[b-yt0dp4xj1p] {
    margin: 0 auto;
    max-width: 420px;
    font-size: .86rem;
    color: var(--mud-palette-text-secondary);
    line-height: 1.55;
}

/* ── Dialogs ─────────────────────────────────────────────────────────────── */

.stu-dlg-lede[b-yt0dp4xj1p] {
    margin: 0 0 14px;
    font-size: .9rem;
    line-height: 1.55;
    color: var(--mud-palette-text-secondary);
}
.stu-dlg-lede strong[b-yt0dp4xj1p] { color: var(--mud-palette-text-primary); }

/* The delete dialog's whole job is making "what survives" unmistakable. */
.stu-keep[b-yt0dp4xj1p] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: 14px 0 4px;
}

.stu-keep-col[b-yt0dp4xj1p] {
    border: 1px solid var(--mud-palette-divider);
    border-radius: 10px;
    padding: 10px 12px;
}

.stu-keep-h[b-yt0dp4xj1p] {
    display: block;
    font-size: .66rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .07em;
    margin-bottom: 6px;
}
.stu-keep-h.is-gone[b-yt0dp4xj1p] { color: #C33A3A; }
.stu-keep-h.is-kept[b-yt0dp4xj1p] { color: #4E7D24; }

.stu-keep ul[b-yt0dp4xj1p] { margin: 0; padding-left: 16px; }
.stu-keep li[b-yt0dp4xj1p] {
    font-size: .8rem;
    line-height: 1.5;
    color: var(--mud-palette-text-secondary);
    margin-bottom: 3px;
}

@media (max-width: 560px) {
    .stu-keep[b-yt0dp4xj1p] { grid-template-columns: 1fr; }
}

/* Temporary-password row: field + regenerate button on one line. */
.stu-pw-row[b-yt0dp4xj1p] { display: flex; align-items: flex-start; gap: 8px; }
.stu-pw-row > :first-child[b-yt0dp4xj1p] { flex: 1; }
[b-yt0dp4xj1p] .stu-pw-row .mud-button { margin-top: 4px; white-space: nowrap; }
/* /Components/Pages/Admin/Verification.razor.rz.scp.css */
/* ── Reconciliation queue (D4) ─────────────────────────────────── */
.recon-wrap[b-c7h946suvw] { padding: 28px; max-width: 1240px; margin: 0 auto; }

.recon-action-btn[b-c7h946suvw] { text-transform: none; font-weight: 600; border-radius: 10px; }

/* ── Work pool (claims) ────────────────────────────────────────── */
.recon-viewbar[b-c7h946suvw] { margin-bottom: 18px; }
.recon-viewbar .mud-chip[b-c7h946suvw] { font-weight: 600; }
.recon-claim[b-c7h946suvw] { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: -4px 0 14px; }
.recon-claim .mud-button-root[b-c7h946suvw] { text-transform: none; font-weight: 600; }
.recon-claim-hint[b-c7h946suvw] { font-size: 0.8rem; color: var(--text-muted); text-align: center; margin: 0; }

/* ── Stat strip ────────────────────────────────────────────────── */
.recon-stats[b-c7h946suvw] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 22px;
}

/* ── Empty / loading states ────────────────────────────────────── */
[b-c7h946suvw] .recon-empty {
    border-radius: 16px;
    padding: 56px 32px;
    text-align: center;
    background: var(--surface);
}
.recon-empty-glyph[b-c7h946suvw] { font-size: 2.4rem; margin-bottom: 10px; }
.recon-empty h2[b-c7h946suvw] { font-weight: 800; font-size: 1.3rem; margin: 0 0 8px; color: var(--text); }
.recon-empty p[b-c7h946suvw] { color: var(--text-muted); max-width: 440px; margin: 0 auto 18px; font-size: 0.92rem; }
.recon-empty-cta[b-c7h946suvw] { text-transform: none; font-weight: 700; border-radius: 10px; }

/* ── Split layout ──────────────────────────────────────────────── */
.recon-split[b-c7h946suvw] {
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    gap: 20px;
    align-items: start;
}

/* ── Left column — current transfer ────────────────────────────── */
.recon-left[b-c7h946suvw] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    position: sticky;
    top: 16px;
}

/* "1 of N" counter group in the transfer card header */
.recon-transfer-head[b-c7h946suvw] { align-items: center; }
.recon-counter-group[b-c7h946suvw] { display: flex; align-items: center; gap: 4px; }
.recon-counter[b-c7h946suvw] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
    min-width: 48px;
    text-align: center;
}
.recon-counter-nav[b-c7h946suvw] { color: var(--text-muted); }

/* ── Batch bar ─────────────────────────────────────────────────── */
.recon-batch[b-c7h946suvw] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 18px;
    border-radius: 12px;
    background: var(--brand-blue-deep);
    color: #fff;
}
.recon-batch-label[b-c7h946suvw] { font-size: 0.82rem; font-weight: 600; }
.recon-batch-actions[b-c7h946suvw] { display: flex; gap: 8px; }
.recon-batch-actions .mud-button-root[b-c7h946suvw] { text-transform: none; font-weight: 600; }

/* ── Right detail column ───────────────────────────────────────── */
.recon-detail[b-c7h946suvw] { display: flex; flex-direction: column; gap: 18px; }

[b-c7h946suvw] .recon-detail-empty {
    border-radius: 16px;
    padding: 48px 28px;
    text-align: center;
    background: var(--surface);
}
.recon-detail-empty h3[b-c7h946suvw] { font-weight: 700; margin: 6px 0 6px; color: var(--text); }
.recon-detail-empty p[b-c7h946suvw] { color: var(--text-muted); font-size: 0.9rem; margin: 0; }

[b-c7h946suvw] .recon-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 22px;
}
.recon-card-head[b-c7h946suvw] { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.recon-card-head-left[b-c7h946suvw] { display: flex; align-items: center; gap: 10px; }
.recon-card-icon[b-c7h946suvw] {
    width: 34px; height: 34px; border-radius: 9px;
    display: grid; place-items: center;
    background: rgba(31, 90, 138, 0.1);
    font-size: 1.05rem;
}
.recon-card-title[b-c7h946suvw] { font-weight: 700; color: var(--text); font-size: 1.02rem; }
.recon-card-sub[b-c7h946suvw] { color: var(--text-muted); font-size: 0.88rem; margin: -6px 0 16px; }

.recon-batch-check[b-c7h946suvw] { display: flex; align-items: center; gap: 2px; font-size: 0.78rem; color: var(--text-muted); cursor: pointer; }

/* ── Transfer card ─────────────────────────────────────────────── */
.recon-amount-label[b-c7h946suvw] { text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.7rem; font-weight: 700; color: var(--text-muted); }
.recon-amount[b-c7h946suvw] { font-size: 2.1rem; font-weight: 800; color: var(--text); line-height: 1.1; margin: 2px 0 18px; font-variant-numeric: tabular-nums; }

.recon-grid[b-c7h946suvw] { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 20px; margin-bottom: 16px; }
.recon-field[b-c7h946suvw] { display: flex; flex-direction: column; gap: 3px; }
.recon-field-wide[b-c7h946suvw] { grid-column: 1 / -1; }
.recon-micro[b-c7h946suvw] { text-transform: uppercase; letter-spacing: 0.07em; font-size: 0.66rem; font-weight: 700; color: var(--text-muted); }
.recon-val[b-c7h946suvw] { font-size: 0.92rem; color: var(--text); font-weight: 600; word-break: break-word; }

.recon-alert[b-c7h946suvw] { border-radius: 10px; margin-top: 6px; }
.recon-tip[b-c7h946suvw] { margin-top: 16px; }

/* ── Candidate rows ────────────────────────────────────────────── */
.recon-cands[b-c7h946suvw] { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }
.recon-cand[b-c7h946suvw] {
    display: flex; align-items: center; gap: 12px; width: 100%; text-align: left;
    background: var(--surface); cursor: pointer;
    border: 1.5px solid var(--border);
    border-radius: 12px;
    padding: 14px 16px;
    transition: border-color 0.12s ease, background 0.12s ease;
}
.recon-cand:hover[b-c7h946suvw] { border-color: rgba(111, 174, 63, 0.5); }
.recon-cand.is-picked[b-c7h946suvw] { border-color: var(--brand-green); background: rgba(111, 174, 63, 0.08); }
.recon-cand-dot[b-c7h946suvw] {
    flex: 0 0 auto; width: 18px; height: 18px; border-radius: 50%;
    border: 2px solid var(--border-strong); position: relative;
}
.recon-cand-dot.is-picked[b-c7h946suvw] { border-color: var(--brand-green); }
.recon-cand-dot.is-picked[b-c7h946suvw]::after {
    content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--brand-green);
}
.recon-cand-body[b-c7h946suvw] { flex: 1; min-width: 0; }
.recon-cand-line1[b-c7h946suvw] { display: flex; align-items: center; gap: 8px; }
.recon-cand-name[b-c7h946suvw] { font-weight: 700; color: var(--text); font-size: 0.95rem; }
.recon-cand-exact[b-c7h946suvw] {
    background: rgba(111, 174, 63, 0.16); color: #3F7321;
    font-size: 0.68rem; font-weight: 700; padding: 2px 8px; border-radius: 999px;
}
.recon-cand-line2[b-c7h946suvw] { font-size: 0.8rem; color: var(--text-muted); margin-top: 2px; }
.recon-cand-score[b-c7h946suvw] { flex: 0 0 auto; text-align: right; }
.recon-cand-score-val[b-c7h946suvw] { display: block; font-size: 1.25rem; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.recon-cand-score-lbl[b-c7h946suvw] { text-transform: uppercase; letter-spacing: 0.07em; font-size: 0.62rem; font-weight: 700; color: var(--text-muted); }
.recon-cand-none[b-c7h946suvw] { font-size: 0.85rem; color: var(--text-muted); padding: 8px 2px; }

.recon-search[b-c7h946suvw] { margin-bottom: 4px; }
.recon-div[b-c7h946suvw] { margin: 14px 0; }

/* ── Action stack ──────────────────────────────────────────────── */
.recon-actions[b-c7h946suvw] { display: flex; flex-direction: column; gap: 10px; }
.recon-actions .mud-button-root[b-c7h946suvw] { text-transform: none; font-weight: 700; border-radius: 10px; }
.recon-confirm[b-c7h946suvw] { font-weight: 800; }

.recon-reject[b-c7h946suvw] { display: flex; flex-direction: column; gap: 10px; }
.recon-reject-actions[b-c7h946suvw] { display: flex; gap: 10px; }
.recon-reject-actions .mud-button-root[b-c7h946suvw] { text-transform: none; font-weight: 700; border-radius: 10px; }

/* ── Responsive ────────────────────────────────────────────────── */
@media (max-width: 1000px) {
    .recon-stats[b-c7h946suvw] { grid-template-columns: repeat(2, 1fr); }
    .recon-split[b-c7h946suvw] { grid-template-columns: 1fr; }
    .recon-left[b-c7h946suvw] { position: static; }
}
@media (max-width: 560px) {
    .recon-wrap[b-c7h946suvw] { padding: 16px; }
    .recon-stats[b-c7h946suvw] { grid-template-columns: 1fr; }
    .recon-grid[b-c7h946suvw] { grid-template-columns: 1fr; }
}

/* Registrations found by searching the register rather than suggested by the matcher. Marked
   distinctly because their provenance is different: a human found this, nothing scored it. */
.recon-search-head[b-c7h946suvw] { font-size: .78rem; color: var(--text-muted, #5A6B82); margin: 12px 0 6px; line-height: 1.45; }
.recon-cand-paid[b-c7h946suvw] {
    font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
    color: #6FAE3F; background: rgba(111,174,63,.14); border-radius: 999px; padding: 1px 8px; margin-left: 6px;
}
/* /Components/Pages/Blog.razor.rz.scp.css */
/* ── Shared ────────────────────────────────────────────────────── */
.blog-tag[b-es625bmcwz] {
    display: inline-block;
    text-transform: uppercase;
    font-size: 0.69rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(243, 145, 37, 0.12);
    color: var(--brand-orange-text, #B4530A);
    border: 1px solid rgba(243, 145, 37, 0.28);
}
.blog-tag.on-dark[b-es625bmcwz] {
    background: rgba(255, 255, 255, 0.16);
    color: #FFE6BD;
    border-color: rgba(255, 255, 255, 0.28);
}

.blog-crumb[b-es625bmcwz] { font-size: 0.82rem; color: rgba(255, 255, 255, 0.78); margin-bottom: 18px; }
.blog-crumb span[b-es625bmcwz] { margin: 0 6px; opacity: 0.6; }
.blog-crumb a[b-es625bmcwz] { color: rgba(255, 255, 255, 0.78); text-decoration: none; }
.blog-crumb a:hover[b-es625bmcwz] { color: #fff; text-decoration: underline; }

.blog-body[b-es625bmcwz] { max-width: 1100px; margin: 0 auto; padding: 48px 24px 80px; }

/* ── Featured ─────────────────────────────────────────────────── */
.blog-featured[b-es625bmcwz] {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 0;
    border: 1px solid var(--border);
    border-radius: 18px;
    overflow: hidden;
    background: var(--surface);
    text-decoration: none;
    color: inherit;
    box-shadow: 0 1px 2px var(--shadow);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
    margin-bottom: 40px;
}
.blog-featured:hover[b-es625bmcwz] { transform: translateY(-3px); box-shadow: 0 16px 36px var(--shadow); }
/* The cover art fills this panel; it must never DICTATE the card's height. The image used to sit
   in normal flow with height:100% (which resolves to auto against an auto-height row), so a tall
   or square upload — a logo, a portrait photo — stretched the whole featured card to its natural
   aspect: a 570px-wide column rendered a ~570px-tall card. Taking the image out of flow, exactly
   as .blog-article-hero-img already does, means the card's height comes from the text beside it
   (floored by the min-height below) and the art simply covers whatever space that leaves.
   Deliberately no max-height: the panel is a stretched grid item, so capping it while the text
   column ran taller would leave a bare strip of card under the image. */
/* 550 × 271 as rendered. Quoted to writers by BlogImageSpec.FeaturedCrop — keep the two in step. */
.blog-featured-panel[b-es625bmcwz] {
    position: relative;
    min-height: 240px;
    display: grid;
    place-items: center;
    font-size: 3.4rem;
    color: rgba(255, 255, 255, 0.45);
    background: linear-gradient(135deg, var(--brand-blue), var(--brand-orange-deep));
    overflow: hidden;
}
.blog-featured-img[b-es625bmcwz] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.blog-featured-text[b-es625bmcwz] { padding: 30px 32px; display: flex; flex-direction: column; }
.blog-featured-top[b-es625bmcwz] { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.blog-latest[b-es625bmcwz] { text-transform: uppercase; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; color: var(--ink-500); }
.blog-featured-text h2[b-es625bmcwz] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: 1.55rem;
    line-height: 1.2;
    color: var(--ink-900);
    margin: 0 0 12px;
}

/* ── Grid cards ───────────────────────────────────────────────── */
.blog-grid[b-es625bmcwz] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.blog-card[b-es625bmcwz] {
    display: flex;
    flex-direction: column;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 22px;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 1px 2px var(--shadow);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.blog-card:hover[b-es625bmcwz] { transform: translateY(-3px); box-shadow: 0 12px 28px var(--shadow); }
/* 335 × 150 as rendered. This height is QUOTED to writers by BlogImageSpec.CardCrop, which the
   blog editor prints next to the upload button — change one and change the other, or the screen
   advises a size that no longer exists. */
.blog-card-cover[b-es625bmcwz] {
    margin: -22px -22px 16px;
    height: 150px;
    overflow: hidden;
    background: linear-gradient(135deg, var(--brand-blue), var(--brand-orange-deep));
}
.blog-card-cover img[b-es625bmcwz] { width: 100%; height: 100%; object-fit: cover; display: block; }
.blog-card .blog-tag[b-es625bmcwz] { align-self: flex-start; margin-bottom: 12px; }
.blog-card h3[b-es625bmcwz] { font-size: 1.06rem; font-weight: 700; line-height: 1.3; color: var(--ink-900); margin: 0 0 10px; }
.blog-card-foot[b-es625bmcwz] {
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid var(--border);
    font-size: 0.8rem;
    color: var(--ink-500);
}

.blog-excerpt[b-es625bmcwz] { font-size: 0.9rem; color: var(--ink-700); line-height: 1.55; margin: 0 0 14px; flex: 1; }
.blog-meta[b-es625bmcwz] { font-size: 0.82rem; color: var(--ink-500); }

/* ── Empty state ──────────────────────────────────────────────── */
.blog-empty[b-es625bmcwz] { text-align: center; padding: 64px 24px; }
.blog-empty-icon[b-es625bmcwz] { font-size: 2.6rem; opacity: 0.4; margin-bottom: 12px; }
.blog-empty h2[b-es625bmcwz] { font-weight: 800; font-size: 1.4rem; color: var(--ink-900); margin: 0 0 8px; }
.blog-empty p[b-es625bmcwz] { color: var(--ink-500); max-width: 440px; margin: 0 auto; }

/* ── Not found ────────────────────────────────────────────────── */
.blog-notfound[b-es625bmcwz] { padding: 96px 24px; }
.blog-notfound-inner[b-es625bmcwz] { max-width: 520px; margin: 0 auto; text-align: center; }
.blog-notfound-inner h1[b-es625bmcwz] { font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif; font-weight: 800; font-size: 1.9rem; color: var(--ink-900); margin: 0 0 10px; }
.blog-notfound-inner p[b-es625bmcwz] { color: var(--ink-500); margin: 0 0 24px; }
.blog-back-btn[b-es625bmcwz] { display: inline-block; }

/* ── Article hero ─────────────────────────────────────────────── */
.blog-article-hero[b-es625bmcwz] {
    background: linear-gradient(135deg, var(--brand-blue), var(--brand-orange-deep));
    color: #fff;
    padding: 56px 24px 60px;
    position: relative;
    overflow: hidden;
}
/* When a cover image is set it becomes the hero backdrop; a dark scrim keeps text legible.
   Full-bleed: the width is the VIEWPORT, while the height stays content-driven (~400px), so the
   wider the screen the thinner the visible band. That is why BlogImageSpec recommends 2400px wide
   and a centred subject — keep the two in step. */
.blog-article-hero.has-cover[b-es625bmcwz] { padding: 80px 24px 60px; }
.blog-article-hero-img[b-es625bmcwz] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}
.blog-article-hero.has-cover[b-es625bmcwz]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(10, 22, 40, 0.74) /* 1.4.3: 0.55 let a light cover image push white text to ~4:1 */ 0%, rgba(10, 22, 40, 0.82) 100%);
    z-index: 1;
}
.blog-article-hero-inner[b-es625bmcwz] { max-width: 760px; margin: 0 auto; position: relative; z-index: 2; }
.blog-article-hero h1[b-es625bmcwz] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: clamp(1.9rem, 4.5vw, 2.75rem);
    line-height: 1.12;
    margin: 16px 0 16px;
}
.blog-article-meta[b-es625bmcwz] { font-size: 0.9rem; color: rgba(255, 255, 255, 0.85); }

/* ── Article body ─────────────────────────────────────────────── */
/* #498 — article + author card. Single column on a phone with the card FIRST (context before the
   piece); two columns from 960px, where the card sits at the top of the right rail and stays put. */
.blog-article-layout[b-es625bmcwz] {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    flex-direction: column-reverse;   /* card above body on narrow screens */
    gap: 0 36px;
}
@media (min-width: 960px) {
    .blog-article-layout[b-es625bmcwz] {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 290px;
        align-items: start;
    }
}

.blog-article-body[b-es625bmcwz] { max-width: 760px; margin: 0 auto; padding: 48px 24px 80px; }
@media (min-width: 960px) { .blog-article-body[b-es625bmcwz] { margin: 0; } }

/* ── Author card ─────────────────────────────────────────────────── */
.blog-author-card[b-es625bmcwz] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 22px 24px;
    margin: 32px 24px 0;
    box-shadow: 0 1px 2px var(--shadow);
}
@media (min-width: 960px) {
    .blog-author-card[b-es625bmcwz] { margin: 48px 0 0; position: sticky; top: 24px; }
}
.blog-author-eyebrow[b-es625bmcwz] {
    display: block;
    text-transform: uppercase;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .1em;
    color: var(--ink-500);
    margin-bottom: 14px;
}
.blog-author-head[b-es625bmcwz] { display: flex; align-items: center; gap: 13px; margin-bottom: 12px; }
.blog-author-photo[b-es625bmcwz] {
    width: 52px; height: 52px; border-radius: 50%; object-fit: cover; flex-shrink: 0;
    border: 1px solid var(--border);
}
.blog-author-initials[b-es625bmcwz] {
    width: 52px; height: 52px; border-radius: 50%; flex-shrink: 0;
    display: grid; place-items: center;
    background: var(--brand-blue);
    color: #fff; font-weight: 800; font-size: .98rem;
}
.blog-author-name[b-es625bmcwz] { font-weight: 700; font-size: 1.02rem; color: var(--ink-900); line-height: 1.3; }
.blog-author-bio[b-es625bmcwz] { font-size: .9rem; line-height: 1.62; color: var(--ink-700); margin: 0; }

/* Markdown output — every selector uses ::deep.
   Blazor CSS isolation rewrites a scoped selector to match [b-xxxxx], and the elements below are
   produced by MarkdownContent at runtime as a MarkupString, so they carry NO scope attribute and a
   plain `.blog-article-body h2` would never match them. ::deep scopes the ancestor and leaves the
   generated descendants alone, which is the only thing that styles them. (The old `> p` rule
   worked because that <p> was written in the .razor file and so was scoped.)

   Authors can now use headings, lists, quotes, tables and code, so each needs a house style — an
   unstyled <h2> or <ul> inside an article reads as broken, and the author who wrote it would
   reasonably think the feature is broken too. */
.blog-article-body[b-es625bmcwz]  p {
    font-size: 1.03rem;
    line-height: 1.75;
    color: var(--ink-700);
    margin: 0 0 22px;
}
.blog-article-body[b-es625bmcwz]  h2,
.blog-article-body[b-es625bmcwz]  h3,
.blog-article-body[b-es625bmcwz]  h4 {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    color: var(--ink-900);
    line-height: 1.25;
    letter-spacing: -.01em;
    margin: 34px 0 12px;
}
.blog-article-body[b-es625bmcwz]  h2 { font-size: 1.5rem; }
.blog-article-body[b-es625bmcwz]  h3 { font-size: 1.22rem; }
.blog-article-body[b-es625bmcwz]  h4 { font-size: 1.05rem; }
.blog-article-body[b-es625bmcwz]  ul,
.blog-article-body[b-es625bmcwz]  ol { margin: 0 0 22px; padding-left: 1.35em; color: var(--ink-700); }
.blog-article-body[b-es625bmcwz]  li { margin: 7px 0; line-height: 1.7; }
.blog-article-body[b-es625bmcwz]  a { color: var(--brand-blue); font-weight: 600; }
.blog-article-body[b-es625bmcwz]  strong { color: var(--ink-900); }
.blog-article-body[b-es625bmcwz]  blockquote {
    margin: 24px 0;
    padding: 4px 0 4px 20px;
    border-left: 3px solid var(--brand-orange);
    color: var(--ink-700);
    font-style: italic;
}
.blog-article-body[b-es625bmcwz]  blockquote p:last-child { margin-bottom: 0; }
/* A section break the reader actually sees. A 1px hairline in --border is all but invisible
   against the page, so a writer typing "---" got nothing back and reasonably assumed it had not
   worked. Brand blue into orange, fading out at both ends so it reads as a divider rather than a
   stray underline — and it stays visible on both themes, which a border token does not. */
.blog-article-body[b-es625bmcwz]  hr {
    border: 0;
    height: 3px;
    border-radius: 999px;
    margin: 38px auto;
    width: 100%;
    background: linear-gradient(90deg,
        rgba(31, 90, 138, 0) 0%,
        var(--brand-blue, #1F5A8A) 22%,
        var(--brand-orange, #F39125) 78%,
        rgba(243, 145, 37, 0) 100%);
}
.blog-article-body[b-es625bmcwz]  code {
    font-family: ui-monospace, 'Cascadia Mono', 'Consolas', monospace;
    font-size: .88em;
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 4px;
    padding: .1em .38em;
}
.blog-article-body[b-es625bmcwz]  pre {
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 16px 18px;
    overflow-x: auto;
    margin: 0 0 22px;
}
.blog-article-body[b-es625bmcwz]  pre code { background: none; border: 0; padding: 0; }
.blog-article-body[b-es625bmcwz]  img { max-width: 100%; height: auto; border-radius: 10px; }
/* Wide tables scroll inside the article rather than widening the page on a phone. */
.blog-article-body[b-es625bmcwz]  table {
    width: 100%; border-collapse: collapse; margin: 0 0 22px; font-size: .95rem; display: block; overflow-x: auto;
}
.blog-article-body[b-es625bmcwz]  th, .blog-article-body[b-es625bmcwz]  td {
    border: 1px solid var(--border);
    padding: 9px 12px;
    text-align: left;
}
.blog-article-body[b-es625bmcwz]  th { background: var(--surface-2); font-weight: 700; color: var(--ink-900); }

.blog-article-cta[b-es625bmcwz] {
    background: rgba(243, 145, 37, 0.08);
    border: 1px solid rgba(243, 145, 37, 0.25);
    border-radius: 16px;
    padding: 26px 28px;
    margin: 40px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
.blog-article-cta-label[b-es625bmcwz] { font-weight: 700; font-size: 1.1rem; color: var(--ink-900); }

/* ── Related ──────────────────────────────────────────────────── */
.blog-related[b-es625bmcwz] { margin-top: 8px; }
.blog-related-head[b-es625bmcwz] {
    text-transform: uppercase;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    color: var(--brand-orange-text, #B4530A);
    margin: 0 0 18px;
}
.blog-related-grid[b-es625bmcwz] { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.blog-related-card[b-es625bmcwz] {
    display: flex;
    flex-direction: column;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 20px;
    text-decoration: none;
    color: inherit;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.blog-related-card:hover[b-es625bmcwz] { transform: translateY(-3px); box-shadow: 0 10px 24px var(--shadow); }
.blog-related-card .blog-tag[b-es625bmcwz] { align-self: flex-start; margin-bottom: 10px; }
.blog-related-card h3[b-es625bmcwz] { font-size: 1rem; font-weight: 700; color: var(--ink-900); margin: 0 0 8px; line-height: 1.3; }

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width: 900px) {
    .blog-grid[b-es625bmcwz] { grid-template-columns: 1fr; }
    .blog-related-grid[b-es625bmcwz] { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .blog-featured[b-es625bmcwz] { grid-template-columns: 1fr; }
    .blog-featured-panel[b-es625bmcwz] { min-height: 140px; font-size: 2.6rem; }
}
/* /Components/Pages/Careers.razor.rz.scp.css */
/* ── Body / layout ────────────────────────────────────────────── */
.car-body[b-mqv0k9obte] { max-width: 1080px; margin: 0 auto; padding: 0 24px 64px; }
.car-grid[b-mqv0k9obte] {
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    gap: 24px;
    margin-top: 40px;
    align-items: start;
}

/* ── Open positions ───────────────────────────────────────────── */
.car-roles-eyebrow[b-mqv0k9obte] {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--brand-orange-text, #B4530A);
    margin-bottom: 8px;
}
.car-roles-heading[b-mqv0k9obte] {
    font-size: 1.5rem;
    font-weight: 800;
    margin: 0 0 18px;
    color: var(--ink-900);
    letter-spacing: -0.01em;
}

.car-role-list[b-mqv0k9obte] { display: flex; flex-direction: column; gap: 12px; }
.car-role-card[b-mqv0k9obte] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 16px 18px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.car-role-card:hover[b-mqv0k9obte] { transform: translateY(-2px); box-shadow: 0 10px 22px var(--shadow); }
.car-role-info h3[b-mqv0k9obte] { font-size: 1.05rem; font-weight: 700; margin: 0 0 4px; color: var(--ink-900); }
.car-role-meta[b-mqv0k9obte] { font-size: 0.82rem; color: var(--ink-500); font-weight: 600; }
.car-role-apply[b-mqv0k9obte] {
    flex: 0 0 auto;
    background: var(--surface);
    border: 1px solid var(--brand-orange, #F39125);
    color: var(--brand-orange-text, #B4530A);
    font-weight: 700;
    padding: 9px 20px;
    border-radius: 10px;
}
.car-role-apply:hover[b-mqv0k9obte] { background: var(--brand-orange-deep, #E36A1A); border-color: var(--brand-orange-text, #B4530A); color: #0F1B2D; } /* WCAG 1.4.3 — white on deep orange was 3.31:1 */

/* ── Empty state ──────────────────────────────────────────────── */
.car-empty[b-mqv0k9obte] {
    text-align: center;
    padding: 28px 12px 16px;
    color: var(--ink-700);
}
.car-empty-icon[b-mqv0k9obte] { font-size: 2rem; }
.car-empty h3[b-mqv0k9obte] { font-size: 1.1rem; font-weight: 700; margin: 12px 0 8px; color: var(--ink-900); }
.car-empty p[b-mqv0k9obte] { font-size: 0.9rem; color: var(--ink-500); margin: 0 auto; max-width: 360px; }

/* ── Application card ─────────────────────────────────────────── */
.car-apply[b-mqv0k9obte] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 12px 30px var(--shadow);
    border-top: 4px solid var(--brand-orange, #F39125);
}
.car-apply-head h2[b-mqv0k9obte] { font-size: 1.4rem; font-weight: 800; margin: 0 0 4px; color: var(--ink-900); }
.car-apply-head p[b-mqv0k9obte] { font-size: 0.88rem; color: var(--ink-500); margin: 0 0 20px; }

.car-field[b-mqv0k9obte] { margin-bottom: 14px; }
.car-field-row[b-mqv0k9obte] { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; }
.car-field-row-2[b-mqv0k9obte] { grid-template-columns: 1fr 1fr; }
.car-field-row .car-field[b-mqv0k9obte] { margin-bottom: 14px; }
.car-label[b-mqv0k9obte] { display: block; font-size: 0.8rem; font-weight: 700; color: var(--ink-700); margin-bottom: 5px; }

/* ── Dropzone ─────────────────────────────────────────────────── */
.car-dropzone[b-mqv0k9obte] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    text-align: center;
    border: 2px dashed rgba(31, 90, 138, 0.35);
    border-radius: 12px;
    padding: 22px 16px;
    background: rgba(31, 90, 138, 0.04);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}
.car-dropzone:hover[b-mqv0k9obte] { border-color: var(--brand-blue, #1F5A8A); background: rgba(31, 90, 138, 0.07); }
.car-dropzone.has-file[b-mqv0k9obte] { border-style: solid; border-color: #6FAE3F; background: rgba(111, 174, 63, 0.08); }
.car-dropzone-icon[b-mqv0k9obte] { display: inline-flex; color: var(--ink-500); }
.car-dropzone-icon[b-mqv0k9obte]  .mud-icon-root { font-size: 1.5rem; }
.car-dropzone.has-file .car-dropzone-icon[b-mqv0k9obte] { color: #6FAE3F; }
.car-dropzone strong[b-mqv0k9obte] { font-size: 0.92rem; color: var(--ink-900); word-break: break-word; }
.car-dropzone-hint[b-mqv0k9obte] { font-size: 0.76rem; color: var(--ink-500); }

/* ── Submit / errors ──────────────────────────────────────────── */
.car-submit[b-mqv0k9obte] {
    width: 100%;
    margin-top: 18px;
    background: var(--brand-orange-deep, #E36A1A);
    color: #0F1B2D; /* WCAG 1.4.3 — white on deep orange was 3.31:1 */
    font-weight: 700;
    border: none;
    padding: 12px 22px;
    border-radius: 10px;
}
.car-submit:hover[b-mqv0k9obte] { background: #c95a12; color: #FFFFFF; } /* white passes on this darker hover (4.6:1) */
.car-submit:disabled[b-mqv0k9obte] { opacity: 0.65; cursor: not-allowed; }
.car-error[b-mqv0k9obte] { color: #D24545; font-size: 0.85rem; font-weight: 600; margin: 12px 0 0; }

/* ── Thank-you state ──────────────────────────────────────────── */
.car-thanks[b-mqv0k9obte] { text-align: center; padding: 20px 8px; }
.car-thanks-icon[b-mqv0k9obte] { font-size: 2.4rem; }
.car-thanks h2[b-mqv0k9obte] { font-size: 1.5rem; font-weight: 800; margin: 12px 0 10px; color: var(--ink-900); }
.car-thanks p[b-mqv0k9obte] { font-size: 0.92rem; color: var(--ink-700); margin: 0 auto; max-width: 380px; line-height: 1.55; }

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width: 860px) {
    .car-grid[b-mqv0k9obte] { grid-template-columns: 1fr; margin-top: 32px; }
}
@media (max-width: 520px) {
    .car-field-row[b-mqv0k9obte], .car-field-row-2[b-mqv0k9obte] { grid-template-columns: 1fr; }
}

/* "(optional)" beside a field label — quieter than the label so the field name still leads. */
.car-optional[b-mqv0k9obte] { font-weight: 500; color: var(--ink-500); font-size: .86em; }
/* /Components/Pages/ClassSignup.razor.rz.scp.css */
.tnum[b-ndk0xyv9zw] { font-variant-numeric: tabular-nums; }

/* ── Body / layout ───────────────────────────────────────────── */
.cls-body[b-ndk0xyv9zw] { max-width: 1080px; margin: 0 auto; padding: 40px 24px 80px; }

.cls-grid[b-ndk0xyv9zw] { display: grid; grid-template-columns: 1fr 340px; gap: 26px; align-items: start; }
.cls-steps[b-ndk0xyv9zw] { display: flex; flex-direction: column; gap: 22px; }

.cls-card[b-ndk0xyv9zw] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 1px 2px var(--shadow);
}

.cls-step-head[b-ndk0xyv9zw] { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 18px; }
.cls-step-num[b-ndk0xyv9zw] {
    flex: 0 0 32px;
    width: 32px; height: 32px;
    border-radius: 50%;
    background: var(--brand-orange);
    color: #0F1B2D; /* WCAG 1.4.3 — white on orange was 2.36:1 */
    font-weight: 800;
    display: grid; place-items: center;
    font-size: 0.95rem;
}
.cls-step-head h2[b-ndk0xyv9zw] { font-size: 1.2rem; font-weight: 800; margin: 4px 0 2px; color: var(--ink-900); }
.cls-step-sub[b-ndk0xyv9zw] { font-size: 0.86rem; color: var(--ink-500); margin: 0; }
.cls-step-sub strong[b-ndk0xyv9zw] { color: var(--ink-700); }
/* "You're paying for October 2026" — sits directly under the price blurb, because the month and
   the price are one fact for the buyer and separating them is how the roll-forward surprises them. */
.cls-step-month[b-ndk0xyv9zw] { font-size: 0.86rem; color: var(--ink-700); margin: 6px 0 0; line-height: 1.45; }
.cls-step-month strong[b-ndk0xyv9zw] { color: var(--brand-blue-deep, var(--ink-900)); font-weight: 800; }

/* ── Filler toggle ───────────────────────────────────────────── */
.cls-toggle[b-ndk0xyv9zw] {
    display: inline-flex;
    background: var(--paper-warm);
    border-radius: 12px;
    padding: 4px;
    gap: 4px;
    margin-bottom: 20px;
}
.cls-toggle-opt[b-ndk0xyv9zw] {
    border: none;
    background: transparent;
    color: var(--ink-500);
    font-weight: 600;
    font-size: 0.86rem;
    padding: 8px 16px;
    border-radius: 9px;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.cls-toggle-opt.is-on[b-ndk0xyv9zw] { background: var(--surface); color: var(--brand-blue-deep); box-shadow: 0 1px 3px var(--shadow); }

/* #37 — Dark mode: the segmented toggle lacks contrast. In dark the track (--paper-warm)
   and the active pill (--surface) are nearly identical and --brand-blue-deep text is too
   dark to read. Lift the track, give the active pill a lighter surface + orange-tinted text,
   and brighten the inactive label. Light mode is untouched (overrides only apply in dark). */
html[data-theme="dark"] .cls-toggle[b-ndk0xyv9zw] {
    background: var(--surface-2);
    border: 1px solid var(--border);
}
html[data-theme="dark"] .cls-toggle-opt[b-ndk0xyv9zw] {
    color: var(--ink-700);
}
html[data-theme="dark"] .cls-toggle-opt:hover:not(.is-on)[b-ndk0xyv9zw] {
    color: var(--ink-900);
}
html[data-theme="dark"] .cls-toggle-opt.is-on[b-ndk0xyv9zw] {
    background: var(--brand-orange);
    color: #0F1B2D; /* WCAG 1.4.3 — white on orange was 2.36:1 */
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

/* #38 — Parent/guardian note: enter the STUDENT's details */
.cls-parent-note[b-ndk0xyv9zw] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    background: rgba(243, 145, 37, 0.10);
    border: 1px solid rgba(243, 145, 37, 0.40);
    border-radius: 12px;
    padding: 12px 14px;
    margin: 0 0 20px;
    font-size: 0.84rem;
    line-height: 1.4;
    color: var(--ink-700);
}
.cls-parent-note strong[b-ndk0xyv9zw] { color: var(--brand-orange-deep); }
.cls-parent-note-icon[b-ndk0xyv9zw] { flex: 0 0 auto; font-size: 1.05rem; line-height: 1.2; }

/* #31 — Redirecting-to-payment state */
.cls-redirect-spin[b-ndk0xyv9zw] { display: grid; place-items: center; margin: 0 auto 18px; }

/* #46 — Reg-flow banner ("Add classes to your CXC registration …") */
.cls-regbanner-wrap[b-ndk0xyv9zw] { max-width: 1080px; margin: 0 auto; padding: 22px 24px 0; }
.cls-regbanner[b-ndk0xyv9zw] {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    background: var(--brand-blue-pale, #E6F0F8);
    border: 1px solid var(--border);
    border-left: 4px solid var(--brand-orange);
    border-radius: 14px;
    padding: 16px 18px;
}
.cls-regbanner-icon[b-ndk0xyv9zw] { font-size: 1.4rem; line-height: 1.2; flex: 0 0 auto; }
.cls-regbanner strong[b-ndk0xyv9zw] { display: block; color: var(--ink-900); font-weight: 800; font-size: 0.98rem; margin-bottom: 2px; }
.cls-regbanner span[b-ndk0xyv9zw] { display: block; color: var(--ink-700); font-size: 0.86rem; line-height: 1.45; }
/* The banner's own <strong> is the block heading; one emphasised INSIDE a paragraph must stay
   inline, or "no classes have been added" breaks the sentence onto its own line. */
.cls-regbanner span strong[b-ndk0xyv9zw] { display: inline; font-size: inherit; margin: 0; color: inherit; }

/* #46 — "Skip — no classes" secondary action */
.cls-skip[b-ndk0xyv9zw] {
    width: 100%;
    margin-top: 10px;
    border: 1px solid var(--border-strong, var(--border));
    background: var(--surface);
    color: var(--ink-700);
    font-weight: 700;
    padding: 11px 16px;
    border-radius: 11px;
    cursor: pointer;
}
.cls-skip:hover:not(:disabled)[b-ndk0xyv9zw] { background: var(--paper-warm); }
.cls-skip:disabled[b-ndk0xyv9zw] { opacity: 0.6; cursor: not-allowed; }
.cls-skip-note[b-ndk0xyv9zw] { margin-top: 8px; }

/* ── Fields ──────────────────────────────────────────────────── */
.cls-fields[b-ndk0xyv9zw] { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }

/* #392b — "Guardian contact" divider inside the fields grid (parent/guardian mode) */
.cls-guardian-head[b-ndk0xyv9zw] {
    grid-column: 1 / -1;
    font-weight: 700;
    font-size: 0.84rem;
    color: var(--ink-700);
    border-top: 1px dashed var(--border);
    padding-top: 14px;
    margin-top: 4px;
}

/* ── Level filter chips ──────────────────────────────────────── */
.cls-filter[b-ndk0xyv9zw] { display: flex; gap: 8px; margin-bottom: 18px; flex-wrap: wrap; }
.cls-chip[b-ndk0xyv9zw] {
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--ink-700);
    font-weight: 600;
    font-size: 0.82rem;
    padding: 6px 16px;
    border-radius: 999px;
    cursor: pointer;
    transition: all 0.15s ease;
}
.cls-chip:hover[b-ndk0xyv9zw] { border-color: var(--brand-orange); }
.cls-chip.is-on[b-ndk0xyv9zw] { background: var(--brand-blue-deep); border-color: var(--brand-blue-deep); color: #fff; }

/* ── Subject tiles ───────────────────────────────────────────── */
.cls-tiles[b-ndk0xyv9zw] { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

/* Shown instead of the tile grid when nothing is on sale, or nothing matches the
   level filter. Quiet, not alarming — an empty catalogue is a normal state
   between terms, not an error. */
.cls-tiles-empty[b-ndk0xyv9zw] {
    border: 1px dashed rgba(15, 27, 45, 0.18);
    border-radius: 12px;
    padding: 22px 20px;
    text-align: center;
    background: rgba(15, 27, 45, 0.02);
}

.cls-tiles-empty p[b-ndk0xyv9zw] { margin: 0 0 6px; font-size: 0.92rem; color: #55636f; }
.cls-tiles-empty p:last-child[b-ndk0xyv9zw] { margin-bottom: 0; }
.cls-tiles-empty strong[b-ndk0xyv9zw] { color: #16202b; }
.cls-tile[b-ndk0xyv9zw] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 9px;
    text-align: left;
    background: var(--surface);
    border: 1.5px solid var(--border);
    border-radius: 9px;
    padding: 8px 10px;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.cls-tile:hover[b-ndk0xyv9zw] { border-color: var(--brand-orange); }
.cls-tile.is-on[b-ndk0xyv9zw] { border-color: var(--brand-orange); background: rgba(243, 145, 37, 0.06); }
.cls-tile-badge[b-ndk0xyv9zw] {
    position: absolute;
    top: -5px; right: -5px;
    width: 15px; height: 15px;
    border-radius: 50%;
    background: var(--brand-orange);
    border: 2px solid var(--surface);
    color: #0F1B2D; /* WCAG 1.4.3 — white on orange was 2.36:1 */
    font-size: 0.55rem;
    font-weight: 800;
    display: grid; place-items: center;
}
.cls-tile-icon[b-ndk0xyv9zw] {
    flex: 0 0 28px;
    width: 28px; height: 28px;
    border-radius: 7px;
    display: grid; place-items: center;
    font-size: 0.85rem;
}
.cls-tile-body[b-ndk0xyv9zw] { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.cls-tile-name[b-ndk0xyv9zw] { font-weight: 700; font-size: 0.8rem; color: var(--ink-900); line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cls-tile-meta[b-ndk0xyv9zw] { font-size: 0.68rem; color: var(--ink-500); margin-top: 2px; }
/* Which month this tile's payment covers — shown only where courses on offer start in different
   months, so it reads as a distinction and not as noise repeated on every tile. */
.cls-tile-month[b-ndk0xyv9zw] { font-size: 0.68rem; font-weight: 700; color: var(--brand-blue); margin-top: 2px; }
.cls-tile-price[b-ndk0xyv9zw] { font-weight: 700; color: var(--brand-orange-deep); font-size: 0.82rem; }

/* Named pre-selected subjects we cannot sell this term (?reg flow). Informational, not an error —
   nothing has gone wrong, there is simply no class to add. */
.cls-tiles-note[b-ndk0xyv9zw] {
    border: 1px solid var(--border);
    border-left: 4px solid var(--brand-blue);
    background: var(--brand-blue-pale, #E6F0F8);
    border-radius: 10px;
    padding: 12px 14px;
    margin-bottom: 14px;
}
.cls-tiles-note p[b-ndk0xyv9zw] { margin: 0; font-size: 0.84rem; line-height: 1.45; color: var(--ink-700); }
.cls-tiles-note strong[b-ndk0xyv9zw] { color: var(--ink-900); }

/* ── Payment method card ─────────────────────────────────────── */
.cls-method[b-ndk0xyv9zw] {
    display: flex;
    align-items: center;
    gap: 14px;
    border: 1.5px solid var(--brand-orange);
    background: rgba(243, 145, 37, 0.06);
    border-radius: 14px;
    padding: 16px 18px;
    margin-bottom: 16px;
}
.cls-method-icon[b-ndk0xyv9zw] { font-size: 1.5rem; }
.cls-method-body[b-ndk0xyv9zw] { display: flex; flex-direction: column; flex: 1; }
.cls-method-body strong[b-ndk0xyv9zw] { color: var(--ink-900); font-size: 0.95rem; }
.cls-method-body span[b-ndk0xyv9zw] { font-size: 0.82rem; color: var(--ink-500); }
.cls-method-lock[b-ndk0xyv9zw] { font-size: 1.1rem; opacity: 0.7; }

/* ── Order summary ───────────────────────────────────────────── */
.cls-summary[b-ndk0xyv9zw] { position: sticky; top: 24px; }
.cls-summary-card[b-ndk0xyv9zw] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 1px 2px var(--shadow);
}
.cls-summary-card h3[b-ndk0xyv9zw] { font-size: 1.05rem; font-weight: 800; color: var(--ink-900); margin: 0 0 16px; }
.cls-summary-empty[b-ndk0xyv9zw] { font-size: 0.86rem; color: var(--ink-500); margin: 0 0 4px; }
.cls-summary-lines[b-ndk0xyv9zw] { list-style: none; padding: 0; margin: 0 0 14px; }
.cls-summary-lines li[b-ndk0xyv9zw] { display: flex; justify-content: space-between; font-size: 0.88rem; color: var(--ink-700); padding: 6px 0; }
.cls-summary-row[b-ndk0xyv9zw] {
    display: flex; justify-content: space-between;
    font-size: 0.88rem; color: var(--ink-700);
    padding-top: 12px;
    border-top: 1px solid var(--border);
}
.cls-summary-total[b-ndk0xyv9zw] {
    display: flex; justify-content: space-between;
    font-size: 1.1rem; font-weight: 800; color: var(--ink-900);
    padding: 14px 0 4px;
    margin-top: 8px;
    border-top: 1px solid var(--border);
}
/* Which month the money buys, beside the amount. Deliberately stronger than .cls-summary-note:
   a buyer who misses this line is the buyer who reports "I paid in September and September is
   locked". */
.cls-summary-month[b-ndk0xyv9zw] {
    font-size: 0.82rem;
    line-height: 1.45;
    color: var(--ink-700);
    margin: 8px 0 4px;
}
.cls-summary-month strong[b-ndk0xyv9zw] { color: var(--brand-blue-deep, var(--ink-900)); font-weight: 800; }
.cls-summary-line-month[b-ndk0xyv9zw] { display: block; font-size: 0.74rem; color: var(--ink-500); }
.cls-summary-note[b-ndk0xyv9zw] { font-size: 0.78rem; color: var(--ink-500); margin: 0 0 16px; }
.cls-alert[b-ndk0xyv9zw] { margin-bottom: 14px; }
.cls-pay[b-ndk0xyv9zw] { width: 100%; padding: 12px; border-radius: 11px; font-weight: 700; }
.cls-pay:disabled[b-ndk0xyv9zw] { opacity: 0.55; cursor: not-allowed; }

/* ── Review / summary screen ─────────────────────────────────── */
.cls-review[b-ndk0xyv9zw] { max-width: 640px; margin: 0 auto; display: flex; flex-direction: column; gap: 22px; }
.cls-review-head[b-ndk0xyv9zw] { position: relative; }
.cls-review-head h2[b-ndk0xyv9zw] { font-size: 1.5rem; font-weight: 800; color: var(--ink-900); margin: 8px 0 4px; }
.cls-back[b-ndk0xyv9zw] {
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--ink-700);
    font-weight: 600;
    font-size: 0.84rem;
    padding: 7px 14px;
    border-radius: 999px;
    cursor: pointer;
    transition: all 0.15s ease;
}
.cls-back:hover:not(:disabled)[b-ndk0xyv9zw] { border-color: var(--brand-orange); color: var(--brand-orange-deep); }
.cls-back:disabled[b-ndk0xyv9zw] { opacity: 0.55; cursor: not-allowed; }

.cls-review-h3[b-ndk0xyv9zw] { font-size: 1.05rem; font-weight: 800; color: var(--ink-900); margin: 0 0 14px; }
.cls-review-lines[b-ndk0xyv9zw] { list-style: none; padding: 0; margin: 0 0 12px; }
.cls-review-lines li[b-ndk0xyv9zw] {
    display: flex; justify-content: space-between; align-items: center; gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
    font-size: 0.9rem; color: var(--ink-800, var(--ink-700));
}
.cls-review-lines li:last-child[b-ndk0xyv9zw] { border-bottom: none; }
.cls-review-line-name[b-ndk0xyv9zw] { display: flex; align-items: center; gap: 12px; min-width: 0; }
.cls-review-line-icon[b-ndk0xyv9zw] {
    flex: 0 0 38px;
    width: 38px; height: 38px;
    border-radius: 10px;
    display: grid; place-items: center;
    font-size: 1.05rem;
}
.cls-review-line-title[b-ndk0xyv9zw] { display: block; font-weight: 700; color: var(--ink-900); line-height: 1.25; }
.cls-review-line-meta[b-ndk0xyv9zw] { display: block; font-size: 0.76rem; color: var(--ink-500); margin-top: 2px; }
.cls-review-row[b-ndk0xyv9zw] {
    display: flex; justify-content: space-between; align-items: center;
    font-size: 0.9rem; color: var(--ink-700);
    padding-top: 12px;
    border-top: 1px solid var(--border);
    font-weight: 600;
}
.cls-review-row em[b-ndk0xyv9zw] { font-style: normal; color: var(--ink-500); font-weight: 500; font-size: 0.82rem; }
.cls-review-empty[b-ndk0xyv9zw] { font-size: 0.88rem; color: var(--ink-500); margin: 0; }
.cls-review-breakdown .cls-review-row + .cls-review-row[b-ndk0xyv9zw] { border-top: none; padding-top: 6px; }

/* ── Confirmation ────────────────────────────────────────────── */
.cls-done[b-ndk0xyv9zw], .cls-empty[b-ndk0xyv9zw] {
    max-width: 560px;
    margin: 20px auto;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 44px 36px;
    text-align: center;
    box-shadow: 0 8px 22px var(--shadow);
}
.cls-done-check[b-ndk0xyv9zw], .cls-empty-icon[b-ndk0xyv9zw] {
    width: 64px; height: 64px;
    border-radius: 50%;
    background: rgba(111, 174, 63, 0.16);
    display: grid; place-items: center;
    font-size: 1.8rem;
    margin: 0 auto 18px;
}
.cls-empty-icon[b-ndk0xyv9zw] { background: rgba(31, 90, 138, 0.12); }
.cls-done h2[b-ndk0xyv9zw], .cls-empty h2[b-ndk0xyv9zw] { font-size: 1.4rem; font-weight: 800; color: var(--ink-900); margin: 0 0 12px; }
.cls-done p[b-ndk0xyv9zw], .cls-empty p[b-ndk0xyv9zw] { color: var(--ink-700); margin: 0 0 12px; }
.cls-done-sub[b-ndk0xyv9zw] { font-size: 0.88rem; color: var(--ink-500) !important; }
.cls-empty a[b-ndk0xyv9zw] { color: var(--brand-blue); font-weight: 600; }
/* Selector, not !important: `.cls-done p, .cls-empty p` above is more specific than a bare class,
   so a single-class rule here would silently lose the colour. */
.cls-empty p.cls-empty-sub[b-ndk0xyv9zw] { font-size: 0.86rem; color: var(--ink-500); }
/* The reg flow's only exit from a closed page — full width and primary, because it is the single
   action available, not an afterthought. */
.cls-empty-cta[b-ndk0xyv9zw] { width: 100%; max-width: 340px; padding: 12px; border-radius: 11px; font-weight: 700; margin-top: 6px; }
.cls-empty-cta:disabled[b-ndk0xyv9zw] { opacity: 0.55; cursor: not-allowed; }
.cls-done-actions[b-ndk0xyv9zw] { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 22px; }

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 880px) {
    .cls-grid[b-ndk0xyv9zw] { grid-template-columns: 1fr; }
    .cls-summary[b-ndk0xyv9zw] { position: static; }
}
@media (max-width: 560px) {
    .cls-fields[b-ndk0xyv9zw] { grid-template-columns: 1fr; }
    .cls-tiles[b-ndk0xyv9zw] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Contact.razor.rz.scp.css */
/* ── Body layout ──────────────────────────────────────────────── */
.ct-body[b-9cozc1uxkh] { max-width: 1100px; margin: 0 auto; padding: 0 24px 72px; }
.ct-grid[b-9cozc1uxkh] {
    display: grid;
    grid-template-columns: 340px 1fr;
    gap: 26px;
    margin-top: 40px;
    align-items: start;
}

.ct-col-title[b-9cozc1uxkh] {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--ink-900);
    margin: 0 0 16px;
}

/* ── Contact cards (left) ─────────────────────────────────────── */
.ct-info[b-9cozc1uxkh] { display: flex; flex-direction: column; gap: 12px; }

.ct-card[b-9cozc1uxkh] {
    display: flex;
    align-items: center;
    gap: 14px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 16px 18px;
    box-shadow: 0 1px 2px var(--shadow);
    text-decoration: none;
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
a.ct-card:hover[b-9cozc1uxkh] {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px var(--shadow);
    border-color: rgba(243, 145, 37, 0.4);
}
.ct-card-static[b-9cozc1uxkh] { cursor: default; }

.ct-card-icon[b-9cozc1uxkh] {
    flex: 0 0 auto;
    width: 44px; height: 44px;
    border-radius: 12px;
    display: grid; place-items: center;
    font-size: 1.25rem;
}
.ct-icon-blue[b-9cozc1uxkh] { background: rgba(31, 90, 138, 0.12); color: var(--brand-blue, #1F5A8A); }
.ct-icon-orange[b-9cozc1uxkh] { background: rgba(243, 145, 37, 0.14); color: var(--brand-orange-text, #B4530A); }
.ct-icon-whatsapp[b-9cozc1uxkh] { background: rgba(37, 211, 102, 0.16); color: #15803D /* 1.4.3: #1A8B45 was 4.36:1 */; }
.ct-card-icon[b-9cozc1uxkh]  .mud-icon-root { font-size: 1.25rem; }

.ct-card-body[b-9cozc1uxkh] { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.ct-card-label[b-9cozc1uxkh] {
    font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.07em;
    font-weight: 700; color: var(--ink-500);
}
.ct-card-value[b-9cozc1uxkh] { font-size: 0.96rem; color: var(--ink-900); word-break: break-word; }
.ct-icon-whatsapp + .ct-card-body .ct-card-value[b-9cozc1uxkh] { color: #15803D /* 1.4.3: #1A8B45 was 4.36:1 */; }

/* ── Hours ────────────────────────────────────────────────────── */
.ct-hours[b-9cozc1uxkh] {
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 16px 18px;
    margin-top: 4px;
}
.ct-hours-title[b-9cozc1uxkh] {
    display: block;
    font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.07em;
    font-weight: 700; color: var(--ink-500);
    margin-bottom: 10px;
}
.ct-hours ul[b-9cozc1uxkh] { list-style: none; margin: 0; padding: 0; }
.ct-hours li[b-9cozc1uxkh] {
    display: flex; justify-content: space-between;
    font-size: 0.9rem; color: var(--ink-700);
    padding: 4px 0;
}
.ct-hours li span:last-child[b-9cozc1uxkh] { font-weight: 600; color: var(--ink-900); }

/* ── Form card (right) ────────────────────────────────────────── */
.ct-form-card[b-9cozc1uxkh], .ct-thanks[b-9cozc1uxkh] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 30px;
    box-shadow: 0 12px 30px var(--shadow);
}
.ct-form-head[b-9cozc1uxkh] { margin-bottom: 22px; }
.ct-form-head h2[b-9cozc1uxkh] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800; font-size: 1.5rem; color: var(--ink-900); margin: 0 0 6px;
}
.ct-form-head p[b-9cozc1uxkh] { color: var(--ink-500); margin: 0; font-size: 0.92rem; }

.ct-field[b-9cozc1uxkh] { margin-bottom: 18px; }
.ct-row[b-9cozc1uxkh] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 18px;
}
.ct-label[b-9cozc1uxkh] {
    display: block;
    font-size: 0.85rem; font-weight: 700; color: var(--ink-700);
    margin-bottom: 8px;
}
/* Compact rounded-pill segmented control (matches mockup FillerToggle) */
[b-9cozc1uxkh] .ct-toggle.mud-toggle-group {
    display: inline-flex;
    width: auto;
    gap: 4px;
    padding: 4px;
    border: none;
    border-radius: 999px;
    background: rgba(15, 27, 45, 0.05);
}
[b-9cozc1uxkh] .ct-toggle .mud-toggle-item {
    border: none !important;
    border-radius: 999px;
    background: transparent;
    color: var(--ink-500);
    font-size: 0.82rem;
    font-weight: 700;
    transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
[b-9cozc1uxkh] .ct-toggle .mud-toggle-item .mud-typography { font-weight: 700; }
[b-9cozc1uxkh] .ct-toggle .mud-toggle-item .mud-toggle-item-content { padding: 8px 16px; }
[b-9cozc1uxkh] .ct-toggle .mud-toggle-item.mud-toggle-item-selected {
    background: var(--surface);
    color: var(--brand-orange-text, #B4530A);
    box-shadow: 0 1px 3px var(--shadow);
}

.ct-toggle-hint[b-9cozc1uxkh] {
    font-size: 0.8rem;
    color: var(--text-muted, var(--ink-500));
    margin: 8px 0 0;
}
.ct-toggle-hint strong[b-9cozc1uxkh] { color: var(--ink-700); font-weight: 700; }

/* ── Actions ──────────────────────────────────────────────────── */
.ct-form-actions[b-9cozc1uxkh] {
    display: flex; flex-wrap: wrap; gap: 12px;
    margin-top: 6px;
}
[b-9cozc1uxkh] .ct-send { border-radius: 10px; }
[b-9cozc1uxkh] .ct-wa-btn {
    border-radius: 10px;
    border-color: #25D366;
    color: #15803D /* 1.4.3: #1A8B45 was 4.36:1 */;
}
[b-9cozc1uxkh] .ct-wa-btn:hover { background: rgba(37, 211, 102, 0.08); border-color: #15803D /* 1.4.3: #1A8B45 was 4.36:1 */; }

/* ── Thank-you state ──────────────────────────────────────────── */
.ct-thanks[b-9cozc1uxkh] { text-align: center; padding: 48px 30px; }
.ct-thanks-check[b-9cozc1uxkh] {
    display: inline-grid; place-items: center;
    width: 64px; height: 64px;
    border-radius: 50%;
    background: rgba(63, 115, 33, 0.14);
    color: #3F7321;
    font-size: 1.9rem; font-weight: 800;
    margin-bottom: 18px;
}
.ct-thanks h2[b-9cozc1uxkh] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800; font-size: 1.5rem; color: var(--ink-900); margin: 0 0 12px;
}
.ct-thanks p[b-9cozc1uxkh] { color: var(--ink-700); max-width: 440px; margin: 0 auto 24px; }
.ct-thanks-actions[b-9cozc1uxkh] { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.ct-btn-ghost[b-9cozc1uxkh] {
    background: rgba(15, 27, 45, 0.05);
    color: var(--ink-700);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 10px 20px;
    font-weight: 600;
}
.ct-btn-ghost:hover[b-9cozc1uxkh] { background: rgba(15, 27, 45, 0.09); }

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width: 880px) {
    .ct-grid[b-9cozc1uxkh] { grid-template-columns: 1fr; margin-top: 32px; }
}
@media (max-width: 520px) {
    .ct-row[b-9cozc1uxkh] { grid-template-columns: 1fr; gap: 0; }
    .ct-form-card[b-9cozc1uxkh], .ct-thanks[b-9cozc1uxkh] { padding: 22px; }
}
/* /Components/Pages/Cotails.razor.rz.scp.css */
/* CoTails story page. Reading-first layout: one column, generous measure, the wordmark carried
   over from the home-page treatment so the product reads as the same brand. Every colour comes
   from the shared tokens, so light and dark both work without a second palette. */

.ct-body[b-a7n7sf3xut] {
    max-width: 820px;
    margin: 0 auto;
    padding: 48px 24px 88px;
}

/* ── Hero: wordmark + opening paragraphs ─────────────────────────── */
.ct-hero[b-a7n7sf3xut] {
    display: grid;
    gap: 26px;
    align-items: center;
    padding-bottom: 34px;
    border-bottom: 1px solid var(--border);
}

@media (min-width: 760px) {
    .ct-hero[b-a7n7sf3xut] { grid-template-columns: 230px 1fr; gap: 36px; }
}

.ct-markwrap[b-a7n7sf3xut] {
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 26px 22px;
    display: grid;
    place-items: center;
}

.ct-mark[b-a7n7sf3xut] { width: 100%; max-width: 180px; height: auto; display: block; }

/* The wordmark art is dark-on-light; on a dark surface it needs the light variant's treatment.
   Brightening keeps a single asset readable in both themes without shipping a second <img>. */
html[data-theme="dark"] .ct-mark[b-a7n7sf3xut] { filter: brightness(0) invert(1); opacity: .92; }

.ct-hero-copy p[b-a7n7sf3xut] { color: var(--ink-700); line-height: 1.72; margin: 0 0 14px; }
.ct-hero-copy p:last-child[b-a7n7sf3xut] { margin-bottom: 0; }

.ct-lead[b-a7n7sf3xut] {
    font-size: 1.08rem;
    color: var(--ink-900) !important;
    font-weight: 500;
}

/* ── Body sections ───────────────────────────────────────────────── */
.ct-section[b-a7n7sf3xut] { padding-top: 34px; }

.ct-h2[b-a7n7sf3xut] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: clamp(1.15rem, 2.4vw, 1.4rem);
    color: var(--ink-900);
    margin: 0 0 12px;
    letter-spacing: -.01em;
}

.ct-section p[b-a7n7sf3xut] {
    color: var(--ink-700);
    line-height: 1.72;
    margin: 0 0 14px;
}
.ct-section p:last-child[b-a7n7sf3xut] { margin-bottom: 0; }

/* The three things students told us they needed. */
.ct-needs[b-a7n7sf3xut] { list-style: none; margin: 18px 0; padding: 0; display: grid; gap: 10px; }
.ct-needs li[b-a7n7sf3xut] {
    position: relative;
    padding: 12px 16px 12px 44px;
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 12px;
    color: var(--ink-700);
    line-height: 1.6;
}
.ct-needs li[b-a7n7sf3xut]::before {
    content: "✓";
    position: absolute;
    left: 16px;
    top: 12px;
    color: var(--brand-orange-text, #B4530A);
    font-weight: 800;
}
.ct-needs strong[b-a7n7sf3xut] { color: var(--ink-900); }

.ct-spark[b-a7n7sf3xut] {
    font-weight: 600;
    color: var(--ink-900) !important;
    border-left: 3px solid var(--brand-orange);
    padding-left: 14px;
}

/* Cities the copy names — a light visual beat, not a data claim. */
.ct-cities[b-a7n7sf3xut] {
    list-style: none;
    margin: 18px 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.ct-cities li[b-a7n7sf3xut] {
    font-size: .84rem;
    font-weight: 600;
    color: var(--ink-700);
    background: var(--brand-blue-pale);
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: 5px 13px;
}

/* ── Closing belief + CTA ────────────────────────────────────────── */
.ct-close[b-a7n7sf3xut] {
    margin-top: 48px;
    padding: 34px 30px;
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 18px;
    text-align: center;
}

.ct-close-lead[b-a7n7sf3xut] {
    color: var(--ink-700);
    line-height: 1.7;
    margin: 0 auto 18px;
    max-width: 58ch;
}

.ct-belief[b-a7n7sf3xut] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: clamp(1.15rem, 3vw, 1.6rem);
    line-height: 1.35;
    color: var(--ink-900);
    margin: 0 auto 26px;
    max-width: 22ch;
    letter-spacing: -.01em;
}

.ct-cta[b-a7n7sf3xut] { padding: 12px 26px; border-radius: 10px; font-weight: 700; }

@media (max-width: 700px) {
    .ct-close[b-a7n7sf3xut] { padding: 28px 20px; }
    .ct-markwrap[b-a7n7sf3xut] { padding: 22px 18px; }
}
/* /Components/Pages/CourseCatalog.razor.rz.scp.css */
/* ── Breadcrumb ───────────────────────────────────────────────── */
.cc-crumb[b-pqf7dm5vse] { font-size: 0.78rem; color: var(--ink-500); margin-bottom: 18px; }
.cc-crumb a[b-pqf7dm5vse] { color: var(--ink-500); text-decoration: none; }
.cc-crumb a:hover[b-pqf7dm5vse] { color: var(--brand-blue); }
.cc-crumb span[b-pqf7dm5vse] { margin: 0 6px; opacity: 0.6; }

/* ── Catalog body ─────────────────────────────────────────────── */
.cc-body[b-pqf7dm5vse] { max-width: 1240px; margin: 0 auto; padding: 36px 24px 72px; }

.cc-filters[b-pqf7dm5vse] { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 28px; }
.cc-chip[b-pqf7dm5vse] {
    font-family: inherit;
    font-size: 0.85rem; font-weight: 600;
    padding: 8px 16px; border-radius: 999px;
    border: 1px solid var(--border);
    color: var(--ink-700); background: var(--surface);
    cursor: pointer; user-select: none;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}
.cc-chip:hover[b-pqf7dm5vse] { border-color: var(--brand-blue); color: var(--brand-blue); }
.cc-chip.is-active[b-pqf7dm5vse] { background: var(--brand-blue); border-color: var(--brand-blue); color: #fff; }
.cc-chip.is-active:hover[b-pqf7dm5vse] { color: #fff; }

.cc-grid[b-pqf7dm5vse] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }

.cc-course-card[b-pqf7dm5vse] {
    display: flex; flex-direction: column;
    width: 100%;
    font-family: inherit; font-size: inherit;
    text-align: left;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 18px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
    text-decoration: none;
    color: inherit;
}
.cc-course-card:hover[b-pqf7dm5vse] { transform: translateY(-3px); box-shadow: 0 14px 30px var(--shadow); }
.cc-course-toprow[b-pqf7dm5vse] { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.cc-course-tile[b-pqf7dm5vse] {
    width: 46px; height: 46px;
    border-radius: 12px;
    display: grid; place-items: center;
    font-size: 1.3rem;
    color: #fff;
}
/* Price stacks over two lines (amount above, /mo below), right-aligned, centered with the icon tile. */
.cc-course-price[b-pqf7dm5vse] { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.12; flex: 0 0 auto; }
.cc-price-amt[b-pqf7dm5vse] { font-weight: 800; color: var(--brand-orange-text, #B4530A); font-size: 1.05rem; }
.cc-price-per[b-pqf7dm5vse] { font-size: 0.72rem; font-weight: 600; color: var(--ink-500); }
.cc-course-titlerow[b-pqf7dm5vse] { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; margin-bottom: 8px; }
.cc-course-titlerow h3[b-pqf7dm5vse] { font-size: 1rem; font-weight: 700; margin: 0; color: var(--ink-900); }
.cc-level-pill[b-pqf7dm5vse] { flex: 0 0 auto; font-size: 0.62rem; font-weight: 700; letter-spacing: 0.04em; padding: 3px 8px; border-radius: 999px; white-space: nowrap; }
.cc-level-csec[b-pqf7dm5vse] { background: rgba(31, 90, 138, 0.12); color: #1F5A8A; }
.cc-level-cape[b-pqf7dm5vse] { background: rgba(243, 145, 37, 0.14); color: var(--brand-orange-text, #B4530A); }

/* #350: dark-mode legibility — brighten text + tint so both pills clear WCAG 4.5:1 on a dark
   surface. Plain scoped selectors (NOT :global): Blazor emits `html[data-theme="dark"] .cc-level-*[b-hash]`,
   a valid selector that also styles the teleported quick-summary dialog (its pills carry this
   component's scope). A `:global(...)` wrapper compiles to an invalid `:global(...)[b-hash]` that
   browsers drop — which is exactly why these overrides previously never applied. */
html[data-theme="dark"] .cc-level-csec[b-pqf7dm5vse] { background: rgba(94, 160, 224, 0.24); color: #A9D0F5; }
html[data-theme="dark"] .cc-level-cape[b-pqf7dm5vse] { background: rgba(243, 145, 37, 0.26); color: #F7BC6E; }
.cc-course-blurb[b-pqf7dm5vse] { font-size: 0.82rem; color: var(--ink-700); flex: 1; margin: 0 0 12px; min-height: 38px; }
.cc-course-meta[b-pqf7dm5vse] { display: flex; flex-wrap: wrap; gap: 10px; font-size: 0.76rem; color: var(--ink-500); margin-bottom: 12px; }
.cc-course-cta[b-pqf7dm5vse] {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    width: 100%;
    padding: 10px 16px;
    border-radius: 10px;
    background: var(--brand-orange);
    color: #0F1B2D; /* WCAG 1.4.3 — white on orange was 2.36:1; ink also passes on the hover deep-orange (5.2:1) */
    font-weight: 700; font-size: 0.9rem;
    transition: background 0.15s ease;
}
.cc-course-card:hover .cc-course-cta[b-pqf7dm5vse] { background: var(--brand-orange-deep); }
.cc-course-cta-arrow[b-pqf7dm5vse] { font-size: 1rem; line-height: 1; }

/* ── Empty state ──────────────────────────────────────────────── */
.cc-empty[b-pqf7dm5vse] { text-align: center; padding: 60px 24px; max-width: 520px; margin: 0 auto; }
.cc-empty-icon[b-pqf7dm5vse] { font-size: 2.6rem; }
.cc-empty h2[b-pqf7dm5vse] { font-weight: 800; font-size: 1.4rem; color: var(--ink-900); margin: 14px 0 10px; }
.cc-empty p[b-pqf7dm5vse] { color: var(--ink-500); margin: 0; }
.cc-empty a[b-pqf7dm5vse] { color: var(--brand-blue); font-weight: 600; }

/* ── Detail hero ──────────────────────────────────────────────── */
.cc-detail-hero[b-pqf7dm5vse] { background: linear-gradient(110deg, #163E63, #1F5A8A 55%, #E36A1A); color: #fff; padding: 48px 24px 56px; }
.cc-detail-hero-inner[b-pqf7dm5vse] { max-width: 1120px; margin: 0 auto; }
.cc-detail-chip[b-pqf7dm5vse] {
    display: inline-block;
    background: rgba(255, 255, 255, 0.18);
    color: #FFE6BD;
    border-radius: 999px;
    padding: 6px 14px;
    font-size: 0.8rem; font-weight: 600;
    margin-bottom: 16px;
}
.cc-detail-hero h1[b-pqf7dm5vse] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: clamp(1.9rem, 4vw, 3rem);
    margin: 0 0 14px;
}
.cc-detail-lead[b-pqf7dm5vse] { color: rgba(255, 255, 255, 0.9); max-width: 620px; margin: 0 0 26px; }
.cc-detail-cta[b-pqf7dm5vse] { display: flex; flex-wrap: wrap; gap: 12px; }
.cc-btn-primary[b-pqf7dm5vse] { background: #fff; color: var(--brand-orange-text, #B4530A); font-weight: 700; border: none; padding: 12px 24px; border-radius: 10px; }
.cc-btn-primary:hover[b-pqf7dm5vse] { background: #FFF4E4; color: var(--brand-orange-text, #B4530A); }
.cc-btn-ghost[b-pqf7dm5vse] { border: 1px solid rgba(255, 255, 255, 0.5); color: #fff; font-weight: 600; padding: 12px 22px; border-radius: 10px; }
.cc-btn-ghost:hover[b-pqf7dm5vse] { background: rgba(255, 255, 255, 0.12); color: #fff; }

/* ── Detail body ──────────────────────────────────────────────── */
.cc-detail-body[b-pqf7dm5vse] {
    max-width: 1120px; margin: 0 auto;
    padding: 44px 24px 72px;
    display: grid; grid-template-columns: 1fr 360px; gap: 28px;
    align-items: start;
}
.cc-detail-main[b-pqf7dm5vse] { display: flex; flex-direction: column; gap: 22px; }
.cc-card[b-pqf7dm5vse] { background: var(--surface); border: 1px solid var(--border); border-radius: 16px; padding: 26px; box-shadow: 0 1px 2px var(--shadow); }
.cc-eyebrow[b-pqf7dm5vse] {
    display: block;
    font-size: 0.72rem; font-weight: 700;
    letter-spacing: 0.12em; text-transform: uppercase;
    color: var(--brand-orange-text, #B4530A);
    margin: 0 0 8px;
}
.cc-h2[b-pqf7dm5vse] { font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif; font-weight: 800; font-size: 1.3rem; color: var(--ink-900); margin: 0 0 18px; }

.cc-topics[b-pqf7dm5vse] { list-style: none; padding: 0; margin: 0; }
.cc-topics li[b-pqf7dm5vse] { display: flex; align-items: center; gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--border); font-size: 0.95rem; color: var(--ink-700); }
.cc-topics li:last-child[b-pqf7dm5vse] { border-bottom: none; }
.cc-topic-num[b-pqf7dm5vse] { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: rgba(243, 145, 37, 0.12); color: var(--brand-orange-text, #B4530A); font-weight: 800; font-size: 0.85rem; }

/* ── Detail: About + admin-authored lessons ───────────────────── */
.cc-detail-about[b-pqf7dm5vse] { color: var(--ink-700); font-size: 0.95rem; line-height: 1.6; margin: 0; white-space: pre-line; }
.cc-detail-loading[b-pqf7dm5vse] { display: flex; align-items: center; gap: 10px; color: var(--ink-500); font-size: 0.92rem; padding: 6px 0; }

.cc-lessons[b-pqf7dm5vse] { list-style: none; padding: 0; margin: 0; counter-reset: none; }
.cc-lessons li[b-pqf7dm5vse] { display: flex; align-items: flex-start; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--border); }
.cc-lessons li:last-child[b-pqf7dm5vse] { border-bottom: none; }
.cc-lesson-num[b-pqf7dm5vse] { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: rgba(31, 90, 138, 0.10); color: #1F5A8A; font-weight: 800; font-size: 0.85rem; }
.cc-lesson-body[b-pqf7dm5vse] { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.cc-lesson-title[b-pqf7dm5vse] { font-size: 0.95rem; font-weight: 600; color: var(--ink-900); }
.cc-lesson-note[b-pqf7dm5vse] { font-size: 0.84rem; color: var(--ink-500); line-height: 1.4; }
.cc-lesson-dur[b-pqf7dm5vse] { flex: 0 0 auto; font-size: 0.8rem; color: var(--ink-500); padding-top: 2px; white-space: nowrap; }
.cc-lessons-soon[b-pqf7dm5vse] { color: var(--ink-500); font-size: 0.92rem; margin: 0; padding: 4px 0; }

/* Detail-view lesson badge, dark mode. Scoped (not :global, which browsers drop) so it actually
   applies; brightened to clear WCAG 4.5:1 on the dark card surface. */
html[data-theme="dark"] .cc-lesson-num[b-pqf7dm5vse] { background: rgba(94, 160, 224, 0.24); color: #A9D0F5; }

.cc-tutor-row[b-pqf7dm5vse] { display: flex; align-items: center; gap: 16px; }
/* #392: "Meet {Tutor}" presentation-video affordance on the tutor card */
.cc-tutor-video-btn[b-pqf7dm5vse] {
    margin-left: auto; flex: 0 0 auto;
    font-family: inherit; font-size: 0.85rem; font-weight: 700;
    color: var(--brand-blue); background: rgba(31, 90, 138, 0.08);
    border: 1px solid rgba(31, 90, 138, 0.25); border-radius: 999px;
    padding: 8px 16px; cursor: pointer; white-space: nowrap;
    transition: background 0.12s ease, border-color 0.12s ease;
}
.cc-tutor-video-btn:hover[b-pqf7dm5vse] { background: rgba(31, 90, 138, 0.16); border-color: var(--brand-blue); }
html[data-theme="dark"] .cc-tutor-video-btn[b-pqf7dm5vse] { color: #A9D0F5; border-color: rgba(94, 160, 224, 0.4); background: rgba(94, 160, 224, 0.14); }
html[data-theme="dark"] .cc-tutor-video-btn:hover[b-pqf7dm5vse] { background: rgba(94, 160, 224, 0.24); }
.cc-tutor-avatar[b-pqf7dm5vse] { flex: 0 0 auto; width: 56px; height: 56px; border-radius: 50%; background: var(--brand-blue-deep); color: #fff; display: grid; place-items: center; font-weight: 700; }
.cc-tutor-row strong[b-pqf7dm5vse] { display: block; color: var(--ink-900); font-size: 1.05rem; }
.cc-tutor-sub[b-pqf7dm5vse] { display: block; font-size: 0.85rem; color: var(--ink-500); margin: 2px 0 4px; }
.cc-tutor-rating[b-pqf7dm5vse] { font-size: 0.85rem; color: #F39125; letter-spacing: 1px; }
.cc-tutor-rating em[b-pqf7dm5vse] { color: var(--ink-700); font-style: normal; font-weight: 600; letter-spacing: normal; }

/* ── Sticky pricing card ──────────────────────────────────────── */
.cc-detail-side[b-pqf7dm5vse] { position: sticky; top: 24px; }
.cc-price-card[b-pqf7dm5vse] { background: var(--surface); border: 1px solid var(--border); border-radius: 18px; padding: 26px; box-shadow: 0 12px 30px var(--shadow); }
.cc-price-big[b-pqf7dm5vse] { font-weight: 800; font-size: 1.9rem; color: var(--ink-900); }
.cc-price-big span[b-pqf7dm5vse] { font-size: 0.9rem; font-weight: 600; color: var(--ink-500); }
.cc-price-cancel[b-pqf7dm5vse] { font-size: 0.85rem; color: var(--ink-500); margin: 4px 0 18px; }
.cc-features[b-pqf7dm5vse] { list-style: none; padding: 0; margin: 0 0 20px; }
.cc-features li[b-pqf7dm5vse] { position: relative; padding-left: 26px; margin-bottom: 14px; }
.cc-features li[b-pqf7dm5vse]::before { content: "✓"; position: absolute; left: 0; top: 0; color: #6FAE3F; font-weight: 800; }
.cc-features strong[b-pqf7dm5vse] { display: block; color: var(--ink-900); font-size: 0.92rem; }
.cc-features span[b-pqf7dm5vse] { font-size: 0.82rem; color: var(--ink-500); }
.cc-enrol-btn[b-pqf7dm5vse] { width: 100%; padding: 12px; border-radius: 10px; font-weight: 700; }

/* ── #28/#352: quick-summary dialog ───────────────────────────── */
/* The dialog content is authored inside this component's <MudDialog>, so every element carries
   this component's scope attribute even after MudBlazor teleports it. Plain SCOPED selectors
   therefore reach the dialog — a `:global(...)` wrapper is both unnecessary and broken (it
   compiles to `:global(...)[b-hash]`, which browsers reject, dropping the rule entirely; that
   was the root cause of the concatenated schedule, the unsized tile and the overlapping price).
   Dark support comes from the flipped brand tokens (var(--text) etc.) plus explicit
   `html[data-theme="dark"]` selectors where a hard-coded accent needs a dark variant. */
.cc-sum-title[b-pqf7dm5vse] { display: flex; align-items: center; gap: 14px; }
.cc-sum-tile[b-pqf7dm5vse] {
    flex: 0 0 auto; width: 46px; height: 46px;
    border-radius: 12px; display: grid; place-items: center;
    font-size: 1.3rem; line-height: 1; color: #fff;
}
.cc-sum-headings[b-pqf7dm5vse] { min-width: 0; }
.cc-sum-name[b-pqf7dm5vse] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800; font-size: 1.2rem; margin: 0 0 6px;
    color: var(--text);
}
.cc-sum-tags[b-pqf7dm5vse] { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; }
.cc-sum-price[b-pqf7dm5vse] { font-weight: 800; color: var(--brand-orange-text, #B4530A); font-size: 0.95rem; white-space: nowrap; }
.cc-sum-price span[b-pqf7dm5vse] { font-size: 0.72rem; font-weight: 600; color: var(--text-muted); }
html[data-theme="dark"] .cc-sum-price[b-pqf7dm5vse] { color: #F7BC6E; }

.cc-sum-blurb[b-pqf7dm5vse] { color: var(--text); margin: 4px 0 18px; font-size: 0.92rem; line-height: 1.5; }

/* Definition-list facts: each row stacks its label above its value via real CSS structure,
   never inline whitespace. */
.cc-sum-meta[b-pqf7dm5vse] { display: flex; flex-wrap: wrap; gap: 14px 32px; margin: 4px 0 20px; }
.cc-sum-fact[b-pqf7dm5vse] { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.cc-sum-fact dt[b-pqf7dm5vse] {
    font-size: 0.68rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.07em; color: var(--text-muted); margin: 0;
}
.cc-sum-fact dd[b-pqf7dm5vse] { font-size: 0.92rem; color: var(--text); margin: 0; }

.cc-sum-h4[b-pqf7dm5vse] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800; font-size: 1rem; color: var(--text);
    margin: 0 0 10px; padding-top: 6px; border-top: 1px solid var(--border);
}
.cc-sum-loading[b-pqf7dm5vse] { display: flex; align-items: center; gap: 10px; color: var(--text-muted); font-size: 0.9rem; padding: 8px 0; }
.cc-sum-lessons[b-pqf7dm5vse] { list-style: none; padding: 0; margin: 0; }
.cc-sum-lessons li[b-pqf7dm5vse] {
    display: flex; align-items: center; gap: 12px;
    padding: 10px 0; border-bottom: 1px solid var(--border);
    font-size: 0.92rem; color: var(--text);
}
.cc-sum-lessons li:last-child[b-pqf7dm5vse] { border-bottom: none; }
.cc-sum-lnum[b-pqf7dm5vse] {
    flex: 0 0 auto; width: 30px; height: 30px; border-radius: 8px;
    display: grid; place-items: center;
    background: rgba(243, 145, 37, 0.14); color: var(--brand-orange-text, #B4530A);
    font-weight: 800; font-size: 0.8rem;
}
html[data-theme="dark"] .cc-sum-lnum[b-pqf7dm5vse] { background: rgba(243, 145, 37, 0.24); color: #F7BC6E; }
.cc-sum-ltitle[b-pqf7dm5vse] { flex: 1; min-width: 0; }
.cc-sum-ldur[b-pqf7dm5vse] { flex: 0 0 auto; font-size: 0.78rem; color: var(--text-muted); }
.cc-sum-soon[b-pqf7dm5vse] { color: var(--text-muted); font-size: 0.92rem; margin: 0; padding: 4px 0; }
.cc-sum-cta[b-pqf7dm5vse] { padding: 9px 18px; border-radius: 10px; font-weight: 700; }

/* ── #392: "Meet the teacher" video dialog ────────────────────── */
/* Authored inside this component's <MudDialog>, so plain scoped selectors reach the teleported
   dialog content (same reasoning as the quick-summary dialog above). */
.cc-video-title[b-pqf7dm5vse] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800; font-size: 1.15rem; margin: 0;
    color: var(--text);
}
.cc-video-player[b-pqf7dm5vse] {
    display: block; width: 100%; max-height: 62vh;
    border-radius: 12px; background: #000;
}
.cc-video-external[b-pqf7dm5vse] { color: var(--text); font-size: 0.94rem; margin: 4px 0 16px; }
.cc-video-open[b-pqf7dm5vse] { padding: 10px 20px; border-radius: 10px; font-weight: 700; }

/* clickable card affordance (a real <button> for keyboard + screen-reader support) */
.cc-course-card[b-pqf7dm5vse] { cursor: pointer; }

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width: 1200px) {
    .cc-grid[b-pqf7dm5vse] { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
    .cc-grid[b-pqf7dm5vse] { grid-template-columns: repeat(2, 1fr); }
    .cc-detail-body[b-pqf7dm5vse] { grid-template-columns: 1fr; }
    .cc-detail-side[b-pqf7dm5vse] { position: static; }
}
@media (max-width: 600px) {
    .cc-grid[b-pqf7dm5vse] { grid-template-columns: 1fr; }
}
/* /Components/Pages/CxcSignupHub.razor.rz.scp.css */
.hub-body[b-gm7kykdimh] { max-width: 960px; margin: 0 auto; padding: 40px 24px 0; }

.hub-cards[b-gm7kykdimh] { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 0; }

.hub-card[b-gm7kykdimh] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 12px 30px var(--shadow);
    display: flex;
    flex-direction: column;
}
.hub-card-primary[b-gm7kykdimh] { border-top: 4px solid #F39125; }

.hub-card h2[b-gm7kykdimh] { font-size: 1.5rem; font-weight: 800; margin: 14px 0 6px; color: var(--ink-900); }
.hub-sub[b-gm7kykdimh] { display: block; font-size: 0.85rem; color: var(--ink-500); font-weight: 500; margin-bottom: 18px; }

.hub-status[b-gm7kykdimh] { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; font-size: 0.75rem; font-weight: 700; padding: 4px 10px; border-radius: 999px; letter-spacing: 0.01em; }
.hub-status-dot[b-gm7kykdimh] { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.hub-status.is-open[b-gm7kykdimh] { background: rgba(111, 174, 63, 0.16); color: #3F7321; }
.hub-status.is-open .hub-status-dot[b-gm7kykdimh] { background: #6FAE3F; }
.hub-status.is-closed[b-gm7kykdimh] { background: rgba(15, 27, 45, 0.08); color: var(--ink-500); }
.hub-status.is-closed .hub-status-dot[b-gm7kykdimh] { background: #9AA8BC; }

.hub-bullets[b-gm7kykdimh] { list-style: none; padding: 0; margin: 0 0 22px; flex: 1; }
.hub-bullets li[b-gm7kykdimh] { position: relative; padding-left: 26px; margin-bottom: 10px; font-size: 0.92rem; color: var(--ink-700); }
.hub-bullets li[b-gm7kykdimh]::before { content: "✓"; position: absolute; left: 0; color: #3F7321; font-weight: 800; /* 1.4.3: #6FAE3F was 2.7:1 as generated text */ }

.hub-card-foot[b-gm7kykdimh] { display: flex; }
.hub-cta[b-gm7kykdimh] { width: 100%; text-align: center; padding: 12px 22px; border-radius: 10px; }
.hub-cta-disabled[b-gm7kykdimh] { width: 100%; background: rgba(15, 27, 45, 0.08); color: var(--ink-500); border: none; padding: 12px 22px; border-radius: 10px; cursor: not-allowed; }

.hub-paynote[b-gm7kykdimh] {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    border-radius: 14px;
    padding: 18px 22px;
    margin-top: 28px;
}
.hub-paynote.pay-bank[b-gm7kykdimh] { background: rgba(31, 90, 138, 0.08); border: 1px solid rgba(31, 90, 138, 0.2); }
.hub-paynote.pay-card[b-gm7kykdimh] { background: rgba(243, 145, 37, 0.08); border: 1px solid rgba(243, 145, 37, 0.25); }
.hub-paynote-icon[b-gm7kykdimh] { font-size: 1.5rem; line-height: 1; }
.hub-paynote strong[b-gm7kykdimh] { display: block; color: var(--ink-900); margin-bottom: 4px; }
.hub-paynote p[b-gm7kykdimh] { margin: 0; font-size: 0.88rem; color: var(--ink-700); }

.hub-expect[b-gm7kykdimh] {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    border-radius: 14px;
    padding: 16px 20px;
    margin-top: 22px;
    background: var(--brand-blue-pale);
    border: 1px solid rgba(31, 90, 138, 0.22);
}
.hub-expect-icon[b-gm7kykdimh] { font-size: 1.25rem; line-height: 1.4; }
.hub-expect p[b-gm7kykdimh] { margin: 0; font-size: 0.9rem; color: var(--ink-700); line-height: 1.55; }
.hub-expect strong[b-gm7kykdimh] { color: var(--ink-900); }

.hub-foot-note[b-gm7kykdimh] { text-align: center; color: var(--ink-500); font-size: 0.9rem; margin: 32px 0 0; }
.hub-foot-note a[b-gm7kykdimh] { color: var(--brand-blue); font-weight: 600; }

@media (max-width: 760px) {
    .hub-cards[b-gm7kykdimh] { grid-template-columns: 1fr; margin-top: 0; }
}

/* Master-switch state: registration held shut by the client with no reopen date. Sits where the
   period cards would be, sized like them so the page does not read as broken or half-loaded. */
.hub-notice[b-gm7kykdimh] {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    border-radius: 16px;
    padding: 26px 28px;
    margin-top: 8px;
    background: var(--brand-blue-pale);
    border: 1px solid rgba(31, 90, 138, 0.22);
}
.hub-notice-icon[b-gm7kykdimh] { font-size: 1.6rem; line-height: 1.2; flex-shrink: 0; }
.hub-notice h2[b-gm7kykdimh] { margin: 0 0 8px; font-size: 1.25rem; color: var(--ink-900); }
.hub-notice p[b-gm7kykdimh] { margin: 0; font-size: 0.95rem; color: var(--ink-700); line-height: 1.6; }
.hub-notice p + p[b-gm7kykdimh] { margin-top: 12px; }
.hub-notice a[b-gm7kykdimh] { color: var(--brand-blue); font-weight: 600; }
.hub-notice-alt strong[b-gm7kykdimh] { color: var(--ink-900); }

@media (max-width: 760px) {
    .hub-notice[b-gm7kykdimh] { padding: 20px; }
}

/* 1.4.3 — the open-badge green needs the dark palette's green: #3F7321 on the dark surface is
   2.16:1. Sibling pills on Home/CourseCatalog already do this; this one was missed. */
html[data-theme="dark"] .hub-status.is-open[b-gm7kykdimh] { color: #9CCB72; background: rgba(156, 203, 114, 0.16); }
html[data-theme="dark"] .hub-bullets li[b-gm7kykdimh]::before { color: #9CCB72; }
/* /Components/Pages/EslipStore.razor.rz.scp.css */
.es-body[b-ovhynxeumj] { max-width: 760px; margin: 0 auto; padding: 40px 24px 64px; }

.es-card[b-ovhynxeumj] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-top: 4px solid #F39125;
    border-radius: 18px;
    padding: 30px;
    box-shadow: 0 12px 30px var(--shadow);
}

.es-card-head[b-ovhynxeumj] { margin-bottom: 22px; }
.es-card-head h2[b-ovhynxeumj] { font-size: 1.4rem; font-weight: 800; margin: 0 0 6px; color: var(--ink-900); }
.es-card-head p[b-ovhynxeumj] { margin: 0; font-size: 0.92rem; color: var(--ink-500); }

.es-form[b-ovhynxeumj] { display: block; }
.es-grid[b-ovhynxeumj] { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px; margin-bottom: 22px; }
.es-field[b-ovhynxeumj] { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.es-label[b-ovhynxeumj] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ink-700);
}
.es-input[b-ovhynxeumj] {
    width: 100%;
    font-family: inherit;
    font-size: 0.92rem;
    color: var(--ink-900);
    background: var(--surface);
    border: 1px solid var(--border-strong);
    border-radius: 10px;
    padding: 10px 12px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.es-input[b-ovhynxeumj]::placeholder { color: var(--ink-500); }
.es-input:focus[b-ovhynxeumj] {
    outline: 2px solid var(--brand-blue, #1F5A8A); outline-offset: 1px; /* 2.4.7: outline:none left only an 18%-alpha glow */
    border-color: var(--brand-orange);
    box-shadow: 0 0 0 3px rgba(243, 145, 37, 0.18);
}

.es-product[b-ovhynxeumj] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(31, 90, 138, 0.06);
    border: 1px solid rgba(31, 90, 138, 0.18);
    border-radius: 14px;
    padding: 16px 18px;
    margin-bottom: 18px;
}
.es-product-icon[b-ovhynxeumj] {
    width: 46px; height: 46px;
    border-radius: 12px;
    display: grid; place-items: center;
    font-size: 1.4rem;
    background: rgba(31, 90, 138, 0.12);
    flex: 0 0 auto;
}
.es-product-info[b-ovhynxeumj] { flex: 1; display: flex; flex-direction: column; line-height: 1.35; min-width: 0; }
.es-product-info strong[b-ovhynxeumj] { color: var(--ink-900); font-size: 0.98rem; }
.es-product-info span[b-ovhynxeumj] { color: var(--ink-500); font-size: 0.82rem; }
.es-product-price[b-ovhynxeumj] { font-weight: 800; color: var(--brand-orange-text, #B4530A); font-size: 1.15rem; white-space: nowrap; }

.es-error[b-ovhynxeumj] {
    background: rgba(214, 69, 47, 0.08);
    border: 1px solid rgba(214, 69, 47, 0.28);
    color: #B23A22;
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 0.88rem;
    margin-bottom: 16px;
}

.es-submit[b-ovhynxeumj] { width: 100%; padding: 13px 22px; border-radius: 10px; font-weight: 700; }
.es-submit:disabled[b-ovhynxeumj] { opacity: 0.7; cursor: progress; }

.es-cart-btn[b-ovhynxeumj] {
    width: 100%;
    margin-top: 12px;
    padding: 12px 22px;
    border-radius: 10px;
    font-weight: 700;
    font-family: inherit;
    font-size: 0.95rem;
    cursor: pointer;
    background: var(--surface);
    color: var(--brand-orange-text, #B4530A);
    border: 1.5px solid var(--brand-orange);
    transition: background 0.15s ease, color 0.15s ease;
}
.es-cart-btn:hover[b-ovhynxeumj] { background: var(--brand-orange); color: #0F1B2D; } /* WCAG 1.4.3 — white on orange was 2.36:1 */
.es-cart-btn:disabled[b-ovhynxeumj] { opacity: 0.6; cursor: not-allowed; }

.es-foot-note[b-ovhynxeumj] { text-align: center; color: var(--ink-500); font-size: 0.85rem; margin: 20px 0 0; }

/* ── Candidate-list match cards (confirm step, #399) ──────────── */
.es-match[b-ovhynxeumj] {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    margin-bottom: 12px;
    padding: 16px 18px;
    border-radius: 14px;
    background: rgba(111, 174, 63, 0.1);
    border: 1px solid rgba(111, 174, 63, 0.32);
    cursor: pointer;
}
.es-match-active[b-ovhynxeumj] { border-color: #4E7D24; box-shadow: 0 0 0 2px rgba(111, 174, 63, 0.28); }
.es-match-radio[b-ovhynxeumj] { margin-top: 4px; accent-color: #4E7D24; flex: 0 0 auto; }
.es-match-icon[b-ovhynxeumj] {
    width: 40px; height: 40px;
    border-radius: 11px;
    display: grid; place-items: center;
    font-size: 1.25rem;
    font-weight: 800;
    color: #4E7D24;
    background: rgba(111, 174, 63, 0.18);
    flex: 0 0 auto;
}
.es-match-body[b-ovhynxeumj] { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.es-match-body strong[b-ovhynxeumj] { color: var(--ink-900); font-size: 0.95rem; }
.es-match-body span[b-ovhynxeumj] { color: var(--ink-700); font-size: 0.86rem; }
.es-match-note[b-ovhynxeumj] { color: var(--ink-500); font-size: 0.85rem; margin: 4px 0 16px; }

.es-field-wide[b-ovhynxeumj] { grid-column: 1 / -1; }

[b-ovhynxeumj] .es-alert { margin-bottom: 16px; }

/* ── Store-closed (gated) state ───────────────────────────────── */
.es-closed[b-ovhynxeumj] { text-align: center; }
.es-closed-icon[b-ovhynxeumj] {
    width: 74px; height: 74px;
    margin: 4px auto 18px;
    border-radius: 50%;
    background: rgba(31, 90, 138, 0.1);
    display: grid; place-items: center;
    font-size: 2rem;
}
.es-closed h2[b-ovhynxeumj] { font-size: 1.5rem; font-weight: 800; margin: 0 0 10px; color: var(--ink-900); }
.es-closed-lead[b-ovhynxeumj] { color: var(--ink-700); font-size: 0.98rem; max-width: 520px; margin: 0 auto; line-height: 1.5; }

/* The availability list. Left-aligned inside an otherwise centred card, because two dates read as
   a reference table, not as prose — which is the point of the client's rewrite. */
.es-closed-list[b-ovhynxeumj] {
    list-style: none;
    margin: 10px auto 0;
    padding: 0;
    max-width: 34rem;
    text-align: left;
    display: grid;
    gap: 8px;
}

.es-closed-list li[b-ovhynxeumj] {
    position: relative;
    padding-left: 20px;
    color: var(--ink-700);
    line-height: 1.6;
    font-size: .95rem;
}

.es-closed-list li[b-ovhynxeumj]::before {
    content: "";
    position: absolute;
    left: 4px;
    top: .62em;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--brand-orange, #F39125);
}

/* ── Confirmation state ───────────────────────────────────────── */
.es-confirm[b-ovhynxeumj] { text-align: center; }
.es-confirm-check[b-ovhynxeumj] {
    width: 74px; height: 74px;
    margin: 4px auto 18px;
    border-radius: 50%;
    background: rgba(111, 174, 63, 0.16);
    color: #4E7D24;
    display: grid; place-items: center;
    font-size: 2.2rem; font-weight: 800;
}
.es-confirm h2[b-ovhynxeumj] { font-size: 1.6rem; font-weight: 800; margin: 0 0 10px; color: var(--ink-900); }
.es-confirm-lead[b-ovhynxeumj] { color: var(--ink-700); font-size: 0.98rem; max-width: 520px; margin: 0 auto 24px; }

.es-confirm-note[b-ovhynxeumj] {
    display: flex;
    gap: 14px;
    text-align: left;
    background: var(--paper-warm);
    border-radius: 14px;
    padding: 18px 20px;
    margin: 0 auto 26px;
    max-width: 560px;
}
.es-confirm-note-icon[b-ovhynxeumj] { font-size: 1.5rem; line-height: 1; flex: 0 0 auto; }
.es-confirm-note strong[b-ovhynxeumj] { display: block; color: var(--ink-900); margin-bottom: 4px; }
.es-confirm-note p[b-ovhynxeumj] { margin: 0; font-size: 0.88rem; color: var(--ink-700); }

.es-reset[b-ovhynxeumj] { padding: 11px 24px; border-radius: 10px; font-weight: 700; }

@media (max-width: 600px) {
    .es-grid[b-ovhynxeumj] { grid-template-columns: 1fr; }
    .es-product[b-ovhynxeumj] { flex-wrap: wrap; }
    .es-product-price[b-ovhynxeumj] { margin-left: auto; }
}

/* ── Out-of-season preview banner ────────────────────────────────────────────
   Only rendered when PreviewAllWindows has forced the store open. Amber rather
   than the brand palette on purpose: it must not read as part of the design. */
.es-preview-banner[b-ovhynxeumj] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    max-width: 760px;
    margin: 0 auto 20px;
    padding: 13px 16px;
    border: 1px solid #E0A030;
    border-left: 4px solid #E0A030;
    border-radius: 10px;
    background: #FDF4E3;
    color: #4A3308;
    font-size: 0.9rem;
    line-height: 1.55;
}

.es-preview-banner strong[b-ovhynxeumj] { display: block; margin-bottom: 2px; }

@media (prefers-color-scheme: dark) {
    .es-preview-banner[b-ovhynxeumj] { background: #2E2416; color: #F0DCB4; border-color: #8A6A22; }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* ── Hero ─────────────────────────────────────────────────────── */
.e2c-hero[b-vdxmsra57x] {
    position: relative;
    overflow: hidden;
    color: #fff;
    background: radial-gradient(120% 80% at 80% 0%, #F7B250 0%, #E36A1A 30%, #1F5A8A 68%, #163E63 100%);
    padding: 80px 24px 96px;
}

.e2c-hero-sun[b-vdxmsra57x] {
    position: absolute;
    top: -120px;
    right: -80px;
    width: 460px;
    height: 460px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 210, 125, 0.45) 0%, rgba(255, 210, 125, 0) 60%);
    pointer-events: none;
}

.e2c-hero-inner[b-vdxmsra57x] { max-width: 1240px; margin: 0 auto; position: relative; }

.e2c-chip[b-vdxmsra57x] {
    display: inline-block;
    background: rgba(255, 255, 255, 0.18);
    color: #FFFFFF; /* 1.4.3: #FFE6BD over the translucent chip was 3.9:1 */
    border-radius: 999px;
    padding: 7px 16px;
    font-size: 0.82rem;
    font-weight: 600;
    margin-bottom: 22px;
}

.e2c-hero-h1[b-vdxmsra57x] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: clamp(2rem, 5vw, 3.6rem);
    line-height: 1.05;
    margin: 0 0 20px;
    letter-spacing: -0.01em;
}

.e2c-gold[b-vdxmsra57x] { color: #FFD27D; }

.e2c-hero-sub[b-vdxmsra57x] {
    color: rgba(255, 255, 255, 0.88);
    font-size: 1.08rem;
    max-width: 580px;
    margin: 0 0 28px;
}

.e2c-hero-cta[b-vdxmsra57x] { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 44px; }

.e2c-btn-primary[b-vdxmsra57x] {
    background: #fff;
    color: var(--brand-orange-text, #B4530A);
    font-weight: 700;
    border: none;
    padding: 12px 24px;
    border-radius: 10px;
}
.e2c-btn-primary:hover[b-vdxmsra57x] { background: #FFF4E4; color: var(--brand-orange-text, #B4530A); }

.e2c-btn-ghost[b-vdxmsra57x] {
    border: 1px solid rgba(255, 255, 255, 0.5);
    color: #fff;
    font-weight: 600;
    padding: 12px 22px;
    border-radius: 10px;
}
.e2c-btn-ghost:hover[b-vdxmsra57x] { background: rgba(255, 255, 255, 0.12); color: #fff; }

.e2c-hero-stats[b-vdxmsra57x] { display: flex; flex-wrap: wrap; gap: 0; }
.e2c-stat[b-vdxmsra57x] { padding: 0 28px; border-left: 1px solid rgba(255, 255, 255, 0.2); }
.e2c-stat:first-child[b-vdxmsra57x] { padding-left: 0; border-left: none; }
.e2c-stat-val[b-vdxmsra57x] { font-size: 1.9rem; font-weight: 800; line-height: 1; }
.e2c-stat-lbl[b-vdxmsra57x] { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.06em; color: rgba(255, 255, 255, 0.75); margin-top: 6px; }

/* ── Sections ─────────────────────────────────────────────────── */
.e2c-section[b-vdxmsra57x] { max-width: 1240px; margin: 0 auto; padding: 72px 24px 0; }
.e2c-section-head[b-vdxmsra57x] { margin-bottom: 32px; }
.e2c-eyebrow[b-vdxmsra57x] { color: var(--brand-orange-text, #B4530A); text-transform: uppercase; letter-spacing: 0.12em; font-size: 0.78rem; font-weight: 700; }
.e2c-section-head h2[b-vdxmsra57x] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: clamp(1.5rem, 3vw, 2.3rem);
    color: var(--ink-900);
    margin: 8px 0 0;
}
.e2c-section-sub[b-vdxmsra57x] { color: var(--ink-500); margin-top: 10px; max-width: 620px; }

/* Brand logo lockup at top of subjects header (#35) */
.e2c-brand-lockup[b-vdxmsra57x] { display: inline-flex; align-items: center; margin-bottom: 14px; }
.e2c-brand-logo[b-vdxmsra57x] { height: 40px; width: auto; display: block; }

/* ── Subject carousel (stepped / paged auto-advance, #26) ─────── */
/* Paging math (must tile exactly so cards are never clipped):
   - --e2c-per-view cards + (per-view − 1) gaps fill exactly 100% of the viewport,
     so each card basis = (100% − (per-view − 1)·gap) / per-view.
   - One page advance = the full viewport (100%) PLUS one gap, because the track is
     PageCount viewports laid end-to-end with a gap separating each page. Advancing by
     only 100% (the old bug) ignored that inter-page gap and slid every later page
     left by `page·gap`, slicing a card in half. The markup translates by
     calc(-page · (100% + gap)); the two must use the same --e2c-card-gap. */
/* CSEC/CAPE filter pills + nav arrows for the subject carousel */
.e2c-subject-controls[b-vdxmsra57x] {
    display: flex; align-items: center; justify-content: space-between;
    gap: 16px; flex-wrap: wrap; margin-bottom: 18px;
}
.e2c-subject-filters[b-vdxmsra57x] { display: flex; flex-wrap: wrap; gap: 10px; }
.e2c-subject-pill[b-vdxmsra57x] {
    display: inline-flex; align-items: center; gap: 8px;
    font: inherit; font-size: 0.9rem; font-weight: 600; cursor: pointer;
    padding: 8px 16px; border-radius: 999px;
    border: 1px solid var(--border); background: var(--surface); color: var(--text);
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.e2c-subject-pill:hover[b-vdxmsra57x] { border-color: #F39125; }
.e2c-subject-pill.is-on[b-vdxmsra57x] { background: #E36A1A; border-color: var(--brand-orange-text, #B4530A); color: #fff; }
.e2c-pill-count[b-vdxmsra57x] {
    font-size: 0.78rem; font-weight: 700; line-height: 1;
    padding: 2px 8px; border-radius: 999px;
    background: var(--surface-2); color: var(--text-muted);
}
.e2c-subject-pill.is-on .e2c-pill-count[b-vdxmsra57x] { background: rgba(255, 255, 255, 0.22); color: #fff; }
.e2c-subject-arrows[b-vdxmsra57x] { display: flex; gap: 8px; }
.e2c-subject-arrow[b-vdxmsra57x] {
    width: 40px; height: 40px; border-radius: 50%;
    border: 1px solid var(--border); background: var(--surface); color: var(--text);
    font-size: 1.4rem; line-height: 1; cursor: pointer;
    display: grid; place-items: center;
    transition: border-color 0.15s ease, color 0.15s ease;
}
.e2c-subject-arrow:hover[b-vdxmsra57x] { border-color: var(--brand-orange-text, #B4530A); color: var(--brand-orange-text, #B4530A); }

.e2c-subject-viewport[b-vdxmsra57x] {
    --e2c-per-view: 4;
    --e2c-card-gap: 18px;
    overflow: hidden;
    padding: 6px 0 24px;
}
.e2c-subject-track[b-vdxmsra57x] {
    display: flex;
    gap: var(--e2c-card-gap);
    /* inline transform + transition set in markup */
    will-change: transform;
}
.e2c-subject-card[b-vdxmsra57x] {
    flex: 0 0 calc((100% - (var(--e2c-per-view) - 1) * var(--e2c-card-gap)) / var(--e2c-per-view));
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 20px;
    box-shadow: 0 1px 2px var(--shadow);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
    display: flex;
    flex-direction: column;
}
.e2c-subject-card:hover[b-vdxmsra57x] { transform: translateY(-3px); box-shadow: 0 12px 28px var(--shadow); }
.e2c-subject-top[b-vdxmsra57x] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.e2c-subject-icon[b-vdxmsra57x] {
    width: 46px; height: 46px;
    border-radius: 12px;
    display: grid; place-items: center;
    font-size: 1.3rem;
}
.e2c-level-chip[b-vdxmsra57x] { font-size: 0.68rem; font-weight: 700; letter-spacing: 0.05em; padding: 4px 9px; border-radius: 999px; }
.e2c-level-csec[b-vdxmsra57x] { background: rgba(31, 90, 138, 0.12); color: #1F5A8A; }
.e2c-level-cape[b-vdxmsra57x] { background: rgba(243, 145, 37, 0.14); color: var(--brand-orange-text, #B4530A); }
/* Dark mode: the light values are dark-on-dark on a var(--surface) card — brighten
   text + tint so both chips clear WCAG 1.4.3 (≥4.5:1). Same pair as CourseCatalog (#36):
   #8EC2F0 on the blue tint ≈ 5.8:1, #F6B25C on the orange tint ≈ 5.7:1 over #142238. */
html[data-theme="dark"] .e2c-level-csec[b-vdxmsra57x] { background: rgba(94, 160, 224, 0.22); color: #8EC2F0; }
html[data-theme="dark"] .e2c-level-cape[b-vdxmsra57x] { background: rgba(243, 145, 37, 0.24); color: #F6B25C; }
.e2c-subject-card h3[b-vdxmsra57x] { font-size: 1.1rem; font-weight: 700; margin: 0 0 8px; color: var(--ink-900); }
.e2c-subject-meta[b-vdxmsra57x] { font-size: 0.8rem; color: var(--ink-500); margin-bottom: 10px; }
.e2c-subject-blurb[b-vdxmsra57x] { font-size: 0.85rem; color: var(--ink-700); flex: 1; margin: 0 0 14px; }
.e2c-subject-foot[b-vdxmsra57x] { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--border); padding-top: 12px; }
.e2c-rating[b-vdxmsra57x] { font-size: 0.85rem; font-weight: 600; color: var(--ink-700); }
.e2c-price[b-vdxmsra57x] { font-weight: 700; color: var(--brand-orange-text, #B4530A); }

/* Respect reduced-motion: no sliding animation (auto-advance still off via timer guard). */
@media (prefers-reduced-motion: reduce) {
    .e2c-subject-track[b-vdxmsra57x] { transition: none !important; }
}

/* Tablet & mobile: the C# timer pages in desktop-sized (4-up) steps, which can't
   know the breakpoint, so below 901px we drop transform paging entirely and let the
   user swipe a native scroll-snap track. The inline transform is neutralised and the
   viewport scrolls horizontally; cards keep their fixed fraction so they snap cleanly
   and a sliver of the next card peeks to signal more content. No half-cut cards. */
@media (max-width: 900px) {
    .e2c-subject-viewport[b-vdxmsra57x] {
        --e2c-per-view: 2.15; /* ~2 cards + a peek */
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .e2c-subject-viewport[b-vdxmsra57x]::-webkit-scrollbar { display: none; }
    .e2c-subject-track[b-vdxmsra57x] {
        transform: none !important;
        transition: none !important;
        /* NO min-width here. `min-width: min-content` was added to "let the track grow past the
           viewport so cards keep full width", and it did the opposite: the cards size with a
           PERCENTAGE flex-basis — calc((100% - …) / --e2c-per-view) — which needs a definite
           containing block. min-content makes the track's width depend on its contents, which
           depend on the track's width, so the percentage has nothing to resolve against and each
           card falls back to its own content width.
           Measured on a 386px phone viewport: cards rendered 1190px instead of 291px, i.e. one card
           over three screens wide, and the carousel read as broken.
           It was also unnecessary — `flex: 0 0 <basis>` already sets flex-shrink: 0, so the cards
           could never have been squeezed. The track stays at the scroll container's width and the
           cards overflow it, which is exactly what makes overflow-x scroll. */
    }
    .e2c-subject-card[b-vdxmsra57x] { scroll-snap-align: start; }
}
@media (max-width: 560px) {
    .e2c-subject-viewport[b-vdxmsra57x] { --e2c-per-view: 1.12; } /* one full card + a peek */
}

/* ── Differentiator strip — "Our flagship promise" ─────────────── */
.e2c-promise-section[b-vdxmsra57x] { padding-top: 72px; }
.e2c-promise[b-vdxmsra57x] {
    position: relative;
    overflow: hidden;
    border-radius: 22px;
    color: #fff;
    padding: 48px;
    background: linear-gradient(120deg, var(--brand-blue) 0%, #2A6BA0 50%, var(--brand-orange) 130%);
    box-shadow: 0 18px 44px var(--shadow);
}
.e2c-promise-orb[b-vdxmsra57x] { position: absolute; border-radius: 50%; pointer-events: none; }
.e2c-promise-orb-light[b-vdxmsra57x] { right: -60px; top: -60px; width: 240px; height: 240px; background: rgba(255, 255, 255, 0.06); }
.e2c-promise-orb-gold[b-vdxmsra57x] { right: 80px; bottom: -40px; width: 140px; height: 140px; background: rgba(255, 210, 125, 0.18); }
.e2c-promise-grid[b-vdxmsra57x] {
    position: relative;
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 32px;
    align-items: center;
}
.e2c-promise-chip[b-vdxmsra57x] {
    display: inline-block;
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
    border-radius: 999px;
    padding: 6px 15px;
    font-size: 0.82rem;
    font-weight: 600;
}
.e2c-promise-h2[b-vdxmsra57x] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: clamp(1.6rem, 3.4vw, 2.35rem);
    line-height: 1.1;
    margin: 14px 0;
}
.e2c-promise-sub[b-vdxmsra57x] {
    font-size: 1.05rem;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.85);
    margin: 0 0 24px;
    max-width: 480px;
}
.e2c-promise-btn[b-vdxmsra57x] {
    display: inline-flex;
    align-items: center;
    background: #fff;
    color: var(--brand-orange-text, #B4530A);
    font-weight: 700;
    border: none;
    padding: 12px 24px;
    border-radius: 10px;
}
.e2c-promise-btn:hover[b-vdxmsra57x] { background: #FFF4E4; color: var(--brand-orange-text, #B4530A); }
.e2c-promise-rows[b-vdxmsra57x] { display: flex; flex-direction: column; gap: 10px; }
.e2c-promise-row[b-vdxmsra57x] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.14);
}
.e2c-promise-mark[b-vdxmsra57x] {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 0.85rem;
    font-weight: 800;
    color: #fff;
    background: rgba(255, 210, 125, 0.3);
}
.e2c-promise-row-lbl[b-vdxmsra57x] { font-size: 0.72rem; color: rgba(255, 255, 255, 0.92); /* 1.4.3: 0.7 was 3.5:1 over the gradient */ text-transform: uppercase; letter-spacing: 0.04em; }
.e2c-promise-row-val[b-vdxmsra57x] { font-size: 0.92rem; font-weight: 700; }

@media (max-width: 760px) {
    .e2c-promise[b-vdxmsra57x] { padding: 28px; }
    .e2c-promise-grid[b-vdxmsra57x] { grid-template-columns: 1fr; gap: 24px; }
}

/* ── How it works ─────────────────────────────────────────────── */
.e2c-how-grid[b-vdxmsra57x] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.e2c-how-card[b-vdxmsra57x] { background: var(--paper-warm); border-radius: 16px; padding: 24px; }
.e2c-how-num[b-vdxmsra57x] { font-size: 1.6rem; font-weight: 800; color: var(--brand-orange-text, #B4530A); opacity: 0.5; }
.e2c-how-card h3[b-vdxmsra57x] { font-size: 1.05rem; font-weight: 700; margin: 10px 0 8px; }
.e2c-how-card p[b-vdxmsra57x] { font-size: 0.88rem; color: var(--ink-700); margin: 0; }

/* ── Testimonials ─────────────────────────────────────────────── */
.e2c-tms-grid[b-vdxmsra57x] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.e2c-tm-card[b-vdxmsra57x] { background: var(--surface); border: 1px solid var(--border); border-radius: 16px; padding: 24px; }
.e2c-tm-stars[b-vdxmsra57x] { color: var(--brand-orange-text, #B4530A); /* 1.4.11: #F39125 was 2.36:1 and the stars carry the rating */ letter-spacing: 2px; margin-bottom: 12px; }
.e2c-tm-card blockquote[b-vdxmsra57x] { font-size: 0.95rem; color: var(--ink-700); margin: 0 0 18px; line-height: 1.5; }
.e2c-tm-card figcaption[b-vdxmsra57x] { display: flex; align-items: center; gap: 12px; }
.e2c-tm-avatar[b-vdxmsra57x] { width: 42px; height: 42px; border-radius: 50%; background: var(--brand-blue-deep); color: #fff; display: grid; place-items: center; font-weight: 700; font-size: 0.85rem; }
.e2c-tm-who[b-vdxmsra57x] { display: flex; flex-direction: column; line-height: 1.3; }
.e2c-tm-who strong[b-vdxmsra57x] { font-size: 0.92rem; }
.e2c-tm-who span[b-vdxmsra57x] { font-size: 0.78rem; color: var(--ink-500); }

/* ── Final CTA ────────────────────────────────────────────────── */
.e2c-cta[b-vdxmsra57x] { margin-top: 80px; background: linear-gradient(110deg, #163E63, #1F5A8A); color: #fff; }
.e2c-cta-inner[b-vdxmsra57x] { max-width: 1240px; margin: 0 auto; padding: 64px 24px; text-align: center; }
.e2c-cta-inner h2[b-vdxmsra57x] { font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif; font-weight: 800; font-size: clamp(1.6rem, 3vw, 2.4rem); margin: 0 0 12px; }
.e2c-cta-inner p[b-vdxmsra57x] { color: rgba(255, 255, 255, 0.85); max-width: 560px; margin: 0 auto 26px; }
.e2c-cta-actions[b-vdxmsra57x] { display: flex; gap: 12px; justify-content: center; align-items: center; flex-wrap: wrap; width: 100%; }
.e2c-cta-actions .btn[b-vdxmsra57x] { display: inline-flex; align-items: center; justify-content: center; text-align: center; }
.e2c-btn-ghost-dark[b-vdxmsra57x] { border: 1px solid rgba(255, 255, 255, 0.5); color: #fff; font-weight: 600; padding: 10px 22px; border-radius: 10px; }
.e2c-btn-ghost-dark:hover[b-vdxmsra57x] { background: rgba(255, 255, 255, 0.12); color: #fff; }

@media (max-width: 900px) {
    .e2c-how-grid[b-vdxmsra57x] { grid-template-columns: repeat(2, 1fr); }
    .e2c-tms-grid[b-vdxmsra57x] { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
    .e2c-how-grid[b-vdxmsra57x] { grid-template-columns: 1fr; }
    .e2c-stat[b-vdxmsra57x] { padding: 0 16px; }
}

/* ── CoTails (partner) ────────────────────────────────────────────
   The supplied artwork is a BLACK wordmark on transparent. The vendor's dark
   variant bakes in an opaque black square, which would read as a black rectangle
   over the navy hero — so the mark always sits on a light chip, in both themes.
   That is also the conventional treatment for a partner logo. */
/* Visibility and placement are controlled HERE, not with Bootstrap's d-none/d-lg-block. Those
   utilities do not resolve inside this component's scoped stylesheet — nothing matched them at all —
   so the card was once left hidden by d-none at every width.

   MOBILE-FIRST, and there must be exactly one `display` in this block: a stray second declaration
   silently overrode the first, which is how the card ended up absolutely positioned on a phone with
   no room to sit in, floating over "1,200+ students taught".

   The card is the LAST child of .e2c-hero-inner, immediately after the stat row, so leaving it in
   normal flow puts it exactly where it belongs on a narrow screen: below the stats, still inside the
   hero, and therefore above "Subjects we teach". Only the wide-screen query lifts it out of the flow
   to float beside the hero copy. */
.e2c-cotails-card[b-vdxmsra57x] {
    display: flex;
    position: static;
    width: 100%;
    /* Full-bleed on a phone would look like a page section rather than a partner callout. */
    max-width: 420px;
    margin: 28px 0 0;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
    padding: 18px 16px;
    border-radius: 16px;
    background: #FFFFFF;
    box-shadow: 0 14px 34px rgba(15, 27, 45, .26);
    text-decoration: none;
    transition: transform .16s ease, box-shadow .16s ease;
}
.e2c-cotails-card:hover[b-vdxmsra57x],
.e2c-cotails-card:focus-visible[b-vdxmsra57x] {
    transform: translateY(-2px);
    box-shadow: 0 22px 52px rgba(15, 27, 45, .34);
}
.e2c-cotails-eyebrow[b-vdxmsra57x] {
    font-size: .6rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #6E675E;
}
.e2c-cotails-logo[b-vdxmsra57x] { width: 148px; max-width: 100%; height: auto; display: block; }
.e2c-cotails-copy[b-vdxmsra57x] { font-size: .78rem; line-height: 1.45; color: #2A2620; }
.e2c-cotails-cta[b-vdxmsra57x] { font-size: .76rem; font-weight: 700; color: var(--brand-orange-text, #B4530A); }

/* Floated beside the hero copy only where there is genuinely room: wide enough not to collide with
   it, and tall enough that .e2c-hero's overflow:hidden will not clip it. Below this the card stays
   in normal flow (see the base rule) — it is never hidden, just laid out differently.
   `bottom: 16px` rather than 0: the hero clips, so a card sitting flush at the edge loses its
   shadow and, on a short hero, part of itself. */
@media (min-width: 1100px) and (min-height: 760px) {
    .e2c-cotails-card[b-vdxmsra57x] {
        position: absolute;
        right: 0;
        bottom: 16px;
        width: 232px;
        max-width: none;
        margin: 0;
    }
}

/* Section between "How it works" and "Student stories": logo left, copy right. */
.e2c-cotails-inner[b-vdxmsra57x] {
    max-width: 860px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
    align-items: center;
    gap: 32px;
}
.e2c-cotails-markwrap[b-vdxmsra57x] {
    background: #FFFFFF;
    border-radius: 14px;
    padding: 22px 24px;
    box-shadow: 0 2px 14px rgba(15, 27, 45, .10);
    display: flex;
    justify-content: center;
}
.e2c-cotails-mark[b-vdxmsra57x] { width: 100%; height: auto; display: block; }
.e2c-cotails-body[b-vdxmsra57x] { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.e2c-cotails-lead[b-vdxmsra57x] { margin: 0; font-size: 1.02rem; line-height: 1.6; color: var(--text); }
/* .e2c-cotails-wip removed with the "coming soon" line it styled — /cotails now has the story. */
.e2c-cotails-actions[b-vdxmsra57x] { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin-top: 4px; }
.e2c-cotails-btn[b-vdxmsra57x] { text-decoration: none; }
.e2c-cotails-link[b-vdxmsra57x] {
    font-size: .9rem;
    font-weight: 600;
    color: var(--brand-blue);
    text-decoration: none;
}
.e2c-cotails-link:hover[b-vdxmsra57x], .e2c-cotails-link:focus-visible[b-vdxmsra57x] { text-decoration: underline; }

/* Stacks rather than squeezing the wordmark to illegibility on a phone. */
@media (max-width: 760px) {
    .e2c-cotails-inner[b-vdxmsra57x] { grid-template-columns: 1fr; gap: 20px; }
    .e2c-cotails-markwrap[b-vdxmsra57x] { padding: 16px 18px; }
}
/* /Components/Pages/OrderSummary.razor.rz.scp.css */
.tnum[b-phr87n8v33] { font-variant-numeric: tabular-nums; }

/* ── Shell + top bar (bare, self-contained) ─────────────────────── */
.os-shell[b-phr87n8v33] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--surface-2, #F3F6FA);
    font-family: 'Inter', system-ui, sans-serif;
}

.os-topbar[b-phr87n8v33] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 24px;
    background: var(--surface, #fff);
    border-bottom: 1px solid var(--border, rgba(15,27,45,0.10));
}
.os-brand[b-phr87n8v33] { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.os-logo[b-phr87n8v33] { height: 34px; width: auto; }
.os-brand-text[b-phr87n8v33] { display: flex; flex-direction: column; line-height: 1.15; }
.os-brand-name[b-phr87n8v33] { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 0.9rem; letter-spacing: 0.04em; color: var(--text, #0F1B2D); }
.os-brand-sub[b-phr87n8v33] { font-size: 0.72rem; color: var(--text-muted, #5A6B82); }
.os-topbar-right[b-phr87n8v33] { display: inline-flex; align-items: center; gap: 14px; }
.os-secure[b-phr87n8v33] { font-size: 0.82rem; color: var(--text-muted, #5A6B82); font-weight: 600; }

.os-main[b-phr87n8v33] { flex: 1; padding: 32px 24px 72px; }

/* ── Loading / empty states ─────────────────────────────────────── */
.os-state[b-phr87n8v33] { display: grid; place-items: center; gap: 14px; text-align: center; max-width: 520px; margin: 48px auto; color: var(--text-muted, #5A6B82); }
.os-empty[b-phr87n8v33] { background: var(--surface, #fff); border: 1px solid var(--border, rgba(15,27,45,0.10)); border-radius: 18px; padding: 40px 32px; box-shadow: 0 14px 40px var(--shadow, rgba(15,27,45,0.10)); }
.os-empty-glyph[b-phr87n8v33] { font-size: 2.4rem; }
.os-empty h1[b-phr87n8v33] { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 1.5rem; color: var(--text, #0F1B2D); margin: 0; }
.os-empty p[b-phr87n8v33] { color: var(--text-muted, #5A6B82); margin: 0; line-height: 1.55; }
.os-empty-actions[b-phr87n8v33] { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; margin-top: 8px; }

/* ── Layout ─────────────────────────────────────────────────────── */
.os-grid[b-phr87n8v33] {
    max-width: 1080px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 26px;
    align-items: start;
}
.os-cols[b-phr87n8v33] { display: flex; flex-direction: column; gap: 20px; }

.os-intro[b-phr87n8v33] { padding: 4px 2px 0; }
.os-eyebrow[b-phr87n8v33] { display: inline-block; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--brand-orange-deep, #E36A1A); margin-bottom: 6px; }
.os-h1[b-phr87n8v33] { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: clamp(1.5rem, 3vw, 2rem); color: var(--text, #0F1B2D); margin: 0 0 8px; }
.os-lede[b-phr87n8v33] { color: var(--text-muted, #5A6B82); margin: 0; line-height: 1.55; max-width: 560px; }
.os-lede strong[b-phr87n8v33] { color: var(--text, #0F1B2D); }
.os-ref[b-phr87n8v33] { font-family: ui-monospace, 'Cascadia Mono', monospace; color: var(--brand-blue-deep, #163E63); }

/* ── Section cards (one per product type) ───────────────────────── */
.os-card[b-phr87n8v33] {
    background: var(--surface, #fff);
    border: 1px solid var(--border, rgba(15,27,45,0.10));
    border-radius: 18px;
    padding: 22px 24px;
    box-shadow: 0 8px 22px var(--shadow, rgba(15,27,45,0.08));
}
.os-sec-head[b-phr87n8v33] { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.os-sec-icon[b-phr87n8v33] { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; font-size: 1.25rem; }
.os-icon-blue[b-phr87n8v33] { background: rgba(31,90,138,0.12); }
.os-icon-orange[b-phr87n8v33] { background: rgba(227,106,26,0.14); }
.os-sec-head h2[b-phr87n8v33] { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 1.12rem; color: var(--text, #0F1B2D); margin: 0; }
.os-sec-head p[b-phr87n8v33] { font-size: 0.82rem; color: var(--text-muted, #5A6B82); margin: 2px 0 0; }
.os-sec-total[b-phr87n8v33] { margin-left: auto; font-weight: 800; color: var(--text, #0F1B2D); white-space: nowrap; }

.os-sec-empty[b-phr87n8v33] { font-size: 0.88rem; color: var(--text-muted, #5A6B82); margin: 4px 0 0; line-height: 1.5; }
.os-sec-empty a[b-phr87n8v33] { color: var(--brand-orange-deep, #E36A1A); font-weight: 700; }

.os-lines[b-phr87n8v33] { list-style: none; margin: 0; padding: 0; }
.os-lines li[b-phr87n8v33] { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid var(--border, rgba(15,27,45,0.08)); }
.os-lines li:first-child[b-phr87n8v33] { border-top: none; }
.os-line-name[b-phr87n8v33] { display: flex; flex-direction: column; }
.os-line-title[b-phr87n8v33] { font-weight: 600; color: var(--text, #0F1B2D); font-size: 0.94rem; }
.os-line-meta[b-phr87n8v33] { font-size: 0.78rem; color: var(--text-muted, #5A6B82); }
.os-lines li > .tnum[b-phr87n8v33] { font-weight: 600; color: var(--text, #0F1B2D); white-space: nowrap; }

.os-sub-row[b-phr87n8v33] { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 8px; padding-top: 12px; border-top: 1px dashed var(--border, rgba(15,27,45,0.16)); font-size: 0.86rem; color: var(--text-muted, #5A6B82); }
.os-sub-row .tnum[b-phr87n8v33] { font-weight: 700; color: var(--text, #0F1B2D); }

/* ── Pay panel (sticky on desktop) ──────────────────────────────── */
.os-pay[b-phr87n8v33] { position: sticky; top: 24px; }
.os-pay-card[b-phr87n8v33] {
    background: var(--surface, #fff);
    border: 1px solid var(--border, rgba(15,27,45,0.10));
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 12px 32px var(--shadow, rgba(15,27,45,0.12));
}
.os-pay-card h3[b-phr87n8v33] { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 1.12rem; color: var(--text, #0F1B2D); margin: 0 0 16px; }

.os-pay-row[b-phr87n8v33] { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 7px 0; font-size: 0.9rem; color: var(--text-muted, #5A6B82); }
.os-pay-row em[b-phr87n8v33] { font-style: normal; font-size: 0.78rem; }
.os-pay-row .tnum[b-phr87n8v33] { font-weight: 600; color: var(--text, #0F1B2D); }

.os-pay-total[b-phr87n8v33] {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    margin-top: 10px; padding-top: 14px;
    border-top: 1px solid var(--border, rgba(15,27,45,0.14));
    font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 1.15rem;
    color: var(--text, #0F1B2D);
}

.os-pay-monthly[b-phr87n8v33] {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    margin-top: 12px; padding: 10px 12px;
    background: rgba(227,106,26,0.08);
    border-radius: 10px;
    font-size: 0.88rem; font-weight: 700; color: var(--brand-orange-deep, #E36A1A);
}
.os-pay-monthly em[b-phr87n8v33] { font-style: normal; font-weight: 600; color: var(--text-muted, #5A6B82); }

.os-pay-note[b-phr87n8v33] { font-size: 0.8rem; color: var(--text-muted, #5A6B82); line-height: 1.5; margin: 14px 0 16px; }
.os-pay-note strong[b-phr87n8v33] { color: var(--text, #0F1B2D); }

.os-fygaro[b-phr87n8v33] {
    width: 100%;
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    padding: 14px 18px; font-weight: 800; font-size: 1rem; border-radius: 12px;
}
.os-fygaro:disabled[b-phr87n8v33] { opacity: 0.7; cursor: progress; }
.os-fygaro-glyph[b-phr87n8v33] { font-size: 1.15rem; }
.os-pay-fineprint[b-phr87n8v33] { text-align: center; font-size: 0.76rem; color: var(--text-muted, #5A6B82); margin: 10px 0 0; }

.os-alert[b-phr87n8v33] { margin-bottom: 12px; }

.os-ghost[b-phr87n8v33] {
    border: 1px solid var(--border-strong, var(--border, rgba(15,27,45,0.18)));
    color: var(--text, #2A3A52);
    background: var(--surface, #fff);
    font-weight: 700;
    padding: 12px 20px;
    border-radius: 11px;
}
.os-ghost:hover[b-phr87n8v33] { background: var(--surface-2, #F3F6FA); }

.os-paid-badge[b-phr87n8v33] {
    display: flex; align-items: center; gap: 8px;
    background: rgba(111,174,63,0.16);
    color: var(--text, #0F1B2D);
    border-radius: 10px; padding: 12px 14px; font-weight: 700; font-size: 0.9rem;
    margin-bottom: 12px;
}
.os-paid-link[b-phr87n8v33] { width: 100%; display: block; text-align: center; }

/* Bank transfer, offered beside the card button while the Ministry deposit window is open
   (#506). Deliberately the quieter of the two: card settles the whole basket instantly, bank
   covers the exam fees only and needs a verification step. */
.os-pay-alt[b-phr87n8v33] { margin-top: 12px; }
.os-pay-or[b-phr87n8v33] {
    display: block; text-align: center; margin: 0 0 10px;
    font-size: 0.76rem; font-weight: 700; letter-spacing: 0.06em;
    text-transform: uppercase; color: var(--text-muted, #5A6B82);
}
.os-pay-bank[b-phr87n8v33] {
    width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px;
    text-align: center; text-decoration: none;
}

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 880px) {
    .os-grid[b-phr87n8v33] { grid-template-columns: 1fr; }
    .os-pay[b-phr87n8v33] { position: static; }
}
@media (max-width: 520px) {
    .os-main[b-phr87n8v33] { padding: 24px 16px 56px; }
    .os-card[b-phr87n8v33], .os-pay-card[b-phr87n8v33] { padding: 18px 16px; }
    .os-empty-actions[b-phr87n8v33] { flex-direction: column; }
}

/* ── Remove a book from the order (#479) ────────────────────────────────────
   Books are the only optional line here, and the only way to drop one used to be
   leaving the checkout for /shop. Deliberately quiet: it sits after the price,
   grows into a red affordance on hover/focus, and is never rendered once the
   registration is paid — at that point the line is a record, not a basket. */
.os-line-remove[b-phr87n8v33] {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    font: inherit;
    font-size: 0.8rem;
    line-height: 1;
    color: var(--text-muted, #5A6B82);
    background: transparent;
    border: 1px solid transparent;
    border-radius: 7px;
    cursor: pointer;
    transition: color .14s ease, background .14s ease, border-color .14s ease;
}

.os-line-remove:hover:not(:disabled)[b-phr87n8v33],
.os-line-remove:focus-visible[b-phr87n8v33] {
    color: #B5322F;
    background: rgba(210, 69, 69, 0.10);
    border-color: rgba(210, 69, 69, 0.35);
}

.os-line-remove:focus-visible[b-phr87n8v33] { outline: 2px solid #B5322F; outline-offset: 1px; }

/* Mid-remove, and while a payment is being set up — the cart must not move under a
   checkout that is already quoting a total. */
.os-line-remove:disabled[b-phr87n8v33] { opacity: .45; cursor: default; }

html[data-theme="dark"] .os-line-remove:hover:not(:disabled)[b-phr87n8v33],
html[data-theme="dark"] .os-line-remove:focus-visible[b-phr87n8v33] {
    color: #F0918E;
    background: rgba(210, 69, 69, 0.20);
    border-color: rgba(210, 69, 69, 0.45);
}
/* /Components/Pages/OurStory.razor.rz.scp.css */
/* ── Sections ─────────────────────────────────────────────────── */
.os-section[b-0f7jzwgaro] { max-width: 1080px; margin: 0 auto; padding: 64px 24px 0; }
.os-section-head[b-0f7jzwgaro] { margin-bottom: 28px; }
.os-section-eyebrow[b-0f7jzwgaro] { color: var(--brand-orange-text, #B4530A); text-transform: uppercase; letter-spacing: 0.12em; font-size: 0.78rem; font-weight: 700; }
.os-section-head h2[b-0f7jzwgaro] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: clamp(1.5rem, 3vw, 2.2rem);
    color: var(--ink-900);
    margin: 8px 0 0;
}
.os-section-sub[b-0f7jzwgaro] { color: var(--ink-500); margin-top: 10px; max-width: 620px; }

/* ── Intro ────────────────────────────────────────────────────── */
.os-intro-grid[b-0f7jzwgaro] { display: grid; grid-template-columns: 1.2fr 1fr; gap: 32px; align-items: center; }
.os-intro-copy p[b-0f7jzwgaro] { font-size: 1.12rem; line-height: 1.6; color: var(--ink-700); margin: 0; }
.os-intro-tile[b-0f7jzwgaro] {
    position: relative;
    overflow: hidden;
    min-height: 200px;
    border-radius: 20px;
    background: linear-gradient(135deg, #F39125 0%, #E36A1A 35%, #1F5A8A 100%);
    display: grid;
    place-items: center;
    box-shadow: 0 16px 40px rgba(31, 90, 138, 0.22);
}
.os-intro-diamond[b-0f7jzwgaro] {
    position: absolute;
    top: 20px; right: 20px;
    width: 80px; height: 80px;
    opacity: 0.3;
    background: #fff;
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}
.os-intro-logo[b-0f7jzwgaro] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: clamp(1.4rem, 3vw, 2rem);
    color: #fff;
    letter-spacing: -0.01em;
}

/* ── How it all began ─────────────────────────────────────────── */
.os-began-copy[b-0f7jzwgaro] { max-width: 900px; }
.os-began-copy p[b-0f7jzwgaro] { font-size: 0.98rem; line-height: 1.7; color: var(--ink-700); margin: 0 0 16px; }

/* ── Principles (nested in How it all began) ──────────────────── */
.os-principle-grid[b-0f7jzwgaro] { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 24px; }

/* Closing paragraph after the two principle cards ("what Early means"). Same measure and rhythm as
   .os-began-copy above it; the extra top margin separates it from the cards. */
.os-began-close[b-0f7jzwgaro] { margin-top: 24px; }
.os-began-close strong[b-0f7jzwgaro] { color: var(--ink-900); font-weight: 700; }
.os-principle[b-0f7jzwgaro] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-left: 4px solid #F39125;
    border-radius: 14px;
    padding: 22px;
}
.os-principle-head[b-0f7jzwgaro] { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.os-principle-icon[b-0f7jzwgaro] { font-size: 1.25rem; line-height: 1; }
.os-principle h3[b-0f7jzwgaro] { font-size: 1.12rem; font-weight: 800; color: var(--ink-900); margin: 0; }
.os-principle p[b-0f7jzwgaro] { font-size: 0.9rem; color: var(--ink-700); line-height: 1.55; margin: 0; }

/* ── Faculties ────────────────────────────────────────────────── */
.os-faculty-grid[b-0f7jzwgaro] { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.os-faculty-card[b-0f7jzwgaro] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 1px 2px var(--shadow);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.os-faculty-card:hover[b-0f7jzwgaro] { transform: translateY(-3px); box-shadow: 0 12px 28px var(--shadow); }
.os-faculty-icon[b-0f7jzwgaro] {
    display: inline-grid;
    place-items: center;
    width: 50px; height: 50px;
    border-radius: 13px;
    background: rgba(243, 145, 37, 0.13);
    color: var(--brand-orange-text, #B4530A);
    font-size: 1.4rem;
    margin-bottom: 14px;
}
.os-faculty-card h3[b-0f7jzwgaro] { font-size: 1.12rem; font-weight: 700; color: var(--ink-900); margin: 0 0 8px; }
.os-faculty-card p[b-0f7jzwgaro] { font-size: 0.9rem; line-height: 1.55; color: var(--ink-700); margin: 0; }

/* ── Mission ──────────────────────────────────────────────────── */
.os-mission-statement[b-0f7jzwgaro] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-size: clamp(1.12rem, 2.2vw, 1.4rem);
    line-height: 1.5;
    font-weight: 600;
    color: var(--ink-900);
    margin: 8px 0 28px;
    max-width: 760px;
}
.os-mission-close[b-0f7jzwgaro] { font-size: 1.02rem; color: var(--ink-700); max-width: 680px; margin: 0; }

/* ── Reasons ──────────────────────────────────────────────────── */
/* Last section on the page: sections only pad top (64px), so give this one
   the same 64px at the bottom so it doesn't sit flush against the footer. */
.os-reasons[b-0f7jzwgaro] { padding-bottom: 64px; }
.os-reason-grid[b-0f7jzwgaro] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.os-reason-card[b-0f7jzwgaro] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 24px;
}
.os-reason-icon[b-0f7jzwgaro] {
    display: inline-grid;
    place-items: center;
    width: 44px; height: 44px;
    border-radius: 10px;
    background: rgba(243, 145, 37, 0.13);
    color: var(--brand-orange-text, #B4530A);
    font-size: 1.25rem;
    margin-bottom: 14px;
}
.os-reason-card h3[b-0f7jzwgaro] { font-size: 1.05rem; font-weight: 700; color: var(--ink-900); margin: 0 0 8px; }
.os-reason-card p[b-0f7jzwgaro] { font-size: 0.9rem; line-height: 1.55; color: var(--ink-700); margin: 0; }

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width: 900px) {
    .os-reason-grid[b-0f7jzwgaro] { grid-template-columns: 1fr; }
    .os-intro-grid[b-0f7jzwgaro] { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
    .os-faculty-grid[b-0f7jzwgaro] { grid-template-columns: 1fr; }
    .os-principle-grid[b-0f7jzwgaro] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Partnerships.razor.rz.scp.css */
/* Partnership Guidelines. A governance document, so it reads as one: a single measured column,
   clauses numbered with the source's own numbering, and no marketing furniture. Shared tokens only,
   so both themes work without a second palette. */

.pt-body[b-39hwa6wryk] {
    max-width: 860px;
    margin: 0 auto;
    padding: 48px 24px 88px;
}

/* ── Purpose ─────────────────────────────────────────────────────── */
.pt-intro[b-39hwa6wryk] { padding-bottom: 32px; border-bottom: 1px solid var(--border); }

.pt-intro-h[b-39hwa6wryk] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: 1.05rem;
    text-transform: uppercase;
    letter-spacing: .09em;
    color: var(--ink-500);
    margin: 0 0 16px;
}

.pt-intro p[b-39hwa6wryk] { color: var(--ink-700); line-height: 1.74; margin: 0 0 14px; }
.pt-intro p:last-child[b-39hwa6wryk] { margin-bottom: 0; }
.pt-lead[b-39hwa6wryk] { font-size: 1.08rem; color: var(--ink-900) !important; font-weight: 500; }

/* ── Sections ────────────────────────────────────────────────────── */
.pt-section[b-39hwa6wryk] { margin-top: 52px; }

.pt-section-h[b-39hwa6wryk] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: clamp(1.35rem, 3vw, 1.7rem);
    color: var(--ink-900);
    letter-spacing: -.015em;
    margin: 0 0 10px;
}

.pt-section-intro[b-39hwa6wryk] { color: var(--ink-700); line-height: 1.72; margin: 0 0 28px; }

/* ── Clauses ─────────────────────────────────────────────────────── */
/* The counter is the document's own clause numbering — a partner can cite "Financial Arrangements 4"
   — so it is generated from the list rather than typed into each heading, where the two could drift
   apart the moment a clause is inserted. */
.pt-clauses[b-39hwa6wryk] {
    list-style: none;
    counter-reset: pt-clause;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 14px;
}

.pt-clause[b-39hwa6wryk] {
    counter-increment: pt-clause;
    position: relative;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 22px 26px 22px 68px;
    box-shadow: 0 1px 2px var(--shadow);
}

.pt-clause[b-39hwa6wryk]::before {
    content: counter(pt-clause);
    position: absolute;
    left: 22px;
    top: 22px;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: var(--brand-blue);
    color: #fff;
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: .86rem;
    font-variant-numeric: tabular-nums;
}

.pt-clause h3[b-39hwa6wryk] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: 1.06rem;
    color: var(--ink-900);
    letter-spacing: -.01em;
    margin: 0 0 8px;
    /* Clears the badge's optical line so the title sits level with it. */
    padding-top: 3px;
}

.pt-clause p[b-39hwa6wryk] { color: var(--ink-700); line-height: 1.7; font-size: .95rem; margin: 0; }

.pt-sublist[b-39hwa6wryk] {
    margin: 12px 0 0;
    padding-left: 20px;
    color: var(--ink-700);
    font-size: .95rem;
    line-height: 1.7;
}

.pt-sublist li[b-39hwa6wryk] { margin-bottom: 4px; }
.pt-sublist li:last-child[b-39hwa6wryk] { margin-bottom: 0; }

/* ── Enquiry ─────────────────────────────────────────────────────── */
.pt-cta[b-39hwa6wryk] {
    margin-top: 56px;
    padding: 34px 32px;
    border-radius: 16px;
    background: linear-gradient(120deg, var(--brand-blue-deep, #163E63), var(--brand-blue, #1F5A8A));
    color: #fff;
    box-shadow: 0 16px 40px rgba(22, 62, 99, 0.2);
    text-align: center;
}

.pt-cta h2[b-39hwa6wryk] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: clamp(1.2rem, 2.8vw, 1.5rem);
    margin: 0 0 10px;
    letter-spacing: -.015em;
}

.pt-cta p[b-39hwa6wryk] {
    color: rgba(255, 255, 255, 0.88);
    line-height: 1.68;
    max-width: 52ch;
    margin: 0 auto 22px;
    font-size: .96rem;
}

@media (max-width: 700px) {
    .pt-clause[b-39hwa6wryk] { padding: 20px 20px 20px 20px; }
    /* At this width the inset badge eats the text column, so it sits above the title instead. */
    .pt-clause[b-39hwa6wryk]::before { position: static; margin-bottom: 12px; }
    .pt-clause h3[b-39hwa6wryk] { padding-top: 0; }
    .pt-cta[b-39hwa6wryk] { padding: 28px 22px; }
}
/* /Components/Pages/PastPapers.razor.rz.scp.css */
/* ── Body ─────────────────────────────────────────────────────── */
.pp-body[b-jpfyyaujev] { max-width: 1240px; margin: 0 auto; padding: 40px 24px 24px; }

/* ── Level filter pills (mirrors the /courses .cc-chip pattern) ─ */
.pp-filters[b-jpfyyaujev] { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 28px; }
.pp-filter[b-jpfyyaujev] {
    font-family: inherit;
    font-size: 0.85rem; font-weight: 600;
    padding: 8px 16px; border-radius: 999px;
    border: 1px solid var(--border);
    color: var(--ink-700); background: var(--surface);
    cursor: pointer; user-select: none;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}
.pp-filter:hover[b-jpfyyaujev] { border-color: var(--brand-blue); color: var(--brand-blue); }
.pp-filter.is-active[b-jpfyyaujev] { background: var(--brand-blue); border-color: var(--brand-blue); color: #fff; }
.pp-filter.is-active:hover[b-jpfyyaujev] { color: #fff; }

/* ── Hub grid (mirrors the shop grid: 4 → 3 → 2 → 1) ─────────── */
.pp-grid[b-jpfyyaujev] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 0; }

.pp-card[b-jpfyyaujev] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 20px;
    box-shadow: 0 8px 22px var(--shadow);
    display: flex;
    flex-direction: column;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.pp-card:hover[b-jpfyyaujev] { transform: translateY(-3px); box-shadow: 0 16px 34px var(--shadow); }

.pp-card-top[b-jpfyyaujev] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.pp-icon[b-jpfyyaujev] {
    width: 46px; height: 46px;
    border-radius: 12px;
    display: grid; place-items: center;
    font-size: 1.25rem;
    color: #fff;
}
.pp-arrow[b-jpfyyaujev] { color: var(--brand-orange-deep); font-size: 1.2rem; font-weight: 800; transition: transform 0.15s ease; }
.pp-card:hover .pp-arrow[b-jpfyyaujev] { transform: translateX(4px); }

.pp-card h3[b-jpfyyaujev] { font-size: 1.05rem; font-weight: 700; margin: 0 0 6px; color: var(--ink-900); }
.pp-card-meta[b-jpfyyaujev] { font-size: 0.8rem; font-weight: 600; color: var(--brand-blue); margin-bottom: 10px; }
.pp-card-line[b-jpfyyaujev] { font-size: 0.82rem; color: var(--ink-500); flex: 1; margin: 0 0 14px; }
/* #373: the honest empty state for a subject with nothing published yet. */
.pp-card-line-muted[b-jpfyyaujev] { font-style: italic; opacity: 0.75; }
.pp-chip[b-jpfyyaujev] {
    align-self: flex-start;
    background: rgba(243, 145, 37, 0.12);
    color: var(--brand-orange-deep);
    font-size: 0.76rem;
    font-weight: 700;
    padding: 5px 12px;
    border-radius: 999px;
}

/* ── Subject year list ────────────────────────────────────────── */
.pp-years[b-jpfyyaujev] { display: flex; flex-direction: column; gap: 14px; margin-top: 0; }

.pp-year-card[b-jpfyyaujev] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 20px 24px;
    box-shadow: 0 4px 14px var(--shadow);
    display: flex;
    align-items: center;
    gap: 22px;
}
.pp-year-num[b-jpfyyaujev] {
    font-size: 2rem;
    font-weight: 800;
    color: var(--brand-orange-deep);
    line-height: 1;
    min-width: 72px;
}
.pp-year-main[b-jpfyyaujev] { flex: 1; min-width: 0; }
.pp-year-main h3[b-jpfyyaujev] { font-size: 1.02rem; font-weight: 700; margin: 0 0 6px; color: var(--ink-900); }
.pp-year-sub[b-jpfyyaujev] { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 0.84rem; color: var(--ink-500); }
.pp-sol[b-jpfyyaujev] { color: #4E7D24; font-weight: 600; }

.pp-year-foot[b-jpfyyaujev] { display: flex; align-items: center; gap: 14px; }
.pp-free[b-jpfyyaujev] {
    background: rgba(63, 115, 33, 0.14);
    color: #3F7321;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 5px 11px;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.pp-download[b-jpfyyaujev] {
    border: 1px solid var(--brand-blue);
    color: var(--brand-blue);
    font-weight: 700;
    padding: 9px 18px;
    border-radius: 10px;
    white-space: nowrap;
}
.pp-download:hover[b-jpfyyaujev] { background: var(--brand-blue); color: #fff; }

.pp-foot-note[b-jpfyyaujev] { text-align: center; color: var(--ink-500); font-size: 0.9rem; margin: 32px 0 0; }
.pp-foot-note a[b-jpfyyaujev] { color: var(--brand-blue); font-weight: 600; }

/* ── Empty state ──────────────────────────────────────────────── */
.pp-empty[b-jpfyyaujev] {
    background: var(--paper-warm);
    border: 1px dashed var(--border);
    border-radius: 20px;
    padding: 56px 28px;
    text-align: center;
    margin-top: 0;
}
.pp-empty-icon[b-jpfyyaujev] { font-size: 2.4rem; display: block; margin-bottom: 12px; }
.pp-empty h2[b-jpfyyaujev] { font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif; font-weight: 800; font-size: 1.4rem; color: var(--ink-900); margin: 0 0 8px; }
.pp-empty p[b-jpfyyaujev] { color: var(--ink-500); max-width: 460px; margin: 0 auto 22px; }
.pp-empty-actions[b-jpfyyaujev] { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px; }
.pp-empty-cta[b-jpfyyaujev] { padding: 11px 22px; border-radius: 10px; }
.pp-empty-link[b-jpfyyaujev] { color: var(--brand-blue); font-weight: 600; font-size: 0.92rem; }
.pp-empty-link:hover[b-jpfyyaujev] { color: var(--brand-orange-deep); }

/* ── Missing-paper CTA + community upload (#397) ─────────────── */
.pp-missing[b-jpfyyaujev] {
    margin-top: 28px;
    background: var(--paper-warm);
    border: 1px dashed var(--border);
    border-radius: 16px;
    padding: 22px 24px;
    text-align: left;
}
/* Embedded inside the dashed zero-paper empty state: blend as an inner card. */
.pp-missing-embedded[b-jpfyyaujev] {
    background: var(--surface);
    border-style: solid;
    max-width: 640px;
    margin: 28px auto 0;
}

.pp-missing-head[b-jpfyyaujev] { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.pp-missing-icon[b-jpfyyaujev] { font-size: 1.7rem; line-height: 1; }
.pp-missing-copy[b-jpfyyaujev] { flex: 1; min-width: 240px; }
.pp-missing-copy h3[b-jpfyyaujev] { font-size: 1.02rem; font-weight: 700; margin: 0 0 4px; color: var(--ink-900); }
.pp-missing-copy p[b-jpfyyaujev] { font-size: 0.86rem; color: var(--ink-500); margin: 0; }

.pp-missing-btn[b-jpfyyaujev] {
    border: 1px solid var(--brand-orange-deep);
    color: var(--brand-orange-deep);
    background: transparent;
    font-weight: 700;
    padding: 9px 18px;
    border-radius: 10px;
    white-space: nowrap;
}
.pp-missing-btn:hover[b-jpfyyaujev] { background: var(--brand-orange-deep); color: #fff; }

.pp-upload[b-jpfyyaujev] {
    margin-top: 18px;
    border-top: 1px solid var(--border);
    padding-top: 18px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.pp-upload-row[b-jpfyyaujev] { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.pp-upload-field[b-jpfyyaujev] { display: flex; flex-direction: column; gap: 4px; }
.pp-upload-label[b-jpfyyaujev] { font-size: 0.8rem; font-weight: 600; color: var(--ink-700); }
.pp-upload-opt[b-jpfyyaujev] { font-weight: 400; color: var(--ink-500); }

/* Dropzone (mirrors the Careers CV dropzone) */
.pp-dropzone[b-jpfyyaujev] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    text-align: center;
    border: 2px dashed rgba(31, 90, 138, 0.35);
    border-radius: 12px;
    padding: 22px 16px;
    background: rgba(31, 90, 138, 0.04);
    cursor: pointer;
}
.pp-dropzone:hover[b-jpfyyaujev] { border-color: var(--brand-blue, #1F5A8A); background: rgba(31, 90, 138, 0.07); }
.pp-dropzone.has-file[b-jpfyyaujev] { border-style: solid; border-color: #6FAE3F; background: rgba(111, 174, 63, 0.08); }
.pp-dropzone-icon[b-jpfyyaujev] { display: inline-flex; color: var(--ink-500); }
.pp-dropzone-icon[b-jpfyyaujev]  .mud-icon-root { font-size: 1.5rem; }
.pp-dropzone.has-file .pp-dropzone-icon[b-jpfyyaujev] { color: #6FAE3F; }
.pp-dropzone strong[b-jpfyyaujev] { font-size: 0.92rem; color: var(--ink-900); word-break: break-word; }
.pp-dropzone-hint[b-jpfyyaujev] { font-size: 0.76rem; color: var(--ink-500); }

.pp-upload-error[b-jpfyyaujev] { color: #D24545; font-size: 0.85rem; font-weight: 600; margin: 0; }

.pp-upload-submit[b-jpfyyaujev] {
    align-self: flex-start;
    background: var(--brand-orange-deep, #E36A1A);
    color: #fff;
    font-weight: 700;
    border: none;
    padding: 11px 22px;
    border-radius: 10px;
}
.pp-upload-submit:hover[b-jpfyyaujev] { filter: brightness(1.05); color: #fff; }
.pp-upload-submit:disabled[b-jpfyyaujev] { opacity: 0.6; }

@media (max-width: 1200px) {
    .pp-grid[b-jpfyyaujev] { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
    .pp-grid[b-jpfyyaujev] { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .pp-grid[b-jpfyyaujev] { grid-template-columns: 1fr; margin-top: 0; }
}
@media (max-width: 620px) {
    .pp-year-card[b-jpfyyaujev] { flex-wrap: wrap; gap: 12px; }
    .pp-year-num[b-jpfyyaujev] { min-width: 0; font-size: 1.6rem; }
    .pp-year-foot[b-jpfyyaujev] { width: 100%; justify-content: space-between; }
}
@media (max-width: 520px) {
    .pp-upload-row[b-jpfyyaujev] { grid-template-columns: 1fr; }
}
/* /Components/Pages/PayClass.razor.rz.scp.css */
.pc-body[b-t75x2qzvzi] { max-width: 640px; margin: 0 auto; padding: 40px 24px 64px; }

.pc-card[b-t75x2qzvzi] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-top: 4px solid #F39125;
    border-radius: 18px;
    padding: 30px;
    box-shadow: 0 12px 30px var(--shadow);
}

.pc-card-head[b-t75x2qzvzi] { margin-bottom: 22px; }
.pc-card-head h2[b-t75x2qzvzi] { font-size: 1.4rem; font-weight: 800; margin: 0 0 6px; color: var(--ink-900); }
.pc-card-head p[b-t75x2qzvzi] { margin: 0; font-size: 0.92rem; color: var(--ink-500); }

/* ── Invoice lines ────────────────────────────────────────────── */
.pc-lines[b-t75x2qzvzi] {
    background: rgba(31, 90, 138, 0.06);
    border: 1px solid rgba(31, 90, 138, 0.18);
    border-radius: 14px;
    padding: 6px 18px;
    margin-bottom: 18px;
}
.pc-line[b-t75x2qzvzi] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    padding: 11px 0;
    border-bottom: 1px solid rgba(31, 90, 138, 0.12);
}
.pc-line:last-child[b-t75x2qzvzi] { border-bottom: none; }
.pc-line-name[b-t75x2qzvzi] { color: var(--ink-700); font-size: 0.92rem; min-width: 0; }
.pc-line-amount[b-t75x2qzvzi] { color: var(--ink-700); font-size: 0.92rem; white-space: nowrap; }
.pc-line-total[b-t75x2qzvzi] { font-weight: 800; }
.pc-line-total span:first-child[b-t75x2qzvzi] { color: var(--ink-900); font-size: 0.95rem; }
.pc-line-total span:last-child[b-t75x2qzvzi] { color: var(--brand-orange-deep); font-size: 1.15rem; white-space: nowrap; }

.pc-error[b-t75x2qzvzi] {
    background: rgba(214, 69, 47, 0.08);
    border: 1px solid rgba(214, 69, 47, 0.28);
    color: #B23A22;
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 0.88rem;
    margin-bottom: 16px;
}

.pc-submit[b-t75x2qzvzi] { width: 100%; padding: 13px 22px; border-radius: 10px; font-weight: 700; }
.pc-submit:disabled[b-t75x2qzvzi] { opacity: 0.7; cursor: progress; }

.pc-foot-note[b-t75x2qzvzi] { text-align: center; color: var(--ink-500); font-size: 0.85rem; margin: 20px 0 0; }

[b-t75x2qzvzi] .pc-alert { margin-bottom: 16px; }

/* ── Status states (not found / paid / cancelled / loading) ───── */
.pc-state[b-t75x2qzvzi] { text-align: center; }
.pc-state-icon[b-t75x2qzvzi] {
    width: 74px; height: 74px;
    margin: 4px auto 18px;
    border-radius: 50%;
    background: rgba(31, 90, 138, 0.1);
    display: grid; place-items: center;
    font-size: 2rem;
}
.pc-state-check[b-t75x2qzvzi] {
    width: 74px; height: 74px;
    margin: 4px auto 18px;
    border-radius: 50%;
    background: rgba(111, 174, 63, 0.16);
    color: #4E7D24;
    display: grid; place-items: center;
    font-size: 2.2rem; font-weight: 800;
}
.pc-state h2[b-t75x2qzvzi] { font-size: 1.5rem; font-weight: 800; margin: 0 0 10px; color: var(--ink-900); }
.pc-state-lead[b-t75x2qzvzi] { color: var(--ink-700); font-size: 0.98rem; max-width: 480px; margin: 0 auto; line-height: 1.5; }

.pc-state-actions[b-t75x2qzvzi] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-width: 360px;
    margin: 24px auto 0;
}
.pc-action[b-t75x2qzvzi] { padding: 12px 22px; border-radius: 10px; font-weight: 700; }
.pc-alt-btn[b-t75x2qzvzi] {
    padding: 11px 22px;
    border-radius: 10px;
    font-weight: 700;
    font-size: 0.95rem;
    text-align: center;
    text-decoration: none;
    background: var(--surface);
    color: var(--brand-orange-deep);
    border: 1.5px solid var(--brand-orange);
    transition: background 0.15s ease, color 0.15s ease;
}
.pc-alt-btn:hover[b-t75x2qzvzi] { background: var(--brand-orange); color: #fff; }

@media (max-width: 600px) {
    .pc-card[b-t75x2qzvzi] { padding: 24px 20px; }
}
/* /Components/Pages/Payment.razor.rz.scp.css */

/* Quote lines inside the deposit breakdown — the payer must be able to add them up to the total
   they are about to carry into a bank. */
.pay-quote-lines[b-z13j4uhucg] { list-style: none; margin: 8px 0; padding: 0; }
.pay-quote-lines li[b-z13j4uhucg] { display: flex; justify-content: space-between; gap: 12px; padding: 2px 0; font-size: .85rem; }
/* /Components/Pages/Shop.razor.rz.scp.css */
/* ── Body ─────────────────────────────────────────────────────── */
.shop-body[b-zancha86s7] { max-width: 1240px; margin: 0 auto; padding: 48px 24px 24px; }

/* ── Level filter pills (mirrors the /courses .cc-chip pattern) ─ */
.shop-levels[b-zancha86s7] { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.shop-level[b-zancha86s7] {
    font-family: inherit;
    font-size: 0.85rem; font-weight: 600;
    padding: 8px 16px; border-radius: 999px;
    border: 1px solid var(--border);
    color: var(--ink-700); background: var(--surface);
    cursor: pointer; user-select: none;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
    white-space: nowrap;
}
.shop-level:hover[b-zancha86s7] { border-color: var(--brand-blue); color: var(--brand-blue); }
.shop-level.is-active[b-zancha86s7] { background: var(--brand-blue); border-color: var(--brand-blue); color: #fff; }
.shop-level.is-active:hover[b-zancha86s7] { color: #fff; }

/* ── Controls: chip row + search ──────────────────────────────── */
.shop-controls[b-zancha86s7] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 28px;
}
.shop-chips[b-zancha86s7] { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; flex: 1; }
.shop-chip[b-zancha86s7] {
    font-family: inherit;
    font-size: 0.84rem;
    font-weight: 700;
    padding: 7px 16px;
    border-radius: 999px;
    cursor: pointer;
    background: var(--surface);
    color: var(--ink-700);
    border: 1px solid var(--border-strong);
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
    white-space: nowrap;
}
.shop-chip:hover[b-zancha86s7] { border-color: var(--brand-orange); color: var(--brand-orange-text, #B4530A); }
.shop-chip.is-active[b-zancha86s7] {
    background: var(--brand-orange);
    border-color: var(--brand-orange);
    color: #fff;
}
.shop-chip.is-active:hover[b-zancha86s7] { background: var(--brand-orange-deep); border-color: var(--brand-orange-text, #B4530A); color: #fff; }

.shop-search[b-zancha86s7] {
    position: relative;
    flex: 0 0 auto;
    width: 240px;
    max-width: 100%;
}
.shop-search-icon[b-zancha86s7] {
    position: absolute;
    left: 12px; top: 50%;
    transform: translateY(-50%);
    font-size: 0.85rem;
    opacity: 0.6;
    pointer-events: none;
}
.shop-search-input[b-zancha86s7] {
    width: 100%;
    font-family: inherit;
    font-size: 0.9rem;
    color: var(--ink-900);
    background: var(--surface);
    border: 1px solid var(--border-strong);
    border-radius: 10px;
    padding: 9px 14px 9px 34px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.shop-search-input[b-zancha86s7]::placeholder { color: var(--ink-500); }
.shop-search-input:focus[b-zancha86s7] {
    outline: 2px solid var(--brand-blue, #1F5A8A); outline-offset: 1px; /* 2.4.7: outline:none left only an 18%-alpha glow */
    border-color: var(--brand-orange);
    box-shadow: 0 0 0 3px rgba(243, 145, 37, 0.18);
}

.shop-grid[b-zancha86s7] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }

/* ── No-results state (filter/search) ─────────────────────────── */
.shop-noresults[b-zancha86s7] {
    text-align: center;
    max-width: 460px;
    margin: 24px auto 48px;
    padding: 40px 28px;
    background: var(--paper-warm);
    border-radius: 18px;
}
.shop-noresults-icon[b-zancha86s7] { font-size: 2.2rem; display: block; margin-bottom: 12px; }
.shop-noresults p[b-zancha86s7] { color: var(--ink-700); font-size: 0.95rem; margin: 0; }

/* ── Card ─────────────────────────────────────────────────────── */
.shop-card[b-zancha86s7] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 1px 2px var(--shadow);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
    display: flex;
    flex-direction: column;
}
.shop-card:hover[b-zancha86s7] { transform: translateY(-3px); box-shadow: 0 14px 30px var(--shadow); }

.shop-tile[b-zancha86s7] {
    position: relative;
    aspect-ratio: 4 / 3;
    background: linear-gradient(135deg, var(--brand-orange) 0%, var(--brand-blue-deep) 100%);
    display: grid;
    place-items: center;
}
.shop-tile-icon[b-zancha86s7] { font-size: 2.8rem; color: rgba(255, 255, 255, 0.85); filter: drop-shadow(0 2px 6px rgba(15, 27, 45, 0.25)); }
/* Admin-uploaded cover replaces the gradient tile; the gradient+glyph stays as the standard filler. */
.shop-tile-cover[b-zancha86s7] { background: var(--surface-2); }
.shop-cover[b-zancha86s7] { width: 100%; height: 100%; object-fit: cover; display: block; }
.shop-tag[b-zancha86s7] {
    position: absolute;
    top: 12px; left: 12px;
    background: rgba(255, 255, 255, 0.92);
    color: var(--brand-orange-text, #B4530A);
    font-size: 0.66rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 4px 9px;
    border-radius: 999px;
}

.shop-card-body[b-zancha86s7] { padding: 14px 16px 16px; display: flex; flex-direction: column; flex: 1; }
.shop-cat[b-zancha86s7] { font-size: 0.66rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--brand-blue); }
.shop-title[b-zancha86s7] { font-size: 0.98rem; font-weight: 700; color: var(--ink-900); margin: 5px 0 7px; line-height: 1.3; }
.shop-desc[b-zancha86s7] { font-size: 0.82rem; color: var(--ink-700); margin: 0 0 14px; flex: 1; line-height: 1.45; }

.shop-card-foot[b-zancha86s7] { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: auto; }
.shop-price[b-zancha86s7] { font-size: 1.08rem; font-weight: 800; color: var(--brand-orange-text, #B4530A); }
.shop-buy[b-zancha86s7] { padding: 8px 13px; border-radius: 10px; font-size: 0.84rem; white-space: nowrap; }

/* ── Empty state ──────────────────────────────────────────────── */
.shop-empty[b-zancha86s7] {
    text-align: center;
    max-width: 460px;
    margin: 32px auto 48px;
    padding: 48px 28px;
    background: var(--paper-warm);
    border-radius: 18px;
}
.shop-empty-icon[b-zancha86s7] { font-size: 2.6rem; display: block; margin-bottom: 14px; }
.shop-empty h2[b-zancha86s7] { font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif; font-weight: 800; font-size: 1.4rem; color: var(--ink-900); margin: 0 0 10px; }
.shop-empty p[b-zancha86s7] { color: var(--ink-700); font-size: 0.95rem; margin: 0 0 22px; }
.shop-empty-cta[b-zancha86s7] { padding: 11px 22px; border-radius: 10px; }

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width: 1200px) {
    .shop-grid[b-zancha86s7] { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
    .shop-grid[b-zancha86s7] { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px) {
    .shop-controls[b-zancha86s7] { flex-direction: column; align-items: stretch; }
    .shop-chips[b-zancha86s7] { flex: 1 1 auto; }
    .shop-search[b-zancha86s7] { width: 100%; }
}
@media (max-width: 600px) {
    .shop-grid[b-zancha86s7] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Student/Classes.razor.rz.scp.css */
/* E3 — Student Live Classroom. Student accent #1F5A8A on the dark portal chrome. */

/* Full viewport width with the 28px portal gutter — matches Dashboard/Registration
   (no max-width; the StudentFrame owns the canvas). */
.e2c-classroom[b-ekhsvt8d2p] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 28px;
}

@media (max-width: 820px) {
    .e2c-classroom[b-ekhsvt8d2p] { padding: 16px; }
}

/* ── Generic card (mirrors shared portal card styling) ───────────────────── */
[b-ekhsvt8d2p] .e2c-card {
    border-radius: 14px;
    border: 1px solid var(--border);
    background: var(--surface);
    padding: 20px;
    color: var(--text);
}

.e2c-card-head[b-ekhsvt8d2p] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.e2c-card-title[b-ekhsvt8d2p] {
    font-size: 16px;
    font-weight: 800;
    color: var(--text);
    margin: 0;
}

.e2c-card-sub[b-ekhsvt8d2p] {
    font-size: 13px;
    color: var(--text-muted);
    margin: 2px 0 0;
}

/* ── Empty / onboarding states ───────────────────────────────────────────── */
.e2c-empty[b-ekhsvt8d2p] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 6px;
    padding: 36px 20px;
}

.e2c-empty-glyph[b-ekhsvt8d2p] { font-size: 34px; }

.e2c-empty-title[b-ekhsvt8d2p] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text);
    margin: 4px 0 0;
}

.e2c-empty-sub[b-ekhsvt8d2p] {
    font-size: 13px;
    color: var(--text-muted);
    max-width: 440px;
    margin: 0;
    line-height: 1.5;
}

/* ── Primary CTA button (links) ──────────────────────────────────────────── */
.e2c-cta-primary[b-ekhsvt8d2p] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    padding: 9px 18px;
    border-radius: 9px;
    background: #1F5A8A;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
}

.e2c-cta-primary:hover[b-ekhsvt8d2p] { background: #18496f; }

/* ── Overdue banner ──────────────────────────────────────────────────────── */
.e2c-overdue-banner[b-ekhsvt8d2p] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 18px;
    border-radius: 12px;
    background: rgba(210, 69, 69, .12);
    border: 1.5px solid rgba(210, 69, 69, .5);
}

.e2c-overdue-icon[b-ekhsvt8d2p] { font-size: 22px; }
.e2c-overdue-body[b-ekhsvt8d2p] { flex: 1; }

.e2c-overdue-title[b-ekhsvt8d2p] {
    font-size: 14px;
    font-weight: 800;
    color: #9D2828;
    margin: 0;
}

.e2c-overdue-sub[b-ekhsvt8d2p] {
    font-size: 13px;
    color: #9D2828;
    opacity: .9;
    margin: 2px 0 0;
}

/* WCAG 1.4.3 — dark-red on the dark overdue tint is ~1.6:1; lift to light red on dark. */
html[data-theme="dark"] .e2c-overdue-title[b-ekhsvt8d2p],
html[data-theme="dark"] .e2c-overdue-sub[b-ekhsvt8d2p] { color: #F3A6A6; opacity: 1; }

.e2c-overdue-cta[b-ekhsvt8d2p] {
    flex: none;
    padding: 9px 18px;
    border-radius: 9px;
    background: #D24545;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
}

.e2c-overdue-cta:hover[b-ekhsvt8d2p] { background: #b93a3a; }

/* ── Classroom layout ────────────────────────────────────────────────────
   Was a 2fr/1fr grid: a fake 16:9 video stage beside a class chat. Both are
   gone — Zoom opens in its own window and carries its own chat, so neither
   had anything to render. What remains is one join card, capped rather than
   stretched across a wide screen. */
.e2c-classroom-grid[b-ekhsvt8d2p] {
    display: grid;
    grid-template-columns: minmax(0, 520px);
    gap: 20px;
    align-items: start;
}

/* ── Join card ───────────────────────────────────────────────────────────── */
.e2c-join-card[b-ekhsvt8d2p] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}

.e2c-join-status[b-ekhsvt8d2p] { margin-bottom: 2px; }

.e2c-live-pill[b-ekhsvt8d2p],
.e2c-upcoming-pill[b-ekhsvt8d2p] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 11px;
    border-radius: 999px;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .3px;
}

/* #D24545 gives white text only 4.49:1 — #B93A3A clears WCAG 1.4.3 (5.6:1) in both themes. */
.e2c-live-pill[b-ekhsvt8d2p] { background: #B93A3A; }
.e2c-upcoming-pill[b-ekhsvt8d2p] { background: #1F5A8A; }

.e2c-join-title[b-ekhsvt8d2p] {
    margin: 4px 0 0;
    font-size: 20px;
    font-weight: 700;
    color: var(--text);
    line-height: 1.25;
}

.e2c-join-meta[b-ekhsvt8d2p] {
    margin: 0;
    font-size: 13px;
    color: var(--text-muted);
}

.e2c-join-hint[b-ekhsvt8d2p] {
    margin: 0;
    font-size: 12px;
    color: var(--text-muted);
    max-width: 44ch;
}

.e2c-join-locked[b-ekhsvt8d2p] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
    font-size: 14px;
    font-weight: 700;
    color: var(--text);
}

/* ── Join button ─────────────────────────────────────────────────────────── */
.e2c-join-btn[b-ekhsvt8d2p] {
    margin-top: 10px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 22px;
    border: none;
    border-radius: 10px;
    background: #1F5A8A;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
}

.e2c-join-btn:hover[b-ekhsvt8d2p] { background: #18496f; }

.e2c-join-btn.is-disabled[b-ekhsvt8d2p] {
    background: var(--border);
    color: var(--text-muted);
    cursor: not-allowed;
}

/* ── Recordings list ─────────────────────────────────────────────────────── */
.e2c-rec-list[b-ekhsvt8d2p] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.e2c-rec-row[b-ekhsvt8d2p] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 4px;
    border-bottom: 1px solid var(--border);
}

.e2c-rec-row:last-child[b-ekhsvt8d2p] { border-bottom: none; }

.e2c-rec-icon[b-ekhsvt8d2p] { font-size: 16px; }

.e2c-rec-body[b-ekhsvt8d2p] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.e2c-rec-title[b-ekhsvt8d2p] {
    font-size: 14px;
    font-weight: 600;
    color: var(--text);
}

.e2c-rec-meta[b-ekhsvt8d2p] {
    font-size: 12px;
    color: var(--text-muted);
}

.e2c-rec-watch[b-ekhsvt8d2p] {
    flex: none;
    font-size: 13px;
    font-weight: 700;
    color: #7FB8E8;
    text-decoration: none;
}

.e2c-rec-watch:hover[b-ekhsvt8d2p] { text-decoration: underline; }

.e2c-rec-locked[b-ekhsvt8d2p] {
    flex: none;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-muted);
}
/* /Components/Pages/Student/Courses.razor.rz.scp.css */
.e2c-courses[b-lmcf1lohwo] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 28px;
}

@media (max-width: 820px) {
    .e2c-courses[b-lmcf1lohwo] { padding: 16px; }
}

/* ── Overdue banner ──────────────────────────────────────────────────── */
.e2c-overdue[b-lmcf1lohwo] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    border-radius: 12px;
    background: rgba(210, 69, 69, .12);
    border: 1.5px solid rgba(210, 69, 69, .55);
}

.e2c-overdue-icon[b-lmcf1lohwo] {
    font-size: 24px;
    line-height: 1;
}

.e2c-overdue-body[b-lmcf1lohwo] {
    flex: 1;
    min-width: 0;
}

.e2c-overdue-title[b-lmcf1lohwo] {
    margin: 0;
    font-weight: 800;
    font-size: 15px;
    color: #9D2828;
}

.e2c-overdue-sub[b-lmcf1lohwo] {
    margin: 2px 0 0;
    font-size: 13px;
    color: #9D2828;
    opacity: .9;
}

.e2c-overdue-btn[b-lmcf1lohwo] {
    flex: none;
    display: inline-flex;
    align-items: center;
    padding: 9px 18px;
    border-radius: 9px;
    background: #D24545;
    color: #fff;
    font-weight: 700;
    font-size: 13px;
    text-decoration: none;
}

.e2c-overdue-btn:hover[b-lmcf1lohwo] {
    background: #B83A3A;
}

/* ── Course grid ─────────────────────────────────────────────────────── */
.e2c-courses-grid[b-lmcf1lohwo] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

@media (max-width: 980px) {
    .e2c-courses-grid[b-lmcf1lohwo] {
        grid-template-columns: 1fr;
    }
}

.e2c-course-card[b-lmcf1lohwo] {
    position: relative;
    display: flex;
    flex-direction: column;
    border-radius: 14px;
    overflow: hidden;
    background: var(--surface);
    border: 1px solid var(--border);
    transition: transform .12s ease, box-shadow .12s ease;
}

.e2c-course-card:not(.is-locked):hover[b-lmcf1lohwo] {
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(0, 0, 0, .28);
}

.e2c-course-head[b-lmcf1lohwo] {
    position: relative;
    height: 96px;
    display: flex;
    align-items: center;
    padding: 0 18px;
}

.e2c-course-glyph[b-lmcf1lohwo] {
    font-size: 34px;
    line-height: 1;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .25));
}

.e2c-course-day[b-lmcf1lohwo] {
    position: absolute;
    top: 12px;
    right: 12px;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .22);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    backdrop-filter: blur(2px);
}

.e2c-course-body[b-lmcf1lohwo] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px 18px 18px;
}

.e2c-course-title[b-lmcf1lohwo] {
    margin: 0;
    font-size: 16px;
    font-weight: 800;
    color: var(--text);
}

.e2c-course-meta[b-lmcf1lohwo] {
    margin: 0;
    font-size: 12.5px;
    color: var(--text-muted);
}

.e2c-progress[b-lmcf1lohwo] {
    height: 8px;
    border-radius: 999px;
    background: var(--border);
    overflow: hidden;
    margin-top: 4px;
}

.e2c-progress-fill[b-lmcf1lohwo] {
    display: block;
    height: 100%;
    border-radius: 999px;
}

.e2c-course-foot[b-lmcf1lohwo] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-size: 12px;
}

.e2c-course-pct[b-lmcf1lohwo] {
    font-weight: 700;
    color: var(--text);
}

.e2c-course-lessons[b-lmcf1lohwo] {
    color: var(--text-muted);
}

/* Whole-card click target (when not locked) — a <button> opening the lesson view */
.e2c-course-open[b-lmcf1lohwo] {
    position: absolute;
    inset: 0;
    z-index: 2;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
}

/* Visible keyboard focus ring for the stretched card link */
.e2c-course-open:focus-visible[b-lmcf1lohwo] {
    outline: 3px solid #1F5A8A;
    outline-offset: -3px;
    border-radius: 14px;
}

/* ── Lock overlay ────────────────────────────────────────────────────── */
.e2c-course-card.is-locked[b-lmcf1lohwo] {
    cursor: default;
}

.e2c-course-lock[b-lmcf1lohwo] {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: rgba(11, 21, 37, .55);
    backdrop-filter: blur(5px);
}

.e2c-course-lock-icon[b-lmcf1lohwo] {
    font-size: 28px;
    line-height: 1;
}

.e2c-course-lock-label[b-lmcf1lohwo] {
    margin: 0;
    font-weight: 800;
    font-size: 14px;
    color: #F6F1E5;
}

.e2c-course-lock-btn[b-lmcf1lohwo] {
    display: inline-flex;
    align-items: center;
    padding: 8px 16px;
    border-radius: 9px;
    background: #1F5A8A;
    color: #fff;
    font-weight: 700;
    font-size: 12.5px;
    text-decoration: none;
    margin-top: 2px;
}

.e2c-course-lock-btn:hover[b-lmcf1lohwo] {
    background: #18476E;
}

/* ── Empty / onboarding state ────────────────────────────────────────── */
.e2c-empty-card[b-lmcf1lohwo] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 48px 24px;
}

.e2c-empty[b-lmcf1lohwo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 6px;
}

.e2c-empty-glyph[b-lmcf1lohwo] {
    font-size: 40px;
    line-height: 1;
    margin-bottom: 6px;
}

.e2c-empty-title[b-lmcf1lohwo] {
    margin: 0;
    font-weight: 800;
    font-size: 16px;
    color: var(--text);
}

.e2c-empty-sub[b-lmcf1lohwo] {
    margin: 0;
    max-width: 460px;
    font-size: 13.5px;
    color: var(--text-muted);
}

.e2c-empty-link[b-lmcf1lohwo] {
    margin-top: 10px;
    color: #7FB8E8;
    font-weight: 700;
    font-size: 13.5px;
    text-decoration: none;
}

.e2c-empty-link:hover[b-lmcf1lohwo] {
    text-decoration: underline;
}

/* ── Course detail: month-gated lesson list ──────────────────────────── */
.e2c-detail[b-lmcf1lohwo] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.e2c-detail-back[b-lmcf1lohwo] {
    align-self: flex-start;
    background: none;
    border: 0;
    padding: 4px 0;
    cursor: pointer;
    color: #7FB8E8;
    font-weight: 700;
    font-size: 13.5px;
}

.e2c-detail-back:hover[b-lmcf1lohwo] {
    text-decoration: underline;
}

.e2c-detail-head[b-lmcf1lohwo] {
    display: flex;
    align-items: center;
    gap: 14px;
    border-radius: 14px;
    padding: 18px 20px;
}

.e2c-detail-glyph[b-lmcf1lohwo] {
    font-size: 34px;
    line-height: 1;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .25));
}

.e2c-detail-headtext[b-lmcf1lohwo] {
    flex: 1;
    min-width: 0;
}

.e2c-detail-title[b-lmcf1lohwo] {
    margin: 0;
    font-size: 18px;
    font-weight: 800;
    color: #fff;
}

.e2c-detail-meta[b-lmcf1lohwo] {
    margin: 2px 0 0;
    font-size: 12.5px;
    color: rgba(255, 255, 255, .88);
}

.e2c-detail-classes[b-lmcf1lohwo] {
    flex: none;
    padding: 8px 14px;
    border-radius: 9px;
    background: rgba(255, 255, 255, .18);
    color: #fff;
    font-weight: 700;
    font-size: 12.5px;
    text-decoration: none;
    backdrop-filter: blur(2px);
}

.e2c-detail-classes:hover[b-lmcf1lohwo] {
    background: rgba(255, 255, 255, .3);
}

/* Month section */
.e2c-month[b-lmcf1lohwo] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    overflow: hidden;
}

.e2c-month-head[b-lmcf1lohwo] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 12px 18px;
    border-bottom: 1px solid var(--border);
}

.e2c-month-name[b-lmcf1lohwo] {
    font-weight: 800;
    font-size: 14px;
    color: var(--text);
}

.e2c-month-tag[b-lmcf1lohwo] {
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    color: #9C5A0F;
    background: rgba(243, 145, 37, .14);
}

.e2c-month-tag.is-unlocked[b-lmcf1lohwo] {
    color: #3F7321;
    background: rgba(111, 174, 63, .16);
}

html[data-theme="dark"] .e2c-month-tag[b-lmcf1lohwo] { color: #F0B269; }
html[data-theme="dark"] .e2c-month-tag.is-unlocked[b-lmcf1lohwo] { color: #A5D48A; }

.e2c-month-unlock[b-lmcf1lohwo] {
    margin-left: auto;
    border: 0;
    border-radius: 9px;
    padding: 8px 14px;
    background: #1F5A8A;
    color: #fff;
    font-weight: 700;
    font-size: 12.5px;
    cursor: pointer;
}

.e2c-month-unlock:hover[b-lmcf1lohwo] {
    background: #18476E;
}

.e2c-month-unlock:disabled[b-lmcf1lohwo] {
    opacity: .6;
    cursor: default;
}

/* Lesson rows */
.e2c-lessons[b-lmcf1lohwo] {
    list-style: none;
    margin: 0;
    padding: 4px 0;
}

.e2c-lesson[b-lmcf1lohwo] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 18px;
}

.e2c-lesson + .e2c-lesson[b-lmcf1lohwo] {
    border-top: 1px solid var(--border);
}

.e2c-lesson-ico[b-lmcf1lohwo] {
    font-size: 18px;
    line-height: 1;
}

/* #271: numbered lesson circle — number when unwatched, check when watched, lock when gated. */
.e2c-lesson-num[b-lmcf1lohwo] {
    flex: none;
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1.5px solid var(--border);
    color: var(--text-muted);
    font-weight: 800;
    font-size: 11px;
    line-height: 1;
}

.e2c-lesson-num.is-watched[b-lmcf1lohwo] {
    border-color: #3F7321;
    background: rgba(63, 115, 33, .12);
    color: #3F7321;
    font-size: 13px;
}

html[data-theme="dark"] .e2c-lesson-num.is-watched[b-lmcf1lohwo] {
    border-color: #A5D48A;
    background: rgba(165, 212, 138, .14);
    color: #A5D48A;
}

/* #271: "up next" — the first unwatched, accessible lesson gets the accent treatment. */
.e2c-lesson.is-next[b-lmcf1lohwo] {
    background: rgba(243, 145, 37, .07);
    border-left: 3px solid #F39125;
    padding-left: 15px;
}

.e2c-lesson.is-next .e2c-lesson-num[b-lmcf1lohwo] {
    border-color: #F39125;
    color: #E36A1A;
}

.e2c-lesson-open.is-next[b-lmcf1lohwo] {
    color: #E36A1A;
}

.e2c-lesson-main[b-lmcf1lohwo] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.e2c-lesson-title[b-lmcf1lohwo] {
    font-weight: 700;
    font-size: 13.5px;
    color: var(--text);
}

.e2c-lesson-sub[b-lmcf1lohwo] {
    font-size: 12px;
    color: var(--text-muted);
}

.e2c-month.is-locked .e2c-lessons[b-lmcf1lohwo] {
    opacity: .72;
}

.e2c-lesson.is-locked .e2c-lesson-title[b-lmcf1lohwo] {
    color: var(--text-muted);
}

.e2c-lesson-watched[b-lmcf1lohwo] {
    flex: none;
    color: #3F7321;
    font-weight: 800;
    font-size: 13px;
}

html[data-theme="dark"] .e2c-lesson-watched[b-lmcf1lohwo] { color: #A5D48A; }

/* #420: the lesson actions are now real buttons (mint-a-link on click / reveal notes), not a
   link to another page, so they reset the native button chrome. */
.e2c-lesson-actions[b-lmcf1lohwo] {
    flex: none;
    display: flex;
    align-items: center;
    gap: 12px;
}

.e2c-lesson-open[b-lmcf1lohwo] {
    flex: none;
    color: #7FB8E8;
    font-weight: 700;
    font-size: 12.5px;
    text-decoration: none;
    background: none;
    border: 0;
    padding: 0;
    font-family: inherit;
    cursor: pointer;
    white-space: nowrap;
}

.e2c-lesson-open:hover:not(:disabled)[b-lmcf1lohwo] {
    text-decoration: underline;
}

.e2c-lesson-open:disabled[b-lmcf1lohwo] {
    opacity: .6;
    cursor: default;
}

/* #420: notes + downloadable materials, revealed under an accessible lesson. */
.e2c-lesson-detail[b-lmcf1lohwo] {
    margin-top: 8px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: rgba(127, 184, 232, .06);
}

.e2c-lesson-notes[b-lmcf1lohwo] {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.55;
    color: var(--text);
    white-space: pre-wrap;
}

.e2c-lesson-notes + .e2c-lesson-files[b-lmcf1lohwo] {
    margin-top: 10px;
}

.e2c-lesson-files[b-lmcf1lohwo] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.e2c-lesson-file[b-lmcf1lohwo] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: none;
    border: 0;
    padding: 0;
    font-family: inherit;
    font-size: 12.5px;
    font-weight: 700;
    color: #1F5A8A;
    cursor: pointer;
    text-align: left;
}

html[data-theme="dark"] .e2c-lesson-file[b-lmcf1lohwo] {
    color: #7FB8E8;
}

.e2c-lesson-file:hover:not(:disabled)[b-lmcf1lohwo] {
    text-decoration: underline;
}

.e2c-lesson-file:disabled[b-lmcf1lohwo] {
    opacity: .6;
    cursor: default;
}

.e2c-lesson-file-name[b-lmcf1lohwo] {
    overflow-wrap: anywhere;
}

.e2c-lesson-file-state[b-lmcf1lohwo] {
    font-weight: 600;
    color: var(--text-muted);
}

@media (max-width: 640px) {
    .e2c-month-unlock[b-lmcf1lohwo] {
        margin-left: 0;
        width: 100%;
        justify-content: center;
    }
}
/* /Components/Pages/Student/Dashboard.razor.rz.scp.css */
/* ── Dashboard layout ─────────────────────────────────────────────── */
.e2c-dash[b-0s1qhxzhzy] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    /* Mockup StudentFrame wraps content in a 28px gutter below the full-bleed top bar (portals.jsx). */
    padding: 28px;
}

.e2c-dash-stats[b-0s1qhxzhzy] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

.e2c-dash-grid[b-0s1qhxzhzy] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 18px;
    align-items: start;
}

/* ── Card shell ───────────────────────────────────────────────────── */
[b-0s1qhxzhzy] .e2c-card {
    padding: 22px;
    border-radius: 16px;
    border-color: var(--border);
    background: var(--surface);
}

.e2c-card-head[b-0s1qhxzhzy] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.e2c-card-title[b-0s1qhxzhzy] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: 15px;
    color: var(--text);
    margin: 0;
}

.e2c-card-sub[b-0s1qhxzhzy] {
    font-size: 0.82rem;
    color: var(--text-muted);
    margin: 4px 0 0;
}

.e2c-card-link[b-0s1qhxzhzy] {
    font-size: 0.82rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}
.e2c-card-link:hover[b-0s1qhxzhzy] { text-decoration: underline; }
.e2c-link-blue[b-0s1qhxzhzy] { color: #1F5A8A; }

/* ── Overdue banner ───────────────────────────────────────────────── */
[b-0s1qhxzhzy] .e2c-overdue {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    border-radius: 14px;
    background: rgba(210, 69, 69, 0.12);
    border: 1.5px solid #D24545;
}

.e2c-overdue-icon[b-0s1qhxzhzy] {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 11px;
    display: grid;
    place-items: center;
    font-size: 1.25rem;
    background: rgba(210, 69, 69, 0.18);
}

.e2c-overdue-body[b-0s1qhxzhzy] {
    display: flex;
    flex-direction: column;
    line-height: 1.35;
    flex: 1;
    min-width: 0;
}

.e2c-overdue-title[b-0s1qhxzhzy] {
    font-weight: 700;
    font-size: 0.95rem;
    color: #9D2828;
}

.e2c-overdue-sub[b-0s1qhxzhzy] {
    font-size: 0.82rem;
    color: #9D2828;
    opacity: 0.85;
}

/* WCAG 1.4.3 — dark-red on the dark overdue tint is ~1.6:1; lift to a light red on dark. */
html[data-theme="dark"] .e2c-overdue-title[b-0s1qhxzhzy],
html[data-theme="dark"] .e2c-overdue-sub[b-0s1qhxzhzy] { color: #F3A6A6; opacity: 1; }

[b-0s1qhxzhzy] .e2c-overdue-btn {
    background: #D24545;
    color: #fff;
    flex: 0 0 auto;
    text-transform: none;
    font-weight: 600;
}
[b-0s1qhxzhzy] .e2c-overdue-btn:hover { background: #9D2828; }

/* ── This week / live classes ─────────────────────────────────────── */
.e2c-classes[b-0s1qhxzhzy] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.e2c-class-row[b-0s1qhxzhzy] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 4px 14px 14px;
    border-top: 1px solid var(--border);
    border-left: 3px solid transparent;
}
.e2c-class-row:first-child[b-0s1qhxzhzy] { border-top: none; }
.e2c-class-row.is-live[b-0s1qhxzhzy] {
    border-left-color: #1F5A8A;
    background: rgba(31, 90, 138, 0.05);
    border-radius: 8px;
}

.e2c-class-when[b-0s1qhxzhzy] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 0 0 132px;
    min-width: 0;
}

.e2c-class-time[b-0s1qhxzhzy] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #1F5A8A;
    white-space: nowrap;
}

.e2c-live-pill[b-0s1qhxzhzy] {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: #fff;
    /* #D24545 gives white text only 4.49:1 — #B93A3A clears WCAG 1.4.3 (5.6:1) in both themes. */
    background: #B93A3A;
    padding: 2px 7px;
    border-radius: 999px;
}

.e2c-class-body[b-0s1qhxzhzy] {
    display: flex;
    flex-direction: column;
    line-height: 1.35;
    flex: 1;
    min-width: 0;
}

.e2c-class-title[b-0s1qhxzhzy] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--text);
}

.e2c-class-tutor[b-0s1qhxzhzy] {
    font-size: 0.78rem;
    color: var(--text-muted);
}

[b-0s1qhxzhzy] .e2c-join-btn {
    background: #1F5A8A;
    color: #fff;
    text-transform: none;
    font-weight: 600;
    flex: 0 0 auto;
}
[b-0s1qhxzhzy] .e2c-join-btn:hover { background: #163E63; }

/* ── Registration progress checklist ──────────────────────────────── */
.e2c-steps[b-0s1qhxzhzy] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.e2c-step[b-0s1qhxzhzy] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 9px 0;
    position: relative;
}

.e2c-step-dot[b-0s1qhxzhzy] {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 0.72rem;
    font-weight: 700;
    color: #E36A1A;
    background: rgba(243, 145, 37, 0.13);
    margin-top: 1px;
}
.e2c-step.is-done .e2c-step-dot[b-0s1qhxzhzy] {
    background: #6FAE3F;
    color: #fff;
}

.e2c-step-body[b-0s1qhxzhzy] {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.e2c-step-title[b-0s1qhxzhzy] {
    font-weight: 600;
    font-size: 0.88rem;
    color: var(--text);
}

.e2c-step-meta[b-0s1qhxzhzy] {
    font-size: 0.76rem;
    color: var(--text-muted);
}

/* ── Recent activity ──────────────────────────────────────────────── */
.e2c-activity[b-0s1qhxzhzy] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.e2c-activity-row[b-0s1qhxzhzy] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 11px 0;
    border-top: 1px solid var(--border);
}
.e2c-activity-row:first-child[b-0s1qhxzhzy] { border-top: none; }

.e2c-activity-dot[b-0s1qhxzhzy] {
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    border-radius: 50%;
    background: #1F5A8A;
    margin-top: 7px;
}

.e2c-activity-body[b-0s1qhxzhzy] {
    display: flex;
    flex-direction: column;
    line-height: 1.35;
}

.e2c-activity-msg[b-0s1qhxzhzy] {
    font-size: 0.88rem;
    color: var(--text);
}

.e2c-activity-time[b-0s1qhxzhzy] {
    font-size: 0.75rem;
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
}

/* ── Empty / onboarding states ────────────────────────────────────── */
.e2c-empty[b-0s1qhxzhzy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 36px 16px;
    gap: 4px;
}
.e2c-empty-glyph[b-0s1qhxzhzy] { font-size: 1.8rem; }
.e2c-empty-title[b-0s1qhxzhzy] { font-weight: 700; color: var(--text); margin: 6px 0 0; }
.e2c-empty-sub[b-0s1qhxzhzy] { font-size: 0.84rem; color: var(--text-muted); margin: 0; max-width: 360px; }

.e2c-onboard-actions[b-0s1qhxzhzy] {
    display: flex;
    gap: 10px;
    margin-top: 16px;
    flex-wrap: wrap;
    justify-content: center;
}
[b-0s1qhxzhzy] .e2c-onboard-actions .mud-button-root { text-transform: none; font-weight: 600; }

/* ── Dark mode (WCAG 1.4.3) ───────────────────────────────────────────
   The hardcoded brand blue #1F5A8A only reaches ~2.2:1 on the dark surface
   (#142238); flip to the lighter portal blue used across the student pages. */
html[data-theme="dark"] .e2c-class-time[b-0s1qhxzhzy] { color: #7FB8E8; }

html[data-theme="dark"] .e2c-class-row.is-live[b-0s1qhxzhzy] {
    border-left-color: #7FB8E8;
    background: rgba(127, 184, 232, 0.08);
}

html[data-theme="dark"] .e2c-link-blue[b-0s1qhxzhzy] { color: #7FB8E8; }

html[data-theme="dark"] .e2c-activity-dot[b-0s1qhxzhzy] { background: #7FB8E8; }

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 820px) {
    .e2c-dash[b-0s1qhxzhzy] { padding: 16px; }
    .e2c-dash-grid[b-0s1qhxzhzy] { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
    .e2c-dash-stats[b-0s1qhxzhzy] { grid-template-columns: 1fr; }
    .e2c-class-when[b-0s1qhxzhzy] { flex-basis: 110px; }
}
/* /Components/Pages/Student/Finance.razor.rz.scp.css */
/* Finance (E5) — student portal. Light surfaces on the dark portal canvas, blue accent. */

/* Full viewport width with the 28px portal gutter — matches Dashboard/Registration
   (no max-width; the StudentFrame owns the canvas). */
.fin-page[b-5yiawpmg95] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 28px;
}

@media (max-width: 820px) {
    .fin-page[b-5yiawpmg95] { padding: 16px; }
}

/* ── Stat cards grid ─────────────────────────────────────────────── */
.fin-stats[b-5yiawpmg95] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

/* ── Card shell ──────────────────────────────────────────────────── */
[b-5yiawpmg95] .fin-card {
    border-radius: 14px;
    padding: 20px 22px;
    background: var(--surface);
}

.fin-card-head[b-5yiawpmg95] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.fin-card-title[b-5yiawpmg95] {
    margin: 0;
    font-size: 16px;
    font-weight: 800;
    color: var(--text);
}

.fin-card-sub[b-5yiawpmg95] {
    margin: 2px 0 0;
    font-size: 12.5px;
    color: var(--text-muted);
}

/* ── Overdue banner (mirrors the dashboard's e2c-overdue) ────────── */
[b-5yiawpmg95] .fin-overdue {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    border-radius: 14px;
    background: rgba(210, 69, 69, 0.12);
    border: 1.5px solid #D24545;
}

.fin-overdue-icon[b-5yiawpmg95] {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 11px;
    display: grid;
    place-items: center;
    font-size: 1.25rem;
    background: rgba(210, 69, 69, 0.18);
}

.fin-overdue-body[b-5yiawpmg95] {
    display: flex;
    flex-direction: column;
    line-height: 1.35;
    flex: 1;
    min-width: 0;
}

.fin-overdue-title[b-5yiawpmg95] {
    font-weight: 700;
    font-size: 0.95rem;
    color: #9D2828;
}

.fin-overdue-sub[b-5yiawpmg95] {
    font-size: 0.82rem;
    color: #9D2828;
    opacity: 0.85;
}

/* WCAG 1.4.3 — dark-red on the dark overdue tint is ~1.6:1; lift to a light red on dark. */
html[data-theme="dark"] .fin-overdue-title[b-5yiawpmg95],
html[data-theme="dark"] .fin-overdue-sub[b-5yiawpmg95] { color: #F3A6A6; opacity: 1; }

[b-5yiawpmg95] .fin-overdue-btn {
    background: #D24545;
    color: #fff;
    flex: 0 0 auto;
    text-transform: none;
    font-weight: 600;
}
[b-5yiawpmg95] .fin-overdue-btn:hover { background: #9D2828; }

/* ── Plan summary (active class enrollments) ─────────────────────── */
.fin-plan[b-5yiawpmg95] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.fin-plan-row[b-5yiawpmg95] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
}

.fin-plan-row:last-child[b-5yiawpmg95] {
    border-bottom: none;
}

.fin-plan-body[b-5yiawpmg95] {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.fin-plan-subject[b-5yiawpmg95] {
    font-size: 14px;
    font-weight: 700;
    color: var(--text);
}

.fin-plan-code[b-5yiawpmg95] {
    font-size: 11.5px;
    color: var(--text-muted);
}

.fin-plan-amount[b-5yiawpmg95] {
    flex: 0 0 auto;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--text);
    white-space: nowrap;
}

.fin-plan-cancelling[b-5yiawpmg95] {
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 600;
    color: #9D2828;
    text-align: right;
    max-width: 260px;
}

html[data-theme="dark"] .fin-plan-cancelling[b-5yiawpmg95] { color: #F3A6A6; }

.fin-plan-total[b-5yiawpmg95] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
    font-size: 13px;
    color: var(--text-muted);
}

.fin-plan-total strong[b-5yiawpmg95] {
    color: var(--text);
}

/* ── Transactions table ──────────────────────────────────────────── */
.fin-table-wrap[b-5yiawpmg95] {
    overflow-x: auto;
}

.fin-table[b-5yiawpmg95] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13.5px;
}

.fin-table thead th[b-5yiawpmg95] {
    text-align: left;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--text-muted);
    padding: 8px 12px;
    background: var(--surface-2);
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}

.fin-table tbody td[b-5yiawpmg95] {
    padding: 12px;
    border-bottom: 1px solid var(--border);
    color: var(--text);
    vertical-align: middle;
}

.fin-table tbody tr:last-child td[b-5yiawpmg95] {
    border-bottom: none;
}

.fin-th-r[b-5yiawpmg95],
.fin-td-r[b-5yiawpmg95] {
    text-align: right;
}

.fin-strong[b-5yiawpmg95] {
    font-weight: 700;
    color: var(--text);
}

.fin-muted[b-5yiawpmg95] {
    color: var(--text-muted);
}

/* Overdue flag next to a past-due date — red on both themes (WCAG 1.4.3). */
.fin-overdue-flag[b-5yiawpmg95] {
    display: inline-block;
    margin-left: 8px;
    padding: 1px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .02em;
    background: rgba(210, 69, 69, .14);
    color: #9D2828;
}

html[data-theme="dark"] .fin-overdue-flag[b-5yiawpmg95] { color: #F3A6A6; }

/* ── Empty / onboarding ──────────────────────────────────────────── */
.fin-empty[b-5yiawpmg95] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 6px;
    padding: 40px 24px;
}

.fin-empty-sm[b-5yiawpmg95] {
    padding: 28px 24px;
}

.fin-empty-glyph[b-5yiawpmg95] {
    font-size: 34px;
    margin-bottom: 4px;
}

.fin-empty-title[b-5yiawpmg95] {
    margin: 0;
    font-size: 15px;
    font-weight: 800;
    color: var(--text);
}

.fin-empty-sub[b-5yiawpmg95] {
    margin: 0;
    font-size: 13px;
    color: var(--text-muted);
    max-width: 440px;
}

.fin-cta[b-5yiawpmg95] {
    margin-top: 12px;
}

/* ── Responsive ──────────────────────────────────────────────────── */
@media (max-width: 760px) {
    .fin-page[b-5yiawpmg95] {
        padding: 16px;
    }

    .fin-stats[b-5yiawpmg95] {
        grid-template-columns: repeat(2, 1fr);
    }

    .fin-plan-row[b-5yiawpmg95] {
        flex-wrap: wrap;
    }

    .fin-plan-cancelling[b-5yiawpmg95] {
        max-width: none;
        text-align: left;
    }
}
/* /Components/Pages/Student/MyESlips.razor.rz.scp.css */
.se-page[b-ci70ueotc2] {
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 980px;
}

@media (max-width: 820px) {
    .se-page[b-ci70ueotc2] { padding: 16px; }
}

/* ── Loading / state row ─────────────────────────────────────────────── */
.se-state[b-ci70ueotc2] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 40px;
    color: var(--text-muted);
    font-size: 14px;
}

/* ── Empty / onboarding states ───────────────────────────────────────── */
[b-ci70ueotc2] .se-empty {
    border-radius: 16px;
    padding: 48px 32px;
    text-align: center;
    background: var(--surface);
    border-color: var(--border);
}

.se-empty-icon[b-ci70ueotc2] {
    font-size: 44px;
    display: block;
    margin-bottom: 12px;
}

.se-empty-title[b-ci70ueotc2] {
    margin: 0 0 8px;
    font-size: 20px;
    font-weight: 700;
    color: var(--text);
}

.se-empty-sub[b-ci70ueotc2] {
    margin: 0 auto;
    max-width: 520px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-muted);
}

.se-empty-actions[b-ci70ueotc2] {
    margin-top: 20px;
    display: flex;
    justify-content: center;
}

/* ── Inline branded document card ────────────────────────────────────── */
.se-doc[b-ci70ueotc2] {
    max-width: 820px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--surface);
    overflow: hidden;
}

/* Solid brand-blue header band. Intentionally brand-coloured in BOTH light + dark mode: the brand
   tokens (--brand-blue-deep #163E63 / --brand-blue #1F5A8A) are constant across themes, so we drive
   the band from them rather than a raw hex. White text is the brand pairing and stays white. */
.se-doc-band[b-ci70ueotc2] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 20px 24px;
    background: var(--brand-blue-deep, #163E63);
    color: #fff;
}

.se-doc-logo[b-ci70ueotc2] {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    object-fit: contain;
}

.se-doc-bandtext[b-ci70ueotc2] {
    flex: 1 1 auto;
    min-width: 0;
}

.se-doc-eyebrow[b-ci70ueotc2] {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    opacity: .85;
}

.se-doc-sitting[b-ci70ueotc2] {
    font-size: 18px;
    font-weight: 800;
    margin-top: 2px;
}

.se-doc-chip[b-ci70ueotc2] {
    flex: 0 0 auto;
    font-size: 11px;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .18);
    color: #fff;
}

/* ── Document body ───────────────────────────────────────────────────── */
.se-doc-body[b-ci70ueotc2] {
    padding: 24px;
}

.se-doc-greeting[b-ci70ueotc2] {
    margin: 0 0 18px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--text-muted);
}

.se-doc-section[b-ci70ueotc2] {
    margin: 0 0 12px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-muted);
}

/* Credentials: 2-column grid; each row is label-left / value-right with a hairline. */
.se-doc-creds[b-ci70ueotc2] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 24px;
    margin-bottom: 22px;
}

.se-doc-cred[b-ci70ueotc2] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid var(--border);
    min-width: 0;
}

.se-doc-cred span[b-ci70ueotc2] {
    font-size: 13px;
    color: var(--text-muted);
}

.se-doc-cred strong[b-ci70ueotc2] {
    font-size: 13px;
    font-weight: 600;
    color: var(--text);
    text-align: right;
    word-break: break-word;
}

/* ── Timetable ───────────────────────────────────────────────────────── */
.se-doc-tt-empty[b-ci70ueotc2] {
    font-size: 13px;
    color: var(--text-muted);
    padding: 12px;
    background: var(--surface-2);
    border-radius: 8px;
}

.se-doc-scroll[b-ci70ueotc2] {
    overflow-x: auto;
}

.se-doc-tt[b-ci70ueotc2] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.se-doc-tt th[b-ci70ueotc2] {
    text-align: left;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--text-muted);
    padding: 8px 10px;
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}

.se-doc-tt td[b-ci70ueotc2] {
    padding: 8px 10px;
    border-bottom: 1px solid var(--border);
    color: var(--text);
    white-space: nowrap;
}

/* ── Alert ───────────────────────────────────────────────────────────── */
.se-doc-alert[b-ci70ueotc2] {
    margin-top: 14px;
    border-radius: 12px;
    font-size: 13px;
}

/* ── Footer: status + download action ────────────────────────────────── */
.se-doc-foot[b-ci70ueotc2] {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.se-doc-status[b-ci70ueotc2] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.se-doc-sent[b-ci70ueotc2] {
    font-size: 13px;
    color: var(--text-muted);
}

@media (max-width: 640px) {
    .se-page[b-ci70ueotc2] { padding: 16px; }
    .se-doc-creds[b-ci70ueotc2] { grid-template-columns: 1fr; }
}

/* ── Print: isolate the document card ────────────────────────────────────
   The primary download path is the server-generated PDF, but if a student
   prints the page (Ctrl+P / "Save as PDF") this keeps just the e-slip card,
   forces the brand band to print its colour, and drops the screen-only
   footer action + greeting muting so the printout reads as a document. */
@media print {
    .se-page[b-ci70ueotc2] {
        padding: 0;
        gap: 0;
        max-width: none;
    }

    .se-doc[b-ci70ueotc2] {
        max-width: none;
        border: none;
        border-radius: 0;
        page-break-inside: avoid;
    }

    /* Ensure the blue band keeps its colour in print (browsers strip backgrounds by default). */
    .se-doc-band[b-ci70ueotc2] {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    /* Hide on-screen-only chrome: the download/status footer and the loading/empty states. */
    .se-doc-foot[b-ci70ueotc2],
    .se-state[b-ci70ueotc2],
    .se-empty[b-ci70ueotc2] {
        display: none !important;
    }

    .se-doc-tt th[b-ci70ueotc2],
    .se-doc-tt td[b-ci70ueotc2] {
        white-space: normal;
    }
}
/* /Components/Pages/Student/Profile.razor.rz.scp.css */
/* Student Profile & settings (E8) — student portal (accent #1F5A8A).
   Scoped CSS: every e2c-* chrome class used in this page is (re)defined here,
   matching the shared visual spec, since Blazor scoped styles do not leak in. */

.e2c-prof[b-264cp98r42] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 28px;
    max-width: 1100px;
    font-family: 'Inter', system-ui, sans-serif;
}

/* 220px identity column + flexible main column; stacks on mobile. */
.e2c-prof-grid[b-264cp98r42] {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 20px;
    align-items: start;
}

.e2c-prof-main[b-264cp98r42] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* ── Card shell ───────────────────────────────────────────────────────── */
[b-264cp98r42] .e2c-card {
    padding: 24px;
    border-radius: 16px;
    border-color: var(--border);
    background: var(--surface);
}

.e2c-card-head[b-264cp98r42] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.e2c-card-title[b-264cp98r42] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-size: 1.12rem;
    font-weight: 700;
    color: var(--text);
    margin: 0;
}

.e2c-card-sub[b-264cp98r42] { font-size: 0.86rem; color: var(--text-muted); margin: 3px 0 0; }

.e2c-card-foot[b-264cp98r42] {
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}
.e2c-foot-split[b-264cp98r42] { justify-content: space-between; }
.e2c-foot-note[b-264cp98r42] { font-size: 0.82rem; color: var(--text-muted); }

.e2c-prof-action[b-264cp98r42] { text-transform: none; }

/* ── Left identity card ───────────────────────────────────────────────── */
.e2c-prof-side[b-264cp98r42] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
    padding: 28px 18px;
}

.e2c-prof-avatar[b-264cp98r42] {
    width: 84px;
    height: 84px;
    font-size: 30px;
    font-weight: 800;
    margin-bottom: 6px;
}

.e2c-prof-name[b-264cp98r42] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--text);
}

.e2c-prof-role[b-264cp98r42] {
    font-size: 0.82rem;
    color: var(--text-muted);
    margin-bottom: 12px;
}

/* ── Field grid ───────────────────────────────────────────────────────── */
.e2c-field-grid[b-264cp98r42] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

.e2c-field[b-264cp98r42] { min-width: 0; }
.e2c-field.is-wide[b-264cp98r42] { grid-column: 1 / -1; }

/* Paired country-code + phone group. */
.e2c-phone[b-264cp98r42] {
    display: grid;
    grid-template-columns: 90px 1fr;
    gap: 10px;
    align-items: start;
}

@media (max-width: 560px) {
    .e2c-field-grid[b-264cp98r42] { grid-template-columns: 1fr; }
    .e2c-card-head[b-264cp98r42] { flex-direction: column; }
}

/* ── Notification preference rows ─────────────────────────────────────── */
.e2c-prefs[b-264cp98r42] {
    display: flex;
    flex-direction: column;
}

.e2c-pref-row[b-264cp98r42] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 2px;
    border-bottom: 1px solid var(--border);
    cursor: pointer;
    margin: 0;
}

.e2c-pref-row:last-child[b-264cp98r42] { border-bottom: none; }

.e2c-pref-body[b-264cp98r42] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.e2c-pref-title[b-264cp98r42] { font-size: 0.9rem; font-weight: 700; color: var(--text); }
.e2c-pref-sub[b-264cp98r42] { font-size: 0.8rem; color: var(--text-muted); }

/* ── Security callout (student blue accent) ───────────────────────────── */
.e2c-callout[b-264cp98r42] {
    padding: 16px;
    border: 1px solid rgba(31, 90, 138, 0.2);
    border-radius: 12px;
    background: rgba(31, 90, 138, 0.05);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.e2c-callout-main[b-264cp98r42] { display: flex; align-items: center; gap: 14px; }

.e2c-callout-glyph[b-264cp98r42] {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 11px;
    display: grid;
    place-items: center;
    font-size: 1.2rem;
    background: rgba(31, 90, 138, 0.12);
}

.e2c-callout-main strong[b-264cp98r42] { color: var(--text); font-size: 0.95rem; }
.e2c-callout-main p[b-264cp98r42] { margin: 2px 0 0; font-size: 0.84rem; color: var(--text-muted); line-height: 1.5; }

/* Rule-6 lock notice above the Personal-information grid: same callout shell, sitting on top of
   the field grid, so the locked identity fields read as deliberate rather than broken. */
.e2c-prof-locked[b-264cp98r42] { margin-bottom: 16px; }
.e2c-prof-alert[b-264cp98r42] { margin-bottom: 14px; }

.e2c-prof-security-actions[b-264cp98r42] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

/* ── Empty / onboarding state ─────────────────────────────────────────── */
.e2c-empty[b-264cp98r42] { text-align: center; padding: 44px 24px; color: var(--text-muted); }
.e2c-empty-glyph[b-264cp98r42] { font-size: 2.2rem; margin-bottom: 10px; }
.e2c-empty-title[b-264cp98r42] { font-weight: 700; color: var(--text); margin: 0 0 6px; font-size: 1rem; }
.e2c-empty-sub[b-264cp98r42] { font-size: 0.88rem; line-height: 1.55; margin: 0 auto; max-width: 46ch; }

.e2c-empty-cta[b-264cp98r42] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    margin-top: 16px;
}

/* ── Mobile ───────────────────────────────────────────────────────────── */
@media (max-width: 820px) {
    .e2c-prof[b-264cp98r42] { padding: 16px; }
    .e2c-prof-grid[b-264cp98r42] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Student/Registration.razor.rz.scp.css */
/* ── Registration (E6) — read-only student record ─────────────────────── */
.e2c-reg[b-bztpvrz5kf] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 28px;
}

/* Screen-reader-only text (visually hidden, still announced) */
.e2c-visually-hidden[b-bztpvrz5kf] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 820px) {
    .e2c-reg[b-bztpvrz5kf] { padding: 16px; }
}

.e2c-reg-grid[b-bztpvrz5kf] {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 16px;
    align-items: start;
}

.e2c-reg-main[b-bztpvrz5kf],
.e2c-reg-side[b-bztpvrz5kf] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ── Card shell ───────────────────────────────────────────────────────── */
[b-bztpvrz5kf] .e2c-reg-card {
    padding: 20px 22px;
    border-radius: 16px;
    border-color: var(--border);
    background: var(--surface);
}

.e2c-reg-cardhead[b-bztpvrz5kf] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.e2c-reg-title[b-bztpvrz5kf] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--text);
    margin: 0;
}

.e2c-reg-sub[b-bztpvrz5kf] {
    font-size: 0.82rem;
    color: var(--text-muted);
    margin: 4px 0 0;
}

.e2c-reg-locktag[b-bztpvrz5kf] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--text-muted);
    background: var(--surface-2);
    border-radius: 999px;
    padding: 4px 10px;
    white-space: nowrap;
}

.e2c-reg-action[b-bztpvrz5kf] {
    text-transform: none;
    border-radius: 10px;
    font-weight: 600;
}

.e2c-reg-loading[b-bztpvrz5kf] {
    display: flex;
    justify-content: center;
    padding: 48px 0;
}

/* ── Stepper (read-only) ──────────────────────────────────────────────── */
.e2c-reg-stepper[b-bztpvrz5kf] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0;
}

.e2c-reg-step[b-bztpvrz5kf] {
    position: relative;
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
}

.e2c-reg-step-dot[b-bztpvrz5kf] {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    font-size: 0.82rem;
    font-weight: 700;
    z-index: 1;
    background: var(--surface-2);
    color: var(--text-muted);
    border: 2px solid transparent;
}

.e2c-reg-step.is-done .e2c-reg-step-dot[b-bztpvrz5kf] {
    background: #1F5A8A;
    color: #fff;
}

.e2c-reg-step.is-current .e2c-reg-step-dot[b-bztpvrz5kf] {
    background: #E6F0F8;
    color: #1F5A8A;
    border-color: #1F5A8A;
}

.e2c-reg-step-label[b-bztpvrz5kf] {
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--text-muted);
}

.e2c-reg-step.is-current .e2c-reg-step-label[b-bztpvrz5kf],
.e2c-reg-step.is-done .e2c-reg-step-label[b-bztpvrz5kf] {
    color: var(--text);
}

.e2c-reg-step-bar[b-bztpvrz5kf] {
    position: absolute;
    top: 17px;
    left: 50%;
    width: 100%;
    height: 2px;
    background: var(--border);
    z-index: 0;
}

.e2c-reg-step.is-done .e2c-reg-step-bar[b-bztpvrz5kf] {
    background: #1F5A8A;
}

/* ── Key/value detail grid ────────────────────────────────────────────── */
.e2c-reg-kv[b-bztpvrz5kf] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px 24px;
    margin: 0 0 18px;
}

.e2c-reg-kv > div[b-bztpvrz5kf] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.e2c-reg-kv dt[b-bztpvrz5kf] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted);
}

.e2c-reg-kv dd[b-bztpvrz5kf] {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text);
}

.e2c-reg-ref[b-bztpvrz5kf] {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 0.84rem;
    background: rgba(31, 90, 138, 0.08);
    color: #163E63;
    border-radius: 6px;
    padding: 2px 8px;
}

/* Dark mode — the deep-blue ink is near-invisible on the dark surface (WCAG 1.4.3);
   flip to the light portal blue on a lighter blue tint. */
html[data-theme="dark"] .e2c-reg-ref[b-bztpvrz5kf] {
    background: rgba(127, 184, 232, 0.14);
    color: #A8CCEC;
}

/* ── Status row ───────────────────────────────────────────────────────── */
.e2c-reg-statuses[b-bztpvrz5kf] {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}

.e2c-reg-status[b-bztpvrz5kf] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.e2c-reg-status-cap[b-bztpvrz5kf] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted);
}

/* ── Subjects list ────────────────────────────────────────────────────── */
.e2c-reg-subjects[b-bztpvrz5kf] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.e2c-reg-subject[b-bztpvrz5kf] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    border-top: 1px solid var(--border);
}

.e2c-reg-subject:first-child[b-bztpvrz5kf] {
    border-top: none;
}

.e2c-reg-subject-icon[b-bztpvrz5kf] {
    font-size: 1.1rem;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: rgba(31, 90, 138, 0.1);
    flex: 0 0 auto;
}

.e2c-reg-subject-body[b-bztpvrz5kf] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
    flex: 1 1 auto;
}

.e2c-reg-subject-name[b-bztpvrz5kf] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text);
}

.e2c-reg-subject-meta[b-bztpvrz5kf] {
    font-size: 0.76rem;
    color: var(--text-muted);
}

.e2c-reg-subject-trail[b-bztpvrz5kf] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 0 0 auto;
}

.e2c-reg-subject-fee[b-bztpvrz5kf] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text);
}

/* ── Fees ─────────────────────────────────────────────────────────────── */
.e2c-reg-fees[b-bztpvrz5kf] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.e2c-reg-fee-row[b-bztpvrz5kf] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 0.86rem;
    color: var(--text-muted);
}

.e2c-reg-fee-total[b-bztpvrz5kf] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 6px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
    font-size: 0.98rem;
    font-weight: 800;
    color: var(--text);
}

.e2c-reg-fee-status[b-bztpvrz5kf] {
    margin-top: 14px;
}

/* ── Help / correction card ───────────────────────────────────────────── */
.e2c-reg-help-copy[b-bztpvrz5kf] {
    font-size: 0.84rem;
    line-height: 1.5;
    color: var(--text-muted);
    margin: 4px 0 16px;
}

.e2c-reg-help .e2c-reg-action[b-bztpvrz5kf] {
    margin-bottom: 6px;
}

/* WhatsApp link — ::deep because the class sits on a MudButton root (child-component
   roots never get the CSS-isolation scope attribute). #1F8A4C was 4.4:1 on white /
   3.7:1 on dark — both below AA; these clear 4.5:1 in their theme. */
[b-bztpvrz5kf] .e2c-reg-wa {
    color: #177A42;
}

html[data-theme="dark"] .e2c-reg[b-bztpvrz5kf]  .e2c-reg-wa {
    color: #25D366;
}

/* ── Empty / onboarding ───────────────────────────────────────────────── */
.e2c-reg-empty[b-bztpvrz5kf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 6px;
    padding: 40px 24px;
}

.e2c-reg-empty-glyph[b-bztpvrz5kf] {
    font-size: 2.4rem;
}

.e2c-reg-empty-title[b-bztpvrz5kf] {
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--text);
    margin: 6px 0 0;
}

.e2c-reg-empty-sub[b-bztpvrz5kf] {
    font-size: 0.86rem;
    color: var(--text-muted);
    max-width: 460px;
    margin: 0;
}

.e2c-reg-empty-actions[b-bztpvrz5kf] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

/* ── Responsive ───────────────────────────────────────────────────────── */
@media (max-width: 900px) {
    .e2c-reg-grid[b-bztpvrz5kf] {
        grid-template-columns: 1fr;
    }

    .e2c-reg-kv[b-bztpvrz5kf] {
        grid-template-columns: 1fr;
    }

    .e2c-reg-step-label[b-bztpvrz5kf] {
        font-size: 0.66rem;
    }
}

/* Open correction requests the student is waiting on (#424). */
.e2c-reg-corr-open[b-bztpvrz5kf] {
    margin: 10px 0;
    border-radius: 10px;
    font-size: 0.82rem;
}
/* /Components/Pages/Student/Resources.razor.rz.scp.css */
/* ── Page layout ──────────────────────────────────────────────────── */
.e2c-res[b-khq61lizen] {
    display: flex;
    flex-direction: column;
    gap: 26px;
    padding: 28px;
}

@media (max-width: 820px) {
    .e2c-res[b-khq61lizen] { padding: 16px; }
}

.e2c-res-head[b-khq61lizen] {
    margin-bottom: 14px;
}

.e2c-res-title[b-khq61lizen] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--text);
    margin: 0;
}

.e2c-res-sub[b-khq61lizen] {
    font-size: 0.82rem;
    color: var(--text-muted);
    margin: 4px 0 0;
}

/* ── Card shell ───────────────────────────────────────────────────── */
[b-khq61lizen] .e2c-res-card {
    padding: 20px 22px;
    border-radius: 16px;
    border-color: var(--border);
    background: var(--surface);
}

/* ── Subject cards grid ───────────────────────────────────────────── */
.e2c-res-grid[b-khq61lizen] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

[b-khq61lizen] .e2c-res-subject {
    padding: 18px 18px 16px;
    border-radius: 16px;
    border-color: var(--border);
    background: var(--surface);
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.e2c-res-subject-top[b-khq61lizen] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.e2c-res-subject-headtext[b-khq61lizen] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.e2c-res-subject-icon[b-khq61lizen] {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    font-size: 1.2rem;
}

.e2c-res-subject-level[b-khq61lizen] {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-muted);
    background: var(--surface-2);
    padding: 3px 9px;
    border-radius: 999px;
}

.e2c-res-subject-name[b-khq61lizen] {
    font-weight: 700;
    font-size: 1rem;
    color: var(--text);
}

.e2c-res-subject-meta[b-khq61lizen] {
    font-size: 0.82rem;
    color: var(--text-muted);
}

.e2c-res-subject-syl[b-khq61lizen] {
    font-size: 0.78rem;
    color: #1F5A8A;
    font-weight: 600;
}

.e2c-res-browse[b-khq61lizen] {
    margin-top: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 9px 12px;
    border: 1.5px solid;
    border-radius: 10px;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    background: transparent;
    transition: background 0.12s ease;
}
.e2c-res-browse:hover[b-khq61lizen] { background: rgba(31, 90, 138, 0.06); }

.e2c-res-browse-arrow[b-khq61lizen] { font-size: 1rem; }

.e2c-res-browse-empty[b-khq61lizen] {
    border-color: var(--border) !important;
    color: var(--text-muted) !important;
    cursor: default;
    font-weight: 500;
}
.e2c-res-browse-empty:hover[b-khq61lizen] { background: transparent; }

/* ── Books table ──────────────────────────────────────────────────── */
.e2c-res-table-wrap[b-khq61lizen] { overflow-x: auto; }

.e2c-res-table[b-khq61lizen] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.86rem;
}

.e2c-res-table thead th[b-khq61lizen] {
    text-align: left;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted);
    padding: 0 14px 10px;
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}

.e2c-res-table tbody td[b-khq61lizen] {
    padding: 12px 14px;
    border-bottom: 1px solid var(--border);
    color: var(--text);
    vertical-align: middle;
}
.e2c-res-table tbody tr:last-child td[b-khq61lizen] { border-bottom: none; }
.e2c-res-table tbody tr:hover[b-khq61lizen] { background: var(--surface-2); }

.e2c-res-th-r[b-khq61lizen], .e2c-res-td-r[b-khq61lizen] { text-align: right; }

.e2c-res-item[b-khq61lizen] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.e2c-res-item-icon[b-khq61lizen] {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    font-size: 1rem;
}

.e2c-res-item-body[b-khq61lizen] {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
    min-width: 0;
}

.e2c-res-item-name[b-khq61lizen] {
    font-weight: 600;
    color: var(--text);
}

.e2c-res-item-meta[b-khq61lizen] {
    font-size: 0.78rem;
    color: var(--text-muted);
}

.e2c-res-ref[b-khq61lizen] {
    font-family: ui-monospace, 'SFMono-Regular', Menlo, monospace;
    font-size: 0.8rem;
    color: #1F5A8A;
    font-weight: 600;
}

.e2c-res-muted[b-khq61lizen] { color: var(--text-muted); font-variant-numeric: tabular-nums; }

.e2c-res-dl[b-khq61lizen] {
    color: #1F5A8A;
    font-weight: 600;
    font-size: 0.82rem;
    text-decoration: underline;
    cursor: pointer;
}

.e2c-res-dl:focus-visible[b-khq61lizen] {
    outline: 2px solid #1F5A8A;
    outline-offset: 2px;
    border-radius: 4px;
}

/* ── Empty / onboarding state ─────────────────────────────────────── */
.e2c-res-empty[b-khq61lizen] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 40px 16px;
    gap: 4px;
}
.e2c-res-empty-glyph[b-khq61lizen] { font-size: 1.9rem; }
.e2c-res-empty-title[b-khq61lizen] { font-weight: 700; color: var(--text); margin: 8px 0 0; }
.e2c-res-empty-sub[b-khq61lizen] { font-size: 0.84rem; color: var(--text-muted); margin: 0; max-width: 380px; }
.e2c-res-empty-link[b-khq61lizen] {
    margin-top: 10px;
    font-size: 0.85rem;
    font-weight: 600;
    color: #1F5A8A;
    text-decoration: none;
}
.e2c-res-empty-link:hover[b-khq61lizen] { text-decoration: underline; }

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 1100px) {
    .e2c-res-grid[b-khq61lizen] { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
    .e2c-res-grid[b-khq61lizen] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Syllabus.razor.rz.scp.css */
/* ── Body ─────────────────────────────────────────────────────── */
.syl-body[b-t83iowky3u] { max-width: 1040px; margin: 0 auto; padding: 48px 24px 0; }

.syl-group[b-t83iowky3u] { margin-bottom: 44px; }
.syl-group-head[b-t83iowky3u] {
    display: flex;
    align-items: baseline;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}
.syl-group-title[b-t83iowky3u] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.92rem;
    font-weight: 800;
    color: var(--ink-900);
}
.syl-group-count[b-t83iowky3u] { font-size: 0.82rem; color: var(--ink-500); font-weight: 600; }

.syl-grid[b-t83iowky3u] { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

.syl-row[b-t83iowky3u] {
    display: flex;
    align-items: center;
    gap: 14px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 14px 16px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.syl-row:hover[b-t83iowky3u] { border-color: rgba(31, 90, 138, 0.35); box-shadow: 0 8px 22px var(--shadow); }

.syl-badge[b-t83iowky3u] {
    flex: 0 0 auto;
    width: 36px; height: 36px;
    border-radius: 8px;
    background: #E84545;
    color: #fff;
    display: grid; place-items: center;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.syl-meta[b-t83iowky3u] { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.syl-name[b-t83iowky3u] { font-size: 0.95rem; font-weight: 700; color: var(--ink-900); }
.syl-unit[b-t83iowky3u] {
    display: inline-block;
    margin-left: 7px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #4E7D24;
    background: rgba(111, 174, 63, 0.16);
    padding: 2px 7px;
    border-radius: 999px;
    vertical-align: middle;
}
.syl-sub[b-t83iowky3u] { font-size: 0.78rem; color: var(--ink-500); }

.syl-dl[b-t83iowky3u] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--brand-blue);
    text-decoration: none;
    padding: 6px 10px;
    border-radius: 8px;
    white-space: nowrap;
}
.syl-dl:hover[b-t83iowky3u] { background: rgba(31, 90, 138, 0.08); color: var(--brand-blue-deep); }
.syl-dl-icon[b-t83iowky3u] { font-size: 1.05rem; line-height: 1; }
.syl-dl-soon[b-t83iowky3u] { color: var(--ink-500); font-weight: 600; cursor: default; }
.syl-dl-soon:hover[b-t83iowky3u] { background: none; color: var(--ink-500); }

/* ── Empty state ──────────────────────────────────────────────── */
.syl-empty[b-t83iowky3u] {
    text-align: center;
    background: var(--paper-warm);
    border: 1px dashed var(--border);
    border-radius: 18px;
    padding: 56px 24px;
    max-width: 560px;
    margin: 0 auto 32px;
}
.syl-empty-icon[b-t83iowky3u] { font-size: 2.4rem; margin-bottom: 12px; }
.syl-empty h2[b-t83iowky3u] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: 1.3rem;
    color: var(--ink-900);
    margin: 0 0 10px;
}
.syl-empty p[b-t83iowky3u] { color: var(--ink-700); font-size: 0.92rem; margin: 0; }
.syl-empty a[b-t83iowky3u] { color: var(--brand-blue); font-weight: 600; }

@media (max-width: 720px) {
    .syl-grid[b-t83iowky3u] { grid-template-columns: 1fr; }
}
/* /Components/Pages/UnifiedSignup.razor.rz.scp.css */

/* Silent identity records check — bare spinner, no wording (sponsorship pre-check) */
/* Silent records check. Fixed height and no layout participation change: the spinner appears and
   disappears on every name/DOB edit, and reflowing the form each time reads as a visual glitch. */
.usx-idcheck[b-jtvdk0ygjb] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 18px;
    margin-top: 2px;
    padding: 0 .1rem;
    opacity: .7;
    pointer-events: none;
}
/* /Components/Pages/Worker/Dashboard.razor.rz.scp.css */
/* ── Dashboard layout ─────────────────────────────────────────────── */
.e2c-dash[b-wvbg58oql8] {
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.e2c-dash-stats[b-wvbg58oql8] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.e2c-dash-grid[b-wvbg58oql8] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 16px;
    align-items: start;
}

/* ── Card shell ───────────────────────────────────────────────────── */
[b-wvbg58oql8] .e2c-card {
    padding: 20px 22px;
    border-radius: 16px;
    border-color: var(--border);
    background: var(--surface);
}

.e2c-card-head[b-wvbg58oql8] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.e2c-card-title[b-wvbg58oql8] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--text);
    margin: 0;
}

.e2c-card-sub[b-wvbg58oql8] {
    font-size: 0.82rem;
    color: var(--text-muted);
    margin: 4px 0 0;
}

.e2c-card-link[b-wvbg58oql8] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #E36A1A;
    text-decoration: none;
    white-space: nowrap;
}
.e2c-card-link:hover[b-wvbg58oql8] { text-decoration: underline; }

/* Worker-green link variant */
.e2c-link-green[b-wvbg58oql8] { color: #3F7321; }

/* ── Queues & task list ───────────────────────────────────────────── */
.e2c-queue[b-wvbg58oql8], .e2c-tasks[b-wvbg58oql8] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.e2c-queue-row[b-wvbg58oql8] { border-top: 1px solid var(--border); }
.e2c-queue-row:first-child[b-wvbg58oql8] { border-top: none; }

.e2c-queue-link[b-wvbg58oql8], .e2c-task-row[b-wvbg58oql8] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 4px;
    text-decoration: none;
    color: inherit;
    border-radius: 10px;
    transition: background 0.12s ease;
}
/* Worker-green hover tint */
.e2c-queue-link:hover[b-wvbg58oql8], .e2c-task-row:hover[b-wvbg58oql8] { background: rgba(111, 174, 63, 0.08); }

.e2c-queue-icon[b-wvbg58oql8], .e2c-task-icon[b-wvbg58oql8] {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    font-size: 1rem;
    background: var(--border);
}

/* Worker-green icon tile */
.e2c-icon-green[b-wvbg58oql8] { background: rgba(111, 174, 63, 0.16); }

.e2c-queue-body[b-wvbg58oql8], .e2c-task-body[b-wvbg58oql8] {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
    flex: 1;
    min-width: 0;
}

.e2c-queue-title[b-wvbg58oql8], .e2c-task-title[b-wvbg58oql8] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--text);
}

.e2c-queue-meta[b-wvbg58oql8], .e2c-task-sub[b-wvbg58oql8] {
    font-size: 0.78rem;
    color: var(--text-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.e2c-queue-trail[b-wvbg58oql8] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
}

.e2c-queue-arrow[b-wvbg58oql8], .e2c-task-arrow[b-wvbg58oql8] {
    color: var(--text-muted);
    font-size: 1.1rem;
}

/* ── Forms table ──────────────────────────────────────────────────── */
.e2c-table-wrap[b-wvbg58oql8] { overflow-x: auto; }

.e2c-table[b-wvbg58oql8] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.86rem;
}

.e2c-table thead th[b-wvbg58oql8] {
    text-align: left;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted);
    padding: 0 14px 10px;
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}

.e2c-table tbody td[b-wvbg58oql8] {
    padding: 12px 14px;
    border-bottom: 1px solid var(--border);
    color: var(--text);
    vertical-align: middle;
}
.e2c-table tbody tr:last-child td[b-wvbg58oql8] { border-bottom: none; }
.e2c-table tbody tr:hover[b-wvbg58oql8] { background: rgba(15, 27, 45, 0.015); }

.e2c-th-r[b-wvbg58oql8], .e2c-td-r[b-wvbg58oql8] { text-align: right; }

.e2c-ref[b-wvbg58oql8] {
    font-family: ui-monospace, 'SFMono-Regular', Menlo, monospace;
    font-size: 0.8rem;
    color: #3F7321;
    font-weight: 600;
}

.e2c-strong[b-wvbg58oql8] { font-weight: 600; color: var(--text); }
.e2c-muted[b-wvbg58oql8] { color: var(--text-muted); font-variant-numeric: tabular-nums; }

/* ── Empty states ─────────────────────────────────────────────────── */
.e2c-empty[b-wvbg58oql8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 36px 16px;
    gap: 4px;
}
.e2c-empty-glyph[b-wvbg58oql8] { font-size: 1.8rem; }
.e2c-empty-title[b-wvbg58oql8] { font-weight: 700; color: var(--text); margin: 6px 0 0; }
.e2c-empty-sub[b-wvbg58oql8] { font-size: 0.84rem; color: var(--text-muted); margin: 0; max-width: 320px; }

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 1100px) {
    .e2c-dash-grid[b-wvbg58oql8] { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
    .e2c-dash[b-wvbg58oql8] { padding: 16px; }
}
@media (max-width: 720px) {
    .e2c-dash-stats[b-wvbg58oql8] { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 420px) {
    .e2c-dash-stats[b-wvbg58oql8] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Worker/Leave.razor.rz.scp.css */
.wl-page[b-d2xvm4bwhm] {
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 22px;
}

@media (max-width: 720px) {
    .wl-page[b-d2xvm4bwhm] { padding: 16px; }
}

/* ── Stat row ─────────────────────────────────────────────────── */
.wl-stats[b-d2xvm4bwhm] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

@media (max-width: 720px) {
    .wl-stats[b-d2xvm4bwhm] { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 460px) {
    .wl-stats[b-d2xvm4bwhm] { grid-template-columns: 1fr; }
}

/* ── Cards ────────────────────────────────────────────────────── */
[b-d2xvm4bwhm] .wl-card {
    border-radius: 16px;
    border-color: var(--border);
    background: var(--surface);
    overflow: hidden;
}

.wl-card-head[b-d2xvm4bwhm] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 22px 14px;
}

.wl-card-head h2[b-d2xvm4bwhm] {
    margin: 0;
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-size: 1.12rem;
    font-weight: 800;
    color: var(--text);
}

.wl-card-head p[b-d2xvm4bwhm] {
    margin: 4px 0 0;
    font-size: 0.85rem;
    color: var(--text-muted);
    line-height: 1.45;
}

/* ── Table ────────────────────────────────────────────────────── */
.wl-table-scroll[b-d2xvm4bwhm] { overflow-x: auto; }
.wl-grid-table[b-d2xvm4bwhm] { border: none; }

.wl-type[b-d2xvm4bwhm] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 999px;
    white-space: nowrap;
}

.wl-type-vacation[b-d2xvm4bwhm] { background: rgba(111, 174, 63, 0.16); color: #3F7321; }
.wl-type-sick[b-d2xvm4bwhm]     { background: rgba(210, 69, 69, 0.14);  color: #9D2828; }
.wl-type-personal[b-d2xvm4bwhm] { background: rgba(31, 90, 138, 0.12);  color: #163E63; }

.wl-date[b-d2xvm4bwhm] {
    color: var(--text);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.wl-days[b-d2xvm4bwhm] {
    font-weight: 700;
    color: var(--text);
    font-variant-numeric: tabular-nums;
}

/* ── Empty / onboarding states ────────────────────────────────── */
.wl-empty[b-d2xvm4bwhm] {
    text-align: center;
    padding: 48px 24px;
}

.wl-empty-sm[b-d2xvm4bwhm] { padding: 30px 24px; }

.wl-empty-glyph[b-d2xvm4bwhm] {
    font-size: 2.2rem;
    margin-bottom: 10px;
}

.wl-empty h3[b-d2xvm4bwhm] {
    margin: 0 0 8px;
    font-weight: 700;
    color: var(--text);
}

.wl-empty p[b-d2xvm4bwhm] {
    margin: 0 auto;
    max-width: 440px;
    color: var(--text-muted);
    line-height: 1.55;
    font-size: 0.9rem;
}

/* ── Dialog title ─────────────────────────────────────────────── */
.wl-dlg-title[b-d2xvm4bwhm] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: 800;
    color: var(--text);
}

.wl-dlg-glyph[b-d2xvm4bwhm] { font-size: 1.4rem; }

.wl-dlg-sub[b-d2xvm4bwhm] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #3F7321;
}

/* ── Request form ─────────────────────────────────────────────── */
.wl-form[b-d2xvm4bwhm] {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.wl-field[b-d2xvm4bwhm] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
}

.wl-field-row[b-d2xvm4bwhm] {
    display: flex;
    gap: 14px;
}

@media (max-width: 520px) {
    .wl-field-row[b-d2xvm4bwhm] { flex-direction: column; }
}

.wl-label[b-d2xvm4bwhm] {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
}

/* ── Segmented type control — single pill track ───────────────── */
.wl-seg[b-d2xvm4bwhm] {
    display: flex;
    gap: 4px;
    padding: 4px;
    border-radius: 999px;
    background: var(--surface-2);
}

.wl-seg-btn[b-d2xvm4bwhm] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 12px;
    border: none;
    border-radius: 999px;
    background: transparent;
    color: var(--text-muted);
    font-size: 0.86rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease, box-shadow 0.12s ease;
}

.wl-seg-btn:hover[b-d2xvm4bwhm] { color: var(--text); }

.wl-seg-btn.is-active[b-d2xvm4bwhm] {
    background: var(--surface);
    color: #C2570F; /* WCAG 1.4.3 — darkened from #E36A1A to clear 4.5:1 on white surface */
    box-shadow: 0 1px 3px rgba(15, 27, 45, 0.14);
}

/* Dark theme: surface is dark, so use a lighter orange that clears 4.5:1 on it. */
html[data-theme="dark"] .wl-seg-btn.is-active[b-d2xvm4bwhm] {
    color: #F39125;
}

/* ── Live summary panel ───────────────────────────────────────── */
.wl-summary[b-d2xvm4bwhm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    background: var(--paper-warm);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 14px 16px;
}

.wl-summary.is-over[b-d2xvm4bwhm] {
    background: rgba(210, 69, 69, 0.08);
    border-color: rgba(210, 69, 69, 0.26);
}

.wl-summary-left[b-d2xvm4bwhm] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.wl-summary-text[b-d2xvm4bwhm] {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.wl-summary-cap[b-d2xvm4bwhm] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
}

.wl-summary-text strong[b-d2xvm4bwhm] {
    color: var(--text);
    font-variant-numeric: tabular-nums;
    font-size: 0.95rem;
}

.wl-summary-warn[b-d2xvm4bwhm] {
    font-size: 0.8rem;
    font-weight: 700;
    color: #9D2828;
    text-align: right;
}

/* ── Success state ────────────────────────────────────────────── */
.wl-success[b-d2xvm4bwhm] {
    text-align: center;
    padding: 22px 16px 12px;
}

.wl-success-check[b-d2xvm4bwhm] {
    width: 60px;
    height: 60px;
    margin: 0 auto 16px;
    border-radius: 50%;
    background: rgba(111, 174, 63, 0.16);
    color: #3F7321;
    display: grid;
    place-items: center;
}

.wl-success-check svg[b-d2xvm4bwhm] { display: block; }

.wl-success h3[b-d2xvm4bwhm] {
    margin: 0 0 8px;
    font-weight: 800;
    color: var(--text);
}

.wl-success p[b-d2xvm4bwhm] {
    margin: 0 auto;
    max-width: 400px;
    color: var(--text-muted);
    line-height: 1.55;
    font-size: 0.9rem;
}
/* /Components/Pages/Worker/Profile.razor.rz.scp.css */
/* ── Profile layout ───────────────────────────────────────────────── */
.e2c-profile[b-7q27v4q3zb] {
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.e2c-profile-grid[b-7q27v4q3zb] {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 16px;
    align-items: start;
}

.e2c-profile-main[b-7q27v4q3zb] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ── Card shell (mirrors dashboard) ───────────────────────────────── */
[b-7q27v4q3zb] .e2c-card {
    padding: 20px 22px;
    border-radius: 16px;
    border-color: var(--border);
    background: var(--surface);
}

.e2c-card-head[b-7q27v4q3zb] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.e2c-card-title[b-7q27v4q3zb] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--text);
    margin: 0;
}

.e2c-card-sub[b-7q27v4q3zb] {
    font-size: 0.82rem;
    color: var(--text-muted);
    margin: 4px 0 0;
}

/* ── Identity card ────────────────────────────────────────────────── */
[b-7q27v4q3zb] .e2c-profile-id {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
}

.e2c-profile-avatar[b-7q27v4q3zb] {
    width: 84px;
    height: 84px;
    font-size: 1.6rem;
    font-weight: 700;
    margin-bottom: 4px;
}

.e2c-profile-name[b-7q27v4q3zb] {
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--text);
    margin: 0;
}

.e2c-profile-role[b-7q27v4q3zb] {
    font-size: 0.82rem;
    color: var(--text-muted);
    margin: 0;
}

.e2c-profile-status[b-7q27v4q3zb] { margin: 4px 0 8px; }

.e2c-profile-photo[b-7q27v4q3zb] { margin-top: 4px; }

/* ── Form grid ────────────────────────────────────────────────────── */
.e2c-form-grid[b-7q27v4q3zb] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

.e2c-field[b-7q27v4q3zb] { min-width: 0; }
.e2c-field-full[b-7q27v4q3zb] { grid-column: 1 / -1; }

.e2c-form-divider[b-7q27v4q3zb] { margin: 20px 0 16px; }

.e2c-form-actions[b-7q27v4q3zb] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.e2c-save-btn[b-7q27v4q3zb] { min-width: 110px; }

/* ── Security rows ────────────────────────────────────────────────── */
.e2c-security-row[b-7q27v4q3zb] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 4px;
    text-decoration: none;
    color: inherit;
    border-radius: 10px;
    border-top: 1px solid var(--border);
    transition: background 0.12s ease;
}
.e2c-security-row:first-of-type[b-7q27v4q3zb] { border-top: none; }
.e2c-security-row:hover[b-7q27v4q3zb] { background: rgba(111, 174, 63, 0.08); }

.e2c-security-icon[b-7q27v4q3zb] {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    font-size: 1rem;
    background: rgba(111, 174, 63, 0.14);
}

.e2c-security-body[b-7q27v4q3zb] {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
    flex: 1;
    min-width: 0;
}

.e2c-security-title[b-7q27v4q3zb] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--text);
}

.e2c-security-sub[b-7q27v4q3zb] {
    font-size: 0.78rem;
    color: var(--text-muted);
}

.e2c-security-arrow[b-7q27v4q3zb] {
    color: var(--text-muted);
    font-size: 1.2rem;
    flex: 0 0 auto;
}

/* The notification-preference styles were removed with the card itself (#424) — no worker-facing
   sender exists, so there was nothing for the switches to change. */

/* ── Empty / onboarding state ─────────────────────────────────────── */
.e2c-empty[b-7q27v4q3zb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 36px 16px;
    gap: 6px;
}
.e2c-empty-glyph[b-7q27v4q3zb] { font-size: 1.8rem; }
.e2c-empty-title[b-7q27v4q3zb] { font-weight: 700; color: var(--text); margin: 6px 0 0; }
.e2c-empty-sub[b-7q27v4q3zb] { font-size: 0.84rem; color: var(--text-muted); margin: 0; max-width: 360px; }

.e2c-pw-link[b-7q27v4q3zb] {
    margin-top: 10px;
    font-size: 0.85rem;
    font-weight: 600;
    color: #3F7321;
    text-decoration: none;
}
.e2c-pw-link:hover[b-7q27v4q3zb] { text-decoration: underline; }

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 1000px) {
    .e2c-profile-grid[b-7q27v4q3zb] { grid-template-columns: 1fr; }
    [b-7q27v4q3zb] .e2c-profile-id { flex-direction: row; flex-wrap: wrap; justify-content: flex-start; text-align: left; }
}
@media (max-width: 820px) {
    .e2c-profile[b-7q27v4q3zb] { padding: 16px; }
}

@media (max-width: 620px) {
    .e2c-form-grid[b-7q27v4q3zb] { grid-template-columns: 1fr; }
}
/* /Components/Shared/Blocks/FeeSummaryBlock.razor.rz.scp.css */
/* Early to CXC — FeeSummary engine block (form engine v2, E2-D).
   The usx summary fee-line styles from /signup, renamed to the block-scoped fsb-* prefix.
   (.tnum tabular numerals is global in brand.css.) */

.fsb-root[b-lh80oarx3f] { display: block; }

.fsb-empty[b-lh80oarx3f] { font-size: 0.86rem; color: var(--text-muted); margin: 0; }

.fsb-block[b-lh80oarx3f] { border-top: 1px solid var(--border); padding-top: 12px; }
.fsb-row[b-lh80oarx3f] { display: flex; justify-content: space-between; gap: 12px; padding: 5px 0;
    font-size: 0.85rem; color: var(--text); }
.fsb-waive[b-lh80oarx3f] { color: #4E7D24; }
.fsb-waive em[b-lh80oarx3f] { font-style: normal; font-size: 0.78rem; }

.fsb-total[b-lh80oarx3f] { display: flex; justify-content: space-between; align-items: baseline;
    border-top: 2px solid var(--border); margin-top: 8px; padding-top: 14px;
    font-weight: 800; font-size: 1rem; color: var(--text); }
/* Total amount in orange-deep at ~22px, per the mockup (#141). */
.fsb-total .tnum[b-lh80oarx3f] { font-size: 1.4rem; color: #E36A1A; }

.fsb-disclaimer[b-lh80oarx3f] { display: flex; gap: 9px; margin-top: 12px; padding: 11px 13px;
    background: rgba(111,174,63,0.1); border-radius: 12px; font-size: 0.76rem;
    color: var(--text-muted); line-height: 1.4; }
.fsb-disclaimer strong[b-lh80oarx3f] { color: #3F7321; }
.fsb-disclaimer-icon[b-lh80oarx3f] { font-size: 1rem; flex-shrink: 0; }
/* /Components/Shared/Blocks/SubjectPickerBlock.razor.rz.scp.css */
/* Early to CXC — SubjectPicker engine block (form engine v2, E2-D).
   The usx-* subject-grid styles from /signup, renamed to the block-scoped spb-* prefix.
   Plain elements here carry the CSS-isolation scope; MudAlert roots don't, so .spb-note
   is reached via ::deep under the scoped .spb-root. */

.spb-root[b-ieapq0mmeh] { display: block; }

/* Header — label/helper on the left, the live cap badge on the right (usx-cap-badge) */
.spb-head[b-ieapq0mmeh] { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.spb-head-text[b-ieapq0mmeh] { min-width: 0; }
.spb-label[b-ieapq0mmeh] { display: block; font-weight: 600; font-size: 0.9rem; color: var(--text); }
.spb-helper[b-ieapq0mmeh] { display: block; font-size: 0.78rem; color: var(--text-muted); margin-top: 2px; }
.spb-cap[b-ieapq0mmeh] { flex-shrink: 0; font-size: 0.78rem; font-weight: 700; padding: 5px 11px;
    border-radius: 999px; background: var(--surface-2); color: var(--text-muted); }
.spb-cap.is-full[b-ieapq0mmeh] { background: rgba(243,145,37,0.14); color: var(--brand-orange-text, #B4530A); }

.spb-root[b-ieapq0mmeh]  .spb-note { margin-top: 12px; }

/* Subject tiles (usx-subjects / usx-subj) */
.spb-grid[b-ieapq0mmeh] { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.spb-subj[b-ieapq0mmeh] { border: 1.5px solid var(--border); border-radius: 14px; overflow: hidden;
    background: var(--surface); transition: border-color 0.15s ease, background 0.15s ease; }
.spb-subj.is-on[b-ieapq0mmeh] { border-color: var(--brand-orange-text, #B4530A); background: rgba(243,145,37,0.05); }
.spb-subj.is-locked[b-ieapq0mmeh] { opacity: 0.5; }
.spb-subj-main[b-ieapq0mmeh] { display: flex; align-items: center; gap: 12px; width: 100%; padding: 14px;
    background: transparent; border: none; cursor: pointer; text-align: left; }
.spb-subj-main:disabled[b-ieapq0mmeh] { cursor: not-allowed; }
.spb-subj-icon[b-ieapq0mmeh] { width: 42px; height: 42px; border-radius: 11px; display: grid; place-items: center;
    font-size: 1.2rem; flex-shrink: 0; }
.spb-subj-text[b-ieapq0mmeh] { flex: 1; min-width: 0; }
.spb-subj-name[b-ieapq0mmeh] { display: block; font-weight: 700; font-size: 0.95rem; color: var(--text); }
.spb-oral-tag[b-ieapq0mmeh] { display: inline-block; margin-left: 6px; font-size: 0.62rem; font-weight: 700;
    letter-spacing: 0.04em; padding: 2px 7px; border-radius: 999px; vertical-align: middle;
    background: rgba(31,90,138,0.12); color: #1F5A8A; }
/* #404 — subject restricted to specific candidate types (e.g. "Resit candidates only") */
.spb-restrict-tag[b-ieapq0mmeh] { display: inline-block; margin-left: 6px; font-size: 0.62rem; font-weight: 700;
    letter-spacing: 0.04em; padding: 2px 7px; border-radius: 999px; vertical-align: middle;
    background: rgba(227,106,26,0.14); color: #B4530F; }
.spb-subj-check[b-ieapq0mmeh] { width: 24px; height: 24px; border-radius: 7px; display: grid; place-items: center;
    border: 1.5px solid var(--border); color: #fff; font-weight: 800; flex-shrink: 0; }
.spb-subj.is-on .spb-subj-check[b-ieapq0mmeh] { background: #E36A1A; border-color: var(--brand-orange-text, #B4530A); }

/* CAPE per-subject unit sub-selection (usx-unit-row / usx-unit) */
.spb-unit-row[b-ieapq0mmeh] { display: flex; gap: 8px; padding: 0 14px 14px 68px; }
.spb-unit[b-ieapq0mmeh] { border: 1px solid var(--border); background: var(--surface); border-radius: 8px;
    padding: 5px 12px; font-size: 0.78rem; font-weight: 600; cursor: pointer; color: var(--text); }
.spb-unit.is-on[b-ieapq0mmeh] { background: #163E63; border-color: #163E63; color: #fff; }

@media (max-width: 600px) {
    .spb-grid[b-ieapq0mmeh] { grid-template-columns: 1fr; }
}
/* /Components/Shared/CartWidget.razor.rz.scp.css */
/* Early to CXC — floating cart widget. Brand orange FAB + slide-in panel. */

/* ── Floating action button (bottom-left pill) ───────────────────────
   Bottom-left so it clears any right-side panels. Shows the cart mark +
   item count + running total; rendered only when the cart has items. */
.cw-fab-wrap[b-pvjxc1isly] {
    position: fixed;
    left: 20px;
    bottom: 20px;
    z-index: 1300;
}

.cw-fab[b-pvjxc1isly] {
    position: relative;
    min-width: 0;
    height: 52px;
    padding: 0 20px 0 16px;
    border: none;
    border-radius: 999px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--brand-orange-deep, #E36A1A);
    color: #fff;
    font-family: inherit;
    font-weight: 700;
    font-size: 0.875rem;
    box-shadow: 0 8px 24px rgba(227, 106, 26, 0.4);
    transition: filter 0.15s ease, transform 0.08s ease, box-shadow 0.15s ease;
}
.cw-fab:hover[b-pvjxc1isly] {
    filter: brightness(1.06);
    box-shadow: 0 10px 28px rgba(227, 106, 26, 0.5);
    transform: translateY(-2px);
}
.cw-fab:active[b-pvjxc1isly] { transform: translateY(0); }

.cw-fab-icon[b-pvjxc1isly] {
    position: relative;
    display: inline-flex;
    align-items: center;
    font-size: 1.25rem;
    line-height: 1;
}
.cw-fab-total[b-pvjxc1isly] { line-height: 1; }

/* Count badge pinned to the cart mark's top-right corner. */
.cw-fab-badge[b-pvjxc1isly] {
    position: absolute;
    top: -8px;
    right: -10px;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 999px;
    background: #fff;
    color: var(--brand-orange-deep, #E36A1A);
    font-size: 0.6875rem;
    font-weight: 800;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

/* ── Overlay ─────────────────────────────────────────────────────── */
.cw-overlay[b-pvjxc1isly] {
    position: fixed;
    inset: 0;
    background: rgba(15, 27, 45, 0.45);
    z-index: 1399;
    animation: cw-fade-b-pvjxc1isly 0.18s ease;
}
@keyframes cw-fade-b-pvjxc1isly { from { opacity: 0; } to { opacity: 1; } }

/* ── Slide-in panel (self-contained, no MudDrawer) ──────────────────
   Fixed to the right edge. Closed = translated fully off-screen so it
   never adds to document width (no horizontal scroll). */
.cw-panel-wrap[b-pvjxc1isly] {
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    width: min(420px, 100%);
    max-width: 100vw;
    z-index: 1400;
    background: var(--paper, #FAF6EE);
    font-family: 'Roboto', system-ui, -apple-system, sans-serif;
    box-shadow: -8px 0 28px var(--shadow, rgba(15, 27, 45, 0.22));
    transform: translateX(100%);
    transition: transform 0.25s ease;
    will-change: transform;
    /* Closed: off-screen AND inert, so it can never intercept clicks on the FAB (#32). */
    pointer-events: none;
}
.cw-panel-wrap.is-open[b-pvjxc1isly] {
    transform: translateX(0);
    pointer-events: auto;
}

.cw-panel[b-pvjxc1isly] {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: var(--ink-900, #0F1B2D);
}

.cw-head[b-pvjxc1isly] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1.125rem 1.25rem;
    background: var(--surface, #fff);
    color: var(--text, #0F1B2D);
    border-bottom: 1px solid var(--border, rgba(15, 27, 45, 0.08));
}
.cw-head-icon[b-pvjxc1isly] {
    font-size: 1.25rem;
    line-height: 1;
    /* Render the cart mark in the brand orange */
    filter: none;
    color: var(--brand-orange-deep, #E36A1A);
}
.cw-head-title[b-pvjxc1isly] { margin: 0; font-size: 1.0625rem; font-weight: 800; color: var(--text, #0F1B2D); }
.cw-head-count[b-pvjxc1isly] { font-size: 0.8125rem; color: var(--text-muted, #5A6B82); }
[b-pvjxc1isly] .cw-close { color: var(--text-muted, #5A6B82); margin-left: auto; }

/* ── Lines ───────────────────────────────────────────────────────── */
.cw-lines[b-pvjxc1isly] {
    list-style: none;
    margin: 0;
    padding: 0.5rem 0.75rem;
    flex: 1;
    overflow-y: auto;
}
.cw-line[b-pvjxc1isly] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    padding: 0.85rem 0.5rem;
    border-bottom: 1px dashed var(--ink-100, #D9E0EA);
}
.cw-line-icon[b-pvjxc1isly] {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: rgba(243, 145, 37, 0.11);
    color: var(--brand-orange-deep, #E36A1A);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    line-height: 1;
}
.cw-line-main[b-pvjxc1isly] { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0.2rem; }
.cw-line-name[b-pvjxc1isly] { font-weight: 600; font-size: 0.95rem; line-height: 1.25; }
.cw-line-meta[b-pvjxc1isly] { font-size: 0.78rem; color: var(--ink-500, #5A6B82); }
.cw-line-kind[b-pvjxc1isly] {
    font-size: 0.66rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 700;
    color: var(--brand-orange-deep, #E36A1A);
}

.cw-line-qty[b-pvjxc1isly] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.35rem;
}
.cw-step[b-pvjxc1isly] {
    width: 26px;
    height: 26px;
    border-radius: 7px;
    border: 1px solid var(--ink-300, #9AA8BC);
    background: var(--surface, #fff);
    color: var(--ink-700, #2A3A52);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: border-color 0.12s, color 0.12s;
}
.cw-step:hover[b-pvjxc1isly] { border-color: var(--brand-orange, #F39125); color: var(--brand-orange-deep, #E36A1A); }
.cw-step-val[b-pvjxc1isly] { min-width: 1.4ch; text-align: center; font-weight: 700; }

.cw-line-right[b-pvjxc1isly] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.4rem;
    flex: 0 0 auto;
}
.cw-line-total[b-pvjxc1isly] { font-weight: 700; font-size: 0.95rem; white-space: nowrap; }
.cw-remove[b-pvjxc1isly] {
    width: 24px; /* 2.5.8 minimum */
    height: 24px;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-size: 1.1rem;
    line-height: 1;
    color: var(--text-muted /* 1.4.3: ink-300 was 2.4:1 */, #9AA8BC);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: color 0.12s ease;
}
.cw-remove:hover[b-pvjxc1isly] { color: #D24545; }

/* ── Empty state ─────────────────────────────────────────────────── */
.cw-empty[b-pvjxc1isly] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 2.5rem 1.5rem;
}
.cw-empty-icon[b-pvjxc1isly] { font-size: 3rem; opacity: 0.6; margin-bottom: 0.5rem; }
.cw-empty h3[b-pvjxc1isly] { font-size: 1.15rem; font-weight: 800; color: var(--brand-blue-deep, #163E63); margin: 0 0 0.4rem; }
.cw-empty p[b-pvjxc1isly] { color: var(--ink-500, #5A6B82); margin: 0 0 1.2rem; max-width: 28ch; line-height: 1.45; }
.cw-empty-cta[b-pvjxc1isly] {
    color: var(--brand-orange-deep, #E36A1A);
    font-weight: 700;
    text-decoration: none;
}
.cw-empty-cta:hover[b-pvjxc1isly] { text-decoration: underline; }

/* ── Footer / totals ─────────────────────────────────────────────── */
.cw-foot[b-pvjxc1isly] {
    border-top: 1px solid var(--ink-100, #D9E0EA);
    background: var(--surface, #fff);
    padding: 1.1rem 1.25rem 1.25rem;
}
.cw-subtotal[b-pvjxc1isly] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-weight: 800;
    font-size: 1.1rem;
    color: var(--text, #0F1B2D);
    margin-bottom: 0.9rem;
}
.cw-subtotal .tnum[b-pvjxc1isly] { color: var(--brand-orange-deep, #E36A1A); }
.cw-checkout[b-pvjxc1isly] {
    display: block;
    width: 100%;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    background: var(--brand-orange, #F39125);
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
    font-family: inherit;
    padding: 0.85rem 1rem;
    transition: background 0.15s ease, transform 0.05s ease;
}
.cw-checkout:hover[b-pvjxc1isly] { background: var(--brand-orange-deep, #E36A1A); }
.cw-checkout:active[b-pvjxc1isly] { transform: translateY(1px); }
/* /Components/Shared/FormRenderer.razor.rz.scp.css */
/* Early to CXC — shared dynamic-form renderer (form engine v2).
   Section + field styles extracted verbatim from the /forms/{slug} page; the host page keeps the
   surrounding chrome (shell, card, submit button, footer). Everything under the root uses ::deep:
   code-built render fragments and Mud component roots don't carry the CSS-isolation scope
   attribute, but they all live under .fr2-root, which does. */

.fr2-root[b-9tdpbogx11] { display: block; }

/* ── Sections + fields ─────────────────────────────────────────────── */
.fr2-root[b-9tdpbogx11]  .fr-section { margin-bottom: 28px; }
.fr2-root[b-9tdpbogx11]  .fr-section-title { font-family: 'Plus Jakarta Sans','Inter',system-ui,sans-serif; font-weight: 700;
    font-size: 1.08rem; color: var(--ink-900, #0F1B2D); margin: 0 0 16px;
    padding-left: 12px; border-left: 3px solid #F39125; }
/* Width grid (#348): 6 columns so Full/Half/Third span 6/3/2 — consecutive Half or Third
   fields share a row automatically via grid auto-placement. */
.fr2-root[b-9tdpbogx11]  .fr-fields { display: grid; grid-template-columns: repeat(6, 1fr); gap: 18px; }
.fr2-root[b-9tdpbogx11]  .fr-field { min-width: 0; grid-column: span 6; }
.fr2-root[b-9tdpbogx11]  .fr-w-full { grid-column: span 6; }
.fr2-root[b-9tdpbogx11]  .fr-w-half { grid-column: span 3; }
.fr2-root[b-9tdpbogx11]  .fr-w-third { grid-column: span 2; }
.fr2-root[b-9tdpbogx11]  .fr-label { font-weight: 600; font-size: 0.9rem; color: var(--ink-900, #0F1B2D); margin-bottom: 8px; }
.fr2-root[b-9tdpbogx11]  .fr-helper { font-size: 0.78rem; color: var(--ink-500, #5A6B82); margin-top: 6px; }

/* ── Multi-choice chips ─────────────────────────────────────────────── */
.fr2-root[b-9tdpbogx11]  .fr-multi-grid { display: flex; flex-wrap: wrap; gap: 10px; }
.fr2-root[b-9tdpbogx11]  .fr-chip { display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
    border: 1.5px solid var(--border-strong, rgba(15,27,45,0.14)); border-radius: 999px; padding: 8px 16px;
    font-size: 0.88rem; font-weight: 500; color: var(--ink-700, #2A3A52);
    background: var(--surface, #fff); transition: all 0.15s ease; user-select: none; }
.fr2-root[b-9tdpbogx11]  .fr-chip:hover { border-color: #F39125; }
.fr2-root[b-9tdpbogx11]  .fr-chip input { accent-color: #E36A1A; width: 15px; height: 15px; }
.fr2-root[b-9tdpbogx11]  .fr-chip-on { border-color: #E36A1A; background: rgba(243,145,37,0.08); color: #E36A1A; font-weight: 600; }

/* ── File upload ────────────────────────────────────────────────────── */
.fr2-root[b-9tdpbogx11]  .fr-dropzone { border: 1.5px dashed var(--border-strong, rgba(15,27,45,0.2)); border-radius: 14px;
    padding: 22px; text-align: center; background: var(--paper-warm, #F5EFE3);
    cursor: pointer; transition: border-color 0.15s ease; }
.fr2-root[b-9tdpbogx11]  .fr-dropzone:hover { border-color: #F39125; }
.fr2-root[b-9tdpbogx11]  .fr-dropzone-icon { font-size: 1.6rem; }
.fr2-root[b-9tdpbogx11]  .fr-dropzone-main { font-weight: 600; font-size: 0.9rem; color: var(--ink-900, #0F1B2D); margin-top: 6px; }
.fr2-root[b-9tdpbogx11]  .fr-dropzone-sub { font-size: 0.76rem; color: var(--ink-500, #5A6B82); margin-top: 4px; }
.fr2-root[b-9tdpbogx11]  .fr-file-chip { display: inline-flex; align-items: center; gap: 8px; margin-top: 10px;
    background: rgba(31,90,138,0.1); color: #1F5A8A; border-radius: 999px;
    padding: 6px 14px; font-size: 0.84rem; font-weight: 600; }

/* ── Info panel (engine block: explainer strip) ─────────────────────── */
.fr2-root[b-9tdpbogx11]  .fr-infopanel { border-radius: 12px; }

/* ── Placeholder for signup-only engine blocks (never on ad-hoc forms) ─ */
.fr2-root[b-9tdpbogx11]  .fr-block-placeholder { border: 1.5px dashed var(--border-strong, rgba(15,27,45,0.2));
    border-radius: 14px; padding: 18px 20px; background: var(--paper-warm, #F5EFE3); }
.fr2-root[b-9tdpbogx11]  .fr-block-placeholder-kind { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em;
    text-transform: uppercase; color: var(--ink-500, #5A6B82); }
.fr2-root[b-9tdpbogx11]  .fr-block-placeholder-label { font-weight: 700; font-size: 0.95rem;
    color: var(--ink-900, #0F1B2D); margin-top: 4px; }
.fr2-root[b-9tdpbogx11]  .fr-block-placeholder-note { font-size: 0.8rem; color: var(--ink-500, #5A6B82); margin-top: 4px; }

/* ── Radio cards (#140): SingleChoice with ConfigJson renderAs:"radio" — card per option,
   label + sublabel + filled dot, per the design spec's candidate-type control. ─────── */
.fr2-root[b-9tdpbogx11]  .fr-radio-list { display: flex; flex-direction: column; gap: 10px; }
.fr2-root[b-9tdpbogx11]  .fr-radio-card { display: flex; align-items: flex-start; gap: 12px; margin: 0;
    padding: 12px 14px; border: 1px solid var(--line, #E3DACC); border-radius: 12px;
    background: var(--surface, #fff); cursor: pointer;
    transition: border-color .15s ease, background .15s ease; }
.fr2-root[b-9tdpbogx11]  .fr-radio-card:hover { border-color: #F39125; }
.fr2-root[b-9tdpbogx11]  .fr-radio-card.is-selected { border-color: #E36A1A; background: rgba(243, 145, 37, .07); }
.fr2-root[b-9tdpbogx11]  .fr-radio-card input { position: absolute; opacity: 0; pointer-events: none; }
.fr2-root[b-9tdpbogx11]  .fr-radio-dot { flex: 0 0 18px; width: 18px; height: 18px; margin-top: 1px;
    border-radius: 50%; border: 2px solid var(--ink-500, #5A6B82); position: relative; }
.fr2-root[b-9tdpbogx11]  .fr-radio-card.is-selected .fr-radio-dot { border-color: #E36A1A; }
.fr2-root[b-9tdpbogx11]  .fr-radio-card.is-selected .fr-radio-dot::after { content: ""; position: absolute;
    inset: 3px; border-radius: 50%; background: #E36A1A; }
.fr2-root[b-9tdpbogx11]  .fr-radio-title { display: block; font-weight: 600; font-size: .92rem;
    color: var(--ink-900, #0F1B2D); }
.fr2-root[b-9tdpbogx11]  .fr-radio-sub { display: block; font-size: .78rem; color: var(--ink-500, #5A6B82);
    margin-top: 2px; }

/* ── Width grid, mobile (#348): collapse to a single column so phones are unaffected.
   Same specificity as the fr-w-* rules — this block must stay last so it wins. ────── */
@media (max-width: 600px) {
    .fr2-root[b-9tdpbogx11]  .fr-fields { grid-template-columns: 1fr; }
    .fr2-root[b-9tdpbogx11]  .fr-field { grid-column: auto; }
}
/* /Components/Shared/HelpdeskButton.razor.rz.scp.css */
/* Round "?" trigger button — theme-aware so it's legible on the top bar in light AND dark. */
[b-m6uveerdi1] .e2c-help-btn {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--surface-2);
    color: var(--text);
    border: 1px solid var(--border);
    font-weight: 800;
}

[b-m6uveerdi1] .e2c-help-btn:hover {
    background: var(--border);
}

/* Modal header */
.e2c-help-head[b-m6uveerdi1] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.e2c-help-chip[b-m6uveerdi1] {
    width: 26px;
    height: 26px;
    border-radius: 8px;
    display: grid;
    place-items: center;
    font-weight: 800;
    font-size: 0.85rem;
    flex: 0 0 auto;
}

.e2c-help-title[b-m6uveerdi1] {
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: -0.01em;
}

/* #425: the video-hero / play / caption rules went with the tile they styled — there is no
   training video behind them. */

.e2c-help-copy[b-m6uveerdi1] {
    font-size: 0.9rem;
    line-height: 1.55;
    color: var(--text-muted, #5A6B82);
    margin: 0;
}

.e2c-no-upper[b-m6uveerdi1] {
    text-transform: none;
}
/* /Components/Shared/LegalDocument.razor.rz.scp.css */
/* Published legal documents (#327). Long-form prose, read rather than scanned, so the measure is
   held near 70 characters and the vertical rhythm is generous. Every rule that targets the document
   body uses ::deep, because ChildContent arrives carrying the calling PAGE's scope id, not this
   component's — without ::deep the text renders completely unstyled. */

.legal-page[b-auquzrm17c] {
    max-width: 1240px;
    margin: 0 auto;
    padding: 40px 24px 80px;
}

.legal-doc[b-auquzrm17c] {
    max-width: 760px;
    margin: 0 auto;
}

.legal-lede[b-auquzrm17c] {
    font-size: 1.02rem;
    line-height: 1.7;
    color: var(--ink-700);
    margin: 0 0 32px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--border);
}

/* ── Document body ─────────────────────────────────────────────────────── */

.legal-prose[b-auquzrm17c] {
    color: var(--ink-700);
    font-size: 0.97rem;
    line-height: 1.75;
}

.legal-prose[b-auquzrm17c]  h2 {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: 1.22rem;
    color: var(--ink-900);
    margin: 40px 0 14px;
    padding-top: 8px;
    text-wrap: balance;
}

.legal-prose[b-auquzrm17c]  h2:first-child { margin-top: 0; }

.legal-prose[b-auquzrm17c]  h3 {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.02rem;
    color: var(--ink-900);
    margin: 28px 0 10px;
}

.legal-prose[b-auquzrm17c]  p { margin: 0 0 16px; }

.legal-prose[b-auquzrm17c]  ol,
.legal-prose[b-auquzrm17c]  ul {
    margin: 0 0 18px;
    padding-left: 1.5em;
}

.legal-prose[b-auquzrm17c]  li { margin-bottom: 10px; }

/* A nested list is a sub-clause (4a, 4b …) — pull it in tighter so it reads as part of its
   parent clause rather than as a new list. */
.legal-prose[b-auquzrm17c]  li > ol,
.legal-prose[b-auquzrm17c]  li > ul {
    margin: 10px 0 0;
}

.legal-prose[b-auquzrm17c]  strong { color: var(--ink-900); font-weight: 700; }

.legal-prose[b-auquzrm17c]  a {
    color: var(--brand-blue);
    font-weight: 600;
}

/* ── Contact block ─────────────────────────────────────────────────────── */

.legal-contact[b-auquzrm17c] {
    margin-top: 48px;
    padding: 24px 26px;
    background: var(--paper-warm);
    border: 1px solid var(--border);
    border-radius: 16px;
}

.legal-contact h2[b-auquzrm17c] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: 1.02rem;
    color: var(--ink-900);
    margin: 0 0 8px;
}

.legal-contact p[b-auquzrm17c] {
    margin: 0;
    color: var(--ink-700);
    font-size: 0.94rem;
}

.legal-contact a[b-auquzrm17c] { color: var(--brand-blue); font-weight: 600; }

.legal-actions[b-auquzrm17c] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 18px;
}

.legal-actions .btn[b-auquzrm17c] { padding: 10px 20px; font-weight: 700; border-radius: 10px; }

.legal-ghost[b-auquzrm17c] {
    border: 1px solid var(--border-strong, rgba(15, 27, 45, 0.18));
    color: var(--ink-700);
    background: var(--surface, #fff);
}

.legal-ghost:hover[b-auquzrm17c] { background: var(--paper-warm); }

@media (max-width: 560px) {
    .legal-page[b-auquzrm17c] { padding: 28px 18px 60px; }
    .legal-actions .btn[b-auquzrm17c] { width: 100%; }
}

/* Legal documents get printed and filed. Drop the page furniture and let the text run. */
@media print {
    .legal-contact[b-auquzrm17c], .legal-actions[b-auquzrm17c] { display: none; }
    .legal-page[b-auquzrm17c] { padding: 0; }
    .legal-doc[b-auquzrm17c] { max-width: none; }
    .legal-prose[b-auquzrm17c] { font-size: 11pt; line-height: 1.5; }
    .legal-prose[b-auquzrm17c]  h2 { page-break-after: avoid; }
}
/* /Components/Shared/NewsletterSignup.razor.rz.scp.css */
/* The notify-me box. Deliberately quieter than a hero: it appears under a "this is closed" message,
   where the page's job is to explain first and collect second. Shared tokens only, so it inherits
   both themes from whichever public page hosts it. */

.nl-box[b-8q1wlh7vu2] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 26px 28px;
    margin: 28px auto 0;
    max-width: 620px;
    box-shadow: 0 1px 2px var(--shadow);
    text-align: left;
}

.nl-title[b-8q1wlh7vu2] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-weight: 800;
    font-size: 1.12rem;
    color: var(--ink-900);
    letter-spacing: -.01em;
    margin: 0 0 6px;
}

.nl-sub[b-8q1wlh7vu2] {
    color: var(--ink-700);
    font-size: .93rem;
    line-height: 1.6;
    margin: 0 0 18px;
}

/* ── Fields ──────────────────────────────────────────────────────── */
.nl-row[b-8q1wlh7vu2] { display: grid; gap: 14px; margin-bottom: 16px; }
@media (min-width: 560px) { .nl-row[b-8q1wlh7vu2] { grid-template-columns: 1fr 1fr; } }

.nl-field[b-8q1wlh7vu2] { display: flex; flex-direction: column; gap: 6px; }

.nl-field > span[b-8q1wlh7vu2] {
    font-size: .8rem;
    font-weight: 700;
    color: var(--ink-900);
    letter-spacing: .01em;
}

.nl-input[b-8q1wlh7vu2] {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 11px 13px;
    font-size: .95rem;
    background: var(--surface-2, var(--surface));
    color: var(--ink-900);
    transition: border-color .15s ease, box-shadow .15s ease;
}

.nl-input:focus[b-8q1wlh7vu2] {
    outline: none;
    border-color: var(--brand-orange, #F39125);
    box-shadow: 0 0 0 3px rgba(243, 145, 37, .18);
}

.nl-input:disabled[b-8q1wlh7vu2] { opacity: .6; }

/* ── Interests ───────────────────────────────────────────────────── */
.nl-interests[b-8q1wlh7vu2] {
    border: none;
    padding: 0;
    margin: 0 0 18px;
}

.nl-interests legend[b-8q1wlh7vu2] {
    font-size: .8rem;
    font-weight: 700;
    color: var(--ink-900);
    padding: 0;
    margin-bottom: 9px;
}

.nl-check[b-8q1wlh7vu2] {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 7px 0;
    color: var(--ink-700);
    font-size: .92rem;
    cursor: pointer;
}

.nl-check input[b-8q1wlh7vu2] {
    width: 17px;
    height: 17px;
    accent-color: var(--brand-orange, #E36A1A);
    flex-shrink: 0;
    cursor: pointer;
}

/* ── Actions ─────────────────────────────────────────────────────── */
.nl-submit[b-8q1wlh7vu2] { width: 100%; justify-content: center; }

.nl-legal[b-8q1wlh7vu2] {
    font-size: .78rem;
    color: var(--ink-500);
    line-height: 1.5;
    margin: 12px 0 0;
    text-align: center;
}

.nl-error[b-8q1wlh7vu2] {
    background: rgba(161, 38, 38, .08);
    border: 1px solid rgba(161, 38, 38, .28);
    color: var(--danger-text, #A12626);
    border-radius: 10px;
    padding: 10px 13px;
    font-size: .87rem;
    line-height: 1.5;
    margin: 0 0 14px;
}

/* ── Done ────────────────────────────────────────────────────────── */
.nl-done[b-8q1wlh7vu2] { display: flex; gap: 14px; align-items: flex-start; }

.nl-done-tick[b-8q1wlh7vu2] {
    width: 34px;
    height: 34px;
    flex-shrink: 0;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(111, 174, 63, .16);
    color: #3F7A1E;
    font-weight: 800;
}

.nl-done strong[b-8q1wlh7vu2] {
    display: block;
    color: var(--ink-900);
    font-size: 1rem;
    margin-bottom: 4px;
}

.nl-done p[b-8q1wlh7vu2] {
    margin: 0;
    color: var(--ink-700);
    font-size: .89rem;
    line-height: 1.6;
}

@media (max-width: 560px) {
    .nl-box[b-8q1wlh7vu2] { padding: 22px 20px; }
}
/* /Components/Shared/PageHeader.razor.rz.scp.css */
.ph[b-g99b9dczgk] {
    background: var(--paper-warm);
    border-bottom: 1px solid var(--border);
}

.ph-inner[b-g99b9dczgk] {
    max-width: 1240px;
    margin: 0 auto;
    padding: 56px 24px 32px;
}

.ph-crumb[b-g99b9dczgk] {
    font-size: 0.8rem;
    color: var(--text-muted);
    margin-bottom: 10px;
}

.ph-title[b-g99b9dczgk] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.05;
    margin: 0;
    color: var(--text);
}

.ph-sub[b-g99b9dczgk] {
    font-size: 1.05rem;
    color: var(--text-muted);
    margin: 12px 0 0;
    max-width: 720px;
    line-height: 1.5;
}

@media (max-width: 640px) {
    .ph-inner[b-g99b9dczgk] { padding: 32px 20px 24px; }
}

/* Breadcrumb became nav>ol>li (1.3.1). The separator is decorative CSS, not announced text. */
.ph-crumb ol[b-g99b9dczgk] { list-style: none; display: flex; flex-wrap: wrap; gap: 0; margin: 0; padding: 0; }
.ph-crumb li[b-g99b9dczgk] { display: inline; }
.ph-crumb li + li[b-g99b9dczgk]::before { content: "/"; margin: 0 6px; opacity: 0.6; }
/* /Components/Shared/PortalTopBar.razor.rz.scp.css */
/* The top bar follows the light/dark theme toggle (was hard-coded dark navy). It uses theme
   tokens so it goes light in light mode and dark in dark mode, while the sidebar stays dark navy. */
.e2c-topbar[b-q7q9mw5i1q] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 32px;
    background: var(--surface);
    color: var(--text);
    border-bottom: 1px solid var(--border);
}

.e2c-topbar-left[b-q7q9mw5i1q] {
    min-width: 0;
}

.e2c-topbar-crumb[b-q7q9mw5i1q] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    list-style: none;
    margin: 0 0 4px;
    padding: 0;
    font-size: 12px;
    color: var(--text-muted);
}

.e2c-topbar-crumb li[b-q7q9mw5i1q] {
    display: inline;
}

/* Recreate the original " / " separator between crumbs without it being read as content. */
.e2c-topbar-crumb li + li[b-q7q9mw5i1q]::before {
    content: "/";
    margin: 0 6px;
    color: var(--text-muted);
}

.e2c-topbar-title[b-q7q9mw5i1q] {
    font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -0.01em;
    line-height: 1.15;
    margin: 0;
    color: var(--text);
}

.e2c-topbar-sub[b-q7q9mw5i1q] {
    font-size: 13.5px;
    color: var(--text-muted);
    margin: 4px 0 0;
}

.e2c-topbar-right[b-q7q9mw5i1q] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.e2c-topbar-actions[b-q7q9mw5i1q] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Action buttons (e.g. Export) — legible on the now theme-coloured top bar in both modes. */
[b-q7q9mw5i1q] .e2c-topbar-action {
    color: var(--text);
    border-color: var(--border-strong, var(--border));
    text-transform: none;
    font-weight: 600;
}
[b-q7q9mw5i1q] .e2c-topbar-action:hover {
    border-color: var(--brand-orange, #E36A1A);
    background: var(--surface-2);
}

/* Mobile: hide the help button, tighten padding (DESIGN_SCREENS_SPEC §4c / §11.1) */
@media (max-width: 820px) {
    .e2c-topbar[b-q7q9mw5i1q] {
        padding: 14px 16px;
    }

    .e2c-topbar-title[b-q7q9mw5i1q] {
        font-size: 20px;
    }

    .e2c-topbar-help[b-q7q9mw5i1q] {
        display: none;
    }
}
/* /Components/Shared/ReportProblem.razor.rz.scp.css */
/* #453 — floating report button. Deliberately small and low-contrast: it must be findable when
   something breaks, not compete with the page's own actions. */
.e2c-rp-fab[b-501rfopaj3] {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 1200;
    width: 44px;
    height: 44px;
    border-radius: 999px;
    border: 1px solid var(--border, rgba(0, 0, 0, .12));
    background: var(--surface, #fff);
    box-shadow: 0 2px 10px rgba(0, 0, 0, .14);
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
    opacity: .78;
    transition: opacity .15s ease, transform .15s ease;
}
.e2c-rp-fab:hover[b-501rfopaj3],
.e2c-rp-fab:focus-visible[b-501rfopaj3] {
    opacity: 1;
    transform: translateY(-1px);
}

.e2c-rp-title[b-501rfopaj3] { display: flex; align-items: center; gap: 10px; font-weight: 700; }

.e2c-rp-context[b-501rfopaj3] {
    margin: 0 0 12px;
    font-size: 0.8rem;
    color: var(--text-muted, #666);
}
.e2c-rp-context code[b-501rfopaj3] {
    background: rgba(0, 0, 0, .05);
    border-radius: 5px;
    padding: 1px 6px;
}

.e2c-rp-body[b-501rfopaj3] { margin-top: 12px; }

.e2c-rp-upload[b-501rfopaj3] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
    flex-wrap: wrap;
}

.e2c-rp-alert[b-501rfopaj3] { margin-top: 12px; border-radius: 10px; }

.e2c-rp-note[b-501rfopaj3] {
    margin: 14px 0 0;
    font-size: 0.75rem;
    line-height: 1.45;
    color: var(--text-muted, #666);
}

/* On a phone the button sits above the thumb zone rather than under it. */
@media (max-width: 640px) {
    .e2c-rp-fab[b-501rfopaj3] { right: 12px; bottom: 76px; }
}

@media print {
    .e2c-rp-fab[b-501rfopaj3] { display: none; }
}
/* /Components/Shared/StatCard.razor.rz.scp.css */
.e2c-statcard[b-jv7kd0m2dd] {
    padding: 20px;
    border-radius: var(--mud-radius-lg, 12px);
    height: 100%;
}

.e2c-statcard-top[b-jv7kd0m2dd] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.e2c-statcard-icon[b-jv7kd0m2dd] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    font-size: 1.05rem;
    flex: 0 0 auto;
}

.e2c-statcard-trend[b-jv7kd0m2dd] {
    font-size: 11.5px;
    font-weight: 700;
    line-height: 38px;
}

.e2c-statcard-label[b-jv7kd0m2dd] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-muted, #5A6B82);
}

.e2c-statcard-value[b-jv7kd0m2dd] {
    font-size: 28px;
    font-weight: 800;
    line-height: 1.1;
    margin-top: 4px;
    color: var(--text, #0F1B2D);
}
/* /Components/Shared/StatusBadge.razor.rz.scp.css */
.e2c-status[b-mdcxbwmo5y] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    padding: 4px 10px;
    border-radius: 999px;
    white-space: nowrap;
}

.e2c-status-dot[b-mdcxbwmo5y] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex: 0 0 auto;
}

/* Foreground text colour per status group. Light-mode = dark-ink hexes deepened to clear WCAG
   2.2 AA 4.5:1 on each pill's low-alpha tint (the status text already carries meaning, so colour
   is never the sole cue). Dark-mode flips to lighter PaletteDark values so text stays ≥4.5:1 on
   the #0B1525 surface (mirrors the mockup --mud-*-fg vars). */
.e2c-status.is-warning[b-mdcxbwmo5y] { color: #8A4B00; }
.e2c-status.is-success[b-mdcxbwmo5y] { color: #2E5E1E; }
.e2c-status.is-danger[b-mdcxbwmo5y]  { color: #9D2828; }
.e2c-status.is-info[b-mdcxbwmo5y]    { color: #163E63; }
.e2c-status.is-neutral[b-mdcxbwmo5y] { color: #475569; }

html[data-theme="dark"] .e2c-status.is-warning[b-mdcxbwmo5y] { color: #F6BE6E; }
html[data-theme="dark"] .e2c-status.is-success[b-mdcxbwmo5y] { color: #A8D480; }
html[data-theme="dark"] .e2c-status.is-danger[b-mdcxbwmo5y]  { color: #F0A0A0; }
html[data-theme="dark"] .e2c-status.is-info[b-mdcxbwmo5y]    { color: #A8CCEC; }
html[data-theme="dark"] .e2c-status.is-neutral[b-mdcxbwmo5y] { color: rgba(246, 241, 229, 0.82); }
/* /Components/Shared/ThemeToggle.razor.rz.scp.css */
.e2c-theme-toggle[b-ls9rm2976r] {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1px solid currentColor;
    background: transparent;
    color: inherit; /* adapts to light nav (dark text) + dark portal bar (light text) */
    opacity: 0.78;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    transition: opacity 0.15s ease, background 0.15s ease, transform 0.08s ease;
}
.e2c-theme-toggle:hover[b-ls9rm2976r] { opacity: 1; background: rgba(127, 127, 127, 0.14); }
.e2c-theme-toggle:active[b-ls9rm2976r] { transform: scale(0.92); }
.e2c-theme-glyph[b-ls9rm2976r] { font-size: 1.05rem; }
