@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700&display=swap');

/* === FIX DIVI BUILDER CRITIQUE === */
.et_pb_code_inner {
    width: 100% !important;
    max-width: none !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

.et_pb_code {
    width: 100% !important;
    max-width: none !important;
    overflow: visible !important;
}

.et_pb_column .et_pb_code_inner {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* === FIX POUR ADVANCED TABS ET GRIDS === */
.grid-isolation-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;  /* Change 0 20px en 0 */
}

/* Fix complet pour Divi Flash Advanced Tabs */
.df_at_content_wrapper,
.df_at_container,
.df_at_content_active {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
}

/* NOUVELLE RÈGLE - Forcer largeur complète dans les tabs */
.df_at_content_active .grid-isolation-wrapper,
.df_at_container .grid-isolation-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* === STYLES ÉVÉNEMENTS === */
.evenements-grid-custom {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
    margin: 20px 0 !important;
    font-family: 'Nunito', sans-serif !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.evenement-card-custom {
    border-radius: 15px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important;
    display: flex !important;
    flex-direction: column !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    font-family: 'Nunito', sans-serif !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.evenement-card-custom:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.15) !important;
}

.evenement-image {
    height: 200px !important;
    overflow: hidden !important;
    width: 100% !important;
}

.evenement-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.3s ease !important;
}

.evenement-card-custom:hover .evenement-image img {
    transform: scale(1.05) !important;
}

.evenement-content {
    padding: 20px !important;
    color: #00397C !important;
    flex-grow: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    font-family: 'Nunito', sans-serif !important;
}

.dates-evenement {
    font-size: 16px !important;
    font-weight: 600 !important;
    margin-bottom: 8px !important;
    line-height: 1.3 !important;
    color: #00397C !important;
    font-family: 'Nunito', sans-serif !important;
}

.type-evenement {
    font-size: 16px !important;
    margin-bottom: 12px !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    text-transform: capitalize !important;
    letter-spacing: 0.5px !important;
    color: #00397C !important;
    font-family: 'Nunito', sans-serif !important;
}

.titre-evenement {
    font-size: 24px !important;
    font-weight: 700 !important;
    margin: 0 0 12px 0 !important;
    line-height: 1.2 !important;
    color: #00397C !important;
    font-family: 'Nunito', sans-serif !important;
}

.description-courte {
    line-height: 1.4 !important;
    margin-bottom: 20px !important;
    flex-grow: 1 !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    color: #00397C !important;
    font-family: 'Nunito', sans-serif !important;
}

/* BOUTON ÉVÉNEMENT AVEC PADDING AJUSTÉ */
.btn-evenement-custom {
    background: white !important;
    color: #00397C !important;
    padding-top: 12px !important;
    padding-right: 45px !important;
    padding-bottom: 12px !important;
    padding-left: 30px !important;
    border-radius: 25px !important;
    text-decoration: none !important;
    font-weight: 700 !important;
    font-size: 18px !important;
    line-height: 1.4 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-family: 'Nunito', sans-serif !important;
    gap: 8px !important;
    align-self: center !important;
    width: auto !important;
    border: 2px solid white !important;
    transition: all 0.3s ease !important;
    text-align: center !important;
}

.btn-text-custom {
    color: #00397C !important;
    transition: color 0.3s ease !important;
    font-family: 'Nunito', sans-serif !important;
    font-weight: 700 !important;
    font-size: 18px !important;
    text-align: center !important;
}

.btn-arrow-custom::before {
    content: "" !important;
    display: inline-block !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 10px solid #00397C !important;
    border-top: 6px solid transparent !important;
    border-bottom: 6px solid transparent !important;
    transition: all 0.3s ease !important;
    margin-left: 4px !important;
}

.btn-evenement-custom:hover {
    background: #00397C !important;
    color: white !important;
    border-color: #00397C !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 15px rgba(0,57,124,0.3) !important;
    text-decoration: none !important;
}

.btn-evenement-custom:hover .btn-text-custom {
    color: white !important;
}

