/* /Components/Shared/RecordAttribution.razor.rz.scp.css */
.record-attribution[b-a8osbcws63] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    margin-top: 1.25rem;
    padding-top: 0.85rem;
    border-top: 1px solid var(--glass-border);
    font-size: 0.78rem;
    color: var(--color-text-secondary);
}

.record-attribution-line[b-a8osbcws63] {
    display: flex;
    gap: 0.5rem;
}

.record-attribution-label[b-a8osbcws63] {
    min-width: 4.25rem;
    font-weight: 600;
    opacity: 0.75;
}
/* /Components/Shared/UsersPanel.razor.rz.scp.css */
/* ── Editor modal layout: pinned head/foot, scrollable permission body ───────────
   The host .modal-dialog.modal-flex (site.css) is a bounded flex column; these three
   regions are its direct children. NOTE: this file only applies because App.razor links
   the scoped bundle (Llb.Web.styles.css) — that link was missing until 2026-08-12, which
   is why the editor overflowed the viewport for so long (issue #14's fix never rendered). */

.ue-head[b-4f499cgnzl] {
    flex: 0 0 auto;
}

.ue-body[b-4f499cgnzl] {
    flex: 1 1 auto;
    /* min-height: 0 is essential — without it a flex child won't shrink below its
       content height, so the list would push the dialog past the viewport instead of scrolling. */
    min-height: 0;
    overflow-y: auto;
    margin-top: 0.85rem;
    padding-right: 0.35rem;
}

.ue-foot[b-4f499cgnzl] {
    flex: 0 0 auto;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--glass-border);
}

.ue-lock-note[b-4f499cgnzl] {
    font-size: 0.78rem;
    color: var(--color-text-secondary);
    margin: 0.6rem 0 0;
}

.ue-perms-title[b-4f499cgnzl] {
    margin: 1.25rem 0 0.5rem;
    font-size: 0.95rem;
}

/* ── The permissions table (2026-08-12 — replaces the multi-column row list) ── */

.perm-table[b-4f499cgnzl] {
    width: 100%;
}

/* The column headers stay visible while the body scrolls beneath them. The solid-ish
   background matters: without it the rows read straight through the sticky header. */
.perm-table thead th[b-4f499cgnzl] {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--glass-bg-strong);
}

.perm-col-setting[b-4f499cgnzl] {
    width: 120px;
}

.perm-col-result[b-4f499cgnzl] {
    width: 70px;
    text-align: center;
}

.perm-group-row td[b-4f499cgnzl] {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--color-text-secondary);
    padding-top: 0.8rem;
    border-bottom: none;
}

.perm-name[b-4f499cgnzl] {
    font-weight: 600;
    font-size: 0.9rem;
    white-space: nowrap;
}

.perm-desc[b-4f499cgnzl] {
    font-size: 0.78rem;
    color: var(--color-text-secondary);
}

.perm-select[b-4f499cgnzl] {
    width: 110px;
}

.perm-effective[b-4f499cgnzl] {
    text-align: center;
    font-weight: 700;
}

.perm-effective.on[b-4f499cgnzl] {
    color: var(--color-teal);
}

.perm-effective.off[b-4f499cgnzl] {
    color: var(--color-coral);
    opacity: 0.7;
}