/* ===== BRT redesign: content v1 (2026-09-03) — таблиці в картках на мобільному ===== */
/*
 * Проблема: таблиці в notes рецепта (WPRM, шаблон chic) верстаються table-layout:auto,
 * а обгортка .wprm-recipe має overflow:hidden. Три колонки з довгими українськими
 * словами («Безалкогольний», «Скандинавський») дають мінімальну ширину ~410px при
 * контейнері 325px на 375-екрані, і таблицю просто зрізає (глінтвейн 9779, таблиця 4).
 *
 * Рішення: таблиця завжди 100% контейнера, а довгі слова можуть переноситись
 * (overflow-wrap:anywhere + hyphens:auto для lang="uk"). Браузер лишає слова цілими,
 * де вміщається, і ламає лише ті, що інакше не влазять — колонки лишаються
 * пропорційними до вмісту, горизонтального скролу немає.
 */
.wprm-recipe-notes table,
.wprm-recipe-summary table,
.wprm-recipe .wprm-recipe-notes-container table {
  width: 100%;
  max-width: 100%;
  table-layout: auto;
  border-collapse: collapse;
}
.wprm-recipe-notes table td,
.wprm-recipe-notes table th,
.wprm-recipe-summary table td,
.wprm-recipe-summary table th {
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: auto;
  -webkit-hyphens: auto;
  vertical-align: top;
}
@media (max-width: 640px) {
  .wprm-recipe-notes table,
  .wprm-recipe-summary table {
    font-size: 0.9em;
    line-height: 1.35;
  }
  .wprm-recipe-notes table td,
  .wprm-recipe-notes table th,
  .wprm-recipe-summary table td,
  .wprm-recipe-summary table th {
    padding: 6px 6px;
  }
}