/* Variantes de la banda de chips del header azul (subdominio de prueba azul-chips). Se activan con clase en : chips-white (banda blanca) | chips-paper (funde con la página). Sin clase = azul actual. Reusa el lenguaje de chips claros del header central (.hdr-chip). */ /* ---- común a ambas variantes: la banda sangra fuera del padding del .bb-hd ---- */ html.chips-white .bb-chips, html.chips-paper .bb-chips{ margin:14px -16px -14px; padding:11px 16px 13px; } html.chips-white .bb-chip, html.chips-paper .bb-chip{ border:1px solid var(--line); background:#fff; color:var(--ink); font-weight:600; height:40px; font-size:14.5px; } html.chips-white .bb-chip:hover, html.chips-paper .bb-chip:hover{background:#fff;border-color:var(--azul);color:var(--azul-deep)} html.chips-white .bb-chip svg, html.chips-paper .bb-chip svg{color:var(--azul)} html.chips-white .bb-deliv, html.chips-paper .bb-deliv{border-color:rgba(196,101,14,.4)} html.chips-white .bb-deliv b, html.chips-paper .bb-deliv b{color:var(--naranja-ink)} html.chips-white .bb-deliv svg, html.chips-paper .bb-deliv svg{color:var(--naranja-ink)} /* ---- V1: banda BLANCA (plano propio, corte limpio con la página) ---- */ html.chips-white .bb-chips{background:#fff;border-bottom:1px solid rgba(23,25,28,.08)} html.chips-white .bb-chip{border-color:rgba(23,25,28,.14)} /* ---- V2: banda "TRANSPARENTE" (toma el gris de la página, se funde sin costura) ---- */ html.chips-paper .bb-chips{background:var(--paper)} @media(min-width:1000px){ html.chips-white .bb-chips, html.chips-paper .bb-chips{margin:16px -44px -16px;padding:12px 44px 14px} } /* condensado en scroll: colapsar también el padding propio de la banda */ html.scrolled.chips-white .bb-chips, html.scrolled.chips-paper .bb-chips{padding-top:0;padding-bottom:0;margin-bottom:0} /* ---- conmutador flotante del subdominio de prueba ---- */ #chipsSwitch{position:fixed;left:12px;bottom:12px;z-index:90;display:flex;gap:4px;background:rgba(23,25,28,.88);backdrop-filter:blur(6px);border-radius:999px;padding:4px;box-shadow:0 4px 16px rgba(0,0,0,.25);font-family:var(--body)} #chipsSwitch button{border:none;background:none;color:rgba(255,255,255,.75);font-family:inherit;font-size:12px;font-weight:600;padding:7px 12px;border-radius:999px;cursor:pointer;white-space:nowrap} #chipsSwitch button.on{background:#fff;color:#17191C} @media(max-width:420px){#chipsSwitch button{padding:7px 10px;font-size:11.5px}}