/*
Theme Name: ALEX-PC
Theme URI: https://alex-pc.kiev.ua/
Author: ALEX-PC
Description: Преміальна тема інтернет-магазину техніки та аксесуарів ALEX-PC. Повна підтримка WooCommerce, Elementor Pro, AJAX-каталогу, підбору аксесуарів за моделлю пристрою.
Version: 1.8.3
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: alexpc
Tags: e-commerce, custom-menu, featured-images, translation-ready, rtl-language-support
WC requires at least: 8.0
WC tested up to: 9.9
*/

/*
 * Стилі теми розбито на файли в assets/css і підключено через functions.php:
 *   tokens.css     — змінні дизайн-системи
 *   base.css       — скидання, типографіка, утиліти
 *   components.css — кнопки, картки, форми, бейджі, скелетони
 *   layout.css     — шапка, mega menu, футер, мобільна навігація
 *   shop.css       — каталог, фільтри, картка товару, кошик, checkout, кабінет
 *   blog.css       — блог і статичні сторінки
 *
 * Цей файл потрібен WordPress для розпізнавання теми та дочірніх тем.
 */

/* ============================================================
   Зони дотику на сенсорних екранах
   ------------------------------------------------------------
   Apple і Google радять мінімум 44×44 CSS-пікселі на дію. Кілька
   елементів теми були нижчими: сердечко в картці товару 34×34,
   чекбокси фільтрів 18×18, посилання в футері та меню ~15px заввишки.
   Правила діють лише там, де немає точного вказівника (телефони й
   планшети), тож вигляд на ПК не змінюється. Цей файл підключається
   останнім, тому перебиває shop.css і layout.css без !important.
   ============================================================ */

@media (pointer: coarse) {

	/* Сердечко «в обране» в картці товару. */
	.product-card .alexpc-wishlist-btn {
		width: 44px;
		height: 44px;
	}

	/* Дії в шапці: кабінет, обране, кошик. */
	.header__action {
		min-height: 44px;
		justify-content: center;
	}

	/* Телефон і Telegram у верхній смузі. */
	.topbar__phone,
	.topbar__telegram {
		min-height: 44px;
	}

	/* Скинути фільтри, посилання на відгуки — текстові дії. */
	.filters__reset,
	.product-single__reviews-link {
		display: inline-flex;
		align-items: center;
		min-height: 44px;
	}

	/* Рядок фільтра: збільшуємо і сам чекбокс, і клікабельний рядок. */
	.filter-option {
		min-height: 44px;
	}

	.filter-option input[type="checkbox"],
	.filter-option input[type="radio"] {
		width: 22px;
		height: 22px;
		flex: 0 0 22px;
	}

	/* Списки посилань: меню футера, мобільне меню, мега-меню, кабінет.
	   Додаємо вертикальні відступи, а не висоту, щоб текст не «плавав». */
	.footer__menu a,
	.mobile-menu__list a,
	.mega__list a,
	.mega__panel a,
	.account__nav a {
		display: block;
		padding-block: var(--sp-3);
	}

	/* Логотип теж є посиланням на головну. */
	.logo {
		min-height: 44px;
		display: inline-flex;
		flex-direction: column;
		justify-content: center;
	}

	/* Хлібні крихти: посилання були 15px заввишки. */
	.breadcrumbs__item a,
	.breadcrumbs__current {
		display: inline-flex;
		align-items: center;
		min-height: 40px;
	}

	/* Список сумісних моделей у картці товару. */
	.alexpc-compat__item a {
		display: inline-flex;
		align-items: center;
		min-height: 44px;
	}

	/* «Показати всі характеристики» в блоці покупки. */
	.purchase-box__more {
		display: inline-flex;
		align-items: center;
		min-height: 44px;
	}

	/* Малі кнопки: «Купити» в картці товару була 34px. */
	.btn--sm {
		min-height: 44px;
	}

	/* Чекбокси й перемикачі: сам квадратик і рядок-мітка. */
	.check,
	.bundle__item,
	.color-option {
		min-height: 44px;
	}

	.check input[type="checkbox"],
	.check input[type="radio"],
	.bundle__check {
		width: 24px;
		height: 24px;
		flex: 0 0 24px;
	}

	.color-option {
		min-width: 36px;
	}

	.color-option input {
		width: 36px;
		height: 36px;
	}

	/* Повзунок ціни: сам елемент має бути заввишки з палець. */
	.price-filter__handle {
		height: 44px;
	}

	/* Кнопки поверх галереї: «Збільшити», «Відео». */
	.gallery__tool {
		min-height: 44px;
	}
}

/* --- Виправлення, потрібні на всіх екранах ------------------ */

/* Сердечко «в обране» під галереєю стискалося flex-контейнером
   до 10px завширшки. Фіксуємо мінімальну ширину. */
.product-single__extra .alexpc-wishlist-btn {
	flex: 0 0 auto;
	min-width: 44px;
	min-height: 44px;
}

/* Крапки галереї візуально маленькі (7px), і це навмисно. Щоб у них
   можна було влучити пальцем, розширюємо зону натискання невидимим
   псевдоелементом — вигляд не змінюється. */
.gallery__dot {
	position: relative;
}

/* Зона тягнеться переважно вгору: знизу крапки лише 12px до краю
   галереї, а вона має overflow: hidden і обрізала б ділянку. */
.gallery__dot::after {
	content: '';
	position: absolute;
	inset: -30px -8px -5px;
}

/* Дії в шапці на вузьких екранах стискалися до 16px завширшки. */
.header__action {
	flex: 0 0 auto;
	min-width: 44px;
}