/* Organizational hierarchy and permission-role workspaces. */
.org-lineage {
    --org-line: #bfd2df;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin: 0 0 22px;
    padding: 13px;
    border: 1px solid #cedde7;
    border-radius: 16px;
    background: linear-gradient(135deg, #f7fbfd, #eef7f9);
    box-shadow: 0 14px 30px rgba(6, 44, 85, .06);
}

.org-lineage.org-lineage-five {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.org-lineage-node {
    position: relative;
    display: grid;
    min-width: 0;
    gap: 3px;
    padding: 12px 32px 12px 14px;
    border-radius: 11px;
}

.org-lineage-node:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 8px;
    width: 16px;
    height: 1px;
    background: var(--org-line);
}

.org-lineage-node:not(:last-child)::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: calc(50% - 3px);
    right: 8px;
    width: 7px;
    height: 7px;
    border-top: 1px solid #7395aa;
    border-right: 1px solid #7395aa;
    transform: rotate(45deg);
}

.org-lineage-node > span {
    color: #6c7e90;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.org-lineage-node > strong {
    overflow: hidden;
    color: var(--navy);
    font-size: 13px;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.org-lineage-node.is-current {
    color: white;
    background: linear-gradient(135deg, var(--usp-navy, var(--navy)), #0b5273);
    box-shadow: 0 8px 18px rgba(6, 44, 85, .16);
}

.org-lineage-node.is-current > span { color: #9cdbdd; }
.org-lineage-node.is-current > strong { color: white; }
.org-lineage-node.is-muted > strong { color: #718294; font-weight: 700; }

.org-page-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, .32fr);
    gap: 20px;
    align-items: start;
}

.org-page-stack,
.access-page-stack {
    display: grid;
    gap: 18px;
}

.org-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.org-summary-card {
    display: grid;
    gap: 5px;
    padding: 17px;
    border: 1px solid #d7e3eb;
    border-radius: 13px;
    background: #fff;
}

.org-summary-card > span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.org-summary-card > strong { color: var(--navy); font-size: 22px; }
.org-summary-card > small { color: var(--muted); line-height: 1.45; }

.org-record-path,
.assignment-scope-path {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    align-items: center;
    color: #526b7e;
    font-size: 11px;
    font-weight: 700;
}

.org-record-path > span:not(:last-child)::after,
.assignment-scope-path > span:not(:last-child)::after {
    content: "/";
    margin-left: 5px;
    color: #9aafbd;
}

.org-count-row,
.role-metadata,
.permission-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    align-items: center;
}

.org-count,
.scope-badge,
.role-badge,
.permission-pill {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 3px 9px;
    border: 1px solid #d4e1e9;
    border-radius: 999px;
    color: #31536a;
    background: #f7fafc;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .02em;
}

.scope-badge {
    color: #075b68;
    border-color: #b8dcdf;
    background: #edf9f8;
    text-transform: uppercase;
}

.role-badge.is-system { color: #684b08; border-color: #ead79d; background: #fff9e7; }
.role-badge.is-protected { color: #753838; border-color: #e7c0c0; background: #fff5f5; }
.role-badge.is-inactive { color: #586676; background: #eef2f5; }

.org-side-note,
.permission-summary-card {
    position: sticky;
    top: 92px;
    padding: 20px;
    border: 1px solid #cfe0e7;
    border-top: 5px solid var(--usp-teal, var(--teal));
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 18px 38px rgba(6, 44, 85, .08);
}

.org-side-note h2,
.permission-summary-card h2 { margin: 0 0 7px; color: var(--navy); font-size: 17px; }
.org-side-note p,
.permission-summary-card p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.org-side-note ul { margin: 15px 0 0; padding-left: 18px; color: #3c586c; font-size: 12px; line-height: 1.7; }

.org-form-section {
    padding: 22px;
    border: 1px solid #d5e2ea;
    border-radius: 15px;
    background: #fff;
}

.org-form-section + .org-form-section { margin-top: 16px; }
.org-form-section h2 { margin: 0 0 5px; color: var(--navy); font-size: 18px; }
.org-form-section > p { margin: 0 0 18px; color: var(--muted); font-size: 12px; line-height: 1.55; }

.role-directory-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    padding: 19px 20px;
    border: 1px solid #d7e3eb;
    border-left: 5px solid var(--usp-teal, var(--teal));
    border-radius: 14px;
    background: #fff;
}

.role-directory-card.is-system { border-left-color: var(--gold); }
.role-directory-card.is-inactive { opacity: .7; border-left-color: #96a6b2; }
.role-directory-main { display: grid; min-width: 0; gap: 8px; }
.role-directory-title { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.role-directory-title h3 { margin: 0; color: var(--navy); font-size: 16px; }
.role-directory-main > p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.role-directory-actions { display: flex; gap: 8px; align-items: center; }

.permission-editor-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 275px;
    gap: 20px;
    align-items: start;
}

.permission-groups { display: grid; gap: 14px; }
.permission-editor-layout .permission-groups { min-width: 0; }

.permission-group {
    overflow: hidden;
    border: 1px solid #d4e2ea;
    border-radius: 15px;
    background: #fff;
}

.permission-group[hidden],
.permission-choice[hidden] { display: none; }

.permission-group-heading {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    padding: 15px 18px;
    border-bottom: 1px solid #deE8ee;
    background: #f6fafc;
}

.permission-editor-layout .permission-group-heading > div { min-width: 0; }

.permission-group-heading h3 { margin: 0; color: var(--navy); font-size: 14px; }
.permission-group-heading p { margin: 3px 0 0; color: var(--muted); font-size: 11px; }
.permission-toggle-all { color: var(--blue); background: transparent; border: 0; font-size: 11px; font-weight: 800; }

.permission-choice-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }

.permission-choice {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 14px 17px;
    border-bottom: 1px solid #e5edf2;
    cursor: pointer;
}

.permission-choice:nth-child(odd) { border-right: 1px solid #e5edf2; }
.permission-choice:hover { background: #f7fbfd; }
.permission-choice:has(input:checked) { background: #eef9f8; }
.permission-choice input { margin-top: 3px; accent-color: var(--usp-teal, var(--teal)); }
.permission-choice > span { display: grid; gap: 3px; }
.permission-choice strong { color: var(--navy); font-size: 12px; line-height: 1.35; }
.permission-choice small { color: var(--muted); font-size: 11px; line-height: 1.45; }
.permission-editor-layout .permission-choice,
.permission-editor-layout .permission-choice > span { min-width: 0; }
.permission-editor-layout .permission-choice strong,
.permission-editor-layout .permission-choice small,
.permission-editor-layout .permission-code { max-width: 100%; overflow-wrap: anywhere; }
.permission-code { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; color: #557083; font-size: 9px; letter-spacing: .03em; }

.permission-count {
    display: grid;
    place-items: center;
    width: 74px;
    height: 74px;
    margin: 17px 0;
    border: 8px solid #dff1f1;
    border-radius: 50%;
    color: var(--navy);
    background: #fff;
    font-size: 23px;
    font-weight: 850;
}

.permission-count + small { display: block; color: var(--muted); font-size: 11px; line-height: 1.5; }

.scope-builder {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(135px, 1fr));
    gap: 10px;
    padding: 14px;
    border: 1px solid #d4e2ea;
    border-radius: 14px;
    background: #f7fafc;
}

.scope-choice {
    position: relative;
    display: grid;
    gap: 4px;
    min-height: 76px;
    padding: 13px;
    border: 1px solid #cddde6;
    border-radius: 11px;
    background: #fff;
    cursor: pointer;
}

.scope-choice:has(input:checked) {
    color: white;
    border-color: var(--usp-navy, var(--navy));
    background: linear-gradient(135deg, var(--usp-navy, var(--navy)), #0c5a77);
}

.scope-choice input { position: absolute; top: 10px; right: 10px; accent-color: var(--usp-teal, var(--teal)); }
.scope-choice strong { padding-right: 20px; font-size: 12px; }
.scope-choice small { color: var(--muted); font-size: 10px; line-height: 1.4; }
.scope-choice:has(input:checked) small { color: #cce6e8; }

.scope-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 15px;
}

.scope-field[hidden],
.scope-builder[hidden] { display: none; }

.role-chip-list { display: flex; flex-wrap: wrap; gap: 7px; }
.role-chip {
    display: inline-flex;
    gap: 6px;
    align-items: center;
    padding: 5px 9px;
    border: 1px solid #bad9de;
    border-radius: 999px;
    color: #075b68;
    background: #eefafa;
    font-size: 10px;
    font-weight: 800;
}
.role-chip small { color: #547784; font-size: 9px; font-weight: 700; }

.assignment-primary { display: grid; gap: 4px; }
.assignment-primary strong { color: var(--navy); font-size: 12px; }
.assignment-primary small { color: var(--muted); font-size: 10px; }

.form-field select option[hidden] { display: none; }

@media (max-width: 980px) {
    .org-page-grid,
    .permission-editor-layout { grid-template-columns: 1fr; }
    .org-side-note,
    .permission-summary-card { position: static; }
    .permission-choice-list { grid-template-columns: 1fr; }
    .permission-choice:nth-child(odd) { border-right: 0; }
}

@media (max-width: 720px) {
    .org-lineage,
    .org-lineage.org-lineage-five { grid-template-columns: 1fr; }
    .org-lineage-node { padding-right: 14px; }
    .org-lineage-node:not(:last-child)::after { top: auto; right: auto; bottom: -1px; left: 27px; width: 1px; height: 10px; }
    .org-lineage-node:not(:last-child)::before { display: none; }
    .org-summary-grid,
    .scope-builder,
    .scope-fields { grid-template-columns: 1fr; }
    .role-directory-card { grid-template-columns: 1fr; }
    .role-directory-actions { justify-content: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
    .org-lineage-node,
    .scope-choice,
    .permission-choice { transition: none; }
}