/**
 * Announcer frontend styles.
 *
 * Uses position:fixed so the bar displays correctly regardless of
 * where the HTML lands in the DOM. JS moves it to body's first child
 * and adds body padding to prevent content overlap.
 *
 * @package FisHotel\Misc\Sections\Announcer
 */

/* ------------------------------------------------------------------ */
/*  Bar Base — position:fixed, JS handles body offset                  */
/* ------------------------------------------------------------------ */
.ancr-bar {
	position: fixed !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	height: auto !important;
	bottom: auto !important;
	top: auto !important;
	margin: 0 !important;
	box-sizing: border-box !important;
	z-index: 9999999 !important;
	line-height: 1.5;
	text-align: center;
	transition: transform 0.4s ease, opacity 0.4s ease;
}

/* Hide theme skip/accessibility links that overlap the bar */
body:has(.ancr-bar) .nelson_skip_link,
body:has(.ancr-bar) .skip-link {
	display: none !important;
}

.ancr-bar *,
.ancr-bar *::before,
.ancr-bar *::after {
	box-sizing: border-box;
}

.ancr-bar.ancr-hidden {
	display: none !important;
}

/* ------------------------------------------------------------------ */
/*  Positions                                                          */
/* ------------------------------------------------------------------ */
.ancr-bar.ancr-pos-top {
	top: 0 !important;
	bottom: auto !important;
}

.ancr-bar.ancr-pos-bottom {
	bottom: 0 !important;
	top: auto !important;
}

/* ------------------------------------------------------------------ */
/*  Shortcode — inline, not fixed                                      */
/* ------------------------------------------------------------------ */
.ancr-bar.ancr-shortcode {
	position: relative !important;
	top: auto !important;
	bottom: auto !important;
	left: auto !important;
	right: auto !important;
	z-index: auto !important;
}

/* ------------------------------------------------------------------ */
/*  Layout                                                             */
/* ------------------------------------------------------------------ */
.ancr-inner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	max-width: 100%;
	margin: 0 auto;
	position: relative;
}

.ancr-bar.ancr-boxed .ancr-inner {
	max-width: 1200px;
}

/* ------------------------------------------------------------------ */
/*  Messages                                                           */
/* ------------------------------------------------------------------ */
.ancr-messages {
	flex: 1;
	overflow: hidden;
	position: relative;
	min-height: 1.5em;
}

.ancr-message {
	display: none;
	align-items: center;
	justify-content: center;
	gap: 12px;
}

.ancr-message--active {
	display: flex;
}

.ancr-content {
	flex: 1;
}

.ancr-content p {
	margin: 0;
}

.ancr-content a {
	color: inherit;
	text-decoration: underline;
}

/* ------------------------------------------------------------------ */
/*  CTA Buttons                                                        */
/* ------------------------------------------------------------------ */
.ancr-cta-wrap {
	display: flex;
	gap: 8px;
	flex-shrink: 0;
}

.ancr-cta-btn {
	display: inline-block;
	padding: 6px 18px;
	border-radius: 4px;
	font-size: 0.9em;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: opacity 0.2s, transform 0.2s;
	border: none;
}

.ancr-cta-btn:hover {
	opacity: 0.88;
	transform: scale(1.03);
}

/* ------------------------------------------------------------------ */
/*  Close Button                                                       */
/* ------------------------------------------------------------------ */
.ancr-close {
	background: none;
	border: none;
	color: inherit;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	padding: 0 4px;
	opacity: 0.7;
	transition: opacity 0.2s;
	flex-shrink: 0;
}

.ancr-close:hover {
	opacity: 1;
}

/* ------------------------------------------------------------------ */
/*  Nav Buttons (Ticker)                                               */
/* ------------------------------------------------------------------ */
.ancr-nav {
	display: flex;
	gap: 4px;
	flex-shrink: 0;
}

.ancr-nav-btn {
	background: rgba(255, 255, 255, 0.15);
	border: none;
	color: inherit;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.2s;
}

.ancr-nav-btn:hover {
	background: rgba(255, 255, 255, 0.3);
}

