.avvisi_nerda_componente_barra{
    width:min(
        calc(100% - 16px),
        var(
            --gloghy-menu-superiore-larghezza,
            370px
        )
    );
    margin:0 auto;
    padding:7px 0 5px;
    background:#FFFFFF;
    font-family:Arial,Helvetica,sans-serif;
    box-sizing:border-box;
}

.avvisi_nerda_componente_interno{
    width:100%;
    min-height:32px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    border-bottom:1px solid #CCCCCC;
    box-sizing:border-box;
}

.avvisi_nerda_componente_etichetta{
    min-width:0;
    overflow:hidden;
    color:#6C89C6;
    font-size:8px;
    font-weight:900;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.avvisi_nerda_componente_azioni{
    min-width:0;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:4px;
}

.avvisi_nerda_componente_barra
.avvisi_nerda_pulsante{
    margin-left:0;
}

.avvisi_nerda_componente_barra
.avvisi_nerda_preferenze_apri{
    margin-left:0;
}

.avvisi_nerda_preferenze_solo_finali[hidden],
.avvisi_nerda_preferenze_anticipo[hidden]{
    display:none !important;
}

.avvisi_nerda_componente_barra_reparto{
    margin-top:0;
    margin-bottom:12px;
    transform:translateX(10px);
}

/*
 * TORNEI:
 * stessa larghezza delle schede sottostanti.
 */
.avvisi_nerda_componente_barra_reparto[
    data-nerda-tipo="reparto_tornei"
]{
    width:min(
        300px,
        calc(100% - 20px)
    );

    max-width:none;
    transform:translateX(20px);
}

/*
 * SFIDE:
 * usa la stessa variabile di larghezza
 * utilizzata dalle schede delle sfide.
 */
.avvisi_nerda_componente_barra_reparto[
    data-nerda-tipo="reparto_sfide"
]{
    width:min(
        var(--blocco_larghezza_px,370px),
        calc(100% - 20px)
    );

    max-width:none;
}

/*
 * Stile comune dei due reparti.
 *
 * Altezza ridotta da circa 50 px
 * a circa 40 px.
 */
.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_tornei"],
    [data-nerda-tipo="reparto_sfide"]
){
    height:40px;
    min-height:40px;
    padding:5px 10px;

    border:0;
    border-radius:5px;

    background:#6C89C6;

    transition:
        background-color 0.14s ease;
}

/*
 * Quando il reparto diventa NERDATO,
 * l’intera barra passa dal blu all’arancione.
 */
.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_tornei"],
    [data-nerda-tipo="reparto_sfide"]
):has(
    .avvisi_nerda_pulsante_attivo
){
    background:#FF9900;
}

.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_tornei"],
    [data-nerda-tipo="reparto_sfide"]
)
.avvisi_nerda_componente_interno{
    height:30px;
    min-height:30px;
    border-bottom:0;
}

/*
 * Scritta SEGUI IL REPARTO...
 */
.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_tornei"],
    [data-nerda-tipo="reparto_sfide"]
)
.avvisi_nerda_componente_etichetta{
    color:#FFFFFF;
    font-size:10px;
    font-weight:900;
}

/*
 * Pulsante NERDA / NERDATO integrato
 * nel colore della barra generale.
 */
.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_tornei"],
    [data-nerda-tipo="reparto_sfide"]
)
.avvisi_nerda_pulsante{
    min-width:82px;
    min-height:30px;
    margin:0;
    padding:0 10px;

    border:0;
    background:transparent;
    color:#FFFFFF;

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

    box-shadow:none;
}

/*
 * Evita che la regola generale del pulsante
 * assegni nuovamente il blu quando è NERDATO.
 */
.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_tornei"],
    [data-nerda-tipo="reparto_sfide"]
)
.avvisi_nerda_pulsante.avvisi_nerda_pulsante_attivo{
    background:transparent;
    color:#FFFFFF;
}

.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_tornei"],
    [data-nerda-tipo="reparto_sfide"]
)
.avvisi_nerda_pulsante:not(:disabled):hover,

.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_tornei"],
    [data-nerda-tipo="reparto_sfide"]
)
.avvisi_nerda_pulsante:not(:disabled):focus{
    background:rgba(255,255,255,0.16);
    color:#FFFFFF;
    outline:none;
    transform:none;
}

/*
 * Contenitori reali delle fotografie.
 *
 * Queste due classi diventano obbligatoriamente
 * il riferimento dell'overlay NERDA.
 */
.tornei_front_tutti_media_nerda,
.sfide_front_media_nerda,
.videogiochi_front_media_nerda{
    position:relative !important;
    isolation:isolate;
}

