/* Custom light grayscale theme for mdBook */

:root {
    /* Light grayscale color palette */
    --bg: #fafafa;
    --fg: #333333;

    /* Sidebar colors */
    --sidebar-bg: #f5f5f5;
    --sidebar-fg: #2c2c2c;
    --sidebar-non-existant: #999999;
    --sidebar-active: #000000;
    --sidebar-spacer: #e0e0e0;

    /* Code and inline elements */
    --inline-code-color: #424242;
    --inline-code-bg: #eeeeee;

    /* Links */
    --links: #546e7a;
    --links-hover: #263238;

    /* Search colors */
    --searchbar-border-color: #bdbdbd;
    --searchbar-bg: #ffffff;
    --searchbar-fg: #333333;
    --searchresults-header-fg: #424242;
    --searchresults-border-color: #e0e0e0;
    --searchresults-li-bg: #ffffff;
    --search-mark-bg: #e0e0e0;

    /* Table colors */
    --table-border-color: #e0e0e0;
    --table-header-bg: #f5f5f5;
    --table-alternate-bg: #fafafa;

    /* Scrollbar */
    --scrollbar: #bdbdbd;

    /* Quote/callout colors */
    --quote-bg: #f5f5f5;
    --quote-border: #9e9e9e;

    /* Warning colors */
    --warning-border: #9e9e9e;

    /* Menu bar */
    --menu-bar-bg: #f5f5f5;
    --menu-bar-border-color: #e0e0e0;
}

/* Override bright colors in code blocks */
.hljs {
    background: #f5f5f5 !important;
    color: #333333 !important;
}

/* Syntax highlighting - grayscale theme */
.hljs-keyword,
.hljs-selector-tag,
.hljs-literal,
.hljs-section,
.hljs-link {
    color: #424242;
    font-weight: 600;
}

.hljs-string,
.hljs-title,
.hljs-name,
.hljs-type,
.hljs-attribute,
.hljs-symbol,
.hljs-bullet,
.hljs-addition,
.hljs-variable,
.hljs-template-tag,
.hljs-template-variable {
    color: #616161;
}

.hljs-comment,
.hljs-quote,
.hljs-deletion,
.hljs-meta {
    color: #9e9e9e;
    font-style: italic;
}

.hljs-number,
.hljs-regexp,
.hljs-doctag {
    color: #757575;
}

/* Make chapter headings more subtle */
.chapter li a {
    color: #546e7a;
}

.chapter li a:hover {
    color: #263238;
    background: #f5f5f5;
}

.chapter li.active > a {
    color: #000000;
    font-weight: 500;
    background: #eeeeee;
}

/* Sidebar hover states */
.sidebar .chapter li:hover {
    background: #fafafa;
}

/* Adjust heading colors */
h1, h2, h3, h4, h5, h6 {
    color: #2c2c2c;
}

h1 {
    border-bottom: 2px solid #e0e0e0;
}

h2 {
    border-bottom: 1px solid #eeeeee;
}

/* Make code blocks cleaner */
pre {
    background: #f5f5f5;
    border: 1px solid #e0e0e0;
}

pre > code {
    color: #333333;
}

/* Inline code styling */
code {
    background-color: var(--inline-code-bg);
    color: var(--inline-code-color);
    border-radius: 3px;
    padding: 0.1em 0.3em;
}

/* Blockquote styling */
blockquote {
    border-left: 4px solid #bdbdbd;
    background: #f5f5f5;
    color: #424242;
}

/* Table styling */
table {
    border-collapse: collapse;
}

table thead {
    background: var(--table-header-bg);
}

table tbody tr:nth-child(2n) {
    background: var(--table-alternate-bg);
}

/* Button and icon colors */
.icon-button {
    color: #757575;
}

.icon-button:hover {
    color: #424242;
}

/* Navigation button styling */
.nav-chapters {
    color: #757575;
    background: transparent;
}

.nav-chapters:hover {
    color: #424242;
    background: #f5f5f5;
    text-decoration: none;
}

/* Nav wrapper background on hover */
.nav-wrapper {
    background: transparent;
}

.nav-wrapper:hover {
    background: #fafafa;
}

/* Previous/Next navigation links */
a.nav-chapters {
    transition: all 0.15s ease;
}

a.nav-chapters:hover {
    transform: none;
}

/* Improve D2 diagram visibility */
.d2-diagram {
    background: white;
    padding: 20px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    margin: 20px 0;
}

/* Make diagrams clickable with visual feedback */
.diagram-wrapper {
    cursor: pointer;
    display: inline-block;
    width: 100%;
    transition: opacity 0.2s ease;
}

.diagram-wrapper:hover {
    opacity: 0.85;
}

.diagram-wrapper img {
    cursor: pointer;
}

/* Make tooltips less jarring */
.tooltiptext {
    background-color: #424242;
    color: #fafafa;
}