/*
Theme Name: Laverte Shoes
Theme URI: https://laverteshoes.ru
Description: Элегантная тема для обувного интернет-магазина Laverte Shoes на базе Kadence
Author: Laverte Shoes Team
Template: kadence
Version: 1.6.0
*/

/* ==========================================================================
   МОДУЛЬНАЯ АРХИТЕКТУРА СТИЛЕЙ LAVERTE SHOES
   --------------------------------------------------------------------------
   Стили темы разделены на 10 независимых и структурированных модулей
   в директории assets/css/:

   1. assets/css/variables.css      - Брендовая палитра, типографика, база, контейнеры, 152-ФЗ
   2. assets/css/header.css         - Двухъярусная шапка, логотип, навигация, поиск, Drawer
   3. assets/css/hero.css           - Полноэкранный Hero-баннер и fashion-секции главной
   4. assets/css/catalog.css        - Сетка товаров (Fashion 3:4 Grid), панель сортировки
   5. assets/css/single-product.css - Премиальная карточка товара, выбор размеров, галерея
   6. assets/css/cart.css           - Монохромная страница корзины и Cart Blocks
   7. assets/css/checkout.css       - Оформление заказа, сброс сайдбаров, плавающий итог
   8. assets/css/my-account.css     - Двухколоночный личный кабинет покупателя
   9. assets/css/cdek.css           - Интеграция службы доставки СДЭК, выбор ПВЗ, трекинг
   10. assets/css/footer.css        - Минималистичный 4-колоночный fashion-футер

   Подключение модулей выполняется через functions.php с автоматическим
   версионированием (filemtime) для мгновенного сброса браузерного кэша.

   Быстрые глобальные стили и переопределения можно добавлять ниже:
   ========================================================================== */

/* 1. Глобальная ширина контейнеров 1240px для чекаута и правовых страниц */
body.woocommerce-checkout,
body.woocommerce-cart,
body.laverte-wide-legal-page,
body:has(.laverte-delivery-concierge-block),
body:has(.laverte-returns-concierge-block) {
	--global-content-narrow-width: 1240px !important;
	--global-content-width: 1240px !important;
}

body.woocommerce-checkout .content-container,
body.woocommerce-checkout #main,
body.woocommerce-checkout .site-main,
body.woocommerce-checkout #primary,
body.woocommerce-checkout .content-area,
body.woocommerce-checkout .content-wrap,
body.woocommerce-checkout .entry-content-wrap,
body.woocommerce-checkout .entry-content,
body.woocommerce-checkout article.entry {
	max-width: 1240px !important;
	width: 100% !important;
}

/* 2. Чекаут: просторный двухколоночный макет (форма слева, закрепленный чек справа) */
.woocommerce-checkout .wp-block-woocommerce-checkout,
.woocommerce-checkout .wc-block-checkout,
.woocommerce-checkout .wc-block-components-sidebar-layout {
	display: flex !important;
	flex-direction: row !important;
	align-items: flex-start !important;
	justify-content: space-between !important;
	gap: clamp(32px, 4vw, 56px) !important;
	width: 100% !important;
	max-width: 1240px !important;
	margin: 0 auto 80px auto !important;
	box-sizing: border-box !important;
}

/* Левая колонка чекаута (поля, доставка СДЭК, способы оплаты, кнопка оформления) */
.woocommerce-checkout .wc-block-components-sidebar-layout > .wc-block-components-main,
.woocommerce-checkout form.woocommerce-checkout .col2-set {
	flex: 1 1 0% !important;
	width: auto !important;
	max-width: 100% !important;
	min-width: 0 !important;
	box-sizing: border-box !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Внутренние блоки чекаута занимают 100% ширины левой колонки без искусственного зажима */
.woocommerce-checkout .wc-block-components-sidebar-layout > .wc-block-components-main > *,
.woocommerce-checkout .wp-block-woocommerce-checkout-fields-block,
.woocommerce-checkout .wc-block-checkout__main,
.woocommerce-checkout form.wc-block-checkout__form,
.woocommerce-checkout form.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout form.woocommerce-checkout .col2-set .col-2 {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	box-sizing: border-box !important;
}

/* Правая колонка: закрепленный чек заказа */
.woocommerce-checkout .wc-block-components-sidebar-layout > .wc-block-components-sidebar,
.woocommerce-checkout .wc-block-checkout__sidebar,
.woocommerce-checkout form.woocommerce-checkout #order_review {
	flex: 0 0 400px !important;
	width: 400px !important;
	max-width: 400px !important;
	min-width: 360px !important;
	position: -webkit-sticky !important;
	position: sticky !important;
	top: 96px !important;
	align-self: flex-start !important;
	box-sizing: border-box !important;
}

