/* /Pages/ConnectionDetail.razor.rz.scp.css */
/* Every value line has the same height in read-only and edit mode, so the cards do not jump when Bewerken is pressed. */
.config-field[b-uwou1p4t48]  .connection-value,
.config-field .connection-value[b-uwou1p4t48],
.connection-secret-row[b-uwou1p4t48] {
    display: flex;
    align-items: center;
    min-height: 28px;
    margin: 0;
}

.connection-secret-row[b-uwou1p4t48] {
    justify-content: space-between;
    gap: var(--space-3);
}

.connection-secret-row[b-uwou1p4t48]  .mud-input-control {
    flex: 1 1 auto;
    min-width: 0;
}

.connection-secret-row[b-uwou1p4t48]  .portal-button-small.mud-button-root {
    flex: 0 0 auto;
    height: 28px;
}

.config-field[b-uwou1p4t48] {
    transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}

.connection-field-editing[b-uwou1p4t48] {
    border-color: var(--black-howl-40);
}

.connection-field-editing:focus-within[b-uwou1p4t48] {
    border-color: var(--black-howl);
    box-shadow: inset 0 0 0 1px var(--black-howl);
}

.connection-field-editing[b-uwou1p4t48]  .mud-input-control .mud-input.mud-input-text {
    width: 100%;
    min-height: 28px;
}

.connection-field-editing[b-uwou1p4t48]  .mud-input-control .mud-input.mud-input-text > input.mud-input-root {
    height: 28px;
    width: 100%;
    font-size: var(--fs-small);
    line-height: 28px;
}

.connection-field-editing[b-uwou1p4t48]  .mud-input-control .mud-input.mud-input-text > input.mud-input-root::placeholder {
    color: var(--text-muted);
    opacity: 1;
}

.connection-field-editing[b-uwou1p4t48]  .mud-input-adornment-end .mud-icon-button {
    padding: 4px;
    color: var(--text-muted);
}

.connection-field-editing[b-uwou1p4t48]  .mud-input-adornment-end .mud-icon-button:hover,
.connection-field-editing[b-uwou1p4t48]  .mud-input-adornment-end .mud-icon-button:focus-visible {
    color: var(--text-body);
}

/* Three fields per connection: on a wide screen they share one row instead of leaving a gap next to the last one. */
@media (min-width: 1280px) {
    .config-grid[b-uwou1p4t48] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.connection-test-hint[b-uwou1p4t48] {
    color: var(--text-muted);
}

.connection-breadcrumb[b-uwou1p4t48] {
    font-size: var(--fs-small);
    color: var(--text-muted);
}

.connection-breadcrumb a[b-uwou1p4t48] {
    color: var(--text-link);
}

.connection-breadcrumb a:hover[b-uwou1p4t48] {
    color: var(--text-link-hover);
}

.connections-page[b-uwou1p4t48]  .connection-status.mud-chip {
    width: 7.5rem;
    justify-content: center;
}

.connections-page[b-uwou1p4t48]  .connections-save-error.mud-alert {
    border-radius: 0;
}

.connection-panels[b-uwou1p4t48] {
    margin-top: 0;
    align-items: start;
}

.connection-panels[b-uwou1p4t48] >  .portal-panel {
    height: auto;
}

.connections-page[b-uwou1p4t48]  .connection-keyvault-note {
    padding: 18px 20px;
}

.connection-users[b-uwou1p4t48] {
    padding: var(--space-2) var(--space-5) var(--space-4);
}

.connection-users[b-uwou1p4t48]  .portal-muted {
    padding: var(--space-2) 0;
}

.connection-users ul[b-uwou1p4t48] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.connection-user[b-uwou1p4t48] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px 0;
    border-bottom: var(--border-w) solid var(--border-subtle);
    font-size: var(--fs-small);
}

.connection-user:last-child[b-uwou1p4t48] {
    border-bottom: 0;
}

.connection-user-name[b-uwou1p4t48] {
    font-weight: var(--weight-medium);
}

.connection-user-detail[b-uwou1p4t48] {
    font-size: var(--fs-caption);
    color: var(--text-muted);
}

