/* Theme tokens */
.grb-theme-light { --grb-card-bg:#f7f7f8; --grb-text:#111; --grb-muted:#555; --grb-link:#1d6fd6; --grb-star:#e2b007; }
.grb-theme-dark  { --grb-card-bg:#1b1f2a; --grb-text:#f1f5f9; --grb-muted:#98a2b3; --grb-link:#69a8ff; --grb-star:#ffd23f; }
.gs-slider-wrapper{position:relative}
.gs-slider-container{position:relative;overflow:visible;}
.gs-slider-track{display:flex;transition:transform .45s ease}
.gs-slide{ --gs- clamp(12px, 2vw, 24px);flex:0 0 100%;padding:10px 0;display:flex;20px;flex-wrap:nowrap}
.gs-review-card{box-sizing:border-box;background:var(--grb-card-bg,#1b1f2a);color:var(--grb-text,#f1f5f9);border-radius:16px;padding:20px;min-height:220px;flex:0 0 25%;max-width:25%}
.gs-review-card.grb-placeholder{background:transparent!important;box-shadow:none!important;border:none!important;min-height:0}
.grb-profile-row{display:flex;align-items:center;gap: var(--gs-gap);margin-bottom:10px}
.grb-avatar{border-radius:50%;object-fit:cover;width:40px;height:40px}
.grb-avatar-fallback{width:40px;height:40px;border-radius:50%;background:#444;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff}
.grb-name{font-size:1.05em}
.grb-date{opacity:.75;font-size:.9em}
.grb-stars{color:var(--grb-star,#ffd23f);margin-bottom:10px}
.grb-text{font-style:italic;max-height:175px;overflow:hidden}
.grb-readmore{color:var(--grb-link,#69a8ff);font-size:.95em;display:inline-block;margin-top:8px;text-decoration:none}
.gs-arrows{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);pointer-events:none}
.gs-arrow{position:absolute;pointer-events:auto;width:42px;height:42px;border-radius:999px;background:rgba(0,0,0,.45);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.25)}

.gs-dots{display:flex;justify-content:center;margin-top:10px;gap: var(--gs-gap);height:10px;border-radius:50%;background:#888}
.gs-dot.active{background:#fff}
@media (max-width:1024px){.gs-review-card{flex-basis:50%;max-width:50%}}
@media (max-width:640px){.gs-review-card{flex-basis:100%;max-width:100%}}


/* Dynamic cards-per-slide widths */





/* Ensure spacing doesn't cluster */
.gs-slide{ --gs- clamp(12px, 2vw, 24px);24px}

/* Feedback card styling */
.grb-feedback-card{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.grb-fb-title{margin:0 0 10px 0}
.grb-fb-thumbs{font-size:42px;display:flex;gap: var(--gs-gap);margin:10px 0}
.grb-fb-sub{opacity:.85;margin:6px 0}
.grb-fb-links{display:flex;gap: var(--gs-gap);margin-top:6px}
.grb-badge{display:inline-block;padding:8px 12px;border-radius:999px;background:#202b; color:#fff; text-decoration:none}


/* Sidebar layout */

.grb-with-sidebar .gs-slider-container { flex: 1 1 auto; }
.grb-feedback-sidebar { flex: 0 0 300px; max-width:300px; background: var(--grb-card-bg,#1b1f2a); color: var(--grb-text,#f1f5f9); border-radius:16px; padding:18px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.grb-feedback-sidebar .grb-badge { display:inline-block; padding:8px 12px; border-radius:999px; background:#2b2f3a; color:#fff; text-decoration:none; }



/* ==== Responsive: keep sidebar visible and shrink cards ==== */

.grb-feedback-sidebar{
  max-width: clamp(180px, 24vw, 300px);
  flex: 0 0 auto;
}

/* Card sizing scales with viewport */
.gs-review-card{
  padding: clamp(12px, 1.8vw, 20px);
  border-radius: clamp(10px, 1.6vw, 16px);
  min-width: 0;
}
.grb-profile-row{ gap: var(--gs-gap); }
.grb-avatar, .grb-avatar-fallback{ width: clamp(32px, 3.2vw, 40px); height: clamp(32px, 3.2vw, 40px); }
.grb-name{ font-size: clamp(14px, 1.1vw, 18px); }
.grb-date{ font-size: clamp(12px, 0.95vw, 14px); }
.grb-text{ font-size: clamp(14px, 1.05vw, 16px); max-height: clamp(120px, 18vw, 175px); }
.grb-readmore{ font-size: clamp(12px, 1vw, 15px); }

/* Slider gaps & dots scale */
.gs-slide{ --gs- clamp(12px, 2vw, 24px);  clamp(12px, 2vw, 24px); }
.gs-dot{ width: clamp(6px, 1vw, 10px); height: clamp(6px, 1vw, 10px); }


.gs-arrow{ width: clamp(32px, 3.2vw, 42px); height: clamp(32px, 3.2vw, 42px); }

/* Cards-per-slide widths already set; ensure no overflow */






/* === Strict two-column layout (reviews | feedback) at all widths === */
.grb-with-sidebar{
  display:grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(220px, clamp(220px, 24vw, 320px));
  gap: var(--grb-col-gap, 5px) !important;
  align-items: start;
}
.grb-with-sidebar .gs-slider-container{ min-width: 0; }
.grb-feedback-sidebar{
  max-width: minmax(220px, 320px);
  width: clamp(220px, 24vw, 320px);
  flex: 0 0 auto;
}
/* Keep content breathable as viewport shrinks */
.gs-review-card{ min-width: 0; }


/* === 0.1.8.12 Overlap/Scroll fix === */
.gs-slider-container{ position:relative; overflow:hidden; }
.gs-slider-track{ will-change: transform; }
.gs-arrow{ position:absolute; pointer-events:auto; top:50%; transform:translateY(-50%); z-index:2; }
.gs-arrow[data-dir="-1"]{ left: clamp(8px, 1.2vw, 14px); }
.gs-arrow[data-dir="1"]{ right: clamp(8px, 1.2vw, 14px); }
.grb-with-sidebar{ overflow:hidden; }
.gs-slide{ --gs- clamp(12px, 2vw, 24px); overflow:hidden; }


/* === 0.1.8.14 Equal-height review cards === */
.gs-slide{ align-items: stretch; }
.gs-review-card{ display:flex; flex-direction:column; height:100%; }
.grb-readmore{ margin-top:auto; }


/* === 0.1.8.15: Percentage-based card widths === */






/* === 0.1.8.19: Gap-visible, gap-safe widths === */
.grb-cps-4 .gs-review-card{ flex:0 0 calc((100% - 3*var(--gs-gap,5px))/4); max-width: calc((100% - 3*var(--gs-gap,5px))/4); }
.grb-cps-3 .gs-review-card{ flex:0 0 calc((100% - 2*var(--gs-gap,5px))/3); max-width: calc((100% - 2*var(--gs-gap,5px))/3); }
.grb-cps-2 .gs-review-card{ flex:0 0 calc((100% - 1*var(--gs-gap,5px))/2); max-width: calc((100% - 1*var(--gs-gap,5px))/2); }
.grb-cps-1 .gs-review-card{ flex:0 0 100%; max-width: 100%; }


/* === 0.1.8.20: Margin-based gap fallback so cards always show spacing === */
.gs-slide{ margin-left: calc(var(--gs-gap,5px) / -2) !important;
           margin-right: calc(var(--gs-gap,5px) / -2) !important; }
.gs-review-card{ margin-left: calc(var(--gs-gap,5px) / 2) !important;
                 margin-right: calc(var(--gs-gap,5px) / 2) !important; }


/* ==== v0.1.9.5: Bottom navigation row (arrows + dots) ==== */
.gs-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
}
.gs-dots {
  display: flex;
  gap: 6px;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}
.gs-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--grb-muted, #999);
  cursor: pointer;
  border: 0;
}
.gs-dot.active { background: var(--grb-link, #1d6fd6); }

/* Make sure any legacy overlay arrows are not used */
.gs-arrows { display: none !important; }
/* Ensure the new arrows sit on the bottom row, not midpoint */
.gs-arrow {
  background: transparent;
  border: 0;
  font-size: 18px;
  line-height: 1;
  padding: 6px 8px;
  cursor: pointer;
  color: var(--grb-text, #fff);
  border-radius: 8px;
  position: static !important;
  transform: none !important;
  top: auto !important; bottom: auto !important; left: auto !important; right: auto !important;
}
.gs-arrow:focus { outline: 2px solid var(--grb-link, #1d6fd6); outline-offset: 2px; }


/* 0.1.10.0: Ensure feedback card uses identical sizing as review cards */
.gs-review-card.gs-feedback {
  flex: 0 0 inherit;
  max-width: inherit;
}
/* Match widths for each CPS setting */
.grb-cps-4 .gs-review-card.gs-feedback { flex: 0 0 calc((100% - 3*var(--gs-gap, 5px))/4); }
.grb-cps-3 .gs-review-card.gs-feedback { flex: 0 0 calc((100% - 2*var(--gs-gap, 5px))/3); }
.grb-cps-2 .gs-review-card.gs-feedback { flex: 0 0 calc((100% - 1*var(--gs-gap, 5px))/2); }
.grb-cps-1 .gs-review-card.gs-feedback { flex: 0 0 100%; }