/**
 * effects.css — طبقة حركة وتفاعل احترافية (إحساس Apple/Linear/Stripe الناعم)
 * تُطبَّق تلقائيًا على كل عناصر الموقع الموجودة أصلًا بدون تغيير أي HTML.
 */

/* ============ انتقال دخول ناعم للصفحة كاملة ============ */
@keyframes pageFadeIn {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}
.content { animation: pageFadeIn .35s cubic-bezier(.4,0,.2,1); }

/* ============ Hover: بطاقات ترتفع بلطف مع ظل ناعم ============ */
.card, .stat-card {
    transition: transform .22s cubic-bezier(.4,0,.2,1), box-shadow .22s cubic-bezier(.4,0,.2,1), border-color .22s ease;
}
.card:hover, .stat-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(0,0,0,0.10);
    border-color: color-mix(in srgb, var(--gold) 35%, var(--border));
}

/* ============ Hover: صفوف الجداول ============ */
table.data-table tbody tr { transition: background-color .15s ease; }

/* ============ Hover: روابط القائمة الجانبية ============ */
.sidebar nav a { transition: background-color .18s ease, color .18s ease, padding-right .18s ease; }
.sidebar nav a:hover { padding-right: 24px; }
html[dir="ltr"] .sidebar nav a:hover { padding-right: 20px; padding-left: 24px; }

/* ============ أزرار: رفعة خفيفة + تأثير Ripple عند الضغط ============ */
.btn, .icon-btn {
    position: relative; overflow: hidden;
    transition: transform .15s cubic-bezier(.4,0,.2,1), box-shadow .15s ease, filter .15s ease;
}
.btn:hover { transform: translateY(-1px); filter: brightness(1.05); }
.btn:active { transform: translateY(0); }
.btn-gold:hover { box-shadow: 0 6px 18px rgba(201,168,76,0.35); }
.btn-primary:hover { box-shadow: 0 6px 18px rgba(59,130,246,0.30); }

.ripple-effect {
    position: absolute; border-radius: 50%; background: rgba(255,255,255,0.45);
    transform: scale(0); animation: rippleAnim .55s ease-out; pointer-events: none;
}
@keyframes rippleAnim { to { transform: scale(2.6); opacity: 0; } }

/* ============ حقول الإدخال: تركيز ناعم ============ */
.form-control { transition: border-color .18s ease, box-shadow .18s ease; }
.form-control:focus { box-shadow: 0 0 0 3px color-mix(in srgb, var(--gold) 18%, transparent); }

/* ============ Skeleton Loading: عناصر نائبة أثناء التحميل ============ */
.skeleton {
    position: relative; overflow: hidden; background: var(--bg-tertiary);
    border-radius: 8px; color: transparent !important; pointer-events: none;
}
.skeleton::after {
    content: ''; position: absolute; inset: 0;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.10), transparent);
    animation: skeletonShimmer 1.3s infinite;
}
@keyframes skeletonShimmer { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
.skeleton-text { height: 14px; width: 70%; margin-bottom: 8px; }
.skeleton-title { height: 22px; width: 40%; margin-bottom: 14px; }
.skeleton-row { height: 42px; width: 100%; margin-bottom: 6px; }

/* ============ Badges: نبضة خفيفة للحالات العاجلة ============ */
.badge-danger { animation: none; }
.badge-danger.badge-pulse { animation: badgePulse 1.8s ease-in-out infinite; }
@keyframes badgePulse { 0%,100% { opacity:1; } 50% { opacity:.6; } }

/* ============ لمسات هوية الشعار: خطوط، ظلال، مسافات ============ */

/* تباعد أحرف خفيف على النصوص الصغيرة الحساسة (تسميات، شارات) — نفس روح
   "BUSINESS SERVICES" بالشعار (Uppercase tracking) */
.badge, .stat-card .label, .lang-switch a, .sidebar-logo .tagline {
    letter-spacing: .3px;
}

/* الأرقام الكبيرة (إحصائيات، إجماليات) بوزن ثقيل واثق — نفس وزن رقم "24" بالشعار */
.stat-card .num, .totals .grand, .confirm-box p strong {
    font-weight: 800;
    letter-spacing: -.5px;
}

/* أزرار الإجراء الرئيسي (الذهبية) بوزن أثقل قليلًا لإحساس أكثر ثقة */
.btn-gold { font-weight: 800; letter-spacing: .1px; }

/* ظل ناعم متدرّج على البطاقات، مطابق لظل نص الشعار الرقمي */
.card, .stat-card {
    box-shadow: 0 1px 2px rgba(10,34,24,0.04), 0 4px 12px rgba(10,34,24,0.03);
}
.card:hover, .stat-card:hover {
    box-shadow: 0 4px 10px rgba(10,34,24,0.06), 0 14px 32px rgba(0,0,0,0.10);
}

/* خط ذهبي دقيق أعلى البطاقات الإحصائية، صدى لخط "24" الذهبي بالشعار */
.stat-card { position: relative; overflow: hidden; }
.stat-card::before {
    content: ''; position: absolute; top: 0; right: 0; left: 0; height: 3px;
    background: linear-gradient(90deg, var(--gold), var(--gold-light));
    opacity: .85;
}

/* مسافات داخلية أكثر سخاءً بالبطاقات الرئيسية لإحساس أهدأ وأرقى */
.card { padding: 24px; }
@media (max-width: 900px) { .card { padding: 18px; } }