/* Корзина (/card) и оформление заказа (/order) — размеры сняты со старого сайта (ширина 1440). */

/* ===== Упрощённая шапка ===== */
.vp-chead { position: relative; z-index: 50; height: 90px; background: #fff; box-shadow: 0 5px 1px -5px rgba(93,66,52,.2), 0 6px 4px -6px rgba(93,66,52,.2), 0 8px 20px -13px rgba(93,66,52,.2); }
.vp-chead > * { margin-block: 0 !important; }
.vp-chead__row { height: 90px; gap: 0; }
.vp-chead__row > * { margin: 0 !important; }
.vp-chead .vp-chead__back { margin: 0; }
.vp-chead__back a {
	display: inline-flex; align-items: center; gap: 8px; height: 49px; padding: 16px 20px; border-radius: 8px;
	background: var(--vp-brown-03); color: var(--vp-brown); font-size: 14px; line-height: 17px; font-weight: 700; text-decoration: none;
}
.vp-chead__back a::before { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: url(../icons/arrow-right.svg) center / contain no-repeat; mask: url(../icons/arrow-right.svg) center / contain no-repeat; transform: scaleX(-1); }
.vp-chead__back a:hover { color: var(--vp-honey); }
.vp-chead .vp-chead__logo { margin-left: 26px !important; }
.vp-chead .vp-chead__phone { margin-left: auto !important; }
.vp-chead .vp-hc--email { margin-left: 35px !important; }
.vp-chead .vp-chead__mailsub { color: var(--vp-brown-70); }

/* ===== Страница ===== */
.vp-shop-page { padding-top: 40px; padding-bottom: 100px; }
.vp-shop-page > * { margin-block: 0; }
:root .vp-shop-title { margin-block: 0 !important; font-size: 32px; line-height: 38px; font-weight: 700; letter-spacing: 0; }
.vp-shop-page > .vp-shop-content { margin-top: 40px !important; }
.vp-shop-content > .woocommerce { margin: 0; }
.vp-cart-empty { margin: 0; font-size: 12px; line-height: 14px; color: var(--vp-brown-70); }
.vp-shop .woocommerce-notices-wrapper:empty { display: none; }
.vp-shop .woocommerce-error, .vp-shop .woocommerce-message, .vp-shop .woocommerce-info {
	margin: 0 0 20px; padding: 12px 16px; border: 0; border-radius: 8px; background: #fff; box-shadow: inset 0 0 0 1px var(--vp-honey-10); color: var(--vp-brown); font-size: 16px; line-height: 19px; list-style: none;
}
.vp-shop .woocommerce-error { box-shadow: inset 0 0 0 1px rgba(227, 66, 66, .4); }
.vp-shop .woocommerce-error::before, .vp-shop .woocommerce-message::before, .vp-shop .woocommerce-info::before { display: none; }

/* ===== Корзина ===== */
form.vp-cart { display: block; margin: 0; } /* у ссылки «Корзина» в шапке тот же класс и display: flex */
.vp-cart__layout { display: flex; align-items: flex-start; gap: 40px; }
.vp-cart__items { flex: 0 0 780px; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.vp-citem { display: flex; align-items: center; gap: 20px; padding: 16px; border-radius: 4px; background: #fff; }
.vp-citem__img { flex: 0 0 60px; }
.vp-citem__img img { display: block; width: 60px; height: 60px; object-fit: cover; }
.vp-citem__info { flex: 1 1 auto; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.vp-citem__name { color: var(--vp-brown); font-size: 16px; line-height: 16px; font-weight: 700; text-decoration: none; }
.vp-citem__name:hover { color: var(--vp-honey); }
.vp-citem__meta { font-size: 12px; line-height: 14px; color: var(--vp-brown-50); }
.vp-citem__side { flex: 0 0 144px; display: flex; flex-direction: column; align-items: flex-end; align-self: stretch; justify-content: space-between; gap: 10px; }
.vp-citem__remove { font-size: 16px; line-height: 19px; color: var(--vp-brown-50); text-decoration: none; }
.vp-citem__remove:hover { color: var(--vp-honey); }
.vp-citem__row { display: flex; align-items: center; gap: 12px; }
.vp-citem__price { font-size: 16px; line-height: 16px; font-weight: 700; white-space: nowrap; }
.vp-cqty { display: flex; align-items: center; width: 100px; height: 32px; border-radius: 6px; background: var(--vp-brown-04); }
.vp-cqty__btn { position: relative; flex: 0 0 32px; height: 32px; padding: 0; border: 0; background: none; color: var(--vp-brown-50); font: 400 0/32px var(--wp--preset--font-family--primary); cursor: pointer; }
/* «−» и «+» — значки 14px толщиной 2px, как у старого */
.vp-cqty__btn::before { content: ""; position: absolute; inset: 0; margin: auto; width: 21px; height: 21px; background: currentColor; -webkit-mask: url(../icons/plus.svg) center / contain no-repeat; mask: url(../icons/plus.svg) center / contain no-repeat; }
.vp-cqty__btn[data-vp-cqty="-1"]::before { -webkit-mask-image: url(../icons/minus.svg); mask-image: url(../icons/minus.svg); }
.vp-cqty__btn:hover { color: var(--vp-honey); }
:root input.vp-cqty__input { flex: 1 1 auto; width: 36px; min-width: 0; height: 32px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; color: var(--vp-brown); font: 400 16px/32px var(--wp--preset--font-family--primary); text-align: center; -moz-appearance: textfield; }
:root input.vp-cqty__input::-webkit-outer-spin-button, :root input.vp-cqty__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.vp-cart__side { flex: 0 0 360px; padding: 24px; border-radius: 4px; background: #fff; }
.vp-cart__side > * { margin: 0; }
.vp-cart__label { font-size: 16px; line-height: 19px; font-weight: 700; }
.vp-cart__coupon { display: flex; gap: 8px; margin-top: 8px !important; }
:root input.vp-cart__code { flex: 1 1 auto; width: auto; min-width: 0; height: 37px; padding: 9px 14px; border: 0; border-radius: 6px; background: var(--vp-brown-04); box-shadow: none; color: var(--vp-brown); font: 400 16px/19px var(--wp--preset--font-family--primary); }
.vp-cart__code::placeholder { color: rgba(93, 66, 52, .3); }
.vp-cart__apply { flex: 0 0 108px; height: 37px; padding: 9px 0; white-space: nowrap; border: 0; border-radius: 6px; background: var(--vp-brown-04); color: var(--vp-brown); font: 700 16px/19px var(--wp--preset--font-family--primary); cursor: pointer; }
.vp-cart__apply:hover { color: var(--vp-honey); }
.vp-cart__line { display: flex; align-items: baseline; gap: 8px; margin-top: 20px !important; font-size: 16px; line-height: 19px; color: var(--vp-brown-50); }
.vp-cart__line i { flex: 1 1 auto; height: 1px; background: var(--vp-brown-08); align-self: center; margin-top: 11px; }
.vp-cart__line + .vp-cart__line { margin-top: 8px !important; }
.vp-cart__total { display: flex; justify-content: space-between; margin-top: 20px !important; font-size: 20px; line-height: 24px; font-weight: 700; }
.vp-cart__checkout, .vp-co-submit {
	display: block; width: 100%; height: 48px; margin-top: 20px; padding: 15px 16px; border: 0; border-radius: 8px;
	background: var(--vp-honey); color: #fff; font: 400 16px/18px var(--wp--preset--font-family--primary); text-align: center; text-decoration: none; cursor: pointer;
}
.vp-cart__checkout:hover, .vp-co-submit:hover { background: rgba(211, 151, 80, .9); color: #fff; }

/* ===== Оформление ===== */
.vp-co-note { margin: 0 0 20px; font-size: 16px; line-height: 19px; font-weight: 500; }
.vp-co { margin: 0; }
.vp-co__layout { display: flex; align-items: flex-start; gap: 20px; }
.vp-co__main { flex: 0 0 870px; display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.vp-co__side { flex: 0 0 290px; position: sticky; top: 20px; }
.vp-co-card { padding: 20px; border-radius: 4px; background: #fff; }
.vp-co-card > * { margin: 0; }
.vp-co-card .vp-co-card__title { margin: 0 0 12px; font-size: 20px; line-height: 24px; font-weight: 700; letter-spacing: 0; }
.vp-co-card__sub { margin: 0 !important; font-size: 16px; line-height: 19px; }
.vp-co-options { display: flex; flex-direction: column; gap: 12px; }
.vp-co-option { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 16px 60px 16px 16px; border-radius: 8px; background: var(--vp-brown-04); cursor: pointer; }
.vp-co-option > input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.vp-co-option__title { font-size: 16px; line-height: 17px; font-weight: 700; }
.vp-co-option__desc { font-size: 16px; line-height: 19px; color: var(--vp-brown-50); }

.vp-co-option__desc.is-plain { color: var(--vp-brown); }
.vp-co-option__mark { position: absolute; top: 50%; right: 16px; width: 28px; height: 28px; margin-top: -14px; border-radius: 50%; background: var(--vp-brown-04); }
.vp-co-option__mark::before { content: ""; position: absolute; inset: 6px; background: rgba(93, 66, 52, .15); -webkit-mask: url(../icons/check.svg) center / contain no-repeat; mask: url(../icons/check.svg) center / contain no-repeat; }
.vp-co-option:has(input:checked) .vp-co-option__mark { background: var(--vp-honey); }
.vp-co-option:has(input:checked) .vp-co-option__mark::before { background: #fff; }
.vp-co-option .payment_box { display: none; }

.vp-co-detail { display: none !important; }
.vp-co[data-vp-delivery="pickup"] [data-vp-for~="pickup"],
.vp-co[data-vp-delivery="courier"] [data-vp-for~="courier"],
.vp-co[data-vp-delivery="post"] [data-vp-for~="post"],
.vp-co[data-vp-delivery="cdek_courier"] [data-vp-for~="cdek_courier"],
.vp-co[data-vp-delivery="cdek_pvz"] [data-vp-for~="cdek_pvz"] { display: flex !important; }
.vp-co-card .vp-co-detail.vp-rfield { margin: 16px 0 18px !important; }
.vp-co-pvz { height: 36px; margin: 0; padding: 9px 16px; border: 0; border-radius: 4px; background: var(--vp-honey); color: #fff; font: 400 16px/18px var(--wp--preset--font-family--primary); cursor: pointer; }
div.vp-co-detail { flex-direction: column; align-items: flex-start; margin: 16px 0 34px !important; }
.vp-co-cost { display: flex; justify-content: space-between; align-items: baseline; padding-top: 16px; box-shadow: inset 0 1px 0 var(--vp-brown-08); }
.vp-co-cost p { margin: 0; }
.vp-co-cost__price { font-size: 20px; line-height: 24px; font-weight: 700; }
.vp-co-cost__time { font-size: 16px; line-height: 19px; }
.vp-co-card--fields .vp-co-field { margin: 0 !important; }

.vp-co-summary { padding: 18px; border-radius: 4px; background: #fff; }
.vp-co-summary .vp-cart__line:first-child { margin-top: 0 !important; }
.vp-co-summary .vp-cart__total { margin-top: 20px !important; }
.vp-co-consent { margin-top: 12px; align-items: flex-start; }
.vp-co-consent .vp-consent__req { flex: 0 0 4px; width: 4px; height: 4px; margin: 0 0 0 auto; align-self: center; border-radius: 50%; background: rgb(227, 66, 66); box-shadow: none; }
.vp-co-consent .vp-consent__req::before { display: none; }
.vp-co-summary .vp-consent__link { display: block; width: fit-content; margin-top: 8px; }
.vp-co-summary .vp-co-submit { margin-top: 20px; }
.vp-co .blockUI.blockOverlay { background: rgba(250, 250, 250, .6) !important; }

/* у WooCommerce свой серый фон и отступы у блока оплаты — у старого их нет */
.vp-co #payment { padding: 0; border-radius: 0; background: none; }
/* тема Ollie растягивает заголовок корзины/оформления на всю ширину — возвращаем в сетку 1180 */
:root .vp-shop-page > .vp-shop-title { max-width: var(--wp--style--global--content-size); }
/* WooCommerce даёт всем label отступ снизу 0.7em */
.woocommerce-page .vp-co label, .woocommerce-page .vp-cart label { margin-bottom: 0; }
.vp-cart__line, .vp-cart__total { margin-bottom: 0 !important; }
/* два поля «Почты России» — через 6px, как у старого */
.vp-co-card .vp-co-detail[data-vp-for~="post"]:has(+ .vp-co-detail[data-vp-for~="post"]) { margin-bottom: 6px !important; }
.vp-co-card .vp-co-detail[data-vp-for~="post"] + .vp-co-detail[data-vp-for~="post"] { margin-top: 0 !important; }

/* ===================== Телефон (до 767px) — размеры сняты со старого сайта (ширина 390) ===================== */
.vp-chead__menu { display: none !important; }
@media (max-width: 999px) {
	/* шапка: меню, логотип, справа стрелка «назад» */
	.vp-chead { height: 74px; padding: 16px 10px 10px; box-sizing: border-box; box-shadow: 0 5px 1px -5px rgba(93,66,52,.2), 0 6px 4px -6px rgba(93,66,52,.2), 0 8px 20px -13px rgba(93,66,52,.2), inset 0 -1px 0 rgba(93,66,52,.08); }
	.vp-chead.has-global-padding { padding-left: 10px; padding-right: 10px; }
	.vp-chead > .vp-chead__row { max-width: none !important; height: 48px; }
	.vp-chead__menu { display: block !important; }
	.vp-chead .vp-chead__logo { order: 2; margin-left: 20px !important; }
	.vp-chead .vp-chead__logo img { width: 97px !important; height: auto; display: block; }
	.vp-chead .vp-chead__back { order: 3; margin-left: auto !important; }
	.vp-chead__back a { justify-content: center; width: 48px; height: 48px; padding: 14px; gap: 0; font-size: 0; line-height: 0; box-sizing: border-box; }
	.vp-chead__back a::before { width: 20px; height: 20px; }
	.vp-chead .vp-hc { display: none !important; }

	/* страница */
	.vp-shop-page { padding: 20px 20px 40px; }
	.vp-shop-page.has-global-padding { padding-left: 20px; padding-right: 20px; }
	.vp-shop-page > * { max-width: none !important; }
	:root .vp-shop-page > .vp-shop-title { max-width: none; }
	.vp-shop-page > .vp-shop-content { margin-top: 16px !important; }

	/* корзина: товары, под ними итог */
	.vp-cart__layout { flex-direction: column; align-items: stretch; gap: 20px; }
	.vp-cart__items, .vp-cart__side { flex: none; }

	/* оформление: всё в один столбец, итог — последней карточкой */
	.vp-co-note { margin-bottom: 36px; }
	.vp-co__layout { flex-direction: column; align-items: stretch; gap: 12px; }
	.vp-co__main, .vp-co__side { flex: none; }
	.vp-co__main { gap: 20px; }
	.vp-co__main > .vp-co-card:first-child { margin-bottom: -8px; }
	.vp-co__side { position: static; }
	.vp-co-card:first-child .vp-co-options { gap: 8px; }
	.vp-co-option { padding-right: 56px; }
	.vp-co-summary { padding: 24px; }
}

/* только телефон (до 599px): товар в корзине столбиком, «Стоимость» и «Сроки» друг под другом.
   На планшете (600–999px) у старого — как на компьютере, только колонки друг под другом. */
@media (max-width: 599px) {
	/* корзина: товар — фото, название, вес, цена, количество и «Удалить»; итог ниже */
	.vp-citem { flex-wrap: wrap; align-items: flex-start; gap: 0; }
	.vp-citem__img { flex: 0 0 100%; }
	.vp-citem__img img { display: inline-block; vertical-align: top; }
	.vp-citem__info { flex: 0 0 100%; margin-top: 5px; }
	.vp-citem__name { line-height: 17.5px; }
	.vp-citem__side { flex: 0 0 100%; flex-direction: row; align-items: flex-end; justify-content: flex-start; gap: 8px; margin-top: 5px; }
	.vp-citem__row { order: 1; flex-direction: column; align-items: flex-start; gap: 11px; }
	.vp-citem__remove { order: 2; height: 33px; margin-bottom: 0; padding: 7px 16px; border-radius: 6px; background: var(--vp-brown-04); box-sizing: border-box; }

	.vp-co-card .vp-co-detail.vp-rfield { margin-bottom: 0 !important; }
	div.vp-co-detail { margin-bottom: 0 !important; }
	.vp-co-cost { flex-direction: column; align-items: flex-start; box-shadow: none; }
}
/* планшет: в упрощённой шапке — телефон и почта перед стрелкой «назад» */
@media (min-width: 600px) and (max-width: 999px) {
	.vp-chead .vp-hc { display: flex !important; order: 3; }
	.vp-chead .vp-chead__phone { margin-left: auto !important; }
	.vp-chead .vp-hc .vp-hc__sub { display: none; }
	.vp-chead .vp-hc .vp-hc__main { margin: 0; }
	.vp-chead .vp-hc .vp-hc__main a { display: block; padding: 12px 10px; font-size: 16px; line-height: 19px; font-weight: 700; color: var(--vp-brown); text-decoration: none; }
	.vp-chead .vp-hc--email { margin-left: 0 !important; }
	.vp-chead .vp-chead__back { order: 4; margin-left: 10px !important; }
	.vp-citem { gap: 16px; }
}

/* планшет горизонтально (1000–1199px): товары и оформление — что останется, итог справа 290px (как у старого) */
@media (min-width: 1000px) and (max-width: 1199px) {
	.vp-cart__layout { gap: 20px; }
	.vp-cart__items { flex: 1 1 auto; min-width: 0; }
	.vp-cart__side { flex: 0 0 290px; min-width: 0; padding: 18px; box-sizing: border-box; }
	.vp-co__main { flex: 1 1 auto; }
	.vp-thanks__layout > .vp-thanks__card:first-child { flex: 1 1 auto; }
	.vp-thanks__side { flex: 0 0 290px; }
}

/* ===== «Спасибо за заказ» (vp/order-thanks) — в стиле корзины ===== */
.vp-thanks > * { margin: 0; }
.vp-thanks > .vp-thanks__lead { margin-top: 16px; font-size: 16px; line-height: 19px; }
.vp-thanks__lead a { color: var(--vp-honey); }
.vp-thanks > .vp-thanks__back { margin-top: 20px; }
.vp-thanks__back a {
	display: inline-flex; align-items: center; height: 33px; padding: 8px 20px; border-radius: 4px; background: var(--vp-honey); color: #fff;
	font: 700 14px/17px var(--wp--preset--font-family--primary); text-transform: uppercase; text-decoration: none;
}
.vp-thanks > .vp-thanks__layout { display: flex; align-items: flex-start; gap: 40px; margin-top: 40px; }
.vp-thanks__card { padding: 24px; border-radius: 4px; background: #fff; }
.vp-thanks__card > * { margin: 0; }
.vp-thanks__layout > .vp-thanks__card:first-child { flex: 0 0 780px; min-width: 0; }
.vp-thanks__side { flex: 0 0 360px; }
.vp-thanks__card .vp-thanks__title { margin: 0 0 16px; font-size: 20px; line-height: 24px; font-weight: 700; letter-spacing: 0; }
.vp-thanks__items { display: flex; flex-direction: column; gap: 16px; }
.vp-thanks__item { display: flex; align-items: center; gap: 16px; }
.vp-thanks__img { flex: 0 0 60px; }
.vp-thanks__img img { display: block; width: 60px; height: 60px; object-fit: cover; }
.vp-thanks__info { flex: 1 1 auto; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.vp-thanks__name { font-size: 16px; line-height: 19px; font-weight: 700; }
.vp-thanks__meta { font-size: 12px; line-height: 14px; color: var(--vp-brown-50); }
.vp-thanks__price { font-size: 16px; line-height: 19px; font-weight: 700; white-space: nowrap; }
.vp-thanks__side .vp-cart__line:first-child { margin-top: 0 !important; }
.vp-thanks__side .vp-cart__line > span:last-child { max-width: 60%; text-align: right; }
.vp-thanks__side .vp-thanks__sep { margin-top: 20px !important; }
.vp-thanks__pay:empty { display: none; }
.vp-thanks__pay { margin-top: 16px !important; font-size: 16px; line-height: 19px; }
.vp-thanks__pay > * { margin: 0 0 8px; }
@media (max-width: 999px) {
	.vp-thanks > .vp-thanks__layout { flex-direction: column; align-items: stretch; gap: 20px; margin-top: 20px; }
	.vp-thanks__layout > .vp-thanks__card:first-child, .vp-thanks__side { flex: none; }
	.vp-thanks__layout > .vp-thanks__card:first-child { padding: 16px; }
	.vp-thanks__item { align-items: flex-start; flex-wrap: wrap; gap: 5px 0; } /* как товар в корзине на телефоне: фото, название, цена */
	.vp-thanks__img, .vp-thanks__info, .vp-thanks__price { flex: 0 0 100%; }
}

/* ===== «Екатеринбург» – вы тут? (site.js) — окно поверх корзины, как у старого ===== */
.vp-city { position: fixed; inset: 0; z-index: 300; display: flex; align-items: center; justify-content: center; padding: 0 10px; background: rgba(93, 66, 52, .24); }
.vp-city__box { position: relative; width: 600px; max-width: 100%; padding: 24px; border-radius: 8px; background: #fff; box-shadow: 0 4px 16px -4px rgba(0, 0, 0, .04), 0 8px 64px -12px rgba(0, 0, 0, .2); box-sizing: border-box; color: var(--vp-brown); }
.vp-city__close { position: absolute; top: 0; right: 0; width: 56px; height: 56px; padding: 0; border: 0; background: none; color: rgba(93, 66, 52, .6); cursor: pointer; }
.vp-city__close::before { content: ""; position: absolute; inset: 0; margin: auto; width: 19px; height: 19px; background: currentColor; -webkit-mask: url(../icons/x.svg) center / contain no-repeat; mask: url(../icons/x.svg) center / contain no-repeat; }
.vp-city__close:hover { color: var(--vp-honey); }
.vp-city__title { margin: 0; padding-right: 32px; font-size: 20px; line-height: 24px; font-weight: 700; }
.vp-city__row { display: flex; gap: 12px; margin-top: 20px; }
.vp-city__btn { flex: 1 1 0; display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 37px; padding: 9px; border: 0; border-radius: 8px; font: 700 16px/19px var(--wp--preset--font-family--primary); cursor: pointer; }
.vp-city__btn::before { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: url(../icons/check.svg) center / contain no-repeat; mask: url(../icons/check.svg) center / contain no-repeat; }
.vp-city__btn--yes { background: var(--vp-honey); color: #fff; }
.vp-city__btn--yes:hover { background: rgba(211, 151, 80, .9); }
.vp-city__btn--no { background: rgba(211, 151, 80, .08); color: var(--vp-honey); }
.vp-city__btn--no::before { -webkit-mask-image: url(../icons/x.svg); mask-image: url(../icons/x.svg); }
.vp-city__btn--no:hover { background: rgba(211, 151, 80, .16); }
.vp-city__more { margin-top: 22px; padding: 24px 0 8px; box-shadow: inset 0 1px 0 rgba(93, 66, 52, .08); }
.vp-city__more[hidden] { display: none; }
:root input.vp-city__input { display: block; width: 100%; height: 37px; padding: 9px 16px; border: 0; border-radius: 8px; background: rgba(93, 66, 52, .04); box-shadow: none; color: var(--vp-brown); font: 400 16px/19px var(--wp--preset--font-family--primary); box-sizing: border-box; }
:root input.vp-city__input:focus { outline: none; background: rgba(93, 66, 52, .08); }
.vp-city__input::placeholder { color: rgba(93, 66, 52, .3); opacity: 1; }
.vp-city__list:not(:empty) { margin: 12px -20px -28px; }
.vp-city__item { display: block; width: 100%; margin: 0; padding: 8px 24px; border: 0; border-radius: 8px; background: none; color: var(--vp-brown); font: 400 16px/19px var(--wp--preset--font-family--primary); text-align: left; }
button.vp-city__item { cursor: pointer; }
button.vp-city__item:hover { background: rgba(93, 66, 52, .04); }
