system-settings-page {
    --settings-touch-target-min: var(--touch-target-min-mobile);
    --settings-nav-min-width: 10rem;
    --settings-rail-inline: clamp(13rem, 15vw, 16rem);
    --settings-content-min-width: 20rem;
    --settings-raw-min-width: 30rem;
    --settings-editor-min-width: 16rem;
    --settings-panel-radius: 8px;
    --settings-panel-padding: 16px;
    --settings-panel-padding-compact: 12px;
    --settings-panel-gap: 16px;
    --settings-panel-bg: var(--color-surface-elevated);
    --settings-panel-shadow: var(--shadow-sm);
}

system-settings-page .settings-nav-card {
    container-type: inline-size;
    container-name: settings-nav;
}

system-settings-page .settings-content {
    container-type: inline-size;
    container-name: settings-content;
}

system-settings-page .settings-content-layout {
    align-items: start;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr);
    min-inline-size: 0;
}

system-settings-page .settings-nav-col--desktop-only {
    display: none;
}

@media (width >= 1366px) {
    system-settings-page .settings-nav-col--desktop-only {
        display: block;
    }
}

system-settings-page .settings-shell-grid {
    inline-size: 100%;
    margin-inline: auto;
    max-inline-size: var(--settings-shell-max, 100%);
}

system-settings-page .settings-content-col {
    align-items: stretch;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    justify-items: stretch;
    min-inline-size: 0;
}

system-settings-page .settings-content .hover-lift,
system-settings-page .settings-content .hover-lift:hover,
system-settings-page .settings-content .hover-lift:focus-visible {
    transform: none;
}

system-settings-page .settings-content {
    inline-size: 100%;
    margin-inline: auto;
    max-inline-size: var(--settings-content-max, 100%);
}

system-settings-page .alert-warning {
    background: color-mix(in srgb, var(--app-palette-yellow) 24%, var(--app-palette-snow));
    border-color: color-mix(in srgb, var(--app-palette-orange) 55%, var(--app-palette-navy));
    color: var(--app-palette-navy);
    font-weight: 700;
}

system-settings-page .settings-section-drawer {
    border: 1px solid rgba(var(--color-brand-primary-rgb), 0.14);
    border-radius: var(--settings-panel-radius);
    background: var(--settings-panel-bg);
    padding: 0;
    overflow: hidden;
}

system-settings-page .settings-subsection,
system-settings-page [id][data-settings-anchor-target] {
    scroll-margin-block-start: calc(var(--navbar-height, 72px) + 1rem);
}

system-settings-page .settings-section-drawer > summary {
    align-items: center;
    cursor: pointer;
    display: flex;
    font-weight: 700;
    justify-content: space-between;
    min-block-size: 2.75rem;
    list-style: none;
}

system-settings-page .settings-section-drawer > summary::-webkit-details-marker {
    display: none;
}

system-settings-page .settings-section-drawer-summary {
    block-size: 0;
    clip-path: inset(50%);
    inline-size: 0;
    overflow: hidden;
    padding: 0;
    pointer-events: none;
    position: absolute;
}

system-settings-page .settings-nav--drawer {
    display: grid;
    gap: 0.35rem;
    max-block-size: min(22rem, 62vh);
    overflow-y: auto;
    padding: 0.5rem;
}

system-settings-page .settings-section-drawer[hidden] {
    display: none;
}

system-settings-page .settings-section-drawer[hidden] .settings-nav--drawer {
    display: none;
}

system-settings-page .settings-mobile-section-control {
    display: grid;
    gap: 0.5rem;
    min-width: 0;
}

system-settings-page .settings-mobile-section-label {
    color: var(--settings-ink);
    font-size: max(var(--settings-micro-font-min, 0.75rem), var(--font-size-xs, 0.75rem));
    font-weight: 700;
}

system-settings-page .settings-mobile-section-control .btn {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    min-width: 0;
    width: 100%;
}

system-settings-page .settings-search-results {
    background: var(--color-surface-elevated);
    border: 1px solid var(--settings-border);
    border-radius: var(--settings-panel-radius);
    box-shadow: var(--shadow-lg);
    display: grid;
    gap: 0.25rem;
    inset-block-start: calc(100% + 0.25rem);
    inset-inline: 0;
    max-block-size: min(22rem, 70vh);
    overflow-y: auto;
    padding: 0.5rem;
    position: absolute;
    z-index: calc(var(--z-dropdown, 1000) + 2);
}

system-settings-page .settings-search-results-title,
system-settings-page .settings-search-results-empty {
    color: var(--settings-ink-muted);
    font-size: var(--font-size-xs, 0.75rem);
    font-weight: 700;
    padding: 0.35rem 0.5rem;
    text-transform: uppercase;
}

system-settings-page .settings-search-result {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: calc(var(--settings-panel-radius) - 2px);
    color: var(--settings-ink);
    display: flex;
    gap: 0.35rem;
    min-block-size: var(--settings-touch-target-min);
    padding: 0.5rem 0.625rem;
    text-align: left;
    width: 100%;
}

system-settings-page .settings-search-result:hover,
system-settings-page .settings-search-result:focus-visible {
    background: rgba(var(--color-brand-primary-rgb), 0.08);
}

system-settings-page .settings-nav .nav-link.settings-search-match:not(.active) {
    background: rgba(var(--color-brand-primary-rgb), 0.07);
}

system-settings-page .settings-utility-rail {
    display: none;
    min-inline-size: 0;
}

system-settings-page .settings-rail-card {
    background: var(--settings-panel-bg);
    border: 1px solid var(--settings-border);
    border-radius: var(--settings-panel-radius);
    box-shadow: var(--settings-panel-shadow);
    display: grid;
    gap: 0.625rem;
    padding: 0.875rem;
}

system-settings-page .settings-rail-card + .settings-rail-card {
    margin-top: 0.75rem;
}

system-settings-page .settings-rail-kicker {
    color: var(--settings-ink-muted);
    font-size: var(--font-size-xs, 0.75rem);
    font-weight: 800;
    text-transform: uppercase;
}

system-settings-page .settings-rail-title {
    color: var(--settings-ink);
    font-weight: 800;
    overflow-wrap: break-word;
}

system-settings-page .settings-rail-status {
    justify-self: start;
}

system-settings-page .settings-rail-actions,
system-settings-page .settings-rail-links {
    display: grid;
    gap: 0.5rem;
}

system-settings-page .settings-rail-actions .btn {
    justify-content: center;
    width: 100%;
}

system-settings-page .settings-rail-link {
    align-items: center;
    border-radius: 0.375rem;
    color: var(--settings-ink);
    display: flex;
    font-size: var(--font-size-sm, 0.875rem);
    font-weight: 700;
    line-height: 1.25;
    min-block-size: var(--settings-touch-target-min);
    padding: 0.45rem 0.5rem;
    text-decoration: none;
}

system-settings-page .settings-rail-link:hover,
system-settings-page .settings-rail-link:focus,
system-settings-page .settings-rail-link:focus-visible {
    background: rgba(var(--color-brand-primary-rgb), 0.08);
    color: var(--color-brand-primary);
    box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--settings-accent, var(--bs-primary)) 34%, transparent);
    outline: 2px solid var(--settings-focus-ring, var(--settings-accent, var(--bs-primary)));
    outline-offset: 2px;
}

