/* Estado operativo de tiendas: insignias, cuenta regresiva de la última hora y aspecto "cerrado" (catálogo siempre legible). */
.ss-pill { display: inline-flex; align-items: center; gap: 6px; width: fit-content; padding: 4px 11px; border-radius: 999px; font-size: 13px; font-weight: 700; line-height: 1.2; }
.ss-pill svg { flex: none; }
.ss-dot { width: 9px; height: 9px; border-radius: 50%; background: currentColor; display: inline-block; }
.ss-ok { background: #E6F6EC; color: #17683F; }
.ss-soon { background: #FFF1D6; color: #8A5300; }
.ss-closed, .ss-pause { background: #E8EBF0; color: #2B3550; }
.ss-vac { background: #E4EEFF; color: #1B4FB5; }
.ss-soon svg { animation: ss-pulse 1.6s ease-in-out infinite; }
.ss-when { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; color: var(--rv-ink-2, #4A5568); }

/* Portada + logo circular con borde blanco en las tarjetas de la portada de inicio */
.rv-store.cv { display: block; padding: 0; overflow: hidden; }
.rv-store.cv .rs-cover { position: relative; aspect-ratio: 16 / 7; background: linear-gradient(140deg, #2864D7, #14213D); overflow: visible; display: block; }
.rv-store.cv .rs-cover img.cv { width: 100%; height: 100%; object-fit: cover; display: block; }
.rv-store.cv .rs-logo { position: absolute; left: 14px; bottom: -26px; width: 56px; height: 56px; border-radius: 50%; border: 3px solid #fff; background: #fff; overflow: hidden; display: grid; place-items: center; box-shadow: 0 2px 8px rgba(20, 33, 61, .18); z-index: 2; }
.rv-store.cv .rs-logo img { width: 100%; height: 100%; object-fit: cover; }
.rv-store.cv .rs-main { padding: 34px 14px 14px; display: grid; gap: 6px; }
.rv-store.cv .rs-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.rv-store.cv .rs-row h3 { flex: 1 1 140px; }
.rv-store.cv .btn { width: 100%; }

/* Cerrado / vacaciones: solo se desatura la imagen; el texto, los iconos y la navegación conservan contraste */
.is-closed .rs-cover img.cv, .is-closed img.shop-cover, .is-closed .rp-img img { filter: grayscale(1) brightness(.92); }

/* Cabecera de tienda */
.ss-shop-cover { position: relative; aspect-ratio: 16 / 6; border-radius: 18px; overflow: hidden; background: linear-gradient(140deg, #2864D7, #14213D); margin: 0 0 12px; }
.ss-shop-cover img.shop-cover { width: 100%; height: 100%; object-fit: cover; display: block; }
.ss-banner { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 16px; margin: 10px 0; }
.ss-banner p { margin: 0; }
.ss-b-t { font-weight: 800; font-size: 17px; } .ss-b-s { font-size: 14px; opacity: .85; }
.ss-b-soon { background: #FFF4DE; color: #6B4200; border: 1px solid #F3D9A4; }
.ss-b-closed { background: #EEF1F6; color: #2B3550; border: 1px solid #DCE2EC; }
.ss-time { font-variant-numeric: tabular-nums; font-size: 1.25em; color: #B35F00; letter-spacing: .01em; }
.ss-ring { --p: 1; flex: none; width: 44px; height: 44px; border-radius: 50%; background: conic-gradient(#E58A00 calc(var(--p) * 360deg), #F3D9A4 0); position: relative; animation: ss-pulse 1.8s ease-in-out infinite; }
.ss-ring::after { content: ""; position: absolute; inset: 6px; border-radius: 50%; background: #FFF4DE; }
@keyframes ss-pulse { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.06); opacity: .85; } }
@media (prefers-reduced-motion: reduce) { .ss-ring, .ss-soon svg { animation: none; } }
@media (max-width: 480px) { .ss-b-t { font-size: 16px; } }

/* Reseñas: estrellas en tarjetas de producto y diálogo con dos reseñas (tienda y productos) */
.rp-stars { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; margin: 2px 0; }
.rv-sec { border: 1px solid var(--rv-line, #E3E8F0); border-radius: 14px; padding: 10px 12px; margin: 10px 0; }
.rv-sec h4 { margin: 0 0 4px; font-size: 15px; }
.rv-prod { padding: 8px 0; border-top: 1px solid var(--rv-line, #E3E8F0); display: grid; gap: 4px; }
.rv-prod:first-of-type { border-top: 0; }
.rv-prod .rate-stars { justify-content: flex-start; }
.rv-prod .rate-glyph { font-size: 26px; }
.rv-prod .rv-pc { min-height: 40px; border: 1px solid var(--rv-line, #D5DCE8); border-radius: 10px; padding: 0 10px; font: inherit; }

/* Cuenta regresiva dentro de la insignia "Cierra pronto" de las tarjetas de tienda */
.ss-pill .ss-pill-cd { font-size:1em; font-weight:800; color:inherit; margin-left:2px; }
.rs-row { flex-wrap:wrap; row-gap:6px; }

/* Defecto 8: horarios plegados, un solo aviso */
.ss-hours { margin:4px 0 6px; font-size:14px; } .ss-hours > summary { cursor:pointer; color:var(--rv-blue,#2463D4); font-weight:600; min-height:32px; display:inline-flex; align-items:center; }
.ss-hours ul { list-style:none; margin:6px 0 0; padding:8px 12px; border:1px solid var(--line,#D9DFEA); border-radius:12px; background:var(--card,#fff); display:grid; gap:4px; max-width:320px; }
.ss-hours li { display:flex; justify-content:space-between; gap:12px; } .ss-hours li.today { font-weight:700; } .ss-hours b { font-weight:600; font-variant-numeric:tabular-nums; }

/* "Abre pronto": cuenta regresiva en azul durante los últimos 30 minutos antes de abrir */
.ss-opening { background:#E4EEFF; color:#1B4FB0; } .ss-opening svg { animation:ss-pulse 1.6s ease-in-out infinite; }
.ss-b-opening { background:#E4EEFF; color:#12356F; border:1px solid #B9D0F7; } .ss-b-opening .ss-time { color:#1B4FB0; }
.ss-b-opening .ss-ring { border-color:#B9D0F7; }
@media (prefers-reduced-motion: reduce) { .ss-opening svg { animation:none; } }
.ss-b-opening .ss-ring { background:conic-gradient(#1B4FB0 calc(var(--p) * 360deg), #B9D0F7 0); } .ss-b-opening .ss-ring::after { background:#E4EEFF; }

/* ======== Letrero de estado (ABIERTO / CERRADO) y su insignia compacta ======== */
.rsign { position: relative; isolation: isolate; display: flex; align-items: center; gap: clamp(12px, 3vw, 22px); padding: clamp(12px, 3vw, 20px) clamp(14px, 3.5vw, 26px); margin: 10px 0 14px; border-radius: clamp(20px, 5vw, 32px); color: #fff; overflow: hidden; box-shadow: 0 10px 26px rgba(14, 27, 51, .18); animation: rs-in .3s ease both; }
.rsign-open { background: linear-gradient(110deg, #1953DA, #3079F7); }
.rsign-closed { background: linear-gradient(110deg, #C52741, #ED4B5E); }
.rsign::after { content: ""; position: absolute; right: -7%; bottom: -46%; width: 30%; height: 82%; border-radius: 50%; background: #16D6C6; opacity: .85; z-index: -1; }
.rsign-closed::after { width: 20%; right: -4%; bottom: -52%; opacity: .75; }
.rsign > * { position: relative; z-index: 1; }
.rs-ico { flex: none; width: clamp(54px, 15vw, 88px); aspect-ratio: 1; border-radius: 24%; display: grid; place-items: center; background: rgba(255, 255, 255, .2); border: 1px solid rgba(255, 255, 255, .35); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35); }
.rs-ico svg { width: 62%; height: 62%; }
.rs-tx { min-width: 0; display: grid; gap: 2px; }
.rs-tx small { font: 700 clamp(10px, 2.6vw, 13px)/1.2 Inter, system-ui, sans-serif; letter-spacing: .2em; opacity: .95; }
.rs-tx b { font: 900 clamp(30px, 10vw, 58px)/1 Manrope, Inter, system-ui, sans-serif; letter-spacing: -.01em; text-shadow: 0 2px 10px rgba(0, 0, 0, .18); }
.rs-tx span { font: 600 clamp(13px, 3.6vw, 17px)/1.25 Inter, system-ui, sans-serif; }
.rs-dot { position: absolute !important; top: 14px; right: 16px; width: 14px; height: 14px; border-radius: 50%; background: #fff; }
.rs-dot::after { content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .7); opacity: 0; animation: rs-pulse 2.5s ease-out infinite; }
.rs-star { position: absolute !important; top: 12px; right: 16px; width: 22px; height: 22px; color: #fff; animation: rs-star 2.4s ease-in-out infinite; } .rs-star svg { width: 100%; height: 100%; display: block; }
.rsign-open::before { content: ""; position: absolute; inset: 0; z-index: 0; background: linear-gradient(105deg, transparent 38%, rgba(255, 255, 255, .22) 50%, transparent 62%); transform: translateX(-130%); animation: rs-sheen 6s ease-in-out infinite; }
.rsign-open .rs-ico svg { animation: rs-bob 4s ease-in-out infinite; }
.rsign-closed .rs-ico svg { animation: rs-moon 3.6s ease-in-out infinite alternate; transform-origin: 50% 60%; }
@keyframes rs-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes rs-pulse { 0% { transform: scale(.6); opacity: .9; } 70%, 100% { transform: scale(1.6); opacity: 0; } }
@keyframes rs-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
@keyframes rs-sheen { 0%, 70% { transform: translateX(-130%); } 100% { transform: translateX(130%); } }
@keyframes rs-moon { from { transform: rotate(-8deg); } to { transform: rotate(8deg); } }
@keyframes rs-star { 0%, 100% { transform: scale(.85); opacity: .6; } 50% { transform: scale(1.15); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .rsign, .rsign *, .rsign::before { animation: none !important; } .rsign-open::before { display: none; } .rs-dot::after { display: none; } }
/* insignia compacta (catálogo): mismos colores y símbolos */
.ss-open, .ss-shut { color: #fff; gap: 5px; padding-inline: 10px; font-weight: 700; border: 0; }
.ss-open { background: linear-gradient(110deg, #1953DA, #3079F7); } .ss-shut { background: linear-gradient(110deg, #C52741, #ED4B5E); }
.ss-mi { display: inline-grid; width: 16px; height: 16px; } .ss-mi svg { width: 100%; height: 100%; stroke-width: 3.6; }
.rs-tx small { padding-right: 22px; }
@media (max-width: 380px) { .rs-tx small { letter-spacing: .08em; font-size: 10px; } .rsign { gap: 10px; padding-inline: 12px; } .rs-ico { width: 50px; } }

/* Cabecera de tienda y horarios en móvil: logo arriba, texto a ancho completo, horas alineadas sin partirse */
.ss-hours li { display:grid; grid-template-columns:minmax(78px,auto) 1fr; align-items:baseline; column-gap:14px; }
.ss-hours li b { text-align:right; white-space:nowrap; }
.ss-hours li.today { color:var(--rv-blue,#2463D4); }
.ss-hours ul { max-width:360px; width:100%; box-sizing:border-box; }
@media (max-width: 640px) {
  .shop-head { flex-direction:column; align-items:flex-start; gap:10px; }
  .shop-head > div { width:100%; min-width:0; }
  .shop-head img.avatar { width:76px; height:76px; margin-top:-40px; position:relative; z-index:2; box-shadow:0 6px 18px rgba(14,27,51,.18); }
  .ss-hours ul { max-width:none; }
  .ss-hours li { font-size:15px; }
}