/*
 * Pakkumiste bänner — avalik pool.
 * Selektorid on tahtlikult #pb-banner külge seotud ja !important'iga:
 * WordPressi teemad (nt WoodMart) stiilivad agressiivselt kõiki button- ja
 * a-elemente ning muidu lõhuksid bänneri paigutuse.
 */

#pb-banner.pb-banner {
	position: fixed !important;
	left: 0 !important;
	right: 0 !important;
	z-index: 99999;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	margin: 0 !important;
	padding: 14px 56px !important;
	text-align: center;
	line-height: 1.5;
	box-sizing: border-box;
	box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.18);
}

#pb-banner.pb-pos-bottom { bottom: 0 !important; top: auto !important; }
#pb-banner.pb-pos-top {
	top: 0 !important;
	bottom: auto !important;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.18);
}

#pb-banner .pb-inner {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	gap: 10px;
	max-width: 100%;
}
#pb-banner .pb-lines { max-width: 900px; }
#pb-banner .pb-line-1 { font-weight: 700; }

#pb-banner .pb-extras {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-wrap: wrap;
	gap: 8px 14px;
}

/* Kupongikoodi nupp */
#pb-banner .pb-coupon {
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px;
	margin: 0 !important;
	padding: 7px 14px !important;
	min-width: 0 !important;
	min-height: 0 !important;
	border: 1px solid currentColor !important;
	border-radius: 999px !important;
	background: none !important;
	background-color: rgba(127, 127, 127, .16) !important;
	box-shadow: none !important;
	text-shadow: none !important;
	color: inherit !important;
	font: inherit !important;
	font-size: .92em !important;
	line-height: 1.2 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	transition: background-color .18s ease, transform .12s ease;
}
#pb-banner .pb-coupon:hover { background-color: rgba(127, 127, 127, .3) !important; }
#pb-banner .pb-coupon:active { transform: scale(.97); }
#pb-banner .pb-coupon.pb-copied { background-color: rgba(127, 127, 127, .34) !important; }

#pb-banner .pb-coupon-code {
	font-weight: 700;
	letter-spacing: .06em;
	padding: 2px 8px;
	border-radius: 4px;
	background: rgba(127, 127, 127, .28);
}
#pb-banner .pb-coupon.pb-copied .pb-coupon-code { opacity: .55; }

/* Tagasiloendus */
#pb-banner .pb-countdown {
	font-size: .92em;
	opacity: .85;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

/* Kui päise nupust bänner uuesti avatakse, tõmbame korraks tähelepanu */
@keyframes pb-attention {
	0%, 100% { box-shadow: 0 -2px 12px rgba(0, 0, 0, .18); }
	30%, 70% { box-shadow: 0 0 0 3px rgba(127, 127, 127, .55), 0 -2px 12px rgba(0, 0, 0, .18); }
}
#pb-banner.pb-attention { animation: pb-attention 1.4s ease; }

/* Päise nupp (lühikood [pakkumiste_sooduskood]) */
.pb-header-btn {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px;
	padding: 5px 14px !important;
	min-width: 0 !important;
	min-height: 0 !important;
	border: 1px solid currentColor !important;
	border-radius: 999px !important;
	background: none !important;
	background-color: transparent !important;
	box-shadow: none !important;
	color: inherit !important;
	font: inherit !important;
	font-size: 12px !important;
	line-height: 1.4 !important;
	letter-spacing: .04em;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	transition: background-color .18s ease, opacity .18s ease;
}
.pb-header-btn::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: currentColor;
	opacity: .75;
}
.pb-header-btn:hover { background-color: rgba(127, 127, 127, .22) !important; }

@media (max-width: 768px) {
	.pb-header-btn.pb-hide-mobile { display: none !important; }
}

#pb-banner .pb-link,
#pb-banner .pb-link:hover,
#pb-banner .pb-link:focus {
	color: inherit !important;
	text-decoration: none !important;
	display: block;
	box-shadow: none !important;
}

/* Sulgemisnupp: väike ja tagasihoidlik, ilmub selgemalt alles hiirega kohal käies.
   Kõik teema nupustiilid (taust, ääris, padding, min-width) nullitakse. */
#pb-banner .pb-close {
	position: absolute !important;
	top: 50% !important;
	right: 10px !important;
	left: auto !important;
	bottom: auto !important;
	transform: translateY(-50%) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 34px !important;
	height: 34px !important;
	min-width: 0 !important;
	min-height: 0 !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: none !important;
	background-color: transparent !important;
	box-shadow: none !important;
	text-shadow: none !important;
	color: inherit !important;
	font-size: 0 !important;
	line-height: 1 !important;
	letter-spacing: normal !important;
	cursor: pointer;
	opacity: .32;
	-webkit-appearance: none;
	appearance: none;
	transition: opacity .18s ease, background-color .18s ease;
}

#pb-banner .pb-close:hover,
#pb-banner .pb-close:focus-visible {
	opacity: .85;
	background-color: rgba(127, 127, 127, .22) !important;
	outline: none;
}

#pb-banner .pb-close:focus-visible {
	box-shadow: 0 0 0 2px rgba(127, 127, 127, .45) !important;
}

#pb-banner .pb-close svg {
	display: block;
	width: 13px;
	height: 13px;
	pointer-events: none;
}

@media (max-width: 600px) {
	#pb-banner.pb-banner { padding: 12px 42px !important; }
	#pb-banner .pb-close { right: 4px !important; }
	#pb-banner .pb-inner { gap: 8px; }
	#pb-banner .pb-coupon { padding: 6px 12px !important; }
}

@media (prefers-reduced-motion: reduce) {
	#pb-banner .pb-close,
	#pb-banner .pb-coupon,
	.pb-header-btn { transition: none; }
	#pb-banner.pb-attention { animation: none; }
}

/*
 * PEAB JÄÄMA FAILI LÕPPU.
 * `hidden` atribuut üksi ei peida elementi, millel on display:flex —
 * brauseri vaikereegel [hidden]{display:none} kaotab autori stiilile.
 * Kõrgem spetsiifilisus (id + 2 klassi/atribuuti) võidab kindlalt.
 */
#pb-banner[hidden].pb-banner { display: none !important; }
