/**
 * Addis Dev Suite - Shortcode Styles
 * Replicates the production layout for addis_produit CPT pages.
 */

/* ========================================
   MULISH — Font-face (independent family names per weight/style)
   ======================================== */
@font-face {
    font-family: 'Mulish';
    font-display: swap;
    src: url('/wp-content/uploads/et-fonts/Mulish-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Mulish';
    font-display: swap;
    src: url('/wp-content/uploads/et-fonts/Mulish-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'Mulish';
    font-display: swap;
    src: url('/wp-content/uploads/et-fonts/Mulish-SemiBoldItalic.ttf') format('truetype');
    font-weight: 600;
    font-style: italic;
}
@font-face {
    font-family: 'Mulish';
    font-display: swap;
    src: url('/wp-content/uploads/et-fonts/Mulish-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'Mulish';
    font-display: swap;
    src: url('/wp-content/uploads/et-fonts/Mulish-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

/* Independent family aliases (Divi-style) */
@font-face {
    font-family: 'Mulish Black';
    font-display: swap;
    src: url('/wp-content/uploads/et-fonts/Mulish-Black.ttf') format('truetype');
}
@font-face {
    font-family: 'Mulish Semibold';
    font-display: swap;
    src: url('/wp-content/uploads/et-fonts/Mulish-SemiBold.ttf') format('truetype');
}
@font-face {
    font-family: 'Mulish semi bold italic';
    font-display: swap;
    src: url('/wp-content/uploads/et-fonts/Mulish-SemiBoldItalic.ttf') format('truetype');
}

/* ========================================
   WPDATATABLES — Colonne gauche en gras
   ======================================== */
.wpdtSimpleTable td.wpdt-cell[data-col-index="0"] {
    font-weight: 700;
}

/* ========================================
   MENU — Override couleur bleue Divi par défaut (#2ea3f2)
   Pages Divi 5 pures n'ont pas le bloc CSS customizer Divi 4 qui
   corrige les couleurs nav. On force #ea7600 via !important.
   ======================================== */

/* Bordure dropdown sub-menu */
.nav li ul,
.et_mobile_menu {
    border-color: #54585a !important;
}

/* Lien actif / page courante */
.mobile_menu_bar:before,
.mobile_menu_bar:after,
#top-menu li.current-menu-ancestor > a,
#top-menu li.current-menu-item > a,
#top-menu li.current_page_item > a {
    color: #54585a !important;
}

/* Liens dropdown + hover global */
#main-header .nav li ul a,
#top-menu a:hover,
#et-secondary-nav a:hover {
    color: #54585a !important;
}

/* Couleur de base des liens du menu */
#top-menu a,
.et_mobile_menu a,
.nav li ul a {
    color: #54585a !important;
}

/* Liens généraux — exclus des pages transactionnelles WooCommerce */
body:not(.woocommerce-cart):not(.woocommerce-checkout):not(.woocommerce-account) a {
    color: #ea7600;
}

/* Police header/nav — absente sur les pages Divi 5 pures */
body,
input,
textarea,
select {
    font-family: var(--et_global_body_font, 'Mulish', sans-serif);
}

#main-header,
#et-top-navigation,
#top-menu,
#top-menu li,
#top-menu a {
    font-family: 'Mulish', sans-serif;
}

/* ================================================================
   BASE FONT-FAMILY for all Product / Shop / Cart / Checkout blocks
   ================================================================ */
.addis-product-header-wrapper,
.addis-product-pricing-wrapper,
.addis-product-details-wrapper,
.addis-product-sidebar,
.addis-related-products,
.woocommerce-cart,
.woocommerce-checkout,
.addis-cart-notice {
    font-family: 'Mulish', sans-serif;
}

/* ========================================
   MENU — Liens de sous-menu, tous niveaux confondus
   ======================================== */

#top-menu li li a {
    padding: 6px 20px;
    width: 230px !important;
}

/* ========================================
   MENU — Tous les sous-menus imbriqués (flyouts de
   niveau 2+, ex: Gammes, Anciennes gammes, Marques,
   variantes d'une gamme...) : plus larges + 2 colonnes
   + scrollable en hauteur si la liste est longue.
   Le selecteur "li li > .sub-menu" cible uniquement
   les sous-menus de 2e niveau et plus (imbriques sous
   un autre sous-menu), pas les dropdowns de 1er niveau
   directement sous #top-menu (ex: La Maison ADDIS,
   Composants électroniques eux-memes).

   Implementation en flexbox (pas columns:2) : les
   listes a 3+ niveaux ont elles-memes des flyouts
   enfants en position:absolute, et CSS multi-colonnes
   (columns) casse le containing-block de ces enfants
   absolument positionnes (le flyout d'un item de la
   2e colonne s'ouvrait au mauvais endroit et recouvrait
   la colonne). Flexbox + flex-wrap laisse chaque <li>
   dans un flux normal, donc position:relative/absolute
   des sous-flyouts reste correct.
   ======================================== */

#top-menu li li > .sub-menu {
    width: 480px;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    max-height: 70vh;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #54585a #f0f0f0;
}

/* En contexte flex, le <li> se dimensionnait sur le contenu de son <a>
   (230px + 40px de padding = 270px, 2x270 > 480px conteneur -> 1 seul
   par ligne). On fixe explicitement 240px (moitie du conteneur). */
#top-menu li li > .sub-menu > li {
    flex: 0 0 240px;
    width: 240px;
    box-sizing: border-box;
}

#top-menu li li > .sub-menu::-webkit-scrollbar {
    width: 4px;
}

#top-menu li li > .sub-menu::-webkit-scrollbar-track {
    background: #f0f0f0;
}

#top-menu li li > .sub-menu::-webkit-scrollbar-thumb {
    background: #54585a;
    border-radius: 2px;
}

/* ========================================
   MENU — Flyout contenant des familles (classe posee
   en PHP sur "Gammes" / "Anciennes gammes") : UNE
   colonne de 240px au lieu de 480px / 2 colonnes.
   En 2 colonnes, le flyout de niveau 3 s'ouvre a
   left:100% du <li>, soit au milieu du conteneur, et
   recouvre la 2e colonne. Les autres sous-menus
   imbriques (Marques…) gardent leurs 2 colonnes.
   ======================================== */

#top-menu li.addis-has-familles > .sub-menu {
    width: 240px;
    /* La regle generique "li li > .sub-menu" pose max-height + overflow-y:auto.
       Or un conteneur scrollable clippe aussi l'axe X : le flyout de niveau 3,
       ouvert a left:100% donc entierement hors du conteneur de 240px, devenait
       invisible. La liste des familles est courte : on retire le scroll. */
    max-height: none;
    overflow: visible;
}

#top-menu li.addis-has-familles > .sub-menu > li {
    flex: 0 0 240px;
    width: 240px;
}

/* ========================================
   MENU — Niveau 3 : sous-gammes d'une famille
   (ex: Kunzite > Kunzite IV, Kunzite V, ...).
   Une famille compte peu de sous-gammes : une seule
   colonne de 240px est plus lisible que les 480px /
   2 colonnes hérités de la règle "li li > .sub-menu"
   ci-dessus (selecteur plus specifique = il gagne).
   ======================================== */

