/* Cris Top Bar — alto FIJO de 56px (escritorio y móvil). Si cambias el alto,
   cámbialo en --ctb-h (un solo lugar). Paleta del sitio: #1a2416 / #e2b755. */
:root{--ctb-h:56px}

.ctb-bar{position:fixed;top:0;left:0;right:0;z-index:99998;box-sizing:border-box;height:var(--ctb-h);display:flex;overflow:hidden;background:#1a2416;border-bottom:1px solid rgba(226,183,85,.25)}
body.admin-bar .ctb-bar{top:32px}

/* .ctb-bar ocupa todo el ancho (fondo completo); .ast-container limita el
   contenido al ancho del sitio. Cada mitad es un <a> con el contenido
   centrado. El fondo del hover se dibuja con ::before y se extiende hasta el
   borde de la pantalla (izquierda hacia la izquierda, derecha hacia la derecha),
   sin JS. .ctb-bar tiene overflow:hidden, así que no genera scroll. */
.ctb-inner.ast-container{display:flex;align-items:stretch;gap:0;height:100%;width:100%;box-sizing:border-box}
.ctb-link{position:relative;isolation:isolate;flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:center;gap:10px;text-decoration:none!important}
.ctb-link::before{content:"";position:absolute;top:0;bottom:0;left:0;right:0;z-index:-1;background:transparent}
.ctb-link--left {justify-content: left;padding:0 12px 0 10px}
.ctb-link--right {justify-content: right;padding:0 0 0 12px}
.ctb-link--left::before{left:-100vw}
.ctb-link--right::before{right:-100vw}
.ctb-link:hover::before{background:rgba(226,183,85,.08)}
.ctb-link--right{border-left:1px solid rgba(226,183,85,.25)}

.ctb-text{min-width:0;font-size:.82rem;font-weight:600;color:#f2efe6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ctb-text--gold{color:#e2b755}

.ctb-badge{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;font-size:.72rem;font-weight:700;color:#e2b755;border:1.5px solid #e2b755;border-radius:999px;padding:4px 12px;white-space:nowrap}
.ctb-link:hover .ctb-badge{background:rgba(226,183,85,.12)}

/* Estado "Conectado": botón rojo con punto pulsante dentro, antes del texto. */
.ctb-badge--live{color:#fff;border-color:#c0392b;background:#c0392b}
.ctb-link:hover .ctb-badge--live{background:#a8301f}
.ctb-dot{width:8px;height:8px;border-radius:50%;background:#ff4d4d;animation:ctb-pulse 1.4s infinite}
@keyframes ctb-pulse{0%{box-shadow:0 0 0 0 rgba(255,77,77,.6)}70%{box-shadow:0 0 0 7px rgba(255,77,77,0)}100%{box-shadow:0 0 0 0 rgba(255,77,77,0)}}

/* Header fijo: se separa del top la misma altura de la barra (56px), y el
   body reserva ese espacio para que el contenido no quede tapado. */
header.site-header{top:var(--ctb-h)!important}
body.admin-bar header.site-header{top:calc(var(--ctb-h) + 32px)!important}
body{padding-top:var(--ctb-h)}

@media(max-width:782px){
body.admin-bar .ctb-bar{top:46px}
body.admin-bar header.site-header{top:calc(var(--ctb-h) + 46px)!important}
}
@media(max-width:768px){
.ctb-link{gap:6px}
.ctb-text{font-size:.72rem}
.ctb-badge{font-size:.64rem;padding:3px 8px}
}

@media(max-width:921px) {
   .ctb-link--left {padding-left:5px}
}