/* ===== intl-tel-input + modal ===== */

/* deixa o modal como a DaisyUI quer, mas garante que nada corta o dropdown */
#bookingConfirmModal.modal { 
  overflow: visible;
}

/* backdrop do dialog */
#bookingConfirmModal::backdrop{
  background: rgba(0,0,0,.45);
}

/* intl-tel-input ocupa a largura toda */
.iti { 
  width: 100%;
}

/* dropdown sempre por cima */
.iti__dropdown-content{
  z-index: 2147483647 !important;
}
/* Modal: permitir scroll vertical sem cortar dropdown */
#bookingConfirmModal .modal-box{
  position: relative;
  z-index: 1000;

  max-height: 85vh;
  overflow-y: auto;    /* scroll vertical */
  overflow-x: visible; /* não corta dropdown */
  padding-bottom: 1.25rem;
}


/* Texto do resumo: quebrar linhas/palavras sempre que necessário */
#bookingConfirmModal #modal-summary{
  white-space: pre-line;
  overflow-wrap: anywhere; /* ✅ quebra palavras grandes */
  word-break: break-word;
}
/* ===== Extra info (Before you book) - evitar overlap em ecrãs estreitos ===== */
#exp-extra-info .label{
  display: flex;
  gap: .75rem;
  align-items: flex-start;   /* ✅ texto pode crescer para baixo */
  white-space: normal;       /* ✅ permite quebra de linha */
}

#exp-extra-info .label-text{
  flex: 1 1 auto;            /* ✅ ocupa o espaço disponível */
  min-width: 0;              /* ✅ permite wrap real em flex */
  white-space: normal;
  overflow-wrap: anywhere;   /* ✅ quebra palavras grandes */
  line-height: 1.35;
}

#exp-extra-info input.checkbox{
  flex: 0 0 auto;            /* ✅ não encolhe */
  margin-top: .15rem;
}

/* Em mobile, empilha (texto em cima, checkbox em baixo) para nunca sobrepor */
@media (max-width: 520px){
  #exp-extra-info .label{
    flex-direction: column;
    align-items: flex-start;
  }

  #exp-extra-info input.checkbox{
    margin-top: .25rem;
  }
}