/*
 * Configured Things corporate theme for TypeDoc 0.28
 *
 * Overrides TypeDoc's light/dark CSS variable sets with the CT brand palette.
 * CT primary blue: #0056A3   CT dark: #333333
 */

/* ── Google Fonts imports ─────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Poppins:ital,wght@0,500;0,600;0,700;0,800;1,500;1,600&display=swap');

/* ── Light mode ──────────────────────────────────────────────────────────── */
:root {
    /* Backgrounds */
    --light-color-background:           #ffffff;
    --light-color-background-secondary: #f0f6fd;   /* CT blue-faint */
    --light-color-background-active:    #c2d9f0;   /* CT blue-mid   */

    /* Text */
    --light-color-text:         #333333;           /* CT dark       */
    --light-color-contrast-text:#000000;
    --light-color-text-aside:   #5a6c7e;

    /* Accent / borders */
    --light-color-accent:       #c2d9f0;           /* CT blue-mid   */

    /* Links and focus */
    --light-color-link:         #0056A3;           /* CT blue       */
    --light-color-focus-outline:#0056A3;

    /* TypeScript kind colours — lean into the CT blue family            */
    /* Class and constructor stay CT blue                                 */
    --light-color-ts-class:           #0056A3;
    --light-color-ts-constructor:     #0056A3;
    /* Keywords: slightly darker blue                                     */
    --light-color-ts-keyword:         #003e7a;
    /* Interface: teal variant of blue                                    */
    --light-color-ts-interface:       #007a9e;
    /* Method / call-signature: darker CT blue                            */
    --light-color-ts-method:          #0056A3;
    --light-color-ts-call-signature:  #0056A3;
    /* Function: medium blue                                              */
    --light-color-ts-function:        #1a6bc4;
    /* Property / index-signature                                         */
    --light-color-ts-property:        #5c3d1e;
    --light-color-ts-index-signature: #5c3d1e;
    /* Variable / parameter                                               */
    --light-color-ts-variable:        #234ea0;
    --light-color-ts-parameter:       #234ea0;
    /* Type alias / reference / accessor: unchanged from default          */
}

/* ── Dark mode ───────────────────────────────────────────────────────────── */
:root {
    /* Backgrounds */
    --dark-color-background:           #0a1520;   /* very dark blue  */
    --dark-color-background-secondary: #0f1e2e;
    --dark-color-background-active:    #1e3347;

    /* Text */
    --dark-color-text:         #e8edf2;
    --dark-color-contrast-text:#ffffff;
    --dark-color-text-aside:   #8aa3bd;

    /* Accent / borders */
    --dark-color-accent:       #1e3347;

    /* Links and focus */
    --dark-color-link:         #4a9ee8;
    --dark-color-focus-outline:#4a9ee8;

    /* TypeScript kind colours in dark mode */
    --dark-color-ts-class:           #7dc0ff;
    --dark-color-ts-constructor:     #7dc0ff;
    --dark-color-ts-keyword:         #a8d4ff;
    --dark-color-ts-interface:       #5dd5f5;
    --dark-color-ts-method:          #6bbfff;
    --dark-color-ts-call-signature:  #6bbfff;
    --dark-color-ts-function:        #88c8ff;
    --dark-color-ts-variable:        #9cb8e8;
    --dark-color-ts-parameter:       #9cb8e8;
}

/* ── Typography ──────────────────────────────────────────────────────────── */
@layer typedoc {
    /* Body text: Archivo */
    body {
        font-family: 'Archivo', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }

    /* Headings: Poppins */
    h1, h2, h3, h4, h5, h6 {
        font-family: 'Poppins', sans-serif;
    }

    .tsd-page-title h1,
    .tsd-hierarchy h2,
    .tsd-comment > .tsd-comment {
        font-family: 'Poppins', sans-serif;
    }
}

/* ── Toolbar / header ────────────────────────────────────────────────────── */
@layer typedoc {
    /*
     * Our injected .site-header handles branding and navigation.
     * Hide the TypeDoc toolbar's title and nav links to avoid duplication;
     * the toolbar itself is kept for its search / theme-toggle / settings controls.
     */
    a.title,
    #tsd-toolbar-links {
        display: none;
    }

    .tsd-page-toolbar {
        border-top: none;
    }

    /* Push search / theme-toggle / settings to the right now that the title is gone */
    .tsd-toolbar-contents {
        justify-content: flex-end;
    }

    /* Active nav item highlight */
    .tsd-navigation a.current,
    .tsd-navigation a:hover {
        color: var(--color-link);
    }

    /* "Selected" sidebar item uses CT blue background tint */
    .tsd-navigation li.selected > a,
    .tsd-navigation li.selected > span {
        background: #e6f0fa;
        color: #0056A3;
        font-weight: 600;
    }

    /* Member signatures */
    .tsd-signature {
        border-left: 3px solid #0056A3;
    }

    /* Breadcrumb separator */
    .tsd-breadcrumb a:hover {
        color: #0056A3;
    }

    /* Search highlight */
    .tsd-matched-text {
        background: #c2d9f0;
        color: #003e7a;
    }

    /* Source file link */
    .tsd-anchor-link:hover {
        color: #0056A3;
    }
}

