/* Estilos para TGallery */
.gallery-container { 
    display: grid; 
    /* As colunas agora se ajustam automaticamente com um tamanho mínimo de 150px */
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); 
    gap: 1rem; 
}

/* As media queries para o número de colunas foram removidas pois a linha acima já cuida da responsividade. */

.gallery-item { 
    position: relative; 
    overflow: hidden; 
    border-radius: 0.5rem; 
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1); 
    cursor: pointer; 
}

.gallery-item img { 
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
    transition: transform 0.3s ease-in-out; 
}

.gallery-item:hover img { 
    transform: scale(1.10); 
}

.gallery-overlay { 
    position: absolute; 
    inset: 0; 
    background-color: rgba(0, 0, 0, 0); 
    transition: background-color 0.3s ease-in-out; 
}

.gallery-item:hover .gallery-overlay { 
    background-color: rgba(0, 0, 0, 0.3); 
}

/* Estilos para o Lightbox */
.lightbox { 
    position: fixed; 
    inset: 0; 
    z-index: 50; 
    background-color: rgba(0, 0, 0, 0.8); 
    display: flex; 
    justify-content: center; 
    align-items: start; 
    padding: 1rem; 
}

.lightbox.hidden { 
    display: none; 
}

.lightbox-content-wrapper { 
    position: relative; 
}

.lightbox-img { 
    max-width: 90vw; 
    max-height: 85vh; 
    border-radius: 0.5rem; 
    box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); 
    animation: zoomIn 0.3s ease-out;
    min-width: 300px;
    min-height: 300px;
}

.lightbox-close { 
    position: absolute; 
    top: -1rem; 
    right: -1rem; 
    background-color: white; 
    border-radius: 9999px; 
    padding: 0.375rem; 
    color: #1f2937; 
    border: none; 
    cursor: pointer; 
    transition: transform 0.2s ease-in-out; 
}

.lightbox-close:hover { 
    transform: scale(1.1); 
}

@media (min-width: 640px) { 
    .lightbox-close { 
        top: 0.5rem; 
        right: 0.5rem; 
    } 
}

@keyframes zoomIn { 
    from { 
        transform: scale(0.8); 
        opacity: 0; 
    } 
    to { 
        transform: scale(1); 
        opacity: 1; 
    } 
}