socktop-webterm/docs/theme/catppuccin.css

/* Import Inter font from Google Fonts */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");

/* https://highlightjs.readthedocs.io/en/latest/css-classes-reference.html */
.latte.hljs {
    color: #4c4f69;
    background: #eff1f5;
}
.latte .hljs-keyword {
    color: #8839ef;
}
.latte .hljs-built_in {
    color: #d20f39;
}
.latte .hljs-type {
    color: #df8e1d;
}
.latte .hljs-literal {
    color: #fe640b;
}
.latte .hljs-number {
    color: #fe640b;
}
.latte .hljs-operator {
    color: #04a5e5;
}
.latte .hljs-punctuation {
    color: #5c5f77;
}
.latte .hljs-property {
    color: #179299;
}
.latte .hljs-regexp {
    color: #ea76cb;
}
.latte .hljs-string {
    color: #40a02b;
}
.latte .hljs-char.escape_ {
    color: #40a02b;
}
.latte .hljs-subst {
    color: #6c6f85;
}
.latte .hljs-symbol {
    color: #dd7878;
}
.latte .hljs-variable {
    color: #8839ef;
}
.latte .hljs-variable.language_ {
    color: #8839ef;
}
.latte .hljs-variable.constant_ {
    color: #fe640b;
}
.latte .hljs-title {
    color: #1e66f5;
}
.latte .hljs-title.class_ {
    color: #df8e1d;
}
.latte .hljs-title.function_ {
    color: #1e66f5;
}
.latte .hljs-params {
    color: #4c4f69;
}
.latte .hljs-comment {
    color: #7c7f93;
}
.latte .hljs-doctag {
    color: #d20f39;
}
.latte .hljs-meta {
    color: #fe640b;
}
.latte .hljs-section {
    color: #1e66f5;
}
.latte .hljs-tag {
    color: #179299;
}
.latte .hljs-name {
    color: #8839ef;
}
.latte .hljs-attr {
    color: #1e66f5;
}
.latte .hljs-attribute {
    color: #40a02b;
}
.latte .hljs-bullet {
    color: #179299;
}
.latte .hljs-code {
    color: #40a02b;
}
.latte .hljs-emphasis {
    color: #d20f39;
    font-style: italic;
}
.latte .hljs-strong {
    color: #d20f39;
    font-weight: bold;
}
.latte .hljs-formula {
    color: #179299;
}
.latte .hljs-link {
    color: #209fb5;
    font-style: italic;
}
.latte .hljs-quote {
    color: #40a02b;
    font-style: italic;
}
.latte .hljs-selector-tag {
    color: #df8e1d;
}
.latte .hljs-selector-id {
    color: #1e66f5;
}
.latte .hljs-selector-class {
    color: #179299;
}
.latte .hljs-selector-attr {
    color: #8839ef;
}
.latte .hljs-selector-pseudo {
    color: #179299;
}
.latte .hljs-template-tag {
    color: #dd7878;
}
.latte .hljs-template-variable {
    color: #dd7878;
}
.latte .hljs-addition {
    color: #40a02b;
    background: rgba(64, 160, 43, 0.15);
}
.latte .hljs-deletion {
    color: #d20f39;
    background: rgba(210, 15, 57, 0.15);
}
.latte :is(h1, h2, h3, h4, h5, h6) a code {
    color: #4c4f69;
}
.latte a code {
    color: #1e66f5;
}
.latte code {
    color: #4c4f69;
    background: #e6e9ef;
}
.latte blockquote blockquote {
    border-top: 0.1em solid #acb0be;
    border-bottom: 0.1em solid #acb0be;
}
.latte hr {
    border-color: #acb0be;
    border-style: solid;
}
.latte del {
    color: #7c7f93;
}
.latte .ace_gutter {
    color: #8c8fa1;
    background: #e6e9ef;
}
.latte .ace_gutter-active-line.ace_gutter-cell {
    color: #ea76cb;
    background: #e6e9ef;
}
.latte .tooltiptext {
    background: #e6e9ef;
    color: #4c4f69;
}