system-settings-page a:not(.btn):focus,
system-settings-page a:not(.btn):focus-visible {
    border-radius: 0.375rem;
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--settings-accent, var(--bs-primary)) 22%, transparent);
    outline: 2px solid var(--settings-focus-ring, var(--settings-accent, var(--bs-primary)));
    outline-offset: 2px;
}

system-settings-page .settings-rail-empty {
    color: var(--settings-ink-muted);
    font-size: var(--font-size-xs, 0.75rem);
}

system-settings-page .settings-mobile-save-bar {
    align-items: center;
    background: var(--color-surface-elevated);
    border: 1px solid var(--settings-border);
    border-radius: 0.5rem 0.5rem 0 0;
    box-shadow: 0 -0.75rem 1.75rem rgba(10, 29, 55, 0.12);
    display: grid;
    gap: 0.625rem;
    inset-block-end: 0;
    inset-inline: 0;
    margin-inline: auto;
    max-inline-size: min(100%, var(--settings-shell-max, 100%));
    padding: 0.625rem max(0.75rem, env(safe-area-inset-left)) calc(0.625rem + env(safe-area-inset-bottom)) max(0.75rem, env(safe-area-inset-right));
    position: sticky;
    z-index: calc(var(--z-sticky, 1020) + 2);
}

system-settings-page .settings-mobile-save-status {
    color: var(--settings-ink);
    font-size: var(--font-size-sm, 0.875rem);
    font-weight: 800;
}

system-settings-page .settings-mobile-save-actions {
    display: grid;
    gap: 0.5rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

system-settings-page .settings-mobile-save-actions .btn {
    justify-content: center;
    min-width: 0;
}

system-settings-page .settings-mobile-save-bar .btn:is(:focus, :focus-visible) {
    outline: var(--focus-ring-width) solid rgba(var(--color-brand-primary-rgb), 0.62);
    outline-offset: 2px;
    box-shadow: 0 0 0 var(--focus-ring-width) rgba(var(--color-brand-primary-rgb), 0.16);
}

system-settings-page .settings-subsection {
    border: 1px solid var(--settings-border);
    border-radius: var(--settings-panel-radius);
    background: var(--settings-panel-bg);
    padding: 0;
}

system-settings-page .settings-subsection + .settings-subsection {
    margin-top: 0.5rem;
}

system-settings-page .settings-subsection-heading {
    margin: 0;
}

system-settings-page .settings-subsection-summary {
    align-items: center;
    background: transparent;
    border: 0;
    block-size: auto;
    color: var(--settings-ink);
    display: grid;
    gap: 0.5rem;
    grid-template-columns: minmax(0, 1fr) auto auto;
    min-block-size: var(--settings-touch-target-min);
    padding: 0.75rem 0.875rem;
    text-align: left;
    width: 100%;
}

system-settings-page .settings-subsection-summary:focus {
    box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--settings-accent, var(--bs-primary)) 32%, transparent);
    outline: 2px solid var(--settings-focus-ring, var(--settings-accent, var(--bs-primary)));
    outline-offset: -2px;
}

system-settings-page .settings-subsection-title {
    align-items: center;
    display: inline-flex;
    gap: 0.35rem;
    min-width: 0;
    overflow-wrap: break-word;
}

system-settings-page .settings-subsection-meta {
    color: var(--settings-ink-muted);
    font-size: max(var(--settings-micro-font-min), var(--font-size-xs));
    font-weight: 600;
    white-space: nowrap;
}

system-settings-page .settings-subsection-chevron {
    transition: transform var(--dur-fast, 150ms) var(--ease-out, ease);
}

system-settings-page .settings-subsection.is-open .settings-subsection-chevron {
    transform: rotate(180deg);
}

system-settings-page .settings-subsection-body {
    border-top: 1px solid var(--settings-border);
    padding: 0.875rem;
    min-width: 0;
    overflow-x: visible;
}

system-settings-page .settings-inline-editor,
system-settings-page .settings-editor-table,
system-settings-page .settings-raw-table-wrapper,
system-settings-page .table-responsive,
system-settings-page .cq-table {
    max-width: 100%;
    min-width: 0;
}

system-settings-page .settings-editor-table,
system-settings-page .settings-raw-table-wrapper,
system-settings-page .table-responsive {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
}

system-settings-page .settings-rbac-editor {
    border: 1px solid var(--settings-border);
    border-radius: 0.5rem;
    background: var(--color-surface-elevated);
    overflow: hidden;
}

system-settings-page .settings-rbac-editor + .settings-rbac-editor {
    margin-top: 0.75rem;
}

system-settings-page .settings-editor-summary {
    align-items: center;
    cursor: pointer;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(0, 1fr) auto;
    min-block-size: var(--settings-touch-target-min);
    padding: 0.75rem 0.875rem;
}

system-settings-page .settings-editor-summary::-webkit-details-marker {
    display: none;
}

system-settings-page .settings-editor-summary::after {
    background-color: currentColor;
    block-size: 1rem;
    color: var(--settings-ink-muted);
    content: "";
    display: inline-flex;
    inline-size: 1rem;
    line-height: 1;
    -webkit-mask: url('../icons/bootstrap/chevron-down.svg') center / contain no-repeat;
    mask: url('../icons/bootstrap/chevron-down.svg') center / contain no-repeat;
    transition: transform var(--dur-fast, 150ms) var(--ease-out, ease);
}

system-settings-page .settings-rbac-editor[open] > .settings-editor-summary::after {
    transform: rotate(180deg);
}

system-settings-page .settings-rbac-editor:not([open]) > .settings-editor-panel {
    display: none;
}

system-settings-page .settings-editor-title,
system-settings-page .settings-editor-description {
    display: block;
    min-width: 0;
}

system-settings-page .settings-editor-title {
    color: var(--settings-ink);
    font-size: var(--font-size-sm);
    font-weight: 800;
    text-transform: uppercase;
}

system-settings-page .settings-editor-description {
    color: var(--settings-ink-muted);
    font-size: var(--font-size-xs);
    font-weight: 600;
    line-height: 1.35;
    margin-top: 0.125rem;
}

system-settings-page .settings-editor-count {
    background: rgba(var(--color-brand-primary-rgb), 0.08);
    border: 1px solid rgba(var(--color-brand-primary-rgb), 0.16);
    border-radius: 999px;
    color: var(--settings-ink);
    font-size: var(--font-size-xs);
    font-weight: 800;
    line-height: 1;
    padding: 0.35rem 0.5rem;
    white-space: nowrap;
}

system-settings-page .settings-editor-panel {
    border-top: 1px solid var(--settings-border);
    display: grid;
    gap: 0.75rem;
    padding: 0.875rem;
}

system-settings-page .settings-permission-editor .minw-180 {
    min-width: 14rem;
}

system-settings-page .settings-special-permission-grid {
    display: grid;
    gap: 0.625rem;
}

