/* ==================================================
   reviewseintogoogle - style.css (versión "cards Google")
   ================================================== */

/* Contenedor general */
.rg-section { width: 100%; box-sizing: border-box; }
.rg-section-title {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 20px; text-align:center; color:#1A2C57; margin-bottom:20px;
}

/* Layout principal: rating (si lo usas) + grid de reseñas */
.rg-section-content { display:flex; align-items:stretch; gap:20px; }

/* ---------- GRID: 3 por fila en desktop ---------- */
.rg-review-list{
  flex:1;
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:18px;
}

/* ---------- CARD ---------- */
.rg-review-item{
  position:relative;
  display:flex; flex-direction:column;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:16px;
  padding:16px 18px;
  box-shadow:0 3px 10px rgba(0,0,0,.06);
  transition:transform .18s ease, box-shadow .18s ease;
}
.rg-review-item:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 18px rgba(0,0,0,.10);
}

/* Google “G” arriba a la derecha */
.rg-google-badge{
  position:absolute; top:12px; right:12px;
  width:22px; height:22px; object-fit:contain;
}

/* ---------- HEADER: avatar + nombre + fecha ---------- */
.rg-review-header{ display:flex; align-items:center; gap:10px; margin-top:2px; }
.rg-avatar-img{ width:36px; height:36px; border-radius:50%; object-fit:cover; flex-shrink:0; }
.rg-avatar{
  width:36px; height:36px; border-radius:50%;
  background:#e8f0fe; color:#1a73e8; display:inline-flex;
  align-items:center; justify-content:center;
  font-weight:700; font-size:15px; text-transform:uppercase;
}

/* Nombre + meta */
.rg-header-meta{ display:flex; flex-direction:column; min-width:0; }
.rg-reviewer-name{
  font-weight:700; font-size:14px; color:#1f2937; line-height:1.2;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.rg-review-handle{
  font-size:12px; color:#6b7280;
}

/* ---------- RATING centrado tipo “Google card” ---------- */
.rg-stars{ margin:10px 0 6px; text-align:left; }
.rg-star{ display:inline-block; line-height:1; margin:0 1px; font-size:18px; color:#F5A623; }
.rg-star.filled{ color:#F5A623; }
/* por si algún tema añade ::before */
.rg-stars .rg-star::before{ content:none !important; }

/* ---------- CONTENIDO (3 líneas) ---------- */
.rg-review-content{
  font-size:14px; color:#4b5563; margin:6px 0 10px;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}

/* Link “Leer más reseñas” */
.rg-review-link{
  margin-top:auto; font-size:13px; font-weight:600; text-decoration:none;
  color:#1a73e8;
}
.rg-review-link:hover{ text-decoration:underline; }

/* ---------- Responsive ---------- */
@media (max-width: 1024px){
  .rg-review-list{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 600px){
  .rg-section-content{ flex-direction:column; }
  .rg-review-list{ grid-template-columns: 1fr; }
  .rg-review-item{ padding:14px 16px; border-radius:14px; }
}

/* (Opcional) si mantienes tu widget lateral de rating */
.rg-rating-widget{ display:none; } /* quítalo si lo quieres activo */



/* --------------------------------------------------
   Barra resumen tipo Trustpilot (hook displayReviewSnippet)
   -------------------------------------------------- */
.rg-snippet-bar {
  display: flex;
    align-items: center;
    gap: 8px;
    font-family: Arial, sans-serif;
    font-size: 14px;
    color: black;
    width: 100%;
    text-align: left;
    justify-content: left;
    padding: 5px;
    background: white;
    border-radius: 10px;
	margin-top: 10px;
}

.rg-snippet-label {
  font-weight: bold;
}

.rg-snippet-stars .star {
  font-size: 16px;
  line-height: 1;
  color: #00b67a; /* verde estilo Trustpilot */
}

.rg-snippet-stars .star.filled {
  color: #ff7f00;
}

.rg-snippet-text {
  text-decoration: underline;
}

.rg-snippet-logo {
  height: 16px;
  display: inline-block;
  vertical-align: middle;
}