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

/* Light theme */
.light, :root {
    /* Cerulean-led palette */
    --cerulean-ink:  #0a3a52;
    --cerulean-deep: #0c5e87;
    --cerulean:      #0d7eaa;
    --cerulean-mid:  #2099c6;
    --cerulean-pale: #7cc8e2;
    --cerulean-wash: #dbeef6;
    --sea:  #14a89a;
    --foam: #4fd1c5;

    --bg: #ffffff;
    --fg: #0f2630;
    --sidebar-bg: var(--cerulean-ink);
    --sidebar-fg: var(--cerulean-wash);
    --sidebar-active: var(--foam);
    --sidebar-spacer: #15526f;
    --icons: var(--cerulean-pale);
    --icons-hover: var(--foam);
    --links: var(--cerulean-deep);
    --inline-code-color: var(--cerulean-ink);
    --theme-popup-bg: var(--cerulean-wash);
    --theme-popup-border: var(--cerulean-mid);
    --theme-hover: var(--cerulean-pale);
    --quote-bg: var(--cerulean-wash);
    --quote-border: var(--sea);
    --table-border-color: var(--cerulean-pale);
    --table-header-bg: var(--cerulean-wash);
    --table-alternate-bg: #f3f9fc;
    --searchbar-border-color: var(--cerulean-mid);
    --searchbar-bg: #ffffff;
    --searchresults-header-fg: var(--cerulean-deep);
    --searchresults-border-color: var(--cerulean-pale);
    --searchresults-li-bg: #f3f9fc;
    --search-mark-bg: var(--foam);
}

/* Dark themes */
.coal, .navy, .ayu {
    --cerulean-ink:  #0a3a52;
    --cerulean-deep: #0c5e87;
    --cerulean:      #0d7eaa;
    --cerulean-mid:  #2099c6;
    --cerulean-pale: #7cc8e2;
    --cerulean-wash: #dbeef6;
    --sea:  #14a89a;
    --foam: #4fd1c5;

    --bg: #07212f;
    --fg: var(--cerulean-wash);
    --sidebar-bg: #04161f;
    --sidebar-fg: var(--cerulean-pale);
    --sidebar-active: var(--foam);
    --sidebar-spacer: #0f3a52;
    --icons: var(--cerulean-mid);
    --icons-hover: var(--cerulean-pale);
    --links: var(--cerulean-mid);
    --inline-code-color: var(--cerulean-pale);
    --theme-popup-bg: #0a2f44;
    --theme-popup-border: var(--cerulean-mid);
    --theme-hover: #0f3a52;
    --quote-bg: #0a2f44;
    --quote-border: var(--sea);
    --table-border-color: #14425b;
    --table-header-bg: #0a2f44;
    --table-alternate-bg: #082838;
    --searchbar-border-color: var(--cerulean-mid);
    --searchbar-bg: #0a2f44;
    --searchresults-header-fg: var(--cerulean-pale);
    --searchresults-border-color: #14425b;
    --searchresults-li-bg: #0a2f44;
    --search-mark-bg: var(--sea);
}

/* Sidebar logo */
.cerulean-logo {
    padding: 14px 16px 10px;
}

.cerulean-logo a {
    display: block;
}

.cerulean-logo img {
    width: 100%;
    max-width: 250px;
    height: auto;
    display: block;
}

/* Typography */
body {
    font-family: 'IBM Plex Sans', system-ui, sans-serif;
}

code, pre, .hljs, kbd {
    font-family: 'IBM Plex Mono', ui-monospace, monospace;
}

blockquote {
    font-style: italic;
    font-family: 'IBM Plex Sans', system-ui, sans-serif;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    color: #0d5c5c;
}

.coal h1, .coal h2, .coal h3, .coal h4, .coal h5, .coal h6,
.navy h1, .navy h2, .navy h3, .navy h4, .navy h5, .navy h6,
.ayu h1, .ayu h2, .ayu h3, .ayu h4, .ayu h5, .ayu h6 {
    color: #7cc8e2;
}