/* FORZATURA LAYOUT ORIZZONTALE PHOCA GALLERY (JOOMLA 5) */

/* Contenitore principale di Phoca */
#phocagallery, 
.pg-categories-view, 
.pg-category-view {
    display: flex !important;
    flex-wrap: wrap !important; /* Permette di andare a capo quando finisce lo spazio a destra */
    flex-direction: row !important; /* Dispone gli elementi da sinistra a destra */
    gap: 20px !important; /* Spazio di 20px tra un box e l'altro */
    justify-content: flex-start !important; /* Allinea partendo da sinistra */
}

/* Box delle Cartelle e delle Sottocartelle */
.pg-cv-box, 
.pg-categories-box,
.phocagallery-box-file {
    float: none !important; /* Elimina vecchi comportamenti */
    display: block !important;
    /* Specifica quanti elementi vuoi per riga. 
       calc(25% - 20px) significa 4 elementi per riga. 
       Se ne vuoi 3, cambia 25% in 33.3%. Se ne vuoi 5, in 20% */
    flex: 0 1 calc(25% - 20px) !important; 
    min-width: 180px !important; /* Impedisce che si rimpiccioliscano troppo sui cellulari */
    box-sizing: border-box !important;
}

/* Centra le immagini e i testi all'interno dei loro box affiancati */
.pg-cv-box img, 
.phocagallery-box-file img {
    display: block !important;
    margin: 0 auto !important;
    max-width: 100% !important;
    height: auto !important;
}