/* ==========================================================================
   lumnik docs — « la lumière dans le congélateur »
   The lumnik.fr visual language ported onto mkdocs-material.
   Icy night dominant · one single yellow, treated as real light.
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400..600;1,9..144,400..600&display=swap");

:root {
  /* The icy night */
  --lm-nuit: #060d16;
  --lm-nuit-2: #0a1420;
  --lm-glace: #122233;
  --lm-givre: #1c3349;
  --lm-brume: #8fa8bd;
  --lm-neige: #e9f1f8;

  /* The yellow of light — the only accent */
  --lm-lumiere: #ffd24a;
  --lm-lumiere-chaude: #ffb938;
  --lm-lueur: rgba(255, 210, 74, 0.14);
  --lm-lueur-forte: rgba(255, 210, 74, 0.35);

  /* Fraunces carries the editorial voice; Archivo and IBM Plex Mono
     come from the theme.font declaration in mkdocs.yml. */
  --lm-serif: "Fraunces", Georgia, serif;
}

/* --------------------------------------------------------------------------
   Dark scheme — the site's own night, unchanged
   -------------------------------------------------------------------------- */
[data-md-color-scheme="slate"] {
  --md-default-bg-color: var(--lm-nuit);
  --md-default-bg-color--light: var(--lm-nuit-2);
  --md-default-bg-color--lighter: var(--lm-glace);
  --md-default-bg-color--lightest: var(--lm-givre);

  --md-default-fg-color: var(--lm-neige);
  --md-default-fg-color--light: var(--lm-brume);
  --md-default-fg-color--lighter: rgba(143, 168, 189, 0.55);
  --md-default-fg-color--lightest: rgba(143, 168, 189, 0.18);

  --md-primary-fg-color: var(--lm-nuit-2);
  --md-primary-bg-color: var(--lm-neige);
  --md-accent-fg-color: var(--lm-lumiere-chaude);
  --md-typeset-a-color: var(--lm-lumiere);

  --md-code-bg-color: var(--lm-nuit-2);
  --md-code-fg-color: var(--lm-neige);
  --md-code-hl-comment-color: var(--lm-brume);
  --md-code-hl-string-color: #9fe0b0;
  --md-code-hl-keyword-color: var(--lm-lumiere);
  --md-code-hl-number-color: var(--lm-lumiere-chaude);

  --md-typeset-table-color: rgba(143, 168, 189, 0.16);
  --md-typeset-mark-color: var(--lm-lueur);
  --md-footer-bg-color: var(--lm-nuit-2);
  --md-footer-bg-color--dark: var(--lm-nuit);
  --md-shadow-z1: 0 4px 16px rgba(0, 0, 0, 0.4);
  --md-shadow-z2: 0 16px 44px rgba(0, 0, 0, 0.45);
}

/* Frost grain — the same texture as the site, dark scheme only. */
[data-md-color-scheme="slate"] body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 999;
  opacity: 0.3;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.035 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* --------------------------------------------------------------------------
   Light scheme — frost rather than night; the same single light, darkened
   just enough to stay readable on snow.
   -------------------------------------------------------------------------- */
[data-md-color-scheme="default"] {
  --md-default-bg-color: #f6fafd;
  --md-default-fg-color: var(--lm-nuit);
  --md-default-fg-color--light: #46617a;
  --md-default-fg-color--lighter: #6f8aa2;

  --md-primary-fg-color: var(--lm-nuit);      /* the nav stays night, always */
  --md-primary-bg-color: var(--lm-neige);
  --md-accent-fg-color: #7a5200;
  --md-typeset-a-color: #8a5b00;

  --md-code-bg-color: #eaf1f7;
  --md-typeset-table-color: rgba(28, 51, 73, 0.18);
  --md-typeset-mark-color: var(--lm-lueur-forte);
  --md-footer-bg-color: var(--lm-nuit);
  --md-footer-bg-color--dark: var(--lm-nuit-2);
}

::selection { background: var(--lm-lumiere); color: var(--lm-nuit); }

/* --------------------------------------------------------------------------
   Typography — Fraunces for the editorial voice
   -------------------------------------------------------------------------- */
.md-typeset h1,
.md-typeset h2,
.md-typeset h3 {
  font-family: var(--lm-serif);
  letter-spacing: -0.015em;
}

.md-typeset h1 {
  color: var(--md-default-fg-color);
  font-weight: 470;
  line-height: 1.1;
}

.md-typeset h2 { font-weight: 500; line-height: 1.2; }
.md-typeset h3 { font-weight: 550; }

