/* /Components/Layout/MainLayout.razor.rz.scp.css */
.app-shell[b-1dbubfq64u] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    min-height: 100vh;
    direction: ltr;
}

.sidebar[b-1dbubfq64u] {
    grid-column: 2;
    grid-row: 1;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow: hidden;               /* the nav scrolls internally; the brand + SHIFT footer stay pinned */
    display: flex;
    flex-direction: column;
    direction: rtl;
    color: #e8eef8;
    padding: 18px 14px;
    background: linear-gradient(180deg, var(--sidebar), var(--sidebar-2));
    border-left: 1px solid rgba(255, 255, 255, .08);
    box-shadow: -24px 0 60px rgba(9, 26, 57, .18);
}

.main[b-1dbubfq64u] {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
    direction: rtl;
}

.topbar[b-1dbubfq64u] {
    position: sticky;
    top: 0;
    z-index: 10;
    min-height: 68px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 18px 22px 0;
    padding: 14px 22px;
    border: 1px solid var(--line);
    border-radius: 24px;
    background: rgba(255, 255, 255, .86);
    backdrop-filter: blur(10px);
    box-shadow: var(--shadow);
}

.topbar h1[b-1dbubfq64u] {
    margin: 0;
    font-size: 20px;
    font-weight: 800;
}

/* FocusOnNavigate moves focus to the <h1> on every navigation (a11y); the title
   isn't interactive, so hide the focus ring it would otherwise draw each load. */
.topbar h1:focus[b-1dbubfq64u],
.topbar h1:focus-visible[b-1dbubfq64u] {
    outline: none;
}

.eyebrow[b-1dbubfq64u] {
    color: var(--muted);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.topbar-actions[b-1dbubfq64u] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    direction: rtl;
}

.tenant-select[b-1dbubfq64u] {
    width: 210px;
}

.demo-badge[b-1dbubfq64u] {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 8px;
    color: #fff;
    background: #198754;
    font-weight: 800;
}

.content[b-1dbubfq64u] {
    padding: 24px 22px 32px;
}

#blazor-error-ui[b-1dbubfq64u] {
    color-scheme: light only;
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 1000;
    width: 100%;
    padding: .75rem 1.25rem;
    background: #fff3cd;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, .2);
}

#blazor-error-ui .dismiss[b-1dbubfq64u] {
    cursor: pointer;
    position: absolute;
    left: .75rem;
    top: .5rem;
}

@media (max-width: 980px) {
    .app-shell[b-1dbubfq64u] {
        display: block;
    }

    .sidebar[b-1dbubfq64u] {
        position: static;
        height: auto;
        overflow: visible;
        box-shadow: none;
    }

    .topbar[b-1dbubfq64u],
    .topbar-actions[b-1dbubfq64u] {
        align-items: stretch;
        flex-direction: column;
    }

    .tenant-select[b-1dbubfq64u] {
        width: 100%;
    }
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* .brand* styles live in SidebarBrand.razor.css now (Blazor CSS-isolation: the .brand markup moved there). */

/* The nav list scrolls between the pinned brand (top) and the SHIFT footer (bottom). */
.nav-scrollable[b-rxwvkfs303] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

/* Fixed «مدعوم بواسطة SHIFT» — pinned to the sidebar bottom, does NOT scroll with the nav. */
.sidebar-foot[b-rxwvkfs303] {
    flex-shrink: 0;
    margin-top: 12px;
    padding: 12px 8px 4px;
    border-top: 1px solid rgba(255, 255, 255, .12);
    text-align: center;
    color: rgba(255, 255, 255, .62);
    font-size: 12px;
}
.sidebar-foot strong[b-rxwvkfs303] {
    color: #fff;
    font-weight: 800;
    letter-spacing: .4px;
}

.tenant-card[b-rxwvkfs303] {
    padding: 12px;
    margin-bottom: 18px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 18px;
    background: rgba(255, 255, 255, .07);
}

.tenant-card .label[b-rxwvkfs303] {
    display: block;
    color: #aebbd0;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.tenant-card strong[b-rxwvkfs303],
.tenant-card small[b-rxwvkfs303] {
    display: block;
}

.tenant-card small[b-rxwvkfs303] {
    color: #b9c5d8;
    margin-top: 4px;
}

.navbar-toggler[b-rxwvkfs303] {
    appearance: none;
    cursor: pointer;
    width: 46px;
    height: 38px;
    position: absolute;
    top: 20px;
    left: 18px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 12px;
    background: rgba(255, 255, 255, .08);
}

.navbar-toggler[b-rxwvkfs303]::before {
    content: "menu";
    display: grid;
    place-items: center;
    height: 100%;
    color: #e8eef8;
    font-size: 11px;
    font-weight: 800;
}

.nav-section-title[b-rxwvkfs303] {
    color: #9fb1ca;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin: 18px 8px 8px;
}

.nav-item[b-rxwvkfs303]  .nav-link-btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 10px;
    margin: 5px 0;
    padding: 13px 14px;
    border-radius: 16px;
    color: #e8eef8;
    text-decoration: none;
    font-size: 14px;
}

/* Vivid accent driven by the THEME vars → on default SHIFT this is the original blue; recolors with the
   tenant's palette (set the brand blues to match the sidebar for a fully-coherent rebrand). */
.nav-item[b-rxwvkfs303]  .nav-link-btn:hover {
    color: #fff;
    background: rgba(255, 255, 255, .08);
}

.nav-item[b-rxwvkfs303]  .nav-link-btn.active {
    color: #fff;
    background: linear-gradient(90deg, var(--brand-strong), var(--blue));
    box-shadow: 0 12px 30px rgba(0, 0, 0, .28);
}

.nav-item[b-rxwvkfs303]  .nav-link-btn i {
    color: var(--icon);
    font-size: 13px;
    font-weight: 800;
}
.nav-item[b-rxwvkfs303]  .nav-link-btn.active i { color: #fff; }

@media (max-width: 980px) {
    .nav-scrollable[b-rxwvkfs303] {
        display: none;
    }

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

@media (min-width: 981px) {
    .navbar-toggler[b-rxwvkfs303] {
        display: none;
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-2hkjhehtq9],
.components-reconnect-repeated-attempt-visible[b-2hkjhehtq9],
.components-reconnect-failed-visible[b-2hkjhehtq9],
.components-pause-visible[b-2hkjhehtq9],
.components-resume-failed-visible[b-2hkjhehtq9],
.components-rejoining-animation[b-2hkjhehtq9] {
    display: none;
}

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


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

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

@keyframes components-rejoining-animation-b-2hkjhehtq9 {
    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/Layout/SidebarBrand.razor.rz.scp.css */
.brand[b-5ruzfa0ex4] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
    flex-shrink: 0;
}

.brand-link[b-5ruzfa0ex4] {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #e8eef8;
    text-decoration: none;
    min-width: 0;
}
.brand-link:hover[b-5ruzfa0ex4] { color: #fff; }

/* Fallback mark (no tenant logo) — vivid themed tile (default = the original blue box; recolors with the theme). */
.brand-mark[b-5ruzfa0ex4] {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--cyan), var(--blue-2));
    box-shadow: 0 12px 30px rgba(0, 0, 0, .3);
    font-weight: 800;
    font-size: 22px;
    color: #fff;
}

/* Tenant logo — a white rounded chip so any logo sits cleanly on the colored sidebar. */
.brand-logo[b-5ruzfa0ex4] {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .18);
}
.brand-logo img[b-5ruzfa0ex4] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    display: block;
}

.brand-text[b-5ruzfa0ex4] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.brand-name[b-5ruzfa0ex4] {
    font-size: 19px;
    font-weight: 800;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.brand-subtitle[b-5ruzfa0ex4] {
    color: #b9c5d8;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* /Components/Layout/UserPanel.razor.rz.scp.css */
.user-panel[b-sat2bqdlbx] {
    position: relative;
    flex: 0 0 auto;
}

.current-user[b-sat2bqdlbx] {
    border: 1px solid var(--line);
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 205px;
    padding: 7px 9px;
    border-radius: 16px;
    background: rgba(255, 255, 255, .88);
    color: var(--ink);
    text-align: right;
    box-shadow: 0 10px 26px rgba(24, 35, 54, .06);
}

.current-user-avatar[b-sat2bqdlbx] {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    color: #fff;
    font-size: 13px;
    font-weight: 850;
    background: linear-gradient(135deg, var(--green), var(--blue));
}

.current-user strong[b-sat2bqdlbx],
.current-user small[b-sat2bqdlbx],
.user-menu-head strong[b-sat2bqdlbx],
.user-menu-head small[b-sat2bqdlbx] {
    display: block;
    line-height: 1.2;
}

.current-user strong[b-sat2bqdlbx] {
    font-size: 13px;
}

.current-user small[b-sat2bqdlbx],
.user-menu-head small[b-sat2bqdlbx] {
    color: var(--muted);
    font-size: 11px;
}

.current-user i[b-sat2bqdlbx] {
    margin-right: auto;
    color: var(--muted);
    font-size: 12px;
}

.user-menu[b-sat2bqdlbx] {
    width: 300px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 22px 60px rgba(24, 35, 54, .16);
}

.user-menu-head[b-sat2bqdlbx] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 6px 12px;
    margin-bottom: 6px;
    border-bottom: 1px solid #edf1f6;
}

.user-menu-summary[b-sat2bqdlbx] {
    display: grid;
    margin-bottom: 6px;
}

.user-menu-summary div[b-sat2bqdlbx] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 6px;
    border-bottom: 1px solid #edf1f6;
}

.user-menu-summary span[b-sat2bqdlbx] {
    color: var(--muted);
    font-size: 12px;
}

.user-menu-summary strong[b-sat2bqdlbx] {
    font-size: 12px;
    text-align: right;
}

.user-menu-actions[b-sat2bqdlbx] {
    display: grid;
    gap: 2px;
    padding-top: 4px;
}

.user-menu-actions button[b-sat2bqdlbx],
.user-menu-actions a[b-sat2bqdlbx] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 8px;
    border: 0;
    border-radius: 10px;
    color: var(--ink);
    background: transparent;
    text-align: right;
    text-decoration: none;
    font-weight: 700;
}

.user-menu-actions button:hover[b-sat2bqdlbx],
.user-menu-actions a:hover[b-sat2bqdlbx] {
    color: var(--blue);
    background: #eef6ff;
}

.user-menu-actions button i[b-sat2bqdlbx],
.user-menu-actions a i[b-sat2bqdlbx] {
    color: var(--blue);
}

.user-menu-actions button.danger[b-sat2bqdlbx] {
    color: var(--red);
}

.user-menu-actions button.danger:hover[b-sat2bqdlbx] {
    background: #fff0ef;
}

.user-menu-actions button.danger i[b-sat2bqdlbx] {
    color: var(--red);
}

@media (max-width: 980px) {
    .user-panel[b-sat2bqdlbx],
    .current-user[b-sat2bqdlbx],
    .user-menu[b-sat2bqdlbx] {
        width: 100%;
    }

    .user-menu[b-sat2bqdlbx] {
        position: static;
        margin-top: 8px;
    }
}

/* logout submit lives in a form → make it lay out like the other action items */
.signout-form[b-sat2bqdlbx] { display: contents; }
/* /Components/Pages/Attendance.razor.rz.scp.css */
/* Attendance status pills */
.att-badge[b-akae8mnu0x] {
    display: inline-block;
    padding: 3px 11px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}
