/* تعديلات RTL وأسلوب احترافي */
[x-cloak] { display: none !important; }

html, body { font-family: 'Tajawal', system-ui, sans-serif; }
body { scrollbar-gutter: stable; }

/* جداول واضحة */
table { border-collapse: separate; border-spacing: 0; }
table th { font-weight: 600; }

/* Scrollbar مظبوط للعربي */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* انيمشن خفيف للكروت */
.bg-white { transition: box-shadow .2s ease, transform .2s ease; }

/* أزرار تكون أوضح في حالة التركيز */
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid #14b8a6;
  outline-offset: 2px;
}

/* في الموبايل: padding أقل */
@media (max-width: 640px) {
  main { padding-bottom: 60px; }
}

/* تنسيق الفورم داخل المودال */
.modal-form label { display: block; margin-top: 12px; margin-bottom: 4px; font-size: 14px; color: #475569; font-weight: 500; }
.modal-form input, .modal-form select, .modal-form textarea {
  width: 100%;
  padding: 8px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-family: inherit;
  font-size: 14px;
}
.modal-form input:focus, .modal-form select:focus, .modal-form textarea:focus {
  border-color: #14b8a6;
  outline: none;
  box-shadow: 0 0 0 3px rgba(20, 184, 166, .15);
}
.modal-form .btn-primary {
  background: #0d9488;
  color: white;
  padding: 10px 20px;
  border-radius: 8px;
  font-weight: 600;
  margin-top: 16px;
}
.modal-form .btn-primary:hover { background: #0f766e; }
.modal-form .btn-secondary {
  background: #e2e8f0;
  color: #334155;
  padding: 10px 20px;
  border-radius: 8px;
  font-weight: 600;
  margin-top: 16px;
  margin-right: 8px;
}