/* ═══════════════════════════════════════════════════════════════════════════
   GOOGLE DOCS LOOK — подключается после extra.css и перекрывает его.
   Серый холст, белый лист по центру, типографика и таблицы как в Google Docs.
   Правое поле под листом оставлено свободным — туда встанут комментарии.
   ═══════════════════════════════════════════════════════════════════════════ */

:root,
[data-md-color-scheme="default"] {
  --gd-canvas:        #f9fbfd;
  --gd-page:          #ffffff;
  --gd-page-shadow:   0 1px 3px 1px rgba(60,64,67,.15), 0 1px 2px rgba(60,64,67,.3);
  --gd-text:          #000000;
  --gd-heading:       #ff0000;
  --gd-text-h4:       #666666;
  --gd-ui-text:       #444746;
  --gd-link:          #1155cc;
  --gd-border:        #000000;
  --gd-th-bg:         #f3f3f3;
  --gd-code-bg:       #f1f3f4;
  --gd-active-bg:     #d3e3fd;
  --gd-active-text:   #041e49;
  --gd-hover-bg:      rgba(68,71,70,.08);
  --gd-search-bg:     #e9eef6;

  /* Material: шапка и фон страницы — цвет холста, текст шапки тёмный */
  --md-primary-fg-color:        var(--gd-canvas);
  --md-primary-fg-color--light: var(--gd-canvas);
  --md-primary-fg-color--dark:  var(--gd-canvas);
  --md-primary-bg-color:        #1f1f1f;
  --md-primary-bg-color--light: #444746;
  --md-default-bg-color:        var(--gd-canvas);
  --md-accent-fg-color:         var(--gd-link);
  --md-footer-bg-color:         var(--gd-canvas);
  --md-footer-bg-color--dark:   var(--gd-canvas);
  --md-footer-fg-color:         #1f1f1f;
  --md-footer-fg-color--light:  #444746;
  --md-footer-fg-color--lighter:#747775;
}

[data-md-color-scheme="slate"] {
  --gd-canvas:        #1b1c1e;
  --gd-page:          #202124;
  --gd-page-shadow:   0 1px 3px 1px rgba(0,0,0,.4), 0 1px 2px rgba(0,0,0,.5);
  --gd-text:          #e8eaed;
  --gd-heading:       #ff6b6b;
  --gd-text-h4:       #bdc1c6;
  --gd-ui-text:       #c4c7c5;
  --gd-link:          #8ab4f8;
  --gd-border:        #5f6368;
  --gd-th-bg:         #2a2b2e;
  --gd-code-bg:       #2d2e31;
  --gd-active-bg:     #004a77;
  --gd-active-text:   #c2e7ff;
  --gd-hover-bg:      rgba(232,234,237,.08);
  --gd-search-bg:     #2d2e31;

  --md-primary-fg-color:        var(--gd-canvas);
  --md-primary-fg-color--light: var(--gd-canvas);
  --md-primary-fg-color--dark:  var(--gd-canvas);
  --md-primary-bg-color:        #e8eaed;
  --md-primary-bg-color--light: #c4c7c5;
  --md-default-bg-color:        var(--gd-canvas);
  --md-accent-fg-color:         var(--gd-link);
  --md-footer-bg-color:         var(--gd-canvas);
  --md-footer-bg-color--dark:   var(--gd-canvas);
  --md-footer-fg-color:         #e8eaed;
  --md-footer-fg-color--light:  #c4c7c5;
  --md-footer-fg-color--lighter:#9aa0a6;
}

body { background-color: var(--gd-canvas); }


/* ── Шапка и вкладки ─────────────────────────────────────────────────────── */

.md-header,
.md-header--shadow { box-shadow: none; }

.md-tabs {
  border-bottom: 1px solid rgba(0,0,0,.08);
}

[data-md-color-scheme="slate"] .md-tabs { border-bottom-color: rgba(255,255,255,.08); }

