/* ==========================================================================
   Ringomize Reviews Slider — [ringomize_reviews_slider]
   Every element has its own dedicated "rrs-" class + explicit resets so
   theme/plugin CSS can never leak in. Star icons reuse RR_Frontend's
   .rr-star system (frontend.css) so slider stars are pixel-identical to
   the ones on the single product review list.
   ========================================================================== */

.rrs-slider-section{
    max-width:1040px;
    margin:0 auto;
    padding:36px 16px;
    text-align:center;
    box-sizing:border-box;
}
.rrs-slider-section *{ box-sizing:border-box; }

/* ===== Heading / dynamic subheading ===== */
.rrs-heading{
    font-size:30px !important;
    font-weight:600 !important;
    letter-spacing:-0.3px !important;
    color:var(--rr-text, #1d1d1f) !important;
    margin:0 0 8px !important;
    padding:0 !important;
    line-height:1.15 !important;
    text-transform:none !important;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif !important;
    border:none !important;
    background:none !important;
}
.rrs-subtext{
    font-size:15px;
    color:var(--rr-text-muted, #6e6e73);
    max-width:600px;
    margin:0 auto 16px;
    line-height:1.5;
}

/* ===== Trust row ===== */
.rrs-trust-row{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin-bottom:24px;
    flex-wrap:wrap;
}
.rrs-trust-stars.rr-big-stars{ font-size: var(--rr-size-product, 24px); display:inline-flex; gap:2px; }
.rrs-trust-score{ font-size:14.5px; font-weight:600; color:var(--rr-text, #1d1d1f); }
.rrs-trust-count{ font-size:14.5px; color:var(--rr-text-muted, #86868b); }
.rrs-trust-verified{ display:inline-flex; align-items:center; gap:5px; font-size:12.5px; color:#1aa37a; font-weight:600; }
.rrs-trust-badge{ width:15px; height:15px; border-radius:3px; background:#1aa37a; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; }
.rrs-trust-badge svg{ width:9px; height:9px; fill:none; stroke:#fff; stroke-width:3; }

/* ===== Slider frame ===== */
.rrs-slider-wrap{
    position:relative;
    display:flex;
    align-items:center;
    gap:14px;
}
.rrs-viewport{ overflow:hidden; flex:1; cursor:grab; touch-action:pan-y; }
.rrs-viewport.rrs-dragging{ cursor:grabbing; }
.rrs-track{ display:flex; align-items:flex-start; gap:16px; }
.rrs-track.rrs-no-transition{ transition:none !important; }
.rrs-track.rrs-animate{ transition:transform .4s cubic-bezier(.25,.8,.25,1); }

/* ===== Nav arrows — plain chevrons, no button chrome ===== */
button.rrs-nav-btn{
    all:unset;
    box-sizing:border-box;
    flex-shrink:0;
    display:flex;
    align-items:center;
    justify-content:center;
    width:30px;
    height:30px;
    cursor:pointer;
    font-size:30px;
    font-weight:300;
    line-height:1;
    color:#1d1d1f !important;
    background:transparent !important;
    border:none !important;
    border-radius:0 !important;
    box-shadow:none !important;
    font-family:inherit;
    -webkit-tap-highlight-color:transparent;
    transition:opacity .15s;
}
button.rrs-nav-btn:hover{ opacity:.5; color:#1d1d1f !important; }
button.rrs-nav-btn:focus{ outline:2px solid #ccc; outline-offset:2px; }

/* ===== Review cards — fixed height so a single long outlier review never
   drags every other card's height along with it (was the "empty gap" bug) ===== */
.rrs-card{
    flex:0 0 calc(50% - 8px);
    background:#f5f5f6;
    border-radius:4px;
    padding:22px 22px 18px;
    height:260px;
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    cursor:pointer;
    transition:transform .2s, box-shadow .2s;
    user-select:none;
    -webkit-user-select:none;
}
.rrs-card:hover{ transform:translateY(-2px); box-shadow:0 8px 20px rgba(0,0,0,.07); }
.rrs-card-title{ font-weight:600; font-size:14px; color:var(--rr-text, #1d1d1f); margin-bottom:6px; }
.rrs-card-quote{
    font-size:14px;
    line-height:1.5;
    color:var(--rr-text-muted, #6e6e73);
    margin:0 0 12px;
    flex:1;
    display:-webkit-box;
    -webkit-line-clamp:4;
    -webkit-box-orient:vertical;
    overflow:hidden;
}
.rrs-card-meta-row{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin-bottom:10px;
}
.rrs-card-stars.rr-stars{ font-size: var(--rr-size-review, 20px); display:inline-flex; gap:2px; }
.rrs-card-name{ font-weight:600; font-size:14px; color:var(--rr-text, #1d1d1f); margin-bottom:2px; }
.rrs-card-product{ font-size:12px; color:var(--rr-text-muted, #86868b); }
.rrs-card-media-hint{
    display:inline-flex; align-items:center; gap:4px; font-size:11.5px;
    color: var(--rr-text, #1d1d1f); background:none; border:none;
    padding:0; font-weight:700; white-space:nowrap;
}
.rrs-card-media-hint-icon{ width:12px; height:12px; fill:none; stroke:var(--rr-text, #1d1d1f); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }

@media (max-width:640px){
    .rrs-heading{ font-size:21px; }
    .rrs-card{ flex:0 0 100%; }
    /* Not enough room on mobile — hide prev/next entirely, swipe still works */
    button.rrs-nav-btn{ display:none !important; }
    .rrs-slider-wrap{ gap:0; }
}

/* ===== Popup (matches the single-product review card layout) ===== */
.rrs-popup-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.45);
    display:none;
    align-items:center;
    justify-content:center;
    z-index:99999;
    padding:20px;
}
.rrs-popup-overlay.rrs-open{ display:flex; }
.rrs-popup-box{
    background:#fff;
    border-radius:6px;
    max-width:400px;
    width:100%;
    max-height:85vh;
    overflow-y:auto;
    padding:28px 24px 24px;
    text-align:center;
    position:relative;
    animation:rrs-pop .2s cubic-bezier(.4,0,.2,1);
}
@keyframes rrs-pop{ from{ transform:scale(.96); opacity:0; } to{ transform:scale(1); opacity:1; } }

button.rrs-popup-close{
    all:unset;
    box-sizing:border-box !important;
    position:absolute !important;
    top:12px !important;
    right:12px !important;
    width:26px !important;
    height:26px !important;
    min-width:26px !important;
    min-height:26px !important;
    max-width:26px !important;
    max-height:26px !important;
    padding:0 !important;
    margin:0 !important;
    border:none !important;
    border-radius:50% !important;
    background:#f2f2f2 !important;
    color:#6e6e73 !important;
    font-size:12px !important;
    line-height:1 !important;
    cursor:pointer;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
}
button.rrs-popup-close:hover{ background:#e6e6e6 !important; }

.rrs-popup-stars.rr-stars{ font-size: var(--rr-size-review, 20px); display:inline-flex; gap:3px; margin-bottom:14px; }

.rrs-popup-header{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin-bottom:6px;
}
.rrs-popup-avatar{
    width:34px;
    height:34px;
    border-radius:4px;
    background:#e0e0e080;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
}
.rrs-popup-avatar-svg{ width:20px; height:20px; fill:none; stroke:#505050; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.rrs-popup-name{ font-weight:600; font-size:14px; color:var(--rr-text, #1d1d1f); }
.rrs-popup-title{ font-weight:600; font-size:15.5px; color:var(--rr-text, #1d1d1f); margin-bottom:8px; }
.rrs-popup-text{ font-size:14px; line-height:1.55; color:var(--rr-text-muted, #6e6e73); margin:0 0 4px; }

.rrs-popup-media-grid{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin:14px 0 16px; }
.rrs-popup-media-item{ width:64px; height:64px; border-radius:4px; overflow:hidden; position:relative; background:#ddd; cursor:pointer; }
.rrs-popup-media-item img,
.rrs-popup-media-item video{ width:100%; height:100%; object-fit:cover; display:block; pointer-events:none; }
.rrs-popup-media-play{
    position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
    width:22px; height:22px; background:rgba(0,0,0,.55); color:#fff; border-radius:50%;
    display:flex; align-items:center; justify-content:center; font-size:9px; pointer-events:none;
}

.rrs-popup-verified{ display:flex; align-items:center; justify-content:center; gap:5px; font-size:12px; color:#1aa37a; font-weight:600; margin-bottom:18px; }

a.rrs-popup-product-btn{
    all:unset;
    box-sizing:border-box;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#1d1d1f !important;
    color:#ffffff !important;
    text-decoration:none !important;
    padding:13px 20px;
    border-radius:4px;
    font-size:14px;
    font-weight:500;
    width:100%;
    cursor:pointer;
    line-height:1.3;
    transition:background .15s;
}
a.rrs-popup-product-btn:hover,
a.rrs-popup-product-btn:visited,
a.rrs-popup-product-btn:active{
    background:#000000 !important;
    color:#ffffff !important;
}