#top-menu li li li > .sub-menu {
    width: 240px;
    /* La regle generique "li li > .sub-menu" pose overflow-y:auto, ce qui rend
       aussi l'axe X scrollable : 10px de debord (liens de 230px + paddings
       dans un conteneur de 240px) suffisaient a afficher une barre de
       defilement horizontale inutile. On ne coupe que l'axe X. */
    overflow-x: hidden;
}

#top-menu li li li > .sub-menu > li {
    flex: 0 0 240px;
    width: 240px;
}

/* ========================================
   MENU — Sous-menus imbriques au SURVOL, avec
   exclusivite entre freres (classes posees par
   assets/js/shortcodes.js).

   Probleme d'origine : les flyouts de deux freres
   ("Gammes" / "Anciennes gammes", ou deux familles)
   s'ouvrent aux MEMES coordonnees. Au survol pur Divi,
   celui qu'on traverse en chemin reste affiche
   par-dessus celui qu'on veut : superposition decalee
   a l'ecran, clics captes par le mauvais, impossible a
   refermer (le pointeur est dans sa boite -> jamais de
   mouseleave).

   Remede : parmi des freres a sous-menu, seul le
   dernier dont la LIGNE a ete survolee est "actif".
   Les autres sont caches en display:none — sortis de
   la mise en page, ils ne peuvent ni capter le survol
   ni voler un clic.

   L'actif est force visible tant que le dropdown de
   1er niveau est ouvert (ancrage sur et-show-dropdown /
   et-hover poses par Divi) : le trajet en diagonale
   vers son flyout ne le fait plus disparaitre, et a la
   fermeture du dropdown tout disparait ensemble.

   Fail-safe : sans JS, aucune classe n'est posee et le
   menu garde le comportement Divi d'origine.
   ======================================== */

#top-menu li.addis-cache > .sub-menu {
    display: none !important;
}

#top-menu > li.et-show-dropdown li.addis-actif > .sub-menu,
#top-menu > li.et-hover li.addis-actif > .sub-menu {
    visibility: visible !important;
    opacity: 1 !important;
}

/* ========================================
   MENU — Items "famille" (Kunzite, Lazuli, Opaline
   Caisson...) : simple niveau de regroupement, ils ne
   correspondent a aucune page. Le href="#" est
   neutralise en JS (assets/js/shortcodes.js) ; ici on
   supprime seulement l'affordance de lien.
   ======================================== */

#top-menu li.addis-menu-famille > a {
    cursor: default;
}

/* ========================================
   CPT TEMPLATE OVERRIDES
   ======================================== */

/* Neutralise le row-gap Divi5 sur les pages installation */
body.single-addis_installation .et_flex_section,
body.single-addis_installation .et_flex_row,
body.single-addis_installation .et_flex_column,
body.single-addis_installation .et_flex_group,
body.single-addis_installation .et_flex_module {
    row-gap: 0 !important;
}

body.single-addis_produit #left-area {
    width: 100% !important;
    padding-right: 0 !important;
    border-right: none !important;
    margin-right: 0 !important;
    float: none !important;
}

body.single-addis_produit #sidebar {
    display: none !important;
}

/* ========================================
   COMMON
   ======================================== */
.addis-produit-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 0;

    font-family: 'Mulish', sans-serif;
    font-size: 14px;
    line-height: 1.6;
}

.addis-section-label {
    font-size: 18px;
    font-weight: 600;
    color: #54585a;
    text-align: center;
    margin-top: 30px;
    margin-bottom: 8px;
}

.addis-divider {
    height: 1px;
    background: #ddd;
    margin: 0 auto 20px;
    max-width: 100px;
}

.addis-btn-ft {
    display: inline-block;
    background-color: #EA7600;
    color: #fff !important;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 600;
    padding: 10px 24px;
    border-radius: 3px;
    text-decoration: none !important;
    letter-spacing: 0.5px;
    transition: opacity 0.2s;
}

.addis-btn-ft:hover {
    opacity: 0.9;
}

.addis-product-variant-link {
    text-align: left;
    margin: 30px 0 10px;
}

/* Images */
.addis-produit-wrapper img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* ========================================
   SERIES PAGE [addis_produit_series]
   ======================================== */
.addis-series-title {
    font-size: 36px;
    font-weight: 600;
    color: #54585a;
    text-align: center;
    margin: 0 0 30px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.addis-series-images {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 30px;
    align-items: flex-start;
}

.addis-series-main-image {
    flex: 1 1 30%;
    min-width: 280px;
}

.addis-series-install-image {
    flex: 2 1 60%;
    min-width: 280px;
}

.addis-series-description {
    text-align: center;
    margin-bottom: 10px;
    color: #555;
}

.addis-series-long-desc {
    text-align: center;
    margin-bottom: 40px;
    font-size: 15px;

}

/* Variants grid */
.addis-variants-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    margin-bottom: 40px;
}

.addis-variant-card {
    flex: 0 0 calc((100% - 60px) / 4);
    min-width: 0;
    max-width: calc((100% - 60px) / 4);
    text-align: center;
}

.addis-variant-card a {
    display: block;
    margin-bottom: 10px;
}

.addis-variant-card .addis-variant-image-link {
    background-color: #f6f7f7;
}

.addis-variant-card .addis-variant-name-link {
    background-color: #f6f7f7;
}

.addis-variant-image-link {
    position: relative;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    display: block;
}


.addis-variant-card img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    display: block;
    margin: auto;
    object-fit: contain;
    box-sizing: border-box;
    mix-blend-mode: multiply;
    image-rendering: -webkit-optimize-contrast;
}

.addis-variant-name-link {
    display: block;
    text-decoration: none;
}

.addis-variant-name-link:hover .addis-variant-name {
    color: #EA7600;
}

.addis-variant-name {
    font-size: 16px;
    font-weight: 500;
    color: #54585a;
    transition: color 0.2s;
}

.addis-ies-text {
    text-align: center;
    color: #666;
    font-size: 13px;
    line-height: 1.5;
}

/* ========================================
   DETAIL PAGE [addis_produit_detail]
   ======================================== */
.addis-detail-header {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    background: rgba(84, 88, 90, 0.05);
    padding: 30px;
}

.addis-detail-titles {
    flex: 1 1 55%;
}

.addis-series-name {
    font-size: 32px;
    font-weight: 600;
    color: #54585a;
    margin: 0 0 5px;
    text-transform: uppercase;
}

.addis-variant-name {
    font-size: 22px;
    font-weight: 400;
    color: #54585a;
    margin: 0;
}

.addis-detail-button {
    flex: 1 1 30%;
    text-align: right;
}

.addis-detail-main-image {
    text-align: center;
    margin-bottom: 20px;
}

.addis-detail-main-image img {
    margin: 0 auto;
}

/* Image variant page detail — Divi image module
   .et_pb_image_wrap est display:inline-block (Divi), ce qui isole le blend mode.
   On force display:block + fond non-blanc pour que multiply fonctionne. */
body.single-addis_variant .et_pb_image .et_pb_image_wrap {
    box-sizing: border-box;
}

body.single-addis_variant .et_pb_image .et_pb_image_wrap img {
    mix-blend-mode: multiply;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    image-rendering: -webkit-optimize-contrast;
}

/* Image principale page série — fond gris + multiply comme les variantes */
body.single-addis_series .et_pb_image .et_pb_image_wrap {
    mix-blend-mode: multiply;
    display: block;
}