.md-tabs__link { opacity: .75; }
.md-tabs__item--active .md-tabs__link { opacity: 1; font-weight: 500; }

@media screen and (min-width: 60em) {
  .md-search__form {
    background-color: var(--gd-search-bg);
    border-radius: 24px;
  }
  .md-search__form:hover { background-color: var(--gd-search-bg); }
  .md-search__input { color: var(--md-primary-bg-color); }
  .md-search__input::placeholder { color: var(--gd-ui-text); }
}


/* ── Раскладка: холст + лист ─────────────────────────────────────────────── */

.md-main__inner.md-grid { max-width: none; }

.md-content { min-width: 0; }

.md-content__inner {
  box-sizing: border-box;
  max-width: 816px;            /* ширина листа Letter/A4 в Google Docs */
  margin: 24px auto 48px !important;
  padding: 72px 96px 96px !important;
  background: var(--gd-page);
  box-shadow: var(--gd-page-shadow);
}

.md-content__inner::before { display: none; }

/* Страницы со Swagger — лист шире, иначе API не помещается */
.md-content__inner:has(.swagger-ui) { max-width: 1120px; }

@media screen and (max-width: 76.1875em) {
  .md-content__inner { padding: 56px 64px 72px !important; }
}

@media screen and (max-width: 44.9375em) {
  .md-content__inner {
    margin: 0 !important;
    padding: 24px 16px 40px !important;
    box-shadow: none;
  }
}


/* ── Типографика ─────────────────────────────────────────────────────────── */

.md-typeset {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  font-size: 11pt;
  line-height: 1.5;
  color: var(--gd-text);
}

.md-typeset p { margin: 0 0 .7em; }

/* Заголовки как в Google-мастере спек (стили docx «11. Площадка»):
   h1 = Title 23pt, h2 = Heading 1 20pt, h3 = Heading 2 16pt, h4 = Heading 3 13pt —
   жирные красные; h5 = Heading 4 (процедура) 12pt жирный; h6 = Heading 6 11pt курсив */
.md-typeset h1, .md-typeset h1 strong,
.md-typeset h2, .md-typeset h2 strong,
.md-typeset h3, .md-typeset h3 strong,
.md-typeset h4, .md-typeset h4 strong,
.md-typeset h5, .md-typeset h5 strong,
.md-typeset h6, .md-typeset h6 strong {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  line-height: 1.15;
  letter-spacing: 0;
  text-transform: none;
  background: none;
  border: none;
  border-radius: 0;
  padding: 0;
}

.md-typeset h1,
.md-typeset h1 strong {
  font-size: 23pt;
  font-weight: 700;
  color: var(--gd-heading);
  margin: 0 0 3pt;
}

.md-typeset h2,
.md-typeset h2 strong {
  font-size: 20pt;
  font-weight: 700;
  color: var(--gd-heading);
  margin: 10pt 0 6pt !important;
}

.md-typeset h3,
.md-typeset h3 strong {
  font-size: 16pt;
  font-weight: 700;
  color: var(--gd-heading);
  margin: 20pt 0 6pt !important;
}

.md-typeset h4,
.md-typeset h4 strong {
  font-size: 13pt;
  font-weight: 700;
  color: var(--gd-heading);
  margin: 10pt 0 10pt !important;
}

/* h5 — процедура: без плашки, «Заголовок 4» */
.md-typeset h5,
.md-typeset h5 strong {
  font-size: 12pt;
  font-weight: 700;
  color: var(--gd-text);
  margin: 10pt 0 4pt !important;
}

.md-typeset h6,
.md-typeset h6 strong {
  font-size: 11pt;
  font-style: italic;
  font-weight: 400;
  color: var(--gd-text-h4);
  margin: 12pt 0 4pt !important;
}

.md-typeset h5 + ol,
.md-typeset h5 + p + ol {
  background: none;
  border: none;
  border-radius: 0;
  padding: 0;
  margin-top: .3em !important;
}

.md-typeset strong { font-weight: 700; }


