/* GPJax docs overrides for the shibuya theme.
 *
 * Everything here is a survivor of the old mkdocs-material `extra.css`; the
 * ~110 lines that targeted `.md-*` classes, the Material colour variables and
 * the `permalinks.css` headerlink mask are all Material-only and were dropped
 * with the theme. Shibuya's `accent_color`, re-toned below, covers the palette
 * that `--md-primary-fg-color` used to force. */

/* -- Brand accent ------------------------------------------------------------
 *
 * The same oxblood scale as impulso (../impulso/docs/stylesheets/extra.css),
 * so the two sites share one accent. */
/* Re-tone the theme's Radix "crimson" accent to the ledger's oxblood
   (qc_core.plotting.COLORS.oxblood #7a2e2a light, #cf6f60 dark). shibuya
   maps every --accent-* token from --crimson-* (conf.py `accent_color`), so
   overriding the scale recolors links, active nav, hovers, and focus rings
   in one place. Selectors mirror the theme's own; both blocks are needed
   because this file loads after the theme, where a lone :root block would
   also override the theme's .dark values. Steps follow Radix semantics:
   1-2 backgrounds, 3-5 washes, 6-8 borders, 9-10 solid, 11-12 text. */
:root,
.light,
.light-theme {
    --crimson-1: #fdf9f8;
    --crimson-2: #fbf1ef;
    --crimson-3: #f4e7e4;
    --crimson-4: #eedad5;
    --crimson-5: #e7cbc5;
    --crimson-6: #ddb8b0;
    --crimson-7: #cf9d93;
    --crimson-8: #bd7d71;
    --crimson-9: #7a2e2a;
    --crimson-10: #5f231f;
    --crimson-11: #7a2e2a;
    --crimson-12: #43201d;
    --crimson-a1: rgba(122, 46, 42, 0.03);
    --crimson-a2: rgba(122, 46, 42, 0.05);
    --crimson-a3: rgba(122, 46, 42, 0.1);
    --crimson-a4: rgba(122, 46, 42, 0.15);
    --crimson-a5: rgba(122, 46, 42, 0.21);
    --crimson-a6: rgba(122, 46, 42, 0.28);
    --crimson-a7: rgba(122, 46, 42, 0.38);
    --crimson-a8: rgba(122, 46, 42, 0.52);
    --crimson-a9: rgba(97, 6, 1, 0.84);
    --crimson-a10: rgba(73, 5, 0, 0.88);
    --crimson-a11: rgba(97, 6, 1, 0.84);
    --crimson-a12: rgba(46, 7, 4, 0.9);
    --crimson-contrast: #faf9f7;
    --crimson-surface: #f8efeccc;
}

.dark,
.dark-theme {
    --crimson-1: #1d1412;
    --crimson-2: #241815;
    --crimson-3: #35201b;
    --crimson-4: #422620;
    --crimson-5: #4e2c25;
    --crimson-6: #5e352c;
    --crimson-7: #754138;
    --crimson-8: #955347;
    --crimson-9: #cf6f60;
    --crimson-10: #dd8171;
    --crimson-11: #f2a291;
    --crimson-12: #fbe1da;
    --crimson-a1: rgba(207, 111, 96, 0.03);
    --crimson-a2: rgba(207, 111, 96, 0.06);
    --crimson-a3: rgba(207, 111, 96, 0.12);
    --crimson-a4: rgba(207, 111, 96, 0.17);
    --crimson-a5: rgba(207, 111, 96, 0.23);
    --crimson-a6: rgba(207, 111, 96, 0.3);
    --crimson-a7: rgba(207, 111, 96, 0.42);
    --crimson-a8: rgba(207, 111, 96, 0.56);
    --crimson-a9: rgba(252, 135, 117, 0.82);
    --crimson-a10: rgba(254, 148, 130, 0.87);
    --crimson-a11: rgba(255, 171, 153, 0.95);
    --crimson-a12: rgba(255, 230, 222, 0.98);
    --crimson-contrast: #201b19;
    --crimson-surface: #35201b80;
}