@media (prefers-reduced-motion: reduce) {
    .config-field[b-uwou1p4t48] {
        transition: none;
    }
}
/* /Pages/Connections.razor.rz.scp.css */
.connections-scroll[b-xg77vzer40] {
    overflow-x: auto;
}

.connections-table[b-xg77vzer40] {
    width: 100%;
    min-width: 720px;
    border-collapse: collapse;
    font-size: var(--fs-small);
}

.connections-table th[b-xg77vzer40] {
    padding: 12px var(--space-4);
    text-align: left;
    font-weight: var(--weight-medium);
    border-bottom: var(--border-w) solid var(--border-default);
}

.connections-table td[b-xg77vzer40] {
    padding: 14px var(--space-4);
    border-bottom: var(--border-w) solid var(--border-subtle);
    vertical-align: middle;
}

.connections-head[b-xg77vzer40] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    flex-wrap: wrap;
}

.connections-summary[b-xg77vzer40] {
    font-size: var(--fs-small);
}

.connections-table .connections-name-col[b-xg77vzer40] {
    width: 32%;
}

.connections-table .connections-status-col[b-xg77vzer40] {
    width: 140px;
    text-align: center;
}

.connections-table .connections-action-col[b-xg77vzer40] {
    width: 130px;
    text-align: right;
}

.connections-table .connection-soon .connection-name[b-xg77vzer40] {
    color: var(--text-muted);
}

.connections-table .connection-soon .connection-used-by[b-xg77vzer40] {
    color: var(--text-subtle);
}

.connections-page[b-xg77vzer40]  .connections-footnote {
    display: block;
    padding: var(--space-3) var(--space-5) var(--space-4);
}

.connection-name[b-xg77vzer40] {
    display: block;
    font-size: 15px;
    font-weight: var(--weight-medium);
}

.connection-subtitle[b-xg77vzer40] {
    display: block;
    font-size: var(--fs-caption);
    color: var(--text-muted);
}

.connections-table[b-xg77vzer40]  .connection-status.mud-chip {
    width: 7.5rem;
    justify-content: center;
    margin: 0;
}
/* /Pages/DeleteRoleDialog.razor.rz.scp.css */
.delete-role-label[b-kcz0pfviwu] {
    display: block;
    margin-bottom: var(--space-2);
    font-size: var(--fs-small);
    color: var(--text-body);
}

.delete-role-error[b-kcz0pfviwu] {
    margin: var(--space-2) 0 0;
    font-size: var(--fs-small);
    color: var(--status-critical);
}

.delete-role-confirm[b-kcz0pfviwu]  .portal-button.mud-button-filled:not(:disabled) {
    border-color: var(--status-critical) !important;
}

.delete-role-confirm[b-kcz0pfviwu]  .portal-button.mud-button-filled:not(:disabled):hover,
.delete-role-confirm[b-kcz0pfviwu]  .portal-button.mud-button-filled:not(:disabled):focus-visible {
    border-color: var(--scarlet-700) !important;
    background: var(--scarlet-700);
}
/* /Pages/MySettings.razor.rz.scp.css */
/* Three short fields per card: on a wide screen they share one row instead of leaving a gap next to the last one. */
@media (min-width: 1280px) {
    .settings-grid[b-g8vjyy06d1] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.config-field[b-g8vjyy06d1]  .settings-value {
    display: flex;
    align-items: center;
    min-height: 28px;
    overflow-wrap: anywhere;
}

.settings-field-editable[b-g8vjyy06d1] {
    border-color: var(--black-howl-40);
    transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}

.settings-field-editable:focus-within[b-g8vjyy06d1] {
    border-color: var(--black-howl);
    box-shadow: inset 0 0 0 1px var(--black-howl);
}

.settings-field-editable[b-g8vjyy06d1]  .mud-input-control .mud-select-input {
    height: 28px;
    font-size: var(--fs-small);
    line-height: 28px;
}

.settings-page[b-g8vjyy06d1]  .settings-note {
    display: block;
    padding: 0 20px 18px;
    letter-spacing: 0;
}

/* The switches line up with the fields of the cards above. */
.settings-switches[b-g8vjyy06d1] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    padding: 14px 20px 18px;
}

