:root {
    --sa-test-access-gap: var(--sa-space-sm);
    --sa-test-access-gap-lg: var(--sa-space-lg);
    --sa-test-access-zero: 0;
    --sa-test-access-summary-columns: repeat(3, minmax(var(--sa-test-access-zero), 1fr));
    --sa-test-access-summary-padding: var(--sa-space-lg);
    --sa-test-access-summary-border: var(--sa-border);
    --sa-test-access-summary-radius: var(--sa-radius-lg);
    --sa-test-access-summary-bg: var(--sa-color-panel);
    --sa-test-access-summary-shadow: var(--sa-shadow);
    --sa-test-access-muted: var(--sa-color-muted);
    --sa-test-access-accent: var(--sa-color-primary);
    --sa-test-access-accent-soft: var(--sa-color-primary-soft);
    --sa-test-access-disabled: var(--sa-color-disabled);
    --sa-test-access-disabled-soft: var(--sa-color-disabled-soft);
    --sa-test-access-contact-width: 18rem;
    --sa-test-access-title-weight: 700;
    --sa-test-access-role-radius: var(--sa-radius-sm);
    --sa-test-access-role-padding: var(--sa-space-xs) var(--sa-space-sm);
    --sa-test-access-table-layout: fixed;
    --sa-test-access-table-cell-padding: var(--sa-space-sm) var(--sa-space-md);
    --sa-test-access-table-identity-width: 14%;
    --sa-test-access-table-tenant-width: 14%;
    --sa-test-access-table-contact-width: 18%;
    --sa-test-access-table-role-width: 8%;
    --sa-test-access-table-locale-width: 12%;
    --sa-test-access-table-status-width: 7%;
    --sa-test-access-table-actions-width: 27%;
    --sa-test-access-table-action-gap: var(--sa-space-xs);
    --sa-test-access-create-gap: var(--sa-space-md);
    --sa-test-access-create-padding: var(--sa-space-lg);
    --sa-test-access-create-grid: repeat(3, minmax(var(--sa-test-access-zero), 1fr));
    --sa-test-access-create-grid-tablet: repeat(2, minmax(var(--sa-test-access-zero), 1fr));
    --sa-test-access-create-grid-mobile: minmax(var(--sa-test-access-zero), 1fr);
    --sa-test-access-create-badge-padding: var(--sa-space-xs) var(--sa-space-sm);
    --sa-test-access-action-min-width: 8.75rem;
    --sa-test-access-credentials-action-min-width: 12.5rem;
    --sa-test-access-credentials-margin: var(--sa-space-lg);
    --sa-test-access-credentials-gap: var(--sa-space-md);
    --sa-test-access-credentials-grid: repeat(3, minmax(var(--sa-test-access-zero), 1fr));
    --sa-test-access-credentials-context-columns: repeat(2, minmax(var(--sa-test-access-zero), 1fr));
    --sa-test-access-credentials-padding: var(--sa-space-md);
    --sa-test-access-credentials-border: var(--sa-border);
    --sa-test-access-credentials-radius: var(--sa-radius-md);
    --sa-test-access-credentials-bg: var(--sa-color-panel-soft);
    --sa-test-access-credentials-output-bg: var(--sa-color-panel);
    --sa-test-access-credentials-output-padding: var(--sa-space-sm) var(--sa-space-md);
    --sa-test-access-credentials-output-radius: var(--sa-radius-sm);
    --sa-test-access-credentials-action-gap: var(--sa-space-sm);
    --sa-test-access-credentials-mobile-columns: minmax(var(--sa-test-access-zero), 1fr);
    --sa-test-access-mobile-columns: minmax(var(--sa-test-access-zero), 1fr);
}

.superadmin-test-access__summary {
    display: grid;
    grid-template-columns: var(--sa-test-access-summary-columns);
    gap: var(--sa-test-access-gap);
    margin-bottom: var(--sa-test-access-gap-lg);
    padding: var(--sa-test-access-summary-padding);
    background: var(--sa-test-access-summary-bg);
    border: var(--sa-test-access-summary-border);
    border-radius: var(--sa-test-access-summary-radius);
    box-shadow: var(--sa-test-access-summary-shadow);
}

.superadmin-test-access__summary div {
    display: grid;
    grid-template-columns: auto minmax(var(--sa-test-access-zero), 1fr) auto;
    align-items: center;
    gap: var(--sa-test-access-gap);
    color: var(--sa-test-access-muted);
}

.superadmin-test-access__summary i {
    color: var(--sa-test-access-accent);
}

.superadmin-test-access__summary span {
    font-size: var(--sa-font-size-sm);
    font-weight: var(--sa-test-access-title-weight);
}

.superadmin-test-access__summary strong {
    color: var(--sa-color-text);
    font-variant-numeric: tabular-nums;
}

.superadmin-test-access__empty {
    display: grid;
    place-items: center;
    gap: var(--sa-test-access-gap);
    text-align: center;
}

.superadmin-test-access__empty i {
    color: var(--sa-test-access-muted);
    font-size: var(--sa-size-icon);
}