system-settings-page .settings-special-permission-item {
    align-items: flex-start;
    display: grid;
    gap: 0.625rem;
    grid-template-columns: auto minmax(0, 1fr);
    margin: 0;
}

system-settings-page .settings-special-permission-item .form-check-input {
    margin-top: 0.2rem;
}

system-settings-page .settings-special-permission-label {
    min-width: 0;
}

system-settings-page .settings-role-permission-editor table,
system-settings-page .settings-role-permission-editor .table {
    min-width: 48rem;
    table-layout: fixed;
}

system-settings-page .settings-role-permission-editor td:first-child,
system-settings-page .settings-role-permission-editor th:first-child {
    min-width: 17rem;
    width: 20rem;
}

system-settings-page .settings-role-permission-editor td code {
    white-space: nowrap;
}

system-settings-page .form-text code,
system-settings-page .form-text kbd,
system-settings-page .badge code {
    font-size: max(var(--font-size-2xs), 0.875em);
}

system-settings-page .table-responsive .settings-nav-table {
    table-layout: auto;
}

system-settings-page .table-responsive .jobs-transition-table {
    table-layout: auto;
}

system-settings-page .settings-transition-matrix {
    container-type: normal;
    overflow-x: auto;
    max-inline-size: 100%;
    min-inline-size: 0;
}

system-settings-page .jobs-transition-table .badge {
    overflow-wrap: normal;
    word-break: keep-all;
    white-space: normal;
}

system-settings-page :is(.settings-editor-table, .settings-workflow-matrix, .jobs-transition-table, .settings-role-permission-editor) .badge {
    overflow-wrap: normal;
    word-break: keep-all;
    white-space: normal;
}

system-settings-page .jobs-transition-table thead th:first-child {
    white-space: nowrap;
}

system-settings-page .settings-role-permission-editor td:first-child .form-control {
    min-width: 13rem;
}

system-settings-page .settings-licensing-sla-grid {
    align-items: start;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 768px) {
    system-settings-page .settings-licensing-sla-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 768px) {
    system-settings-page .settings-grid-3col > .col-md-3,
    system-settings-page .settings-grid-3col > .col-md-6 {
        flex: 0 0 33.3333%;
        max-width: 33.3333%;
    }
}

system-settings-page .palette-color-picker {
    max-inline-size: 2.5rem;
    padding: 2px;
}

system-settings-page .palette-color-group {
    gap: var(--space-1);
}

system-settings-page .palette-color-group .palette-color-picker {
    flex: 0 0 var(--settings-touch-target-min);
    inline-size: var(--settings-touch-target-min);
    max-inline-size: var(--settings-touch-target-min);
    min-inline-size: var(--settings-touch-target-min);
}

system-settings-page .palette-color-group .palette-color-text {
    flex: 1 1 7rem;
    min-inline-size: 7rem;
}

system-settings-page .palette-color-group :is(.palette-on-preview, .palette-lock-indicator) {
    flex: 0 0 2.25rem;
    inline-size: 2.25rem;
    min-inline-size: 2.25rem;
    padding-inline: 0;
}

system-settings-page .palette-color-group :is(.palette-color-picker, .palette-color-text, .palette-on-preview, .palette-lock-indicator) {
    block-size: var(--settings-touch-target-min);
    min-block-size: var(--settings-touch-target-min);
}

system-settings-page .input-group :is(.palette-on-preview, .palette-swatch),
system-settings-page :is(.palette-on-preview, .palette-swatch) {
    align-items: center;
    background: var(--palette-swatch-bg, var(--app-palette-snow));
    background-color: var(--palette-swatch-bg, var(--app-palette-snow));
    color: var(--palette-swatch-fg, var(--app-palette-navy));
    display: inline-flex;
    font-weight: 700;
    inline-size: 2.25rem;
    justify-content: center;
    min-inline-size: 2.25rem;
    text-align: center;
}

system-settings-page .palette-swatch--grey { --palette-swatch-bg: var(--app-palette-grey); --palette-swatch-fg: var(--app-palette-navy); }
system-settings-page .palette-swatch--blue { --palette-swatch-bg: var(--app-palette-blue); --palette-swatch-fg: var(--app-palette-snow); }
system-settings-page .palette-swatch--green { --palette-swatch-bg: var(--app-palette-green); --palette-swatch-fg: var(--app-palette-navy); }
system-settings-page .palette-swatch--yellow { --palette-swatch-bg: var(--app-palette-yellow); --palette-swatch-fg: var(--app-palette-navy); }
system-settings-page .palette-swatch--dark-grey { --palette-swatch-bg: var(--app-palette-dark-grey); --palette-swatch-fg: var(--app-palette-snow); }
system-settings-page .palette-swatch--midnight-navy { --palette-swatch-bg: var(--app-palette-navy); --palette-swatch-fg: var(--app-palette-snow); }
system-settings-page .palette-swatch--snow-white { --palette-swatch-bg: var(--app-palette-snow); --palette-swatch-fg: var(--app-palette-navy); }
system-settings-page .palette-swatch--cloud-grey { --palette-swatch-bg: var(--app-palette-cloud); --palette-swatch-fg: var(--app-palette-navy); }
system-settings-page .palette-swatch--critical-red { --palette-swatch-bg: var(--app-palette-red); --palette-swatch-fg: var(--app-palette-snow); }
system-settings-page .palette-swatch--alert-orange { --palette-swatch-bg: var(--app-palette-orange); --palette-swatch-fg: var(--app-palette-navy); }
system-settings-page .palette-swatch--forest-green { --palette-swatch-bg: var(--app-palette-forest); --palette-swatch-fg: var(--app-palette-snow); }
system-settings-page .palette-swatch--battery-indigo { --palette-swatch-bg: var(--app-palette-indigo); --palette-swatch-fg: var(--app-palette-snow); }
system-settings-page .palette-swatch--telemetry-teal { --palette-swatch-bg: var(--app-palette-teal); --palette-swatch-fg: var(--app-palette-navy); }
system-settings-page .palette-swatch--analytical-violet { --palette-swatch-bg: var(--app-palette-violet); --palette-swatch-fg: var(--app-palette-snow); }
system-settings-page .palette-swatch--steel-blue { --palette-swatch-bg: var(--app-palette-steel); --palette-swatch-fg: var(--app-palette-snow); }
system-settings-page .palette-swatch--black { --palette-swatch-bg: var(--app-palette-black); --palette-swatch-fg: var(--app-palette-white); }
system-settings-page .palette-swatch--white { --palette-swatch-bg: var(--app-palette-white); --palette-swatch-fg: var(--app-palette-black); }

system-settings-page .settings-role-permission-editor td.actions-cell,
system-settings-page .settings-role-permission-editor th.actions-cell,
system-settings-page .settings-permission-editor td.actions-cell,
system-settings-page .settings-permission-editor th.actions-cell {
    width: 7.5rem;
    min-width: 7.5rem;
}

system-settings-page .settings-role-permission-editor td.actions-cell .btn,
system-settings-page .settings-role-permission-editor th.actions-cell .btn,
system-settings-page .settings-permission-editor td.actions-cell .btn,
system-settings-page .settings-permission-editor th.actions-cell .btn {
    justify-content: center;
    min-inline-size: 6rem;
    white-space: nowrap;
}

