/* pokova-pro Л7: ГОСТ-хабы + калькуляторы. Токены — design/tokens.css (цвет, шрифт сети pokova). */
/* 17.10.2026 (п.5 замечания оркестратора): крошки .st-crumbs (сетевой next.css) — ширина
   var(--wrap,1240px) + padding 20px. Наш .pk-l7-hub был 920px/16px — левый край текста не
   совпадал с левым краем крошек. Выравниваем внешний блок по той же сетке, текст — во
   внутренней обёртке .pk-l7-inner (920px), таблица/сетка товаров — на всю ширину. */
.pk-l7-hub, .pk-l7-calc { padding: 24px 20px 48px; max-width: var(--wrap, 1240px); box-sizing: border-box; margin: 0 auto; }
.pk-l7-inner { max-width: 920px; }
/* В7-гейт: тот же токен, что у .page-title (tpl-list.css) — ГОСТ-хаб/калькулятор это тоже
   «раздел», без !important его бил глобальный h1 сети (next.css), как у листинга/карточки. */
.pk-l7-hub h1, .pk-l7-calc h1 {
  margin: 0 0 12px;
  font-size: var(--pk-h1-section-size) !important;
  line-height: var(--pk-h1-section-lh) !important;
  /* В7-гейт (В7.2): точечно 700, как .page-title (tpl-list.css) — не трогаем общий токен. */
  font-weight: 700 !important;
}
/* В7-гейт: тот же баг, что у H1 — plain h2 ГОСТ-хаба/калькулятора не был покрыт ни одним
   локальным правилом, брал глобальный h2 сети (34px). */
.pk-l7-hub h2, .pk-l7-calc h2 {
  font-size: var(--pk-h2-section-size) !important;
  line-height: var(--pk-h2-section-lh) !important;
  font-weight: var(--pk-h2-section-w) !important;
}
.pk-l7-lead { color: var(--pk-graphite, #15191C); opacity: .85; font-size: 1.05rem; line-height: 1.5; margin: 0 0 20px; }
.pk-l7-table-wrap { overflow-x: auto; margin: 16px 0; }
.pk-l7-dims { width: 100%; border-collapse: collapse; font-size: .92rem; }
.pk-l7-dims th, .pk-l7-dims td { padding: 8px 10px; border-bottom: 1px solid #DCE1E3; text-align: left; }
.pk-l7-dims thead th { background: var(--pk-tint, #FBF0DC); font-weight: 600; }
.pk-l7-links { list-style: none; margin: 8px 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.pk-l7-links li { background: #F7F8F8; border-radius: 10px; padding: 10px 14px; }
.pk-l7-links a { color: var(--pk-accent, #B5790F); font-weight: 600; text-decoration: none; }
.pk-l7-count { color: #526068; font-size: .85rem; margin-left: 6px; }
.pk-l7-note { margin-top: 24px; font-size: .9rem; color: #555; }
.pk-l7-faq dt { font-weight: 600; margin-top: 12px; }
.pk-l7-faq dd { margin: 4px 0 0; color: #444; }

/* сетка товаров (п.3): 3-8 карточек вместо текстовых ссылок */
.pk-l7-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; margin: 16px 0; }
.pk-l7-card { background: #F7F8F8; border-radius: 10px; overflow: hidden; text-decoration: none; color: inherit; display: block; }
.pk-l7-card img { width: 100%; height: 120px; object-fit: contain; background: #fff; display: block; }
.pk-l7-card-name { padding: 8px 10px; font-size: .88rem; font-weight: 600; color: var(--pk-graphite, #15191C); }
.pk-l7-card-count { padding: 0 10px 10px; font-size: .8rem; color: #526068; }

/* «Показать все» (п.2): нативный <details>, без JS */
.pk-l7-more summary { cursor: pointer; font-weight: 600; color: var(--pk-accent, #B5790F); margin: 10px 0; list-style: none; }
.pk-l7-more summary::-webkit-details-marker { display: none; }
.pk-l7-more[open] summary { margin-bottom: 4px; }

/* Калькулятор массы/цены поковки (волна 2 п.9, 20.10.2026, заменил мёртвый крепёжный
   мультистроковый калькулятор mkind — .pk-l7-row/.pk-l7-calc-rows больше нигде не используются,
   проверено grep по теме). */
.pk-fc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 16px 0; }
.pk-fc-field { display: flex; flex-direction: column; gap: 6px; font-size: .9rem; font-weight: 600; color: var(--pk-graphite, #15191C); }
.pk-fc-field select, .pk-fc-field input { padding: 10px 12px; border: 1px solid #ddd; border-radius: 8px; font: inherit; font-weight: 400; }
.pk-fc-group-hint { font-size: .85rem; color: #555; margin: 4px 0 0; }
.pk-fc-result { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 16px; font-size: 1.15rem; font-weight: 700; color: var(--pk-accent, #B5790F); }

/* Гейт скорости 20.10.2026: #pk-fc-root пуст до исполнения l7-calc.js (6 полей заполняются
   innerHTML), пустой -> заполненный давал CLS 0.246 (сдвиг всего, что ниже). min-height —
   оценка по реальным размерам .pk-fc-field/.pk-fc-result выше (не измерено в браузере —
   сайты сети браузером не открываем, см. правило); after rowover корректировать по факту. */
#pk-fc-root { min-height: 240px; }
@media (max-width: 760px) {
  .pk-fc-grid { grid-template-columns: repeat(2, 1fr); }
  #pk-fc-root { min-height: 310px; }
}
@media (max-width: 480px) {
  .pk-fc-grid { grid-template-columns: 1fr; }
  #pk-fc-root { min-height: 540px; }
}

/* 17.10.2026 (Л9): сетевой плавающий .st-fab (телефон + «Запросить счёт», bottom:12-18px,
   stalverk.css) на мобильном калькуляторе ложится прямо на поле «Количество»/селект строки —
   уже на первом экране, без скролла (короткая страница). Телефон остаётся в шапке (Д1), своего
   CTA-дубля на этой странице нет — прячем так же, как уже сделано на /cart//checkout/
   (design/tpl-svc.css), не трогая сетевой файл. */
body:has(.pk-l7-calc) .st-fab { display: none !important; }

/* п.2 замечания оркестратора: на 375 таблица — карточки, без горизонтального скролла.
   Найдено curl+CDP: .pk-btn (сетевой pk-header.css) — white-space:nowrap, с длинным текстом
   «Калькулятор веса металла по этой таблице» давал document.scrollWidth 401 > 375 — переопределяем
   только в Л7, кнопку в хедере/карточке не трогаем. */
.pk-l7-hub .pk-btn, .pk-l7-calc .pk-btn { white-space: normal; max-width: 100%; height: auto; text-align: center; }
@media (max-width: 480px) {
  .pk-l7-table-wrap { overflow-x: visible; }
  .pk-l7-dims { display: block; }
  .pk-l7-dims thead { display: none; }
  .pk-l7-dims tbody { display: block; }
  .pk-l7-dims tr { display: block; margin: 0 0 10px; padding: 10px 12px; background: #F7F8F8; border-radius: 10px; }
  .pk-l7-dims td { display: flex; justify-content: space-between; gap: 10px; padding: 4px 0; border-bottom: none; text-align: right; }
  .pk-l7-dims td[data-label]::before { content: attr(data-label) ":"; font-weight: 600; color: #777; text-align: left; }
  .pk-l7-dims td a { text-align: right; }
}