.superadmin-test-access__empty h2,
.superadmin-test-access__empty p,
.superadmin-test-access__identity,
.superadmin-test-access__tenant,
.superadmin-test-access__contact {
    margin: var(--sa-test-access-zero);
}

.superadmin-test-access__empty p,
.superadmin-test-access__identity small,
.superadmin-test-access__tenant small,
.superadmin-test-access__contact small,
.superadmin-test-access__contact a {
    color: var(--sa-test-access-muted);
}

.superadmin-test-access__create {
    display: grid;
    gap: var(--sa-test-access-create-gap);
    margin-bottom: var(--sa-test-access-gap-lg);
    padding: var(--sa-test-access-create-padding);
    scroll-margin-top: var(--sa-space-lg);
}

.superadmin-test-access__create-header {
    align-items: start;
}

.superadmin-test-access__eyebrow {
    margin: var(--sa-test-access-zero);
    color: var(--sa-test-access-accent);
    font-size: var(--sa-font-size-sm);
    font-weight: var(--sa-test-access-title-weight);
}

.superadmin-test-access__create-note {
    max-width: var(--sa-size-inline-note);
    margin: var(--sa-test-access-zero);
    color: var(--sa-test-access-muted);
}

.superadmin-test-access__admin-badge {
    padding: var(--sa-test-access-create-badge-padding);
    color: var(--sa-test-access-accent);
    background: var(--sa-test-access-accent-soft);
    border-radius: var(--sa-test-access-role-radius);
    font-size: var(--sa-font-size-sm);
    font-weight: var(--sa-test-access-title-weight);
    white-space: nowrap;
}

.superadmin-test-access__create-form {
    display: grid;
    gap: var(--sa-test-access-create-gap);
}

.superadmin-test-access__create-fields {
    display: grid;
    grid-template-columns: var(--sa-test-access-create-grid);
    gap: var(--sa-test-access-create-gap);
}

.superadmin-test-access__create-fields .superadmin-field {
    min-width: var(--sa-test-access-zero);
}

.superadmin-test-access__create-actions {
    justify-content: flex-end;
}

.superadmin-test-access__identity,
.superadmin-test-access__tenant,
.superadmin-test-access__contact {
    display: grid;
    gap: var(--sa-test-access-gap);
}

.superadmin-test-access__identity strong,
.superadmin-test-access__tenant strong,
.superadmin-test-access__contact strong {
    font-weight: var(--sa-test-access-title-weight);
}

.superadmin-test-access__contact {
    max-width: var(--sa-test-access-contact-width);
}

.superadmin-test-access__contact a {
    overflow-wrap: anywhere;
}

.superadmin-test-access__table {
    width: 100%;
    max-width: 100%;
    min-width: var(--sa-test-access-zero);
    table-layout: var(--sa-test-access-table-layout);
}

.superadmin-test-access__table th,
.superadmin-test-access__table td {
    padding: var(--sa-test-access-table-cell-padding);
    min-width: var(--sa-test-access-zero);
    vertical-align: top;
}

.superadmin-test-access__table th:nth-child(1),
.superadmin-test-access__table td:nth-child(1) {
    width: var(--sa-test-access-table-identity-width);
}

.superadmin-test-access__table th:nth-child(2),
.superadmin-test-access__table td:nth-child(2) {
    width: var(--sa-test-access-table-tenant-width);
}

.superadmin-test-access__table th:nth-child(3),
.superadmin-test-access__table td:nth-child(3) {
    width: var(--sa-test-access-table-contact-width);
}

.superadmin-test-access__table th:nth-child(4),
.superadmin-test-access__table td:nth-child(4) {
    width: var(--sa-test-access-table-role-width);
}

.superadmin-test-access__table th:nth-child(5),
.superadmin-test-access__table td:nth-child(5) {
    width: var(--sa-test-access-table-locale-width);
}

.superadmin-test-access__table th:nth-child(6),
.superadmin-test-access__table td:nth-child(6) {
    width: var(--sa-test-access-table-status-width);
}

.superadmin-test-access__table th:nth-child(7),
.superadmin-test-access__table td:nth-child(7) {
    width: var(--sa-test-access-table-actions-width);
}

.superadmin-test-access__role {
    display: inline-flex;
    padding: var(--sa-test-access-role-padding);
    color: var(--sa-test-access-accent);
    background: var(--sa-test-access-accent-soft);
    border-radius: var(--sa-test-access-role-radius);
    font-size: var(--sa-font-size-sm);
    font-weight: var(--sa-test-access-title-weight);
}

.superadmin-test-access__table .superadmin-test-access__identity,
.superadmin-test-access__table .superadmin-test-access__tenant,
.superadmin-test-access__table .superadmin-test-access__contact {
    max-width: none;
    line-height: var(--sa-line-height-compact);
}

.superadmin-test-access__table .superadmin-test-access__role,
.superadmin-test-access__table .superadmin-status {
    white-space: nowrap;
}

.superadmin-test-access__row-actions {
    display: grid;
    gap: var(--sa-test-access-table-action-gap);
}