system-settings-page config-table-component .table-responsive .table-enterprise {
    table-layout: auto;
}

system-settings-page config-table-component .table-responsive .table td[data-label="Model"] {
    white-space: nowrap;
}

system-settings-page config-table-component .table-responsive .table td[data-label="Type"],
system-settings-page config-table-component .table-responsive .table td[data-label="Type"] .badge {
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: keep-all;
}

system-settings-page :is(.btn, .nav-link, .settings-search-result) {
    align-items: center;
    display: inline-flex;
}

system-settings-page :is(.btn, .nav-link, .settings-search-result) > .bi {
    flex: 0 0 auto;
    line-height: 1;
}

system-settings-page .settings-save-region {
    border-top: 1px solid var(--settings-border);
    gap: 0.75rem;
}

system-settings-page .settings-save-region .btn {
    align-items: center;
    display: inline-flex;
    justify-content: center;
}

system-settings-page .settings-raw-table-wrapper {
    container-type: inline-size;
    container-name: settings-raw;
}

system-settings-page .settings-raw-disclosure {
    border-top: 1px solid var(--settings-border);
    margin-top: var(--settings-panel-gap);
}

system-settings-page .settings-raw-disclosure > summary {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: var(--space-3);
    justify-content: space-between;
    list-style: none;
    min-block-size: var(--settings-touch-target-min);
    min-inline-size: 0;
}

system-settings-page .settings-raw-disclosure > summary::-webkit-details-marker {
    display: none;
}

system-settings-page .settings-raw-disclosure > summary::after {
    background-color: currentColor;
    block-size: 1rem;
    color: var(--settings-ink-muted);
    content: "";
    flex: 0 0 auto;
    inline-size: 1rem;
    -webkit-mask: url('../icons/bootstrap/chevron-down.svg') center / contain no-repeat;
    mask: url('../icons/bootstrap/chevron-down.svg') center / contain no-repeat;
    transition: transform var(--dur-fast, 150ms) var(--ease-out, ease);
}

system-settings-page .settings-raw-disclosure[open] > summary::after {
    transform: rotate(180deg);
}

system-settings-page .settings-raw-disclosure-title,
system-settings-page .settings-raw-disclosure-count {
    min-inline-size: 0;
}

system-settings-page .settings-raw-disclosure-title {
    color: var(--settings-ink);
    font-size: var(--font-size-sm);
    font-weight: 700;
}

system-settings-page .settings-raw-disclosure-count {
    color: var(--settings-ink-muted);
    font-size: var(--font-size-xs);
    font-weight: 600;
    white-space: nowrap;
}

system-settings-page .settings-raw-disclosure-body {
    border-top: 1px solid var(--settings-border);
    padding-block: var(--space-3) 0;
}

system-settings-page .settings-raw-disclosure-description {
    color: var(--settings-ink-muted);
    font-size: var(--font-size-xs);
    margin-block: 0 var(--space-3);
}

system-settings-page .settings-editor-toolbar {
    container-type: inline-size;
    container-name: settings-editor;
}

system-settings-page .master-data-shell {
    container-type: inline-size;
}

system-settings-page .master-data-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    max-inline-size: 100%;
}

system-settings-page .master-data-tabs .nav-link {
    align-items: center;
    border-radius: 0.5rem 0.5rem 0 0;
    display: inline-flex;
    min-block-size: 44px;
    white-space: nowrap;
}

system-settings-page .master-data-table-wrap {
    max-inline-size: 100%;
}

@container (max-width: 560px) {
    system-settings-page .master-data-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-block-end: 0.25rem;
        scrollbar-width: thin;
    }

    system-settings-page .master-data-tabs .nav-link {
        min-block-size: 48px;
    }

    system-settings-page config-table-master .table,
    system-settings-page config-table-master thead,
    system-settings-page config-table-master tbody,
    system-settings-page config-table-master tr,
    system-settings-page config-table-master th,
    system-settings-page config-table-master td {
        display: block;
        width: 100%;
    }

    system-settings-page config-table-master thead {
        display: none;
    }

    system-settings-page config-table-master tr {
        border-top: 1px solid var(--settings-border);
        padding: 0.75rem 0.875rem;
    }

    system-settings-page config-table-master td {
        border: 0;
        min-width: 0;
        padding: 0.35rem 0;
    }

    system-settings-page config-table-master td::before {
        color: var(--settings-ink-muted);
        content: attr(data-label);
        display: block;
        font-size: var(--font-size-2xs);
        font-weight: 700;
        margin-bottom: 0.125rem;
    }

    system-settings-page config-table-master .actions-cell {
        display: grid;
        gap: 0.5rem;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    system-settings-page config-table-master .actions-cell .btn {
        min-block-size: 48px;
    }
}

system-settings-page[data-layout-mode="mobile"] .settings-mobile-toolbar,
system-settings-page[data-layout-mode="tablet"] .settings-mobile-toolbar {
    display: grid;
}

system-settings-page[data-layout-mode="mobile"] .settings-section-drawer,
system-settings-page[data-layout-mode="tablet"] .settings-section-drawer {
    display: block;
}

system-settings-page[data-layout-mode="laptop"] .settings-mobile-toolbar,
system-settings-page[data-layout-mode="desktop"] .settings-mobile-toolbar,
system-settings-page[data-layout-mode="laptop"] .settings-mobile-save-bar,
system-settings-page[data-layout-mode="desktop"] .settings-mobile-save-bar {
    display: none;
}

system-settings-page[data-layout-mode="laptop"] .settings-section-drawer,
system-settings-page[data-layout-mode="desktop"] .settings-section-drawer {
    display: none;
}

system-settings-page[data-layout-mode="mobile"] .settings-nav-col,
system-settings-page[data-layout-mode="tablet"] .settings-nav-col {
    display: none;
}

@media (width < 768px) {
    system-settings-page .settings-nav-col {
        display: none;
    }

    system-settings-page .settings-shell-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    system-settings-page .steel-structures-table-wrap {
        overflow-x: clip;
    }

    system-settings-page .steel-structures-table,
    system-settings-page .steel-structures-table thead,
    system-settings-page .steel-structures-table tbody,
    system-settings-page .steel-structures-table tr,
    system-settings-page .steel-structures-table th,
    system-settings-page .steel-structures-table td {
        display: block;
        width: 100%;
        min-width: 0;
    }

    system-settings-page .steel-structures-table thead {
        display: none;
    }

    system-settings-page .steel-structures-table tr {
        border-top: 1px solid var(--settings-border);
        padding: 0.75rem 0.875rem;
    }

    system-settings-page .steel-structures-table td {
        border: 0;
        padding: 0.35rem 0;
        text-align: left;
    }

    system-settings-page .steel-structures-table td::before {
        content: attr(data-label);
        display: block;
        color: var(--settings-ink-muted);
        font-size: max(var(--settings-micro-font-min), var(--font-size-xs));
        font-weight: 700;
        margin-bottom: 0.2rem;
        text-transform: uppercase;
    }

    system-settings-page .steel-structures-table td[data-label="Actions"]::before {
        margin-bottom: 0.4rem;
    }

    system-settings-page .steel-structures-table td[data-label="Actions"] .btn-group {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: 100%;
    }

    system-settings-page .steel-structures-table td[data-label="Actions"] .btn {
        justify-content: center;
        min-width: 0;
        width: 100%;
    }
}