/* h5/h6 are the site's mono labels. */
.md-typeset h5,
.md-typeset h6 {
  font-family: var(--md-code-font-family);
  font-size: 0.76rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--md-default-fg-color--light);
}

.md-typeset em { color: inherit; }
.md-typeset strong { color: var(--md-default-fg-color); }

/* --------------------------------------------------------------------------
   The pulsing lumen — the site's logo dot, carried into the header
   -------------------------------------------------------------------------- */
.md-header__topic:first-child .md-ellipsis::after {
  content: "";
  display: inline-block;
  width: 0.42em;
  height: 0.42em;
  margin-left: 3px;
  border-radius: 50%;
  background: var(--lm-lumiere);
  box-shadow: 0 0 14px var(--lm-lumiere), 0 0 34px var(--lm-lueur-forte);
  animation: lm-pulse 3.2s ease-in-out infinite;
}

@keyframes lm-pulse {
  50% { box-shadow: 0 0 6px var(--lm-lumiere), 0 0 16px var(--lm-lueur); }
}

.md-header {
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(143, 168, 189, 0.14);
}

/* --------------------------------------------------------------------------
   Navigation — light marks the place you are
   -------------------------------------------------------------------------- */
.md-nav__link--active,
.md-nav__item .md-nav__link--active { color: var(--lm-lumiere-chaude); }

[data-md-color-scheme="slate"] .md-nav__link--active { color: var(--lm-lumiere); }

.md-nav__item--section > .md-nav__link {
  font-family: var(--md-code-font-family);
  font-size: 0.68rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--md-default-fg-color--light);
}

.md-typeset .md-nav__title { font-family: var(--lm-serif); }

/* --------------------------------------------------------------------------
   Tables — the comparison table's mono header
   -------------------------------------------------------------------------- */
.md-typeset table:not([class]) th {
  font-family: var(--md-code-font-family);
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--md-default-fg-color--light);
  background: transparent;
  border-bottom: 1px solid var(--lm-lueur-forte);
}

.md-typeset table:not([class]) { border: none; box-shadow: none; }
.md-typeset table:not([class]) td { border-top: 1px solid var(--md-typeset-table-color); }

/* --------------------------------------------------------------------------
   Quotes, admonitions, code — light on the left edge
   -------------------------------------------------------------------------- */
.md-typeset blockquote {
  border-left: 2px solid var(--lm-lumiere);
  color: var(--md-default-fg-color--light);
}

.md-typeset .admonition,
.md-typeset details {
  border: 1px solid var(--md-typeset-table-color);
  border-left-width: 3px;
  border-radius: 10px;
  box-shadow: none;
}

.md-typeset .admonition.note,
.md-typeset .admonition.tip,
.md-typeset .admonition.info,
.md-typeset details.note,
.md-typeset details.tip,
.md-typeset details.info { border-left-color: var(--lm-lumiere); }

.md-typeset .note > .admonition-title,
.md-typeset .tip > .admonition-title,
.md-typeset .info > .admonition-title,
.md-typeset .note > summary,
.md-typeset .tip > summary,
.md-typeset .info > summary { background: var(--lm-lueur); }

.md-typeset .note > .admonition-title::before,
.md-typeset .tip > .admonition-title::before,
.md-typeset .info > .admonition-title::before,
.md-typeset .note > summary::before,
.md-typeset .tip > summary::before,
.md-typeset .info > summary::before { background-color: var(--lm-lumiere); }

.md-typeset pre > code,
.md-typeset .highlight { border-radius: 10px; }

.md-typeset code { border-radius: 5px; }

/* --------------------------------------------------------------------------
   Buttons & footer
   -------------------------------------------------------------------------- */
.md-typeset .md-button {
  border-radius: 999px;
  border-width: 1px;
  font-weight: 600;
  letter-spacing: 0.02em;
  transition: transform 0.25s, box-shadow 0.25s, background 0.25s;
}

.md-typeset .md-button--primary {
  background: var(--lm-lumiere);
  border-color: var(--lm-lumiere);
  color: var(--lm-nuit);
}

.md-typeset .md-button--primary:hover,
.md-typeset .md-button--primary:focus-visible {
  background: var(--lm-lumiere-chaude);
  border-color: var(--lm-lumiere-chaude);
  color: var(--lm-nuit);
  transform: translateY(-2px);
  box-shadow: 0 8px 34px var(--lm-lueur-forte);
}

.md-footer-meta { border-top: 1px solid rgba(143, 168, 189, 0.12); }

/* --------------------------------------------------------------------------
   Accessibility
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
