﻿
.wrap-flexbox-confirm-booking {
    display: flex;
    height: 100vh;
    align-self: stretch;
}

.wrap-bloc-confirm-booking {
    display: flex;
    width: 100%;
    align-self: stretch;
}

.bloc-confirm-booking {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    flex: 1 0 0;
}

.confirm-booking-img {
    display : flex;
    width: 100%;
}

.confirm-booking-img img {
    height: 200px;
    width: 100%;
    border-radius: 10px;
    object-fit: cover;
}

.confirm-resume-booking {
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: 20px;
}

.resume-confirm-booking {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.resume-confirm-booking span {
    color: var(--Colors-BE-NOIR, #000);
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.confirm-booking-title {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.confirm-booking-title h1 {
   color: var(--Colors-BE-NOIR, #000);
    font-family: Inter;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.confirm-booking-title p {
   color: var(--Colors-BE-NOIR, #000);
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.confirm-booking-title p strong {
    font-weight: 600;
}

.confirm-booking-infos-resa {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    align-self: stretch;
}

.confirm-booking-infos-resa-numResa {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}

.confirm-booking-infos-resa-numResa span {
   color: var(--Colors-BE-NOIR, #000);
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.confirm-booking-infos-resa-numResa strong {
    color: var(--color-black);
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.confirm-booking-infos-resa-addToCalendar, .confirm-booking-infos-resa-seeVoucher {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}

.confirm-booking-infos-resa-addToCalendar p, .confirm-booking-infos-resa-seeVoucher p {
   color: var(--Colors-BE-NOIR, #000);
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.confirm-booking-infos-resa-addToCalendar a, .confirm-booking-infos-resa-seeVoucher a {
    color: var(--HEB-BOUTON, #3951AC);
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
}

.confirm-booking-infos-resa-addToCalendar a span, .confirm-booking-infos-resa-seeVoucher a span {
    color: var(--MAIN-COLOR);
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.confirm-booking-infos-resa-wallet {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}

.confirm-booking-infos-resa-wallet span {
    color: var(--BASIC-GRIS-2, #A8A8A8);
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.confirm-booking-infos-resa-wallet a img {
    width: 20px;
    height: 15.017px;
    object-fit: cover;
}

.confirm-booking-seeYouSoon {

}

.confirm-booking-seeYouSoon span {
   color: var(--Colors-BE-NOIR, #000);
    font-family: Inter;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}