/* ============================================================
   CobaltPDF Documentation Theme
   Brand palette: #0B0E14 bg · #38bdf8 cyan · #818cf8 indigo
   ============================================================ */

/* ---------- Base overrides ---------- */
:root {
    --cobalt-bg:       #0B0E14;
    --cobalt-surface:  #0f1520;
    --cobalt-border:   rgba(255,255,255,.07);
    --cobalt-cyan:     #38bdf8;
    --cobalt-indigo:   #818cf8;
    --cobalt-text:     #f1f5f9;
    --cobalt-muted:    #94a3b8;
}

[data-bs-theme="dark"] body,
body {
    background-color: var(--cobalt-bg) !important;
    color: var(--cobalt-muted) !important;
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

/* ---------- Navbar ---------- */
header.bg-body {
    background: rgba(11, 14, 20, 0.8) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(56,189,248,.1) !important;
    position: sticky;
    top: 0;
    z-index: 1030;
}

.navbar-brand {
    font-weight: 800;
    font-size: 1.1rem;
    color: var(--cobalt-text) !important;
    letter-spacing: -.3px;
}

/* Back-to-site link shown alongside brand */
.navbar-back-site {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-size: .78rem;
    font-weight: 500;
    color: var(--cobalt-muted) !important;
    text-decoration: none;
    margin-left: auto;
    margin-right: .5rem;
    padding: .3rem .7rem;
    border: 1px solid rgba(56,189,248,.2);
    border-radius: 20px;
    transition: border-color .25s, color .25s, background .25s;
    white-space: nowrap;
    flex-shrink: 0;
}
.navbar-back-site:hover {
    border-color: var(--cobalt-cyan);
    color: var(--cobalt-cyan) !important;
    background: rgba(56,189,248,.06);
}
.navbar-back-icon {
    flex-shrink: 0;
    opacity: .7;
    transition: opacity .2s;
}
.navbar-back-site:hover .navbar-back-icon {
    opacity: 1;
}
.navbar-back-arrow {
    flex-shrink: 0;
    opacity: .5;
    transition: opacity .2s, transform .2s;
}
.navbar-back-site:hover .navbar-back-arrow {
    opacity: 1;
    transform: translate(1px, -1px);
}

/* Mobile: allow navbar-collapse to wrap full-width */
@media (max-width: 767.98px) {
    #autocollapse .container-xxl {
        flex-wrap: wrap !important;
    }
    .navbar-back-site {
        padding: .35rem .5rem;
        margin-left: auto;
        margin-right: .25rem;
        border-radius: 50%;
        border-color: rgba(56,189,248,.25);
    }
    .navbar-back-label {
        display: none;
    }
    .navbar-back-arrow {
        display: none;
    }
    .navbar-back-icon {
        opacity: .85;
        width: 16px;
        height: 16px;
    }
}

/* Small-medium screens: show domain without arrow */
@media (min-width: 768px) and (max-width: 991.98px) {
    .navbar-back-arrow {
        display: none;
    }
    .navbar-back-site {
        font-size: .72rem;
        padding: .25rem .55rem;
    }
}

/* Search */
#search .form-control {
    background: rgba(255,255,255,.05) !important;
    border-color: rgba(255,255,255,.1) !important;
    color: var(--cobalt-text) !important;
    border-radius: 8px;
}
#search .form-control:focus {
    border-color: rgba(56,189,248,.4) !important;
    box-shadow: 0 0 0 3px rgba(56,189,248,.12) !important;
}
#search .bi-search { color: var(--cobalt-muted); }

/* ---------- Sidebar / TOC ---------- */
.offcanvas,
.offcanvas-md {
    background: var(--cobalt-surface) !important;
    border-right: 1px solid var(--cobalt-border) !important;
}

nav.toc a,
nav#toc a {
    color: var(--cobalt-muted) !important;
    font-size: .875rem;
    text-decoration: none;
    border-radius: 6px;
    padding: .2rem .5rem;
    display: block;
    transition: color .15s, background .15s;
}
nav.toc a:hover,
nav#toc a:hover {
    color: var(--cobalt-text) !important;
    background: rgba(255,255,255,.04);
}
nav.toc a.active,
nav#toc a.active {
    color: var(--cobalt-cyan) !important;
    background: rgba(56,189,248,.08);
    font-weight: 600;
}

/* ---------- Article content ---------- */
article {
    color: var(--cobalt-muted);
    line-height: 1.8;
}

article h1, article h2, article h3, article h4, article h5 {
    color: var(--cobalt-text);
    font-weight: 700;
}

