/*
 Theme Name:   Woodmart Child
 Description:  SHOPSTYLE — дочерняя тема Woodmart 7.0.2 (палитра, типографика, мобильные правила)
 Author:       SHOPSTYLE
 Template:     woodmart
 Version:      1.1.0
 Text Domain:  woodmart
*/

/* ============================================================
   1. Палитра и шрифты — переопределение CSS-переменных Woodmart.
   Селектор html:root (0,1,1) сильнее :root (0,1,0) из
   xts-style-theme_settings_default.css, который грузится ПОСЛЕ child
   (Stylesstorage::print_styles → wp_enqueue_scripts:11000).
   ============================================================ */
html:root {
	/* палитра из макетов */
	--ss-bg:        #F3F0EB;
	--ss-text:      #2B2724;
	--ss-accent:    #C4593A;
	--ss-muted:     #8A837C;
	--ss-line:      rgba(43, 39, 36, 0.14);

	/* шрифт один на всё — Jost, подключается в inc/enqueue.php */
	--wd-text-font:            "Jost", "Helvetica Neue", Arial, sans-serif;
	--wd-title-font:           var(--wd-text-font);
	--wd-entities-title-font:  var(--wd-text-font);
	--wd-alternative-font:     var(--wd-text-font);
	--wd-widget-title-font:    var(--wd-text-font);
	--wd-header-el-font:       var(--wd-text-font);

	--wd-text-font-weight:            400;
	--wd-text-font-size:              14px;
	--wd-title-font-weight:           300;
	--wd-title-transform:             uppercase;
	--wd-entities-title-font-weight:  400;
	--wd-entities-title-transform:    none;
	--wd-widget-title-font-weight:    500;
	--wd-widget-title-transform:      uppercase;
	--wd-header-el-font-weight:       500;
	--wd-header-el-transform:         uppercase;

	/* цвета текста и ссылок */
	--wd-text-color:                  var(--ss-text);
	--wd-title-color:                 var(--ss-text);
	--wd-entities-title-color:        var(--ss-text);
	--wd-entities-title-color-hover:  var(--ss-accent);
	--wd-widget-title-color:          var(--ss-text);
	--wd-link-color:                  var(--ss-text);
	--wd-link-color-hover:            var(--ss-accent);
	/* как в woodmart-settings.json: primary тёмный (активные пункты, фокус, пагинация — без ярких пятен),
	   терракота только там, где задано явно (SALE, hover ссылок). Поменять на var(--ss-accent) — если нужно ярче. */
	--wd-primary-color:               var(--ss-text);
	--wd-alternative-color:           var(--ss-accent);

	/* фоны: тема везде красит «белым» через эти переменные */
	--wd-main-bgcolor:   var(--ss-bg);
	--bgcolor-white:     var(--ss-bg);
	--bgcolor-white-rgb: 243, 240, 235;
	--bgcolor-gray-100:  #ECE8E2;
	--bgcolor-gray-200:  #ECE8E2;
	--bgcolor-gray-300:  #E5E0D9;

	/* серые тона темы → тёплые, без чистого чёрного */
	--color-gray-100: #ECE8E2;
	--color-gray-200: #E5E0D9;
	--color-gray-300: #C3BCB3;
	--color-gray-400: #A8A199;
	--color-gray-500: var(--ss-muted);
	--color-gray-600: #6F6862;
	--color-gray-700: #58524C;
	--color-gray-800: #3B3632;
	--color-gray-900: var(--ss-text);
	--brdcolor-gray-200: rgba(43, 39, 36, 0.08);
	--brdcolor-gray-300: rgba(43, 39, 36, 0.11);
	--brdcolor-gray-400: var(--ss-line);
	--brdcolor-gray-500: rgba(43, 39, 36, 0.22);

	/* поля форм: прозрачные, только нижняя линия (ТЗ п.8) */
	--wd-form-bg:              transparent;
	--wd-form-color:           var(--ss-text);
	--wd-form-placeholder-color: var(--ss-muted);
	--wd-form-brd-width:       1px;
	--wd-form-brd-radius:      0;
	--wd-form-brd-color:       var(--ss-line);
	--wd-form-brd-color-focus: var(--ss-text);

	/* кнопки: светлые с тёмным текстом, при hover инверсия */
	--btn-default-bgcolor:       transparent;
	--btn-default-bgcolor-hover: var(--ss-text);
	--btn-default-color:         var(--ss-text);
	--btn-default-color-hover:   var(--ss-bg);
	/* Woodmart 8.4+: shop/accent объединены в --btn-accented-* */
	--btn-accented-bgcolor:          transparent;
	--btn-accented-bgcolor-hover:    var(--ss-text);
	--btn-accented-color:            var(--ss-text);
	--btn-accented-color-hover:      var(--ss-bg);
	--btn-default-brd-radius:  0;
	--btn-accented-brd-radius: 0;
	--btn-default-box-shadow:  none;
	--btn-accented-box-shadow: none;
	--btn-default-box-shadow-hover:  none;
	--btn-accented-box-shadow-hover: none;

	--wd-brd-radius: 0;
}

