/* ===========================================================================
   DE KOPBALK MET DE KNOP INLOGGEN
   Ontwerp versie 7, 22-09-2026.

   WAAROM DIT BESTAND BESTAAT
   De eigenaar vroeg "waar is inlog scherm?": op de computer stond Inloggen
   alleen in het uitklapmenu en in de voet. Sinds 22-09-2026 staat in de
   kopbalk van elke pagina in versie 7 een knop Inloggen voor Plan een demo,
   met de bestaande klassen (knop knop-rand knop-klein).

   Die knop is 97 pixels breed. Gemeten op /bewijs zonder dit bestand:
   - van 1024 tot en met 1080 pixels ontbraken er tot 62 pixels. Dan braken
     de vier menulinks en Plan een demo over twee regels en werd de kopbalk
     92 pixels hoog in plaats van 76
   - van 480 tot en met 520 pixels brak Plan een demo over twee regels: daar
     staan het merk, twee knoppen en de menuknop naast elkaar op 440 pixels

   WAAROM EEN EIGEN BESTAND
   De kopbalk is op alle pagina's gelijk, dus deze regels horen in de
   gedeelde laag. De drie ontwerpbladen blijven onaangeroerd (afspraak met de
   andere bouwers) en ontwerp-overig-a.css draagt ruim duizend regels voor
   elf pagina's, met regels als .kruimels en div.etiket + .titel-1 die op
   andere pagina's anders zijn opgelost. Dat blad overal laden zou hun
   opmaak raken. Dit bestand bevat alleen de kopbalk en wordt direct na
   ontwerp-paginas.css geladen.
   =========================================================================== */

/* Een knop in de kopbalk breekt nooit over twee regels. Zonder deze regel
   krimpt de flexrij de knop in plaats van te melden dat de ruimte op is. */
.balk-acties .knop{white-space:nowrap}

/* Sinds 24-09-2026 heet het merk in de kopbalk "FranchiseHub CRM" (besluit
   eigenaar). Die naam is 45 pixels breder: gemeten op /bewijs brak hij van
   1024 tot en met 1060 en van 1120 tot en met 1128 pixels over twee regels
   en werd de kopbalk 97 pixels hoog in plaats van 74. Onder 1024 pixels paste
   hij al. De twee regels hieronder houden de rij op één regel met minstens
   11 pixels over; daarvoor was dat 8.

   Van 1024 tot en met 1071 pixels past merk, vier links en twee knoppen ook
   met de kleinste afstanden niet meer (tot 37 pixels tekort). Daar staat
   dezelfde opmaak als onder 1024: de links in het menupaneel en de menuknop
   rechts. Het menupaneel werkt op elke breedte. */
@media (min-width:1024px) and (max-width:1071px){
  .menu{display:none}
  .menu-knop{display:inline-flex}
  .balk-acties{margin-left:auto}
}

/* Van 1072 tot en met 1143 pixels staat het volledige menu er, maar is de rij
   nog te smal voor merk, vier links en twee knoppen met de gewone afstanden.
   Kleinere tussenruimtes maken 74 pixels vrij; vanaf 1144 passen de gewone
   afstanden weer. Tot 24-09-2026 liep deze regel van 1024 tot 1119, voor de
   kortere naam. */
@media (min-width:1072px) and (max-width:1143px){
  .balk-rij{gap:12px}
  .menu{gap:12px}
  .balk-acties{margin-left:4px;gap:8px}
}

/* Onder 600 pixels past Inloggen niet naast Plan een demo en de menuknop.
   Hij staat daar al in het uitklapmenu. Onder 480 pixels verbergt
   ontwerp-basis.css beide kleine knoppen al; deze regel sluit daarop aan. */
@media (max-width:599px){
  .balk-acties a[href="/login"]{display:none}
}