/* ------------------------------------------------------------------ */
/*  Countdown Timer                                                    */
/* ------------------------------------------------------------------ */
.ancr-countdown {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
	font-variant-numeric: tabular-nums;
}

.ancr-cd-label {
	font-weight: 600;
	white-space: nowrap;
}

.ancr-cd-timer {
	display: flex;
	align-items: center;
	gap: 2px;
}

.ancr-cd-part {
	background: rgba(0, 0, 0, 0.2);
	padding: 2px 6px;
	border-radius: 3px;
	font-weight: 700;
	font-size: 0.95em;
	min-width: 2ch;
	text-align: center;
}

.ancr-cd-sep {
	font-weight: 700;
	opacity: 0.6;
}

/* ------------------------------------------------------------------ */
/*  Marquee / Horizontal Ticker                                        */
/* ------------------------------------------------------------------ */
.ancr-bar.ancr-marquee .ancr-messages {
	overflow: hidden;
}

.ancr-bar.ancr-marquee .ancr-message {
	display: flex;
	white-space: nowrap;
	animation: ancr-marquee var(--ancr-marquee-speed, 20s) linear infinite;
	padding-left: 100%;
}

@keyframes ancr-marquee {
	0%   { transform: translateX(0); }
	100% { transform: translateX(-100%); }
}

/* ------------------------------------------------------------------ */
/*  Show / Close Animations                                            */
/* ------------------------------------------------------------------ */
.ancr-anim-show-slide  { animation: ancr-slideDown  0.4s ease forwards; }
.ancr-anim-show-fade   { animation: ancr-fadeIn     0.4s ease forwards; }
.ancr-anim-show-bounce { animation: ancr-bounceIn   0.6s ease forwards; }
.ancr-anim-show-zoom   { animation: ancr-zoomIn     0.4s ease forwards; }

.ancr-anim-close-slide  { animation: ancr-slideUp   0.3s ease forwards; }
.ancr-anim-close-fade   { animation: ancr-fadeOut   0.3s ease forwards; }
.ancr-anim-close-bounce { animation: ancr-bounceOut 0.4s ease forwards; }
.ancr-anim-close-zoom   { animation: ancr-zoomOut  0.3s ease forwards; }

/* ------------------------------------------------------------------ */
/*  CTA Button Animations                                              */
/* ------------------------------------------------------------------ */
.ancr-anim-bounce     { animation: ancr-btn-bounce     1s   ease infinite; }
.ancr-anim-flash      { animation: ancr-btn-flash      1.2s ease infinite; }
.ancr-anim-pulse      { animation: ancr-btn-pulse      1.5s ease infinite; }
.ancr-anim-shake      { animation: ancr-btn-shake      0.8s ease infinite; }
.ancr-anim-swing      { animation: ancr-btn-swing      1s   ease infinite; }
.ancr-anim-tada       { animation: ancr-btn-tada       1s   ease infinite; }
.ancr-anim-wobble     { animation: ancr-btn-wobble     1s   ease infinite; }
.ancr-anim-jello      { animation: ancr-btn-jello      1s   ease infinite; }
.ancr-anim-heartbeat  { animation: ancr-btn-heartbeat  1.4s ease infinite; }
.ancr-anim-rubberband { animation: ancr-btn-rubberband 1s   ease infinite; }

