/* Горизонтальное переполнение страницы товара на телефоне — 02.08.2026.
 *
 * Симптом: вся страница уезжает вправо и не влезает в экран. Замер на iPhone
 * 390pt: document.body.scrollWidth = 448 при ширине экрана 390.
 *
 * Причина: .flora-gallery — элемент CSS-грида .flora-hero-grid, а у grid- и
 * flex-элементов min-width по умолчанию auto, то есть сжиматься уже
 * собственного содержимого они не умеют. Содержимое здесь — лента миниатюр
 * .flora-gallery-thumbs: миниатюры 70px с flex-shrink:0, и их суммарная
 * ширина становится минимальной шириной всего блока галереи. Пока у товара
 * было две-три фотографии, лента укладывалась в экран. Когда слайды галереи
 * добавили каждому товару ещё три-четыре кадра, лента переросла экран и
 * потащила за собой всю страницу.
 *
 * Лечение — разрешить блокам быть уже содержимого. Прокрутку ленте добавлять
 * не нужно, у неё уже стоит overflow-x:auto; ей мешало именно min-width:auto.
 *
 * ⚠️ Файл датирован в имени намеренно. CDN отдаёт стили с max-age на год и
 * immutable, а ?ver из ссылки вырезается — правка «на месте» до браузеров не
 * доедет. Меняете правила — делайте копию с новой датой и переключайте
 * подключение в functions.php.
 */
.flora-hero-grid > * { min-width: 0; }
.flora-gallery,
.flora-gallery-thumbs { min-width: 0; }

/* Широкие таблицы в описании (у агрохимии это состав и нормы расхода) тянули
 * страницу до 517px независимо от слайдов — проверено на фунгициде Свитч, где
 * наших слайдов нет вовсе. Пусть прокручиваются внутри себя, а не растягивают
 * документ. */
.flora-desc-content table {
    display: block;
    width: 100%;
    overflow-x: auto;
}