/* UX-STD v1 */
/* assets/ux-table-cards.css — טבלה → כרטיסים במובייל (TEAM_UI_STANDARD §2 / §11).
 *
 * מתחת ל-600px כל שורה הופכת לכרטיס דו-צדדי: התווית מימין, הערך משמאל. אסור
 * טבלה שקורסת לעמודה אחת. מעל 600px — טבלה רגילה.
 *
 * שימוש: <table class="ux-tc"> ... <td data-l="תאריך">03.08.2026</td>
 * ה-data-l הוא הכותרת של העמודה; תא בלי data-l מוצג בלי תווית (למשל תגים).
 * הרכיב הראשון בענף (26.9.26, timesheet.html). קובץ CSS בלבד — אין JS לשבור.
 */
.ux-tc{width:100%;border-collapse:collapse}
.ux-tc th,.ux-tc td{padding:8px 10px;text-align:right;border-bottom:1px solid var(--line,#e2e8f0);font-size:var(--fs-small,0.95rem)}
.ux-tc th{color:var(--mut,#475569);font-weight:800;font-size:var(--fs-tiny,0.8rem);background:var(--surface-2,#f1f5f9)}
@media (max-width:600px){
  .ux-tc thead{display:none}
  .ux-tc,.ux-tc tbody,.ux-tc tr,.ux-tc td{display:block;width:100%}
  .ux-tc tr{background:var(--card,#fff);border:1px solid var(--line,#e2e8f0);border-radius:14px;padding:6px 12px;margin:0 0 8px}
  .ux-tc td{display:flex;align-items:center;justify-content:space-between;gap:10px;border:0;padding:6px 0;font-size:var(--fs-body,1rem)}
  .ux-tc td[data-l]::before{content:attr(data-l);color:var(--mut,#475569);font-weight:700;font-size:var(--fs-small,0.95rem);flex:0 0 auto}
  .ux-tc td:not([data-l]){justify-content:flex-start}
  .ux-tc td.lead{font-weight:800;font-size:var(--fs-h3,1.1rem);border-bottom:1px solid var(--line,#e2e8f0);padding-bottom:8px;margin-bottom:2px}
  .ux-tc td.lead::before{display:none}
}
@media print{.ux-tc tr{break-inside:avoid}}