:root{
--card-bg:#fff; --card-border:#e5e7eb; --muted:#6c757d; --fg:#111827; --accent:#0d6efd; --surface:#f8f9fa;
}
html[data-theme="dark"]{
--card-bg:#0f1115; --card-border:#1f2430; --muted:#9aa4b2; --fg:#e5e7eb; --accent:#60a5fa; --surface:#0b0d11;
}
body{ color:var(--fg); background:var(--surface); }
.bg-surface{ background:var(--surface); }
.page-header.bg-blur{ position:sticky; top:0; z-index:1030; backdrop-filter:saturate(180%) blur(6px); background:rgba(255,255,255,.8); }
html[data-theme="dark"] .page-header.bg-blur{ background:rgba(15,17,21,.8); }
.card{ background:var(--card-bg); border:1px solid var(--card-border); border-radius:16px; }
.form-control, .form-select{ border-radius:10px; border-color:var(--card-border); background:var(--card-bg); color:var(--fg); }
.btn{ border-radius:10px; }
.page-footer{ margin-top:40px; padding:20px 0; border-top:1px solid var(--card-border); color:var(--muted); font-size:.875rem; }
.toc a{ text-decoration:none; display:block; padding:.2rem .1rem; border-left:2px solid transparent; }
.toc a.active{ border-left-color:var(--accent); font-weight:600; }
/* Live search dropdown */
.live-suggest{
    position:absolute; left:0; right:96px; top:100%;
    z-index: 2000;
    background: var(--card-bg);
    border:1px solid var(--card-border);
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0,0,0,.08);
    margin-top: .25rem;
    max-height: 420px;
    overflow:auto;
}
.live-suggest .item{
    display:block; padding:.55rem .75rem; text-decoration:none; color:inherit;
    border-bottom:1px solid rgba(0,0,0,.04);
}
.live-suggest .item:last-child{ border-bottom:0; }
.live-suggest .item .t{ font-weight:600; }
.live-suggest .item .m{ font-size:.85rem; color:var(--muted); }
.live-suggest .item.active,
.live-suggest .item:hover{ background: rgba(13,110,253,.08); }
.live-suggest .more{ display:block; padding:.5rem .75rem; text-align:center; font-weight:600; }
@media (max-width: 768px){
    .live-suggest{ right:0; }
}
.brand-logo{
    width:200px; height:50px; object-fit:cover; border-radius:8px;
}
.brand-text{ font-weight:600; letter-spacing:.3px; }
/* Optional: tuck text on very small screens */
@media (max-width:480px){
    .brand-text{ display:none; }
}
     .brand a{
    color: var(--fg) !important;
    text-decoration: none !important;
}
.brand a:hover,
.brand a:focus{
    color: var(--fg) !important;
    text-decoration: none !important;
}
 /* Sticky TOC */
#tocWrap{ position:sticky; top:150px; max-height:calc(100vh - 110px); overflow:auto; }
/* Smooth anchor jumps + offset for sticky header */
html{ scroll-behavior:smooth; }
#pageContent h2, #pageContent h3{ scroll-margin-top:96px; }
/* Optional polish for active link */
#tocWrap .toc a{ text-decoration:none; display:block; padding:.2rem .1rem; border-left:2px solid transparent; }
#tocWrap .toc a.active{ border-left-color:var(--accent); font-weight:600; }

/* Sticky TOC (desktop) */
#tocWrap{ position:sticky; top:88px; max-height:calc(100vh - 110px); overflow:auto; }

/* Smooth jumps; offset for sticky header */
html{ scroll-behavior:smooth; }
#pageContent h2, #pageContent h3{ scroll-margin-top:96px; }


/* Optional: subtle anchor icon on hover */
#pageContent h2 .anchor, #pageContent h3 .anchor{
    margin-left:.25rem; opacity:0; text-decoration:none;
}
#pageContent h2:hover .anchor, #pageContent h3:hover .anchor{ opacity:1; }
  /* TOC structure + persistent highlighting */
.toc ul{ list-style:none; padding-left:.5rem; margin:0; }
.toc li{ margin:.1rem 0; }
.toc .lvl-2 > a{ font-weight:600; }
.toc .lvl-2 > ul{ display:none; padding-left:.5rem; }
.toc .lvl-2.open > ul{ display:block; }

.toc a{
    color: inherit; text-decoration:none; display:block; padding:.2rem 0;
    border-left:2px solid transparent;
}
.toc .current > a{ border-left-color: var(--accent); font-weight:600; }
.toc .current-parent > a{ border-left-color: var(--accent); }

/* Sticky + scroll offset (keep if you already added) */
#tocWrap{ position:sticky; top:88px; max-height:calc(100vh - 110px); overflow:auto; }
html{ scroll-behavior:smooth; }
#pageContent h2, #pageContent h3{ scroll-margin-top:96px; }
 /* Keep admin actions tight */
.table .text-nowrap .btn,
.table .text-nowrap .dropdown,
.table .text-nowrap form {
    display: inline-flex;
    align-items: center;
}
.table .text-nowrap .dropdown-menu form { margin: 0; }
/* Mobile TOC drawer: push down 150px so it clears the header/logo */
@media (max-width: 991.98px){
    #tocOffcanvas{
        top: 50px !important;
        height: calc(100% - 50px) !important;
    }
    /* If you keep the dim backdrop, offset it too */
    .offcanvas-backdrop.show{
        top: 50px !important;
        height: calc(100% - 50px) !important;
    }
}
   .attachment {
    display:inline-flex; align-items:center; gap:.35rem;
    padding:.15rem .35rem; border:1px solid var(--card-border,#e5e7eb);
    border-radius:6px; text-decoration:none;
}
.attachment:hover { background:rgba(13,110,253,.06); text-decoration:none; }