/* ===========================================================
   Плашка-уведомление о cookie
   -----------------------------------------------------------
   Стеклянная карточка внизу экрана в стиле хедера-пилюли.
   Показ/скрытие управляет js/cookie-notice.js через классы
   .is-visible / .is-hidden; согласие хранится в localStorage
   (ключ pogoCookieOk).
   =========================================================== */

.cookie-notice {
	position: fixed;
	left: 50%;
	bottom: 1.25rem;
	z-index: 90;
	transform: translate(-50%, calc(100% + 2rem));
	display: flex;
	align-items: center;
	gap: 1.5rem;
	max-width: min(46rem, calc(100% - 2rem));
	padding: 1rem 1rem 1rem 1.5rem;
	background: rgba(14, 14, 16, .82);
	-webkit-backdrop-filter: blur(18px) saturate(1.5);
	backdrop-filter: blur(18px) saturate(1.5);
	border: 1px solid rgba(255, 255, 255, .12);
	box-shadow:
		0 10px 40px rgba(0, 0, 0, .55),
		0 0 24px rgba(56, 64, 255, .12),
		inset 0 1px 0 rgba(255, 255, 255, .07);
	opacity: 0;
	visibility: hidden;
	transition: transform .45s ease-out, opacity .45s ease-out, visibility .45s;
}

.cookie-notice.is-visible {
	transform: translate(-50%, 0);
	opacity: 1;
	visibility: visible;
}

.cookie-notice.is-hidden {
	transform: translate(-50%, calc(100% + 2rem));
	opacity: 0;
	visibility: hidden;
}

.cookie-notice__text {
	font-size: .875rem;
	line-height: 1.45;
	color: rgba(255, 255, 255, .75);
}

.cookie-notice__text a {
	color: #6a70ff;
	text-decoration: underline;
	text-underline-offset: .1875rem;
}

.cookie-notice__actions {
	flex-shrink: 0;
	display: flex;
	gap: .625rem;
}

.cookie-notice__btn {
	padding: .75rem 1.375rem;
	font-size: .875rem;
	white-space: nowrap;
	color: #fff;
	background: linear-gradient(135deg, #3840ff, #262cc4);
	border: 1px solid rgba(255, 255, 255, .14);
	cursor: pointer;
	transition: box-shadow .3s ease-out, transform .3s ease-out, border-color .3s ease-out;
}

.cookie-notice__btn:hover {
	box-shadow: 0 0 20px rgba(56, 64, 255, .45);
	transform: translateY(-1px);
}

.cookie-notice__btn--ghost {
	background: transparent;
	color: rgba(255, 255, 255, .7);
}

.cookie-notice__btn--ghost:hover {
	box-shadow: none;
	border-color: rgba(255, 255, 255, .4);
	color: #fff;
}

@media (prefers-reduced-motion: reduce) {
	.cookie-notice,
	.cookie-notice__btn {
		transition: none;
	}
}

@media (max-width: 47.99875em) {
	.cookie-notice {
		bottom: .75rem;
		flex-direction: column;
		align-items: stretch;
		gap: .875rem;
		padding: 1rem 1.25rem;
		text-align: center;
	}

	.cookie-notice__actions {
		flex-direction: column;
	}
}