.frappe.hljs {
    color: #c6d0f5;
    background: #303446;
}
.frappe .hljs-keyword {
    color: #ca9ee6;
}
.frappe .hljs-built_in {
    color: #e78284;
}
.frappe .hljs-type {
    color: #e5c890;
}
.frappe .hljs-literal {
    color: #ef9f76;
}
.frappe .hljs-number {
    color: #ef9f76;
}
.frappe .hljs-operator {
    color: #99d1db;
}
.frappe .hljs-punctuation {
    color: #b5bfe2;
}
.frappe .hljs-property {
    color: #81c8be;
}
.frappe .hljs-regexp {
    color: #f4b8e4;
}
.frappe .hljs-string {
    color: #a6d189;
}
.frappe .hljs-char.escape_ {
    color: #a6d189;
}
.frappe .hljs-subst {
    color: #a5adce;
}
.frappe .hljs-symbol {
    color: #eebebe;
}
.frappe .hljs-variable {
    color: #ca9ee6;
}
.frappe .hljs-variable.language_ {
    color: #ca9ee6;
}
.frappe .hljs-variable.constant_ {
    color: #ef9f76;
}
.frappe .hljs-title {
    color: #8caaee;
}
.frappe .hljs-title.class_ {
    color: #e5c890;
}
.frappe .hljs-title.function_ {
    color: #8caaee;
}
.frappe .hljs-params {
    color: #c6d0f5;
}
.frappe .hljs-comment {
    color: #949cbb;
}
.frappe .hljs-doctag {
    color: #e78284;
}
.frappe .hljs-meta {
    color: #ef9f76;
}
.frappe .hljs-section {
    color: #8caaee;
}
.frappe .hljs-tag {
    color: #81c8be;
}
.frappe .hljs-name {
    color: #ca9ee6;
}
.frappe .hljs-attr {
    color: #8caaee;
}
.frappe .hljs-attribute {
    color: #a6d189;
}
.frappe .hljs-bullet {
    color: #81c8be;
}
.frappe .hljs-code {
    color: #a6d189;
}
.frappe .hljs-emphasis {
    color: #e78284;
    font-style: italic;
}
.frappe .hljs-strong {
    color: #e78284;
    font-weight: bold;
}
.frappe .hljs-formula {
    color: #81c8be;
}
.frappe .hljs-link {
    color: #85c1dc;
    font-style: italic;
}
.frappe .hljs-quote {
    color: #a6d189;
    font-style: italic;
}
.frappe .hljs-selector-tag {
    color: #e5c890;
}
.frappe .hljs-selector-id {
    color: #8caaee;
}
.frappe .hljs-selector-class {
    color: #81c8be;
}
.frappe .hljs-selector-attr {
    color: #ca9ee6;
}
.frappe .hljs-selector-pseudo {
    color: #81c8be;
}
.frappe .hljs-template-tag {
    color: #eebebe;
}
.frappe .hljs-template-variable {
    color: #eebebe;
}
.frappe .hljs-addition {
    color: #a6d189;
    background: rgba(166, 209, 137, 0.15);
}
.frappe .hljs-deletion {
    color: #e78284;
    background: rgba(231, 130, 132, 0.15);
}
.frappe :is(h1, h2, h3, h4, h5, h6) a code {
    color: #c6d0f5;
}
.frappe a code {
    color: #8caaee;
}
.frappe code {
    color: #c6d0f5;
    background: #292c3c;
}
.frappe blockquote blockquote {
    border-top: 0.1em solid #626880;
    border-bottom: 0.1em solid #626880;
}
.frappe hr {
    border-color: #626880;
    border-style: solid;
}
.frappe del {
    color: #949cbb;
}
.frappe .ace_gutter {
    color: #838ba7;
    background: #292c3c;
}
.frappe .ace_gutter-active-line.ace_gutter-cell {
    color: #f4b8e4;
    background: #292c3c;
}
.frappe .tooltiptext {
    background: #292c3c;
    color: #c6d0f5;
}

