/*
 * Copyright (c) 2026 Yuichi Ito (yuichi@yuichi.com)
 *
 * This software is licensed under the Apache License, Version 2.0.
 * For more information, please visit: https://github.com/yuichi110/drawlib
 *
 * This software is provided "as is", without warranty of any kind,
 * express or implied, including but not limited to the warranties of
 * merchantability, fitness for a particular purpose and noninfringement.
 */

/* Google Editorial PDF Theme for drawlib build pdf */

:root {
    --rtd-brand-color: #1a73e8;
    --rtd-brand-dark: #1557b0;
    --rtd-text-color: #202124;
    --rtd-heading-color: #202124;
    --rtd-muted-color: #5f6368;
    --rtd-bg-color: #ffffff;
    --rtd-content-bg: #ffffff;
    --rtd-surface-bg: #f8f9fa;
    --rtd-border-color: #dadce0;
    --rtd-code-bg: #f8f9fa;
    --rtd-inline-code-bg: #f1f3f4;
    --rtd-inline-code-color: #1967d2;
    --rtd-note-bg: #e8f0fe;
    --rtd-note-border: #1a73e8;
    --rtd-code-keyword: #1a73e8;
    --rtd-code-string: #1e8e3e;
    --rtd-code-comment: #80868b;
    --rtd-code-number: #f9ab00;
    --rtd-code-function: #d93025;
    --rtd-code-type: #af38c4;
    --rtd-code-operator: #5f6368;
    --rtd-code-builtin: #1a73e8;
    --rtd-font: "Google Sans", "Inter", "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, system-ui, sans-serif;
    --rtd-body-font: "Inter", "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, system-ui, sans-serif;
    --rtd-mono-font: "Roboto Mono", "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Noto Sans Mono CJK JP", monospace;
}

@page {
    size: A4;
    margin: 18mm 16mm;
}

