/**
 * Global Site Builder components (Phase 2.20).
 *
 * Site notice bar (info / emergency / holiday / maintenance), the floating
 * action stack (WhatsApp / Call / back-to-top), and the sticky-header opt-out.
 * All of these only appear when the Global Layout admin enables them, so this
 * file is inert on a default install. Depends on tokens.css for the custom
 * properties; falls back to literal colours where a semantic token may not
 * exist across themes.
 */

/* ------------------------------------------------------------------ *
 * Site notice bar
 * ------------------------------------------------------------------ */

.site-notice {
	position: relative;
	z-index: 60;
	font-size: var(--font-size-sm, 0.875rem);
	line-height: 1.4;
}

.site-notice.is-dismissed {
	display: none;
}

.site-notice__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-4, 1rem);
	padding-block: var(--space-2, 0.5rem);
	text-align: center;
}

.site-notice__message {
	margin: 0;
}

.site-notice__link {
	color: inherit;
	font-weight: var(--font-weight-semibold, 600);
	text-decoration: underline;
}

.site-notice__dismiss {
	position: absolute;
	inset-inline-end: var(--space-3, 0.75rem);
	inset-block-start: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	inline-size: 1.75rem;
	block-size: 1.75rem;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: inherit;
	cursor: pointer;
	opacity: 0.8;
}

.site-notice__dismiss:hover,
.site-notice__dismiss:focus-visible {
	opacity: 1;
	background: rgba(0, 0, 0, 0.12);
}

.site-notice__dismiss svg {
	inline-size: 1rem;
	block-size: 1rem;
}

/* Variants — each is a solid, WCAG-AA contrasting band. */
.site-notice--info {
	background: var(--color-primary-50, #eef2ff);
	color: var(--color-text, #1f2937);
	border-block-end: 1px solid var(--color-primary-100, #e0e7ff);
}

.site-notice--emergency {
	background: #b3261e;
	color: #fff;
}

.site-notice--holiday {
	background: #1f7a54;
	color: #fff;
}

.site-notice--maintenance {
	background: #9a6700;
	color: #fff;
}

/* ------------------------------------------------------------------ *
 * Floating actions (WhatsApp / Call / back-to-top)
 * ------------------------------------------------------------------ */

.floating-actions {
	position: fixed;
	inset-block-end: var(--space-5, 1.25rem);
	inset-inline-end: var(--space-5, 1.25rem);
	z-index: 90;
	display: flex;
	flex-direction: column;
	gap: var(--space-3, 0.75rem);
}

.floating-action {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	inline-size: 3rem;
	block-size: 3rem;
	border: 0;
	border-radius: 999px;
	background: var(--color-brand-primary, #3f51b5);
	color: #fff;
	box-shadow: var(--shadow-lg, 0 8px 24px rgba(0, 0, 0, 0.18));
	cursor: pointer;
	text-decoration: none;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.floating-action:hover,
.floating-action:focus-visible {
	transform: translateY(-2px);
	box-shadow: var(--shadow-xl, 0 12px 32px rgba(0, 0, 0, 0.24));
	color: #fff;
}

.floating-action svg {
	inline-size: 1.5rem;
	block-size: 1.5rem;
}

.floating-action--whatsapp {
	background: #25d366;
}

.floating-action--call {
	background: #1f7a54;
}

.floating-action--top {
	background: var(--color-brand-primary, #3f51b5);
}

/* Chevron glyph points right by default — rotate it to point up. */
.floating-action--top svg {
	transform: rotate(-90deg);
}

.floating-action--top[hidden] {
	display: none;
}

/* ------------------------------------------------------------------ *
 * Sticky-header opt-out (Global Layout → header_sticky off)
 * ------------------------------------------------------------------ */

.no-sticky-header .site-header {
	position: static;
}

@media (prefers-reduced-motion: reduce) {
	.floating-action {
		transition: none;
	}
}