/**
 * Mezatika — Sayfa Geçişi / Preloader Stilleri
 *
 * Yaklaşım (glitch'siz versiyon):
 * - Body'e KESİNLİKLE transform uygulanmaz (eski versiyon header/sticky/sliderlarla
 *   çakışıp titreşmeye yol açıyordu).
 * - İçerik sadece çok hafif bir opacity fade ile açılır (180ms, layout etkilemez).
 * - "Sağdan sola" smooth motion hissi: tıklanan link sonrası overlay sağdan
 *   gelip sayfayı kaplar; yeni sayfa hazır olunca aynı overlay sola süzülerek
 *   çıkar — yani yeni içerik sağdan sola doğru ortaya çıkar gibi görünür.
 * - Overlay üstündeki turuncu progress bar + spinner yavaş yüklemede kullanıcıya
 *   "site çalışıyor" hissi verir.
 *
 * html.mzt-pt-enabled altındayken aktiftir; CSS/JS yüklenmezse sayfa normal
 * görünür, hiçbir şey bloklanmaz.
 */

/* ---------- 1) İçerik için yumuşak opacity fade-in ---------- */

@keyframes mzt-pt-fade-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}

html.mzt-pt-enabled body {
	animation: mzt-pt-fade-in 180ms ease-out both;
}

/*
 * Animasyon bittikten sonra inline state'i temizle: bazı eklenti/page-builder
 * scriptleri body üstünde sürekli style hesaplaması yaparsa animation referansı
 * kalmasın.
 */
html.mzt-pt-done body {
	animation: none !important;
	opacity: 1 !important;
}

/* ---------- 2) Çıkış Overlay'i (tıklama → yeni sayfa beklerken) ----------
 *
 * Sağdan içeri kayar (translateX 100% → 0). Yavaş yüklemeyi maskeleyen
 * preloader. Yeni sayfa açıldığında DOM yenilendiği için overlay otomatik
 * kaybolur, body opacity fade-in ile yumuşakça görünür hale gelir.
 */
#mzt-pt-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	inset: 0;
	background: #ffffff;
	z-index: 2147483645;
	opacity: 0;
	transform: translate3d(100%, 0, 0);
	transition:
		transform 380ms cubic-bezier(0.4, 0, 0.2, 1),
		opacity 240ms ease;
	pointer-events: none;
	will-change: transform, opacity;
}

/* Sağdan içeri */
html.mzt-pt-leaving #mzt-pt-overlay {
	opacity: 1;
	transform: translate3d(0, 0, 0);
	pointer-events: auto;
}

/* Overlay merkezindeki yumuşak turuncu glow (dekoratif) */
#mzt-pt-overlay::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 140px;
	height: 140px;
	margin: -70px 0 0 -70px;
	border-radius: 50%;
	background:
		radial-gradient(circle at 50% 50%, rgba(242, 169, 0, 0.10) 0%, rgba(242, 169, 0, 0) 70%);
	pointer-events: none;
	opacity: 0;
	transition: opacity 240ms ease 120ms;
}

html.mzt-pt-leaving #mzt-pt-overlay::before {
	opacity: 1;
}

/* ---------- 3) Üstte ince turuncu progress bar ---------- */

#mzt-pt-bar {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	z-index: 2147483647;
	background: linear-gradient(90deg, #f2a900 0%, #ffc947 50%, #f2a900 100%);
	background-size: 200% 100%;
	transform: scaleX(0);
	transform-origin: 0 50%;
	opacity: 0;
	pointer-events: none;
	transition: opacity 160ms ease;
	box-shadow: 0 0 10px rgba(242, 169, 0, 0.45);
}

html.mzt-pt-leaving #mzt-pt-bar {
	opacity: 1;
	animation:
		mzt-pt-bar-grow 8s cubic-bezier(0.1, 0.7, 0.1, 1) forwards,
		mzt-pt-bar-shimmer 1.8s linear infinite;
}

@keyframes mzt-pt-bar-grow {
	0%   { transform: scaleX(0); }
	15%  { transform: scaleX(0.3); }
	35%  { transform: scaleX(0.55); }
	60%  { transform: scaleX(0.78); }
	100% { transform: scaleX(0.94); }
}

@keyframes mzt-pt-bar-shimmer {
	0%   { background-position: 200% 0; }
	100% { background-position: -200% 0; }
}

/* ---------- 4) Ortada spinner ---------- */

#mzt-pt-spinner {
	position: fixed;
	top: 50%;
	left: 50%;
	width: 48px;
	height: 48px;
	margin: -24px 0 0 -24px;
	border-radius: 50%;
	border: 3px solid rgba(242, 169, 0, 0.18);
	border-top-color: #f2a900;
	z-index: 2147483647;
	opacity: 0;
	pointer-events: none;
	animation: mzt-pt-spin 0.9s linear infinite;
	transition: opacity 200ms ease;
}

html.mzt-pt-leaving #mzt-pt-spinner {
	opacity: 1;
	transition-delay: 160ms;
}

@keyframes mzt-pt-spin {
	to {
		transform: rotate(360deg);
	}
}

/* ---------- 5) Erişilebilirlik: reduced motion ---------- */

@media (prefers-reduced-motion: reduce) {
	html.mzt-pt-enabled body {
		animation-duration: 1ms !important;
		animation-delay: 0ms !important;
	}
	#mzt-pt-overlay,
	#mzt-pt-bar,
	#mzt-pt-spinner {
		transition: none !important;
		animation: none !important;
	}
	html.mzt-pt-leaving #mzt-pt-overlay {
		transform: translate3d(0, 0, 0);
	}
}

/* ---------- 6) Yazdırma ---------- */

@media print {
	html.mzt-pt-enabled body {
		animation: none !important;
		opacity: 1 !important;
	}
	#mzt-pt-overlay,
	#mzt-pt-bar,
	#mzt-pt-spinner {
		display: none !important;
	}
}