/* ═══════════════════════════════════════════════════════════════════════
   MOBIEL (telefoon/iPad) — gedeeld door alle pagina's van SANT Uren.
   Wordt na de pagina-eigen <style> geladen, zodat deze regels boven de
   desktop-standaardwaarden gaan (bij gelijke specificiteit wint de regel
   die later staat). Raakt alleen schermen ≤768px — desktop blijft exact
   zoals het was.

   Kernprobleem dat dit oplost: navigatiebalken en tab-rijen hadden geen
   wrap of scroll, waardoor de HELE pagina breder werd dan het scherm en
   alles uitgezoomd/te klein werd. Losse pagina's kunnen daarnaast hun
   eigen specifieke fixes hebben (zie uren.php en planning_view.phtml).
   ═══════════════════════════════════════════════════════════════════════ */

@media (max-width:768px){

  html,body{ overflow-x:hidden; }

  /* Navigatiebalk en tab-rijen: scrollen binnen zichzelf i.p.v. de pagina
     te verbreden. Geldt voor alle varianten die in de app voorkomen. */
  .bar,.tabs{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
  .bar::-webkit-scrollbar,.tabs::-webkit-scrollbar{ display:none; }
  .nt,.tab,.br,.bar-r,.logo{ flex-shrink:0; }

  /* iOS zoomt automatisch in bij focus op een invoerveld met een
     lettergrootte onder 16px — dat voorkomt dit. */
  input,select,textarea{ font-size:16px; }

  /* Native checkboxes/radio's zijn standaard te klein om prettig te
     raken; dit vergroot ze een beetje zonder de rest van de opmaak
     te breken. */
  input[type="checkbox"],input[type="radio"]{
    width:18px; height:18px;
  }

  /* Tapdoelen: pijltjesknoppen en gewone knoppen wat ruimer. */
  .ar,.arrow{ width:38px; height:38px; }
  .btn,.btn-p,.btn-g,.btn-r,.btn-add,.btn-sm{ padding:9px 14px; }

  /* Modals altijd de volle breedte benutten in plaats van een vaste
     desktop-breedte die op een telefoon niet past. */
  .mo{
    width:100% !important;
    max-width:100% !important;
  }

  /* Iets minder padding rond de hoofdinhoud, zodat er meer ruimte
     overblijft voor de content zelf. */
  .mn{ padding:10px; }
}
