/* عرض الجداول كبطاقات على الهاتف — الجداول بتتحول تلقائيًا (راجع ui-extras.js) */
@media (max-width: 768px) {
  table.rq-cards { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; border: 0 !important; table-layout: auto !important; }
  table.rq-cards thead { display: none !important; }
  table.rq-cards tbody { display: block !important; width: 100% !important; }
  table.rq-cards tr {
    display: block !important; margin: 0 0 12px !important; padding: 4px 0 !important;
    border: 1px solid rgba(148, 163, 184, .28) !important; border-radius: 14px !important;
    background: rgba(148, 163, 184, .06) !important; overflow: hidden;
  }
  table.rq-cards td {
    display: block !important; position: relative; width: 100% !important; min-width: 0 !important; max-width: none !important;
    box-sizing: border-box; padding: 8px 10px !important; padding-right: calc(38% + 14px) !important;
    min-height: 34px; border: 0 !important; border-bottom: 1px dashed rgba(148, 163, 184, .22) !important;
    white-space: normal !important; word-break: break-word; text-align: right;
  }
  table.rq-cards tr > td:last-child { border-bottom: 0 !important; }
  table.rq-cards td::before {
    content: attr(data-label); position: absolute; right: 10px; top: 8px; width: 36%;
    font-size: 11px; font-weight: 800; line-height: 1.6; color: #94a3b8; text-align: right;
  }
  table.rq-cards td[data-label=""], table.rq-cards td[colspan] { padding-right: 10px !important; }
  table.rq-cards td[data-label=""]::before, table.rq-cards td[colspan]::before { display: none; }
  table.rq-cards td[colspan] { text-align: center; }
  table.rq-cards td:empty { display: none !important; }

  /* عمود التحكم (الأزرار) — إزالة padding الجانبي وعرض الأزرار في صف أفقي */
  table.rq-cards td[data-label="التحكم"] {
    padding-right: 10px !important;
    white-space: nowrap;
    overflow-x: auto;
  }
  table.rq-cards td[data-label="التحكم"]::before { display: none; }
  table.rq-cards td[data-label="التحكم"] > * {
    display: inline-flex !important;
    white-space: nowrap;
  }
  /* منع قطع نص الأزرار داخل البطاقات */
  table.rq-cards td button,
  table.rq-cards td a {
    white-space: nowrap !important;
  }
  /* الحاويات اللي بتعمل سحب أفقي مالهاش لزوم في وضع البطاقات */
  .overflow-x-auto:has(> table.rq-cards) { overflow-x: visible !important; cursor: default !important; }
}