.superadmin-test-access__row-actions .superadmin-inline-form {
    display: block;
    margin: var(--sa-test-access-zero) var(--sa-test-access-zero) var(--sa-test-access-table-action-gap);
    min-width: var(--sa-test-access-zero);
}

.superadmin-test-access__row-actions .superadmin-inline-form:last-child {
    margin-bottom: var(--sa-test-access-zero);
}

.superadmin-test-access__row-actions .superadmin-button,
.superadmin-test-access__mobile-actions .superadmin-button {
    width: 100%;
    min-width: var(--sa-test-access-zero);
    min-height: 2.75rem;
}

.superadmin-test-access__mobile-list {
    display: none;
}

.superadmin-test-access__status--inactive {
    color: var(--sa-test-access-disabled);
    background: var(--sa-test-access-disabled-soft);
}

.superadmin-test-access__status--inactive .superadmin-status__lamp {
    background: var(--sa-test-access-disabled);
}

.superadmin-test-access__action {
    min-width: var(--sa-test-access-action-min-width);
}

.superadmin-test-access__action--deactivate {
    color: var(--sa-color-warning);
    background: var(--sa-color-warning-soft);
    border-color: var(--sa-color-warning);
}

.superadmin-test-access__credentials-action {
    min-width: var(--sa-test-access-credentials-action-min-width);
}

.superadmin-test-access-credentials {
    display: grid;
    gap: var(--sa-test-access-credentials-gap);
    margin-top: var(--sa-test-access-credentials-margin);
}

.superadmin-test-access-credentials__header {
    align-items: center;
}

.superadmin-test-access-credentials__eyebrow {
    margin: var(--sa-test-access-zero);
    color: var(--sa-test-access-accent);
    font-size: var(--sa-font-size-sm);
    font-weight: var(--sa-test-access-title-weight);
}

.superadmin-test-access-credentials__context,
.superadmin-test-access-credentials__fields {
    display: grid;
    grid-template-columns: var(--sa-test-access-credentials-grid);
    gap: var(--sa-test-access-credentials-gap);
}

.superadmin-test-access-credentials__context {
    grid-template-columns: var(--sa-test-access-credentials-context-columns);
    margin: var(--sa-test-access-zero);
}

.superadmin-test-access-credentials__context div,
.superadmin-test-access-credentials__password {
    padding: var(--sa-test-access-credentials-padding);
    background: var(--sa-test-access-credentials-bg);
    border: var(--sa-test-access-credentials-border);
    border-radius: var(--sa-test-access-credentials-radius);
}

.superadmin-test-access-credentials__context dt,
.superadmin-test-access-credentials__context dd,
.superadmin-test-access-credentials__password p {
    margin: var(--sa-test-access-zero);
}

.superadmin-test-access-credentials__context dt,
.superadmin-test-access-credentials__password p,
.superadmin-test-access-credentials__form small {
    color: var(--sa-test-access-muted);
}

.superadmin-test-access-credentials__context dd {
    margin-top: var(--sa-test-access-gap);
    color: var(--sa-color-text);
    font-weight: var(--sa-test-access-title-weight);
}

.superadmin-test-access-credentials__form {
    display: grid;
    gap: var(--sa-test-access-credentials-gap);
}

.superadmin-test-access-credentials__password {
    display: grid;
    gap: var(--sa-test-access-gap);
}

.superadmin-test-access-credentials__password summary {
    display: inline-flex;
    align-items: center;
    gap: var(--sa-test-access-gap);
    color: var(--sa-test-access-accent);
    cursor: pointer;
    font-weight: var(--sa-test-access-title-weight);
}

.superadmin-test-access-credentials__password div {
    display: grid;
    gap: var(--sa-test-access-gap);
}

.superadmin-test-access-credentials__password output {
    display: block;
    padding: var(--sa-test-access-credentials-output-padding);
    overflow-wrap: anywhere;
    color: var(--sa-color-text);
    background: var(--sa-test-access-credentials-output-bg);
    border-radius: var(--sa-test-access-credentials-output-radius);
    font-family: var(--sa-font-family);
}

.superadmin-test-access-credentials__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--sa-test-access-credentials-action-gap);
}

@media (max-width: 720px) {
    .superadmin-test-access__summary {
        grid-template-columns: var(--sa-test-access-mobile-columns);
    }

    .superadmin-test-access__desktop-table {
        display: none;
    }

    .superadmin-test-access__mobile-list {
        display: block;
    }

    .superadmin-test-access-credentials__context,
    .superadmin-test-access-credentials__fields {
        grid-template-columns: var(--sa-test-access-credentials-mobile-columns);
    }

    .superadmin-test-access-credentials__actions {
        display: grid;
        justify-content: stretch;
    }

    .superadmin-test-access__create-fields {
        grid-template-columns: var(--sa-test-access-create-grid-mobile);
    }

    .superadmin-test-access__create-actions {
        display: grid;
        justify-content: stretch;
    }
}

@media (max-width: 900px) {
    .superadmin-test-access__create-fields {
        grid-template-columns: var(--sa-test-access-create-grid-tablet);
    }

}