system-settings-page[data-layout-mode="laptop"] .settings-nav-col,
system-settings-page[data-layout-mode="desktop"] .settings-nav-col {
    display: block;
}

system-settings-page[data-layout-mode="laptop"] .settings-utility-rail,
system-settings-page[data-layout-mode="desktop"] .settings-utility-rail {
    display: block;
}

system-settings-page[data-layout-mode="laptop"] .settings-rbac-editor,
system-settings-page[data-layout-mode="desktop"] .settings-rbac-editor {
    border: 0;
    border-radius: 0;
    background: transparent;
    overflow: visible;
}

system-settings-page[data-layout-mode="laptop"] .settings-rbac-editor > .settings-editor-summary,
system-settings-page[data-layout-mode="desktop"] .settings-rbac-editor > .settings-editor-summary {
    display: none;
}

system-settings-page[data-layout-mode="laptop"] .settings-rbac-editor > .settings-editor-panel,
system-settings-page[data-layout-mode="desktop"] .settings-rbac-editor > .settings-editor-panel {
    border-top: 0;
    padding: 0;
}

system-settings-page[data-layout-mode="laptop"] .settings-permission-editor .table,
system-settings-page[data-layout-mode="desktop"] .settings-permission-editor .table {
    table-layout: fixed;
}

system-settings-page[data-layout-mode="laptop"] .settings-permission-editor .minw-180,
system-settings-page[data-layout-mode="desktop"] .settings-permission-editor .minw-180 {
    min-width: 16rem;
}

system-settings-page[data-layout-mode="laptop"] .settings-special-permission-item,
system-settings-page[data-layout-mode="desktop"] .settings-special-permission-item {
    gap: 0.75rem;
}

system-settings-page[data-layout-mode="laptop"] .settings-special-permission-grid,
system-settings-page[data-layout-mode="desktop"] .settings-special-permission-grid {
    gap: 0.5rem;
}

system-settings-page .settings-subsection:not(.is-open) .settings-subsection-body {
    display: none;
}

system-settings-page :is(
    .settings-nav .nav-link,
    .master-data-tabs .nav-link,
    .master-data-items-tabs .nav-link,
    .settings-mobile-toolbar .form-control,
    .settings-mobile-toolbar .form-select,
    .settings-mobile-toolbar .btn,
    .settings-content,
    .settings-content .form-control,
    .settings-content .form-select,
    .settings-content .form-check-input,
    .settings-content .form-range,    .settings-content .btn,
    .settings-editor-toolbar .btn,
    .settings-raw-actions .btn
):is(:focus, :focus-visible) {
    outline: var(--focus-ring-width) solid rgba(var(--color-brand-primary-rgb), 0.62);
    outline-offset: 2px;
    box-shadow: 0 0 0 var(--focus-ring-width) rgba(var(--color-brand-primary-rgb), 0.16);
}

system-settings-page .master-data-tabs .nav-link:is(:focus, :focus-visible) {
    outline: var(--focus-ring-width) solid rgba(var(--color-brand-primary-rgb), 0.62);
    outline-offset: 2px;
    box-shadow: 0 0 0 var(--focus-ring-width) rgba(var(--color-brand-primary-rgb), 0.16);
}

@container settings-nav (width < 18rem) {
    system-settings-page .settings-nav .nav-link {
        font-size: var(--font-size-sm);
        padding: 0.375rem 0.625rem;
    }

    system-settings-page .settings-nav {
        gap: 0.25rem;
        padding: 0.25rem;
    }
}

@container settings-content (width < 36rem) {
    system-settings-page .settings-content .cq-form :is(.row.g-3, .row.g-4) > [class*="col-"] {
        flex: 0 0 100%;
        max-width: 100%;
    }

    system-settings-page .settings-filter-row .settings-filter-group {
        width: 100%;
    }
}

system-settings-page .settings-filter-row {
    align-items: center;
    display: flex;
    gap: var(--space-2);
    justify-content: space-between;
}

system-settings-page config-table-component {
    display: block;
    min-inline-size: 0;
}

@media (width < 1366px) {
    system-settings-page .settings-filter-row {
        align-items: stretch;
        flex-wrap: wrap;
    }

    system-settings-page .settings-filter-group {
        align-content: start;
        display: grid;
        grid-auto-flow: row;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: none;
        inline-size: 100%;
        min-inline-size: 0;
        overflow-y: auto;
        padding: var(--space-3);
    }
}

