:root,
[data-bs-theme=light] {
    --bs-primary: #123e52; /* changed */
    --bs-secondary: #82aabc; /* changed */
    --bs-success: #198754;
    --bs-info: #0dcaf0;
    --bs-warning: #b39153;/* changed */
    --bs-danger: #671414; /* changed */
    --bs-light: #f8f9fa;
    --bs-dark: #212529;
    --bs-primary-rgb: 18, 62, 82; /* changed */
    --bs-secondary-rgb: 130, 170, 188; /* changed */
    --bs-success-rgb: 25, 135, 84;
    --bs-info-rgb: 13, 202, 240;
    --bs-warning-rgb: 179, 145, 83;/* changed */
    --bs-danger-rgb: 220, 53, 69;
    --bs-light-rgb: 248, 249, 250;
    --bs-dark-rgb: 33, 37, 41;
    --bs-primary-text-emphasis: #123e52;
    --bs-secondary-text-emphasis: #2b2f32;
    --bs-success-text-emphasis: #0a3622;
    --bs-info-text-emphasis: #055160;
    --bs-warning-text-emphasis: #664d03;
    --bs-danger-text-emphasis: #58151c;
    --bs-light-text-emphasis: #9fa3af; /* changed */
    --bs-dark-text-emphasis: #9fa3af; /* changed */
    --bs-primary-bg-subtle: #cfe2ff;
    --bs-secondary-bg-subtle: #e2e3e5;
    --bs-success-bg-subtle: #d1e7dd;
    --bs-info-bg-subtle: #cff4fc;
    --bs-warning-bg-subtle: #fff3cd;
    --bs-danger-bg-subtle: #f8d7da;
    --bs-light-bg-subtle: #fcfcfd;
    --bs-dark-bg-subtle: #ced4da;
    --bs-primary-border-subtle: #9ec5fe;
    --bs-secondary-border-subtle: #c4c8cb;
    --bs-success-border-subtle: #a3cfbb;
    --bs-info-border-subtle: #9eeaf9;
    --bs-warning-border-subtle: #ffe69c;
    --bs-danger-border-subtle: #f1aeb5;
    --bs-light-border-subtle: #e9ecef;
    --bs-dark-border-subtle: #adb5bd;
    --bs-white-rgb: 255, 255, 255;
    --bs-black-rgb: 0, 0, 0;
    --bs-font-sans-serif: "Raleway",system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";  /* changed */
    --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.5;
    --bs-body-color: #212529;
    --bs-body-color-rgb: 33, 37, 41;
    --bs-body-bg: #fff;
    --bs-body-bg-rgb: 255, 255, 255;
    --bs-emphasis-color: #000;
    --bs-emphasis-color-rgb: 0, 0, 0;
    --bs-secondary-color: rgba(33, 37, 41, 0.75);
    --bs-secondary-color-rgb: 33, 37, 41;
    --bs-secondary-bg: #e9ecef;
    --bs-secondary-bg-rgb: 233, 236, 239;
    --bs-tertiary-color: rgba(33, 37, 41, 0.5);
    --bs-tertiary-color-rgb: 33, 37, 41;
    --bs-tertiary-bg: #f8f9fa;
    --bs-tertiary-bg-rgb: 248, 249, 250;
    --bs-heading-color: inherit;
    --bs-link-color: #0d6efd;
    --bs-link-color-rgb: 13, 110, 253;
    --bs-link-decoration: underline;
    --bs-link-hover-color: #0a58ca;
    --bs-link-hover-color-rgb: 10, 88, 202;
    --bs-code-color: #d63384;
    --bs-highlight-color: #212529;
    --bs-highlight-bg: #fff3cd;
    --bs-border-width: 1px;
    --bs-border-style: solid;
    --bs-border-color: #dee2e6;
    --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
    --bs-border-radius: 0.375rem;
    --bs-border-radius-sm: 0.25rem;
    --bs-border-radius-lg: 0.5rem;
    --bs-border-radius-xl: 1rem;
    --bs-border-radius-xxl: 2rem;
    --bs-border-radius-2xl: var(--bs-border-radius-xxl);
    --bs-border-radius-pill: 50rem;
    --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
    --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
    --bs-focus-ring-width: 0.25rem;
    --bs-focus-ring-opacity: 0.25;
    --bs-focus-ring-color: rgba(13, 110, 253, 0.25);
    --bs-form-valid-color: #198754;
    --bs-form-valid-border-color: #198754;
    --bs-form-invalid-color: #dc3545;
    --bs-form-invalid-border-color: #dc3545;
}
.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.navbar-toggler {
    color: rgba(255, 255, 255, 0.75) !important;
    border: var(--bs-border-width) solid rgba(255, 255, 255, 0.3);
}
.navbar {
    background-color: var(--bs-primary);
    box-shadow: 0px 14px 15px 0px rgb(0 0 0 / 25%);

}
.navbar-nav .dropdown-menu {
    position: absolute;
}
navbar-nav-scroll {
    --bs-scroll-height: 100px;
}
.navbar-nav .nav-link {
    position: relative;
    transition: color 0.5s ease-in-out;
}

