/* /Components/Layout/Partials/Topbar.razor.rz.scp.css */
/* Topbar user avatar — the uploaded photo, or an initials monogram matching the
   Your Profile hero treatment when no photo has been uploaded. */

.tb-avatar[b-swx1cu6b7p] {
    object-fit: cover;
    width: 32px;
    height: 32px;
}

.tb-monogram[b-swx1cu6b7p] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #14b8a6 0%, #0d9488 55%, #0f766e 100%);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    user-select: none;
    flex-shrink: 0;
}
/* /Components/Pages/Account/YourProfile.razor.rz.scp.css */
/* ============================================================
   Your Profile (/profile) — styled with the same design system
   as the User & Role Management page (Users.razor.css). The
   token blocks below are copied from that file so both pages
   read as one product; component rules reference tokens only.
   Light by default, dark via html[data-bs-theme="dark"].
   ============================================================ */

/* ---------- Tokens: light (default) ---------- */

.ypf-page[b-wjqievzwsu],
.ypf-toasts[b-wjqievzwsu] {
    --urm-panel: #ffffff;
    --urm-border: #e2e8f0;
    --urm-border-soft: rgba(226, 232, 240, 0.7);
    --urm-chip-bg: #f1f5f9;
    --urm-chip-border: #e2e8f0;
    --urm-chip-hover: #e2e8f0;
    --urm-tabs-bg: rgba(248, 250, 252, 0.6);
    --urm-head-bg: #f8fafc;
    --urm-hover-bg: #f1f5f9;

    --urm-heading: #0f172a;
    --urm-text: #1e293b;
    --urm-text-2: #334155;
    --urm-text-3: #475569;
    --urm-muted: #64748b;
    --urm-faint: #94a3b8;

    --urm-brand: #14b8a6;
    --urm-brand-600: #0d9488;
    --urm-brand-strong: #0d9488;
    --urm-brand-icon: #0d9488;
    --urm-brand-tint: rgba(20, 184, 166, 0.07);

    --urm-field-bg: #ffffff;
    --urm-field-border: #e2e8f0;
    --urm-field-border-hover: #cbd5e1;
    --urm-placeholder: #94a3b8;
    --urm-tile-bg: #f8fafc;

    --urm-avatar-bg: #f1f5f9;
    --urm-avatar-border: #e2e8f0;
    --urm-avatar-color: #475569;
    --urm-avatar-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.06);

    --urm-emerald-text: #059669;
    --urm-amber-text: #d97706;
    --urm-rose-text: #e11d48;
    --urm-cyan-text: #0891b2;

    --urm-pill-bg: #ecfeff;
    --urm-pill-color: #0e7490;
    --urm-pill-border: #a5f3fc;

    --urm-emerald-bg: rgba(16, 185, 129, 0.1);
    --urm-emerald-border: rgba(16, 185, 129, 0.2);
    --urm-amber-bg: rgba(245, 158, 11, 0.1);
    --urm-amber-border: rgba(245, 158, 11, 0.2);
    --urm-rose-bg: rgba(244, 63, 94, 0.1);
    --urm-rose-border: rgba(244, 63, 94, 0.2);

    --urm-busy-bg: #e2e8f0;
    --urm-busy-color: #94a3b8;

    --urm-toast-text: #1e293b;
    --urm-toast-success-bg: #ecfdf5;
    --urm-toast-success-border: #a7f3d0;
    --urm-toast-error-bg: #fef2f2;
    --urm-toast-error-border: #fecaca;
    --urm-toast-warning-bg: #fffbeb;
    --urm-toast-warning-border: #fde68a;

    --urm-card-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);
    --urm-toast-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.15);

    font-family: "Inter", var(--ins-body-font-family, sans-serif);
}

/* ---------- Tokens: dark (design mock palette) ---------- */

[data-bs-theme="dark"] .ypf-page[b-wjqievzwsu],
[data-bs-theme="dark"] .ypf-toasts[b-wjqievzwsu] {
    --urm-panel: #131926;
    --urm-border: #1e293b;
    --urm-border-soft: rgba(30, 41, 59, 0.6);
    --urm-chip-bg: #1e293b;
    --urm-chip-border: #334155;
    --urm-chip-hover: #334155;
    --urm-tabs-bg: rgba(15, 23, 42, 0.2);
    --urm-head-bg: rgba(15, 23, 42, 0.4);
    --urm-hover-bg: rgba(30, 41, 59, 0.4);

    --urm-heading: #ffffff;
    --urm-text: #f1f5f9;
    --urm-text-2: #e2e8f0;
    --urm-text-3: #cbd5e1;
    --urm-muted: #94a3b8;
    --urm-faint: #64748b;

    --urm-brand: #14b8a6;
    --urm-brand-600: #0d9488;
    --urm-brand-strong: #2dd4bf;
    --urm-brand-icon: #14b8a6;
    --urm-brand-tint: rgba(20, 184, 166, 0.05);

    --urm-field-bg: #0b0f19;
    --urm-field-border: #1e293b;
    --urm-field-border-hover: #334155;
    --urm-placeholder: #64748b;
    --urm-tile-bg: #0b0f19;

    --urm-avatar-bg: #1e293b;
    --urm-avatar-border: rgba(51, 65, 85, 0.8);
    --urm-avatar-color: #cbd5e1;
    --urm-avatar-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);

    --urm-emerald-text: #34d399;
    --urm-amber-text: #fbbf24;
    --urm-rose-text: #fb7185;
    --urm-cyan-text: #22d3ee;

    --urm-pill-bg: #083344;
    --urm-pill-color: #22d3ee;
    --urm-pill-border: rgba(21, 94, 117, 0.4);

    --urm-busy-bg: #1e293b;
    --urm-busy-color: #64748b;

    --urm-toast-text: #f1f5f9;
    --urm-toast-success-bg: #0c1a16;
    --urm-toast-success-border: rgba(16, 185, 129, 0.2);
    --urm-toast-error-bg: #1d1115;
    --urm-toast-error-border: rgba(244, 63, 94, 0.2);
    --urm-toast-warning-bg: #1c1811;
    --urm-toast-warning-border: rgba(245, 158, 11, 0.2);

    --urm-card-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.25);
    --urm-toast-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.4);
}

/* ---------- Page & panels ---------- */

.ypf-page[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    color: var(--urm-text);
    margin-bottom: 1.5rem;
}

.ypf-panel[b-wjqievzwsu] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 12px;
    box-shadow: var(--urm-card-shadow);
}

/* ---------- Hero ---------- */

.ypf-hero[b-wjqievzwsu] {
    padding: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    flex-wrap: wrap;
}

.ypf-hero-id[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    min-width: 0;
}

.ypf-avatar[b-wjqievzwsu] {
    width: 4.25rem;
    height: 4.25rem;
    border-radius: 0.85rem;
    background-color: var(--urm-avatar-bg);
    border: 1px solid var(--urm-avatar-border);
    color: var(--urm-avatar-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.375rem;
    box-shadow: var(--urm-avatar-shadow);
    flex-shrink: 0;
}

/* ---------- Profile photo control ----------
   Monogram mode: brand-gradient initials + an always-visible camera badge on the corner.
   Photo mode: the image + a floating replace/remove action pill (mirrors the design mock). */

.ypf-avatar-wrap[b-wjqievzwsu] {
    position: relative;
    flex-shrink: 0;
}

.ypf-avatar--monogram[b-wjqievzwsu] {
    background: linear-gradient(135deg, #14b8a6 0%, #0d9488 55%, #0f766e 100%);
    border: none;
    color: #fff;
    letter-spacing: 0.05em;
    user-select: none;
    box-shadow: 0 8px 16px -6px rgba(13, 148, 136, 0.5);
}

.ypf-avatar-img[b-wjqievzwsu] {
    object-fit: cover;
    display: block;
}

/* Monogram mode: upload badge pinned to the corner */
.ypf-avatar-upload-badge[b-wjqievzwsu] {
    position: absolute;
    bottom: -0.3rem;
    right: -0.3rem;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 0.6rem;
    background-color: var(--urm-brand-600);
    color: #fff;
    border: 2px solid var(--urm-panel);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    cursor: pointer;
    margin: 0;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.25);
    transition: transform 0.15s ease, background-color 0.15s ease;
}

.ypf-avatar-upload-badge:hover[b-wjqievzwsu] {
    background-color: var(--urm-brand);
    transform: scale(1.1);
}

/* Photo mode: replace / remove action pill */
.ypf-avatar-actions[b-wjqievzwsu] {
    position: absolute;
    bottom: -0.4rem;
    right: -0.4rem;
    display: flex;
    align-items: center;
    gap: 0.2rem;
    padding: 0.2rem;
    border-radius: 0.6rem;
    background-color: rgba(15, 23, 42, 0.92);
    border: 1px solid #334155;
    box-shadow: 0 8px 16px rgba(15, 23, 42, 0.35);
}

.ypf-avatar-action[b-wjqievzwsu] {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 0.45rem;
    background-color: #1e293b;
    color: #cbd5e1;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    cursor: pointer;
    margin: 0;
    padding: 0;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.ypf-avatar-action:hover[b-wjqievzwsu] {
    background-color: var(--urm-brand-600);
    color: #fff;
}

.ypf-avatar-action--danger:hover[b-wjqievzwsu] {
    background-color: #e11d48;
    color: #fff;
}

.ypf-avatar-action:disabled[b-wjqievzwsu] {
    opacity: 0.6;
    cursor: not-allowed;
}

.ypf-avatar-input[b-wjqievzwsu] {
    display: none;
}

.ypf-hero-name-row[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.ypf-hero-name[b-wjqievzwsu] {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--urm-heading);
    margin: 0;
}

.ypf-hero-meta[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
    font-size: 0.8125rem;
    color: var(--urm-muted);
    margin: 0.375rem 0 0;
}

.ypf-hero-meta i[b-wjqievzwsu] {
    color: var(--urm-faint);
    margin-right: 0.15rem;
}

.ypf-hero-meta-2[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    font-size: 0.6875rem;
    color: var(--urm-faint);
    margin-top: 0.5rem;
}

.ypf-hero-meta-2 i[b-wjqievzwsu] {
    margin-right: 0.2rem;
}

.ypf-meta-sep[b-wjqievzwsu] {
    color: var(--urm-faint);
}

.ypf-hero-chips[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.ypf-chip[b-wjqievzwsu] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.45rem 0.85rem;
    border-radius: 0.6rem;
    border: 1px solid var(--urm-chip-border);
    background-color: var(--urm-chip-bg);
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--urm-text-3);
    white-space: nowrap;
}

.ypf-chip i[b-wjqievzwsu] {
    color: var(--urm-brand-icon);
}

.ypf-pulse-dot[b-wjqievzwsu] {
    width: 8px;
    height: 8px;
    border-radius: 9999px;
    background-color: #10b981;
    animation: ypf-pulse-b-wjqievzwsu 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes ypf-pulse-b-wjqievzwsu {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

/* ---------- Badges & pills ---------- */

.ypf-role-pill[b-wjqievzwsu] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 700;
    background-color: var(--urm-pill-bg);
    color: var(--urm-pill-color);
    border: 1px solid var(--urm-pill-border);
}

.ypf-badge[b-wjqievzwsu] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.125rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 700;
}

.ypf-badge--emerald[b-wjqievzwsu] {
    background-color: var(--urm-emerald-bg);
    color: var(--urm-emerald-text);
    border: 1px solid var(--urm-emerald-border);
}

.ypf-badge--amber[b-wjqievzwsu] {
    background-color: var(--urm-amber-bg);
    color: var(--urm-amber-text);
    border: 1px solid var(--urm-amber-border);
}

/* ---------- Tabs ----------
   The tab strip's look is a verbatim copy of the Site Sharing manager's treatment and
   lives in a global <style> block in YourProfile.razor (matching how SiteSharingManager
   declares it), so the theme's .nav-tabs rules resolve identically on both pages. */

.ypf-tab-body[b-wjqievzwsu] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* ---------- Section header inside a tab ---------- */

.ypf-body-head[b-wjqievzwsu] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--urm-border-soft);
}

.ypf-body-title[b-wjqievzwsu] {
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--urm-heading);
    margin: 0;
}

.ypf-title-icon[b-wjqievzwsu] {
    color: var(--urm-brand-icon);
    margin-right: 0.25rem;
}

.ypf-body-sub[b-wjqievzwsu] {
    font-size: 0.75rem;
    color: var(--urm-muted);
    margin: 0.25rem 0 0;
}

.ypf-head-actions[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.ypf-status-tag[b-wjqievzwsu] {
    padding: 0.3rem 0.75rem;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 700;
    white-space: nowrap;
}

.ypf-status-tag--amber[b-wjqievzwsu] {
    background-color: var(--urm-amber-bg);
    color: var(--urm-amber-text);
    border: 1px solid var(--urm-amber-border);
}

.ypf-status-tag--emerald[b-wjqievzwsu] {
    background-color: var(--urm-emerald-bg);
    color: var(--urm-emerald-text);
    border: 1px solid var(--urm-emerald-border);
}

/* ---------- Buttons ---------- */

.ypf-btn[b-wjqievzwsu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    padding: 0.625rem 1rem;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease, transform 0.1s ease, box-shadow 0.15s ease;
    white-space: nowrap;
}

.ypf-btn:active[b-wjqievzwsu] {
    transform: scale(0.95);
}

.ypf-btn:focus-visible[b-wjqievzwsu] {
    outline: 2px solid var(--urm-brand);
    outline-offset: 2px;
}

.ypf-btn--primary[b-wjqievzwsu] {
    background-color: var(--urm-brand-600);
    color: #fff;
    box-shadow: 0 4px 6px -1px rgba(13, 148, 136, 0.2);
}

.ypf-btn--primary:hover[b-wjqievzwsu] {
    background-color: var(--urm-brand);
}

.ypf-btn--dark[b-wjqievzwsu] {
    background-color: var(--urm-chip-bg);
    border-color: var(--urm-chip-border);
    color: var(--urm-text-3);
}

.ypf-btn--dark:hover[b-wjqievzwsu] {
    background-color: var(--urm-chip-hover);
}

.ypf-btn--rose[b-wjqievzwsu] {
    background-color: #e11d48;
    color: #fff;
    box-shadow: 0 4px 6px -1px rgba(225, 29, 72, 0.2);
}

.ypf-btn--rose:hover[b-wjqievzwsu] {
    background-color: #f43f5e;
}

.ypf-btn--emerald[b-wjqievzwsu] {
    background-color: #059669;
    color: #fff;
    box-shadow: 0 4px 6px -1px rgba(5, 150, 105, 0.2);
}

.ypf-btn--emerald:hover[b-wjqievzwsu] {
    background-color: #10b981;
}

.ypf-btn--sm[b-wjqievzwsu] {
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
    font-weight: 700;
}

.ypf-btn:disabled[b-wjqievzwsu] {
    cursor: not-allowed;
    opacity: 0.55;
}

.ypf-link-btn[b-wjqievzwsu] {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--urm-muted);
    cursor: pointer;
}

.ypf-link-btn:hover[b-wjqievzwsu] {
    color: var(--urm-text-2);
}

.ypf-link-btn--rose[b-wjqievzwsu] {
    color: var(--urm-rose-text);
}

.ypf-link-btn--rose:hover[b-wjqievzwsu] {
    color: #f43f5e;
}

.ypf-inline-link[b-wjqievzwsu] {
    color: var(--urm-brand-strong);
    text-decoration: none;
    font-weight: 600;
}

.ypf-inline-link:hover[b-wjqievzwsu] {
    text-decoration: underline;
    color: var(--urm-brand-strong);
}

.ypf-spin[b-wjqievzwsu] {
    display: inline-block;
    animation: ypf-spin-b-wjqievzwsu 0.8s linear infinite;
}

@keyframes ypf-spin-b-wjqievzwsu {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* ---------- Form fields ---------- */

.ypf-field-row[b-wjqievzwsu] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.ypf-field[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    min-width: 0;
}

.ypf-field > label[b-wjqievzwsu] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--urm-muted);
    margin: 0;
}

.ypf-label-soft[b-wjqievzwsu] {
    font-size: 0.625rem;
    font-weight: 400;
    color: var(--urm-faint);
}

.ypf-required[b-wjqievzwsu] {
    color: #e11d48;
}

.ypf-field input[b-wjqievzwsu],
.ypf-input-wrap input[b-wjqievzwsu] {
    width: 100%;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 0.875rem;
    font-size: 0.875rem;
    color: var(--urm-text-2);
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ypf-field input[b-wjqievzwsu]::placeholder,
.ypf-input-wrap input[b-wjqievzwsu]::placeholder,
.ypf-textarea[b-wjqievzwsu]::placeholder {
    color: var(--urm-placeholder);
}

.ypf-field input:focus[b-wjqievzwsu],
.ypf-input-wrap input:focus[b-wjqievzwsu],
.ypf-textarea:focus[b-wjqievzwsu],
.ypf-select:focus[b-wjqievzwsu] {
    border-color: var(--urm-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.ypf-field input:disabled[b-wjqievzwsu] {
    background-color: var(--urm-tile-bg);
    color: var(--urm-muted);
    cursor: not-allowed;
}

.ypf-field .ypf-input--invalid[b-wjqievzwsu] {
    border-color: #e11d48;
}

.ypf-field .ypf-input--invalid:focus[b-wjqievzwsu] {
    border-color: #e11d48;
    box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.15);
}

.ypf-field-error[b-wjqievzwsu] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: #e11d48;
}

.ypf-match-ok[b-wjqievzwsu] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--urm-emerald-text);
}

.ypf-textarea[b-wjqievzwsu] {
    width: 100%;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 0.875rem;
    font-size: 0.875rem;
    color: var(--urm-text-2);
    outline: none;
    resize: vertical;
    min-height: 4.5rem;
    font-family: inherit;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ypf-select[b-wjqievzwsu] {
    width: 100%;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 0.75rem;
    font-size: 0.875rem;
    color: var(--urm-text-3);
    outline: none;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ypf-select:hover[b-wjqievzwsu] {
    border-color: var(--urm-field-border-hover);
}

.ypf-select:disabled[b-wjqievzwsu] {
    background-color: var(--urm-tile-bg);
    color: var(--urm-muted);
    cursor: not-allowed;
}

.ypf-select > option[b-wjqievzwsu] {
    background-color: var(--urm-panel);
    color: var(--urm-text-2);
}

.ypf-input-wrap[b-wjqievzwsu] {
    position: relative;
}

.ypf-input-wrap input[b-wjqievzwsu] {
    padding-right: 2.5rem;
}

.ypf-input-icon[b-wjqievzwsu] {
    position: absolute;
    right: 0.8rem;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    font-size: 0.95rem;
}

.ypf-input-icon--emerald[b-wjqievzwsu] {
    color: var(--urm-emerald-text);
}

.ypf-eye[b-wjqievzwsu] {
    position: absolute;
    right: 0.35rem;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    background: transparent;
    color: var(--urm-faint);
    padding: 0.25rem 0.45rem;
    border-radius: 0.4rem;
    line-height: 1;
    font-size: 0.95rem;
    cursor: pointer;
}

.ypf-eye:hover[b-wjqievzwsu] {
    color: var(--urm-brand-strong);
    background-color: var(--urm-chip-bg);
}

.ypf-error-note[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background-color: var(--urm-rose-bg);
    border: 1px solid var(--urm-rose-border);
    color: var(--urm-rose-text);
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 0.5rem;
    padding: 0.75rem;
}

/* ---------- Sign-in method cards ---------- */

.ypf-method-grid[b-wjqievzwsu] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.ypf-method-card[b-wjqievzwsu] {
    background-color: var(--urm-panel);
    border: 2px solid var(--urm-field-border);
    border-radius: 0.75rem;
    padding: 1.25rem;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ypf-method-card:hover[b-wjqievzwsu] {
    border-color: var(--urm-field-border-hover);
}

.ypf-method-card--selected[b-wjqievzwsu] {
    border-color: var(--urm-brand);
    background-color: var(--urm-brand-tint);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.12);
}

.ypf-method-top[b-wjqievzwsu] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}

.ypf-method-top input[type="radio"][b-wjqievzwsu] {
    width: 1rem;
    height: 1rem;
    accent-color: var(--urm-brand-600);
    cursor: pointer;
}

.ypf-method-icon[b-wjqievzwsu] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.6rem;
    background-color: var(--urm-chip-bg);
    border: 1px solid var(--urm-chip-border);
    color: var(--urm-text-3);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.125rem;
}

.ypf-method-icon--brand[b-wjqievzwsu] {
    background-color: var(--urm-emerald-bg);
    border-color: var(--urm-emerald-border);
    color: var(--urm-brand-icon);
}

.ypf-method-title-row[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.ypf-method-title[b-wjqievzwsu] {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--urm-heading);
    margin: 0;
}

.ypf-method-chip[b-wjqievzwsu] {
    padding: 0.1rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.625rem;
    font-weight: 600;
    background-color: var(--urm-chip-bg);
    border: 1px solid var(--urm-chip-border);
    color: var(--urm-text-3);
    white-space: nowrap;
}

.ypf-method-chip--brand[b-wjqievzwsu] {
    background-color: var(--urm-emerald-bg);
    border-color: var(--urm-emerald-border);
    color: var(--urm-brand-strong);
}

.ypf-method-desc[b-wjqievzwsu] {
    font-size: 0.75rem;
    color: var(--urm-muted);
    margin: 0.375rem 0 0;
    line-height: 1.5;
}

.ypf-method-foot[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--urm-border-soft);
    font-size: 0.6875rem;
    color: var(--urm-muted);
}

.ypf-method-cta[b-wjqievzwsu] {
    color: var(--urm-brand-strong);
    font-weight: 600;
}

.ypf-mono[b-wjqievzwsu] {
    font-family: var(--bs-font-monospace, monospace);
    font-size: 0.6875rem;
    color: var(--urm-faint);
}

/* ---------- SSO transfer wizard ---------- */

.ypf-sso-wizard[b-wjqievzwsu] {
    background-color: var(--urm-tile-bg);
    border: 1px solid var(--urm-emerald-border);
    border-radius: 0.75rem;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.ypf-sso-wizard-head[b-wjqievzwsu] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid var(--urm-border-soft);
}

.ypf-sso-wizard-title[b-wjqievzwsu] {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--urm-heading);
    margin: 0;
}

.ypf-sso-wizard-title i[b-wjqievzwsu] {
    color: var(--urm-brand-icon);
    margin-right: 0.3rem;
}

.ypf-sso-wizard-sub[b-wjqievzwsu] {
    font-size: 0.75rem;
    color: var(--urm-muted);
    margin: 0.3rem 0 0;
    line-height: 1.5;
}

.ypf-step-tag[b-wjqievzwsu] {
    padding: 0.25rem 0.625rem;
    border-radius: 0.5rem;
    background-color: var(--urm-chip-bg);
    border: 1px solid var(--urm-chip-border);
    color: var(--urm-muted);
    font-family: var(--bs-font-monospace, monospace);
    font-size: 0.6875rem;
    white-space: nowrap;
}

.ypf-provider-grid[b-wjqievzwsu] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
}

.ypf-provider[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0.65rem 0.5rem;
    border-radius: 0.75rem;
    background-color: var(--urm-panel);
    border: 2px solid var(--urm-field-border);
    color: var(--urm-text-2);
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.ypf-provider:hover[b-wjqievzwsu] {
    background-color: var(--urm-hover-bg);
}

.ypf-provider--selected[b-wjqievzwsu] {
    border-color: var(--urm-brand);
}

.ypf-provider i[b-wjqievzwsu] {
    font-size: 1.25rem;
}

.ypf-provider-icon--google[b-wjqievzwsu] {
    color: #ea4335;
}

.ypf-provider-icon--microsoft[b-wjqievzwsu] {
    color: #38bdf8;
}

.ypf-provider-icon--linkedin[b-wjqievzwsu] {
    color: #0a66c2;
}

.ypf-provider-icon--x[b-wjqievzwsu] {
    color: var(--urm-heading);
}

/* Not-yet-available providers: visible but inert */
.ypf-provider--soon[b-wjqievzwsu],
.ypf-provider:disabled[b-wjqievzwsu] {
    opacity: 0.6;
    cursor: not-allowed;
}

.ypf-provider--soon:hover[b-wjqievzwsu],
.ypf-provider:disabled:hover[b-wjqievzwsu] {
    background-color: var(--urm-panel);
    border-color: var(--urm-field-border);
}

.ypf-provider-soon-chip[b-wjqievzwsu] {
    padding: 0.1rem 0.5rem;
    border-radius: 9999px;
    font-size: 0.575rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background-color: var(--urm-amber-bg);
    color: var(--urm-amber-text);
    border: 1px solid var(--urm-amber-border);
    white-space: nowrap;
}

.ypf-sso-send-row[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    padding: 1rem;
}

.ypf-sso-send-target[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.ypf-sso-send-icon[b-wjqievzwsu] {
    width: 2rem;
    height: 2rem;
    border-radius: 0.5rem;
    background-color: var(--urm-emerald-bg);
    color: var(--urm-brand-icon);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.ypf-sso-send-label[b-wjqievzwsu] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--urm-text-2);
    margin: 0;
}

.ypf-sso-send-fields[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 18rem;
}

.ypf-sso-email-input[b-wjqievzwsu] {
    width: 100%;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.5rem 0.75rem;
    font-family: var(--bs-font-monospace, monospace);
    font-size: 0.75rem;
    color: var(--urm-text-2);
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ypf-sso-email-input[b-wjqievzwsu]::placeholder {
    color: var(--urm-placeholder);
}

.ypf-sso-email-input:focus[b-wjqievzwsu] {
    border-color: var(--urm-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.ypf-sso-email-input.ypf-input--invalid[b-wjqievzwsu] {
    border-color: #e11d48;
}

.ypf-sso-email-input.ypf-input--invalid:focus[b-wjqievzwsu] {
    border-color: #e11d48;
    box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.15);
}

.ypf-sso-sent-banner[b-wjqievzwsu] {
    background-color: var(--urm-emerald-bg);
    border: 1px solid var(--urm-emerald-border);
    border-radius: 0.75rem;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.ypf-sso-sent-head[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.ypf-sso-sent-title[b-wjqievzwsu] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--urm-emerald-text);
}

.ypf-sso-sent-text[b-wjqievzwsu] {
    font-size: 0.75rem;
    color: var(--urm-text-3);
    margin: 0;
    line-height: 1.5;
}

.ypf-sso-sent-actions[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    flex-wrap: wrap;
}

.ypf-sso-complete[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    background-color: var(--urm-emerald-bg);
    border: 1px solid var(--urm-emerald-border);
    border-radius: 0.75rem;
    padding: 1.1rem 1.25rem;
}

.ypf-sso-complete > i[b-wjqievzwsu] {
    font-size: 1.75rem;
    color: var(--urm-emerald-text);
    flex-shrink: 0;
}

.ypf-sso-complete > div[b-wjqievzwsu] {
    flex: 1;
}

.ypf-sso-complete-title[b-wjqievzwsu] {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--urm-heading);
}

.ypf-sso-complete-sub[b-wjqievzwsu] {
    font-size: 0.75rem;
    color: var(--urm-text-3);
    margin-top: 0.15rem;
}

/* ---------- Password panel ---------- */

.ypf-pw-panel[b-wjqievzwsu] {
    background-color: var(--urm-tile-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.75rem;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.ypf-pw-panel-head[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.ypf-pw-panel-title[b-wjqievzwsu] {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--urm-text-2);
    margin: 0;
}

.ypf-pw-panel-title i[b-wjqievzwsu] {
    color: var(--urm-brand-icon);
    margin-right: 0.375rem;
}

.ypf-pw-grid[b-wjqievzwsu] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1rem;
}

.ypf-pw-bars[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 0.1rem;
}

.ypf-pw-bar[b-wjqievzwsu] {
    height: 4px;
    flex: 1 1 auto;
    max-width: 42px;
    border-radius: 2px;
    background-color: var(--urm-chip-border);
    transition: background 0.2s ease;
}

.ypf-pw-strength[b-wjqievzwsu] {
    font-size: 0.625rem;
    font-weight: 700;
    margin-left: 0.35rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.ypf-pw-panel-foot[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding-top: 0.25rem;
}

.ypf-pw-panel-foot .ypf-label-soft[b-wjqievzwsu] {
    max-width: 34rem;
    line-height: 1.5;
}

/* ---------- Sessions ---------- */

.ypf-session-list[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.ypf-session[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 1rem;
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.75rem;
    padding: 0.9rem 1.1rem;
}

.ypf-session--current[b-wjqievzwsu] {
    border-color: var(--urm-emerald-border);
    background-color: var(--urm-brand-tint);
}

.ypf-session-icon[b-wjqievzwsu] {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 0.6rem;
    background-color: var(--urm-chip-bg);
    border: 1px solid var(--urm-chip-border);
    color: var(--urm-text-3);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    flex-shrink: 0;
}

.ypf-session-icon--current[b-wjqievzwsu] {
    background-color: var(--urm-emerald-bg);
    border-color: var(--urm-emerald-border);
    color: var(--urm-brand-icon);
}

.ypf-session-info[b-wjqievzwsu] {
    flex: 1;
    min-width: 0;
}

.ypf-session-title-row[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.ypf-session-title[b-wjqievzwsu] {
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--urm-heading);
}

.ypf-session-meta[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
    font-size: 0.6875rem;
    color: var(--urm-muted);
    margin-top: 0.25rem;
}

.ypf-session-end[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.3rem;
    flex-shrink: 0;
}

/* Session length settings — same surface as the password panel */

.ypf-length-panel[b-wjqievzwsu] {
    background-color: var(--urm-tile-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.75rem;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.ypf-length-head[b-wjqievzwsu] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.ypf-length-title[b-wjqievzwsu] {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--urm-text-2);
    margin: 0 0 0.25rem;
}

.ypf-length-title i[b-wjqievzwsu] {
    color: var(--urm-brand-icon);
    margin-right: 0.375rem;
}

/* ---------- Permissions tab ---------- */

.ypf-perm-card[b-wjqievzwsu] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.75rem;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.ypf-perm-card-head[b-wjqievzwsu] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.ypf-perm-role-id[b-wjqievzwsu] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    min-width: 0;
}

.ypf-perm-role-icon[b-wjqievzwsu] {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 0.6rem;
    background-color: var(--urm-emerald-bg);
    border: 1px solid var(--urm-emerald-border);
    color: var(--urm-brand-icon);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    flex-shrink: 0;
}

.ypf-perm-role-title-row[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.ypf-perm-role-name[b-wjqievzwsu] {
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--urm-heading);
    margin: 0;
}

.ypf-perm-admin-chip[b-wjqievzwsu] {
    padding: 0.15rem 0.6rem;
    border-radius: 9999px;
    background-color: var(--urm-brand-600);
    color: #fff;
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    white-space: nowrap;
}

.ypf-perm-policy[b-wjqievzwsu] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    background-color: var(--urm-tile-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.6rem;
    padding: 1rem;
}

.ypf-perm-policy > i[b-wjqievzwsu] {
    color: var(--urm-brand-icon);
    font-size: 1rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.ypf-perm-policy-title[b-wjqievzwsu] {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--urm-heading);
    margin-bottom: 0.25rem;
}

.ypf-perm-policy p[b-wjqievzwsu] {
    font-size: 0.75rem;
    color: var(--urm-text-3);
    margin: 0;
    line-height: 1.55;
}

.ypf-perm-grid[b-wjqievzwsu] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}

.ypf-perm-tile[b-wjqievzwsu] {
    background-color: var(--urm-tile-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.6rem;
    padding: 0.85rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}

.ypf-perm-tile-head[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--urm-heading);
}

.ypf-perm-tile-head i[b-wjqievzwsu] {
    color: var(--urm-emerald-text);
    font-size: 0.95rem;
    flex-shrink: 0;
}

.ypf-perm-tile-desc[b-wjqievzwsu] {
    font-size: 0.7rem;
    color: var(--urm-muted);
    margin: 0;
    line-height: 1.5;
}

.ypf-perm-key[b-wjqievzwsu] {
    font-family: var(--bs-font-monospace, monospace);
    font-size: 0.6875rem;
    color: var(--urm-brand-strong);
    background: none;
    padding: 0;
}

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

@media (max-width: 700px) {
    .ypf-perm-grid[b-wjqievzwsu] {
        grid-template-columns: 1fr;
    }
}

/* ---------- Site access tab (mirrors the sharing workspace's grant rows) ---------- */

.ypf-sa-card[b-wjqievzwsu] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.75rem;
    overflow: hidden;
}

.ypf-sa-head[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 1rem 1.25rem;
}

.ypf-sa-id[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-width: 0;
}

.ypf-sa-avatar[b-wjqievzwsu] {
    width: 2.9rem;
    height: 2.9rem;
    border-radius: 0.65rem;
    background-color: #0f172a;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.9rem;
    letter-spacing: 0.03em;
    flex-shrink: 0;
}

.ypf-sa-name-row[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.ypf-sa-name[b-wjqievzwsu] {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--urm-heading);
}

.ypf-sa-type-chip[b-wjqievzwsu] {
    padding: 0.15rem 0.6rem;
    border-radius: 9999px;
    font-size: 0.65rem;
    font-weight: 600;
    background-color: #eef2ff;
    color: #4f46e5;
    border: 1px solid #c7d2fe;
    white-space: nowrap;
}

.ypf-sa-type-chip--own[b-wjqievzwsu] {
    background-color: var(--urm-emerald-bg);
    color: var(--urm-emerald-text);
    border-color: var(--urm-emerald-border);
}

.ypf-sa-meta[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
    font-size: 0.6875rem;
    color: var(--urm-muted);
    margin-top: 0.25rem;
}

.ypf-sa-mode-chip[b-wjqievzwsu] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.85rem;
    border-radius: 0.6rem;
    border: 1px solid var(--urm-chip-border);
    background-color: var(--urm-chip-bg);
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--urm-text-3);
    white-space: nowrap;
}

.ypf-sa-mode-chip i[b-wjqievzwsu] {
    color: var(--urm-brand-icon);
}

.ypf-sa-sites[b-wjqievzwsu] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 0.6rem;
    padding: 0 1.25rem 1rem;
}

.ypf-sa-site[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    background-color: var(--urm-tile-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.6rem;
    padding: 0.6rem 0.8rem;
    min-width: 0;
}

.ypf-sa-site > i[b-wjqievzwsu] {
    color: var(--urm-brand-icon);
    flex-shrink: 0;
}

.ypf-sa-site-text[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.ypf-sa-site-name[b-wjqievzwsu] {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--urm-heading);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ypf-sa-site-loc[b-wjqievzwsu] {
    font-size: 0.65rem;
    color: var(--urm-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ypf-sa-site-status[b-wjqievzwsu] {
    padding: 0.1rem 0.5rem;
    border-radius: 9999px;
    font-size: 0.6rem;
    font-weight: 700;
    background-color: var(--urm-emerald-bg);
    color: var(--urm-emerald-text);
    border: 1px solid var(--urm-emerald-border);
    white-space: nowrap;
    flex-shrink: 0;
}

.ypf-sa-foot[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    padding: 0.65rem 1.25rem;
    background-color: var(--urm-head-bg);
    border-top: 1px solid var(--urm-border-soft);
}

.ypf-sa-count-pill[b-wjqievzwsu] {
    padding: 0.2rem 0.6rem;
    border-radius: 0.35rem;
    font-size: 0.625rem;
    font-weight: 700;
    background-color: #059669;
    color: #fff;
    white-space: nowrap;
}

.ypf-sa-foot-text[b-wjqievzwsu] {
    font-size: 0.6875rem;
    color: var(--urm-muted);
}

/* ---------- Toasts ---------- */

.ypf-toasts[b-wjqievzwsu] {
    position: fixed;
    bottom: 1.5rem;
    right: 1.5rem;
    z-index: 1060;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    pointer-events: none;
}

.ypf-toast[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: 0.5rem;
    border: 1px solid;
    box-shadow: var(--urm-toast-shadow);
    color: var(--urm-toast-text);
    font-size: 0.75rem;
    font-weight: 600;
    pointer-events: auto;
    animation: ypf-toast-in-b-wjqievzwsu 0.3s ease forwards;
    max-width: 24rem;
}

.ypf-toast--closing[b-wjqievzwsu] {
    transition: opacity 0.3s ease, transform 0.3s ease;
    opacity: 0;
    transform: translateY(0.5rem);
}

@keyframes ypf-toast-in-b-wjqievzwsu {
    from { opacity: 0; transform: translateY(0.5rem); }
    to   { opacity: 1; transform: translateY(0); }
}

.ypf-toast--success[b-wjqievzwsu] { background-color: var(--urm-toast-success-bg); border-color: var(--urm-toast-success-border); }
.ypf-toast--error[b-wjqievzwsu]   { background-color: var(--urm-toast-error-bg);   border-color: var(--urm-toast-error-border); }
.ypf-toast--warning[b-wjqievzwsu] { background-color: var(--urm-toast-warning-bg); border-color: var(--urm-toast-warning-border); }

.ypf-toast--success > i[b-wjqievzwsu] { color: var(--urm-emerald-text); }
.ypf-toast--error > i[b-wjqievzwsu]   { color: var(--urm-rose-text); }
.ypf-toast--warning > i[b-wjqievzwsu] { color: var(--urm-amber-text); }

.ypf-toast > button[b-wjqievzwsu] {
    background: none;
    border: none;
    padding: 0;
    margin-left: 1rem;
    color: var(--urm-muted);
    font-size: 0.625rem;
    cursor: pointer;
}

.ypf-toast > button:hover[b-wjqievzwsu] {
    color: var(--urm-heading);
}

/* ---------- My Views tab ---------- */

/* Default-view banner: the only state on this page that outlives the session, so it reads as a
   status strip rather than another card. Tinted only while a default is actually applied. */
.ypf-mv-default[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.85rem 1rem;
    margin-bottom: 1rem;
    border: 1px solid var(--urm-field-border);
    border-radius: 0.65rem;
    background-color: var(--urm-head-bg);
}

.ypf-mv-default--on[b-wjqievzwsu] {
    border-color: var(--urm-emerald-border);
    background-color: var(--urm-emerald-bg);
}

.ypf-mv-default > i[b-wjqievzwsu] {
    font-size: 1.35rem;
    color: var(--urm-muted);
    flex-shrink: 0;
}

.ypf-mv-default--on > i[b-wjqievzwsu] {
    color: var(--urm-emerald-text);
}

.ypf-mv-default-text[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
    flex: 1;
}

.ypf-mv-default-title[b-wjqievzwsu] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--urm-heading);
}

.ypf-mv-default-sub[b-wjqievzwsu] {
    font-size: 0.8rem;
    color: var(--urm-muted);
}

/* Site / Base segmented control */
.ypf-mv-kinds[b-wjqievzwsu] {
    display: inline-flex;
    gap: 0.25rem;
    padding: 0.25rem;
    margin-bottom: 1rem;
    border: 1px solid var(--urm-field-border);
    border-radius: 0.6rem;
    background-color: var(--urm-head-bg);
}

.ypf-mv-kind[b-wjqievzwsu] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.85rem;
    border: none;
    border-radius: 0.45rem;
    background: transparent;
    color: var(--urm-text-3);
    font-size: 0.85rem;
    font-weight: 500;
}

.ypf-mv-kind:hover[b-wjqievzwsu] {
    color: var(--urm-heading);
}

.ypf-mv-kind--on[b-wjqievzwsu] {
    background-color: var(--urm-panel);
    color: var(--urm-heading);
    font-weight: 600;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

/* Two-pane layout: the views on the left, the open one on the right. */
.ypf-mv-grid[b-wjqievzwsu] {
    display: grid;
    grid-template-columns: minmax(240px, 20rem) 1fr;
    gap: 1rem;
    align-items: start;
}

.ypf-mv-side[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    min-width: 0;
}

.ypf-mv-main[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    min-width: 0;
    padding: 1rem 1.15rem;
    border: 1px solid var(--urm-field-border);
    border-radius: 0.75rem;
    background-color: var(--urm-panel);
}

.ypf-mv-group-label[b-wjqievzwsu] {
    margin-top: 0.4rem;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--urm-faint);
}

.ypf-mv-item[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.7rem 0.85rem;
    border: 1px solid var(--urm-field-border);
    border-radius: 0.6rem;
    background-color: var(--urm-panel);
    cursor: pointer;
}

.ypf-mv-item:hover[b-wjqievzwsu] {
    border-color: var(--urm-field-border-hover);
    background-color: var(--urm-hover-bg);
}

.ypf-mv-item--on[b-wjqievzwsu] {
    border-color: var(--urm-brand);
    background-color: var(--urm-brand-tint);
}

.ypf-mv-item-main[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    flex: 1;
}

.ypf-mv-item-name[b-wjqievzwsu] {
    font-weight: 600;
    font-size: 0.875rem;
    color: var(--urm-heading);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ypf-mv-item-meta[b-wjqievzwsu] {
    font-size: 0.75rem;
    color: var(--urm-muted);
}

.ypf-mv-item-tags[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    flex-shrink: 0;
}

.ypf-mv-create[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    padding: 0.85rem;
    border: 1px dashed var(--urm-brand);
    border-radius: 0.6rem;
    background-color: var(--urm-brand-tint);
}

.ypf-mv-create > label[b-wjqievzwsu] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--urm-text-2);
}

.ypf-mv-create input[b-wjqievzwsu] {
    width: 100%;
    padding: 0.5rem 0.7rem;
    border: 1px solid var(--urm-field-border);
    border-radius: 0.45rem;
    background-color: var(--urm-panel);
    color: var(--urm-text);
    font-size: 0.85rem;
}

.ypf-mv-create-actions[b-wjqievzwsu] {
    display: flex;
    gap: 0.4rem;
}

.ypf-mv-head[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.ypf-mv-head-id[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.ypf-mv-title[b-wjqievzwsu] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--urm-heading);
}

.ypf-mv-rename[b-wjqievzwsu] {
    padding: 0.4rem 0.6rem;
    border: 1px solid var(--urm-field-border);
    border-radius: 0.45rem;
    background-color: var(--urm-panel);
    color: var(--urm-text);
    font-size: 0.9rem;
}

.ypf-mv-actions[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
}

/* Add-members picker */
.ypf-mv-picker[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.ypf-mv-search[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    background-color: var(--urm-head-bg);
}

.ypf-mv-search > i[b-wjqievzwsu] {
    color: var(--urm-faint);
}

.ypf-mv-search input[b-wjqievzwsu] {
    flex: 1;
    border: none;
    background: transparent;
    color: var(--urm-text);
    font-size: 0.85rem;
}

.ypf-mv-search input:focus[b-wjqievzwsu] {
    outline: none;
}

.ypf-mv-results[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    max-height: 13rem;
    overflow-y: auto;
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
}

.ypf-mv-result[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border: none;
    border-bottom: 1px solid var(--urm-border-soft);
    background-color: var(--urm-panel);
    color: var(--urm-text);
    font-size: 0.85rem;
    text-align: left;
}

.ypf-mv-result:last-child[b-wjqievzwsu] {
    border-bottom: none;
}

.ypf-mv-result:hover[b-wjqievzwsu] {
    background-color: var(--urm-hover-bg);
}

.ypf-mv-result > i[b-wjqievzwsu] {
    color: var(--urm-emerald-text);
}

.ypf-mv-result-name[b-wjqievzwsu] {
    font-weight: 500;
}

.ypf-mv-result-detail[b-wjqievzwsu] {
    margin-left: auto;
    font-size: 0.75rem;
    color: var(--urm-muted);
}

/* The view's current membership */
.ypf-mv-members[b-wjqievzwsu] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    gap: 0.5rem;
}

.ypf-mv-member[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--urm-field-border);
    border-radius: 0.55rem;
    background-color: var(--urm-head-bg);
}

.ypf-mv-member > i[b-wjqievzwsu] {
    color: var(--urm-brand-icon);
    flex-shrink: 0;
}

.ypf-mv-member-text[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    flex: 1;
}

.ypf-mv-member-name[b-wjqievzwsu] {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--urm-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ypf-mv-member-detail[b-wjqievzwsu] {
    font-size: 0.75rem;
    color: var(--urm-muted);
}

.ypf-mv-foot[b-wjqievzwsu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
    padding-top: 0.85rem;
    border-top: 1px solid var(--urm-border-soft);
}

.ypf-mv-empty[b-wjqievzwsu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 1.5rem 1rem;
    border: 1px dashed var(--urm-field-border);
    border-radius: 0.6rem;
    color: var(--urm-muted);
    font-size: 0.85rem;
    text-align: center;
}

.ypf-mv-empty--tall[b-wjqievzwsu] {
    padding: 3rem 1rem;
}

.ypf-mv-empty > i[b-wjqievzwsu] {
    font-size: 1.75rem;
    color: var(--urm-faint);
}

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
    .ypf-pw-grid[b-wjqievzwsu],
    .ypf-mv-grid[b-wjqievzwsu] {
        grid-template-columns: 1fr;
    }

    .ypf-provider-grid[b-wjqievzwsu] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .ypf-field-row[b-wjqievzwsu],
    .ypf-method-grid[b-wjqievzwsu],
    .ypf-provider-grid[b-wjqievzwsu] {
        grid-template-columns: 1fr;
    }

    .ypf-hero[b-wjqievzwsu] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Components/Pages/Homs/HomLibrary.razor.rz.scp.css */
/* An organisation's Heliport Operations Manuals — the read-only side of the /homs register,
   in the same card vocabulary. Light by default; dark via [data-bs-theme="dark"] at the end. */

.hgl-header[b-k8our25znm] { padding: 1.5rem 0 1rem; }

.hgl-header-title[b-k8our25znm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #0f172a;
    margin: 0;
}

.hgl-header-chip[b-k8our25znm] {
    font-size: 0.75rem;
    font-weight: 400;
    color: #64748b;
    background-color: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 0.25rem;
    padding: 0.125rem 0.5rem;
}

.hgl-header-sub[b-k8our25znm] { font-size: 0.75rem; color: #64748b; margin: 0.25rem 0 0; max-width: 52rem; }

/* Toolbar */

.hgl-toolbar[b-k8our25znm] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    padding: 1rem;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);
}

.hgl-search[b-k8our25znm] { position: relative; flex: 1; min-width: 220px; max-width: 28rem; }

.hgl-search > i[b-k8our25znm] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: #64748b;
    font-size: 0.875rem;
    pointer-events: none;
}

.hgl-search > input[b-k8our25znm],
.hgl-select[b-k8our25znm] {
    width: 100%;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    padding: 0.625rem 0.75rem;
    font-size: 0.875rem;
    color: #334155;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.hgl-search > input[b-k8our25znm] { padding-left: 2.5rem; }
.hgl-search > input[b-k8our25znm]::placeholder { color: #94a3b8; }
.hgl-select[b-k8our25znm] { width: 20rem; max-width: 100%; cursor: pointer; }

.hgl-search > input:hover[b-k8our25znm],
.hgl-select:hover[b-k8our25znm] { border-color: #cbd5e1; }

.hgl-search > input:focus[b-k8our25znm],
.hgl-select:focus[b-k8our25znm] { border-color: #14b8a6; box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2); }

.hgl-clear[b-k8our25znm] { border: 0; background: transparent; font-size: 0.75rem; font-weight: 600; color: #0d9488; }
.hgl-clear:hover[b-k8our25znm] { text-decoration: underline; }

.hgl-alert[b-k8our25znm] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.65rem 0.9rem;
    border: 1px solid rgba(245, 158, 11, 0.3);
    border-radius: 0.6rem;
    background-color: rgba(245, 158, 11, 0.08);
    color: #92400e;
    font-size: 0.8125rem;
}

.hgl-alert > button[b-k8our25znm] { margin-left: auto; border: 0; background: transparent; color: inherit; }

/* Buttons */

.hgl-btn[b-k8our25znm] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.4rem 0.8rem;
    border-radius: 0.5rem;
    border: 1px solid transparent;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.hgl-btn--soft[b-k8our25znm] { background-color: rgba(13, 148, 136, 0.1); border-color: rgba(13, 148, 136, 0.25); color: #0d9488; }
.hgl-btn--soft:hover[b-k8our25znm] { background-color: #0d9488; border-color: #0d9488; color: #fff; }
.hgl-btn--light[b-k8our25znm] { background-color: #fff; border-color: #e2e8f0; color: #334155; }
.hgl-btn--light:hover[b-k8our25znm] { background-color: #f1f5f9; border-color: #cbd5e1; }

.hgl-icon-btn[b-k8our25znm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 0.5rem;
    border: 1px solid #e2e8f0;
    background-color: #fff;
    color: #475569;
    cursor: pointer;
}

.hgl-icon-btn:hover:not(:disabled)[b-k8our25znm] { background-color: #f1f5f9; color: #0f172a; }
.hgl-icon-btn:disabled[b-k8our25znm] { opacity: 0.5; cursor: not-allowed; }

.hgl-spin[b-k8our25znm] { display: inline-block; animation: hgl-spin-b-k8our25znm 0.9s linear infinite; }

@keyframes hgl-spin-b-k8our25znm {
    to { transform: rotate(360deg); }
}

/* Empty states */

.hgl-empty[b-k8our25znm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.375rem;
    padding: 3rem 1.5rem;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
}

.hgl-empty-icon[b-k8our25znm] {
    width: 3rem;
    height: 3rem;
    border-radius: 9999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.35rem;
    color: #0d9488;
    background-color: rgba(13, 148, 136, 0.08);
    border: 1px solid rgba(13, 148, 136, 0.2);
    margin-bottom: 0.25rem;
}

.hgl-empty-title[b-k8our25znm] { font-size: 0.875rem; font-weight: 700; color: #0f172a; margin: 0; }
.hgl-empty-sub[b-k8our25znm] { font-size: 0.75rem; color: #64748b; margin: 0 0 0.5rem; max-width: 30rem; }

/* Cards */

.hgl-card[b-k8our25znm] {
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    padding: 1.1rem 1.25rem;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.hgl-card:hover[b-k8our25znm] { border-color: #0d9488; box-shadow: 0 4px 12px rgba(15, 23, 42, 0.1); }
.hgl-card--selected[b-k8our25znm] { border-color: #14b8a6; box-shadow: 0 0 0 2px rgba(45, 212, 191, 0.35); }

.hgl-card-top[b-k8our25znm] { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; }

.hgl-code-chip[b-k8our25znm] {
    display: inline-block;
    max-width: 60%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    background-color: #0f172a;
    color: #fff;
    font-family: var(--ins-font-monospace, monospace);
    font-size: 0.6875rem;
    font-weight: 700;
    border-radius: 0.35rem;
    padding: 0.15rem 0.45rem;
    letter-spacing: 0.03em;
}

.hgl-code-chip--muted[b-k8our25znm] { background-color: #f1f5f9; color: #64748b; font-family: inherit; }

.hgl-badge[b-k8our25znm] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    font-weight: 600;
    border-radius: 9999px;
    padding: 0.15rem 0.55rem;
    border: 1px solid;
    white-space: nowrap;
}

.hgl-badge--brand[b-k8our25znm]   { background-color: rgba(13, 148, 136, 0.1); color: #0d9488; border-color: rgba(13, 148, 136, 0.25); }
.hgl-badge--warning[b-k8our25znm] { background-color: rgba(217, 119, 6, 0.1);  color: #d97706; border-color: rgba(217, 119, 6, 0.25); }

.hgl-card-title[b-k8our25znm] {
    border: 0;
    background: transparent;
    padding: 0;
    text-align: left;
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1.35;
    color: #0f172a;
    cursor: pointer;
}

.hgl-card-title:hover[b-k8our25znm],
.hgl-card-title:focus-visible[b-k8our25znm] { color: #0d9488; text-decoration: underline; outline: none; }

.hgl-card-meta[b-k8our25znm] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1rem;
    font-size: 0.75rem;
    color: #64748b;
    margin: -0.25rem 0 0;
}

.hgl-card-meta i[b-k8our25znm] { margin-right: 0.25rem; }

.hgl-doc-tile[b-k8our25znm] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.6rem;
    background-color: rgba(13, 148, 136, 0.04);
    padding: 0.6rem 0.75rem;
}

.hgl-file[b-k8our25znm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 0.5rem;
    font-size: 1.05rem;
    border: 1px solid;
}

.hgl-file--pdf[b-k8our25znm]  { color: #e11d48; background-color: rgba(225, 29, 72, 0.08); border-color: rgba(225, 29, 72, 0.2); }
.hgl-file--word[b-k8our25znm] { color: #2563eb; background-color: rgba(37, 99, 235, 0.08); border-color: rgba(37, 99, 235, 0.2); }

.hgl-doc-body[b-k8our25znm] { min-width: 0; flex: 1 1 auto; }

.hgl-doc-name[b-k8our25znm] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #0f172a;
    margin: 0 0 0.1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hgl-doc-sub[b-k8our25znm] { font-size: 0.6875rem; color: #64748b; margin: 0; }

.hgl-change[b-k8our25znm] {
    font-size: 0.75rem;
    color: #475569;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.hgl-change strong[b-k8our25znm] { color: #0f172a; }

.hgl-card-foot[b-k8our25znm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: auto;
    padding-top: 0.75rem;
    border-top: 1px solid #e2e8f0;
}

.hgl-foot-note[b-k8our25znm] { font-size: 0.6875rem; font-weight: 600; color: #64748b; }
.hgl-foot-note--warning[b-k8our25znm] { color: #d97706; }
.hgl-card-actions[b-k8our25znm] { display: flex; align-items: center; gap: 0.375rem; margin-left: auto; }

/* Reader panel */

.hgl-reader[b-k8our25znm] { display: flex; flex-direction: column; gap: 0.875rem; }

.hgl-reader .hgl-change[b-k8our25znm] { -webkit-line-clamp: unset; display: block; }

.hgl-facts[b-k8our25znm] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 2rem;
    margin: 0;
}

.hgl-facts dt[b-k8our25znm] {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #94a3b8;
}

.hgl-facts dd[b-k8our25znm] { font-size: 0.8125rem; font-weight: 600; color: #0f172a; margin: 0.1rem 0 0; }

.hgl-description[b-k8our25znm] { font-size: 0.8125rem; color: #334155; margin: 0; white-space: pre-line; }

/* Dark theme */

[data-bs-theme="dark"] .hgl-header-title[b-k8our25znm],
[data-bs-theme="dark"] .hgl-card-title[b-k8our25znm],
[data-bs-theme="dark"] .hgl-doc-name[b-k8our25znm],
[data-bs-theme="dark"] .hgl-empty-title[b-k8our25znm],
[data-bs-theme="dark"] .hgl-facts dd[b-k8our25znm],
[data-bs-theme="dark"] .hgl-change strong[b-k8our25znm] { color: #f1f5f9; }

[data-bs-theme="dark"] .hgl-header-sub[b-k8our25znm],
[data-bs-theme="dark"] .hgl-card-meta[b-k8our25znm],
[data-bs-theme="dark"] .hgl-doc-sub[b-k8our25znm],
[data-bs-theme="dark"] .hgl-foot-note[b-k8our25znm],
[data-bs-theme="dark"] .hgl-empty-sub[b-k8our25znm],
[data-bs-theme="dark"] .hgl-change[b-k8our25znm],
[data-bs-theme="dark"] .hgl-description[b-k8our25znm] { color: #94a3b8; }

[data-bs-theme="dark"] .hgl-header-chip[b-k8our25znm] { background-color: #1e293b; border-color: #334155; color: #94a3b8; }

[data-bs-theme="dark"] .hgl-toolbar[b-k8our25znm],
[data-bs-theme="dark"] .hgl-card[b-k8our25znm],
[data-bs-theme="dark"] .hgl-empty[b-k8our25znm] { background-color: #131926; border-color: #1e293b; }

[data-bs-theme="dark"] .hgl-search > input[b-k8our25znm],
[data-bs-theme="dark"] .hgl-select[b-k8our25znm],
[data-bs-theme="dark"] .hgl-icon-btn[b-k8our25znm],
[data-bs-theme="dark"] .hgl-btn--light[b-k8our25znm] { background-color: #0b0f19; border-color: #1e293b; color: #e2e8f0; }

[data-bs-theme="dark"] .hgl-select > option[b-k8our25znm] { background-color: #131926; color: #e2e8f0; }
[data-bs-theme="dark"] .hgl-icon-btn:hover:not(:disabled)[b-k8our25znm],
[data-bs-theme="dark"] .hgl-btn--light:hover[b-k8our25znm] { background-color: #1e293b; border-color: #334155; }

[data-bs-theme="dark"] .hgl-code-chip[b-k8our25znm] { background-color: #2dd4bf; color: #0f172a; }
[data-bs-theme="dark"] .hgl-code-chip--muted[b-k8our25znm] { background-color: #1e293b; color: #94a3b8; }
[data-bs-theme="dark"] .hgl-doc-tile[b-k8our25znm] { background-color: rgba(45, 212, 191, 0.06); border-color: #1e293b; }
[data-bs-theme="dark"] .hgl-card-foot[b-k8our25znm] { border-color: #1e293b; }
[data-bs-theme="dark"] .hgl-btn--soft[b-k8our25znm] { background-color: rgba(45, 212, 191, 0.12); border-color: rgba(45, 212, 191, 0.3); color: #2dd4bf; }
[data-bs-theme="dark"] .hgl-btn--soft:hover[b-k8our25znm] { background-color: #0d9488; border-color: #0d9488; color: #fff; }
[data-bs-theme="dark"] .hgl-alert[b-k8our25znm] { color: #fde68a; }
/* /Components/Pages/Management/Domains.razor.rz.scp.css */
/* ============================================================
   Domain & Identity Security — port of the approved-domains
   design onto the /users (User & Role Management) look. The urm-
   rules mirror Users.razor.css so both control centres read the
   same; dom- rules are this page's own. Theme-aware: light by
   default, dark via html[data-bs-theme="dark"]. Colours live in
   the token blocks; component rules reference tokens only.
   ============================================================ */

/* ---------- Tokens: light (default) ---------- */

.urm-page[b-4wwamzhymd],
.dom-panel[b-4wwamzhymd],
.urm-toasts[b-4wwamzhymd] {
    --urm-page-bg: transparent;
    --urm-page-border: transparent;
    --urm-page-pad: 0;
    --urm-panel: #ffffff;
    --urm-border: #e2e8f0;
    --urm-border-soft: rgba(226, 232, 240, 0.7);
    --urm-chip-bg: #f1f5f9;
    --urm-chip-border: #e2e8f0;
    --urm-chip-hover: #e2e8f0;
    --urm-thead-bg: var(--ins-topbar-bg);
    --urm-row-hover: #f8fafc;
    --urm-selected-bg: rgba(20, 184, 166, 0.07);
    --urm-foot-bg: #f8fafc;
    --urm-hover-bg: #f1f5f9;
    --urm-header-pad: 1.5rem 0 0;

    --urm-heading: #0f172a;
    --urm-text: #1e293b;
    --urm-text-2: #334155;
    --urm-text-3: #475569;
    --urm-muted: #64748b;
    --urm-faint: #94a3b8;

    --urm-brand: #14b8a6;
    --urm-brand-600: #0d9488;
    --urm-brand-strong: #0d9488;
    --urm-brand-icon: #0d9488;

    --urm-field-bg: #ffffff;
    --urm-field-border: #e2e8f0;
    --urm-field-border-hover: #cbd5e1;
    --urm-placeholder: #94a3b8;
    --urm-tile-bg: #f8fafc;

    --urm-avatar-bg: #f1f5f9;
    --urm-avatar-border: #e2e8f0;
    --urm-avatar-color: #475569;
    --urm-avatar-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.06);

    --urm-emerald-text: #059669;
    --urm-cyan-text: #0891b2;
    --urm-amber-text: #d97706;
    --urm-rose-text: #e11d48;
    --urm-sky-text: #0284c7;

    --urm-org-rose: #e11d48;
    --urm-org-indigo: #4f46e5;
    --urm-org-amber: #b45309;
    --urm-org-pink: #db2777;
    --urm-org-cyan: #0e7490;
    --urm-org-emerald: #059669;

    --urm-warn-bg: #fffbeb;
    --urm-warn-border: #fde68a;
    --urm-warn-color: #92400e;

    --urm-pager-bg: #ffffff;
    --urm-pager-border: #e2e8f0;
    --urm-pager-color: #475569;

    --urm-toast-text: #1e293b;
    --urm-toast-success-bg: #ecfdf5;
    --urm-toast-success-border: #a7f3d0;
    --urm-toast-error-bg: #fef2f2;
    --urm-toast-error-border: #fecaca;
    --urm-toast-warning-bg: #fffbeb;
    --urm-toast-warning-border: #fde68a;

    --urm-card-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);
    --urm-toast-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.15);

    /* tints for the status tiles and notices */
    --dom-emerald-bg: #ecfdf5;
    --dom-emerald-border: #a7f3d0;
    --dom-amber-bg: #fffbeb;
    --dom-amber-border: #fde68a;
    --dom-amber-ink: #92400e;
    --dom-rose-bg: #fff1f2;
    --dom-rose-border: #fecdd3;
    --dom-rose-ink: #9f1239;
    --dom-sky-bg: #f0f9ff;
    --dom-sky-border: #bae6fd;
    --dom-sky-ink: #075985;

    font-family: "Inter", var(--ins-body-font-family, sans-serif);
}

/* ---------- Tokens: dark ---------- */

[data-bs-theme="dark"] .urm-page[b-4wwamzhymd],
[data-bs-theme="dark"] .dom-panel[b-4wwamzhymd],
[data-bs-theme="dark"] .urm-toasts[b-4wwamzhymd] {
    --urm-page-bg: #0b0f19;
    --urm-page-border: #1e293b;
    --urm-page-pad: 1.5rem;
    --urm-panel: #131926;
    --urm-border: #1e293b;
    --urm-border-soft: rgba(30, 41, 59, 0.6);
    --urm-chip-bg: #1e293b;
    --urm-chip-border: #334155;
    --urm-chip-hover: #334155;
    --urm-thead-bg: var(--ins-topbar-bg);
    --urm-row-hover: rgba(30, 41, 59, 0.2);
    --urm-selected-bg: rgba(20, 184, 166, 0.05);
    --urm-foot-bg: rgba(30, 41, 59, 0.2);
    --urm-hover-bg: rgba(30, 41, 59, 0.4);
    --urm-header-pad: 0;

    --urm-heading: #ffffff;
    --urm-text: #f1f5f9;
    --urm-text-2: #e2e8f0;
    --urm-text-3: #cbd5e1;
    --urm-muted: #94a3b8;
    --urm-faint: #64748b;

    --urm-brand-strong: #2dd4bf;
    --urm-brand-icon: #14b8a6;

    --urm-field-bg: #0b0f19;
    --urm-field-border: #1e293b;
    --urm-field-border-hover: #334155;
    --urm-placeholder: #64748b;
    --urm-tile-bg: #0b0f19;

    --urm-avatar-bg: #1e293b;
    --urm-avatar-border: rgba(51, 65, 85, 0.8);
    --urm-avatar-color: #cbd5e1;
    --urm-avatar-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);

    --urm-emerald-text: #34d399;
    --urm-cyan-text: #22d3ee;
    --urm-amber-text: #fbbf24;
    --urm-rose-text: #fb7185;
    --urm-sky-text: #38bdf8;

    --urm-org-rose: #fb7185;
    --urm-org-indigo: #818cf8;
    --urm-org-amber: #fbbf24;
    --urm-org-pink: #f472b6;
    --urm-org-cyan: #22d3ee;
    --urm-org-emerald: #34d399;

    --urm-warn-bg: rgba(245, 158, 11, 0.1);
    --urm-warn-border: rgba(245, 158, 11, 0.2);
    --urm-warn-color: #fde68a;

    --urm-pager-bg: rgba(30, 41, 59, 0.5);
    --urm-pager-border: rgba(51, 65, 85, 0.5);
    --urm-pager-color: #cbd5e1;

    --urm-toast-text: #f1f5f9;
    --urm-toast-success-bg: #0c1a16;
    --urm-toast-success-border: rgba(16, 185, 129, 0.2);
    --urm-toast-error-bg: #1d1115;
    --urm-toast-error-border: rgba(244, 63, 94, 0.2);
    --urm-toast-warning-bg: #1c1811;
    --urm-toast-warning-border: rgba(245, 158, 11, 0.2);

    --urm-card-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.25);
    --urm-toast-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.4);

    --dom-emerald-bg: rgba(16, 185, 129, 0.1);
    --dom-emerald-border: rgba(16, 185, 129, 0.25);
    --dom-amber-bg: rgba(245, 158, 11, 0.1);
    --dom-amber-border: rgba(245, 158, 11, 0.25);
    --dom-amber-ink: #fde68a;
    --dom-rose-bg: rgba(244, 63, 94, 0.1);
    --dom-rose-border: rgba(244, 63, 94, 0.25);
    --dom-rose-ink: #fecdd3;
    --dom-sky-bg: rgba(14, 165, 233, 0.1);
    --dom-sky-border: rgba(14, 165, 233, 0.25);
    --dom-sky-ink: #bae6fd;
}

/* ---------- Workspace surface & header ---------- */

.urm-page[b-4wwamzhymd] {
    background-color: var(--urm-page-bg);
    border: 1px solid var(--urm-page-border);
    border-radius: 12px;
    padding: var(--urm-page-pad);
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    min-height: calc(100vh - var(--ins-topbar-height, 70px) - 8rem);
    color: var(--urm-text);
}

.urm-header[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: var(--urm-header-pad);
    min-height: 60px;
}

.urm-header-title[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--urm-heading);
    margin: 0;
}

.urm-header-chip[b-4wwamzhymd] {
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--urm-muted);
    background-color: var(--urm-chip-bg);
    border: 1px solid var(--urm-chip-border);
    border-radius: 0.25rem;
    padding: 0.125rem 0.5rem;
}

.urm-header-sub[b-4wwamzhymd] {
    font-size: 0.75rem;
    color: var(--urm-muted);
    margin: 0.25rem 0 0;
}

.dom-text-emerald[b-4wwamzhymd] { color: var(--urm-emerald-text); }
.dom-text-amber[b-4wwamzhymd]   { color: var(--urm-amber-text); }

/* ---------- Attention notices ---------- */

.dom-attention[b-4wwamzhymd] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.dom-attention-item[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding: 0.875rem 1rem;
    border: 1px solid;
    border-radius: 0.75rem;
}

.dom-attention-item > i[b-4wwamzhymd] {
    font-size: 1.25rem;
    flex-shrink: 0;
}

.dom-attention-item--amber[b-4wwamzhymd] { background-color: var(--dom-amber-bg); border-color: var(--dom-amber-border); color: var(--dom-amber-ink); }
.dom-attention-item--sky[b-4wwamzhymd]   { background-color: var(--dom-sky-bg);   border-color: var(--dom-sky-border);   color: var(--dom-sky-ink); }

.dom-attention-text[b-4wwamzhymd] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    flex: 1;
    min-width: 0;
    font-size: 0.75rem;
}

.dom-attention-text strong[b-4wwamzhymd] {
    font-size: 0.8125rem;
    font-weight: 600;
}

/* ---------- Toolbar ---------- */

.urm-toolbar[b-4wwamzhymd] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    box-shadow: var(--urm-card-shadow);
}

.urm-toolbar-filters[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    flex-wrap: wrap;
    min-width: 0;
}

.urm-toolbar-actions[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.urm-search[b-4wwamzhymd] {
    position: relative;
    flex: 1;
    min-width: 220px;
}

.urm-search > i[b-4wwamzhymd] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--urm-muted);
    font-size: 0.875rem;
    pointer-events: none;
}

.urm-search > input[b-4wwamzhymd] {
    width: 100%;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 1rem 0.625rem 2.5rem;
    font-size: 0.875rem;
    color: var(--urm-text-2);
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.urm-search > input[b-4wwamzhymd]::placeholder {
    color: var(--urm-placeholder);
}

.urm-search > input:hover[b-4wwamzhymd] {
    border-color: var(--urm-field-border-hover);
}

.urm-search > input:focus[b-4wwamzhymd] {
    border-color: var(--urm-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.urm-select[b-4wwamzhymd] {
    width: 12rem;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 0.75rem;
    font-size: 0.875rem;
    color: var(--urm-text-3);
    outline: none;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.urm-select:hover[b-4wwamzhymd] {
    border-color: var(--urm-field-border-hover);
}

.urm-select:focus[b-4wwamzhymd] {
    border-color: var(--urm-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.urm-select > option[b-4wwamzhymd] {
    background-color: var(--urm-panel);
    color: var(--urm-text-2);
}

.urm-select--full[b-4wwamzhymd] { width: 100%; }

/* Organisation names run long (NHS trusts) */
.urm-select--wide[b-4wwamzhymd] {
    width: 18rem;
    max-width: 100%;
}

.urm-select--sm[b-4wwamzhymd] {
    width: auto;
    padding: 0.375rem 0.625rem;
    font-size: 0.75rem;
}

.dom-clear[b-4wwamzhymd] {
    background: none;
    border: none;
    border-radius: 0.5rem;
    padding: 0.625rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--urm-muted);
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.dom-clear:hover[b-4wwamzhymd] {
    background-color: var(--urm-hover-bg);
    color: var(--urm-heading);
}

/* ---------- Buttons ---------- */

.urm-btn[b-4wwamzhymd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    padding: 0.625rem 1rem;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease, transform 0.1s ease, box-shadow 0.15s ease;
    white-space: nowrap;
}

.urm-btn:active:not(:disabled)[b-4wwamzhymd] {
    transform: scale(0.95);
}

.urm-btn:focus-visible[b-4wwamzhymd] {
    outline: 2px solid var(--urm-brand);
    outline-offset: 2px;
}

.urm-btn:disabled[b-4wwamzhymd] {
    opacity: 0.6;
    cursor: not-allowed;
}

.urm-btn--primary[b-4wwamzhymd] {
    background-color: var(--urm-brand-600);
    color: #fff;
    box-shadow: 0 4px 6px -1px rgba(13, 148, 136, 0.2);
}

.urm-btn--primary:hover:not(:disabled)[b-4wwamzhymd] {
    background-color: var(--urm-brand);
}

.urm-btn--dark[b-4wwamzhymd] {
    background-color: var(--urm-chip-bg);
    border-color: var(--urm-chip-border);
    color: var(--urm-text-3);
}

.urm-btn--dark:hover:not(:disabled)[b-4wwamzhymd] {
    background-color: var(--urm-chip-hover);
}

.urm-btn--rose[b-4wwamzhymd] {
    background-color: #e11d48;
    color: #fff;
    box-shadow: 0 4px 6px -1px rgba(225, 29, 72, 0.2);
}

.urm-btn--rose:hover:not(:disabled)[b-4wwamzhymd] {
    background-color: #f43f5e;
}

.urm-btn--sm[b-4wwamzhymd] {
    padding: 0.4375rem 0.875rem;
    font-size: 0.75rem;
    font-weight: 700;
}

.urm-btn--ghost-danger[b-4wwamzhymd] {
    background-color: transparent;
    border-color: rgba(225, 29, 72, 0.35);
    color: var(--urm-rose-text);
}

.urm-btn--ghost-danger:hover:not(:disabled)[b-4wwamzhymd] {
    background-color: rgba(225, 29, 72, 0.08);
}

/* A panel footer's secondary action, pushed to the left edge away from Cancel / Save */
.dom-footer-start[b-4wwamzhymd] {
    margin-right: auto;
}

/* ---------- Stat cards ---------- */

.urm-stats[b-4wwamzhymd] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.urm-stat-card[b-4wwamzhymd] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    padding: 0.55rem 0.85rem;
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    justify-content: flex-end;
    gap: 0.65rem;
    box-shadow: var(--urm-card-shadow);
}

.urm-stat-label[b-4wwamzhymd] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--urm-muted);
    margin: 0;
}

.urm-stat-value[b-4wwamzhymd] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--urm-heading);
    margin: 0.1rem 0 0;
}

.dom-stat-hint[b-4wwamzhymd] {
    font-size: 0.6875rem;
    font-weight: 500;
    color: var(--urm-muted);
}

.dom-stat-pill[b-4wwamzhymd] {
    font-size: 0.625rem;
    font-weight: 600;
    color: var(--dom-amber-ink);
    background-color: var(--dom-amber-bg);
    border-radius: 0.25rem;
    padding: 0.0625rem 0.375rem;
}

.urm-stat-icon[b-4wwamzhymd] {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
    border: 1px solid;
}

.urm-stat-icon--emerald[b-4wwamzhymd] { background-color: rgba(16, 185, 129, 0.1); border-color: rgba(16, 185, 129, 0.2); color: var(--urm-emerald-text); }
.urm-stat-icon--cyan[b-4wwamzhymd]    { background-color: rgba(6, 182, 212, 0.1);  border-color: rgba(6, 182, 212, 0.2);  color: var(--urm-cyan-text); }
.dom-stat-icon--amber[b-4wwamzhymd]   { background-color: rgba(245, 158, 11, 0.1); border-color: rgba(245, 158, 11, 0.2); color: var(--urm-amber-text); }
.dom-stat-icon--slate[b-4wwamzhymd]   { background-color: var(--urm-chip-bg);      border-color: var(--urm-chip-border);    color: var(--urm-text-3); }

/* ---------- Table card ---------- */

.urm-table-card[b-4wwamzhymd] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: var(--urm-card-shadow);
    display: flex;
    flex-direction: column;
}

.urm-table-scroll[b-4wwamzhymd] {
    overflow-x: auto;
    width: 100%;
}

.urm-table[b-4wwamzhymd] {
    width: 100%;
    text-align: left;
    border-collapse: collapse;
}

.urm-table thead tr[b-4wwamzhymd] {
    /* background (not background-color): the topbar colour can be a gradient */
    background: var(--urm-thead-bg);
    border-bottom: none;
}

/* Seven columns: a little less side padding than /users keeps the register inside a 1440px
   screen without the table scrolling sideways. */
.urm-table th[b-4wwamzhymd] {
    padding: 1rem 0.875rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ins-topbar-item-color);
    white-space: nowrap;
}

.urm-th-actions[b-4wwamzhymd] {
    width: 1%;
    text-align: right;
}

.urm-table tbody tr[b-4wwamzhymd] {
    border-bottom: 1px solid var(--urm-border-soft);
    transition: background-color 0.15s ease;
}

.urm-table tbody tr:hover[b-4wwamzhymd] {
    background-color: var(--urm-row-hover);
}

.urm-row--selected[b-4wwamzhymd] {
    background-color: var(--urm-selected-bg);
    box-shadow: inset 2px 0 0 var(--urm-brand);
}

.urm-table td[b-4wwamzhymd] {
    padding: 0.75rem 0.875rem;
    vertical-align: middle;
    font-size: 0.875rem;
    color: var(--urm-text-2);
}

.urm-user-cell[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.urm-avatar[b-4wwamzhymd] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.5rem;
    background-color: var(--urm-avatar-bg);
    border: 1px solid var(--urm-avatar-border);
    color: var(--urm-avatar-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    box-shadow: var(--urm-avatar-shadow);
    flex-shrink: 0;
}

/* The domain name opens the edit panel, so it is a button styled as the row's title */
.dom-domain-link[b-4wwamzhymd] {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--urm-heading);
    cursor: pointer;
    text-align: left;
    transition: color 0.15s ease;
}

.urm-table tbody tr:hover .dom-domain-link[b-4wwamzhymd],
.dom-domain-link:focus-visible[b-4wwamzhymd] {
    color: var(--urm-brand-strong);
}

.urm-user-email[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
    font-size: 0.6875rem;
    color: var(--urm-faint);
}

.dom-flag[b-4wwamzhymd] {
    display: inline-flex;
    align-items: center;
    padding: 0 0.375rem;
    border-radius: 0.25rem;
    font-size: 0.625rem;
    font-weight: 600;
    background-color: var(--dom-amber-bg);
    color: var(--dom-amber-ink);
    border: 1px solid var(--dom-amber-border);
    white-space: nowrap;
}

/* Organisation badges (same palette as /users) */

/* NHS trust names run long, so the badge wraps rather than widening the table */
.urm-org-badge[b-4wwamzhymd] {
    display: inline-flex;
    align-items: center;
    max-width: 14rem;
    padding: 0.25rem 0.625rem;
    border-radius: 0.375rem;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.35;
}

.urm-org-badge--rose[b-4wwamzhymd]    { background-color: rgba(244, 63, 94, 0.1);  color: var(--urm-org-rose);    border: 1px solid rgba(244, 63, 94, 0.2); }
.urm-org-badge--indigo[b-4wwamzhymd]  { background-color: rgba(99, 102, 241, 0.1); color: var(--urm-org-indigo);  border: 1px solid rgba(99, 102, 241, 0.2); }
.urm-org-badge--amber[b-4wwamzhymd]   { background-color: rgba(245, 158, 11, 0.1); color: var(--urm-org-amber);   border: 1px solid rgba(245, 158, 11, 0.2); }
.urm-org-badge--pink[b-4wwamzhymd]    { background-color: rgba(236, 72, 153, 0.1); color: var(--urm-org-pink);    border: 1px solid rgba(236, 72, 153, 0.2); }
.urm-org-badge--cyan[b-4wwamzhymd]    { background-color: rgba(6, 182, 212, 0.1);  color: var(--urm-org-cyan);    border: 1px solid rgba(6, 182, 212, 0.2); }
.urm-org-badge--emerald[b-4wwamzhymd] { background-color: rgba(16, 185, 129, 0.1); color: var(--urm-org-emerald); border: 1px solid rgba(16, 185, 129, 0.2); }
.urm-org-badge--slate[b-4wwamzhymd]   { background-color: var(--urm-chip-bg);      color: var(--urm-text-3);      border: 1px solid var(--urm-chip-border); }

/* Counts */

.dom-invited[b-4wwamzhymd] {
    display: inline-flex;
    align-items: baseline;
    gap: 0.25rem;
    white-space: nowrap;
}

.dom-count[b-4wwamzhymd] {
    font-weight: 700;
    color: var(--urm-heading);
}

.dom-count-unit[b-4wwamzhymd] {
    font-size: 0.75rem;
    color: var(--urm-faint);
}

/* The invited count opens the list of the domain's accounts */
.dom-invited--link[b-4wwamzhymd] {
    align-items: center;
    background: none;
    border: none;
    border-radius: 0.375rem;
    padding: 0.125rem 0.25rem;
    margin: -0.125rem -0.25rem;
    font: inherit;
    color: inherit;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.dom-invited--link > i[b-4wwamzhymd] {
    font-size: 0.875rem;
    color: var(--urm-faint);
    transition: color 0.15s ease;
}

.dom-invited--link:hover[b-4wwamzhymd],
.dom-invited--link:focus-visible[b-4wwamzhymd] {
    background-color: var(--urm-hover-bg);
}

.dom-invited--link:hover > i[b-4wwamzhymd],
.dom-invited--link:focus-visible > i[b-4wwamzhymd],
.dom-invited--link:hover .dom-count[b-4wwamzhymd] {
    color: var(--urm-brand-strong);
}

.dom-invited--link:focus-visible[b-4wwamzhymd] {
    outline: 2px solid var(--urm-brand);
    outline-offset: 1px;
}

.dom-mini-pills[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.dom-mini-pill[b-4wwamzhymd] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    border-radius: 0.375rem;
    font-size: 0.75rem;
    font-weight: 500;
    white-space: nowrap;
    background-color: var(--urm-tile-bg);
    color: var(--urm-faint);
    border: 1px solid var(--urm-border-soft);
}

.dom-mini-pill--amber[b-4wwamzhymd] { background-color: var(--dom-amber-bg); color: var(--urm-amber-text); border-color: var(--dom-amber-border); }
.dom-mini-pill--slate[b-4wwamzhymd] { background-color: var(--urm-chip-bg);  color: var(--urm-text-3);     border-color: var(--urm-chip-border); }

/* Last login */

.dom-login[b-4wwamzhymd] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--urm-text-3);
    white-space: nowrap;
}

.dom-login-dot[b-4wwamzhymd] {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 9999px;
    background-color: var(--urm-faint);
    opacity: 0.6;
    flex-shrink: 0;
}

.dom-login-dot--live[b-4wwamzhymd] {
    background-color: #10b981;
    opacity: 1;
    animation: dom-pulse-b-4wwamzhymd 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes dom-pulse-b-4wwamzhymd {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.45; }
}

/* Status pill */

.urm-status-badge[b-4wwamzhymd] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.025em;
    white-space: nowrap;
    border: 1px solid;
}

.urm-status-dot[b-4wwamzhymd] {
    width: 0.375rem;
    height: 0.375rem;
    border-radius: 9999px;
    margin-right: 0.375rem;
    background-color: currentColor;
}

.urm-status-badge--active[b-4wwamzhymd]  { background-color: rgba(16, 185, 129, 0.1); color: var(--urm-emerald-text); border-color: rgba(16, 185, 129, 0.2); }
.dom-status-badge--pending[b-4wwamzhymd] { background-color: rgba(245, 158, 11, 0.1); color: var(--urm-amber-text);   border-color: rgba(245, 158, 11, 0.25); }
.urm-status-badge--deleted[b-4wwamzhymd] { background-color: rgba(225, 29, 72, 0.08); color: var(--urm-rose-text);    border-color: rgba(225, 29, 72, 0.25); }

.dom-requested[b-4wwamzhymd] {
    max-width: 11rem;
    margin-top: 0.25rem;
    font-size: 0.6875rem;
    line-height: 1.35;
    color: var(--urm-faint);
}

/* Row actions */

.urm-td-actions[b-4wwamzhymd] {
    text-align: right;
}

.urm-actions-group[b-4wwamzhymd] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    justify-content: flex-end;
}

.urm-icon-btn[b-4wwamzhymd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.4375rem 0.5rem;
    background: transparent;
    border: 1px solid var(--urm-border);
    border-radius: 0.5rem;
    color: var(--urm-brand-strong);
    font-size: 0.75rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.urm-icon-btn:hover:not(:disabled)[b-4wwamzhymd] {
    background-color: var(--urm-hover-bg);
    border-color: var(--urm-chip-border);
}

.urm-icon-btn:disabled[b-4wwamzhymd] {
    opacity: 0.5;
    cursor: not-allowed;
}

.urm-icon-btn--danger[b-4wwamzhymd] {
    color: #e11d48;
}

.urm-icon-btn--danger:hover:not(:disabled)[b-4wwamzhymd] {
    background-color: rgba(225, 29, 72, 0.1);
    border-color: rgba(225, 29, 72, 0.35);
}

.dom-icon-btn--approve[b-4wwamzhymd] {
    color: var(--urm-emerald-text);
    background-color: rgba(16, 185, 129, 0.08);
    border-color: rgba(16, 185, 129, 0.3);
}

.dom-icon-btn--approve:hover:not(:disabled)[b-4wwamzhymd] {
    background-color: rgba(16, 185, 129, 0.16);
    border-color: rgba(16, 185, 129, 0.45);
}

/* Lock out / reject — tinted, so it reads apart from the plain-outline remove button beside it */
.dom-icon-btn--lock[b-4wwamzhymd] {
    color: var(--urm-rose-text);
    background-color: rgba(225, 29, 72, 0.06);
    border-color: rgba(225, 29, 72, 0.3);
}

.dom-icon-btn--lock:hover:not(:disabled)[b-4wwamzhymd] {
    background-color: rgba(225, 29, 72, 0.14);
    border-color: rgba(225, 29, 72, 0.45);
}

/* ---------- Empty / loading states ---------- */

.urm-empty[b-4wwamzhymd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1.5rem;
    text-align: center;
    gap: 0.25rem;
}

.urm-empty-icon[b-4wwamzhymd] {
    width: 4rem;
    height: 4rem;
    border-radius: 9999px;
    background-color: var(--urm-chip-bg);
    color: var(--urm-faint);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.urm-empty-title[b-4wwamzhymd] {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--urm-text);
    margin: 0;
}

.urm-empty-sub[b-4wwamzhymd] {
    font-size: 0.875rem;
    color: var(--urm-muted);
    max-width: 30rem;
    margin: 0;
}

.urm-empty-reset[b-4wwamzhymd] {
    background: none;
    border: none;
    padding: 0;
    margin-top: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--urm-brand-icon);
    cursor: pointer;
}

.urm-empty-reset:hover[b-4wwamzhymd] {
    color: var(--urm-brand-strong);
    text-decoration: underline;
}

/* ---------- Table footer ---------- */

.urm-table-foot[b-4wwamzhymd] {
    background-color: var(--urm-foot-bg);
    border-top: 1px solid var(--urm-border);
    padding: 1rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    font-size: 0.75rem;
    color: var(--urm-muted);
}

.urm-foot-left[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.urm-foot-left > label[b-4wwamzhymd] {
    margin: 0;
    font-weight: 500;
    color: var(--urm-muted);
    white-space: nowrap;
}

.urm-foot-strong[b-4wwamzhymd] {
    font-weight: 500;
    color: var(--urm-text-2);
}

.urm-foot-divider[b-4wwamzhymd] {
    width: 1px;
    height: 1rem;
    background-color: var(--urm-border);
    margin: 0 0.25rem;
}

.urm-foot-pager[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.urm-pager-btn[b-4wwamzhymd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.9rem;
    padding: 0.375rem 0.625rem;
    background-color: var(--urm-pager-bg);
    border: 1px solid var(--urm-pager-border);
    border-radius: 0.375rem;
    color: var(--urm-pager-color);
    font-size: 0.75rem;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.urm-pager-btn:hover:not(:disabled):not(.urm-pager-btn--active)[b-4wwamzhymd] {
    background-color: var(--urm-hover-bg);
}

.urm-pager-btn--active[b-4wwamzhymd] {
    background-color: var(--urm-brand-600);
    border-color: var(--urm-brand-600);
    color: #fff;
}

.urm-pager-btn:disabled[b-4wwamzhymd] {
    opacity: 0.4;
    cursor: not-allowed;
}

.urm-pager-btn i[b-4wwamzhymd] {
    font-size: 0.625rem;
}

.urm-pager-ellipsis[b-4wwamzhymd] {
    padding: 0.375rem 0.125rem;
    color: var(--urm-faint);
    font-size: 0.75rem;
    user-select: none;
}

/* ---------- Slide-over panel content ---------- */

.dom-panel[b-4wwamzhymd] {
    display: flex;
    flex-direction: column;
    gap: 1.125rem;
    color: var(--urm-text);
}

.dom-panel-intro[b-4wwamzhymd] {
    font-size: 0.75rem;
    line-height: 1.5;
    color: var(--urm-muted);
    margin: 0;
}

.urm-field[b-4wwamzhymd] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.urm-field > label[b-4wwamzhymd] {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--urm-text-3);
    margin: 0;
}

.urm-label-soft[b-4wwamzhymd] {
    font-size: 0.6875rem;
    line-height: 1.45;
    color: var(--urm-faint);
}

.urm-label-soft strong[b-4wwamzhymd] {
    color: var(--urm-text-2);
}

.urm-required[b-4wwamzhymd] {
    color: #e11d48;
}

.urm-field-error[b-4wwamzhymd] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: #e11d48;
}

/* "@" + domain input */
.dom-at-input[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.dom-at-input:focus-within[b-4wwamzhymd] {
    border-color: var(--urm-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.dom-at-prefix[b-4wwamzhymd] {
    padding: 0 0 0 0.875rem;
    font-size: 0.875rem;
    color: var(--urm-faint);
    user-select: none;
}

.dom-at-input > input[b-4wwamzhymd] {
    flex: 1;
    min-width: 0;
    background: transparent;
    border: none;
    outline: none;
    padding: 0.625rem 0.875rem 0.625rem 0.25rem;
    font-size: 0.875rem;
    color: var(--urm-text-2);
}

.dom-at-input > input[b-4wwamzhymd]::placeholder {
    color: var(--urm-placeholder);
}

.urm-field .urm-input--invalid[b-4wwamzhymd],
.urm-field .urm-input--invalid:focus-within[b-4wwamzhymd] {
    border-color: #e11d48;
}

.urm-field .urm-input--invalid:focus-within[b-4wwamzhymd] {
    box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.15);
}

/* Status tiles */

.dom-status-options[b-4wwamzhymd] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
}

.dom-status-option[b-4wwamzhymd] {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 0.5rem;
    align-items: center;
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--urm-field-border);
    border-radius: 0.625rem;
    background-color: var(--urm-field-bg);
    cursor: pointer;
    margin: 0;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.dom-status-option:hover[b-4wwamzhymd] {
    background-color: var(--urm-hover-bg);
}

.dom-status-option > input[b-4wwamzhymd] {
    grid-row: span 2;
    margin: 0;
    width: 1rem;
    height: 1rem;
    cursor: pointer;
}

.dom-status-option-title[b-4wwamzhymd] {
    font-size: 0.75rem;
    font-weight: 700;
}

.dom-status-option-sub[b-4wwamzhymd] {
    grid-column: 2;
    font-size: 0.625rem;
    color: var(--urm-muted);
}

.dom-status-option--emerald > input[b-4wwamzhymd] { accent-color: #10b981; }
.dom-status-option--amber > input[b-4wwamzhymd]   { accent-color: #f59e0b; }
.dom-status-option--rose > input[b-4wwamzhymd]    { accent-color: #e11d48; }

.dom-status-option--emerald .dom-status-option-title[b-4wwamzhymd] { color: var(--urm-emerald-text); }
.dom-status-option--amber .dom-status-option-title[b-4wwamzhymd]   { color: var(--urm-amber-text); }
.dom-status-option--rose .dom-status-option-title[b-4wwamzhymd]    { color: var(--urm-rose-text); }

.dom-status-option--selected.dom-status-option--emerald[b-4wwamzhymd] { background-color: var(--dom-emerald-bg); border-color: var(--dom-emerald-border); }
.dom-status-option--selected.dom-status-option--amber[b-4wwamzhymd]   { background-color: var(--dom-amber-bg);   border-color: var(--dom-amber-border); }
.dom-status-option--selected.dom-status-option--rose[b-4wwamzhymd]    { background-color: var(--dom-rose-bg);    border-color: var(--dom-rose-border); }

/* Access request details */

.dom-request-card[b-4wwamzhymd] {
    background-color: var(--urm-tile-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.75rem;
    padding: 0.875rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.urm-meta-label[b-4wwamzhymd] {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--urm-faint);
    margin: 0 0 0.25rem;
}

.urm-meta-label i[b-4wwamzhymd] {
    color: var(--urm-brand-icon);
    margin-right: 0.25rem;
}

.dom-request-who[b-4wwamzhymd],
.dom-request-when[b-4wwamzhymd] {
    font-size: 0.75rem;
    color: var(--urm-text-3);
    margin: 0;
}

.dom-request-who strong[b-4wwamzhymd] {
    color: var(--urm-heading);
}

.dom-request-note[b-4wwamzhymd] {
    margin: 0.5rem 0 0;
    padding: 0.5rem 0.75rem;
    border-left: 3px solid var(--urm-brand);
    background-color: var(--urm-panel);
    border-radius: 0 0.375rem 0.375rem 0;
    font-size: 0.75rem;
    font-style: italic;
    color: var(--urm-text-2);
    white-space: pre-line;
}

.dom-reviewed[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.6875rem;
    color: var(--urm-muted);
    margin: 0;
}

.dom-reviewed i[b-4wwamzhymd] {
    color: var(--urm-brand-icon);
}

/* Notes */

.urm-warn-note[b-4wwamzhymd],
.dom-danger-note[b-4wwamzhymd] {
    display: flex;
    gap: 0.625rem;
    font-size: 0.75rem;
    line-height: 1.5;
    border: 1px solid;
    border-radius: 0.5rem;
    padding: 0.75rem;
}

.urm-warn-note[b-4wwamzhymd] {
    background-color: var(--urm-warn-bg);
    border-color: var(--urm-warn-border);
    color: var(--urm-warn-color);
}

.dom-danger-note[b-4wwamzhymd] {
    background-color: var(--dom-rose-bg);
    border-color: var(--dom-rose-border);
    color: var(--dom-rose-ink);
}

.urm-warn-note > i[b-4wwamzhymd],
.dom-danger-note > i[b-4wwamzhymd] {
    font-size: 1rem;
    flex-shrink: 0;
}

/* What a lock-out does, spelled out before it is confirmed */
.dom-consequences[b-4wwamzhymd] {
    list-style: none;
    margin: 0;
    padding: 0.875rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    background-color: var(--urm-tile-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.75rem;
    font-size: 0.75rem;
    line-height: 1.45;
    color: var(--urm-text-2);
}

.dom-consequences li[b-4wwamzhymd] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

.dom-consequences i[b-4wwamzhymd] {
    font-size: 0.9375rem;
    color: var(--urm-muted);
    flex-shrink: 0;
    margin-top: 0.0625rem;
}

/* Domains in use */

.dom-discovery-row[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    background-color: var(--urm-tile-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.75rem;
}

.dom-discovery-main[b-4wwamzhymd] {
    flex: 1;
    min-width: 0;
}

.dom-discovery-domain[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--urm-heading);
}

.dom-discovery-meta[b-4wwamzhymd] {
    font-size: 0.6875rem;
    color: var(--urm-muted);
    margin-top: 0.125rem;
}

.dom-discovery-actions[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-shrink: 0;
}

/* "33 accounts" in a domains-in-use row — opens the list of them */
.dom-meta-link[b-4wwamzhymd] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    font-weight: 600;
    color: var(--urm-brand-strong);
    cursor: pointer;
}

.dom-meta-link:hover[b-4wwamzhymd],
.dom-meta-link:focus-visible[b-4wwamzhymd] {
    text-decoration: underline;
}

/* ---------- Accounts on a domain ---------- */

.dom-chips[b-4wwamzhymd] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.dom-chip[b-4wwamzhymd] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.625rem;
    border: 1px solid var(--urm-field-border);
    border-radius: 9999px;
    background-color: var(--urm-field-bg);
    color: var(--urm-text-3);
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.dom-chip:hover[b-4wwamzhymd] {
    background-color: var(--urm-hover-bg);
}

.dom-chip--active[b-4wwamzhymd] {
    background-color: rgba(20, 184, 166, 0.1);
    border-color: rgba(20, 184, 166, 0.35);
    color: var(--urm-brand-strong);
}

.dom-chip-count[b-4wwamzhymd] {
    padding: 0 0.375rem;
    border-radius: 9999px;
    background-color: var(--urm-chip-bg);
    color: var(--urm-muted);
    font-size: 0.6875rem;
}

.dom-chip--active .dom-chip-count[b-4wwamzhymd] {
    background-color: rgba(20, 184, 166, 0.15);
    color: inherit;
}

.dom-accounts[b-4wwamzhymd] {
    list-style: none;
    margin: 0;
    padding: 0;
    border: 1px solid var(--urm-field-border);
    border-radius: 0.75rem;
    overflow: hidden;
}

.dom-account[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0.875rem;
    background-color: var(--urm-panel);
    border-bottom: 1px solid var(--urm-border-soft);
}

.dom-account:last-child[b-4wwamzhymd] {
    border-bottom: none;
}

.dom-account-avatar[b-4wwamzhymd] {
    width: 2.25rem;
    height: 2.25rem;
    font-size: 0.6875rem;
}

.dom-account-main[b-4wwamzhymd] {
    flex: 1;
    min-width: 0;
}

.dom-account-name[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--urm-heading);
}

.dom-account-email[b-4wwamzhymd] {
    font-size: 0.75rem;
    color: var(--urm-text-3);
    overflow-wrap: anywhere;
}

.dom-account-meta[b-4wwamzhymd] {
    margin-top: 0.125rem;
    font-size: 0.6875rem;
    color: var(--urm-faint);
}

.dom-account-status[b-4wwamzhymd] {
    flex-shrink: 0;
    padding: 0.125rem 0.5rem;
    border: 1px solid;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 600;
}

.dom-account-status--active[b-4wwamzhymd]  { background-color: rgba(16, 185, 129, 0.1); color: var(--urm-emerald-text); border-color: rgba(16, 185, 129, 0.2); }
.dom-account-status--pending[b-4wwamzhymd] { background-color: rgba(245, 158, 11, 0.1); color: var(--urm-amber-text);   border-color: rgba(245, 158, 11, 0.25); }
.dom-account-status--left[b-4wwamzhymd]    { background-color: var(--urm-chip-bg);      color: var(--urm-text-3);      border-color: var(--urm-chip-border); }

.dom-flag--brand[b-4wwamzhymd] {
    background-color: rgba(20, 184, 166, 0.1);
    color: var(--urm-brand-strong);
    border-color: rgba(20, 184, 166, 0.3);
}

/* ---------- Toasts ---------- */

.urm-toasts[b-4wwamzhymd] {
    position: fixed;
    bottom: 1.5rem;
    right: 1.5rem;
    z-index: 1060;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    pointer-events: none;
}

.urm-toast[b-4wwamzhymd] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: 0.5rem;
    border: 1px solid;
    box-shadow: var(--urm-toast-shadow);
    color: var(--urm-toast-text);
    font-size: 0.75rem;
    font-weight: 600;
    pointer-events: auto;
    animation: urm-toast-in-b-4wwamzhymd 0.3s ease forwards;
    max-width: 24rem;
}

.urm-toast--closing[b-4wwamzhymd] {
    transition: opacity 0.3s ease, transform 0.3s ease;
    opacity: 0;
    transform: translateY(0.5rem);
}

@keyframes urm-toast-in-b-4wwamzhymd {
    from { opacity: 0; transform: translateY(0.5rem); }
    to   { opacity: 1; transform: translateY(0); }
}

.urm-toast--success[b-4wwamzhymd] { background-color: var(--urm-toast-success-bg); border-color: var(--urm-toast-success-border); }
.urm-toast--error[b-4wwamzhymd]   { background-color: var(--urm-toast-error-bg);   border-color: var(--urm-toast-error-border); }
.urm-toast--warning[b-4wwamzhymd] { background-color: var(--urm-toast-warning-bg); border-color: var(--urm-toast-warning-border); }

.urm-toast--success > i[b-4wwamzhymd] { color: var(--urm-emerald-text); }
.urm-toast--error > i[b-4wwamzhymd]   { color: var(--urm-rose-text); }
.urm-toast--warning > i[b-4wwamzhymd] { color: var(--urm-amber-text); }

.urm-toast > button[b-4wwamzhymd] {
    background: none;
    border: none;
    padding: 0;
    margin-left: 1rem;
    color: var(--urm-muted);
    font-size: 0.625rem;
    cursor: pointer;
}

.urm-toast > button:hover[b-4wwamzhymd] {
    color: var(--urm-heading);
}

/* ---------- Misc ---------- */

.urm-spin[b-4wwamzhymd] {
    display: inline-block;
    animation: urm-spin-b-4wwamzhymd 0.8s linear infinite;
}

@keyframes urm-spin-b-4wwamzhymd {
    to { transform: rotate(360deg); }
}

/* ---------- Responsive ---------- */

@media (max-width: 1200px) {
    .urm-stats[b-4wwamzhymd] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .urm-stats[b-4wwamzhymd] {
        grid-template-columns: 1fr;
    }

    .urm-toolbar-filters[b-4wwamzhymd] {
        flex-direction: column;
        align-items: stretch;
    }

    .urm-select[b-4wwamzhymd],
    .urm-select--wide[b-4wwamzhymd] {
        width: 100%;
    }

    .dom-attention-item[b-4wwamzhymd] {
        flex-wrap: wrap;
    }

    .dom-status-options[b-4wwamzhymd] {
        grid-template-columns: 1fr;
    }

    .dom-discovery-row[b-4wwamzhymd] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Management/FeatureCatalogue.razor.rz.scp.css */
/* ============================================================
   Features — the SuperAdmin catalogue of platform features. Reuses
   the /domains and /users control-centre look: the urm- rules mirror
   those pages so all three read the same; fm- rules are this page's
   own. Theme-aware: light by default, dark via html[data-bs-theme="dark"].
   ============================================================ */

/* ---------- Tokens: light (default) ---------- */
/* ---------- Tokens: light (default) ---------- */

.urm-page[b-h1i2vj5ez5],
.fm-panel[b-h1i2vj5ez5],
.urm-toasts[b-h1i2vj5ez5] {
    --urm-page-bg: transparent;
    --urm-page-border: transparent;
    --urm-page-pad: 0;
    --urm-panel: #ffffff;
    --urm-border: #e2e8f0;
    --urm-border-soft: rgba(226, 232, 240, 0.7);
    --urm-chip-bg: #f1f5f9;
    --urm-chip-border: #e2e8f0;
    --urm-chip-hover: #e2e8f0;
    --urm-thead-bg: var(--ins-topbar-bg);
    --urm-row-hover: #f8fafc;
    --urm-selected-bg: rgba(20, 184, 166, 0.07);
    --urm-foot-bg: #f8fafc;
    --urm-hover-bg: #f1f5f9;
    --urm-header-pad: 1.5rem 0 0;

    --urm-heading: #0f172a;
    --urm-text: #1e293b;
    --urm-text-2: #334155;
    --urm-text-3: #475569;
    --urm-muted: #64748b;
    --urm-faint: #94a3b8;

    --urm-brand: #14b8a6;
    --urm-brand-600: #0d9488;
    --urm-brand-strong: #0d9488;
    --urm-brand-icon: #0d9488;

    --urm-field-bg: #ffffff;
    --urm-field-border: #e2e8f0;
    --urm-field-border-hover: #cbd5e1;
    --urm-placeholder: #94a3b8;
    --urm-tile-bg: #f8fafc;

    --urm-avatar-bg: #f1f5f9;
    --urm-avatar-border: #e2e8f0;
    --urm-avatar-color: #475569;
    --urm-avatar-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.06);

    --urm-emerald-text: #059669;
    --urm-cyan-text: #0891b2;
    --urm-amber-text: #d97706;
    --urm-rose-text: #e11d48;
    --urm-sky-text: #0284c7;

    --urm-org-rose: #e11d48;
    --urm-org-indigo: #4f46e5;
    --urm-org-amber: #b45309;
    --urm-org-pink: #db2777;
    --urm-org-cyan: #0e7490;
    --urm-org-emerald: #059669;

    --urm-warn-bg: #fffbeb;
    --urm-warn-border: #fde68a;
    --urm-warn-color: #92400e;

    --urm-pager-bg: #ffffff;
    --urm-pager-border: #e2e8f0;
    --urm-pager-color: #475569;

    --urm-toast-text: #1e293b;
    --urm-toast-success-bg: #ecfdf5;
    --urm-toast-success-border: #a7f3d0;
    --urm-toast-error-bg: #fef2f2;
    --urm-toast-error-border: #fecaca;
    --urm-toast-warning-bg: #fffbeb;
    --urm-toast-warning-border: #fde68a;

    --urm-card-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);
    --urm-toast-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.15);

    /* tints for the status tiles and notices */
    --fm-emerald-bg: #ecfdf5;
    --fm-emerald-border: #a7f3d0;
    --fm-amber-bg: #fffbeb;
    --fm-amber-border: #fde68a;
    --fm-amber-ink: #92400e;
    --fm-rose-bg: #fff1f2;
    --fm-rose-border: #fecdd3;
    --fm-rose-ink: #9f1239;
    --fm-sky-bg: #f0f9ff;
    --fm-sky-border: #bae6fd;
    --fm-sky-ink: #075985;

    font-family: "Inter", var(--ins-body-font-family, sans-serif);
}

/* ---------- Tokens: dark ---------- */

[data-bs-theme="dark"] .urm-page[b-h1i2vj5ez5],
[data-bs-theme="dark"] .fm-panel[b-h1i2vj5ez5],
[data-bs-theme="dark"] .urm-toasts[b-h1i2vj5ez5] {
    --urm-page-bg: #0b0f19;
    --urm-page-border: #1e293b;
    --urm-page-pad: 1.5rem;
    --urm-panel: #131926;
    --urm-border: #1e293b;
    --urm-border-soft: rgba(30, 41, 59, 0.6);
    --urm-chip-bg: #1e293b;
    --urm-chip-border: #334155;
    --urm-chip-hover: #334155;
    --urm-thead-bg: var(--ins-topbar-bg);
    --urm-row-hover: rgba(30, 41, 59, 0.2);
    --urm-selected-bg: rgba(20, 184, 166, 0.05);
    --urm-foot-bg: rgba(30, 41, 59, 0.2);
    --urm-hover-bg: rgba(30, 41, 59, 0.4);
    --urm-header-pad: 0;

    --urm-heading: #ffffff;
    --urm-text: #f1f5f9;
    --urm-text-2: #e2e8f0;
    --urm-text-3: #cbd5e1;
    --urm-muted: #94a3b8;
    --urm-faint: #64748b;

    --urm-brand-strong: #2dd4bf;
    --urm-brand-icon: #14b8a6;

    --urm-field-bg: #0b0f19;
    --urm-field-border: #1e293b;
    --urm-field-border-hover: #334155;
    --urm-placeholder: #64748b;
    --urm-tile-bg: #0b0f19;

    --urm-avatar-bg: #1e293b;
    --urm-avatar-border: rgba(51, 65, 85, 0.8);
    --urm-avatar-color: #cbd5e1;
    --urm-avatar-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);

    --urm-emerald-text: #34d399;
    --urm-cyan-text: #22d3ee;
    --urm-amber-text: #fbbf24;
    --urm-rose-text: #fb7185;
    --urm-sky-text: #38bdf8;

    --urm-org-rose: #fb7185;
    --urm-org-indigo: #818cf8;
    --urm-org-amber: #fbbf24;
    --urm-org-pink: #f472b6;
    --urm-org-cyan: #22d3ee;
    --urm-org-emerald: #34d399;

    --urm-warn-bg: rgba(245, 158, 11, 0.1);
    --urm-warn-border: rgba(245, 158, 11, 0.2);
    --urm-warn-color: #fde68a;

    --urm-pager-bg: rgba(30, 41, 59, 0.5);
    --urm-pager-border: rgba(51, 65, 85, 0.5);
    --urm-pager-color: #cbd5e1;

    --urm-toast-text: #f1f5f9;
    --urm-toast-success-bg: #0c1a16;
    --urm-toast-success-border: rgba(16, 185, 129, 0.2);
    --urm-toast-error-bg: #1d1115;
    --urm-toast-error-border: rgba(244, 63, 94, 0.2);
    --urm-toast-warning-bg: #1c1811;
    --urm-toast-warning-border: rgba(245, 158, 11, 0.2);

    --urm-card-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.25);
    --urm-toast-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.4);

    --fm-emerald-bg: rgba(16, 185, 129, 0.1);
    --fm-emerald-border: rgba(16, 185, 129, 0.25);
    --fm-amber-bg: rgba(245, 158, 11, 0.1);
    --fm-amber-border: rgba(245, 158, 11, 0.25);
    --fm-amber-ink: #fde68a;
    --fm-rose-bg: rgba(244, 63, 94, 0.1);
    --fm-rose-border: rgba(244, 63, 94, 0.25);
    --fm-rose-ink: #fecdd3;
    --fm-sky-bg: rgba(14, 165, 233, 0.1);
    --fm-sky-border: rgba(14, 165, 233, 0.25);
    --fm-sky-ink: #bae6fd;
}

/* ---------- Workspace surface & header ---------- */

.urm-page[b-h1i2vj5ez5] {
    background-color: var(--urm-page-bg);
    border: 1px solid var(--urm-page-border);
    border-radius: 12px;
    padding: var(--urm-page-pad);
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    min-height: calc(100vh - var(--ins-topbar-height, 70px) - 8rem);
    color: var(--urm-text);
}

.urm-header[b-h1i2vj5ez5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: var(--urm-header-pad);
    min-height: 60px;
}

.urm-header-title[b-h1i2vj5ez5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--urm-heading);
    margin: 0;
}

.urm-header-chip[b-h1i2vj5ez5] {
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--urm-muted);
    background-color: var(--urm-chip-bg);
    border: 1px solid var(--urm-chip-border);
    border-radius: 0.25rem;
    padding: 0.125rem 0.5rem;
}

.urm-header-sub[b-h1i2vj5ez5] {
    font-size: 0.75rem;
    color: var(--urm-muted);
    margin: 0.25rem 0 0;
}

.fm-text-emerald[b-h1i2vj5ez5] { color: var(--urm-emerald-text); }
.fm-text-amber[b-h1i2vj5ez5]   { color: var(--urm-amber-text); }

/* ---------- Toolbar ---------- */

.urm-toolbar[b-h1i2vj5ez5] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    box-shadow: var(--urm-card-shadow);
}

.urm-toolbar-filters[b-h1i2vj5ez5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    flex-wrap: wrap;
    min-width: 0;
}

.urm-toolbar-actions[b-h1i2vj5ez5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.urm-search[b-h1i2vj5ez5] {
    position: relative;
    flex: 1;
    min-width: 220px;
}

.urm-search > i[b-h1i2vj5ez5] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--urm-muted);
    font-size: 0.875rem;
    pointer-events: none;
}

.urm-search > input[b-h1i2vj5ez5] {
    width: 100%;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 1rem 0.625rem 2.5rem;
    font-size: 0.875rem;
    color: var(--urm-text-2);
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.urm-search > input[b-h1i2vj5ez5]::placeholder {
    color: var(--urm-placeholder);
}

.urm-search > input:hover[b-h1i2vj5ez5] {
    border-color: var(--urm-field-border-hover);
}

.urm-search > input:focus[b-h1i2vj5ez5] {
    border-color: var(--urm-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.urm-select[b-h1i2vj5ez5] {
    width: 12rem;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 0.75rem;
    font-size: 0.875rem;
    color: var(--urm-text-3);
    outline: none;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.urm-select:hover[b-h1i2vj5ez5] {
    border-color: var(--urm-field-border-hover);
}

.urm-select:focus[b-h1i2vj5ez5] {
    border-color: var(--urm-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.urm-select > option[b-h1i2vj5ez5] {
    background-color: var(--urm-panel);
    color: var(--urm-text-2);
}

.urm-select--full[b-h1i2vj5ez5] { width: 100%; }

/* Organisation names run long (NHS trusts) */
.urm-select--wide[b-h1i2vj5ez5] {
    width: 18rem;
    max-width: 100%;
}

.urm-select--sm[b-h1i2vj5ez5] {
    width: auto;
    padding: 0.375rem 0.625rem;
    font-size: 0.75rem;
}

.fm-clear[b-h1i2vj5ez5] {
    background: none;
    border: none;
    border-radius: 0.5rem;
    padding: 0.625rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--urm-muted);
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.fm-clear:hover[b-h1i2vj5ez5] {
    background-color: var(--urm-hover-bg);
    color: var(--urm-heading);
}

/* ---------- Buttons ---------- */

.urm-btn[b-h1i2vj5ez5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    padding: 0.625rem 1rem;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease, transform 0.1s ease, box-shadow 0.15s ease;
    white-space: nowrap;
}

.urm-btn:active:not(:disabled)[b-h1i2vj5ez5] {
    transform: scale(0.95);
}

.urm-btn:focus-visible[b-h1i2vj5ez5] {
    outline: 2px solid var(--urm-brand);
    outline-offset: 2px;
}

.urm-btn:disabled[b-h1i2vj5ez5] {
    opacity: 0.6;
    cursor: not-allowed;
}

.urm-btn--primary[b-h1i2vj5ez5] {
    background-color: var(--urm-brand-600);
    color: #fff;
    box-shadow: 0 4px 6px -1px rgba(13, 148, 136, 0.2);
}

.urm-btn--primary:hover:not(:disabled)[b-h1i2vj5ez5] {
    background-color: var(--urm-brand);
}

.urm-btn--dark[b-h1i2vj5ez5] {
    background-color: var(--urm-chip-bg);
    border-color: var(--urm-chip-border);
    color: var(--urm-text-3);
}

.urm-btn--dark:hover:not(:disabled)[b-h1i2vj5ez5] {
    background-color: var(--urm-chip-hover);
}

.urm-btn--rose[b-h1i2vj5ez5] {
    background-color: #e11d48;
    color: #fff;
    box-shadow: 0 4px 6px -1px rgba(225, 29, 72, 0.2);
}

.urm-btn--rose:hover:not(:disabled)[b-h1i2vj5ez5] {
    background-color: #f43f5e;
}

.urm-btn--sm[b-h1i2vj5ez5] {
    padding: 0.4375rem 0.875rem;
    font-size: 0.75rem;
    font-weight: 700;
}

.urm-btn--ghost-danger[b-h1i2vj5ez5] {
    background-color: transparent;
    border-color: rgba(225, 29, 72, 0.35);
    color: var(--urm-rose-text);
}

.urm-btn--ghost-danger:hover:not(:disabled)[b-h1i2vj5ez5] {
    background-color: rgba(225, 29, 72, 0.08);
}

/* A panel footer's secondary action, pushed to the left edge away from Cancel / Save */
.fm-footer-start[b-h1i2vj5ez5] {
    margin-right: auto;
}

/* ---------- Stat cards ---------- */

.urm-stats[b-h1i2vj5ez5] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.urm-stat-card[b-h1i2vj5ez5] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    padding: 0.55rem 0.85rem;
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    justify-content: flex-end;
    gap: 0.65rem;
    box-shadow: var(--urm-card-shadow);
}

.urm-stat-label[b-h1i2vj5ez5] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--urm-muted);
    margin: 0;
}

.urm-stat-value[b-h1i2vj5ez5] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--urm-heading);
    margin: 0.1rem 0 0;
}

.fm-stat-hint[b-h1i2vj5ez5] {
    font-size: 0.6875rem;
    font-weight: 500;
    color: var(--urm-muted);
}

.fm-stat-pill[b-h1i2vj5ez5] {
    font-size: 0.625rem;
    font-weight: 600;
    color: var(--fm-amber-ink);
    background-color: var(--fm-amber-bg);
    border-radius: 0.25rem;
    padding: 0.0625rem 0.375rem;
}

.urm-stat-icon[b-h1i2vj5ez5] {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
    border: 1px solid;
}

.urm-stat-icon--emerald[b-h1i2vj5ez5] { background-color: rgba(16, 185, 129, 0.1); border-color: rgba(16, 185, 129, 0.2); color: var(--urm-emerald-text); }
.urm-stat-icon--cyan[b-h1i2vj5ez5]    { background-color: rgba(6, 182, 212, 0.1);  border-color: rgba(6, 182, 212, 0.2);  color: var(--urm-cyan-text); }
.fm-stat-icon--amber[b-h1i2vj5ez5]   { background-color: rgba(245, 158, 11, 0.1); border-color: rgba(245, 158, 11, 0.2); color: var(--urm-amber-text); }
.fm-stat-icon--slate[b-h1i2vj5ez5]   { background-color: var(--urm-chip-bg);      border-color: var(--urm-chip-border);    color: var(--urm-text-3); }

/* ---------- Table card ---------- */

.urm-table-card[b-h1i2vj5ez5] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: var(--urm-card-shadow);
    display: flex;
    flex-direction: column;
}

.urm-table-scroll[b-h1i2vj5ez5] {
    overflow-x: auto;
    width: 100%;
}

.urm-table[b-h1i2vj5ez5] {
    width: 100%;
    text-align: left;
    border-collapse: collapse;
}

.urm-table thead tr[b-h1i2vj5ez5] {
    /* background (not background-color): the topbar colour can be a gradient */
    background: var(--urm-thead-bg);
    border-bottom: none;
}

/* Seven columns: a little less side padding than /users keeps the register inside a 1440px
   screen without the table scrolling sideways. */
.urm-table th[b-h1i2vj5ez5] {
    padding: 1rem 0.875rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ins-topbar-item-color);
    white-space: nowrap;
}

.urm-th-actions[b-h1i2vj5ez5] {
    width: 1%;
    text-align: right;
}

.urm-table tbody tr[b-h1i2vj5ez5] {
    border-bottom: 1px solid var(--urm-border-soft);
    transition: background-color 0.15s ease;
}

.urm-table tbody tr:hover[b-h1i2vj5ez5] {
    background-color: var(--urm-row-hover);
}

.urm-row--selected[b-h1i2vj5ez5] {
    background-color: var(--urm-selected-bg);
    box-shadow: inset 2px 0 0 var(--urm-brand);
}

.urm-table td[b-h1i2vj5ez5] {
    padding: 0.75rem 0.875rem;
    vertical-align: middle;
    font-size: 0.875rem;
    color: var(--urm-text-2);
}

.urm-user-cell[b-h1i2vj5ez5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.urm-avatar[b-h1i2vj5ez5] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.5rem;
    background-color: var(--urm-avatar-bg);
    border: 1px solid var(--urm-avatar-border);
    color: var(--urm-avatar-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    box-shadow: var(--urm-avatar-shadow);
    flex-shrink: 0;
}

/* Status pill */

.urm-status-badge[b-h1i2vj5ez5] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.025em;
    white-space: nowrap;
    border: 1px solid;
}

.urm-status-dot[b-h1i2vj5ez5] {
    width: 0.375rem;
    height: 0.375rem;
    border-radius: 9999px;
    margin-right: 0.375rem;
    background-color: currentColor;
}

.urm-status-badge--active[b-h1i2vj5ez5]  { background-color: rgba(16, 185, 129, 0.1); color: var(--urm-emerald-text); border-color: rgba(16, 185, 129, 0.2); }
.fm-status-badge--pending[b-h1i2vj5ez5] { background-color: rgba(245, 158, 11, 0.1); color: var(--urm-amber-text);   border-color: rgba(245, 158, 11, 0.25); }
.urm-status-badge--deleted[b-h1i2vj5ez5] { background-color: rgba(225, 29, 72, 0.08); color: var(--urm-rose-text);    border-color: rgba(225, 29, 72, 0.25); }

/* Row actions */

.urm-td-actions[b-h1i2vj5ez5] {
    text-align: right;
}

.urm-actions-group[b-h1i2vj5ez5] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    justify-content: flex-end;
}

.urm-icon-btn[b-h1i2vj5ez5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.4375rem 0.5rem;
    background: transparent;
    border: 1px solid var(--urm-border);
    border-radius: 0.5rem;
    color: var(--urm-brand-strong);
    font-size: 0.75rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.urm-icon-btn:hover:not(:disabled)[b-h1i2vj5ez5] {
    background-color: var(--urm-hover-bg);
    border-color: var(--urm-chip-border);
}

.urm-icon-btn:disabled[b-h1i2vj5ez5] {
    opacity: 0.5;
    cursor: not-allowed;
}

.urm-icon-btn--danger[b-h1i2vj5ez5] {
    color: #e11d48;
}

.urm-icon-btn--danger:hover:not(:disabled)[b-h1i2vj5ez5] {
    background-color: rgba(225, 29, 72, 0.1);
    border-color: rgba(225, 29, 72, 0.35);
}

.fm-icon-btn--approve[b-h1i2vj5ez5] {
    color: var(--urm-emerald-text);
    background-color: rgba(16, 185, 129, 0.08);
    border-color: rgba(16, 185, 129, 0.3);
}

.fm-icon-btn--approve:hover:not(:disabled)[b-h1i2vj5ez5] {
    background-color: rgba(16, 185, 129, 0.16);
    border-color: rgba(16, 185, 129, 0.45);
}

/* Lock out / reject — tinted, so it reads apart from the plain-outline remove button beside it */
.fm-icon-btn--lock[b-h1i2vj5ez5] {
    color: var(--urm-rose-text);
    background-color: rgba(225, 29, 72, 0.06);
    border-color: rgba(225, 29, 72, 0.3);
}

.fm-icon-btn--lock:hover:not(:disabled)[b-h1i2vj5ez5] {
    background-color: rgba(225, 29, 72, 0.14);
    border-color: rgba(225, 29, 72, 0.45);
}

/* ---------- Empty / loading states ---------- */

.urm-empty[b-h1i2vj5ez5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1.5rem;
    text-align: center;
    gap: 0.25rem;
}

.urm-empty-icon[b-h1i2vj5ez5] {
    width: 4rem;
    height: 4rem;
    border-radius: 9999px;
    background-color: var(--urm-chip-bg);
    color: var(--urm-faint);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.urm-empty-title[b-h1i2vj5ez5] {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--urm-text);
    margin: 0;
}

.urm-empty-sub[b-h1i2vj5ez5] {
    font-size: 0.875rem;
    color: var(--urm-muted);
    max-width: 30rem;
    margin: 0;
}

.urm-empty-reset[b-h1i2vj5ez5] {
    background: none;
    border: none;
    padding: 0;
    margin-top: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--urm-brand-icon);
    cursor: pointer;
}

.urm-empty-reset:hover[b-h1i2vj5ez5] {
    color: var(--urm-brand-strong);
    text-decoration: underline;
}

/* ---------- Slide-over panel content ---------- */

.fm-panel[b-h1i2vj5ez5] {
    display: flex;
    flex-direction: column;
    gap: 1.125rem;
    color: var(--urm-text);
}

.fm-panel-intro[b-h1i2vj5ez5] {
    font-size: 0.75rem;
    line-height: 1.5;
    color: var(--urm-muted);
    margin: 0;
}

.urm-field[b-h1i2vj5ez5] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.urm-field > label[b-h1i2vj5ez5] {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--urm-text-3);
    margin: 0;
}

.urm-label-soft[b-h1i2vj5ez5] {
    font-size: 0.6875rem;
    line-height: 1.45;
    color: var(--urm-faint);
}

.urm-label-soft strong[b-h1i2vj5ez5] {
    color: var(--urm-text-2);
}

.urm-required[b-h1i2vj5ez5] {
    color: #e11d48;
}

.urm-field-error[b-h1i2vj5ez5] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: #e11d48;
}

/* "@" + domain input */
.urm-field .urm-input--invalid[b-h1i2vj5ez5],
.urm-field .urm-input--invalid:focus-within[b-h1i2vj5ez5] {
    border-color: #e11d48;
}

.urm-field .urm-input--invalid:focus-within[b-h1i2vj5ez5] {
    box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.15);
}

/* Notes */

.urm-warn-note[b-h1i2vj5ez5],
.fm-danger-note[b-h1i2vj5ez5] {
    display: flex;
    gap: 0.625rem;
    font-size: 0.75rem;
    line-height: 1.5;
    border: 1px solid;
    border-radius: 0.5rem;
    padding: 0.75rem;
}

.urm-warn-note[b-h1i2vj5ez5] {
    background-color: var(--urm-warn-bg);
    border-color: var(--urm-warn-border);
    color: var(--urm-warn-color);
}

.fm-danger-note[b-h1i2vj5ez5] {
    background-color: var(--fm-rose-bg);
    border-color: var(--fm-rose-border);
    color: var(--fm-rose-ink);
}

.urm-warn-note > i[b-h1i2vj5ez5],
.fm-danger-note > i[b-h1i2vj5ez5] {
    font-size: 1rem;
    flex-shrink: 0;
}

/* ---------- Toasts ---------- */

.urm-toasts[b-h1i2vj5ez5] {
    position: fixed;
    bottom: 1.5rem;
    right: 1.5rem;
    z-index: 1060;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    pointer-events: none;
}

.urm-toast[b-h1i2vj5ez5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: 0.5rem;
    border: 1px solid;
    box-shadow: var(--urm-toast-shadow);
    color: var(--urm-toast-text);
    font-size: 0.75rem;
    font-weight: 600;
    pointer-events: auto;
    animation: urm-toast-in-b-h1i2vj5ez5 0.3s ease forwards;
    max-width: 24rem;
}

.urm-toast--closing[b-h1i2vj5ez5] {
    transition: opacity 0.3s ease, transform 0.3s ease;
    opacity: 0;
    transform: translateY(0.5rem);
}

@keyframes urm-toast-in-b-h1i2vj5ez5 {
    from { opacity: 0; transform: translateY(0.5rem); }
    to   { opacity: 1; transform: translateY(0); }
}

.urm-toast--success[b-h1i2vj5ez5] { background-color: var(--urm-toast-success-bg); border-color: var(--urm-toast-success-border); }
.urm-toast--error[b-h1i2vj5ez5]   { background-color: var(--urm-toast-error-bg);   border-color: var(--urm-toast-error-border); }
.urm-toast--warning[b-h1i2vj5ez5] { background-color: var(--urm-toast-warning-bg); border-color: var(--urm-toast-warning-border); }

.urm-toast--success > i[b-h1i2vj5ez5] { color: var(--urm-emerald-text); }
.urm-toast--error > i[b-h1i2vj5ez5]   { color: var(--urm-rose-text); }
.urm-toast--warning > i[b-h1i2vj5ez5] { color: var(--urm-amber-text); }

.urm-toast > button[b-h1i2vj5ez5] {
    background: none;
    border: none;
    padding: 0;
    margin-left: 1rem;
    color: var(--urm-muted);
    font-size: 0.625rem;
    cursor: pointer;
}

.urm-toast > button:hover[b-h1i2vj5ez5] {
    color: var(--urm-heading);
}

/* ---------- Misc ---------- */

.urm-spin[b-h1i2vj5ez5] {
    display: inline-block;
    animation: urm-spin-b-h1i2vj5ez5 0.8s linear infinite;
}

@keyframes urm-spin-b-h1i2vj5ez5 {
    to { transform: rotate(360deg); }
}

/* ---------- Responsive ---------- */

@media (max-width: 1200px) {
    .urm-stats[b-h1i2vj5ez5] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .urm-stats[b-h1i2vj5ez5] {
        grid-template-columns: 1fr;
    }

    .urm-toolbar-filters[b-h1i2vj5ez5] {
        flex-direction: column;
        align-items: stretch;
    }

    .urm-select[b-h1i2vj5ez5],
    .urm-select--wide[b-h1i2vj5ez5] {
        width: 100%;
    }

    .fm-attention-item[b-h1i2vj5ez5] {
        flex-wrap: wrap;
    }

    .fm-status-options[b-h1i2vj5ez5] {
        grid-template-columns: 1fr;
    }

    .fm-discovery-row[b-h1i2vj5ez5] {
        flex-wrap: wrap;
    }
}


/* ---------- Table footer ---------- */

.urm-table-foot[b-h1i2vj5ez5] {
    background-color: var(--urm-foot-bg);
    border-top: 1px solid var(--urm-border);
    padding: 1rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    font-size: 0.75rem;
    color: var(--urm-muted);
}

.urm-foot-left[b-h1i2vj5ez5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.urm-foot-left > label[b-h1i2vj5ez5] {
    margin: 0;
    font-weight: 500;
    color: var(--urm-muted);
    white-space: nowrap;
}

.urm-foot-strong[b-h1i2vj5ez5] {
    font-weight: 500;
    color: var(--urm-text-2);
}

.urm-foot-divider[b-h1i2vj5ez5] {
    width: 1px;
    height: 1rem;
    background-color: var(--urm-border);
    margin: 0 0.25rem;
}

.urm-foot-pager[b-h1i2vj5ez5] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.urm-pager-btn[b-h1i2vj5ez5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.9rem;
    padding: 0.375rem 0.625rem;
    background-color: var(--urm-pager-bg);
    border: 1px solid var(--urm-pager-border);
    border-radius: 0.375rem;
    color: var(--urm-pager-color);
    font-size: 0.75rem;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.urm-pager-btn:hover:not(:disabled):not(.urm-pager-btn--active)[b-h1i2vj5ez5] {
    background-color: var(--urm-hover-bg);
}

.urm-pager-btn--active[b-h1i2vj5ez5] {
    background-color: var(--urm-brand-600);
    border-color: var(--urm-brand-600);
    color: #fff;
}

.urm-pager-btn:disabled[b-h1i2vj5ez5] {
    opacity: 0.4;
    cursor: not-allowed;
}

.urm-pager-btn i[b-h1i2vj5ez5] {
    font-size: 0.625rem;
}

.urm-pager-ellipsis[b-h1i2vj5ez5] {
    padding: 0.375rem 0.125rem;
    color: var(--urm-faint);
    font-size: 0.75rem;
    user-select: none;
}

/* ---------- Features table ---------- */

.fm-name-link[b-h1i2vj5ez5] {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    font-weight: 600;
    color: var(--urm-text);
    text-align: left;
    cursor: pointer;
}

.fm-name-link:hover[b-h1i2vj5ez5] {
    text-decoration: underline;
}

.fm-code[b-h1i2vj5ez5] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.75rem;
    color: var(--urm-muted);
}

.fm-desc[b-h1i2vj5ez5] {
    max-width: 38rem;
    font-size: 0.8125rem;
    line-height: 1.45;
    color: var(--urm-muted);
}

.fm-desc--empty[b-h1i2vj5ez5] {
    font-style: italic;
    opacity: 0.7;
}

.fm-chips[b-h1i2vj5ez5] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.fm-chip[b-h1i2vj5ez5] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.125rem 0.5rem;
    border-radius: 999px;
    font-size: 0.6875rem;
    font-weight: 600;
    background: var(--urm-chip-bg);
    border: 1px solid var(--urm-chip-border);
    color: var(--urm-muted);
    white-space: nowrap;
}

.fm-chip--core[b-h1i2vj5ez5] {
    background: rgba(37, 99, 235, 0.1);
    border-color: rgba(37, 99, 235, 0.25);
    color: #2563eb;
}

.fm-chip--live[b-h1i2vj5ez5] {
    background: rgba(16, 185, 129, 0.1);
    border-color: rgba(16, 185, 129, 0.25);
    color: #059669;
}

.fm-chip--roadmap[b-h1i2vj5ez5] {
    background: rgba(245, 158, 11, 0.12);
    border-color: rgba(245, 158, 11, 0.3);
    color: #b45309;
}

.urm-table .fm-th-count[b-h1i2vj5ez5],
.urm-table .fm-td-count[b-h1i2vj5ez5] {
    text-align: center;
}

.fm-count[b-h1i2vj5ez5] {
    font-weight: 700;
    color: var(--urm-text);
}

/* ---------- Panel ---------- */

.fm-panel textarea[b-h1i2vj5ez5],
.fm-panel input[type="text"][b-h1i2vj5ez5] {
    width: 100%;
    padding: 0.55rem 0.75rem;
    font-size: 0.875rem;
    color: var(--urm-text);
    background: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.5rem;
}

.fm-panel textarea[b-h1i2vj5ez5] {
    resize: vertical;
    min-height: 7rem;
    line-height: 1.5;
}

.fm-panel input[type="text"].fm-mono[b-h1i2vj5ez5] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.8125rem;
}

.fm-panel input:focus[b-h1i2vj5ez5],
.fm-panel textarea:focus[b-h1i2vj5ez5] {
    outline: none;
    border-color: #2563eb;
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2);
}

.fm-panel .urm-input--invalid[b-h1i2vj5ez5] {
    border-color: #e11d48;
}

.fm-label-row[b-h1i2vj5ez5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fm-counter[b-h1i2vj5ez5] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.6875rem;
    color: var(--urm-muted);
}

.fm-facts[b-h1i2vj5ez5] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    padding: 0.85rem;
    border: 1px solid var(--urm-border);
    border-radius: 0.6rem;
    background: var(--urm-foot-bg);
}

.fm-fact-label[b-h1i2vj5ez5] {
    margin: 0;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--urm-muted);
}

.fm-fact-value[b-h1i2vj5ez5] {
    margin: 0.15rem 0 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--urm-text);
}

.fm-panel-intro[b-h1i2vj5ez5] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.5;
    color: var(--urm-muted);
}
/* /Components/Pages/Management/FeaturePermissionsEditor.razor.rz.scp.css */
/* ============================================================
   Feature permissions — links catalogue permissions to one feature.
   The tiles match the /roles permission matrix; the rest is this
   page's own. Theme-aware through Bootstrap's body colour tokens.
   ============================================================ */

.fpe-page[b-jcc70kmtt1] {
    padding: 1.5rem 0 2rem;
}

.fpe-back[b-jcc70kmtt1] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--bs-secondary-color);
    text-decoration: none;
}

.fpe-back:hover[b-jcc70kmtt1] {
    color: var(--bs-primary);
}

/* ---------- Header ---------- */

.fpe-header[b-jcc70kmtt1] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin: 0.75rem 0 1rem;
}

.fpe-header-text[b-jcc70kmtt1] {
    min-width: 0;
    max-width: 52rem;
}

.fpe-title[b-jcc70kmtt1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: 1.5rem;
    font-weight: 700;
}

.fpe-chip[b-jcc70kmtt1] {
    padding: 0.125rem 0.5rem;
    border-radius: 0.375rem;
    border: 1px solid rgba(var(--bs-body-color-rgb), 0.15);
    background: rgba(var(--bs-body-color-rgb), 0.05);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--bs-secondary-color);
}

.fpe-sub[b-jcc70kmtt1] {
    margin: 0.35rem 0 0;
    font-size: 0.875rem;
    line-height: 1.5;
    color: var(--bs-secondary-color);
}

.fpe-actions[b-jcc70kmtt1] {
    display: flex;
    gap: 0.5rem;
}

/* ---------- Groups ---------- */

.fpe-group[b-jcc70kmtt1] {
    margin-bottom: 1.5rem;
}

.fpe-group-head[b-jcc70kmtt1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.fpe-group-title[b-jcc70kmtt1] {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--bs-secondary-color);
}

.fpe-group-line[b-jcc70kmtt1] {
    flex-grow: 1;
    border-bottom: 1px solid var(--bs-border-color);
}

.fpe-group-count[b-jcc70kmtt1] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.75rem;
    color: var(--bs-secondary-color);
}

/* ---------- Group cards (as on the role templates matrix) ---------- */

.fpe-group-card[b-jcc70kmtt1] {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    margin-bottom: 1.25rem;
    overflow: hidden;
}

.fpe-group-card-head[b-jcc70kmtt1] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.9rem 2rem;
    border-bottom: 1px solid #e9edf3;
}

.fpe-group-dot[b-jcc70kmtt1] {
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 50%;
    background: var(--ins-primary);
    flex-shrink: 0;
}

.fpe-group-dot--empty[b-jcc70kmtt1] {
    background: #cbd5e1;
}

.fpe-group-card-title[b-jcc70kmtt1] {
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--ins-heading-color, #1e293b);
}

.fpe-group-card-count[b-jcc70kmtt1] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.8125rem;
    color: var(--ins-secondary-color);
}

.fpe-group-card-actions[b-jcc70kmtt1] {
    display: flex;
    gap: 0.75rem;
    margin-left: auto;
}

.fpe-group-card-actions .btn[b-jcc70kmtt1] {
    padding: 0.15rem 1rem;
    font-size: 0.8125rem;
}

.fpe-group-card-body[b-jcc70kmtt1] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 1.1rem;
    padding: 2rem;
}

/* ---------- Tiles ---------- */

.fpe-tile[b-jcc70kmtt1] {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
    padding: 1.1rem 1.1rem 1.25rem;
    background: #fff;
    border: 1px solid #c9ced6;
    border-radius: 0.25rem;
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.fpe-tile:hover[b-jcc70kmtt1] {
    border-color: #94a3b8;
}

.fpe-tile--on[b-jcc70kmtt1],
.fpe-tile--on:hover[b-jcc70kmtt1] {
    background: #e3ebfa;
    border-color: var(--ins-primary);
}

.fpe-check[b-jcc70kmtt1] {
    width: 1.3rem;
    height: 1.3rem;
    margin-top: 0.15rem;
}

.fpe-tile-label[b-jcc70kmtt1] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #8a94a6;
}

.fpe-tile--on .fpe-tile-label[b-jcc70kmtt1] {
    color: var(--ins-heading-color, #1e293b);
}

.fpe-tile-desc[b-jcc70kmtt1] {
    margin-top: 0.2rem;
    font-size: 0.875rem;
    line-height: 1.45;
    color: #94a3b8;
}

.fpe-tile-locked[b-jcc70kmtt1] {
    margin-top: 0.15rem;
    font-size: 0.8125rem;
    font-style: italic;
    color: #94a3b8;
}

.fpe-tile-key[b-jcc70kmtt1] {
    display: block;
    margin-top: 0.3rem;
    font-size: 0.8125rem;
    color: var(--ins-primary);
}

/* Dark theme */
[data-bs-theme="dark"] .fpe-group-card[b-jcc70kmtt1],
[data-bs-theme="dark"] .fpe-tile[b-jcc70kmtt1] {
    background: #131926;
    border-color: #1e293b;
}

[data-bs-theme="dark"] .fpe-group-card-head[b-jcc70kmtt1] {
    border-bottom-color: #1e293b;
}

[data-bs-theme="dark"] .fpe-tile:hover[b-jcc70kmtt1] {
    border-color: #334155;
}

[data-bs-theme="dark"] .fpe-tile--on[b-jcc70kmtt1],
[data-bs-theme="dark"] .fpe-tile--on:hover[b-jcc70kmtt1] {
    background: rgba(var(--ins-primary-rgb), 0.15);
    border-color: var(--ins-primary);
}

[data-bs-theme="dark"] .fpe-tile--on .fpe-tile-label[b-jcc70kmtt1] {
    color: #f1f5f9;
}

/* Shown when the permission is also in other features (many-to-many) */
.fpe-also[b-jcc70kmtt1] {
    margin-top: 0.2rem;
    font-size: 10px;
    color: var(--bs-secondary-color);
}

.fpe-spin[b-jcc70kmtt1] {
    display: inline-block;
    animation: fpe-spin-b-jcc70kmtt1 0.9s linear infinite;
}

@keyframes fpe-spin-b-jcc70kmtt1 {
    to { transform: rotate(360deg); }
}

/* ---------- Toasts ---------- */

.fpe-toasts[b-jcc70kmtt1] {
    position: fixed;
    right: 1.25rem;
    bottom: 1.25rem;
    z-index: 1090;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.fpe-toast[b-jcc70kmtt1] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    max-width: 26rem;
    padding: 0.65rem 0.85rem;
    border-radius: 0.5rem;
    font-size: 0.8125rem;
    color: #fff;
    box-shadow: 0 10px 25px rgba(15, 23, 42, 0.2);
}

.fpe-toast--success[b-jcc70kmtt1] {
    background: #059669;
}

.fpe-toast--error[b-jcc70kmtt1] {
    background: #e11d48;
}

.fpe-toast button[b-jcc70kmtt1] {
    background: none;
    border: 0;
    color: inherit;
    opacity: 0.8;
    padding: 0;
}
/* /Components/Pages/Management/Homs.razor.rz.scp.css */
/* ============================================================
   Heliport Operations Manual register — the /homs design (header,
   toolbar, summary cards, manual cards) plus the right-hand panel's
   tabs, forms, sharing picker, version list and audit trail.
   Light by default; dark via [data-bs-theme="dark"] at the end.
   ============================================================ */

/* ── Page header ─────────────────────────────────────────────── */

.hgm-header[b-islgh5fuac] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 1.5rem 0 1rem;
    min-height: 60px;
}

.hgm-header-title[b-islgh5fuac] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #0f172a;
    margin: 0;
}

.hgm-header-chip[b-islgh5fuac] {
    font-size: 0.75rem;
    font-weight: 400;
    color: #64748b;
    background-color: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 0.25rem;
    padding: 0.125rem 0.5rem;
}

.hgm-header-sub[b-islgh5fuac] {
    font-size: 0.75rem;
    color: #64748b;
    margin: 0.25rem 0 0;
}

/* ── Buttons ─────────────────────────────────────────────────── */

.hgm-btn[b-islgh5fuac] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    padding: 0.55rem 1rem;
    border-radius: 0.5rem;
    border: 1px solid transparent;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.hgm-btn:focus-visible[b-islgh5fuac] { outline: none; box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.3); }
.hgm-btn:disabled[b-islgh5fuac] { opacity: 0.55; cursor: not-allowed; }

.hgm-btn--primary[b-islgh5fuac] { background-color: #0d9488; border-color: #0d9488; color: #fff; }
.hgm-btn--primary:hover:not(:disabled)[b-islgh5fuac] { background-color: #0f766e; border-color: #0f766e; }

.hgm-btn--dark[b-islgh5fuac] { background-color: #0f172a; border-color: #0f172a; color: #fff; }
.hgm-btn--dark:hover:not(:disabled)[b-islgh5fuac] { background-color: #1e293b; border-color: #1e293b; }

.hgm-btn--light[b-islgh5fuac] { background-color: #fff; border-color: #e2e8f0; color: #334155; }
.hgm-btn--light:hover:not(:disabled)[b-islgh5fuac] { background-color: #f1f5f9; border-color: #cbd5e1; }

.hgm-btn--soft[b-islgh5fuac] { background-color: rgba(13, 148, 136, 0.1); border-color: rgba(13, 148, 136, 0.25); color: #0d9488; }
.hgm-btn--soft:hover:not(:disabled)[b-islgh5fuac] { background-color: #0d9488; border-color: #0d9488; color: #fff; }

.hgm-btn--rose[b-islgh5fuac] { background-color: #e11d48; border-color: #e11d48; color: #fff; }
.hgm-btn--rose:hover:not(:disabled)[b-islgh5fuac] { background-color: #be123c; border-color: #be123c; }

.hgm-btn--ghost[b-islgh5fuac] { background-color: transparent; color: #0d9488; }
.hgm-btn--ghost:hover:not(:disabled)[b-islgh5fuac] { background-color: rgba(13, 148, 136, 0.08); }

.hgm-btn--ghost-danger[b-islgh5fuac] { background-color: transparent; color: #e11d48; }
.hgm-btn--ghost-danger:hover:not(:disabled)[b-islgh5fuac] { background-color: rgba(225, 29, 72, 0.08); }

.hgm-btn--sm[b-islgh5fuac] { padding: 0.4rem 0.75rem; font-size: 0.75rem; }
.hgm-btn--xs[b-islgh5fuac] { padding: 0.25rem 0.55rem; font-size: 0.6875rem; }

/* Pushes the panel footer's destructive action to the far left. */
.hgm-footer-start[b-islgh5fuac] { margin-right: auto; }

.hgm-icon-btn[b-islgh5fuac] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    flex-shrink: 0;
    border-radius: 0.5rem;
    border: 1px solid #e2e8f0;
    background-color: #fff;
    color: #475569;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.hgm-icon-btn:hover:not(:disabled)[b-islgh5fuac] { background-color: #f1f5f9; color: #0f172a; border-color: #cbd5e1; }
.hgm-icon-btn:disabled[b-islgh5fuac] { opacity: 0.5; cursor: not-allowed; }

.hgm-link[b-islgh5fuac] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    border: 0;
    background: transparent;
    padding: 0;
    font-size: 0.75rem;
    font-weight: 600;
    color: #0d9488;
    cursor: pointer;
}

.hgm-link:hover:not(:disabled)[b-islgh5fuac] { color: #0f766e; text-decoration: underline; }
.hgm-link:disabled[b-islgh5fuac] { color: #94a3b8; cursor: not-allowed; }

.hgm-spin[b-islgh5fuac] {
    display: inline-block;
    animation: hgm-spin-b-islgh5fuac 0.9s linear infinite;
}

@keyframes hgm-spin-b-islgh5fuac {
    to { transform: rotate(360deg); }
}

/* ── Search & filter toolbar ─────────────────────────────────── */

.hgm-toolbar[b-islgh5fuac] {
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);
}

.hgm-toolbar-filters[b-islgh5fuac] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    flex-wrap: wrap;
    min-width: 0;
}

.hgm-search[b-islgh5fuac] {
    position: relative;
    flex: 1;
    min-width: 220px;
    max-width: 28rem;
}

.hgm-search > i[b-islgh5fuac] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: #64748b;
    font-size: 0.875rem;
    pointer-events: none;
}

.hgm-search > input[b-islgh5fuac] {
    width: 100%;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    padding: 0.625rem 1rem 0.625rem 2.5rem;
    font-size: 0.875rem;
    color: #334155;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.hgm-search > input[b-islgh5fuac]::placeholder { color: #94a3b8; }
.hgm-search > input:hover[b-islgh5fuac] { border-color: #cbd5e1; }
.hgm-search > input:focus[b-islgh5fuac] { border-color: #14b8a6; box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2); }

.hgm-search--sm[b-islgh5fuac] { min-width: 0; max-width: none; }
.hgm-search--sm > input[b-islgh5fuac] { padding-top: 0.45rem; padding-bottom: 0.45rem; font-size: 0.8125rem; }

.hgm-select[b-islgh5fuac] {
    width: 12rem;
    max-width: 100%;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    padding: 0.625rem 0.75rem;
    font-size: 0.875rem;
    color: #475569;
    outline: none;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.hgm-select:hover[b-islgh5fuac] { border-color: #cbd5e1; }
.hgm-select:focus[b-islgh5fuac] { border-color: #14b8a6; box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2); }
/* Hospital, trust and organisation names run long. */
.hgm-select--wide[b-islgh5fuac] { width: 20rem; }
.hgm-select--sm[b-islgh5fuac] { width: auto; padding: 0.3rem 0.5rem; font-size: 0.75rem; }

.hgm-clear[b-islgh5fuac] {
    border: 0;
    background: transparent;
    padding: 0.25rem 0.35rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #0d9488;
}

.hgm-clear:hover[b-islgh5fuac] { color: #0b7a70; text-decoration: underline; }

.hgm-status-bar[b-islgh5fuac] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.hgm-chip[b-islgh5fuac] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border: 1px solid #e2e8f0;
    background-color: #fff;
    border-radius: 0.5rem;
    padding: 0.3rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #475569;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.hgm-chip:hover[b-islgh5fuac] { border-color: #cbd5e1; background-color: #f8fafc; }
.hgm-chip--active[b-islgh5fuac],
.hgm-chip--active:hover[b-islgh5fuac] { background-color: #0f172a; border-color: #0f172a; color: #fff; }

.hgm-chip-count[b-islgh5fuac] {
    font-size: 0.625rem;
    font-weight: 700;
    border-radius: 9999px;
    padding: 0 0.4rem;
    background-color: #f1f5f9;
    color: #475569;
}

.hgm-chip--active .hgm-chip-count[b-islgh5fuac] { background-color: rgba(255, 255, 255, 0.2); color: #fff; }

/* ── Summary cards ───────────────────────────────────────────── */

.hgm-stat-card[b-islgh5fuac] {
    width: 100%;
    text-align: left;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    cursor: pointer;
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.hgm-stat-card > span:first-child[b-islgh5fuac] { display: flex; flex-direction: column; }
.hgm-stat-card:hover[b-islgh5fuac] { border-color: #cbd5e1; }
.hgm-stat-card--static[b-islgh5fuac] { cursor: default; }
.hgm-stat-card--static:hover[b-islgh5fuac] { border-color: #e2e8f0; }
.hgm-stat-card--active[b-islgh5fuac] { box-shadow: 0 0 0 2px rgba(45, 212, 191, 0.45), 0 1px 3px rgba(15, 23, 42, 0.08); }

.hgm-stat-label[b-islgh5fuac] {
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
    margin-bottom: 0.25rem;
}

.hgm-stat-value[b-islgh5fuac] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    margin-bottom: 0.1rem;
}

.hgm-stat-hint[b-islgh5fuac] { font-size: 0.6875rem; color: #64748b; }
.hgm-text-warning[b-islgh5fuac] { color: #d97706; }
.hgm-text-danger[b-islgh5fuac] { color: #e11d48; }

.hgm-stat-icon[b-islgh5fuac] {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    border-radius: 0.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    border: 1px solid;
}

.hgm-stat-icon--brand[b-islgh5fuac]   { color: #0d9488; background-color: rgba(13, 148, 136, 0.1); border-color: rgba(13, 148, 136, 0.2); }
.hgm-stat-icon--sky[b-islgh5fuac]     { color: #0284c7; background-color: rgba(2, 132, 199, 0.1);  border-color: rgba(2, 132, 199, 0.2); }
.hgm-stat-icon--warning[b-islgh5fuac] { color: #d97706; background-color: rgba(217, 119, 6, 0.1);  border-color: rgba(217, 119, 6, 0.2); }
.hgm-stat-icon--danger[b-islgh5fuac]  { color: #e11d48; background-color: rgba(225, 29, 72, 0.1);  border-color: rgba(225, 29, 72, 0.2); }

/* ── Empty & loading states ──────────────────────────────────── */

.hgm-empty[b-islgh5fuac] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.375rem;
    padding: 3rem 1.5rem;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
}

.hgm-empty--inline[b-islgh5fuac] { padding: 2rem 1rem; background-color: #f8fafc; }

.hgm-empty-icon[b-islgh5fuac] {
    width: 3rem;
    height: 3rem;
    border-radius: 9999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.35rem;
    color: #0d9488;
    background-color: rgba(13, 148, 136, 0.08);
    border: 1px solid rgba(13, 148, 136, 0.2);
    margin-bottom: 0.25rem;
}

.hgm-empty-title[b-islgh5fuac] { font-size: 0.875rem; font-weight: 700; color: #0f172a; margin: 0; }
.hgm-empty-sub[b-islgh5fuac] { font-size: 0.75rem; color: #64748b; margin: 0 0 0.5rem; max-width: 28rem; }

/* ── Manual cards ────────────────────────────────────────────── */

.hgm-card[b-islgh5fuac] {
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    padding: 1.1rem 1.25rem;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.hgm-card:hover[b-islgh5fuac] { border-color: #0d9488; box-shadow: 0 4px 12px rgba(15, 23, 42, 0.1); }
.hgm-card--selected[b-islgh5fuac] { border-color: #14b8a6; box-shadow: 0 0 0 2px rgba(45, 212, 191, 0.35); }
.hgm-card--archived[b-islgh5fuac] { opacity: 0.72; }

.hgm-card-top[b-islgh5fuac] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.hgm-code-chip[b-islgh5fuac] {
    display: inline-block;
    max-width: 60%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    background-color: #0f172a;
    color: #fff;
    font-family: var(--ins-font-monospace, monospace);
    font-size: 0.6875rem;
    font-weight: 700;
    border-radius: 0.35rem;
    padding: 0.15rem 0.45rem;
    letter-spacing: 0.03em;
}

.hgm-code-chip--muted[b-islgh5fuac] { background-color: #f1f5f9; color: #64748b; border: 1px dashed #cbd5e1; font-family: inherit; }

.hgm-badge[b-islgh5fuac] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    font-weight: 600;
    border-radius: 9999px;
    padding: 0.15rem 0.55rem;
    border: 1px solid;
    white-space: nowrap;
}

.hgm-badge--success[b-islgh5fuac] { background-color: rgba(22, 163, 74, 0.1);  color: #16a34a; border-color: rgba(22, 163, 74, 0.25); }
.hgm-badge--warning[b-islgh5fuac] { background-color: rgba(217, 119, 6, 0.1);  color: #d97706; border-color: rgba(217, 119, 6, 0.25); }
.hgm-badge--danger[b-islgh5fuac]  { background-color: rgba(225, 29, 72, 0.1);  color: #e11d48; border-color: rgba(225, 29, 72, 0.25); }
.hgm-badge--muted[b-islgh5fuac]   { background-color: #f1f5f9;                 color: #64748b; border-color: #e2e8f0; }
.hgm-badge--brand[b-islgh5fuac]   { background-color: rgba(13, 148, 136, 0.1); color: #0d9488; border-color: rgba(13, 148, 136, 0.25); }

.hgm-card-title[b-islgh5fuac] {
    border: 0;
    background: transparent;
    padding: 0;
    text-align: left;
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1.35;
    color: #0f172a;
    cursor: pointer;
}

.hgm-card-title:hover[b-islgh5fuac],
.hgm-card-title:focus-visible[b-islgh5fuac] { color: #0d9488; text-decoration: underline; outline: none; }

.hgm-card-meta[b-islgh5fuac] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1rem;
    font-size: 0.75rem;
    color: #64748b;
    margin: -0.25rem 0 0;
}

.hgm-card-meta i[b-islgh5fuac] { margin-right: 0.25rem; }

.hgm-doc-tile[b-islgh5fuac] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.6rem;
    background-color: rgba(13, 148, 136, 0.04);
    padding: 0.6rem 0.75rem;
}

.hgm-doc-tile--lg[b-islgh5fuac] { padding: 0.85rem 1rem; }
.hgm-doc-tile--empty[b-islgh5fuac] { background-color: #f8fafc; border-style: dashed; }

.hgm-file[b-islgh5fuac] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 0.5rem;
    font-size: 1.05rem;
    color: #64748b;
    background-color: #f1f5f9;
    border: 1px solid #e2e8f0;
}

.hgm-file--pdf[b-islgh5fuac]  { color: #e11d48; background-color: rgba(225, 29, 72, 0.08); border-color: rgba(225, 29, 72, 0.2); }
.hgm-file--word[b-islgh5fuac] { color: #2563eb; background-color: rgba(37, 99, 235, 0.08); border-color: rgba(37, 99, 235, 0.2); }

.hgm-doc-body[b-islgh5fuac] { min-width: 0; flex: 1 1 auto; }

.hgm-doc-name[b-islgh5fuac] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #0f172a;
    margin: 0 0 0.1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hgm-doc-sub[b-islgh5fuac] { font-size: 0.6875rem; color: #64748b; margin: 0; }

.hgm-share-line[b-islgh5fuac] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #334155;
}

.hgm-share-line > i[b-islgh5fuac] { color: #0d9488; }
.hgm-dot[b-islgh5fuac] { opacity: 0.5; font-weight: 400; }

.hgm-card-foot[b-islgh5fuac] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: auto;
    padding-top: 0.75rem;
    border-top: 1px solid #e2e8f0;
}

.hgm-foot-note[b-islgh5fuac] { font-size: 0.6875rem; font-weight: 600; color: #64748b; }
.hgm-foot-note--danger[b-islgh5fuac] { color: #e11d48; }

.hgm-card-actions[b-islgh5fuac] { display: flex; align-items: center; gap: 0.375rem; }

/* ── Pager ───────────────────────────────────────────────────── */

.hgm-footer[b-islgh5fuac] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding: 0.65rem 1.25rem;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    font-size: 0.75rem;
    color: #64748b;
}

.hgm-footer-left[b-islgh5fuac] { display: flex; align-items: center; gap: 0.75rem; }
.hgm-pager[b-islgh5fuac] { display: flex; align-items: center; gap: 0.25rem; }

.hgm-pager-btn[b-islgh5fuac] {
    min-width: 2rem;
    height: 2rem;
    padding: 0 0.5rem;
    border-radius: 0.4rem;
    border: 1px solid #e2e8f0;
    background-color: #fff;
    color: #475569;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
}

.hgm-pager-btn:hover:not(:disabled):not(.hgm-pager-btn--active)[b-islgh5fuac] { background-color: #f1f5f9; }
.hgm-pager-btn--active[b-islgh5fuac] { background-color: #0f172a; border-color: #0f172a; color: #fff; }
.hgm-pager-btn:disabled[b-islgh5fuac] { opacity: 0.45; cursor: not-allowed; }
.hgm-pager-ellipsis[b-islgh5fuac] { padding: 0 0.25rem; }

/* ── Panel ───────────────────────────────────────────────────── */

.hgm-panel[b-islgh5fuac] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    color: #1e293b;
}

.hgm-panel-intro[b-islgh5fuac] {
    font-size: 0.75rem;
    line-height: 1.5;
    color: #64748b;
    margin: 0;
}

.hgm-section[b-islgh5fuac] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding-top: 1rem;
    border-top: 1px solid #e2e8f0;
}

.hgm-section-head[b-islgh5fuac] { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; }

.hgm-section-title[b-islgh5fuac] {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #334155;
    margin: 0;
}

.hgm-section-title > i[b-islgh5fuac] { color: #0d9488; margin-right: 0.25rem; }

.hgm-meta-label[b-islgh5fuac] {
    display: block;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #94a3b8;
    margin-bottom: 0.25rem;
}

.hgm-mono[b-islgh5fuac] { font-family: var(--ins-font-monospace, monospace); }

/* Tabs */

.hgm-tabs[b-islgh5fuac] {
    display: flex;
    gap: 0.25rem;
    border-bottom: 1px solid #e2e8f0;
    overflow-x: auto;
    scrollbar-width: none;
}

.hgm-tab[b-islgh5fuac] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    padding: 0.55rem 0.75rem;
    margin-bottom: -1px;
    font-size: 0.75rem;
    font-weight: 600;
    color: #64748b;
    white-space: nowrap;
    cursor: pointer;
}

.hgm-tab:hover[b-islgh5fuac] { color: #0f172a; }
.hgm-tab--active[b-islgh5fuac] { color: #0d9488; border-bottom-color: #0d9488; }

.hgm-tab-count[b-islgh5fuac] {
    font-size: 0.625rem;
    font-weight: 700;
    border-radius: 9999px;
    padding: 0 0.4rem;
    background-color: #f1f5f9;
    color: #475569;
}

.hgm-tab-dot[b-islgh5fuac] { width: 0.45rem; height: 0.45rem; border-radius: 9999px; background-color: #f59e0b; }

/* Notes */

.hgm-note[b-islgh5fuac] {
    display: flex;
    gap: 0.625rem;
    font-size: 0.75rem;
    line-height: 1.5;
    border: 1px solid;
    border-radius: 0.5rem;
    padding: 0.75rem;
}

.hgm-note > i[b-islgh5fuac] { font-size: 1rem; flex-shrink: 0; }

.hgm-note--info[b-islgh5fuac]  { background-color: rgba(13, 148, 136, 0.06); border-color: rgba(13, 148, 136, 0.25); color: #115e59; }
.hgm-note--sky[b-islgh5fuac]   { background-color: rgba(2, 132, 199, 0.06);  border-color: rgba(2, 132, 199, 0.25);  color: #075985; }
.hgm-note--amber[b-islgh5fuac] { background-color: rgba(245, 158, 11, 0.08); border-color: rgba(245, 158, 11, 0.3);  color: #92400e; }
.hgm-note--rose[b-islgh5fuac]  { background-color: rgba(225, 29, 72, 0.06);  border-color: rgba(225, 29, 72, 0.25);  color: #9f1239; }
.hgm-note--muted[b-islgh5fuac] { background-color: #f8fafc;                  border-color: #e2e8f0;                  color: #475569; }

.hgm-change-note[b-islgh5fuac] {
    border-left: 3px solid #14b8a6;
    background-color: #f8fafc;
    border-radius: 0 0.375rem 0.375rem 0;
    padding: 0.6rem 0.8rem;
}

.hgm-change-note > p[b-islgh5fuac] { font-size: 0.8125rem; color: #334155; margin: 0; white-space: pre-line; }

/* Details */

.hgm-facts[b-islgh5fuac] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem 1.25rem;
    margin: 0;
}

.hgm-facts dt[b-islgh5fuac] {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #94a3b8;
}

.hgm-facts dd[b-islgh5fuac] { font-size: 0.8125rem; font-weight: 600; color: #0f172a; margin: 0.1rem 0 0; }

.hgm-description[b-islgh5fuac] { font-size: 0.8125rem; color: #334155; margin: 0; white-space: pre-line; }

/* Versions */

.hgm-versions[b-islgh5fuac] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.hgm-version[b-islgh5fuac] {
    border: 1px solid #e2e8f0;
    border-radius: 0.65rem;
    padding: 0.75rem 0.9rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.hgm-version--current[b-islgh5fuac] { border-color: rgba(13, 148, 136, 0.45); background-color: rgba(13, 148, 136, 0.04); }

.hgm-version-head[b-islgh5fuac] { display: flex; align-items: center; gap: 0.5rem; }
.hgm-version-no[b-islgh5fuac] { font-family: var(--ins-font-monospace, monospace); font-size: 0.875rem; font-weight: 700; color: #0f172a; }
.hgm-version-when[b-islgh5fuac] { margin-left: auto; font-size: 0.6875rem; color: #64748b; }
.hgm-version-note[b-islgh5fuac] { font-size: 0.8125rem; color: #334155; margin: 0; white-space: pre-line; }

.hgm-version-meta[b-islgh5fuac] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.9rem;
    font-size: 0.6875rem;
    color: #64748b;
    margin: 0;
}

.hgm-version-meta i[b-islgh5fuac] { margin-right: 0.25rem; }
.hgm-version-actions[b-islgh5fuac] { display: flex; gap: 0.375rem; }

/* Shared-with list */

.hgm-shared-list[b-islgh5fuac] {
    list-style: none;
    margin: 0;
    padding: 0;
    border: 1px solid #e2e8f0;
    border-radius: 0.6rem;
}

.hgm-shared-list > li[b-islgh5fuac] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    border-top: 1px solid #e2e8f0;
}

.hgm-shared-list > li:first-child[b-islgh5fuac] { border-top: 0; }
.hgm-shared-name[b-islgh5fuac] { font-size: 0.8125rem; font-weight: 600; color: #0f172a; }
.hgm-shared-meta[b-islgh5fuac] { font-size: 0.6875rem; color: #64748b; text-align: right; }

/* Audit trail */

.hgm-trail[b-islgh5fuac] {
    list-style: none;
    margin: 0;
    padding: 0 0 0 0.25rem;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}

.hgm-trail[b-islgh5fuac]::before {
    content: "";
    position: absolute;
    left: 1.05rem;
    top: 0.5rem;
    bottom: 0.5rem;
    width: 1px;
    background-color: #e2e8f0;
}

.hgm-trail-item[b-islgh5fuac] { position: relative; display: flex; gap: 0.75rem; }

.hgm-trail-dot[b-islgh5fuac] {
    position: relative;
    z-index: 1;
    width: 1.625rem;
    height: 1.625rem;
    flex-shrink: 0;
    border-radius: 9999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    background-color: #f1f5f9;
    border: 1px solid #e2e8f0;
    color: #475569;
}

.hgm-trail-dot--brand[b-islgh5fuac]   { background-color: #ccfbf1; border-color: #99f6e4; color: #0f766e; }
.hgm-trail-dot--sky[b-islgh5fuac]     { background-color: #e0f2fe; border-color: #bae6fd; color: #0369a1; }
.hgm-trail-dot--rose[b-islgh5fuac]    { background-color: #ffe4e6; border-color: #fecdd3; color: #be123c; }
.hgm-trail-dot--emerald[b-islgh5fuac] { background-color: #dcfce7; border-color: #bbf7d0; color: #15803d; }

.hgm-trail-body[b-islgh5fuac] { min-width: 0; padding-top: 0.1rem; }
.hgm-trail-summary[b-islgh5fuac] { font-size: 0.8125rem; color: #0f172a; margin: 0; word-break: break-word; }
.hgm-trail-meta[b-islgh5fuac] { font-size: 0.6875rem; color: #64748b; margin: 0.15rem 0 0; }

.hgm-consequences[b-islgh5fuac] {
    list-style: none;
    margin: 0;
    padding: 0.875rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    font-size: 0.75rem;
    line-height: 1.45;
    color: #334155;
}

.hgm-consequences li[b-islgh5fuac] { display: flex; align-items: flex-start; gap: 0.5rem; }
.hgm-consequences i[b-islgh5fuac] { font-size: 0.9375rem; color: #64748b; flex-shrink: 0; margin-top: 0.0625rem; }

/* ── Forms ───────────────────────────────────────────────────── */

.hgm-form[b-islgh5fuac] { display: flex; flex-direction: column; gap: 0.9rem; }

.hgm-field[b-islgh5fuac] { display: flex; flex-direction: column; gap: 0.35rem; min-width: 0; }

.hgm-field > label[b-islgh5fuac] {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #475569;
    margin: 0;
}

.hgm-field-row[b-islgh5fuac] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.hgm-required[b-islgh5fuac] { color: #e11d48; }

.hgm-input[b-islgh5fuac] {
    width: 100%;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    padding: 0.55rem 0.75rem;
    font-size: 0.8125rem;
    color: #1e293b;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.hgm-input[b-islgh5fuac]::placeholder { color: #94a3b8; }
.hgm-input:hover[b-islgh5fuac] { border-color: #cbd5e1; }
.hgm-input:focus[b-islgh5fuac] { border-color: #14b8a6; box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2); }
.hgm-input--invalid[b-islgh5fuac],
.hgm-input--invalid:hover[b-islgh5fuac] { border-color: #e11d48; }
.hgm-input--invalid:focus[b-islgh5fuac] { border-color: #e11d48; box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.15); }
.hgm-input--version[b-islgh5fuac] { width: 7.5rem; font-family: var(--ins-font-monospace, monospace); }

.hgm-version-row[b-islgh5fuac] { display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem; }

.hgm-field-error[b-islgh5fuac] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: #e11d48;
}

.hgm-label-soft[b-islgh5fuac] { font-size: 0.6875rem; line-height: 1.45; color: #94a3b8; }

/* Drop zone — the file input covers it invisibly, so dropping a file onto it or clicking it both work. */
.hgm-drop[b-islgh5fuac] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
    padding: 1.25rem 1rem;
    border: 1.5px dashed #cbd5e1;
    border-radius: 0.75rem;
    background-color: #f8fafc;
    text-align: center;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.hgm-drop:hover[b-islgh5fuac],
.hgm-drop:focus-within[b-islgh5fuac] { border-color: #14b8a6; background-color: rgba(20, 184, 166, 0.05); }
.hgm-drop--invalid[b-islgh5fuac] { border-color: #e11d48; }
.hgm-drop > i[b-islgh5fuac] { font-size: 1.5rem; color: #0d9488; }
.hgm-drop-title[b-islgh5fuac] { font-size: 0.8125rem; font-weight: 600; color: #0f172a; }
.hgm-drop-sub[b-islgh5fuac] { font-size: 0.6875rem; color: #64748b; }

.hgm-drop[b-islgh5fuac]  .hgm-drop-input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

/* ── Sharing ─────────────────────────────────────────────────── */

.hgm-share[b-islgh5fuac] { display: flex; flex-direction: column; gap: 0.75rem; }

.hgm-share-options[b-islgh5fuac] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
}

.hgm-share-option[b-islgh5fuac] {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 0.5rem;
    align-items: center;
    padding: 0.625rem 0.75rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.625rem;
    background-color: #fff;
    cursor: pointer;
    margin: 0;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.hgm-share-option:hover[b-islgh5fuac] { background-color: #f8fafc; }
.hgm-share-option--selected[b-islgh5fuac] { background-color: rgba(13, 148, 136, 0.07); border-color: rgba(13, 148, 136, 0.45); }

.hgm-share-option > input[b-islgh5fuac] {
    grid-row: span 2;
    margin: 0;
    width: 1rem;
    height: 1rem;
    accent-color: #0d9488;
    cursor: pointer;
}

.hgm-share-option-title[b-islgh5fuac] { font-size: 0.75rem; font-weight: 700; color: #0f172a; }
.hgm-share-option-title > i[b-islgh5fuac] { color: #0d9488; }
.hgm-share-option-sub[b-islgh5fuac] { grid-column: 2; font-size: 0.625rem; color: #64748b; }

.hgm-picker[b-islgh5fuac] {
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    overflow: hidden;
}

.hgm-picker-head[b-islgh5fuac] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 0.75rem;
    background-color: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.hgm-picker-head > .hgm-search[b-islgh5fuac] { flex: 1; }
.hgm-picker-count[b-islgh5fuac] { font-size: 0.6875rem; font-weight: 700; color: #0d9488; white-space: nowrap; }

.hgm-picker-list[b-islgh5fuac] {
    list-style: none;
    margin: 0;
    padding: 0.25rem 0;
    max-height: 17rem;
    overflow-y: auto;
    scrollbar-width: thin;
}

.hgm-picker-item[b-islgh5fuac] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.45rem 0.9rem;
    margin: 0;
    font-size: 0.8125rem;
    color: #1e293b;
    cursor: pointer;
}

.hgm-picker-item:hover[b-islgh5fuac] { background-color: #f8fafc; }
.hgm-picker-item > input[b-islgh5fuac] { width: 1rem; height: 1rem; accent-color: #0d9488; cursor: pointer; flex-shrink: 0; }
.hgm-picker-item--owner[b-islgh5fuac] { cursor: default; background-color: rgba(13, 148, 136, 0.04); }
.hgm-picker-item--owner:hover[b-islgh5fuac] { background-color: rgba(13, 148, 136, 0.04); }
.hgm-picker-name[b-islgh5fuac] { flex: 1; min-width: 0; }
.hgm-picker-empty[b-islgh5fuac] { padding: 0.75rem 0.9rem; font-size: 0.75rem; color: #64748b; }

/* ── Toasts ──────────────────────────────────────────────────── */

.hgm-toasts[b-islgh5fuac] {
    position: fixed;
    right: 1.5rem;
    bottom: 1.5rem;
    z-index: 1090;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-width: min(26rem, calc(100vw - 3rem));
}

.hgm-toast[b-islgh5fuac] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.75rem 0.9rem;
    border-radius: 0.75rem;
    background-color: #0f172a;
    color: #f8fafc;
    font-size: 0.8125rem;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.25);
    animation: hgm-toast-in-b-islgh5fuac 0.25s ease-out;
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.hgm-toast > i[b-islgh5fuac] { font-size: 1.05rem; margin-top: 0.05rem; }
.hgm-toast--success > i[b-islgh5fuac] { color: #2dd4bf; }
.hgm-toast--error > i[b-islgh5fuac] { color: #fb7185; }
.hgm-toast--closing[b-islgh5fuac] { opacity: 0; transform: translateY(0.5rem); }

.hgm-toast > button[b-islgh5fuac] {
    margin-left: auto;
    border: 0;
    background: transparent;
    color: #94a3b8;
    padding: 0;
    cursor: pointer;
}

.hgm-toast > button:hover[b-islgh5fuac] { color: #fff; }

@keyframes hgm-toast-in-b-islgh5fuac {
    from { opacity: 0; transform: translateY(0.5rem); }
    to { opacity: 1; transform: translateY(0); }
}

/* ── Narrow screens ──────────────────────────────────────────── */

@media (max-width: 575.98px) {
    .hgm-field-row[b-islgh5fuac],
    .hgm-share-options[b-islgh5fuac],
    .hgm-facts[b-islgh5fuac] { grid-template-columns: minmax(0, 1fr); }
    .hgm-select--wide[b-islgh5fuac] { width: 100%; }
}

/* ── Dark theme ──────────────────────────────────────────────── */

[data-bs-theme="dark"] .hgm-header-title[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-stat-value[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-card-title[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-doc-name[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-empty-title[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-facts dd[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-version-no[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-shared-name[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-trail-summary[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-share-option-title[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-drop-title[b-islgh5fuac] { color: #f1f5f9; }

[data-bs-theme="dark"] .hgm-panel[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-share-line[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-section-title[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-version-note[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-description[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-change-note > p[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-consequences[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-picker-item[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-field > label[b-islgh5fuac] { color: #cbd5e1; }

[data-bs-theme="dark"] .hgm-header-sub[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-stat-label[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-stat-hint[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-card-meta[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-doc-sub[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-foot-note[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-footer[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-panel-intro[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-empty-sub[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-version-meta[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-version-when[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-shared-meta[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-trail-meta[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-share-option-sub[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-drop-sub[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-tab[b-islgh5fuac] { color: #94a3b8; }

[data-bs-theme="dark"] .hgm-foot-note--danger[b-islgh5fuac] { color: #fb7185; }

[data-bs-theme="dark"] .hgm-header-chip[b-islgh5fuac] { background-color: #1e293b; border-color: #334155; color: #94a3b8; }

[data-bs-theme="dark"] .hgm-toolbar[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-stat-card[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-card[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-empty[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-footer[b-islgh5fuac] { background-color: #131926; border-color: #1e293b; }

[data-bs-theme="dark"] .hgm-empty--inline[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-drop[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-change-note[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-consequences[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-picker-head[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-doc-tile--empty[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-note--muted[b-islgh5fuac] { background-color: #0b0f19; border-color: #1e293b; }

[data-bs-theme="dark"] .hgm-search > input[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-select[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-input[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-share-option[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-icon-btn[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-pager-btn[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-btn--light[b-islgh5fuac] { background-color: #0b0f19; border-color: #1e293b; color: #e2e8f0; }

[data-bs-theme="dark"] .hgm-search > input[b-islgh5fuac]::placeholder,
[data-bs-theme="dark"] .hgm-input[b-islgh5fuac]::placeholder { color: #64748b; }
[data-bs-theme="dark"] .hgm-select > option[b-islgh5fuac] { background-color: #131926; color: #e2e8f0; }

[data-bs-theme="dark"] .hgm-search > input:hover[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-select:hover[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-input:hover[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-stat-card:hover[b-islgh5fuac] { border-color: #334155; }

[data-bs-theme="dark"] .hgm-icon-btn:hover:not(:disabled)[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-btn--light:hover:not(:disabled)[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-share-option:hover[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-picker-item:hover[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-pager-btn:hover:not(:disabled):not(.hgm-pager-btn--active)[b-islgh5fuac] { background-color: #1e293b; border-color: #334155; }

[data-bs-theme="dark"] .hgm-chip[b-islgh5fuac] { background-color: #131926; border-color: #1e293b; color: #cbd5e1; }
[data-bs-theme="dark"] .hgm-chip:hover[b-islgh5fuac] { background-color: #1e293b; border-color: #334155; }
[data-bs-theme="dark"] .hgm-chip--active[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-chip--active:hover[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-pager-btn--active[b-islgh5fuac] { background-color: #2dd4bf; border-color: #2dd4bf; color: #0f172a; }
[data-bs-theme="dark"] .hgm-chip-count[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-tab-count[b-islgh5fuac] { background-color: #1e293b; color: #cbd5e1; }

[data-bs-theme="dark"] .hgm-code-chip[b-islgh5fuac] { background-color: #2dd4bf; color: #0f172a; }
[data-bs-theme="dark"] .hgm-code-chip--muted[b-islgh5fuac] { background-color: #1e293b; color: #94a3b8; border-color: #334155; }
[data-bs-theme="dark"] .hgm-doc-tile[b-islgh5fuac] { background-color: rgba(45, 212, 191, 0.06); border-color: #1e293b; }
[data-bs-theme="dark"] .hgm-file[b-islgh5fuac] { background-color: #1e293b; border-color: #334155; color: #94a3b8; }
[data-bs-theme="dark"] .hgm-badge--muted[b-islgh5fuac] { background-color: #1e293b; border-color: #334155; color: #94a3b8; }

[data-bs-theme="dark"] .hgm-btn--soft[b-islgh5fuac] { background-color: rgba(45, 212, 191, 0.12); border-color: rgba(45, 212, 191, 0.3); color: #2dd4bf; }
[data-bs-theme="dark"] .hgm-btn--soft:hover:not(:disabled)[b-islgh5fuac] { background-color: #0d9488; border-color: #0d9488; color: #fff; }
[data-bs-theme="dark"] .hgm-btn--dark[b-islgh5fuac] { background-color: #2dd4bf; border-color: #2dd4bf; color: #0f172a; }
[data-bs-theme="dark"] .hgm-link[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-tab--active[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-picker-count[b-islgh5fuac] { color: #2dd4bf; }
[data-bs-theme="dark"] .hgm-tab--active[b-islgh5fuac] { border-bottom-color: #2dd4bf; }

[data-bs-theme="dark"] .hgm-card-foot[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-section[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-tabs[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-version[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-shared-list[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-shared-list > li[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-picker[b-islgh5fuac],
[data-bs-theme="dark"] .hgm-trail-dot[b-islgh5fuac] { border-color: #1e293b; }

[data-bs-theme="dark"] .hgm-trail[b-islgh5fuac]::before { background-color: #1e293b; }
[data-bs-theme="dark"] .hgm-trail-dot[b-islgh5fuac] { background-color: #1e293b; color: #cbd5e1; }
[data-bs-theme="dark"] .hgm-version--current[b-islgh5fuac] { background-color: rgba(45, 212, 191, 0.06); border-color: rgba(45, 212, 191, 0.35); }

[data-bs-theme="dark"] .hgm-note--info[b-islgh5fuac]  { color: #99f6e4; }
[data-bs-theme="dark"] .hgm-note--sky[b-islgh5fuac]   { color: #bae6fd; }
[data-bs-theme="dark"] .hgm-note--amber[b-islgh5fuac] { color: #fde68a; }
[data-bs-theme="dark"] .hgm-note--rose[b-islgh5fuac]  { color: #fecdd3; }
[data-bs-theme="dark"] .hgm-note--muted[b-islgh5fuac] { color: #cbd5e1; }
/* /Components/Pages/Management/Organisations.razor.rz.scp.css */
/* ============================================================
   Organisations list table — mirrors the /users (User & Role
   Management) table look: rounded card, topbar-coloured header,
   rounded avatars, pill status badges and icon action buttons.
   Tokens are rooted on .urm-table-card so every cell inside
   inherits them; theme-aware via html[data-bs-theme="dark"].
   ============================================================ */

/* ---------- Tokens: light (default) ---------- */

.urm-table-card[b-gnvo12t0fg] {
    --urm-panel: #ffffff;
    --urm-border: #e2e8f0;
    --urm-border-soft: rgba(226, 232, 240, 0.7);
    --urm-chip-bg: #f1f5f9;
    --urm-chip-border: #e2e8f0;
    /* table header matches the topbar colour, same as /users */
    --urm-thead-bg: var(--ins-topbar-bg);
    --urm-row-hover: #f8fafc;
    --urm-hover-bg: #f1f5f9;

    --urm-heading: #0f172a;
    --urm-text-2: #334155;
    --urm-text-3: #475569;
    --urm-muted: #64748b;
    --urm-faint: #94a3b8;

    --urm-brand: #14b8a6;
    --urm-brand-strong: #0d9488;

    --urm-card-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);
    --urm-foot-bg: #f8fafc;
    --urm-pager-bg: #ffffff;
    --urm-pager-border: #e2e8f0;
    --urm-pager-color: #475569;
    --urm-brand-600: #0d9488;
    --urm-field-bg: #ffffff;
    --urm-field-border: #e2e8f0;
    --urm-field-border-hover: #cbd5e1;

    font-family: "Inter", var(--ins-body-font-family, sans-serif);
}

/* ---------- Tokens: dark ---------- */

[data-bs-theme="dark"] .urm-table-card[b-gnvo12t0fg] {
    --urm-panel: #131926;
    --urm-border: #1e293b;
    --urm-border-soft: rgba(30, 41, 59, 0.6);
    --urm-chip-bg: #1e293b;
    --urm-chip-border: #334155;
    --urm-thead-bg: var(--ins-topbar-bg);
    --urm-row-hover: rgba(30, 41, 59, 0.2);
    --urm-hover-bg: rgba(30, 41, 59, 0.4);

    --urm-heading: #ffffff;
    --urm-text-2: #e2e8f0;
    --urm-text-3: #cbd5e1;
    --urm-muted: #94a3b8;
    --urm-faint: #64748b;

    --urm-brand: #14b8a6;
    --urm-brand-strong: #2dd4bf;

    --urm-card-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.25);
    --urm-foot-bg: rgba(30, 41, 59, 0.2);
    --urm-pager-bg: rgba(30, 41, 59, 0.5);
    --urm-pager-border: rgba(51, 65, 85, 0.5);
    --urm-pager-color: #cbd5e1;
    --urm-brand-600: #0d9488;
    --urm-field-bg: #0b0f19;
    --urm-field-border: #1e293b;
    --urm-field-border-hover: #334155;
}

/* ---------- Table card ---------- */

.urm-table-card[b-gnvo12t0fg] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: var(--urm-card-shadow);
}

.urm-table-scroll[b-gnvo12t0fg] {
    overflow-x: auto;
    width: 100%;
}

.urm-table[b-gnvo12t0fg] {
    width: 100%;
    text-align: left;
    border-collapse: collapse;
    margin: 0;
}

.urm-table thead tr[b-gnvo12t0fg] {
    /* background (not background-color): the topbar colour can be a gradient */
    background: var(--urm-thead-bg);
    border-bottom: none;
}

.urm-table th[b-gnvo12t0fg] {
    padding: 1rem 1.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ins-topbar-item-color);
    white-space: nowrap;
}

.urm-th-actions[b-gnvo12t0fg] {
    width: 7.5rem;
    text-align: right;
}

.urm-table tbody tr[b-gnvo12t0fg] {
    border-bottom: 1px solid var(--urm-border-soft);
    transition: background-color 0.15s ease;
}

.urm-table tbody tr:last-child[b-gnvo12t0fg] {
    border-bottom: none;
}

.urm-table tbody tr:hover[b-gnvo12t0fg] {
    background-color: var(--urm-row-hover);
}

.urm-table td[b-gnvo12t0fg] {
    padding: 0.75rem 1.5rem;
    vertical-align: middle;
}

/* ---------- Identity cell ---------- */

.urm-user-cell[b-gnvo12t0fg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Rounded-square avatar holding the organisation-type icon; the
   colour comes from the bg-*-subtle / text-* utility classes. */
.urm-avatar[b-gnvo12t0fg] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.05rem;
    flex-shrink: 0;
}

.urm-user-name[b-gnvo12t0fg] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--urm-heading);
    transition: color 0.15s ease;
}

.urm-table tbody tr:hover .urm-user-name[b-gnvo12t0fg] {
    color: var(--urm-brand-strong);
}

.urm-user-email[b-gnvo12t0fg] {
    font-size: 0.75rem;
    color: var(--urm-muted);
}

/* ---------- Plain text cells ---------- */

.urm-cell-text[b-gnvo12t0fg] {
    font-size: 0.875rem;
    color: var(--urm-text-2);
}

.urm-cell-muted[b-gnvo12t0fg] {
    font-size: 0.875rem;
    color: var(--urm-muted);
}

.urm-cell-empty[b-gnvo12t0fg] {
    color: var(--urm-faint);
}

.urm-timestamp[b-gnvo12t0fg] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    white-space: nowrap;
}

.urm-timestamp i[b-gnvo12t0fg] {
    font-size: 0.9375rem;
    color: var(--urm-faint);
}

/* ---------- Status pill ---------- */

.urm-status-badge[b-gnvo12t0fg] {
    display: inline-flex;
    align-items: center;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.025em;
}

.urm-status-dot[b-gnvo12t0fg] {
    width: 0.375rem;
    height: 0.375rem;
    border-radius: 9999px;
    margin-right: 0.375rem;
    background-color: currentColor;
    flex-shrink: 0;
}

/* ---------- Row action buttons ---------- */

.urm-td-actions[b-gnvo12t0fg] {
    text-align: right;
}

.urm-actions-group[b-gnvo12t0fg] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    justify-content: flex-end;
}

.urm-icon-btn[b-gnvo12t0fg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 0.625rem;
    background: transparent;
    border: 1px solid var(--urm-border);
    border-radius: 0.5rem;
    color: var(--urm-brand-strong);
    font-size: 0.875rem;
    line-height: 1;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.urm-icon-btn:hover[b-gnvo12t0fg] {
    background-color: var(--urm-hover-bg);
    border-color: var(--urm-chip-border);
    color: var(--urm-brand-strong);
}

/* Destructive action — trash icon button */
.urm-icon-btn--danger[b-gnvo12t0fg] {
    color: #e11d48;
}

.urm-icon-btn--danger:hover[b-gnvo12t0fg] {
    background-color: rgba(225, 29, 72, 0.1);
    border-color: rgba(225, 29, 72, 0.35);
    color: #e11d48;
}

/* ---------- Table footer: page size, record summary, pager ----------
   Same treatment as the /users footer so both tables read identically.
   The card view reuses it inside a footer-only panel (.urm-foot-card),
   where the top border would otherwise double up with the card edge. */

.urm-table-foot[b-gnvo12t0fg] {
    background-color: var(--urm-foot-bg);
    border-top: 1px solid var(--urm-border);
    padding: 1rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    font-size: 0.75rem;
    color: var(--urm-muted);
}

.urm-foot-card .urm-table-foot[b-gnvo12t0fg] {
    border-top: none;
}

.urm-foot-strong[b-gnvo12t0fg] {
    font-weight: 500;
    color: var(--urm-text-2);
}

.urm-foot-left[b-gnvo12t0fg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.urm-foot-left > label[b-gnvo12t0fg] {
    margin: 0;
    font-weight: 500;
    color: var(--urm-muted);
    white-space: nowrap;
}

.urm-foot-divider[b-gnvo12t0fg] {
    width: 1px;
    height: 1rem;
    background-color: var(--urm-border);
    margin: 0 0.25rem;
}

/* ---------- Page-size select ---------- */

.urm-select[b-gnvo12t0fg] {
    width: 12rem;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 0.75rem;
    font-size: 0.875rem;
    color: var(--urm-text-3);
    outline: none;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.urm-select:hover[b-gnvo12t0fg] {
    border-color: var(--urm-field-border-hover);
}

.urm-select:focus[b-gnvo12t0fg] {
    border-color: var(--urm-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.urm-select > option[b-gnvo12t0fg] {
    background-color: var(--urm-panel);
    color: var(--urm-text-2);
}

.urm-select--sm[b-gnvo12t0fg] {
    width: auto;
    padding: 0.375rem 0.625rem;
    font-size: 0.75rem;
}

/* ---------- Pager ---------- */

.urm-foot-pager[b-gnvo12t0fg] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.urm-pager-btn[b-gnvo12t0fg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    min-width: 1.9rem;
    padding: 0.375rem 0.625rem;
    background-color: var(--urm-pager-bg);
    border: 1px solid var(--urm-pager-border);
    border-radius: 0.375rem;
    color: var(--urm-pager-color);
    font-size: 0.75rem;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.urm-pager-btn:hover:not(:disabled):not(.urm-pager-btn--active)[b-gnvo12t0fg] {
    background-color: var(--urm-hover-bg);
}

.urm-pager-btn--active[b-gnvo12t0fg] {
    background-color: var(--urm-brand-600);
    border-color: var(--urm-brand-600);
    color: #fff;
}

.urm-pager-btn:disabled[b-gnvo12t0fg] {
    opacity: 0.4;
    cursor: not-allowed;
}

.urm-pager-btn i[b-gnvo12t0fg] {
    font-size: 0.625rem;
}

/* Gap marker between non-contiguous page numbers (e.g. 1 … 5 6 7 … 19) */
.urm-pager-ellipsis[b-gnvo12t0fg] {
    padding: 0.375rem 0.125rem;
    color: var(--urm-faint);
    font-size: 0.75rem;
    user-select: none;
}
/* /Components/Pages/Management/PermissionCatalogue.razor.rz.scp.css */
/* ============================================================
   Permissions — the SuperAdmin catalogue of platform permissions.
   Same control-centre look as /features (urm- rules mirror /domains
   and /users); fm- rules are shared with /features, pm- are this
   page's own. Theme-aware: light by default, dark via html[data-bs-theme="dark"].
   ============================================================ */

/* ---------- Tokens: light (default) ---------- */
/* ---------- Tokens: light (default) ---------- */

.urm-page[b-dhrn2vpucq],
.fm-panel[b-dhrn2vpucq],
.urm-toasts[b-dhrn2vpucq] {
    --urm-page-bg: transparent;
    --urm-page-border: transparent;
    --urm-page-pad: 0;
    --urm-panel: #ffffff;
    --urm-border: #e2e8f0;
    --urm-border-soft: rgba(226, 232, 240, 0.7);
    --urm-chip-bg: #f1f5f9;
    --urm-chip-border: #e2e8f0;
    --urm-chip-hover: #e2e8f0;
    --urm-thead-bg: var(--ins-topbar-bg);
    --urm-row-hover: #f8fafc;
    --urm-selected-bg: rgba(20, 184, 166, 0.07);
    --urm-foot-bg: #f8fafc;
    --urm-hover-bg: #f1f5f9;
    --urm-header-pad: 1.5rem 0 0;

    --urm-heading: #0f172a;
    --urm-text: #1e293b;
    --urm-text-2: #334155;
    --urm-text-3: #475569;
    --urm-muted: #64748b;
    --urm-faint: #94a3b8;

    --urm-brand: #14b8a6;
    --urm-brand-600: #0d9488;
    --urm-brand-strong: #0d9488;
    --urm-brand-icon: #0d9488;

    --urm-field-bg: #ffffff;
    --urm-field-border: #e2e8f0;
    --urm-field-border-hover: #cbd5e1;
    --urm-placeholder: #94a3b8;
    --urm-tile-bg: #f8fafc;

    --urm-avatar-bg: #f1f5f9;
    --urm-avatar-border: #e2e8f0;
    --urm-avatar-color: #475569;
    --urm-avatar-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.06);

    --urm-emerald-text: #059669;
    --urm-cyan-text: #0891b2;
    --urm-amber-text: #d97706;
    --urm-rose-text: #e11d48;
    --urm-sky-text: #0284c7;

    --urm-org-rose: #e11d48;
    --urm-org-indigo: #4f46e5;
    --urm-org-amber: #b45309;
    --urm-org-pink: #db2777;
    --urm-org-cyan: #0e7490;
    --urm-org-emerald: #059669;

    --urm-warn-bg: #fffbeb;
    --urm-warn-border: #fde68a;
    --urm-warn-color: #92400e;

    --urm-pager-bg: #ffffff;
    --urm-pager-border: #e2e8f0;
    --urm-pager-color: #475569;

    --urm-toast-text: #1e293b;
    --urm-toast-success-bg: #ecfdf5;
    --urm-toast-success-border: #a7f3d0;
    --urm-toast-error-bg: #fef2f2;
    --urm-toast-error-border: #fecaca;
    --urm-toast-warning-bg: #fffbeb;
    --urm-toast-warning-border: #fde68a;

    --urm-card-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);
    --urm-toast-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.15);

    /* tints for the status tiles and notices */
    --fm-emerald-bg: #ecfdf5;
    --fm-emerald-border: #a7f3d0;
    --fm-amber-bg: #fffbeb;
    --fm-amber-border: #fde68a;
    --fm-amber-ink: #92400e;
    --fm-rose-bg: #fff1f2;
    --fm-rose-border: #fecdd3;
    --fm-rose-ink: #9f1239;
    --fm-sky-bg: #f0f9ff;
    --fm-sky-border: #bae6fd;
    --fm-sky-ink: #075985;

    font-family: "Inter", var(--ins-body-font-family, sans-serif);
}

/* ---------- Tokens: dark ---------- */

[data-bs-theme="dark"] .urm-page[b-dhrn2vpucq],
[data-bs-theme="dark"] .fm-panel[b-dhrn2vpucq],
[data-bs-theme="dark"] .urm-toasts[b-dhrn2vpucq] {
    --urm-page-bg: #0b0f19;
    --urm-page-border: #1e293b;
    --urm-page-pad: 1.5rem;
    --urm-panel: #131926;
    --urm-border: #1e293b;
    --urm-border-soft: rgba(30, 41, 59, 0.6);
    --urm-chip-bg: #1e293b;
    --urm-chip-border: #334155;
    --urm-chip-hover: #334155;
    --urm-thead-bg: var(--ins-topbar-bg);
    --urm-row-hover: rgba(30, 41, 59, 0.2);
    --urm-selected-bg: rgba(20, 184, 166, 0.05);
    --urm-foot-bg: rgba(30, 41, 59, 0.2);
    --urm-hover-bg: rgba(30, 41, 59, 0.4);
    --urm-header-pad: 0;

    --urm-heading: #ffffff;
    --urm-text: #f1f5f9;
    --urm-text-2: #e2e8f0;
    --urm-text-3: #cbd5e1;
    --urm-muted: #94a3b8;
    --urm-faint: #64748b;

    --urm-brand-strong: #2dd4bf;
    --urm-brand-icon: #14b8a6;

    --urm-field-bg: #0b0f19;
    --urm-field-border: #1e293b;
    --urm-field-border-hover: #334155;
    --urm-placeholder: #64748b;
    --urm-tile-bg: #0b0f19;

    --urm-avatar-bg: #1e293b;
    --urm-avatar-border: rgba(51, 65, 85, 0.8);
    --urm-avatar-color: #cbd5e1;
    --urm-avatar-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);

    --urm-emerald-text: #34d399;
    --urm-cyan-text: #22d3ee;
    --urm-amber-text: #fbbf24;
    --urm-rose-text: #fb7185;
    --urm-sky-text: #38bdf8;

    --urm-org-rose: #fb7185;
    --urm-org-indigo: #818cf8;
    --urm-org-amber: #fbbf24;
    --urm-org-pink: #f472b6;
    --urm-org-cyan: #22d3ee;
    --urm-org-emerald: #34d399;

    --urm-warn-bg: rgba(245, 158, 11, 0.1);
    --urm-warn-border: rgba(245, 158, 11, 0.2);
    --urm-warn-color: #fde68a;

    --urm-pager-bg: rgba(30, 41, 59, 0.5);
    --urm-pager-border: rgba(51, 65, 85, 0.5);
    --urm-pager-color: #cbd5e1;

    --urm-toast-text: #f1f5f9;
    --urm-toast-success-bg: #0c1a16;
    --urm-toast-success-border: rgba(16, 185, 129, 0.2);
    --urm-toast-error-bg: #1d1115;
    --urm-toast-error-border: rgba(244, 63, 94, 0.2);
    --urm-toast-warning-bg: #1c1811;
    --urm-toast-warning-border: rgba(245, 158, 11, 0.2);

    --urm-card-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.25);
    --urm-toast-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.4);

    --fm-emerald-bg: rgba(16, 185, 129, 0.1);
    --fm-emerald-border: rgba(16, 185, 129, 0.25);
    --fm-amber-bg: rgba(245, 158, 11, 0.1);
    --fm-amber-border: rgba(245, 158, 11, 0.25);
    --fm-amber-ink: #fde68a;
    --fm-rose-bg: rgba(244, 63, 94, 0.1);
    --fm-rose-border: rgba(244, 63, 94, 0.25);
    --fm-rose-ink: #fecdd3;
    --fm-sky-bg: rgba(14, 165, 233, 0.1);
    --fm-sky-border: rgba(14, 165, 233, 0.25);
    --fm-sky-ink: #bae6fd;
}

/* ---------- Workspace surface & header ---------- */

.urm-page[b-dhrn2vpucq] {
    background-color: var(--urm-page-bg);
    border: 1px solid var(--urm-page-border);
    border-radius: 12px;
    padding: var(--urm-page-pad);
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    min-height: calc(100vh - var(--ins-topbar-height, 70px) - 8rem);
    color: var(--urm-text);
}

.urm-header[b-dhrn2vpucq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: var(--urm-header-pad);
    min-height: 60px;
}

.urm-header-title[b-dhrn2vpucq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--urm-heading);
    margin: 0;
}

.urm-header-chip[b-dhrn2vpucq] {
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--urm-muted);
    background-color: var(--urm-chip-bg);
    border: 1px solid var(--urm-chip-border);
    border-radius: 0.25rem;
    padding: 0.125rem 0.5rem;
}

.urm-header-sub[b-dhrn2vpucq] {
    font-size: 0.75rem;
    color: var(--urm-muted);
    margin: 0.25rem 0 0;
}

.fm-text-emerald[b-dhrn2vpucq] { color: var(--urm-emerald-text); }
.fm-text-amber[b-dhrn2vpucq]   { color: var(--urm-amber-text); }

/* ---------- Toolbar ---------- */

.urm-toolbar[b-dhrn2vpucq] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    box-shadow: var(--urm-card-shadow);
}

.urm-toolbar-filters[b-dhrn2vpucq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    flex-wrap: wrap;
    min-width: 0;
}

.urm-toolbar-actions[b-dhrn2vpucq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.urm-search[b-dhrn2vpucq] {
    position: relative;
    flex: 1;
    min-width: 220px;
}

.urm-search > i[b-dhrn2vpucq] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--urm-muted);
    font-size: 0.875rem;
    pointer-events: none;
}

.urm-search > input[b-dhrn2vpucq] {
    width: 100%;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 1rem 0.625rem 2.5rem;
    font-size: 0.875rem;
    color: var(--urm-text-2);
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.urm-search > input[b-dhrn2vpucq]::placeholder {
    color: var(--urm-placeholder);
}

.urm-search > input:hover[b-dhrn2vpucq] {
    border-color: var(--urm-field-border-hover);
}

.urm-search > input:focus[b-dhrn2vpucq] {
    border-color: var(--urm-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.urm-select[b-dhrn2vpucq] {
    width: 12rem;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 0.75rem;
    font-size: 0.875rem;
    color: var(--urm-text-3);
    outline: none;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.urm-select:hover[b-dhrn2vpucq] {
    border-color: var(--urm-field-border-hover);
}

.urm-select:focus[b-dhrn2vpucq] {
    border-color: var(--urm-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.urm-select > option[b-dhrn2vpucq] {
    background-color: var(--urm-panel);
    color: var(--urm-text-2);
}

.urm-select--full[b-dhrn2vpucq] { width: 100%; }

/* Organisation names run long (NHS trusts) */
.urm-select--wide[b-dhrn2vpucq] {
    width: 18rem;
    max-width: 100%;
}

.urm-select--sm[b-dhrn2vpucq] {
    width: auto;
    padding: 0.375rem 0.625rem;
    font-size: 0.75rem;
}

.fm-clear[b-dhrn2vpucq] {
    background: none;
    border: none;
    border-radius: 0.5rem;
    padding: 0.625rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--urm-muted);
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.fm-clear:hover[b-dhrn2vpucq] {
    background-color: var(--urm-hover-bg);
    color: var(--urm-heading);
}

/* ---------- Buttons ---------- */

.urm-btn[b-dhrn2vpucq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    padding: 0.625rem 1rem;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease, transform 0.1s ease, box-shadow 0.15s ease;
    white-space: nowrap;
}

.urm-btn:active:not(:disabled)[b-dhrn2vpucq] {
    transform: scale(0.95);
}

.urm-btn:focus-visible[b-dhrn2vpucq] {
    outline: 2px solid var(--urm-brand);
    outline-offset: 2px;
}

.urm-btn:disabled[b-dhrn2vpucq] {
    opacity: 0.6;
    cursor: not-allowed;
}

.urm-btn--primary[b-dhrn2vpucq] {
    background-color: var(--urm-brand-600);
    color: #fff;
    box-shadow: 0 4px 6px -1px rgba(13, 148, 136, 0.2);
}

.urm-btn--primary:hover:not(:disabled)[b-dhrn2vpucq] {
    background-color: var(--urm-brand);
}

.urm-btn--dark[b-dhrn2vpucq] {
    background-color: var(--urm-chip-bg);
    border-color: var(--urm-chip-border);
    color: var(--urm-text-3);
}

.urm-btn--dark:hover:not(:disabled)[b-dhrn2vpucq] {
    background-color: var(--urm-chip-hover);
}

.urm-btn--rose[b-dhrn2vpucq] {
    background-color: #e11d48;
    color: #fff;
    box-shadow: 0 4px 6px -1px rgba(225, 29, 72, 0.2);
}

.urm-btn--rose:hover:not(:disabled)[b-dhrn2vpucq] {
    background-color: #f43f5e;
}

.urm-btn--sm[b-dhrn2vpucq] {
    padding: 0.4375rem 0.875rem;
    font-size: 0.75rem;
    font-weight: 700;
}

.urm-btn--ghost-danger[b-dhrn2vpucq] {
    background-color: transparent;
    border-color: rgba(225, 29, 72, 0.35);
    color: var(--urm-rose-text);
}

.urm-btn--ghost-danger:hover:not(:disabled)[b-dhrn2vpucq] {
    background-color: rgba(225, 29, 72, 0.08);
}

/* A panel footer's secondary action, pushed to the left edge away from Cancel / Save */
.fm-footer-start[b-dhrn2vpucq] {
    margin-right: auto;
}

/* ---------- Stat cards ---------- */

.urm-stats[b-dhrn2vpucq] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.urm-stat-card[b-dhrn2vpucq] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    padding: 0.55rem 0.85rem;
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    justify-content: flex-end;
    gap: 0.65rem;
    box-shadow: var(--urm-card-shadow);
}

.urm-stat-label[b-dhrn2vpucq] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--urm-muted);
    margin: 0;
}

.urm-stat-value[b-dhrn2vpucq] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--urm-heading);
    margin: 0.1rem 0 0;
}

.fm-stat-hint[b-dhrn2vpucq] {
    font-size: 0.6875rem;
    font-weight: 500;
    color: var(--urm-muted);
}

.fm-stat-pill[b-dhrn2vpucq] {
    font-size: 0.625rem;
    font-weight: 600;
    color: var(--fm-amber-ink);
    background-color: var(--fm-amber-bg);
    border-radius: 0.25rem;
    padding: 0.0625rem 0.375rem;
}

.urm-stat-icon[b-dhrn2vpucq] {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
    border: 1px solid;
}

.urm-stat-icon--emerald[b-dhrn2vpucq] { background-color: rgba(16, 185, 129, 0.1); border-color: rgba(16, 185, 129, 0.2); color: var(--urm-emerald-text); }
.urm-stat-icon--cyan[b-dhrn2vpucq]    { background-color: rgba(6, 182, 212, 0.1);  border-color: rgba(6, 182, 212, 0.2);  color: var(--urm-cyan-text); }
.fm-stat-icon--amber[b-dhrn2vpucq]   { background-color: rgba(245, 158, 11, 0.1); border-color: rgba(245, 158, 11, 0.2); color: var(--urm-amber-text); }
.fm-stat-icon--slate[b-dhrn2vpucq]   { background-color: var(--urm-chip-bg);      border-color: var(--urm-chip-border);    color: var(--urm-text-3); }

/* ---------- Table card ---------- */

.urm-table-card[b-dhrn2vpucq] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: var(--urm-card-shadow);
    display: flex;
    flex-direction: column;
}

.urm-table-scroll[b-dhrn2vpucq] {
    overflow-x: auto;
    width: 100%;
}

.urm-table[b-dhrn2vpucq] {
    width: 100%;
    text-align: left;
    border-collapse: collapse;
}

.urm-table thead tr[b-dhrn2vpucq] {
    /* background (not background-color): the topbar colour can be a gradient */
    background: var(--urm-thead-bg);
    border-bottom: none;
}

/* Seven columns: a little less side padding than /users keeps the register inside a 1440px
   screen without the table scrolling sideways. */
.urm-table th[b-dhrn2vpucq] {
    padding: 1rem 0.875rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ins-topbar-item-color);
    white-space: nowrap;
}

.urm-th-actions[b-dhrn2vpucq] {
    width: 1%;
    text-align: right;
}

.urm-table tbody tr[b-dhrn2vpucq] {
    border-bottom: 1px solid var(--urm-border-soft);
    transition: background-color 0.15s ease;
}

.urm-table tbody tr:hover[b-dhrn2vpucq] {
    background-color: var(--urm-row-hover);
}

.urm-row--selected[b-dhrn2vpucq] {
    background-color: var(--urm-selected-bg);
    box-shadow: inset 2px 0 0 var(--urm-brand);
}

.urm-table td[b-dhrn2vpucq] {
    padding: 0.75rem 0.875rem;
    vertical-align: middle;
    font-size: 0.875rem;
    color: var(--urm-text-2);
}

.urm-user-cell[b-dhrn2vpucq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.urm-avatar[b-dhrn2vpucq] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.5rem;
    background-color: var(--urm-avatar-bg);
    border: 1px solid var(--urm-avatar-border);
    color: var(--urm-avatar-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    box-shadow: var(--urm-avatar-shadow);
    flex-shrink: 0;
}

/* Status pill */

.urm-status-badge[b-dhrn2vpucq] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.025em;
    white-space: nowrap;
    border: 1px solid;
}

.urm-status-dot[b-dhrn2vpucq] {
    width: 0.375rem;
    height: 0.375rem;
    border-radius: 9999px;
    margin-right: 0.375rem;
    background-color: currentColor;
}

.urm-status-badge--active[b-dhrn2vpucq]  { background-color: rgba(16, 185, 129, 0.1); color: var(--urm-emerald-text); border-color: rgba(16, 185, 129, 0.2); }
.fm-status-badge--pending[b-dhrn2vpucq] { background-color: rgba(245, 158, 11, 0.1); color: var(--urm-amber-text);   border-color: rgba(245, 158, 11, 0.25); }
.urm-status-badge--deleted[b-dhrn2vpucq] { background-color: rgba(225, 29, 72, 0.08); color: var(--urm-rose-text);    border-color: rgba(225, 29, 72, 0.25); }

/* Row actions */

.urm-td-actions[b-dhrn2vpucq] {
    text-align: right;
}

.urm-actions-group[b-dhrn2vpucq] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    justify-content: flex-end;
}

.urm-icon-btn[b-dhrn2vpucq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.4375rem 0.5rem;
    background: transparent;
    border: 1px solid var(--urm-border);
    border-radius: 0.5rem;
    color: var(--urm-brand-strong);
    font-size: 0.75rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.urm-icon-btn:hover:not(:disabled)[b-dhrn2vpucq] {
    background-color: var(--urm-hover-bg);
    border-color: var(--urm-chip-border);
}

.urm-icon-btn:disabled[b-dhrn2vpucq] {
    opacity: 0.5;
    cursor: not-allowed;
}

.urm-icon-btn--danger[b-dhrn2vpucq] {
    color: #e11d48;
}

.urm-icon-btn--danger:hover:not(:disabled)[b-dhrn2vpucq] {
    background-color: rgba(225, 29, 72, 0.1);
    border-color: rgba(225, 29, 72, 0.35);
}

.fm-icon-btn--approve[b-dhrn2vpucq] {
    color: var(--urm-emerald-text);
    background-color: rgba(16, 185, 129, 0.08);
    border-color: rgba(16, 185, 129, 0.3);
}

.fm-icon-btn--approve:hover:not(:disabled)[b-dhrn2vpucq] {
    background-color: rgba(16, 185, 129, 0.16);
    border-color: rgba(16, 185, 129, 0.45);
}

/* Lock out / reject — tinted, so it reads apart from the plain-outline remove button beside it */
.fm-icon-btn--lock[b-dhrn2vpucq] {
    color: var(--urm-rose-text);
    background-color: rgba(225, 29, 72, 0.06);
    border-color: rgba(225, 29, 72, 0.3);
}

.fm-icon-btn--lock:hover:not(:disabled)[b-dhrn2vpucq] {
    background-color: rgba(225, 29, 72, 0.14);
    border-color: rgba(225, 29, 72, 0.45);
}

/* ---------- Empty / loading states ---------- */

.urm-empty[b-dhrn2vpucq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1.5rem;
    text-align: center;
    gap: 0.25rem;
}

.urm-empty-icon[b-dhrn2vpucq] {
    width: 4rem;
    height: 4rem;
    border-radius: 9999px;
    background-color: var(--urm-chip-bg);
    color: var(--urm-faint);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.urm-empty-title[b-dhrn2vpucq] {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--urm-text);
    margin: 0;
}

.urm-empty-sub[b-dhrn2vpucq] {
    font-size: 0.875rem;
    color: var(--urm-muted);
    max-width: 30rem;
    margin: 0;
}

.urm-empty-reset[b-dhrn2vpucq] {
    background: none;
    border: none;
    padding: 0;
    margin-top: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--urm-brand-icon);
    cursor: pointer;
}

.urm-empty-reset:hover[b-dhrn2vpucq] {
    color: var(--urm-brand-strong);
    text-decoration: underline;
}

/* ---------- Slide-over panel content ---------- */

.fm-panel[b-dhrn2vpucq] {
    display: flex;
    flex-direction: column;
    gap: 1.125rem;
    color: var(--urm-text);
}

.fm-panel-intro[b-dhrn2vpucq] {
    font-size: 0.75rem;
    line-height: 1.5;
    color: var(--urm-muted);
    margin: 0;
}

.urm-field[b-dhrn2vpucq] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.urm-field > label[b-dhrn2vpucq] {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--urm-text-3);
    margin: 0;
}

.urm-label-soft[b-dhrn2vpucq] {
    font-size: 0.6875rem;
    line-height: 1.45;
    color: var(--urm-faint);
}

.urm-label-soft strong[b-dhrn2vpucq] {
    color: var(--urm-text-2);
}

.urm-required[b-dhrn2vpucq] {
    color: #e11d48;
}

.urm-field-error[b-dhrn2vpucq] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: #e11d48;
}

/* "@" + domain input */
.urm-field .urm-input--invalid[b-dhrn2vpucq],
.urm-field .urm-input--invalid:focus-within[b-dhrn2vpucq] {
    border-color: #e11d48;
}

.urm-field .urm-input--invalid:focus-within[b-dhrn2vpucq] {
    box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.15);
}

/* Notes */

.urm-warn-note[b-dhrn2vpucq],
.fm-danger-note[b-dhrn2vpucq] {
    display: flex;
    gap: 0.625rem;
    font-size: 0.75rem;
    line-height: 1.5;
    border: 1px solid;
    border-radius: 0.5rem;
    padding: 0.75rem;
}

.urm-warn-note[b-dhrn2vpucq] {
    background-color: var(--urm-warn-bg);
    border-color: var(--urm-warn-border);
    color: var(--urm-warn-color);
}

.fm-danger-note[b-dhrn2vpucq] {
    background-color: var(--fm-rose-bg);
    border-color: var(--fm-rose-border);
    color: var(--fm-rose-ink);
}

.urm-warn-note > i[b-dhrn2vpucq],
.fm-danger-note > i[b-dhrn2vpucq] {
    font-size: 1rem;
    flex-shrink: 0;
}

/* ---------- Toasts ---------- */

.urm-toasts[b-dhrn2vpucq] {
    position: fixed;
    bottom: 1.5rem;
    right: 1.5rem;
    z-index: 1060;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    pointer-events: none;
}

.urm-toast[b-dhrn2vpucq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: 0.5rem;
    border: 1px solid;
    box-shadow: var(--urm-toast-shadow);
    color: var(--urm-toast-text);
    font-size: 0.75rem;
    font-weight: 600;
    pointer-events: auto;
    animation: urm-toast-in-b-dhrn2vpucq 0.3s ease forwards;
    max-width: 24rem;
}

.urm-toast--closing[b-dhrn2vpucq] {
    transition: opacity 0.3s ease, transform 0.3s ease;
    opacity: 0;
    transform: translateY(0.5rem);
}

@keyframes urm-toast-in-b-dhrn2vpucq {
    from { opacity: 0; transform: translateY(0.5rem); }
    to   { opacity: 1; transform: translateY(0); }
}

.urm-toast--success[b-dhrn2vpucq] { background-color: var(--urm-toast-success-bg); border-color: var(--urm-toast-success-border); }
.urm-toast--error[b-dhrn2vpucq]   { background-color: var(--urm-toast-error-bg);   border-color: var(--urm-toast-error-border); }
.urm-toast--warning[b-dhrn2vpucq] { background-color: var(--urm-toast-warning-bg); border-color: var(--urm-toast-warning-border); }

.urm-toast--success > i[b-dhrn2vpucq] { color: var(--urm-emerald-text); }
.urm-toast--error > i[b-dhrn2vpucq]   { color: var(--urm-rose-text); }
.urm-toast--warning > i[b-dhrn2vpucq] { color: var(--urm-amber-text); }

.urm-toast > button[b-dhrn2vpucq] {
    background: none;
    border: none;
    padding: 0;
    margin-left: 1rem;
    color: var(--urm-muted);
    font-size: 0.625rem;
    cursor: pointer;
}

.urm-toast > button:hover[b-dhrn2vpucq] {
    color: var(--urm-heading);
}

/* ---------- Misc ---------- */

.urm-spin[b-dhrn2vpucq] {
    display: inline-block;
    animation: urm-spin-b-dhrn2vpucq 0.8s linear infinite;
}

@keyframes urm-spin-b-dhrn2vpucq {
    to { transform: rotate(360deg); }
}

/* ---------- Responsive ---------- */

@media (max-width: 1200px) {
    .urm-stats[b-dhrn2vpucq] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .urm-stats[b-dhrn2vpucq] {
        grid-template-columns: 1fr;
    }

    .urm-toolbar-filters[b-dhrn2vpucq] {
        flex-direction: column;
        align-items: stretch;
    }

    .urm-select[b-dhrn2vpucq],
    .urm-select--wide[b-dhrn2vpucq] {
        width: 100%;
    }

    .fm-attention-item[b-dhrn2vpucq] {
        flex-wrap: wrap;
    }

    .fm-status-options[b-dhrn2vpucq] {
        grid-template-columns: 1fr;
    }

    .fm-discovery-row[b-dhrn2vpucq] {
        flex-wrap: wrap;
    }
}


/* ---------- Table footer ---------- */

.urm-table-foot[b-dhrn2vpucq] {
    background-color: var(--urm-foot-bg);
    border-top: 1px solid var(--urm-border);
    padding: 1rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    font-size: 0.75rem;
    color: var(--urm-muted);
}

.urm-foot-left[b-dhrn2vpucq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.urm-foot-left > label[b-dhrn2vpucq] {
    margin: 0;
    font-weight: 500;
    color: var(--urm-muted);
    white-space: nowrap;
}

.urm-foot-strong[b-dhrn2vpucq] {
    font-weight: 500;
    color: var(--urm-text-2);
}

.urm-foot-divider[b-dhrn2vpucq] {
    width: 1px;
    height: 1rem;
    background-color: var(--urm-border);
    margin: 0 0.25rem;
}

.urm-foot-pager[b-dhrn2vpucq] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.urm-pager-btn[b-dhrn2vpucq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.9rem;
    padding: 0.375rem 0.625rem;
    background-color: var(--urm-pager-bg);
    border: 1px solid var(--urm-pager-border);
    border-radius: 0.375rem;
    color: var(--urm-pager-color);
    font-size: 0.75rem;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.urm-pager-btn:hover:not(:disabled):not(.urm-pager-btn--active)[b-dhrn2vpucq] {
    background-color: var(--urm-hover-bg);
}

.urm-pager-btn--active[b-dhrn2vpucq] {
    background-color: var(--urm-brand-600);
    border-color: var(--urm-brand-600);
    color: #fff;
}

.urm-pager-btn:disabled[b-dhrn2vpucq] {
    opacity: 0.4;
    cursor: not-allowed;
}

.urm-pager-btn i[b-dhrn2vpucq] {
    font-size: 0.625rem;
}

.urm-pager-ellipsis[b-dhrn2vpucq] {
    padding: 0.375rem 0.125rem;
    color: var(--urm-faint);
    font-size: 0.75rem;
    user-select: none;
}

/* ---------- Features table ---------- */

.fm-name-link[b-dhrn2vpucq] {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    font-weight: 600;
    color: var(--urm-text);
    text-align: left;
    cursor: pointer;
}

.fm-name-link:hover[b-dhrn2vpucq] {
    text-decoration: underline;
}

.fm-code[b-dhrn2vpucq] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.75rem;
    color: var(--urm-muted);
}

.fm-desc[b-dhrn2vpucq] {
    max-width: 38rem;
    font-size: 0.8125rem;
    line-height: 1.45;
    color: var(--urm-muted);
}

.fm-desc--empty[b-dhrn2vpucq] {
    font-style: italic;
    opacity: 0.7;
}

.fm-chips[b-dhrn2vpucq] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.fm-chip[b-dhrn2vpucq] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.125rem 0.5rem;
    border-radius: 999px;
    font-size: 0.6875rem;
    font-weight: 600;
    background: var(--urm-chip-bg);
    border: 1px solid var(--urm-chip-border);
    color: var(--urm-muted);
    white-space: nowrap;
}

.fm-chip--core[b-dhrn2vpucq] {
    background: rgba(37, 99, 235, 0.1);
    border-color: rgba(37, 99, 235, 0.25);
    color: #2563eb;
}

.fm-chip--live[b-dhrn2vpucq] {
    background: rgba(16, 185, 129, 0.1);
    border-color: rgba(16, 185, 129, 0.25);
    color: #059669;
}

.fm-chip--roadmap[b-dhrn2vpucq] {
    background: rgba(245, 158, 11, 0.12);
    border-color: rgba(245, 158, 11, 0.3);
    color: #b45309;
}

.urm-table .fm-th-count[b-dhrn2vpucq],
.urm-table .fm-td-count[b-dhrn2vpucq] {
    text-align: center;
}

.fm-count[b-dhrn2vpucq] {
    font-weight: 700;
    color: var(--urm-text);
}

/* ---------- Panel ---------- */

.fm-panel textarea[b-dhrn2vpucq],
.fm-panel input[type="text"][b-dhrn2vpucq] {
    width: 100%;
    padding: 0.55rem 0.75rem;
    font-size: 0.875rem;
    color: var(--urm-text);
    background: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.5rem;
}

.fm-panel textarea[b-dhrn2vpucq] {
    resize: vertical;
    min-height: 7rem;
    line-height: 1.5;
}

.fm-panel input[type="text"].fm-mono[b-dhrn2vpucq] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.8125rem;
}

.fm-panel input:focus[b-dhrn2vpucq],
.fm-panel textarea:focus[b-dhrn2vpucq] {
    outline: none;
    border-color: #2563eb;
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2);
}

.fm-panel .urm-input--invalid[b-dhrn2vpucq] {
    border-color: #e11d48;
}

.fm-label-row[b-dhrn2vpucq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fm-counter[b-dhrn2vpucq] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.6875rem;
    color: var(--urm-muted);
}

.fm-facts[b-dhrn2vpucq] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    padding: 0.85rem;
    border: 1px solid var(--urm-border);
    border-radius: 0.6rem;
    background: var(--urm-foot-bg);
}

.fm-fact-label[b-dhrn2vpucq] {
    margin: 0;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--urm-muted);
}

.fm-fact-value[b-dhrn2vpucq] {
    margin: 0.15rem 0 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--urm-text);
}

.fm-panel-intro[b-dhrn2vpucq] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.5;
    color: var(--urm-muted);
}

/* ---------- Permissions page ---------- */

.pm-tags[b-dhrn2vpucq] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.pm-tag[b-dhrn2vpucq] {
    padding: 0.1rem 0.45rem;
    border-radius: 0.375rem;
    border: 1px solid var(--urm-chip-border);
    background: var(--urm-chip-bg);
    font-size: 0.6875rem;
    color: var(--urm-text);
    white-space: nowrap;
}

.pm-tag--mono[b-dhrn2vpucq] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    color: #2563eb;
}

.pm-none[b-dhrn2vpucq] {
    font-size: 0.75rem;
    font-style: italic;
    color: var(--urm-muted);
}

.pm-section[b-dhrn2vpucq] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.fm-panel input[type="number"][b-dhrn2vpucq] {
    width: 8rem;
    padding: 0.55rem 0.75rem;
    font-size: 0.875rem;
    color: var(--urm-text);
    background: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.5rem;
}
/* /Components/Pages/Management/Users.razor.rz.scp.css */
/* ============================================================
   User & Role Management — port of
   Designs/user_and_role_management_dashboard.html
   Theme-aware: light by default (matches the app's UBold light
   look), switches to the design's dark palette when the user
   selects dark mode (html[data-bs-theme="dark"], via the
   Topbar theme toggle / config.js).
   All colors live in the token blocks below; component rules
   reference tokens only.
   ============================================================ */

/* ---------- Tokens: light (default) ---------- */

.urm-page[b-zqbzuuy8a7],
.urm-drawer[b-zqbzuuy8a7],
.urm-modal-backdrop[b-zqbzuuy8a7],
.urm-toasts[b-zqbzuuy8a7] {
    /* surfaces & chrome */
    --urm-page-bg: transparent;
    --urm-page-border: transparent;
    --urm-page-pad: 0;
    --urm-panel: #ffffff;
    --urm-border: #e2e8f0;
    --urm-border-soft: rgba(226, 232, 240, 0.7);
    --urm-chip-bg: #f1f5f9;
    --urm-chip-border: #e2e8f0;
    --urm-chip-hover: #e2e8f0;
    /* table header matches the /organisations list (.app-table → topbar colour) */
    --urm-thead-bg: var(--ins-topbar-bg);
    --urm-row-hover: #f8fafc;
    --urm-selected-bg: rgba(20, 184, 166, 0.07);
    --urm-foot-bg: #f8fafc;
    --urm-head-bg: #f8fafc;
    --urm-tabs-bg: rgba(248, 250, 252, 0.6);
    --urm-hover-bg: #f1f5f9;
    --urm-backdrop: rgba(15, 23, 42, 0.45);
    /* matches the theme's .page-title-head spacing used on /organisations */
    --urm-header-pad: 1.5rem 0 0;

    /* text scale */
    --urm-heading: #0f172a;
    --urm-text: #1e293b;
    --urm-text-2: #334155;
    --urm-text-3: #475569;
    --urm-muted: #64748b;
    --urm-faint: #94a3b8;

    /* brand */
    --urm-brand: #14b8a6;
    --urm-brand-600: #0d9488;
    --urm-brand-strong: #0d9488;
    --urm-brand-icon: #0d9488;

    /* form fields */
    --urm-field-bg: #ffffff;
    --urm-field-border: #e2e8f0;
    --urm-field-border-hover: #cbd5e1;
    --urm-placeholder: #94a3b8;
    --urm-switch-track: #cbd5e1;
    --urm-tile-bg: #f8fafc;

    /* avatars */
    --urm-avatar-bg: #f1f5f9;
    --urm-avatar-border: #e2e8f0;
    --urm-avatar-color: #475569;
    --urm-avatar-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.06);

    /* accent text */
    --urm-emerald-text: #059669;
    --urm-pink-text: #db2777;
    --urm-cyan-text: #0891b2;
    --urm-amber-text: #d97706;
    --urm-rose-text: #e11d48;

    /* organisation badges */
    --urm-org-rose: #e11d48;
    --urm-org-indigo: #4f46e5;
    --urm-org-amber: #b45309;
    --urm-org-pink: #db2777;
    --urm-org-cyan: #0e7490;
    --urm-org-emerald: #059669;

    /* role pills */
    --urm-pill-bg: #ecfeff;
    --urm-pill-color: #0e7490;
    --urm-pill-border: #a5f3fc;

    /* stat icons */
    --urm-stat-brand-bg: #f0fdfa;
    --urm-stat-brand-border: #ccfbf1;

    /* warning note */
    --urm-warn-bg: #fffbeb;
    --urm-warn-border: #fde68a;
    --urm-warn-color: #92400e;

    /* buttons */
    --urm-busy-bg: #e2e8f0;
    --urm-busy-color: #94a3b8;
    --urm-pager-bg: #ffffff;
    --urm-pager-border: #e2e8f0;
    --urm-pager-color: #475569;

    /* toasts */
    --urm-toast-text: #1e293b;
    --urm-toast-success-bg: #ecfdf5;
    --urm-toast-success-border: #a7f3d0;
    --urm-toast-error-bg: #fef2f2;
    --urm-toast-error-border: #fecaca;
    --urm-toast-warning-bg: #fffbeb;
    --urm-toast-warning-border: #fde68a;

    /* shadows & scrollbars */
    --urm-card-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);
    --urm-drawer-shadow: -12px 0 40px rgba(15, 23, 42, 0.15);
    --urm-modal-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.25);
    --urm-toast-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.15);
    --urm-scroll-thumb: #cbd5e1;

    font-family: "Inter", var(--ins-body-font-family, sans-serif);
}

/* ---------- Tokens: dark (design mock palette) ---------- */

[data-bs-theme="dark"] .urm-page[b-zqbzuuy8a7],
[data-bs-theme="dark"] .urm-drawer[b-zqbzuuy8a7],
[data-bs-theme="dark"] .urm-modal-backdrop[b-zqbzuuy8a7],
[data-bs-theme="dark"] .urm-toasts[b-zqbzuuy8a7] {
    --urm-page-bg: #0b0f19;
    --urm-page-border: #1e293b;
    --urm-page-pad: 1.5rem;
    --urm-panel: #131926;
    --urm-border: #1e293b;
    --urm-border-soft: rgba(30, 41, 59, 0.6);
    --urm-chip-bg: #1e293b;
    --urm-chip-border: #334155;
    --urm-chip-hover: #334155;
    --urm-thead-bg: var(--ins-topbar-bg);
    --urm-row-hover: rgba(30, 41, 59, 0.2);
    --urm-selected-bg: rgba(20, 184, 166, 0.05);
    --urm-foot-bg: rgba(30, 41, 59, 0.2);
    --urm-head-bg: rgba(15, 23, 42, 0.4);
    --urm-tabs-bg: rgba(15, 23, 42, 0.2);
    --urm-hover-bg: rgba(30, 41, 59, 0.4);
    --urm-backdrop: rgba(0, 0, 0, 0.6);
    /* dark workspace island already carries its own padding */
    --urm-header-pad: 0;

    --urm-heading: #ffffff;
    --urm-text: #f1f5f9;
    --urm-text-2: #e2e8f0;
    --urm-text-3: #cbd5e1;
    --urm-muted: #94a3b8;
    --urm-faint: #64748b;

    --urm-brand: #14b8a6;
    --urm-brand-600: #0d9488;
    --urm-brand-strong: #2dd4bf;
    --urm-brand-icon: #14b8a6;

    --urm-field-bg: #0b0f19;
    --urm-field-border: #1e293b;
    --urm-field-border-hover: #334155;
    --urm-placeholder: #64748b;
    --urm-switch-track: #334155;
    --urm-tile-bg: #0b0f19;

    --urm-avatar-bg: #1e293b;
    --urm-avatar-border: rgba(51, 65, 85, 0.8);
    --urm-avatar-color: #cbd5e1;
    --urm-avatar-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);

    --urm-emerald-text: #34d399;
    --urm-pink-text: #f472b6;
    --urm-cyan-text: #22d3ee;
    --urm-amber-text: #fbbf24;
    --urm-rose-text: #fb7185;

    --urm-org-rose: #fb7185;
    --urm-org-indigo: #818cf8;
    --urm-org-amber: #fbbf24;
    --urm-org-pink: #f472b6;
    --urm-org-cyan: #22d3ee;
    --urm-org-emerald: #34d399;

    --urm-pill-bg: #083344;
    --urm-pill-color: #22d3ee;
    --urm-pill-border: rgba(21, 94, 117, 0.4);

    --urm-stat-brand-bg: rgba(30, 41, 59, 0.5);
    --urm-stat-brand-border: rgba(51, 65, 85, 0.5);

    --urm-warn-bg: rgba(245, 158, 11, 0.1);
    --urm-warn-border: rgba(245, 158, 11, 0.2);
    --urm-warn-color: #fde68a;

    --urm-busy-bg: #1e293b;
    --urm-busy-color: #64748b;
    --urm-pager-bg: rgba(30, 41, 59, 0.5);
    --urm-pager-border: rgba(51, 65, 85, 0.5);
    --urm-pager-color: #cbd5e1;

    --urm-toast-text: #f1f5f9;
    --urm-toast-success-bg: #0c1a16;
    --urm-toast-success-border: rgba(16, 185, 129, 0.2);
    --urm-toast-error-bg: #1d1115;
    --urm-toast-error-border: rgba(244, 63, 94, 0.2);
    --urm-toast-warning-bg: #1c1811;
    --urm-toast-warning-border: rgba(245, 158, 11, 0.2);

    --urm-card-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.25);
    --urm-drawer-shadow: -25px 0 50px -12px rgba(0, 0, 0, 0.5);
    --urm-modal-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.6);
    --urm-toast-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.4);
    --urm-scroll-thumb: #1e293b;
}

/* ---------- Workspace surface ---------- */

.urm-page[b-zqbzuuy8a7] {
    background-color: var(--urm-page-bg);
    border: 1px solid var(--urm-page-border);
    border-radius: 12px;
    padding: var(--urm-page-pad);
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    min-height: calc(100vh - var(--ins-topbar-height, 70px) - 8rem);
    color: var(--urm-text);
}

/* ---------- Page header ---------- */

.urm-header[b-zqbzuuy8a7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: var(--urm-header-pad);
    min-height: 60px;
}

.urm-header-title[b-zqbzuuy8a7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--urm-heading);
    margin: 0;
}

.urm-header-chip[b-zqbzuuy8a7] {
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--urm-muted);
    background-color: var(--urm-chip-bg);
    border: 1px solid var(--urm-chip-border);
    border-radius: 0.25rem;
    padding: 0.125rem 0.5rem;
}

.urm-header-sub[b-zqbzuuy8a7] {
    font-size: 0.75rem;
    color: var(--urm-muted);
    margin: 0.25rem 0 0;
}

.urm-header-meta[b-zqbzuuy8a7] {
    font-size: 0.75rem;
    color: var(--urm-muted);
}

.urm-header-online[b-zqbzuuy8a7] {
    color: var(--urm-emerald-text);
    font-weight: 500;
}

/* ---------- Stat cards ---------- */

.urm-stats[b-zqbzuuy8a7] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.urm-stat-card[b-zqbzuuy8a7] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    padding: 0.55rem 0.85rem;
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    justify-content: flex-end;
    gap: 0.65rem;
    box-shadow: var(--urm-card-shadow);
}

.urm-stat-label[b-zqbzuuy8a7] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--urm-muted);
    margin: 0;
}

.urm-stat-value[b-zqbzuuy8a7] {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--urm-heading);
    margin: 0.1rem 0 0;
}

.urm-stat-value--emerald[b-zqbzuuy8a7] { color: var(--urm-emerald-text); }
.urm-stat-value--pink[b-zqbzuuy8a7]    { color: var(--urm-pink-text); }
.urm-stat-value--cyan[b-zqbzuuy8a7]    { color: var(--urm-cyan-text); }

.urm-stat-icon[b-zqbzuuy8a7] {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
}

.urm-stat-icon--brand[b-zqbzuuy8a7] {
    background-color: var(--urm-stat-brand-bg);
    border: 1px solid var(--urm-stat-brand-border);
    color: var(--urm-brand-icon);
}

.urm-stat-icon--emerald[b-zqbzuuy8a7] {
    background-color: rgba(16, 185, 129, 0.1);
    border: 1px solid rgba(16, 185, 129, 0.2);
    color: var(--urm-emerald-text);
}

.urm-stat-icon--pink[b-zqbzuuy8a7] {
    background-color: rgba(236, 72, 153, 0.1);
    border: 1px solid rgba(236, 72, 153, 0.2);
    color: var(--urm-pink-text);
}

.urm-stat-icon--cyan[b-zqbzuuy8a7] {
    background-color: rgba(6, 182, 212, 0.1);
    border: 1px solid rgba(6, 182, 212, 0.2);
    color: var(--urm-cyan-text);
}

/* ---------- Toolbar ---------- */

.urm-toolbar[b-zqbzuuy8a7] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    box-shadow: var(--urm-card-shadow);
}

.urm-toolbar-filters[b-zqbzuuy8a7] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    flex-wrap: wrap;
    min-width: 0;
}

.urm-search[b-zqbzuuy8a7] {
    position: relative;
    flex: 1;
    min-width: 220px;
    max-width: 28rem;
}

.urm-search > i[b-zqbzuuy8a7] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--urm-muted);
    font-size: 0.875rem;
    pointer-events: none;
}

.urm-search > input[b-zqbzuuy8a7] {
    width: 100%;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 1rem 0.625rem 2.5rem;
    font-size: 0.875rem;
    color: var(--urm-text-2);
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.urm-search > input[b-zqbzuuy8a7]::placeholder {
    color: var(--urm-placeholder);
}

.urm-search > input:hover[b-zqbzuuy8a7] {
    border-color: var(--urm-field-border-hover);
}

.urm-search > input:focus[b-zqbzuuy8a7] {
    border-color: var(--urm-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.urm-select[b-zqbzuuy8a7] {
    width: 12rem;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 0.75rem;
    font-size: 0.875rem;
    color: var(--urm-text-3);
    outline: none;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.urm-select:hover[b-zqbzuuy8a7] {
    border-color: var(--urm-field-border-hover);
}

.urm-select:focus[b-zqbzuuy8a7] {
    border-color: var(--urm-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.urm-select > option[b-zqbzuuy8a7] {
    background-color: var(--urm-panel);
    color: var(--urm-text-2);
}

.urm-select--full[b-zqbzuuy8a7] {
    width: 100%;
}

/* Organisation filter — hospital/trust names run long */
.urm-select--wide[b-zqbzuuy8a7] {
    width: 22rem;
    max-width: 100%;
}

.urm-toolbar-actions[b-zqbzuuy8a7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* ---------- Buttons ---------- */

.urm-btn[b-zqbzuuy8a7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    padding: 0.625rem 1rem;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease, transform 0.1s ease, box-shadow 0.15s ease;
    white-space: nowrap;
}

.urm-btn:active[b-zqbzuuy8a7] {
    transform: scale(0.95);
}

.urm-btn:focus-visible[b-zqbzuuy8a7] {
    outline: 2px solid var(--urm-brand);
    outline-offset: 2px;
}

.urm-btn--primary[b-zqbzuuy8a7] {
    background-color: var(--urm-brand-600);
    color: #fff;
    box-shadow: 0 4px 6px -1px rgba(13, 148, 136, 0.2);
}

.urm-btn--primary:hover[b-zqbzuuy8a7] {
    background-color: var(--urm-brand);
}

.urm-btn--dark[b-zqbzuuy8a7] {
    background-color: var(--urm-chip-bg);
    border-color: var(--urm-chip-border);
    color: var(--urm-text-3);
}

.urm-btn--dark:hover[b-zqbzuuy8a7] {
    background-color: var(--urm-chip-hover);
}

.urm-btn--rose[b-zqbzuuy8a7] {
    background-color: #e11d48;
    color: #fff;
    box-shadow: 0 4px 6px -1px rgba(225, 29, 72, 0.2);
}

.urm-btn--rose:hover[b-zqbzuuy8a7] {
    background-color: #f43f5e;
}

.urm-btn--busy[b-zqbzuuy8a7] {
    background-color: var(--urm-busy-bg);
    color: var(--urm-busy-color);
    cursor: not-allowed;
}

.urm-btn--sm[b-zqbzuuy8a7] {
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
    font-weight: 700;
}

.urm-btn:disabled[b-zqbzuuy8a7] {
    cursor: not-allowed;
}

/* ---------- Table card ---------- */

.urm-table-card[b-zqbzuuy8a7] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: var(--urm-card-shadow);
    display: flex;
    flex-direction: column;
}

.urm-table-scroll[b-zqbzuuy8a7] {
    overflow-x: auto;
    width: 100%;
}

.urm-table[b-zqbzuuy8a7] {
    width: 100%;
    text-align: left;
    border-collapse: collapse;
}

.urm-table thead tr[b-zqbzuuy8a7] {
    /* background (not background-color): the topbar colour can be a gradient */
    background: var(--urm-thead-bg);
    border-bottom: none;
}

.urm-table th[b-zqbzuuy8a7] {
    padding: 1rem 1.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ins-topbar-item-color);
    white-space: nowrap;
}

.urm-th-actions[b-zqbzuuy8a7] { width: 7.5rem; text-align: right; }

.urm-table tbody tr[b-zqbzuuy8a7] {
    border-bottom: 1px solid var(--urm-border-soft);
    transition: background-color 0.15s ease;
}

.urm-table tbody tr:hover[b-zqbzuuy8a7] {
    background-color: var(--urm-row-hover);
}

.urm-row--selected[b-zqbzuuy8a7] {
    background-color: var(--urm-selected-bg);
    box-shadow: inset 2px 0 0 var(--urm-brand);
}

.urm-table td[b-zqbzuuy8a7] {
    padding: 0.75rem 1.5rem;
    vertical-align: middle;
}

.urm-user-cell[b-zqbzuuy8a7] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.urm-avatar[b-zqbzuuy8a7] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.5rem;
    background-color: var(--urm-avatar-bg);
    border: 1px solid var(--urm-avatar-border);
    color: var(--urm-avatar-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.75rem;
    box-shadow: var(--urm-avatar-shadow);
    flex-shrink: 0;
}

.urm-user-name[b-zqbzuuy8a7] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--urm-heading);
    transition: color 0.15s ease;
}

.urm-table tbody tr:hover .urm-user-name[b-zqbzuuy8a7] {
    color: var(--urm-brand-strong);
}

.urm-user-email[b-zqbzuuy8a7] {
    font-size: 0.75rem;
    color: var(--urm-muted);
}

/* Organisation badges */

.urm-org-badge[b-zqbzuuy8a7] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.625rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.urm-org-badge--rose[b-zqbzuuy8a7]    { background-color: rgba(244, 63, 94, 0.1);   color: var(--urm-org-rose);    border: 1px solid rgba(244, 63, 94, 0.2); }
.urm-org-badge--indigo[b-zqbzuuy8a7]  { background-color: rgba(99, 102, 241, 0.1);  color: var(--urm-org-indigo);  border: 1px solid rgba(99, 102, 241, 0.2); }
.urm-org-badge--amber[b-zqbzuuy8a7]   { background-color: rgba(245, 158, 11, 0.1);  color: var(--urm-org-amber);   border: 1px solid rgba(245, 158, 11, 0.2); }
.urm-org-badge--pink[b-zqbzuuy8a7]    { background-color: rgba(236, 72, 153, 0.1);  color: var(--urm-org-pink);    border: 1px solid rgba(236, 72, 153, 0.2); }
.urm-org-badge--cyan[b-zqbzuuy8a7]    { background-color: rgba(6, 182, 212, 0.1);   color: var(--urm-org-cyan);    border: 1px solid rgba(6, 182, 212, 0.2); }
.urm-org-badge--emerald[b-zqbzuuy8a7] { background-color: rgba(16, 185, 129, 0.1);  color: var(--urm-org-emerald); border: 1px solid rgba(16, 185, 129, 0.2); }
.urm-org-badge--slate[b-zqbzuuy8a7]   { background-color: var(--urm-chip-bg);       color: var(--urm-text-3); }

/* Role pills */

.urm-role-pills[b-zqbzuuy8a7] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    max-width: 24rem;
}

.urm-role-pill[b-zqbzuuy8a7] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.6875rem;
    font-weight: 500;
    background-color: var(--urm-pill-bg);
    color: var(--urm-pill-color);
    border: 1px solid var(--urm-pill-border);
    white-space: nowrap;
}

.urm-no-roles[b-zqbzuuy8a7] {
    font-size: 0.75rem;
    font-style: italic;
    color: var(--urm-faint);
}

/* Status badges */

.urm-status-badge[b-zqbzuuy8a7] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.025em;
    white-space: nowrap;
}

.urm-status-dot[b-zqbzuuy8a7] {
    width: 0.375rem;
    height: 0.375rem;
    border-radius: 9999px;
    margin-right: 0.375rem;
}

.urm-status-badge--active[b-zqbzuuy8a7] {
    background-color: rgba(16, 185, 129, 0.1);
    color: var(--urm-emerald-text);
    border: 1px solid rgba(16, 185, 129, 0.2);
}

.urm-status-badge--active .urm-status-dot[b-zqbzuuy8a7] {
    background-color: var(--urm-emerald-text);
}

.urm-status-badge--inactive[b-zqbzuuy8a7] {
    background-color: var(--urm-chip-bg);
    color: var(--urm-muted);
    border: 1px solid var(--urm-chip-border);
}

/* Invitation not accepted within 7 days — only an admin can re-send it */
.urm-status-badge--expired[b-zqbzuuy8a7] {
    background-color: rgba(225, 29, 72, 0.08);
    color: var(--urm-rose-text);
    border: 1px solid rgba(225, 29, 72, 0.25);
}

.urm-status-badge--expired .urm-status-dot[b-zqbzuuy8a7] {
    background-color: var(--urm-rose-text);
}

/* Several organisations stack as badges */
.urm-org-badges[b-zqbzuuy8a7] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.urm-last-login[b-zqbzuuy8a7] {
    font-size: 0.8125rem;
    white-space: nowrap;
}

.urm-last-login--never[b-zqbzuuy8a7] {
    color: var(--urm-muted);
}

.urm-icon-btn--warn[b-zqbzuuy8a7] {
    color: var(--urm-rose-text);
}

/* Invited, not able to sign in until the invitation is finished */
.urm-status-badge--pending[b-zqbzuuy8a7] {
    background-color: rgba(245, 158, 11, 0.1);
    color: var(--urm-amber-text);
    border: 1px solid rgba(245, 158, 11, 0.2);
}

.urm-status-badge--pending .urm-status-dot[b-zqbzuuy8a7] {
    background-color: var(--urm-amber-text);
}

.urm-status-badge--inactive .urm-status-dot[b-zqbzuuy8a7] {
    background-color: var(--urm-faint);
}

.urm-status-badge--deleted[b-zqbzuuy8a7] {
    background-color: rgba(225, 29, 72, 0.08);
    color: #e11d48;
    border: 1px solid rgba(225, 29, 72, 0.25);
}

.urm-status-badge--deleted .urm-status-dot[b-zqbzuuy8a7] {
    background-color: #e11d48;
}

/* Row action button */

.urm-td-actions[b-zqbzuuy8a7] {
    text-align: right;
}

.urm-icon-btn[b-zqbzuuy8a7] {
    padding: 0.5rem 0.625rem;
    background: transparent;
    border: 1px solid var(--urm-border);
    border-radius: 0.5rem;
    color: var(--urm-brand-strong);
    font-size: 0.75rem;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.urm-icon-btn:hover[b-zqbzuuy8a7] {
    background-color: var(--urm-hover-bg);
    border-color: var(--urm-chip-border);
    color: var(--urm-brand-strong);
}

.urm-actions-group[b-zqbzuuy8a7] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    justify-content: flex-end;
}

/* Destructive action — trash icon button */
.urm-icon-btn--danger[b-zqbzuuy8a7] {
    color: #e11d48;
}

.urm-icon-btn--danger:hover[b-zqbzuuy8a7] {
    background-color: rgba(225, 29, 72, 0.1);
    border-color: rgba(225, 29, 72, 0.35);
    color: #e11d48;
}

/* Checkboxes */

.urm-check[b-zqbzuuy8a7] {
    width: 1.125rem;
    height: 1.125rem;
    border-radius: 0.25rem;
    accent-color: var(--urm-brand);
    background-color: var(--urm-field-bg);
    cursor: pointer;
    flex-shrink: 0;
}

/* ---------- Empty state ---------- */

.urm-empty[b-zqbzuuy8a7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    text-align: center;
    gap: 0.25rem;
}

.urm-empty-icon[b-zqbzuuy8a7] {
    width: 4rem;
    height: 4rem;
    border-radius: 9999px;
    background-color: var(--urm-chip-bg);
    color: var(--urm-faint);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.urm-empty-title[b-zqbzuuy8a7] {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--urm-text);
    margin: 0;
}

.urm-empty-sub[b-zqbzuuy8a7] {
    font-size: 0.875rem;
    color: var(--urm-muted);
    max-width: 28rem;
    margin: 0;
}

.urm-empty-reset[b-zqbzuuy8a7] {
    background: none;
    border: none;
    padding: 0;
    margin-top: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--urm-brand-icon);
    cursor: pointer;
}

.urm-empty-reset:hover[b-zqbzuuy8a7] {
    color: var(--urm-brand-strong);
    text-decoration: underline;
}

/* ---------- Table footer ---------- */

.urm-table-foot[b-zqbzuuy8a7] {
    background-color: var(--urm-foot-bg);
    border-top: 1px solid var(--urm-border);
    padding: 1rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    font-size: 0.75rem;
    color: var(--urm-muted);
}

.urm-foot-strong[b-zqbzuuy8a7] {
    font-weight: 500;
    color: var(--urm-text-2);
}

.urm-foot-left[b-zqbzuuy8a7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.urm-foot-left > label[b-zqbzuuy8a7] {
    margin: 0;
    font-weight: 500;
    color: var(--urm-muted);
    white-space: nowrap;
}

.urm-select--sm[b-zqbzuuy8a7] {
    width: auto;
    padding: 0.375rem 0.625rem;
    font-size: 0.75rem;
}

.urm-foot-divider[b-zqbzuuy8a7] {
    width: 1px;
    height: 1rem;
    background-color: var(--urm-border);
    margin: 0 0.25rem;
}

.urm-foot-pager[b-zqbzuuy8a7] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.urm-pager-btn[b-zqbzuuy8a7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    min-width: 1.9rem;
    padding: 0.375rem 0.625rem;
    background-color: var(--urm-pager-bg);
    border: 1px solid var(--urm-pager-border);
    border-radius: 0.375rem;
    color: var(--urm-pager-color);
    font-size: 0.75rem;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.urm-pager-btn:hover:not(:disabled):not(.urm-pager-btn--active)[b-zqbzuuy8a7] {
    background-color: var(--urm-hover-bg);
}

.urm-pager-btn--active[b-zqbzuuy8a7] {
    background-color: var(--urm-brand-600);
    border-color: var(--urm-brand-600);
    color: #fff;
}

.urm-pager-btn:disabled[b-zqbzuuy8a7] {
    opacity: 0.4;
    cursor: not-allowed;
}

.urm-pager-btn i[b-zqbzuuy8a7] {
    font-size: 0.625rem;
}

/* ---------- Edit drawer ---------- */

.urm-drawer[b-zqbzuuy8a7] {
    position: fixed;
    top: var(--ins-topbar-height, 70px);
    right: 0;
    bottom: 0;
    width: 480px;
    max-width: 100vw;
    background-color: var(--urm-panel);
    border-left: 1px solid var(--urm-border);
    box-shadow: var(--urm-drawer-shadow);
    z-index: 1030;
    display: flex;
    flex-direction: column;
    transform: translateX(105%);
    transition: transform 0.3s ease-in-out, width 0.3s ease-in-out;
    color: var(--urm-text);
}

.urm-drawer--open[b-zqbzuuy8a7] {
    transform: translateX(0);
    /* The panel is mounted only when it opens, so there is no previous value for a
       transition to run from — a keyframe animation does run on a fresh element. */
    animation: urm-slide-in-b-zqbzuuy8a7 0.3s ease-in-out;
}

@keyframes urm-slide-in-b-zqbzuuy8a7 {
    from { transform: translateX(105%); }
    to { transform: translateX(0); }
}

/* Expanded via the ← head button: stretches until it touches the sidenav */
.urm-drawer--expanded[b-zqbzuuy8a7] {
    width: calc(100vw - var(--ins-sidenav-width, 260px));
}

.urm-drawer-head[b-zqbzuuy8a7] {
    padding: 1.5rem;
    border-bottom: 1px solid var(--urm-border);
    background-color: var(--urm-head-bg);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.urm-drawer-head-id[b-zqbzuuy8a7] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.urm-drawer-head-icon[b-zqbzuuy8a7] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 9999px;
    background-color: rgba(20, 184, 166, 0.1);
    border: 1px solid rgba(20, 184, 166, 0.2);
    color: var(--urm-brand-icon);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
}

.urm-drawer-head-icon--danger[b-zqbzuuy8a7] {
    background-color: rgba(225, 29, 72, 0.1);
    border-color: rgba(225, 29, 72, 0.25);
    color: #e11d48;
}

.urm-drawer-title[b-zqbzuuy8a7] {
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--urm-heading);
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.urm-drawer-sub[b-zqbzuuy8a7] {
    font-size: 0.75rem;
    color: var(--urm-muted);
    margin: 0;
}

/* Expand/restore toggle — sits left of the head icon; mirrors the close button */
.urm-drawer-expand[b-zqbzuuy8a7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    color: var(--urm-muted);
    font-size: 1.125rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
    flex-shrink: 0;
}

.urm-drawer-expand:hover[b-zqbzuuy8a7] {
    background-color: var(--urm-hover-bg);
    border-color: var(--urm-chip-border);
    color: var(--urm-heading);
}

.urm-drawer-close[b-zqbzuuy8a7] {
    padding: 0.5rem;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    color: var(--urm-muted);
    font-size: 1.125rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
    flex-shrink: 0;
}

.urm-drawer-close:hover[b-zqbzuuy8a7] {
    background-color: var(--urm-hover-bg);
    border-color: var(--urm-chip-border);
    color: var(--urm-heading);
}

/* Drawer tabs */

.urm-tabs[b-zqbzuuy8a7] {
    display: flex;
    gap: 1.5rem;
    padding: 0 1.5rem;
    border-bottom: 1px solid var(--urm-border);
    background-color: var(--urm-tabs-bg);
}

.urm-tab[b-zqbzuuy8a7] {
    padding: 0.75rem 0;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--urm-muted);
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease;
    white-space: nowrap;
}

.urm-tab:hover[b-zqbzuuy8a7] {
    color: var(--urm-text-2);
}

.urm-tab--active[b-zqbzuuy8a7] {
    border-bottom-color: var(--urm-brand);
    color: var(--urm-brand-strong);
    font-weight: 600;
}

/* Drawer body */

.urm-drawer-body[b-zqbzuuy8a7] {
    flex: 1;
    overflow-y: auto;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    scrollbar-width: thin;
    scrollbar-color: var(--urm-scroll-thumb) var(--urm-panel);
}

.urm-drawer-body[b-zqbzuuy8a7]::-webkit-scrollbar {
    width: 6px;
}

.urm-drawer-body[b-zqbzuuy8a7]::-webkit-scrollbar-track {
    background: var(--urm-panel);
}

.urm-drawer-body[b-zqbzuuy8a7]::-webkit-scrollbar-thumb {
    background: var(--urm-scroll-thumb);
    border-radius: 3px;
}

.urm-profile-preview[b-zqbzuuy8a7] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.5rem;
}

.urm-profile-avatar[b-zqbzuuy8a7] {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 0.75rem;
    background-color: var(--urm-avatar-bg);
    border: 1px solid var(--urm-avatar-border);
    color: var(--urm-avatar-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.125rem;
    box-shadow: var(--urm-avatar-shadow);
    flex-shrink: 0;
}

.urm-profile-hint[b-zqbzuuy8a7] {
    font-size: 0.75rem;
    color: var(--urm-muted);
    margin: 0;
}

.urm-profile-name[b-zqbzuuy8a7] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--urm-heading);
    margin: 0;
}

.urm-mini-badge[b-zqbzuuy8a7] {
    display: inline-block;
    margin-top: 0.25rem;
    padding: 0.125rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.625rem;
    font-weight: 600;
}

.urm-mini-badge--active[b-zqbzuuy8a7] {
    background-color: rgba(16, 185, 129, 0.1);
    color: var(--urm-emerald-text);
    border: 1px solid rgba(16, 185, 129, 0.2);
}

.urm-mini-badge--inactive[b-zqbzuuy8a7] {
    background-color: var(--urm-chip-bg);
    color: var(--urm-muted);
    border: 1px solid var(--urm-chip-border);
}

/* ---------- Form fields ---------- */

.urm-field-row[b-zqbzuuy8a7] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.urm-field[b-zqbzuuy8a7] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.urm-field > label[b-zqbzuuy8a7],
.urm-label-split label[b-zqbzuuy8a7] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--urm-muted);
    margin: 0;
}

.urm-label-soft[b-zqbzuuy8a7] {
    font-size: 0.625rem;
    font-weight: 400;
    color: var(--urm-faint);
}

.urm-label-split[b-zqbzuuy8a7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.urm-field > input[b-zqbzuuy8a7] {
    width: 100%;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 0.875rem;
    font-size: 0.875rem;
    color: var(--urm-text-2);
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.urm-field > input[b-zqbzuuy8a7]::placeholder {
    color: var(--urm-placeholder);
}

.urm-field > input:focus[b-zqbzuuy8a7] {
    border-color: var(--urm-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.urm-textarea[b-zqbzuuy8a7] {
    width: 100%;
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 0.875rem;
    font-size: 0.875rem;
    color: var(--urm-text-2);
    outline: none;
    resize: vertical;
    min-height: 4.5rem;
    font-family: inherit;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.urm-textarea[b-zqbzuuy8a7]::placeholder {
    color: var(--urm-placeholder);
}

.urm-textarea:focus[b-zqbzuuy8a7] {
    border-color: var(--urm-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.urm-required[b-zqbzuuy8a7] {
    color: #e11d48;
}

/* Applies to any invalid field control: inputs, the organisation select and
   the roles list all show the same red border */
.urm-field .urm-input--invalid[b-zqbzuuy8a7] {
    border-color: #e11d48;
}

.urm-field .urm-input--invalid:focus[b-zqbzuuy8a7] {
    border-color: #e11d48;
    box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.15);
}

.urm-field-error[b-zqbzuuy8a7] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: #e11d48;
}

.urm-field-error i[b-zqbzuuy8a7] {
    font-size: 0.875rem;
}

.urm-modal-head-id--danger[b-zqbzuuy8a7] {
    color: #e11d48 !important;
}

/* Status switch */

.urm-switch-row[b-zqbzuuy8a7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem;
    background-color: var(--urm-tile-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
}

.urm-switch-row > span[b-zqbzuuy8a7] {
    font-size: 0.75rem;
    color: var(--urm-text-3);
}

.urm-switch[b-zqbzuuy8a7] {
    position: relative;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    margin: 0;
}

.urm-switch input[b-zqbzuuy8a7] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.urm-switch-track[b-zqbzuuy8a7] {
    width: 2.25rem;
    height: 1.25rem;
    background-color: var(--urm-switch-track);
    border-radius: 9999px;
    position: relative;
    transition: background-color 0.15s ease;
}

.urm-switch-track[b-zqbzuuy8a7]::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 1rem;
    height: 1rem;
    background-color: #fff;
    border-radius: 9999px;
    transition: transform 0.15s ease;
}

.urm-switch input:checked + .urm-switch-track[b-zqbzuuy8a7] {
    background-color: #10b981;
}

.urm-switch input:checked + .urm-switch-track[b-zqbzuuy8a7]::after {
    transform: translateX(1rem);
}

/* Sections */

.urm-section[b-zqbzuuy8a7] {
    border-top: 1px solid var(--urm-border);
    padding-top: 1rem;
    margin-top: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.urm-section-title[b-zqbzuuy8a7] {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--urm-muted);
    margin: 0;
}

.urm-section-title i[b-zqbzuuy8a7] {
    color: var(--urm-brand-icon);
    margin-right: 0.375rem;
}

.urm-warn-note[b-zqbzuuy8a7] {
    display: flex;
    gap: 0.5rem;
    background-color: var(--urm-warn-bg);
    border: 1px solid var(--urm-warn-border);
    color: var(--urm-warn-color);
    font-size: 0.6875rem;
    border-radius: 0.5rem;
    padding: 0.75rem;
}

.urm-warn-note i[b-zqbzuuy8a7] {
    color: var(--urm-amber-text);
    font-size: 0.875rem;
    flex-shrink: 0;
}

/* Invite drawer: why an address's domain can't be invited yet, and what to do about it */

.urm-domain-note[b-zqbzuuy8a7] {
    display: flex;
    gap: 0.625rem;
    border: 1px solid;
    border-radius: 0.5rem;
    padding: 0.75rem;
    font-size: 0.75rem;
    line-height: 1.5;
}

.urm-domain-note > i[b-zqbzuuy8a7] {
    font-size: 1rem;
    flex-shrink: 0;
}

.urm-domain-note--blocked[b-zqbzuuy8a7] {
    background-color: rgba(244, 63, 94, 0.08);
    border-color: rgba(244, 63, 94, 0.25);
    color: var(--urm-rose-text);
}

.urm-domain-note--pending[b-zqbzuuy8a7] {
    background-color: var(--urm-warn-bg);
    border-color: var(--urm-warn-border);
    color: var(--urm-warn-color);
}

.urm-domain-note-body[b-zqbzuuy8a7] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
    flex: 1;
    min-width: 0;
}

.urm-domain-note-body p[b-zqbzuuy8a7] {
    margin: 0;
}

.urm-domain-note-soft[b-zqbzuuy8a7] {
    opacity: 0.85;
}

.urm-domain-note-body .urm-textarea[b-zqbzuuy8a7] {
    min-height: 3.5rem;
    font-size: 0.75rem;
}

.urm-domain-note-link[b-zqbzuuy8a7] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-weight: 600;
    color: inherit;
    text-decoration: underline;
}

/* Roles checklist */

.urm-roles-list[b-zqbzuuy8a7] {
    background-color: var(--urm-tile-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.875rem;
    max-height: 160px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    scrollbar-width: thin;
    scrollbar-color: var(--urm-scroll-thumb) var(--urm-tile-bg);
}

/* Caps the list at three visible rows (30px row + 4px gap + container padding);
   anything beyond the third role scrolls */
.urm-roles-list--tall[b-zqbzuuy8a7] {
    max-height: 128px;
}

.urm-roles-list[b-zqbzuuy8a7]::-webkit-scrollbar {
    width: 6px;
}

.urm-roles-list[b-zqbzuuy8a7]::-webkit-scrollbar-track {
    background: var(--urm-tile-bg);
}

.urm-roles-list[b-zqbzuuy8a7]::-webkit-scrollbar-thumb {
    background: var(--urm-scroll-thumb);
    border-radius: 3px;
}

.urm-role-option[b-zqbzuuy8a7] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.375rem;
    border-radius: 0.25rem;
    color: var(--urm-text-3);
    cursor: pointer;
    user-select: none;
    transition: background-color 0.15s ease, color 0.15s ease;
    margin: 0;
}

.urm-role-option:hover[b-zqbzuuy8a7] {
    background-color: var(--urm-hover-bg);
    color: var(--urm-heading);
}

.urm-role-option span[b-zqbzuuy8a7] {
    font-size: 0.75rem;
}

/* Usage & metadata */

.urm-meta-grid[b-zqbzuuy8a7] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.urm-meta-tile[b-zqbzuuy8a7] {
    background-color: var(--urm-tile-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.75rem;
    padding: 0.875rem;
}

.urm-meta-label[b-zqbzuuy8a7] {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--urm-faint);
    margin: 0;
}

.urm-meta-value[b-zqbzuuy8a7] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--urm-heading);
    margin: 0.25rem 0 0;
}

.urm-meta-value i[b-zqbzuuy8a7] {
    color: var(--urm-brand-icon);
    font-size: 0.75rem;
}

.urm-meta-value--plain[b-zqbzuuy8a7] {
    color: var(--urm-text-2);
}

.urm-meta-value--emerald[b-zqbzuuy8a7] {
    color: var(--urm-emerald-text);
}

/* Invite card */

.urm-invite-card[b-zqbzuuy8a7] {
    background-color: var(--urm-tile-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.75rem;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.urm-invite-hint[b-zqbzuuy8a7] {
    font-size: 0.75rem;
    color: var(--urm-muted);
    margin: 0;
}

.urm-invite-badge[b-zqbzuuy8a7] {
    display: inline-flex;
    align-items: center;
    margin-top: 0.25rem;
    padding: 0.125rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 700;
}

.urm-invite-badge--accepted[b-zqbzuuy8a7] {
    background-color: rgba(16, 185, 129, 0.1);
    color: var(--urm-emerald-text);
    border: 1px solid rgba(16, 185, 129, 0.2);
}

.urm-invite-badge--pending[b-zqbzuuy8a7] {
    background-color: rgba(245, 158, 11, 0.1);
    color: var(--urm-amber-text);
    border: 1px solid rgba(245, 158, 11, 0.2);
}

.urm-invite-badge--expired[b-zqbzuuy8a7] {
    background-color: rgba(244, 63, 94, 0.1);
    color: var(--urm-rose-text);
    border: 1px solid rgba(244, 63, 94, 0.2);
    animation: urm-pulse-b-zqbzuuy8a7 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes urm-pulse-b-zqbzuuy8a7 {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* Drawer footer */

.urm-drawer-foot[b-zqbzuuy8a7] {
    padding: 1.5rem;
    border-top: 1px solid var(--urm-border);
    background-color: var(--urm-head-bg);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
}

/* ---------- New user modal ---------- */

.urm-modal-backdrop[b-zqbzuuy8a7] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    background-color: var(--urm-backdrop);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    overflow-y: auto;
}

.urm-modal[b-zqbzuuy8a7] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    width: 100%;
    max-width: 32rem;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: var(--urm-modal-shadow);
    color: var(--urm-text);
}

.urm-modal-head[b-zqbzuuy8a7] {
    padding: 1.25rem;
    border-bottom: 1px solid var(--urm-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.urm-modal-head-id[b-zqbzuuy8a7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.urm-modal-head-id i[b-zqbzuuy8a7] {
    color: var(--urm-brand-icon);
    font-size: 1.125rem;
}

.urm-modal-head-id h3[b-zqbzuuy8a7] {
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--urm-heading);
    margin: 0;
}

.urm-modal-body[b-zqbzuuy8a7] {
    padding: 1.25rem;
    overflow-y: auto;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    scrollbar-width: thin;
    scrollbar-color: var(--urm-scroll-thumb) var(--urm-panel);
}

.urm-modal-roles[b-zqbzuuy8a7] {
    border-top: 1px solid var(--urm-border-soft);
    padding-top: 0.75rem;
}

.urm-modal-foot[b-zqbzuuy8a7] {
    padding: 1.25rem;
    border-top: 1px solid var(--urm-border);
    background-color: var(--urm-head-bg);
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
}

/* ---------- Toasts ---------- */

.urm-toasts[b-zqbzuuy8a7] {
    position: fixed;
    bottom: 1.5rem;
    right: 1.5rem;
    z-index: 1060;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    pointer-events: none;
}

.urm-toast[b-zqbzuuy8a7] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: 0.5rem;
    border: 1px solid;
    box-shadow: var(--urm-toast-shadow);
    color: var(--urm-toast-text);
    font-size: 0.75rem;
    font-weight: 600;
    pointer-events: auto;
    animation: urm-toast-in-b-zqbzuuy8a7 0.3s ease forwards;
    max-width: 24rem;
}

.urm-toast--closing[b-zqbzuuy8a7] {
    transition: opacity 0.3s ease, transform 0.3s ease;
    opacity: 0;
    transform: translateY(0.5rem);
}

@keyframes urm-toast-in-b-zqbzuuy8a7 {
    from { opacity: 0; transform: translateY(0.5rem); }
    to   { opacity: 1; transform: translateY(0); }
}

.urm-toast--success[b-zqbzuuy8a7] { background-color: var(--urm-toast-success-bg); border-color: var(--urm-toast-success-border); }
.urm-toast--error[b-zqbzuuy8a7]   { background-color: var(--urm-toast-error-bg);   border-color: var(--urm-toast-error-border); }
.urm-toast--warning[b-zqbzuuy8a7] { background-color: var(--urm-toast-warning-bg); border-color: var(--urm-toast-warning-border); }

.urm-toast--success > i[b-zqbzuuy8a7] { color: var(--urm-emerald-text); }
.urm-toast--error > i[b-zqbzuuy8a7]   { color: var(--urm-rose-text); }
.urm-toast--warning > i[b-zqbzuuy8a7] { color: var(--urm-amber-text); }

.urm-toast > button[b-zqbzuuy8a7] {
    background: none;
    border: none;
    padding: 0;
    margin-left: 1rem;
    color: var(--urm-muted);
    font-size: 0.625rem;
    cursor: pointer;
}

.urm-toast > button:hover[b-zqbzuuy8a7] {
    color: var(--urm-heading);
}

/* ---------- Misc ---------- */

.urm-spin[b-zqbzuuy8a7] {
    display: inline-block;
    animation: urm-spin-b-zqbzuuy8a7 0.8s linear infinite;
}

@keyframes urm-spin-b-zqbzuuy8a7 {
    to { transform: rotate(360deg); }
}

/* ---------- Responsive ---------- */

@media (max-width: 1200px) {
    .urm-stats[b-zqbzuuy8a7] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .urm-stats[b-zqbzuuy8a7] {
        grid-template-columns: 1fr;
    }

    .urm-toolbar-filters[b-zqbzuuy8a7] {
        flex-direction: column;
        align-items: stretch;
    }

    .urm-search[b-zqbzuuy8a7] {
        max-width: none;
    }

    .urm-select[b-zqbzuuy8a7] {
        width: 100%;
    }

    .urm-drawer[b-zqbzuuy8a7] {
        width: 100%;
    }

    .urm-field-row[b-zqbzuuy8a7] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Organisation/SurveyProviders.razor.rz.scp.css */
/* ── Survey Providers tab (scoped: svp-) ─────────────────────────────────── */

/* Toolbar + table tokens — same values as the User & Role Management page
   (Users.razor.css) so the two lists read as one component family. */
.svp[b-es47b4ojz2] {
    --svp-panel: #ffffff;
    --svp-border: #e2e8f0;
    --svp-border-soft: rgba(226, 232, 240, 0.7);
    /* table header matches the topbar colour, as on /users and /organisations */
    --svp-thead-bg: var(--ins-topbar-bg);
    --svp-thead-color: var(--ins-topbar-item-color);
    --svp-row-hover: #f8fafc;

    --svp-heading: #0f172a;
    --svp-text-2: #334155;
    --svp-text-3: #475569;
    --svp-muted-color: #64748b;
    --svp-faint: #94a3b8;

    --svp-brand: #14b8a6;
    --svp-brand-strong: #0d9488;

    --svp-field-bg: #ffffff;
    --svp-field-border: #e2e8f0;
    --svp-field-border-hover: #cbd5e1;
    --svp-placeholder: #94a3b8;

    --svp-chip-bg: #f1f5f9;
    --svp-chip-border: #e2e8f0;
    --svp-hover-bg: #f1f5f9;

    --svp-card-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);

    font-size: 0.8125rem;
}

[data-bs-theme="dark"] .svp[b-es47b4ojz2] {
    --svp-panel: #131926;
    --svp-border: #1e293b;
    --svp-border-soft: rgba(30, 41, 59, 0.6);
    --svp-row-hover: rgba(30, 41, 59, 0.2);

    --svp-heading: #ffffff;
    --svp-text-2: #e2e8f0;
    --svp-text-3: #cbd5e1;
    --svp-muted-color: #94a3b8;
    --svp-faint: #64748b;

    --svp-brand-strong: #2dd4bf;

    --svp-field-bg: #0b0f19;
    --svp-field-border: #1e293b;
    --svp-field-border-hover: #334155;
    --svp-placeholder: #64748b;

    --svp-chip-bg: #1e293b;
    --svp-chip-border: #334155;
    --svp-hover-bg: rgba(30, 41, 59, 0.4);

    --svp-card-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.25);
}

.svp-head[b-es47b4ojz2] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--ins-border-color, #e2e8f0);
}

.svp-title[b-es47b4ojz2] {
    font-weight: 700;
    color: var(--svp-heading);
    margin: 0;
}

.svp-sub[b-es47b4ojz2] {
    font-size: 0.75rem;
    color: var(--svp-muted-color);
    margin: 0.25rem 0 0;
    max-width: 60ch;
}

.svp-muted[b-es47b4ojz2] {
    font-size: 0.6875rem;
    color: var(--svp-faint, #94a3b8);
}

/* ── KPI tiles ───────────────────────────────────────────────────────────── */

.svp-stat[b-es47b4ojz2] {
    background: #f8fafc;
    border: 1px solid #eef2f7;
    border-radius: 0.75rem;
    padding: 0.9rem;
    height: 100%;
}

.svp-stat-label[b-es47b4ojz2] {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.svp-stat-value[b-es47b4ojz2] {
    font-size: 1.4rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    margin-top: 0.15rem;
}

.svp-stat-value--key[b-es47b4ojz2] {
    font-size: 1.05rem;
    color: #059669;
    font-family: var(--bs-font-monospace, monospace);
}

.svp-stat-foot[b-es47b4ojz2] {
    font-size: 0.6875rem;
    color: #64748b;
    display: block;
}

/* ── Format pills ────────────────────────────────────────────────────────── */

.svp-fmt[b-es47b4ojz2] {
    display: inline-block;
    padding: 0.15rem 0.45rem;
    border-radius: 0.3rem;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    font-family: var(--bs-font-monospace, monospace);
    border: 1px solid transparent;
}

.svp-fmt--json[b-es47b4ojz2] { background: #eff6ff; color: #1d4ed8; border-color: #bfdbfe; }
.svp-fmt--xml[b-es47b4ojz2]  { background: #f5f3ff; color: #6d28d9; border-color: #ddd6fe; }
.svp-fmt--csv[b-es47b4ojz2]  { background: #fffbeb; color: #b45309; border-color: #fde68a; }

/* ── Toolbar: search + format filter ─────────────────────────────────────
   Card, search field and select all mirror .urm-toolbar / .urm-search /
   .urm-select on the User & Role Management page. */

.svp-toolbar[b-es47b4ojz2] {
    background-color: var(--svp-panel);
    border: 1px solid var(--svp-border);
    border-radius: 0.75rem;
    padding: 1rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    box-shadow: var(--svp-card-shadow);
}

.svp-toolbar-filters[b-es47b4ojz2] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    flex-wrap: wrap;
    min-width: 0;
}

.svp-search[b-es47b4ojz2] {
    position: relative;
    flex: 1;
    min-width: 220px;
    max-width: 28rem;
}

.svp-search > i[b-es47b4ojz2] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--svp-muted-color);
    font-size: 0.875rem;
    pointer-events: none;
}

.svp-search > input[b-es47b4ojz2] {
    width: 100%;
    background-color: var(--svp-field-bg);
    border: 1px solid var(--svp-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 1rem 0.625rem 2.5rem;
    font-size: 0.875rem;
    color: var(--svp-text-2);
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.svp-search > input[b-es47b4ojz2]::placeholder {
    color: var(--svp-placeholder);
}

.svp-search > input:hover[b-es47b4ojz2] {
    border-color: var(--svp-field-border-hover);
}

.svp-search > input:focus[b-es47b4ojz2] {
    border-color: var(--svp-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.svp-select[b-es47b4ojz2] {
    width: 12rem;
    background-color: var(--svp-field-bg);
    border: 1px solid var(--svp-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 0.75rem;
    font-size: 0.875rem;
    color: var(--svp-text-3);
    outline: none;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.svp-select:hover[b-es47b4ojz2] {
    border-color: var(--svp-field-border-hover);
}

.svp-select:focus[b-es47b4ojz2] {
    border-color: var(--svp-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.svp-select > option[b-es47b4ojz2] {
    background-color: var(--svp-panel);
    color: var(--svp-text-2);
}

/* Segmented switches (format / language / body pickers) live in the slide-over
   panel, which sits outside .svp — keep their own literal colours. */
.svp-segment[b-es47b4ojz2] {
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
    background: #f1f5f9;
    border-radius: 0.5rem;
    padding: 0.2rem;
}

.svp-segment-btn[b-es47b4ojz2] {
    border: 0;
    background: transparent;
    border-radius: 0.375rem;
    padding: 0.25rem 0.65rem;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #64748b;
    white-space: nowrap;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.svp-segment-btn:hover[b-es47b4ojz2] {
    color: #0f172a;
}

.svp-segment-btn.active[b-es47b4ojz2] {
    background: #fff;
    color: #0f172a;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
}

/* ── Table ─────────────────────────────────────────────────────────────────
   Card shell, dark topbar-coloured header and row rhythm all match .urm-table
   on the User & Role Management page. */

.svp-table-card[b-es47b4ojz2] {
    background-color: var(--svp-panel);
    border: 1px solid var(--svp-border);
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: var(--svp-card-shadow);
    display: flex;
    flex-direction: column;
}

.svp-table-scroll[b-es47b4ojz2] {
    overflow-x: auto;
    width: 100%;
}

.svp-table[b-es47b4ojz2] {
    width: 100%;
    text-align: left;
    border-collapse: collapse;
}

.svp-table thead tr[b-es47b4ojz2] {
    /* background (not background-color): the topbar colour can be a gradient */
    background: var(--svp-thead-bg);
    border-bottom: none;
}

.svp-table th[b-es47b4ojz2] {
    padding: 1rem 1.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--svp-thead-color);
    white-space: nowrap;
}

.svp-th-actions[b-es47b4ojz2] {
    text-align: right;
}

.svp-table tbody tr[b-es47b4ojz2] {
    border-bottom: 1px solid var(--svp-border-soft);
    transition: background-color 0.15s ease;
}

.svp-table tbody tr:hover[b-es47b4ojz2] {
    background-color: var(--svp-row-hover);
}

.svp-table td[b-es47b4ojz2] {
    padding: 0.75rem 1.5rem;
    vertical-align: middle;
    font-size: 0.75rem;
    color: var(--svp-text-2);
}

.svp-company[b-es47b4ojz2] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--svp-heading);
    transition: color 0.15s ease;
}

.svp-table tbody tr:hover .svp-company[b-es47b4ojz2] {
    color: var(--svp-brand-strong);
}

.svp-address[b-es47b4ojz2] {
    max-width: 16rem;
}

.svp-td-actions[b-es47b4ojz2] {
    text-align: right;
}

.svp-key[b-es47b4ojz2] {
    background: var(--svp-chip-bg, #f1f5f9);
    border: 1px solid var(--svp-chip-border, #e2e8f0);
    border-radius: 0.3rem;
    padding: 0.15rem 0.4rem;
    font-size: 0.6875rem;
    color: var(--svp-text-2, #334155);
    white-space: nowrap;
}

/* Bordered square icon buttons, as in the users table's actions column */
.svp-icon-btn[b-es47b4ojz2] {
    padding: 0.5rem 0.625rem;
    background: transparent;
    border: 1px solid var(--svp-border);
    border-radius: 0.5rem;
    color: var(--svp-brand-strong);
    font-size: 0.75rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.svp-icon-btn:hover[b-es47b4ojz2] {
    background-color: var(--svp-hover-bg);
    border-color: var(--svp-chip-border);
    color: var(--svp-brand-strong);
}

.svp-icon-btn.text-danger:hover[b-es47b4ojz2] {
    background-color: rgba(225, 29, 72, 0.1);
    border-color: rgba(225, 29, 72, 0.35);
    color: #e11d48 !important;
}

.svp-icon-btn.text-warning:hover[b-es47b4ojz2] {
    background-color: rgba(245, 158, 11, 0.1);
    border-color: rgba(245, 158, 11, 0.35);
}

/* Labelled row buttons sit on the same baseline/height as the icon buttons */
.svp-td-actions .btn[b-es47b4ojz2] {
    padding: 0.5rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1;
    border-radius: 0.5rem;
    white-space: nowrap;
}

/* The actions column never wraps onto a second line — the table scrolls instead */
.svp-td-actions > div[b-es47b4ojz2] {
    flex-wrap: nowrap;
}

/* ── Empty state ─────────────────────────────────────────────────────────── */

.svp-empty[b-es47b4ojz2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    text-align: center;
    gap: 0.25rem;
}

.svp-empty-icon[b-es47b4ojz2] {
    width: 4rem;
    height: 4rem;
    border-radius: 9999px;
    background-color: var(--svp-chip-bg);
    color: var(--svp-faint);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.svp-empty-title[b-es47b4ojz2] {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--svp-text-2);
    margin: 0;
}

.svp-empty-sub[b-es47b4ojz2] {
    font-size: 0.875rem;
    color: var(--svp-muted-color);
    max-width: 28rem;
    margin: 0;
}

.svp-empty-reset[b-es47b4ojz2] {
    background: none;
    border: none;
    padding: 0;
    margin-top: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--svp-brand-strong);
    cursor: pointer;
}

.svp-empty-reset:hover[b-es47b4ojz2] {
    text-decoration: underline;
}

.svp-btn-rotate[b-es47b4ojz2] {
    background: #fffbeb;
    border: 1px solid #fde68a;
    color: #b45309;
    font-weight: 600;
}

.svp-btn-rotate:hover[b-es47b4ojz2] {
    background: #fef3c7;
    color: #92400e;
}

/* ── Slide-over panel content ────────────────────────────────────────────── */

.svp-panel[b-es47b4ojz2] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    font-size: 0.8125rem;
}

.svp-section[b-es47b4ojz2] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.svp-section-title[b-es47b4ojz2] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    margin: 0;
}

.svp-card[b-es47b4ojz2] {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    padding: 1rem;
}

.svp-card-head[b-es47b4ojz2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding-bottom: 0.65rem;
    margin-bottom: 0.75rem;
    border-bottom: 1px solid #f1f5f9;
}

.svp-headers[b-es47b4ojz2] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    padding: 0.6rem;
    margin: 0;
    font-size: 0.75rem;
}

.svp-dl[b-es47b4ojz2] {
    display: grid;
    grid-template-columns: 9rem 1fr;
    gap: 0.35rem 0.75rem;
    font-size: 0.75rem;
    margin: 0;
}

.svp-dl dt[b-es47b4ojz2] {
    font-weight: 600;
    color: #64748b;
}

.svp-dl dd[b-es47b4ojz2] {
    margin: 0;
    color: #0f172a;
}

/* Format chooser in the add/edit form */
.svp-format-card[b-es47b4ojz2] {
    width: 100%;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    color: #475569;
    border-radius: 0.6rem;
    padding: 0.7rem 0.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    transition: all 0.15s ease;
}

.svp-format-card:hover[b-es47b4ojz2] {
    background: #f1f5f9;
}

.svp-format-card.active[b-es47b4ojz2] {
    border-color: var(--bs-primary, #2563eb);
    background: #eff6ff;
    color: #1d4ed8;
    font-weight: 700;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

/* Rotation strategy choices */
.svp-choice[b-es47b4ojz2] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    text-align: left;
    width: 100%;
    border: 1px solid #e2e8f0;
    background: #fff;
    border-radius: 0.75rem;
    padding: 0.9rem;
    transition: all 0.15s ease;
}

.svp-choice:hover[b-es47b4ojz2] {
    border-color: #cbd5e1;
}

.svp-choice.active[b-es47b4ojz2] {
    border-color: var(--bs-primary, #2563eb);
    background: rgba(37, 99, 235, 0.04);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

.svp-choice--danger.active[b-es47b4ojz2] {
    border-color: #e11d48;
    background: rgba(225, 29, 72, 0.04);
    box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.12);
}

.svp-choice-title[b-es47b4ojz2] {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #0f172a;
}

.svp-choice-desc[b-es47b4ojz2] {
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.5;
}

.svp-grace[b-es47b4ojz2] {
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 0.5rem;
    padding: 0.75rem;
    color: #92400e;
    font-size: 0.75rem;
}

/* ── Code blocks ─────────────────────────────────────────────────────────── */

.svp-code-card[b-es47b4ojz2] {
    background: #0f172a;
    border: 1px solid #1e293b;
    border-radius: 0.75rem;
    padding: 0.9rem;
    color: #e2e8f0;
}

.svp-code-head[b-es47b4ojz2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.6rem;
    flex-wrap: wrap;
}

.svp-code-title[b-es47b4ojz2] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #34d399;
}

.svp-code[b-es47b4ojz2] {
    background: #020617;
    border: 1px solid #1e293b;
    border-radius: 0.5rem;
    padding: 0.7rem;
    margin: 0;
    font-size: 0.6875rem;
    line-height: 1.6;
    color: #a7f3d0;
    overflow-x: auto;
    white-space: pre;
}

/* Payload reference reads as a document, not a terminal command */
.svp-code--light[b-es47b4ojz2] {
    background: #f8fafc;
    border-color: #e2e8f0;
    color: #334155;
}

.svp-code-foot[b-es47b4ojz2] {
    font-size: 0.6875rem;
    color: #94a3b8;
    line-height: 1.6;
}

.svp-code-card code[b-es47b4ojz2] {
    background: #1e293b;
    color: #93c5fd;
    padding: 0.05rem 0.25rem;
    border-radius: 0.25rem;
}

.svp-live-dot[b-es47b4ojz2] {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: #34d399;
    display: inline-block;
}

/* ── Toasts ──────────────────────────────────────────────────────────────── */

.svp-toasts[b-es47b4ojz2] {
    position: fixed;
    bottom: 1.5rem;
    right: 1.5rem;
    z-index: 10500;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-width: 380px;
}

.svp-toast[b-es47b4ojz2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-left-width: 4px;
    border-radius: 0.5rem;
    padding: 0.65rem 0.85rem;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.14);
}

.svp-toast--success[b-es47b4ojz2] { border-left-color: #059669; }
.svp-toast--success i[b-es47b4ojz2] { color: #059669; }
.svp-toast--error[b-es47b4ojz2]   { border-left-color: #dc2626; }
.svp-toast--error i[b-es47b4ojz2] { color: #dc2626; }

/* ── Responsive ──────────────────────────────────────────────────────────── */

@media (max-width: 767.98px) {
    .svp-toolbar-filters[b-es47b4ojz2] {
        flex-direction: column;
        align-items: stretch;
    }

    .svp-search[b-es47b4ojz2] {
        max-width: none;
    }

    .svp-select[b-es47b4ojz2] {
        width: 100%;
    }
}
/* /Components/Pages/Plates/SitePlates.razor.rz.scp.css */
/* Plate history table — ported from the /users (User & Role Management) table theme.
   Theme-aware: light by default, dark palette under html[data-bs-theme="dark"].
   Tokens live on .plh-page; rules reference tokens only. */

.plh-page[b-i9sm3t2w8a] {
    --plh-panel: #ffffff;
    --plh-border: #e2e8f0;
    --plh-border-soft: rgba(226, 232, 240, 0.7);
    --plh-row-hover: #f8fafc;
    --plh-heading: #0f172a;
    --plh-text-2: #334155;
    --plh-muted: #64748b;
    --plh-faint: #94a3b8;
    --plh-brand-strong: #0d9488;
    --plh-chip-bg: #f1f5f9;
    --plh-chip-border: #e2e8f0;
    --plh-hover-bg: #f1f5f9;
    --plh-avatar-bg: #f1f5f9;
    --plh-avatar-border: #e2e8f0;
    --plh-avatar-color: #475569;
    --plh-avatar-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.06);
    --plh-emerald-text: #059669;
    --plh-card-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);

    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

[data-bs-theme="dark"] .plh-page[b-i9sm3t2w8a] {
    --plh-panel: #131926;
    --plh-border: #1e293b;
    --plh-border-soft: rgba(30, 41, 59, 0.6);
    --plh-row-hover: rgba(30, 41, 59, 0.2);
    --plh-heading: #ffffff;
    --plh-text-2: #e2e8f0;
    --plh-muted: #94a3b8;
    --plh-faint: #64748b;
    --plh-brand-strong: #2dd4bf;
    --plh-chip-bg: #1e293b;
    --plh-chip-border: #334155;
    --plh-hover-bg: rgba(30, 41, 59, 0.4);
    --plh-avatar-bg: #1e293b;
    --plh-avatar-border: rgba(51, 65, 85, 0.8);
    --plh-avatar-color: #cbd5e1;
    --plh-avatar-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);
    --plh-emerald-text: #34d399;
}

/* ---- Header ---- */
.plh-head[b-i9sm3t2w8a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    background-color: var(--plh-panel);
    border: 1px solid var(--plh-border);
    border-radius: 0.75rem;
    box-shadow: var(--plh-card-shadow);
    padding: 1.25rem;
}

/* ---- Table card ---- */
.plh-table-card[b-i9sm3t2w8a] {
    background-color: var(--plh-panel);
    border: 1px solid var(--plh-border);
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: var(--plh-card-shadow);
}

.plh-table-scroll[b-i9sm3t2w8a] {
    overflow-x: auto;
    width: 100%;
}

.plh-table[b-i9sm3t2w8a] {
    width: 100%;
    text-align: left;
    border-collapse: collapse;
}

.plh-table thead tr[b-i9sm3t2w8a] {
    background: var(--ins-topbar-bg);
    border-bottom: none;
}

.plh-table th[b-i9sm3t2w8a] {
    padding: 1rem 1.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ins-topbar-item-color);
    white-space: nowrap;
}

.plh-th-num[b-i9sm3t2w8a] { width: 3rem; }
.plh-th-actions[b-i9sm3t2w8a] { width: 8.5rem; text-align: right; }

.plh-table tbody tr[b-i9sm3t2w8a] {
    border-bottom: 1px solid var(--plh-border-soft);
    transition: background-color 0.15s ease;
}

.plh-table tbody tr:last-child[b-i9sm3t2w8a] { border-bottom: none; }

.plh-table tbody tr:hover[b-i9sm3t2w8a] {
    background-color: var(--plh-row-hover);
}

.plh-table td[b-i9sm3t2w8a] {
    padding: 0.75rem 1.5rem;
    vertical-align: middle;
    color: var(--plh-text-2);
    font-size: 0.875rem;
}

.plh-num[b-i9sm3t2w8a] { color: var(--plh-faint); font-size: 0.8125rem; }

/* ---- Template cell ---- */
.plh-tpl-cell[b-i9sm3t2w8a] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.plh-avatar[b-i9sm3t2w8a] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.5rem;
    background-color: var(--plh-avatar-bg);
    border: 1px solid var(--plh-avatar-border);
    color: var(--plh-avatar-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.875rem;
    box-shadow: var(--plh-avatar-shadow);
    flex-shrink: 0;
}

.plh-tpl-name[b-i9sm3t2w8a] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--plh-heading);
    transition: color 0.15s ease;
}

.plh-table tbody tr:hover .plh-tpl-name[b-i9sm3t2w8a] {
    color: var(--plh-brand-strong);
}

.plh-tpl-sub[b-i9sm3t2w8a] {
    font-size: 0.75rem;
    color: var(--plh-muted);
}

/* ---- Format badge ---- */
.plh-format-badge[b-i9sm3t2w8a] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.125rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.025em;
    white-space: nowrap;
    background-color: rgba(16, 185, 129, 0.1);
    color: var(--plh-emerald-text);
    border: 1px solid rgba(16, 185, 129, 0.2);
}

.plh-by[b-i9sm3t2w8a] { color: var(--plh-text-2); }
.plh-date[b-i9sm3t2w8a] { color: var(--plh-muted); white-space: nowrap; }

/* ---- Actions ---- */
.plh-td-actions[b-i9sm3t2w8a] { text-align: right; }

.plh-icon-btn[b-i9sm3t2w8a] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.4rem 0.7rem;
    background: transparent;
    border: 1px solid var(--plh-border);
    border-radius: 0.5rem;
    color: var(--plh-brand-strong);
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.plh-icon-btn:hover[b-i9sm3t2w8a] {
    background-color: var(--plh-hover-bg);
    border-color: var(--plh-chip-border);
    color: var(--plh-brand-strong);
}

/* ---- Empty state ---- */
.plh-empty[b-i9sm3t2w8a] {
    background-color: var(--plh-panel);
    border: 1px solid var(--plh-border);
    border-radius: 0.75rem;
    box-shadow: var(--plh-card-shadow);
    text-align: center;
    padding: 3rem 1.5rem;
    color: var(--plh-muted);
}

.plh-empty > i[b-i9sm3t2w8a] { font-size: 2rem; display: block; margin-bottom: 0.5rem; color: var(--plh-faint); }
.plh-empty-title[b-i9sm3t2w8a] { font-weight: 600; color: var(--plh-heading); }
.plh-empty-sub[b-i9sm3t2w8a] { font-size: 0.8125rem; }
/* /Components/Shared/HomDocumentViewer.razor.rz.scp.css */
/* Heliport Operations Manual reader — an action bar over the browser's own PDF viewer */

.hdv-wrap[b-er49nz7n52] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.hdv-actions[b-er49nz7n52] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.hdv-actions-end[b-er49nz7n52] {
    margin-left: auto;
    display: inline-flex;
    gap: 0.5rem;
}

.hdv-btn[b-er49nz7n52] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.4rem 0.75rem;
    border-radius: 0.5rem;
    border: 1px solid #e2e8f0;
    background-color: #fff;
    color: #334155;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.hdv-btn:hover:not(:disabled)[b-er49nz7n52] { background-color: #f1f5f9; border-color: #cbd5e1; }
.hdv-btn:disabled[b-er49nz7n52] { opacity: 0.55; cursor: not-allowed; }

.hdv-btn--dark[b-er49nz7n52] { background-color: #0f172a; border-color: #0f172a; color: #fff; }
.hdv-btn--dark:hover:not(:disabled)[b-er49nz7n52] { background-color: #1e293b; border-color: #1e293b; color: #fff; }

.hdv[b-er49nz7n52] {
    height: var(--hdv-height, 70vh);
    min-height: 320px;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    background-color: #f8fafc;
    overflow: hidden;
    display: flex;
}

.hdv-frame[b-er49nz7n52] {
    flex: 1;
    width: 100%;
    height: 100%;
    border: 0;
    background-color: #fff;
}

.hdv-state[b-er49nz7n52] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 1.5rem;
    text-align: center;
}

.hdv-state-icon[b-er49nz7n52] {
    width: 3rem;
    height: 3rem;
    border-radius: 0.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    margin-bottom: 0.25rem;
}

.hdv-state-icon--word[b-er49nz7n52]  { color: #2563eb; background-color: rgba(37, 99, 235, 0.08); border: 1px solid rgba(37, 99, 235, 0.2); }
.hdv-state-icon--error[b-er49nz7n52] { color: #e11d48; background-color: rgba(225, 29, 72, 0.08); border: 1px solid rgba(225, 29, 72, 0.2); }

.hdv-state-title[b-er49nz7n52] {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
    word-break: break-word;
}

.hdv-state-sub[b-er49nz7n52] {
    font-size: 0.75rem;
    color: #64748b;
    margin: 0 0 0.25rem;
    max-width: 22rem;
}

.hdv-spin[b-er49nz7n52] {
    display: inline-block;
    animation: hdv-spin-b-er49nz7n52 0.9s linear infinite;
}

@keyframes hdv-spin-b-er49nz7n52 {
    to { transform: rotate(360deg); }
}

[data-bs-theme="dark"] .hdv[b-er49nz7n52] { background-color: #0b0f19; border-color: #1e293b; }
[data-bs-theme="dark"] .hdv-btn[b-er49nz7n52] { background-color: #131926; border-color: #1e293b; color: #cbd5e1; }
[data-bs-theme="dark"] .hdv-btn:hover:not(:disabled)[b-er49nz7n52] { background-color: #1e293b; border-color: #334155; }
[data-bs-theme="dark"] .hdv-btn--dark[b-er49nz7n52] { background-color: #2dd4bf; border-color: #2dd4bf; color: #0f172a; }
[data-bs-theme="dark"] .hdv-btn--dark:hover:not(:disabled)[b-er49nz7n52] { background-color: #5eead4; border-color: #5eead4; color: #0f172a; }
[data-bs-theme="dark"] .hdv-state-title[b-er49nz7n52] { color: #f1f5f9; }
[data-bs-theme="dark"] .hdv-state-sub[b-er49nz7n52] { color: #94a3b8; }
/* /Components/Shared/IssueDetailDrawer.razor.rz.scp.css */
/* Issue detail slide-out — mirrors the /users edit drawer (urm-drawer) styling */

.idd-drawer[b-10pm6ndfha] {
    position: fixed;
    top: var(--ins-topbar-height, 70px);
    right: 0;
    bottom: 0;
    width: 560px;
    max-width: 100vw;
    background-color: #fff;
    border-left: 1px solid #e2e8f0;
    box-shadow: -10px 0 30px -12px rgba(15, 23, 42, 0.25);
    z-index: 1030;
    display: flex;
    flex-direction: column;
    transform: translateX(105%);
    transition: transform 0.3s ease-in-out, width 0.3s ease-in-out;
    font-size: 0.8125rem;
}

.idd-drawer--open[b-10pm6ndfha] {
    transform: translateX(0);
    /* The panel is mounted only when it opens, so there is no previous value for a
       transition to run from — a keyframe animation does run on a fresh element. */
    animation: idd-slide-in-b-10pm6ndfha 0.3s ease-in-out;
}

@keyframes idd-slide-in-b-10pm6ndfha {
    from { transform: translateX(105%); }
    to { transform: translateX(0); }
}

/* Expanded via the ← head button: stretches until it touches the sidenav */
.idd-drawer--expanded[b-10pm6ndfha] {
    width: calc(100vw - var(--ins-sidenav-width, 260px));
}

/* Head */

.idd-head[b-10pm6ndfha] {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e2e8f0;
    background-color: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-shrink: 0;
}

.idd-head-id[b-10pm6ndfha] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.idd-head-text[b-10pm6ndfha] {
    min-width: 0;
}

.idd-head-icon[b-10pm6ndfha] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 9999px;
    background-color: rgba(225, 29, 72, 0.1);
    border: 1px solid rgba(225, 29, 72, 0.25);
    color: #e11d48;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
}

.idd-title[b-10pm6ndfha] {
    font-size: 0.9375rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.idd-sub[b-10pm6ndfha] {
    font-size: 0.75rem;
    color: #64748b;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.idd-head-actions[b-10pm6ndfha] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
}

.idd-head-btn[b-10pm6ndfha] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    color: #64748b;
    font-size: 1.125rem;
    line-height: 1;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.idd-head-btn:hover[b-10pm6ndfha] {
    background-color: rgba(15, 23, 42, 0.05);
    border-color: #e2e8f0;
    color: #0f172a;
}

/* Tabs */

.idd-tabs[b-10pm6ndfha] {
    display: flex;
    gap: 1.25rem;
    padding: 0 1.5rem;
    border-bottom: 1px solid #e2e8f0;
    background-color: #f8fafc;
    flex-shrink: 0;
    overflow-x: auto;
    scrollbar-width: none;
}

.idd-tab[b-10pm6ndfha] {
    padding: 0.75rem 0;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    font-size: 0.75rem;
    font-weight: 500;
    color: #64748b;
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease;
    white-space: nowrap;
}

.idd-tab:hover[b-10pm6ndfha] {
    color: #334155;
}

.idd-tab--active[b-10pm6ndfha] {
    border-bottom-color: #14b8a6;
    color: #0d9488;
    font-weight: 600;
}

/* In-drawer edit panels (edit issue / assess risk / change authorisation) —
   replace the tab strip with a back button + title while a panel is open */

.idd-panel-head[b-10pm6ndfha] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem 1.5rem;
    border-bottom: 1px solid #e2e8f0;
    background-color: #f8fafc;
    flex-shrink: 0;
}

.idd-panel-title[b-10pm6ndfha] {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #0f172a;
}

.idd-back-btn[b-10pm6ndfha] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    color: #64748b;
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.idd-back-btn:hover[b-10pm6ndfha] {
    background-color: rgba(15, 23, 42, 0.05);
    border-color: #e2e8f0;
    color: #0f172a;
}

.idd-form-field[b-10pm6ndfha] {
    display: flex;
    flex-direction: column;
}

.idd-panel-actions[b-10pm6ndfha] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 0.25rem;
    margin-top: auto;
}

/* Body */

.idd-body[b-10pm6ndfha] {
    flex: 1;
    overflow-y: auto;
    padding: 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    scrollbar-width: thin;
}

.idd-loading[b-10pm6ndfha] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 3rem 0;
    color: #64748b;
    font-size: 0.75rem;
    font-weight: 600;
}

.idd-empty[b-10pm6ndfha] {
    text-align: center;
    color: #94a3b8;
    padding: 2.5rem 1rem;
}

.idd-empty > i[b-10pm6ndfha] {
    display: block;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

/* Details tab */

.idd-widget[b-10pm6ndfha] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.625rem 0.875rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.625rem;
    background-color: #f8fafc;
}

.idd-widget-main[b-10pm6ndfha] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.3rem;
    min-width: 0;
}

/* Every status badge inside a widget renders identically (size, weight, shape) */
.idd-widget .badge[b-10pm6ndfha] {
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1;
    padding: 0.35rem 0.55rem;
    border-radius: 0.375rem;
}

/* Widget action buttons (Edit / Change / Assess) share one compact size */
.idd-widget .btn[b-10pm6ndfha] {
    white-space: nowrap;
    flex-shrink: 0;
}

.idd-widget-label[b-10pm6ndfha] {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
}

.idd-widget-note[b-10pm6ndfha] {
    color: #94a3b8;
    font-size: 0.6875rem;
}

.idd-info-grid[b-10pm6ndfha] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    padding-top: 0.25rem;
}

.idd-info[b-10pm6ndfha] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

.idd-info-label[b-10pm6ndfha] {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
}

/* Updates tab — inline add-update form + table of previous updates */

.idd-update-form[b-10pm6ndfha] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    padding: 1rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.625rem;
    background-color: #fff;
}

.idd-context[b-10pm6ndfha] {
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    background-color: #f1f5f9;
}

.idd-photos[b-10pm6ndfha] {
    border: 1px dashed #cbd5e1;
    border-radius: 0.5rem;
    padding: 1rem;
    text-align: center;
    color: #94a3b8;
}

.idd-photos > i[b-10pm6ndfha] {
    display: block;
    font-size: 1.375rem;
    margin-bottom: 0.25rem;
}

.idd-table-wrap[b-10pm6ndfha] {
    border: 1px solid #e2e8f0;
    border-radius: 0.625rem;
    overflow-x: auto;
}

.idd-table[b-10pm6ndfha] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.75rem;
}

.idd-table thead th[b-10pm6ndfha] {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    background-color: #f8fafc;
    padding: 0.6rem 0.75rem;
    text-align: left;
    border-bottom: 1px solid #e2e8f0;
    white-space: nowrap;
}

.idd-table tbody td[b-10pm6ndfha] {
    padding: 0.6rem 0.75rem;
    border-bottom: 1px solid #eef2f7;
    vertical-align: top;
}

.idd-table tbody tr:last-child td[b-10pm6ndfha] {
    border-bottom: 0;
}

.idd-td-nowrap[b-10pm6ndfha] {
    white-space: nowrap;
}

/* Comments tab — chat window (scrolling messages + pinned input) */

.idd-body--chat[b-10pm6ndfha] {
    padding: 0;
    gap: 0;
    overflow: hidden;
}

.idd-chat-messages[b-10pm6ndfha] {
    flex: 1;
    overflow-y: auto;
    padding: 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    scrollbar-width: thin;
    /* Same canvas as the support chat (hg-chat-body) */
    background: #fbfcfe;
}

.idd-chat-input[b-10pm6ndfha] {
    flex-shrink: 0;
    border-top: 1px solid #e9ecf3;
    background-color: #fff;
    padding: 0.875rem 1rem 1.1rem;
}

/* Composer — same treatment as the support chat (hg-chat-composer) */
.idd-chat-composer[b-10pm6ndfha] {
    position: relative;
}

.idd-chat-composer-input[b-10pm6ndfha] {
    height: 52px;
    border-radius: 14px;
    border: 1px solid #e3e6ef;
    padding: 0 60px 0 18px;
    font-size: 0.875rem;
}

.idd-chat-send[b-10pm6ndfha] {
    position: absolute;
    top: 50%;
    right: 7px;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border-radius: 999px;
    border: none;
    background: var(--ins-topbar-bg, #0b1220);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    transition: filter .15s ease;
}

/* brightness works whether the topbar background is a flat colour or a gradient */
.idd-chat-send:hover:not(:disabled)[b-10pm6ndfha] {
    filter: brightness(1.25);
}

.idd-chat-send:disabled[b-10pm6ndfha] {
    background: #cdd3e1;
}

/* Message row — avatar beside the bubble, like the support chat (hg-chat-row) */
.idd-msg[b-10pm6ndfha] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    max-width: 85%;
}

.idd-msg--own[b-10pm6ndfha] {
    align-self: flex-end;
    justify-content: flex-end;
}

.idd-msg-content[b-10pm6ndfha] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

.idd-msg--own .idd-msg-content[b-10pm6ndfha] {
    align-items: flex-end;
}

/* Dark surfaces match the topbar colour (--ins-topbar-bg) — the variable can be
   a gradient, hence `background` rather than `background-color`. */
.idd-msg-avatar[b-10pm6ndfha] {
    width: 32px;
    height: 32px;
    border-radius: 999px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.625rem;
    font-weight: 700;
    background: var(--ins-topbar-bg, #0b1220);
    color: #fff;
    margin-top: 2px;
}

.idd-msg-avatar--own[b-10pm6ndfha] {
    background: #fff;
    color: #0b1220;
    border: 1.5px solid #0b1220;
}

.idd-msg-author[b-10pm6ndfha] {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: 0.25rem;
}

.idd-msg-author-type[b-10pm6ndfha] {
    font-weight: 500;
    color: #94a3b8;
    margin-left: 0.375rem;
}

/* Bubbles mirror the support chat (hg-chat-bubble): white received messages on the
   grey canvas, the dark topbar colour for your own. */
.idd-msg-bubble[b-10pm6ndfha] {
    padding: 12px 16px;
    font-size: 0.875rem;
    line-height: 1.55;
    border-radius: 4px 14px 14px 14px;
    background: #fff;
    border: 1px solid #e9ecf3;
    color: #1f2937;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    white-space: pre-wrap;
    word-break: break-word;
}

.idd-msg-bubble--own[b-10pm6ndfha] {
    border-radius: 14px 4px 14px 14px;
    /* background (not background-color): the topbar colour can be a gradient */
    background: var(--ins-topbar-bg, #0b1220);
    border: 0;
    color: #fff;
    box-shadow: none;
}

.idd-msg-meta[b-10pm6ndfha] {
    font-size: 0.625rem;
    color: #94a3b8;
    margin-top: 0.25rem;
}

/* Location tab */

.idd-map[b-10pm6ndfha] {
    height: 320px;
    border-radius: 0.5rem;
    border: 1px solid #e2e8f0;
    z-index: 0;
    flex-shrink: 0;
}

/* Timeline tab — narrower time column than the full page */

.idd-timeline-time[b-10pm6ndfha] {
    min-width: 92px;
    font-size: 0.6875rem;
}

/* ── Dark theme ── */

[data-bs-theme="dark"] .idd-drawer[b-10pm6ndfha] {
    background-color: #131926;
    border-left-color: #1e293b;
    box-shadow: -10px 0 30px -12px rgba(0, 0, 0, 0.6);
}

[data-bs-theme="dark"] .idd-head[b-10pm6ndfha],
[data-bs-theme="dark"] .idd-tabs[b-10pm6ndfha],
[data-bs-theme="dark"] .idd-panel-head[b-10pm6ndfha] {
    background-color: #0f1422;
    border-color: #1e293b;
}

[data-bs-theme="dark"] .idd-panel-title[b-10pm6ndfha] {
    color: #f1f5f9;
}

[data-bs-theme="dark"] .idd-back-btn[b-10pm6ndfha] {
    color: #94a3b8;
}

[data-bs-theme="dark"] .idd-back-btn:hover[b-10pm6ndfha] {
    background-color: rgba(148, 163, 184, 0.1);
    border-color: #1e293b;
    color: #f1f5f9;
}

[data-bs-theme="dark"] .idd-title[b-10pm6ndfha] {
    color: #f1f5f9;
}

[data-bs-theme="dark"] .idd-sub[b-10pm6ndfha],
[data-bs-theme="dark"] .idd-tab[b-10pm6ndfha],
[data-bs-theme="dark"] .idd-head-btn[b-10pm6ndfha] {
    color: #94a3b8;
}

[data-bs-theme="dark"] .idd-tab:hover[b-10pm6ndfha] {
    color: #cbd5e1;
}

[data-bs-theme="dark"] .idd-tab--active[b-10pm6ndfha] {
    border-bottom-color: #14b8a6;
    color: #2dd4bf;
}

[data-bs-theme="dark"] .idd-head-btn:hover[b-10pm6ndfha] {
    background-color: rgba(148, 163, 184, 0.1);
    border-color: #1e293b;
    color: #f1f5f9;
}

[data-bs-theme="dark"] .idd-widget[b-10pm6ndfha] {
    background-color: #0f1422;
    border-color: #1e293b;
}

[data-bs-theme="dark"] .idd-map[b-10pm6ndfha] {
    border-color: #1e293b;
}

[data-bs-theme="dark"] .idd-update-form[b-10pm6ndfha] {
    background-color: #131926;
    border-color: #1e293b;
}

[data-bs-theme="dark"] .idd-context[b-10pm6ndfha] {
    background-color: #0f1422;
}

[data-bs-theme="dark"] .idd-photos[b-10pm6ndfha] {
    border-color: #334155;
}

[data-bs-theme="dark"] .idd-table-wrap[b-10pm6ndfha] {
    border-color: #1e293b;
}

[data-bs-theme="dark"] .idd-table thead th[b-10pm6ndfha] {
    background-color: #0f1422;
    border-bottom-color: #1e293b;
    color: #94a3b8;
}

[data-bs-theme="dark"] .idd-table tbody td[b-10pm6ndfha] {
    border-bottom-color: rgba(30, 41, 59, 0.6);
}

[data-bs-theme="dark"] .idd-chat-input[b-10pm6ndfha] {
    background-color: #0f1422;
    border-top-color: #1e293b;
}

[data-bs-theme="dark"] .idd-chat-composer-input[b-10pm6ndfha] {
    background-color: #0b0f19;
    border-color: #1e293b;
    color: #e2e8f0;
}

[data-bs-theme="dark"] .idd-chat-send:disabled[b-10pm6ndfha] {
    background: #1e293b;
    color: #64748b;
}

[data-bs-theme="dark"] .idd-msg-avatar--own[b-10pm6ndfha] {
    background: #131926;
    color: #e2e8f0;
    border-color: #475569;
}

[data-bs-theme="dark"] .idd-msg-author[b-10pm6ndfha] {
    color: #cbd5e1;
}

[data-bs-theme="dark"] .idd-chat-messages[b-10pm6ndfha] {
    background: #0b0f19;
}

[data-bs-theme="dark"] .idd-msg-bubble[b-10pm6ndfha] {
    background: #131926;
    border-color: #1e293b;
    color: #e2e8f0;
    box-shadow: none;
}

/* The dark topbar bubble would vanish on the dark canvas — keep the teal tint
   so your own messages stay distinguishable in dark mode. */
[data-bs-theme="dark"] .idd-msg-bubble--own[b-10pm6ndfha] {
    background: rgba(45, 212, 191, 0.12);
    border: 1px solid rgba(45, 212, 191, 0.25);
    color: #f1f5f9;
}
/* /Components/Shared/LoadingIndicator.razor.rz.scp.css */
/* Matches the /users (urm-empty) and /sites (hgs-empty) loading blocks so every page/section
   loader is identical in format, style and size. Theme-aware: light default, dark override. */

.hg-loading[b-qffehmkfc0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    text-align: center;
    gap: 0.25rem;
}

.hg-loading-icon[b-qffehmkfc0] {
    width: 4rem;
    height: 4rem;
    border-radius: 9999px;
    /* White (not the page/card tint) with a soft ring so the spinner reads as a
       raised element instead of blending into the surface behind it. */
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);
    color: #64748b;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.hg-loading-title[b-qffehmkfc0] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
}

.hg-loading-sub[b-qffehmkfc0] {
    font-size: 0.875rem;
    color: #64748b;
    max-width: 28rem;
    margin: 0;
}

.hg-loading-spin[b-qffehmkfc0] {
    display: inline-block;
    animation: hg-loading-spin-b-qffehmkfc0 0.8s linear infinite;
}

@keyframes hg-loading-spin-b-qffehmkfc0 {
    to { transform: rotate(360deg); }
}

[data-bs-theme="dark"] .hg-loading-icon[b-qffehmkfc0] {
    /* White here too, so the spinner lifts off the dark surface behind it. */
    background-color: #ffffff;
    border-color: rgba(255, 255, 255, 0.85);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
    color: #475569;
}

[data-bs-theme="dark"] .hg-loading-title[b-qffehmkfc0] {
    color: #f1f5f9;
}

[data-bs-theme="dark"] .hg-loading-sub[b-qffehmkfc0] {
    color: #94a3b8;
}
/* /Components/Shared/MultiSelectDropdown.razor.rz.scp.css */
.hg-msd[b-h829f8fq8r] { position: relative; }

.hg-msd-toggle[b-h829f8fq8r] {
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.hg-msd-placeholder[b-h829f8fq8r] { color: var(--ins-secondary-color, #8a969c); }

.hg-msd-backdrop[b-h829f8fq8r] {
    position: fixed;
    inset: 0;
    z-index: 1040;
}

.hg-msd-menu[b-h829f8fq8r] {
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    right: 0;
    z-index: 1050;
    max-height: 16rem;
    overflow-y: auto;
    padding: .25rem 0;
    background: var(--ins-body-bg, #fff);
    border: 1px solid var(--ins-border-color, #dee2e6);
    border-radius: .3rem;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);
}

.hg-msd-option[b-h829f8fq8r] {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .45rem .9rem;
    margin: 0;
    cursor: pointer;
}

.hg-msd-option:hover[b-h829f8fq8r] { background: var(--ins-tertiary-bg, #f6f7fb); }
/* /Components/Shared/RaiseIssueDrawer.razor.rz.scp.css */
/* Raise Issue slide-out — tabbed drawer mirroring the raise_issue_tabbed_drawer design,
   restyled to match the app's drawer system (see IssueDetailDrawer) */

.rid-drawer[b-vcxjti63m6] {
    position: fixed;
    top: var(--ins-topbar-height, 70px);
    right: 0;
    bottom: 0;
    width: 600px;
    max-width: 100vw;
    background-color: #fff;
    border-left: 1px solid #e2e8f0;
    box-shadow: -10px 0 30px -12px rgba(15, 23, 42, 0.25);
    z-index: 1030;
    display: flex;
    flex-direction: column;
    transform: translateX(105%);
    transition: transform 0.3s ease-in-out, width 0.3s ease-in-out;
    font-size: 0.8125rem;
}

.rid-drawer--open[b-vcxjti63m6] {
    transform: translateX(0);
    /* The panel is mounted only when it opens, so there is no previous value for a
       transition to run from — a keyframe animation does run on a fresh element. */
    animation: rid-slide-in-b-vcxjti63m6 0.3s ease-in-out;
}

@keyframes rid-slide-in-b-vcxjti63m6 {
    from { transform: translateX(105%); }
    to { transform: translateX(0); }
}

/* Expanded via the ← head button: stretches until it touches the sidenav */
.rid-drawer--expanded[b-vcxjti63m6] {
    width: calc(100vw - var(--ins-sidenav-width, 260px));
}

/* Head */

.rid-head[b-vcxjti63m6] {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e2e8f0;
    background-color: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-shrink: 0;
}

.rid-head-id[b-vcxjti63m6] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.rid-head-icon[b-vcxjti63m6] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 9999px;
    background-color: rgba(13, 148, 136, 0.1);
    border: 1px solid rgba(13, 148, 136, 0.25);
    color: #0d9488;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
}

.rid-title[b-vcxjti63m6] {
    font-size: 0.9375rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.rid-sub[b-vcxjti63m6] {
    font-size: 0.75rem;
    color: #64748b;
    margin: 0;
}

.rid-head-btn[b-vcxjti63m6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    color: #64748b;
    font-size: 1.125rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
    flex-shrink: 0;
}

.rid-head-btn:hover[b-vcxjti63m6] {
    background-color: rgba(15, 23, 42, 0.05);
    border-color: #e2e8f0;
    color: #0f172a;
}

/* Tabs */

.rid-tabs[b-vcxjti63m6] {
    display: flex;
    gap: 1.25rem;
    padding: 0 1.5rem;
    border-bottom: 1px solid #e2e8f0;
    background-color: #f8fafc;
    flex-shrink: 0;
}

.rid-tab[b-vcxjti63m6] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.75rem 0;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    font-size: 0.75rem;
    font-weight: 500;
    color: #64748b;
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease;
    white-space: nowrap;
}

.rid-tab:hover[b-vcxjti63m6] {
    color: #334155;
}

.rid-tab--active[b-vcxjti63m6] {
    border-bottom-color: #14b8a6;
    color: #0d9488;
    font-weight: 600;
}

/* Missing-required-fields indicator (design: small red dot on the tab) */
.rid-tab-dot[b-vcxjti63m6] {
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background-color: #e11d48;
}

/* Body */

.rid-body[b-vcxjti63m6] {
    flex: 1;
    overflow-y: auto;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    scrollbar-width: thin;
}

.rid-note[b-vcxjti63m6] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border: 1px solid rgba(13, 148, 136, 0.2);
    border-radius: 0.5rem;
    background-color: rgba(13, 148, 136, 0.06);
    color: #0f766e;
    font-size: 0.75rem;
}

.rid-note > i[b-vcxjti63m6] {
    flex-shrink: 0;
    margin-top: 1px;
}

.rid-field-row[b-vcxjti63m6] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.rid-coord-row[b-vcxjti63m6] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1rem;
}

.rid-photos[b-vcxjti63m6] {
    border: 2px dashed #e2e8f0;
    border-radius: 0.75rem;
    padding: 1.5rem;
    text-align: center;
    color: #64748b;
    background-color: #f8fafc;
}

/* Pre-creation: greyed out until the issue exists */
.rid-photos--disabled[b-vcxjti63m6] {
    opacity: 0.65;
    cursor: not-allowed;
}

/* Post-creation: opens the file selector (label wired to the hidden InputFile) */
.rid-photos--clickable[b-vcxjti63m6] {
    display: block;
    width: 100%;
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.rid-photos--clickable:hover[b-vcxjti63m6] {
    border-color: #14b8a6;
    background-color: rgba(13, 148, 136, 0.04);
}

.rid-photo-list[b-vcxjti63m6] {
    list-style: none;
    margin: 0.5rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.75rem;
    color: #475569;
}

.rid-photo-list > li > i[b-vcxjti63m6] {
    color: #16a34a;
    margin-right: 0.375rem;
}

.rid-photos-icon[b-vcxjti63m6] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 9999px;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    color: #0d9488;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.125rem;
    margin-bottom: 0.5rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

/* Location tab */

.rid-map[b-vcxjti63m6] {
    height: 300px;
    border-radius: 0.5rem;
    border: 1px solid #e2e8f0;
    z-index: 0;
    flex-shrink: 0;
}

.rid-map-hint[b-vcxjti63m6] {
    color: #0d9488;
    font-weight: 600;
    font-size: 0.6875rem;
}

/* Shown in place of the hint once the pin has been moved off the site centre */
.rid-map-reset[b-vcxjti63m6] {
    border: 1px solid #e2e8f0;
    background-color: #f8fafc;
    border-radius: 0.375rem;
    color: #475569;
    font-weight: 600;
    font-size: 0.6875rem;
    padding: 0.125rem 0.5rem;
    line-height: 1.5;
}

.rid-map-reset:hover[b-vcxjti63m6] {
    border-color: #cbd5e1;
    color: #0f172a;
}

.rid-map-empty[b-vcxjti63m6] {
    text-align: center;
    color: #94a3b8;
    padding: 2.5rem 1rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    background-color: #f8fafc;
}

.rid-map-empty > i[b-vcxjti63m6] {
    display: block;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

/* About tab */

.rid-about-panel[b-vcxjti63m6] {
    padding: 1rem;
    border: 1px solid rgba(13, 148, 136, 0.2);
    border-radius: 0.75rem;
    background-color: rgba(13, 148, 136, 0.05);
    font-size: 0.75rem;
}

.rid-about-title[b-vcxjti63m6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #0f766e;
    margin-bottom: 0.5rem;
}

.rid-section-label[b-vcxjti63m6] {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
}

.rid-steps[b-vcxjti63m6] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    position: relative;
}

.rid-steps[b-vcxjti63m6]::before {
    content: "";
    position: absolute;
    left: 17px;
    top: 0.5rem;
    bottom: 0.5rem;
    width: 2px;
    background-color: #e2e8f0;
}

.rid-step[b-vcxjti63m6] {
    display: flex;
    gap: 1rem;
    position: relative;
}

.rid-step-num[b-vcxjti63m6] {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.75rem;
    flex-shrink: 0;
    z-index: 1;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.rid-step-num--emerald[b-vcxjti63m6] { background-color: rgba(16, 185, 129, 0.1); color: #047857; border: 1px solid rgba(16, 185, 129, 0.3); }
.rid-step-num--sky[b-vcxjti63m6] { background-color: rgba(14, 165, 233, 0.1); color: #0369a1; border: 1px solid rgba(14, 165, 233, 0.3); }
.rid-step-num--purple[b-vcxjti63m6] { background-color: rgba(147, 51, 234, 0.1); color: #7e22ce; border: 1px solid rgba(147, 51, 234, 0.3); }

.rid-step-title[b-vcxjti63m6] {
    font-size: 0.75rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0.35rem 0 0.125rem;
}

.rid-step-text[b-vcxjti63m6] {
    font-size: 0.6875rem;
    color: #64748b;
    margin: 0;
}

.rid-cat-grid[b-vcxjti63m6] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
}

.rid-cat-card[b-vcxjti63m6] {
    padding: 0.625rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    background-color: #f8fafc;
}

.rid-cat-text[b-vcxjti63m6] {
    font-size: 0.625rem;
    color: #64748b;
    margin: 0.375rem 0 0;
}

/* Footer */

.rid-foot[b-vcxjti63m6] {
    padding: 1rem 1.5rem;
    border-top: 1px solid #e2e8f0;
    background-color: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-shrink: 0;
}

.rid-foot-actions[b-vcxjti63m6] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.rid-validation[b-vcxjti63m6] {
    font-size: 0.6875rem;
    font-weight: 700;
    color: #e11d48;
    max-width: 240px;
    text-align: right;
}

.rid-btn-submit[b-vcxjti63m6] {
    color: #fff;
    background: linear-gradient(90deg, #0d9488, #0f766e);
    border: 0;
    border-radius: 0.5rem;
    font-weight: 600;
    padding: 0.45rem 0.9rem;
    box-shadow: 0 4px 10px -4px rgba(13, 148, 136, 0.6);
    white-space: nowrap;
    transition: all 0.15s ease;
}

.rid-btn-submit:hover[b-vcxjti63m6],
.rid-btn-submit:focus[b-vcxjti63m6] {
    color: #fff;
    background: linear-gradient(90deg, #14b8a6, #0d9488);
}

.rid-btn-submit:disabled[b-vcxjti63m6] {
    color: #fff;
    opacity: 0.65;
}

/* Success toast (design: bottom-centre notification) */

.rid-toast[b-vcxjti63m6] {
    position: fixed;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10500;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.25rem;
    border-radius: 0.75rem;
    background-color: #0f172a;
    color: #fff;
    border: 1px solid #334155;
    box-shadow: 0 20px 25px -5px rgba(15, 23, 42, 0.4);
    animation: ridToastIn-b-vcxjti63m6 0.25s ease;
}

.rid-toast > i[b-vcxjti63m6] {
    font-size: 1.25rem;
    color: #34d399;
    flex-shrink: 0;
}

.rid-toast-title[b-vcxjti63m6] {
    font-size: 0.8125rem;
    font-weight: 700;
    margin: 0;
}

.rid-toast-sub[b-vcxjti63m6] {
    font-size: 0.6875rem;
    color: #cbd5e1;
    margin: 0;
}

@keyframes ridToastIn-b-vcxjti63m6 {
    from { opacity: 0; transform: translate(-50%, 8px); }
    to { opacity: 1; transform: translate(-50%, 0); }
}

/* ── Dark theme ── */

[data-bs-theme="dark"] .rid-drawer[b-vcxjti63m6] {
    background-color: #131926;
    border-left-color: #1e293b;
    box-shadow: -10px 0 30px -12px rgba(0, 0, 0, 0.6);
}

[data-bs-theme="dark"] .rid-head[b-vcxjti63m6],
[data-bs-theme="dark"] .rid-tabs[b-vcxjti63m6],
[data-bs-theme="dark"] .rid-foot[b-vcxjti63m6] {
    background-color: #0f1422;
    border-color: #1e293b;
}

[data-bs-theme="dark"] .rid-title[b-vcxjti63m6] {
    color: #f1f5f9;
}

[data-bs-theme="dark"] .rid-sub[b-vcxjti63m6],
[data-bs-theme="dark"] .rid-tab[b-vcxjti63m6],
[data-bs-theme="dark"] .rid-head-btn[b-vcxjti63m6],
[data-bs-theme="dark"] .rid-section-label[b-vcxjti63m6] {
    color: #94a3b8;
}

[data-bs-theme="dark"] .rid-tab:hover[b-vcxjti63m6] {
    color: #cbd5e1;
}

[data-bs-theme="dark"] .rid-tab--active[b-vcxjti63m6] {
    border-bottom-color: #14b8a6;
    color: #2dd4bf;
}

[data-bs-theme="dark"] .rid-head-btn:hover[b-vcxjti63m6] {
    background-color: rgba(148, 163, 184, 0.1);
    border-color: #1e293b;
    color: #f1f5f9;
}

[data-bs-theme="dark"] .rid-note[b-vcxjti63m6] {
    background-color: rgba(45, 212, 191, 0.06);
    border-color: rgba(45, 212, 191, 0.2);
    color: #2dd4bf;
}

[data-bs-theme="dark"] .rid-photos[b-vcxjti63m6],
[data-bs-theme="dark"] .rid-map-empty[b-vcxjti63m6],
[data-bs-theme="dark"] .rid-cat-card[b-vcxjti63m6] {
    background-color: #0f1422;
    border-color: #1e293b;
}

[data-bs-theme="dark"] .rid-photos-icon[b-vcxjti63m6] {
    background-color: #131926;
    border-color: #1e293b;
    color: #2dd4bf;
}

[data-bs-theme="dark"] .rid-photos--clickable:hover[b-vcxjti63m6] {
    border-color: #2dd4bf;
    background-color: rgba(45, 212, 191, 0.06);
}

[data-bs-theme="dark"] .rid-photo-list[b-vcxjti63m6] {
    color: #94a3b8;
}

[data-bs-theme="dark"] .rid-map[b-vcxjti63m6] {
    border-color: #1e293b;
}

[data-bs-theme="dark"] .rid-map-reset[b-vcxjti63m6] {
    background-color: #0f1422;
    border-color: #1e293b;
    color: #94a3b8;
}

[data-bs-theme="dark"] .rid-map-reset:hover[b-vcxjti63m6] {
    border-color: #334155;
    color: #e2e8f0;
}

[data-bs-theme="dark"] .rid-about-panel[b-vcxjti63m6] {
    background-color: rgba(45, 212, 191, 0.05);
    border-color: rgba(45, 212, 191, 0.2);
}

[data-bs-theme="dark"] .rid-about-title[b-vcxjti63m6] {
    color: #2dd4bf;
}

[data-bs-theme="dark"] .rid-steps[b-vcxjti63m6]::before {
    background-color: #1e293b;
}

[data-bs-theme="dark"] .rid-step-title[b-vcxjti63m6] {
    color: #f1f5f9;
}
/* /Components/Shared/SessionTimeoutBanner.razor.rz.scp.css */
/* Session timeout heads-up — a fixed card under the topbar, above drawers and page toasts. Theme
   colours come from Bootstrap's variables so it follows light/dark with the rest of the app. */

.stb[b-n2r29t0z5d] {
    position: fixed;
    top: calc(var(--ins-topbar-height, 70px) + 0.75rem);
    left: 50%;
    transform: translateX(-50%);
    z-index: 1085;
    width: min(28rem, calc(100vw - 2rem));
    display: flex;
    gap: 0.875rem;
    padding: 1rem 1.125rem;
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.75rem;
    box-shadow: 0 18px 40px -16px rgba(15, 23, 42, 0.35);
    animation: stb-in-b-n2r29t0z5d 0.25s ease-out;
}

@keyframes stb-in-b-n2r29t0z5d {
    from { opacity: 0; transform: translate(-50%, -0.5rem); }
    to { opacity: 1; transform: translate(-50%, 0); }
}

@media (prefers-reduced-motion: reduce) {
    .stb[b-n2r29t0z5d] { animation: none; }
}

.stb-icon[b-n2r29t0z5d] {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
}

.stb-icon--warning[b-n2r29t0z5d] {
    background-color: var(--bs-warning-bg-subtle);
    color: var(--bs-warning-text-emphasis);
}

.stb-icon--info[b-n2r29t0z5d] {
    background-color: var(--bs-info-bg-subtle);
    color: var(--bs-info-text-emphasis);
}

.stb-main[b-n2r29t0z5d] {
    min-width: 0;
    flex: 1;
}

.stb-title[b-n2r29t0z5d] {
    font-size: 0.9375rem;
    font-weight: 700;
    margin: 0 0 0.25rem;
}

.stb-body[b-n2r29t0z5d] {
    font-size: 0.8125rem;
    color: var(--bs-secondary-color);
    margin: 0 0 0.75rem;
}

.stb-count[b-n2r29t0z5d] {
    color: var(--bs-body-color);
    font-variant-numeric: tabular-nums;
}

.stb-error[b-n2r29t0z5d] {
    font-size: 0.75rem;
    color: var(--bs-danger-text-emphasis);
    margin: -0.25rem 0 0.75rem;
}

.stb-actions[b-n2r29t0z5d] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
/* /Components/Shared/SiteAccessUsers.razor.rz.scp.css */
/* Site access list — the /users (User & Role Management) table theme, scoped to this
   component so the Contacts tab renders the access list exactly like the /users register.
   Theme-aware: light by default, dark palette under html[data-bs-theme="dark"].
   Tokens live on .urm-access; rules reference tokens only. */

.urm-access[b-vg9q1jdqnh] {
    --urm-panel: #ffffff;
    --urm-border: #e2e8f0;
    --urm-border-soft: rgba(226, 232, 240, 0.7);
    --urm-chip-bg: #f1f5f9;
    --urm-row-hover: #f8fafc;
    --urm-heading: #0f172a;
    --urm-text-2: #334155;
    --urm-text-3: #475569;
    --urm-muted: #64748b;
    --urm-faint: #94a3b8;
    --urm-brand: #14b8a6;
    --urm-brand-600: #0d9488;
    --urm-brand-strong: #0d9488;

    --urm-foot-bg: #f8fafc;
    --urm-hover-bg: #f1f5f9;
    --urm-field-bg: #ffffff;
    --urm-field-border: #e2e8f0;
    --urm-field-border-hover: #cbd5e1;
    --urm-pager-bg: #ffffff;
    --urm-pager-border: #e2e8f0;
    --urm-pager-color: #475569;

    --urm-avatar-bg: #f1f5f9;
    --urm-avatar-border: #e2e8f0;
    --urm-avatar-color: #475569;
    --urm-avatar-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.06);

    --urm-emerald-text: #059669;
    --urm-cyan-text: #0891b2;

    --urm-org-rose: #e11d48;
    --urm-org-indigo: #4f46e5;
    --urm-org-amber: #b45309;
    --urm-org-pink: #db2777;
    --urm-org-cyan: #0e7490;
    --urm-org-emerald: #059669;

    --urm-pill-bg: #ecfeff;
    --urm-pill-color: #0e7490;
    --urm-pill-border: #a5f3fc;

    --urm-card-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);
}

[data-bs-theme="dark"] .urm-access[b-vg9q1jdqnh] {
    --urm-panel: #131926;
    --urm-border: #1e293b;
    --urm-border-soft: rgba(30, 41, 59, 0.6);
    --urm-chip-bg: #1e293b;
    --urm-row-hover: rgba(30, 41, 59, 0.2);
    --urm-heading: #ffffff;
    --urm-text-2: #e2e8f0;
    --urm-text-3: #cbd5e1;
    --urm-muted: #94a3b8;
    --urm-faint: #64748b;
    --urm-brand: #14b8a6;
    --urm-brand-600: #0d9488;
    --urm-brand-strong: #2dd4bf;

    --urm-foot-bg: rgba(30, 41, 59, 0.2);
    --urm-hover-bg: rgba(30, 41, 59, 0.4);
    --urm-field-bg: #0b0f19;
    --urm-field-border: #1e293b;
    --urm-field-border-hover: #334155;
    --urm-pager-bg: rgba(30, 41, 59, 0.5);
    --urm-pager-border: rgba(51, 65, 85, 0.5);
    --urm-pager-color: #cbd5e1;

    --urm-avatar-bg: #1e293b;
    --urm-avatar-border: rgba(51, 65, 85, 0.8);
    --urm-avatar-color: #cbd5e1;
    --urm-avatar-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);

    --urm-emerald-text: #34d399;
    --urm-cyan-text: #22d3ee;

    --urm-org-rose: #fb7185;
    --urm-org-indigo: #818cf8;
    --urm-org-amber: #fbbf24;
    --urm-org-pink: #f472b6;
    --urm-org-cyan: #22d3ee;
    --urm-org-emerald: #34d399;

    --urm-pill-bg: #083344;
    --urm-pill-color: #22d3ee;
    --urm-pill-border: rgba(21, 94, 117, 0.4);

    --urm-card-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.25);
}

/* Status notes (loading / failed) */
.urm-access-note[b-vg9q1jdqnh] {
    display: flex;
    align-items: center;
    font-size: 0.8125rem;
    color: var(--urm-muted);
    padding: 0.5rem 0;
}

.urm-access-note--warn[b-vg9q1jdqnh] { color: #b45309; }
[data-bs-theme="dark"] .urm-access-note--warn[b-vg9q1jdqnh] { color: #fbbf24; }

/* ---- Table card ---- */
.urm-table-card[b-vg9q1jdqnh] {
    background-color: var(--urm-panel);
    border: 1px solid var(--urm-border);
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: var(--urm-card-shadow);
}

.urm-table-scroll[b-vg9q1jdqnh] {
    overflow-x: auto;
    width: 100%;
}

.urm-table[b-vg9q1jdqnh] {
    width: 100%;
    text-align: left;
    border-collapse: collapse;
}

.urm-table thead tr[b-vg9q1jdqnh] {
    background: var(--ins-topbar-bg);
    border-bottom: none;
}

.urm-table th[b-vg9q1jdqnh] {
    padding: 1rem 1.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ins-topbar-item-color);
    white-space: nowrap;
}

.urm-table tbody tr[b-vg9q1jdqnh] {
    border-bottom: 1px solid var(--urm-border-soft);
    transition: background-color 0.15s ease;
}

.urm-table tbody tr:last-child[b-vg9q1jdqnh] { border-bottom: none; }

.urm-table tbody tr:hover[b-vg9q1jdqnh] { background-color: var(--urm-row-hover); }

.urm-table td[b-vg9q1jdqnh] {
    padding: 0.75rem 1.5rem;
    vertical-align: middle;
}

/* ---- User cell ---- */
.urm-user-cell[b-vg9q1jdqnh] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.urm-avatar[b-vg9q1jdqnh] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.5rem;
    background-color: var(--urm-avatar-bg);
    border: 1px solid var(--urm-avatar-border);
    color: var(--urm-avatar-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.75rem;
    box-shadow: var(--urm-avatar-shadow);
    flex-shrink: 0;
}

.urm-user-name[b-vg9q1jdqnh] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--urm-heading);
    transition: color 0.15s ease;
}

.urm-table tbody tr:hover .urm-user-name[b-vg9q1jdqnh] { color: var(--urm-brand-strong); }

.urm-user-email[b-vg9q1jdqnh] {
    font-size: 0.75rem;
    color: var(--urm-muted);
}

/* ---- Organisation badges ---- */
.urm-org-badge[b-vg9q1jdqnh] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.625rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.urm-org-badge--rose[b-vg9q1jdqnh]    { background-color: rgba(244, 63, 94, 0.1);  color: var(--urm-org-rose);    border: 1px solid rgba(244, 63, 94, 0.2); }
.urm-org-badge--indigo[b-vg9q1jdqnh]  { background-color: rgba(99, 102, 241, 0.1); color: var(--urm-org-indigo);  border: 1px solid rgba(99, 102, 241, 0.2); }
.urm-org-badge--amber[b-vg9q1jdqnh]   { background-color: rgba(245, 158, 11, 0.1); color: var(--urm-org-amber);   border: 1px solid rgba(245, 158, 11, 0.2); }
.urm-org-badge--pink[b-vg9q1jdqnh]    { background-color: rgba(236, 72, 153, 0.1); color: var(--urm-org-pink);    border: 1px solid rgba(236, 72, 153, 0.2); }
.urm-org-badge--cyan[b-vg9q1jdqnh]    { background-color: rgba(6, 182, 212, 0.1);  color: var(--urm-org-cyan);    border: 1px solid rgba(6, 182, 212, 0.2); }
.urm-org-badge--emerald[b-vg9q1jdqnh] { background-color: rgba(16, 185, 129, 0.1); color: var(--urm-org-emerald); border: 1px solid rgba(16, 185, 129, 0.2); }
.urm-org-badge--slate[b-vg9q1jdqnh]   { background-color: var(--urm-chip-bg);      color: var(--urm-text-3); }

/* ---- Role pills ---- */
.urm-role-pills[b-vg9q1jdqnh] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    max-width: 24rem;
}

.urm-role-pill[b-vg9q1jdqnh] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.6875rem;
    font-weight: 500;
    background-color: var(--urm-pill-bg);
    color: var(--urm-pill-color);
    border: 1px solid var(--urm-pill-border);
    white-space: nowrap;
}

.urm-no-roles[b-vg9q1jdqnh] {
    font-size: 0.75rem;
    font-style: italic;
    color: var(--urm-faint);
}

/* ---- Access badge (Owner Org / Shared) ---- */
.urm-access-badge[b-vg9q1jdqnh] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.125rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.025em;
    white-space: nowrap;
}

.urm-access-badge--owner[b-vg9q1jdqnh] {
    background-color: rgba(16, 185, 129, 0.1);
    color: var(--urm-emerald-text);
    border: 1px solid rgba(16, 185, 129, 0.2);
}

.urm-access-badge--shared[b-vg9q1jdqnh] {
    background-color: rgba(6, 182, 212, 0.1);
    color: var(--urm-cyan-text);
    border: 1px solid rgba(6, 182, 212, 0.2);
}

/* ---- Empty state ---- */
.urm-access-empty[b-vg9q1jdqnh] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1.5rem;
    text-align: center;
    gap: 0.25rem;
}

.urm-empty-icon[b-vg9q1jdqnh] {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 9999px;
    background-color: var(--urm-chip-bg);
    color: var(--urm-faint);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.35rem;
    margin-bottom: 0.5rem;
}

.urm-empty-title[b-vg9q1jdqnh] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--urm-heading);
    margin: 0;
}

.urm-empty-sub[b-vg9q1jdqnh] {
    font-size: 0.8125rem;
    color: var(--urm-muted);
    max-width: 28rem;
    margin: 0;
}

/* ---- Table footer / pagination (ported from /users) ---- */
.urm-table-foot[b-vg9q1jdqnh] {
    background-color: var(--urm-foot-bg);
    border-top: 1px solid var(--urm-border);
    padding: 1rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    font-size: 0.75rem;
    color: var(--urm-muted);
}

.urm-foot-strong[b-vg9q1jdqnh] {
    font-weight: 500;
    color: var(--urm-text-2);
}

.urm-foot-left[b-vg9q1jdqnh] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.urm-foot-left > label[b-vg9q1jdqnh] {
    margin: 0;
    font-weight: 500;
    color: var(--urm-muted);
    white-space: nowrap;
}

.urm-foot-divider[b-vg9q1jdqnh] {
    width: 1px;
    height: 1rem;
    background-color: var(--urm-border);
    margin: 0 0.25rem;
}

.urm-foot-pager[b-vg9q1jdqnh] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.urm-pager-btn[b-vg9q1jdqnh] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    min-width: 1.9rem;
    padding: 0.375rem 0.625rem;
    background-color: var(--urm-pager-bg);
    border: 1px solid var(--urm-pager-border);
    border-radius: 0.375rem;
    color: var(--urm-pager-color);
    font-size: 0.75rem;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.urm-pager-btn:hover:not(:disabled):not(.urm-pager-btn--active)[b-vg9q1jdqnh] {
    background-color: var(--urm-hover-bg);
}

.urm-pager-btn--active[b-vg9q1jdqnh] {
    background-color: var(--urm-brand-600);
    border-color: var(--urm-brand-600);
    color: #fff;
}

.urm-pager-btn:disabled[b-vg9q1jdqnh] {
    opacity: 0.4;
    cursor: not-allowed;
}

.urm-pager-btn i[b-vg9q1jdqnh] { font-size: 0.625rem; }

/* Page-size select */
.urm-select[b-vg9q1jdqnh] {
    background-color: var(--urm-field-bg);
    border: 1px solid var(--urm-field-border);
    border-radius: 0.5rem;
    padding: 0.625rem 0.75rem;
    font-size: 0.875rem;
    color: var(--urm-text-3);
    outline: none;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.urm-select:hover[b-vg9q1jdqnh] { border-color: var(--urm-field-border-hover); }

.urm-select:focus[b-vg9q1jdqnh] {
    border-color: var(--urm-brand);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.2);
}

.urm-select > option[b-vg9q1jdqnh] {
    background-color: var(--urm-panel);
    color: var(--urm-text-2);
}

.urm-select--sm[b-vg9q1jdqnh] {
    width: auto;
    padding: 0.375rem 0.625rem;
    font-size: 0.75rem;
}

/* ---- Spinner ---- */
.urm-spin[b-vg9q1jdqnh] {
    display: inline-block;
    animation: urm-access-spin-b-vg9q1jdqnh 0.8s linear infinite;
}

@keyframes urm-access-spin-b-vg9q1jdqnh {
    to { transform: rotate(360deg); }
}
/* /Components/Shared/SitePlatesGrid.razor.rz.scp.css */
/* Plate history grid hosted in the Site Profile "Plates" tab — same table theme as the
   standalone /plates page (SitePlates.razor.css). Tokens live on .plh-grid. */

.plh-grid[b-jhdgrwkuxh] {
    --plh-panel: #ffffff;
    --plh-border: #e2e8f0;
    --plh-border-soft: rgba(226, 232, 240, 0.7);
    --plh-row-hover: #f8fafc;
    --plh-heading: #0f172a;
    --plh-text-2: #334155;
    --plh-muted: #64748b;
    --plh-faint: #94a3b8;
    --plh-brand-strong: #0d9488;
    --plh-chip-border: #e2e8f0;
    --plh-hover-bg: #f1f5f9;
    --plh-avatar-bg: #f1f5f9;
    --plh-avatar-border: #e2e8f0;
    --plh-avatar-color: #475569;
    --plh-avatar-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.06);
    --plh-emerald-text: #059669;
    --plh-card-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.05);
    --plh-foot-bg: #f8fafc;
    --plh-pager-bg: #ffffff;

    display: flex;
    flex-direction: column;
    gap: 1rem;
}

[data-bs-theme="dark"] .plh-grid[b-jhdgrwkuxh] {
    --plh-panel: #131926;
    --plh-border: #1e293b;
    --plh-border-soft: rgba(30, 41, 59, 0.6);
    --plh-row-hover: rgba(30, 41, 59, 0.2);
    --plh-heading: #ffffff;
    --plh-text-2: #e2e8f0;
    --plh-muted: #94a3b8;
    --plh-faint: #64748b;
    --plh-brand-strong: #2dd4bf;
    --plh-chip-border: #334155;
    --plh-hover-bg: rgba(30, 41, 59, 0.4);
    --plh-avatar-bg: #1e293b;
    --plh-avatar-border: rgba(51, 65, 85, 0.8);
    --plh-avatar-color: #cbd5e1;
    --plh-avatar-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);
    --plh-emerald-text: #34d399;
    --plh-foot-bg: rgba(30, 41, 59, 0.2);
    --plh-pager-bg: rgba(30, 41, 59, 0.5);
}

/* ---- Table card ---- */
.plh-table-card[b-jhdgrwkuxh] {
    background-color: var(--plh-panel);
    border: 1px solid var(--plh-border);
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: var(--plh-card-shadow);
}

.plh-table-scroll[b-jhdgrwkuxh] {
    overflow-x: auto;
    width: 100%;
}

.plh-table[b-jhdgrwkuxh] {
    width: 100%;
    text-align: left;
    border-collapse: collapse;
}

.plh-table thead tr[b-jhdgrwkuxh] {
    background: var(--ins-topbar-bg);
    border-bottom: none;
}

.plh-table th[b-jhdgrwkuxh] {
    padding: 1rem 1.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ins-topbar-item-color);
    white-space: nowrap;
}

.plh-th-num[b-jhdgrwkuxh] { width: 3rem; }
.plh-th-actions[b-jhdgrwkuxh] { width: 8.5rem; text-align: right; }

.plh-table tbody tr[b-jhdgrwkuxh] {
    border-bottom: 1px solid var(--plh-border-soft);
    transition: background-color 0.15s ease;
}

.plh-table tbody tr:last-child[b-jhdgrwkuxh] { border-bottom: none; }

.plh-table tbody tr:hover[b-jhdgrwkuxh] {
    background-color: var(--plh-row-hover);
}

.plh-table td[b-jhdgrwkuxh] {
    padding: 0.75rem 1.5rem;
    vertical-align: middle;
    color: var(--plh-text-2);
    font-size: 0.875rem;
}

.plh-num[b-jhdgrwkuxh] { color: var(--plh-faint); font-size: 0.8125rem; }

/* ---- Template cell ---- */
.plh-tpl-cell[b-jhdgrwkuxh] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.plh-avatar[b-jhdgrwkuxh] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.5rem;
    background-color: var(--plh-avatar-bg);
    border: 1px solid var(--plh-avatar-border);
    color: var(--plh-avatar-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.875rem;
    box-shadow: var(--plh-avatar-shadow);
    flex-shrink: 0;
}

.plh-tpl-name[b-jhdgrwkuxh] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--plh-heading);
    transition: color 0.15s ease;
}

.plh-table tbody tr:hover .plh-tpl-name[b-jhdgrwkuxh] {
    color: var(--plh-brand-strong);
}

.plh-tpl-sub[b-jhdgrwkuxh] {
    font-size: 0.75rem;
    color: var(--plh-muted);
}

/* ---- Format badge ---- */
.plh-format-badge[b-jhdgrwkuxh] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.125rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.025em;
    white-space: nowrap;
    background-color: rgba(16, 185, 129, 0.1);
    color: var(--plh-emerald-text);
    border: 1px solid rgba(16, 185, 129, 0.2);
}

.plh-by[b-jhdgrwkuxh] { color: var(--plh-text-2); }
.plh-date[b-jhdgrwkuxh] { color: var(--plh-muted); white-space: nowrap; }

/* ---- Actions ---- */
.plh-td-actions[b-jhdgrwkuxh] { text-align: right; }

.plh-icon-btn[b-jhdgrwkuxh] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.4rem 0.7rem;
    background: transparent;
    border: 1px solid var(--plh-border);
    border-radius: 0.5rem;
    color: var(--plh-brand-strong);
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.plh-icon-btn:hover[b-jhdgrwkuxh] {
    background-color: var(--plh-hover-bg);
    border-color: var(--plh-chip-border);
    color: var(--plh-brand-strong);
}

/* ---- Footer: row count + pagination (same treatment as the /users table) ---- */
.plh-table-foot[b-jhdgrwkuxh] {
    background-color: var(--plh-foot-bg);
    border-top: 1px solid var(--plh-border);
    padding: 0.75rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    font-size: 0.75rem;
    color: var(--plh-muted);
}

.plh-foot-left[b-jhdgrwkuxh] { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.plh-foot-left > label[b-jhdgrwkuxh] { margin: 0; font-weight: 500; white-space: nowrap; }
.plh-foot-strong[b-jhdgrwkuxh] { font-weight: 500; color: var(--plh-text-2); }
.plh-foot-divider[b-jhdgrwkuxh] { width: 1px; height: 1rem; background-color: var(--plh-border); margin: 0 0.25rem; }

.plh-select[b-jhdgrwkuxh] {
    width: auto;
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    color: var(--plh-text-2);
    background-color: var(--plh-pager-bg);
    border: 1px solid var(--plh-border);
    border-radius: 0.375rem;
}

.plh-foot-pager[b-jhdgrwkuxh] { display: flex; align-items: center; gap: 0.375rem; flex-wrap: wrap; }

.plh-pager-btn[b-jhdgrwkuxh] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.9rem;
    padding: 0.375rem 0.625rem;
    background-color: var(--plh-pager-bg);
    border: 1px solid var(--plh-border);
    border-radius: 0.375rem;
    color: var(--plh-text-2);
    font-size: 0.75rem;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.plh-pager-btn:hover:not(:disabled):not(.plh-pager-btn--active)[b-jhdgrwkuxh] { background-color: var(--plh-hover-bg); }

.plh-pager-btn--active[b-jhdgrwkuxh] {
    background-color: var(--plh-brand-strong);
    border-color: var(--plh-brand-strong);
    color: #fff;
}

.plh-pager-btn:disabled[b-jhdgrwkuxh] { opacity: 0.4; cursor: not-allowed; }
.plh-pager-btn i[b-jhdgrwkuxh] { font-size: 0.625rem; }

/* ---- Empty state ---- */
.plh-empty[b-jhdgrwkuxh] {
    background-color: var(--plh-panel);
    border: 1px solid var(--plh-border);
    border-radius: 0.75rem;
    box-shadow: var(--plh-card-shadow);
    text-align: center;
    padding: 3rem 1.5rem;
    color: var(--plh-muted);
}

.plh-empty > i[b-jhdgrwkuxh] { font-size: 2rem; display: block; margin-bottom: 0.5rem; color: var(--plh-faint); }
.plh-empty-title[b-jhdgrwkuxh] { font-weight: 600; color: var(--plh-heading); }
.plh-empty-sub[b-jhdgrwkuxh] { font-size: 0.8125rem; }
/* /Components/Shared/SlideOverPanel.razor.rz.scp.css */
/* Right-hand slide-over panel shell — mirrors the IssueDetailDrawer (idd-) styling */

.sop-drawer[b-9fydub71g7] {
    position: fixed;
    top: var(--ins-topbar-height, 70px);
    right: 0;
    bottom: 0;
    width: 560px;
    max-width: 100vw;
    background-color: #fff;
    border-left: 1px solid #e2e8f0;
    box-shadow: -10px 0 30px -12px rgba(15, 23, 42, 0.25);
    z-index: 1035;
    display: flex;
    flex-direction: column;
    transform: translateX(105%);
    transition: transform 0.3s ease-in-out, width 0.3s ease-in-out;
    font-size: 0.8125rem;
}

.sop-drawer--open[b-9fydub71g7] {
    transform: translateX(0);
    /* The panel is mounted only when it opens, so there is no previous transform for a transition to
       run from — the slide-in is a keyframe animation instead, which does run on a fresh element. */
    animation: sop-slide-in-b-9fydub71g7 0.3s ease-in-out;
}

@keyframes sop-slide-in-b-9fydub71g7 {
    from { transform: translateX(105%); }
    to { transform: translateX(0); }
}

/* Expanded via the ← head button: stretches until it touches the sidenav */
.sop-drawer--expanded[b-9fydub71g7] {
    width: calc(100vw - var(--ins-sidenav-width, 260px));
}

/* Head */

.sop-head[b-9fydub71g7] {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e2e8f0;
    background-color: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-shrink: 0;
}

.sop-head-id[b-9fydub71g7] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.sop-head-text[b-9fydub71g7] {
    min-width: 0;
}

.sop-head-icon[b-9fydub71g7] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 9999px;
    background-color: rgba(13, 148, 136, 0.1);
    border: 1px solid rgba(13, 148, 136, 0.25);
    color: #0d9488;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
}

.sop-title[b-9fydub71g7] {
    font-size: 0.9375rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sop-sub[b-9fydub71g7] {
    font-size: 0.75rem;
    color: #64748b;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sop-head-btn[b-9fydub71g7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    color: #64748b;
    font-size: 1.125rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.sop-head-actions[b-9fydub71g7] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
}

/* Pinned: the pin fills in and takes the brand colour */
.sop-drawer .sop-head-btn.sop-head-btn--active[b-9fydub71g7],
.sop-drawer .sop-head-btn.sop-head-btn--active:hover[b-9fydub71g7] {
    color: var(--bs-primary, #465dff);
}

/* A pinned panel sits beneath every other slide-out (the issue drawer is 1030), so one opened after it
   shows on top; it still clears the page content. */
.sop-drawer--pinned[b-9fydub71g7] {
    z-index: 1029;
}

.sop-head-btn:hover[b-9fydub71g7] {
    background-color: rgba(15, 23, 42, 0.05);
    border-color: #e2e8f0;
    color: #0f172a;
}

/* Body + footer */

.sop-body[b-9fydub71g7] {
    flex: 1;
    overflow-y: auto;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    scrollbar-width: thin;
}

.sop-footer[b-9fydub71g7] {
    flex-shrink: 0;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    border-top: 1px solid #e2e8f0;
    background-color: #f8fafc;
}

/* ── Dark theme ── */

[data-bs-theme="dark"] .sop-drawer[b-9fydub71g7] {
    background-color: #131926;
    border-left-color: #1e293b;
    box-shadow: -10px 0 30px -12px rgba(0, 0, 0, 0.6);
}

[data-bs-theme="dark"] .sop-head[b-9fydub71g7],
[data-bs-theme="dark"] .sop-footer[b-9fydub71g7] {
    background-color: #0f1422;
    border-color: #1e293b;
}

[data-bs-theme="dark"] .sop-title[b-9fydub71g7] {
    color: #f1f5f9;
}

[data-bs-theme="dark"] .sop-sub[b-9fydub71g7],
[data-bs-theme="dark"] .sop-head-btn[b-9fydub71g7] {
    color: #94a3b8;
}

[data-bs-theme="dark"] .sop-head-btn:hover[b-9fydub71g7] {
    background-color: rgba(148, 163, 184, 0.1);
    border-color: #1e293b;
    color: #f1f5f9;
}