/*
Theme Name: Eghbal
Theme URI: https://example.com/eghbal
Author: Milad
Author URI: https://example.com
Description: A minimal WordPress theme for Eghbal.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: eghbal
*/

@font-face {
	font-family: 'Noora';
	src: url('assets/fonts/noora-fa-en-01-extralight.woff2') format('woff2');
	font-weight: 200;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'OpenSans';
	src: url('assets/fonts/opensans.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Noora';
	src: url('assets/fonts/noora-fa-en-02-light.woff2') format('woff2');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Noora';
	src: url('assets/fonts/noora-fa-en-03-regular.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Noora';
	src: url('assets/fonts/noora-fa-en-03-regular.woff2') format('woff2');
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Noora';
	src: url('assets/fonts/noora-fa-en-04-bold.woff2') format('woff2');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Noora';
	src: url('assets/fonts/noora-fa-en-05-extrabold.woff2') format('woff2');
	font-weight: 800;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Noora';
	src: url('assets/fonts/noora-fa-en-06-black.woff2') format('woff2');
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

/* Peyda Font Family - Original TTF Files */
@font-face {
	font-family: 'Peyda';
	src: url('assets/fonts/peyda-light.ttf') format('truetype');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Peyda';
	src: url('assets/fonts/Peyda-Regular.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Peyda';
	src: url('assets/fonts/Peyda-Medium.ttf') format('truetype');
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Peyda';
	src: url('assets/fonts/Peyda-Bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Peyda';
	src: url('assets/fonts/Peyda-Black.ttf') format('truetype');
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'NotoNastaliqUrdu';
	src: url('assets/fonts/NafeesRegular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

/* Dibaj Font Family */
@font-face {
	font-family: 'Dibaj';
	src: url('assets/fonts/Dibaj UltraLight.woff2') format('woff2');
	font-weight: 100;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Dibaj';
	src: url('assets/fonts/Dibaj Light.woff2') format('woff2');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Dibaj';
	src: url('assets/fonts/Dibaj Regular.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Dibaj';
	src: url('assets/fonts/Dibaj Medium.woff2') format('woff2');
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Dibaj';
	src: url('assets/fonts/Dibaj SemiBold.woff2') format('woff2');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Dibaj';
	src: url('assets/fonts/Dibaj Bold.woff2') format('woff2');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Dibaj';
	src: url('assets/fonts/Dibaj ExtraBold.woff2') format('woff2');
	font-weight: 800;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Dibaj';
	src: url('assets/fonts/Dibaj Black.woff2') format('woff2');
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Dibaj';
	src: url('assets/fonts/Dibaj SuperBlack.woff2') format('woff2');
	font-weight: 950;
	font-style: normal;
	font-display: swap;
}

/* Hafez Font Family */
@font-face {
	font-family: 'Hafez';
	src: url('assets/fonts/Hafez-Regular.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

/* Nafees Font Family */
@font-face {
	font-family: 'Nafees';
	src: url('assets/fonts/NafeesRegular.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

/* Nian Font Family */
@font-face {
	font-family: 'Nian';
	src: url('assets/fonts/Nian Thin.ttf') format('truetype');
	font-weight: 100;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Nian';
	src: url('assets/fonts/Nian ExtraLight.ttf') format('truetype');
	font-weight: 200;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Nian';
	src: url('assets/fonts/Nian Light.ttf') format('truetype');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Nian';
	src: url('assets/fonts/Nian.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Nian';
	src: url('assets/fonts/Nian SemiBold.ttf') format('truetype');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Nian';
	src: url('assets/fonts/Nian Bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Nian';
	src: url('assets/fonts/Nian ExtraBold.ttf') format('truetype');
	font-weight: 800;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Nian';
	src: url('assets/fonts/Nian-Black.ttf') format('truetype');
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

/* Home Motion System */
.eghbal-home-section {
	opacity: 0;
	transform: translate3d(0, 90px, 0) scale(0.94) rotateX(6deg);
	transform-origin: center top;
	filter: blur(8px) saturate(0.7);
	transition:
		opacity 0.95s cubic-bezier(0.2, 0.86, 0.24, 1),
		transform 0.95s cubic-bezier(0.2, 0.86, 0.24, 1),
		filter 0.95s cubic-bezier(0.2, 0.86, 0.24, 1);
	transition-delay: var(--eghbal-section-delay, 0ms);
	will-change: opacity, transform;
}

.eghbal-home-section.is-revealed {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1) rotateX(0);
	filter: blur(0) saturate(1);
}

.eghbal-home-grid {
	position: relative;
}

.eghbal-reveal-item {
	opacity: 0;
	transform: translate3d(0, 72px, 0) scale(0.9) rotateX(12deg) rotateZ(-1deg);
	filter: blur(10px) saturate(0.8);
	transform-origin: center bottom;
	transition:
		opacity 0.78s cubic-bezier(0.2, 0.86, 0.24, 1),
		transform 0.78s cubic-bezier(0.2, 0.86, 0.24, 1),
		filter 0.78s cubic-bezier(0.2, 0.86, 0.24, 1);
	transition-delay: var(--eghbal-stagger, 0ms);
	will-change: opacity, transform;
	backface-visibility: hidden;
}

.eghbal-reveal-item.is-revealed {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1) rotateX(0) rotateZ(0);
	filter: blur(0) saturate(1);
}

.eghbal-reveal-item.eghbal-swap-out {
	opacity: 0;
	transform: translate3d(0, -30px, 0) scale(0.86) rotateX(-10deg) rotateZ(1.5deg);
	filter: blur(12px) saturate(0.7);
	transition-delay: var(--eghbal-swap-delay, 0ms);
	transition-duration: 340ms;
}

.eghbal-grid-swapping {
	position: relative;
	isolation: isolate;
	pointer-events: none;
}

.eghbal-grid-swapping::after {
	content: '';
	position: absolute;
	inset: -4px;
	border-radius: 1.5rem;
	background: linear-gradient(110deg, transparent 22%, rgba(245, 1, 1, 0.2) 50%, transparent 78%);
	background-size: 220% 100%;
	animation: eghbal-grid-shimmer 1.1s linear infinite;
	pointer-events: none;
}

.eghbal-grid-swapping::before {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: 1.4rem;
	background: radial-gradient(circle at 50% 50%, rgba(245, 1, 1, 0.12), rgba(255, 255, 255, 0));
	pointer-events: none;
}

@keyframes eghbal-grid-shimmer {
	0% {
		background-position: 200% 0;
		opacity: 0.35;
	}
	50% {
		opacity: 0.65;
	}
	100% {
		background-position: -200% 0;
		opacity: 0.35;
	}
}

@media (prefers-reduced-motion: reduce) {
	.eghbal-home-section,
	.eghbal-reveal-item {
		opacity: 1 !important;
		transform: none !important;
		filter: none !important;
		transition: none !important;
		animation: none !important;
	}

	.eghbal-grid-swapping::after {
		animation: none !important;
		opacity: 0.2;
	}

	.eghbal-blog-card-enter {
		transition: none !important;
		opacity: 1 !important;
		transform: none !important;
		filter: none !important;
	}
}

.eghbal-blog-card-enter {
	opacity: 0;
	transform: translate3d(0, 28px, 0) scale(0.98);
	filter: blur(8px) saturate(0.8);
	transition:
		opacity 0.62s cubic-bezier(0.2, 0.86, 0.24, 1),
		transform 0.62s cubic-bezier(0.2, 0.86, 0.24, 1),
		filter 0.62s cubic-bezier(0.2, 0.86, 0.24, 1);
	transition-delay: var(--eghbal-card-delay, 0ms);
	will-change: opacity, transform;
}

.eghbal-blog-card-enter.is-visible {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1);
	filter: blur(0) saturate(1);
}

/* Video Player Stability + Subtitle Safe Area */
.eghbal-video-player-shell {
	background: #000;
}

.eghbal-video-player-shell .eghbal-video-embed-wrap,
.eghbal-video-player-shell .eghbal-video-embed-wrap iframe,
.eghbal-video-player-shell .eghbal-video-embed-wrap video,
.eghbal-video-player-shell .eghbal-video-embed-wrap object,
.eghbal-video-player-shell .eghbal-video-embed-wrap embed {
	width: 100% !important;
	height: 100% !important;
}

.eghbal-video-player-shell .eghbal-video-embed-wrap > div {
	width: 100% !important;
	height: 100% !important;
}

.eghbal-video-player-shell video::cue {
	background: rgba(0, 0, 0, 0.72);
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
	line-height: 1.35;
}

.eghbal-video-player-shell video::-webkit-media-text-track-display {
	transform: translateY(-4%);
}

.eghbal-video-preview video,
.eghbal-video-preview iframe,
.eghbal-video-preview object,
.eghbal-video-preview embed,
.eghbal-video-preview .eghbal-video-embed-wrap,
.eghbal-video-preview .eghbal-video-embed-wrap > * {
	width: 100% !important;
	height: 100% !important;
}

.eghbal-video-preview iframe {
	display: block;
	border: 0;
}

.eghbal-video-preview .js-eghbal-video-play {
	cursor: pointer;
}

.eghbal-video-preview.is-playing .js-eghbal-video-play,
.eghbal-video-preview.is-embed-active .js-eghbal-video-play {
	opacity: 0;
	pointer-events: none;
}

.eghbal-video-preview.is-playing .eghbal-video-duration-badge,
.eghbal-video-preview.is-embed-active .eghbal-video-duration-badge {
	opacity: 0;
	pointer-events: none;
}

.eghbal-video-preview.is-embed-active .js-eghbal-video-poster,
.eghbal-video-preview.is-playing .js-eghbal-video-poster {
	opacity: 0;
}

.eghbal-video-preview:not(.is-playing):hover .js-eghbal-video-poster {
	transform: scale(1.025);
}

.eghbal-blog-skeleton {
	position: relative;
	min-height: 330px;
	border-radius: 1.5rem;
	border: 1px solid rgba(15, 23, 42, 0.06);
	background: linear-gradient(145deg, rgba(241, 245, 249, 0.95), rgba(226, 232, 240, 0.8));
	overflow: hidden;
}

.dark .eghbal-blog-skeleton {
	border-color: rgba(255, 255, 255, 0.08);
	background: linear-gradient(145deg, rgba(20, 23, 31, 0.9), rgba(30, 41, 59, 0.68));
}

.eghbal-blog-skeleton::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(110deg, transparent 18%, rgba(245, 1, 1, 0.22) 50%, transparent 82%);
	background-size: 230% 100%;
	animation: eghbal-grid-shimmer 1.1s linear infinite;
}

.eghbal-jalali-picker {
	position: absolute;
	z-index: 1500;
	width: 280px;
	border-radius: 16px;
	border: 1px solid rgba(15, 23, 42, 0.1);
	background: #fff;
	box-shadow: 0 22px 48px rgba(2, 6, 23, 0.18);
	padding: 12px;
}

.dark .eghbal-jalali-picker {
	border-color: rgba(255, 255, 255, 0.1);
	background: #111827;
	box-shadow: 0 22px 48px rgba(0, 0, 0, 0.55);
}

.eghbal-jalali-picker.hidden {
	display: none;
}

.eghbal-jalali-picker__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px;
}

.eghbal-jalali-picker__title {
	font-size: 12px;
	font-weight: 700;
	color: #334155;
}

.dark .eghbal-jalali-picker__title {
	color: rgba(255, 255, 255, 0.9);
}

.eghbal-jalali-picker__body {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 8px;
	margin-bottom: 12px;
}

.eghbal-jalali-picker select {
	height: 34px;
	border-radius: 10px;
	border: 1px solid rgba(15, 23, 42, 0.1);
	background: rgba(248, 250, 252, 0.95);
	padding: 0 8px;
	font-size: 12px;
	font-weight: 600;
	color: #0f172a;
}

.dark .eghbal-jalali-picker select {
	border-color: rgba(255, 255, 255, 0.12);
	background: rgba(30, 41, 59, 0.8);
	color: #fff;
}

.eghbal-jalali-picker__actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
}

.eghbal-jalali-picker__actions button {
	height: 32px;
	border-radius: 10px;
	border: 1px solid rgba(15, 23, 42, 0.12);
	padding: 0 12px;
	font-size: 12px;
	font-weight: 700;
	cursor: pointer;
}

.eghbal-jalali-cancel {
	background: #fff;
	color: #334155;
}

.dark .eghbal-jalali-cancel {
	background: rgba(30, 41, 59, 0.7);
	color: rgba(255, 255, 255, 0.92);
}

.eghbal-jalali-apply {
	background: #f50101;
	border-color: #f50101 !important;
	color: #fff;
}

.eghbal-archive-item-enter {
	opacity: 0;
	transform: translate3d(0, 24px, 0) scale(0.985);
	filter: blur(6px) saturate(0.88);
	transition:
		opacity 0.54s cubic-bezier(0.2, 0.86, 0.24, 1),
		transform 0.54s cubic-bezier(0.2, 0.86, 0.24, 1),
		filter 0.54s cubic-bezier(0.2, 0.86, 0.24, 1);
	transition-delay: var(--eghbal-archive-delay, 0ms);
	will-change: opacity, transform;
}

.eghbal-archive-item-enter.is-visible {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1);
	filter: blur(0) saturate(1);
}

@media (prefers-reduced-motion: reduce) {
	.eghbal-archive-item-enter {
		opacity: 1 !important;
		transform: none !important;
		filter: none !important;
		transition: none !important;
	}
}

/* Footer-Led Dark Baseline */
:root {
	--eghbal-dark-shell: #020617;
	--eghbal-dark-shell-soft: #0b1220;
	--eghbal-dark-surface-1: rgba(15, 23, 42, 0.56);
	--eghbal-dark-surface-2: rgba(15, 23, 42, 0.74);
	--eghbal-dark-border-soft: rgba(148, 163, 184, 0.24);
	--eghbal-dark-border-strong: rgba(148, 163, 184, 0.38);
	--eghbal-dark-glow: 0 20px 60px rgba(2, 6, 23, 0.55);
}

.dark body {
	background-color: var(--eghbal-dark-shell) !important;
	background-image:
		radial-gradient(circle at 14% 14%, rgba(16, 185, 129, 0.16), transparent 42%),
		radial-gradient(circle at 84% 86%, rgba(245, 1, 1, 0.14), transparent 42%),
		linear-gradient(180deg, rgba(15, 23, 42, 0.55) 0%, rgba(2, 6, 23, 0.92) 45%, rgba(2, 6, 23, 1) 100%);
	background-repeat: no-repeat;
	background-attachment: fixed;
	color: rgba(241, 245, 249, 0.96);
}

.dark .eghbal-dark-surface {
	background-color: var(--eghbal-dark-surface-1) !important;
	border-color: var(--eghbal-dark-border-soft) !important;
	box-shadow: var(--eghbal-dark-glow);
	backdrop-filter: blur(18px) saturate(130%);
}

.dark .eghbal-dark-surface-strong {
	background-color: var(--eghbal-dark-surface-2) !important;
	border-color: var(--eghbal-dark-border-strong) !important;
	box-shadow: var(--eghbal-dark-glow);
	backdrop-filter: blur(22px) saturate(135%);
}

.dark .eghbal-dark-chip {
	background-color: rgba(15, 23, 42, 0.62) !important;
	border-color: var(--eghbal-dark-border-soft) !important;
}

/* Sitewide dark-mode styling for page/component surfaces (excluding header shell) */
.dark main [class*="dark:bg-white/5"] {
	background-color: rgba(15, 23, 42, 0.62) !important;
	background-image: linear-gradient(145deg, rgba(16, 185, 129, 0.06), rgba(245, 1, 1, 0.04));
}

.dark main [class*="dark:bg-white/10"] {
	background-color: rgba(15, 23, 42, 0.74) !important;
	background-image: linear-gradient(145deg, rgba(16, 185, 129, 0.08), rgba(245, 1, 1, 0.05));
}

.dark main [class*="dark:bg-zinc-900"],
.dark main [class*="dark:bg-slate-800"],
.dark main [class*="dark:bg-slate-900"],
.dark main [class*="dark:bg-slate-950"] {
	background-color: rgba(2, 6, 23, 0.86) !important;
}

.dark main [class*="dark:border-white/5"],
.dark main [class*="dark:border-white/10"] {
	border-color: rgba(148, 163, 184, 0.28) !important;
}

.dark main [class*="dark:border-white/15"],
.dark main [class*="dark:border-white/20"] {
	border-color: rgba(148, 163, 184, 0.4) !important;
}

.dark main [class*="dark:hover:bg-white/10"]:hover,
.dark main [class*="dark:hover:bg-white/15"]:hover {
	background-color: rgba(30, 41, 59, 0.82) !important;
}

.dark main [class*="dark:text-white/60"] {
	color: rgba(226, 232, 240, 0.78) !important;
}

.dark main [class*="dark:text-white/70"] {
	color: rgba(226, 232, 240, 0.85) !important;
}

.dark main [class*="dark:text-white/80"] {
	color: rgba(241, 245, 249, 0.92) !important;
}