/* ==========================================================
   XLX026_HISTORY_SOUND_MENU_V1
   - tabela Últimas transmissões sem barra horizontal
   - todas as informações preservadas
   - Bip visualmente transferido para o menu
   ========================================================== */


/* ==========================================================
   TABELA — DESKTOP / TABLET
   ========================================================== */

body[data-page='ao-vivo']
.dashboard-main
.table-wrap{
    width:100% !important;
    max-width:100% !important;

    overflow-x:hidden !important;
}


body[data-page='ao-vivo']
.dashboard-main
table.home-history{
    width:100% !important;
    max-width:100% !important;

    /*
     * Remove o min-width:760px global
     * que cria a barra horizontal.
     */
    min-width:0 !important;

    table-layout:fixed !important;

    border-collapse:collapse !important;
}


/*
 * Nenhuma informação será cortada.
 * Se necessário, o texto quebra dentro da própria coluna.
 */
body[data-page='ao-vivo']
.dashboard-main
table.home-history th,

body[data-page='ao-vivo']
.dashboard-main
table.home-history td{
    min-width:0 !important;
    max-width:none !important;

    padding:8px 5px !important;

    white-space:normal !important;

    overflow:visible !important;
    text-overflow:clip !important;

    overflow-wrap:anywhere;
    word-break:normal;

    vertical-align:middle;
}


/*
 * Distribuição calculada das oito colunas:
 *
 * País       7%
 * Horário   11%
 * Indicativo 14%
 * Operador  25%
 * Protocolo 14%
 * Módulo     8%
 * Duração   11%
 * Status    10%
 */

body[data-page='ao-vivo']
.home-history th:nth-child(1){width:7% !important;}

body[data-page='ao-vivo']
.home-history th:nth-child(2){width:11% !important;}

body[data-page='ao-vivo']
.home-history th:nth-child(3){width:14% !important;}

body[data-page='ao-vivo']
.home-history th:nth-child(4){width:25% !important;}

body[data-page='ao-vivo']
.home-history th:nth-child(5){width:14% !important;}

body[data-page='ao-vivo']
.home-history th:nth-child(6){width:8% !important;}

body[data-page='ao-vivo']
.home-history th:nth-child(7){width:11% !important;}

body[data-page='ao-vivo']
.home-history th:nth-child(8){width:10% !important;}


/*
 * Cabeçalho compacto o suficiente para caber,
 * mantendo boa leitura.
 */
body[data-page='ao-vivo']
.home-history th{
    font-size:9px !important;
    line-height:1.15 !important;
}


/*
 * Dados.
 */
body[data-page='ao-vivo']
.home-history td{
    font-size:10px !important;
    line-height:1.25 !important;
}


/*
 * Colunas curtas ficam centralizadas.
 */
body[data-page='ao-vivo']
.home-history th:nth-child(1),
body[data-page='ao-vivo']
.home-history td:nth-child(1),

body[data-page='ao-vivo']
.home-history th:nth-child(2),
body[data-page='ao-vivo']
.home-history td:nth-child(2),

body[data-page='ao-vivo']
.home-history th:nth-child(5),
body[data-page='ao-vivo']
.home-history td:nth-child(5),

body[data-page='ao-vivo']
.home-history th:nth-child(6),
body[data-page='ao-vivo']
.home-history td:nth-child(6),

body[data-page='ao-vivo']
.home-history th:nth-child(7),
body[data-page='ao-vivo']
.home-history td:nth-child(7),

body[data-page='ao-vivo']
.home-history th:nth-child(8),
body[data-page='ao-vivo']
.home-history td:nth-child(8){
    text-align:center !important;
}


/*
 * Protocolo e status não podem forçar largura extra.
 */
body[data-page='ao-vivo']
.home-history .protocol,

body[data-page='ao-vivo']
.home-history .state-pill{
    max-width:100% !important;

    white-space:normal !important;

    padding:3px 5px !important;

    font-size:8px !important;

    line-height:1.15 !important;
}


/*
 * Bandeira também respeita a coluna.
 */
body[data-page='ao-vivo']
.home-history td:first-child img{
    max-width:24px !important;
    height:auto !important;
}


/* ==========================================================
   MOBILE
   Em celular, oito colunas lado a lado ficariam ilegíveis.

   Portanto cada transmissão vira um cartão compacto,
   mostrando TODOS os oito campos.
   ========================================================== */

