/* Kernix-inspired theme overrides for Material for MkDocs.
   Palette + fonts mirror https://kernix.ru/ (Redcoat brand).
*/

/* ---------- Google Fonts ---------- */
@import url("https://fonts.googleapis.com/css2?family=Onest:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600&family=Instrument+Serif:ital@0;1&display=swap");

/* ---------- Design tokens (kernix.ru) ---------- */
/* Brand constants — same in both schemes */
:root {
  --kx-accent:    #d76a6a;
  --kx-navy:      #6a96cf;
  --kx-green:     #74a879;
  --kx-radius:    3px;
}

/* Dark scheme tokens (kernix.ru reference) */
[data-md-color-scheme="slate"] {
  --kx-bg:        #0b0b0c;
  --kx-bg-2:      #101012;
  --kx-bg-3:      #17171a;
  --kx-surface:   #1d1d20;
  --kx-border:    #222226;
  --kx-border-2:  #2f2f34;
  --kx-fg:        #f3f3f5;
  --kx-fg-2:      #b0b0b6;
  --kx-fg-3:      #7a7a82;
  --kx-fg-4:      #4a4a52;
  --kx-grid:      #151518;
}

/* Light scheme tokens — paper-warm, kernix-flavor */
[data-md-color-scheme="default"] {
  --kx-bg:        #f7f7f6;
  --kx-bg-2:      #efeeec;
  --kx-bg-3:      #ececea;
  --kx-surface:   #ffffff;
  --kx-border:    #d6d4ce;
  --kx-border-2:  #c1bfb8;
  --kx-fg:        #0b0b0c;
  --kx-fg-2:      #4a4a52;
  --kx-fg-3:      #6b6962;
  --kx-fg-4:      #8a8780;
  --kx-grid:      #ece9e3;
}

/* ---------- Dark scheme (default) ---------- */
[data-md-color-scheme="slate"] {
  --md-default-bg-color:           var(--kx-bg);
  --md-default-bg-color--light:    var(--kx-bg-2);
  --md-default-bg-color--lighter:  var(--kx-bg-3);
  --md-default-bg-color--lightest: var(--kx-surface);

  --md-default-fg-color:           var(--kx-fg);
  --md-default-fg-color--light:    var(--kx-fg-2);
  --md-default-fg-color--lighter:  var(--kx-fg-3);
  --md-default-fg-color--lightest: var(--kx-fg-4);

  --md-typeset-color:              var(--kx-fg);
  --md-typeset-a-color:            var(--kx-accent);

  --md-primary-fg-color:           var(--kx-bg-2);
  --md-primary-fg-color--light:    var(--kx-bg-3);
  --md-primary-fg-color--dark:     var(--kx-bg);
  --md-primary-bg-color:           var(--kx-fg);
  --md-primary-bg-color--light:    var(--kx-fg-2);

  --md-accent-fg-color:            var(--kx-accent);
  --md-accent-fg-color--transparent: rgba(215,106,106,0.10);
  --md-accent-bg-color:            var(--kx-fg);
  --md-accent-bg-color--light:     var(--kx-fg-2);

  --md-code-bg-color:              var(--kx-bg-3);
  --md-code-fg-color:              var(--kx-fg);
  --md-code-hl-color:              rgba(215,106,106,0.18);
  --md-code-hl-string-color:       var(--kx-green);
  --md-code-hl-comment-color:      var(--kx-fg-3);
  --md-code-hl-keyword-color:      var(--kx-accent);
  --md-code-hl-name-color:         var(--kx-navy);
  --md-code-hl-number-color:       var(--kx-green);
  --md-code-hl-operator-color:     var(--kx-fg-2);
  --md-code-hl-punctuation-color:  var(--kx-fg-2);
  --md-code-hl-special-color:      var(--kx-accent);
  --md-code-hl-variable-color:     var(--kx-navy);

  --md-footer-bg-color:            var(--kx-bg-2);
  --md-footer-bg-color--dark:      var(--kx-bg);
  --md-footer-fg-color:            var(--kx-fg-2);

  --md-admonition-bg-color:        var(--kx-bg-3);
  --md-admonition-fg-color:        var(--kx-fg);

  color-scheme: dark;
}

