/* tct-boeken.css v1 (BOEKPAGINA-DESIGN 02-10-2026): sitebrede stukjes van de boekingsfunctie.
   Logica: js/tct-boeken.js (local_347e45a7). Dit bestand verfijnt de terugvalstijl #tct-boeken-stijl
   en verandert niets aan de maat of plek van de navknop. */

/* teller 1 tot 3 op Boek nu in de menubalk */
.master-navigation .tct-mand-teller, .tct-mand-teller {
  position: absolute; top: -7px; right: -7px; z-index: 3; min-width: 20px; height: 20px; padding: 0 6px;
  box-sizing: border-box; border-radius: 10px; background: #024F29; color: #F8F9E2; box-shadow: 0 0 0 2px #F8F9E2;
  font-family: futura-100, sans-serif; font-size: 12px; line-height: 20px; font-weight: 700; letter-spacing: 0;
  text-align: center; font-variant-numeric: tabular-nums; pointer-events: none;
  animation: tct-teller-in .35s cubic-bezier(.3, 0, .2, 1); }
.tct-mand-teller[hidden] { display: none; }
@keyframes tct-teller-in { from { transform: scale(.4); opacity: 0; } to { transform: scale(1); opacity: 1; } }

/* add-on op teams: in het mandje (aria-pressed en .is-in-mand zet tct-boeken.js). De teams-pagina zet
   html.tp.tp-teams .aknop op 13px (specificiteit 0,3,1), daarom staat hier html.tp.tp-teams voor (0,4,1).
   De tekst per taal loopt via custom properties op html, zodat er geen tweede specificiteitsladder nodig is. */
html { --tb-in-mand: "In je boeking"; --tb-uit-mand: "Verwijder"; }
html[lang|=en] { --tb-in-mand: "In your booking"; --tb-uit-mand: "Remove"; }
html[lang|=de] { --tb-in-mand: "In Ihrer Buchung"; --tb-uit-mand: "Entfernen"; }
html.tp.tp-teams .aknop.is-in-mand, html.tp.tp-teams .aknop[aria-pressed="true"], .aknop.is-in-mand {
  background: #024F29; border-color: #024F29; color: #F8F9E2; font-size: 0; letter-spacing: 0; gap: 0; }
html.tp.tp-teams .aknop.is-in-mand .avink, html.tp.tp-teams .aknop[aria-pressed="true"] .avink, .aknop.is-in-mand .avink {
  font-size: 13px; line-height: 12px; }
html.tp.tp-teams .aknop.is-in-mand::after, html.tp.tp-teams .aknop[aria-pressed="true"]::after, .aknop.is-in-mand::after {
  content: var(--tb-in-mand); margin-left: 8px; font-size: 13px; line-height: 16px; letter-spacing: 1px; }
html.tp.tp-teams[lang|=de] .aknop.is-in-mand::after, html.tp.tp-teams[lang|=de] .aknop[aria-pressed="true"]::after { letter-spacing: .5px; }
html.tp.tp-teams .aknop.is-in-mand:hover::after, html.tp.tp-teams .aknop[aria-pressed="true"]:hover::after, .aknop.is-in-mand:hover::after {
  content: var(--tb-uit-mand); }
html.tp.tp-teams .aknop.is-in-mand:hover, html.tp.tp-teams .aknop[aria-pressed="true"]:hover, .aknop.is-in-mand:hover {
  background: #4E3212; border-color: #4E3212; }
.aknop.is-in-mand:hover .avink::before, .aknop[aria-pressed="true"]:hover .avink::before { content: "\00D7"; }

/* Boek nu onder elk Team Trail-pakket: de bestaande .tp-knop, onderaan de kaart; maat en kleur komen uit de
   sitebrede knopnorm (tct-menubalk.css, VIVIMUS-C2G1), net als de andere knoppen op teams */
.tp-pakkettekst > .tct-pakket-knop { margin-top: auto; align-self: flex-start; }

@media (prefers-reduced-motion: reduce) { .tct-mand-teller { animation: none; } }