@media(max-width:820px){

    html body[data-page='ao-vivo']
    .dashboard-layout
    .dashboard-main
    .table-wrap{
        overflow:visible !important;
    }


    html body[data-page='ao-vivo']
    .dashboard-layout
    .dashboard-main
    table.home-history{

        display:block !important;

        width:100% !important;
        min-width:0 !important;

        table-layout:auto !important;
    }


    html body[data-page='ao-vivo']
    .dashboard-layout
    .dashboard-main
    table.home-history thead{

        display:none !important;
    }


    html body[data-page='ao-vivo']
    .dashboard-layout
    .dashboard-main
    table.home-history tbody{

        display:block !important;

        width:100% !important;
    }


    html body[data-page='ao-vivo']
    .dashboard-layout
    .dashboard-main
    table.home-history tbody tr{

        display:grid !important;

        grid-template-columns:
            repeat(2,minmax(0,1fr)) !important;

        width:100% !important;

        margin:0 0 9px !important;

        border:1px solid #183f52 !important;
        border-radius:11px !important;

        background:
            rgba(7,25,35,.76) !important;

        overflow:hidden !important;
    }


    /*
     * Garante que regras móveis antigas não escondam
     * País, Indicativo, Operador ou qualquer outra coluna.
     */
    html body[data-page='ao-vivo']
    .dashboard-layout
    .dashboard-main
    table.home-history tbody tr td{

        display:block !important;

        width:auto !important;
        min-width:0 !important;
        max-width:none !important;

        padding:8px 9px !important;

        border:0 !important;
        border-bottom:1px solid rgba(26,58,76,.65) !important;

        font-size:11px !important;

        text-align:left !important;

        white-space:normal !important;

        overflow:visible !important;
        text-overflow:clip !important;

        overflow-wrap:anywhere !important;

        color:#e4f4fa !important;
    }


    /*
     * Operador ocupa largura total para nomes maiores.
     */
    html body[data-page='ao-vivo']
    .home-history td:nth-child(4){

        grid-column:1 / -1 !important;
    }


    /*
     * Status também ganha largura completa.
     */
    html body[data-page='ao-vivo']
    .home-history td:nth-child(8){

        grid-column:1 / -1 !important;
    }


    /*
     * Rótulos móveis.
     */
    html body[data-page='ao-vivo']
    .home-history td::before{

        display:block;

        margin-bottom:3px;

        color:#00d8ff;

        font-size:7px;
        font-weight:900;

        letter-spacing:.08em;

        text-transform:uppercase;
    }


    html body[data-page='ao-vivo']
    .home-history td:nth-child(1)::before{
        content:"País";
    }

    html body[data-page='ao-vivo']
    .home-history td:nth-child(2)::before{
        content:"Horário";
    }

    html body[data-page='ao-vivo']
    .home-history td:nth-child(3)::before{
        content:"Indicativo";
    }

    html body[data-page='ao-vivo']
    .home-history td:nth-child(4)::before{
        content:"Operador";
    }

    html body[data-page='ao-vivo']
    .home-history td:nth-child(5)::before{
        content:"Protocolo";
    }

    html body[data-page='ao-vivo']
    .home-history td:nth-child(6)::before{
        content:"Módulo";
    }

    html body[data-page='ao-vivo']
    .home-history td:nth-child(7)::before{
        content:"Duração";
    }

    html body[data-page='ao-vivo']
    .home-history td:nth-child(8)::before{
        content:"Status";
    }


    /*
     * Mensagem "sem histórico", se aparecer.
     */
    html body[data-page='ao-vivo']
    .home-history td[colspan]{

        grid-column:1 / -1 !important;

        text-align:center !important;
    }

    html body[data-page='ao-vivo']
    .home-history td[colspan]::before{

        display:none !important;
    }

}


/* ==========================================================
   BIP / ALTO-FALANTE
   ========================================================== */


/*
 * O controle original continua EXISTINDO.
 *
 * Não usamos display:none para evitar quebrar código
 * que possa depender daquele botão.
 *
 * Ele só deixa de aparecer visualmente dentro do box.
 */
body[data-page='ao-vivo']
.xlx026-original-sound-control{

    position:absolute !important;

    width:1px !important;
    height:1px !important;

    margin:-1px !important;
    padding:0 !important;

    border:0 !important;

    overflow:hidden !important;

    clip-path:inset(50%) !important;

    opacity:0 !important;

    pointer-events:none !important;
}


/*
 * Novo controle visual dentro do menu.
 */
.universal-nav
.xlx026-menu-sound-control{

    display:inline-flex;

    align-items:center;
    justify-content:center;

    gap:6px;

    min-height:35px;

    padding:7px 10px;

    border:1px solid rgba(52,104,130,.72);
    border-radius:9px;

    background:
        linear-gradient(
            180deg,
            rgba(15,42,57,.94),
            rgba(7,25,35,.96)
        );

    color:#c9e0e9;

    font:inherit;

    font-size:11px;
    font-weight:800;

    cursor:pointer;

    white-space:nowrap;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035),
        0 1px 4px rgba(0,0,0,.20);

    transition:
        .18s ease;
}


.universal-nav
.xlx026-menu-sound-control:hover{

    color:#ffffff;

    border-color:#21eaa0;

    box-shadow:
        0 0 5px rgba(33,234,160,.65),
        0 0 14px rgba(33,234,160,.27);
}


.universal-nav
.xlx026-menu-sound-control
.xlx026-sound-icon{

    font-size:14px;
    line-height:1;
}


/*
 * Quando conseguimos identificar que o bip está desligado.
 */
.universal-nav
.xlx026-menu-sound-control.is-off{

    opacity:.72;
}


/*
 * Dentro do menu móvel o alto-falante ocupa a mesma
 * largura dos demais itens.
 */
@media(max-width:820px){

    .universal-header
    .universal-nav
    .xlx026-menu-sound-control{

        width:100% !important;

        min-height:50px !important;

        justify-content:center !important;

        padding:10px 13px !important;

        font-size:12px !important;
    }

}


/* FIM XLX026_HISTORY_SOUND_MENU_V1 */