.macchiato.hljs {
    color: #cad3f5;
    background: #24273a;
}
.macchiato .hljs-keyword {
    color: #c6a0f6;
}
.macchiato .hljs-built_in {
    color: #ed8796;
}
.macchiato .hljs-type {
    color: #eed49f;
}
.macchiato .hljs-literal {
    color: #f5a97f;
}
.macchiato .hljs-number {
    color: #f5a97f;
}
.macchiato .hljs-operator {
    color: #91d7e3;
}
.macchiato .hljs-punctuation {
    color: #b8c0e0;
}
.macchiato .hljs-property {
    color: #8bd5ca;
}
.macchiato .hljs-regexp {
    color: #f5bde6;
}
.macchiato .hljs-string {
    color: #a6da95;
}
.macchiato .hljs-char.escape_ {
    color: #a6da95;
}
.macchiato .hljs-subst {
    color: #a5adcb;
}
.macchiato .hljs-symbol {
    color: #f0c6c6;
}
.macchiato .hljs-variable {
    color: #c6a0f6;
}
.macchiato .hljs-variable.language_ {
    color: #c6a0f6;
}
.macchiato .hljs-variable.constant_ {
    color: #f5a97f;
}
.macchiato .hljs-title {
    color: #8aadf4;
}
.macchiato .hljs-title.class_ {
    color: #eed49f;
}
.macchiato .hljs-title.function_ {
    color: #8aadf4;
}
.macchiato .hljs-params {
    color: #cad3f5;
}
.macchiato .hljs-comment {
    color: #939ab7;
}
.macchiato .hljs-doctag {
    color: #ed8796;
}
.macchiato .hljs-meta {
    color: #f5a97f;
}
.macchiato .hljs-section {
    color: #8aadf4;
}
.macchiato .hljs-tag {
    color: #8bd5ca;
}
.macchiato .hljs-name {
    color: #c6a0f6;
}
.macchiato .hljs-attr {
    color: #8aadf4;
}
.macchiato .hljs-attribute {
    color: #a6da95;
}
.macchiato .hljs-bullet {
    color: #8bd5ca;
}
.macchiato .hljs-code {
    color: #a6da95;
}
.macchiato .hljs-emphasis {
    color: #ed8796;
    font-style: italic;
}
.macchiato .hljs-strong {
    color: #ed8796;
    font-weight: bold;
}
.macchiato .hljs-formula {
    color: #8bd5ca;
}
.macchiato .hljs-link {
    color: #7dc4e4;
    font-style: italic;
}
.macchiato .hljs-quote {
    color: #a6da95;
    font-style: italic;
}
.macchiato .hljs-selector-tag {
    color: #eed49f;
}
.macchiato .hljs-selector-id {
    color: #8aadf4;
}
.macchiato .hljs-selector-class {
    color: #8bd5ca;
}
.macchiato .hljs-selector-attr {
    color: #c6a0f6;
}
.macchiato .hljs-selector-pseudo {
    color: #8bd5ca;
}
.macchiato .hljs-template-tag {
    color: #f0c6c6;
}
.macchiato .hljs-template-variable {
    color: #f0c6c6;
}
.macchiato .hljs-addition {
    color: #a6da95;
    background: rgba(166, 218, 149, 0.15);
}
.macchiato .hljs-deletion {
    color: #ed8796;
    background: rgba(237, 135, 150, 0.15);
}
.macchiato :is(h1, h2, h3, h4, h5, h6) a code {
    color: #cad3f5;
}
.macchiato a code {
    color: #8aadf4;
}
.macchiato code {
    color: #cad3f5;
    background: #1e2030;
}
.macchiato blockquote blockquote {
    border-top: 0.1em solid #5b6078;
    border-bottom: 0.1em solid #5b6078;
}
.macchiato hr {
    border-color: #5b6078;
    border-style: solid;
}
.macchiato del {
    color: #939ab7;
}
.macchiato .ace_gutter {
    color: #8087a2;
    background: #1e2030;
}
.macchiato .ace_gutter-active-line.ace_gutter-cell {
    color: #f5bde6;
    background: #1e2030;
}
.macchiato .tooltiptext {
    background: #1e2030;
    color: #cad3f5;
}