@container settings-raw (width < 48rem) {
    system-settings-page .settings-raw-table {
        min-width: 0;
    }

    system-settings-page .settings-raw-table,
    system-settings-page .settings-raw-table thead,
    system-settings-page .settings-raw-table tbody,
    system-settings-page .settings-raw-table tr,
    system-settings-page .settings-raw-table th,
    system-settings-page .settings-raw-table td {
        display: block;
        width: 100%;
    }

    system-settings-page .settings-raw-table thead {
        display: none;
    }

    system-settings-page .settings-raw-table tr {
        background: var(--color-surface-elevated);
        border: 1px solid var(--settings-border);
        border-radius: 0.5rem;
        margin-block-end: 0.75rem;
        padding: 0.75rem;
    }

    system-settings-page .settings-raw-table td {
        border: 0;
        min-width: 0;
        padding: 0.4rem 0;
    }

    system-settings-page .settings-raw-table td.text-nowrap {
        white-space: normal;
    }

    system-settings-page .settings-raw-table td::before {
        color: var(--settings-ink-muted);
        content: attr(data-label);
        display: block;
        font-size: var(--font-size-xs, 0.75rem);
        font-weight: 800;
        margin-block-end: 0.2rem;
        text-transform: uppercase;
    }

    system-settings-page .settings-raw-table .actions-cell {
        display: grid;
        gap: 0.5rem;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    system-settings-page .settings-raw-actions .btn {
        width: 100%;
        justify-content: center;
    }

    system-settings-page .settings-raw-summary {
        font-size: var(--font-size-xs);
    }
}

@container settings-editor (width < 28rem) {
    system-settings-page .settings-editor-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    system-settings-page .settings-editor-toolbar .btn {
        width: 100%;
    }
}


@media (width < 768px) {
    system-settings-page {
        --settings-touch-target-min: 48px;
        --settings-shell-max: 100%;
    }

    system-settings-page .settings-shell {
        padding-bottom: 1rem;
    }

    system-settings-page .settings-shell-grid {
        grid-template-columns: minmax(0, 1fr);
        row-gap: 0.625rem;
    }

    system-settings-page :is(
        [data-reset-section],
        .settings-raw-actions .btn,
        .settings-editor-toolbar .btn,
        .settings-mobile-toolbar .btn,
        .settings-mobile-save-bar .btn,        .settings-content .form-check-input,
        .settings-content .form-check
    ) {
        min-height: 48px;
        min-width: 48px;
        height: 48px;
    }

    system-settings-page .settings-mobile-toolbar {
        margin-bottom: 0.5rem;
        padding: 0.5rem;
        position: sticky;
        top: 0;
        z-index: calc(var(--z-sticky, 1020) + 1);
    }

    system-settings-page .settings-mobile-section-control {
        gap: 0.35rem;
    }

    system-settings-page .settings-section-drawer {
        margin-top: -0.25rem;
        margin-bottom: 0.5rem;
    }

    system-settings-page .settings-nav--drawer {
        max-block-size: min(18rem, 52vh);
    }

    system-settings-page .settings-content-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    system-settings-page .settings-mobile-save-actions {
        grid-template-columns: minmax(0, 1fr);
    }

system-settings-page.workspace-page #refreshSettingsBtn,
system-settings-page.workspace-page .settings-mobile-toolbar :is(.form-control, .form-select),
system-settings-page.workspace-page :is(#settingsSearchMobile, [data-settings-toggle-drawer]) {
        min-height: var(--settings-touch-target-min);
        height: var(--settings-touch-target-min);
        min-width: var(--settings-touch-target-min);
        box-sizing: border-box;
    }

    system-settings-page .settings-subsection-summary {
        min-block-size: 48px;
        padding: 10px 12px;
    }

    system-settings-page .settings-subsection-body {
        padding: var(--settings-panel-padding-compact);
    }

    system-settings-page .settings-content .cq-form :is(.row.g-3, .row.g-4) {
        --bs-gutter-x: 0.75rem;
        --bs-gutter-y: 0.625rem;
    }

    system-settings-page .settings-content :is(.form-control, .form-select) {
        font-size: 0.95rem;
    }

    system-settings-page .settings-save-region {
        background: var(--color-surface-elevated);
        margin-inline: -1px;
    }

    system-settings-page .settings-editor-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    system-settings-page .settings-editor-toolbar .btn {
        width: 100%;
    }
}

@media (width >= 768px) and (width < 1366px) {
    system-settings-page {
        --settings-touch-target-min: 48px;
        --settings-shell-max: var(--container-tablet);
    }

    system-settings-page .settings-shell-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    system-settings-page :is(
        [data-reset-section],
        .settings-raw-actions .btn,
        .settings-editor-toolbar .btn,
        .settings-mobile-toolbar .btn,
        .settings-mobile-save-bar .btn,        .settings-content .form-check-input,
        .settings-content .form-check,
        #refreshSettingsBtn
    ) {
        min-height: 48px;
        min-width: 48px;
        height: 48px;
    }

    system-settings-page .settings-editor-toolbar {
        flex-direction: row;
        align-items: center;
    }

    system-settings-page .settings-mobile-toolbar {
        margin-bottom: 0.75rem;
        padding: 0.625rem;
        position: sticky;
        top: 0;
        z-index: calc(var(--z-sticky, 1020) + 1);
    }

    system-settings-page .settings-section-drawer {
        margin-bottom: 0.75rem;
    }

    system-settings-page .settings-content-layout {
        grid-template-columns: minmax(0, 1fr);
    }

system-settings-page.workspace-page #refreshSettingsBtn,
system-settings-page.workspace-page .settings-mobile-toolbar :is(.form-control, .form-select),
system-settings-page.workspace-page :is(#settingsSearchMobile, [data-settings-toggle-drawer]) {
        min-height: var(--settings-touch-target-min);
        height: var(--settings-touch-target-min);
        min-width: var(--settings-touch-target-min);
        box-sizing: border-box;
    }

    system-settings-page .settings-save-region {
        background: var(--color-surface-elevated);
    }

    system-settings-page .settings-editor-toolbar .btn {
        width: auto;
    }
}

@media (width >= 1366px) and (width < 1920px) {
    system-settings-page {
        --settings-touch-target-min: 44px;
        --settings-shell-max: var(--settings-shell-max-laptop, 84rem);
    }

    system-settings-page .settings-shell-grid {
        grid-template-columns: minmax(0, var(--settings-sidebar-inline, 20rem)) minmax(0, 1fr);
    }

    system-settings-page .settings-content-layout {
        grid-template-columns: minmax(0, 1fr) minmax(12rem, var(--settings-rail-inline));
    }

    system-settings-page .settings-utility-rail {
        position: sticky;
        top: 1rem;
    }

    system-settings-page :is(
        [data-reset-section],
        .settings-raw-actions .btn,
        .settings-editor-toolbar .btn,
        .settings-mobile-toolbar .btn,        .settings-content .form-check-input,
        .settings-content .form-check,
        #refreshSettingsBtn
    ) {
        min-height: 44px;
        min-width: 44px;
        height: 44px;
    }

    system-settings-page .settings-editor-toolbar {
        flex-direction: row;
        align-items: center;
    }

    system-settings-page .settings-editor-toolbar .btn {
        width: auto;
    }
}

@media (width >= 1920px) {
    system-settings-page {
        --settings-touch-target-min: 44px;
        --settings-shell-max: var(--container-desktop, 100%);
    }

    system-settings-page .settings-shell-grid {
        grid-template-columns: minmax(0, var(--settings-sidebar-inline, 20rem)) minmax(0, 1fr);
    }

    system-settings-page .settings-content-layout {
        grid-template-columns: minmax(0, 1fr) minmax(13rem, var(--settings-rail-inline));
    }

    system-settings-page .settings-utility-rail {
        position: sticky;
        top: 1rem;
    }

    system-settings-page :is(
        [data-reset-section],
        .settings-raw-actions .btn,
        .settings-editor-toolbar .btn,
        .settings-mobile-toolbar .btn,        .settings-content .form-check-input,
        .settings-content .form-check,
        #refreshSettingsBtn
    ) {
        min-height: 44px;
        min-width: 44px;
        height: 44px;
    }

    system-settings-page .settings-editor-toolbar {
        flex-direction: row;
        align-items: center;
    }

    system-settings-page .settings-editor-toolbar .btn {
        width: auto;
    }
}

system-settings-page .settings-content,
system-settings-page .settings-content .cq-form,
system-settings-page .settings-subsection-body,
system-settings-page .settings-content .card-body {
    min-inline-size: 0;
}

system-settings-page :is(
    .settings-content,
    .settings-content .cq-form,
    .settings-content .card,
    .settings-content .card-body,
    .settings-content .card-footer,
    .settings-subsection,
    .settings-subsection-body,
    .settings-inline-editor,
    .settings-editor-panel,
    .settings-raw,
    .settings-raw-inline,
    .settings-raw-inline-body,
    .settings-raw-toolbar,
    .settings-raw-actions,
    .settings-save-region,
    .settings-mobile-save-bar,
    .settings-mobile-save-actions
) {
    max-inline-size: 100%;
    min-inline-size: 0;
}

system-settings-page :is(
    .settings-mobile-toolbar,
    .settings-nav-card.card,
    .settings-content .card,
    .settings-rail-card,
    .settings-section-drawer,
    .settings-subsection,
    .settings-raw,
    .settings-raw-inline,
    .settings-inline-editor,
    .settings-editor-panel,
    .settings-mobile-save-bar
) {
    background: var(--settings-panel-bg);
    border: 1px solid var(--settings-border);
    border-radius: var(--settings-panel-radius);
    box-shadow: var(--settings-panel-shadow);
    box-sizing: border-box;
}

system-settings-page :is(.settings-nav-card.card, .settings-content .card) {
    overflow: hidden;
    padding: 0;
}

system-settings-page .settings-content .card > :is(.card-header, .card-body, .card-footer) {
    background: transparent;
    border-color: var(--settings-border);
    box-sizing: border-box;
}

system-settings-page .settings-content .card > .card-header {
    min-block-size: 56px;
    padding: var(--settings-panel-padding);
}

system-settings-page .settings-content .card > .card-body {
    padding: var(--settings-panel-padding);
}

system-settings-page .settings-content .card > .card-footer {
    padding: var(--settings-panel-padding-compact) var(--settings-panel-padding);
}

system-settings-page .settings-nav-card.card > .card-body {
    padding: 0;
}

system-settings-page .settings-nav-card .workspace-panel-surface {
    padding: var(--settings-panel-padding-compact);
}

system-settings-page .settings-nav {
    gap: 4px;
    padding: 8px;
}

system-settings-page .settings-nav .nav-link {
    border-radius: calc(var(--settings-panel-radius) - 2px);
    padding: 10px 12px;
}

system-settings-page .settings-mobile-toolbar {
    padding: var(--settings-panel-padding-compact);
}

system-settings-page :is(
    [data-reset-section],
    .settings-content .btn,
    .settings-nav .nav-link,
    .settings-raw-actions .btn,
    .settings-editor-toolbar .btn,
    .settings-mobile-toolbar .btn,
    .settings-mobile-save-bar .btn,
    .settings-rail-actions .btn,
    .settings-raw-table .actions-cell .btn
) {
    block-size: auto;
    height: auto;
    line-height: 1.2;
    min-block-size: var(--settings-touch-target-min);
    min-inline-size: var(--settings-touch-target-min);
    overflow-wrap: break-word;
    text-align: center;
    white-space: normal;
}

system-settings-page .settings-nav .nav-link {
    min-block-size: calc(var(--settings-touch-target-min) + 1px);
}

system-settings-page :is(.settings-content .form-control, .settings-content .form-select, .settings-raw-input) {
    max-inline-size: 100%;
    min-block-size: var(--settings-touch-target-min);
    min-inline-size: 0;
}

system-settings-page .settings-content input.form-control {
    white-space: nowrap;
}

system-settings-page .settings-content textarea.form-control {
    block-size: auto;
    height: auto;
    min-block-size: calc(var(--settings-touch-target-min) * 1.75);
    overflow: auto;
    resize: vertical;
    text-overflow: clip;
    white-space: pre-wrap;
}

system-settings-page .settings-raw-input--multiline {
    field-sizing: content;
    max-block-size: none;
}

system-settings-page .settings-content textarea.settings-compact-textarea {
    min-block-size: calc(var(--settings-touch-target-min) * 1.35);
}

system-settings-page .settings-content textarea:is(
    [name="ui.not_found.message"],
    [name="ui.not_found.role_links.admin"],
    [name="ui.not_found.role_links.sales"],
    [name="ui.not_found.role_links.designer"],
    [name="ui.not_found.role_links.viewer"],
    [name="ui.forbidden.message"],
    [name="ui.forbidden.role_links.admin"],
    [name="ui.forbidden.role_links.sales"],
    [name="ui.forbidden.role_links.designer"],
    [name="ui.forbidden.role_links.viewer"]
) {
    min-block-size: calc(var(--settings-touch-target-min) * 9.75);
}

body.settings-modal-owner .settings-modal :is(.modal-footer .btn, [data-reset-confirm-text]) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-block-size: 46px;
    min-height: 46px;
    opacity: 1;
    visibility: visible;
}

