/* =====================================================================
   motion.css — حركة موحّدة لكل شاشات EasyBooks (CSS بس)
   - مربوطة بالكلاسات المشتركة: cr-* (الشاشات الجديدة)، sx-*، dr (الأدراج)، eb-* (الشريط)، Bootstrap (القديم)
   - كل الحركة على opacity/transform بس، ومدتها 140–360ms
   - بتتقفل بالكامل مع «تقليل الحركة» وفي الطباعة، ولما الـ html عليه .eb-no-motion
   ===================================================================== */
:root {
    --eb-ease: cubic-bezier(.2, .8, .2, 1);
    --eb-t-fast: 140ms;
    --eb-t-mid: 220ms;
    --eb-t-slow: 360ms;
}

@keyframes eb-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes eb-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes eb-pop { from { opacity: 0; transform: scale(.96) translateY(-4px); } to { opacity: 1; transform: none; } }
@keyframes eb-drawer-in { from { transform: translateX(-100%); } to { transform: none; } }
@keyframes eb-modal-in { from { opacity: 0; transform: translateY(-10px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes eb-flash { 0%, 35% { background-color: #FEF9C3; } 100% { background-color: transparent; } }

/* ---------- 1. كروت الإجماليات: ظهور متتالي + رفع مع الماوس ---------- */
.cr-totals > .cr-total,
.cr-cards > *,
.cr-acard {
    animation: eb-rise var(--eb-t-slow) var(--eb-ease) both;
}
.cr-totals > .cr-total:nth-child(2), .cr-cards > *:nth-child(2) { animation-delay: 50ms; }
.cr-totals > .cr-total:nth-child(3), .cr-cards > *:nth-child(3) { animation-delay: 100ms; }
.cr-totals > .cr-total:nth-child(4), .cr-cards > *:nth-child(4) { animation-delay: 150ms; }
.cr-totals > .cr-total:nth-child(5), .cr-cards > *:nth-child(5) { animation-delay: 200ms; }
.cr-totals > .cr-total:nth-child(n+6), .cr-cards > *:nth-child(n+6) { animation-delay: 240ms; }

.cr-total { transition: background-color var(--eb-t-mid) var(--eb-ease); }
.cr-total:hover { background-color: rgba(79, 70, 229, .04); }
.cr-acard { transition: transform var(--eb-t-mid) var(--eb-ease), box-shadow var(--eb-t-mid) var(--eb-ease), border-color var(--eb-t-mid); }
.cr-acard:hover { transform: translateY(-2px); box-shadow: 0 2px 4px rgba(31, 34, 51, .06), 0 12px 26px rgba(79, 70, 229, .14); }

/* العدادات والتابات: hover ناعم */
.cr-counter, .cr-tab, .cr-opt, .cr-chip, .cr-facet, .cr-btn, .cr-ibtn, .cr-seg button {
    transition: background-color var(--eb-t-fast) var(--eb-ease), color var(--eb-t-fast), border-color var(--eb-t-fast), box-shadow var(--eb-t-fast), transform var(--eb-t-fast) var(--eb-ease);
}
.cr-btn:active, .cr-ibtn:active, .cr-counter:active, .btn:active { transform: scale(.97); }
.cr-tab { transition-property: color, border-color, background-color; }

/* ---------- 3. الجداول: الصفوف بتظهر بـ fade، والمجموعات سهمها بيلف ---------- */
.cr-table tbody tr {
    animation: eb-fade var(--eb-t-mid) var(--eb-ease) both;
}
.cr-table tbody tr:nth-child(-n+12) { animation-name: eb-rise; }
.cr-table tbody tr:nth-child(2) { animation-delay: 20ms; }
.cr-table tbody tr:nth-child(3) { animation-delay: 40ms; }
.cr-table tbody tr:nth-child(4) { animation-delay: 60ms; }
.cr-table tbody tr:nth-child(5) { animation-delay: 80ms; }
.cr-table tbody tr:nth-child(6) { animation-delay: 100ms; }
.cr-table tbody tr:nth-child(7) { animation-delay: 120ms; }
.cr-table tbody tr:nth-child(8) { animation-delay: 140ms; }
.cr-table tbody tr:nth-child(n+9) { animation-delay: 160ms; }
.cr-table tbody tr { transition: background-color var(--eb-t-fast); }
.cr-gtoggle i { display: inline-block; transition: transform var(--eb-t-mid) var(--eb-ease); }
.cr-gtoggle:hover i { transform: translateX(-2px); }
/* صف اتحفظ: الشاشة بتحط عليه .eb-flash (اختياري) */
.eb-flash, .eb-flash > td { animation: eb-flash 1.4s var(--eb-ease); }

/* ---------- 4. الأدراج والقوايم ---------- */
.dr-ov { animation: eb-fade var(--eb-t-mid) var(--eb-ease) both; }
.dr.cr { animation: eb-drawer-in var(--eb-t-slow) var(--eb-ease) both; }
.dr.cr .dr-body > *, .dr.cr form > * { animation: eb-rise var(--eb-t-slow) var(--eb-ease) both; animation-delay: 90ms; }

.cr-menu, .sx-menu, .cr-panel, .eb-co-menu, .dropdown-menu.show {
    animation: eb-pop var(--eb-t-fast) var(--eb-ease) both;
    transform-origin: top left;
}
.cr-panel { transform-origin: top center; }

/* النوافذ القديمة (Bootstrap) */
.modal.show .modal-dialog, .modal[style*="display: block"] .modal-dialog { animation: eb-modal-in var(--eb-t-mid) var(--eb-ease) both; }
.modal-backdrop.show { animation: eb-fade var(--eb-t-mid) var(--eb-ease) both; }

/* الزراير العامة (قديم وجديد) */
.btn { transition: background-color var(--eb-t-fast) var(--eb-ease), border-color var(--eb-t-fast), color var(--eb-t-fast), box-shadow var(--eb-t-fast), transform var(--eb-t-fast) var(--eb-ease); }

/* ---------- الإيقاف ---------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 1ms !important; animation-delay: 0ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; }
    .cr-spin, .spinner-border { animation-duration: .8s !important; animation-iteration-count: infinite !important; }
}
html.eb-no-motion *, html.eb-no-motion *::before, html.eb-no-motion *::after { animation: none !important; transition: none !important; }
@media print {
    *, *::before, *::after { animation: none !important; transition: none !important; }
}