/* Кнопка оформления заказа на всю ширину левой колонки */
.woocommerce-checkout .wc-block-checkout__actions,
.woocommerce-checkout .wp-block-woocommerce-checkout-actions-block,
.woocommerce-checkout .wc-block-components-checkout-place-order-button,
.woocommerce-checkout #place_order {
	width: 100% !important;
	box-sizing: border-box !important;
}

/* Адаптивность чекаута для планшетов и мобильных */
@media screen and (max-width: 920px) {
	.woocommerce-checkout .wp-block-woocommerce-checkout,
	.woocommerce-checkout .wc-block-checkout,
	.woocommerce-checkout .wc-block-components-sidebar-layout {
		flex-direction: column !important;
		gap: 32px !important;
	}

	.woocommerce-checkout .wc-block-components-sidebar-layout > .wc-block-components-sidebar,
	.woocommerce-checkout .wc-block-checkout__sidebar,
	.woocommerce-checkout form.woocommerce-checkout #order_review {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		position: static !important;
		top: auto !important;
	}
}

/* 3. Кнопки мессенджеров плашки контактов без переноса слов */
.laverte-strip-btn {
	white-space: nowrap !important;
}

/* 4. Симметричная аккуратная сетка карточек 2x2 (без смещения и паразитных тегов) */
.laverte-delivery-cards-grid > p,
.laverte-delivery-cards-grid > br,
.laverte-returns-steps-grid > p,
.laverte-returns-steps-grid > br {
	display: none !important;
}

