/* mobiel.css — mobile first, geen kleine links (16 okt 2026, Mark: "Zorg dat alles mobile first is. Dus geen kleine links").
   Bovenop gewone Bootstrap 5.3: elk bedieningselement minstens 44×44 px tikvlak, invoer 16 px (anders zoomt iOS in).
   Kopie per site (zelf gehost i.v.m. CSP); bron: repo _shared/css/mobiel.css. Laden NA bootstrap.min.css.
   Controle: node ~/scripts/inlogtest/tikdoelen.mjs [--ingelogd] <url> */
:root { --tik: 44px; }

/* Knoppen: btn-sm bestaat niet meer, ook btn-lg-achtige hoogte op mobiel */
.btn, .btn-sm, .btn-group-sm > .btn {
  --bs-btn-padding-y: .5rem; --bs-btn-padding-x: .9rem; --bs-btn-font-size: 1rem;
  min-height: var(--tik); min-width: var(--tik);
  display: inline-flex; align-items: center; justify-content: center; gap: .35rem;
}
.btn-close { min-width: var(--tik); min-height: var(--tik); background-position: center; }

/* Invoer: 16 px en 44 px hoog */
.form-control, .form-select, .form-control-sm, .form-select-sm, .input-group-text {
  font-size: 1rem; min-height: var(--tik);
}
textarea.form-control { min-height: 6rem; }
.form-control-lg, .form-select-lg { font-size: 1.25rem; }   /* groot blijft groot (mailcode-veld WID) */

/* Vinkjes en rondjes: de hele regel is tikvlak */
.form-check { min-height: var(--tik); display: flex; align-items: center; gap: .5rem; padding-left: 0; }
.form-check .form-check-input { float: none; margin: 0; width: 1.4em; height: 1.4em; flex-shrink: 0; }
.form-check-label { flex: 1; padding: .6rem 0; cursor: pointer; min-height: var(--tik); display: flex; align-items: center; }
.form-check-inline { margin-right: 1rem; }
.form-switch { padding-left: 0; }
.form-switch .form-check-input { width: 2.6em; }

/* Navigatie, tabs, paginering, dropdowns, lijsten */
.nav-link, .navbar-brand, .navbar-toggler, .dropdown-item, .page-link {
  min-height: var(--tik); display: flex; align-items: center;
}
.page-link { min-width: var(--tik); justify-content: center; }
.list-group-item-action { min-height: var(--tik); display: flex; align-items: center; }
.list-group-item > a:only-child:not(.btn) { display: block; padding: .6rem 0; margin: -.6rem 0; }

/* Losse links die bediening zijn (niet in lopende tekst): .tik-link maakt er een groot tikvlak van */
.tik-link { display: inline-flex; align-items: center; justify-content: center; min-height: var(--tik); min-width: var(--tik); padding: 0 .25rem; }
/* Klassieke linklijsten (voetkolommen e.d.) */
.list-unstyled > li > a:not(.btn) { display: inline-flex; align-items: center; min-height: var(--tik); }

/* Geen kleine linkjes: tekst in .small/small blijft klein, maar een link erin krijgt toch een tikvlak */
.small a:not(.btn), small a:not(.btn), .form-text a { display: inline-block; padding: .8rem .1rem; margin: -.8rem 0; }

.table-responsive { -webkit-overflow-scrolling: touch; }