/* ==========================================================================
   Cookie consent panel — design C4 "Glass panel"
   (includes/cookie-consent.php)
   --------------------------------------------------------------------------
   Frosted glass in the bottom-right corner. Uses the theme's colours,
   spacing and shadows when they're there, with fallbacks so it works on
   its own. While it's open (html.ddc-cookies-open) the WhatsApp button,
   which shares the corner, waits.
   ========================================================================== */

.ddc-cookies {
	--ddc-ck-ink: var(--color-ink, #1b1a19);
	--ddc-ck-paper: var(--color-paper, #e5e5e5);
	--ddc-ck-orange: var(--color-orange, #f7931e);
	--ddc-ck-line: var(--color-line, rgba(0, 0, 0, 0.1));
	--ddc-ck-gap: 28px;
	position: fixed;
	right: var(--ddc-ck-gap);
	bottom: var(--ddc-ck-gap);
	z-index: 99990;
	display: flex;
	flex-direction: column;
	gap: 10px;
	box-sizing: border-box;
	width: 340px;
	max-width: calc(100vw - 2 * var(--ddc-ck-gap));
	padding: 30px;
	border: 1px solid rgba(255, 255, 255, 0.6);
	border-radius: var(--radius, 15px);
	background-color: rgba(255, 255, 255, 0.6);
	box-shadow: var(--shadow-glass, rgba(0, 0, 0, 0.12) 0 8px 30px);
	-webkit-backdrop-filter: blur(18px) saturate(1.4);
	backdrop-filter: blur(18px) saturate(1.4);
	color: var(--ddc-ck-ink);
	font-family: var(--font-sans, "Inter", -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif);
	line-height: 1.3;
	animation: ddc-ck-in 0.6s cubic-bezier(0.22, 1, 0.36, 1) 1.2s backwards;
}

.ddc-cookies[hidden] {
	display: none;
}

.ddc-cookies *,
.ddc-cookies *::before,
.ddc-cookies *::after {
	box-sizing: border-box;
}

.ddc-cookies p {
	margin: 0;
}

@keyframes ddc-ck-in {
	from { opacity: 0; translate: 0 24px; }
}

.ddc-cookies.is-leaving {
	opacity: 0;
	translate: 0 24px;
	transition: opacity 0.3s, translate 0.3s;
}

/* Reopened from the footer: no wait. */
.ddc-cookies.is-now {
	animation-delay: 0s;
}

.ddc-cookies__label {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 12px;
	font-weight: 500;
	text-transform: uppercase;
}

.ddc-cookies__label span {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: var(--ddc-ck-orange);
}

.ddc-cookies__text {
	font-size: 14px;
	font-weight: 300;
}

.ddc-cookies__list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 10px 0;
	border-top: 1px solid var(--ddc-ck-line);
	border-bottom: 1px solid var(--ddc-ck-line);
}

/* One switch row: toggle, name, and a short note on the right. */
.ddc-cookies__switch {
	position: relative;
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
}

.ddc-cookies__switch input {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
}

.ddc-cookies__toggle {
	position: relative;
	flex-shrink: 0;
	width: 36px;
	height: 20px;
	border-radius: var(--radius-pill, 50px);
	background-color: rgba(0, 0, 0, 0.12);
	transition: background-color 0.3s;
}

.ddc-cookies__toggle::after {
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background-color: #fff;
	transition: translate 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.ddc-cookies__switch input:checked + .ddc-cookies__toggle {
	background-color: var(--ddc-ck-orange);
}

.ddc-cookies__switch input:checked + .ddc-cookies__toggle::after {
	translate: 16px 0;
}

.ddc-cookies__switch input:disabled + .ddc-cookies__toggle {
	opacity: 0.6;
}

.ddc-cookies__switch input:disabled ~ * {
	cursor: default;
}

.ddc-cookies__switch input:focus-visible + .ddc-cookies__toggle {
	outline: 2px solid var(--ddc-ck-orange);
	outline-offset: 2px;
}

.ddc-cookies__note {
	margin-left: auto;
	font-size: 12px;
	font-weight: 400;
	opacity: 0.55;
}

/* The theme's pill buttons (light and dark), with their hover. */
.ddc-cookies__actions {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 5px;
}

.ddc-cookies__button {
	height: 40px;
	padding: 0 1em;
	border: 0;
	border-radius: var(--radius-pill, 50px);
	font-family: inherit;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: -0.5px;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.3s, color 0.3s, box-shadow 0.3s, translate 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.ddc-cookies__button--light {
	background-color: var(--ddc-ck-paper);
	box-shadow: var(--shadow-soft, 0 4px 12px rgba(158, 158, 158, 0.5));
	color: var(--ddc-ck-ink);
}

.ddc-cookies__button--dark {
	background-color: var(--ddc-ck-ink);
	box-shadow: var(--shadow-deep, 0 6px 16px rgba(0, 0, 0, 0.35));
	color: var(--ddc-ck-paper);
}

.ddc-cookies__button--light:hover,
.ddc-cookies__button--light:focus-visible {
	background-color: var(--ddc-ck-ink);
	box-shadow: var(--shadow-deep, 0 6px 16px rgba(0, 0, 0, 0.35));
	color: var(--ddc-ck-paper);
	translate: 0 -3px;
}

.ddc-cookies__button--dark:hover,
.ddc-cookies__button--dark:focus-visible {
	background-color: var(--ddc-ck-paper);
	box-shadow: var(--shadow-soft, 0 4px 12px rgba(158, 158, 158, 0.5));
	color: var(--ddc-ck-ink);
	translate: 0 -3px;
}

/* The WhatsApp button waits while the panel is open, then comes back. */
.ddc-wa__dock {
	transition: opacity 0.3s, visibility 0.3s;
}

html.ddc-cookies-open .ddc-wa__dock {
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
}

/* Phones: across the bottom, edge to edge with a small margin. */
@media (max-width: 478px) {
	.ddc-cookies {
		--ddc-ck-gap: 10px;
		width: auto;
		left: var(--ddc-ck-gap);
		padding: 20px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ddc-cookies,
	.ddc-cookies.is-leaving {
		animation: none;
		transition: none;
	}
}