/* ITMB — taalwissel achter in het hoofdmenu (ITMB_TALEN_WISSEL = 'menu').
   Eerst gebruikt op todaymakelaars.nl (2026-10-07): Marcel wilde de vlaggetjes
   rechts in het menu, op elk scherm. Geen bovenbalkvariant, dus hier ook geen
   regels die het menu-item op desktop verbergen (zie taalwissel.css).

   Selectors met #top-menu / .et_mobile_menu: Divi styleert menu-items met een
   id-selector, en een losse klasse verliest daarvan (les mama-telecom 20-09). */
.itmb-taal__vlag { width: 24px; height: 24px; display: inline-block; vertical-align: middle; transition: transform .12s ease-out; }
li.itmb-taal a:hover .itmb-taal__vlag { transform: scale(1.08); }
li.itmb-taal a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

/* Desktop: vlaggen dicht bij elkaar, met wat lucht na het laatste menu-item. */
#top-menu li.itmb-taal { padding-right: 8px; }
#top-menu li.itmb-taal:last-child { padding-right: 0; }
#top-menu li.itmb-taal + li.itmb-taal { margin-left: 0; }
#top-menu li.itmb-taal:not(.itmb-taal ~ .itmb-taal) { margin-left: 12px; }
#top-menu li.itmb-taal > a { line-height: 0; }

/* Huidige taal: streepje eronder, geen transparantie (vlag blijft herkenbaar
   op elke achtergrond). */
li.itmb-taal .itmb-taal__vlag { border-bottom: 3px solid transparent; padding-bottom: 2px; box-sizing: content-box; }
li.itmb-taal--huidig .itmb-taal__vlag { border-bottom-color: currentColor; }
li.itmb-taal--huidig a { cursor: default; }
li.itmb-taal--huidig a:hover .itmb-taal__vlag { transform: none; }

/* Uitklapmenu (telefoon/tablet): beide vlaggen naast elkaar op één regel.
 *
 * Uitlijning met de menutekst: Divi geeft de links `padding: 10px 5%`, en die
 * 5% rekent tegen de breedte van het (volle) li-element = de ul. Onze li's
 * zijn inline-block en smal, dus 5% padding op de link was daar ~2 px: de
 * vlaggen stonden 13 px (390 px breed) tot 26 px (768 px) links van de tekst
 * (gemeten 2026-10-07). Een MARGE van 5% op de eerste li rekent wél tegen de
 * ul, dezelfde basis als de tekst.
 *
 * max-width: none — Divi zet img { max-width: 100% } en de smalle li drukte
 * de vlag van 24 naar 22 px. */
.et_mobile_menu li.itmb-taal { display: inline-block; width: auto; }
.et_mobile_menu li.itmb-taal:not(.itmb-taal ~ .itmb-taal) { margin-left: 5%; }
.et_mobile_menu li.itmb-taal > a { padding: 10px 12px 10px 0; border-bottom: 0; line-height: 0; }
.et_mobile_menu li.itmb-taal--huidig > a { background: none; }
.et_mobile_menu li.itmb-taal .itmb-taal__vlag { max-width: none; }