/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/
Description: Thème enfant de Hello Elementor
Author: Kiwee Rouge
Template: hello-elementor
Version: 1.0.0
Text Domain: hello-elementor-child
*/

/* Organisation des onglets */
.onglets-oeuvres .elementor-tabs-wrapper {
    display: flex;
}

/* =====================================================
   ONGLETS AVEC IMAGES — ELEMENTOR ONGLETS IMBRIQUÉS
   ===================================================== */

@media (min-width: 768px) {

    /* Les 4 onglets sur toute la largeur */
    .onglets-oeuvres .e-n-tabs-heading {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 0 !important;
    }

    /* Style commun à chaque onglet */
    .onglets-oeuvres .e-n-tab-title {
        position: relative;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 150px;

        display: flex !important;
        align-items: flex-end !important;
        justify-content: center !important;

        padding: 30px 20px !important;

        color: #ffffff !important;
        font-size: 26px;
        font-weight: 400;
        text-align: center;

        background-position: center !important;
        background-repeat: no-repeat !important;
        background-size: cover !important;

        border: none !important;
        border-radius: 0 !important;

        transition:
            background-size 0.4s ease,
            filter 0.3s ease;
    }

    /* Le texte reste au-dessus de l’image */
    .onglets-oeuvres .e-n-tab-title-text {
        position: relative;
        z-index: 2;
        color: #ffffff !important;
        text-shadow: 0 1px 6px rgba(0, 0, 0, 0.55);
    }

    /* ONGLET 1 */
    .onglets-oeuvres .e-n-tab-title[data-tab-index="1"] {
        background-image:
            linear-gradient(
                rgba(67, 0, 31, 0.42),
                rgba(67, 0, 31, 0.42)
            ),
            url("https://aiuffass.com/wp-content/uploads/2026/10/about-aiuffass-association.jpg") !important;
    }

    /* ONGLET 2 */
    .onglets-oeuvres .e-n-tab-title[data-tab-index="2"] {
        background-image:
            linear-gradient(
                rgba(67, 0, 31, 0.42),
                rgba(67, 0, 31, 0.42)
            ),
            url("https://aiuffass.com/wp-content/uploads/2026/10/work-aiuffass-association.jpg") !important;
    }

    /* ONGLET 3 */
    .onglets-oeuvres .e-n-tab-title[data-tab-index="3"] {
        background-image:
            linear-gradient(
                rgba(67, 0, 31, 0.42),
                rgba(67, 0, 31, 0.42)
            ),
            url("https://aiuffass.com/wp-content/uploads/2026/10/organisation-aiuffass-association.jpg") !important;
    }

    /* ONGLET 4 */
    .onglets-oeuvres .e-n-tab-title[data-tab-index="4"] {
        background-image:
            linear-gradient(
                rgba(67, 0, 31, 0.42),
                rgba(67, 0, 31, 0.42)
            ),
            url("https://aiuffass.com/wp-content/uploads/2026/10/europe-silk-filament-yarns.jpg") !important;
    }

    /* Survol */
    .onglets-oeuvres .e-n-tab-title:hover {
        filter: brightness(1.12);
    }

    /* Onglet sélectionné */
    .onglets-oeuvres .e-n-tab-title[aria-selected="true"] {
        box-shadow: inset 0 -7px 0 #760638;
    }

    .onglets-oeuvres .e-n-tab-title[aria-selected="true"] {
        background-blend-mode: normal;
    }
}


@media (max-width: 767px) {

    .onglets-oeuvres .e-n-tab-title {
        min-height: 120px;
        padding: 20px !important;

        display: flex !important;
        align-items: flex-end !important;
        justify-content: center !important;

        color: #ffffff !important;

        background-position: center !important;
        background-repeat: no-repeat !important;
        background-size: cover !important;
    }

    .onglets-oeuvres .e-n-tab-title-text {
        color: #ffffff !important;
        text-align: center;
        text-shadow: 0 1px 6px rgba(0, 0, 0, 0.65);
    }

    .onglets-oeuvres .e-n-tab-title[data-tab-index="1"] {
        background-image:
            linear-gradient(rgba(67, 0, 31, 0.45), rgba(67, 0, 31, 0.45)),
            url("URL-DE-L-IMAGE-1") !important;
    }

    .onglets-oeuvres .e-n-tab-title[data-tab-index="2"] {
        background-image:
            linear-gradient(rgba(67, 0, 31, 0.45), rgba(67, 0, 31, 0.45)),
            url("URL-DE-L-IMAGE-2") !important;
    }

    .onglets-oeuvres .e-n-tab-title[data-tab-index="3"] {
        background-image:
            linear-gradient(rgba(67, 0, 31, 0.45), rgba(67, 0, 31, 0.45)),
            url("URL-DE-L-IMAGE-3") !important;
    }

    .onglets-oeuvres .e-n-tab-title[data-tab-index="4"] {
        background-image:
            linear-gradient(rgba(67, 0, 31, 0.45), rgba(67, 0, 31, 0.45)),
            url("URL-DE-L-IMAGE-4") !important;
    }
}