/*
Theme Name: DBūve
Description: Кастомная тема для dbuve.lv (фаза 1 редизайна) — без зависимости от Elementor.
Author: maxweb.lv
Version: 0.1.0
Text Domain: dbuve
Requires PHP: 8.1
*/

:root {
	--color-primary: #1bae70;
	--color-primary-dark: #06752e;
	--color-ink: #14261c;
	--color-accent: #ff6900;
	--color-text: #4b4f58;
	--color-text-muted: #4e5652;
	--color-bg-subtle: #f4f6f4;
	--color-bg-subtle-2: #f6f7f8;
	--color-white: #ffffff;
	--color-black: #000000;

	--font-body: "Roboto", -apple-system, BlinkMacSystemFont, sans-serif;
	--font-heading: "Roboto Condensed", -apple-system, BlinkMacSystemFont, sans-serif;

	--container-max: 1200px;
	--space-sm: 0.5rem;
	--space-md: 1rem;
	--space-lg: 2rem;
	--space-xl: 4rem;
}

* {
	box-sizing: border-box;
}

body {
	margin: 0;
	font-family: var(--font-body);
	color: var(--color-text);
	background: var(--color-white);
	line-height: 1.5;
}

h1,
h2,
h3,
h4 {
	font-family: var(--font-heading);
	color: var(--color-ink);
	line-height: 1.2;
}

a {
	color: var(--color-primary-dark);
}

.container {
	max-width: var(--container-max);
	margin-inline: auto;
	padding-inline: var(--space-md);
}

.skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	background: var(--color-white);
	padding: var(--space-sm) var(--space-md);
	z-index: 1000;
}

.skip-link:focus {
	left: var(--space-md);
}

/*
 * WooCommerce каталог материалов — фикс мобильной вёрстки (текущая проблема:
 * карточки не адаптируются на узких экранах). Используем стандартную
 * разметку WooCommerce (ul.products), без переопределения PHP-шаблонов.
 */
ul.products {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--space-md);
	list-style: none;
	margin: 0;
	padding: 0;
}

ul.products li.product {
	margin: 0;
}

ul.products li.product img {
	width: 100%;
	height: auto;
}

@media (min-width: 640px) {
	ul.products {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (min-width: 960px) {
	ul.products {
		grid-template-columns: repeat(4, 1fr);
	}
}