:root,
[data-bs-theme="light"] {
    --shds-paper: #f4f5f6;
    --shds-sheet: #ffffff;
    --shds-wash: #eceef0;
    --shds-ink: #22272d;
    --shds-muted: #515b66;
    --shds-line: #cbd2d9;
    --shds-accent: #3d566e;
    --shds-accent-wash: #e5ebf1;
    --shds-on-accent: #ffffff;
    --shds-sidebar: #282e35;
    --shds-side-ink: #edf0f3;
    --shds-side-muted: #c2c9d0;
    --shds-side-active: #39424c;
    --shds-side-line: #5a6571;
    --bs-body-font-family: "Segoe UI", system-ui, sans-serif;
    --bs-body-color: var(--shds-ink);
    --bs-body-bg: var(--shds-paper);
    --bs-secondary-color: var(--shds-muted);
    --bs-border-color: var(--shds-line);
    --bs-link-color: var(--shds-accent);
    --bs-link-color-rgb: 61, 86, 110;
    --bs-link-hover-color: #263c51;
    --bs-link-hover-color-rgb: 38, 60, 81;
    --bs-primary-rgb: 61, 86, 110;
}

[data-bs-theme="dark"] {
    --shds-paper: #1d2024;
    --shds-sheet: #24282d;
    --shds-wash: #2e3339;
    --shds-ink: #e8ebef;
    --shds-muted: #bbc2ca;
    --shds-line: #474f59;
    --shds-accent: #b0c5d9;
    --shds-accent-wash: #303e4c;
    --shds-on-accent: #1d2935;
    --shds-sidebar: #181c21;
    --shds-side-active: #303942;
    --bs-link-color-rgb: 176, 197, 217;
    --bs-link-hover-color: #dce8f4;
    --bs-link-hover-color-rgb: 220, 232, 244;
    --bs-primary-rgb: 176, 197, 217;
}

.shds-body {
    min-height: 100vh;
    background: var(--shds-paper) !important;
    color: var(--shds-ink);
}

.shds-body :is(a, button, input, select, textarea, summary):focus-visible {
    outline: 2px solid var(--shds-accent);
    outline-offset: 2px;
}

.shds-skip {
    position: absolute;
    z-index: 1100;
    inset: .5rem auto auto .5rem;
    padding: .5rem .75rem;
    background: var(--shds-sheet);
    transform: translateY(-200%);
}

.shds-skip:focus { transform: none; }

.shds-topbar {
    background: var(--shds-sheet);
    border-bottom: 1px solid var(--shds-line);
}

.shds-topbar-inner {
    max-width: 102rem;
    margin-inline: auto;
    padding: .75rem clamp(.8rem, 2.5vw, 1.75rem);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .55rem 1rem;
}

.shds-brand {
    display: inline-flex;
    align-items: center;
    gap: .65rem;
    color: var(--shds-ink);
    font-weight: 700;
    letter-spacing: .025em;
    text-decoration: none;
}

.shds-brand:hover { color: var(--shds-accent); }

.shds-mark {
    flex: none;
}

.shds-topbar-label {
    font-size: .875rem;
    color: var(--shds-muted);
}

.shds-topbar-actions {
    position: relative;
    display: flex;
    align-items: center;
    gap: .55rem;
    margin-inline-start: auto;
}

.shds-topbar-actions svg {
    width: 1.15rem;
    height: 1.15rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.shds-theme-toggle,
.shds-entry-menu summary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    min-height: 2.5rem;
}

.shds-theme-toggle { width: 2.5rem; padding: 0; }
.shds-theme-sun, [data-bs-theme="dark"] .shds-theme-moon { display: none; }
[data-bs-theme="dark"] .shds-theme-sun { display: block; }

.shds-entry-menu summary::-webkit-details-marker { display: none; }
.shds-entry-menu-links {
    position: absolute;
    z-index: 1000;
    inset: calc(100% + .45rem) 0 auto auto;
    width: max-content;
    padding: .3rem;
    border: 1px solid var(--shds-line);
    border-radius: .3rem;
    background: var(--shds-sheet);
    box-shadow: 0 3px 10px rgb(0 0 0 / .15);
}
.shds-entry-menu-links a {
    display: block;
    padding: .55rem .7rem;
    border-radius: .2rem;
    color: var(--shds-ink);
    text-decoration: none;
}
.shds-entry-menu-links a:hover { background: var(--shds-accent-wash); }

.shds-shell {
    max-width: 102rem;
    min-height: calc(100vh - 48px - 1.5rem - 1px);
    margin-inline: auto;
}

.shds-shell-admin { display: grid; grid-template-columns: 12.25rem minmax(0, 1fr); }

.shds-sidebar {
    background: var(--shds-sidebar);
    color: var(--shds-side-ink);
    padding: .95rem .75rem;
}

.shds-nav { display: grid; gap: .16rem; }

.shds-nav-label {
    margin: .75rem .45rem .2rem;
    font-size: .72rem;
    letter-spacing: .075em;
    text-transform: uppercase;
    color: var(--shds-side-muted);
}

.shds-nav-label:first-child { margin-top: .15rem; }