.btn-evenement-custom:hover .btn-arrow-custom::before {
    border-left-color: white !important;
    transform: translateX(3px) !important;
}

/* === STYLES OUTILS === */
.outils-grid-custom {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
    margin: 20px 0 !important;
    font-family: 'Nunito', sans-serif !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.outil-card-custom {
    background: white !important;
    border-radius: 15px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important;
    display: flex !important;
    flex-direction: column !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    font-family: 'Nunito', sans-serif !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.outil-card-custom:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.15) !important;
}

.outil-image {
    height: 200px !important;
    overflow: hidden !important;
    width: 100% !important;
}

.outil-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.3s ease !important;
}

.outil-card-custom:hover .outil-image img {
    transform: scale(1.05) !important;
}

.outil-content {
    padding: 20px !important;
    flex-grow: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    font-family: 'Nunito', sans-serif !important;
}

.outil-titre {
    font-size: 20px !important;
    font-weight: 700 !important;
    margin: 0 0 8px 0 !important;
    line-height: 1.2 !important;
    color: #00397C !important;
    font-family: 'Nunito', sans-serif !important;
    text-align: center !important;
}

.outil-categorie {
    font-size: 16px !important;
    color: #00397C !important;
    font-weight: 600 !important;
    margin-bottom: 12px !important;
    font-family: 'Nunito', sans-serif !important;
    transition: color 0.3s ease !important;
    text-decoration: none !important;
    text-align: center !important;
}

.outil-description {
    line-height: 1.4 !important;
    margin-bottom: 20px !important;
    flex-grow: 1 !important;
    font-size: 16px !important;
    color: #00397C !important;
    font-family: 'Nunito', sans-serif !important;
    text-align: center !important;
}

/* BOUTON OUTIL */
.btn-outil-custom {
    background: #F5C2C7 !important;
    color: #00397C !important;
    padding: 12px 24px !important;
    border-radius: 25px !important;
    text-decoration: none !important;
    font-weight: 700 !important;
    font-size: 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-family: 'Nunito', sans-serif !important;
    gap: 8px !important;
    align-self: center !important;
    border: 2px solid #F5C2C7 !important;
    transition: all 0.3s ease !important;
    text-align: center !important;
}

.btn-text-outil {
    color: #00397C !important;
    transition: color 0.3s ease !important;
    font-family: 'Nunito', sans-serif !important;
    font-weight: 700 !important;
    font-size: 18px !important;
    text-align: center !important;
}

.btn-arrow-outil::before {
    content: "" !important;
    display: inline-block !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 10px solid #00397C !important;
    border-top: 6px solid transparent !important;
    border-bottom: 6px solid transparent !important;
    transition: all 0.3s ease !important;
    margin-left: 4px !important;
}

.btn-outil-custom:hover {
    background: #00397C !important;
    border-color: #00397C !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 15px rgba(0,57,124,0.3) !important;
    text-decoration: none !important;
}

.btn-outil-custom:hover .btn-text-outil {
    color: white !important;
}

.btn-outil-custom:hover .btn-arrow-outil::before {
    border-left-color: white !important;
    transform: translateX(3px) !important;
}

/* === STYLES PAGINATION COMMUNS === */
.pagination-evenements,
.pagination-outils {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 40px auto !important;
    font-family: 'Nunito', sans-serif !important;
    width: 100% !important;
    clear: both !important;
}

