@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0-3/css/all.min.css');


@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Coming+Soon&display=swap');

@import '../../assets-commun/css/bootstrap3-modal.css';
@import '../../assets-commun/css/bs3-to-bs5-colors.css';
@import'../../assets-commun/css/login-block.css';


:root {

  --color-site-1: #f1591f;
  --color-site-2: #36619B;
  --color-site-3: #00a4e3;
  --font: 'Open Sans', sans-serif !important;
  --border-radius: 6px;
  --color-border: #c7dbdb;
  --text-color: #535672;
  --container-max-width:1420px;
}
.container {
position: relative;
  max-width: var(--container-max-width) !important;
  width: 100%;
  margin: 0px auto;

  padding: 0px 20px;
}

.border-color-site-2 {
  border: 1px solid var(--color-site-2) !important
}

/* Contenu personnalisé pour l'icône et le texte */
.suggestion-content {
  display: flex;
  align-items: center;
}

.icon-hotel,
.icon-vol {
  font-size: 1.5em;
  color: var(--color-site-1);
  /* Orange de l'icône */
  margin-right: 14px;
}

.hotel-info strong {
  display: block;
  font-weight: bold;
}

.vol-info .strong-info {
  font-weight: 500;
  display: block;

}

.hotel-info span {
  display: block;
  font-size: 14px;
  color: #666;
}

.typeahead__list>li {
  position: relative;
  border-top: solid 1px transparent;
}

/* 1. Sécurité : Force le conteneur du carrousel à servir de repère spatial */
.owl-carousel {
  position: relative;
}


/**owl carousel**/
.owl-carousel .owl-dots.disabled,
.owl-carousel .owl-nav.disabled {
    display: block;
}


.owl-theme .owl-nav [class*="owl-"] {
    background: #D6D6D6;
    background: #fff;
    border: 1px solid #6888B1;
}

.owl-prev {
    color: #36619B !important;
}

.owl-prev:hover {
    color: #fff !important;
    background: #36619B !important;
}

.owl-next {
    background-color: #36619B !important;
}

.owl-next:hover {
    color: #36619B !important;
    background-color: #fff !important;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}

/* Pour Firefox */
input[type="number"] {
  -moz-appearance: textfield !important;
  appearance: textfield !important;
}




/* --- Bouton Principal --- */
.btn.btn-primary {
  background-color: var(--color-site-2);
  transition: background-color 0.3s ease; /* Pour un effet fluide */
}

.btn.btn-primary:hover {
  /* Option 1 : Utiliser un filtre pour assombrir automatiquement */
  filter: brightness(0.9); 
  
  /* Option 2 : Si vous préférez une autre couleur fixe, remplacez par :
  background-color: var(--color-site-2-dark); */
}


/* --- Bouton Secondaire --- */
.btn.btn-secondary {
  background-color: var(--color-site-1);
  color: #fff;
  transition: background-color 0.3s ease, color 0.3s ease;
}

.btn.btn-secondary:hover {
  filter: brightness(0.9);
  
  /* Astuce classique pour un bouton secondaire : inverser les couleurs au survol */
  /* background-color: transparent;
     color: var(--color-site-1);
     border-color: var(--color-site-1); */
}

.btn-info {

background: var(--color-site-3);
}
.typeahead__container.destination .form-control{
  font-size: 16px;
}
/* Applique uniquement la mise en valeur sur les bordures de l'input au repos et au focus */

.typeahead__container.destination .form-control.typeahead_destination:not(.typeahead__hint) {
    border: 2px solid var(--color-border) !important;
    transition: border-color 0.25s ease-in-out, box-shadow 0.25s ease-in-out !important;
}

.typeahead__container.destination .form-control.typeahead_destination:not(.typeahead__hint):focus {
    border-color: var(--color-site-3) !important; /* Changement vers le bleu clair accent */
    box-shadow: 0 0 0 3px rgba(0, 164, 227, 0.15) !important;
    outline: none !important;
}

/* Déclaration de la police Bootstrap Icons sur les éléments existants */
.suggestion-content .fa-map-marker-alt::before,
.suggestion-content .fa-hotel::before {
    font-family: "bootstrap-icons" !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    vertical-align: -.125em;
    -webkit-font-smoothing: antialiased;
}

/* Remplacement par l'icône de géolocalisation Bootstrap (\f3e8 = geo-alt-fill) */
.suggestion-content .fa-map-marker-alt::before {
    content: "\f3e8" !important; 
}

/* Remplacement par l'icône d'immeuble/hôtel Bootstrap (\f1f8 = building) */
.suggestion-content .fa-hotel::before {
   content: "\f1dd" !important;
}