/**
 * Consent banner, preferences panel and held-embed placeholder.
 *
 * Every value comes from tokens.css or the gap scale in fieldnote.css. Radius
 * stays 0 and there is no shadow, as everywhere else in this theme.
 *
 * Accept and Refuse deliberately share one class: Law 25 wants refusing to be
 * no harder than accepting, so they must not be told apart by weight, size or
 * colour.
 */

.fn-consent__scrim{position:fixed;inset:0;background:var(--fn-black-80);z-index:60}

/* The [hidden] attribute is how consent.js shows and hides these three. An
   author `display` rule outranks the browser's own [hidden] rule, so state it
   here or a dismissed banner stays on screen. */
.fn-consent[hidden],
.fn-consent__scrim[hidden],
.fn-consent__bar[hidden],
.fn-consent__panel[hidden]{display:none}

/* ── Banner ─────────────────────────────────────────────────────────── */

/* A slim strip, not a panel: the detail lives in the preferences panel and in
   the Cookie Policy, so the bar carries one short paragraph at label size and
   centres the buttons against it. */
.fn-consent__bar{position:fixed;left:0;right:0;bottom:0;z-index:70;
	background:var(--fn-navy);color:var(--fn-beige);
	border-top:var(--fn-rule-hairline-on-ink);
	padding:clamp(14px,1.2vw,20px) var(--fn-margin);
	display:flex;align-items:center;justify-content:space-between;
	gap:var(--fn-gutter);max-height:60vh;overflow-y:auto}

.fn-consent__copy{max-width:100ch}
.fn-consent__bar .fn-consent__copy > * + *{margin-top:var(--fn-gap-text)}

.fn-consent__title{margin:0;
	font:var(--fn-w-extrabold) var(--fd-label)/1.4 var(--fn-font-sans);
	letter-spacing:var(--fn-track-wide);text-transform:uppercase;
	color:var(--fn-lime)}

.fn-consent__text{margin:0;
	font:var(--fn-w-medium) var(--fd-label)/1.5 var(--fn-font-sans);
	letter-spacing:var(--fn-track-wide);color:var(--fn-beige)}

.fn-consent__link{color:var(--fn-beige);text-decoration:underline;
	text-underline-offset:4px;white-space:nowrap;margin-left:clamp(12px,1vw,20px)}
.fn-consent__link:hover,.fn-consent__link:focus-visible{color:var(--fn-lime)}

/* ── Buttons ────────────────────────────────────────────────────────── */

.fn-consent__actions{display:flex;flex-wrap:wrap;align-items:center;
	gap:clamp(10px,0.8vw,16px);flex:0 0 auto}

.fn-consent__btn{display:inline-flex;align-items:center;justify-content:center;
	min-height:44px;min-width:clamp(120px,9vw,160px);
	padding:0 clamp(16px,1.2vw,24px);border:0;border-radius:var(--fn-radius);
	font:var(--fn-w-semibold) var(--fd-label-s)/1 var(--fn-font-sans);
	letter-spacing:var(--fn-track-wide);text-transform:uppercase;cursor:pointer;
	transition:var(--fn-transition-color)}

.fn-consent__btn--solid{background:var(--fn-purple);color:var(--fn-beige);
	box-shadow:inset 0 0 0 1px var(--fn-purple)}
.fn-consent__btn--solid:hover,.fn-consent__btn--solid:focus-visible{
	background:var(--fn-lime);color:var(--fn-navy);
	box-shadow:inset 0 0 0 1px var(--fn-lime)}

.fn-consent__btn--ghost{background:transparent;color:var(--fn-beige);
	box-shadow:inset 0 0 0 1px var(--fn-beige)}
.fn-consent__btn--ghost:hover,.fn-consent__btn--ghost:focus-visible{
	background:var(--fn-beige);color:var(--fn-navy)}

/* ── Preferences panel ──────────────────────────────────────────────── */

.fn-consent__panel{position:fixed;top:0;right:0;bottom:0;z-index:80;
	width:min(92vw,560px);background:var(--fn-navy);color:var(--fn-beige);
	overflow-y:auto;border-left:var(--fn-rule-hairline-on-ink)}

.fn-consent__panel-inner{padding:var(--fn-margin)}
.fn-consent__panel .fn-consent__panel-inner > * + *{margin-top:var(--fn-gap-stack)}

.fn-consent__panel-head{display:flex;align-items:flex-start;
	justify-content:space-between;gap:20px}

.fn-consent__close{position:relative;flex:0 0 auto;width:44px;height:44px;
	background:none;border:0;cursor:pointer}
.fn-consent__close span{position:absolute;left:8px;top:21px;width:28px;
	height:1.5px;background:var(--fn-beige)}
.fn-consent__close span:first-child{transform:rotate(45deg)}
.fn-consent__close span:last-child{transform:rotate(-45deg)}
.fn-consent__close:hover span,.fn-consent__close:focus-visible span{
	background:var(--fn-lime)}

