::selection {
	background: var(--color-site-1);
	color: #FFF;
	text-shadow: none;
}

* {
	outline: none;
}

p:last-child {
	margin-bottom: 0;
}

.details {
	margin-top: 30px
}

.details .avatar {
	position: relative;

	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 4px;
	color: #FFF;
	font-weight: 500;
}

.details .avatar img {
	width: 100%;
	height: 100%;
	border-radius: 4px;
	object-fit: cover;
}

.details .avatar.avatar-sm {
	width: 24px;
	height: 24px;

	font-size: 10px;
}

.details .avatar.avatar-sm i {
	font-size: 14px;
}

.details .avatar.avatar-md {
	width: 32px;
	height: 32px;

	font-size: 12px;
}


.description-hotel-details {
	height: 350px;
	overflow-y: hidden;

}

.description-hotel-details:hover {
    overflow-y: auto; 
}

.description-hotel-details::-webkit-scrollbar-thumb {
    background-color: transparent;
    border-radius: 10px;
}


.description-hotel-details:hover::-webkit-scrollbar-thumb {
    background-color: #bcbcbc; 
}


.description-hotel-details::-webkit-scrollbar {
    width: 6px;
}



.border-bottom {
	border: 1px solid #0088CC33
}

.rounded {
	border-radius: 4px !important;
}

.rounded-6 {
	border-radius: 6px !important;
}

.details .details-info {
	margin-bottom: 10px;
}

.details .contenu .text {
	max-height: 150px;
	/* hauteur visible avant expansion */
	overflow: hidden;
	position: relative;
	transition: max-height 0.5s ease;
}

/* Le dégradé blanc au bas du texte */
.details .contenu .text::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 3em;
	/* hauteur du fondu */
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0), white 90%);
	pointer-events: none;
}

/* L’input caché qui gère l’état */
.details #read-more-toggle {
	display: none;
}

/* Quand le toggle est coché, on affiche tout le texte */
.details .contenu #read-more-toggle:checked~.text {
	max-height: 100%;
	/* assez grand pour tout montrer */
}

.details .contenu #read-more-toggle:checked~.text::after {
	display: none;
	/* on cache le dégradé */
}

/* Le bouton “Lire plus / Lire moins” */
.details label.badge-label {
	display: inline-block;
	margin-top: 8px;
	color: var(--color-site-1);
	cursor: pointer;
	font-weight: 600;
	font-size: 16px;
	text-decoration: text-underline;
}

/******/


.gallery-main {
	position: relative;
}

.gallery-main img {
	width: 100%;

	border-radius: 6px;
	height: 100%;
	object-fit: cover;
		aspect-ratio: 4/3
}



.gallery-main img:hover {
	opacity: 0.8;
	transform: scale(1.02);
}

.badge.position-overlay {
	position: absolute;
	top: 15px;
	left: 15px;




	z-index: 10;
}

.btn-voir-offre {
	position: absolute;
	top: 15px;
	right: 15px;
	z-index: 10;
}

.btn-all-photos {
	position: absolute;
	bottom: 15px;
	right: 25px;

	background: rgba(255, 255, 255, 0.9);
	border: none;
	padding: 10px 20px;
	border-radius: 4px;
	font-weight: 500;
}


.btn-color-primary.text-white.search-button {
	height: 80px;
	border-radius: 12px;
	font-size: 18px;

}


.property-card .card-title {

	font-weight: 700;

	font-size: 24px;


	color: #0E0E0F;
}

.symbole>img {
	width: auto;
	height: 20px;
}




.equipment-item {
	display: flex;
	/* Aligne l'icône et le texte */
	align-items: center;
	/* Centre verticalement */
	margin-bottom: 1.5rem;
	/* Espace entre les lignes */
}


.icon-circle {
	width: 40px;
	/* Taille du cercle */
	height: 40px;
	background-color: #FF57221A;
	border-radius: 50%;
	/* Rend la forme ronde */
	display: flex;
	justify-content: center;
	align-items: center;
	margin-right: 15px;
	/* Espace entre le cercle et le texte */
	flex-shrink: 0;
	/* Empêche le cercle de rétrécir */
}


.icon-circle img {
	width: 25px;
	filter: brightness(0) saturate(100%) invert(49%) sepia(98%) saturate(3015%) hue-rotate(345deg) brightness(101%) contrast(102%);
}

.icon-circle svg path {
	fill: var(--color-site-1) !important
}

.equipment-text {
	font-size: 1.1rem;
}



.equipment-titre {

	font-weight: 500;

	font-size: 18px;

	margin-bottom: 20px;
}

#options li.option-list-item {
	color: #636C7D;

	font-weight: 400;

	font-size: 16px;


}

/* 1. Assurez-vous d'abord que la liste n'a PAS de style de puce par défaut */
.option-list {
	list-style: none;
	/* Important pour désactiver les puces natives */
	padding-left: 0;
	/* Annule le padding par défaut de <ul> */
}

/* 2. Style de chaque élément de la liste */
.option-list-item {
	position: relative;

	/* Espace de gauche pour la puce. Ajustez cette valeur si nécessaire. */
	padding-left: 1.5rem;

	/* Assurez-vous que la couleur du texte est la couleur souhaitée (ex: blanc) */
	color: #fff;
}