/* Badges — grille de pictogrammes (certifications/caracteristiques du
   produit). Nombre de badges variable selon le produit (champ galerie
   badges_certification, de 9 a 20 en pratique) : grille en table avec
   bordures, 10 par ligne comme sur la maquette.

   Les colonnes sont en minmax(0, 62px) et NON en largeur fixe : une
   largeur fixe (10 x 62px = 620px) deborderait de la zone de description
   qui ne fait que ~510px. Avec minmax, chaque colonne prend au plus 62px
   mais retrecit autant que necessaire pour que les 10 tiennent dans la
   largeur disponible (~51px dans la colonne de description). */
.addis-detail-badges {
    display: grid;
    grid-template-columns: repeat(10, minmax(0, 62px));
    justify-content: center;
    gap: 0;
    margin: 0 auto 30px;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    /* Filet de securite : rien ne peut sortir de la zone de description. */
    overflow: hidden;
}

/* Pictogrammes colles les uns aux autres, sans espace ni contour ajoute
   (demande cliente, conforme a la maquette) : ni bordure CSS, ni padding,
   ni gap. Les cadres visibles font partie des images elles-memes. */
.addis-detail-badges img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    padding: 0;
    border: 0;
    box-sizing: border-box;
    display: block;
}

/* En dessous de ~1200px, la zone de description devient trop etroite pour
   10 colonnes (a 900px de fenetre elle ne fait que 340px, soit 34px par
   pictogramme : illisible). On passe alors a 5 colonnes, sur deux fois plus
   de lignes, avec des cellules qui retrouvent leur taille normale. */
@media (max-width: 1200px) {
    .addis-detail-badges {
        grid-template-columns: repeat(5, minmax(0, 62px));
    }
}

/* Plans techniques (gallery from plans_techniques field) */
.addis-detail-plans {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    margin-bottom: 30px;
}

.addis-detail-plans .addis-plan-item {
    flex: 1 1 30%;
    min-width: 230px;
    max-width: 300px;
    display: block;
    transition: opacity 0.2s;
        background-color: #f6f7f7;
}

.addis-detail-plans .addis-plan-item:hover {
    opacity: 0.85;
}

.addis-detail-plans img {
    width: 100%;
    height: auto;
    display: block;
 /*   border: 1px solid #ddd;*/
    border-radius: 4px;
    mix-blend-mode: multiply;
}

/* Description */
.addis-detail-description {
    margin-bottom: 30px;
}

/* Avantages row */
.addis-detail-avantages-row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 30px;
}

.addis-detail-avantages {
    flex: 1 1 55%;
    min-width: 280px;
}

.addis-detail-avantages ul {
    margin: 0;
    padding-left: 20px;
}

.addis-detail-avantages li {
    margin-bottom: 6px;
}

/* Tables layout */
.addis-tables-row {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin-bottom: 20px;
}

.addis-table-col {
    flex: 1 1 45%;
    min-width: 280px;
}

.addis-table-label {
    font-size: 16px;
    font-weight: 600;
    color: #54585a;
    text-align: center;
    margin-bottom: 10px;
}

.addis-table-full {
    margin-bottom: 30px;
}

/* Plans */
.addis-plans-row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 30px;
}

.addis-plan-item {
    flex: 1 1 45%;
    min-width: 280px;
    text-align: center;
}

.addis-plan-placeholder {
    flex: 1 1 100%;
    text-align: center;
    color: #999;
    font-style: italic;
    padding: 20px;
}

/* Download button area */
.addis-download-button {
    text-align: center;
    margin-bottom: 30px;
}

/* Fiche technique [addis_variant_fiche] */
.addis-fiche-btn {
    display: inline-block;
    background-color: #EA7600;
    color: #fff !important;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 600;
    padding: 10px 24px;
    border-radius: 3px;
    text-decoration: none !important;
    letter-spacing: 0.5px;
    transition: opacity 0.2s;
}

.addis-fiche-btn:hover {
    opacity: 0.88;
    color: #fff !important;
}

.addis-fiche-login {
    display: inline-block;
    color: #888;
    font-size: 12px;
    text-decoration: underline;
}

/* PDF groupé [addis_variant_pdf] */
.addis-pdf-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    justify-content: center;
}

.addis-catalogue-btn {
    display: inline-block;
    background-color: #54585a;
    color: #fff !important;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 700;
    padding: 10px 24px;
    border-radius: 3px;
    text-decoration: none !important;
    letter-spacing: 0.5px;
    transition: opacity 0.2s;
}

.addis-catalogue-btn:hover {
    opacity: 0.88;
    color: #fff !important;
}

/* Plans + légendes optionnelles [addis_variant_plans] */
.addis-plan-card {
    flex: 1 1 30%;
    min-width: 230px;
    max-width: 300px;
    text-align: center;
}

.addis-plan-legende {
    font-family: 'Mulish semi bold italic', sans-serif;
    font-size: 15px;
    color: #54585a;
    margin-top: 6px;
}

/* Code commande [addis_variant_code_commande] */
.addis-code-commande {
    overflow-x: auto;
    margin-bottom: 30px;
    color: #54585a;
}

.addis-code-commande table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    font-size: inherit;
    text-align: center;
}

.addis-code-commande td,
.addis-code-commande th {
    border: 1px solid #ccc;
    padding: 10px;
    vertical-align: middle;
    background-color: #fff;
    word-break: normal;
}

.addis-code-commande th {
    background-color: #fff;
    font-weight: 600;
}

.addis-code-commande tr:nth-child(even) td {
    background-color: #fff;
}

.addis-code-commande tr:first-child td {
    background-color: #fff;
    font-weight: 600;
}

/* Photométries [addis_variant_photometries] */
.addis-detail-photometries {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center;
    margin-bottom: 30px;
}

.addis-photometrie-card {
    flex: 1 1 200px;
    max-width: 240px;
    text-align: center;
}

.addis-photometrie-item {
    display: block;
    transition: opacity 0.2s;
}

.addis-photometrie-item:hover {
    opacity: 0.85;
}

.addis-photometrie-item img {
    width: 100%;
    height: auto;
    display: block;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.addis-photometrie-legende {
    font-family: 'Mulish semi bold italic', sans-serif;
    font-size: 15px;
    color: #54585a;
    margin-top: 5px;
    word-break: break-word;
}

/* Code Commande sections [addis_variant_code_commande] */
.addis-code-section {
    margin-bottom: 24px;
}

.addis-code-section-title {
    font-size: 14px;
    font-weight: 600;
    color: #54585a;
    margin: 0 0 8px;
    padding-bottom: 4px;
    border-bottom: 2px solid #EA7600;
    display: inline-block;
}

/* Les blocs vides sont masqués via JS (voir shortcodes.js) */
.addis-no-content {
    display: none;
}

/* Responsive */
@media (max-width: 768px) {
    .addis-series-images,
    .addis-detail-header,
    .addis-tables-row,
    .addis-plans-row,
    .addis-variants-grid {
        flex-direction: column;
    }

    .addis-variant-card {
        max-width: 100%;
    }

    .addis-detail-button {
        text-align: left;
        margin-top: 10px;
    }

    .addis-series-title {
        font-size: 28px;
    }

    .addis-series-name {
        font-size: 24px;
    }
}

/* =========================================================================
   [addis_gammes_grid]
   ========================================================================= */

.addis-gammes-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.addis-gamme-card {
    flex: 0 0 calc((100% - 48px) / 4);
    max-width: calc((100% - 48px) / 4);
    min-width: 0;
    box-sizing: border-box;
}

.addis-gamme-link {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
}

.addis-gamme-link:hover .addis-gamme-name {
    color: #ea7600;
}



.addis-gamme-name {
    font-family: 'Mulish Semibold', sans-serif;
    font-size: 25px;
    color: #666666;
    margin-top: 10px;
    line-height: 1.3;
    text-align: center;
    transition: color 0.2s;
}

.addis-gamme-subtitle {
    font-family: 'Mulish', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: #666666;
    margin: 4px 0 0;
    line-height: 1.3;
    text-align: center;
}

.addis-gamme-img-wrap {
    position: relative;
    width: 100%;
    max-width: 180px;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    margin: 0 auto;
}

.addis-gamme-img-wrap img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    display: block;
    margin: auto;
    object-fit: contain;
    box-sizing: border-box;
    mix-blend-mode: multiply;
    transition: transform 0.3s ease;
    image-rendering: -webkit-optimize-contrast;
}

