/* =========================================================
   BigBattery – Barra "Free shipping" con camión animado
   ========================================================= */
.gt-ann {
  position: relative; overflow: hidden;
  display: flex; align-items: center; min-height: 28px;
  background: linear-gradient(90deg, #0b2a4a 0%, #155ea0 50%, #0b2a4a 100%);
  color: #dbeafe; font-size: 13px; line-height: 1.3;
}
/* Brillo que cruza la barra */
.gt-ann::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: -30%; width: 30%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent);
  animation: gtShine 6s ease-in-out infinite; pointer-events: none;
}
@keyframes gtShine { 0% { left: -30%; } 60%, 100% { left: 130%; } }

.gt-ann__in {
  position: relative; z-index: 2;
  width: 100%; max-width: 1500px; margin: 0 auto; padding: 4px 32px; box-sizing: border-box;
  display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap;
}
.gt-ann__in span { text-shadow: 0 1px 2px rgba(11,42,74,.6); }
.gt-ann b { color: #fff; font-weight: 700; }
.gt-ann__sep { width: 4px; height: 4px; border-radius: 50%; background: rgba(255,255,255,.45); }

/* Espacio reservado donde se estaciona el camión */
.gt-truck-slot { display: inline-block; flex: none; width: 25px; height: 16px; }

/* Camión (por detrás del texto) */
.gt-truck {
  position: absolute; z-index: 1; top: 0; bottom: 0; left: 0; margin: auto 0;
  display: inline-flex; width: 25px; height: 16px; color: #fff;
  will-change: transform; transform: translateX(-40px);
}
.gt-truck svg { width: 100%; height: 100%; overflow: visible; }

/* Rebote del camión y líneas de velocidad (solo en movimiento) */
.gt-truck .gt-body { animation: gtBump .5s ease-in-out infinite; animation-play-state: paused; }
.gt-truck .gt-speed { opacity: 0; transition: opacity .3s ease; }
.gt-truck .gt-speed path {
  stroke: #7dd3fc; stroke-width: 2;
  animation: gtSpeed .6s linear infinite; animation-play-state: paused;
}
.gt-truck .gt-speed path:nth-child(2) { animation-delay: .2s; }
.gt-truck .gt-speed path:nth-child(3) { animation-delay: .4s; }
.gt-truck.is-moving .gt-speed { opacity: 1; }
.gt-truck.is-moving .gt-body,
.gt-truck.is-moving .gt-speed path { animation-play-state: running; }
@keyframes gtBump { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-.8px); } }
@keyframes gtSpeed { 0% { transform: translateX(5px); opacity: 0; } 25% { opacity: 1; } 100% { transform: translateX(-8px); opacity: 0; } }

/* Mini batería */
.gt-bat { opacity: 0; transform-box: fill-box; transform-origin: center; }
.gt-bat__lvl { transform-box: fill-box; transform-origin: bottom; }

/* Móvil: solo el mensaje principal */
@media (max-width: 600px) {
  .gt-ann__sep, .gt-ann__sep + span { display: none; }
}

/* Accesibilidad */
@media (prefers-reduced-motion: reduce) {
  .gt-ann::after, .gt-truck .gt-body, .gt-truck .gt-speed path { animation: none; }
}

/* Rotación Free shipping ↔ promo de temporada (Halloween / Black Friday) */
.gt-ann.has-promo{position:relative;overflow:hidden}
.gt-ann.has-promo .gt-ann__slide{position:relative;z-index:1;transition:opacity .5s ease,transform .5s ease}
.gt-ann.has-promo .gt-ann__promo{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;gap:10px;margin:0!important;max-width:none!important;width:auto!important;background:linear-gradient(90deg,#1c1917,#3b0764 50%,#1c1917);color:#fed7aa;font-size:14px;opacity:0;transform:translateY(8px);pointer-events:none}
.gt-ann__promo>span:not(.bb-hw-bweb){color:#fed7aa}
.gt-ann__promo .bb-hw-bweb{position:absolute;top:0;width:46px;height:28px;color:rgba(254,215,170,.35);pointer-events:none}
.gt-ann__promo .bb-hw-bweb--l{left:0}
.gt-ann__promo .bb-hw-bweb--r{right:0}
.gt-ann__promo .bb-hw-bweb svg{width:100%;height:100%;display:block}
.gt-ann.has-promo.show-promo .gt-ann__promo{opacity:1;transform:none;pointer-events:auto}
.gt-ann.has-promo.show-promo .gt-ann__slide:not(.gt-ann__promo){opacity:0;transform:translateY(-8px)}
.gt-ann.has-promo .gt-truck{z-index:3;transition:opacity .4s ease}
.gt-ann.has-promo.show-promo .gt-truck{opacity:0!important}
.gt-ann__promo strong{color:#fb923c;font-weight:800}
.gt-ann__promo .bb-hw-pumpkin{width:16px;height:16px;flex:none}

/* Black Friday slide inside .gt-ann (hides standalone .bb-bf-banner) */
.gt-ann.has-promo .gt-ann__promo--bf{background:#0b0b0c;color:#e7e5e4;gap:12px;overflow:hidden}
.gt-ann.has-promo .gt-ann__promo--bf::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(250,204,21,.18) 50%,transparent 70%);transform:translateX(-100%);animation:bb-bf-sweep 5s ease-in-out infinite;pointer-events:none}
.gt-ann__promo--bf>span{color:#e7e5e4}
.gt-ann__promo--bf .bb-bf-banner__tag{position:relative;z-index:1;flex:none;padding:3px 9px;border-radius:4px;background:#facc15;color:#0b0b0c;font-weight:900;font-size:12.5px;letter-spacing:.12em}
.gt-ann__promo--bf>span:not(.bb-bf-banner__tag){position:relative;z-index:1}
@keyframes bb-bf-sweep{0%,55%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){.gt-ann.has-promo .gt-ann__promo--bf::after{animation:none;display:none}}

@media (max-width:600px){ .gt-ann__promo>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:78vw} }
@media (prefers-reduced-motion:reduce){ .gt-ann.has-promo .gt-ann__slide{transition:none} }