/*
 * Symbolic Language Documentation
 * Professional stylesheet — clean, minimal, industry-standard
 */

/* ── Typography ─────────────────────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
    --color-primary:      #1e3a5f;
    --color-accent:       #2563eb;
    --color-accent-hover: #1d4ed8;
    --color-text:         #1a202c;
    --color-text-muted:   #4a5568;
    --color-border:       #e2e8f0;
    --color-bg-subtle:    #f8fafc;
    --color-bg-code:      #0f172a;
    --color-bg-inline:    #f1f5f9;
    --color-success:      #166534;
    --color-warning:      #92400e;
    --color-info:         #1e40af;
    --color-note-bg:      #eff6ff;
    --color-tip-bg:       #f0fdf4;
    --color-warning-bg:   #fffbeb;
    --color-caution-bg:   #fef2f2;
    --radius-sm:          3px;
    --radius-md:          6px;
    --font-mono:          'JetBrains Mono', 'Fira Code', 'Cascadia Code', monospace;
}

body, .wy-body-for-nav, .rst-content {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: 15px;
    line-height: 1.7;
    color: var(--color-text);
}

/* ── Headings ────────────────────────────────────────────────────────────── */

.rst-content h1,
.rst-content h2,
.rst-content h3,
.rst-content h4 {
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    color: var(--color-primary);
    letter-spacing: -0.01em;
}

.rst-content h1 {
    font-size: 2rem;
    border-bottom: 2px solid var(--color-border);
    padding-bottom: 0.5rem;
    margin-bottom: 1.5rem;
}

.rst-content h2 {
    font-size: 1.5rem;
    margin-top: 2.5rem;
    border-bottom: 1px solid var(--color-border);
    padding-bottom: 0.35rem;
}

.rst-content h3 {
    font-size: 1.15rem;
    margin-top: 2rem;
}

.rst-content h4 {
    font-size: 1rem;
    margin-top: 1.5rem;
    color: var(--color-text-muted);
}

/* ── Code blocks ─────────────────────────────────────────────────────────── */

.rst-content .highlight {
    background: var(--color-bg-code);
    border: 1px solid #1e293b;
    border-radius: var(--radius-md);
    margin: 1.25rem 0;
    overflow: hidden;
}

.rst-content .highlight pre {
    background: transparent;
    color: #e2e8f0;
    font-family: var(--font-mono);
    font-size: 0.85rem;
    line-height: 1.6;
    padding: 1.1rem 1.25rem;
    margin: 0;
    overflow-x: auto;
}

/* Inline code */
.rst-content code.literal,
.rst-content tt.literal {
    background: var(--color-bg-inline);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    color: #be185d;
    font-family: var(--font-mono);
    font-size: 0.825rem;
    padding: 0.1em 0.4em;
}