/* ---------- Light scheme — restrained, paper-like ---------- */
[data-md-color-scheme="default"] {
  --md-default-bg-color:           var(--kx-bg);
  --md-default-bg-color--light:    var(--kx-bg-2);
  --md-default-bg-color--lighter:  var(--kx-bg-3);
  --md-default-bg-color--lightest: var(--kx-surface);

  --md-default-fg-color:           var(--kx-fg);
  --md-default-fg-color--light:    var(--kx-fg-2);
  --md-default-fg-color--lighter:  var(--kx-fg-3);
  --md-default-fg-color--lightest: var(--kx-fg-4);

  --md-typeset-color:              var(--kx-fg);
  --md-typeset-a-color:            var(--kx-accent);

  --md-primary-fg-color:           var(--kx-bg-2);
  --md-primary-fg-color--light:    var(--kx-bg-3);
  --md-primary-fg-color--dark:     var(--kx-bg);
  --md-primary-bg-color:           var(--kx-fg);
  --md-primary-bg-color--light:    var(--kx-fg-2);

  --md-accent-fg-color:            var(--kx-accent);
  --md-accent-fg-color--transparent: rgba(215,106,106,0.12);
  --md-accent-bg-color:             var(--kx-fg);
  --md-accent-bg-color--light:      var(--kx-fg-2);

  --md-code-bg-color:              var(--kx-bg-3);
  --md-code-fg-color:              var(--kx-fg);
  --md-code-hl-color:              rgba(215,106,106,0.18);
  --md-code-hl-string-color:       #2f6f3a;
  --md-code-hl-comment-color:      var(--kx-fg-3);
  --md-code-hl-keyword-color:      #b54a4a;
  --md-code-hl-name-color:         #2c5a8f;
  --md-code-hl-number-color:       #2f6f3a;
  --md-code-hl-operator-color:     var(--kx-fg-2);
  --md-code-hl-punctuation-color:  var(--kx-fg-2);
  --md-code-hl-special-color:      var(--kx-accent);
  --md-code-hl-variable-color:     #2c5a8f;

  --md-footer-bg-color:            var(--kx-bg-2);
  --md-footer-bg-color--dark:      var(--kx-bg-3);
  --md-footer-fg-color:            var(--kx-fg-2);

  --md-admonition-bg-color:        var(--kx-bg-3);
  --md-admonition-fg-color:        var(--kx-fg);

  color-scheme: light;
}

/* ---------- Typography ---------- */
body, .md-typeset {
  font-family: "Onest", ui-sans-serif, system-ui, -apple-system, sans-serif;
  font-feature-settings: "cv11", "ss01", "ss02";
  letter-spacing: -0.005em;
}

.md-typeset code,
.md-typeset pre,
.md-typeset kbd,
.md-code__content,
code, pre, kbd {
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-feature-settings: "calt", "ss02", "zero";
}

/* Display heading variant — Instrument Serif italic for h1 lead */
.md-typeset h1 {
  font-family: "Onest", sans-serif;
  font-weight: 600;
  letter-spacing: -0.02em;
  font-size: 2.2rem;
  line-height: 1.15;
  margin-bottom: 1.2rem;
  border-bottom: 1px solid var(--kx-border);
  padding-bottom: 0.6rem;
}
.md-typeset h2 {
  font-weight: 600;
  letter-spacing: -0.015em;
  font-size: 1.45rem;
  margin-top: 2.2rem;
  color: var(--kx-fg);
}
.md-typeset h3 {
  font-family: "JetBrains Mono", monospace;
  font-weight: 500;
  font-size: 1.05rem;
  color: var(--kx-fg);
  margin-top: 1.6rem;
  padding-left: 0.6rem;
  border-left: 2px solid var(--kx-accent);
}
.md-typeset h4, .md-typeset h5 {
  font-family: "Onest", sans-serif;
  font-weight: 500;
  color: var(--kx-fg-2);
}

/* ---------- Subtle terminal-grid background on body ---------- */
.md-main {
  background-image:
    linear-gradient(var(--kx-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--kx-grid) 1px, transparent 1px);
  background-size: 64px 64px;
  background-position: -1px -1px;
}

/* ---------- Header ---------- */
.md-header {
  background-color: var(--kx-bg-2);
  border-bottom: 1px solid var(--kx-border);
  box-shadow: none;
}
.md-header__title {
  font-family: "JetBrains Mono", monospace;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  font-size: 0.85rem;
}
.md-tabs {
  background-color: var(--kx-bg-2);
  border-bottom: 1px solid var(--kx-border);
}
.md-tabs__link {
  font-family: "JetBrains Mono", monospace;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  text-transform: lowercase;
  opacity: 1;
  color: var(--kx-fg-2);
}
.md-tabs__link--active,
.md-tabs__link:hover {
  color: var(--kx-accent);
}

/* ---------- Sidebar nav ---------- */
.md-nav {
  font-size: 0.78rem;
}
.md-nav__title {
  font-family: "JetBrains Mono", monospace;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.7rem;
  color: var(--kx-fg-3);
}
.md-nav__link {
  color: var(--kx-fg-2);
}
.md-nav__link:hover,
.md-nav__link--active {
  color: var(--kx-accent);
}
.md-nav__link--active {
  font-weight: 500;
}

/* ---------- Links ---------- */
.md-typeset a {
  color: var(--kx-accent);
  text-decoration: none;
  border-bottom: 1px dashed transparent;
  transition: border-color 0.15s ease;
}
.md-typeset a:hover {
  border-bottom-color: var(--kx-accent);
}

