/**
 * The cookie notice.
 *
 * A bar along the bottom rather than a dialogue over the page: nothing here is
 * urgent enough to stop somebody reading, and a modal that blocks a car listing
 * to ask about statistics is the pattern everyone has learned to dismiss without
 * reading. It sits above the floating call buttons and leaves them room.
 */

.stw-consent {
	background: var(--wp--preset--color--surface, #14161a);
	border-top: 1px solid var(--wp--custom--line-2, rgba(255, 255, 255, 0.12));
	bottom: 0;
	box-shadow: 0 -18px 44px rgba(0, 0, 0, 0.45);
	color: var(--wp--preset--color--contrast, #f2f2f2);
	left: 0;
	position: fixed;
	right: 0;
	z-index: 90;
}

.stw-consent[hidden] {
	display: none;
}

.stw-consent__inner {
	align-items: center;
	display: flex;
	gap: 28px;
	justify-content: space-between;
	margin: 0 auto;
	max-width: var(--wp--style--global--content-size, 1320px);
	/* The right padding clears the floating call buttons, which are 48-56 px
	   wide and live in the same corner. */
	padding: 20px 96px 20px 24px;
}

.stw-consent__title {
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.02em;
	margin: 0 0 4px;
}

.stw-consent__lede {
	color: var(--wp--preset--color--muted, #a7a7a7);
	font-size: 14px;
	line-height: 1.55;
	margin: 0;
	max-width: 76ch;
}

.stw-consent__link {
	color: var(--wp--preset--color--accent, #d7b177);
	text-decoration: underline;
	text-underline-offset: 3px;
	white-space: nowrap;
}

.stw-consent__actions {
	display: flex;
	flex-shrink: 0;
	gap: 12px;
}

.stw-consent__actions .stw-btn {
	padding-left: 22px;
	padding-right: 22px;
}

@media (max-width: 860px) {
	.stw-consent__inner {
		align-items: stretch;
		flex-direction: column;
		gap: 16px;
		/* Stacked, the buttons are a full-width row of their own, so the corner
		   no longer has to be kept clear for the floating stack - it sits above
		   the notice instead. */
		padding: 18px 18px 20px;
	}

	.stw-consent__actions .stw-btn {
		flex: 1;
	}
}

@media (max-width: 420px) {
	.stw-consent__actions {
		flex-direction: column;
	}
}
