/*
 Theme Name:   Woodmart Child
 Description:  Woodmart Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/

/* Єдина пропорція плитки каталогу — 5:7, кадр вписано.
 * Чому боксом, а не кропом Woo; звідки 5:7; межа селектора; приймання —
 * docs/kb/catalog.md §«Геометрія плитки каталогу». Файл їде інлайном на КОЖНУ
 * сторінку (wp_maybe_inline_styles), тому обґрунтування тут не живе. */

.wd-products .wd-product-thumb > .wd-product-img-link {
	display: block;
	aspect-ratio: 5 / 7;
}

/* Форма селектора взята у теми: вона пише `:is(...) :is(picture,img)` — нащадок,
 * і вже передбачає `<picture>`. Прямий нащадок мовчки перестав би діяти, якби
 * ліниве завантаження чи WebP колись обгорнули картинку. */
.wd-products .wd-product-thumb > :is(.wd-product-img-link, .wd-product-img-hover) :is(picture, img) {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

/* Бейдж довжини мотка: тема ставить лейблам `text-transform: uppercase`, і «30 м»
 * друкується як «30 М» — а «М» у СІ читається як мега-, тобто одиниця стає іншою.
 * Підстава і приймання — docs/kb/catalog.md §«Бейдж довжини мотка». */
.wd .product-label.attribute-label {
	text-transform: none;
}

/* Обведення зразка кольору. Рішення власника: у палітрі шнура є світлі відтінки
 * (`white` #e0e2e9, `moonlight`, `natural`, `pearl`), і на білій бічній панелі
 * кружок без межі майже не видно. Колір узято з лічильника фільтра — #d5d5d5.
 *
 * 🔑 Саме `box-shadow`, а не `border`: тінь не займає місця в потоці, тому
 * геометрія зразка (`--wd-swatch-size` теми) не зсувається ні на піксель.
 * Зовнішня, не `inset`: власний `overflow: hidden` елемента ріже вміст, а не
 * свою тінь, — тоді як `inset` на вкладеному `.wd-swatch-bg` дало б обрізані
 * дуги, бо той прямокутний і обрізається круглим батьком.
 *
 * Межа селектора: тільки колірні зразки (`.wd-bg`). Текстовим тема вже дає
 * `border: 1px solid var(--wd-swatch-brd-color)` у `wd-text-style-4`.
 * Підстава і приймання — docs/kb/catalog.md §«Свотч цвета в фильтре». */
.wd .wd-swatch.wd-bg {
	box-shadow: 0 0 0 1px #d5d5d5;
}

/* Лічильник товарів у фільтрах без зразків — «Товщина» і «Довжина мотка».
 *
 * 🔴 Тема ховає лічильник разом із підписами зразка одним правилом:
 * `.wd-swatches-filter.wd-labels-off :is(.wd-swatch + span, .count){display:none}`
 * (`css/parts/woo-mod-swatches-filter.css`). У розмітці `<span class="count">102</span>`
 * при цьому є — дефект видно лише оком, лічильники в HTML присутні.
 *
 * Вмикати `labels: on` у віджеті не можна: у `pa_thickness` і `pa_length` зразків
 * немає, і тема намалювала б порожні кружки. Тому повертається саме лічильник,
 * а підпис поряд зі зразком лишається схованим — правило теми звужується, не
 * скасовується.
 *
 * 🔑 Чому селектор такий довгий. `:is()` бере вагу НАЙСИЛЬНІШОГО аргумента:
 * `.wd-swatch + span` дає (0,1,1), тому правило теми важить (0,3,1) — рівно
 * стільки ж, скільки `.wd-labels-off li .count`. При рівній вазі виграє те, що
 * нижче, а стиль дочірньої теми йде інлайном 29-м вузлом, тоді як
 * `woo-mod-swatches-filter.css` підключається 48-м. Замір getComputedStyle:
 * лічильник лишався `display: none`. Звідси зайвий клас — вага (0,4,1).
 * Підстава і приймання — docs/kb/catalog.md §«Фильтры каталога». */
.wd-swatches-filter.wd-labels-off li.wc-layered-nav-term .count {
	display: block;
}

/* Чекаут: clearfix контейнерів полів.
 *
 * 🔴 Після того як менеджер полів звів Телефон і E-mail в один ряд, чекбокс
 * «Доставити на іншу адресу?» поїхав угору — до рядка «Прізвище».
 *
 * 🔑 Причина: тема розкладає парні поля ФЛОАТАМИ
 * (`woodmart/css/parts/woo-mod-grid.css`: `p:where(.form-row-first,.form-row-last){width:48%}`,
 * `p.form-row-first{float:left}`, `p.form-row-last{float:right}`), а clearfix у
 * контейнера полів не оголошує. Поки останнім полем був широкий `form-row-wide`,
 * потік закривався сам; тепер закривати нема чим.
 *
 * Штатного ключа теми під це немає — свідоме відступлення від правила «тільки
 * параметри адмінки, не CSS». У babywood те саме правило живе в `custom_css` теми;
 * тут воно в дочірній темі, щоб лишатися в git. */
.woocommerce-billing-fields__field-wrapper::after,
.woocommerce-shipping-fields__field-wrapper::after,
.woocommerce-additional-fields__field-wrapper::after {
	content: "";
	display: table;
	clear: both;
}

/* Радіус кнопок — 5px, рішення власника 19.08.2026 (вечір).
 *
 * 🔴 Штатного ключа теми під це немає. `rounding_size` керує `--wd-brd-radius`
 * (поверхні: плитки, картки, посилання навігації), а `btns_default_style` /
 * `btns_shop_style` = `semi-rounded` дають `--btn-default-brd-radius` і
 * `--btn-accented-brd-radius` — і ті читають РІВНО два селектори теми,
 * `.btn.btn-default` та `.btn.btn-accent` (на головній це два елементи).
 *
 * 🔑 Кнопки блоків `wd/button` йдуть третьою віссю: тема друкує їм
 * `btn-shape-rectangle` з дефолту блоку, а правило
 * `:is(.btn,.button,button,[type=submit],[type=button]){border-radius:var(--btn-brd-radius, 0px)}`
 * (`woodmart/css/parts/base.css`) падає на фолбек 0. Змінну оголошують лише
 * `.btn-shape-round` (35px) і `.btn-shape-semi-round` (5px) — оголошення на
 * `:root` у самій темі немає ЖОДНОГО (перевірено grep-ом по `themes/woodmart/css/`).
 *
 * Тому оголошуємо її тут: успадкування доїжджає до всіх кнопок, а свідомо
 * обрана форма блоку (round / semi-round) задає змінну НА ЕЛЕМЕНТІ й переважає.
 * Свідоме відступлення від правила «тільки параметри адмінки, не CSS» — як і
 * clearfix полів чекауту вище. */
:root {
	--btn-brd-radius: 5px;
}

/* Тема місцями прибиває радіус кнопки нулем ЖОРСТКО, повз змінну.
 *
 * Замір 19.08.2026 після оголошення `--btn-brd-radius: 5px`: гейт контракту далі
 * бачив `0px`, носій — `woo-product-loop-quick.css`:
 * `.wd-product.wd-hover-quick .wd-add-btn > a{border-radius:0}`. Змінна в кнопки
 * доїжджає (`getPropertyValue('--btn-brd-radius')` = 5px), але власне правило теми
 * її не читає взагалі.
 *
 * Перекриваємо рівно ті селектори, що є на цій вітрині (`products_hover = quick`):
 * кнопка в картці каталогу, швидкий перегляд, лічильник кількості, «деталі».
 * Специфічність піднята дублюванням класу — щоб вердикт не залежав від того, чи
 * доїде наш файл ПІСЛЯ частини теми: частини вантажаться то інлайном, то лінком.
 * Читаємо ту саму змінну, тож форма блоку (round / semi-round) далі перемагає. */
.wd-product.wd-product.wd-hover-quick .wd-add-btn > a,
.wd-product.wd-product.wd-hover-button .wd-add-btn > a,
.quick-shop-wrapper.quick-shop-wrapper .single_add_to_cart_button,
.wd-quantity-overlap.wd-quantity-overlap div.quantity .btn,
.btn.view-details-btn.view-details-btn {
	border-radius: var(--btn-brd-radius, 5px);
}