/* ── Ссылки ──────────────────────────────────────────────────────────────── */

.md-typeset a,
.md-typeset a:hover {
  color: var(--gd-link);
  text-decoration: underline;
}

/* якорь «¶» у заголовков — не подчёркивать */
.md-typeset .headerlink { text-decoration: none; }


/* ── Код ─────────────────────────────────────────────────────────────────── */

.md-typeset code {
  background-color: var(--gd-code-bg);
  font-size: .9em;
}


/* ── Таблицы: чёрная сетка 1pt, без теней и полос ────────────────────────── */

.md-typeset__table,
.md-typeset table:not([class]),
.md-typeset table:not([class]):has(th:first-child) {
  border-radius: 0;
  box-shadow: none;
  border: none;
  margin: 1em 0 1.4em;
  font-size: 11pt;
}

.md-typeset table:not([class]) th,
.md-typeset table:not([class]) td {
  border: 1px solid var(--gd-border);
  padding: 5pt 7pt;
}

.md-typeset table:not([class]) th {
  background-color: var(--gd-th-bg);
  color: var(--gd-text);
  font-weight: 700;
}

.md-typeset table:not([class]) tbody tr:nth-child(even) { background: none; }
.md-typeset table:not([class]) tbody tr:hover { background: none; box-shadow: none; }

/* Таблица по ширине листа, текст переносится (как в Google Docs), без горизонтальной прокрутки */
.md-typeset table:not([class]),
.md-typeset table:not([class]):has(th:first-child) {
  display: table;
  width: 100%;
  min-width: 0;
  table-layout: auto;
}

.md-typeset table:not([class]) th,
.md-typeset table:not([class]) td {
  min-width: 0;                /* Material ставит th min-width: 5rem — 6 колонок не влезают в лист */
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: auto;
  -webkit-hyphens: auto;
}

/* table-wrap.js: таблица всё равно шире листа — переносим где угодно, лишь бы влезла */
.md-typeset table[data-squeeze] th,
.md-typeset table[data-squeeze] td { overflow-wrap: anywhere; }

/* История изменений: серые строки-шапки записи, текст записи на всю ширину */
.md-typeset table[data-changelog-done] tr.changelog-table__head > th,
.md-typeset table[data-changelog-done] tr.changelog-table__head > td {
  background-color: var(--gd-th-bg);
  font-weight: 400;
  vertical-align: top;
}

.md-typeset table[data-changelog-done] tr.changelog-table__body > td {
  background: var(--gd-page);
}


/* ── Левая панель: как «Вкладки и структура документа» ───────────────────── */

.md-sidebar--primary .md-nav__link {
  color: var(--gd-ui-text);
}

.md-sidebar--primary .md-nav__link:hover {
  color: var(--gd-text);
}

.md-sidebar--primary .md-nav__link--active,
.md-sidebar--primary .md-nav__item .md-nav__link--active {
  color: var(--gd-active-text);
  font-weight: 500;
}

/* текущая страница — голубая «пилюля» */
.md-sidebar--primary .md-nav__item--active > .md-nav__link[href]:not([href^="#"]),
.md-sidebar--primary .md-nav__item--active > label > .md-nav__link[href]:not([href^="#"]) {
  background: var(--gd-active-bg);
  color: var(--gd-active-text);
  border-radius: 16px;
  padding: 2px 10px;
  margin-left: -10px;
}


/* ── Карточки главной и прогресс — на белом листе ────────────────────────── */

.doc-card,
.progress-stat {
  background: var(--gd-page);
  border-color: #dadce0;
  box-shadow: none;
}

[data-md-color-scheme="slate"] .doc-card,
[data-md-color-scheme="slate"] .progress-stat {
  background: var(--gd-page);
  border-color: #3c4043;
}


/* ── Swagger на листе ────────────────────────────────────────────────────── */

.swagger-ui .information-container,
.swagger-ui .scheme-container { background: transparent; }
