/*
 * Everysight Maverick AI SDK — Dokka custom theme
 * Applies brand colors, typography, and logo to the generated API docs.
 */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@200;400;600&display=swap');

/* ──────────────────── Light theme (default) ──────────────────── */
:root {
    /* Backgrounds */
    --background-color: #FFFFFF;
    --default-gray: #E7E7E7;
    --color-scrollbar-track: #E7E7E7;

    /* Text */
    --default-font-color: #111723;
    --header-font-color: #111723;
    --breadcrumb-font-color: #637282;
    --brief-color: #4A5568;
    --average-color: #111723;
    --copy-icon-color: rgba(17, 23, 35, 0.5);
    --copy-icon-hover-color: #111723;

    /* Accents — Everysight yellow replaces JetBrains purple */
    --active-tab-border-color: #D7D161;
    --active-section-color: #111723;
    --inactive-section-color: #8B9DAE;
    --inactive-tab-border-color: #D7D7D7;
    --sidemenu-section-active-color: #D7D161;
    --hover-link-color: #D7D161;

    /* Code */
    --code-background: rgba(17, 23, 35, 0.05);

    /* Borders & surfaces */
    --border-color: rgba(17, 23, 35, 0.15);
    --color-dark: #111723;
    --navigation-highlight-color: rgba(17, 23, 35, 0.05);
    --color-scrollbar: rgba(17, 23, 35, 0.25);

    /* Footer */
    --footer-background: #E7E7E7;
    --footer-font-color: #8B9DAE;
    --footer-go-to-top-color: #FFFFFF;

    /* Typography */
    --default-font-family: 'Plus Jakarta Sans', Inter, system-ui, -apple-system,
        BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
        'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
}

/* ──────────────────── Dark theme ──────────────────── */
.theme-dark {
    --background-color: #111723;
    --default-gray: #1C2233;
    --color-scrollbar-track: #1C2233;

    --default-font-color: rgba(255, 255, 255, 0.92);
    --header-font-color: rgba(255, 255, 255, 0.92);
    --breadcrumb-font-color: #A6BBCA;
    --brief-color: #A6BBCA;
    --average-color: rgba(255, 255, 255, 0.92);
    --copy-icon-color: rgba(255, 255, 255, 0.4);
    --copy-icon-hover-color: rgba(255, 255, 255, 0.87);

    --active-tab-border-color: #EBEB70;
    --active-section-color: rgba(255, 255, 255, 0.87);
    --inactive-section-color: #8B9DAE;
    --inactive-tab-border-color: rgba(255, 255, 255, 0.2);
    --sidemenu-section-active-color: rgba(235, 235, 112, 0.14);
    --hover-link-color: #EBEB70;

    --code-background: rgba(255, 255, 255, 0.06);

    --border-color: rgba(255, 255, 255, 0.12);
    --color-dark: #1C2233;
    --navigation-highlight-color: rgba(255, 255, 255, 0.05);
    --color-scrollbar: rgba(255, 255, 255, 0.2);

    --footer-background: #1C2233;
    --footer-font-color: #8B9DAE;
    --footer-go-to-top-color: #1C2233;
}

/* ──────────────────── Top navigation bar ──────────────────── */
.navigation {
    background-color: #111723 !important;
    border-bottom: 2px solid #EBEB70;
}

.navigation .library-name--link {
    color: #FFFFFF !important;
    font-weight: 600;
}

.navigation .library-version {
    color: #8B9DAE !important;
}

.navigation-controls--btn {
    color: #FFFFFF !important;
}

.navigation-controls--btn:hover {
    color: #EBEB70 !important;
}

/* Search bar styling */
.navigation-controls--search {
    color: #8B9DAE !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

.navigation-controls--search:hover {
    color: #FFFFFF !important;
    border-color: #EBEB70 !important;
}

/* Platform filter tags */
.platform-tag {
    border-radius: 4px !important;
    font-weight: 600 !important;
}

.navigation .platform-selector:not([data-active]) {
    color: #8B9DAE !important;
}

/* ──────────────────── Links ──────────────────── */
a {
    color: #111723;
}

a:hover {
    color: #D7D161 !important;
}

.theme-dark a {
    color: #A6BBCA;
}

.theme-dark a:hover {
    color: #EBEB70 !important;
}

/* Sidebar active items */
.sideMenuPart[data-active] > .overview > a {
    color: #111723 !important;
    font-weight: 600 !important;
}

.theme-dark .sideMenuPart[data-active] > .overview > a {
    color: #EBEB70 !important;
}

/* Active sidebar marker */
.sideMenuPart[data-active] > .overview {
    border-left: 3px solid #EBEB70 !important;
}

/* ──────────────────── Content headings ──────────────────── */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
}

h1.cover {
    font-weight: 600 !important;
}

h2 {
    font-weight: 600 !important;
}

/* ──────────────────── Table rows (member listings) ──────────────────── */
.table-row:hover {
    background: rgba(235, 235, 112, 0.06) !important;
}

.theme-dark .table-row:hover {
    background: rgba(235, 235, 112, 0.08) !important;
}

/* ──────────────────── Footer ──────────────────── */
.footer {
    border-top: 1px solid var(--border-color);
}

/* ──────────────────── Logo replacement ──────────────────── */

/* ──────────────────── Logo via Dokka's native ::before ──────────────────── */

/* Override Dokka logo dimensions to fit the Everysight header */
:root {
    --dokka-logo-width: 36px;
    --dokka-logo-height: 180px;
}

/* Hide the "sdk" text — logo is sufficient */
.library-name--link {
    font-size: 0 !important;
    color: transparent !important;
}

/* Show "API Reference" after the logo */
.library-name--link::after {
    content: "API Reference";
    font-size: 13px;
    font-weight: 400;
    color: #8B9DAE;
    margin-left: 8px;
    white-space: nowrap;
}

/* Style the version number in the title bar */
.library-version {
    color: #8B9DAE !important;
    font-size: 13px !important;
    margin-left: 4px;
    top: 0 !important;
    position: relative !important;
    line-height: inherit !important;
}

/* Keep title row centered */
.navigation-title {
    align-items: center !important;
}

/* ──────────────────── Scrollbar polish ──────────────────── */
html::-webkit-scrollbar-thumb {
    border-radius: 6px;
}

/* ──────────────────── Code blocks ──────────────────── */
code, pre {
    font-family: 'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono',
        Menlo, Courier, monospace;
}

/* ──────────────────── Tabs (platform selector in content) ──────────────────── */
.tabs-section-body .tab[data-active] {
    border-bottom-color: #EBEB70 !important;
}