/* ═══════════════════════════════════════════════════════════════════
   rwe-posts-grid — CSS de la rejilla de entradas
   R1: sacado del render() inline. Antes se imprimía COMPLETO por cada
   instancia (usaba get_id() en cada selector). Ahora es un archivo único
   cacheable; lo variable va en variables CSS que el render inyecta por
   instancia (unos pocos bytes en vez de ~34 líneas).

   Variables que inyecta el render (en el wrapper .rwe-grid-wrap):
     --rwe-cols        columnas escritorio
     --rwe-cols-tablet columnas <=1024
     --rwe-cols-mobile columnas <=767
     --rwe-gap         separación en px
     --rwe-pag-color   color base de la paginación
     --rwe-pag-accent  color de acento (hover/activo)
   ═══════════════════════════════════════════════════════════════════ */

/* ---------- Rejilla ---------- */
.rwe-grid-wrap .rwe-grid{
    display:grid;
    grid-template-columns:repeat(var(--rwe-cols,3),1fr);
    gap:var(--rwe-gap,24px);
}
@media(max-width:1024px){
    .rwe-grid-wrap .rwe-grid{ grid-template-columns:repeat(var(--rwe-cols-tablet,2),1fr); }
}
@media(max-width:767px){
    .rwe-grid-wrap .rwe-grid{ grid-template-columns:repeat(var(--rwe-cols-mobile,1),1fr); }
}

/* ---------- Paginación ---------- */
.rwe-grid-wrap .rwe-pagination{
    display:flex; align-items:center; justify-content:center;
    gap:8px; margin-top:40px; flex-wrap:wrap;
}
.rwe-grid-wrap .rwe-page-btn{
    display:inline-flex; align-items:center; justify-content:center;
    width:40px; height:40px; border-radius:6px;
    border:2px solid var(--rwe-pag-color,#1a1a1a);
    background:transparent; color:var(--rwe-pag-color,#1a1a1a);
    font-family:inherit; font-size:13px; font-weight:700;
    cursor:pointer; transition:all .2s; text-decoration:none;
}
.rwe-grid-wrap .rwe-page-btn:hover,
.rwe-grid-wrap .rwe-page-btn.active{
    background:var(--rwe-pag-accent,#1a1a1a);
    border-color:var(--rwe-pag-accent,#1a1a1a);
    color:#fff;
}
.rwe-grid-wrap .rwe-page-btn:disabled{ opacity:.35; cursor:default; }
.rwe-grid-wrap .rwe-page-dots{ color:var(--rwe-pag-color,#1a1a1a); font-weight:700; padding:0 4px; }

/* ---------- Botón "cargar más" ---------- */
.rwe-grid-wrap .rwe-load-more{
    display:block; margin:36px auto 0;
    padding:14px 40px; background:transparent;
    border:2px solid var(--rwe-pag-accent,#1a1a1a); border-radius:6px;
    color:var(--rwe-pag-accent,#1a1a1a); font-family:inherit;
    font-size:14px; font-weight:700; letter-spacing:.5px;
    cursor:pointer; transition:all .2s;
}
.rwe-grid-wrap .rwe-load-more:hover{ background:var(--rwe-pag-accent,#1a1a1a); color:#fff; }
.rwe-grid-wrap .rwe-load-more:disabled{ opacity:.5; cursor:default; }
