/* Документація в одязі порталу nyshporka.online.
 *
 * 🔴 Кольорів тут немає. Вони приходять із `brand.css`, згенерованого з
 * `brand.yaml` (`render_docs`): там і змінні Material `--md-*`, і вся група
 * порталу `--pt-*`. Вписаний сюди hex розійшовся б із порталом тихо — саме так
 * колись розійшлися три поверхні (`#7a4f2b`).
 *
 * Шрифти — ті самі файли, що роздає портал, зі свого домену: `theme.font:
 * false` у mkdocs.yml вимикає Google Fonts. Запит до чужого CDN на кожне
 * відкриття сторінки порушував би обіцянку `PRIVACY.md` і CSP порталу. */

@font-face {
  font-family: "Playfair Display";
  src: url("../assets/fonts/playfair-cyrillic.woff2") format("woff2");
  font-weight: 400 900; font-display: swap;
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Playfair Display";
  src: url("../assets/fonts/playfair-latin.woff2") format("woff2");
  font-weight: 400 900; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/inter-cyrillic.woff2") format("woff2");
  font-weight: 100 900; font-display: swap;
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/inter-latin.woff2") format("woff2");
  font-weight: 100 900; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../assets/fonts/plex-mono-400-cyrillic.woff2") format("woff2");
  font-weight: 400; font-display: swap;
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../assets/fonts/plex-mono-400-latin.woff2") format("woff2");
  font-weight: 400; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../assets/fonts/plex-mono-500-cyrillic.woff2") format("woff2");
  font-weight: 500; font-display: swap;
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

:root {
  --md-text-font: "Inter";
  --md-code-font: "IBM Plex Mono";
}

/* ── шапка: як `.shapka` порталу ──────────────────────────────────────── */
.md-header {
  background: color-mix(in srgb, var(--pt-s0) 94%, transparent);
  color: var(--pt-fg);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--pt-line);
  box-shadow: none;
}
.md-header--shadow { box-shadow: none; }
.md-header__inner { height: 3.6rem; gap: .25rem; }
.md-header__button { color: var(--pt-fg-2); }
.md-header__button:hover { color: var(--pt-primary); opacity: 1; }
.portal-logo { display: flex; align-items: center; margin: 0 .6rem 0 .2rem; flex: none; }
.portal-logo img { height: 2.6rem; width: auto; display: block; }

.portal-rozdily { display: none; align-items: center; gap: .1rem; flex: 1; }
@media screen and (min-width: 60em) { .portal-rozdily { display: flex; } }
.portal-rozdily a {
  position: relative; padding: .45rem .7rem; border-radius: 6px;
  font-size: .78rem; color: var(--pt-fg-2);
}
.portal-rozdily a:hover { color: var(--pt-fg); background: color-mix(in srgb, var(--pt-primary) 7%, transparent); }
.portal-rozdily a[aria-current="page"] { color: var(--pt-primary); font-weight: 600; }
.portal-rozdily a[aria-current="page"]::after {
  content: ""; position: absolute; left: .7rem; right: .7rem; bottom: -.72rem;
  height: 2px; border-radius: 2px; background: var(--pt-honey);
}
@media screen and (max-width: 59.9375em) {
  .md-header__title[hidden] { display: flex !important; flex: 1; visibility: hidden; }
}

/* Пошук — поле-пігулка з UI kit порталу. */
.md-search__form {
  background: var(--pt-s3); border: 1px solid var(--pt-line-2);
  border-radius: 999px; box-shadow: none;
}
.md-search__form:hover { background: var(--pt-s3); border-color: var(--pt-line-3); }
.md-search__input { color: var(--pt-fg); }
.md-search__input::placeholder { color: var(--pt-fg-4); }
.md-search__icon { color: var(--pt-fg-4); }
[data-md-toggle="search"]:checked ~ .md-header .md-search__form { border-radius: 12px 12px 0 0; }
.md-search__output { border-radius: 0 0 12px 12px; }

/* ── бічні меню ─────────────────────────────────────────────────────── */
.md-nav { font-size: .72rem; }
.md-nav__title { color: var(--pt-fg-3); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; font-size: .62rem; }
.md-nav__link { color: var(--pt-fg-2); }
.md-nav__link:hover, .md-nav__link:focus { color: var(--pt-primary); }
.md-nav__link--active, .md-nav__item .md-nav__link--active { color: var(--pt-primary); font-weight: 600; }
.md-nav--primary .md-nav__title { background: var(--pt-s1); color: var(--pt-fg); }
.md-sidebar__scrollwrap { scrollbar-color: var(--pt-line-2) transparent; }

