/* ====== Base ====== */
.ja-gmr-wrap{
  --star:#fbbc04; --card:#fff; --muted:#9AA3AF; --text:#0F172A; --ring:#E5E7EB;
  --dotActive:#111827; --dotInactive:#D1D5DB;
  --btnBg:#e11900; --btnText:#ffffff;
  font-family: system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
}

/* Center the header like the card */
.ja-gmr-header{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  justify-content:center; text-align:center;
  max-width:720px; margin:0 auto 12px;
}
.ja-gmr-rating-badge{ display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border:1px solid var(--ring); border-radius:9999px; background:#fff; }
.ja-gmr-rating-number{ font-weight:700; }
.ja-gmr-rating-text{ color:var(--muted); font-weight:600; }
.ja-gmr-total{ color:var(--muted); }

/* ====== Slider viewport + track ====== */
.ja-gmr-slider{ position:relative; overflow:hidden; padding:8px 0 34px; }
.ja-gmr-track{ display:flex; flex-wrap:nowrap; will-change:transform; transition:transform .45s ease; }
.ja-gmr-slide{ flex:0 0 100%; max-width:100%; padding:4px 10px; box-sizing:border-box; }

/* ====== Card ====== */
.ja-gmr-card{
  max-width:720px; margin:0 auto; background:var(--card);
  border:1px solid var(--ring); border-radius:18px;
  padding:22px 22px 18px; box-shadow:0 12px 22px rgba(15,23,42,.06);
  text-align:center;
}
.ja-gmr-stars{ display:inline-flex; gap:3px; margin-bottom:8px; }
.ja-gmr-star{ display:block; width:20px; height:20px; }
.ja-gmr-author{ font-weight:800; font-size:22px; line-height:1.25; margin:2px 0 8px; color:var(--text); }
.ja-gmr-item-rating{ display:none; }

/* 3-line clamp with toggle */
.ja-gmr-text{
  color:var(--text); font-size:16px; line-height:1.55; margin:0 auto 8px; max-width:58ch;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.ja-gmr-text.expanded{ display:block; -webkit-line-clamp:unset; -webkit-box-orient:unset; overflow:visible; }
.ja-gmr-time{ color:var(--muted); font-weight:600; margin-top:6px; }

/* Read more / Read less (customizable) */
.ja-gmr-more{
  margin-top:10px; background:var(--btnBg); color:var(--btnText);
  border:0; border-radius:10px; padding:10px 16px;
  font-weight:700; cursor:pointer; box-shadow:0 4px 10px rgba(0,0,0,.06);
}
.ja-gmr-more:hover { filter: brightness(0.98); }

/* ====== Dots ====== */
.ja-gmr-dots{ position:absolute; left:0; right:0; bottom:6px; display:flex; justify-content:center; gap:10px;}
.ja-gmr-dot{ width:10px; height:10px; border-radius:9999px; background:var(--dotInactive); border:0; cursor:pointer; }
.ja-gmr-dot[aria-current="true"]{ background:var(--dotActive); }

/* Arrows hidden by default; set to block to show */
.ja-gmr-nav{ display:none; }

/* Empty */
.ja-gmr-empty{ color:var(--muted); }

/* ====== Mobile ====== */
@media (max-width: 640px){
  .ja-gmr-header{ max-width:100%; margin:0 auto 10px; }
  .ja-gmr-card{ max-width:100%; border-radius:14px; padding:16px 14px 14px; }
  .ja-gmr-author{ font-size:18px; }
  .ja-gmr-star{ width:18px; height:18px; }
  .ja-gmr-text{ font-size:15px; }
  .ja-gmr-slider{ padding-bottom:36px; }
}

/* --- Force plugin colors over theme defaults --- */
.ja-gmr-wrap .ja-gmr-card .ja-gmr-more{
  /* neutralize theme button resets */
  -webkit-appearance: none;
  appearance: none;

  /* our colors with priority 
  background: var(--btnBg) !important; */
  background: #2596be00 !important;
  color: var(--btnText) !important;

  border: 0 !important;
  box-shadow: 0 4px 10px rgba(0,0,0,.06) !important;
  text-decoration: none !important;
}

.ja-gmr-wrap .ja-gmr-dots .ja-gmr-dot{
  background: var(--dotInactive) !important;
  border: 0 !important;
  border-radius:50px !important;
}
.ja-gmr-wrap .ja-gmr-dots .ja-gmr-dot[aria-current="true"]{
  background: var(--dotActive) !important;
  border: 0 !important;
  border-radius:50px !important;
}

/* Make slider dots perfectly circular, regardless of theme styles */
.ja-gmr-wrap .ja-gmr-dots .ja-gmr-dot{
  display: inline-block;
  width: 10px;                /* control size */
  aspect-ratio: 1 / 1;        /* keep 1:1 */
  padding: 0 !important;      /* kill theme padding */
  border: 0 !important;       /* kill theme borders */
  border-radius: 50% !important;  /* circle */
  background: var(--dotInactive) !important;
  line-height: 0 !important;  /* avoid text height interference */
  -webkit-appearance: none;
  appearance: none;
}

.ja-gmr-wrap .ja-gmr-dots .ja-gmr-dot[aria-current="true"]{
  background: var(--dotActive) !important;
}