#navbarNav .nav-link:hover::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3px; /* Épaisseur du trait */
    background-color: white; /* Couleur du trait */
    transition: width 0.5s ease-in-out;
}

.splide__slide {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

.splide__slide img {
    max-width: 100%;  /* L'image ne doit jamais dépasser la largeur du container */
    max-height: 100%; /* L'image ne doit jamais dépasser la hauteur du container */
    object-fit: contain; /* Conserve le ratio de l'image sans la déformer */
    object-position: center; /* Centre l'image dans le container */
    border-radius: var(--bs-border-radius) !important;

}

.splide__track {
    border-radius: var(--bs-border-radius) !important;
}

/* Style du carousel de thumbnails en mode vertical */
#thumbnail-carousel {
    width: 100px; /* Ajuste selon ton besoin */
    height: 400px; /* Ajuste selon ton besoin */
}

#thumbnail-carousel .splide__track {
    display: flex;
    flex-direction: column;
    height: 100%;
}

#thumbnail-carousel .splide__list {
    flex-direction: column;
}

#thumbnail-carousel .splide__slide {
    width: 80px; /* Taille fixe des thumbnails */
    height: 80px; /* Taille fixe des thumbnails */
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0.6;
}

.splide__track--nav>.splide__list>.splide__slide.is-active {
    border : 2px solid var(--bs-primary);
}

#main_img_perso {
    width: 100%;
    height: 400px;
}

body {
    margin-top:58px;
    color : var(--bs-primary);
}

.star {
    color: gold;
    font-size: 1.2em;
}

.rental-title {
    position: absolute;
    top: -50px;
    background: white;
}

.datepicker {
    font-family: Arial, sans-serif !important; /* Choisissez une police neutre */
}

.rental-infos{
    margin-top: 20px
}

.rental-infos .liste-infos {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-left: -10px;
    margin-right: -10px
}

.rental-infos .liste-infos li {
    border-bottom: 1px solid #e3e3e3;
    border-top: 1px solid #e3e3e3;
    font-size: 12px;
    letter-spacing: .36px;
    line-height: 14px;
    margin: -1px 10px 0;
    min-height: 40px;
    padding: 10px 0;
    position: relative;
    text-align: center;
    width: calc(50% - 20px);
    list-style: none;
}

.rental-infos .liste-infos li .list-infos-content {
    display: block
}
.rental-infos .liste-infos li .list-infos-title {
    font-family : "Butler", sans-serif;
    color : var(--bs-primary);
    font-weight: bold;
    font-size : 1.1em;
}

