/**
 * ExpediCAR PWA – stiluri frontend.
 *
 * Încărcate DOAR dacă interfața fallback sau toast-ul de actualizare sunt
 * active. Dacă folosești exclusiv Elementor pentru popup, acest fișier nu
 * ajunge niciodată în pagină.
 *
 * Specificitate deliberat joasă și fără `!important`, ca stilurile temei
 * creativepoint și ale Elementor să poată suprascrie orice, fără luptă.
 */

:root {
	--ecpwa-bg: #ffffff;
	--ecpwa-fg: #0b1b34;
	--ecpwa-muted: #5a6b85;
	--ecpwa-accent: #0b1b34;
	--ecpwa-accent-fg: #ffffff;
	--ecpwa-border: rgba(11, 27, 52, 0.14);
	--ecpwa-radius: 12px;
	--ecpwa-shadow: 0 10px 40px rgba(11, 27, 52, 0.18);
}

/* Respectă modul întunecat al sistemului, dacă tema nu impune altceva. */
@media (prefers-color-scheme: dark) {
	:root {
		--ecpwa-bg: #14243d;
		--ecpwa-fg: #f2f5fa;
		--ecpwa-muted: #a8b6cc;
		--ecpwa-accent: #ffffff;
		--ecpwa-accent-fg: #0b1b34;
		--ecpwa-border: rgba(255, 255, 255, 0.16);
	}
}

/* ---------------------------------------------------------------------
 * Clase de stare — contractul vizual pentru Elementor.
 * ------------------------------------------------------------------ */

/*
 * Elementele marcate astfel dispar automat când aplicația rulează deja
 * instalată. Cerință explicită: popup-ul nu trebuie să apară în standalone.
 */
.ecpwa-standalone .ecpwa-hide-when-standalone,
.ecpwa-installed .ecpwa-hide-when-installed {
	display: none !important;
}

.ecpwa-show-when-standalone {
	display: none;
}

.ecpwa-standalone .ecpwa-show-when-standalone {
	display: revert;
}

.ecpwa-show-when-installable {
	display: none;
}

.ecpwa-installable .ecpwa-show-when-installable {
	display: revert;
}

/* Widgetul de stare afișează un singur mesaj, în funcție de context. */
.ecpwa-state__item {
	display: none;
}

.ecpwa-standalone .ecpwa-state__item--standalone,
.ecpwa-installable:not(.ecpwa-standalone) .ecpwa-state__item--installable,
.ecpwa-browser:not(.ecpwa-installable) .ecpwa-state__item--browser {
	display: inline;
}

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

.ecpwa-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 12px 22px;
	border: 0;
	border-radius: var(--ecpwa-radius);
	background: var(--ecpwa-accent);
	color: var(--ecpwa-accent-fg);
	font: inherit;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	text-decoration: none;
	transition: opacity 0.15s ease, transform 0.15s ease;
}

.ecpwa-button:hover {
	opacity: 0.9;
}

.ecpwa-button:active {
	transform: translateY(1px);
}

.ecpwa-button:focus-visible {
	outline: 3px solid currentColor;
	outline-offset: 2px;
}

.ecpwa-button--ghost {
	background: transparent;
	color: var(--ecpwa-fg);
	border: 1px solid var(--ecpwa-border);
}

/* ---------------------------------------------------------------------
 * Toast de actualizare
 * ------------------------------------------------------------------ */

.ecpwa-toast {
	position: fixed;
	z-index: 99999;
	left: 16px;
	right: 16px;
	bottom: 16px;
	display: flex;
	align-items: center;
	gap: 12px;
	max-width: 460px;
	margin-inline: auto;
	padding: 14px 16px;
	border-radius: var(--ecpwa-radius);
	background: var(--ecpwa-bg);
	color: var(--ecpwa-fg);
	border: 1px solid var(--ecpwa-border);
	box-shadow: var(--ecpwa-shadow);
	font-size: 15px;
	animation: ecpwa-slide-up 0.25s ease;
}

