/* 1. STRUCTURE ET CONTENEUR ELEMENTOR */
.gb-main-container {
    container-type: inline-size;
    container-name: review-block;
    width: 100%;
    margin: 20px 0;
}

.gb-wrapper {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 12px;
    padding: 25px;
    gap: 25px;
}

/* 2. BLOC RÉSUMÉ (GAUCHE) */
.gb-summary {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding-bottom: 20px;
    border-bottom: 1px solid #f5f5f5;
}

.gb-store-title a {
    text-decoration: none;
    color: inherit;
}

.gb-main-stars { 
    color: #ffb400; /* Tes étoiles jaunes */
    font-size: 1.4em; 
}

.gb-total-text { 
    font-size: 0.9em; 
}

/* 3. LE SLIDER (ESPACE POUR LES FLÈCHES) */
.gb-slider { 
    flex: 1;
    width: 100%;
    min-width: 0;
    position: relative;
    padding: 0px 15px 45px 15px !important; /* Espace pour flèches et dots */
}

/* HAUTEUR ÉGALE DES CARTES */
.gb-slider .swiper-slide {
    height: auto !important; 
    display: flex !important; 
}

.gb-card {
    background: #E7E3D820; /* Ton fond beige/rosé */
    border: 1px solid #E7E3D8;
    border-radius: 12px;
    padding: 20px;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.gb-card-inner { flex-grow: 1; }

.gb-card-header { 
    display: flex; 
    align-items: center; 
    margin-bottom: 12px; 
    position: relative; 
}

.gb-avatar { 
    width: 40px; 
    height: 40px; 
    border-radius: 50%; 
    margin-right: 12px; 
    object-fit: cover; 
}

.gb-author-name { 
    font-weight: 700; 
    font-size: 0.95em; 
    display: block; 
}

.gb-date { 
    font-size: 0.8em; 
	opacity: 0.5;
}

.gb-card-stars { 
    color: #ffb400; /* Tes étoiles de cartes */
    font-size: 1em; 
    margin-bottom: 10px; 
}

.gb-card-text { 
    font-style: italic; 
    margin: 0; 
}

.gb-read-more { 
    display: inline-block; 
    font-size: 0.85em; 
    text-decoration: underline !important; 
    margin-top: 15px; 
}

/* 4. NAVIGATION (FLÈCHES ET DOTS) */
.swiper-button-next, 
.swiper-button-prev {
    background-color: #ffffff !important;
    width: 30px !important; 
    height: 30px !important;
    border-radius: 50% !important;
    z-index: 10;
    top: 50% !important;
    transform: translateY(-50%);
    border: 1px solid #eee !important;
}

.swiper-button-prev { left: 0px !important; }
.swiper-button-next { right: 0px !important; }

.swiper-button-next:after, 
.swiper-button-prev:after { 
    font-size: 16px !important; 
    color: #333 !important; 
    font-weight: bold; 
}

.swiper-pagination { 
    bottom: 5px !important; 
}

.swiper-pagination-bullet-active { 
    background: #333 !important; 
}

/* 5. RESPONSIVE BASCULE 1140PX */
@container review-block (min-width: 1140px) {
    .gb-wrapper { 
        flex-direction: row; 
        align-items: stretch; 
    }
    .gb-summary {
        flex: 0 0 240px;
        border-bottom: none;
        border-right: 1px solid #f0f0f0;
        padding-bottom: 0;
        padding-right: 30px;
        justify-content: center;
    }
}

/* MOBILE */
@media (max-width: 768px) {
    .gb-slider { padding: 10px 10px 45px 10px !important; }
    .swiper-button-next, .swiper-button-prev { display: none !important; }
}