/**
 * McQueen Site — cookie consent banner.
 *
 * Self-contained and vertical-agnostic. Brand colours are read from the active
 * palette's custom properties where they exist, with literal fallbacks so the
 * banner still looks deliberate on a vertical that defines none of them.
 *
 * Sits above page content but below any modal (z-index 90 vs the lightbox's
 * 1000), and never covers the sticky mobile call bar's tap targets — the bar
 * gets padding pushed onto it while the banner is visible.
 */

.msc-cc {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 90;
	background: #fff;
	border-top: 1px solid var(--line, #e6edf4);
	box-shadow: 0 -10px 40px -18px rgba(19, 47, 76, .45);
	transform: translateY(110%);
	transition: transform .38s cubic-bezier(.16, .84, .44, 1);
	padding-bottom: env(safe-area-inset-bottom);
}

.msc-cc.is-visible { transform: translateY(0); }

.msc-cc-inner {
	max-width: 1180px;
	margin: 0 auto;
	padding: 16px 26px;
	display: flex;
	align-items: center;
	gap: 22px;
	flex-wrap: wrap;
}

.msc-cc-msg {
	flex: 1;
	min-width: 260px;
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--ink, #1b2733);
}

/* Scoped two levels deep on purpose: a vertical's own reset (e.g.
   `.msls-site a { color: inherit; text-decoration: none }`) outranks a single
   class, which silently turns this link into plain text. */
.msc-cc .msc-cc-msg a.msc-cc-link {
	color: var(--blue, #1f6feb);
	text-decoration: underline;
	white-space: nowrap;
}

.msc-cc-actions {
	display: flex;
	gap: 10px;
	flex: none;
}

/* Accept and Decline are deliberately the same size and weight. Making
   "Decline" harder to find is the classic dark pattern, and it invalidates
   the consent you were trying to collect. */
.msc-cc-btn {
	font-family: var(--head, inherit);
	font-weight: 600;
	font-size: 14.5px;
	line-height: 1;
	padding: 12px 26px;
	border-radius: 999px;
	cursor: pointer;
	border: 1px solid var(--line, #d8e2ec);
	transition: .2s;
}

.msc-cc-decline {
	background: #fff;
	color: var(--navy, #132f4c);
}

.msc-cc-decline:hover {
	border-color: var(--navy, #132f4c);
	background: #f6f9fc;
}

.msc-cc-accept {
	background: var(--blue, #1f6feb);
	border-color: var(--blue, #1f6feb);
	color: #fff;
}

.msc-cc-accept:hover { filter: brightness(1.07); }

.msc-cc-btn:focus-visible {
	outline: 3px solid var(--amber, #e9b949);
	outline-offset: 2px;
}

@media (max-width: 640px) {
	.msc-cc-inner { padding: 14px 20px; gap: 12px; }
	.msc-cc-msg { font-size: 13.5px; min-width: 0; }
	.msc-cc-actions { width: 100%; }
	.msc-cc-btn { flex: 1; padding: 13px 10px; }
	/* Clear the sticky mobile call bar so the banner never sits on top of it. */
	.msc-cc { bottom: 56px; }
}

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