/*
 * Cookie consent — theme skin for the vendored CookieConsent library.
 *
 * Almost everything here is variable assignment rather than selector overriding. The library
 * exposes ~46 --cc-* custom properties covering every colour, radius and font it uses, so mapping
 * those onto the design tokens restyles it completely without touching a single one of its own
 * rules. That keeps a future version bump to a file swap.
 *
 * Positioning is not set here. Bottom-right on desktop comes from guiOptions.consentModal.position
 * in inc/cookie-consent.php; bottom-centre on mobile is the library's own <=640px rule, which goes
 * full-bleed with a --cc-modal-margin gutter each side.
 */

#cc-main {
	--cc-font-family: var(--nvs-font-body);

	--cc-bg: var(--nvs-surface);
	--cc-primary-color: var(--nvs-navy);
	--cc-secondary-color: var(--nvs-ink-muted);
	--cc-link-color: var(--nvs-blue);

	--cc-modal-border-radius: var(--nvs-radius-card);
	--cc-btn-border-radius: var(--nvs-radius-button);
	--cc-modal-transition-duration: var(--nvs-duration-hover);

	/* Accept — the theme's primary button. */
	--cc-btn-primary-bg: var(--nvs-blue);
	--cc-btn-primary-color: #ffffff;
	--cc-btn-primary-border-color: var(--nvs-blue);
	--cc-btn-primary-hover-bg: var(--nvs-navy);
	--cc-btn-primary-hover-color: #ffffff;
	--cc-btn-primary-hover-border-color: var(--nvs-navy);

	/*
	 * Reject and Manage. Outlined rather than grey-filled so they read as equally available
	 * choices — guiOptions sets equalWeightButtons for the same reason.
	 */
	--cc-btn-secondary-bg: var(--nvs-surface);
	--cc-btn-secondary-color: var(--nvs-navy);
	--cc-btn-secondary-border-color: var(--nvs-border-input);
	--cc-btn-secondary-hover-bg: var(--nvs-surface-alt);
	--cc-btn-secondary-hover-color: var(--nvs-navy);
	--cc-btn-secondary-hover-border-color: var(--nvs-navy);

	--cc-separator-border-color: var(--nvs-border);

	--cc-toggle-on-bg: var(--nvs-green);
	--cc-toggle-off-bg: var(--nvs-ink-faint);
	--cc-toggle-readonly-bg: var(--nvs-border-input);
	--cc-toggle-readonly-knob-icon-color: var(--nvs-ink-faint);

	--cc-cookie-category-block-bg: var(--nvs-surface-alt);
	--cc-cookie-category-block-border: var(--nvs-border);
	--cc-cookie-category-block-hover-bg: var(--nvs-surface-alt);
	--cc-cookie-category-block-hover-border: var(--nvs-border-input);
	--cc-cookie-category-expanded-block-hover-bg: var(--nvs-surface-alt);

	--cc-overlay-bg: rgba(10, 31, 60, 0.6);
	--cc-footer-bg: var(--nvs-surface-alt);
	--cc-footer-color: var(--nvs-ink-muted);
	--cc-footer-border-color: var(--nvs-border);
}

/*
 * Links in the banner copy.
 *
 * The library only applies --cc-link-color to an explicit .cc__link class, which means a plain <a>
 * in the policy sentence inherits the muted description grey and stops looking clickable. Styling
 * the bare anchor instead keeps that from depending on whoever next edits the copy remembering a
 * vendor class name.
 */
#cc-main .cm__desc a,
#cc-main .pm__section-desc a,
#cc-main .cc__link {
	color: var(--cc-link-color);
}

/*
 * "Reject all" — outlined rather than filled.
 *
 * guiOptions sets equalWeightButtons, which renders accept and reject identically. That is the
 * right instinct and the wrong result: two identical blue slabs read as a rendering fault, and
 * people click the top one without reading. What the regulators actually require is that refusing
 * be as *easy* as accepting — same layer, same number of clicks, comparable prominence — not that
 * the two be indistinguishable. So this keeps the size, position and single-click cost identical
 * and changes only the fill, which is the pattern every audited CMP uses.
 */
#cc-main .cm__btn[data-role='necessary'],
#cc-main .pm__btn[data-role='necessary'] {
	background: var(--nvs-surface);
	border-color: var(--nvs-navy);
	color: var(--nvs-navy);
}

#cc-main .cm__btn[data-role='necessary']:hover,
#cc-main .pm__btn[data-role='necessary']:hover {
	background: var(--nvs-navy);
	border-color: var(--nvs-navy);
	color: #ffffff;
}

/* Headings are the one thing the variables don't cover — the library has no font-family hook per
   element, and the theme sets headings in Manrope everywhere else. */
#cc-main .cm__title,
#cc-main .pm__title {
	font-family: var(--nvs-font-heading);
	font-weight: 700;
	letter-spacing: -0.01em;
}

#cc-main .cm {
	box-shadow: var(--nvs-shadow-hover);
}

/* -------------------------------------------------------------------------
 * The footer "Cookie settings" control.
 *
 * A <button> styled to sit beside the .nvs-footer__legal anchors without looking like a button.
 * Hidden until site.js sets .nvs-js on <html>: it opens a dialog that does not exist without
 * JavaScript, so offering it would be a dead control.
 * ---------------------------------------------------------------------- */

.nvs-cookie-settings {
	display: none;
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	color: inherit;
	cursor: pointer;
	text-align: inherit;
}

.nvs-js .nvs-cookie-settings {
	display: inline;
}

.nvs-cookie-settings:hover,
.nvs-cookie-settings:focus-visible {
	text-decoration: underline;
}
