/* ==========================================================================
   Premium polish (подключать после logo-anim.css):
   1) плавные переходы между страницами (cross-document View Transitions)
   2) sticky-шапка со сжатием логотипа
   3) микро-анимации кнопок
   4) лёгкие «стеклянные» акценты меню
   5) prefers-reduced-motion
   ========================================================================== */

/* ── 1. Переходы между страницами ──
   Кросс-фейд View Transitions отключён: он накладывался на прелоадер и давал мерцание.
   Прелоадер сам даёт непрерывное чёрное покрытие при переходах. */
#preloader{ view-transition-name: none; }

/* ── 2. Sticky-шапка со сжатием логотипа (десктоп) ── */
/* sticky не работает, если у предка overflow:hidden — меняем на clip (визуально то же) */
html, body{ overflow-x: clip !important; }
@media (min-width: 992px){
	body header{
		position: sticky !important;
		top: 0 !important;
		z-index: 1000;
		transition: box-shadow .3s ease;
	}
	body.scrolled header{
		box-shadow: 0 10px 28px rgba(0,0,0,.38);
	}
	#logo .anim-logo{
		transition: width .35s cubic-bezier(.2,.7,.3,1);
	}
	body.scrolled #logo .anim-logo{ width: 150px; }
	body.scrolled header .header-inline .header-inline-row{ min-height: 74px; }
}