/*
 * Protezione anti-accavallamento.
 *
 * Un trigger CARD rimasto accidentalmente fuori
 * da una fotografia non deve essere visualizzato.
 */
.avvisi_nerda_componente_barra.avvisi_nerda_componente_barra_card{
    display:none;
}

/*
 * Il trigger viene mostrato soltanto quando è
 * figlio diretto della fotografia del torneo
 * oppure dell'intestazione fotografica della sfida.
 */
.tornei_front_tutti_media_nerda
> .avvisi_nerda_componente_barra.avvisi_nerda_componente_barra_card,
.sfide_front_media_nerda
> .avvisi_nerda_componente_barra.avvisi_nerda_componente_barra_card,
.videogiochi_front_media_nerda
> .avvisi_nerda_componente_barra.avvisi_nerda_componente_barra_card{
    display:block;

    position:absolute;
    top:6px;
    right:6px;
    z-index:40;

    width:auto;
    max-width:calc(100% - 12px);
    margin:0;
    padding:0;

    border:0;
    background:transparent;
    pointer-events:auto;
}

.avvisi_nerda_componente_barra_card
.avvisi_nerda_componente_interno{
    width:auto;
    min-height:19px;
    gap:0;
    border-bottom:0;
}

.avvisi_nerda_componente_barra_card
.avvisi_nerda_componente_etichetta{
    display:none;
}

.avvisi_nerda_componente_barra_card
.avvisi_nerda_componente_azioni{
    width:auto;
    gap:4px;
}

.avvisi_nerda_componente_barra_card
.avvisi_nerda_pulsante{
    min-height:19px;
    margin:0;
    box-shadow:0 1px 4px rgba(0,0,0,0.45);
}

.avvisi_nerda_componente_barra_card
.avvisi_nerda_preferenze_apri{
    margin:0;
    box-shadow:0 1px 4px rgba(0,0,0,0.45);
}

/*
 * Reparti generali nuovi:
 *
 * Videogiochi
 * Live
 * Speaker
 */
.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_videogiochi"],
    [data-nerda-tipo="reparto_live"],
    [data-nerda-tipo="reparto_speaker"]
){
    width:100%;
    max-width:none;
    height:40px;
    min-height:40px;

    margin:0 0 12px;
    padding:5px 10px;

    transform:none;

    border:0;
    border-radius:5px;
    background:#6C89C6;

    transition:
        background-color 0.14s ease;
}

.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_videogiochi"],
    [data-nerda-tipo="reparto_live"],
    [data-nerda-tipo="reparto_speaker"]
):has(
    .avvisi_nerda_pulsante_attivo
){
    background:#FF9900;
}

.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_videogiochi"],
    [data-nerda-tipo="reparto_live"],
    [data-nerda-tipo="reparto_speaker"]
)
.avvisi_nerda_componente_interno{
    height:30px;
    min-height:30px;
    border-bottom:0;
}

.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_videogiochi"],
    [data-nerda-tipo="reparto_live"],
    [data-nerda-tipo="reparto_speaker"]
)
.avvisi_nerda_componente_etichetta{
    color:#FFFFFF;
    font-size:10px;
    font-weight:900;
}

.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_videogiochi"],
    [data-nerda-tipo="reparto_live"],
    [data-nerda-tipo="reparto_speaker"]
)
.avvisi_nerda_pulsante{
    min-width:82px;
    min-height:30px;
    margin:0;
    padding:0 10px;

    border:0;
    background:transparent;
    color:#FFFFFF;

    font-size:9px;
    font-weight:900;
    box-shadow:none;
}

.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_videogiochi"],
    [data-nerda-tipo="reparto_live"],
    [data-nerda-tipo="reparto_speaker"]
)
.avvisi_nerda_pulsante.avvisi_nerda_pulsante_attivo{
    background:transparent;
    color:#FFFFFF;
}

.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_videogiochi"],
    [data-nerda-tipo="reparto_live"],
    [data-nerda-tipo="reparto_speaker"]
)
.avvisi_nerda_pulsante:not(:disabled):hover,

.avvisi_nerda_componente_barra_reparto:is(
    [data-nerda-tipo="reparto_videogiochi"],
    [data-nerda-tipo="reparto_live"],
    [data-nerda-tipo="reparto_speaker"]
)
.avvisi_nerda_pulsante:not(:disabled):focus{
    background:rgba(255,255,255,0.16);
    color:#FFFFFF;
    outline:none;
    transform:none;
}

@media (max-width:430px){
    .avvisi_nerda_componente_barra{
        width:min(
            calc(100% - 10px),
            var(
                --gloghy-menu-superiore-larghezza,
                370px
            )
        );
        padding-top:5px;
    }

    .avvisi_nerda_componente_etichetta{
        font-size:7px;
    }
}