/* ------------------------------------------------------------------ */
/*  Keyframes — Bar                                                    */
/* ------------------------------------------------------------------ */
@keyframes ancr-slideDown  { from { transform: translateY(-100%); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
@keyframes ancr-fadeIn     { from { opacity: 0; } to { opacity: 1; } }
@keyframes ancr-bounceIn   { 0% { transform: translateY(-100%); opacity: 0; } 60% { transform: translateY(5px); opacity: 1; } 100% { transform: translateY(0); } }
@keyframes ancr-zoomIn     { from { transform: scale(0.5); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes ancr-slideUp    { from { transform: translateY(0); opacity: 1; } to { transform: translateY(-100%); opacity: 0; } }
@keyframes ancr-fadeOut    { from { opacity: 1; } to { opacity: 0; } }
@keyframes ancr-bounceOut  { 0% { transform: translateY(0); } 20% { transform: translateY(5px); } 100% { transform: translateY(-100%); opacity: 0; } }
@keyframes ancr-zoomOut    { from { transform: scale(1); opacity: 1; } to { transform: scale(0.5); opacity: 0; } }

/* ------------------------------------------------------------------ */
/*  Keyframes — CTA Buttons                                            */
/* ------------------------------------------------------------------ */
@keyframes ancr-btn-bounce     { 0%,20%,50%,80%,100% { transform:translateY(0); } 40% { transform:translateY(-8px); } 60% { transform:translateY(-4px); } }
@keyframes ancr-btn-flash      { 0%,50%,100% { opacity:1; } 25%,75% { opacity:0.2; } }
@keyframes ancr-btn-pulse      { 0% { transform:scale(1); } 50% { transform:scale(1.08); } 100% { transform:scale(1); } }
@keyframes ancr-btn-shake      { 0%,100% { transform:translateX(0); } 10%,30%,50%,70%,90% { transform:translateX(-4px); } 20%,40%,60%,80% { transform:translateX(4px); } }
@keyframes ancr-btn-swing      { 20% { transform:rotate(12deg); } 40% { transform:rotate(-8deg); } 60% { transform:rotate(4deg); } 80% { transform:rotate(-4deg); } 100% { transform:rotate(0); } }
@keyframes ancr-btn-tada       { 0% { transform:scale(1) rotate(0); } 10%,20% { transform:scale(.9) rotate(-3deg); } 30%,50%,70%,90% { transform:scale(1.1) rotate(3deg); } 40%,60%,80% { transform:scale(1.1) rotate(-3deg); } 100% { transform:scale(1) rotate(0); } }
@keyframes ancr-btn-wobble     { 0% { transform:translateX(0); } 15% { transform:translateX(-10px) rotate(-5deg); } 30% { transform:translateX(8px) rotate(3deg); } 45% { transform:translateX(-6px) rotate(-3deg); } 60% { transform:translateX(4px) rotate(2deg); } 75% { transform:translateX(-2px) rotate(-1deg); } 100% { transform:translateX(0); } }
@keyframes ancr-btn-jello      { 0%,11.1%,100% { transform:none; } 22.2% { transform:skewX(-12.5deg) skewY(-12.5deg); } 33.3% { transform:skewX(6.25deg) skewY(6.25deg); } 44.4% { transform:skewX(-3.125deg) skewY(-3.125deg); } 55.5% { transform:skewX(1.5625deg) skewY(1.5625deg); } 66.6% { transform:skewX(-.78125deg) skewY(-.78125deg); } 77.7% { transform:skewX(.390625deg) skewY(.390625deg); } 88.8% { transform:skewX(-.1953125deg) skewY(-.1953125deg); } }
@keyframes ancr-btn-heartbeat  { 0% { transform:scale(1); } 14% { transform:scale(1.15); } 28% { transform:scale(1); } 42% { transform:scale(1.15); } 70% { transform:scale(1); } }
@keyframes ancr-btn-rubberband { 0% { transform:scaleX(1) scaleY(1); } 30% { transform:scaleX(1.25) scaleY(.75); } 40% { transform:scaleX(.75) scaleY(1.25); } 50% { transform:scaleX(1.15) scaleY(.85); } 65% { transform:scaleX(.95) scaleY(1.05); } 75% { transform:scaleX(1.05) scaleY(.95); } 100% { transform:scaleX(1) scaleY(1); } }

/* ------------------------------------------------------------------ */
/*  Responsive                                                         */
/* ------------------------------------------------------------------ */
@media (max-width: 600px) {
	.ancr-inner {
		flex-wrap: wrap;
		gap: 8px;
		padding-right: 30px;
	}

	.ancr-cta-wrap {
		justify-content: center;
	}

	.ancr-countdown {
		font-size: 0.85em;
	}

	.ancr-close {
		position: absolute;
		top: 4px;
		right: 4px;
	}
}