/* SWT Eleições Ao Vivo v1.1 */

/* ── BARRA FIXA ─────────────────────────────────────────────────── */
.swt-el-bar {
    position: fixed; top: 0; left: 0; right: 0;
    z-index: 99999;
    background: #07090F;
    border-bottom: 2px solid rgba(255,255,255,.08);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
    color: #DDE4F0;
    box-sizing: border-box;
}
body.has-swt-el-bar { padding-top: 100px !important; }
.admin-bar .swt-el-bar,
.admin-bar #swt-el-bar { top: 32px !important; }
@media screen and (max-width:782px){
    .admin-bar .swt-el-bar,
    .admin-bar #swt-el-bar { top: 46px !important; }
}

/* ── linha principal ────────────────────────────────────────────── */
.swt-el-main {
    height: 76px;
    display: grid;
    grid-template-columns: auto auto 1fr auto 1fr auto auto;
    align-items: center;
    padding: 0 14px;
    gap: 10px;
    border-bottom: 1px solid rgba(255,255,255,.05);
}

/* ── badge ao vivo ─────────────────────────────────────────────── */
.swt-el-live {
    display: flex; align-items: center; gap: 5px;
    background: #C62828; color: #fff;
    font-size: 10px; font-weight: 700; letter-spacing: 1.4px;
    text-transform: uppercase; padding: 3px 8px; border-radius: 3px;
    white-space: nowrap; flex-shrink: 0;
}
.swt-el-live::before {
    content: ''; width: 6px; height: 6px;
    background: #fff; border-radius: 50%;
    animation: swt-dot 1.1s ease-in-out infinite;
}
@keyframes swt-dot {
    0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.3;transform:scale(.6)}
}