body {
	background-color: var(--ss-bg);
	color: var(--ss-text);
	-webkit-font-smoothing: antialiased;
}

/* ============================================================
   2. Заголовки: uppercase, лёгкий вес, разрядка .12em
   ============================================================ */
h1, h2, h3, h4, h5, h6,
.title,
.title-wrapper .title,
.widget-title,
.wd-el-title,
.woocommerce-products-header .entry-title,
.woocommerce-loop-category__title {
	letter-spacing: 0.12em;
	font-weight: 300;
	line-height: 1.25;
}
h1 { font-size: 34px; }
h2 { font-size: 28px; }
h3 { font-size: 22px; }
h4 { font-size: 18px; }
h5, h6 { font-size: 14px; letter-spacing: 0.14em; }

/* [woodmart_title] секций главной: как в макете — тонкий, центр */
.title-wrapper .title {
	font-size: 22px;
	font-weight: 300;
	letter-spacing: 0.14em;
}
.title-wrapper .title-subtitle,
.title-wrapper .title-after_title {
	font-size: 12px;
	letter-spacing: 0.04em;
	color: var(--ss-muted);
	text-transform: none;
}
/* ссылка «Смотреть все» под заголовком (кнопка стиля link) */
.btn-style-link,
.btn.btn-style-link {
	font-weight: 400;
	letter-spacing: 0.04em;
	text-transform: none;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* мелкие подписи, крошки, теги */
.wd-breadcrumbs,
.woocommerce-breadcrumb,
.wd-product-cats,
.wd-product-brands-links,
.product-grid-item .wd-product-cats {
	font-size: 12px;
	letter-spacing: 0.02em;
	color: var(--ss-muted);
}

/* ============================================================
   3. Кнопки — светлые, тонкая рамка, hover инверсия (как NEW SEASON '26)
   ============================================================ */
.btn, .button, button, [type="submit"], [type="button"],
.btn.btn-color-default, .btn.btn-color-white, .btn.btn-color-black,
.btn.btn-color-alt, .btn-style-bordered.btn-color-default,
.btn-style-bordered.btn-color-black, .btn-style-bordered.btn-color-white,
.add_to_cart_button, .single_add_to_cart_button, .checkout-button,
.woocommerce-form-login .button, .wd-load-more {
	background-color: transparent;
	color: var(--ss-text);
	border: 1px solid var(--ss-text);
	border-radius: 0;
	box-shadow: none;
	font-family: var(--wd-text-font);
	font-weight: 500;
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	padding: 12px 26px;
	line-height: 18px;
}
.btn:hover, .button:hover, button:hover, [type="submit"]:hover, [type="button"]:hover,
.btn.btn-color-default:hover, .btn.btn-color-white:hover, .btn.btn-color-black:hover,
.btn.btn-color-alt:hover, .btn-style-bordered.btn-color-default:hover,
.btn-style-bordered.btn-color-black:hover, .btn-style-bordered.btn-color-white:hover,
.add_to_cart_button:hover, .single_add_to_cart_button:hover, .checkout-button:hover,
.woocommerce-form-login .button:hover, .wd-load-more:hover {
	background-color: var(--ss-text);
	color: var(--ss-bg);
	border-color: var(--ss-text);
	box-shadow: none;
}
/* белая кнопка на тёмном фото (баннер первого экрана) */
.color-scheme-light .btn-color-white,
.color-scheme-light .btn.btn-color-white,
.color-scheme-light .btn-style-bordered.btn-color-white {
	border-color: rgba(255, 255, 255, 0.85);
	color: #fff;
	background-color: transparent;
}
.color-scheme-light .btn-color-white:hover,
.color-scheme-light .btn.btn-color-white:hover,
.color-scheme-light .btn-style-bordered.btn-color-white:hover {
	background-color: #fff;
	color: var(--ss-text);
	border-color: #fff;
}
/* единственная цветная кнопка — primary: терракота */
.btn.btn-color-primary, .btn-style-bordered.btn-color-primary {
	background-color: transparent;
	color: var(--ss-accent);
	border: 1px solid var(--ss-accent);
}
.btn.btn-color-primary:hover, .btn-style-bordered.btn-color-primary:hover {
	background-color: var(--ss-accent);
	color: #fff;
	border-color: var(--ss-accent);
}
.btn-style-bordered { border-width: 1px; }
.btn-style-bordered:not(:hover) { background-color: transparent !important; }
/* иконочные кнопки карточки (wishlist/quick view) — без рамок и заливок */
.wd-action-btn > a,
.wd-action-btn > a:hover {
	border: 0;
	background-color: transparent;
	box-shadow: none;
	padding: 0;
	letter-spacing: 0;
}
.wd-action-btn.wd-style-icon > a:hover { color: var(--ss-accent); }

/* ============================================================
   4. Поля форм — без серой заливки, только нижняя линия
   ============================================================ */
input[type='email'], input[type='date'], input[type='search'], input[type='number'],
input[type='text'], input[type='tel'], input[type='url'], input[type='password'],
textarea, select,
.wpcf7 :is(input, textarea, select),
.woocommerce-input-wrapper :is(input, textarea, select),
.select2-container--default .select2-selection--single {
	background-color: transparent;
	border-width: 0 0 1px 0;
	border-style: solid;
	border-color: var(--ss-line);
	border-radius: 0;
	padding-left: 0;
	padding-right: 0;
	color: var(--ss-text);
	box-shadow: none;
	font-family: var(--wd-text-font);
}
input:focus, textarea:focus, select:focus,
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
	border-color: var(--ss-text);
	outline: none;
	box-shadow: none;
}
::placeholder { color: var(--ss-muted); opacity: 1; }
textarea { padding-top: 10px; min-height: 90px; }
label, .form-row label { color: var(--ss-muted); font-size: 12px; letter-spacing: 0.04em; }
.select2-container--default .select2-selection--single .select2-selection__rendered { padding-left: 0; }