/* ── 3. Микро-анимации кнопок / CTA ── */
a.button-shop,
.btn,
.btn-primary:not(#button-cart),
.btn-secondary,
button.button,
.header-icons-container .btn,
.mobile-icons-container a{
	transition: transform .18s cubic-bezier(.2,.7,.3,1), box-shadow .25s ease, background-color .2s ease, color .2s ease;
	will-change: transform;
}
a.button-shop:hover,
.btn:hover,
.btn-primary:not(#button-cart):hover,
.btn-secondary:hover,
button.button:hover{
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(0,0,0,.28);
}

/* ── 4. Лёгкие стеклянные акценты для выпадающих меню ── */
#mainmenu .dropdown-menu,
.mainmenu-ul li.expanded-level-1 > ul,
.header-telephone-items,
.header-address-items{
	backdrop-filter: blur(10px) saturate(1.15);
	-webkit-backdrop-filter: blur(10px) saturate(1.15);
	border: 1px solid rgba(255,255,255,.08) !important;
	box-shadow: 0 18px 44px rgba(0,0,0,.42) !important;
}

/* ── 5. Доступность: уважаем reduced-motion ── */
@media (prefers-reduced-motion: reduce){
	.preloader-glow,
	.preloader-particles i,
	.preloader-bar > i,
	#preloader-text{ animation: none !important; }
	::view-transition-old(root),
	::view-transition-new(root){ animation: none !important; }
	body header,
	#logo .anim-logo,
	a.button-shop, .btn, .btn-primary, .btn-secondary, button.button,
	.header-icons-container .btn, .mobile-icons-container a{ transition: none !important; }
	a.button-shop:hover, .btn:hover, .btn-primary:not(#button-cart):hover,
	.btn-secondary:hover, button.button:hover{ transform: none !important; }
}

/* ── 6. Премиум-тост (показывается вместо стандартного алерта) ── */
.cart-toast-wrap{
	position: fixed;
	left: 50%;
	top: calc(env(safe-area-inset-top, 0px) + 14px);
	transform: translateX(-50%);
	z-index: 50000000; /* выше липкой шапки, ниже прелоадера (99999999) */
	width: min(560px, calc(100% - 24px));
	pointer-events: none;
	display: flex;
	justify-content: center;
}
.cart-toast{
	position: relative;
	pointer-events: auto;
	display: flex;
	align-items: center;
	gap: 14px;
	width: 100%;
	padding: 14px 16px 16px;
	border-radius: 16px;
	background: rgba(28,28,30,.94);
	-webkit-backdrop-filter: blur(14px) saturate(1.2);
	backdrop-filter: blur(14px) saturate(1.2);
	border: 1px solid rgba(255,255,255,.1);
	box-shadow: 0 18px 48px rgba(0,0,0,.5);
	color: #fff;
	transform: translateY(-16px);
	opacity: 0;
	transition: transform .32s cubic-bezier(.2,.8,.25,1), opacity .32s ease;
	overflow: hidden;
}
.cart-toast.is-in{ transform: translateY(0); opacity: 1; }
.cart-toast::before{
	content:""; position:absolute; left:0; top:0; bottom:0; width:4px;
	background: linear-gradient(180deg,#ff6a6a,#e30016);
}
.cart-toast__icon{
	flex: 0 0 auto; width:40px; height:40px; border-radius:50%;
	display:flex; align-items:center; justify-content:center;
	background: radial-gradient(circle at 30% 30%, #ff6a6a, #e30016);
	color:#fff; font-size:16px;
	box-shadow: 0 0 0 6px rgba(227,0,22,.14);
}
.cart-toast__body{ flex: 1 1 auto; min-width: 0; }
.cart-toast__title{ font-weight:700; font-size:15px; line-height:1.3; }
.cart-toast__text,
.cart-toast__name{
	font-size:13px; opacity:.72; line-height:1.35; margin-top:2px;
	overflow:hidden; text-overflow:ellipsis; display:-webkit-box;
	-webkit-line-clamp:2; -webkit-box-orient:vertical;
}
.cart-toast__btn{
	flex: 0 0 auto;
	display:inline-flex; align-items:center; justify-content:center;
	padding: 10px 16px; border-radius: 12px;
	background: linear-gradient(135deg,#e30016,#c41e3a);
	color:#fff !important; font-weight:600; font-size:13px; text-decoration:none !important;
	white-space:nowrap; box-shadow: 0 6px 16px rgba(227,0,22,.4);
	transition: transform .18s ease, box-shadow .25s ease;
}
.cart-toast__btn:hover{ transform: translateY(-2px); box-shadow: 0 10px 22px rgba(227,0,22,.55); }
.cart-toast__close{
	position:absolute; top:8px; right:8px;
	width:26px; height:26px; border:0; border-radius:50%;
	background: rgba(255,255,255,.08); color:#fff; font-size:12px;
	display:flex; align-items:center; justify-content:center; cursor:pointer; opacity:.7;
}
.cart-toast__close:hover{ opacity:1; background: rgba(255,255,255,.16); }
.cart-toast__progress{
	position:absolute; left:0; bottom:0; height:2px; width:100%;
	background: linear-gradient(90deg,#ff6a6a,#e30016);
	transform-origin: left center;
	animation-name: toastProgress;
	animation-timing-function: linear;
	animation-fill-mode: forwards;
}
@keyframes toastProgress{ from{ transform: scaleX(1); } to{ transform: scaleX(0); } }
@media (max-width: 992px){
	.cart-toast-wrap{ top: calc(env(safe-area-inset-top, 0px) + 76px); }
	.cart-toast__btn{ padding: 10px 14px; }
}

/* ── 7. Анимация корзины при добавлении товара ── */
#cart-badge.is-bump{ animation: cartBadgeBump .5s cubic-bezier(.2,.8,.25,1); }
#cart-button.is-bump .fa-shopping-cart{ display:inline-block; animation: cartIconBump .5s cubic-bezier(.2,.8,.25,1); }
@keyframes cartBadgeBump{ 0%{transform:scale(1);} 40%{transform:scale(1.5);} 100%{transform:scale(1);} }
@keyframes cartIconBump{ 0%{transform:scale(1) rotate(0);} 40%{transform:scale(1.15) rotate(-8deg);} 100%{transform:scale(1) rotate(0);} }

/* ── 8. Состояние кнопки «В корзину» ── */
#button-cart.loading, #button-cart2.loading{ opacity:.75; pointer-events:none; cursor:progress; }
#product #button-cart.btn-primary.is-added,
#product #button-cart2.btn-primary.is-added,
#product-product #button-cart.is-added,
#product-product #button-cart2.is-added,
body #button-cart.is-added,
body #button-cart2.is-added{
	background: linear-gradient(135deg,#12a150,#0e8a43) !important;
	border-color:#12a150 !important;
	color:#fff !important;
	-webkit-text-fill-color:#fff !important;
	box-shadow: 0 10px 26px rgba(18,161,80,.5) !important;
	transform: translateY(-1px);
	transition: background .25s ease, box-shadow .25s ease, transform .25s ease;
}
#button-cart.is-added i, #button-cart2.is-added i{ margin-right:8px; }

/* ── 8b. Кнопка «В корзину» в карточках каталога ── */
.button-shop.loading{ opacity:.7; pointer-events:none; cursor:progress; }
.button-shop.is-added,
.product-thumb .button-shop.is-added,
.product-grid .button-shop.is-added,
.product-layout .button-shop.is-added{
	background: linear-gradient(135deg,#12a150,#0e8a43) !important;
	border-color:#12a150 !important;
	color:#fff !important;
	-webkit-text-fill-color:#fff !important;
	box-shadow: 0 8px 20px rgba(18,161,80,.4) !important;
}
.button-shop.is-added i{ margin-right:6px; }

@media (prefers-reduced-motion: reduce){
	.cart-toast, .cart-toast__progress, #cart-badge, #cart-button .fa-shopping-cart{ animation: none !important; transition: none !important; }
	.cart-toast{ transform: none !important; opacity: 1 !important; }
}