.att-OnTime[b-akae8mnu0x] { background: #e3f6ec; color: #11713e; }
.att-Late[b-akae8mnu0x] { background: #fdf0d8; color: #8a5a00; }
.att-Incomplete[b-akae8mnu0x] { background: #fdecec; color: #a01; }
.att-Absent[b-akae8mnu0x] { background: #fdecec; color: #a01; }
.att-Pending[b-akae8mnu0x] { background: #eef2f8; color: #5a6b85; }
.att-Off[b-akae8mnu0x] { background: #e6f2f7; color: #1d6a86; }
.att-OnLeave[b-akae8mnu0x] { background: #e0edff; color: #1d4ed8; }

/* Two-field row in the modal */
.field-row[b-akae8mnu0x] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
@media (max-width: 640px) {
    .field-row[b-akae8mnu0x] { grid-template-columns: 1fr; }
}

/* Empty / error states */
.empty-state[b-akae8mnu0x] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 48px 20px;
    color: #6a7890;
    background: #fff;
    border: 1px dashed #d8e0ec;
    border-radius: 14px;
}
.empty-state i[b-akae8mnu0x] { font-size: 30px; opacity: .55; }
.empty-state p[b-akae8mnu0x] { margin: 0; font-size: 14px; }

.form-error-card[b-akae8mnu0x] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
    padding: 10px 12px;
    background: #fdecec;
    color: #a01;
    border: 1px solid #f3c5c5;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
}

.muted[b-akae8mnu0x] { color: #8593a8; font-size: 12px; }
/* Geofence verdict cell: the status pill, then the distance as a separate muted note (no «·» cramming) */
.verdict-cell[b-akae8mnu0x] { white-space: nowrap; }
.dist-note[b-akae8mnu0x] { color: #6a7890; font-size: 12px; margin-inline-start: 7px; font-variant-numeric: tabular-nums; }
.toolbar-result[b-akae8mnu0x] { color: #5a6b85; font-size: 12px; align-self: center; }
.panel-header h3 i[b-akae8mnu0x] { color: var(--hero-accent); margin-inline-end: 4px; }
.panel-header h3 i.warn[b-akae8mnu0x] { color: #d9772b; }

/* Shared filter bar controls all 3 tables; the action buttons sit at the end of the toolbar row. */
.att-actions[b-akae8mnu0x] { margin-inline-start: auto; display: flex; gap: 8px; }

/* The 3 tables share ONE reload overlay (the filter bar above stays interactive). */
.att-tables[b-akae8mnu0x] { position: relative; }
/* the tab bar controls the gap to the table — cancel each panel's default 16px top margin */
.att-tables > .panel[b-akae8mnu0x] { margin-top: 0; }
.reload-overlay[b-akae8mnu0x] {
    position: absolute;
    inset: 0;
    z-index: 25;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 64px;                 /* float the card near the top, over the visible rows */
    background: rgba(244, 247, 252, 0.55);
    backdrop-filter: blur(2px);
    border-radius: 16px;
}
/* A floating pill — bolder + with depth, not flat text */
.reload-card[b-akae8mnu0x] {
    display: inline-flex;
    align-items: center;
    gap: 13px;
    padding: 13px 24px;
    background: #fff;
    border: 1px solid #e8eefb;
    border-radius: 999px;
    box-shadow: 0 16px 38px rgba(36, 97, 216, 0.20), 0 3px 10px rgba(20, 35, 63, 0.07);
    color: #14233f;
    font-size: 15px;
    font-weight: 700;
    animation: reload-pop-b-akae8mnu0x 0.18s ease-out;
}
.reload-ring[b-akae8mnu0x] {
    width: 22px;
    height: 22px;
    border: 3px solid #dbe7fc;
    border-top-color: var(--hero-accent);
    border-radius: 50%;
    animation: shift-spin 0.7s linear infinite;   /* reuse the global keyframes */
}
@keyframes reload-pop-b-akae8mnu0x {
    from { opacity: 0; transform: translateY(-6px) scale(0.96); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* Date-range filter (من / إلى) in the toolbar */
.date-range[b-akae8mnu0x] { display: flex; align-items: center; gap: 6px; }
.date-range label[b-akae8mnu0x] { font-size: 12px; color: #5a6b85; font-weight: 600; }
.date-range input[type="date"][b-akae8mnu0x] { width: auto; min-width: 150px; }


/* the 3 attendance tables are now tabs (records / errors / location) */
.att-tabs[b-akae8mnu0x] { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0; }
.att-tabs button[b-akae8mnu0x] {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    border: 1px solid #dce8f6;
    background: #fff;
    border-radius: 999px;
    padding: 10px 20px;
    font-size: 13px;
    font-weight: 700;
    color: #5a6b85;
    cursor: pointer;
    transition: border-color .14s, color .14s, background .14s, box-shadow .14s;
}
.att-tabs button i[b-akae8mnu0x] { font-size: 14px; opacity: .8; }
.att-tabs button:hover[b-akae8mnu0x] { border-color: #b9d3f5; color: var(--blue-2); }
.att-tabs button.active[b-akae8mnu0x] {
    color: #fff;
    border-color: transparent;
    background: linear-gradient(135deg, var(--blue), var(--blue-2));
    box-shadow: 0 6px 16px rgba(36, 124, 255, .28);
}
.att-tabs button.active i[b-akae8mnu0x] { opacity: 1; }
.att-tabs .tab-count[b-akae8mnu0x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 21px;
    height: 19px;
    padding: 0 7px;
    margin-inline-start: 1px;
    border-radius: 999px;
    background: #e7eefb;
    color: #4a5a78;
    font-size: 11px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}
.att-tabs button.active .tab-count[b-akae8mnu0x] { background: rgba(255, 255, 255, .28); color: #fff; }
.att-tabs .tab-count.warn[b-akae8mnu0x] { background: #fde4e2; color: #c0392b; }
.att-tabs button.active .tab-count.warn[b-akae8mnu0x] { background: rgba(255, 255, 255, .3); color: #fff; }
/* /Components/Pages/Audit.razor.rz.scp.css */
.audit-toolbar[b-oaay6raeum] { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.audit-toolbar .form-select[b-oaay6raeum] { max-width: 190px; }
.audit-toolbar .form-control[b-oaay6raeum] { max-width: 190px; }
.audit-toolbar input[type=text][b-oaay6raeum], .audit-toolbar input:not([type])[b-oaay6raeum] { flex: 1; min-width: 200px; max-width: none; }

.table-area[b-oaay6raeum] { position: relative; min-height: 120px; }

.nowrap[b-oaay6raeum] { white-space: nowrap; font-variant-numeric: tabular-nums; font-size: 12.5px; color: #475569; }

.ent-badge[b-oaay6raeum] {
    display: inline-block; padding: 3px 10px; border-radius: 999px;
    background: #eef2f8; color: #33415a; font-size: 12px; font-weight: 700;
}

.act-badge[b-oaay6raeum] { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 800; }
.act-badge.act-insert[b-oaay6raeum] { background: #dcfce7; color: #15803d; }
.act-badge.act-update[b-oaay6raeum] { background: #fef3c7; color: #92400e; }
.act-badge.act-delete[b-oaay6raeum] { background: #fee2e2; color: #b91c1c; }

/* before → after list inside the changes cell */
.changes[b-oaay6raeum] { display: flex; flex-direction: column; gap: 3px; max-width: 480px; }
.chg[b-oaay6raeum] { display: flex; align-items: center; gap: 6px; font-size: 12.5px; flex-wrap: wrap; }
.chg-field[b-oaay6raeum] { font-weight: 700; color: var(--sidebar-2); }
.chg-old[b-oaay6raeum] { color: #b91c1c; text-decoration: line-through; opacity: .8; }
.chg-new[b-oaay6raeum] { color: #15803d; font-weight: 600; }
.chg > i[b-oaay6raeum] { color: #64748b; }
.chg-more[b-oaay6raeum] { font-size: 11.5px; color: var(--muted, #8593a8); font-weight: 600; }
/* /Components/Pages/CompanyProfile.razor.rz.scp.css */
/* CompanyProfile-specific styles only.
   Shared chrome (tenant bar, panels, modal, toast, confirm dialog, buttons,
   alerts, table) lives in app.css so every setup screen reuses it. */

/* Panels */
.panel[b-4rbp6sn6g0] {
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: var(--panel);
    box-shadow: var(--shadow);
}

.panel-header[b-4rbp6sn6g0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.panel-header h3[b-4rbp6sn6g0] {
    margin: 0;
    font-size: 15px;
    font-weight: 800;
}

.panel-actions[b-4rbp6sn6g0] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* Logo row */
.logo-row[b-4rbp6sn6g0] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.company-avatar[b-4rbp6sn6g0] {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--sidebar), var(--blue));
    color: #fff;
    font-size: 24px;
    font-weight: 900;
}

/* Badges */
.badge-new[b-4rbp6sn6g0] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 6px;
    background: #fff8e6;
    color: #b87a00;
    font-size: 11px;
    font-weight: 700;
    margin-top: 3px;
}

.coming-soon-badge[b-4rbp6sn6g0] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: 10px;
    background: var(--soft);
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    border: 1px solid var(--line);
}

.branches-count[b-4rbp6sn6g0] {
    font-size: 12px;
    color: var(--muted);
    font-weight: 600;
}

/* Empty branches */
.empty-branches[b-4rbp6sn6g0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px 0;
    color: var(--muted);
    text-align: center;
    gap: 10px;
}

.empty-branches i[b-4rbp6sn6g0] { font-size: 32px; }
.empty-branches p[b-4rbp6sn6g0] { margin: 0; max-width: 400px; font-size: 14px; }

/* Logo upload */
.logo-upload[b-4rbp6sn6g0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.company-logo-img[b-4rbp6sn6g0] {
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    border-radius: 14px;
    object-fit: cover;
    border: 1px solid var(--line);
    background: #fff;
}

.logo-upload-btn[b-4rbp6sn6g0] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 8px;
    border: 1px solid var(--line);
    background: var(--soft);
    color: var(--blue-2);
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}

.logo-upload-btn:hover[b-4rbp6sn6g0] { background: #eef4ff; }

/* Map section */
.map-section[b-4rbp6sn6g0] {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed var(--line);
}

.map-placeholder[b-4rbp6sn6g0] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px;
    margin: 8px 0 12px;
    border: 1px dashed var(--line);
    border-radius: 12px;
    background: var(--soft);
    color: var(--muted);
    font-size: 13px;
}

.map-placeholder i[b-4rbp6sn6g0] { font-size: 22px; }

.map-hint[b-4rbp6sn6g0] {
    font-size: 12px;
    color: var(--muted);
    margin: 4px 0 8px;
}

.map-search-row[b-4rbp6sn6g0] {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

.map-search-row input[b-4rbp6sn6g0] { flex: 1; }
.map-search-row .btn-ghost[b-4rbp6sn6g0] { white-space: nowrap; }

#branchMap[b-4rbp6sn6g0] {
    width: 100%;
    height: 320px;
    border-radius: 12px;
    margin: 8px 0 12px;
    border: 1px solid var(--line);
    background: #eef2f7;
}
/* /Components/Pages/Governorates.razor.rz.scp.css */
/* Map location-picker chrome (mirrors the branch / SPC picker; point-only — no geofence circle). */
.map-section[b-icm9dreewe] {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed var(--line);
}

.map-placeholder[b-icm9dreewe] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px;
    margin: 8px 0 12px;
    border: 1px dashed var(--line);
    border-radius: 12px;
    background: var(--soft);
    color: var(--muted);
    font-size: 13px;
}

.map-placeholder i[b-icm9dreewe] { font-size: 22px; }

.map-hint[b-icm9dreewe] {
    font-size: 12px;
    color: var(--muted);
    margin: 4px 0 8px;
}

.map-search-row[b-icm9dreewe] {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

.map-search-row input[b-icm9dreewe] { flex: 1; }
.map-search-row .btn-ghost[b-icm9dreewe] { white-space: nowrap; }

#govMap[b-icm9dreewe] {
    width: 100%;
    height: 320px;
    border-radius: 12px;
    margin: 8px 0 12px;
    border: 1px solid var(--line);
    background: #eef2f7;
}

/* Auto-computed distance-to-capital (read-only mirror of the server's GeoDistance) */
.auto-tag[b-icm9dreewe] {
    font-style: normal;
    font-size: 10px;
    font-weight: 800;
    padding: 1px 7px;
    border-radius: 999px;
    background: #eef4ff;
    color: var(--blue-2);
    margin-inline-start: 6px;
    vertical-align: middle;
}
.auto-distance-field[b-icm9dreewe] {
    display: flex;
    align-items: center;
    min-height: 46px;
    padding: 0 14px;
    border: 1px solid #d4e2ff;
    border-radius: 10px;
    background: #eef4ff;
}
.auto-distance-field strong[b-icm9dreewe] { font-size: 17px; font-weight: 800; color: var(--blue-2); }
.auto-distance-field .adf-na[b-icm9dreewe] { color: var(--muted); font-size: 13px; }
/* /Components/Pages/Leaves.razor.rz.scp.css */
.lv-toolbar[b-3tuihy0nro] { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.lv-toolbar .form-select[b-3tuihy0nro] { max-width: 190px; }
.lv-toolbar .form-control[type=date][b-3tuihy0nro] { max-width: 170px; }
.lv-toolbar input:not([type=date])[b-3tuihy0nro] { flex: 1; min-width: 200px; }

.table-area[b-3tuihy0nro] { position: relative; min-height: 120px; }
.nowrap[b-3tuihy0nro] { white-space: nowrap; font-variant-numeric: tabular-nums; }
.reason-cell[b-3tuihy0nro] { display: inline-block; max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }

/* leave-type badge */
.lv-type[b-3tuihy0nro] {
    display: inline-block; padding: 3px 11px; border-radius: 999px; font-size: 12px; font-weight: 700;
    background: #e0edff; color: #1d4ed8; white-space: nowrap;
}

/* status pill */
.pstatus[b-3tuihy0nro] { display: inline-block; padding: 3px 12px; border-radius: 999px; font-size: 12px; font-weight: 800; white-space: nowrap; }
.pstatus-pending[b-3tuihy0nro] { background: #fef3c7; color: #92400e; }
.pstatus-approved[b-3tuihy0nro] { background: #dcfce7; color: #15803d; }
.pstatus-rejected[b-3tuihy0nro] { background: #fee2e2; color: #b91c1c; }
.pstatus-cancelled[b-3tuihy0nro] { background: #e5e7eb; color: #4b5563; }

.btn-review[b-3tuihy0nro] {
    display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; border: none; cursor: pointer;
    border-radius: 8px; font-size: 12.5px; font-weight: 700; color: #fff;
    background: linear-gradient(135deg, var(--sidebar-2), var(--hero-accent));
}
.btn-review:hover[b-3tuihy0nro] { filter: brightness(1.08); }
.decided-by[b-3tuihy0nro] { font-size: 12.5px; color: #475569; font-weight: 600; }

/* review modal */
.lv-modal[b-3tuihy0nro] { max-width: 560px; }
.review-grid[b-3tuihy0nro] { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; }
.review-grid > div[b-3tuihy0nro] { display: flex; flex-direction: column; gap: 2px; }
.review-grid .review-full[b-3tuihy0nro] { grid-column: 1 / -1; }
.review-grid .rl[b-3tuihy0nro] { font-size: 12px; color: #8593a8; font-weight: 600; }
.review-grid strong[b-3tuihy0nro] { font-size: 14px; color: var(--sidebar-2); }
.form-label.mt[b-3tuihy0nro] { display: block; margin-top: 16px; margin-bottom: 6px; font-weight: 600; }
.review-error[b-3tuihy0nro] {
    margin-top: 12px; padding: 9px 12px; border-radius: 8px; font-size: 13px; font-weight: 600;
    background: #fee2e2; color: #b91c1c; display: flex; align-items: center; gap: 7px;
}
/* /Components/Pages/MissionForm.razor.rz.scp.css */
/* Mission form — mirrors ProjectForm's scoped form chrome (scope blocks, chips, map area). */

.badge-soft[b-wnndbtvkht] {
    display: inline-flex;
    align-items: center;
    padding: 4px 11px;
    border-radius: 999px;
    background: #eef4ff;
    color: var(--blue-2);
    font-size: 12px;
    font-weight: 700;
}

/* Location-mode radios + employee chip multiselect */
.scope-grid[b-wnndbtvkht] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 14px;
}

.scope-head[b-wnndbtvkht] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.scope-count[b-wnndbtvkht] {
    font-size: 12px;
    color: var(--muted);
}

.scope-opt[b-wnndbtvkht] {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 12px;
    margin-bottom: 8px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
}

.scope-opt.on[b-wnndbtvkht] {
    border-color: var(--blue);
    background: #eef4ff;
    color: var(--blue-2);
}

.scope-opt input[b-wnndbtvkht] { accent-color: var(--blue); }

.chip-select[b-wnndbtvkht] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 6px;
}

.chip-check[b-wnndbtvkht] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 11px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
}

.chip-check.on[b-wnndbtvkht] {
    border-color: var(--blue);
    background: #eef4ff;
    color: var(--blue-2);
}

.chip-check input[b-wnndbtvkht] { accent-color: var(--blue); }
.chip-check .muted[b-wnndbtvkht] { color: var(--muted); font-weight: 500; }

/* Department badge on each employee chip (so you can tell who's from which dept) */
.chip-dept[b-wnndbtvkht] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-inline-start: 4px;
    padding: 2px 8px;
    border-radius: 999px;
    background: #eef1f6;
    color: var(--muted);
    font-size: 11.5px;
    font-weight: 700;
}

.chip-dept > i[b-wnndbtvkht] { font-size: 10.5px; }

/* The selected responsible team's members read as "primary" */
.chip-dept.is-primary[b-wnndbtvkht] { background: var(--blue-soft); color: var(--brand-strong); }
.chip-check.primary-team[b-wnndbtvkht] { border-color: #cdddff; }
.chip-check.primary-team.on[b-wnndbtvkht] { border-color: var(--blue); }

/* The "assigned" group sits in a soft tinted tray so it reads apart from the candidate list */
.chip-select.assigned-group[b-wnndbtvkht] {
    padding: 10px;
    border: 1px solid #d8e6cf;
    border-radius: 12px;
    background: #f3f9ee;
}

.scope-head .form-label > i[b-wnndbtvkht] { margin-inline-end: 5px; }
.scope-head .form-label .bi-check2-circle[b-wnndbtvkht] { color: #1d7a52; }
.scope-head .form-label .bi-plus-circle[b-wnndbtvkht] { color: var(--blue-2); }

/* Inherited-location read-only block + map */
.map-section[b-wnndbtvkht] {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed var(--line);
}

.map-placeholder[b-wnndbtvkht] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px;
    margin: 8px 0 12px;
    border: 1px dashed var(--line);
    border-radius: 12px;
    background: var(--soft);
    color: var(--muted);
    font-size: 13px;
}

.map-placeholder i[b-wnndbtvkht] { font-size: 22px; }

#missionMap[b-wnndbtvkht] {
    width: 100%;
    height: 320px;
    border-radius: 12px;
    margin: 8px 0 4px;
    border: 1px solid var(--line);
    background: #eef2f7;
}

/* Inherited-location compact summary (read-only) + map toggle */
.loc-head[b-wnndbtvkht] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.loc-head .form-label[b-wnndbtvkht] { margin: 0; }

.loc-map-btn[b-wnndbtvkht] {
    padding: 5px 11px;
    font-size: 12px;
    white-space: nowrap;
}

.loc-summary[b-wnndbtvkht] {
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 12px 14px;
    background: var(--soft);
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.loc-line-main[b-wnndbtvkht] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    font-size: 14.5px;
}

.loc-line-main > i[b-wnndbtvkht] { color: var(--blue-2); font-size: 16px; }
.loc-line-main strong[b-wnndbtvkht] { font-weight: 800; color: var(--ink, #1f2a44); }
.loc-dot[b-wnndbtvkht] { color: var(--muted); }

.loc-chip[b-wnndbtvkht] {
    padding: 2px 9px;
    border-radius: 999px;
    background: #eef4ff;
    color: var(--blue-2);
    font-size: 12.5px;
    font-weight: 700;
}

.loc-addr[b-wnndbtvkht] {
    font-size: 13px;
    color: var(--muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.loc-coords[b-wnndbtvkht] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
}

.loc-coords > i[b-wnndbtvkht] { font-size: 13px; }

.loc-gmaps[b-wnndbtvkht] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-inline-start: auto;
    color: var(--blue-2);
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.loc-gmaps:hover[b-wnndbtvkht] { text-decoration: underline; }
.loc-gmaps i[b-wnndbtvkht] { font-size: 12px; }

/* Inherited-location map popup */
.map-modal[b-wnndbtvkht] { width: min(760px, 94vw); }

.map-modal #missionMap[b-wnndbtvkht] {
    height: 58vh;
    max-height: 460px;
    margin: 0;
    border-radius: 12px;
}

.map-modal-foot[b-wnndbtvkht] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 12px;
}

.map-modal-addr[b-wnndbtvkht] {
    flex: 1;
    min-width: 0;
    font-size: 13px;
    color: var(--muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

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

/* Type + Status on one row: type a fixed width, status pills take the rest */
.type-status-row[b-wnndbtvkht] {
    display: flex;
    gap: 18px;
    align-items: flex-start;
}

.type-status-row .field-group[b-wnndbtvkht] { margin: 0; }
.type-status-row .ts-type[b-wnndbtvkht] { flex: 0 0 240px; }
.type-status-row .ts-status[b-wnndbtvkht] { flex: 1 1 auto; min-width: 0; }

@media (max-width: 820px) {
    .type-status-row[b-wnndbtvkht] { flex-direction: column; gap: 14px; }
    .type-status-row .ts-type[b-wnndbtvkht] { flex-basis: auto; width: 100%; }
}

/* Mission-status segmented pill selector (replaces the status dropdown) */
.status-pills[b-wnndbtvkht] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.status-pill[b-wnndbtvkht] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    font: inherit;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--ink, #1f2a44);
    cursor: pointer;
    transition: border-color .12s, background .12s, color .12s;
}

.status-pill:hover[b-wnndbtvkht] { border-color: var(--blue); }
.status-pill i[b-wnndbtvkht] { font-size: 13px; }

/* Selected → fill with the status' semantic tint */
.status-pill.sp-auto.on[b-wnndbtvkht]       { background: #ede9fe; border-color: #8b5cf6; color: #5b21b6; }
.status-pill.sp-scheduled.on[b-wnndbtvkht]  { background: var(--blue-soft); border-color: var(--hero-accent); color: var(--brand-strong); }
.status-pill.sp-inprogress.on[b-wnndbtvkht] { background: #d8f1e6; border-color: #2f9e6f; color: #1d7a52; }
.status-pill.sp-completed.on[b-wnndbtvkht]  { background: #d2f0ec; border-color: #0f766e; color: #0c5f59; }
.status-pill.sp-pending.on[b-wnndbtvkht]    { background: #fbeccd; border-color: #c47d04; color: #9a5b00; }
.status-pill.sp-cancelled.on[b-wnndbtvkht]  { background: #fde0dc; border-color: #c0392b; color: #97271c; }

/* Past mission → read-only. Reset the fieldset's UA chrome; dim it slightly when disabled. */
/* The fieldset wraps all sections, so it (not .proj-sections) is the grid parent —
   carry the same 16px gap or the section cards stick together with no spacing. */
.locked-zone[b-wnndbtvkht] {
    display: grid;
    gap: 16px;
    min-inline-size: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.locked-zone:disabled[b-wnndbtvkht] { opacity: .72; }

.locked-banner[b-wnndbtvkht] {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 14px;
    padding: 12px 16px;
    border: 1px solid #f0c98a;
    border-radius: 12px;
    background: #fdf3e0;
    color: #8a5a00;
    font-size: 14px;
    font-weight: 600;
}

.locked-banner > i[b-wnndbtvkht] { font-size: 17px; }

/* Team-origin auto-filled from the company governorate (read-only display + override link) */
.origin-auto[b-wnndbtvkht] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    min-height: 46px;
    padding: 8px 14px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--soft);
}

.origin-auto > span[b-wnndbtvkht] { display: inline-flex; align-items: center; gap: 7px; font-weight: 700; color: var(--ink, #1f2a44); }
.origin-auto > span > i[b-wnndbtvkht] { color: var(--blue-2); font-size: 16px; }
.origin-auto em[b-wnndbtvkht] { font-style: normal; font-weight: 500; font-size: 12.5px; color: var(--muted); }

.origin-link[b-wnndbtvkht] {
    background: none;
    border: none;
    padding: 0;
    margin-top: 6px;
    font: inherit;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--blue-2);
    cursor: pointer;
    white-space: nowrap;
}

.origin-auto .origin-link[b-wnndbtvkht] { margin-top: 0; }
.origin-link:hover[b-wnndbtvkht] { text-decoration: underline; }

/* Same-governorate → no travel/overnight: calm note fills the travel-rule grid cell */
.travel-none[b-wnndbtvkht] {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 12px 14px;
    border: 1px solid #cde7da;
    border-radius: 12px;
    background: #eafaf1;
    align-self: end;
}

.travel-none > i[b-wnndbtvkht] { font-size: 22px; color: #1d7a52; flex: 0 0 auto; }
.travel-none strong[b-wnndbtvkht] { display: block; font-size: 14px; font-weight: 800; color: #1d7a52; }
.travel-none span[b-wnndbtvkht] { display: block; margin-top: 2px; font-size: 12.5px; color: #3a7a5c; }

/* Schedule summary card (day span + weekend + auto-overnight) beside the date controls */
.schedule-card[b-wnndbtvkht] {
    display: flex;
    align-items: stretch;
    gap: 14px;
    margin-top: 14px;
    padding: 14px 16px;
    border: 1px solid #d4e2ff;
    border-radius: 14px;
    background: #eef4ff;
}

.sched-days[b-wnndbtvkht] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 88px;
    padding: 8px 14px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid #d4e2ff;
}

.sched-num[b-wnndbtvkht] {
    font-size: 30px;
    font-weight: 800;
    line-height: 1;
    color: var(--blue-2);
}

/* End-before-start: turn the whole card red so the error reads at a glance */
.schedule-card.invalid[b-wnndbtvkht] {
    background: #fde0dc;
    border-color: #f0a9a0;
}

.schedule-card.invalid .sched-days[b-wnndbtvkht] {
    background: #fff;
    border-color: #f0a9a0;
}

.schedule-card.invalid .sched-num[b-wnndbtvkht],
.schedule-card.invalid .sched-unit[b-wnndbtvkht] {
    color: #c0392b;
}

.sched-unit[b-wnndbtvkht] {
    margin-top: 4px;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--muted);
}

.sched-info[b-wnndbtvkht] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 7px;
    flex: 1;
    min-width: 0;
}

.sched-line[b-wnndbtvkht] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ink, #1f2a44);
    line-height: 1.5;
}

.sched-line i[b-wnndbtvkht] { margin-top: 2px; color: var(--blue-2); flex: 0 0 auto; }

.sched-line.warn[b-wnndbtvkht] { color: #9a5b00; }
.sched-line.warn i[b-wnndbtvkht] { color: #c47d04; }

.sched-line.muted-line[b-wnndbtvkht] { color: var(--muted); font-weight: 500; }
.sched-line.muted-line i[b-wnndbtvkht] { color: var(--muted); }

@media (max-width: 560px) {
    .schedule-card[b-wnndbtvkht] { flex-direction: column; }
    .sched-days[b-wnndbtvkht] { flex-direction: row; gap: 8px; min-width: 0; }
}

/* Auto-computed travel distance (read-only mirror of the server's GeoDistance) */
.auto-distance[b-wnndbtvkht] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 12px;
    padding: 11px 14px;
    border: 1px solid #d4e2ff;
    border-radius: 10px;
    background: #eef4ff;
}
.auto-distance .ad-label[b-wnndbtvkht] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 600;
}
.auto-distance .ad-label em[b-wnndbtvkht] { font-style: normal; opacity: .8; }
.auto-distance strong[b-wnndbtvkht] { font-size: 17px; font-weight: 800; color: var(--blue-2); }
.auto-distance .ad-na[b-wnndbtvkht] { color: var(--muted); }
/* /Components/Pages/Missions.razor.rz.scp.css */
/* Auto-status indicator (status follows the date) next to the badge */
.auto-status[b-3y4dv8ye56] {
    margin-inline-start: 6px;
    color: var(--muted);
    font-size: 12px;
    cursor: help;
}

/* «الأيام» column toggle + per-day breakdown subrow */
.day-toggle[b-3y4dv8ye56] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 9px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: var(--blue-2);
    font: inherit;
    font-size: 12.5px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}

.day-toggle:hover[b-3y4dv8ye56] { background: #eef4ff; border-color: var(--blue); }
.day-toggle.open[b-3y4dv8ye56] { background: #eef4ff; border-color: var(--blue); }
.day-toggle i[b-3y4dv8ye56] { font-size: 11px; }

.day-subrow > td[b-3y4dv8ye56] {
    background: #f7f9fc;
    padding: 12px 16px;
}

.mission-days[b-3y4dv8ye56] { display: flex; flex-direction: column; gap: 10px; }

.mission-days-head[b-3y4dv8ye56] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--muted);
}

.mission-days-head i[b-3y4dv8ye56] { color: var(--blue-2); }

.mday-list[b-3y4dv8ye56] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* Each day is a clickable card → opens the per-day edit modal */
.mday[b-3y4dv8ye56] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 9px 12px;
    min-width: 132px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    font: inherit;
    font-size: 13px;
    text-align: start;
    cursor: pointer;
    border-inline-start: 3px solid var(--line);
}

.mday.clickable:hover[b-3y4dv8ye56] { border-color: var(--blue); box-shadow: 0 2px 8px rgba(36, 97, 216, .12); }

.mday-id[b-3y4dv8ye56] { display: flex; align-items: baseline; gap: 7px; }
.mday-id strong[b-3y4dv8ye56] { font-weight: 800; }
.mday-date[b-3y4dv8ye56] { color: var(--muted); font-variant-numeric: tabular-nums; font-size: 12px; }

.mday-meta[b-3y4dv8ye56] { display: flex; align-items: center; gap: 8px; }

.mday-tag[b-3y4dv8ye56] {
    padding: 1px 8px;
    border-radius: 999px;
    background: #eef4ff;
    color: var(--blue-2);
    font-size: 11.5px;
    font-weight: 700;
}

.mday-roster[b-3y4dv8ye56] { display: inline-flex; align-items: center; gap: 3px; color: var(--muted); font-size: 12px; font-weight: 600; }
.mday-roster i[b-3y4dv8ye56] { font-size: 11px; }
.mday-meta > .bi-sticky-fill[b-3y4dv8ye56] { color: #c47d04; font-size: 12px; }

/* Status accent (inline-start bar + tag tint) */
.mday.st-planned[b-3y4dv8ye56] { border-inline-start-color: #94a3b8; }
.mday.st-working[b-3y4dv8ye56] { border-inline-start-color: var(--hero-accent); }
.mday.st-working .mday-tag[b-3y4dv8ye56] { background: var(--blue-soft); color: var(--brand-strong); }
.mday.st-off[b-3y4dv8ye56] { border-inline-start-color: #c47d04; }
.mday.st-off .mday-tag[b-3y4dv8ye56] { background: #fbeccd; color: #9a5b00; }
.mday.st-done[b-3y4dv8ye56] { border-inline-start-color: #2f9e6f; }
.mday.st-done .mday-tag[b-3y4dv8ye56] { background: #d8f1e6; color: #1d7a52; }

/* Weekend day per the working policy (background tint; status bar still wins) */
.mday.weekend[b-3y4dv8ye56] { background: #fff8ec; }

/* Per-day modal: roster chip checklist (mirrors the mission form) */
.scope-head[b-3y4dv8ye56] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.scope-count[b-3y4dv8ye56] { font-size: 12px; color: var(--muted); }

.chip-select[b-3y4dv8ye56] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 6px;
}

.chip-check[b-3y4dv8ye56] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 11px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
}

.chip-check.on[b-3y4dv8ye56] {
    border-color: var(--blue);
    background: #eef4ff;
    color: var(--blue-2);
}

.chip-check input[b-3y4dv8ye56] { accent-color: var(--blue); }
.chip-check .muted[b-3y4dv8ye56] { color: var(--muted); font-weight: 500; }

/* Department badge on each employee chip (mirrors the mission form) */
.chip-dept[b-3y4dv8ye56] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-inline-start: 4px;
    padding: 2px 8px;
    border-radius: 999px;
    background: #eef1f6;
    color: var(--muted);
    font-size: 11.5px;
    font-weight: 700;
}

.chip-dept > i[b-3y4dv8ye56] { font-size: 10.5px; }
.chip-dept.is-primary[b-3y4dv8ye56] { background: var(--blue-soft); color: var(--brand-strong); }
.chip-check.primary-team[b-3y4dv8ye56] { border-color: #cdddff; }
.chip-check.primary-team.on[b-3y4dv8ye56] { border-color: var(--blue); }

/* Assigned-this-day group sits in a soft tray, apart from the candidate list (mirrors the form) */
.chip-select.assigned-group[b-3y4dv8ye56] {
    padding: 10px;
    border: 1px solid #d8e6cf;
    border-radius: 12px;
    background: #f3f9ee;
}

.scope-head .form-label > i[b-3y4dv8ye56] { margin-inline-end: 5px; }
.scope-head .form-label .bi-check2-circle[b-3y4dv8ye56] { color: #1d7a52; }
.scope-head .form-label .bi-plus-circle[b-3y4dv8ye56] { color: var(--blue-2); }

/* Past day → read-only modal: reset the fieldset chrome + dim, plus a locked banner */
.locked-zone[b-3y4dv8ye56] { min-inline-size: 0; margin: 0; padding: 0; border: 0; }
.locked-zone:disabled[b-3y4dv8ye56] { opacity: .72; }

.locked-banner[b-3y4dv8ye56] {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 14px;
    padding: 11px 14px;
    border: 1px solid #f0c98a;
    border-radius: 12px;
    background: #fdf3e0;
    color: #8a5a00;
    font-size: 13.5px;
    font-weight: 600;
}

.locked-banner > i[b-3y4dv8ye56] { font-size: 16px; }
/* /Components/Pages/MissionView.razor.rz.scp.css */
/* Read-only mission dashboard (view page) — prototype #mission-details look.
   Visual language is cloned from ProjectView; classes are scoped per-page (Blazor CSS isolation),
   so the shared look must be DUPLICATED here, not referenced from ProjectView.razor.css. */

/* ---- Hero ---- */
.pv-hero[b-88t134bn8u] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 16px;
    padding: 22px 24px;
    border-radius: 16px;
    /* Navy→blue detail hero — themed (follows --sidebar-2 → --hero-accent). */
    background: var(--hero);
    color: #fff;
}

.pv-hero-main[b-88t134bn8u] { display: flex; align-items: center; gap: 18px; min-width: 0; }

.pv-logo[b-88t134bn8u] {
    width: 72px;
    height: 72px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: #fff;
    flex: 0 0 auto;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.22);
    font-size: 32px;
    color: #2563eb;
}

.pv-hero-text[b-88t134bn8u] { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pv-hero-text h2[b-88t134bn8u] { margin: 0; font-size: 26px; font-weight: 800; }

.pv-kicker[b-88t134bn8u] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    width: fit-content;
    padding: 5px 13px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.28);
    font-size: 12.5px;
    color: rgba(255, 255, 255, 0.82);
}

.pv-kicker i[b-88t134bn8u] { font-size: 13px; }
.pv-kicker-label[b-88t134bn8u] { font-weight: 600; }
.pv-kicker strong[b-88t134bn8u] { color: #fff; font-size: 15px; font-weight: 800; letter-spacing: 0.04em; }
.pv-kicker-sep[b-88t134bn8u] { opacity: 0.5; }

/* Type + overnight chips on the dark hero — translucent pills, matching the kicker. */
.pv-hero-tags[b-88t134bn8u] { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 4px; }
.pv-hero-tag[b-88t134bn8u] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.26);
    color: #fff;
    font-size: 12.5px;
    font-weight: 700;
}
.pv-hero-tag i[b-88t134bn8u] { font-size: 10px; opacity: 0.85; }
.pv-hero-tag.moon[b-88t134bn8u] { background: rgba(99, 102, 241, 0.42); border-color: rgba(199, 210, 254, 0.5); }
a.pv-hero-tag[b-88t134bn8u] { text-decoration: none; transition: background .14s; }
.pv-hero-tag.proj[b-88t134bn8u] { background: rgba(255, 255, 255, 0.22); border-color: rgba(255, 255, 255, 0.42); }
.pv-hero-tag.proj:hover[b-88t134bn8u] { background: rgba(255, 255, 255, 0.36); }

/* Parent-project link inside the details card */
.proj-link[b-88t134bn8u] { color: var(--blue-2, var(--hero-accent)); text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.proj-link:hover[b-88t134bn8u] { text-decoration: underline; }
.proj-link i[b-88t134bn8u] { font-size: 15px; opacity: 0.9; }

/* Status badge — top-left corner of the hero. */
.pv-hero-side[b-88t134bn8u] { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; flex: 0 0 auto; }
.pv-auto-pill[b-88t134bn8u] {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 4px 11px; border-radius: 999px; font-size: 11.5px; font-weight: 700;
    background: rgba(255, 255, 255, 0.18); color: #fff;
}
.pv-auto-pill i[b-88t134bn8u] { font-size: 11px; }

/* Top action toolbar above the hero. */
.pv-toolbar[b-88t134bn8u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.pv-toolbar-actions[b-88t134bn8u] { display: flex; gap: 9px; flex-wrap: wrap; }
.pv-toolbar-actions .btn-disabled[b-88t134bn8u] {
    opacity: .5; cursor: not-allowed;
    display: inline-flex; align-items: center; gap: 6px;
    border: 1px solid var(--line); background: #fff; border-radius: 10px; padding: 8px 14px;
    font-size: 13px; font-weight: 700; color: var(--muted);
}

/* ---- Lock banner (past / cancelled mission → read-only) ---- */
.locked-banner[b-88t134bn8u] {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 14px;
    padding: 11px 14px;
    border: 1px solid #f0c98a;
    border-radius: 12px;
    background: #fdf3e0;
    color: #8a5a00;
    font-size: 13.5px;
    font-weight: 600;
}
.locked-banner.cancelled[b-88t134bn8u] { border-color: #f0a8a8; background: #fdeaea; color: #9a2b2b; }
.locked-banner > i[b-88t134bn8u] { font-size: 16px; }

/* ---- Business flow ---- */
.business-flow[b-88t134bn8u] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: center;
    gap: 12px;
    margin: 0 0 14px;
}

.business-flow div[b-88t134bn8u] {
    min-height: 92px;
    border: 1px solid #e2ebf7;
    border-radius: 16px;
    background: #fff;
    padding: 14px;
    box-shadow: 0 12px 30px rgba(32, 69, 122, 0.06);
}

.business-flow span[b-88t134bn8u] {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    color: #fff;
    background: var(--blue);
    font-weight: 800;
    font-size: 12px;
    margin-bottom: 9px;
}

.business-flow strong[b-88t134bn8u], .business-flow small[b-88t134bn8u] { display: block; }
.business-flow strong[b-88t134bn8u] { font-size: 14px; font-weight: 800; }
.business-flow small[b-88t134bn8u] { color: var(--muted); margin-top: 3px; font-size: 12px; }
.business-flow .bf-soon[b-88t134bn8u] { opacity: 0.72; }
.business-flow .bf-soon span[b-88t134bn8u] { background: #9aa6b8; }

/* ---- Tabs ---- */
.project-tabs[b-88t134bn8u] { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }

.project-tabs button[b-88t134bn8u] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 999px;
    padding: 8px 14px;
    font-size: 13px;
    font-weight: 700;
    color: var(--muted);
    cursor: pointer;
}

.project-tabs button:hover[b-88t134bn8u] { border-color: var(--blue); color: var(--blue-2); }
.project-tabs button.active[b-88t134bn8u] { color: #fff; border-color: var(--blue); background: var(--blue); }
.project-tabs .tab-dot[b-88t134bn8u] { width: 6px; height: 6px; border-radius: 50%; background: var(--amber, #f59e0b); }

/* ---- Metric KPI cards ---- */
.metric-grid[b-88t134bn8u] {
    display: grid;
    grid-template-columns: repeat(4, minmax(160px, 1fr));
    gap: 14px;
    margin-bottom: 16px;
}

.metric-card[b-88t134bn8u] {
    position: relative;
    overflow: hidden;
    padding: 18px 20px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(24, 35, 54, 0.06);
}

.metric-card[b-88t134bn8u]::after { content: ""; position: absolute; top: 0; bottom: 0; inset-inline-start: 0; width: 5px; background: var(--blue); }
.metric-card.accent-green[b-88t134bn8u]::after { background: #16a34a; }
.metric-card.accent-blue[b-88t134bn8u]::after { background: #2563eb; }
.metric-card.accent-amber[b-88t134bn8u]::after { background: #f59e0b; }
.metric-card.accent-red[b-88t134bn8u]::after { background: #dc2626; }
.metric-card.soon[b-88t134bn8u] { opacity: 0.74; }

.metric-label[b-88t134bn8u] { display: block; color: var(--muted); font-size: 13px; font-weight: 600; }
.metric-label .soon-badge[b-88t134bn8u] { margin-inline-start: 4px; vertical-align: middle; }
.metric-value[b-88t134bn8u] { display: block; font-size: 30px; font-weight: 800; line-height: 1.1; margin-top: 8px; color: var(--ink); }
.metric-delta[b-88t134bn8u] { display: block; margin-top: 6px; font-size: 12px; color: #16a34a; }
.metric-card.soon .metric-delta[b-88t134bn8u] { color: var(--muted); }

.soon-badge[b-88t134bn8u] {
    font-style: normal;
    font-size: 10px;
    font-weight: 800;
    padding: 1px 7px;
    border-radius: 999px;
    background: #fff4e0;
    color: #b45309;
}

/* ---- Split grid + rule grid + meta list ---- */
.split-grid[b-88t134bn8u] { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 16px; }
.split-grid > *[b-88t134bn8u] { min-width: 0; }

.rule-grid[b-88t134bn8u] { display: grid; grid-template-columns: repeat(4, minmax(140px, 1fr)); gap: 12px; }
.rule-grid.two[b-88t134bn8u] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rule-grid.three[b-88t134bn8u] { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.rule-box[b-88t134bn8u] { border: 1px solid #d4e2ff; border-radius: 10px; padding: 12px; background: #eef4ff; }
.rule-box span[b-88t134bn8u] { display: block; color: var(--muted); font-size: 12px; margin-bottom: 4px; }
.rule-box strong[b-88t134bn8u] { font-size: 18px; font-weight: 700; }
.rule-box.wide[b-88t134bn8u] { grid-column: 1 / -1; }
.rule-box.premium-rules[b-88t134bn8u] { grid-column: 1 / -1; margin-top: 12px; }
.rule-box.premium-rules strong[b-88t134bn8u] { font-size: 15px; }
.rule-box.premium-rules small[b-88t134bn8u] { display: block; color: var(--muted); margin-top: 5px; font-size: 12px; }

.meta-list[b-88t134bn8u] { display: grid; gap: 8px; }
.meta-list div[b-88t134bn8u] { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 8px; border-bottom: 1px solid #edf1f6; }
.meta-list span[b-88t134bn8u] { color: var(--muted); font-size: 13px; }
.meta-list strong[b-88t134bn8u] { font-size: 14px; font-weight: 700; }

/* ---- Map ---- */
.pv-mini-map[b-88t134bn8u] {
    position: relative;
    display: grid;
    place-items: center;
    gap: 4px;
    min-height: 150px;
    border-radius: 14px;
    border: 1px dashed #c7d6ee;
    background: repeating-linear-gradient(45deg, #f3f7fd, #f3f7fd 12px, #eef4fc 12px, #eef4fc 24px);
    margin-bottom: 12px;
}

.pv-map[b-88t134bn8u] {
    width: 100%;
    height: 300px;
    border-radius: 14px;
    margin-bottom: 12px;
    border: 1px solid var(--line);
    background: #eef2f7;
}

.pv-mini-map strong[b-88t134bn8u] { font-size: 14px; }
.pv-mini-map small[b-88t134bn8u] { color: var(--muted); font-size: 12px; }
.pv-pin[b-88t134bn8u] { width: 16px; height: 16px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); background: #dc2626; box-shadow: 0 4px 10px rgba(220, 38, 38, 0.4); }
.pv-maplink-btn[b-88t134bn8u] { display: inline-flex; align-items: center; gap: 6px; }

/* ---- Operational placeholders ---- */
.op-placeholder[b-88t134bn8u] {
    display: grid;
    place-items: center;
    text-align: center;
    gap: 6px;
    padding: 34px 24px;
    margin-bottom: 14px;
    border: 1px dashed #c7d6ee;
    border-radius: 18px;
    background: #f7faff;
}

.op-placeholder.small[b-88t134bn8u] { padding: 22px 18px; }
.op-placeholder > i[b-88t134bn8u] { font-size: 30px; color: #93b4e8; }
.op-placeholder strong[b-88t134bn8u] { font-size: 15px; }
.op-placeholder p[b-88t134bn8u] { margin: 0; max-width: 56ch; color: var(--muted); font-size: 13px; line-height: 1.7; }
.op-note[b-88t134bn8u] { margin: 12px 0 0; color: var(--muted); font-size: 12px; }

.pv-count[b-88t134bn8u] { display: inline-block; min-width: 22px; padding: 1px 8px; border-radius: 999px; background: var(--soft); color: var(--muted); font-size: 12px; font-weight: 700; text-align: center; }
.pv-notes[b-88t134bn8u] { margin: 0; font-size: 14px; line-height: 1.7; color: var(--text); white-space: pre-wrap; }

/* ---- "No travel" calm note (mission inside the team's own governorate) ---- */
.travel-none[b-88t134bn8u] {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 13px 16px;
    border: 1px solid #bfe3cc;
    border-radius: 12px;
    background: #effaf1;
    color: #1d7a52;
    font-size: 13.5px;
    font-weight: 600;
}
.travel-none > i[b-88t134bn8u] { font-size: 17px; }

/* ---- Per-day timeline (our addition; read-only cards) ---- */
.mday-list[b-88t134bn8u] { display: flex; flex-wrap: wrap; gap: 8px; }

.mday[b-88t134bn8u] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 9px 12px;
    min-width: 138px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    font-size: 13px;
    border-inline-start: 3px solid var(--line);
}

.mday-num[b-88t134bn8u] { color: var(--muted); font-size: 11px; font-weight: 700; }
.mday-id[b-88t134bn8u] { display: flex; align-items: baseline; gap: 7px; }
.mday-id strong[b-88t134bn8u] { font-weight: 800; }
.mday-date[b-88t134bn8u] { color: var(--muted); font-variant-numeric: tabular-nums; font-size: 12px; }

.mday-meta[b-88t134bn8u] { display: flex; align-items: center; gap: 8px; }
.mday-tag[b-88t134bn8u] {
    padding: 1px 8px;
    border-radius: 999px;
    background: #eef4ff;
    color: var(--blue-2);
    font-size: 11.5px;
    font-weight: 700;
}
.mday-roster[b-88t134bn8u] { display: inline-flex; align-items: center; gap: 3px; color: var(--muted); font-size: 12px; font-weight: 600; }
.mday-roster i[b-88t134bn8u] { font-size: 11px; }
.mday-meta > .bi-sticky-fill[b-88t134bn8u] { color: #c47d04; font-size: 12px; }

.mday.st-planned[b-88t134bn8u] { border-inline-start-color: #94a3b8; }
.mday.st-working[b-88t134bn8u] { border-inline-start-color: var(--hero-accent); }
.mday.st-working .mday-tag[b-88t134bn8u] { background: var(--blue-soft); color: var(--brand-strong); }
.mday.st-off[b-88t134bn8u] { border-inline-start-color: #c47d04; }
.mday.st-off .mday-tag[b-88t134bn8u] { background: #fbeccd; color: #9a5b00; }
.mday.st-done[b-88t134bn8u] { border-inline-start-color: #2f9e6f; }
.mday.st-done .mday-tag[b-88t134bn8u] { background: #d8f1e6; color: #1d7a52; }
.mday.weekend[b-88t134bn8u] { background: #fff8ec; }

/* ---- Team strip (responsible team + vehicle, clean boxes) ---- */
.team-strip[b-88t134bn8u] { margin-bottom: 14px; }

/* Distinct-departments banner (makes "members from N depts" explicit) */
.team-depts[b-88t134bn8u] {
    display: flex; align-items: center; flex-wrap: wrap; gap: 7px;
    margin-bottom: 12px; padding: 9px 13px;
    border: 1px solid #d8e6cf; border-radius: 10px; background: #f3f9ee;
    color: #41663a; font-size: 12.5px; font-weight: 600;
}
.team-depts > i[b-88t134bn8u] { font-size: 13px; }
.team-dept-pill[b-88t134bn8u] {
    padding: 2px 9px; border-radius: 999px; background: #fff;
    border: 1px solid #cfe0c2; color: #2f6e3a; font-size: 11.5px; font-weight: 700;
}

.assignee-head-row[b-88t134bn8u] {
    display: flex; align-items: center; justify-content: space-between;
    flex-wrap: wrap; gap: 8px; margin-bottom: 10px;
}
.assignee-head[b-88t134bn8u] {
    display: inline-flex; align-items: center; gap: 6px;
    color: var(--ink); font-size: 13.5px; font-weight: 800;
}
.assignee-head > i[b-88t134bn8u] { color: var(--blue-2); font-size: 13px; }

/* Seen summary chip (how many assignees opened the mission) */
.seen-summary[b-88t134bn8u] {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 3px 11px; border-radius: 999px;
    background: #eef1f6; color: #41506a;
    font-size: 12px; font-weight: 700;
}
.seen-summary > i[b-88t134bn8u] { font-size: 11px; }
.seen-summary.all[b-88t134bn8u] { background: #d8f1e6; color: #1d7a52; }

/* ---- Assignee cards (avatar + clear name + department + position) ---- */
.assignee-grid[b-88t134bn8u] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 10px;
}
.assignee-card[b-88t134bn8u] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 13px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(24, 35, 54, 0.04);
}
.assignee-card.inactive[b-88t134bn8u] { opacity: .72; }

.assignee-av[b-88t134bn8u] {
    flex: 0 0 auto;
    width: 42px; height: 42px;
    border-radius: 50%;
    display: grid; place-items: center;
    background: linear-gradient(135deg, var(--hero-accent), #1b8de0);
    color: #fff; font-weight: 800; font-size: 15px;
    text-transform: uppercase;
}
.assignee-av.alt[b-88t134bn8u] { background: linear-gradient(135deg, #64748b, #94a3b8); }

.assignee-info[b-88t134bn8u] { min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.assignee-name[b-88t134bn8u] { font-weight: 800; font-size: 14.5px; color: var(--ink); line-height: 1.2; }
.assignee-roles[b-88t134bn8u] { display: flex; flex-wrap: wrap; gap: 5px; }

.role-chip[b-88t134bn8u] {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 2px 9px; border-radius: 999px;
    font-size: 11px; font-weight: 700; white-space: nowrap;
}
.role-chip > i[b-88t134bn8u] { font-size: 10px; }
.role-chip.dept[b-88t134bn8u] { background: var(--blue-soft); color: var(--brand-strong); }
.role-chip.dept.alt[b-88t134bn8u] { background: #eef2f6; color: #41506a; }   /* readable, not washed-out grey */
.role-chip.job[b-88t134bn8u] { background: #eafaf1; color: #1d7a52; }
.assignee-flag[b-88t134bn8u] { color: #9a2b2b; font-size: 11px; font-weight: 800; }

/* Per-assignee read-receipt line */
.seen-badge[b-88t134bn8u] {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 11px; font-weight: 700;
}
.seen-badge > i[b-88t134bn8u] { font-size: 11px; }
.seen-badge.seen[b-88t134bn8u] { color: #1d7a52; }
.seen-badge.unseen[b-88t134bn8u] { color: #94a3b8; }

@media (max-width: 900px) {
    .business-flow[b-88t134bn8u] { grid-template-columns: 1fr 1fr; }
    .metric-grid[b-88t134bn8u] { grid-template-columns: 1fr 1fr; }
    .split-grid[b-88t134bn8u] { grid-template-columns: 1fr; }
    .rule-grid[b-88t134bn8u], .rule-grid.three[b-88t134bn8u] { grid-template-columns: 1fr 1fr; }
}

/* Distance box — highlight the auto-computed travel distance */
.rule-box.distance-box[b-88t134bn8u] { border-color: #bcd3a8; background: #f1f8ea; }
.rule-box.distance-box strong[b-88t134bn8u] { color: #2f6e3a; }

/* ===== Attendance tab ===== */
.att-summary[b-88t134bn8u] { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.att-kpi[b-88t134bn8u] {
    flex: 1; min-width: 110px; background: #fff; border: 1px solid #e4e9f1; border-radius: 12px;
    padding: 12px 14px; display: flex; flex-direction: column; gap: 2px;
    border-inline-start: 3px solid #c7d2e2;
}
.att-kpi span[b-88t134bn8u] { font-size: 22px; font-weight: 800; color: #14233f; }
.att-kpi small[b-88t134bn8u] { font-size: 12px; color: #6a7890; }
.att-kpi.green[b-88t134bn8u] { border-inline-start-color: #1f9d57; }
.att-kpi.amber[b-88t134bn8u] { border-inline-start-color: #e6a100; }
.att-kpi.red[b-88t134bn8u] { border-inline-start-color: #d23; }
.att-kpi.blue[b-88t134bn8u] { border-inline-start-color: #1d4ed8; }

.att-day[b-88t134bn8u] { padding: 10px 0; border-bottom: 1px solid #eef2f7; }
.att-day:last-of-type[b-88t134bn8u] { border-bottom: 0; }
.att-day-head[b-88t134bn8u] { font-size: 14px; margin-bottom: 7px; }
.att-grid[b-88t134bn8u] { width: 100%; border-collapse: collapse; font-size: 13px; }
.att-grid td[b-88t134bn8u], .att-grid th[b-88t134bn8u] { padding: 6px 8px; border-bottom: 1px solid #f0f3f8; text-align: start; }
.att-grid th[b-88t134bn8u] { color: #6a7890; font-weight: 600; font-size: 12px; }
.att-grid td.emp[b-88t134bn8u] { font-weight: 600; }
.att-grid td.times[b-88t134bn8u] { font-variant-numeric: tabular-nums; color: #41506a; }
.att-grid.log thead th[b-88t134bn8u], .att-grid.sheet thead th[b-88t134bn8u] { border-bottom: 1px solid #e4e9f1; }
.att-grid.sheet tbody tr:hover td[b-88t134bn8u] { background: #f7f9fc; }
.att-grid .off-row td[b-88t134bn8u] { background: #fafbfd; color: #93a0b5; }
/* Geofence verdict cell: the status pill, then the distance as a separate muted note (no «·» cramming) */
.verdict-cell[b-88t134bn8u] { white-space: nowrap; }
.dist-note[b-88t134bn8u] { color: #6a7890; font-size: 12px; margin-inline-start: 7px; font-variant-numeric: tabular-nums; }

/* Status pills (scoped — Blazor isolates per component) */
.att-badge[b-88t134bn8u] { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; white-space: nowrap; }
.att-OnTime[b-88t134bn8u] { background: #e3f6ec; color: #11713e; }
.att-Late[b-88t134bn8u] { background: #fdf0d8; color: #8a5a00; }
.att-Incomplete[b-88t134bn8u] { background: #fdecec; color: #a01; }
.att-Absent[b-88t134bn8u] { background: #fdecec; color: #a01; }
.att-Pending[b-88t134bn8u] { background: #eef2f8; color: #5a6b85; }
.att-Off[b-88t134bn8u] { background: #e6f2f7; color: #1d6a86; }
.att-OnLeave[b-88t134bn8u] { background: #e0edff; color: #1d4ed8; }
.muted[b-88t134bn8u] { color: #8593a8; }

/* Team feed — employee notes/reports posted from the mobile (per mission-day) */
.feed-panel[b-88t134bn8u] { margin-top: 16px; }
.feed-list[b-88t134bn8u] { display: flex; flex-direction: column; gap: 10px; }
.feed-item[b-88t134bn8u] {
    padding: 12px 14px;
    border: 1px solid var(--line, #e6eaf2);
    border-radius: 12px;
    background: #fff;
    border-inline-start: 3px solid #94a3b8;
}
.feed-item.is-report[b-88t134bn8u] { border-inline-start-color: #0f766e; background: #f5fbfa; }
.feed-item.is-note[b-88t134bn8u] { border-inline-start-color: var(--hero-accent); }
.feed-head[b-88t134bn8u] { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 6px; }
.feed-kind[b-88t134bn8u] {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 2px 10px; border-radius: 999px;
    font-size: 11.5px; font-weight: 800;
}
.feed-kind.note[b-88t134bn8u] { background: var(--blue-soft); color: var(--brand-strong); }
.feed-kind.report[b-88t134bn8u] { background: #d2f0ec; color: #0c5f59; }
.feed-author[b-88t134bn8u] { font-weight: 800; color: var(--sidebar-2); font-size: 13.5px; }
.feed-day[b-88t134bn8u] { font-size: 12px; color: #5a6b85; display: inline-flex; align-items: center; gap: 4px; }
.feed-time[b-88t134bn8u] { margin-inline-start: auto; font-size: 11.5px; color: #8593a8; }
.feed-text[b-88t134bn8u] { margin: 0; color: #1f2a44; font-size: 13.5px; line-height: 1.6; white-space: pre-wrap; }
/* /Components/Pages/Permissions.razor.rz.scp.css */
.perm-toolbar[b-heoevpjmvo] { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.perm-toolbar .form-select[b-heoevpjmvo] { max-width: 190px; }
.perm-toolbar .form-control[type=date][b-heoevpjmvo] { max-width: 170px; }
.perm-toolbar input:not([type=date])[b-heoevpjmvo] { flex: 1; min-width: 200px; }

.table-area[b-heoevpjmvo] { position: relative; min-height: 120px; }
.nowrap[b-heoevpjmvo] { white-space: nowrap; font-variant-numeric: tabular-nums; }
.reason-cell[b-heoevpjmvo] { display: inline-block; max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }

/* status pill */
.pstatus[b-heoevpjmvo] { display: inline-block; padding: 3px 12px; border-radius: 999px; font-size: 12px; font-weight: 800; white-space: nowrap; }
.pstatus-pending[b-heoevpjmvo] { background: #fef3c7; color: #92400e; }
.pstatus-approved[b-heoevpjmvo] { background: #dcfce7; color: #15803d; }
.pstatus-rejected[b-heoevpjmvo] { background: #fee2e2; color: #b91c1c; }
.pstatus-cancelled[b-heoevpjmvo] { background: #e5e7eb; color: #4b5563; }

.btn-review[b-heoevpjmvo] {
    display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; border: none; cursor: pointer;
    border-radius: 8px; font-size: 12.5px; font-weight: 700; color: #fff;
    background: linear-gradient(135deg, var(--sidebar-2), var(--hero-accent));
}
.btn-review:hover[b-heoevpjmvo] { filter: brightness(1.08); }
.decided-by[b-heoevpjmvo] { font-size: 12.5px; color: #475569; font-weight: 600; }

/* review modal */
.perm-modal[b-heoevpjmvo] { max-width: 560px; }
.review-grid[b-heoevpjmvo] { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; }
.review-grid > div[b-heoevpjmvo] { display: flex; flex-direction: column; gap: 2px; }
.review-grid .review-full[b-heoevpjmvo] { grid-column: 1 / -1; }
.review-grid .rl[b-heoevpjmvo] { font-size: 12px; color: #8593a8; font-weight: 600; }
.review-grid strong[b-heoevpjmvo] { font-size: 14px; color: var(--sidebar-2); }
.form-label.mt[b-heoevpjmvo] { display: block; margin-top: 16px; margin-bottom: 6px; font-weight: 600; }
.review-error[b-heoevpjmvo] {
    margin-top: 12px; padding: 9px 12px; border-radius: 8px; font-size: 13px; font-weight: 600;
    background: #fee2e2; color: #b91c1c; display: flex; align-items: center; gap: 7px;
}
/* /Components/Pages/Platform/TenantDetail.razor.rz.scp.css */
.back-link[b-ipe4bn603m] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 18px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
}

.back-link:hover[b-ipe4bn603m] { color: var(--blue); }

/* Hero header */
.tenant-hero[b-ipe4bn603m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 24px;
    margin-bottom: 20px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--panel);
    box-shadow: var(--shadow);
}

.tenant-hero-left[b-ipe4bn603m] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.tenant-avatar[b-ipe4bn603m] {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--sidebar), var(--blue));
    color: #fff;
    font-size: 22px;
    font-weight: 900;
}

.tenant-hero-name[b-ipe4bn603m] {
    font-size: 20px;
    font-weight: 800;
    margin-bottom: 6px;
}

.tenant-hero-meta[b-ipe4bn603m] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.tenant-code[b-ipe4bn603m] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 8px;
    background: #eef4ff;
    color: var(--blue-2);
    font-size: 12px;
    font-weight: 700;
    font-family: "SF Mono", "Fira Code", monospace;
}

.status-badge[b-ipe4bn603m] {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
}

.status-active[b-ipe4bn603m]    { background: #e6faf4; color: var(--green); }
.status-trial[b-ipe4bn603m]     { background: #fff8e6; color: #b87a00; }
.status-suspended[b-ipe4bn603m] { background: #fff0ef; color: var(--red); }
.status-expired[b-ipe4bn603m]   { background: #f0f0f0; color: #777; }

.tenant-hero-actions[b-ipe4bn603m] {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

/* Two-column detail layout */
.detail-grid[b-ipe4bn603m] {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 16px;
    align-items: start;
}

.detail-side[b-ipe4bn603m] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Features count label */
.features-count[b-ipe4bn603m] {
    font-size: 12px;
    color: var(--muted);
    font-weight: 600;
    margin-top: 2px;
}

/* Feature toggle labels */
.capability-grid label[b-ipe4bn603m] {
    cursor: pointer;
    transition: border-color .14s, background .14s;
}

.capability-grid label.feature-on[b-ipe4bn603m] {
    border-color: #b3d9ff;
    background: #f0f8ff;
    color: var(--blue-2);
}

/* Save button */
.btn-save[b-ipe4bn603m] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 16px;
    border-radius: 10px;
    border: none;
    background: var(--blue);
    color: #fff;
    font-weight: 700;
    font-size: 13px;
    cursor: pointer;
    white-space: nowrap;
    transition: background .15s;
}

.btn-save:hover:not(:disabled)[b-ipe4bn603m] { background: var(--blue-2); }
.btn-save:disabled[b-ipe4bn603m] { opacity: .6; cursor: default; }

/* Row buttons */
.btn-row[b-ipe4bn603m] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 14px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 700;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--ink);
    cursor: pointer;
    transition: background .15s;
}

.btn-row:hover:not(:disabled)[b-ipe4bn603m] { background: var(--soft); color: var(--blue); }
.btn-row:disabled[b-ipe4bn603m] { opacity: .6; cursor: default; }
.btn-row.btn-warn[b-ipe4bn603m]    { color: var(--amber); border-color: #ffe5a0; }
.btn-row.btn-success[b-ipe4bn603m] { color: var(--green); border-color: #b3f0de; }

/* Success / error banners */
.alert-success[b-ipe4bn603m] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    margin-bottom: 14px;
    border-radius: 10px;
    background: #e6faf4;
    color: var(--green);
    font-size: 13px;
    font-weight: 600;
}

.alert-error-bar[b-ipe4bn603m] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    border-radius: 12px;
    background: #fff0ef;
    color: var(--red);
    font-weight: 600;
}

/* Subscription form */
.sub-form[b-ipe4bn603m] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.clear-date[b-ipe4bn603m] {
    margin-top: 6px;
    padding: 4px 10px;
    border-radius: 8px;
    border: 1px solid #dce8f6;
    background: transparent;
    color: var(--muted);
    font-size: 12px;
    cursor: pointer;
    align-self: flex-start;
}

.clear-date:hover[b-ipe4bn603m] { color: var(--red); border-color: var(--red); }

/* Info list */
.info-list[b-ipe4bn603m] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.info-row[b-ipe4bn603m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid #f0f6ff;
    font-size: 14px;
}

.info-row:last-child[b-ipe4bn603m] { border-bottom: none; }

.info-label[b-ipe4bn603m] {
    color: var(--muted);
    font-size: 13px;
    font-weight: 600;
}

.muted[b-ipe4bn603m] { color: var(--muted); font-size: 13px; }

.loading-state[b-ipe4bn603m] {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--muted);
    padding: 40px 0;
}

.spinning[b-ipe4bn603m] { animation: shift-spin .8s linear infinite; }

/* Panels inside this page */
.panel[b-ipe4bn603m] {
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: var(--panel);
    box-shadow: var(--shadow);
}

.panel-header[b-ipe4bn603m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.panel-header h3[b-ipe4bn603m] {
    margin: 0;
    font-size: 15px;
    font-weight: 800;
}

.panel-actions[b-ipe4bn603m] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

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

@media (max-width: 640px) {
    .tenant-hero[b-ipe4bn603m] {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ── Brand theme (white-label) panel ─────────────────────────────── */
.theme-panel[b-ipe4bn603m] { margin-top: 20px; }
.theme-body[b-ipe4bn603m] {
    display: grid;
    grid-template-columns: minmax(240px, 340px) 1fr;
    gap: 22px;
    align-items: start;
    margin-top: 6px;
}
.theme-pickers[b-ipe4bn603m] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 16px;
}
.theme-picker[b-ipe4bn603m] { display: flex; flex-direction: column; gap: 5px; }
.theme-picker .form-label[b-ipe4bn603m] { font-size: 12.5px; font-weight: 600; color: var(--ink); }
.color-row[b-ipe4bn603m] { display: flex; align-items: center; gap: 8px; }
.color-row input[type="color"][b-ipe4bn603m] {
    inline-size: 42px;
    block-size: 34px;
    padding: 2px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #fff;
    cursor: pointer;
}
.color-row code[b-ipe4bn603m] {
    font-size: 12px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .3px;
}
.picker-hint[b-ipe4bn603m] {
    display: block;
    margin-top: 4px;
    font-size: 11.5px;
    line-height: 1.5;
    color: var(--muted);
}

/* live preview */
.theme-preview[b-ipe4bn603m] {
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 14px;
    background: var(--soft);
}
.tp-label[b-ipe4bn603m] { font-size: 12px; font-weight: 700; color: var(--muted); margin-bottom: 10px; }
.tp-shell[b-ipe4bn603m] {
    display: flex;
    gap: 0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(32, 69, 122, .14);
    min-block-size: 150px;
}
.tp-sidebar[b-ipe4bn603m] {
    inline-size: 96px;
    padding: 12px 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.tp-logo[b-ipe4bn603m] {
    inline-size: 30px; block-size: 30px;
    border-radius: 8px;
    background: rgba(255, 255, 255, .16);
    color: #fff;
    font-weight: 800;
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 6px;
}
.tp-nav[b-ipe4bn603m] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #dfe7f5;
    font-size: 12px;
    padding: 6px 8px;
    border-radius: 8px;
}
.tp-nav i[b-ipe4bn603m] { font-size: 11px; }
.tp-nav.on[b-ipe4bn603m] { color: #fff; font-weight: 700; }
.tp-main[b-ipe4bn603m] { flex: 1; background: #fff; display: flex; flex-direction: column; }
.tp-hero[b-ipe4bn603m] {
    color: #fff;
    font-weight: 800;
    font-size: 14px;
    padding: 18px 16px;
}
.tp-row[b-ipe4bn603m] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    flex-wrap: wrap;
}
.tp-btn[b-ipe4bn603m] {
    border: 0;
    color: #fff;
    font-weight: 700;
    font-size: 13px;
    padding: 9px 16px;
    border-radius: 9px;
    cursor: default;
}
.tp-chip[b-ipe4bn603m] {
    color: #fff;
    font-weight: 700;
    font-size: 12px;
    padding: 5px 12px;
    border-radius: 999px;
}
.tp-link[b-ipe4bn603m] { font-weight: 700; font-size: 13px; }

@media (max-width: 860px) {
    .theme-body[b-ipe4bn603m] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Platform/Tenants.razor.rz.scp.css */
.tenant-table-wrap[b-8gaof2ilej] {
    border: 1px solid var(--line);
    border-radius: 18px;
    overflow: hidden;
    background: #fff;
    box-shadow: var(--shadow);
}

.tenant-table[b-8gaof2ilej] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.tenant-table thead tr[b-8gaof2ilej] {
    background: var(--soft);
    border-bottom: 1px solid var(--line);
}

.tenant-table th[b-8gaof2ilej] {
    padding: 12px 18px;
    font-weight: 700;
    color: var(--muted);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .05em;
    white-space: nowrap;
}

.tenant-table td[b-8gaof2ilej] {
    padding: 14px 18px;
    border-bottom: 1px solid #f0f6ff;
    vertical-align: middle;
}

.tenant-table tbody tr:last-child td[b-8gaof2ilej] {
    border-bottom: none;
}

.tenant-table tbody tr:hover td[b-8gaof2ilej] {
    background: #f7fbff;
}

.row-expired td[b-8gaof2ilej] {
    opacity: .7;
}

.tenant-code[b-8gaof2ilej] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 8px;
    background: #eef4ff;
    color: var(--blue-2);
    font-size: 12px;
    font-weight: 700;
    font-family: "SF Mono", "Fira Code", monospace;
}

.status-badge[b-8gaof2ilej] {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    margin-left: 4px;
}

.status-active[b-8gaof2ilej]    { background: #e6faf4; color: var(--green); }
.status-trial[b-8gaof2ilej]     { background: #fff8e6; color: #b87a00; }
.status-suspended[b-8gaof2ilej] { background: #fff0ef; color: var(--red); }
.status-expired[b-8gaof2ilej]   { background: #f0f0f0; color: #777; }

.muted[b-8gaof2ilej] { color: var(--muted); font-size: 13px; }

.row-actions[b-8gaof2ilej] {
    display: flex;
    gap: 8px;
    align-items: center;
    white-space: nowrap;
}

.btn-row[b-8gaof2ilej] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 700;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--ink);
    cursor: pointer;
    text-decoration: none;
    transition: background .15s;
}

.btn-row:hover[b-8gaof2ilej]       { background: var(--soft); color: var(--blue); }
.btn-row.btn-warn[b-8gaof2ilej]    { color: var(--amber); border-color: #ffe5a0; }
.btn-row.btn-success[b-8gaof2ilej] { color: var(--green); border-color: #b3f0de; }

.empty-row[b-8gaof2ilej] {
    text-align: center;
    color: var(--muted);
    padding: 48px 0;
}

.btn-primary[b-8gaof2ilej] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 10px 20px;
    border-radius: 12px;
    border: none;
    background: var(--blue);
    color: #fff;
    font-weight: 800;
    font-size: 14px;
    cursor: pointer;
    white-space: nowrap;
}

.btn-primary:hover[b-8gaof2ilej] { background: var(--blue-2); }

.btn-secondary[b-8gaof2ilej] {
    padding: 10px 20px;
    border-radius: 12px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--ink);
    font-weight: 700;
    cursor: pointer;
}

.loading-state[b-8gaof2ilej] {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--muted);
    padding: 40px 0;
}

.spinning[b-8gaof2ilej] { animation: shift-spin .8s linear infinite; }

.alert-error[b-8gaof2ilej] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    border-radius: 12px;
    background: #fff0ef;
    color: var(--red);
    font-weight: 600;
}

.alert-error button[b-8gaof2ilej] {
    margin-right: auto;
    padding: 5px 14px;
    border-radius: 8px;
    border: 1px solid var(--red);
    background: transparent;
    color: var(--red);
    cursor: pointer;
    font-weight: 700;
}

/* Modal */
.modal-backdrop[b-8gaof2ilej] {
    position: fixed;
    inset: 0;
    background: rgba(7, 23, 49, .5);
    backdrop-filter: blur(3px);
    z-index: 100;
}

.modal-panel[b-8gaof2ilej] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 101;
    width: 440px;
    max-width: calc(100vw - 32px);
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 32px 80px rgba(7, 23, 49, .22);
    overflow: hidden;
}

.modal-head[b-8gaof2ilej] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 22px;
    border-bottom: 1px solid var(--line);
    font-size: 16px;
    font-weight: 800;
}

.modal-close[b-8gaof2ilej] {
    border: none;
    background: none;
    color: var(--muted);
    cursor: pointer;
    font-size: 16px;
    padding: 4px;
}

.modal-body[b-8gaof2ilej] {
    padding: 22px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-8gaof2ilej] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 16px 22px;
    border-top: 1px solid var(--line);
    background: var(--soft);
}

.field-group[b-8gaof2ilej] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.field-group label[b-8gaof2ilej] {
    font-weight: 700;
    font-size: 13px;
}

.field-hint[b-8gaof2ilej] {
    color: var(--muted);
    font-size: 11px;
}

.features-header[b-8gaof2ilej] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.features-header label[b-8gaof2ilej] {
    font-weight: 700;
    font-size: 13px;
}

.features-toggles[b-8gaof2ilej] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--muted);
    font-size: 12px;
}

.toggle-link[b-8gaof2ilej] {
    border: none;
    background: none;
    color: var(--blue);
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    padding: 0;
}

.toggle-link:hover[b-8gaof2ilej] { text-decoration: underline; }

.capability-grid label.feature-on[b-8gaof2ilej] {
    border-color: #b3d9ff;
    background: #f0f8ff;
    color: var(--blue-2);
}

.form-error[b-8gaof2ilej] {
    padding: 10px 14px;
    border-radius: 10px;
    background: #fff0ef;
    color: var(--red);
    font-size: 13px;
    font-weight: 600;
}
/* /Components/Pages/ProjectForm.razor.rz.scp.css */
/* Map location-picker chrome (mirrors the branch / SPC picker). */
.map-section[b-k6i9vekkzz] {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed var(--line);
}

.map-placeholder[b-k6i9vekkzz] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px;
    margin: 8px 0 12px;
    border: 1px dashed var(--line);
    border-radius: 12px;
    background: var(--soft);
    color: var(--muted);
    font-size: 13px;
}

.map-placeholder i[b-k6i9vekkzz] { font-size: 22px; }

.map-hint[b-k6i9vekkzz] {
    font-size: 12px;
    color: var(--muted);
    margin: 4px 0 8px;
}

.map-search-row[b-k6i9vekkzz] {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

.map-search-row input[b-k6i9vekkzz] { flex: 1; }
.map-search-row .btn-ghost[b-k6i9vekkzz] { white-space: nowrap; }

#projMap[b-k6i9vekkzz],
#siteMap[b-k6i9vekkzz] {
    width: 100%;
    height: 320px;
    border-radius: 12px;
    margin: 8px 0 12px;
    border: 1px solid var(--line);
    background: #eef2f7;
}

/* Project logo upload (mirrors the company-logo picker). */
.proj-logo-img[b-k6i9vekkzz] {
    flex: 0 0 auto;
    width: 56px;
    height: 56px;
    border-radius: 16px;
    object-fit: cover;
    border: 1px solid var(--line);
    background: #fff;
}

.logo-upload-btn[b-k6i9vekkzz] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: 9px;
    border: 1px solid var(--line);
    background: var(--soft);
    color: var(--blue-2);
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}

.logo-upload-btn:hover[b-k6i9vekkzz] { background: #eef4ff; }

/* Assignment scope (teams / vehicles): two radio blocks + chip multiselect. */
.scope-grid[b-k6i9vekkzz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.scope-block[b-k6i9vekkzz] {
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 14px;
    background: var(--soft);
}

.scope-head[b-k6i9vekkzz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.scope-count[b-k6i9vekkzz] {
    font-size: 12px;
    color: var(--muted);
}

.scope-opt[b-k6i9vekkzz] {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 12px;
    margin-bottom: 8px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
}

.scope-opt.on[b-k6i9vekkzz] {
    border-color: var(--blue);
    background: #eef4ff;
    color: var(--blue-2);
}

.scope-opt input[b-k6i9vekkzz] { accent-color: var(--blue); }

.chip-select[b-k6i9vekkzz] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 6px;
}

.chip-check[b-k6i9vekkzz] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 11px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
}

.chip-check.on[b-k6i9vekkzz] {
    border-color: var(--blue);
    background: #eef4ff;
    color: var(--blue-2);
}

.chip-check input[b-k6i9vekkzz] { accent-color: var(--blue); }

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

/* Scope/contract tag editor */
.tag-editor[b-k6i9vekkzz] {
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 10px;
    background: var(--soft);
}

.tag-selected[b-k6i9vekkzz] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
}

.tag-chip[b-k6i9vekkzz] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 6px 5px 11px;
    border-radius: 999px;
    background: var(--blue);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
}

.tag-chip button[b-k6i9vekkzz] {
    display: grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.25);
    color: #fff;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
}

.tag-chip button:hover[b-k6i9vekkzz] { background: rgba(255, 255, 255, 0.45); }

.tag-input-row[b-k6i9vekkzz] {
    display: flex;
    gap: 8px;
}

.tag-input-row .form-control[b-k6i9vekkzz] { flex: 1; background: #fff; }
.tag-input-row .btn-ghost[b-k6i9vekkzz] { white-space: nowrap; }

.tag-catalog[b-k6i9vekkzz] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed var(--line);
}

.tag-suggest[b-k6i9vekkzz] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 11px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: var(--blue-2);
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
}

.tag-suggest:hover[b-k6i9vekkzz] { border-color: var(--blue); background: #eef4ff; }
.tag-suggest i[b-k6i9vekkzz] { font-size: 12px; }

/* Attachments */
.att-block[b-k6i9vekkzz] {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px dashed var(--line);
}

.att-upload[b-k6i9vekkzz] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 8px 0;
    flex-wrap: wrap;
}

.att-list[b-k6i9vekkzz] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 8px;
}

.att-row[b-k6i9vekkzz] {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 9px 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
}

.att-row > i[b-k6i9vekkzz] { font-size: 20px; color: var(--blue-2); flex: 0 0 auto; }

.att-info[b-k6i9vekkzz] { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.att-name[b-k6i9vekkzz] { font-weight: 700; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.att-meta[b-k6i9vekkzz] { font-size: 12px; color: var(--muted); }

.btn-icon[b-k6i9vekkzz] {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: var(--soft);
    color: var(--blue-2);
    cursor: pointer;
}

.btn-icon:hover[b-k6i9vekkzz] { background: #eef4ff; }
.btn-icon.danger[b-k6i9vekkzz] { color: var(--danger); }
.btn-icon.danger:hover[b-k6i9vekkzz] { background: #fdecec; }
/* /Components/Pages/Projects.razor.rz.scp.css */

/* Expand toggle column + nested site sub-rows (project → its sites, tree-style). */
.expand-col[b-w9ylph0c62] {
    width: 44px;
    text-align: center;
}

.expand-btn[b-w9ylph0c62] {
    width: 30px;
    height: 30px;
}

.expand-btn i[b-w9ylph0c62] {
    transition: transform 0.15s ease;
    font-size: 13px;
}

[b-w9ylph0c62] tr.row-expanded > td {
    background: #f5f8ff;
}

/* The sub-row spans the full table width and hosts a compact inner table. */
[b-w9ylph0c62] tr.site-subrow > td {
    padding: 0;
    background: #f9fbff;
    border-top: 0;
}

.site-subtable-head[b-w9ylph0c62] {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 10px 18px 6px;
    font-size: 12px;
    font-weight: 700;
    color: var(--blue-2);
}

.site-subtable-head i[b-w9ylph0c62] { font-size: 14px; }

.site-subtable[b-w9ylph0c62] {
    width: calc(100% - 32px);
    margin: 0 16px 14px;
    border-collapse: collapse;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 10px;
    overflow: hidden;
}

.site-subtable thead th[b-w9ylph0c62] {
    text-align: start;
    padding: 8px 12px;
    font-size: 11px;
    font-weight: 700;
    color: var(--muted);
    background: var(--soft);
    border-bottom: 1px solid var(--line);
    white-space: nowrap;
}

.site-subtable tbody td[b-w9ylph0c62] {
    padding: 9px 12px;
    font-size: 13px;
    border-bottom: 1px solid #f0f3f8;
}

.site-subtable tbody tr:last-child td[b-w9ylph0c62] { border-bottom: 0; }

.subrow-hint[b-w9ylph0c62] {
    padding: 12px 18px;
    font-size: 13px;
    color: var(--muted);
}

.subrow-more[b-w9ylph0c62] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin: 0 16px 14px;
    padding: 7px 14px;
    border: 1px solid var(--blue);
    border-radius: 9px;
    background: #eef4ff;
    color: var(--blue-2);
    font-size: 12.5px;
    font-weight: 700;
    cursor: pointer;
}

.subrow-more:hover[b-w9ylph0c62] { background: #e2ecff; }
.subrow-more i[b-w9ylph0c62] { font-size: 15px; }
/* /Components/Pages/ProjectView.razor.rz.scp.css */
/* Read-only project dashboard (view page) — prototype #project-details look. */

/* ---- Hero ---- */
.pv-hero[b-c81uq52go1] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 16px;
    padding: 22px 24px;
    border-radius: 16px;
    /* Navy→blue detail hero — themed (follows --sidebar-2 → --hero-accent). */
    background: var(--hero);
    color: #fff;
}

.pv-hero-main[b-c81uq52go1] { display: flex; align-items: center; gap: 18px; min-width: 0; }

.pv-logo[b-c81uq52go1] {
    width: 72px;
    height: 72px;
    border-radius: 18px;
    object-fit: cover;
    background: #fff;
    flex: 0 0 auto;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.22);
}

.pv-logo.letter[b-c81uq52go1] { display: grid; place-items: center; font-size: 34px; font-weight: 800; color: #2563eb; }

.pv-hero-text[b-c81uq52go1] { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pv-hero-text h2[b-c81uq52go1] { margin: 0; font-size: 26px; font-weight: 800; }

/* Prominent project-code kicker (the code matters to the customer). */
.pv-kicker[b-c81uq52go1] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    width: fit-content;
    padding: 5px 13px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.28);
    font-size: 12.5px;
    color: rgba(255, 255, 255, 0.82);
}

.pv-kicker i[b-c81uq52go1] { font-size: 13px; }
.pv-kicker-label[b-c81uq52go1] { font-weight: 600; }
.pv-kicker strong[b-c81uq52go1] { color: #fff; font-size: 15px; font-weight: 800; letter-spacing: 0.04em; }
.pv-kicker-sep[b-c81uq52go1] { opacity: 0.5; }

/* Scope tags on the dark hero — translucent pills, matching the kicker. */
.pv-hero-tags[b-c81uq52go1] { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 4px; }
.pv-hero-tag[b-c81uq52go1] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.26);
    color: #fff;
    font-size: 12.5px;
    font-weight: 700;
}
.pv-hero-tag i[b-c81uq52go1] { font-size: 10px; opacity: 0.8; }

/* Status + priority badges — top-left corner of the hero. */
.pv-hero-side[b-c81uq52go1] { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; flex: 0 0 auto; }

.pv-priority[b-c81uq52go1] { padding: 4px 12px; border-radius: 999px; font-size: 12px; font-weight: 700; background: rgba(255, 255, 255, 0.2); }
.pv-priority.prio-critical[b-c81uq52go1] { background: #dc2626; }
.pv-priority.prio-high[b-c81uq52go1] { background: #ea580c; }
.pv-priority.prio-low[b-c81uq52go1] { background: rgba(255, 255, 255, 0.16); }

/* Top action toolbar above the hero — back (start/right) + edit·delete (end/left). */
.pv-toolbar[b-c81uq52go1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}

.pv-toolbar-actions[b-c81uq52go1] { display: flex; gap: 9px; flex-wrap: wrap; }

/* ---- Business flow ---- */
.business-flow[b-c81uq52go1] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: center;
    gap: 12px;
    margin: 0 0 14px;
}

.business-flow div[b-c81uq52go1] {
    min-height: 92px;
    border: 1px solid #e2ebf7;
    border-radius: 16px;
    background: #fff;
    padding: 14px;
    box-shadow: 0 12px 30px rgba(32, 69, 122, 0.06);
}

.business-flow span[b-c81uq52go1] {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    color: #fff;
    background: var(--blue);
    font-weight: 800;
    font-size: 12px;
    margin-bottom: 9px;
}

.business-flow strong[b-c81uq52go1], .business-flow small[b-c81uq52go1] { display: block; }
.business-flow strong[b-c81uq52go1] { font-size: 14px; font-weight: 800; }
.business-flow small[b-c81uq52go1] { color: var(--muted); margin-top: 3px; font-size: 12px; }
.business-flow .bf-soon[b-c81uq52go1] { opacity: 0.72; }
.business-flow .bf-soon span[b-c81uq52go1] { background: #9aa6b8; }

/* ---- Tabs ---- */
.project-tabs[b-c81uq52go1] { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }

.project-tabs button[b-c81uq52go1] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 999px;
    padding: 8px 14px;
    font-size: 13px;
    font-weight: 700;
    color: var(--muted);
    cursor: pointer;
}

.project-tabs button:hover[b-c81uq52go1] { border-color: var(--blue); color: var(--blue-2); }
.project-tabs button.active[b-c81uq52go1] { color: #fff; border-color: var(--blue); background: var(--blue); }
.project-tabs .tab-dot[b-c81uq52go1] { width: 6px; height: 6px; border-radius: 50%; background: var(--amber, #f59e0b); }

/* ---- Metric KPI cards (number-forward archetype for the analytics dashboard;
        distinct from the count-overview .stat-card, same token system) ---- */
.metric-grid[b-c81uq52go1] {
    display: grid;
    grid-template-columns: repeat(4, minmax(160px, 1fr));
    gap: 14px;
    margin-bottom: 16px;
}

.metric-card[b-c81uq52go1] {
    position: relative;
    overflow: hidden;
    padding: 18px 20px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(24, 35, 54, 0.06);
}

.metric-card[b-c81uq52go1]::after { content: ""; position: absolute; top: 0; bottom: 0; inset-inline-start: 0; width: 5px; background: var(--blue); }
.metric-card.accent-green[b-c81uq52go1]::after { background: #16a34a; }
.metric-card.accent-blue[b-c81uq52go1]::after { background: #2563eb; }
.metric-card.accent-amber[b-c81uq52go1]::after { background: #f59e0b; }
.metric-card.accent-red[b-c81uq52go1]::after { background: #dc2626; }
.metric-card.soon[b-c81uq52go1] { opacity: 0.74; }

.metric-label[b-c81uq52go1] { display: block; color: var(--muted); font-size: 13px; font-weight: 600; }
.metric-label .soon-badge[b-c81uq52go1] { margin-inline-start: 4px; vertical-align: middle; }
.metric-value[b-c81uq52go1] { display: block; font-size: 30px; font-weight: 800; line-height: 1.1; margin-top: 8px; color: var(--ink); }
.metric-delta[b-c81uq52go1] { display: block; margin-top: 6px; font-size: 12px; color: #16a34a; }
.metric-card.soon .metric-delta[b-c81uq52go1] { color: var(--muted); }

.soon-badge[b-c81uq52go1] {
    font-style: normal;
    font-size: 10px;
    font-weight: 800;
    padding: 1px 7px;
    border-radius: 999px;
    background: #fff4e0;
    color: #b45309;
}

/* ---- Split grid + rule grid + meta list ---- */
.split-grid[b-c81uq52go1] { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 16px; }
.split-grid > *[b-c81uq52go1] { min-width: 0; }

.rule-grid[b-c81uq52go1] { display: grid; grid-template-columns: repeat(4, minmax(140px, 1fr)); gap: 12px; }
.rule-grid.two[b-c81uq52go1] { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.rule-box[b-c81uq52go1] { border: 1px solid #d4e2ff; border-radius: 10px; padding: 12px; background: #eef4ff; }
.rule-box span[b-c81uq52go1] { display: block; color: var(--muted); font-size: 12px; margin-bottom: 4px; }
.rule-box strong[b-c81uq52go1] { font-size: 18px; font-weight: 700; }
.rule-box.premium-rules[b-c81uq52go1] { grid-column: 1 / -1; margin-top: 12px; }
.rule-box.premium-rules strong[b-c81uq52go1] { font-size: 15px; }
.rule-box.premium-rules small[b-c81uq52go1] { display: block; color: var(--muted); margin-top: 5px; font-size: 12px; }

.meta-list[b-c81uq52go1] { display: grid; gap: 8px; }
.meta-list div[b-c81uq52go1] { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 8px; border-bottom: 1px solid #edf1f6; }
.meta-list span[b-c81uq52go1] { color: var(--muted); font-size: 13px; }
.meta-list strong[b-c81uq52go1] { font-size: 14px; font-weight: 700; }

/* ---- Mini map placeholder ---- */
.pv-mini-map[b-c81uq52go1] {
    position: relative;
    display: grid;
    place-items: center;
    gap: 4px;
    min-height: 150px;
    border-radius: 14px;
    border: 1px dashed #c7d6ee;
    background: repeating-linear-gradient(45deg, #f3f7fd, #f3f7fd 12px, #eef4fc 12px, #eef4fc 24px);
    margin-bottom: 12px;
}

.pv-map[b-c81uq52go1] {
    width: 100%;
    height: 300px;
    border-radius: 14px;
    margin-bottom: 12px;
    border: 1px solid var(--line);
    background: #eef2f7;
}

.pv-mini-map strong[b-c81uq52go1] { font-size: 14px; }
.pv-mini-map small[b-c81uq52go1] { color: var(--muted); font-size: 12px; }
.pv-pin[b-c81uq52go1] { width: 16px; height: 16px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); background: #dc2626; box-shadow: 0 4px 10px rgba(220, 38, 38, 0.4); }
.pv-maplink-btn[b-c81uq52go1] { display: inline-flex; align-items: center; gap: 6px; }

/* ---- Site coverage grid ---- */
.site-coverage-grid[b-c81uq52go1] { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; margin-bottom: 14px; }
.coverage-box[b-c81uq52go1] { border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; background: #fbfcfe; }
.coverage-box strong[b-c81uq52go1] { display: block; font-size: 14px; }
.coverage-box span[b-c81uq52go1] { display: block; color: var(--text); font-size: 12.5px; margin-top: 3px; }
.coverage-box small[b-c81uq52go1] { display: block; color: var(--muted); font-size: 11.5px; margin-top: 4px; }

/* ---- Bar chart (finance) ---- */
.bar-chart[b-c81uq52go1] { display: grid; gap: 14px; }
.bar-row[b-c81uq52go1] { display: grid; grid-template-columns: 80px 1fr 80px; align-items: center; gap: 12px; }
.bar-row span[b-c81uq52go1] { color: var(--muted); font-size: 13px; }
.bar-row > div[b-c81uq52go1] { height: 10px; border-radius: 999px; background: #edf1f6; overflow: hidden; }
.bar-row i[b-c81uq52go1] { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #22d3ee, #16a34a); }
.bar-row strong[b-c81uq52go1] { font-size: 13px; text-align: start; }

/* ---- Scope tags (a full-width rule-box like the rest) ---- */
.rule-box.scope-box[b-c81uq52go1] { grid-column: 1 / -1; }
.pv-tags[b-c81uq52go1] { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 8px; }
.pv-tag[b-c81uq52go1] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 13px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid #c5d8f7;
    color: var(--blue-2);
    font-size: 13px;
    font-weight: 700;
    box-shadow: 0 1px 2px rgba(20, 50, 110, 0.05);
}
.pv-tag i[b-c81uq52go1] { font-size: 11px; opacity: 0.85; }

/* ---- Operational placeholders ---- */
.op-placeholder[b-c81uq52go1] {
    display: grid;
    place-items: center;
    text-align: center;
    gap: 6px;
    padding: 34px 24px;
    margin-bottom: 14px;
    border: 1px dashed #c7d6ee;
    border-radius: 18px;
    background: #f7faff;
}

.op-placeholder.small[b-c81uq52go1] { padding: 22px 18px; }
.op-placeholder > i[b-c81uq52go1] { font-size: 30px; color: #93b4e8; }
.op-placeholder strong[b-c81uq52go1] { font-size: 15px; }
.op-placeholder p[b-c81uq52go1] { margin: 0; max-width: 56ch; color: var(--muted); font-size: 13px; line-height: 1.7; }
.op-note[b-c81uq52go1] { margin: 12px 0 0; color: var(--muted); font-size: 12px; }

/* ---- Attachments ---- */
.pv-count[b-c81uq52go1] { display: inline-block; min-width: 22px; padding: 1px 8px; border-radius: 999px; background: var(--soft); color: var(--muted); font-size: 12px; font-weight: 700; text-align: center; }
.att-ico[b-c81uq52go1] { color: var(--blue-2); margin-inline-end: 6px; }

.pv-notes[b-c81uq52go1] { margin: 0; font-size: 14px; line-height: 1.7; color: var(--text); white-space: pre-wrap; }

@media (max-width: 900px) {
    .business-flow[b-c81uq52go1] { grid-template-columns: 1fr 1fr; }
    .metric-grid[b-c81uq52go1] { grid-template-columns: 1fr 1fr; }
    .split-grid[b-c81uq52go1] { grid-template-columns: 1fr; }
    .rule-grid[b-c81uq52go1] { grid-template-columns: 1fr 1fr; }
}
/* /Components/Pages/Roles.razor.rz.scp.css */
.page-wrap[b-gp9apf0z9v] { display: flex; flex-direction: column; gap: 18px; }

.table-area[b-gp9apf0z9v] { position: relative; min-height: 120px; }
.reload-overlay[b-gp9apf0z9v] {
    position: absolute; inset: 0; z-index: 5;
    display: flex; align-items: center; justify-content: center; gap: 8px;
    background: rgba(255, 255, 255, .72); color: var(--brand-strong);
    font-weight: 700; backdrop-filter: blur(1px);
}
.empty-state[b-gp9apf0z9v] {
    display: flex; flex-direction: column; align-items: center; gap: 8px;
    padding: 46px 16px; color: var(--muted); text-align: center;
}
.empty-state i[b-gp9apf0z9v] { font-size: 30px; opacity: .55; }

/* table cells */
.role-code[b-gp9apf0z9v] { font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; margin-top: 2px; }
.role-desc[b-gp9apf0z9v] { max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); }
.perm-count[b-gp9apf0z9v] { font-weight: 800; color: var(--brand-strong); font-variant-numeric: tabular-nums; }

.role-badge[b-gp9apf0z9v] { display: inline-block; padding: 3px 12px; border-radius: 999px; font-size: 12px; font-weight: 800; white-space: nowrap; }
.role-badge.system[b-gp9apf0z9v] { background: #e0f2fe; color: #075985; }
.role-badge.custom[b-gp9apf0z9v] { background: #dcfce7; color: #166534; }
.role-badge.active[b-gp9apf0z9v] { background: #dcfce7; color: #166534; }
.role-badge.inactive[b-gp9apf0z9v] { background: #f1f5f9; color: #64748b; }

.gm-note[b-gp9apf0z9v] { display: inline-block; margin-inline-start: 8px; font-size: 11px; font-weight: 800; color: var(--brand-strong); background: var(--blue-soft); padding: 2px 8px; border-radius: 999px; }
.user-count[b-gp9apf0z9v] { font-weight: 800; font-variant-numeric: tabular-nums; }

/* matrix panel */
.matrix-pick[b-gp9apf0z9v] { display: flex; align-items: center; gap: 8px; }
.matrix-pick .form-select[b-gp9apf0z9v] { min-width: 220px; }

.perm-legend[b-gp9apf0z9v] {
    display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px;
    background: #f8fbff; border: 1px solid var(--line); border-radius: 12px;
    padding: 10px 14px; margin: 0 0 12px; font-size: 12.5px; color: var(--muted);
}
.perm-legend .legend-title[b-gp9apf0z9v] { font-weight: 800; color: var(--ink); }
.perm-legend b[b-gp9apf0z9v] { color: var(--brand-strong); font-weight: 800; }

.matrix-table th.cell[b-gp9apf0z9v], .matrix-table td.cell[b-gp9apf0z9v] { text-align: center; width: 84px; }
.matrix-table .cell-on[b-gp9apf0z9v] { color: #16a34a; font-size: 16px; }
.matrix-table .cell-off[b-gp9apf0z9v] { color: #cbd5e1; }
.matrix-table .cell-na[b-gp9apf0z9v] { color: #e2e8f0; }

/* user↔role overview */
.assign-chips[b-gp9apf0z9v] { display: flex; flex-wrap: wrap; gap: 5px; }
.assign-chip[b-gp9apf0z9v] { background: var(--blue-soft); color: var(--brand-strong); font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 999px; }

/* modal preset button row */
.matrix-tools[b-gp9apf0z9v] { display: flex; align-items: center; gap: 12px; }
.btn-ghost.sm[b-gp9apf0z9v] { padding: 4px 10px; font-size: 12px; min-height: 0; }

.icon-btn.danger:hover[b-gp9apf0z9v] { color: var(--red); }

/* modal sizing */
.role-modal[b-gp9apf0z9v] { max-width: 720px; width: 92vw; }

.role-sys-note[b-gp9apf0z9v] {
    display: flex; align-items: center; gap: 8px;
    background: #eff6ff; color: #1e40af; border: 1px solid #bfdbfe;
    border-radius: 10px; padding: 9px 12px; font-size: 13px; font-weight: 600; margin-bottom: 12px;
}

/* permission matrix */
.perm-matrix-head[b-gp9apf0z9v] {
    display: flex; align-items: baseline; justify-content: space-between;
    margin: 14px 0 6px;
}
.perm-selected[b-gp9apf0z9v] { font-size: 12px; font-weight: 800; color: var(--brand-strong); }

.perm-matrix[b-gp9apf0z9v] {
    display: flex; flex-direction: column; gap: 8px;
    border: 1px solid var(--line); border-radius: 12px; padding: 10px; background: #fbfdff;
    max-height: 340px; overflow-y: auto;
}
.perm-row[b-gp9apf0z9v] {
    display: grid; grid-template-columns: 150px 1fr; gap: 10px; align-items: center;
    padding: 6px 4px; border-bottom: 1px dashed var(--line);
}
.perm-row:last-child[b-gp9apf0z9v] { border-bottom: none; }
.perm-module[b-gp9apf0z9v] { display: flex; align-items: center; gap: 8px; font-weight: 700; color: var(--ink); }
.perm-mod-toggle[b-gp9apf0z9v] {
    background: none; border: none; cursor: pointer; color: var(--brand-strong);
    font-size: 17px; line-height: 1; padding: 0; display: inline-flex;
}
.perm-actions[b-gp9apf0z9v] { display: flex; flex-wrap: wrap; gap: 6px; }
.perm-chip[b-gp9apf0z9v] {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 4px 11px; border-radius: 999px; cursor: pointer; user-select: none;
    background: #eef2f7; color: var(--muted); border: 1px solid transparent;
    font-size: 12px; font-weight: 700; transition: background .12s, color .12s;
}
.perm-chip input[b-gp9apf0z9v] { accent-color: var(--blue); margin: 0; }
.perm-chip.on[b-gp9apf0z9v] { background: var(--blue-soft); color: var(--brand-strong); border-color: color-mix(in srgb, var(--blue) 30%, transparent); }

@media (max-width: 640px) {
    .perm-row[b-gp9apf0z9v] { grid-template-columns: 1fr; }
}
/* /Components/Pages/ServicePurchaseCenters.razor.rz.scp.css */
/* Map location-picker chrome (mirrors the branch picker in CompanyProfile.razor.css). */
.map-section[b-acqc7k1933] {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed var(--line);
}

.map-placeholder[b-acqc7k1933] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px;
    margin: 8px 0 12px;
    border: 1px dashed var(--line);
    border-radius: 12px;
    background: var(--soft);
    color: var(--muted);
    font-size: 13px;
}

.map-placeholder i[b-acqc7k1933] { font-size: 22px; }

.map-hint[b-acqc7k1933] {
    font-size: 12px;
    color: var(--muted);
    margin: 4px 0 8px;
}

.map-search-row[b-acqc7k1933] {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

.map-search-row input[b-acqc7k1933] { flex: 1; }
.map-search-row .btn-ghost[b-acqc7k1933] { white-space: nowrap; }

#spcMap[b-acqc7k1933] {
    width: 100%;
    height: 320px;
    border-radius: 12px;
    margin: 8px 0 12px;
    border: 1px solid var(--line);
    background: #eef2f7;
}
/* /Components/Pages/TaskForm.razor.rz.scp.css */
/* Locked (read-only) banner + fieldset — mirrors MissionForm (Blazor CSS isolation → per-page copy) */
.locked-zone[b-k2etlq50y7] {
    min-inline-size: 0;
    margin: 0;
    padding: 0;
    border: 0;
}
.locked-zone:disabled[b-k2etlq50y7] { opacity: .72; }

.locked-banner[b-k2etlq50y7] {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 14px;
    padding: 12px 16px;
    border: 1px solid #f0c98a;
    border-radius: 12px;
    background: #fdf3e0;
    color: #8a5a00;
    font-size: 14px;
    font-weight: 600;
}
.locked-banner > i[b-k2etlq50y7] { font-size: 17px; }

/* Assignee chips (isolated per page) */
.scope-count[b-k2etlq50y7] { font-size: 12px; color: var(--muted); }

.chip-select[b-k2etlq50y7] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 6px;
}
.chip-check[b-k2etlq50y7] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 11px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
}
.chip-check.on[b-k2etlq50y7] {
    border-color: var(--blue);
    background: #eef4ff;
    color: var(--blue-2);
}
.chip-check input[b-k2etlq50y7] { accent-color: var(--blue); }
.chip-check .muted[b-k2etlq50y7] { color: var(--muted); font-weight: 500; }

.chip-dept[b-k2etlq50y7] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-inline-start: 4px;
    padding: 2px 8px;
    border-radius: 999px;
    background: #eef1f6;
    color: var(--muted);
    font-size: 11.5px;
    font-weight: 700;
}
.chip-dept > i[b-k2etlq50y7] { font-size: 10.5px; }

.chip-select.assigned-group[b-k2etlq50y7] {
    padding: 10px;
    border: 1px solid #d8e6cf;
    border-radius: 12px;
    background: #f3f9ee;
    margin-bottom: 10px;
}

/* Target location map (point-only picker) */
.map-section[b-k2etlq50y7] {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed var(--line);
}
.map-placeholder[b-k2etlq50y7] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px;
    margin: 8px 0 12px;
    border: 1px dashed var(--line);
    border-radius: 12px;
    background: var(--soft);
    color: var(--muted);
    font-size: 13px;
}
.map-placeholder i[b-k2etlq50y7] { font-size: 22px; }
.map-search-row[b-k2etlq50y7] {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}
.map-search-row input[b-k2etlq50y7] { flex: 1; }
.map-search-row .btn-ghost[b-k2etlq50y7] { white-space: nowrap; }

#taskMap[b-k2etlq50y7] {
    width: 100%;
    height: 300px;
    border-radius: 12px;
    margin: 8px 0 12px;
    border: 1px solid var(--line);
    background: #eef2f7;
}

.target-row[b-k2etlq50y7] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin: 6px 0 10px;
}
.dl-chip[b-k2etlq50y7] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #f1f5fb;
    border: 1px solid #dbe4f3;
    border-radius: 999px;
    padding: 5px 14px;
    font-size: 13px;
    color: #33415a;
}

/* Status segmented pills (mirrors MissionForm — Blazor CSS isolation → per-page copy) */
.status-pills[b-k2etlq50y7] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.status-pill[b-k2etlq50y7] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    font: inherit;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--ink, #1f2a44);
    cursor: pointer;
    transition: border-color .12s, background .12s, color .12s;
}
.status-pill:hover[b-k2etlq50y7] { border-color: var(--blue); }
.status-pill i[b-k2etlq50y7] { font-size: 13px; }
.status-pill.sp-auto.on[b-k2etlq50y7]       { background: #ede9fe; border-color: #8b5cf6; color: #5b21b6; }
.status-pill.sp-scheduled.on[b-k2etlq50y7]  { background: var(--blue-soft); border-color: var(--hero-accent); color: var(--brand-strong); }
.status-pill.sp-inprogress.on[b-k2etlq50y7] { background: #d8f1e6; border-color: #2f9e6f; color: #1d7a52; }
.status-pill.sp-completed.on[b-k2etlq50y7]  { background: #d2f0ec; border-color: #0f766e; color: #0c5f59; }
.status-pill.sp-pending.on[b-k2etlq50y7]    { background: #fbeccd; border-color: #c47d04; color: #9a5b00; }
.status-pill.sp-cancelled.on[b-k2etlq50y7]  { background: #fde0dc; border-color: #c0392b; color: #97271c; }
/* Priority tints */
.status-pill.sp-high.on[b-k2etlq50y7]   { background: #fde0dc; border-color: #c0392b; color: #97271c; }
.status-pill.sp-medium.on[b-k2etlq50y7] { background: #fbeccd; border-color: #c47d04; color: #9a5b00; }
.status-pill.sp-low.on[b-k2etlq50y7]    { background: var(--blue-soft); border-color: var(--hero-accent); color: var(--brand-strong); }

/* Responsible-team tint on assigned chips + the section badge (mirrors MissionForm) */
.badge-soft[b-k2etlq50y7] {
    display: inline-flex;
    align-items: center;
    padding: 4px 11px;
    border-radius: 999px;
    background: #eef4ff;
    color: var(--blue-2);
    font-size: 12px;
    font-weight: 700;
}
.chip-dept.is-primary[b-k2etlq50y7] { background: var(--blue-soft); color: var(--brand-strong); }
.chip-check.primary-team[b-k2etlq50y7] { border-color: #cdddff; }
.chip-check.primary-team.on[b-k2etlq50y7] { border-color: var(--blue); }

/* check-in geofence source radios */
.checkin-modes[b-k2etlq50y7] { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.ci-radio[b-k2etlq50y7] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 14px;
    border: 1px solid #dce8f6;
    border-radius: 12px;
    background: #fff;
    font-size: 13px;
    font-weight: 650;
    color: #4a5a78;
    cursor: pointer;
    transition: border-color .14s, background .14s;
}
.ci-radio.on[b-k2etlq50y7] { border-color: var(--blue); background: #eef5ff; color: var(--blue-2); }
.ci-radio input[b-k2etlq50y7] { accent-color: var(--blue); }
/* /Components/Pages/Tasks.razor.rz.scp.css */
/* Day-log gap-analysis — trigger card + wide modal */
.daylog-trigger[b-pcr247xptp] { border-inline-start: 3px solid var(--hero-accent); }

/* The 8-column analysis table needs room → a wider modal than the default .wide */
.modal-shift.daylog-modal[b-pcr247xptp] { width: min(1300px, 97vw); }

.daylog-controls[b-pcr247xptp] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    padding: 2px 0 14px;
    margin-bottom: 6px;
    border-bottom: 1px solid var(--line);
}
.daylog-controls .form-select[b-pcr247xptp] { max-width: 320px; }
.daylog-controls .form-control[b-pcr247xptp] { max-width: 190px; }

.empty-hint[b-pcr247xptp] {
    padding: 22px 8px;
    text-align: center;
    color: var(--muted);
    font-size: 13.5px;
}

.daylog-summary[b-pcr247xptp] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 4px 0 12px;
}
.dl-chip[b-pcr247xptp] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #f1f5fb;
    border: 1px solid #dbe4f3;
    border-radius: 999px;
    padding: 5px 14px;
    font-size: 13px;
    color: #33415a;
}
.dl-chip strong[b-pcr247xptp] { color: var(--sidebar-2); }

.daylog-table .row-mismatch[b-pcr247xptp] { background: #fff7ed; }
.daylog-table .row-mismatch:hover[b-pcr247xptp] { background: #ffeed8; }

/* Order badge — the expected/actual sequence number */
.order-badge[b-pcr247xptp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 24px;
    padding: 0 6px;
    border-radius: 7px;
    background: #eef2f9;
    color: #33415a;
    font-weight: 700;
    font-size: 13px;
}
.order-badge.mismatch[b-pcr247xptp] { background: #f97316; color: #fff; }

/* Completion-state pills */
.state-pill[b-pcr247xptp] {
    display: inline-block;
    padding: 3px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.6;
    white-space: nowrap;
}
.state-pill.st-done[b-pcr247xptp] { background: #dcfce7; color: #15803d; }
.state-pill.st-working[b-pcr247xptp] { background: #dbeafe; color: #1d4ed8; }
.state-pill.st-planned[b-pcr247xptp] { background: #f1f5f9; color: #475569; }
.state-pill.st-pending[b-pcr247xptp] { background: #fef3c7; color: #92400e; }
.state-pill.st-cancelled[b-pcr247xptp] { background: #fee2e2; color: #b91c1c; }
/* /Components/Pages/WorkingRules.razor.rz.scp.css */
/* Wider modal so the two-column policy form has room. */
.modal-shift-wide[b-ntgth430bs] { width: min(1080px, 96vw); }

/* Two-column modal layout for the policy form. */
.split-grid[b-ntgth430bs] {
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 22px;
}

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

.section-label[b-ntgth430bs] {
    font-size: 13px;
    font-weight: 700;
    color: var(--muted);
    margin: 14px 0 8px;
    text-transform: none;
}
.section-label:first-child[b-ntgth430bs] { margin-top: 0; }

/* 7-day weekly work pattern */
.week-pattern[b-ntgth430bs] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 6px;
}

@media (max-width: 560px) {
    .week-pattern[b-ntgth430bs] { grid-template-columns: repeat(4, 1fr); }
}

.day-toggle[b-ntgth430bs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 8px 4px;
    border: 1px solid var(--line);
    border-radius: 10px;
    cursor: pointer;
    text-align: center;
    background: #fff;
    transition: border-color .15s, background .15s;
}

.day-toggle input[b-ntgth430bs] { margin: 0; }
.day-toggle strong[b-ntgth430bs] { font-size: 12px; }
.day-toggle span[b-ntgth430bs] { font-size: 10px; color: var(--muted); }

.day-toggle.is-work[b-ntgth430bs] {
    border-color: #93c5fd;
    background: #eff6ff;
}

/* Scope checkboxes */
.capability-grid[b-ntgth430bs] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
}

.capability-grid label[b-ntgth430bs] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: 10px;
    cursor: pointer;
}

/* Attendance status logic explainer */
.status-logic-list[b-ntgth430bs] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.status-logic-list > div[b-ntgth430bs] {
    padding: 8px 10px;
    border: 1px dashed var(--line);
    border-radius: 10px;
    background: var(--soft);
}

.status-logic-list strong[b-ntgth430bs] { display: block; font-size: 13px; }
.status-logic-list span[b-ntgth430bs] { font-size: 12px; color: var(--muted); }
/* /Components/Shared/ProjectDeleteConfirm.razor.rz.scp.css */
/* Cascade warning inside the delete-confirm dialog. */
.delete-cascade-note[b-2k4v5jtkrt] {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin: 4px 0 14px;
    padding: 10px 13px;
    border: 1px solid #f3c9a3;
    border-radius: 10px;
    background: #fff7ef;
    color: #9a5b1e;
    font-size: 13px;
    line-height: 1.6;
    text-align: start;
}

.delete-cascade-note.loading[b-2k4v5jtkrt] {
    border-color: var(--line);
    background: var(--soft);
    color: var(--muted);
    align-items: center;
}

.delete-cascade-note i[b-2k4v5jtkrt] { font-size: 16px; flex: 0 0 auto; margin-top: 1px; }
.delete-cascade-note strong[b-2k4v5jtkrt] { font-weight: 800; }

/* Type-the-code gate before the destructive button activates. */
.delete-confirm-gate[b-2k4v5jtkrt] {
    text-align: start;
    margin: 0 0 16px;
}

.delete-confirm-gate label[b-2k4v5jtkrt] {
    display: block;
    font-size: 13px;
    color: var(--text);
    margin-bottom: 6px;
}

.delete-confirm-gate .form-control[b-2k4v5jtkrt] {
    text-align: center;
    font-weight: 700;
    letter-spacing: 0.5px;
}

.gate-mismatch[b-2k4v5jtkrt] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 6px;
    font-size: 12px;
    color: var(--danger);
}

.gate-mismatch i[b-2k4v5jtkrt] { font-size: 13px; }
.gate-error[b-2k4v5jtkrt] { justify-content: center; margin: 0 0 12px; width: 100%; }
/* /Components/Shared/SearchPicker.razor.rz.scp.css */
.search-picker[b-2jndmt63i0] { position: relative; min-width: 220px; }

.sp-field[b-2jndmt63i0] { position: relative; display: flex; align-items: center; }
.sp-field > i[b-2jndmt63i0] {
    position: absolute;
    inset-inline-start: 12px;
    color: #8593a8;
    font-size: 13px;
    pointer-events: none;
}
.sp-field input[b-2jndmt63i0] { padding-inline-start: 32px; }

.sp-menu[b-2jndmt63i0] {
    position: absolute;
    top: calc(100% + 4px);
    inset-inline: 0;
    z-index: 40;
    background: #fff;
    border: 1px solid #e4e9f1;
    border-radius: 10px;
    box-shadow: 0 12px 28px rgba(20, 35, 63, 0.14);
    overflow: hidden;
    max-height: 280px;
    overflow-y: auto;
}
.sp-msg[b-2jndmt63i0] { padding: 10px 12px; color: #8593a8; font-size: 13px; }
.sp-item[b-2jndmt63i0] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 9px 12px;
    background: none;
    border: 0;
    border-bottom: 1px solid #f2f5f9;
    text-align: start;
    font-size: 13px;
    color: #1f2d45;
    cursor: pointer;
}
.sp-item:last-child[b-2jndmt63i0] { border-bottom: 0; }
.sp-item:hover[b-2jndmt63i0] { background: #f3f8ff; }
.sp-code[b-2jndmt63i0] {
    font-size: 11px;
    font-weight: 700;
    color: var(--hero-accent);
    background: #eaf1fe;
    border-radius: 5px;
    padding: 1px 6px;
    white-space: nowrap;
}

.sp-chip[b-2jndmt63i0] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 46px;
    padding: 6px 8px 6px 14px;
    border: 1px solid #cfe0ff;
    background: #f3f8ff;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    color: #14233f;
}
.sp-x[b-2jndmt63i0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border: 0;
    border-radius: 50%;
    background: #dbe7ff;
    color: var(--hero-accent);
    cursor: pointer;
    font-size: 11px;
}
.sp-x:hover[b-2jndmt63i0] { background: var(--hero-accent); color: #fff; }