/* 3. Ajout de la puce (point noir) avec ::before */
.option-list-item::before {
	content: "\2022";
	/* Code Unicode pour un point noir (puce) */

	/* Positionnement absolu pour le placer précisément */
	position: absolute;
	left: 0;
	/* Aligne la puce à gauche de la zone de padding-left */
	top: 0;
	/* Pour l'alignement vertical */

	/* Définir la couleur de la puce (ici, elle sera la même que le texte, soit blanc) */
	color: inherit;

	/* Rendre la puce plus visible ou en gras */
	font-size: 14px;
	line-height: inherit;
}

.card.hr .hotel-title {

	font-weight: 600;

	font-size: 18px;




	color: #0E0E0F;
}

.h-300 {
	height: 300px;
	object-fit: cover;
	width: 100%;
}

.TravelD.VO .description-courte {

	font-weight: 300;

	font-size: 16px;

	text-align: center;

	color: #636C7D;
}



.flight-info-col {
	flex: 0 0 70px;
	/* Taille fixe pour le logo */
	padding-right: 0 !important;
}

.airline-logo-img {
	width: 40px;
	/* Taille ajustée pour le logo */
	height: auto;
}


.departure-col,
.return-col {
	flex: 0 0 15%;
	/* Allouer de l'espace pour les détails */
	padding: 0 5px;
}

.flight-details-inner {
	text-align: left;
}

.jour {
	/* La date (ex: 06-01-2026) */

	font-weight: 600;


	font-size: 16px;
	color: #000;
}


/* --- 3. Icône de Transition --- */
.arrow-col {
	flex: 0 0 50px;
	/* Espace pour la flèche */
}



.hotel-duration-col {
	flex-grow: 1;
	/* Prend l'espace restant */
	padding-left: 15px !important;
	border-left: 1px solid #dee2ee;
	/* Séparateur visuel */
}

.hotel-list {
	list-style: none;
	padding: 0;
	margin-bottom: 5px;
}