@keyframes ecpwa-slide-up {
	from {
		opacity: 0;
		transform: translateY(12px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Respectăm preferința de mișcare redusă. */
@media (prefers-reduced-motion: reduce) {
	.ecpwa-toast {
		animation: none;
	}

	.ecpwa-button {
		transition: none;
	}
}

.ecpwa-toast__text {
	flex: 1;
	line-height: 1.4;
}

.ecpwa-toast__action {
	flex-shrink: 0;
	padding: 8px 14px;
	border: 0;
	border-radius: 8px;
	background: var(--ecpwa-accent);
	color: var(--ecpwa-accent-fg);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}

.ecpwa-toast__close {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--ecpwa-muted);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
}

.ecpwa-toast__close:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

/* ---------------------------------------------------------------------
 * Cardul in-app de după instalare (pre-prompt notificări)
 * ------------------------------------------------------------------ */

.ecpwa-preprompt {
	position: fixed;
	z-index: 99998;
	left: 16px;
	right: 16px;
	bottom: 16px;
	max-width: 460px;
	margin-inline: auto;
	padding: 20px;
	border: 1px solid var(--ecpwa-border);
	border-radius: 16px;
	background: var(--ecpwa-bg);
	color: var(--ecpwa-fg);
	box-shadow: var(--ecpwa-shadow);

	/* Intrare discretă; starea finală o dă `.is-visible`. */
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 0.22s ease, transform 0.22s ease;

	/* Respectă zona sigură de pe iPhone (bara de gesturi). */
	margin-bottom: env(safe-area-inset-bottom, 0px);
}

.ecpwa-preprompt.is-visible {
	opacity: 1;
	transform: translateY(0);
}

.ecpwa-preprompt__title {
	margin: 0 0 6px;
	color: var(--ecpwa-fg);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
}

.ecpwa-preprompt__body {
	margin: 0 0 16px;
	color: var(--ecpwa-muted);
	font-size: 14px;
	line-height: 1.55;
}

.ecpwa-preprompt__actions {
	display: flex;
	gap: 10px;
	align-items: center;
}

.ecpwa-preprompt__accept {
	flex: 1;
	padding: 12px 18px;
	border: 0;
	border-radius: 10px;
	background: var(--ecpwa-accent);
	color: var(--ecpwa-accent-fg);
	font: inherit;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
}

.ecpwa-preprompt__dismiss {
	flex-shrink: 0;
	padding: 12px 14px;
	border: 0;
	border-radius: 10px;
	background: transparent;
	color: var(--ecpwa-muted);
	font: inherit;
	font-size: 14px;
	cursor: pointer;
}

.ecpwa-preprompt__accept:focus-visible,
.ecpwa-preprompt__dismiss:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.ecpwa-preprompt {
		transition: none;
	}
}

/* ---------------------------------------------------------------------
 * Centrul de preferințe
 * ------------------------------------------------------------------ */

.ecpwa-preferences {
	max-width: 560px;
	margin-inline: auto;
	padding: 28px 24px;
	border: 1px solid var(--ecpwa-border);
	border-radius: var(--ecpwa-radius);
	background: var(--ecpwa-bg);
	color: var(--ecpwa-fg);
	text-align: center;
}

.ecpwa-preferences__brand {
	margin-bottom: 14px;
}

.ecpwa-preferences__logo {
	width: 72px;
	height: 72px;
	object-fit: contain;
	border-radius: 16px;
}

.ecpwa-preferences__heading {
	margin: 0 0 10px;
	color: var(--ecpwa-fg);
	font-size: 22px;
	line-height: 1.25;
}

/* Conținutul propriu-zis rămâne aliniat la stânga: se citește mai ușor. */
.ecpwa-preferences__body {
	text-align: left;
}

.ecpwa-preferences__badge {
	display: inline-block;
	padding: 4px 12px;
	border-radius: 999px;
	background: var(--ecpwa-border);
	color: var(--ecpwa-fg);
	font-size: 13px;
	font-weight: 600;
}

.ecpwa-preferences__intro {
	margin: 14px 0 20px;
	color: var(--ecpwa-muted);
	line-height: 1.6;
}

.ecpwa-preferences__topics {
	margin: 0 0 20px;
	padding: 0;
	border: 0;
}

.ecpwa-preferences__topics legend {
	margin-bottom: 12px;
	padding: 0;
	font-weight: 600;
}

.ecpwa-preferences__option {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	padding: 12px 0;
	border-top: 1px solid var(--ecpwa-border);
	cursor: pointer;
}

.ecpwa-preferences__option input {
	margin-top: 3px;
	flex-shrink: 0;
}

.ecpwa-preferences__option small {
	display: block;
	margin-top: 3px;
	color: var(--ecpwa-muted);
	font-size: 13px;
	line-height: 1.5;
}

.ecpwa-preferences__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

/*
 * Mesajele contextuale sunt controlate din JavaScript, prin atributul
 * `hidden`. Versiunea anterioară le forța cu `display: block` pe baza
 * claselor de stare, ceea ce lupta direct cu `hidden` și făcea
 * comportamentul imprevizibil.
 */
.ecpwa-preferences__blocked,
.ecpwa-preferences__ios,
.ecpwa-preferences__unsupported,
.ecpwa-preferences__done {
	margin: 16px 0 0;
	padding: 12px 14px;
	border-radius: 8px;
	background: var(--ecpwa-border);
	color: var(--ecpwa-fg);
	font-size: 14px;
	line-height: 1.5;
}

.ecpwa-preferences__done {
	background: rgba(0, 122, 51, 0.12);
	color: var(--ecpwa-fg);
}

/* `hidden` trebuie să câștige, indiferent de regulile temei. */
.ecpwa-preferences [hidden] {
	display: none !important;
}

/* Butonul de abonare nu are sens dacă permisiunea e deja blocată. */
.ecpwa-push-denied .ecpwa-push-trigger,
.ecpwa-push-subscribed .ecpwa-push-trigger {
	display: none;
}

.ecpwa-push-unsubscribe {
	display: none;
}

.ecpwa-push-subscribed .ecpwa-push-unsubscribe {
	display: inline-flex;
}