.addis-gamme-card:hover .addis-gamme-img-wrap img {
    transform: scale(0.97);
}

/* Tablette : 2 par ligne */
@media (max-width: 980px) {
    .addis-gamme-card {
        flex: 0 0 calc((100% - 16px) / 2);
        max-width: calc((100% - 16px) / 2);
    }
}

/* Mobile : 1 par ligne */
@media (max-width: 600px) {
    .addis-gamme-card {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

/* ── Row separators between gamme card rows ── */
.addis-gammes-grid .addis-row-divider {
    flex: 0 0 100%;
    max-width: 100%;
    margin: 0;
    padding: 8px 0;
    display: none;
}

.addis-gammes-grid .addis-row-divider.et_pb_divider:before {
    border-top: 1px solid #ea7600 !important;
}

.addis-gammes-grid .addis-row-divider .et_pb_divider_internal {
    width: 100%;
    display: block;
    border: none !important;
}

/* Desktop: 4 cards per row -> show divider after every 4th card */
@media (min-width: 981px) {
    .addis-gammes-grid .addis-gamme-card:nth-child(8n-1) + .addis-row-divider {
        display: block;
    }
}

/* Tablet: 2 cards per row -> show divider after every 2nd card */
@media (max-width: 980px) and (min-width: 601px) {
    .addis-gammes-grid .addis-gamme-card:nth-child(4n-1) + .addis-row-divider {
        display: block;
    }
}

/* Mobile: 1 card per row -> show divider after every card */
@media (max-width: 600px) {
    .addis-gammes-grid .addis-gamme-card + .addis-row-divider {
        display: block;
    }
}

/* =========================================================================
   [addis_installation_variantes] — Grille de produits liés à une installation
   ========================================================================= */

.addis-installation-produits {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin: 20px 0;
}

.addis-installation-produit-card {
    flex: 1 1 320px;
    min-width: 320px;
    max-width: calc(50% - 8px);
    text-align: center;
}

.addis-installation-produit-img-link {
    display: block;
    text-decoration: none;
}

.addis-installation-produit-img-wrap {
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
background-color: rgba(84, 88, 90, 0.05);
}

.addis-installation-produit-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    mix-blend-mode: multiply;
}

.addis-installation-produit-btn {
    display: block;
    background-color: #EA7600;
    color: #fff !important;
    text-decoration: none !important;
    font-family: 'Mulish', sans-serif;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 16px 24px;
    margin-top: 8px;
    text-align: center;
    transition: opacity 0.2s;
}

.addis-installation-produit-btn:hover {
    opacity: 0.88;
    color: #fff !important;
}

/* ========================================
   INSTALLATION — Détails du projet
   [addis_installation_details]
   ======================================== */

.addis-installation-details {
    font-family: 'Mulish semi bold italic', sans-serif;
    font-size: 15px;

}

.addis-installation-details p {
    padding-bottom: 5px !important;
}

.addis-details-title,
.addis-details-label,
.addis-details-value {
    font-family: 'Mulish', sans-serif;
}

.addis-details-label {
    color: #666;
}

.addis-details-value {

}

.addis-details-divider {
    height: 1px;
    background: var(--gcid-primary-color, #ea7600);
    opacity: 0.25;
}

.addis-details-value a {

    text-decoration: none;
}

.addis-details-value a:hover {
    color: #ea7600;
}

/* ========================================
   INSTALLATION — Galerie photos
   [addis_installation_gallery]
   ======================================== */

.addis-installation-gallery {
    display: grid;
    gap: var(--gal-gap, 40px);
    margin-top: 20px;
}

/* ── Mode auto (défaut) : alternance 2 | 3 | 2 | 3 …
   Grille en 6 colonnes, groupes de 5 (2+3).
   ─ Positions 1,2 (5n+1, 5n+2) → span 3 → rangée de 2 images
   ─ Positions 3,4,5 (5n+3, 5n+4, 5n=5n+5) → span 2 → rangée de 3 images  */
.addis-gallery-auto {
    grid-template-columns: repeat(6, 1fr);
}

.addis-gallery-auto .addis-gallery-item:nth-child(5n+1),
.addis-gallery-auto .addis-gallery-item:nth-child(5n+2) {
    grid-column: span 3;
}

.addis-gallery-auto .addis-gallery-item:nth-child(5n+3),
.addis-gallery-auto .addis-gallery-item:nth-child(5n+4),
.addis-gallery-auto .addis-gallery-item:nth-child(5n) {
    grid-column: span 2;
}

.addis-installation-gallery .addis-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.addis-installation-gallery:not(.addis-gallery-auto) .addis-gallery-item img {
    height: 100%;
    object-fit: cover;
}

.addis-gallery-item {
    overflow: hidden;
    aspect-ratio: var(--gal-ratio, 4/3);
}

.addis-gallery-item img {
    transition: transform 0.4s ease;
}

.addis-installation-gallery .addis-gallery-item:hover img {
    transform: scale(1.04);
}

@media (max-width: 768px) {
    .addis-gallery-auto {
        grid-template-columns: repeat(2, 1fr);
    }

    .addis-gallery-auto .addis-gallery-item:nth-child(5n+1),
    .addis-gallery-auto .addis-gallery-item:nth-child(5n+2),
    .addis-gallery-auto .addis-gallery-item:nth-child(5n+3),
    .addis-gallery-auto .addis-gallery-item:nth-child(5n+4),
    .addis-gallery-auto .addis-gallery-item:nth-child(5n) {
        grid-column: span 1;
    }
}

@media (max-width: 480px) {
    .addis-installation-gallery {
        gap: 20px;
    }

    .addis-gallery-auto {
        grid-template-columns: 1fr;
    }
}

/* =========================================================================
   [addis_related_products]
   ========================================================================= */

.addis-related-products {
    margin: 30px 0;
}

.addis-related-products-title {
    font-size: 24px;
    font-weight: 600;
    color: #54585a;
    text-align: center;
    margin-bottom: 30px;
}

.addis-related-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
}

.addis-related-card {
    flex: 1 1 280px;
    min-width: 280px;
    max-width: calc(50% - 10px);
    text-align: center;
}

.addis-related-image-wrap {
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background-color: #f6f7f7;
}

.addis-related-image-wrap img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    display: block;
    margin: auto;
    object-fit: contain;
}

.addis-related-card:hover .addis-related-image-wrap img {
    transform: scale(0.97);
}