/* ── текст ──────────────────────────────────────────────────────────── */
.md-typeset { color: var(--pt-fg); }
.md-typeset h1, .md-typeset h2, .md-typeset h3 {
  font-family: "Playfair Display", Georgia, serif;
  color: var(--pt-fg); letter-spacing: -.005em;
}
.md-typeset h1 { font-weight: 800; font-size: 2.1em; margin-bottom: .8em; }
.md-typeset h2 { font-weight: 700; }
.md-typeset h3 { font-weight: 700; }
.md-typeset a { color: var(--pt-primary); text-decoration: underline; text-underline-offset: 2px; text-decoration-color: color-mix(in srgb, var(--pt-primary) 40%, transparent); }
.md-typeset a:hover { color: var(--pt-primary-2); text-decoration-color: currentColor; }
.md-typeset .headerlink { text-decoration: none; }
.md-typeset hr { border-color: var(--pt-line); }

/* Код — як блок команди порталу. */
.md-typeset code { background: var(--pt-s1); color: var(--pt-fg); border-radius: 4px; }
.md-typeset pre > code {
  background: var(--pt-s0); border: 1px solid var(--pt-line-2); border-radius: 12px;
}
.md-clipboard { color: var(--pt-fg-4); }
.md-clipboard:hover, .md-clipboard:focus { color: var(--pt-primary); }

/* Плашки — як `.plashka` порталу: тонка рамка, м'який радіус, без тіні. */
.md-typeset .admonition, .md-typeset details {
  border-radius: 12px; border-width: 1px; box-shadow: none;
  background: var(--pt-s2); font-size: .8rem;
}
.md-typeset .admonition-title, .md-typeset summary { border-radius: 11px 11px 0 0; }
.md-typeset details:not([open]) > summary { border-radius: 11px; }

.md-typeset table:not([class]) {
  border: 1px solid var(--pt-line); border-radius: 12px; overflow: hidden;
  box-shadow: none; font-size: .74rem;
}
.md-typeset table:not([class]) th { background: var(--pt-s1); color: var(--pt-fg); }
.md-typeset table:not([class]) td { border-top: 1px solid var(--pt-line); }

.md-typeset .tabbed-labels > label { color: var(--pt-fg-3); }
.md-typeset .tabbed-labels > label:hover { color: var(--pt-primary); }

/* ── підвал: колонки порталу ────────────────────────────────────────── */
.md-footer { background: var(--pt-s1); color: var(--pt-fg); border-top: 1px solid var(--pt-line); }
.md-footer__link { color: var(--pt-fg-2); }
.md-footer__link:hover { color: var(--pt-primary); opacity: 1; }
.md-footer__direction { color: var(--pt-fg-4); }
.portal-pidval { background: var(--pt-s0); border-top: 1px solid var(--pt-line); }
.portal-pidval__inner {
  display: grid; gap: 1.6rem; padding: 2rem .8rem; font-size: .72rem;
  grid-template-columns: 1fr;
}
@media screen and (min-width: 45em) { .portal-pidval__inner { grid-template-columns: 1.4fr 1fr 1fr 1fr; } }
.portal-pidval__znak { display: flex; gap: .8rem; align-items: flex-start; }
.portal-pidval__znak img { width: 3.6rem; height: auto; flex: none; }
.portal-pidval__nazva { font-family: "Playfair Display", Georgia, serif; font-weight: 700; font-size: .95rem; color: var(--pt-primary); }
.portal-pidval p { margin: .2rem 0 0; color: var(--pt-fg-3); }
.portal-pidval h2 {
  margin: 0 0 .5rem; font-size: .6rem; font-weight: 600; letter-spacing: .08em;
  text-transform: uppercase; color: var(--pt-fg-3);
}
.portal-pidval ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; color: var(--pt-fg-3); }
.portal-pidval a { color: var(--pt-fg-3); }
.portal-pidval a:hover { color: var(--pt-primary); }

:focus-visible { outline: 2px solid var(--pt-focus); outline-offset: 2px; }