@media screen and (min-width: 768px) {

    .rental-infos .liste-infos {
        margin-left: 0;
        margin-right: 0;
        padding-left: 0;
    }

    .rental-infos .liste-infos li {
        border: 1px solid var(--bs-primary);
        border-bottom: none;
        border-top: none;
        margin: 5px 0 5px -1px;
        padding-left: 15px;
        padding-right: 15px;
        white-space: nowrap;
        width: auto!important;
        list-style: none;
    }
}

.progresses{
    display: flex;
    align-items: center;
}

.line{

    width: 120px;
    height: 6px;
    background: var(--bs-secondary);
}

.steps{

    display: flex;
    background-color: var(--bs-secondary);
    color: #fff;
    font-size: 14px;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;

}

.text-small-primary{
    color: var(--bs-primary);
    font-size: 11px;
    font-weight: 400;
    font-style: italic;
}

.text-small-secondary{
        color: var(--bs-secondary);
        font-size: 11px;
        font-weight: 400;
        font-style: italic;
}

.text-small-grey{
    color: var(--bs-light-text-emphasis);
    font-size: 11px;
    font-weight: 400;
    font-style: italic;
}

.text-small-danger{
    color: var(--bs-danger);
    font-size: 11px;
    font-weight: 400;
    font-style: italic;
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--bs-secondary);
    --bs-btn-border-color: var(--bs-secondary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-primary);
    --bs-btn-active-border-color: var(--bs-primary);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--bs-light-text-emphasis);
    --bs-btn-disabled-border-color: var(--bs-light-text-emphasis);
}

.lightbox .lb-image {
    border-radius: var(--bs-border-radius) !important;
}

.form-check-input:checked {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}

.form-check-input:focus {
    border-color: var(--bs-secondary);
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(130, 170, 188, 0.50);
}

.form-select:focus {
    border-color: var(--bs-secondary);
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(130, 170, 188, 0.50);
}

.img-reservation {
    padding: .25rem;
    background-color: var(--bs-body-bg);
    border-radius: 10px;
    max-width: 75%;
    height: auto;
    box-shadow: 5px 5px 15px rgba(0,0,0,0.2);
}

.price, .price-total, .price-deposit, .advantage-price{
    text-align: right;
    padding-right: 5px;
}

.btn-grey, .btn.active {
    color: var(--bs-body-bg);
    background-color: var(--bs-light-text-emphasis);
    border-color: var(--bs-light-text-emphasis);
}


/*SWEETALERT*/
.swal2-confirm {
    background-color: var(--bs-secondary);
    border-color: var(--bs-secondary);
    color: white !important;
}
.swal2-confirm:hover {
    background-color: var(--bs-primary);
}
.swal2-cancel {
    background-color: #9fa3af !important;
    color: white !important;
}
.swal2-cancel:hover {
    background-color: #5b6571 !important;
}
.swal2-warning {
    border-color: #b39153 !important;
    color: #b39153 !important;
}
.swal2-success {
    border-color: var(--bs-primary);
}
.swal2-success-ring {
    border: .25em solid rgba(18, 62, 82, .3) !important;
}
.swal2-success-line-tip,
.swal2-success-line-long {
    background-color: var(--bs-secondary);
}
.swal2-confirm:focus-visible {
     box-shadow:0 0 0 0px ;
}
.swal2-title {
    color: var(--bs-primary);
    font-family: 'Butler', sans-serif;
    font-size: 20px;
}

button#togglePassword {
    height: calc(3.5rem + calc(var(--bs-border-width)* 2));
    min-height: calc(3.5rem + calc(var(--bs-border-width)* 2));
    line-height: 1.25;
}

.min-height-page{
    min-height: 85vh;
}

/* Cacher les flèches des inputs type="number" avec la class="input-no-arrow"

/* Pour Chrome, Safari, Edge, Opera */
.input-no-arrow::-webkit-inner-spin-button,
.input-no-arrow::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Pour Firefox */
.input-no-arrow {
    -moz-appearance: textfield;
}

.datepicker td,th{
    text-align: center;
    padding: 6px 10px;
    font-size: 14px;
}

.page-perso img {
    margin: 5px;
    border-radius: 5px;
}