.addis-related-name {
    font-size: 16px;
    font-weight: 500;
    color: #54585a;
    margin-top: 10px;
}

@media (max-width: 768px) {
    .addis-related-card {
        max-width: 100%;
    }
}

/* =========================================================================
   [addis_product_archive]
   ========================================================================= */

.addis-archive-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: flex-start;
}

.addis-archive-card {
    flex: 0 0 calc(25% - 15px);
    max-width: calc(25% - 15px);
    text-align: center;
}

.addis-archive-card-img {
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background-color: #f6f7f7;
}

.addis-archive-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.addis-archive-card:hover .addis-archive-card-img img {
    transform: scale(1.04);
}

.addis-archive-card-no-img {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f6f7f7;
    color: #999;
    font-size: 13px;
}

.addis-archive-card-title {
    font-size: 14px;
    font-weight: 500;
    color: #54585a;
    margin-top: 8px;
}

@media (max-width: 980px) {
    .addis-archive-card {
        flex: 0 0 calc(50% - 10px);
        max-width: calc(50% - 10px);
    }
}

@media (max-width: 600px) {
    .addis-archive-card {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

/* =========================================================================
   [addis_produit_header] — Header produit unifié
   ========================================================================= */

.addis-product-header-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin-bottom: 30px;
    align-items: flex-start;
}

.addis-product-gallery {
    flex: 1 1 45%;
    min-width: 280px;
}

.addis-product-main-image {
    text-align: center;
    margin-bottom: 15px;
    background-color: #f6f7f7;
}

.addis-product-main-image img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
    object-fit: contain;
}

.addis-product-thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
}

.addis-product-thumb {
    width: 70px;
    height: 70px;
    background-color: #f6f7f7;
    cursor: pointer;
    border: 2px solid transparent;
    transition: border-color 0.2s;
}

.addis-product-thumb.active,
.addis-product-thumb:hover {
    border-color: #ea7600;
}

.addis-product-thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.addis-product-info {
    flex: 1 1 45%;
    min-width: 280px;
}

.addis-product-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.addis-product-brand img {
    max-height: 40px;
    width: auto;
}

.addis-product-title {
    font-size: 28px;
    font-weight: 600;
    color: #54585a;
    margin: 0 0 10px;
}

.addis-product-reference {
    font-size: 13px;
    color: #888;
    margin-bottom: 15px;
}

.addis-product-short-desc {
    font-size: 14px;
    color: #555;
    margin-bottom: 20px;
}

.addis-product-stock {
    font-size: 13px;
    margin-bottom: 15px;
}

.addis-product-stock.in-stock {
    color: #28a745;
}

.addis-product-stock.out-of-stock {
    color: #dc3545;
}

.addis-product-cart-row {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    align-items: center;
    margin-bottom: 20px;
}

.addis-product-qty {
    width: 70px;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 3px;
    text-align: center;
}

.addis-product-add-to-cart {
    display: inline-block;
    background-color: #EA7600;
    color: #fff !important;
    border: none;
    padding: 12px 30px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: 3px;
    cursor: pointer;
    transition: opacity 0.2s;
}

.addis-product-add-to-cart:hover {
    opacity: 0.9;
}

.addis-product-min-qty {
    font-size: 12px;
    color: #888;
    width: 100%;
}

/* =========================================================================
   [addis_produit_pricing] — Tableau de prix
   ========================================================================= */

.addis-product-pricing-wrapper {
    margin-bottom: 30px;
}

.addis-pricing-table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 14px;
}

.addis-pricing-table th,
.addis-pricing-table td {
    border: 1px solid #ddd;
    padding: 12px 15px;
    text-align: center;
}

.addis-pricing-table th {
    background-color: #f8f9fa;
    font-weight: 600;
    color: #54585a;
}

.addis-pricing-table td {
    color: #555;
}

.addis-pricing-table tr:nth-child(even) td {
    background-color: #f8f9fa;
}

/* =========================================================================
   [addis_produit_details] — Onglets
   ========================================================================= */

.addis-product-details-wrapper {
    margin-bottom: 30px;
}

.addis-product-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    border-bottom: 2px solid #eee;
    margin-bottom: 20px;
}

.addis-product-tab {
    padding: 12px 20px;
    background: #f8f9fa;
    border: none;
    font-size: 13px;
    font-weight: 600;
    color: #54585a;
    cursor: pointer;
    transition: background 0.2s;
}

.addis-product-tab:hover {
    background: #e9ecef;
}

.addis-product-tab.active {
    background: #ea7600;
    color: #fff;
}

.addis-product-tab-panel {
    display: none;
}

.addis-product-tab-panel.active {
    display: block;
}

.addis-product-specs-table {
    width: 100%;
    border-collapse: collapse;
}

.addis-product-specs-table th,
.addis-product-specs-table td {
    border: 1px solid #ddd;
    padding: 10px 15px;
    text-align: left;
}

.addis-product-specs-table th {
    background: #f8f9fa;
    width: 35%;
    font-weight: 600;
    color: #54585a;
}

.addis-product-docs-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.addis-product-docs-list li {
    margin-bottom: 10px;
}

.addis-product-docs-list a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #ea7600;
    text-decoration: none;
    font-weight: 500;
}

.addis-product-docs-list a:hover {
    text-decoration: underline;
}

/* =========================================================================
   [addis_produit_sidebar]
   ========================================================================= */

.addis-product-sidebar {
    margin-bottom: 30px;
}

.addis-product-sidebar-title {
    font-size: 18px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 15px;
}

.addis-product-sidebar-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.addis-product-sidebar-list li {
    padding: 8px 0;
    border-bottom: 1px solid #eee;
}

.addis-product-sidebar-list a {
    color: #54585a;
    text-decoration: none;
}

.addis-product-sidebar-list a:hover {
    color: #ea7600;
}

/* =========================================================================
   [addis_cart_notice]
   ========================================================================= */

.addis-cart-notice {
    padding: 15px 20px;
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 4px;
    color: #856404;
    margin-bottom: 20px;
}

/* =========================================================================
   [addis_product_documents]
   ========================================================================= */

.addis-documents-wrapper {
    margin: 20px 0;
}

.addis-documents-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.addis-doc-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 15px;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 4px;
    margin-bottom: 8px;
}

.doc-badge {
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 11px;
    font-weight: bold;
    color: #fff;
}

.doc-title {
    flex: 1;
    font-weight: 500;
}

.doc-download {
    background: #0073aa;
    color: #fff !important;
    padding: 6px 15px;
    border-radius: 3px;
    text-decoration: none !important;
    font-size: 13px;
}

.doc-download:hover {
    opacity: 0.9;
}

/* =========================================================================
   [addis_produit_references]
   ========================================================================= */

.addis-references-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    margin-bottom: 30px;
}

.addis-reference-card {
    flex: 1 1 200px;
    max-width: 240px;
    text-align: center;
}

.addis-reference-card img {
    max-width: 100%;
    height: auto;
    margin-bottom: 10px;
}

.addis-reference-name {
    font-size: 14px;
    font-weight: 500;
    color: #54585a;
}

/* =========================================================================
   [addis_produit_caracteristiques]
   ========================================================================= */

.addis-caracteristiques-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.addis-caracteristiques-list li {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid #eee;
}

.addis-caracteristiques-label {
    font-weight: 600;
    color: #54585a;
}

