/**
 * Design System v2 — Animations (نسخه 1.3.0)
 *
 * توجه: قاعده‌ی سراسری «* { transition }» عمداً حذف شده تا به چهره‌ی wp-admin
 * آسیب نزند؛ ترنزیشن‌ها روی خودِ کامپوننت‌ها (components-v2.css) تعریف شده‌اند.
 * اینجا فقط keyframes و کلاس‌های کمکی animate-* قرار دارند.
 *
 * @package Clinic_Manager
 */

@keyframes clinicFadeIn {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes clinicSlideInUp {
	from { opacity: 0; transform: translateY(20px); }
	to { opacity: 1; transform: translateY(0); }
}

@keyframes clinicSlideInDown {
	from { opacity: 0; transform: translateY(-20px); }
	to { opacity: 1; transform: translateY(0); }
}

@keyframes clinicSlideInLeft {
	from { opacity: 0; transform: translateX(-20px); }
	to { opacity: 1; transform: translateX(0); }
}

@keyframes clinicSlideInRight {
	from { opacity: 0; transform: translateX(20px); }
	to { opacity: 1; transform: translateX(0); }
}

@keyframes clinicScaleIn {
	from { opacity: 0; transform: scale(0.95); }
	to { opacity: 1; transform: scale(1); }
}

@keyframes clinicSpin {
	to { transform: rotate(360deg); }
}

@keyframes clinicPulse {
	0%, 100% { opacity: 1; }
	50% { opacity: 0.5; }
}

@keyframes clinicShimmer {
	0% { background-position: -1000px 0; }
	100% { background-position: 1000px 0; }
}

@keyframes clinicBounce {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-10px); }
}

@keyframes clinicRipple {
	0% { width: 0; height: 0; opacity: 1; }
	100% { width: 300px; height: 300px; opacity: 0; }
}

/* alias قدیمی spin برای دکمه‌های loading */
@keyframes spin {
	to { transform: rotate(360deg); }
}

.animate-fadeIn { animation: clinicFadeIn 0.3s ease; }
.animate-slideInUp { animation: clinicSlideInUp 0.3s ease; }
.animate-slideInDown { animation: clinicSlideInDown 0.3s ease; }
.animate-slideInLeft { animation: clinicSlideInLeft 0.3s ease; }
.animate-slideInRight { animation: clinicSlideInRight 0.3s ease; }
.animate-scaleIn { animation: clinicScaleIn 0.3s ease; }
.animate-spin { animation: clinicSpin 1s linear infinite; }
.animate-pulse { animation: clinicPulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; }
.animate-bounce { animation: clinicBounce 1s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite; }

.animate-shimmer {
	background: linear-gradient(90deg,
		var(--clinic-gray-200) 25%,
		var(--clinic-gray-300) 50%,
		var(--clinic-gray-200) 75%);
	background-size: 1000px 100%;
	animation: clinicShimmer 2s infinite;
}

/* اسکلت بارگذاری — نقشِ داده.
 * STEP 223-B — insetِ STEP 155 حذف شد (داده سایه ندارد) و شعاع به توکنِ نقشِ داده
 * رفت. موکاپ خطِ ۲۶۳ همین است: `.skeleton { border-radius: --clinic-radius-sm }`
 * بدونِ هیچ سایه‌ای. خودِ انیمیشنِ shimmer نشانه‌ی «در حالِ بارگذاری» است. */
.clinic-skeleton {
	display: block;
	border-radius: var(--clinic-radius-data, 8px);
	min-height: 16px;
	background: linear-gradient(90deg,
		var(--clinic-gray-200) 25%,
		var(--clinic-gray-300) 50%,
		var(--clinic-gray-200) 75%);
	background-size: 1000px 100%;
	animation: clinicShimmer 2s infinite;
	box-shadow: none;
}

/* reveal هنگام اسکرول (با design-system.js فعال می‌شود) */
.clinic-reveal {
	opacity: 0;
	transform: translateY(16px);
}

.clinic-reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
	transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* احترام به ترجیح کاهش حرکت */
@media (prefers-reduced-motion: reduce) {
	.animate-fadeIn,
	.animate-slideInUp,
	.animate-slideInDown,
	.animate-slideInLeft,
	.animate-slideInRight,
	.animate-scaleIn,
	.animate-bounce,
	.animate-pulse {
		animation: none;
	}
	.clinic-reveal {
		opacity: 1;
		transform: none;
	}
}