/**
 * Agency Privacy Core — banner de consimțământ.
 *
 * Fără dependențe, fără reset global: toate regulile sunt limitate la .apc-*
 * ca să nu atingă tema.
 *
 * Lanțul de culoare: --apc-accent → var(--main-color) → #111.
 * Variabilele sunt declarate ȘI pe :root, ȘI pe .apc-banner. Motivul: multe
 * teme declară --main-color pe body, .site sau .wp-site-blocks, nu pe :root.
 * Redeclararea pe container reface lanțul în punctul în care variabila temei
 * este deja moștenită, deci fallback-ul se rezolvă corect în ambele situații.
 *
 * APC_ACCENT_COLOR și APC_ACCENT_CONTRAST din config se injectează ca stil
 * inline DUPĂ acest fișier, deci bat orice valoare de aici, în ambele scheme.
 */

:root,
.apc-banner {
	--apc-accent: var(--main-color, #111);
	--apc-accent-contrast: #fff;
	--apc-card-bg: #fff;
	--apc-fg: #111;
	--apc-muted: #5c5c5c;
	--apc-border: #e2e2e2;
	--apc-hover: #f4f4f4;
	--apc-track: #d4d4d4;
	--apc-radius: 12px;
	--apc-radius-btn: 8px;
	--apc-speed: 180ms;
	--apc-z: 99999;
}

/* --- Cardul ----------------------------------------------------------- */

/*
 * Ancorat în colțul din stânga jos, NU centrat și fără overlay: pagina rămâne
 * vizibilă, derulabilă și utilizabilă cât timp bannerul e deschis. Un consimțământ
 * dat sub un ecran blocat nu e mai valid decât unul dat lângă conținut, dar
 * blocarea împiedică vizitatorul să citească tocmai politica la care consimte.
 */
.apc-banner {
	position: fixed;
	bottom: 20px;
	left: 20px;
	z-index: var(--apc-z);
	box-sizing: border-box;
	width: calc(100% - 40px);
	max-width: 440px;
	max-height: calc(100vh - 40px);
	overflow-y: auto;
	padding: 24px;
	background: var(--apc-card-bg);
	color: var(--apc-fg);
	border-radius: var(--apc-radius);
	box-shadow: 0 16px 48px rgb(0 0 0 / 22%), 0 4px 12px rgb(0 0 0 / 10%);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 14px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	transition: transform var(--apc-speed) ease, opacity var(--apc-speed) ease;
}

.apc-banner[hidden] {
	display: none;
}

.apc-banner *,
.apc-banner *::before,
.apc-banner *::after {
	box-sizing: inherit;
}

/* Stare inițială, îndepărtată de JS la afișare — evită „săritura". */
.apc-banner--enter {
	opacity: 0;
	transform: translateY(8px);
}

.apc-banner__screen[hidden] {
	display: none;
}

/* --- Tipografie ------------------------------------------------------- */

.apc-banner__title {
	margin: 0 0 8px;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: -0.01em;
	color: var(--apc-fg);
}

.apc-banner__text {
	margin: 0 0 20px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--apc-muted);
}

.apc-banner__link {
	color: var(--apc-fg);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.apc-banner__link:hover {
	opacity: 0.7;
}

/* --- Butoane ---------------------------------------------------------- */

.apc-banner__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.apc-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	font-family: inherit;
	cursor: pointer;
	transition:
		background-color var(--apc-speed) ease,
		color var(--apc-speed) ease,
		border-color var(--apc-speed) ease,
		opacity var(--apc-speed) ease;
}

/*
 * .apc-btn--action definește ÎNTREAGA geometrie a butoanelor de decizie:
 * padding, font-size, font-weight, line-height, rază și grosimea bordurii.
 * „Accept toate" și „Refuz toate" o folosesc amândouă; --accept și --reject
 * schimbă EXCLUSIV culori.
 *
 * Bordura de 1.5px este declarată aici, nu pe variante: dacă doar butonul de
 * refuz ar avea bordură, ar ieși cu 3px mai lat și mai înalt decât cel de
 * accept, iar cele două n-ar mai fi echivalente.
 *
 * Cerință legală (GDPR art. 4 pct. 11, considerentul 42 și ghidul EDPB 03/2022
 * privind dark patterns): refuzul trebuie să fie la fel de accesibil ca
 * acceptul. Nu muta padding, font-size, width sau order pe una dintre variante.
 */
.apc-btn--action {
	flex: 1 1 0;
	min-width: 0;
	padding: 11px 18px;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	border: 1.5px solid transparent;
	border-radius: var(--apc-radius-btn);
}

.apc-btn--accept {
	background: var(--apc-accent);
	color: var(--apc-accent-contrast);
	border-color: var(--apc-accent);
}

.apc-btn--accept:hover {
	opacity: 0.85;
}

/* Solid, ca și acceptul: alb cu bordură neagră. Contrast inversat, nu „mai șters". */
.apc-btn--reject {
	background: var(--apc-card-bg);
	color: var(--apc-accent);
	border-color: var(--apc-accent);
}

.apc-btn--reject:hover {
	background: var(--apc-hover);
}

/*
 * „Setări", „Înapoi", „Retrag" NU sunt alegeri echivalente cu accept/refuz:
 * sunt navigare. De aceea sunt vizual secundare — buton fantomă, pe rând
 * propriu — fără ca asta să atingă simetria celor două decizii.
 */
