/* Modified 2026-07-20: scope all player presentation to the extension root. */

i.galandas-phpbbplayer-file-icon {
    animation: galandas-phpbbplayer-icon-flip 1s infinite ease-in-out;
    transform-style: preserve-3d;
}

@keyframes galandas-phpbbplayer-icon-flip {
    50% {
        transform: rotateY(-180deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    i.galandas-phpbbplayer-file-icon {
        animation: none;
    }
}

#mp3player .galandas-phpbbplayer-version-badge {
    display: inline-flex;
    overflow: hidden;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgb(0 0 0 / 35%);
    color: #fff;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 11px;
    font-weight: 600;
    line-height: 18px;
    text-shadow: 0 1px 0 rgb(0 0 0 / 30%);
    vertical-align: middle;
    white-space: nowrap;
}

#mp3player .galandas-phpbbplayer-version-name,
#mp3player .galandas-phpbbplayer-version-value {
    background-image: linear-gradient(
        to bottom,
        rgb(255 255 255 / 70%) 0%,
        rgb(170 170 170 / 10%) 10%,
        rgb(0 0 0 / 30%) 90%,
        rgb(0 0 0 / 50%) 100%
    );
    padding: 0 7px;
}

#mp3player .galandas-phpbbplayer-version-name {
    background-color: #555;
}

#mp3player .galandas-phpbbplayer-version-value {
    background-color: #67ac09;
}

#mp3player .player-container {
    max-width: 300px;
    margin: auto;
    text-align: center;
    /* border: 1px solid #ddd; */
    padding: 20px;
    /* border-radius: 8px; */
    /* box-shadow: inset -1px -1px 12px 3px rgb(15 156 225 / 51%); */
}

#mp3player .player-container audio {
    background-color: #0f9be0;  /* Cambia colore di sfondo (funziona solo in alcuni browser) */
    color: #fff;             /* Cambia colore del testo */
    border-radius: 8px;
    width: 100%;             /* Fa sì che il player si adatti al contenitore */
    height: 40px;            /* Imposta un'altezza per il player */
}

#mp3player .song {
    color: #0000FF;           /* Colore del testo */
    font-size: 125%;          /* Grandezza del font */
    font-style: italic;       /* Stile corsivo */
    animation: phpbbplayer-blink 2s step-start infinite; /* Effetto lampeggiante */
}

/* Definizione dell'animazione lampeggiante */
@keyframes phpbbplayer-blink {
    50% {
        opacity: 0;           /* Il testo diventa invisibile al 50% dell'animazione */
    }
}

#mp3player .cover {
    width: 150%;
    max-width: 150px;
    height: auto;
    margin-bottom: 10px;
}

#mp3player h3,
#mp3player label {
    margin: 10px 0;
    font-size: 1.2em;
}

/* Nuove regole CSS per la visualizzazione orizzontale dei player */
#mp3player .players-wrapper {
    overflow: hidden; /* Nasconde il resto */
    width: 100%; /* Adatta alla larghezza del contenitore */
	background-color: #d9e5ef;
}

#mp3player .player-item {
    min-width: 300px; /* Larghezza minima per ciascun player */
    margin: 0 10px; /* Margine per separare i player */
    text-align: center; /* Centra il contenuto */
}

#mp3player button {
    cursor: pointer;
    padding: 10px;
    /* margin: 5px; */
    font-size: 16px;
}