.addis-caracteristiques-value {
    color: #555;
}

/* =========================================================================
   [addis_produit_avantages]
   ========================================================================= */

.addis-avantages-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.addis-avantages-list li {
    position: relative;
    padding-left: 25px;
    margin-bottom: 10px;
    color: #555;
}

.addis-avantages-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #ea7600;
    font-weight: bold;
}

/* =========================================================================
   WooCommerce cart / checkout overrides
   ========================================================================= */

.addis-cart-notice {
    padding: 15px 20px;
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 4px;
    color: #856404;
    margin-bottom: 20px;
}

.woocommerce-cart .shop_table .product-name a,
.woocommerce-checkout .shop_table .product-name a {
    color: #54585a;
}

.woocommerce-cart .shop_table .product-name a:hover,
.woocommerce-checkout .shop_table .product-name a:hover {
    color: #ea7600;
}

.woocommerce table.shop_table .product-thumbnail img {
    max-width: 100px !important;
    height: auto !important;
    object-fit: contain;
}

/* =========================================================================
   [addis_produit_gallery]
   ========================================================================= */

.addis-product-gallery-main {
    text-align: center;
    margin-bottom: 15px;
    background-color: #f6f7f7;
}

.addis-product-gallery-main img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
    object-fit: contain;
}

.addis-product-gallery-thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
}

.addis-product-gallery-thumbs img {
    width: 80px;
    height: 80px;
    object-fit: contain;
    cursor: pointer;
    border: 2px solid transparent;
    transition: border-color 0.2s;
}

.addis-product-gallery-thumbs img:hover,
.addis-product-gallery-thumbs img.active {
    border-color: #ea7600;
}

/* =========================================================================
   [addis_product_specifications]
   ========================================================================= */

.addis-specs-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 30px;
}

.addis-specs-table th,
.addis-specs-table td {
    border: 1px solid #ddd;
    padding: 10px 15px;
    text-align: left;
}

.addis-specs-table th {
    background: #f8f9fa;
    font-weight: 600;
    color: #54585a;
    width: 30%;
}

/* =========================================================================
   [addis_product_downloads]
   ========================================================================= */

.addis-downloads-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.addis-downloads-list li {
    margin-bottom: 10px;
}

.addis-downloads-list a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #ea7600;
    text-decoration: none;
    font-weight: 500;
}

.addis-downloads-list a:hover {
    text-decoration: underline;
}

/* =========================================================================
   [addis_product_brand]
   ========================================================================= */

.addis-product-brand-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 15px;
}

.addis-product-brand-thumb img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

.addis-product-brand-name {
    font-size: 14px;
    font-weight: 600;
    color: #54585a;
}

/* =========================================================================
   [addis_product_options]
   ========================================================================= */

.addis-options-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    margin-bottom: 30px;
}

.addis-option-card {
    flex: 1 1 200px;
    max-width: 240px;
    text-align: center;
}

.addis-option-card img {
    max-width: 100%;
    height: auto;
    margin-bottom: 10px;
    object-fit: contain;
}

.addis-option-name {
    font-size: 14px;
    font-weight: 500;
    color: #54585a;
}

/* =========================================================================
   [addis_product_videos]
   ========================================================================= */

.addis-videos-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    margin-bottom: 30px;
}

.addis-video-card {
    flex: 1 1 300px;
    max-width: 460px;
}

.addis-video-card iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    border: none;
}

.addis-video-title {
    font-size: 14px;
    font-weight: 500;
    color: #54585a;
    margin-top: 10px;
}

/* =========================================================================
   [addis_product_360]
   ========================================================================= */

.addis-360-viewer {
    text-align: center;
    margin-bottom: 30px;
}

.addis-360-viewer img {
    max-width: 100%;
    height: auto;
}

/* =========================================================================
   [addis_product_configurator]
   ========================================================================= */

.addis-configurator-wrapper {
    background: #f8f9fa;
    padding: 25px;
    border-radius: 4px;
    margin-bottom: 30px;
}

.addis-configurator-title {
    font-size: 18px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 20px;
}

.addis-configurator-row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 20px;
}

.addis-configurator-field {
    flex: 1 1 200px;
}

.addis-configurator-field label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 5px;
}

.addis-configurator-field select,
.addis-configurator-field input {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 3px;
}

/* =========================================================================
   [addis_product_stock]
   ========================================================================= */

.addis-stock-indicator {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
}

.addis-stock-indicator.in-stock::before {
    content: "";
    width: 10px;
    height: 10px;
    background: #28a745;
    border-radius: 50%;
}

.addis-stock-indicator.out-of-stock::before {
    content: "";
    width: 10px;
    height: 10px;
    background: #dc3545;
    border-radius: 50%;
}

/* =========================================================================
   [addis_product_price]
   ========================================================================= */

.addis-price-display {
    font-size: 24px;
    font-weight: 700;
    color: #54585a;
    margin-bottom: 15px;
}

.addis-price-display .addis-price-unit {
    font-size: 14px;
    font-weight: 400;
    color: #888;
}

/* =========================================================================
   [addis_product_lead_time]
   ========================================================================= */

.addis-lead-time {
    font-size: 13px;
    color: #555;
    margin-bottom: 15px;
}

/* =========================================================================
   [addis_product_min_order]
   ========================================================================= */

.addis-min-order {
    font-size: 13px;
    color: #888;
    margin-bottom: 15px;
}

/* =========================================================================
   [addis_product_warranty]
   ========================================================================= */

.addis-warranty-info {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #555;
    margin-bottom: 15px;
}

/* =========================================================================
   [addis_product_shipping]
   ========================================================================= */

.addis-shipping-info {
    font-size: 13px;
    color: #555;
    margin-bottom: 15px;
}

/* =========================================================================
   [addis_product_sku]
   ========================================================================= */

.addis-sku-display {
    font-size: 13px;
    color: #888;
    margin-bottom: 15px;
}

/* =========================================================================
   [addis_product_categories]
   ========================================================================= */

.addis-categories-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 15px;
}

.addis-categories-list a {
    display: inline-block;
    padding: 4px 10px;
    background: #f8f9fa;
    border-radius: 3px;
    font-size: 12px;
    color: #54585a;
    text-decoration: none;
}

.addis-categories-list a:hover {
    background: #ea7600;
    color: #fff;
}

/* =========================================================================
   [addis_product_tags]
   ========================================================================= */

.addis-tags-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 15px;
}

.addis-tags-list a {
    display: inline-block;
    padding: 4px 10px;
    background: #f8f9fa;
    border-radius: 3px;
    font-size: 12px;
    color: #54585a;
    text-decoration: none;
}

.addis-tags-list a:hover {
    background: #ea7600;
    color: #fff;
}

/* =========================================================================
   [addis_product_share]
   ========================================================================= */

.addis-share-buttons {
    display: flex;
    gap: 10px;
    margin-top: 20px;
}

.addis-share-buttons a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #f8f9fa;
    color: #54585a;
    text-decoration: none;
    transition: background 0.2s;
}

.addis-share-buttons a:hover {
    background: #ea7600;
    color: #fff;
}

/* =========================================================================
   [addis_product_related]
   ========================================================================= */

.addis-related-products-section {
    margin-top: 40px;
}

.addis-related-products-section-title {
    font-size: 24px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 25px;
    text-align: center;
}

/* =========================================================================
   [addis_product_upsells]
   ========================================================================= */

