/* SVT Soon — подсказка «Онлайн-магазин скоро откроется». */
.svt-soon {
	position: absolute;
	z-index: 10000;
	box-sizing: border-box;
	width: 340px;
	max-width: calc(100vw - 24px);
	padding: 20px 20px 16px;
	border-top: 3px solid #08cbcf;
	background: #fff;
	box-shadow: 0 14px 36px rgba(0, 0, 0, 0.18);
	font-family: "Open Sans", Arial, sans-serif;
	color: #444;
	text-align: left;
	animation: svt-soon-in 0.15s ease-out;
}
.svt-soon:focus { outline: none; }
.svt-soon::before {
	content: "";
	position: absolute;
	left: var(--svt-soon-arrow, 40px);
	width: 16px;
	height: 16px;
	background: #fff;
	transform: rotate(45deg);
}
.svt-soon--above::before { bottom: -8px; box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.06); }
.svt-soon--below::before { top: -11px; background: #08cbcf; }
.svt-soon .svt-soon__close {
	position: absolute;
	min-width: 0;
	min-height: 0;
	border-radius: 0;
	box-shadow: none;
	top: 6px;
	right: 6px;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	background: none;
	font-size: 24px;
	line-height: 1;
	color: #999;
	cursor: pointer;
}
.svt-soon .svt-soon__close:hover,
.svt-soon .svt-soon__close:focus-visible { background: none; color: #333; }
.svt-soon__title {
	margin: 0 26px 6px 0;
	font-family: "Montserrat", Arial, sans-serif;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
	color: #333;
}
.svt-soon__text {
	margin: 0 0 14px;
	font-size: 14px;
	line-height: 1.5;
}
.svt-soon__actions {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
}
.svt-soon .svt-soon__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 10px 8px;
	border: 1px solid #333;
	background: #fff;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
	color: #333;
	text-decoration: none;
	text-transform: none;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.svt-soon .svt-soon__btn svg { flex: none; }
.svt-soon .svt-soon__btn:hover,
.svt-soon .svt-soon__btn:focus-visible { background: #333; color: #fff; }
.svt-soon .svt-soon__btn--wide { grid-column: 1 / -1; }
.svt-soon .svt-soon__btn--main { background: #333; color: #fff; font-size: 15px; }
.svt-soon .svt-soon__btn--main:hover,
.svt-soon .svt-soon__btn--main:focus-visible { border-color: #08cbcf; background: #08cbcf; color: #fff; }
.svt-soon__hours {
	margin: 12px 0 0;
	font-size: 12px;
	color: #888;
	text-align: center;
}
.svt-soon-backdrop { display: none; }

/* Телефон: карточка выезжает снизу экрана. */
@media (max-width: 575.98px) {
	.svt-soon-backdrop {
		display: block;
		position: fixed;
		inset: 0;
		z-index: 9999;
		background: rgba(0, 0, 0, 0.35);
	}
	.svt-soon {
		position: fixed;
		top: auto !important;
		right: 0;
		bottom: 0;
		left: 0 !important;
		width: auto;
		max-width: none;
		max-height: 90vh;
		overflow-y: auto;
		padding: 22px 18px calc(18px + env(safe-area-inset-bottom));
		animation-name: svt-soon-up;
		animation-duration: 0.2s;
	}
	.svt-soon::before { display: none; }
	.svt-soon .svt-soon__btn { padding: 13px 8px; }
}

@keyframes svt-soon-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes svt-soon-up { from { transform: translateY(100%); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) {
	.svt-soon { animation: none; }
	.svt-soon .svt-soon__btn { transition: none; }
}