:root {
    color-scheme: light dark;
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.5;
}

* { box-sizing: border-box; }

body { margin: 0; background: #f7f4ea; color: #233127; }
.container { width: min(100% - 2rem, 56rem); margin-inline: auto; }
.site-header { border-bottom: 1px solid color-mix(in srgb, CanvasText 18%, transparent); padding: 1rem 0; }
.brand { color: inherit; font-size: 1.15rem; font-weight: 700; text-decoration: none; }
main { padding-block: 2rem; }
.status { border-radius: .5rem; padding: 1rem; }
.status--available { border: 1px solid #27844b; }
.status--unavailable { border: 1px solid #b66a00; }
.status-details { display: grid; gap: .75rem; }
.status-details div { display: grid; grid-template-columns: minmax(9rem, 1fr) 2fr; gap: 1rem; }
.status-details dt { font-weight: 700; }
.status-details dd { margin: 0; overflow-wrap: anywhere; }
.request-id { overflow-wrap: anywhere; }

.admin-shell { min-height: 100vh; display: grid; grid-template-columns: 15rem minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 1.25rem; display: flex; flex-direction: column; gap: 1.5rem; overflow-y: auto; background: #405c4b; color: #fff; }
.sidebar .brand { color: #fff; font-size: 1.35rem; }
.sidebar nav { display: grid; gap: .5rem; }
.sidebar nav a { color: #f7f4ea; padding: .7rem .85rem; border-radius: .65rem; text-decoration: none; }
.sidebar nav a:hover, .sidebar nav a:focus-visible { background: #577563; }
.sidebar nav a.active { color: #263a2d; background: #f4f1e7; font-weight: 700; }
.sidebar-toggle { display: block; position: fixed; z-index: 1050; top: .8rem; left: 11.5rem; min-width: 2.75rem; min-height: 2.75rem; color: #fff; background: #577563; }
.admin-sidebar-toggle { background-color: #577563; color: #fff; border-color: #577563; }
.admin-sidebar-toggle:hover { background-color: #496554; color: #fff; border-color: #496554; }
.admin-sidebar-toggle:focus-visible { background-color: #496554; color: #fff; box-shadow: 0 0 0 .25rem rgba(87,117,99,.35); }
.admin-sidebar-toggle:active { background-color: #3f5949; color: #fff; border-color: #3f5949; }
.nav-section { display:block; padding:1rem .85rem .3rem; color:#cdd8d0; font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; }
.content-page { max-width: 1500px; margin: 0 auto; }
.content-toolbar { display:flex; flex-wrap:wrap; align-items:end; gap:.75rem; padding:1rem; margin-bottom:1rem; background:#fffdf8; border:1px solid #dde4dc; border-radius:.85rem; }
.content-toolbar .form-control,.content-toolbar .form-select,.content-toolbar .btn { min-height:44px; }
.content-list { width:100%; max-width:100%; overflow-x:auto; overflow-y:visible; background:#fff; border:1px solid #dde4dc; border-radius:.85rem; }
.content-list table { overflow:visible; }
.content-list .dropdown-menu { z-index:2000; }
.content-card-grid { display:none; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:1rem; }
.content-page.card-mode .content-list { display:none; }
.content-page.card-mode .content-card-grid { display:grid; }
.content-card { padding:1rem; border:1px solid #dce4da; border-radius:.85rem; background:#fff; }
.content-status-badge { display:inline-flex; padding:.25rem .55rem; border-radius:999px; background:#e5eee7; color:#304b3a; font-size:.8rem; }
.content-readonly-notice { padding:.75rem 1rem; margin-bottom:1rem; border-left:4px solid #718f79; background:#eef4ec; }
.content-offcanvas { --bs-offcanvas-width:min(720px,100vw); display:flex; flex-direction:column; }
.content-offcanvas .offcanvas-body { padding:1.5rem; overflow-y:auto; min-height:0; }
.content-offcanvas form { min-height:0; display:flex; flex:1 1 auto; flex-direction:column; overflow:hidden; }
.content-offcanvas form > .offcanvas-body { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-content:start; gap:1rem; }
.content-offcanvas form > .offcanvas-body > .form-label { display:grid; gap:.4rem; margin:0; font-weight:600; }
.content-offcanvas form > .offcanvas-body > .form-label:has(textarea) { grid-column:span 2; }
.content-form-section { padding:1rem 0 1.25rem; border-bottom:1px solid #e1e7e0; }
.content-form-section h3 { margin:0 0 1rem; font-size:1rem; color:#405c4b; }
.content-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.content-form-grid .form-label { display:grid; gap:.4rem; margin:0; font-weight:600; }
.content-form-grid textarea { min-height:7rem; resize:vertical; }
.content-form-grid .form-label:has(textarea) { grid-column:span 2; }
.content-form-relations select[multiple] { min-height:7rem; }
.content-offcanvas .offcanvas-footer { flex:0 0 auto; display:flex; gap:.75rem; padding:1rem; background:#fffdf8; border-top:1px solid #dde4dc; }
.content-relation-editor { display:grid; gap:.6rem; }
.content-relation-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.75rem; padding:.75rem; border:1px solid #dde4dc; border-radius:.7rem; }
.content-picker .modal-dialog { max-width:760px; }
.content-picker-search { display:grid; grid-template-columns:minmax(0,1fr) minmax(9rem,auto) auto; align-items:end; gap:.75rem; margin-bottom:1rem; }
.content-picker-results,[data-relation-picker-results] { display:grid; gap:.5rem; }
.content-picker-row { width:100%; min-height:44px; padding:.75rem; text-align:left; color:#304b3a; background:#fffdf8; border:1px solid #dce4da; border-radius:.65rem; }
.content-picker-row:hover,.content-picker-row:focus-visible { background:#edf3eb; border-color:#718f79; }
.content-picker-row:disabled { opacity:.55; }
.content-relation-row > div:first-child { min-width:0; display:grid; gap:.45rem; }
.content-relation-row > div:last-child { display:flex; flex-wrap:wrap; align-items:start; gap:.35rem; }
.content-relation-row input,.content-relation-row textarea { width:100%; min-height:44px; }
.content-action-menu .dropdown-item { min-height:44px; }
.content-detail-metadata { overflow-wrap:anywhere; }
.content-detail-metadata dt { margin-top:.9rem; color:#496554; }
.content-readonly-relations { display:grid; gap:.65rem; margin:.45rem 0 0; padding-left:1.35rem; }
.content-readonly-relations li { padding:.55rem .65rem; border:1px solid #dde4dc; border-radius:.65rem; background:#f8faf8; overflow-wrap:anywhere; }
.content-relation-note { margin-top:.3rem; color:#526057; white-space:normal; overflow-wrap:anywhere; }
#content-edit .btn-close { min-width:44px; min-height:44px; padding:.75rem; }
body:has(#content-edit.show) .sidebar-toggle { display:none; }
.content-card h2,.content-card code { overflow-wrap:anywhere; word-break:break-word; }
.content-pagination { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:1rem; }
@media (max-width: 1024px) { .content-card-grid { grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); } }
@media (max-width: 767.98px) { html,body { max-width:100%; overflow-x:hidden; } .content-toolbar>* { flex:1 1 100%; } .content-offcanvas { --bs-offcanvas-width:100vw; } .content-offcanvas form > .offcanvas-body { grid-template-columns:1fr; } .content-offcanvas form > .offcanvas-body > .form-label:has(textarea) { grid-column:auto; } .content-form-grid { grid-template-columns:1fr; } .content-form-grid .form-label:has(textarea) { grid-column:auto; } .content-relation-row { grid-template-columns:1fr; } .content-picker-search { grid-template-columns:1fr; } .content-picker .modal-dialog { max-width:none; margin:.5rem; } }
@media (max-width: 420px) { .content-card-grid { grid-template-columns:1fr; } .content-page h1 { font-size:1.65rem; } .content-relation-row > div:last-child .btn { flex:1 1 30%; min-height:44px; } }
.sidebar-collapsed { overflow-x:hidden; }
.sidebar-collapsed .admin-shell { grid-template-columns: 0 minmax(0, 1fr); }
.sidebar-collapsed .sidebar { width:0; min-width:0; padding:0; border:0; overflow:hidden; visibility:hidden; }
.sidebar-collapsed .sidebar-toggle { left:.8rem; }
.session-summary { margin-top: auto; display: grid; gap: .4rem; }
.session-summary span { color: #dce7df; font-size: .9rem; }
.admin-main { width: 100%; max-width: 94rem; min-width: 0; margin-inline: auto; padding: clamp(1.25rem, 2.5vw, 2.5rem); }
.login-shell { min-height: 100vh; display: grid; place-items: center; padding: 1rem; background: radial-gradient(circle at top, #e5ecdf, #f7f4ea 55%); }
.login-card { width: min(100%, 27rem); padding: clamp(1.5rem, 5vw, 2.25rem); border: 1px solid #d8dfd4; border-radius: 1rem; background: #fffdf7; box-shadow: 0 1rem 3rem rgb(47 70 54 / 10%); }
.page-header { display: flex; justify-content: space-between; align-items: start; gap: 1rem; margin-bottom: 1.5rem; }
.page-header h1 { margin: 0; font-size: clamp(1.6rem, 3vw, 2.2rem); }
.page-header p { color: #647168; margin: .35rem 0 0; }
.content-card { border: 1px solid #dce2da; border-radius: .85rem; background: #fffdf8; box-shadow: 0 .2rem .8rem rgb(47 70 54 / 5%); }
.filter-bar { display: grid; grid-template-columns: minmax(15rem, 2fr) repeat(2, minmax(9rem, 1fr)) auto auto; align-items: center; gap: .75rem; padding: 1rem; margin-bottom: 1rem; }
.filter-bar .form-control, .filter-bar .form-select, .filter-bar .btn { min-height: 2.75rem; }
.user-list { display: grid; gap: .65rem; }
.user-list.card-view { grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); }
.user-list.card-view .user-row { grid-template-columns: 1fr; align-content: start; }
.user-list.card-view .actions { justify-content: start; }
.user-row { display: grid; grid-template-columns: minmax(14rem, 2fr) minmax(11rem, 1.2fr) 5.5rem minmax(17rem, auto); align-items: center; gap: 1rem; padding: 1rem; }
.user-row small { display: block; color: #6a756d; overflow-wrap: anywhere; }
.role-badges, .actions { display: flex; flex-wrap: wrap; gap: .4rem; }
.actions { justify-content: end; align-items: center; }
.actions .btn { min-height: 2.25rem; padding-inline: .7rem; }
.status-pill { padding: .25rem .6rem; border-radius: 999px; font-size: .85rem; font-weight: 650; }
.status-pill.active { color: #205a38; background: #dcefe2; }
.status-pill.passive { color: #7b3b31; background: #f4dfd9; }
.empty-state { padding: 2rem; text-align: center; color: #647168; }
.offcanvas { --bs-offcanvas-width: min(100vw, 29rem); }
.offcanvas-header { padding: 1.25rem 1.5rem; border-bottom: 1px solid #e2e6df; }
.offcanvas-body { padding: 1.5rem; overflow-y: auto; }
.offcanvas-body form { min-height: 100%; display: flex; flex-direction: column; }
.offcanvas-body form > .form-check { margin-bottom: .5rem; padding: .75rem .75rem .75rem 2.35rem; border: 1px solid #e0e5dd; border-radius: .65rem; background: #faf9f3; }
.offcanvas-body form > button[type="submit"] { position: sticky; bottom: 0; width: 100%; min-height: 2.75rem; margin-top: auto; box-shadow: 0 -.75rem 1rem #fffdf8; }
.offcanvas-actions { position: sticky; bottom: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; margin-top: auto; padding-top: 1rem; background: #fffdf8; box-shadow: 0 -.75rem 1rem #fffdf8; }
.offcanvas-actions .btn { min-height: 2.75rem; }
.dashboard-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.metric-card { min-height: 9rem; display: flex; flex-direction: column; justify-content: space-between; padding: 1.25rem; border: 1px solid #dce2da; border-radius: .9rem; background: #fffdf8; }
.metric-card > span, .metric-card small { color: #647168; }
.metric-card strong { font-size: 1.65rem; }
.dashboard-lower { display: grid; grid-template-columns: minmax(15rem, 1fr) 2fr; gap: 1rem; margin-top: 1rem; }
.profile-summary, .quick-actions, .account-panel { padding: 1.5rem; }
.profile-summary { display: grid; gap: .75rem; }
.quick-actions > div, .account-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.account-panel { width: min(100%, 42rem); }
.account-panel dl { display: grid; gap: 1rem; }
.account-panel dl div { padding-bottom: 1rem; border-bottom: 1px solid #e3e7e0; }
.account-panel dt { color: #647168; font-size: .85rem; }
.account-panel dd { margin: .25rem 0 0; font-weight: 600; }
.role-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 1rem; }
.role-card { padding: 1.25rem; }
.role-card > div { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.role-card h2 { margin: 0; font-size: 1.1rem; }
.role-card p { margin: .75rem 0 0; color: #647168; }
.access-denied-panel { width: min(100%, 34rem); margin: clamp(2rem, 12vh, 7rem) auto; padding: 2rem; }
:focus-visible { outline: 3px solid #8cab95; outline-offset: 2px; }
.btn-primary { --bs-btn-bg: #4e735b; --bs-btn-border-color: #4e735b; --bs-btn-hover-bg: #3e604a; --bs-btn-hover-border-color: #3e604a; }

@media (max-width: 62rem) {
    .admin-shell { grid-template-columns: 12.5rem minmax(0, 1fr); }
    .filter-bar { grid-template-columns: 1fr 1fr; }
    .user-row { grid-template-columns: 1fr auto; }
    .actions { grid-column: 1 / -1; justify-content: start; }
    .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 48rem) {
    .status-details div { grid-template-columns: 1fr; gap: .125rem; }
    .admin-shell { display: block; }
    .sidebar { position: fixed; z-index: 1040; inset: 0 auto 0 0; width: min(84vw, 17rem); height: 100vh; transform: translateX(-105%); transition: transform .2s ease; }
    .sidebar-open .sidebar { transform: translateX(0); box-shadow: 1rem 0 3rem rgb(0 0 0 / 25%); }
    .sidebar-toggle { top: .75rem; right: .75rem; left: auto; min-width: 3rem; background: #405c4b; }
    .session-summary { margin-top: .5rem; }
    .admin-main { padding-top: 4.5rem; }
    .page-header { align-items: stretch; flex-direction: column; }
    .filter-bar, .user-row { grid-template-columns: 1fr; }
    .dashboard-grid, .dashboard-lower, .role-grid { grid-template-columns: 1fr; }
    .actions { justify-content: start; }
    .offcanvas { --bs-offcanvas-width: 100vw; }
}

@media (prefers-reduced-motion: reduce) { .sidebar { transition: none; } }

/* Content admin final overrides: keep these after the generic offcanvas rules. */
.offcanvas.content-offcanvas {
    --bs-offcanvas-width: min(720px, 100vw);
    width: var(--bs-offcanvas-width);
    max-width: 100vw;
    display: flex;
    flex-direction: column;
}
.offcanvas.content-offcanvas > form {
    min-height: 0;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.offcanvas.content-offcanvas > form > .offcanvas-body {
    min-height: 0;
    flex: 1 1 auto;
    overflow-y: auto;
    overscroll-behavior: contain;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-content: start;
    gap: 1rem;
    padding: 1.5rem;
}
.offcanvas.content-offcanvas > form > .offcanvas-body > .form-label {
    min-width: 0;
    display: grid;
    gap: .45rem;
    margin: 0;
    font-weight: 600;
}
.offcanvas.content-offcanvas > form > .offcanvas-body > .form-label:has(textarea) {
    grid-column: 1 / -1;
}
.offcanvas.content-offcanvas textarea {
    min-height: 7rem;
    resize: vertical;
}
.offcanvas.content-offcanvas select[multiple] {
    min-height: 8.5rem;
}
.offcanvas.content-offcanvas .offcanvas-footer {
    flex: 0 0 auto;
    display: flex;
    gap: .75rem;
    padding: 1rem 1.5rem;
    background: #fffdf8;
    border-top: 1px solid #dde4dc;
    box-shadow: 0 -.35rem 1rem rgb(47 70 54 / 6%);
}
.content-list {
    overflow: visible;
}
.content-list table {
    width: 100%;
    margin: 0;
}
.content-action-menu {
    position: static;
}
.content-dropdown-portal {
    min-width: 13rem;
    max-height: min(70vh, 30rem);
    overflow-y: auto;
}
.content-media-field .form-text,
.content-media-field > a {
    display: block;
    margin-top: .15rem;
}
@media (max-width: 767.98px) {
    .offcanvas.content-offcanvas { --bs-offcanvas-width: 100vw; }
    .offcanvas.content-offcanvas > form > .offcanvas-body { grid-template-columns: 1fr; padding: 1rem; }
    .offcanvas.content-offcanvas > form > .offcanvas-body > .form-label:has(textarea) { grid-column: auto; }
    .content-list { overflow-x: auto; overflow-y: visible; }
    .content-list table { min-width: 680px; }
}

/* Knowledge bank administration */
.knowledge-page { min-width:0; }
.knowledge-subnav { display:flex; flex-wrap:wrap; gap:.5rem; margin:-.35rem 0 1rem; }
.knowledge-subnav a { padding:.5rem .75rem; border:1px solid #d8dfd6; border-radius:999px; color:#405c4b; background:#fffdf8; text-decoration:none; font-weight:650; }
.knowledge-subnav a:hover,.knowledge-subnav a.active { background:#e8efe7; border-color:#aabdad; }
.knowledge-filter { display:grid; grid-template-columns:minmax(14rem,2fr) repeat(2,minmax(10rem,1fr)) auto auto; gap:.75rem; align-items:center; padding:1rem; margin-bottom:1rem; }
.knowledge-filter .form-control,.knowledge-filter .form-select,.knowledge-filter .btn { min-height:2.75rem; }
.knowledge-table-wrap { overflow-x:auto; overflow-y:visible; }
.knowledge-table-wrap table { min-width:760px; }
.knowledge-table-wrap th { color:#526057; font-size:.85rem; white-space:nowrap; }
.knowledge-table-wrap td { vertical-align:middle; }
.knowledge-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.35rem; }
.knowledge-actions form { margin:0; }
.knowledge-status { display:inline-flex; align-items:center; min-height:1.65rem; padding:.2rem .55rem; border-radius:999px; font-size:.8rem; font-weight:700; white-space:nowrap; }
.knowledge-status.draft { background:#eeeae0; color:#625b4c; }
.knowledge-status.approved { background:#dcefe2; color:#205a38; }
.knowledge-status.rejected { background:#f4dfd9; color:#7b3b31; }
.knowledge-status.archived { background:#e3e5e3; color:#4f5752; }
.knowledge-preview { max-width:34rem; white-space:normal; overflow-wrap:anywhere; }
.knowledge-form-note { grid-column:1/-1; margin:0; font-weight:400; }
.knowledge-detail-box { grid-column:1/-1; display:grid; gap:.35rem; padding:.85rem; border:1px solid #dde4dc; border-radius:.7rem; background:#f8faf8; overflow-wrap:anywhere; }
.knowledge-detail-box small,.knowledge-detail-box code { overflow-wrap:anywhere; word-break:break-word; }
.knowledge-detail-list { display:grid; gap:.75rem; margin:0; }
.knowledge-detail-list div { display:grid; grid-template-columns:minmax(9rem,1fr) minmax(0,2fr); gap:1rem; padding-bottom:.75rem; border-bottom:1px solid #e4e8e2; }
.knowledge-detail-list dt { color:#647168; }
.knowledge-detail-list dd { margin:0; overflow-wrap:anywhere; word-break:break-word; }
@media (max-width:62rem) { .knowledge-filter { grid-template-columns:1fr 1fr; } }
@media (max-width:48rem) { .knowledge-filter { grid-template-columns:1fr; } .knowledge-actions { justify-content:flex-start; } .knowledge-detail-list div { grid-template-columns:1fr; gap:.15rem; } }
.knowledge-upload-progress { height:.8rem; margin:.25rem 0 .4rem; }
.knowledge-upload-progress .progress-bar { font-size:.65rem; min-width:2.5rem; }
