/**
 * WCAR Pro On-site Banner.
 *
 * The wrapper is a positioning shell only — it does not impose colors,
 * typography, padding, or layout on the banner content. Whatever the
 * merchant authored in the block editor renders unchanged.
 *
 * Position variants:
 *   top         — full-width sticky bar at the top of the viewport
 *   bottom      — full-width sticky bar at the bottom of the viewport
 *   bottom-right / bottom-left — floating card pinned to a bottom corner
 *   top-right   / top-left     — floating card pinned to a top corner
 */
#wcar-banner-root {
	position: fixed;
	z-index: 99999;
	box-sizing: border-box;
	max-width: 100vw;
}

/* Inline / shortcode placement — no fixed positioning, just sits in normal flow.
   `!important` defends against theme rules that might re-impose position: fixed
   on elements inside their content area. */
#wcar-banner-root[data-position="inline"] {
	position: static !important;
	top: auto !important;
	bottom: auto !important;
	left: auto !important;
	right: auto !important;
	z-index: auto !important;
	max-width: none;
}

#wcar-banner-root *,
#wcar-banner-root *::before,
#wcar-banner-root *::after {
	box-sizing: border-box;
}

#wcar-banner-root[data-position="top"] {
	top: 0;
	left: 0;
	right: 0;
}

#wcar-banner-root[data-position="bottom"] {
	bottom: 0;
	left: 0;
	right: 0;
}

.wcar-banner-content {
	position: relative;
}

/* Strip inherited block-library / theme margins on the first/last child so
   the banner content sits flush against the wrapper edges. */
.wcar-banner-content > *:first-child {
	margin-top: 0;
}

.wcar-banner-content > *:last-child {
	margin-bottom: 0;
}

/* Background and X color are overridden inline by JS to the inverse of the
   banner's own background; the values below are a neutral fallback for when
   JS bails (transparent banner, missing children, JS disabled). */
.wcar-banner-close {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 28px;
	height: 28px;
	padding: 0;
	border: 0;
	background: rgba( 255, 255, 255, 0.85 );
	color: #1f2937;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	border-radius: 50%;
	transition: opacity 0.15s ease;
	z-index: 1;
}

.wcar-banner-close:hover,
.wcar-banner-close:focus {
	opacity: 0.85;
	outline: none;
}