.pagination-btn-evenements,
.pagination-btn-outils {
    background: transparent !important;
    color: #00397C !important;
    padding: 10px 16px !important;
    border-radius: 8px !important;
    text-decoration: none !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    font-family: 'Nunito', sans-serif !important;
    transition: all 0.3s ease !important;
    border: none !important;
    min-width: 45px !important;
    min-height: 45px !important;
    text-align: center !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.pagination-btn-evenements:hover,
.pagination-btn-outils:hover {
    transform: translateY(-2px) !important;
    text-decoration: none !important;
    color: #00397C !important;
}

.pagination-btn-evenements.active,
.pagination-btn-outils.active {
    text-decoration: underline !important;
    text-underline-offset: 4px !important;
    text-decoration-thickness: 2px !important;
}

/* === FLÈCHES PAGINATION ÉVÉNEMENTS - TRIANGLES CSS === */
.pagination-prev {
    font-size: 0 !important;
    padding: 12px !important;
    position: relative !important;
    min-width: 45px !important;
    min-height: 45px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.pagination-prev::before {
    content: "" !important;
    display: inline-block !important;
    width: 0 !important;
    height: 0 !important;
    border-right: 10px solid #00397C !important;
    border-top: 7px solid transparent !important;
    border-bottom: 7px solid transparent !important;
    transition: transform 0.3s ease !important;
}

.pagination-prev:hover::before {
    transform: translateX(-3px) !important;
}

.pagination-next {
    font-size: 0 !important;
    padding: 12px !important;
    position: relative !important;
    min-width: 45px !important;
    min-height: 45px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.pagination-next::before {
    content: "" !important;
    display: inline-block !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 10px solid #00397C !important;
    border-top: 7px solid transparent !important;
    border-bottom: 7px solid transparent !important;
    transition: transform 0.3s ease !important;
}

.pagination-next:hover::before {
    transform: translateX(3px) !important;
}

/* === FLÈCHES PAGINATION OUTILS - TRIANGLES CSS === */
.pagination-prev-outils {
    font-size: 0 !important;
    padding: 12px !important;
    position: relative !important;
    min-width: 45px !important;
    min-height: 45px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.pagination-prev-outils::before {
    content: "" !important;
    display: inline-block !important;
    width: 0 !important;
    height: 0 !important;
    border-right: 10px solid #00397C !important;
    border-top: 7px solid transparent !important;
    border-bottom: 7px solid transparent !important;
    transition: transform 0.3s ease !important;
}

.pagination-prev-outils:hover::before {
    transform: translateX(-3px) !important;
}

.pagination-next-outils {
    font-size: 0 !important;
    padding: 12px !important;
    position: relative !important;
    min-width: 45px !important;
    min-height: 45px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.pagination-next-outils::before {
    content: "" !important;
    display: inline-block !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 10px solid #00397C !important;
    border-top: 7px solid transparent !important;
    border-bottom: 7px solid transparent !important;
    transition: transform 0.3s ease !important;
}

.pagination-next-outils:hover::before {
    transform: translateX(3px) !important;
}

/* === OVERRIDE POUR ENLEVER SOULIGNEMENT === */
.type-evenement,
.outil-categorie,
div.type-evenement,
div.outil-categorie,
.evenements-grid-custom .type-evenement,
.outils-grid-custom .outil-categorie,
.grid-isolation-wrapper .type-evenement,
.grid-isolation-wrapper .outil-categorie {
    text-decoration: none !important;
    text-decoration-line: none !important;
    border-bottom: none !important;
}

/* === FORCE MOBILE 1 COLONNE === */
@media (max-width: 767px) {
    
    .mobile-fixed {
        width: 100vw !important;
        max-width: 100vw !important;
        margin-left: calc(-50vw + 50%) !important;
        padding: 0 !important;
        overflow-x: hidden !important;
    }
    
    .mobile-fixed div[id*="events-"],
    .mobile-fixed div[id*="tools-"],
    .grid-isolation-wrapper.mobile-fixed div[id*="events-"],
    .grid-isolation-wrapper.mobile-fixed div[id*="tools-"],
    .df_at_content_active .mobile-fixed div[id*="events-"],
    .df_at_content_active .mobile-fixed div[id*="tools-"],
    .df_at_content_wrapper .mobile-fixed div[id*="events-"],
    .df_at_content_wrapper .mobile-fixed div[id*="tools-"],
    .et_pb_code .mobile-fixed div[id*="events-"],
    .et_pb_code .mobile-fixed div[id*="tools-"] {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 15px !important;
        padding: 0 15px !important;
        margin: 15px auto !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        grid-template-columns: none !important;
    }
    
    .mobile-fixed .evenement-card-custom,
    .mobile-fixed .outil-card-custom,
    .grid-isolation-wrapper .evenement-card-custom,
    .grid-isolation-wrapper .outil-card-custom,
    div[id*="events-"] .evenement-card-custom,
    div[id*="tools-"] .outil-card-custom {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
        display: block !important;
    }
    
    .mobile-fixed .evenement-content,
    .mobile-fixed .outil-content {
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        min-height: 200px !important;
        padding: 20px !important;
    }
    
    .mobile-fixed .outil-content {
        align-items: center !important;
        text-align: center !important;
    }
    
    .mobile-fixed .btn-evenement-custom,
    .mobile-fixed .btn-outil-custom {
        margin-top: auto !important;
        flex-shrink: 0 !important;
        align-self: center !important;
        font-size: 18px !important;
        padding-top: 12px !important;
        padding-right: 45px !important;
        padding-bottom: 12px !important;
        padding-left: 30px !important;
    }
}

/* === FORCE COLONNE SUR TABLETTE VERTICAL (≤1024px) - TOUS LES SHORTCODES === */
@media (max-width: 1024px) {
    /* FIX CENTRAGE PARFAIT - ENLEVER TOUS LES MARGINS NÉGATIFS */
    .df_at_content_wrapper,
    .df_at_content_active,
    .df_at_container {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    /* Forcer TOUS les conteneurs de grids en flexbox colonne */
    .df_at_content_active .grid-isolation-wrapper,
    .df_at_content_wrapper .grid-isolation-wrapper,
    .grid-isolation-wrapper {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        padding: 0 20px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    /* Cibler TOUS les grids - événements et outils - DANS ET HORS DES TABS */
    div[id*="events-grid"],
    div[id*="events-recent"],
    div[id*="tools-grid"],
    div[id*="tools-recent"],
    .evenements-grid-custom,
    .outils-grid-custom,
    .df_at_content_active .evenements-grid-custom,
    .df_at_content_active .outils-grid-custom,
    .df_at_content_wrapper .evenements-grid-custom,
    .df_at_content_wrapper .outils-grid-custom,
    .df_at_content_active div[id*="events-grid"],
    .df_at_content_active div[id*="events-recent"],
    .df_at_content_active div[id*="tools-grid"],
    .df_at_content_active div[id*="tools-recent"],
    .df_at_content_wrapper div[id*="events-grid"],
    .df_at_content_wrapper div[id*="events-recent"],
    .df_at_content_wrapper div[id*="tools-grid"],
    .df_at_content_wrapper div[id*="tools-recent"] {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 20px !important;
        padding: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        grid-template-columns: none !important;
        grid-template-rows: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    /* Forcer toutes les cartes à prendre toute la largeur - PARTOUT */
    div[id*="events-grid"] .evenement-card-custom,
    div[id*="events-recent"] .evenement-card-custom,
    div[id*="tools-grid"] .outil-card-custom,
    div[id*="tools-recent"] .outil-card-custom,
    .evenements-grid-custom .evenement-card-custom,
    .outils-grid-custom .outil-card-custom,
    .df_at_content_active .evenement-card-custom,
    .df_at_content_active .outil-card-custom,
    .df_at_content_wrapper .evenement-card-custom,
    .df_at_content_wrapper .outil-card-custom,
    .df_at_content_active div[id*="events-"] .evenement-card-custom,
    .df_at_content_active div[id*="tools-"] .outil-card-custom,
    .df_at_content_wrapper div[id*="events-"] .evenement-card-custom,
    .df_at_content_wrapper div[id*="tools-"] .outil-card-custom {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto 20px auto !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* === DESKTOP - 3 COLONNES === */
@media screen and (min-width: 1025px) {
    .evenements-grid-custom,
    .outils-grid-custom {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 20px !important;
        padding: 0 !important;
    }
    
    .evenement-card-custom,
    .outil-card-custom {
        width: 100% !important;
        max-width: none !important;
    }
    
    /* LARGEUR COMPLÈTE DANS LES TABS - DESKTOP - ENLEVER TOUS LES PADDINGS */
    .df_at_content_wrapper,
    .df_at_content_active {
        max-width: 100% !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    
    .df_at_content_active .grid-isolation-wrapper,
    .df_at_content_wrapper .grid-isolation-wrapper {
        max-width: 100% !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    
    .df_at_content_active .evenements-grid-custom,
    .df_at_content_active .outils-grid-custom,
    .df_at_content_wrapper .evenements-grid-custom,
    .df_at_content_wrapper .outils-grid-custom {
        max-width: 100% !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 20px 0 !important;
    }
    
    .evenement-content,
    .outil-content {
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        min-height: 300px !important;
    }
    
    .description-courte,
    .outil-description {
        flex: 1 1 auto !important;
        margin-bottom: 20px !important;
        font-size: 16px !important;
    }
    
    .btn-evenement-custom {
        margin-top: auto !important;
        flex-shrink: 0 !important;
        align-self: center !important;
        font-size: 18px !important;
        padding-top: 12px !important;
        padding-right: 45px !important;
        padding-bottom: 12px !important;
        padding-left: 30px !important;
    }
    
    .btn-outil-custom {
        margin-top: auto !important;
        flex-shrink: 0 !important;
        align-self: center !important;
        font-size: 18px !important;
        padding: 12px 24px !important;
    }
    
    .btn-text-custom,
    .btn-text-outil {
        font-size: 18px !important;
    }
    
    .btn-arrow-custom::before,
    .btn-arrow-outil::before {
        border-left: 10px solid #00397C !important;
        border-top: 6px solid transparent !important;
        border-bottom: 6px solid transparent !important;
    }
}

/* === FIX CENTRAGE DANS ADVANCED TABS === */
.df_at_content_wrapper,
.df_at_content_active,
.df_at_container {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-direction: column !important;
}

.df_at_content_active .evenements-grid-custom,
.df_at_content_active .outils-grid-custom,
.df_at_content_wrapper .evenements-grid-custom,
.df_at_content_wrapper .outils-grid-custom {
    justify-content: center !important;
}

/* MOBILE - Centrage spécifique dans tabs */
@media (max-width: 767px) {
    .df_at_content_active .grid-isolation-wrapper.mobile-fixed,
    .df_at_content_wrapper .grid-isolation-wrapper.mobile-fixed,
    .df_at_content_active .grid-isolation-wrapper,
    .df_at_content_wrapper .grid-isolation-wrapper {
        width: 100vw !important;
        max-width: 100vw !important;
        margin-left: 0!important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }
    
    .df_at_content_active div[id*="events-"],
    .df_at_content_active div[id*="tools-"],
    .df_at_content_wrapper div[id*="events-"],
    .df_at_content_wrapper div[id*="tools-"],
    .df_at_content_active .evenements-grid-custom,
    .df_at_content_active .outils-grid-custom,
    .df_at_content_wrapper .evenements-grid-custom,
    .df_at_content_wrapper .outils-grid-custom {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        padding: 0  !important;
        margin:  0 !important;
        box-sizing: border-box !important;
    }
    
    .df_at_content_active .evenement-card-custom,
    .df_at_content_active .outil-card-custom,
    .df_at_content_wrapper .evenement-card-custom,
    .df_at_content_wrapper .outil-card-custom {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
    }
}

/* Ajuster la largeur pour correspondre exactement */
.grid-isolation-wrapper {
    max-width: 100% !important;  /* Change 95% en 100% */
    padding: 0 !important;  /* Enlève le padding de 15px */
}

/* Ajuster les grids pour desktop */
@media screen and (min-width: 1025px) {
    .evenements-grid-custom,
    .outils-grid-custom {
        padding: 0 !important;
        max-width: 100% !important;
    }
    
    /* Ajuster le gap si nécessaire pour que ça match */
    div[id*="events-"],
    div[id*="tools-"] {
        gap: 20px !important;
    }
}


/* FORCE LARGEUR COMPLÈTE POUR OUTILS_RECENTS */
.grid-isolation-wrapper {
    padding: 0 !important;  /* Enlève le padding de 20px */
}

/* Ajuster les grids pour qu'ils prennent toute la largeur */
div[id*="tools-recent"] {
    max-width: 100% !important;  /* Change 95% en 100% */
    padding: 0 !important;  /* Enlève le padding de 15px */
    margin: 20px 0 !important;  /* Garde juste margin top/bottom */
}

/* Pour desktop - forcer largeur complète */
@media screen and (min-width: 1025px) {
    .grid-isolation-wrapper div[id*="tools-recent"] {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
    }
    
    .grid-isolation-wrapper div[id*="tools-recent"] .outil-card-custom {
        width: 100% !important;
        max-width: none !important;
    }
}


/* FORCER LARGEUR EXACTE POUR GRILLE OUTILS */
.grid-isolation-wrapper #tools-recent-68efb6146877d,
.grid-isolation-wrapper div[id*="tools-recent"].outils-grid-custom,
.grid-isolation-wrapper .outils-grid-custom {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 20px 0 !important;
}

/* Desktop */
@media screen and (min-width: 1025px) {
    .grid-isolation-wrapper div[id*="tools-recent"] {
        max-width: 100% !important;
        padding: 0 !important;
    }
}


@media only screen and (max-width: 767px) {
    .difl_advancedtab_0, .difl_advancedtab_1 {
        width: 100% !important;
    }
}


/* FIX ADVANCED TABS MOBILE - LARGEUR 100% */
@media only screen and (max-width: 767px) {
    body .difl_advancedtab_0, 
    body .difl_advancedtab_1,
    .et_pb_section .difl_advancedtab_0,
    .et_pb_section .difl_advancedtab_1 {
        width: 100% !important;
        max-width: 100% !important;
    }
}


/* ALIGNER TITRES TABS À GAUCHE SUR MOBILE */
@media only screen and (max-width: 767px) {
    .difl_advancedtab_0 .df_at_title,
    .difl_advancedtab_1 .df_at_title,
    .df_at_title {
        text-align: left !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        padding-left: 20px !important;
    }
}


.df_at_all_tabs {
    padding-right: 0px!important;
    padding-left: 0px!important;
}

@media (min-width: 480px) and (max-width: 980px) {
    #credits.tablet-three-cols.et_pb_gutters2>.et_pb_column {
        width: 100% !important; 
        margin-right: 3.125% !important;
    }
}

/* MENU */
/* Cache le menu par défaut sur desktop seulement */
@media (min-width: 981px) {
    #main-header #et-top-navigation {
        display: none !important;
    }
    #page-container { padding-top:0px ! important; margin-top:-1px ! important }
}




/* Fix pour les tabs Advanced Tabs sur iPad (768px - 980px) */
@media only screen and (min-width: 768px) and (max-width: 980px) {
    .difl_advancedtab_0 .df_at_container {
        flex-direction: column !important;
        overflow-x: visible !important;
        align-items: center !important;
    }
    
    .difl_advancedtab_0 .df_at_container .et_pb_tab {
        width: 100% !important;
        max-width: 500px !important;
        margin-bottom: 10px !important;
    }
}

/* FIX PADDING ROW ÉVÉNEMENTS ACCUEIL */
@media (min-width: 481px) {
div#events-accueil.et_pb_row.et_pb_row_3.et_pb_gutters3 {  /* ← Change row_4 en row_3 */
    padding-right: 60px !important;
    padding-bottom: 100px !important;
    padding-left: 60px !important;
}}

@media (max-width: 480px) {
div#events-accueil.et_pb_row.et_pb_row_3.et_pb_gutters3 {  /* ← Change row_4 en row_3 */
    padding-right: 0px !important;
    padding-bottom: 100px !important;
    padding-left: 0px !important;
}}
/* FIX PADDING ROW OUTILS ACCUEIL */
div#outils-accueil.et_pb_row.et_pb_row_10.et_pb_gutters1 {
    padding-right: 0px !important;
    padding-bottom: 100px !important;
    padding-left: 0px !important;
}