.fn-consent__list{list-style:none;margin:0;padding:0}
.fn-consent__panel .fn-consent__list > * + *{margin-top:var(--fn-gap-stack)}
.fn-consent__item{padding-top:var(--fn-gap-text);
	border-top:var(--fn-rule-hairline-on-ink)}
.fn-consent__list .fn-consent__item > * + *{margin-top:var(--fn-gap-text)}

.fn-consent__row{display:flex;align-items:center;justify-content:space-between;
	gap:20px;min-height:44px;cursor:pointer}

.fn-consent__row-label{font:var(--fn-w-bold) var(--fd-label)/1.4 var(--fn-font-sans);
	letter-spacing:var(--fn-track-wide);text-transform:uppercase;
	color:var(--fn-beige)}

.fn-consent__switch{position:relative;flex:0 0 auto;width:56px;height:28px}
.fn-consent__switch input{position:absolute;inset:0;width:100%;height:100%;
	margin:0;opacity:0;cursor:pointer}
.fn-consent__track{position:absolute;inset:0;display:block;
	box-shadow:inset 0 0 0 1px var(--fn-beige);background:transparent;
	transition:var(--fn-transition-color)}
.fn-consent__knob{position:absolute;top:4px;left:4px;width:20px;height:20px;
	display:block;background:var(--fn-beige);
	transition:transform var(--fn-dur) var(--fn-ease),background-color var(--fn-dur) var(--fn-ease)}
.fn-consent__switch input:checked ~ .fn-consent__track{background:var(--fn-lime);
	box-shadow:inset 0 0 0 1px var(--fn-lime)}
.fn-consent__switch input:checked ~ .fn-consent__track .fn-consent__knob{
	transform:translateX(28px);background:var(--fn-navy)}
.fn-consent__switch input:focus-visible ~ .fn-consent__track{
	box-shadow:inset 0 0 0 2px var(--fn-lime)}
.fn-consent__switch input:disabled{cursor:default}
.fn-consent__switch input:disabled ~ .fn-consent__track{opacity:.6}

.fn-consent__detail{margin:0;
	font:var(--fn-w-medium) var(--fd-body)/var(--fd-body-lh) var(--fn-font-sans);
	letter-spacing:var(--fn-track-wide);color:var(--fn-beige-75)}
.fn-consent__detail--note{font-weight:var(--fn-w-bold);color:var(--fn-lime)}

.fn-consent__fine{margin:0;
	font:var(--fn-w-medium) var(--fd-label)/1.5 var(--fn-font-sans);
	letter-spacing:var(--fn-track-wide);color:var(--fn-beige-75)}

.fn-consent__actions--panel{padding-top:var(--fn-gap-text);
	border-top:var(--fn-rule-hairline-on-ink)}
.fn-consent__actions--panel .fn-consent__btn{flex:1 1 min(100%,180px)}

body.fn-consent-open{overflow:hidden}

/* ── Held embed ─────────────────────────────────────────────────────── */

.fn-consent-embed{background:var(--fn-surface-media);
	padding:clamp(24px,3vw,48px) var(--fn-margin);
	box-shadow:inset 0 0 0 1px var(--fn-navy)}
.fn-consent-embed__note{max-width:60ch;margin-inline:auto;text-align:center}
.fn-consent-embed .fn-consent-embed__note > * + *{margin-top:var(--fn-gap-text)}
.fn-consent-embed__text{margin:0;
	font:var(--fn-w-medium) var(--fd-body)/var(--fd-body-lh) var(--fn-font-sans);
	letter-spacing:var(--fn-track-wide);color:var(--fn-navy)}
.fn-consent-embed__link{display:block;
	font:var(--fn-w-bold) var(--fd-label)/1.4 var(--fn-font-sans);
	letter-spacing:var(--fn-track-wide);text-transform:uppercase;
	color:var(--fn-navy);text-decoration:underline;text-underline-offset:4px}
.fn-consent-embed__link:hover{color:var(--fn-purple)}

/* ── Footer control ─────────────────────────────────────────────────── */

.fn-footer__prefs{background:none;border:0;padding:0;cursor:pointer;
	color:var(--fn-link-on-ink);text-transform:uppercase;
	transition:var(--fn-transition-color)}
.fn-footer__prefs:hover,.fn-footer__prefs:focus-visible{
	color:var(--fn-link-on-ink-hover)}

/* ── Narrow ─────────────────────────────────────────────────────────── */

@media (max-width:900px){
	.fn-consent__bar{flex-direction:column;align-items:stretch;
		gap:var(--fn-gap-stack)}
	.fn-consent__actions .fn-consent__btn{flex:1 1 min(100%,150px)}
	.fn-consent__panel{width:100vw;border-left:0}
}

@media (prefers-reduced-motion:reduce){
	.fn-consent__knob,.fn-consent__track{transition:none}
}