/* ============================================================================
   ELS Compass, restyling motywu sphinx_rtd_theme
   ----------------------------------------------------------------------------
   Paleta i kroje pochodzą 1:1 ze strony produktowej compass.energylogserver.com
   (zmienne --bg, --surface, --yellow, --green, Montserrat + Source Sans Pro).

   Marka jest dark-first: firmowy żółty #F4C623 daje 12,34:1 na tle #07080D
   i tylko 1,62:1 na białym. Dlatego tryb ciemny jest domyślny, a tryb jasny
   podmienia akcent na przyciemniony #8A6100 (5,54:1 na bieli).
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700&family=Source+Sans+3:ital,wght@0,400;0,600;1,400&family=JetBrains+Mono:wght@400;500&display=swap");

/* --- Tokeny marki --------------------------------------------------------- */

:root {
  --compass-bg: #07080d;
  --compass-surface: #0c1118;
  --compass-surface-2: #101722;
  --compass-surface-3: #151d28;
  --compass-panel: #0d121a;
  --compass-panel-2: #111720;

  --compass-text: #f7f4ed;
  --compass-muted: rgba(247, 244, 237, 0.72);
  --compass-soft: rgba(247, 244, 237, 0.52);
  --compass-line: rgba(247, 244, 237, 0.12);

  --compass-yellow: #f4c623;
  --compass-yellow-2: #ffda52;
  --compass-yellow-deep: #d9a400;
  --compass-green: #20a737;
  --compass-green-2: #5be06a;

  --compass-shadow: rgba(0, 0, 0, 0.36);

  /* role przypisane do tokenów, tryb ciemny */
  --compass-page: var(--compass-bg);
  --compass-card: var(--compass-panel);
  --compass-fg: var(--compass-text);
  --compass-fg-muted: var(--compass-muted);
  --compass-border: var(--compass-line);
  --compass-accent: var(--compass-yellow);
  --compass-accent-hover: var(--compass-yellow-2);
  --compass-ok: var(--compass-green-2);

  --compass-font-head: "Montserrat", "Source Sans 3", "Source Sans Pro", Arial, Helvetica, sans-serif;
  --compass-font-body: "Source Sans 3", "Source Sans Pro", Arial, Helvetica, sans-serif;
  --compass-font-mono: "JetBrains Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}

@media (prefers-color-scheme: light) {
  :root {
    --compass-page: #ffffff;
    --compass-card: #f7f4ed;
    --compass-fg: #1a1d23;
    --compass-fg-muted: #4d5058;
    --compass-border: rgba(7, 8, 13, 0.14);
    --compass-accent: #8a6100;
    --compass-accent-hover: #6e4e00;
    --compass-ok: #155c1e;
  }
}

/* --- Typografia ----------------------------------------------------------- */

body,
.rst-content,
.wy-menu-vertical,
input,
select,
textarea {
  font-family: var(--compass-font-body);
}

h1, h2, h3, h4, h5, h6,
.rst-content .toctree-wrapper > p.caption,
legend {
  font-family: var(--compass-font-head);
  font-weight: 600;
  color: var(--compass-fg);
}

h1 { letter-spacing: -0.015em; }

code, pre, tt,
.rst-content tt,
.rst-content code,
.rst-content pre {
  font-family: var(--compass-font-mono);
}

/* --- Kanwa strony --------------------------------------------------------- */

.wy-nav-content-wrap {
  background: var(--compass-page);
}

.wy-nav-content {
  background: var(--compass-page);
  color: var(--compass-fg);
  max-width: 62rem;
}

.rst-content,
.rst-content p,
.rst-content li,
.rst-content dd {
  color: var(--compass-fg);
}

.rst-content .section > p,
.rst-content blockquote {
  color: var(--compass-fg-muted);
}

/* --- Pasek boczny --------------------------------------------------------- */

.wy-nav-side {
  background: var(--compass-bg);
  border-right: 1px solid var(--compass-line);
}

.wy-side-nav-search {
  background: var(--compass-surface);
  border-bottom: 1px solid var(--compass-line);
  padding-bottom: 0.8rem;
}

/* Logo produktu. Motyw RTD domyślnie ogranicza je do 12rem i dokłada białe
   tło, co przy naszym wordmarku wygląda jak naklejka na ciemnym pasku. */
.wy-side-nav-search > a img.logo,
.wy-side-nav-search .wy-dropdown > a img.logo {
  background: transparent;
  border-radius: 0;
  padding: 0;
  margin: 0.35rem auto 0.55rem;
  max-width: 11rem;
  width: 100%;
  height: auto;
  display: block;
}

.wy-side-nav-search > a,
.wy-side-nav-search .wy-dropdown > a {
  font-family: var(--compass-font-head);
  font-weight: 700;
  color: var(--compass-text);
  letter-spacing: 0.01em;
}

.wy-side-nav-search > a:hover {
  background: transparent;
  color: var(--compass-yellow);
}

.wy-side-nav-search > div.version {
  color: var(--compass-soft);
}

.wy-side-nav-search input[type="text"] {
  background: var(--compass-panel-2);
  border: 1px solid var(--compass-line);
  border-radius: 6px;
  color: var(--compass-text);
  box-shadow: none;
}

.wy-side-nav-search input[type="text"]:focus {
  border-color: var(--compass-yellow);
  outline: none;
}

.wy-side-nav-search input[type="text"]::placeholder {
  color: var(--compass-soft);
}

.wy-menu-vertical a {
  color: var(--compass-muted);
}

.wy-menu-vertical a:hover {
  background: var(--compass-surface-2);
  color: var(--compass-text);
}

.wy-menu-vertical li.current {
  background: var(--compass-surface);
}

.wy-menu-vertical li.current > a,
.wy-menu-vertical li.on a {
  background: var(--compass-surface-2);
  border-color: var(--compass-line);
  color: var(--compass-text);
  font-weight: 600;
}

.wy-menu-vertical li.current > a:hover,
.wy-menu-vertical li.on a:hover {
  background: var(--compass-surface-3);
}

.wy-menu-vertical li.toctree-l1.current > a {
  border-left: 3px solid var(--compass-yellow);
}

/* Motyw RTD rozjaśnia zagnieżdżone pozycje aktywnej gałęzi (#c9c9c9, #bdbdbd)
   selektorami o wyższej specyficzności niż li.current > a. Bez tych trzech
   reguł drzewo nawigacji rozświetla się na szaro w połowie wysokości. */
.wy-menu-vertical li.toctree-l2.current > a,
.wy-menu-vertical li.toctree-l2.current li.toctree-l3 > a {
  background: var(--compass-surface-3);
  color: var(--compass-text);
}

.wy-menu-vertical li.toctree-l3.current > a,
.wy-menu-vertical li.toctree-l3.current li.toctree-l4 > a {
  background: var(--compass-panel-2);
  color: var(--compass-text);
}

.wy-menu-vertical li.toctree-l2.current > a:hover,
.wy-menu-vertical li.toctree-l3.current > a:hover,
.wy-menu-vertical li.toctree-l4.current > a:hover {
  background: var(--compass-surface-2);
}

.wy-menu-vertical li.toctree-l2 button.toctree-expand,
.wy-menu-vertical li.toctree-l3 button.toctree-expand,
.wy-menu-vertical li.current > a button.toctree-expand {
  color: var(--compass-soft);
}

.wy-menu-vertical li.current a {
  color: var(--compass-muted);
  border-right: 0;
}

.wy-menu-vertical li.current a:hover {
  background: var(--compass-surface-3);
  color: var(--compass-text);
}

.wy-menu-vertical p.caption,
.wy-menu-vertical .caption-text {
  font-family: var(--compass-font-head);
  color: var(--compass-yellow);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 0.78rem;
}

/* pasek mobilny */
.wy-nav-top {
  background: var(--compass-bg);
  border-bottom: 1px solid var(--compass-line);
}

.wy-nav-top a {
  font-family: var(--compass-font-head);
  color: var(--compass-text);
}

.wy-nav-top i {
  color: var(--compass-yellow);
}

/* --- Odnośniki ------------------------------------------------------------ */

a,
.rst-content a {
  color: var(--compass-accent);
  text-decoration: none;
}

a:hover,
.rst-content a:hover {
  color: var(--compass-accent-hover);
  text-decoration: underline;
}

a:visited,
.rst-content a:visited {
  color: var(--compass-accent);
}

a:focus-visible {
  outline: 2px solid var(--compass-accent);
  outline-offset: 2px;
  border-radius: 2px;
}

/* --- Kod ------------------------------------------------------------------ */

.rst-content div[class^="highlight"],
.rst-content pre.literal-block {
  background: var(--compass-panel);
  border: 1px solid var(--compass-border);
  border-radius: 8px;
}

.rst-content div[class^="highlight"] pre {
  background: transparent;
  color: var(--compass-text);
}

.rst-content code.literal,
.rst-content tt.literal {
  background: var(--compass-panel-2);
  border: 1px solid var(--compass-border);
  border-radius: 4px;
  color: var(--compass-yellow-2);
  padding: 0.1em 0.35em;
  font-size: 0.88em;
}

@media (prefers-color-scheme: light) {
  .rst-content code.literal,
  .rst-content tt.literal {
    background: var(--compass-card);
    color: #6e4e00;
  }

  .rst-content div[class^="highlight"],
  .rst-content pre.literal-block {
    background: #0c1118;
  }
}

/* --- Tabele --------------------------------------------------------------- */

.rst-content table.docutils {
  border: 1px solid var(--compass-border);
  border-radius: 8px;
  overflow: hidden;
}

.rst-content table.docutils thead th {
  background: var(--compass-surface-2);
  color: var(--compass-text);
  font-family: var(--compass-font-head);
  font-weight: 600;
  border-color: var(--compass-line);
}

.rst-content table.docutils td,
.rst-content table.docutils th {
  border-color: var(--compass-border);
}

.rst-content table.docutils:not(.field-list) tr:nth-child(2n-1) td {
  background: var(--compass-card);
}

@media (prefers-color-scheme: light) {
  .rst-content table.docutils thead th {
    background: var(--compass-card);
    color: var(--compass-fg);
  }
}

/* --- Adnotacje ------------------------------------------------------------ */

.rst-content .admonition,
.rst-content .admonition-todo {
  background: var(--compass-card);
  border: 1px solid var(--compass-border);
  border-left-width: 4px;
  border-radius: 8px;
  box-shadow: 0 1px 3px var(--compass-shadow);
}

.rst-content .admonition-title {
  font-family: var(--compass-font-head);
  font-weight: 600;
}

.rst-content .note,
.rst-content .seealso {
  border-left-color: var(--compass-yellow);
}

.rst-content .note > .admonition-title,
.rst-content .seealso > .admonition-title {
  background: var(--compass-yellow);
  color: #07080d;
}

.rst-content .tip,
.rst-content .hint,
.rst-content .important {
  border-left-color: var(--compass-green);
}

.rst-content .tip > .admonition-title,
.rst-content .hint > .admonition-title,
.rst-content .important > .admonition-title {
  background: var(--compass-green);
  color: #07080d;
}

.rst-content .warning,
.rst-content .caution,
.rst-content .attention {
  border-left-color: var(--compass-yellow-deep);
}

.rst-content .warning > .admonition-title,
.rst-content .caution > .admonition-title,
.rst-content .attention > .admonition-title {
  background: var(--compass-yellow-deep);
  color: #07080d;
}

.rst-content .danger,
.rst-content .error {
  border-left-color: #c0392b;
}

.rst-content .danger > .admonition-title,
.rst-content .error > .admonition-title {
  background: #c0392b;
  color: #ffffff;
}

/* --- Przyciski ------------------------------------------------------------ */

.btn-neutral,
.rst-content .btn-neutral {
  background: var(--compass-card) !important;
  border: 1px solid var(--compass-border);
  color: var(--compass-fg) !important;
  border-radius: 6px;
  box-shadow: none;
}

.btn-neutral:hover,
.rst-content .btn-neutral:hover {
  background: var(--compass-surface-2) !important;
  color: var(--compass-fg) !important;
}

.btn-neutral:visited {
  color: var(--compass-fg) !important;
}

/* --- Stopka i przełącznik wersji ------------------------------------------ */

footer,
footer p,
.rst-content footer {
  color: var(--compass-fg-muted);
}

footer hr {
  border-color: var(--compass-border);
}

.rst-versions {
  background: var(--compass-surface);
  border-top: 1px solid var(--compass-line);
}

.rst-versions .rst-current-version {
  background: var(--compass-panel);
  color: var(--compass-yellow);
}

.rst-versions a {
  color: var(--compass-yellow);
}

/* --- Drobiazgi ------------------------------------------------------------ */

.rst-content hr {
  border-color: var(--compass-border);
}

.rst-content .highlighted {
  background: var(--compass-yellow);
  color: #07080d;
  box-shadow: none;
  padding: 0 2px;
}

.rst-content dl:not(.docutils) dt {
  background: var(--compass-card);
  border-top: 2px solid var(--compass-yellow);
  color: var(--compass-fg);
}

.rst-content .guilabel,
.rst-content .menuselection {
  background: var(--compass-card);
  border: 1px solid var(--compass-border);
  color: var(--compass-fg);
}

/* wykresy mermaid czytelne na obu tłach */
.mermaid svg {
  background: var(--compass-card);
  border: 1px solid var(--compass-border);
  border-radius: 8px;
  padding: 0.5rem;
}