.mocha.hljs {
    color: #cdd6f4;
    background: #1e1e2e;
}
.mocha .hljs-keyword {
    color: #cba6f7;
}
.mocha .hljs-built_in {
    color: #f38ba8;
}
.mocha .hljs-type {
    color: #f9e2af;
}
.mocha .hljs-literal {
    color: #fab387;
}
.mocha .hljs-number {
    color: #fab387;
}
.mocha .hljs-operator {
    color: #89dceb;
}
.mocha .hljs-punctuation {
    color: #bac2de;
}
.mocha .hljs-property {
    color: #94e2d5;
}
.mocha .hljs-regexp {
    color: #f5c2e7;
}
.mocha .hljs-string {
    color: #a6e3a1;
}
.mocha .hljs-char.escape_ {
    color: #a6e3a1;
}
.mocha .hljs-subst {
    color: #a6adc8;
}
.mocha .hljs-symbol {
    color: #f2cdcd;
}
.mocha .hljs-variable {
    color: #cba6f7;
}
.mocha .hljs-variable.language_ {
    color: #cba6f7;
}
.mocha .hljs-variable.constant_ {
    color: #fab387;
}
.mocha .hljs-title {
    color: #89b4fa;
}
.mocha .hljs-title.class_ {
    color: #f9e2af;
}
.mocha .hljs-title.function_ {
    color: #89b4fa;
}
.mocha .hljs-params {
    color: #cdd6f4;
}
.mocha .hljs-comment {
    color: #9399b2;
}
.mocha .hljs-doctag {
    color: #f38ba8;
}
.mocha .hljs-meta {
    color: #fab387;
}
.mocha .hljs-section {
    color: #89b4fa;
}
.mocha .hljs-tag {
    color: #94e2d5;
}
.mocha .hljs-name {
    color: #cba6f7;
}
.mocha .hljs-attr {
    color: #89b4fa;
}
.mocha .hljs-attribute {
    color: #a6e3a1;
}
.mocha .hljs-bullet {
    color: #94e2d5;
}
.mocha .hljs-code {
    color: #a6e3a1;
}
.mocha .hljs-emphasis {
    color: #f38ba8;
    font-style: italic;
}
.mocha .hljs-strong {
    color: #f38ba8;
    font-weight: bold;
}
.mocha .hljs-formula {
    color: #94e2d5;
}
.mocha .hljs-link {
    color: #74c7ec;
    font-style: italic;
}
.mocha .hljs-quote {
    color: #a6e3a1;
    font-style: italic;
}
.mocha .hljs-selector-tag {
    color: #f9e2af;
}
.mocha .hljs-selector-id {
    color: #89b4fa;
}
.mocha .hljs-selector-class {
    color: #94e2d5;
}
.mocha .hljs-selector-attr {
    color: #cba6f7;
}
.mocha .hljs-selector-pseudo {
    color: #94e2d5;
}
.mocha .hljs-template-tag {
    color: #f2cdcd;
}
.mocha .hljs-template-variable {
    color: #f2cdcd;
}
.mocha .hljs-addition {
    color: #a6e3a1;
    background: rgba(166, 227, 161, 0.15);
}
.mocha .hljs-deletion {
    color: #f38ba8;
    background: rgba(243, 139, 168, 0.15);
}
.mocha :is(h1, h2, h3, h4, h5, h6) a code {
    color: #cdd6f4;
}
.mocha a code {
    color: #89b4fa;
}
.mocha code {
    color: #cdd6f4;
    background: #181825;
}
.mocha blockquote blockquote {
    border-top: 0.1em solid #585b70;
    border-bottom: 0.1em solid #585b70;
}
.mocha hr {
    border-color: #585b70;
    border-style: solid;
}
.mocha del {
    color: #9399b2;
}
.mocha .ace_gutter {
    color: #7f849c;
    background: #181825;
}
.mocha .ace_gutter-active-line.ace_gutter-cell {
    color: #f5c2e7;
    background: #181825;
}
.mocha .tooltiptext {
    background: #181825;
    color: #cdd6f4;
}