/* ── título ─────────────────────────────────────────────────────── */
.swt-el-bar-hd {
    border-right: 1px solid rgba(255,255,255,.08);
    padding-right: 12px; flex-shrink: 0;
}
.swt-el-bar-hd strong { display:block; font-size: 12px; font-weight:700; white-space:nowrap; }
.swt-el-bar-hd span   { display:block; font-size: 10px; color: #5A6585; white-space:nowrap; }

/* ── candidato ─────────────────────────────────────────────────── */
.swt-el-cand { display:flex; align-items:center; gap:8px; min-width:0; }
.swt-el-cand--r { flex-direction:row-reverse; }

.swt-el-foto {
    width:46px; height:46px; border-radius:50%;
    object-fit:cover; object-position:center top; flex-shrink:0;
    border: 2px solid rgba(255,255,255,.15);
}
.swt-el-fb {
    width:46px; height:46px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-size:16px; font-weight:800; color:#fff; flex-shrink:0;
    border: 2px solid rgba(255,255,255,.15);
}

.swt-el-ci { min-width:0; }
.swt-el-cand--r .swt-el-ci { text-align:right; }

.swt-el-nome {
    font-weight:700; font-size:13px;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.swt-el-pto {
    display:inline-block; font-size:10px; font-weight:700;
    letter-spacing:.6px; padding:1px 5px; border-radius:2px;
    color:#fff; margin-top:2px;
}
.swt-el-pct {
    font-size:22px; font-weight:800; line-height:1; margin-top:2px;
    font-variant-numeric:tabular-nums;
}
/* comparação 1.º turno */
.swt-el-t1 {
    font-size:10px; color:#5A6585; margin-top:1px;
    font-variant-numeric:tabular-nums;
}
.swt-el-t1-up   { color:#4CAF50; }
.swt-el-t1-down { color:#EF5350; }

/* ── barras centrais ────────────────────────────────────────────── */
.swt-el-bars { display:flex; flex-direction:column; gap:3px; min-width:0; }
.swt-el-bar-track {
    height:6px; background:rgba(255,255,255,.1); border-radius:4px;
    display:flex; overflow:hidden;
}
.swt-el-bf0, .swt-el-bf1 {
    height:100%; transition:width 1.3s cubic-bezier(.4,0,.2,1);
}
.swt-el-bar-nums {
    display:flex; justify-content:space-between;
    font-size:10px; color:#5A6585; font-variant-numeric:tabular-nums;
}

/* ── apuração ───────────────────────────────────────────────────── */
.swt-el-ap { text-align:center; flex-shrink:0; min-width:68px; }
.swt-el-ap-pct {
    font-size:18px; font-weight:800; line-height:1; color:#fff;
    font-variant-numeric:tabular-nums;
}
.swt-el-ap-label { font-size:9px; color:#5A6585; text-transform:uppercase; letter-spacing:.8px; margin-top:1px; }
.swt-el-ap-track { height:3px; background:rgba(255,255,255,.1); border-radius:2px; margin-top:4px; overflow:hidden; }
.swt-el-ap-fill  { height:100%; background:#3B82F6; border-radius:2px; transition:width 1.3s cubic-bezier(.4,0,.2,1); }

/* ── relógio ─────────────────────────────────────────────────────── */
.swt-el-clock { font-size:13px; font-weight:600; color:#5A6585; flex-shrink:0; font-variant-numeric:tabular-nums; }

/* ── faixa de abas ──────────────────────────────────────────────── */
.swt-el-tabs {
    height: 24px;
    display: flex; align-items: center;
    padding: 0 14px; gap: 2px;
    overflow-x: auto; scrollbar-width: none;
}
.swt-el-tabs::-webkit-scrollbar { display:none; }

.swt-el-tab {
    height: 20px;
    padding: 0 10px;
    border: none; outline: none; cursor: pointer;
    border-radius: 3px;
    font-size: 10px; font-weight: 700; letter-spacing: .7px;
    text-transform: uppercase; white-space: nowrap;
    background: transparent; color: #5A6585;
    transition: background .15s, color .15s;
    font-family: inherit;
}
.swt-el-tab:hover  { background: rgba(255,255,255,.07); color: #DDE4F0; }
.swt-el-tab.active { background: rgba(255,255,255,.1);  color: #fff; }

/* ── loading ────────────────────────────────────────────────────── */
.swt-el-loading-msg {
    font-size: 12px; color: #5A6585; grid-column: 3 / -2; text-align: center;
}
.swt-el-bar:not(.swt-el-bar--loading) .swt-el-loading-msg { display: none; }

/* ── PAINEL (shortcode) ─────────────────────────────────────────── */
.swt-el-panel {
    background: #07090F;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 8px; overflow: hidden;
    color: #DDE4F0;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
    margin: 16px 0;
}
.swt-el-panel-hd {
    display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap;
    padding: 12px 16px; gap: 8px;
    background: #111520; border-bottom: 1px solid rgba(255,255,255,.07);
}
.swt-el-panel-title { font-weight:700; font-size:14px; }
.swt-el-panel-tabs  { display:flex; gap:4px; overflow-x:auto; }

.swt-el-ptab {
    padding: 4px 12px; border-radius: 4px; border: none; cursor:pointer;
    font-size: 11px; font-weight:700; letter-spacing:.6px;
    text-transform:uppercase; white-space:nowrap; font-family:inherit;
    background: rgba(255,255,255,.07); color: #8390AD;
    transition: background .15s, color .15s;
}
.swt-el-ptab:hover  { background: rgba(255,255,255,.12); color: #DDE4F0; }
.swt-el-ptab.active { background: rgba(255,255,255,.15); color: #fff; }

.swt-el-panel-body { padding: 16px; display:flex; flex-direction:column; gap:12px; }

.swt-el-pcand {
    display: grid; grid-template-columns: 56px 1fr auto;
    gap: 10px 12px; align-items: center;
}
.swt-el-pfoto {
    width:56px; height:56px; border-radius:50%;
    object-fit:cover; object-position:center top;
    border: 2px solid rgba(255,255,255,.15);
}
.swt-el-pfb {
    width:56px; height:56px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-size:20px; font-weight:800; color:#fff;
    border: 2px solid rgba(255,255,255,.15);
}
.swt-el-ppct { font-size:30px; font-weight:800; line-height:1; font-variant-numeric:tabular-nums; }
.swt-el-pbar-track { height:6px; background:rgba(255,255,255,.1); border-radius:4px; overflow:hidden; grid-column:1/-1; }
.swt-el-pbar-fill  { height:100%; border-radius:4px; transition:width 1.3s cubic-bezier(.4,0,.2,1); }

.swt-el-panel-ft {
    padding: 8px 16px;
    background: #111520; border-top: 1px solid rgba(255,255,255,.07);
    display:flex; justify-content:space-between; flex-wrap:wrap; gap:4px;
    font-size: 11px; color: #5A6585;
}

/* ── MOBILE ─────────────────────────────────────────────────────── */
@media (max-width: 600px) {
    .swt-el-main {
        height: auto;
        grid-template-columns: auto 1fr auto 1fr auto;
        grid-template-rows: auto auto;
        padding: 8px 10px;
        gap: 6px 8px;
    }
    body.has-swt-el-bar { padding-top: 0 !important; }
    .swt-el-bar-hd, .swt-el-clock { display:none; }
    .swt-el-bars { grid-column: 1 / -1; }
    .swt-el-foto, .swt-el-fb { width:38px; height:38px; }
    .swt-el-pct { font-size:18px; }
    .swt-el-ap-pct { font-size:15px; }
    .swt-el-ap { min-width:56px; }
    .swt-el-tabs { padding: 0 10px; }
}