article h1 { font-size: 2rem; margin-bottom: 1rem; }
article h2 {
    font-size: 1.35rem;
    margin-top: 2.5rem;
    padding-bottom: .4rem;
    border-bottom: 1px solid rgba(56,189,248,.12);
}
article h3 { font-size: 1.1rem; margin-top: 2rem; }

article a { color: var(--cobalt-cyan); text-decoration: none; }
article a:hover { text-decoration: underline; }

article strong { color: var(--cobalt-text); }

article p { margin-bottom: 1rem; }

/* ---------- Code blocks ---------- */
pre {
    background: #161d2e !important;
    border: 1px solid rgba(56,189,248,.12) !important;
    border-radius: 10px !important;
    padding: 1.25rem 1.5rem !important;
    font-size: .85rem;
    overflow-x: auto;
}

code {
    font-family: 'Fira Code', 'Cascadia Code', monospace !important;
    font-size: .85em;
}

:not(pre) > code {
    background: rgba(56,189,248,.08) !important;
    color: var(--cobalt-cyan) !important;
    padding: .15rem .4rem;
    border-radius: 4px;
    font-size: .85em;
}

/* Highlight.js token overrides for dark theme */
.hljs { background: transparent !important; color: #cbd5e1; }
.hljs-keyword  { color: #818cf8; }
.hljs-string   { color: #86efac; }
.hljs-comment  { color: #475569; font-style: italic; }
.hljs-number   { color: #fb923c; }
.hljs-type,
.hljs-class    { color: #38bdf8; }
.hljs-function { color: #c4b5fd; }
.hljs-built_in { color: #38bdf8; }

/* ---------- Tables ---------- */
.table {
    color: var(--cobalt-muted) !important;
    border-color: var(--cobalt-border) !important;
}
.table th {
    color: var(--cobalt-text) !important;
    background: rgba(56,189,248,.06) !important;
    font-weight: 600;
    font-size: .85rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    border-color: rgba(56,189,248,.12) !important;
}
.table td {
    border-color: var(--cobalt-border) !important;
    font-size: .9rem;
}

/* ---------- Alert/callout boxes ---------- */
.alert, div[class*="NOTE"], div[class*="TIP"],
div[class*="WARNING"], div[class*="IMPORTANT"] {
    border-radius: 10px !important;
    border-left: 3px solid;
    font-size: .9rem;
}

/* DocFX note callouts */
.NOTE    { background: rgba(56,189,248,.07)  !important; border-color: #38bdf8 !important; color: #bae6fd !important; }
.TIP     { background: rgba(129,140,248,.07) !important; border-color: #818cf8 !important; color: #c4b5fd !important; }
.WARNING { background: rgba(245,158,11,.07)  !important; border-color: #f59e0b !important; color: #fcd34d !important; }
.IMPORTANT { background: rgba(239,68,68,.07) !important; border-color: #ef4444 !important; color: #fca5a5 !important; }

/* ---------- Right-hand affix (on-this-page) ---------- */
nav#affix a {
    color: var(--cobalt-muted) !important;
    font-size: .8rem;
    text-decoration: none;
    transition: color .15s;
}
nav#affix a:hover,
nav#affix a.active {
    color: var(--cobalt-cyan) !important;
}
nav#affix::before {
    content: "On this page";
    display: block;
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #475569;
    margin-bottom: .5rem;
}

/* ---------- Breadcrumb ---------- */
nav#breadcrumb .breadcrumb-item,
nav#breadcrumb .breadcrumb-item a {
    color: var(--cobalt-muted) !important;
    font-size: .85rem;
    text-decoration: none;
}
nav#breadcrumb .breadcrumb-item.active { color: var(--cobalt-cyan) !important; }

/* ---------- Prev/Next navigation ---------- */
.next-article {
    border-color: var(--cobalt-border) !important;
    padding-top: 1.5rem;
    margin-top: 2.5rem;
}
.next-article a { color: var(--cobalt-cyan) !important; font-weight: 600; }

/* ---------- Footer ---------- */
footer.border-top {
    border-color: var(--cobalt-border) !important;
    background: var(--cobalt-bg) !important;
    color: var(--cobalt-muted) !important;
    font-size: .85rem;
    padding: 1rem 0;
}
footer a { color: var(--cobalt-cyan) !important; }

/* ---------- Scrollbar ---------- */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--cobalt-bg); }
::-webkit-scrollbar-thumb { background: rgba(56,189,248,.25); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(56,189,248,.45); }