body.settings-modal-owner .settings-modal.fade .settings-modal-dialog {
    transform: none;
}

body.settings-modal-owner .settings-modal .settings-modal-table {
    max-inline-size: 100%;
    overflow-x: auto;
}

body.settings-modal-owner .settings-modal .settings-modal-table table {
    margin-block-end: 0;
    min-inline-size: 22rem;
    table-layout: fixed;
}

body.settings-modal-owner .settings-modal .settings-modal-table .table-card-label {
    display: none;
}

body.settings-modal-owner .settings-modal .settings-reset-summary-table th,
body.settings-modal-owner .settings-modal .settings-reset-summary-table td {
    border-color: var(--settings-border, rgba(10, 29, 55, 0.12));
    padding-block: 0.55rem;
    padding-inline: 0.625rem;
    overflow-wrap: break-word;
    vertical-align: middle;
}

body.settings-modal-owner .settings-modal .settings-reset-summary-table th + th,
body.settings-modal-owner .settings-modal .settings-reset-summary-table td + td {
    border-inline-start: 1px solid var(--settings-border, rgba(10, 29, 55, 0.12));
}

body.settings-modal-owner .settings-modal .settings-reset-summary-table th:nth-child(1),
body.settings-modal-owner .settings-modal .settings-reset-summary-table td:nth-child(1) {
    width: 50%;
}

body.settings-modal-owner .settings-modal .settings-reset-summary-table th:nth-child(2),
body.settings-modal-owner .settings-modal .settings-reset-summary-table td:nth-child(2) {
    width: 24%;
}

body.settings-modal-owner .settings-modal .settings-reset-summary-table th:nth-child(3),
body.settings-modal-owner .settings-modal .settings-reset-summary-table td:nth-child(3) {
    width: 26%;
}

system-settings-page .settings-content .form-check {
    align-items: center;
    block-size: auto;
    display: flex;
    gap: 0.5rem;
    height: auto;
    min-block-size: var(--settings-touch-target-min);
    min-inline-size: 0;
    padding-block: 0.25rem;
    white-space: normal;
}

system-settings-page .settings-content .form-check-label {
    min-inline-size: 0;
    overflow-wrap: break-word;
}

system-settings-page .settings-content .form-check-input {
    block-size: 2rem;
    flex: 0 0 auto;
    height: 2rem;
    inline-size: 2rem;
    margin-block-start: 0;
    min-block-size: 2rem;
    min-inline-size: 2rem;
    width: 2rem;
}

system-settings-page .settings-content .form-switch .form-check-input {
    block-size: 2.125rem;
    height: 2.125rem;
    inline-size: 3.25rem;
    min-block-size: 2.125rem;
    min-inline-size: 3.25rem;
    width: 3.25rem;
}

system-settings-page :is(.settings-raw-header, .settings-raw-inline-header, .settings-editor-toolbar, .settings-save-region) {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
}

system-settings-page :is(.settings-raw-header, .settings-raw-inline-header, .settings-editor-toolbar) > * {
    min-inline-size: 0;
}

system-settings-page :is(.settings-raw-title, .settings-editor-title, .settings-editor-description, .settings-subsection-title, .settings-rail-title, .settings-rail-link, .settings-save-region, .settings-mobile-save-status) {
    overflow-wrap: break-word;
}