* {
    box-sizing: border-box;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

html, body {
    font-family: var(--rtd-body-font);
    font-size: 16px;
    line-height: 1.68;
    color: var(--rtd-text-color);
    background-color: var(--rtd-surface-bg);
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

.main-container {
    max-width: 900px;
    margin: 2.5rem auto;
    background-color: var(--rtd-content-bg);
    border: 1px solid var(--rtd-border-color);
    border-radius: 12px;
    padding: 3rem 3.5rem;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.05);
}

.doc-topbar {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-top: -0.75rem;
    margin-bottom: 0.75rem;
}

.lang-switcher {
    position: relative;
    flex-shrink: 0;
}

.lang-dropdown {
    position: relative;
}

.lang-dropdown-btn {
    list-style: none;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.38rem 0.7rem;
    border: 1px solid var(--rtd-border-color);
    border-radius: 8px;
    background-color: var(--rtd-surface-bg);
    color: var(--rtd-text-color);
    font-family: var(--rtd-font);
    font-size: 0.85rem;
    font-weight: 500;
    line-height: 1.2;
    cursor: pointer;
    user-select: none;
    transition: border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.lang-dropdown-btn::-webkit-details-marker {
    display: none;
}

.lang-dropdown-btn:hover,
.lang-dropdown[open] .lang-dropdown-btn {
    border-color: var(--rtd-brand-color);
    color: var(--rtd-heading-color);
}

.lang-globe-icon,
.lang-caret-icon,
.lang-check-icon {
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    flex-shrink: 0;
}

.lang-caret-icon {
    width: 14px;
    height: 14px;
    color: var(--rtd-muted-color);
    transition: transform 0.15s ease;
}

.lang-dropdown[open] .lang-caret-icon {
    transform: rotate(180deg);
}

.lang-dropdown-menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 160px;
    background-color: var(--rtd-content-bg);
    border: 1px solid var(--rtd-border-color);
    border-radius: 10px;
    box-shadow: 0 10px 25px rgba(15, 23, 42, 0.12);
    padding: 0.35rem;
    z-index: 950;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.lang-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
    padding: 0.45rem 0.7rem;
    border-radius: 6px;
    font-family: var(--rtd-font);
    font-size: 0.86rem;
    color: var(--rtd-text-color);
    text-decoration: none;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.lang-option:hover {
    background-color: var(--rtd-surface-bg);
    color: var(--rtd-heading-color);
    text-decoration: none;
}

.lang-option.active {
    background-color: var(--rtd-note-bg);
    color: var(--rtd-brand-color);
    font-weight: 600;
}

.lang-check-icon {
    width: 14px;
    height: 14px;
    color: var(--rtd-brand-color);
}

@media (max-width: 768px) {
    .main-container {
        margin: 1rem;
        padding: 1.5rem;
        border-radius: 8px;
    }
}

.sidebar,
.top-bar,
.footer,
hr {
    display: none !important;
}

@media print {
    html, body {
        font-size: 14.5px;
        background-color: #ffffff;
    }

    .doc-topbar,
    .lang-switcher {
        display: none !important;
    }

    .doc-layout,
    .content-wrapper,
    .main-container,
    .main-content {
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        background-color: transparent !important;
        overflow: visible !important;
    }

    code {
        font-size: 0.84em;
        padding: 0.12rem 0.32rem;
        overflow-wrap: break-word;
        word-break: break-word;
    }

    pre {
        padding: 0.85rem 1rem;
    }

    pre, pre code {
        white-space: pre-wrap !important;
        word-wrap: break-word !important;
        word-break: break-word !important;
        overflow: visible !important;
        overflow-x: visible !important;
        font-size: 0.75rem !important;
        line-height: 1.45 !important;
    }

    table {
        width: 100%;
        max-width: 100%;
        font-size: 0.76rem;
        line-height: 1.45;
        overflow: visible;
        break-inside: auto;
        page-break-inside: auto;
    }

    thead {
        display: table-header-group;
    }

    tr {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    th, td {
        padding: 0.42rem 0.55rem;
        vertical-align: top;
        overflow-wrap: break-word;
    }

    th code, td code {
        font-size: 0.82em;
        padding: 0.08rem 0.22rem;
        overflow-wrap: normal;
        word-break: normal;
    }
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--rtd-font);
    color: var(--rtd-heading-color);
    margin-top: 1.6rem;
    margin-bottom: 0.75rem;
    font-weight: 500;
    letter-spacing: -0.015em;
    line-height: 1.3;
    break-inside: avoid;
    page-break-inside: avoid;
    break-after: avoid;
    page-break-after: avoid;
}

h1 {
    font-size: 2.1rem;
    font-weight: 500;
    margin-top: 0;
    padding-bottom: 0.4rem;
    border-bottom: none;
    color: #1a73e8;
}

h2 {
    font-size: 1.4rem;
    font-weight: 500;
    padding-bottom: 0.2rem;
    border-bottom: none;
}

h3 {
    font-size: 1.15rem;
    font-weight: 500;
}

p {
    margin-top: 0;
    margin-bottom: 1rem;
}

a {
    color: var(--rtd-brand-color);
    text-decoration: none;
    font-weight: 500;
}

code {
    font-family: var(--rtd-mono-font);
    font-size: 0.86em;
    background-color: var(--rtd-inline-code-bg);
    color: var(--rtd-inline-code-color);
    padding: 0.14rem 0.36rem;
    border-radius: 4px;
    border: none;
    word-break: break-word;
}

pre {
    background-color: var(--rtd-code-bg);
    border: 1px solid var(--rtd-border-color);
    border-radius: 8px;
    padding: 0.95rem 1.15rem;
    font-size: 0.82em;
    line-height: 1.55;
    margin: 1.1rem 0;
    white-space: pre-wrap !important;
    word-wrap: break-word !important;
    word-break: break-word !important;
    overflow: visible !important;
    overflow-x: visible !important;
    break-inside: avoid;
    page-break-inside: avoid;
}

pre code {
    background-color: transparent;
    color: inherit;
    padding: 0;
    border: none;
    white-space: pre-wrap !important;
    word-wrap: break-word !important;
    word-break: break-word !important;
}

/* Pygments syntax highlighting tokens */
pre code .k, pre code .kc, pre code .kd, pre code .kn, pre code .kp, pre code .kr, pre code .kt { color: var(--rtd-code-keyword); font-weight: 600; }
pre code .s, pre code .sa, pre code .sb, pre code .sc, pre code .dl, pre code .sd, pre code .s2, pre code .se, pre code .sh, pre code .si, pre code .sx, pre code .sr, pre code .s1, pre code .ss { color: var(--rtd-code-string); }
pre code .c, pre code .ch, pre code .cm, pre code .cp, pre code .cpf, pre code .c1, pre code .cs { color: var(--rtd-code-comment); font-style: italic; }
pre code .m, pre code .mb, pre code .mf, pre code .mh, pre code .mi, pre code .mo, pre code .il { color: var(--rtd-code-number); }
pre code .nf, pre code .fm { color: var(--rtd-code-function); }
pre code .nc, pre code .ne, pre code .nn, pre code .nt { color: var(--rtd-code-type); font-weight: 600; }
pre code .na, pre code .nd, pre code .py { color: var(--rtd-code-type); font-weight: 600; }
pre code .nb, pre code .bp { color: var(--rtd-code-builtin); }
pre code .o, pre code .ow { color: var(--rtd-code-operator); }
pre code .err { color: #ef4444; }

blockquote {
    margin: 1.25rem 0;
    padding: 0.85rem 1.2rem;
    background-color: var(--rtd-note-bg);
    border-left: 4px solid var(--rtd-note-border);
    color: var(--rtd-text-color);
    border-radius: 0 8px 8px 0;
    break-inside: avoid;
    page-break-inside: avoid;
}

blockquote p {
    margin: 0;
}

table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin: 1.25rem 0;
    font-size: 0.88rem;
    border: 1px solid var(--rtd-border-color);
    border-radius: 8px;
    overflow: hidden;
    break-inside: auto;
    page-break-inside: auto;
}

th, td {
    border-bottom: 1px solid var(--rtd-border-color);
    padding: 0.65rem 0.9rem;
    text-align: left;
    word-break: break-word;
}

tr:last-child td {
    border-bottom: none;
}

th {
    font-family: var(--rtd-font);
    background-color: var(--rtd-surface-bg);
    color: var(--rtd-heading-color);
    font-weight: 600;
}

.drawlib-image {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 1.5rem 0;
    padding: 1rem;
    background-color: #ffffff;
    border: 1px solid var(--rtd-border-color);
    border-radius: 10px;
    box-shadow: none;
    break-inside: avoid;
    page-break-inside: avoid;
}

.drawlib-image img {
    max-width: 100%;
    max-height: 360px;
    width: auto;
    height: auto;
    border-radius: 6px;
}

.drawlib-caption {
    margin-top: 0.65rem;
    font-family: var(--rtd-font);
    font-size: 0.82rem;
    color: var(--rtd-muted-color);
    text-align: center;
}

.doc-chapter + .doc-chapter,
.doc-toc + .doc-chapter,
.doc-chapter + .doc-toc {
    margin-top: 3rem;
    padding-top: 2.5rem;
    border-top: 1px solid var(--rtd-border-color);
}

.doc-toc,
.pdf-toc {
    padding: 1rem 0;
}

.doc-toc h2,
.pdf-toc h2 {
    font-size: 1.75rem;
    color: #1a73e8;
    margin-bottom: 1.25rem;
}

.doc-toc ul,
.pdf-toc ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.doc-toc li,
.pdf-toc li {
    padding: 0.55rem 0;
    border-bottom: 1px dashed #e8eaed;
    font-size: 1.02rem;
}

.doc-toc li:last-child,
.pdf-toc li:last-child {
    border-bottom: none;
}

.drawlib-code-details {
    display: none !important;
}