/* ==========================================================
   Snap KM — الأنماط المخصّصة
   (Tailwind يوفّر الأساس؛ هنا الإضافات الخاصة بالمشروع)
   ========================================================== */

/* ---------- مؤشرات الاتصال ---------- */
@keyframes pulseGreen {
  0%, 100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, .55); }
  50%      { box-shadow: 0 0 0 6px rgba(34, 197, 94, 0); }
}
@keyframes pulseRed {
  0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, .6); }
  50%      { box-shadow: 0 0 0 6px rgba(239, 68, 68, 0); }
}
.dot-online  { background: #22c55e; animation: pulseGreen 1.6s infinite; }
.dot-offline { background: #ef4444; animation: pulseRed   1.6s infinite; }

/* ---------- التبويبات ---------- */
.tab-active {
  background: rgba(249, 115, 22, .12);
  color: #fb923c;
  border-color: rgba(249, 115, 22, .4);
}

/* ---------- شريط التمرير ---------- */
::-webkit-scrollbar        { width: 10px; height: 10px; }
::-webkit-scrollbar-track  { background: #0c0b10; }
::-webkit-scrollbar-thumb  { background: #2a2633; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: #3a3543; }

/* ---------- تحسينات عامة ---------- */
body { -webkit-font-smoothing: antialiased; }

input, select, textarea, button { font-family: inherit; }

/* حقول الأرقام بدون أسهم مزعجة */
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number] { -moz-appearance: textfield; }

/* الوصف متعدد الأسطر في بطاقات المنتجات */
.desc-lines { white-space: pre-line; }

/* جدول قابل للتمرير أفقياً على الجوال */
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ---------- رسائل ---------- */
.msg-ok  { border-color: rgba(34,197,94,.3);  background: rgba(34,197,94,.1);  color: #86efac; }
.msg-err { border-color: rgba(239,68,68,.3);  background: rgba(239,68,68,.1);  color: #fca5a5; }
.msg-warn{ border-color: rgba(245,158,11,.3); background: rgba(245,158,11,.1); color: #fcd34d; }

/* ---------- طباعة ---------- */
@media print {
  header, footer, .no-print { display: none !important; }
  body { background: #fff !important; color: #000 !important; }
}