.latte {
    --bg: #eff1f5;
    --fg: #4c4f69;
    --sidebar-bg: #e6e9ef;
    --sidebar-fg: #4c4f69;
    --sidebar-non-existant: #9ca0b0;
    --sidebar-active: #1e66f5;
    --sidebar-spacer: #9ca0b0;
    --scrollbar: #9ca0b0;
    --icons: #9ca0b0;
    --icons-hover: #7c7f93;
    --links: #1e66f5;
    --inline-code-color: #4c4f69;
    --theme-popup-bg: #e6e9ef;
    --theme-popup-border: #9ca0b0;
    --theme-hover: #ccd0da;
    --quote-bg: #e6e9ef;
    --quote-border: #dce0e8;
    --table-border-color: #ccd0da;
    --table-header-bg: #e6e9ef;
    --table-alternate-bg: #e6e9ef;
    --searchbar-border-color: #ccd0da;
    --searchbar-bg: #e6e9ef;
    --searchbar-fg: #4c4f69;
    --searchbar-shadow-color: #dce0e8;
    --searchresults-header-fg: #4c4f69;
    --searchresults-border-color: #ccd0da;
    --searchresults-li-bg: #eff1f5;
    --search-mark-bg: #fe640b;
    --warning-border: #fe640b;
    --color-scheme: light;
    --copy-button-filter: brightness(0) saturate(100%) invert(47%) sepia(6%)
        saturate(1263%) hue-rotate(195deg) brightness(90%) contrast(81%);
    --copy-button-filter-hover: brightness(0) saturate(100%) invert(30%)
        sepia(80%) saturate(1850%) hue-rotate(209deg) brightness(94%)
        contrast(105%);
}

.frappe {
    --bg: #303446;
    --fg: #c6d0f5;
    --sidebar-bg: #292c3c;
    --sidebar-fg: #c6d0f5;
    --sidebar-non-existant: #737994;
    --sidebar-active: #8caaee;
    --sidebar-spacer: #737994;
    --scrollbar: #737994;
    --icons: #737994;
    --icons-hover: #949cbb;
    --links: #8caaee;
    --inline-code-color: #c6d0f5;
    --theme-popup-bg: #292c3c;
    --theme-popup-border: #737994;
    --theme-hover: #414559;
    --quote-bg: #292c3c;
    --quote-border: #232634;
    --table-border-color: #414559;
    --table-header-bg: #292c3c;
    --table-alternate-bg: #292c3c;
    --searchbar-border-color: #414559;
    --searchbar-bg: #292c3c;
    --searchbar-fg: #c6d0f5;
    --searchbar-shadow-color: #232634;
    --searchresults-header-fg: #c6d0f5;
    --searchresults-border-color: #414559;
    --searchresults-li-bg: #303446;
    --search-mark-bg: #ef9f76;
    --warning-border: #ef9f76;
    --color-scheme: dark;
    --copy-button-filter: brightness(0) saturate(100%) invert(82%) sepia(6%)
        saturate(1287%) hue-rotate(192deg) brightness(86%) contrast(85%);
    --copy-button-filter-hover: brightness(0) saturate(100%) invert(68%)
        sepia(16%) saturate(1070%) hue-rotate(185deg) brightness(96%)
        contrast(95%);
}

