/* 1111 — аудит оформления, проход 2 (1094), этап D-1: только CSS, разметка не меняется.
   Подключается inc/layout-d1.php на всех страницах после layout-c5 (приоритет 47), отдаётся напрямую, dist не пересобирается.
   Токены — по именам дизайн-системы (colors.css/typography.css); роли 1078/1090 (--line, --caption, --label-accent,
   --field-height) берутся с запасным значением, пока Z/AH не на стенде. Пункты: #54, #34, #49, #51, #52, #38, #39, #56, #37, #42. */

/* ---------- #54 мобильное меню: панель не размывала страницу ----------
   .gtyres-navigation.is-open лежит внутри .gtyres-nav-shell; у обоих backdrop-filter (mobile-life.css, @supports).
   По спецификации Filter Effects 2 элемент с backdrop-filter образует Backdrop Root: панель размывала только содержимое
   оболочки, а страница под ней просвечивала резко сквозь 78 % белого. При открытом меню оболочка становится непрозрачной
   (тот же цвет, что у запасного варианта без размытия), её backdrop-filter снимается — панель снова размывает страницу.
   Закрытая шапка не меняется. */
@media (max-width: 767px) {
  body.gtyres-menu-open .gtyres-nav-shell {
    background: var(--gt-mobile-glass-fallback, var(--gt-paper));
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

/* ---------- #34 плашка «Original in Russian» (EN-слой, site-language.js) ----------
   В карточках отзывов (.gt-review-card__excerpt) span был строчным и слипался с текстом («Original in RussianХочу…»).
   Роль caption: блочная подпись 12 px цветом --caption, отделена от текста. На тёмных поверхностях (просмотрщик) — свой цвет. */
.gtyres-original-language {
  display: block;
  margin: 0 0 4px;
  font: 400 var(--text-micro, 12px) / 1.4 var(--font-body, 'Montserrat', 'Noto Sans JP', -apple-system, 'Segoe UI', sans-serif);
  letter-spacing: 0;
  color: var(--caption, var(--gt-iron));
}
.gt-review-card__excerpt .gtyres-original-language { margin: 0 0 6px; }
.gtyres-life-viewer .gtyres-original-language { color: #bcbec1; }

/* ---------- #49 таблицы в текстовых секциях (.delivery-table-scroll) и смета мото (table.gt-moto-quote) ----------
   Было: ячейки с отступом 1 px, без линий, th по центру, caption 16 px по центру. Стало: линии --line, th слева на бумаге,
   caption как лейбл секции. Страница 1382 (вход 68, layout-c2) не затрагивается. На ≤ 700 px таблицы лендингов уже
   раскладываются карточками (contact-city-layouts.css) — правила ниже относятся к табличному режиму. */
/* max-height 650 px (site-flow.css) нужен длинной таблице направлений 1382; здесь с нормальными отступами строк он прятал
   итог сметы мото под внутреннюю прокрутку — снимается, остаётся только горизонтальная прокрутка при нехватке ширины */
body:not(.page-id-1382) .delivery-table-scroll { max-height: none; overflow-x: auto; overflow-y: visible; border-block: 1px solid var(--line, var(--gt-cloud)); }
body:not(.page-id-1382) .delivery-table-scroll table {
  width: 100%;
  border-collapse: collapse;
  color: var(--gt-black);
  font-size: 15px;
  line-height: 1.55;
}
body:not(.page-id-1382) .delivery-table-scroll caption {
  caption-side: top;
  padding: 0 0 12px;
  text-align: left;
  color: var(--label-accent, var(--gt-red-dark));
  font: 600 var(--text-micro, 12px) / 1.4 var(--font-body, 'Montserrat', 'Noto Sans JP', -apple-system, 'Segoe UI', sans-serif);
  letter-spacing: .06em;
}
body:not(.page-id-1382) .delivery-table-scroll :is(th, td) {
  padding: 12px 14px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--line, var(--gt-cloud));
}
body:not(.page-id-1382) .delivery-table-scroll :is(th, td):first-child { padding-left: 0; }
body:not(.page-id-1382) .delivery-table-scroll :is(th, td):last-child { padding-right: 0; }
body:not(.page-id-1382) .delivery-table-scroll thead th {
  padding-top: 10px;
  padding-bottom: 10px;
  color: var(--caption, var(--gt-iron));
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: .02em;
}
body:not(.page-id-1382) .delivery-table-scroll tbody th { font-weight: 600; }
body:not(.page-id-1382) .delivery-table-scroll tbody tr:last-child :is(th, td) { border-bottom: 0; }
/* смета мото: числа справа табличными цифрами, группы на бумаге, итог линией */
.delivery-table-scroll table.gt-moto-quote td:last-child {
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.delivery-table-scroll table.gt-moto-quote tr.gt-moto-quote__group td { background: var(--gt-paper); }
.delivery-table-scroll table.gt-moto-quote tr.gt-moto-quote__group td:first-child { padding-left: 14px; }
.delivery-table-scroll table.gt-moto-quote tr.gt-moto-quote__total td {
  padding-top: 16px;
  border-top: 2px solid var(--gt-black);
  border-bottom: 0;
  font-size: 17px;
}
/* горизонтальная прокрутка с тенью у края — только когда таблица шире контейнера (табличный режим на планшетах) */
@media (min-width: 701px) {
  body:not(.page-id-1382) .delivery-table-scroll {
    background:
      linear-gradient(to right, var(--gt-white) 30%, rgba(255, 255, 255, 0)) 0 0 / 40px 100% no-repeat local,
      linear-gradient(to left, var(--gt-white) 30%, rgba(255, 255, 255, 0)) 100% 0 / 40px 100% no-repeat local,
      radial-gradient(farthest-side at 0 50%, rgba(17, 17, 17, .14), rgba(17, 17, 17, 0)) 0 0 / 14px 100% no-repeat scroll,
      radial-gradient(farthest-side at 100% 50%, rgba(17, 17, 17, .14), rgba(17, 17, 17, 0)) 100% 0 / 14px 100% no-repeat scroll;
  }
}

/* ---------- #51 арифметическая проверка форм заявки (.captcha-block-wrapp, появляется после первой попытки) ----------
   Было: <p class="captcha-question">10 + 10</p> 12 px шириной 38 px рядом с полем на всю ширину, без подписи.
   Стало: подпись-caption, пример 16/600, поле 156 px (плейсхолдер «Введите ответ» целиком) — в одну строку; высота поля как у соседних (--field-height, 1090). */
.form .captcha-block { margin: 0 0 12px; }
.form .captcha-block-wrapp {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
}
.form .captcha-block-wrapp .captcha-question {
  flex: 0 0 auto;
  margin: 0;
  color: var(--gt-black);
  font: 600 16px / 1.3 var(--font-body, 'Montserrat', 'Noto Sans JP', -apple-system, 'Segoe UI', sans-serif);
  white-space: nowrap;
}
.form .captcha-block-wrapp .captcha-question::before {
  content: 'Проверка: сколько будет';
  display: block;
  margin: 0 0 2px;
  color: var(--caption, var(--gt-iron));
  font: 400 var(--text-micro, 12px) / 1.4 var(--font-body, 'Montserrat', 'Noto Sans JP', -apple-system, 'Segoe UI', sans-serif);
}
html:lang(en) .form .captcha-block-wrapp .captcha-question::before { content: 'Check: what is'; }
.form .captcha-block-wrapp .captcha-question::after { content: ' = ?'; }
/* вид поля (фон, рамка, радиус, фокус) — от общих правил полей темы/1090; здесь только ширина, высота и место в строке */
.form .captcha-block-wrapp input[name="captcha_answer"] {
  flex: 0 0 156px;
  width: 156px;
  min-width: 0;
  height: var(--field-height, 50px);
  min-height: var(--field-height, 50px);
  margin: 0;
  padding-block: 0;
  align-self: flex-end;
  font-size: var(--field-text, 16px);
}
.form .form-error-captcha { margin-top: 6px; }

/* ---------- #52 модальная форма: статус отправки под кнопкой; на 390 — поля в одну колонку ----------
   .form-error-success лежит внутри .form-fields-wrapp (между полями и согласием); обёртка без собственных стилей
   раскрывается (display: contents), и статус переставляется последним элементом колонки — сразу под кнопкой. */
#main-form.r56-contact .application-form-column .form > .form-fields-wrapp { display: contents; }
#main-form.r56-contact .application-form-column .form > .form-fields-wrapp > .form-fields { width: 100%; order: 0; }
#main-form.r56-contact .application-form-column .form > .form-fields-wrapp > .form-error-success {
  order: 3;
  width: 100%;
  margin: 8px 0 0;
}
#main-form.r56-contact .application-form-column .form > .form-fields-wrapp > .form-error-success:empty { display: none; }
#main-form.r56-contact .application-form-column .form > .checkbox-wrapper { order: 1; }
#main-form.r56-contact .application-form-column .form > .form-button { order: 2; }
@media (max-width: 480px) {
  #main-form.r56-contact .form-fields { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- #38 публикация с вертикальным видео (.publication-layout--video) ----------
   figure.article-cover в сетке 330 + 580 получал margin:0 auto (общее правило обложки): в grid авто-поля ужимали
   figure до ширины постера 180 px. В сетке figure занимает свою колонку целиком, видео — её ширину. */
.gt-journal-edition .publication-layout--video > .article-cover {
  width: 100%;
  max-width: none;
  margin: 0;
  justify-self: stretch;
}
.gt-journal-edition .publication-layout--video > .article-cover video {
  display: block;
  width: 100%;
  height: auto;
  max-height: 640px;
  background: var(--gt-graphite);
}
@media (max-width: 767px) {
  .gt-journal-edition .publication-layout--video > .article-cover { width: min(360px, 100%); margin-inline: auto; }
}

/* ---------- #39 альбом публикации с портретными кадрами (.article-cover--album) ----------
   Кадр 960×1280 в сцене 980×500 с object-fit: contain оставлял по ~300 px бумаги с боков. Сцена на графите, как в
   просмотрщике, и выше (до 640 px): портрет крупнее, боковые поля читаются как фон сцены, а не пустота; альбомные
   кадры по-прежнему на всю ширину. */
.gt-journal-edition .article-cover--album .gt-album__viewport { background: var(--gt-graphite); }
.gt-journal-edition .article-cover--album .gt-album__slide :is(img, video) {
  max-height: min(72vh, 640px);
  max-height: min(72dvh, 640px); /* 1103 правило C: vh перед dvh (Safari < 15.4, Chrome < 108) */
  background: transparent;
}
@media (max-width: 767px) {
  .gt-journal-edition .article-cover--album .gt-album__slide :is(img, video) { max-height: 60vh; max-height: 60dvh; }
}

/* ---------- #56 просмотрщик историй на 390: нижний ряд действий в одну строку ----------
   Ссылки «Публикация в Telegram» и «Открыть полный материал» ломались на 2–4 строки, ряд разновысокий.
   На ≤ 480 px: диалог на всю ширину минус 12 px, ссылки в одну строку 10 px, «Написать нам» — круглая иконка 44×44
   (текст остаётся для скринридера: font-size 0). */
@media (max-width: 480px) {
  .gtyres-life-viewer { width: calc(100vw - 12px); }
  .gtyres-life-viewer__footer { flex-wrap: nowrap; gap: 8px; padding-inline: 10px; }
  .gtyres-life-viewer__footer a.gtyres-life-viewer__source {
    display: block;
    flex: 0 1 auto;
    min-width: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 44px;
    font-size: 10px;
  }
  .gtyres-life-viewer__footer a.gtyres-life-viewer__source:first-child { margin-right: auto; }
  .gtyres-life-viewer__footer .gtyres-life-viewer__contact {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    padding: 0;
    justify-content: center;
    gap: 0;
    border-radius: 50%;
    font-size: 0;
  }
  .gtyres-life-viewer__footer .gtyres-life-viewer__contact svg { width: 20px; height: 20px; }
}

/* ---------- #37 таблица версий kei на 390 (.gt-kei-table-wrap, стили страницы — в контенте) ----------
   Таблица 620 px в обёртке 350 px прокручивалась без подсказки. Тень у правого края + подпись над таблицей
   (как в статьях журнала); подпись — только для русской страницы. Специфичность выше встроенного стиля контента. */
@media (max-width: 700px) {
  body .gt-kei-page .gt-kei-table-wrap.gt-kei-table-wrap {
    position: relative;
    background:
      linear-gradient(to right, var(--gt-white) 30%, rgba(255, 255, 255, 0)) 0 0 / 40px 100% no-repeat local,
      linear-gradient(to left, var(--gt-white) 30%, rgba(255, 255, 255, 0)) 100% 0 / 40px 100% no-repeat local,
      radial-gradient(farthest-side at 0 50%, rgba(17, 17, 17, .16), rgba(17, 17, 17, 0)) 0 0 / 14px 100% no-repeat scroll,
      radial-gradient(farthest-side at 100% 50%, rgba(17, 17, 17, .16), rgba(17, 17, 17, 0)) 100% 0 / 14px 100% no-repeat scroll;
  }
  html:lang(ru) body .gt-kei-page .gt-kei-table-wrap.gt-kei-table-wrap::before {
    content: 'Таблицу можно прокрутить вправо';
    position: sticky;
    left: 0;
    display: block;
    width: max-content;
    margin: 0 0 8px;
    color: var(--caption, var(--gt-iron));
    font: 400 var(--text-micro, 12px) / 1.4 var(--font-body, 'Montserrat', 'Noto Sans JP', -apple-system, 'Segoe UI', sans-serif);
  }
}

/* ---------- #42 пустой результат поиска каталога (.gt-catalog-empty) ----------
   Ссылка «сбросьте фильтры» получала display:block от общего .gt-catalog-text-link (carsbase-catalog.css) и рвала
   предложение на три строки. Внутри абзаца — строчная. Файлы плагина не трогаются: правило темы поверх. */
.gt-catalog-empty p .gt-catalog-text-link,
.gt-catalog-empty p a.gt-catalog-text-link {
  display: inline;
  width: auto;
  padding: 0;
  font-size: inherit;
}