.laverte-delivery-cards-grid {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 24px !important;
	margin-bottom: 40px !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

.laverte-delivery-card {
	min-width: 0 !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

@media screen and (max-width: 768px) {
	.laverte-delivery-cards-grid {
		grid-template-columns: 1fr !important;
		gap: 18px !important;
	}
}

@media screen and (max-width: 480px) {
	.laverte-delivery-card {
		padding: 22px 18px !important;
	}
}

/* 4.1. Устранение эффекта сжатия контента на мобильных (условия доставки и оферта) */
html body.laverte-wide-legal-page .content-container.site-container,
html body:has(.laverte-delivery-concierge-block) .content-container.site-container,
html body:has(.laverte-returns-concierge-block) .content-container.site-container {
	max-width: 1240px !important;
	width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: clamp(14px, 3.5vw, 24px) !important;
	padding-right: clamp(14px, 3.5vw, 24px) !important;
	box-sizing: border-box !important;
}

html body.laverte-wide-legal-page #primary,
html body.laverte-wide-legal-page #main,
html body.laverte-wide-legal-page .site-main,
html body.laverte-wide-legal-page .content-wrap,
html body.laverte-wide-legal-page article.entry,
html body.laverte-wide-legal-page .entry-content-wrap,
html body.laverte-wide-legal-page .entry-content,
html body:has(.laverte-delivery-concierge-block) #primary,
html body:has(.laverte-delivery-concierge-block) #main,
html body:has(.laverte-delivery-concierge-block) .site-main,
html body:has(.laverte-delivery-concierge-block) .content-wrap,
html body:has(.laverte-delivery-concierge-block) article.entry,
html body:has(.laverte-delivery-concierge-block) .entry-content-wrap,
html body:has(.laverte-delivery-concierge-block) .entry-content,
html body:has(.laverte-returns-concierge-block) #primary,
html body:has(.laverte-returns-concierge-block) #main,
html body:has(.laverte-returns-concierge-block) .site-main,
html body:has(.laverte-returns-concierge-block) .content-wrap,
html body:has(.laverte-returns-concierge-block) article.entry,
html body:has(.laverte-returns-concierge-block) .entry-content-wrap,
html body:has(.laverte-returns-concierge-block) .entry-content {
	max-width: 100% !important;
	width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	border: none !important;
	box-shadow: none !important;
	background: transparent !important;
	box-sizing: border-box !important;
}

.laverte-delivery-concierge-block,
.laverte-returns-concierge-block {
	width: 100% !important;
	max-width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
	box-sizing: border-box !important;
}

.laverte-delivery-header,
.laverte-returns-header {
	text-align: center !important;
	width: 100% !important;
	max-width: 860px !important;
	margin: 0 auto clamp(24px, 4vw, 40px) auto !important;
	padding: 0 4px !important;
	box-sizing: border-box !important;
}

.laverte-delivery-badge,
.laverte-returns-badge {
	display: inline-block !important;
	font-size: clamp(9.5px, 2.6vw, 11px) !important;
	font-weight: 600 !important;
	letter-spacing: clamp(0.08em, 1.8vw, 0.16em) !important;
	text-transform: uppercase !important;
	color: #111111 !important;
	background: #F4F4F4 !important;
	padding: 6px clamp(12px, 3.5vw, 18px) !important;
	border-radius: 20px !important;
	margin-bottom: 16px !important;
	max-width: 100% !important;
	white-space: normal !important;
	line-height: 1.4 !important;
	word-break: normal !important;
	box-sizing: border-box !important;
}

.laverte-delivery-title,
.laverte-returns-title {
	width: 100% !important;
	max-width: 100% !important;
	font-size: clamp(18px, 5.2vw, 28px) !important;
	font-weight: 500 !important;
	letter-spacing: 0.04em !important;
	text-transform: uppercase !important;
	color: #111111 !important;
	margin: 0 0 14px 0 !important;
	line-height: 1.35 !important;
	word-break: normal !important;
	overflow-wrap: break-word !important;
	hyphens: manual !important;
	box-sizing: border-box !important;
}

.laverte-delivery-subtitle,
.laverte-returns-subtitle {
	width: 100% !important;
	max-width: 680px !important;
	margin: 0 auto !important;
	font-size: clamp(13px, 3.6vw, 14.5px) !important;
	line-height: 1.65 !important;
	color: #555555 !important;
	padding: 0 8px !important;
	box-sizing: border-box !important;
}

/* 4.2. Отключение блока подписки на рассылку */
.laverte-footer-newsletter {
	display: none !important;
}

/* 5. Премиальное минималистичное модальное окно поиска и кнопка закрытия */
.laverte-search-modal {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	width: 100vw !important;
	height: 100vh !important;
	background: rgba(255, 255, 255, 0.97) !important;
	backdrop-filter: blur(14px) !important;
	-webkit-backdrop-filter: blur(14px) !important;
	z-index: 9999999 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	opacity: 0 !important;
	visibility: hidden !important;
	transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.laverte-search-modal.is-open {
	opacity: 1 !important;
	visibility: visible !important;
}

.laverte-search-close,
button.laverte-search-close,
.laverte-search-modal .laverte-search-close,
.laverte-search-inner .laverte-search-close {
	position: absolute !important;
	top: 36px !important;
	right: 48px !important;
	width: 48px !important;
	height: 48px !important;
	min-width: 48px !important;
	min-height: 48px !important;
	max-width: 48px !important;
	max-height: 48px !important;
	padding: 0 !important;
	margin: 0 !important;
	background: transparent !important;
	background-color: transparent !important;
	border: none !important;
	outline: none !important;
	box-shadow: none !important;
	border-radius: 50% !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	cursor: pointer !important;
	color: #111111 !important;
	z-index: 10 !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.2s ease, opacity 0.2s ease !important;
}

.laverte-search-close svg {
	width: 22px !important;
	height: 22px !important;
	display: block !important;
	stroke: currentColor !important;
	stroke-width: 1.3px !important;
}

.laverte-search-close:hover {
	background-color: rgba(0, 0, 0, 0.05) !important;
	color: #000000 !important;
	transform: rotate(90deg) !important;
}

.laverte-search-close:active {
	background-color: rgba(0, 0, 0, 0.09) !important;
	transform: rotate(90deg) scale(0.92) !important;
}

.laverte-search-inner {
	width: min(720px, 90vw) !important;
	max-width: 720px !important;
	position: relative !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	box-sizing: border-box !important;
	transform: translateY(14px);
	transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.laverte-search-modal.is-open .laverte-search-inner {
	transform: translateY(0) !important;
}

.laverte-search-form {
	display: flex !important;
	align-items: center !important;
	width: 100% !important;
	border-bottom: 1.5px solid #111111 !important;
	padding-bottom: 10px !important;
	background: transparent !important;
	box-sizing: border-box !important;
	transition: border-color 0.25s ease !important;
	gap: 12px !important;
}

.laverte-search-icon {
	flex-shrink: 0 !important;
	color: #767676 !important;
	width: 20px !important;
	height: 20px !important;
	display: block !important;
	margin: 0 !important;
}

.laverte-search-field,
input.laverte-search-field[type="search"] {
	flex: 1 1 auto !important;
	width: 100% !important;
	min-width: 0 !important;
	border: none !important;
	outline: none !important;
	box-shadow: none !important;
	font-family: var(--laverte-font-family, -apple-system, BlinkMacSystemFont, 'Inter', sans-serif) !important;
	font-size: 20px !important;
	font-weight: 300 !important;
	letter-spacing: -0.01em !important;
	line-height: 1.4 !important;
	padding: 8px 0 !important;
	background: transparent !important;
	color: #111111 !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

.laverte-search-field::-webkit-search-decoration,
.laverte-search-field::-webkit-search-cancel-button,
.laverte-search-field::-webkit-search-results-button,
.laverte-search-field::-webkit-search-results-decoration {
	display: none !important;
	-webkit-appearance: none !important;
}

.laverte-search-field::placeholder {
	color: #8E8E93 !important;
	font-weight: 300 !important;
	opacity: 1 !important;
}

.laverte-search-submit,
button.laverte-search-submit {
	flex-shrink: 0 !important;
	margin-left: auto !important;
	background: transparent !important;
	background-color: transparent !important;
	border: none !important;
	outline: none !important;
	box-shadow: none !important;
	font-family: var(--laverte-font-family, -apple-system, BlinkMacSystemFont, 'Inter', sans-serif) !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	letter-spacing: 0.14em !important;
	text-transform: uppercase !important;
	cursor: pointer !important;
	padding: 8px 0 8px 16px !important;
	color: #111111 !important;
	white-space: nowrap !important;
	transition: opacity 0.2s ease, transform 0.2s ease !important;
}

.laverte-search-submit:hover {
	opacity: 0.6 !important;
	transform: translateX(2px) !important;
}

.laverte-search-hint {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	width: 100% !important;
	margin-top: 14px !important;
	font-family: var(--laverte-font-family, -apple-system, BlinkMacSystemFont, 'Inter', sans-serif) !important;
	font-size: 12px !important;
	font-weight: 400 !important;
	color: #8E8E93 !important;
	letter-spacing: 0.03em !important;
}

@media screen and (max-width: 768px) {
	.laverte-search-close,
	button.laverte-search-close,
	.laverte-search-modal .laverte-search-close,
	.laverte-search-inner .laverte-search-close {
		top: 20px !important;
		right: 20px !important;
		width: 42px !important;
		height: 42px !important;
		min-width: 42px !important;
		min-height: 42px !important;
	}

	.laverte-search-close svg {
		width: 20px !important;
		height: 20px !important;
	}

	.laverte-search-inner {
		width: 90vw !important;
	}

	.laverte-search-field,
	input.laverte-search-field[type="search"] {
		font-size: 16px !important;
		padding: 6px 0 !important;
	}

	.laverte-search-submit,
	button.laverte-search-submit {
		font-size: 12px !important;
		padding: 6px 0 6px 12px !important;
	}

	.laverte-search-hint-esc {
		display: none !important;
	}
}