.macchiato {
    --bg: #24273a;
    --fg: #cad3f5;
    --sidebar-bg: #1e2030;
    --sidebar-fg: #cad3f5;
    --sidebar-non-existant: #6e738d;
    --sidebar-active: #8aadf4;
    --sidebar-spacer: #6e738d;
    --scrollbar: #6e738d;
    --icons: #6e738d;
    --icons-hover: #939ab7;
    --links: #8aadf4;
    --inline-code-color: #cad3f5;
    --theme-popup-bg: #1e2030;
    --theme-popup-border: #6e738d;
    --theme-hover: #363a4f;
    --quote-bg: #1e2030;
    --quote-border: #181926;
    --table-border-color: #363a4f;
    --table-header-bg: #1e2030;
    --table-alternate-bg: #1e2030;
    --searchbar-border-color: #363a4f;
    --searchbar-bg: #1e2030;
    --searchbar-fg: #cad3f5;
    --searchbar-shadow-color: #181926;
    --searchresults-header-fg: #cad3f5;
    --searchresults-border-color: #363a4f;
    --searchresults-li-bg: #24273a;
    --search-mark-bg: #f5a97f;
    --warning-border: #f5a97f;
    --color-scheme: dark;
    --copy-button-filter: brightness(0) saturate(100%) invert(75%) sepia(18%)
        saturate(361%) hue-rotate(190deg) brightness(91%) contrast(86%);
    --copy-button-filter-hover: brightness(0) saturate(100%) invert(67%)
        sepia(17%) saturate(1007%) hue-rotate(183deg) brightness(99%)
        contrast(94%);
}

.mocha {
    --bg: #1e1e2e;
    --fg: #cdd6f4;
    --sidebar-bg: #181825;
    --sidebar-fg: #cdd6f4;
    --sidebar-non-existant: #6c7086;
    --sidebar-active: #89b4fa;
    --sidebar-spacer: #6c7086;
    --scrollbar: #6c7086;
    --icons: #6c7086;
    --icons-hover: #9399b2;
    --links: #89b4fa;
    --inline-code-color: #cdd6f4;
    --theme-popup-bg: #181825;
    --theme-popup-border: #6c7086;
    --theme-hover: #313244;
    --quote-bg: #181825;
    --quote-border: #11111b;
    --table-border-color: #313244;
    --table-header-bg: #181825;
    --table-alternate-bg: #181825;
    --searchbar-border-color: #313244;
    --searchbar-bg: #181825;
    --searchbar-fg: #cdd6f4;
    --searchbar-shadow-color: #11111b;
    --searchresults-header-fg: #cdd6f4;
    --searchresults-border-color: #313244;
    --searchresults-li-bg: #1e1e2e;
    --search-mark-bg: #fab387;
    --warning-border: #fab387;
    --color-scheme: dark;
    --copy-button-filter: brightness(0) saturate(100%) invert(84%) sepia(9%)
        saturate(767%) hue-rotate(192deg) brightness(84%) contrast(84%);
    --copy-button-filter-hover: brightness(0) saturate(100%) invert(68%)
        sepia(18%) saturate(951%) hue-rotate(180deg) brightness(98%)
        contrast(100%);
}

/* Add Inter font family for entire documentation */
html,
body {
    font-family:
        "Inter",
        "SF Pro Display",
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        sans-serif;
}

/* Ensure links maintain proper cursor */
.sidebar a,
.content a,
button {
    cursor: pointer !important;
}

/* Ghostty-style sidebar improvements */
.sidebar {
    background-color: var(--sidebar-bg);
}

.sidebar .sidebar-scrollbox {
    padding: 0;
}

/* Logo container at top of sidebar menu */
.sidebar-logo {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 0;
    text-align: center;
    background-color: var(--sidebar-bg);
}

.sidebar-logo a {
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    width: 100%;
}

.sidebar-logo img {
    display: block;
    max-width: 80%;
    height: auto;
    max-height: 80px;
    cursor: pointer;
    margin: 0 auto;
}

.sidebar ol.chapter {
    padding: 0;
    margin: 0;
    list-style: none;
}

.sidebar ol.chapter > li.chapter-item {
    padding: 0;
    margin: 0;
}

/* All chapter link wrappers */
.sidebar ol.chapter > li.chapter-item > span.chapter-link-wrapper {
    display: block;
    padding: 10px 16px;
    margin: 4px 8px;
    transition: background-color 0.15s ease;
    position: relative;
    cursor: pointer;
}

.sidebar ol.chapter > li.chapter-item > span.chapter-link-wrapper > a {
    display: block;
    width: 100%;
    height: 100%;
}

.sidebar ol.chapter > li.chapter-item > span.chapter-link-wrapper:hover {
    background-color: var(--theme-hover);
}

