/* Ottimizzazioni aggiuntive per mobile */

/* Correzioni per gli elementi portfolio su mobile (anche fuori dal carosello) */
@media (max-width: 767px) {
    /* Mantieni visibili le descrizioni degli elementi portfolio anche nella visualizzazione normale */
    .portfolio-item .portfolio-item-caption {
      transform: translateY(0);
      background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 100%);
      padding-bottom: 2rem;
    }
    
    .portfolio-item .portfolio-item-caption h3,
    .portfolio-item .portfolio-item-caption p {
      opacity: 1;
      transform: translateY(0);
    }
    
    /* Migliora l'aspetto del portfolio su mobile (evita hover states) */
    .portfolio-item:hover {
      transform: none;
    }
    
    /* Miglioramenti per la galleria modale su mobile */
    .gallery-content {
      max-width: 95%;
    }
    
    .gallery-img {
      max-width: 100%;
      height: auto;
    }
    
    .gallery-close, 
    .gallery-prev, 
    .gallery-next {
      width: 36px;
      height: 36px;
      font-size: 1rem;
    }
    
    .gallery-close {
      top: 10px;
      right: 10px;
    }
    
    /* Più spazio tra gli indicatori del carosello */
    .carousel-indicators .indicator {
      margin: 0 5px;
    }
    
    /* Migliora la visibilità dei pulsanti di navigazione del carosello */
    .carousel-prev, 
    .carousel-next {
      background: rgba(33, 33, 33, 0.8);
      width: 36px;
      height: 36px;
    }
  }
  
  /* Migliora l'aspetto su schermi molto piccoli */
  @media (max-width: 480px) {
    .carousel-inner {
      height: 320px; /* Riduce leggermente l'altezza per schermi molto piccoli */
    }
    
    .gallery-next {
      right: 5px;
    }
    
    .gallery-prev {
      left: 5px;
    }
    
    /* Aumenta dimensione tap target per una migliore usabilità */
    .indicator {
      width: 14px;
      height: 14px;
    }
  }