/* ===== Rhino Banner Superior ===== */
.rhb-banner{
    position:relative; overflow:hidden; width:100%;
    background:linear-gradient(90deg,var(--rhb-bg1,#da1921),var(--rhb-bg2,#b3141b));
    color:var(--rhb-text,#fff);
    font-family:'Oswald',Poppins,system-ui,-apple-system,sans-serif;
    z-index:9990;
}
.rhb-inner{
    display:flex; align-items:center; gap:16px;
    max-width:1280px; margin:0 auto; padding:7px 20px; min-height:26px;
    position:relative; z-index:2;
}
.rhb-left{ flex:0 0 auto; display:flex; align-items:center; }
.rhb-center{ flex:1 1 auto; min-width:0; text-align:center; }
.rhb-right{ flex:0 0 auto; display:flex; align-items:center; gap:10px; }

/* ----- Contador ----- */
.rhb-countdown{ display:inline-flex; align-items:center; gap:8px; }
.rhb-cd-label{
    background:var(--rhb-accent,#FFD21E); color:#1a1a1a;
    font-weight:700; font-size:11px; letter-spacing:.6px; text-transform:uppercase;
    padding:3px 9px; border-radius:99px; line-height:1; white-space:nowrap;
}
.rhb-cd-time{
    font-variant-numeric:tabular-nums; font-weight:700; font-size:14px;
    letter-spacing:1px; color:var(--rhb-accent,#FFD21E); white-space:nowrap;
}

/* ----- Mensaje: Fade ----- */
.rhb-center{ font-size:14.5px; font-weight:500; letter-spacing:.3px; }
.rhb-fade{ display:grid; }
.rhb-fade .rhb-msg{
    grid-area:1/1; opacity:0; transform:translateY(4px);
    transition:opacity .5s ease, transform .5s ease; pointer-events:none;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.rhb-fade .rhb-msg.is-active{ opacity:1; transform:translateY(0); pointer-events:auto; }
.rhb-accent{ color:var(--rhb-accent,#FFD21E); font-weight:700; }

/* ----- Mensaje: LED ----- */
.rhb-led{
    overflow:hidden; white-space:nowrap;
    -webkit-mask-image:linear-gradient(to right, transparent 0, #000 8%, #000 92%, transparent 100%);
            mask-image:linear-gradient(to right, transparent 0, #000 8%, #000 92%, transparent 100%);
}
.rhb-led-track{ display:inline-flex; align-items:center; gap:0; animation:rhb-marquee var(--rhb-led-dur,34s) linear infinite; will-change:transform; }
.rhb-led-item{ padding:0 6px; }
.rhb-led-sep{ padding:0 10px; }
/* Separador = rinoceronte corriendo (oscila 10px adelante / 10px atrás) */
.rhb-led-rhino{ display:inline-block; font-size:0; line-height:1; padding:0 16px; animation:none; }
.rhb-led-rhino::before{ content:"|"; font-size:13px; font-weight:300; opacity:.45; }
@keyframes rhb-marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@keyframes rhb-rhino-trot{ from{ transform:translateX(-10px); } to{ transform:translateX(10px); } }
@media (prefers-reduced-motion:reduce){ .rhb-led-track{ animation:none; } .rhb-led-rhino{ animation:none; } }

/* ----- Acciones ----- */
.rhb-wa{
    display:inline-flex; align-items:center; justify-content:center; gap:7px;
    border:none; cursor:pointer; font:inherit; line-height:1;
    min-width:30px; min-height:30px; padding:6px 12px 6px 10px; border-radius:99px;
    background:#25D366; color:#fff !important;
    text-decoration:none !important; transition:transform .2s, box-shadow .2s, background .2s; flex-shrink:0;
}
.rhb-wa:not(:has(.rhb-wa-label)){ padding:6px; }   /* solo ícono = círculo */
.rhb-wa .rhb-wa-label{ font-weight:700; font-size:12.5px; letter-spacing:.3px; white-space:nowrap; }
.rhb-wa svg{ flex-shrink:0; }
.rhb-wa-ico{ width:20px; height:20px; object-fit:contain; display:block; flex-shrink:0; }
.rhb-wa:hover{ background:#1ebe5b; transform:translateY(-1px); box-shadow:0 5px 14px rgba(37,211,102,.5); }

/* Destello / pulso para invitar al clic */
.rhb-wa-pulse{ animation:rhb-wa-glow 2s ease-in-out infinite; }
@keyframes rhb-wa-glow{
    0%   { box-shadow:0 0 0 0 rgba(37,211,102,.55); }
    70%  { box-shadow:0 0 0 9px rgba(37,211,102,0); }
    100% { box-shadow:0 0 0 0 rgba(37,211,102,0); }
}
@media (prefers-reduced-motion:reduce){ .rhb-wa-pulse{ animation:none; } }
.rhb-buy{
    display:inline-flex; align-items:center; white-space:nowrap;
    background:#fff; color:var(--rhb-bg1,#da1921) !important;
    text-decoration:none !important; font-weight:700; font-size:13px;
    padding:7px 16px; border-radius:99px; letter-spacing:.4px;
    transition:transform .2s, box-shadow .2s; box-shadow:0 2px 8px rgba(0,0,0,.18);
}
.rhb-buy:hover{ transform:translateY(-1px); box-shadow:0 5px 14px rgba(0,0,0,.28); }

/* ----- Rinoceronte ----- */
.rhb-rhino{
    position:absolute; bottom:1px; left:-40px; z-index:1;
    font-size:20px; opacity:.18; pointer-events:none;
    animation:rhb-run var(--rhb-rhino-dur,17s) linear infinite;
}
@keyframes rhb-run{
    0%   { left:-40px; }
    18%  { left:100%; }
    100% { left:100%; }
}

/* ===== Variación B (Split smart): contador como panel + botón sólido ===== */
.rhb-var-b .rhb-countdown{
    background:rgba(0,0,0,.18); padding:4px 10px 4px 6px; border-radius:99px;
}
.rhb-var-b .rhb-center{ font-weight:600; }

/* ===== Responsive ===== */
@media (max-width:782px){
    .rhb-inner{ gap:10px; padding:6px 12px; }
    .rhb-cd-label{ display:none; }
    .rhb-center{ font-size:12.5px; }
    .rhb-buy{ font-size:11.5px; padding:6px 11px; }
    .rhb-cd-time{ font-size:12.5px; }
}
@media (max-width:480px){
    .rhb-left{ display:none; }                 /* en móvil prioriza mensaje + acciones */
    .rhb-right{ gap:7px; }
    .rhb-buy{ padding:5px 9px; font-size:11px; }
}