.review-form-section {
    padding: 2rem 13%;
    background: linear-gradient(
            to bottom,
            hsl(var(--base-grey-300)) 0%,
            hsl(var(--base-grey-300)) 94%,
            white 90%,
            white 100%
    );
}

.review-form input.form-input, .review-form select.form-input {
    border: 1px solid hsl(var(--base-grey-400));
    width: 100%;
}

.review-form {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    justify-items: stretch;
}

.review-form__consent {
    margin: 10px 0;
    grid-column-start: 1;
    grid-column-end: 4;
}


.review-form label {
    display: flex;
    flex-direction: column;
    font-size: 1rem;
    gap: 0.5rem;
    font-weight: bold;
}

.review-form__consent label {
    display: initial;
    font-weight: initial;
}

.review-form label:has(textarea) {
    grid-column-start: 1;
    grid-column-end: 4;
}

.review-form__submit-button-wrapper {
    display: flex;
    justify-content: center;
    margin-top: 3rem;
    grid-column-start: 1;
    grid-column-end: 4;
}

.review-grade__indicators {
    user-select: none;
    -webkit-user-select: none;
}

.review-grade__indicators span {
    cursor: pointer;
    color: hsl(var(--base-orange-400));
}
hr {
    margin-bottom: 2rem;
}

@media (max-width:1350px) {
    .review-form {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 2rem;
        justify-items: stretch;
    }

    .label-mail {
        grid-column: 1 / span 2;
    }
    .label-message {
        grid-column: 1 / span 2;
    }
    .review-grade {
        grid-column: 1 / span 2;
    }
}
@media (max-width:800px) {
    .review-form {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        gap: 1rem;
        justify-items: stretch;
    }
    .review-form label {
        grid-column: 1 / span 1;
    }
    .label-mail {
        grid-column: 1 / span 1;
    }
    .label-message {
        grid-column: 1 / span 1;
    }
    .review-grade {
        grid-column: 1 / span 1;
    }
}

/* ------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------- */
/* --------------------------------------- CAROUSEL ------------------------------------------ */
/* ------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------- */

.reviews-section{
    position: relative;
    /* width: 100%;
    margin: auto;
    height: 400px;
    display: flex;
    flex-direction: column;
    align-items: center; */
}

.card-avis  {
    margin: 0 10px; 
    display: flex;
    min-height: 230px !important;
    border-radius: 9px;
    background: linear-gradient( to bottom, hsl(var(--base-grey-300)) 0%, hsl(var(--base-grey-300)) 94%, white 90%, white 100% );
    padding: 15px;
}
.header-avis {
    padding: 5px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.avis-note {
    min-width: 140px;
}
.avis-author {
    color: hsl(var(--button-background-color));
    font-size: 15px;
    font-weight: 800;
}
.card__info__grade {
    color: hsl(var(--base-orange-500));
}
.avis-separator {
    margin: 5px 10px;
}
.avis-comment-section {
    padding: 5px;
}
.avis-comment {
    padding-left: 10px;
}
.bracket {
    color: hsl(var(--button-background-color));
}
.close-bracket {
    position: relative;
    right: -90%;
}

.slick-track {
    width: 15488px !important
}

.carousel-btn {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    margin: 2rem 41.8%;
    position: relative;
    right: -4px;
}

#see-all-review {
    padding: 15px;
    width: fit-content;
    min-width: 240px;
    background-color: hsl(var(--button-background-color));
    margin: 10px;
    color: white;
    border-radius: var(--button-border-radius);
    text-transform: uppercase;
    &:hover {
        outline: none;
        background: hsl(var(--button-hover-bakground-color));
    }
}

@media (max-width:950px) {
    .reviews-section {
        display: none !important;
    }
    .avis-masonry {
        display: grid !important;
        margin: 0 !important;
        justify-content: center !important;
    }
}

/* ----------------------------------------------------------------------------------------- */
/* ---------------------------------     MANSORY     --------------------------------------- */
/* ----------------------------------------------------------------------------------------- */
.hide-carousel {
    display: none;
}
.avis-masonry {
    height: 100%;
    display: grid;
    width: 100%;
    margin: 5%;
}
.grid-item {
    width: fit-content;
    height: fit-content;
}
.masonry-avis {
    margin: 5px 5px; 
    display: flex;
    flex-direction: column;
    width: 330px !important;
    border-radius: 9px;
    padding: 15px;
    background: linear-gradient( to bottom, hsl(var(--base-grey-300)) 0%, hsl(var(--base-grey-300)) 94%, white 90%, white 100% );
}
.header-masonry {
    padding: 5px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.masonry-author {
    color: hsl(var(--button-background-color));
    font-size: 15px;
    font-weight: 800;

    @media (max-width:800px) {
        width: 50%;
    }
}
.masonry-separator {
    margin: 5px 10px;
}
.masonry-comment-section {
    padding: 5px;
}
.masonry-comment {
    padding-left: 10px;
}

/* ---- grid ---- */

.grid {
    width: 100%;

    @media (max-width:800px) {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
}
  
/* clearfix */
.grid:after {
  content: '';
  display: block;
  clear: both;
}
  
/* ---- grid-item ---- */
  
.grid-sizer,
.grid-item {
  width: fit-content;
}

#hide-all-review {
    margin: 0 38% 2rem 38%;
    text-transform: uppercase;

    @media (max-width:800px) {
        margin: 1rem 3rem;

    }
}

/* --------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------- */
.thanks-section {
    padding: 2rem;
    font-size: 2rem;
    text-align: center;
}

.reviews-section-thank{
    margin: 2rem 13% 8rem;
    display: flex;
    justify-content: center;

    @media (max-width:800px) {
        margin: 2rem;
    }
}

.reviews-section__review-card-thank {
    padding: 8rem 2.5rem 2.5rem;
    box-shadow: 0 5px 20px hsl(var(--base-grey-600)/.08);
    border-radius: 0.625rem;
    display: flex;
    flex-direction: column;
    height: fit-content;
    position: relative;
    width: 650px;
}

.reviews-section__review-card-thank::before {
    content: '\f10d';
    font: var(--fa-font-solid);
    font-size: 6rem;
    color: hsl(var(--base-grey-500));
    position: absolute;
    top: 0;
    left: 2.5rem;
}

.reviews-section__review-card-thank .card__content {
    flex-grow: 1;
    font-size: 1.5rem;
    line-height: 1.875rem;
}

.reviews-section__review-card-thank .card__info {
    display: flex;
    justify-content: space-between;
    padding-top: 2rem;
    margin-top: 2rem;
    border-top: 1px solid hsl(var(--base-grey-500));
    align-items: center;
    font-size: 1.125rem;
}

.reviews-section__review-card-thank .card__info__grade {
    color: hsl(var(--base-orange-500));
}