/* ---------- Code blocks: terminal style ---------- */
.md-typeset pre > code,
.md-typeset .highlight pre {
  background-color: var(--kx-bg-3);
  border: 1px solid var(--kx-border);
  border-radius: var(--kx-radius);
  font-size: 0.82rem;
}
.md-typeset code {
  border-radius: var(--kx-radius);
  background-color: var(--kx-bg-3);
  border: 1px solid var(--kx-border);
  padding: 0.05em 0.4em;
  font-size: 0.85em;
  color: var(--kx-fg);
}
.md-typeset pre > code {
  border: none;
  padding: 1em 1.2em;
}
/* Filename caption above code */
.md-typeset .filename {
  font-family: "JetBrains Mono", monospace;
  font-size: 0.72rem;
  color: var(--kx-fg-3);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: -0.4rem;
}

/* ---------- Tables ---------- */
.md-typeset table:not([class]) {
  background: var(--kx-surface);
  border: 1px solid var(--kx-border);
  border-radius: var(--kx-radius);
  font-size: 0.85rem;
}
.md-typeset table:not([class]) th {
  background: var(--kx-bg-3);
  color: var(--kx-fg);
  border-bottom: 1px solid var(--kx-border-2);
  font-family: "JetBrains Mono", monospace;
  font-weight: 500;
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.05em;
  padding: 0.7em 1em;
}
.md-typeset table:not([class]) td {
  border-top: 1px solid var(--kx-border);
  padding: 0.7em 1em;
}
/* Имена слоёв и идентификаторы (`<SSL-Intercept>`, `http.request.detection.*`)
   в ячейках таблиц — единый токен: не рвём по дефису/точке на несколько строк.
   Если ячейка станет слишком широкой, Material даёт горизонтальный скролл всей
   таблице (это аккуратнее, чем «<SSL-» / «Intercep» / «t>» в три строки). */
.md-typeset table:not([class]) td code,
.md-typeset table:not([class]) th code {
  white-space: nowrap;
}

/* ---------- Admonitions ---------- */
.md-typeset .admonition,
.md-typeset details {
  border: 1px solid var(--kx-border-2);
  border-radius: var(--kx-radius);
  background: var(--kx-bg-3);
  box-shadow: none;
  font-size: 0.8rem;
}
.md-typeset .admonition-title,
.md-typeset summary {
  background: var(--kx-bg-2);
  border-bottom: 1px solid var(--kx-border);
  font-family: "JetBrains Mono", monospace;
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.05em;
  color: var(--kx-fg-2);
  font-weight: 500;
}
.md-typeset .admonition.note,
.md-typeset details.note {
  border-color: var(--kx-navy);
}
.md-typeset .admonition.warning,
.md-typeset details.warning {
  border-color: var(--kx-accent);
}
.md-typeset .admonition.tip,
.md-typeset details.tip {
  border-color: var(--kx-green);
}

/* ---------- Search ---------- */
.md-search__form {
  background: var(--kx-bg-3);
  border: 1px solid var(--kx-border);
  border-radius: var(--kx-radius);
}
.md-search__input {
  font-family: "JetBrains Mono", monospace;
  font-size: 0.85rem;
}
.md-search__input::placeholder {
  color: var(--kx-fg-3);
}

/* ---------- TOC right rail ---------- */
.md-nav--secondary .md-nav__title {
  color: var(--kx-fg-3);
}
.md-nav--secondary .md-nav__link {
  font-size: 0.72rem;
  color: var(--kx-fg-3);
  border-left: 1px solid var(--kx-border);
  padding-left: 0.8em;
}
.md-nav--secondary .md-nav__link--active {
  color: var(--kx-accent);
  border-left-color: var(--kx-accent);
}

/* ---------- Content panel — subtle inset ---------- */
.md-content {
  background-color: var(--kx-bg);
}
.md-content__inner {
  margin-top: 1.2rem;
}

/* ---------- Footer ---------- */
.md-footer-meta {
  background: var(--kx-bg);
  border-top: 1px solid var(--kx-border);
}
.md-footer-meta__inner {
  font-family: "JetBrains Mono", monospace;
  font-size: 0.72rem;
  color: var(--kx-fg-3);
  text-transform: lowercase;
  letter-spacing: 0.03em;
}

/* ---------- Hero / index page polish ---------- */
.md-typeset h1:first-of-type::before {
  content: "// reference";
  display: block;
  font-family: "JetBrains Mono", monospace;
  font-size: 0.7rem;
  color: var(--kx-accent);
  text-transform: uppercase;
  letter-spacing: 0.15em;
  margin-bottom: 0.4rem;
  font-weight: 500;
  border: none;
  padding: 0;
}

/* ---------- Scrollbar (webkit) ---------- */
[data-md-color-scheme="slate"] ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
[data-md-color-scheme="slate"] ::-webkit-scrollbar-track {
  background: var(--kx-bg);
}
[data-md-color-scheme="slate"] ::-webkit-scrollbar-thumb {
  background: var(--kx-border-2);
  border-radius: 2px;
}
[data-md-color-scheme="slate"] ::-webkit-scrollbar-thumb:hover {
  background: var(--kx-fg-4);
}

/* ---------- Block quotes ---------- */
.md-typeset blockquote {
  color: var(--kx-fg-2);
  border-left: 2px solid var(--kx-accent);
  font-style: italic;
  font-family: "Instrument Serif", serif;
  font-size: 1.05rem;
}