/* Fixes per a mòbil - Solapaments i breadcrumbs */

/* Fix per al header fixe que tapa el contingut */
@media (max-width: 768px) {
    /* Afegir padding-top per compensar el header fixe */
    .producte-container,
    .productes-archive,
    .families-productes-page {
        padding-top: 100px !important;
    }
    
    /* Fix específic per a la pàgina de families-productes */
    .families-productes-page .page-title,
    .families-productes-page h1 {
        margin-top: 20px !important;
        padding-top: 20px !important;
    }
    
    /* Fix per a les fitxes de productes */
    .single-producte .producte-container {
        padding-top: 50px !important;
    }

}

/* Fix per al breadcrumb que es solapa */
@media (max-width: 600px) {
    .productes-breadcrumb {
        margin-bottom: 1rem !important;
        padding: 0.5rem 0 !important;
    }
    
    .breadcrumb-list {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        gap: 0.25rem !important;
        font-size: 0.8rem !important;
        line-height: 1.4 !important;
    }
    
    .breadcrumb-item {
        display: flex !important;
        align-items: center !important;
        flex-shrink: 0 !important;
    }
    
    .breadcrumb-separator {
        margin: 0 0.25rem !important;
        font-size: 0.7rem !important;
        flex-shrink: 0 !important;
    }
    
    /* Assegurar que els elements no es solapin quan baixen de línia */
    .breadcrumb-item a,
    .breadcrumb-item span {
        word-break: break-word !important;
        hyphens: auto !important;
        white-space: normal !important;
    }
}

/* Fix per a pantalles molt petites */
@media (max-width: 480px) {
    .producte-container,
    .productes-archive,
    .families-productes-page {
        padding-top: 90px !important;
    }
    
    .breadcrumb-list {
        font-size: 0.75rem !important;
        line-height: 1.4 !important;
        gap: 0.2rem !important;
    }
    
    .breadcrumb-separator {
        margin: 0 0.2rem !important;
        font-size: 0.65rem !important;
    }
    
    .breadcrumb-item a,
    .breadcrumb-item span {
        word-break: break-word !important;
        hyphens: auto !important;
        white-space: normal !important;
    }
}

/* Fix per al header fixe d'Astra */
@media (max-width: 768px) {
    .ast-mobile-header-wrap {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 1000 !important;
        background: white !important;
    }
    
    /* Assegurar que el contingut no quedi tapat */
    .ast-mobile-header-wrap + .ast-container,
    .ast-mobile-header-wrap + * {
        margin-top: 80px !important;
    }
}

/* Fix específic per a la pàgina de families-productes */
.families-productes-page {
    padding-top: 100px !important;
}

.families-productes-page .page-title {
    margin-top: 20px !important;
    padding-top: 20px !important;
    font-size: 1.8rem !important;
}

@media (max-width: 600px) {
    .families-productes-page .page-title {
        font-size: 1.5rem !important;
        margin-top: 15px !important;
        padding-top: 15px !important;
    }
}

/* Fix per al breadcrumb en families-productes */
.families-productes-page .productes-breadcrumb {
    margin-top: 20px !important;
    margin-bottom: 1.5rem !important;
}

.single-producte .producte-content {
    margin-top: 0 !important;
}


.single-producte .producte-title {
    font-size: 1.56rem !important;
}

@media (max-width: 600px) {
    .single-producte .producte-title {
        font-size: 1.4rem !important;
    }
}

/* Fix per al breadcrumb en fitxes de productes */
.single-producte .productes-breadcrumb {
    margin-top: 20px !important;
    margin-bottom: 1.5rem !important;
}

/* Reordenar elements en mòbil: formulari després dels productes recomanats */
@media (max-width: 768px) {
    .producte-container {
        display: flex;
        flex-direction: column;
    }
    
    /* Producte sidebar (productes recomanats) - order 1 */
    .producte-sidebar {
        order: 1;
    }
    
    /* Contact form - order 2 (després dels productes recomanats) */
    .producte-contact-form-container {
        order: 2;
    }
    
    /* Tots els altres elements mantenen l'ordre natural */
    .producte-content {
        order: 0;
    }
    
    .producte-taula-personalitzada-wrap {
        order: 0;
    }
    
    .producte-mes-informacio {
        order: 0;
    }
}