/**
 * Consent Manager — Mondrian skin (téma-oldali override)
 *
 * A `consent-manager` plugin szándékosan téma-független: saját `--ccm-*`
 * tokenekkel és saját `.ccm-btn` gombokkal dolgozik, és a CSS-e dokumentálja,
 * hogy a témából felülírható. Ez a stíluslap pontosan ezt teszi — a plugin
 * érintetlen (hordozható) marad, a Mondrian arculat a témában él:
 *
 *   1. A `--ccm-*` tokenek átirányítása a Mondrian palettára (piros akcent,
 *      monokróm gerinc, éles sarkok, árnyék nélkül).
 *   2. A néhány NEM tokenizált szabály felülírása (gomb-tipográfia → Geist
 *      Mono uppercase, „soft" → ghost gomb, FAB, toggle-forma, modal-scrim).
 *
 * Betöltés: `functions.php` → `mondrian_enqueue_consent_skin()`. A plugin
 * `ccm-consent` handle-je dependency, így ez UTÁNA töltődik (a felülírás
 * azonos specifikusságnál is biztos), és csak ha a banner renderelődik. A
 * theme-tokenek (`--accent`, `--ink`, `--font-mono` …) a `main.css :root`-ból
 * jönnek; a fallback hex a plugin önálló (téma nélküli) használatát védi.
 */

/* ==========================================================================
   1. Token-átirányítás — a plugin minden var(--ccm-*) hivatkozása ezt veszi
   ========================================================================== */
:root {
	/* Színek — monokróm gerinc + egyetlen piros akcent */
	--ccm-color-bg:            var(--paper, #ffffff);
	--ccm-color-text:          var(--ink, #111111);
	--ccm-color-text-muted:    var(--fg-muted, #565656);
	--ccm-color-primary:       var(--accent, #df2821);
	--ccm-color-primary-dark:  var(--accent-press, #b81e18);
	--ccm-color-primary-light: var(--gray-50, #f6f6f6);
	--ccm-color-border:        var(--border, #bebebe);
	--ccm-color-bg-alt:        var(--gray-50, #f6f6f6);

	/* Forma — éles sarkok (De Stijl: radius 0, max 1px) */
	--ccm-radius-panel:  0;
	--ccm-radius-input:  0;
	--ccm-radius-bubble: 0;
	--ccm-radius-pill:   0;

	/* Elevation — nincs árnyék, a lap lapos, mint egy nyomtatott ív */
	--ccm-shadow-banner: none;
	--ccm-shadow-modal:  none;
	--ccm-shadow-fab:    none;

	/* Mozgás — a téma timingja, bounce nélkül */
	--ccm-transition: var(--dur-fast, 140ms) var(--ease, cubic-bezier(0.22, 1, 0.36, 1));
}

/* ==========================================================================
   2. Banner / modal — cím display-fonttal
   (A banner kerete a plugin defaultja marad: 1px hairline `--ccm-color-border`.)
   ========================================================================== */
.ccm-banner__title,
.ccm-modal__title {
	font-family: var(--font-display, inherit);
	letter-spacing: var(--tracking-tight, -0.01em);
}

/* ==========================================================================
   3. Gombok — a Mondrian .btn nyelv: Geist Mono, uppercase, tracked, éles
   ========================================================================== */
.ccm-btn {
	font-family: var(--font-mono, inherit);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding: 15px 26px; /* ≥44px tap-target magasság */
}

.ccm-btn:active {
	transform: translateY(1px);
}

/* „Primary" = tömör piros (a token alapból ezt adja). „Soft" = ghost gomb:
   ink keret, hover invertál (ink háttér / fehér szöveg), mint a téma .btn-ghost. */
.ccm-btn--soft {
	background-color: transparent;
	color: var(--ink, #111111);
	border-color: var(--ink, #111111);
}

.ccm-btn--soft:hover {
	background-color: var(--ink, #111111);
	border-color: var(--ink, #111111);
	color: var(--paper, #ffffff);
}

/* ==========================================================================
   4. FAB — minimál négyzet, invertáló hover (nincs lebegtetés és árnyék)
   ========================================================================== */
.ccm-fab {
	background-color: var(--paper, #ffffff);
	color: var(--ink, #111111);
	border: var(--hairline, 1px) solid var(--ink, #111111);
}

.ccm-fab:hover {
	transform: none;
	box-shadow: none;
	background-color: var(--ink, #111111);
	color: var(--paper, #ffffff);
}

.ccm-fab:active {
	transform: translateY(1px);
}

/* ==========================================================================
   5. Modal — ink scrim, blur nélkül (DS: nincs textúra/gradiens)
   ========================================================================== */
.ccm-modal__backdrop {
	background-color: rgba(17, 17, 17, 0.6);
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

/* ==========================================================================
   6. Toggle — négyzet sín + négyzet gomb (piros = aktív), árnyék nélkül
   ========================================================================== */
.ccm-category__toggle-thumb {
	border-radius: 0;
	box-shadow: none;
}

/* ==========================================================================
   7. prefers-reduced-motion — azonnali állapotváltás
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
	.ccm-banner,
	.ccm-fab,
	.ccm-btn,
	.ccm-category__toggle-track,
	.ccm-category__toggle-thumb {
		transition: none;
	}
}