/* Syntax highlighting — Pygments tokens */
.highlight .k,  .highlight .kd, .highlight .kn { color: #93c5fd; font-weight: 500; }  /* keywords */
.highlight .n,  .highlight .na, .highlight .nf { color: #7dd3fc; }                     /* names */
.highlight .nb  { color: #67e8f9; }                                                     /* builtins */
.highlight .s,  .highlight .s1, .highlight .s2 { color: #86efac; }                     /* strings */
.highlight .m,  .highlight .mi, .highlight .mf { color: #fde68a; }                     /* numbers */
.highlight .o,  .highlight .op { color: #f9a8d4; }                                     /* operators */
.highlight .p   { color: #cbd5e1; }                                                     /* punctuation */
.highlight .c,  .highlight .c1, .highlight .cm { color: #64748b; font-style: italic; } /* comments */
.highlight .nc  { color: #c4b5fd; font-weight: 500; }                                  /* class names */

/* ── Language-block labels ───────────────────────────────────────────────── */

.highlight-symbolic { position: relative; }

.highlight-symbolic::before {
    content: "symbolic";
    position: absolute;
    top: 0.5rem;
    right: 0.75rem;
    font-family: var(--font-mono);
    font-size: 0.7rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    pointer-events: none;
}

.highlight-bash::before   { content: "shell"; }
.highlight-python::before { content: "python"; }
.highlight-text::before   { content: "output"; }

.highlight-bash::before,
.highlight-python::before,
.highlight-text::before {
    position: absolute;
    top: 0.5rem;
    right: 0.75rem;
    font-family: var(--font-mono);
    font-size: 0.7rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    pointer-events: none;
}

/* ── Admonitions ─────────────────────────────────────────────────────────── */

.rst-content .admonition {
    border-radius: var(--radius-md);
    border: none;
    border-left: 4px solid;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    margin: 1.5rem 0;
    padding: 0;
    overflow: hidden;
}

.rst-content .admonition-title {
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 0.6rem 1rem;
    margin: 0;
}

.rst-content .admonition > *:not(.admonition-title) {
    padding: 0.75rem 1rem;
    margin: 0;
}

.rst-content .admonition > p:last-child { padding-bottom: 0.9rem; }

.rst-content .note,
.rst-content .admonition.note {
    background: var(--color-note-bg);
    border-color: var(--color-accent);
}
.rst-content .note .admonition-title { background: #dbeafe; color: var(--color-info); }

.rst-content .tip,
.rst-content .admonition.tip {
    background: var(--color-tip-bg);
    border-color: #16a34a;
}
.rst-content .tip .admonition-title { background: #dcfce7; color: var(--color-success); }

.rst-content .warning,
.rst-content .admonition.warning {
    background: var(--color-warning-bg);
    border-color: #d97706;
}
.rst-content .warning .admonition-title { background: #fef3c7; color: var(--color-warning); }

.rst-content .caution,
.rst-content .admonition.caution,
.rst-content .danger,
.rst-content .admonition.danger {
    background: var(--color-caution-bg);
    border-color: #dc2626;
}
.rst-content .danger .admonition-title,
.rst-content .caution .admonition-title { background: #fee2e2; color: #991b1b; }

.rst-content .seealso,
.rst-content .admonition.seealso {
    background: #faf5ff;
    border-color: #7c3aed;
}
.rst-content .seealso .admonition-title { background: #ede9fe; color: #5b21b6; }

/* ── Tables ──────────────────────────────────────────────────────────────── */

.rst-content table.docutils {
    border-collapse: collapse;
    border-radius: var(--radius-md);
    overflow: hidden;
    margin: 1.5rem 0;
    width: 100%;
    font-size: 0.9rem;
    border: 1px solid var(--color-border);
}

.rst-content table.docutils thead tr {
    background: var(--color-primary);
}

.rst-content table.docutils th {
    color: #fff;
    font-weight: 600;
    font-size: 0.8rem;
    letter-spacing: 0.04em;
    padding: 0.7rem 1rem;
    border: none;
    text-transform: uppercase;
}

.rst-content table.docutils td {
    padding: 0.65rem 1rem;
    border-bottom: 1px solid var(--color-border);
    vertical-align: top;
}

.rst-content table.docutils tr:nth-child(even) td { background: var(--color-bg-subtle); }
.rst-content table.docutils tr:last-child td      { border-bottom: none; }
.rst-content table.docutils tr:hover td           { background: #eff6ff; }

/* ── Navigation sidebar ──────────────────────────────────────────────────── */

.wy-nav-side {
    background: #0f1923;
}

.wy-nav-side .wy-side-nav-search {
    background: var(--color-primary);
    border-bottom: 1px solid rgba(255,255,255,0.08);
}

.wy-nav-side .wy-side-nav-search input[type=text] {
    border-radius: var(--radius-sm);
    border: 1px solid rgba(255,255,255,0.15);
    background: rgba(255,255,255,0.07);
    color: #e2e8f0;
}

.wy-menu-vertical a {
    color: #94a3b8;
    font-size: 0.875rem;
}

.wy-menu-vertical a:hover,
.wy-menu-vertical li.current > a {
    background: rgba(37, 99, 235, 0.15);
    color: #93c5fd;
}

.wy-menu-vertical li.current > a {
    border-right: 3px solid var(--color-accent);
    font-weight: 500;
}

.wy-menu-vertical header,
.wy-menu-vertical p.caption {
    color: #64748b;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 1rem 1rem 0.3rem;
}

/* ── Breadcrumbs & top bar ───────────────────────────────────────────────── */

.wy-nav-top {
    background: var(--color-primary);
}

.rst-content .breadcrumb {
    font-size: 0.8rem;
    color: var(--color-text-muted);
}

/* ── Links ───────────────────────────────────────────────────────────────── */

.rst-content a {
    color: var(--color-accent);
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.15s ease, color 0.15s ease;
}

.rst-content a:hover {
    color: var(--color-accent-hover);
    border-bottom-color: var(--color-accent-hover);
}

/* ── Definition lists ────────────────────────────────────────────────────── */

.rst-content dl.field-list dt,
.rst-content dl:not(.docutils) dt {
    background: var(--color-bg-subtle);
    border-left: 3px solid var(--color-accent);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    color: var(--color-primary);
    font-family: var(--font-mono);
    font-size: 0.875rem;
    font-weight: 500;
    padding: 0.35rem 0.75rem;
    margin-bottom: 0.5rem;
}

/* ── Horizontal rules ────────────────────────────────────────────────────── */

.rst-content hr {
    border: none;
    border-top: 1px solid var(--color-border);
    margin: 2.5rem 0;
}

/* ── Version badge ───────────────────────────────────────────────────────── */

.version-badge {
    display: inline-flex;
    align-items: center;
    background: var(--color-primary);
    color: #93c5fd;
    border-radius: 3px;
    font-family: var(--font-mono);
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.15em 0.5em;
    letter-spacing: 0.03em;
}

/* ── Status indicators ───────────────────────────────────────────────────── */

.status-stable     { color: #166534; font-weight: 600; }
.status-beta       { color: #92400e; font-weight: 600; }
.status-experimental { color: #991b1b; font-weight: 600; }

/* ── Copy button ─────────────────────────────────────────────────────────── */

button.copybtn {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: var(--radius-sm);
    color: #94a3b8;
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
    opacity: 0;
    transition: opacity 0.2s ease, background 0.15s ease;
}

.highlight:hover button.copybtn { opacity: 1; }
button.copybtn:hover { background: rgba(255,255,255,0.14); color: #e2e8f0; }

/* ── Responsive ──────────────────────────────────────────────────────────── */

@media (max-width: 768px) {
    .rst-content h1 { font-size: 1.6rem; }
    .rst-content h2 { font-size: 1.25rem; }
    .rst-content .highlight pre { font-size: 0.78rem; padding: 0.9rem; }
}

/* ── Dark mode support ───────────────────────────────────────────────────── */

@media (prefers-color-scheme: dark) {
    :root {
        --color-text:      #e2e8f0;
        --color-text-muted: #94a3b8;
        --color-border:    #1e293b;
        --color-bg-subtle: #0f172a;
        --color-bg-inline: #1e293b;
    }
}

/* ── Print ───────────────────────────────────────────────────────────────── */

@media print {
    .wy-nav-side, .wy-nav-top { display: none; }
    .wy-nav-content-wrap      { margin-left: 0; }
    .rst-content .highlight   { border: 1px solid #ccc; }
    button.copybtn            { display: none; }
}