.shds-nav-link {
    color: var(--shds-side-ink);
    font-size: .9rem;
    padding: .38rem .5rem;
    border: 1px solid transparent;
    border-radius: 3px;
    text-decoration: none;
}

.shds-nav-link:hover, .shds-nav-link[aria-current="page"] {
    color: var(--shds-side-ink);
    background: var(--shds-side-active);
    border-color: var(--shds-side-line);
}

.shds-sidebar .shds-nav-link:focus-visible { outline-color: var(--shds-side-ink); }

.shds-content {
    min-width: 0;
    width: 100%;
    padding: clamp(.9rem, 2.6vw, 2rem);
}

.shds-shell:not(.shds-shell-admin) .shds-content {
    max-width: 89rem;
    margin-inline: auto;
}

.shds-content > :is(.container, .container-fluid) {
    max-width: none;
    padding-inline: 0;
}

.shds-content > :is(.container, .container-fluid).mt-5 { margin-top: 0 !important; }
.shds-content > :is(.container, .container-fluid).py-5 { padding-block: 0 !important; }

/* Older templates put their back links at the edge of the viewport. */
.shds-content a.btn.position-absolute.top-0 {
    position: static !important;
    margin: 0 .45rem .8rem 0 !important;
}

.shds-content :is(h1, .shds-page-title) {
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 600;
    font-size: clamp(1.7rem, 2.9vw, 2.5rem);
    line-height: 1.13;
    letter-spacing: -.018em;
    color: var(--shds-ink);
    overflow-wrap: anywhere;
}

.shds-content :is(h2, h3) { color: var(--shds-ink); }

.shds-content :is(.card, .modal-content, .list-group-item, .accordion-item, .dropdown-menu) {
    --bs-card-bg: var(--shds-sheet);
    --bs-card-border-color: var(--shds-line);
    --bs-card-border-radius: .3rem;
    --bs-modal-bg: var(--shds-sheet);
    --bs-list-group-bg: var(--shds-sheet);
    --bs-list-group-border-color: var(--shds-line);
    --bs-accordion-bg: var(--shds-sheet);
    --bs-dropdown-bg: var(--shds-sheet);
}

.shds-content :is(.card-header, .card-footer, .modal-header, .modal-footer) {
    background: var(--shds-wash) !important;
    color: var(--shds-ink) !important;
    border-color: var(--shds-line);
}

.shds-content :is(.card-header, .modal-header) :is(h1, h2, h3) { color: inherit; }

.shds-content :is(.bg-light, .bg-white) {
    background-color: var(--shds-sheet) !important;
    color: var(--shds-ink) !important;
}

.shds-content :is(.text-dark, .text-body) { color: var(--shds-ink) !important; }
.shds-content .text-muted { color: var(--shds-muted) !important; }
.shds-content .shadow-sm { box-shadow: 0 1px 2px rgb(0 0 0 / .09) !important; }

.shds-body .btn {
    --bs-btn-border-radius: .22rem;
    --bs-btn-focus-box-shadow: 0 0 0 .2rem var(--shds-accent-wash);
}

.shds-body :is(.btn-primary, .btn-info, .btn.bg-info) {
    --bs-btn-color: var(--shds-on-accent);
    --bs-btn-bg: var(--shds-accent);
    --bs-btn-border-color: var(--shds-accent);
    --bs-btn-hover-color: var(--shds-on-accent);
    --bs-btn-hover-bg: color-mix(in srgb, var(--shds-accent), var(--shds-ink) 13%);
    --bs-btn-hover-border-color: var(--bs-btn-hover-bg);
    --bs-btn-active-color: var(--shds-on-accent);
    --bs-btn-active-bg: var(--bs-btn-hover-bg);
    --bs-btn-active-border-color: var(--bs-btn-hover-bg);
    --bs-btn-disabled-color: var(--shds-on-accent);
    --bs-btn-disabled-bg: var(--shds-accent);
    --bs-btn-disabled-border-color: var(--shds-accent);
}

.shds-body .btn.bg-info {
    background: var(--bs-btn-bg) !important;
    color: var(--bs-btn-color) !important;
}

.shds-body :is(.btn-secondary, .btn-light, .btn-dark, .btn-outline-dark, .btn-outline-secondary, .btn-outline-light, .btn-outline-primary) {
    --bs-btn-color: var(--shds-ink);
    --bs-btn-bg: var(--shds-sheet);
    --bs-btn-border-color: var(--shds-line);
    --bs-btn-hover-color: var(--shds-ink);
    --bs-btn-hover-bg: var(--shds-accent-wash);
    --bs-btn-hover-border-color: var(--shds-accent);
    --bs-btn-active-color: var(--shds-ink);
    --bs-btn-active-bg: var(--shds-accent-wash);
    --bs-btn-active-border-color: var(--shds-accent);
    --bs-btn-disabled-color: var(--shds-muted);
    --bs-btn-disabled-bg: var(--shds-sheet);
    --bs-btn-disabled-border-color: var(--shds-line);
}

.shds-body :is(.form-control, .form-select, .input-group-text) {
    background-color: var(--shds-sheet);
    color: var(--shds-ink);
    border-color: var(--shds-line);
    border-radius: .22rem;
}