.addis-upsells-section {
    margin-top: 40px;
}

.addis-upsells-section-title {
    font-size: 24px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 25px;
    text-align: center;
}

/* =========================================================================
   [addis_product_cross_sells]
   ========================================================================= */

.addis-cross-sells-section {
    margin-top: 40px;
}

.addis-cross-sells-section-title {
    font-size: 24px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 25px;
    text-align: center;
}

/* =========================================================================
   [addis_product_breadcrumbs]
   ========================================================================= */

.addis-breadcrumbs {
    font-size: 13px;
    color: #888;
    margin-bottom: 20px;
}

.addis-breadcrumbs a {
    color: #54585a;
    text-decoration: none;
}

.addis-breadcrumbs a:hover {
    color: #ea7600;
}

.addis-breadcrumbs .addis-breadcrumbs-separator {
    margin: 0 8px;
    color: #ccc;
}

/* =========================================================================
   [addis_product_rating]
   ========================================================================= */

.addis-rating-display {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 15px;
}

.addis-rating-stars {
    color: #ffc107;
}

.addis-rating-count {
    font-size: 13px;
    color: #888;
}

/* =========================================================================
   [addis_product_reviews]
   ========================================================================= */

.addis-reviews-list {
    margin-bottom: 30px;
}

.addis-review-item {
    border-bottom: 1px solid #eee;
    padding: 20px 0;
}

.addis-review-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.addis-review-author {
    font-weight: 600;
    color: #54585a;
}

.addis-review-date {
    font-size: 13px;
    color: #888;
}

.addis-review-rating {
    color: #ffc107;
    margin-bottom: 10px;
}

.addis-review-content {
    color: #555;
    line-height: 1.6;
}

/* =========================================================================
   [addis_product_faq]
   ========================================================================= */

.addis-faq-list {
    margin-bottom: 30px;
}

.addis-faq-item {
    border-bottom: 1px solid #eee;
}

.addis-faq-question {
    padding: 15px 0;
    font-weight: 600;
    color: #54585a;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.addis-faq-answer {
    padding: 0 0 15px;
    color: #555;
    line-height: 1.6;
}

/* =========================================================================
   [addis_product_support]
   ========================================================================= */

.addis-support-info {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 4px;
    margin-bottom: 30px;
}

.addis-support-info-title {
    font-size: 16px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 10px;
}

.addis-support-info-content {
    font-size: 14px;
    color: #555;
    line-height: 1.6;
}

/* =========================================================================
   [addis_product_guarantee]
   ========================================================================= */

.addis-guarantee-info {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 4px;
    margin-bottom: 30px;
}

.addis-guarantee-info-title {
    font-size: 16px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 10px;
}

.addis-guarantee-info-content {
    font-size: 14px;
    color: #555;
    line-height: 1.6;
}

/* =========================================================================
   [addis_product_sustainability]
   ========================================================================= */

.addis-sustainability-info {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 4px;
    margin-bottom: 30px;
}

.addis-sustainability-info-title {
    font-size: 16px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 10px;
}

.addis-sustainability-info-content {
    font-size: 14px;
    color: #555;
    line-height: 1.6;
}

/* =========================================================================
   [addis_product_certifications]
   ========================================================================= */

.addis-certifications-list {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: center;
    margin-bottom: 30px;
}

.addis-certifications-list img {
    max-height: 60px;
    width: auto;
    object-fit: contain;
}

/* =========================================================================
   [addis_product_partners]
   ========================================================================= */

.addis-partners-list {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    margin-bottom: 30px;
}

.addis-partners-list img {
    max-height: 60px;
    width: auto;
    object-fit: contain;
}

/* =========================================================================
   [addis_product_newsletter]
   ========================================================================= */

.addis-newsletter-form {
    background: #f8f9fa;
    padding: 25px;
    border-radius: 4px;
    margin-bottom: 30px;
}

.addis-newsletter-form-title {
    font-size: 18px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 15px;
}

.addis-newsletter-form-content {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.addis-newsletter-form-content input[type="email"] {
    flex: 1 1 200px;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 3px;
}

.addis-newsletter-form-content button {
    padding: 10px 20px;
    background: #ea7600;
    color: #fff;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}

/* =========================================================================
   [addis_product_contact]
   ========================================================================= */

.addis-contact-form {
    background: #f8f9fa;
    padding: 25px;
    border-radius: 4px;
    margin-bottom: 30px;
}

.addis-contact-form-title {
    font-size: 18px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 15px;
}

.addis-contact-form-row {
    display: flex;
    gap: 15px;
    margin-bottom: 15px;
    flex-wrap: wrap;
}

.addis-contact-form-field {
    flex: 1 1 200px;
}

.addis-contact-form-field label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 5px;
}

.addis-contact-form-field input,
.addis-contact-form-field textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 3px;
}

.addis-contact-form-field textarea {
    min-height: 120px;
}

.addis-contact-form button {
    padding: 12px 25px;
    background: #ea7600;
    color: #fff;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    font-weight: 600;
}

/* =========================================================================
   [addis_product_quote]
   ========================================================================= */

.addis-quote-form {
    background: #f8f9fa;
    padding: 25px;
    border-radius: 4px;
    margin-bottom: 30px;
}

.addis-quote-form-title {
    font-size: 18px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 15px;
}

.addis-quote-form-row {
    display: flex;
    gap: 15px;
    margin-bottom: 15px;
    flex-wrap: wrap;
}

.addis-quote-form-field {
    flex: 1 1 200px;
}

.addis-quote-form-field label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 5px;
}

.addis-quote-form-field input,
.addis-quote-form-field textarea,
.addis-quote-form-field select {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 3px;
}

.addis-quote-form-field textarea {
    min-height: 100px;
}

.addis-quote-form button {
    padding: 12px 25px;
    background: #ea7600;
    color: #fff;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    font-weight: 600;
}

/* =========================================================================
   [addis_product_samples]
   ========================================================================= */

.addis-samples-form {
    background: #f8f9fa;
    padding: 25px;
    border-radius: 4px;
    margin-bottom: 30px;
}

.addis-samples-form-title {
    font-size: 18px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 15px;
}

.addis-samples-form-row {
    display: flex;
    gap: 15px;
    margin-bottom: 15px;
    flex-wrap: wrap;
}

.addis-samples-form-field {
    flex: 1 1 200px;
}

.addis-samples-form-field label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 5px;
}

.addis-samples-form-field input,
.addis-samples-form-field textarea,
.addis-samples-form-field select {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 3px;
}

.addis-samples-form-field textarea {
    min-height: 100px;
}

.addis-samples-form button {
    padding: 12px 25px;
    background: #ea7600;
    color: #fff;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    font-weight: 600;
}

/* =========================================================================
   [addis_product_custom]
   ========================================================================= */

.addis-custom-section {
    margin-bottom: 30px;
}

.addis-custom-section-title {
    font-size: 20px;
    font-weight: 600;
    color: #54585a;
    margin-bottom: 15px;
}

.addis-custom-section-content {
    color: #555;
    line-height: 1.6;
}


/* ============================================================
   [addis_installations_grid] — Restored missing CSS (2026-07-22)
   Pagination/empty-state + Filter v2 dropdown bar, recovered from
   git history after being dropped from a later local edit.
   ============================================================ */

.addis-archive-empty {
    color: #888;
    font-style: italic;
    padding: 24px 0;
}