.sidebar ol.chapter > li.chapter-item > span.chapter-link-wrapper > a {
    font-weight: 500;
    color: var(--sidebar-fg);
    text-decoration: none;
    padding: 0;
    margin: 0;
}

/* Active parent chapter styling - don't highlight parent, only child */
.sidebar ol.chapter > li.chapter-item.active > span.chapter-link-wrapper {
    background-color: transparent;
}

.sidebar ol.chapter > li.chapter-item.active > span.chapter-link-wrapper > a {
    color: var(--sidebar-fg);
    font-weight: 500;
}

/* Nested items (sub-pages under a section) - ol.section */
.sidebar ol.section {
    padding-left: 0;
    list-style: none;
    margin: 4px 0;
}

.sidebar ol.section > li.chapter-item {
    padding: 0;
}

.sidebar ol.section > li.chapter-item > span.chapter-link-wrapper {
    display: block;
    padding: 8px 16px 8px 32px;
    transition: background-color 0.15s ease;
    cursor: pointer;
}

.sidebar ol.section > li.chapter-item > span.chapter-link-wrapper > a {
    font-weight: 400;
    font-size: 0.95em;
    color: var(--sidebar-fg);
    opacity: 0.85;
    text-decoration: none;
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
}

.sidebar ol.section > li.chapter-item > span.chapter-link-wrapper:hover {
    background-color: var(--theme-hover);
}

.sidebar ol.section > li.chapter-item > span.chapter-link-wrapper:hover > a {
    opacity: 1;
}

.sidebar ol.section > li.chapter-item.active > span.chapter-link-wrapper {
    background-color: var(--sidebar-active) !important;
    border-radius: 6px;
}

.sidebar ol.section > li.chapter-item.active > span.chapter-link-wrapper > a {
    opacity: 1 !important;
    color: var(--bg) !important;
    font-weight: 600 !important;
}

/* Spacer styling */
.sidebar .spacer {
    height: 1px;
    background-color: var(--sidebar-spacer);
    margin: 8px 0;
    opacity: 0.3;
}

/* Chapter section (part) headers */
.sidebar .part-title {
    padding: 12px 16px 4px 16px;
    font-size: 0.75em;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--sidebar-fg);
    opacity: 0.6;
    list-style: none;
}

/* Chevron styling for collapsible sections */
.chapter-chevron {
    float: right;
    transition: transform 0.2s ease;
    display: inline-block;
    opacity: 0.6;
    font-size: 1.2em;
    line-height: 1;
    user-select: none;
}

.sidebar .chapter > li > a:hover .chapter-chevron {
    opacity: 1;
}

/* Smooth expand/collapse animation for nested sections */
.sidebar ol.chapter > li.chapter-item > ol.section {
    overflow: hidden;
    transition:
        max-height 0.3s ease,
        opacity 0.2s ease;
}

/* Collapsed state */
.sidebar ol.chapter > li.chapter-item.collapsed > ol.section {
    max-height: 0;
    opacity: 0;
    display: none;
}

/* Expanded state */
.sidebar ol.chapter > li.chapter-item.expanded > ol.section {
    max-height: 1000px;
    opacity: 1;
    display: block;
}

/* Hide default mdBook fold toggle */
.sidebar .chapter-fold-toggle {
    display: none !important;
}

/* Improve spacing between sections */
.sidebar ol.chapter > li.chapter-item {
    margin-bottom: 2px;
}

.sidebar ol.chapter > li.chapter-item:last-child {
    margin-bottom: 0;
}

/* Better visual hierarchy for part titles */
.sidebar ol.chapter > li.part-title {
    margin-top: 16px;
    margin-bottom: 8px;
}

.sidebar ol.chapter > li.part-title:first-child {
    margin-top: 8px;
}

/* Items with nested sections get special styling via .collapsed/.expanded classes */
.sidebar ol.chapter > li.chapter-item.collapsed > span.chapter-link-wrapper,
.sidebar ol.chapter > li.chapter-item.expanded > span.chapter-link-wrapper {
    border-radius: 6px;
}