.list-name-hotel {
	text-align: left !important;

	color: #495057;
	margin-bottom: 2px;
	display: flex;
	align-items: center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.ville-omra {
	font-weight: 500;
	color: #343a40;
	padding-right: 5px;
}

.ratings-star .fa-star {
	color: gold;

	margin-left: 2px;
}


.font-text-muted {
	color: #636C7D;
	font-size: 14px
}


/* --- Responsivité (Gestion des colonnes en mode mobile) --- */
@media(max-width: 992px) {
	.pack-omra.row {
		flex-wrap: wrap;
		/* Permet aux colonnes de sauter à la ligne */
	}

	/* Réorganise les éléments en mode colonne */
	.flight-info-col,
	.departure-col,
	.arrow-col,
	.return-col,
	.hotel-duration-col,
	.price-action-col {
		flex: 0 0 100%;
		padding: 5px 0 !important;
		border-left: none !important;
	}

	/* Regrouper les vols en une seule ligne */
	.departure-col,
	.return-col {
		flex: 0 0 45%;
	}

	.arrow-col {
		flex: 0 0 10%;
	}

	/* Afficher le prix et le bouton côte à côte en bas */
	.price-action-col {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding-top: 10px !important;
		border-top: 1px dashed #e9ecef;
	}

	.btn-resv {
		width: auto !important;
	}
}

.timeline {
	position: relative;

	margin: 40px auto;
}

.timeline::before {
	content: '';
	position: absolute;
	width: 1px;
	background-color: #C7DBEB;
	top: 8px;
	bottom: 0;
	left: 22px;
}

.timeline-item {
	position: relative;
	margin: 50px 0;
	padding-left: 70px;
}

.timeline-icon {
	position: absolute;
	left: 0;
	top: 0;
	width: 40px;
	height: 40px;
	background-color: #ff5722;
	/* Orange */
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-size: 20px;
	font-weight: bold;
}

.timeline-content {
	background-color: #eee;
	padding: 20px;
	border-radius: 8px;
	box-shadow: 0 2px 5px rgba(153, 145, 145, 0.5);
}

.timeline .accordion-header {

	color: #0E0E0F;

	font-weight: 600;

	font-size: 20px;


	border-bottom: 1px solid #C7DBEB
}
.timeline .accordion-body * {
    font-size: 16px !important;
}
.separator {
	height: 1px;
	background-color: #77DBEB;
	margin: 30px 0;
}

.pack-label {

	font-weight: 600;

	font-size: 20px;




	color: #0E0E0F;

}

.avn-price-table.avn-style15>.avn-tables>.avn-table>.header {

	background: var(--color-site-1);
}

.avn-price-table.avn-style15>.avn-tables>.avn-table>.avn-btn-main>.avn-btn {

	background: var(--color-site-1);
}

.avn-price-table.avn-style15>.avn-items1>ul>li:nth-of-type(2n),
.avn-price-table.avn-style15>.avn-tables>.avn-table>.avn-items2>ul>li:nth-of-type(2n) {

	background: #0088CC21;
}

.avn-price-table.avn-style15>.avn-items1>ul>li:nth-of-type(2n) {
	border: 1px solid #C7DBEB;
}

.avn-price-table.avn-style15>.avn-tables>.avn-table>.header {

	height: auto !important;
	padding: 10px 0;
}

.right-sidebar .card .card-title {


	font-weight: 600;

	font-size: 22px;


	color: #000000;



}

/* --- Groupe de Couleur 1 (Items 1, 4, 7, 10, ...) --- */
.right-sidebar .card:nth-of-type(even) {


	background: #0088CC21;


	color: #636C7D;
}

/* --- Groupe de Couleur 2 (Items 2, 5, 8, 11, ...) --- */
.right-sidebar .card:nth-of-type(odd) {
	/* n=0 donne l'item 2 */
	/* n=1 donne l'item 5 */

	background-color: #FFF9F5;
	/* Vert clair */
	color: #636C7D;
}




.description-omra-details,
.description-omra-details>* {

	font-weight: 400;

	font-size: 16px;

	color: #636C7D;
}


.card.travel-card {
	background: #F7F8F9 !important;
	border-radius: 6px
}



/* Style du sélecteur de date */
.date-selector {
	border: 1px solid #d1d9e6;
	border-radius: 8px;
	padding: 12px 16px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	color: #5f6d7e;
	font-size: 16px;
	cursor: pointer;
	margin-bottom: 10px;
}

.date-selector:hover {
	border-color: #a0aec0;
}

/* Infos de vol */
.flight-info {
	display: flex;
	align-items: center;
	gap: 3px
}

.airline-logo img {
	width: 40px;
	height: auto;
}

.airport-code {
	color: #5f6d7e;
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 4px;
}

.flight-time {
	color: #5f6d7e;
	font-size: 16px;
	font-weight: 600;
}

.exchange-icon {

	color: #000;
}

.text-end-custom {
	text-align: right;
}

/* Conteneur principal du slider */
.property-widget-slider {
    position: relative;
 
  
}
.property-widget-slider  .owl-controls {
  display: flex;
justify-content: end;

}
/* Style des images pour qu'elles couvrent bien l'espace */
.property-widget-slider .card-img img {
    width: 100%;
    height: 250px;
    display: block;
    object-fit: cover;
	border-radius:6px
}

/* --- NAVIGATION (Flèches) --- */

/* Positionnement global des flèches */
.property-widget-slider .owl-nav {
    position: absolute !important;
    bottom: 40px;
    width: 140px;
   
    pointer-events: none; /* Permet de cliquer sur l'image si on n'est pas sur une flèche */
}

/* Style commun pour Précédent et Suivant */
.property-widget-slider .owl-nav .owl-prev,
.property-widget-slider .owl-nav .owl-next {
    position: absolute !important;
    width: 40px !important;
    height: 40px !important;
    background-color: rgba(0, 0, 0, 0.4) !important; /* Fond noir semi-transparent comme sur l'image */
    color: #fff !important;
    border-radius: 50% !important; 
    display: flex !important;
    align-items: center !important;
    justify-content: center;
    font-size: 24px !important;
    transition: background-color 0.3s ease;
    pointer-events: auto; /* Réactive le clic */
}



/* Effet au survol */
.property-widget-slider .owl-nav .owl-prev:hover,
.property-widget-slider .owl-nav .owl-next:hover {
    background-color: rgba(0, 0, 0, 0.7) !important;
}

/* --- PAGINATION (Points en bas) --- */

.property-widget-slider .owl-dots {
    position: absolute	!important;
    bottom: 15px;
    width: 100%;
    text-align: center;
	display: none !important;
}

.property-widget-slider .owl-dot span {
    width: 10px;
    height: 10px;
    margin: 5px;
    background: rgba(255, 255, 255, 0.5) !important;
    display: block;
    border-radius: 50% !important;
    transition: background 0.3s ease;
}



/* On s'assure que le parent est la référence pour l'icône */
.cnt-fl .form-group {
    position: relative;
    /* Sur desktop, si le select est w-auto, le groupe doit l'être aussi */
    display: block; 
	width: 100%;
}

@media (min-width: 768px) {
   .cnt-fl .form-group {
        display: inline-block; /* Permet à l'icône de coller au select en w-auto */
        vertical-align: bottom;
    }
}

/* Style du select pour cacher la flèche système */
.cnt-fl #sel1 {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding-right: 35px !important; /* Espace pour l'icône */
    position: relative;
    background-color: #fff;
	border: 1px solid #0088CC33 !important;
	border-radius:4px
}

/* L'icône FontAwesome placée via le parent .form-group */
.cnt-fl .form-group-sel::after {
    font-family: "Font Awesome 6 Free";
    content: "\f078"; /* Chevron down */
    font-weight: 900;
    
    position: absolute;
    right: 12px;
    /* Ajustement vertical : on descend l'icône pour l'aligner au centre du select (sous le label) */
    bottom: 10px; 
    
    color: #6c757d;
    font-size: 14px;
    pointer-events: none; /* Le clic traverse l'icône */
    z-index: 5;
}