.shds-body :is(.form-control, .form-select, .form-check-input):focus {
    border-color: var(--shds-accent);
    box-shadow: 0 0 0 .2rem var(--shds-accent-wash);
}

.shds-body .form-check-input:checked {
    background-color: #3d566e;
    border-color: #3d566e;
}

.shds-content table.table {
    --bs-table-bg: var(--shds-sheet);
    --bs-table-color: var(--shds-ink);
    --bs-table-striped-bg: var(--shds-paper);
    --bs-table-striped-color: var(--shds-ink);
    --bs-table-hover-bg: var(--shds-accent-wash);
    --bs-table-hover-color: var(--shds-ink);
    --bs-table-border-color: var(--shds-line);
}

.shds-content table.table thead th {
    background: var(--shds-wash);
    color: var(--shds-ink);
    font-size: .88rem;
    font-weight: 650;
    vertical-align: middle;
}

.shds-content table.table td { vertical-align: middle; }
.shds-content :is(img, canvas, video) { max-width: 100%; }
.shds-content :is(.text-break, code) { overflow-wrap: anywhere; }

.shds-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .6rem 1rem;
    margin-block-end: 1.1rem;
    padding-block-end: .85rem;
    border-bottom: 1px solid var(--shds-line);
}

.shds-eyebrow {
    margin-block-end: .32rem;
    color: var(--shds-muted);
    font-size: .76rem;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.shds-page-header h1, .shds-page-header p:last-child { margin-block-end: 0; }
.shds-page-header p:last-child { margin-block-start: .35rem; }

.shds-portal-lead {
    display: grid;
    justify-items: start;
    gap: .55rem;
    padding-block: .5rem 1.35rem;
}

.shds-portal-lead::before {
    content: "";
    width: 2.4rem;
    border-top: 3px solid var(--shds-accent);
}

.shds-content .shds-portal-lead h1 { font-size: clamp(1.85rem, 3.5vw, 3rem); }
.shds-portal-lead :is(h1, p) { margin: 0; }

.shds-portal-groups { display: grid; gap: .8rem; }

.shds-portal-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .6rem;
    padding: .7rem .8rem;
    border-top: 1px solid var(--shds-line);
}

.shds-portal-actions .btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .7rem;
    min-height: 3.25rem;
    padding: .6rem .8rem;
    text-align: start;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.shds-portal-arrow { color: var(--shds-accent); }

.shds-directory { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--shds-line); }
.shds-directory li { border-bottom: 1px solid var(--shds-line); }
.shds-directory a {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: .7rem;
    padding: .72rem .4rem;
    text-decoration: none;
    color: var(--shds-ink);
    font-weight: 600;
}
.shds-directory a:hover { background: var(--shds-accent-wash); color: var(--shds-accent); }

.shds-admin-sections {
    display: grid;
    gap: .85rem;
}

.shds-admin-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin: 0;
    padding: .7rem .8rem;
    border-top: 1px solid var(--shds-line);
    list-style: none;
}

.shds-admin-actions li { flex: 1 1 10rem; min-width: 0; }
.shds-admin-actions .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: .15rem .5rem;
    min-height: 100%;
    font-size: .875rem;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.shds-section {
    min-width: 0;
    border: 1px solid var(--shds-line);
    border-radius: .3rem;
    background: var(--shds-sheet);
}

.shds-section h2 {
    font-size: 1rem;
    font-weight: 650;
    padding: .7rem .8rem;
    margin: 0;
    background: var(--shds-wash);
}

.shds-section .shds-directory li:last-child { border-bottom: 0; }
.shds-section .shds-directory a { font-weight: 500; padding: .55rem .8rem; }
.shds-directory a[aria-current="page"] {
    background: var(--shds-accent-wash);
    color: var(--shds-accent);
    box-shadow: inset 3px 0 var(--shds-accent);
}
.shds-reference {
    font: .8rem/1.4 ui-monospace, Consolas, monospace;
    overflow-wrap: anywhere;
}

.shds-entry-grid {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.35fr);
    gap: 1rem;
    align-items: start;
}

.shds-entry-grid .shds-section .table { margin: 0; }

.shds-login {
    max-width: 32rem !important;
    margin-inline: auto;
    padding: 1rem clamp(.85rem, 4vw, 1.75rem) !important;
    background: var(--shds-sheet);
    border: 1px solid var(--shds-line);
}

@media (max-width: 820px) {
    .shds-shell-admin { grid-template-columns: minmax(0, 1fr); }
    .shds-sidebar { padding: .4rem .65rem; }
    .shds-nav { display: flex; flex-wrap: wrap; gap: .12rem .25rem; }
    .shds-nav-label { display: none; }
    .shds-nav-link { padding: .25rem .42rem; }
}

@media (max-width: 620px) {
    .shds-topbar-label { display: none; }
    .shds-portal-actions, .shds-entry-grid { grid-template-columns: minmax(0, 1fr); }
    .shds-content table.table:not(.table-responsive table) {
        display: block;
        max-width: 100%;
        overflow-x: auto;
    }
}