/* ── Injected site header ─────────────────────────────────────────────────── */

.site-header {
    background: #ffffff;
    border-bottom: 1px solid #d0dde9;
    padding: 0 1.5rem;
    height: 52px;
    display: flex;
    align-items: center;
}

.site-header-inner {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    display: flex;
    align-items: center;
}

.site-logo {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.site-logo a {
    display: flex;
    align-items: center;
    text-decoration: none;
}

.site-logo a:hover { opacity: 0.8; }

.site-logo-img {
    height: 28px;
    width: auto;
    max-width: 180px;
    display: block;
}

.site-logo-name {
    font-family: 'Archivo', monospace;
    font-size: 0.95rem;
    font-weight: 600;
    color: #5a6c7e;
    text-decoration: none;
}

.site-logo-name:hover { color: #0056A3; }

.site-nav {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-left: auto;
    font-family: 'Archivo', sans-serif;
}

.site-nav a {
    font-size: 0.88rem;
    font-weight: 500;
    color: #5a6c7e;
    text-decoration: none;
}

.site-nav a:hover { color: #0056A3; }

/* Dark mode overrides */
@media (prefers-color-scheme: dark) {
    .site-header {
        background: #0f1e2e;
        border-bottom-color: #2e3a47;
    }

    .site-logo-name { color: #8fa8bf; }
    .site-logo-name:hover { color: #5ba4e0; }
    .site-nav a { color: #8fa8bf; }
    .site-nav a:hover { color: #5ba4e0; }
}

/* ── Hamburger button (hidden on desktop) ─────────────────────────────────── */
.site-nav-hamburger {
    display: none;
    margin-left: auto;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.5rem;
    color: #5a6c7e;
    line-height: 0;
    flex-shrink: 0;
    position: relative;
    z-index: 201;
}

.hamburger-icon,
.hamburger-icon::before,
.hamburger-icon::after {
    display: block;
    width: 20px;
    height: 2px;
    background: currentColor;
    border-radius: 2px;
    transition: transform 0.25s, opacity 0.2s;
}
.hamburger-icon { position: relative; }
.hamburger-icon::before,
.hamburger-icon::after { content: ''; position: absolute; left: 0; }
.hamburger-icon::before { top: -6px; }
.hamburger-icon::after  { top: 6px; }

/* ── Nav backdrop (hidden on desktop) ────────────────────────────────────── */
.site-nav-backdrop { display: none; }

/* ── CSS checkbox hack (used by the injected static header) ──────────────── */
.site-nav-toggle-cb { display: none; }

@media (max-width: 767px) {
    .site-nav-toggle-cb:checked ~ .site-header-inner .site-nav-backdrop {
        background: rgba(0, 0, 0, 0.45);
        pointer-events: auto;
    }
    .site-nav-toggle-cb:checked ~ .site-header-inner .site-nav {
        transform: translateX(0);
    }
    .site-nav-toggle-cb:checked ~ .site-header-inner .hamburger-icon {
        background: transparent;
    }
    .site-nav-toggle-cb:checked ~ .site-header-inner .hamburger-icon::before {
        transform: rotate(45deg) translate(4px, 4px);
    }
    .site-nav-toggle-cb:checked ~ .site-header-inner .hamburger-icon::after {
        transform: rotate(-45deg) translate(4px, -4px);
    }

    /* Header */
    .site-header { padding: 0 1rem; }
    .site-header-inner { gap: 0.5rem; }
    .site-logo-name { display: none; }

    /* Show hamburger */
    .site-nav-hamburger {
        display: flex;
        align-items: center;
        height: 52px;
    }

    /* Backdrop: full-screen dimmer */
    .site-nav-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0);
        z-index: 199;
        pointer-events: none;
        transition: background 0.3s;
    }

    /* Nav drawer: slides in from the right */
    .site-nav {
        position: fixed;
        top: 0;
        right: 0;
        height: 100dvh;
        width: min(300px, 82vw);
        background: #ffffff;
        border-left: 1px solid #d0dde9;
        box-shadow: -6px 0 32px rgba(0, 0, 0, 0.18);
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        padding: calc(52px + 0.75rem) 1.5rem 2rem;
        z-index: 200;
        transform: translateX(100%);
        transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        overflow-y: auto;
        margin-left: 0;
    }

    .site-nav a {
        padding: 0.85rem 0;
        border-bottom: 1px solid #d0dde9;
        min-height: 44px;
        display: flex;
        align-items: center;
        font-size: 1rem;
        text-align: left;
    }
    .site-nav a:last-child { border-bottom: none; }

}

/* ── Page title: allow break at "/" on narrow screens ────────────────────── */
@media (max-width: 767px) {
    .tsd-page-title h1 {
        font-size: clamp(1.1rem, 5vw, 1.875rem);
        overflow-wrap: anywhere;
    }
}

@media (max-width: 767px) and (prefers-color-scheme: dark) {
    .site-nav-hamburger { color: #8fa8bf; }

    .site-nav {
        background: #0f1e2e;
        border-left-color: #3a5470;
    }
    .site-nav a { border-bottom-color: #3a5470; }
}