/*
 * De Craft-site begon met "<!DOCTYPE html lang="nl">". Door het extra attribuut
 * zet de browser die pagina's in quirks mode; React/Next schrijven altijd een
 * correcte <!DOCTYPE html> (standards mode). Het zichtbare verschil zit vooral in
 * de "blocks ignore line-height"-quirk: in quirks mode telt de regelhoogte van een
 * blok niet mee als het alleen inline-elementen bevat (iconen, sterren, knoppen).
 * Deze regels bootsen dat na op de plekken waar het verschil gaf.
 */

/* Blokken met alleen een svg/inline-elementen: regel = hoogte van de inhoud */
.reisgegevens-tabel .icon,
.rating:not(.reis-prijsPerPersoon):not(.reis-totaalprijs),
.tooltip-trigger,
footer a.social-icon,
.gegeven-row .title-wrapper,
.price-per-person,
.price-total,
.slick-dots {
  line-height: 0;
}

/* UA-stylesheet in quirks mode: form { margin-bottom: 1em } */
form {
  margin-bottom: 1em;
}

/* Alleen een <span style="font-size:.8rem"> in het blok */
footer .d-flex.flex-row > .col-auto {
  font-size: 0.8rem;
}

/* Geen ruimte onder inline-block formuliervelden/labels (zoals in quirks mode) */
.field .input textarea,
.field.optin .input label {
  vertical-align: top;
}

/* Een leeg inline-block telt in quirks mode niet mee voor de regelhoogte */
.reisgegevens-tabel .gegeven-row .title-wrapper > h5:empty {
  display: none !important;
}

/* /reservering-zijbalk: in quirks mode telt de lege regel na de prijs niet mee */
.sidebar.reis-informatie .reisgegevens-tabel .reisgegevens-tabel-wrapper .gegeven-row.prijsPerPersoon > span {
  display: block;
}

/* Deelknoppen naast "Reisbeschrijving": regelafstand zoals in quirks mode (mobiel loopt het door op 2 regels) */
.r-beschrijving h2 .ml-auto {
  line-height: 37px;
  margin-bottom: -4px;
  position: relative;
  top: 1px;
}