/* Local alias for the hand-styled pieces below. Note this is *not* a shibuya
   variable -- the theme stylesheet never reads `--linkcolor`. */
:root {
    --linkcolor: var(--accent-9);
}

/* -- Notebook cells follow the site's colour mode ----------------------------
 *
 * MyST-NB's stylesheet switches its whole palette on two marker custom
 * properties, `--light` and `--dark`, which it sets from `prefers-color-scheme`
 * or from a `[data-theme]` attribute on <html>/<body> (Furo's and PyData's
 * convention). shibuya uses neither: it toggles `html.light` / `html.dark`.
 *
 * The two therefore disagreed whenever the site's mode differed from the OS
 * preference -- which is the default path, since `color_mode = "auto"` starts
 * from the OS but the reader's toggle is remembered in localStorage. A reader on
 * a light OS viewing the site in dark mode got MyST-NB's *light* cell background
 * (#f7f7f7) underneath Pygments' *dark* token colours (#e6edf3 text), because
 * shibuya's Pygments stylesheet does key on `html.dark`. Near-white on
 * near-white: the unreadable code blocks.
 *
 * Driving MyST-NB's two markers from shibuya's classes reconnects the whole
 * MyST-NB palette to the site's colour mode. Specificity 0,1,1 outranks the
 * `:root` (0,1,0) that MyST-NB sets inside its media queries.
 *
 * The empty values are load-bearing and not typos: `var(--light, X)` substitutes
 * nothing when `--light` is the empty value, and falls back to `X` when it is
 * `initial`. That is the switch MyST-NB is built on. */
html.light {
    --light: initial;
    --dark: ;
}

html.dark {
    --light: ;
    --dark: initial;
}

/* With the switch reconnected MyST-NB's own greys are legible but they are not
 * shibuya's, so a notebook input cell still read as a foreign panel. Point its
 * surfaces at the theme's own tokens instead; each of those already resolves per
 * colour mode, so this needs no light/dark branching of its own. */
:root {
    /* Transparent, not a colour: shibuya already paints `.highlight pre` with
       `--code-block-background`, and that <pre> fills the input cell. Giving the
       cell its own tint as well would stack two translucent accent layers and
       make notebook code read heavier than the same code in prose. */
    --mystnb-source-bg-color: transparent;
    --mystnb-source-border-color: var(--sy-c-border);
    /* MyST-NB's default for the thick left rule is the literal keyword `green`. */
    --mystnb-source-margin-color: var(--accent-9);
    --mystnb-stdout-bg-color: var(--sy-c-surface);
    --mystnb-stdout-border-color: var(--sy-c-border);
    --mystnb-traceback-bg-color: var(--red-a2);
    --mystnb-traceback-border-color: var(--red-a6);
    --mystnb-stderr-bg-color: var(--red-a2);
    --mystnb-stderr-border-color: var(--red-a6);
    --mystnb-scrollbar-thumb-color: var(--gray-a6);
    --mystnb-scrollbar-thumb-hover-color: var(--gray-a8);
}

/* Consulting call-to-action block on the landing page. */
.consulting-cta {
    margin: 1.5rem 0;
    padding: 0.75rem 1rem;
    border: 2px solid var(--linkcolor);
    border-left: 5px solid var(--linkcolor);
    border-radius: 8px;
    background-color: color-mix(in srgb, var(--linkcolor) 6%, transparent);
}

.consulting-cta p {
    margin: 0;
}

.consulting-cta a {
    color: var(--linkcolor);
    font-weight: 600;
}

/* Centre PNG figures, as the mkdocs stylesheet did. */
img[src$=".png"] {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* Prevent selection of the >>> prompt and its output in doctest blocks.
 * cf. https://mkdocstrings.github.io/recipes/#prevent-selection-of-prompts-and-output-in-python-code-blocks */
.highlight .gp,
.highlight .go {
    user-select: none;
}