/*/////////////// PAGINA GERAL DE EVENTOS //////////////*/
.grid-events {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 4rem;
}

.grid-events-item {
    transition: transform 0.3s ease;
    box-shadow: var(--primary-shadow);
    background-color: #fff;
    padding: 1rem;
    width: fit-content;
}

.grid-events-item:hover {
    transform: scale(1.05);
}
.event-details{
    margin-left: 5%;
    margin-top: 2%;
}
.event-date img, .event-local img {
    width: 1rem;
    margin-right: 0.5rem;
}

.grid-events-item svg, .grid-events-item svg path {
    fill: none;
    stroke: var(--icons-color);
    stroke-linecap: round;
    stroke-miterlimit: 10;
    stroke-width: 16px;
    width: 4rem;
    position: absolute;
    bottom: -14px;
    right: -19px;
}
.grid-events-item:hover svg, .grid-events-item:hover svg path {
    stroke: var(--secundary-color);
    transition: stroke 0.3s ease;
}
/*/////////////// DESTAQUES DE 3 EVENTOS //////////////*/
.grid-events-highlight {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 2rem;
}

.grid-events-highlight-item {
    padding: 1rem;
    border: 4px solid transparent;
}
.grid-events-highlight-item:hover {
    transform: scale(1.05);
    box-shadow: var(--primary-shadow);
    border: 4px solid var(--secundary-color);
    background-color: #fff;
}
/*/////////////// PAGINA INDIVIDUAL DE EVENTOS //////////////*/
.banner-events {
    width: 100%;
    height: fit-content;
    box-shadow: var(--primary-shadow);
}

.banner-events::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    /* ajuste a opacidade conforme desejar */
    pointer-events: none;
    z-index: 1;
}

.banner-events img {
    width: 100%;
    height: auto;
    object-fit: cover;

}

.event-content {
    top: -5rem;
    left: 16.8%;
    background-color: #efefef;
    padding: 2rem;
    z-index: 1000;
}

.event-date {
    margin-top: 0.5rem;
    margin-bottom: 1.5rem;
}

p.creditos {
    color: rgb(0, 0, 0, 0.5);
    text-align: right;
}
.events-btn{
    width: fit-content;
    margin-left: 5%;
    margin-bottom: 1rem;
}
/*/////////////// EVENT PHOTO GALLERY //////////////*/

.galeria-horizontal {
    display: flex; 
    overflow-x: auto; 
    white-space: nowrap; 
    gap: 10px; 
    padding-bottom: 10px; 
    -webkit-overflow-scrolling: touch; /* Melhora o scroll em dispositivos iOS */
    scrollbar-width: thin; /* Estilo para o scrollbar no Firefox */
    scrollbar-color: #888 #f1f1f1; /* Cor do scrollbar no Firefox */
}

/* Estiliza o scrollbar para navegadores WebKit (Chrome, Safari) */
.galeria-horizontal::-webkit-scrollbar {
    height: 8px; /* Altura do scrollbar horizontal */
}

.galeria-horizontal::-webkit-scrollbar-track {
    background: #f1f1f1; /* Cor de fundo da trilha do scrollbar */
    border-radius: 10px;
}

.galeria-horizontal::-webkit-scrollbar-thumb {
    background: #888; /* Cor do "polegar" do scrollbar */
    border-radius: 10px;
}

.galeria-horizontal::-webkit-scrollbar-thumb:hover {
    background: #555; /* Cor do "polegar" ao passar o mouse */
}

.galeria-horizontal img {
    flex-shrink: 0; /* Impede que as imagens encolham */
    width: 400px; 
    height: 250px; 
    object-fit: cover;
}