.apc-btn--text {
	flex: 1 0 100%;
	padding: 8px 4px;
	background: none;
	border: 0;
	color: var(--apc-muted);
	font-size: 13px;
	font-weight: 500;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.apc-btn--text:hover {
	color: var(--apc-fg);
}

.apc-btn--withdraw[hidden] {
	display: none;
}

/* --- Focus ------------------------------------------------------------ */

.apc-banner :is(button, a, input):focus-visible,
.apc-footer-link:focus-visible,
.apc-open-settings:focus-visible {
	outline: 2px solid var(--apc-accent);
	outline-offset: 2px;
	border-radius: 4px;
}

.apc-banner .apc-btn--action:focus-visible {
	outline-offset: 3px;
}

/* --- Categorii -------------------------------------------------------- */

.apc-categories {
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 8px;
}

.apc-category {
	padding: 14px;
	background: transparent;
	border: 1px solid var(--apc-border);
	border-radius: var(--apc-radius-btn);
}

.apc-category__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.apc-category__label {
	font-size: 14px;
	font-weight: 600;
	color: var(--apc-fg);
	cursor: pointer;
}

.apc-category__desc {
	margin: 6px 0 0;
	font-size: 13px;
	line-height: 1.5;
	color: var(--apc-muted);
}

/* Toggle: input-ul real rămâne în DOM (accesibilitate), doar aspectul e schimbat. */
.apc-switch {
	position: relative;
	flex: 0 0 auto;
	width: 40px;
	height: 24px;
}

.apc-switch__input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

.apc-switch__track {
	display: block;
	width: 100%;
	height: 100%;
	background: var(--apc-track);
	border-radius: 999px;
	transition: background-color var(--apc-speed) ease;
	pointer-events: none;
}

.apc-switch__track::after {
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	width: 18px;
	height: 18px;
	background: #fff;
	border-radius: 50%;
	box-shadow: 0 1px 2px rgb(0 0 0 / 20%);
	transition: transform var(--apc-speed) ease;
}

.apc-switch__input:checked ~ .apc-switch__track {
	background: var(--apc-accent);
}

.apc-switch__input:checked ~ .apc-switch__track::after {
	transform: translateX(16px);
}

.apc-switch__input:disabled {
	cursor: not-allowed;
}

.apc-switch__input:disabled ~ .apc-switch__track {
	opacity: 0.45;
}

.apc-switch__input:focus-visible ~ .apc-switch__track {
	outline: 2px solid var(--apc-accent);
	outline-offset: 2px;
}

/* --- Mobil: lipit de marginea de jos ---------------------------------- */

@media (max-width: 519px) {
	.apc-banner {
		/* Lățime completă minus 12px de fiecare parte, lipit de marginea de jos. */
		bottom: 0;
		left: 12px;
		right: 12px;
		width: auto;
		max-width: none;
		max-height: calc(100vh - 24px);
		padding: 20px 18px calc(20px + env(safe-area-inset-bottom, 0px));
		border-radius: var(--apc-radius) var(--apc-radius) 0 0;
	}

	.apc-banner--enter {
		transform: translateY(16px);
	}

	/* Stivuite, dar tot egale între ele. */
	.apc-btn--action {
		flex: 1 0 100%;
	}
}

/* --- Link permanent catre preferinte ---------------------------------- */

/*
 * Este un <button>, nu un <a href="#">: acțiunea deschide un dialog, nu duce
 * la o adresă. Un link fals ar cere role="button" plus tratarea tastei Space
 * din JS, iar cititoarele de ecran l-ar anunța greșit. Aici îl facem doar să
 * ARATE ca un link.
 */
.apc-footer-link {
	--apc-fg: #111;
	--apc-muted: #5c5c5c;
	--apc-accent: var(--main-color, #111);

	padding: 0;
	background: none;
	border: 0;
	color: var(--apc-muted);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 13px;
	line-height: 1.4;
	text-decoration: none;
	cursor: pointer;
	transition: color var(--apc-speed) ease, opacity var(--apc-speed) ease;
}

.apc-footer-link:hover,
.apc-footer-link:focus-visible {
	color: var(--apc-fg);
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Varianta inline: fără poziționare, curge printre celelalte linkuri. */
.apc-footer-link--inline {
	display: inline;
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Butonul de shortcode — moștenește tipografia temei, discret. */
.apc-open-settings {
	padding: 0;
	background: none;
	border: 0;
	color: inherit;
	font: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
	cursor: pointer;
}

/* --- Preferințe de sistem --------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.apc-banner,
	.apc-btn,
	.apc-footer-link,
	.apc-switch__track,
	.apc-switch__track::after {
		transition: none;
	}

	.apc-banner--enter {
		opacity: 1;
		transform: none;
	}
}

/*
 * Dark: paleta se inversează — accentul devine alb, contrastul negru, cardul
 * aproape negru. Butoanele își păstrează raportul: accept = plin, refuz =
 * bordurat, aceeași dimensiune.
 */
@media (prefers-color-scheme: dark) {
	:root,
	.apc-banner,
	.apc-footer-link {
		/*
		 * Accentul NU se inversează: e culoarea temei sau a config-ului și
		 * trebuie să rămână aceeași identitate în ambele scheme. Doar
		 * fallback-ul se schimbă, ca un card întunecat să nu primească un
		 * buton negru pe negru când tema nu declară --main-color.
		 */
		--apc-accent: var(--main-color, #f2f2f2);
		--apc-accent-contrast: #111;
		--apc-card-bg: #1c1c1e;
		--apc-fg: #f2f2f2;
		--apc-muted: #a1a1a6;
		--apc-border: #3a3a3c;
		--apc-hover: #2c2c2e;
		--apc-track: #48484a;
	}

	.apc-banner {
		box-shadow: 0 16px 48px rgb(0 0 0 / 55%);
	}

	.apc-switch__track::after {
		background: #1c1c1e;
	}

	.apc-switch__input:checked ~ .apc-switch__track::after {
		background: #1c1c1e;
	}

}
