/* Komponent: data-table — 70-dizajn.md § 7.6.6 + § 7.7.2 (mobil) */

.panel-body.scroll-x{ overflow-x:auto; }

table.data{ width:100%; border-collapse:collapse; }
table.data th{
  text-align:left; font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--crema); font-weight:var(--fw-medium);
  padding:12px 24px; border-bottom:1px solid var(--line);
}
table.data td{ padding:15px 24px; font-size:14px; border-bottom:1px solid var(--line); }
table.data tr:last-child td{ border-bottom:none; }
table.data tbody tr:hover td{ background:var(--cream-deep); }
table.data td.num,
table.data th.num{ text-align:right; font-variant-numeric:tabular-nums; }

@media (max-width:820px){
  .panel-body.scroll-x{ -webkit-overflow-scrolling:touch; }
  table.data{ min-width:520px; }
}

/* Redizajn 23 — kľúčové zoznamy (objednávky/faktúry/dodacie listy) → karty na mobile.
   Opt-in cez triedu .data--cards (produkty a pod. ostávajú scroll). */
@media (max-width:560px){
  table.data--cards{ min-width:0; }
  .data--cards, .data--cards thead, .data--cards tbody, .data--cards tr, .data--cards td{
    display:block; width:auto;
  }
  .data--cards thead, .data--cards tfoot{ display:none; }
  .data--cards tbody tr{
    background:var(--cream); border:1px solid var(--line); border-radius:var(--r-md);
    padding:12px 14px; margin-bottom:10px;
  }
  .data--cards tbody tr:hover td{ background:transparent; }
  .data--cards td{ border:none; padding:4px 0; font-size:14px; text-align:left; }
  .data--cards td[data-label]{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
  .data--cards td[data-label]::before{
    content:attr(data-label); color:var(--muted); font-size:12.5px; font-weight:var(--fw-medium);
  }
  .data--cards td.num{ text-align:left; }
  .data--cards td:first-child{
    font-family:var(--font-display); font-weight:var(--fw-semibold); font-size:16px;
    color:var(--text); padding-bottom:8px;   /* --text je theme-safe (admin dark neprepisuje --ink) */
  }
  .data--cards td:last-child{ padding-top:10px; }
}