/* === Carousel wrapper === */
.avis-carousel {
    position  : relative;
    margin    : 2rem 0;
    padding   : 0 2rem;
    box-sizing: border-box;
}

/* === Track (fenêtre visible) === */
.avis-track {
    overflow  : hidden;
    width     : 100%;
    transition: height 0.5s ease;
}

/* === Slides container === */
.avis-slides {
    display           : flex;
    transition        : transform 0.5s ease;
    will-change       : transform;
    -webkit-backface-visibility: hidden; /* iOS fix */
    backface-visibility: hidden;
}

/* === Slide individuel === */
.avis-slide {
    min-width     : 100%;
    min-height    : 180px;
    box-sizing    : border-box;
    background    : #f7f7f7;
    border        : 1px solid transparent/*#db6a02*/;
    border-radius : 8px;
    padding       : 28px 32px;
    display       : flex;
    flex-direction: column;
    gap           : 0.75rem;
    text-align    : left !important;
    align-items   : flex-start;
}

/* === Header === */
.avis-header {
    display    : flex;
    align-items: flex-start;
    gap        : 16px;
    text-align : left;
}

.avis-icon {
    width     : 30px;
    height    : 30px;
    flex-shrink: 0;
    object-fit: contain;
}

.avis-title {
    font-size  : 1rem;
    font-weight: 700;
    margin     : 0 0 4px;
    color      : #1a1a1a;
    text-align : left;
}

.avis-course {
    font-size : 0.875rem;
    color     : #555;
    margin    : 0;
    text-align: left;
}

/* === Étoiles === */
.avis-stars {
    display    : flex;
    align-items: center;
    gap        : 2px;
}

/* === Contenu === */
.avis-content {
    font-size  : 0.95rem;
    line-height: 1.6;
    color      : #333;
    margin     : 0;
    padding    : 0;
    border     : none;
    font-style : italic;
}

/* === Auteur === */
.avis-author {
    font-size : 0.8rem;
    color     : #888;
    margin-top: auto;
}

/* === Flèches === */
.avis-arrow {
    position        : absolute;
    top             : 50%;
    transform       : translateY(-50%);
    background      : #db6a02;
    color           : #fff;
    border          : none;
    border-radius   : 50%;
    width           : 36px;
    height          : 36px;
    font-size       : 1.4rem;
    line-height     : 1;
    cursor          : pointer;
    display         : flex;
    align-items     : center;
    justify-content : center;
    z-index         : 10;
    -webkit-tap-highlight-color: transparent;
    transition      : background 0.2s;
}

.avis-arrow:hover { background: #b85500; }
.avis-prev        { left : 0; }
.avis-next        { right: 0; }

/* === Barre de progression === */
.avis-progress {
    background   : #ddd;
    border-radius: 2px;
    height       : 3px;
    margin-top   : 1rem;
    overflow     : hidden;
}

.avis-progress-bar {
    background : #db6a02;
    height     : 100%;
    width      : 0;
    transition : width 0.4s ease;
}

/* === Mobile === */
@media (max-width: 600px) {
    .avis-carousel { padding: 0 2.2rem; }
    .avis-slide    { padding: 20px 18px; }
}