/* ============================================================
   5. Цена: не красится (ТЗ п.2). Старая — зачёркнутая серым, новая — тёмным
   ============================================================ */
.price,
.price ins,
.price .amount,
.product-grid-item .price,
.summary-inner > .price,
.woocommerce-Price-amount,
.wd-entities-title + .price {
	color: var(--ss-text);
	font-weight: 400;
	letter-spacing: 0.02em;
}
.price del,
.price del .amount {
	color: var(--ss-muted);
	font-size: 90%;
	text-decoration: line-through;
}
.price ins { text-decoration: none; }

/* ============================================================
   6. Плашки NEW / SALE / SOLD OUT — плоские прямоугольные, без чистого красного
   ============================================================ */
.product-labels {
	top: 10px;
	inset-inline-start: 10px;
	gap: 4px;
}
.product-label,
.labels-rounded .product-label,
.labels-rectangular .product-label {
	min-width: 0;
	min-height: 0;
	padding: 4px 8px;
	border-radius: 0;
	font-family: var(--wd-text-font);
	font-size: 10px;
	font-weight: 500;
	letter-spacing: 0.12em;
	line-height: 1.4;
	text-transform: uppercase;
	color: var(--ss-text);
	background-color: var(--ss-bg);
	margin-bottom: 0 !important;
}
.product-label.onsale,
.product-labels .product-label.onsale {
	background-color: var(--ss-accent);
	color: #fff;
}
.product-label.new { background-color: var(--ss-bg); color: var(--ss-text); }
.product-label.featured { background-color: var(--ss-text); color: var(--ss-bg); }
.product-label.out-of-stock {
	background-color: rgba(243, 240, 235, 0.92);
	color: var(--ss-muted);
}

/* ============================================================
   7. Карточка товара в каталоге — текст слева, фото главное
   ============================================================ */
