/* Revie — Carousel widget (app-block-3.liquid)
   Settings como CSS variables inline en .rv3:
   --rv3-maxw --rv3-pad --rv3-mpad --rv3-cols --rv3-ss --rv3-tsize
   --rv3-text --rv3-back --rv3-title-size --rv3-title-color --rv3-title-pos --rv-star-c
   Variantes por clase: .rv3-f1..f7 (format), .rv3-n1..n3 (name), .rv3-m1/m15/m2 (mobile) */

/* Estrellas compartidas (misma técnica que revie-w4.css) */
:root{
  --rv-star-o:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3 14.47 8.6 20.56 9.22 15.99 13.3 17.29 19.28 12 16.2 6.71 19.28 8.01 13.3 3.44 9.22 9.53 8.6Z' fill='none' stroke='white' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E");
  --rv-star-f:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3 14.47 8.6 20.56 9.22 15.99 13.3 17.29 19.28 12 16.2 6.71 19.28 8.01 13.3 3.44 9.22 9.53 8.6Z' fill='white' stroke='white' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.rv-stars{--rvss:15px;display:inline-block;position:relative;flex:none;width:calc(var(--rvss)*5);height:var(--rvss);}
.rv-stars::before,.rv-stars::after{content:"";position:absolute;top:0;left:0;bottom:0;background-color:var(--rv-star-c,#000);}
.rv-stars::before{width:100%;-webkit-mask:var(--rv-star-o) 0 0/var(--rvss) var(--rvss) repeat-x;mask:var(--rv-star-o) 0 0/var(--rvss) var(--rvss) repeat-x;}
.rv-stars::after{width:calc(var(--rating,0)/5*100%);-webkit-mask:var(--rv-star-f) 0 0/var(--rvss) var(--rvss) repeat-x;mask:var(--rv-star-f) 0 0/var(--rvss) var(--rvss) repeat-x;}

/* Contenedor */
.rv3{--grid-column-gap:20px;max-width:var(--rv3-maxw,900px);padding:var(--rv3-pad,22px);margin:0 auto}
.rv3 .rv-stars{--rvss:var(--rv3-ss,15px);vertical-align:middle}
.rv3 .links{cursor:pointer}
.rv3 .itemsC{position:relative}
.rv3 .scrolly{position:relative}
.rv3 .topT{padding:10px 0;font-weight:600;font-size:var(--rv3-title-size,24px);display:flex;align-items:center;gap:5px;color:var(--rv3-title-color,#000);justify-content:var(--rv3-title-pos,flex-start)}
.rv3 .carouselPre{grid-auto-flow:column;display:grid;grid-auto-columns:calc((100% - 3*var(--grid-column-gap))/var(--rv3-cols,5));grid-column-gap:var(--grid-column-gap);scroll-snap-type:x mandatory;overflow-x:scroll;overflow-y:hidden;list-style:none;scroll-behavior:smooth;padding:10px;margin:0;scrollbar-width:none;-ms-overflow-style:none}
.rv3 .carouselPre::-webkit-scrollbar{display:none}
.rv3 .carouselPre li{scroll-snap-align:start;width:100%;height:100%;background-color:var(--rv3-back,#fff);list-style:none;border-radius:6px;overflow:hidden;box-shadow:0 7px 12px -4px rgba(0,0,0,.22)}
.rv3-f1 .carouselPre li{aspect-ratio:1/1}
.rv3-f4 .carouselPre li{padding:6px}
.rv3 .carouselPre li.links:hover{box-shadow:rgba(50,50,93,.25) 0 13px 27px -5px,rgba(0,0,0,.3) 0 8px 16px -8px}

/* Flechas */
.rv3 .rv3-btn{background-color:#fff;outline:none;border:transparent;border-radius:100%;display:flex;align-items:center;justify-content:center;width:3rem;height:3rem;position:absolute;top:50%;transform:translate(0,-60%);cursor:pointer;z-index:2;box-shadow:0 2px 4px #000;opacity:1}
.rv3 .rv3-prev{left:-1.5rem}
.rv3 .rv3-next{right:-1.5rem}
.rv3:is(.rv3-f5,.rv3-f6,.rv3-f7) .rv3-btn{top:3rem;opacity:.5;box-shadow:0 2px 5px #000}
.rv3:is(.rv3-f5,.rv3-f6,.rv3-f7) .rv3-prev{left:auto;right:5rem}
.rv3:is(.rv3-f5,.rv3-f6,.rv3-f7) .rv3-next{right:5px}

/* Formatos 5/6/7 (background / galería) */
.rv3:is(.rv3-f5,.rv3-f6,.rv3-f7) .txtStar{display:flex;justify-content:flex-start;align-items:center;gap:10px}
.rv3:is(.rv3-f5,.rv3-f6,.rv3-f7) .carouselPre .quot{font-size:calc(var(--rv3-tsize,15px) + 20px);line-height:calc(var(--rv3-tsize,15px) + 20px);font-family:"Times New Roman"!important;margin-bottom:10px}
.rv3:is(.rv3-f5,.rv3-f6,.rv3-f7) .carouselPre li p{font-weight:100;font-size:var(--rv3-tsize,15px);line-height:calc(var(--rv3-tsize,15px) + 6px);margin:2rem 0}
.rv3:is(.rv3-f5,.rv3-f6,.rv3-f7) .carouselPre li.bgImg{background-repeat:no-repeat;background-position:center;background-size:cover}
.rv3:is(.rv3-f5,.rv3-f6,.rv3-f7) .itemsC{padding:20px;cursor:pointer}
.rv3:is(.rv3-f5,.rv3-f6,.rv3-f7) .carouselPre li .text-mys{width:100%;height:100%;color:#fff;display:flex;flex-direction:column;justify-content:flex-start}
.rv3:is(.rv3-f5,.rv3-f6,.rv3-f7) .carouselPre li .text-mys a,.rv3:is(.rv3-f5,.rv3-f6,.rv3-f7) .carouselPre li .text-mys a:visited{flex:2;display:flex;flex-direction:column;justify-content:flex-end;color:#fff}
.rv3:is(.rv3-f5,.rv3-f6,.rv3-f7) .carouselPre li img{width:30%;height:auto;object-fit:cover;border-radius:2px;margin:5px}
.rv3:is(.rv3-f6,.rv3-f7) .txtStar{flex-direction:column;gap:0}
.rv3-f6 .carouselPre li.bgImg{aspect-ratio:1;border-radius:20%}
.rv3-f7 .carouselPre li.bgImg{aspect-ratio:1;border-radius:50%}
.rv3:is(.rv3-f6,.rv3-f7) .carouselPre li .text-mys{color:var(--rv3-text,#000);justify-content:flex-end}

/* Formatos 1-4 (cards) */
.rv3 .itemsC .textDet{opacity:.8;width:100%;display:flex;color:var(--rv3-text,#000);background:var(--rv3-back,#fff)}
.rv3-f1 .itemsC .textDet{position:absolute;height:calc((var(--rv3-tsize,15px) + 5px)*5);bottom:0}
.rv3 .itemsC .contents{color:#fff}
.rv3 .itemsC .contents p{text-align:left;display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;font-size:var(--rv3-tsize,15px);line-height:calc(var(--rv3-tsize,15px) + 8px);width:100%!important;margin:2rem 1rem 1rem!important;font-style:normal;font-weight:500;font-family:sans-serif}
.rv3-n2 .itemsC .contents p b{display:block!important}
.rv3-n3 .itemsC .contents p b{display:none!important}
.rv3 .leftTxtDet{text-align:center;width:calc(var(--rv3-ss,15px)*5 + 8px);background:#fff;z-index:2}
.rv3:not(.rv3-f3):not(.rv3-f4) .leftTxtDet{position:absolute;left:calc(50% - (var(--rv3-ss,15px)*5 + 8px)/2);border:1px solid var(--rv-star-c,#000);border-radius:6px}
.rv3:is(.rv3-f3,.rv3-f4) .leftTxtDet{margin:10px 0}
.rv3-f1 .leftTxtDet{margin-top:calc((var(--rv3-ss,15px) + 8px)/-2);line-height:calc(var(--rv3-ss,15px) + 8px)}
.rv3 .carouselPre li .bgImg{width:100%}
.rv3:is(.rv3-f2,.rv3-f3) .carouselPre li .bgImg{aspect-ratio:1/1}
.rv3-f2 .carouselPre li .bgImg{background-repeat:no-repeat;background-position:center;background-size:cover;display:block!important}
.rv3:is(.rv3-f1,.rv3-f2,.rv3-f3) .carouselPre li img{width:100%;height:100%;object-fit:cover}
.rv3-f4 .carouselPre li img{width:30%;height:auto;border-radius:2px;margin:5px}
.rv3-f4 .carouselPre li .bgImg{display:flex;height:auto;align-items:flex-start}
.rv3-f2 .itemsC .contents p{gap:8px;display:flex;flex-direction:column;align-items:center;text-align:center}
.rv3-f2 .itemsC .textDet{height:auto;max-height:calc((var(--rv3-tsize,15px) + 5px)*8)}
.rv3-f2 .leftTxtDet{bottom:auto;margin-top:calc(var(--rv3-tsize,15px)*-1)}

/* Responsive */
@media only screen and (max-width:1350px){
.rv3 .carouselPre{grid-auto-columns:calc((100% - 2*var(--grid-column-gap))/(var(--rv3-cols,5) - 1))}
}
@media only screen and (max-width:750px){
.rv3 .carouselPre{height:auto;padding:0}
.rv3-m1 .carouselPre{grid-auto-columns:105%}
.rv3-m15 .carouselPre{grid-auto-columns:66%}
.rv3-m2 .carouselPre{grid-auto-columns:49%}
.rv3{padding:var(--rv3-mpad,16px)}
}