/* ============================================================
   Warsztat Vipremium — tryb dotykowy (tablet / telefon)
   Działa tylko na ekranach do 1100px lub urządzeniach dotykowych.
   ============================================================ */
@media (max-width: 1100px), (pointer: coarse) {

  /* modal na cały ekran — koniec z dłubaniem w okienku */
  .modal { max-width: 100% !important; width: 100%; max-height: 100%; height: 100%; border-radius: 0; display: flex; flex-direction: column; }
  .modal-bg { padding: 0; align-items: stretch; }
  .modal-b { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 16px; }
  .modal-h { padding: 14px 16px; position: sticky; top: 0; z-index: 2; background: var(--panel); }
  .modal-f { padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); position: sticky; bottom: 0; background: var(--panel); flex-wrap: wrap; gap: 8px; }
  .modal-h .x { font-size: 28px; padding: 4px 10px; }

  /* wszystko klikalne pod palec */
  .btn { min-height: 46px; padding: 11px 16px; font-size: 15px; }
  .btn.sm { min-height: 42px; padding: 9px 14px; font-size: 14px; }
  input, select, textarea { min-height: 46px; font-size: 16px; } /* 16px = iOS nie zoomuje */
  .modal-f .btn { flex: 1 1 auto; }

  /* formularze jedna kolumna */
  .row2 { grid-template-columns: 1fr !important; }

  /* listy punktów kontrolnych — duże wiersze, przyciski obok siebie */
  #k_lista table, #k_lista tbody, #k_lista tr, #k_lista td { display: block; width: 100%; }
  #k_lista tr.row { padding: 12px 10px; border-bottom: 1px solid var(--line); }
  #k_lista tr.row td:first-child { font-size: 17px; font-weight: 600; margin-bottom: 8px; }
  #k_lista tr.row td.right { text-align: left !important; }
  #k_lista tr.row td.right .btn { min-width: 29%; min-height: 54px; font-size: 20px; margin-right: 5px; }
  #k_lista .k-opis { width: 100%; margin-top: 8px; }
  #k_typy { grid-template-columns: 1fr 1fr !important; }
  #k_typy .btn { min-height: 56px; font-size: 16px; }
  #k_licznik { flex-basis: 100%; order: -1; font-size: 15px; padding-bottom: 4px; }

  /* tabela kontroli — karty zamiast kolumn */
  #main table { font-size: 15px; }
  #main td, #main th { padding: 10px 8px; }
}

/* telefon: lista kontroli jako karty */
@media (max-width: 640px) {
  #main thead { display: none; }
  #main tbody tr.row { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; padding: 12px; border-bottom: 1px solid var(--line); }
  #main tbody tr.row td { display: block; padding: 0; border: 0; }
  #main tbody tr.row td.right { grid-row: span 3; align-self: center; }
}
