/* Rialva — iconos propios + buscador premium. Se carga después de rialva.css. */
.rvi { width:22px; height:22px; flex:none; overflow:visible; }
.rvi-i { display:inline-block !important; width:1.15em; height:1.15em; vertical-align:-.2em; margin-inline-end:.1em; }
.rvi .d { fill:currentColor; fill-opacity:.13; stroke:none; transition:fill-opacity .25s var(--ease); }
.icon-btn:hover .rvi .d, .rv-kind:hover .rvi .d, #bnHome:hover .rvi .d, .bottom-nav a:hover .rvi .d, [aria-current="page"] .rvi .d, .rv-kind[aria-pressed="true"] .rvi .d { fill-opacity:.26; }
.rv-kind[aria-pressed="true"] .rvi .d { fill:#fff; fill-opacity:.28; }

/* micro-animaciones de los iconos del encabezado */
.icon-btn .rvi { transition:transform .35s var(--spring); transform-origin:50% 12%; }
#msgBtn:hover .rvi { transform:translateY(-1px) rotate(-6deg) scale(1.08); }
#bagBtn:hover .rvi, #bnBag:hover .rvi { transform:translateY(-2px) scale(1.1); }
#bellBtn:hover .rvi { animation:rv-ring .7s var(--ease); }
@keyframes rv-ring { 0%,100% { transform:rotate(0) } 20% { transform:rotate(14deg) } 40% { transform:rotate(-12deg) } 60% { transform:rotate(8deg) } 80% { transform:rotate(-4deg) } }
.zone-btn .rvi { width:20px; height:20px; transition:transform .35s var(--spring); } .zone-btn:hover .rvi:first-child { transform:translateY(-2px) scale(1.1); }

/* ---- buscador ---- */
.head-search { --sg-blue:var(--rv-blue,#2463D4); }
.head-search input { transition:border-color .25s var(--ease), box-shadow .3s var(--ease), background-color .25s var(--ease), transform .3s var(--spring); }
.head-search.sg-focus input { border-color:var(--sg-blue); box-shadow:0 0 0 4px color-mix(in srgb, var(--sg-blue) 16%, transparent), 0 10px 28px -12px color-mix(in srgb, var(--sg-blue) 45%, transparent); outline:none; }
.head-search.sg-open input { border-bottom-left-radius:6px; border-bottom-right-radius:6px; }
.head-search > button { transition:background-color .2s var(--ease), color .2s var(--ease), transform .3s var(--spring); }
.head-search > button .rvi { width:20px; height:20px; transition:transform .4s var(--spring); }
.head-search.sg-focus > button { color:var(--sg-blue); } .head-search > button:hover { background:var(--rv-blue-soft,#EAF1FD); }
.head-search.sg-focus > button .rvi { transform:scale(1.08) rotate(-8deg); }
.head-search > button.pop { animation:sg-pop .45s var(--spring); } @keyframes sg-pop { 0% { transform:scale(1) } 40% { transform:scale(.82) } 100% { transform:scale(1) } }
.head-search.sg-busy > button .rvi { animation:sg-orbit .9s linear infinite; transform-origin:45% 45%; } @keyframes sg-orbit { to { transform:rotate(360deg) } }
.sg-bar { position:absolute; left:14px; right:14px; bottom:0; height:2px; border-radius:2px; overflow:hidden; opacity:0; pointer-events:none; transition:opacity .2s; }
.sg-bar::after { content:""; position:absolute; inset:0; width:40%; background:linear-gradient(90deg,transparent,var(--sg-blue),transparent); transform:translateX(-100%); }
.head-search.sg-busy .sg-bar { opacity:1; } .head-search.sg-busy .sg-bar::after { animation:sg-slide 1s var(--ease) infinite; } @keyframes sg-slide { to { transform:translateX(250%) } }

.sg-panel { position:absolute; z-index:60; left:0; width:max(100%,min(400px,92vw));  top:calc(100% + 6px); max-height:min(70vh,460px); overflow-y:auto; overflow-x:hidden; padding:8px; background:color-mix(in srgb, var(--rv-white,#fff) 94%, transparent); -webkit-backdrop-filter:blur(14px) saturate(1.4); backdrop-filter:blur(14px) saturate(1.4); border:1px solid var(--rv-line,#D9DFEA); border-radius:var(--rv-r-md,16px); box-shadow:0 24px 48px -18px rgba(24,33,47,.28), 0 2px 6px rgba(24,33,47,.06); transform-origin:50% 0; animation:sg-in .28s var(--spring); overscroll-behavior:contain; }
.sg-panel[hidden] { display:none; } @keyframes sg-in { from { opacity:0; transform:translateY(-8px) scale(.97) } to { opacity:1; transform:none } }
.sg-h { font:700 11.5px/1 Inter,system-ui,sans-serif; letter-spacing:.08em; text-transform:uppercase; color:var(--rv-ink-2,#586475); padding:10px 10px 6px; }
.sg-row { display:flex; align-items:center; gap:12px; padding:8px 10px; min-height:56px; border-radius:12px; color:var(--rv-ink,#18212F); text-decoration:none; opacity:0; transform:translateY(6px); animation:sg-row .34s var(--ease) forwards; animation-delay:calc(var(--i,0) * 38ms); transition:background-color .15s, transform .2s var(--ease); }
@keyframes sg-row { to { opacity:1; transform:none } }
.sg-row:hover, .sg-row.on { background:var(--rv-blue-soft,#EAF1FD); } .sg-row.on { box-shadow:inset 3px 0 0 var(--sg-blue); }
.sg-th { width:44px; height:44px; flex:none; border-radius:12px; overflow:hidden; display:grid; place-items:center; background:hsl(var(--h,215) 70% 90%); color:hsl(var(--h,215) 45% 30%); }
.sg-th img { width:100%; height:100%; object-fit:cover; } .sg-th .rvi { width:22px; height:22px; }
.sg-tx { flex:1; min-width:0; display:grid; gap:2px; } .sg-tx b { font:600 15px/1.25 Inter,sans-serif; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .sg-tx small { font:500 13px/1.2 Inter,sans-serif; color:var(--rv-ink-2,#586475); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sg-tx mark { background:color-mix(in srgb, var(--rv-lime,#DDEA32) 70%, transparent); color:inherit; border-radius:4px; padding:0 1px; box-shadow:0 0 0 1px color-mix(in srgb, var(--rv-lime,#DDEA32) 70%, transparent); animation:sg-mark .4s var(--ease); } @keyframes sg-mark { from { background-size:0 } }
.sg-go { width:18px; height:18px; color:var(--sg-blue); opacity:0; transform:translateX(-6px); transition:opacity .2s, transform .25s var(--spring); } .sg-row:hover .sg-go, .sg-row.on .sg-go { opacity:1; transform:none; }
.sg-panel .sg-all { position:static; right:auto; top:auto; height:auto; width:100%; padding:0 12px; display:flex; align-items:center; justify-content:center; gap:8px; min-height:48px; margin-top:6px; border:0; border-radius:12px; background:var(--sg-blue); color:#fff; font:600 14px Inter,sans-serif; cursor:pointer; transition:filter .2s, transform .2s var(--spring); } .sg-panel .sg-all:hover { filter:brightness(.95); transform:translateY(-1px); } .sg-panel .sg-all:active { transform:scale(.98); } .sg-panel .sg-all .rvi { width:18px; height:18px; transition:transform .25s var(--spring); } .sg-panel .sg-all:hover .rvi { transform:translateX(3px); }
.sg-empty { display:grid; justify-items:center; gap:6px; padding:26px 16px; text-align:center; color:var(--rv-ink-2,#586475); } .sg-empty .rvi { width:34px; height:34px; color:var(--sg-blue); animation:sg-float 2.4s ease-in-out infinite; } .sg-empty b { color:var(--rv-ink,#18212F); font:600 15px Inter,sans-serif; } .sg-empty span { font:500 13px Inter,sans-serif; }
@keyframes sg-float { 50% { transform:translateY(-4px) } }
@media (max-width:900px) { .sg-panel { max-height:60vh; } }
@media (prefers-reduced-motion:reduce) { .sg-panel, .sg-row, .sg-empty .rvi, .head-search.sg-busy .sg-bar::after, .head-search.sg-busy > button .rvi, #bellBtn:hover .rvi, .head-search > button.pop, .sg-tx mark { animation:none !important; } .sg-row { opacity:1; transform:none; } .icon-btn .rvi, .head-search button .rvi, .head-search input { transition:none; } }

/* ===== Degradado azul + limón (acentos premium; web y móvil) ===== */
:root { --rv-grad: linear-gradient(135deg,#1B4FB8 0%,#2463D4 48%,#4F86E8 100%); --rv-grad-lime: linear-gradient(120deg,#2463D4 0%,#2D6FE0 55%,#DDEA32 140%); --rv-lime-glow: radial-gradient(120% 140% at 100% 0%, rgba(221,234,50,.55) 0%, rgba(221,234,50,0) 55%); }
/* cinta fina en el encabezado */
body.store .header { position:sticky; border-bottom-color:transparent; box-shadow:0 1px 0 var(--rv-line), 0 10px 24px -22px rgba(36,99,212,.55); }
body.store .header::before { content:""; position:absolute; left:0; right:0; top:0; height:3px; background:linear-gradient(90deg,#2463D4 0%,#4F86E8 55%,#DDEA32 100%); pointer-events:none; }
/* botones principales */
body.store .btn:not(.ghost):not(.danger):not(.rp-ask), .rv-cta { background:var(--rv-grad); background-size:140% 140%; border-color:transparent; color:#fff; box-shadow:0 8px 18px -10px rgba(36,99,212,.8), inset 0 1px 0 rgba(255,255,255,.25); transition:background-position .45s var(--ease), transform .2s var(--spring), box-shadow .25s; }
body.store .btn:not(.ghost):not(.danger):not(.rp-ask):hover, .rv-cta:hover { background-position:100% 50%; box-shadow:0 12px 22px -10px rgba(36,99,212,.9), 0 0 0 3px rgba(221,234,50,.45); }
/* tarjetas de tipo (Comida / Productos / Servicios) activas */
.rv-kind[aria-pressed="true"] { background:var(--rv-grad); border-color:transparent; box-shadow:0 10px 22px -12px rgba(36,99,212,.9); position:relative; overflow:hidden; }
.rv-kind[aria-pressed="true"]::after { content:""; position:absolute; inset:0; background:var(--rv-lime-glow); pointer-events:none; }
.rv-kind:not([aria-pressed="true"]):hover { background:linear-gradient(135deg,var(--rv-blue-soft,#EAF1FD),#F7FAD6); }
/* chips y barra "Continuar pedido" */
.rv-chip[aria-pressed="true"] { background:linear-gradient(135deg,var(--rv-blue-soft,#EAF1FD),#F2F8B8); }
.rv-cont.cart { background:var(--rv-grad-lime); box-shadow:0 14px 28px -16px rgba(36,99,212,.9); }
.rv-cont:not(.cart) { background:linear-gradient(120deg,var(--rv-blue-soft,#EAF1FD) 0%,#F4F9C9 160%); }
/* títulos de sección con subrayado degradado */
.rv-sec-h h2 { position:relative; padding-bottom:8px; }
.rv-sec-h h2::after { content:""; position:absolute; left:0; bottom:0; width:44px; height:4px; border-radius:4px; background:linear-gradient(90deg,#2463D4,#DDEA32); }
/* portada: brillo limón en la esquina */
.rv-hero { position:relative; } .rv-hero::after { content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; background:radial-gradient(60% 70% at 100% 0%, rgba(221,234,50,.22), transparent 60%), linear-gradient(180deg, transparent 60%, rgba(36,99,212,.18)); }
/* barra inferior móvil: indicador degradado */
.bottom-nav [aria-current="page"]::before { background:linear-gradient(90deg,#2463D4,#DDEA32) !important; }
.bottom-nav { border-top:0; box-shadow:0 -1px 0 var(--rv-line), 0 -14px 28px -22px rgba(36,99,212,.6); }
/* insignias y buscador */
.badge { background:linear-gradient(135deg,#2463D4,#4F86E8); }
.head-search.sg-focus input { box-shadow:0 0 0 4px rgba(221,234,50,.35), 0 10px 28px -12px rgba(36,99,212,.5); }
/* pie de página */
.footer { position:relative; background:linear-gradient(180deg,#fff 0%,#F3F7FE 100%); } .footer::before { content:""; position:absolute; left:0; right:0; top:-1px; height:3px; background:linear-gradient(90deg,#2463D4,#4F86E8 60%,#DDEA32); }
@media (prefers-reduced-motion:reduce) { body.store .btn, .rv-cta { transition:none; } }

/* ===== Fondo con degradados suaves azul + limón (detrás del contenido) ===== */
body.store { background-color:var(--rv-surface,#F4F6FA); position:relative; isolation:isolate; }
body.store::before { content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(48% 38% at 100% 0%, rgba(221,234,50,.42) 0%, rgba(221,234,50,0) 70%),
    radial-gradient(55% 45% at 0% 18%, rgba(36,99,212,.27) 0%, rgba(36,99,212,0) 70%),
    radial-gradient(50% 40% at 100% 62%, rgba(36,99,212,.22) 0%, rgba(36,99,212,0) 70%),
    radial-gradient(45% 35% at 0% 100%, rgba(221,234,50,.36) 0%, rgba(221,234,50,0) 70%); }
body.store .shell, body.store main { background:transparent; }
@media (max-width:700px) { body.store::before { background:
    radial-gradient(70% 28% at 100% 0%, rgba(221,234,50,.42) 0%, rgba(221,234,50,0) 70%),
    radial-gradient(80% 32% at 0% 38%, rgba(36,99,212,.27) 0%, rgba(36,99,212,0) 70%),
    radial-gradient(80% 30% at 100% 72%, rgba(221,234,50,.32) 0%, rgba(221,234,50,0) 70%),
    radial-gradient(90% 30% at 0% 100%, rgba(36,99,212,.25) 0%, rgba(36,99,212,0) 70%); } }
