/* ksTFL pkgdown site theme — complements bslib primary color
 * Auto-loaded by pkgdown BS5 from pkgdown/extra.css
 */

/* ── Brand accent strip (top of every page) ────────────── */
body::before {
    content: "";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(to right, #2166AC 0%, #2E86C1 60%, #d0d0d0 100%);
    z-index: 9999;
}

/* ── Navbar refinements ─────────────────────────────────── */
.navbar {
    border-bottom: 1px solid rgba(33, 102, 172, 0.15);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

/* ── Code blocks ────────────────────────────────────────── */
pre {
    border-left: 4px solid #2166AC;
    border-radius: 6px;
    font-variant-ligatures: none;
}

code {
    font-family: "Consolas", "SFMono-Regular", "Menlo", monospace;
    font-variant-ligatures: none;
}

/* ── Article content ────────────────────────────────────── */
.contents h2 {
    border-bottom: 2px solid #e1e4e8;
    padding-bottom: 0.3em;
}

.contents h3 {
    color: #2166AC;
}

/* ── Reference page badges ──────────────────────────────── */
.ref-index .icon {
    color: #2166AC;
}

/* ── Sidebar TOC ────────────────────────────────────────── */

/* Move sidebar to the left on all pages that have one */
.template-article>.row>aside,
.template-article-index>.row>aside,
.template-reference-topic>.row>aside {
    order: -1;
}

/* Smaller, refined TOC text */
aside nav#toc {
    font-size: 0.84rem;
    line-height: 1.5;
}

aside nav#toc h2 {
    font-size: 0.92rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #666;
    margin-bottom: 0.5em;
}

aside nav#toc a {
    color: #444;
    transition: color 0.15s;
}

aside nav#toc a:hover {
    color: #2166AC;
}

aside nav#toc a.active {
    border-left-color: #2166AC;
    color: #2166AC;
    font-weight: 600;
}

/* ── Blockquotes ────────────────────────────────────────── */
blockquote {
    border-left: 4px solid #2166AC;
    background: #f0f6fc;
    border-radius: 0 6px 6px 0;
    padding: 0.6em 1em;
}

/* ── Tables ─────────────────────────────────────────────── */
.table {
    border: 1px solid #d8dee4;
    border-radius: 8px;
    overflow: hidden;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.92em;
}

.table>thead>tr>th {
    background: #f0f6fc;
    color: #1a3a5c;
    font-weight: 700;
    font-size: 0.85em;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 0.7em 1em;
    border-bottom: 2px solid #2166AC;
    border-top: none;
}

.table>tbody>tr>td {
    padding: 0.55em 1em;
    border-bottom: 1px solid #eaecef;
    color: #24292f;
}

.table>tbody>tr:nth-child(even) {
    background: #f8fafb;
}

.table>tbody>tr:hover {
    background: #e8f0fe;
}

.table>tbody>tr>td:first-child {
    font-weight: 500;
}

.table>tbody>tr>td code {
    font-size: 0.85em;
    background: #e8eef4;
    padding: 0.1em 0.35em;
    border-radius: 3px;
}

/* ── Article images ─────────────────────────────────────── */
.contents img {
    display: block;
    margin: 1em auto;
    max-width: 100%;
    border-radius: 6px;
    border: 1px solid #e1e4e8;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.contents img[src*="logo"] {
    border: none;
    box-shadow: none;
}

/* ── Footer ─────────────────────────────────────────────── */
footer {
    border-top: 2px solid #e1e4e8;
}

/* ── Selection highlight ────────────────────────────────── */
::selection {
    background: rgba(33, 102, 172, 0.15);
}

/* ── Scrollbar in code blocks ───────────────────────────── */
pre::-webkit-scrollbar {
    height: 6px;
}

pre::-webkit-scrollbar-thumb {
    background: #c0c8d0;
    border-radius: 3px;
}

pre::-webkit-scrollbar-thumb:hover {
    background: #2166AC;
}

/* ── Dark mode ──────────────────────────────────────────── */
/* Mirrors the light theme but brightens the brand accent
 * (#4A9EDE) and darkens surfaces. Applies only when the
 * pkgdown page is in dark mode (BS5 sets data-bs-theme="dark"),
 * or when the OS reports a dark color scheme. */
[data-bs-theme="dark"] .table,
[data-bs-theme="dark"] .table>thead>tr>th,
[data-bs-theme="dark"] .table>tbody>tr>td {
    border-color: #3a3f4b;
}

[data-bs-theme="dark"] .table>thead>tr>th {
    background: #23303d;
    color: #cfe2f5;
    border-bottom-color: #4A9EDE;
}

[data-bs-theme="dark"] .table>tbody>tr>td {
    color: #d6d9e0;
    border-bottom-color: #2c303a;
}

[data-bs-theme="dark"] .table>tbody>tr:nth-child(even) {
    background: #20232a;
}

[data-bs-theme="dark"] .table>tbody>tr:hover {
    background: #2a3744;
}

[data-bs-theme="dark"] .table>tbody>tr>td code {
    background: #2c333d;
}

[data-bs-theme="dark"] pre {
    border-left-color: #4A9EDE;
}

[data-bs-theme="dark"] .contents h2 {
    border-bottom-color: #3a3f4b;
}

[data-bs-theme="dark"] .contents h3 {
    color: #4A9EDE;
}

[data-bs-theme="dark"] blockquote {
    border-left-color: #4A9EDE;
    background: rgba(35, 48, 61, 0.5);
}

[data-bs-theme="dark"] .contents img {
    border-color: #3a3f4b;
}

[data-bs-theme="dark"] aside nav#toc h2 {
    color: #aab0bc;
}

[data-bs-theme="dark"] aside nav#toc a {
    color: #aab0bc;
}

[data-bs-theme="dark"] aside nav#toc a:hover,
[data-bs-theme="dark"] aside nav#toc a.active {
    color: #4A9EDE;
    border-left-color: #4A9EDE;
}

[data-bs-theme="dark"] pre::-webkit-scrollbar-thumb {
    background: #4a4f5b;
}

[data-bs-theme="dark"] pre::-webkit-scrollbar-thumb:hover {
    background: #4A9EDE;
}