/*
Theme Name: Mazoon Orthopedic Center
Author: Abdulrahman Eldiehy
Author URI: https://abdulrahmaneldiehy.com/
Description: Custom bilingual WordPress theme for Mazoon Orthopedic Center.
Version: 1.0.4
Text Domain: mazoon-classic
*/

.footer-bottom .mzn-developed-by {
	color: var(--brand-aqua, #00b4c0);
	font-weight: 700;
	text-decoration: none;
	transition: color 180ms ease;
}

.footer-bottom .mzn-developed-by:hover,
.footer-bottom .mzn-developed-by:focus-visible {
	color: var(--brand-mint, #78cc90);
}

@font-face {
	font-family: "Poppins";
	src: url("/assets/fonts/Poppins-Bold.woff2?v=1.0.1") format("woff2");
	font-weight: 700;
	font-display: swap;
}

@font-face {
	font-family: "Noto Naskh Arabic";
	src: url("/assets/fonts/NotoNaskhArabic-Variable.woff2?v=1.0.1") format("woff2");
	font-weight: 400 700;
	font-display: swap;
}

html.is-loading {
	overflow: hidden;
}

.preloader {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: grid;
	place-items: center;
	overflow: hidden;
	color: #fff;
	background: radial-gradient(120% 90% at 50% 110%, #00849c 0%, #003054 45%, #00243f 100%);
	clip-path: inset(0);
	transition: clip-path 1s cubic-bezier(.76, 0, .24, 1) .15s, visibility 0s linear 1.2s;
}

.preloader.is-done {
	clip-path: inset(0 0 100%);
	visibility: hidden;
}

.preloader__glow {
	position: absolute;
	inline-size: 60vmax;
	block-size: 60vmax;
	border-radius: 50%;
	filter: blur(60px);
	opacity: .55;
	animation: pl-drift 6s ease-in-out infinite alternate;
}

.preloader__glow--a {
	background: #00b4c0;
	inset: -20vmax auto auto -15vmax;
}

.preloader__glow--b {
	background: #78cc90;
	inset: auto -18vmax -25vmax auto;
	opacity: .35;
	animation-delay: -3s;
}

.preloader__center {
	position: relative;
	display: grid;
	justify-items: center;
	gap: 18px;
	text-align: center;
	transition: opacity .4s ease, transform .6s cubic-bezier(.22, 1, .36, 1);
}

.preloader.is-done .preloader__center {
	opacity: 0;
	transform: translateY(-24px);
}

.preloader__mark {
	position: relative;
	inline-size: 96px;
	block-size: 96px;
}

.preloader__mark img {
	inline-size: 100%;
	block-size: 100%;
	animation: pl-rise 1.1s cubic-bezier(.22, 1, .36, 1) both;
	filter: drop-shadow(0 10px 30px rgb(0 180 192 / .45));
}

.preloader__name {
	margin: 0;
	font-family: "Poppins", "Noto Naskh Arabic", Tahoma, Arial, system-ui, sans-serif;
	font-weight: 700;
	font-size: 28px;
	line-height: 1.3;
	letter-spacing: .01em;
	animation: pl-rise 1.1s cubic-bezier(.22, 1, .36, 1) .12s both;
}

.preloader__name span {
	display: block;
	margin-top: 2px;
	font-size: 13px;
	font-weight: 400;
	opacity: .7;
}

.preloader__bar {
	position: relative;
	inline-size: 200px;
	block-size: 3px;
	border-radius: 3px;
	background: rgb(255 255 255 / .12);
	overflow: hidden;
	animation: pl-rise 1.1s cubic-bezier(.22, 1, .36, 1) .24s both;
}

.preloader__bar span {
	position: absolute;
	inset: 0;
	transform-origin: left center;
	transform: scaleX(0);
	background: linear-gradient(90deg, #00b4c0, #78cc90, #f08400);
}

html[dir="rtl"] .preloader__bar span {
	transform-origin: right center;
}

.preloader__pct {
	font: 600 12px/1 "Poppins", "Noto Naskh Arabic", Tahoma, Arial, system-ui, sans-serif;
	letter-spacing: .2em;
	opacity: .6;
	font-variant-numeric: tabular-nums;
}

@keyframes pl-rise {
	from { opacity: 0; transform: translateY(16px); }
	to { opacity: 1; transform: none; }
}

@keyframes pl-drift {
	to { transform: translate(8vmax, 6vmax) scale(1.15); }
}

@media (prefers-reduced-motion: reduce) {
	.preloader__glow,
	.preloader__mark img,
	.preloader__name,
	.preloader__bar {
		animation: none;
	}
}

/* The stylesheet's last-child rules are for the three-card home grid; these grids show every card. */
.post-grid--1 > .post-feature {
	display: grid;
}

.post-grid--2 > .post-card {
	display: flex;
}

.post-grid:empty {
	display: none;
}

.blog-pagination {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin-top: 40px;
}

.blog-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0 14px;
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
	background: var(--surface);
	color: var(--heading);
	font-weight: 600;
	text-decoration: none;
	transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

.blog-pagination a.page-numbers:hover,
.blog-pagination a.page-numbers:focus-visible {
	border-color: var(--brand-deep-teal);
	color: var(--brand-deep-teal);
}

.blog-pagination .page-numbers.current {
	border-color: var(--brand-deep-teal);
	background: var(--brand-deep-teal);
	color: #fff;
}

.blog-pagination .page-numbers.dots {
	border-color: transparent;
	background: transparent;
}

/* inline-start is the right side in Arabic and the left side in English. */
.whatsapp-float {
	position: fixed;
	inset-block-end: calc(20px + env(safe-area-inset-bottom));
	inset-inline-start: 20px;
	z-index: 90;
	display: flex;
	align-items: center;
	justify-content: center;
	inline-size: 56px;
	block-size: 56px;
	border-radius: 50%;
	background: #25d366;
	color: #fff;
	box-shadow: var(--shadow-float);
	transition: transform 180ms ease;
}

.whatsapp-float:hover,
.whatsapp-float:focus-visible {
	transform: scale(1.08);
}

.whatsapp-float svg {
	inline-size: 30px;
	block-size: 30px;
}

@media (max-width: 640px) {
	.whatsapp-float {
		inset-block-end: calc(16px + env(safe-area-inset-bottom));
		inset-inline-start: 16px;
		inline-size: 52px;
		block-size: 52px;
	}
}

@media print {
	.whatsapp-float {
		display: none;
	}
}