/* ENSAMIO 1.25.0 — kleine schermen: afgesneden inhoud op 320px breed.

   Gemeten in Chromium over 16 pagina's x 6 schermformaten x licht/donker (192 metingen) plus
   een ronde met grote systeemletters. Uitkomst: op 390px en breder wordt NERGENS inhoud
   afgesneden. Alleen op 320px (iPhone SE, en de iPhone mini met vergrote weergave) gebeurt dat,
   op drie pagina's. Dit bestand herstelt precies die drie, en niets anders.

   Belangrijk voor wie dit later leest: de pagina verschuift NIET horizontaal -- body heeft
   overflow-x:hidden. Dat betekent dat te brede inhoud niet opzij te schuiven is maar wordt
   AFGESNEDEN, en dus onbereikbaar is. Dat is de fout die hier wordt verholpen.

   Ook gemeten en in orde bevonden, dus hier met opzet niet aangeraakt:
     - De chip-rijen (.filter-row) en de stemgroeptabs (#v18VoiceTabs) steken bij scrollstand 0
       buiten het venster uit. Dat is bedoeld: zij hebben overflow-x:auto en schuiven met een
       veegbeweging. Geen fout.
     - Toetsenbordbediening: 25 elementen bereikt met Tab, alle 25 met een zichtbare
       focusmarkering.
     - De vaste navigatie onderaan verbergt nergens inhoud, behalve op de pagina Beheer
       (zie punt 4). */

/* ---------------------------------------------------------------------------------------------
   1. LEDEN — de ledenlijst werd 364px breed in een vak van 298px: 55px afgesneden.

   #memberGrid is een flex-item met de standaard min-width:auto. Zo'n item krimpt niet onder zijn
   min-content, en die min-content wordt vastgezet door de ledennamen: die staan in een <strong>
   met white-space:nowrap en worden tot 252px breed ("Voorbeeldlid 10"). Samen met de inspringing
   van 46px, de avatar van 42px en het telbolletje paste dat niet meer.

   min-width:0 laat het rooster wel krimpen (gemeten: 364px -> 298px, pagina-inhoud precies 320px).
   De naam zou dan zonder meer worden afgekapt; text-overflow:ellipsis maakt daar een nette
   afkorting met … van, zodat te zien is dat er meer staat.
   --------------------------------------------------------------------------------------------- */
#memberGrid { min-width: 0; }

#memberGrid .v13-member-copy > strong,
#memberGrid .v13-member-copy > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ---------------------------------------------------------------------------------------------
   2. STEMGROEP — de knop "Afspraak vastzetten" (218px) stond 64px buiten beeld.

   .v91-head is een flex-rij met justify-content:space-between en flex-wrap:nowrap. Op een smal
   scherm past de kop met de knop ernaast niet, en omdat de rij niet mag afbreken werd de knop
   eruit geduwd. flex-wrap:wrap laat hem onder de kop vallen zodra het nodig is; op een breed
   scherm verandert er niets, want dan is er ruimte en wordt er niet afgebroken.
   --------------------------------------------------------------------------------------------- */
.v91-head { flex-wrap: wrap; }
.v91-head > * { min-width: 0; }

/* ---------------------------------------------------------------------------------------------
   3. INSTELLINGEN — de kaart "Leden uitnodigen" sneed 23px af.

   .settings-heading is een flex-rij (pictogram + tekstblok). Het tekstblok had min-width:auto en
   werd 279px in een vak van 262px, doordat het naast kop en uitleg ook het uitnodigingsformulier
   bevat. min-width:0 op het blok, en overflow-wrap op de tekst zodat een lange uitnodigingslink
   of e-mailadres afbreekt in plaats van het vak op te rekken.
   --------------------------------------------------------------------------------------------- */
.settings-heading > div { min-width: 0; }
.settings-heading > div > h4,
.settings-heading > div > p { min-width: 0; overflow-wrap: anywhere; }
.settings-heading input,
.settings-heading select,
.settings-heading textarea { max-width: 100%; min-width: 0; }

/* ---------------------------------------------------------------------------------------------
   4. BEHEER — GEEN FOUT. Hier stond in een eerdere versie van dit bestand opvulling onderaan,
   omdat de meting meldde dat de vaste navigatie inhoud van het beheerscherm bedekte. Dat was
   een fout in de MEETMETHODE, niet in de app: die inhoud zit in het uitklapblok
   <details id="boardMore"> dat dicht staat. Chromium gebruikt daarvoor content-visibility, en
   de zichtbaarheidstoets keek alleen naar display, visibility en opacity. Met de juiste API
   (Element.checkVisibility) antwoordt de browser zelf dat het element onzichtbaar is.
   Nagemeten met checkVisibility: de vaste navigatie bedekt NERGENS bereikbare inhoud.
   Er is hier dus niets te herstellen, en de regel is weer weggehaald.
   --------------------------------------------------------------------------------------------- */

/* ---------------------------------------------------------------------------------------------
   5. AANRAAKVLAKKEN — één hersteld, drie bewust NIET.

   Richtlijn: 44x44 (Apple HIG; WCAG 2.5.5). Gemeten op mobiele formaten staan 73 elementen
   onder die maat. De meeste zijn 38-43px: marginaal, en optrekken zou koprijen op élk scherm
   hoger maken. Dat is een ontwerpkeuze, geen fout, en is hier niet aangeraakt.

   HERSTELD, en nagemeten: de voetlinks Privacy en Contact van het voorportaal waren 53x19 en
   56x19. Zij staan na deze regel niet meer in de meting.
   --------------------------------------------------------------------------------------------- */
.pv-wrap .pv-foot .pv-links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 4px;
}

/* ---------------------------------------------------------------------------------------------
   NIET HERSTELD, met reden. Drie knoppen zijn duidelijk te klein:

     18x18   keuzevakje "opname selecteren"   #adminRecordingList .archive-select input
     25x24   kruisje "verwijderen"            .v79-card .v79-del
     26x26   knop "afvinken"                  .v79-card .v79-chk

   Een eerdere versie van dit bestand vergrootte hun raakvlak met een onzichtbaar vlak (::after)
   van 44x44. Dat is weer weggehaald, en wel hierom: deze drie knoppen verschijnen alleen in
   toestanden die de geautomatiseerde doorloop niet bereikt (de rechtenkaart komt pas na het
   kiezen van een lid, de opnamerij pas na het openen van het archief). Bij de klikproef stonden
   ze niet op het scherm, dus de verbetering was NIET aantoonbaar -- en een onzichtbaar vlak van
   44x44 in een krappe lijst kan tikken op buurelementen opslokken.

   Een niet te testen wijziging met een aannemelijk risico hoort niet in een release die
   "foundation & quality" heet. Deze drie horen op een echt toestel bekeken en hersteld te
   worden, samen met de rest van Fase E. Zie het testverslag, onderdeel "niet uitgevoerd".
   --------------------------------------------------------------------------------------------- */

/* ---------------------------------------------------------------------------------------------
   6. GROTE SYSTEEMLETTERS — bij 24px basisletter op 320px rekte de beginpagina op.

   Gemeten met de lettergrootte van het besturingssysteem op 24px (standaard 16px): de tegels op
   Home werden samen te breed doordat het label niet mocht afbreken. Laat het afbreken.
   --------------------------------------------------------------------------------------------- */
#v71Today .v71-grid { min-width: 0; }
#v71Today .v71-grid > .v71-tile { min-width: 0; }
#v71Today .v71-tile > .v71-lab { min-width: 0; overflow-wrap: anywhere; }