/* A disabled outlined button keeps a dark frame in the shared style; here both buttons start disabled, so they get the muted frame. */
.settings-page[b-g8vjyy06d1]  .portal-button.mud-button-outlined:disabled {
    border-color: var(--border-default) !important;
}

@media (prefers-reduced-motion: reduce) {
    .settings-field-editable[b-g8vjyy06d1] {
        transition: none;
    }
}
/* /Pages/NoAccess.razor.rz.scp.css */
.forbidden-page[b-4verzd2opa]  .portal-notfound-title {
    line-height: 1.05;
    text-wrap: balance;
}

/* Role names are names, not codes: only the page and the action are set in the code font. */
.forbidden-page[b-4verzd2opa]  .forbidden-roles {
    font-family: var(--font-body);
}

.forbidden-page[b-4verzd2opa]  .portal-forbidden-meta {
    align-items: baseline;
}
/* /Pages/Roles.razor.rz.scp.css */
.sr-only[b-esqi0hpm7f] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* The role open in the editor is marked in the list, so it is clear which role the form below belongs to. */
.roles-page[b-esqi0hpm7f]  .roles-row-editing > td {
    background: var(--sky-10);
}

.roles-page[b-esqi0hpm7f]  .roles-row-editing > td:first-child {
    box-shadow: inset 3px 0 0 var(--fantasy-console-sky);
}

.roles-page[b-esqi0hpm7f]  .roles-table .mud-table-cell {
    vertical-align: middle;
}

.roles-page[b-esqi0hpm7f]  .roles-count-column {
    width: 96px;
    font-variant-numeric: tabular-nums;
}

.roles-page[b-esqi0hpm7f]  .config-row-action {
    width: 1%;
    white-space: nowrap;
    text-align: right;
}

.roles-page[b-esqi0hpm7f]  .config-row-action .portal-button-small.mud-button-root {
    min-width: 7.5rem;
}

.roles-editor[b-esqi0hpm7f] {
    scroll-margin-top: 80px;
}

/* Action groups sit side by side and wrap to the next row as a whole group. */
.roles-actions[b-esqi0hpm7f] {
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    align-items: start;
}

.roles-action-group[b-esqi0hpm7f] {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.roles-action-legend[b-esqi0hpm7f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    width: 100%;
    margin-bottom: 4px;
    padding: 0 0 6px;
    border-bottom: var(--border-w) solid var(--border-subtle);
}

.roles-action-legend[b-esqi0hpm7f]  .roles-group-toggle .mud-checkbox-label,
.roles-action-legend[b-esqi0hpm7f]  .roles-group-toggle .mud-typography {
    font-size: var(--fs-caption);
    font-weight: var(--weight-medium);
    letter-spacing: var(--tracking-caps);
    text-transform: uppercase;
    color: var(--text-body);
}

.roles-action-count[b-esqi0hpm7f] {
    flex: 0 0 auto;
    font-size: var(--fs-caption);
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
}

.roles-action-group[b-esqi0hpm7f]  .mud-checkbox .mud-typography {
    overflow-wrap: anywhere;
}

.roles-editor-foot[b-esqi0hpm7f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
}

.roles-danger[b-esqi0hpm7f]  .portal-button.mud-button-outlined:not(:disabled) {
    border-color: var(--status-critical) !important;
    color: var(--status-critical);
}

.roles-danger[b-esqi0hpm7f]  .portal-button.mud-button-outlined:not(:disabled):hover,
.roles-danger[b-esqi0hpm7f]  .portal-button.mud-button-outlined:not(:disabled):focus-visible {
    background: var(--status-critical);
    color: var(--white);
}

.roles-system-name[b-esqi0hpm7f],
.roles-system-group[b-esqi0hpm7f] {
    white-space: nowrap;
}

/* The group field is set in the code font for the object id; its messages stay in the text font. */
.config-field[b-esqi0hpm7f]  .mud-input-helper-text,
.config-field[b-esqi0hpm7f]  .mud-input-control-helper-container {
    font-family: var(--font-body);
}