system-settings-page .settings-raw-actions {
    justify-content: flex-start;
}

system-settings-page .settings-raw-actions .settings-raw-summary {
    flex: 1 1 12rem;
}

system-settings-page .settings-save-region {
    justify-content: space-between;
}

system-settings-page .settings-save-region > :first-child {
    flex: 1 1 14rem;
    min-inline-size: 0;
}

system-settings-page .settings-save-region > .btn,
system-settings-page .settings-save-region > button[type="submit"] {
    flex: 0 1 auto;
}

@media (width < 768px) {
    system-settings-page .settings-editor-toolbar,
    system-settings-page .settings-raw-toolbar,
    system-settings-page .settings-raw-actions,
    system-settings-page .settings-save-region {
        align-items: stretch;
        flex-direction: column;
    }

    system-settings-page .settings-save-region > .btn,
    system-settings-page .settings-save-region > button[type="submit"],
    system-settings-page .settings-raw-actions .btn,
    system-settings-page .settings-editor-toolbar .btn {
        flex: 0 0 auto;
        width: 100%;
    }

    system-settings-page .settings-subsection-summary {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    system-settings-page .settings-subsection-meta {
        grid-column: 1 / -1;
        justify-self: start;
        white-space: normal;
    }
}

@media (width >= 768px) and (width < 1366px) {
    system-settings-page :is(.settings-editor-toolbar, .settings-raw-toolbar, .settings-save-region) {
        align-items: stretch;
    }
}

@media (width < 1366px) {
    system-settings-page .settings-editor-table {
        overflow-x: visible;
    }

    system-settings-page :is(
        .settings-editor-table table,
        .settings-editor-table thead,
        .settings-editor-table tbody,
        .settings-editor-table tr,
        .settings-editor-table th,
        .settings-editor-table td,
        .settings-workflow-matrix,
        .settings-workflow-matrix thead,
        .settings-workflow-matrix tbody,
        .settings-workflow-matrix tr,
        .settings-workflow-matrix th,
        .settings-workflow-matrix td
    ) {
        display: block;
        inline-size: 100%;
        max-inline-size: 100%;
        min-inline-size: 0;
        width: 100%;
    }

    system-settings-page :is(.settings-editor-table table, .settings-workflow-matrix) {
        table-layout: auto;
    }

    system-settings-page :is(.settings-editor-table thead, .settings-workflow-matrix thead) {
        display: none;
    }

    system-settings-page :is(.settings-editor-table tr, .settings-workflow-matrix tr) {
        background: var(--color-surface-elevated);
        border: 1px solid var(--settings-border);
        border-radius: 0.5rem;
        margin-block-end: 0.75rem;
        padding: 0.75rem;
    }

    system-settings-page :is(.settings-editor-table td, .settings-workflow-matrix td, .settings-editor-table th, .settings-workflow-matrix th) {
        border: 0;
        padding: 0.45rem 0;
        text-align: left;
        white-space: normal;
    }

    system-settings-page :is(.settings-editor-table td, .settings-workflow-matrix td)::before {
        color: var(--settings-ink-muted);
        content: attr(data-label);
        display: block;
        font-size: max(var(--settings-micro-font-min), var(--font-size-xs));
        font-weight: 800;
        margin-block-end: 0.25rem;
        text-transform: uppercase;
    }

    system-settings-page :is(.settings-editor-table td[data-label="Actions"], .settings-editor-table .actions-cell) {
        display: grid;
        gap: 0.5rem;
        justify-items: stretch;
    }

system-settings-page :is(.settings-editor-table td[data-label="Actions"], .settings-editor-table .actions-cell) .btn {
    inline-size: 100%;
    justify-content: center;
    min-inline-size: 0;
}

    system-settings-page config-table-component :is(td[data-label="Actions"], .actions-cell) {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
        justify-content: flex-end;
    }

    system-settings-page config-table-component :is(td[data-label="Actions"], .actions-cell) .btn {
        flex: 0 0 auto;
        min-inline-size: 4.25rem;
        white-space: nowrap;
    }

    system-settings-page .settings-role-permission-editor :is(table, .table),
    system-settings-page .settings-permission-editor :is(table, .table) {
        min-inline-size: 0;
    }

    system-settings-page .settings-role-permission-editor :is(td:first-child, th:first-child),
    system-settings-page .settings-permission-editor :is(td:first-child, th:first-child) {
        inline-size: 100%;
        min-inline-size: 0;
        width: 100%;
    }

    system-settings-page .settings-role-permission-editor td:first-child .form-control {
        min-inline-size: 0;
    }

    system-settings-page .settings-workflow-matrix {
        min-inline-size: 0;
    }

    system-settings-page .settings-workflow-action-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    system-settings-page .settings-workflow-action {
        align-items: center;
        min-inline-size: 0;
    }
}

system-settings-page :is(
    .settings-nav-table .form-check,
    .settings-nav-table .form-check-inline,
    .jobs-transition-toggle,
    .settings-special-permission-item,
    .settings-workflow-action
) {
    box-sizing: border-box;
    min-block-size: var(--settings-touch-target-min);
    min-inline-size: var(--settings-touch-target-min);
}

system-settings-page .settings-nav-table .form-check {
    align-items: center;
    cursor: pointer;
    display: inline-flex;
    gap: 0.5rem;
    margin-block: 0 0.25rem;
    padding-block: 0.25rem;
    padding-inline: 0.125rem;
    vertical-align: top;
    white-space: normal;
}

system-settings-page .settings-nav-table .form-check-label {
    cursor: pointer;
    line-height: 1.25;
    min-inline-size: 0;
    overflow-wrap: break-word;
    padding-inline-end: 0.125rem;
}

system-settings-page .jobs-transition-toggle {
    align-items: center;
    cursor: pointer;
    display: inline-flex;
    justify-content: center;
    margin: 0 auto;
    padding: 0.25rem;
}

system-settings-page .jobs-transition-toggle .form-check-input {
    margin: 0;
}

system-settings-page .settings-special-permission-item {
    align-items: center;
    cursor: pointer;
    padding-block: 0.25rem;
}

system-settings-page .settings-special-permission-label {
    line-height: 1.3;
    min-inline-size: 0;
    overflow-wrap: break-word;
}

@media (width < 1366px) {
    system-settings-page .settings-mobile-save-bar:not(.d-none) {
        inline-size: min(100%, var(--settings-shell-max, 100%));
        inset-block-end: 0;
        inset-inline: 0;
        margin-inline: auto;
        max-block-size: min(40vh, 13rem);
        overflow-y: auto;
        position: fixed;
        width: min(100%, var(--settings-shell-max, 100%));
        z-index: calc(var(--z-sticky, 1020) + 3);
    }

    system-settings-page:has(.settings-mobile-save-bar:not(.d-none)) .settings-shell {
        padding-block-end: calc(11rem + env(safe-area-inset-bottom));
    }

    system-settings-page .settings-mobile-save-bar:not(.d-none) .settings-mobile-save-actions {
        inline-size: 100%;
    }
}

system-settings-page .settings-subsection-summary {
    block-size: auto;
    height: auto;
}