:root { --workspace-bg:#f3f5f9; --workspace-panel:#fff; --workspace-sidebar:#fff; --workspace-line:#e2e7ef; --workspace-muted:#617087; --workspace-accent:#315ee7; }
[data-bs-theme=dark] { --workspace-bg:#10141e; --workspace-panel:#191f2d; --workspace-sidebar:#141925; --workspace-line:#2c3446; --workspace-muted:#a5b1c5; --workspace-accent:#9ab4ff; --bs-body-bg:#191f2d; --bs-body-color:#e5eaf3; --bs-secondary-color:#a5b1c5; --bs-border-color:#2c3446; --bs-tertiary-bg:#202838; --bs-link-color:#9ab4ff; --bs-link-hover-color:#c0d0ff; }
body { margin:0; background:var(--workspace-bg); color:var(--bs-body-color); }
a { text-underline-offset:3px; }
.app-sidebar { width:248px !important; background:var(--workspace-sidebar) !important; border-right:1px solid var(--workspace-line) !important; }
.app-sidebar .offcanvas-body { display:flex; flex-direction:column; padding:2rem 1.25rem; height:100%; }
.brand { display:flex; align-items:center; gap:.7rem; color:var(--bs-body-color); font-size:1.35rem; font-weight:750; text-decoration:none; margin-bottom:3rem; }
.brand-mark { display:grid; place-items:center; width:36px; height:36px; background:#315ee7; color:white; border-radius:11px; font-size:1rem; }
.sidebar-label,.eyebrow { font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:var(--workspace-muted); }
.sidebar-label { padding:0 .8rem; }
.sidebar-link { display:block; padding:.8rem 1rem; margin:.3rem 0; border-radius:.7rem; color:var(--workspace-muted); text-decoration:none; font-weight:600; }
.sidebar-link:hover,.sidebar-link.active { background:color-mix(in srgb,var(--workspace-accent) 12%,transparent); color:var(--workspace-accent); }
.sidebar-bottom { margin-top:auto; padding:.8rem; padding-top:3rem; }
.sidebar-bottom .sidebar-label { padding:0; }
.app-topbar { min-height:76px; display:flex; align-items:center; gap:1rem; padding:1rem 2.5rem; border-bottom:1px solid var(--workspace-line); }
.workspace-main { padding:2.5rem; max-width:1800px; margin:auto; min-height:calc(100vh - 140px); }
.app-footer { padding:1rem 2.5rem; font-size:.8rem; color:var(--workspace-muted); }
.page-heading { display:flex; justify-content:space-between; align-items:center; gap:1.5rem; margin-bottom:2rem; }
.page-heading h1 { font-size:2rem; letter-spacing:-.04em; font-weight:750; }
.page-heading p { margin-bottom:.3rem; }
.page-heading .btn { flex-shrink:0; }
.card,.login-card,.empty-state { background:var(--workspace-panel); border:1px solid var(--workspace-line) !important; border-radius:1rem; box-shadow:none !important; }
.resource-card .card-body { padding:1.5rem; }
.resource-summary { color:var(--workspace-muted); padding:0 0 1.5rem; }
.resource-summary strong { color:var(--bs-body-color); font-size:1.4rem; }
.empty-state { padding:4rem 2rem; text-align:center; }
.empty-state h2 { font-size:1.3rem; }
.mode-bar { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:1.8rem; }
.mode-badge { border:1px solid var(--workspace-line); padding:.35rem .8rem; border-radius:999px; font-size:.8rem; color:var(--workspace-accent); background:color-mix(in srgb,var(--workspace-accent) 8%,transparent); }
.table { --bs-table-bg:transparent; }
.table th,.table td { padding:1rem 1.25rem; }
.table thead th { background:var(--bs-tertiary-bg); color:var(--workspace-muted); font-size:.75rem; text-transform:uppercase; letter-spacing:.05em; }
.text-muted { color:var(--workspace-muted) !important; }
.module-tile:hover { transform:none; box-shadow:0 4px 20px #0000000d !important; }
.btn-primary { background:#315ee7; border-color:#315ee7; }
[data-bs-theme=dark] .btn-light { background:#283247; color:#e5eaf3; border-color:#354158; }
[data-bs-theme=dark] .text-primary { color:#9ab4ff !important; }
.skip-link { position:absolute; top:-100px; left:1rem; padding:1rem; z-index:2000; background:var(--workspace-panel); }
.skip-link:focus { top:1rem; }
.audit-filters { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:1rem; align-items:end; }
.audit-comment { min-width:220px; white-space:pre-wrap; overflow-wrap:anywhere; }
@media(min-width:992px) { .app-sidebar { position:fixed; inset:0 auto 0 0; height:100vh; } .app-content { margin-left:248px; } }
@media(max-width:767px) { .workspace-main { padding:1.5rem 1rem; } .app-topbar { padding:1rem; } .page-heading { align-items:flex-start; flex-direction:column; } .app-footer { padding:1rem; } }
.user-table-responsive { overflow-x:auto; }
:focus-visible { outline:2px solid var(--workspace-accent); outline-offset:3px; }
[data-bs-theme=dark] .btn-outline-secondary { --bs-btn-color:#b4bfd2; --bs-btn-border-color:#637088; --bs-btn-hover-bg:#344059; --bs-btn-hover-color:#fff; --bs-btn-disabled-color:#a5b1c5; }
.table-responsive,.user-table-responsive { position:relative; }

/* Arrangement previews preserve dashboard tile proportions without service actions. */
.arrangement-toolbar { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.arrangement-toolbar .btn { flex-shrink:0; }
.arrangement-tile { position:relative; border-style:dashed !important; }
.arrangement-controls { display:flex; align-items:center; gap:.65rem; margin-bottom:1rem; }
.drag-handle { display:grid; place-items:center; width:2rem; height:2rem; border:0; border-radius:.4rem; background:var(--bs-tertiary-bg); color:var(--workspace-muted); font-size:1.5rem; line-height:1; cursor:grab; touch-action:none; }
.drag-handle:active { cursor:grabbing; }
.configuration-actions { border-top:1px solid var(--workspace-line); }
.arrangement-tile.is-dragging { opacity:.45; }
.arrangement-tile.drop-before::before,.arrangement-tile.drop-after::after { content:""; position:absolute; top:0; bottom:0; width:4px; border-radius:4px; background:var(--workspace-accent); pointer-events:none; }
.arrangement-tile.drop-before::before { left:-.75rem; }
.arrangement-tile.drop-after::after { right:-.75rem; }
.arrangement-drag-preview { position:fixed; z-index:1100; pointer-events:none; padding:.65rem 1rem; max-width:220px; overflow-wrap:anywhere; border-radius:.5rem; border:1px solid var(--workspace-accent); background:var(--workspace-panel); color:var(--bs-body-color); box-shadow:0 8px 24px #0003; }
.is-arranging { user-select:none; }
.module-health-feedback { white-space:normal; align-items:flex-start; overflow-wrap:anywhere; }
.module-health-feedback .module-health-dot { flex-shrink:0; margin-top:.35rem; }
@media(max-width:575px) { .arrangement-toolbar { align-items:flex-start; flex-direction:column; } }

/* A form between modal-content and modal-body must pass on the height constraint. */
.modal-dialog-scrollable .modal-content > form {
    display:flex;
    flex-direction:column;
    min-height:0;
    max-height:100%;
    overflow:hidden;
}
.modal-dialog-scrollable .modal-body {
    min-height:0;
    overflow-y:auto;
    overscroll-behavior-y:contain;
    scrollbar-gutter:stable;
}
.modal-header,.modal-footer { flex-shrink:0; }
.modal-body,.searchable-select-options,.app-sidebar .offcanvas-body,.table-responsive,.user-table-responsive {
    scrollbar-width:thin;
    scrollbar-color:var(--workspace-muted) var(--bs-tertiary-bg);
}
.app-sidebar .offcanvas-body { min-height:0; overflow-y:auto; }

/* The search input occupies the select's usual position. Results expand within
   the form flow so modal edges cannot clip them or cover the footer actions. */
.searchable-select { min-width:0; }
.searchable-select-input { cursor:pointer; text-overflow:ellipsis; }
.searchable-select.is-open .searchable-select-input { cursor:text; }
.searchable-select-options {
    max-height:min(16rem,35dvh);
    overflow-y:auto;
    overscroll-behavior:contain;
    margin-top:.35rem;
    padding:.25rem;
    border:1px solid var(--workspace-line);
    border-radius:var(--bs-border-radius);
    background:var(--workspace-panel);
    animation:ui-reveal .14s ease-out;
}
.searchable-select-option,.searchable-select-empty { padding:.6rem .75rem; overflow-wrap:anywhere; }
.searchable-select-option { cursor:pointer; border-radius:.3rem; transition:background-color .12s ease; }
.searchable-select-option[aria-selected=true] { font-weight:600; }
.searchable-select-option:hover,.searchable-select-option.is-active {
    background:color-mix(in srgb,var(--workspace-accent) 12%,var(--workspace-panel));
    color:var(--workspace-accent);
}
.searchable-select-empty { color:var(--workspace-muted); }
.module-type-fields:not(.d-none) { animation:ui-reveal .18s ease-out; }
.sidebar-link,.btn,.form-control,.form-select { transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease; }
@keyframes ui-reveal {
    from { opacity:0; transform:translateY(3px); }
    to { opacity:1; transform:translateY(0); }
}
@media(prefers-reduced-motion:reduce) {
    *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}

.module-tile,.module-tile .card-body,.module-tile-metadata { min-width:0; }
.module-tile-metadata { overflow-wrap:anywhere; }
.configuration-actions .btn,.module-tile-footer .btn { flex-shrink:0; }
.operation-result { white-space:pre-wrap; overflow-wrap:anywhere; max-height:16rem; overflow-y:auto; }
.module-tile:has(.dropdown-menu.show) { z-index:1; }