.product-grid-item { text-align: left; }
.product-grid-item .product-element-bottom,
.product-grid-item .wd-entities-title,
.product-grid-item .price { text-align: left; }
.product-grid-item .wd-entities-title {
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0.02em;
	margin-top: 10px;
	margin-bottom: 2px;
	text-transform: none;
}
.product-grid-item .wd-product-cats { margin-bottom: 4px; }
.product-grid-item .price { font-size: 13px; }
.product-grid-item .hover-img { background-color: var(--ss-bg); }
/* outofstock — фото приглушаем, без «серого» вида */
.product-grid-item.outofstock .product-image-link img { opacity: 0.55; }

/* ============================================================
   8. Прочие места, где тема ставит чистый чёрный/красный/белый
   ============================================================ */
a { color: var(--ss-text); }
a:hover { color: var(--ss-accent); }
.wd-nav > li > a, .wd-nav[class*="wd-style-"] > li > a { letter-spacing: 0.1em; }
/* пункт SALE в меню — единственное цветное место */
.wd-nav > li.menu-item-sale > a,
.wd-nav > li.item-sale > a,
.wd-nav > li.sale > a,
.mobile-nav .wd-nav > li.menu-item-sale > a,
.mobile-nav .wd-nav > li.sale > a { color: var(--ss-accent) !important; }

.woocommerce-error, .woocommerce-message, .woocommerce-info,
.wd-notices, .woocommerce-notices-wrapper > div {
	border-radius: 0;
	background-color: var(--ss-text);
	color: var(--ss-bg);
}
.star-rating, .wd-star-rating { color: var(--ss-accent); }
.required { color: var(--ss-accent); }
.mobile-nav, .wd-side-hidden, .cart-widget-side, .wd-dropdown, .wd-dropdown-menu,
.wd-search-full-screen, .wd-popup, .mfp-content .wd-popup {
	background-color: var(--ss-bg);
	color: var(--ss-text);
}
.wd-dropdown, .wd-dropdown-menu, .wd-sub-menu {
	box-shadow: 0 8px 30px rgba(43, 39, 36, 0.08);
	border-radius: 0;
}
.footer-container, footer.wd-footer {
	background-color: var(--ss-bg);
	color: var(--ss-text);
	border-top: 1px solid var(--ss-line);
}
.copyrights-wrapper { border-top: 1px solid var(--ss-line); }
hr, .wd-row-divider { border-color: var(--ss-line); }
table, .shop_table, .shop_table td, .shop_table th { border-color: var(--ss-line) !important; }
.wd-scrolltop, .scrollToTop {
	background-color: var(--ss-text);
	color: var(--ss-bg);
	border-radius: 0;
}
::selection { background: var(--ss-accent); color: #fff; }

/* ============================================================
   9. Мобайл (ТЗ п.14): карточки в каталоге от края до края,
   почти без промежутков
   ============================================================ */
@media (max-width: 768.98px) {
	/* Woodmart 8: сетка .wd-products.wd-grid-g, зазор через --wd-gap (инлайн задаёт --wd-gap-lg) */
	.wd-products.wd-grid-g {
		--wd-gap: 2px;
		--wd-gap-sm: 2px;
		/* компенсируем padding контейнера 15px, чтобы фото шли от края */
		margin-left: calc(-15px - 1px);
		margin-right: calc(-15px - 1px);
	}
	.wd-products.wd-grid-g > .product-grid-item {
		margin-bottom: 18px;
	}
	.product-grid-item .product-element-bottom,
	.product-grid-item .wd-entities-title,
	.product-grid-item .wd-product-cats,
	.product-grid-item .price {
		padding-left: 8px;
		padding-right: 8px;
	}
	.product-grid-item .wd-entities-title { font-size: 12px; margin-top: 8px; }
	.product-grid-item .price { font-size: 12px; }
	.product-labels { top: 6px; inset-inline-start: 6px; }
	.product-label,
	.labels-rectangular .product-label { font-size: 9px; padding: 3px 6px; }
	h1 { font-size: 26px; }
	h2 { font-size: 22px; }
	.title-wrapper .title { font-size: 18px; }
	.btn, .button, button, [type="submit"], [type="button"] { padding: 11px 20px; }
}

/* Woodmart 8: .wd-content-layout{padding-block:40px} — в 7.0.2 верхний отступ компенсировался, возвращаем 0 */
.wd-content-layout { padding-block-start: 0; }