/* ── Pagination ─────────────────────────────────────────────────────────── */

.addis-archive-pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
    margin-top: 32px;
}

.addis-page-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 0.9em;
    font-weight: 600;
    color: #444;
    text-decoration: none;
    background: #fff;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.addis-page-btn:hover,
.addis-page-btn.addis-page-active {
    background: #ea7600;
    border-color: #ea7600;
    color: #fff !important;
}

/* ============================================================
   [addis_installations_grid] — Filter v2 (style image réf.)
   ============================================================ */

/* ── Barre de filtre ─────────────────────────────────────── */

.addis-archive-filter-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid #eee;
}

.addis-filter-group {
    position: relative;
}

.addis-filter-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: transparent;
    border: none;
    font-family: 'Mulish', Helvetica, Arial, sans-serif;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    color: #000;
    cursor: pointer;
    letter-spacing: 0.5px;
}

.addis-filter-arrow {
    font-size: 10px;
}

.addis-filter-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    border: 1px solid #ddd;
    min-width: 260px;
    max-height: 380px;
    overflow-y: auto;
    z-index: 100;
    padding: 8px 0;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    scrollbar-width: thin;
    scrollbar-color: #ccc #f5f5f5;
}

.addis-filter-group:hover .addis-filter-dropdown {
    display: block;
}

.addis-filter-dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 16px;
    font-size: 14px;

    text-decoration: none;
    transition: background 0.15s;
}

.addis-filter-dropdown-item:hover {
    background: #f5f5f5;
}

.addis-filter-dropdown-item.is-active {
    background: #f5f5f5;
    color: #ea7600;
    font-weight: 600;
}

/* Checkbox visuel dans le dropdown */
.addis-check {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 1px solid #ccc;
    border-radius: 2px;
    flex-shrink: 0;
    text-align: center;
    line-height: 14px;
    font-size: 10px;
    color: transparent;
    transition: all 0.15s;
}

.addis-filter-dropdown-item.is-active .addis-check {
    background: #ea7600;
    border-color: #ea7600;
    color: #fff;
}

.addis-filter-dropdown-item.is-active .addis-check::before {
    content: '✓';
}

.addis-results-count {
    font-size: 14px;
    color: #666;
}

/* ── Filtres actifs (pills) ──────────────────────────────── */

.addis-active-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-bottom: 32px;
}

.addis-filter-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: #000;
    color: #fff !important;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none !important;
    letter-spacing: 0.5px;
    transition: opacity 0.15s;
}

.addis-filter-pill:hover {
    opacity: 0.85;
}

.addis-pill-remove {
    font-size: 14px;
    line-height: 1;
}

.addis-clear-all {
    font-size: 12px;
    font-weight: 600;
    color: #000;
    text-decoration: underline;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.addis-clear-all:hover {
    color: #ea7600;
}

/* ========================================
   FORMULAIRE DE CONTACT (Contact Form 7)
   ----------------------------------------
   Le module de contact natif de Divi a ete remplace par CF7, qui sort un
   balisage nu. On rehabille ce balisage avec les memes jetons que le reste
   du site, repris des couleurs globales Divi :
     --gcid-primary-color  #ea7600   accent / bouton
     --gcid-heading-color  #54585a   texte des champs et libelles
     --gcid-body-color     #666666   texte courant
     champ (fond)          rgba(84,88,90,0.05)
     texte attenue         #969696
   Angles droits (border-radius 0) et Mulish, comme les boutons Divi du site.
   ======================================== */

.wpcf7 {
    --addis-form-accent: #ea7600;
    --addis-form-ink: #54585a;
    --addis-form-field-bg: rgba(84, 88, 90, 0.05);
    --addis-form-muted: #969696;

    max-width: 720px;
    margin: 0 auto;
    font-family: 'Mulish', sans-serif;
}

.wpcf7 .hidden-fields-container {
    display: none;
}

/* Chaque <p> porte soit un libelle, soit un champ. L'ecart par defaut vaut
   pour les deux : si :has() n'est pas supporte, la mise en page reste
   correcte, simplement plus aeree entre le libelle et son champ. */
.wpcf7-form p {
    margin: 0 0 18px;
    color: var(--addis-form-ink);
    font-size: 15px;
    line-height: 1.5;
}

/* Libelle seul : on le rapproche du champ qui suit. */
.wpcf7-form p:not(:has(.wpcf7-form-control-wrap)):not(:has(input[type="submit"])) {
    margin-bottom: 6px;
}

.wpcf7-form-control-wrap {
    display: block;
}

/* ---- Champs ---- */

.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="number"],
.wpcf7-form textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 14px 16px;
    background: var(--addis-form-field-bg);
    border: 1px solid transparent;
    border-radius: 0;
    color: var(--addis-form-ink);
    font-family: 'Mulish', sans-serif;
    font-size: 15px;
    line-height: 1.4;
    transition: border-color 0.15s, background-color 0.15s;
}

.wpcf7-form textarea {
    min-height: 170px;
    resize: vertical;
}

.wpcf7-form input::placeholder,
.wpcf7-form textarea::placeholder {
    color: var(--addis-form-muted);
    opacity: 1;
}

.wpcf7-form input[type="text"]:focus,
.wpcf7-form input[type="email"]:focus,
.wpcf7-form input[type="tel"]:focus,
.wpcf7-form input[type="number"]:focus,
.wpcf7-form textarea:focus {
    outline: none;
    background: #fff;
    border-color: var(--addis-form-accent);
}

/* Les fleches du champ nombre alourdissent le champ code postal. */
.wpcf7-form input[type="number"] {
    appearance: textfield;
    -moz-appearance: textfield;
}

.wpcf7-form input[type="number"]::-webkit-outer-spin-button,
.wpcf7-form input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* ---- Bouton ---- */

.wpcf7-form input[type="submit"] {
    display: inline-block;
    padding: 14px 38px;
    background: var(--addis-form-accent);
    border: 1px solid var(--addis-form-accent);
    border-radius: 0;
    color: #fff;
    font-family: 'Mulish Semibold', 'Mulish', sans-serif;
    font-size: 15px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.15s, color 0.15s;
}

.wpcf7-form input[type="submit"]:hover {
    background: transparent;
    color: var(--addis-form-accent);
}

.wpcf7-form input[type="submit"]:disabled {
    opacity: 0.55;
    cursor: default;
}

.wpcf7-spinner {
    margin: 0 0 0 12px;
    vertical-align: middle;
}

/* ---- Messages de validation ----
   CF7 sort par defaut des encadres jaunes/rouges tres saturés qui jurent
   avec la charte : on les ramene a un liseré discret. */

.wpcf7-response-output {
    margin: 20px 0 0;
    padding: 14px 16px;
    border: 0;
    border-left: 3px solid var(--addis-form-accent);
    background: var(--addis-form-field-bg);
    color: var(--addis-form-ink);
    font-size: 14px;
    line-height: 1.5;
}

.wpcf7 form.sent .wpcf7-response-output {
    border-left-color: #28a745;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
    border-left-color: #d63638;
}

.wpcf7-not-valid-tip {
    margin-top: 6px;
    color: #d63638;
    font-size: 13px;
}

.wpcf7-form .wpcf7-not-valid {
    border-color: #d63638;
}

@media (max-width: 767px) {
    .wpcf7-form input[type="submit"] {
        width: 100%;
        text-align: center;
    }
}