/* ==========================================================================
   BOUTIQUE ACCESSIBLE - STYLE COMPLET FINAL (V9)
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. CORRECTIFS CRITIQUES (GRID & LAYOUT)
   -------------------------------------------------------------------------- */

/* 1. On force le conteneur en mode Grille stricte */
.accessible-products-grid-v2 ul.products,
.woocommerce-page .accessible-products-grid-v2 ul.products,
ul.clean-grid-force {
    display: grid !important;
    /* Colonnes responsives : min 280px de large */
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
    gap: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 2. On cache tout ce qui n'est pas un produit (les bouts de code fantômes) */
.accessible-products-grid-v2 ul.products > *:not(.product),
ul.clean-grid-force > *:not(.product) {
    display: none !important;
}

/* 3. On supprime les pseudo-éléments ::before/::after qui décalent la grille */
.accessible-products-grid-v2 ul.products::before,
.accessible-products-grid-v2 ul.products::after,
ul.clean-grid-force::before,
ul.clean-grid-force::after {
    content: none !important;
    display: none !important;
}

/* 4. On s'assure que les messages WooCommerce (Info/Erreur) ne cassent pas la grille */
.accessible-products-grid-v2 ul.products > .woocommerce-info,
.accessible-products-grid-v2 ul.products > .woocommerce-message,
ul.clean-grid-force > .woocommerce-info {
    grid-column: 1 / -1 !important; /* Prend toute la largeur */
    display: block !important;
    margin-bottom: 30px !important;
}


/* --------------------------------------------------------------------------
   1. STRUCTURE & EN-TÊTE
   -------------------------------------------------------------------------- */
.accessible-shop-container-v2 {
    max-width: 1460px; 
    margin: 40px auto;
    padding: 0 30px;
    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    color: #333;
}

.accessible-shop-header-v2 {
    display: grid;
    grid-template-columns: 1fr 450px;
    gap: 50px;
    align-items: center;
    margin-bottom: 60px;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    padding: 50px;
    border-radius: 30px;
}

.shop-title-v2 { font-size: 3rem; font-weight: 800; margin-bottom: 10px; line-height: 1.1; color: #111; }
.shop-subtitle-v2 { font-size: 1.3rem; color: #555; }

.lsf-video-wrapper-v2 {
    border-radius: 20px; overflow: hidden; background: #fff; aspect-ratio: 16 / 9;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}
.lsf-placeholder-content {
    height: 100%; display: flex; flex-direction: column; 
    justify-content: center; align-items: center; text-align: center; color: #0073aa;
}
.lsf-icon-v2 { font-size: 3rem; display: block; margin-bottom: 15px; }


/* --------------------------------------------------------------------------
   2. LAYOUT GÉNÉRAL (SIDEBAR + CONTENU)
   -------------------------------------------------------------------------- */
.accessible-shop-layout-v2 {
    display: grid;
    grid-template-columns: 320px 1fr; /* Sidebar un peu plus large pour les boutons */
    gap: 50px;
    align-items: start;
}

.accessible-sidebar-v2 {
    background: #fff; padding: 30px; border-radius: 20px;
    border: 1px solid #eaeaea;
    box-shadow: 0 5px 20px rgba(0,0,0,0.03); 
    position: sticky; top: 30px; z-index: 10;
}
.filter-main-title { font-size: 1.4rem; font-weight: 700; border-bottom: 2px solid #eee; margin-bottom: 25px; padding-bottom: 15px; }
.accessible-sidebar-v2 .widget { margin-bottom: 35px; }


/* --------------------------------------------------------------------------
   3. DESIGN DES CARTES PRODUITS
   -------------------------------------------------------------------------- */
.accessible-products-grid-v2 ul.products li.product {
    background: #fff;
    border-radius: 24px;
    overflow: hidden;
    
    /* Style Bordure & Ombre */
    border: 1px solid #e1e1e1 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.03);
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    
    /* Flexbox pour aligner le contenu verticalement */
    display: flex !important; 
    flex-direction: column; 
    height: 100%; 
    
    /* Force largeur min */
    min-width: 280px !important; 
    width: 100% !important; 
    box-sizing: border-box !important;
    margin-bottom: 0 !important;
}

/* Hover Carte */
.accessible-products-grid-v2 ul.products li.product:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.1);
    border-color: #bbb !important;
}

/* Image */
.product-image-wrapper { width: 100%; aspect-ratio: 1 / 1; overflow: hidden; border-bottom: 1px solid #f0f0f0; }
.product-image-wrapper img { width: 100% !important; height: 100% !important; object-fit: cover; transition: transform 0.6s ease; margin: 0 !important; }
.accessible-products-grid-v2 ul.products li.product:hover img { transform: scale(1.08); }

/* Conteneur Texte */
.product-details-wrapper {
    padding: 25px 25px 10px 25px;
    display: flex; flex-direction: column; flex-grow: 1;
}

/* Titre */
.accessible-products-grid-v2 li.product .woocommerce-loop-product__title {
    font-size: 1.25rem !important; font-weight: 700; line-height: 1.3;
    margin: 0 0 15px 0 !important; color: #2c3e50; padding: 0 !important;
    min-height: 3.3em;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.accessible-products-grid-v2 li.product .woocommerce-loop-product__title a { text-decoration: none; color: inherit; }

/* Description courte */
.accessible-short-desc {
    font-size: 1rem; color: #7f8c8d; margin-bottom: 20px; height: 46px; overflow: hidden;
}

/* Prix */
.accessible-products-grid-v2 li.product .price {
    font-size: 1.4rem !important; color: #222 !important; font-weight: 800;
    margin-top: auto !important; display: block; margin-bottom: 0 !important;
}
.accessible-products-grid-v2 li.product .price ins { text-decoration: none; color: #e74c3c; }

/* Bouton */
.accessible-add-to-cart-container {
    padding: 0 25px 25px 25px; width: 100%; margin-top: 15px; box-sizing: border-box;
}
.accessible-products-grid-v2 li.product .button {
    display: block !important; width: 100% !important;
    background-color: #111 !important; color: #fff !important;
    padding: 16px !important; border-radius: 12px !important;
    font-weight: 600; font-size: 1.1rem; text-align: center; border: none;
    line-height: 1 !important; white-space: nowrap;
}
.accessible-products-grid-v2 li.product .button:hover { background-color: #444 !important; }


/* ============================================================
   DESIGN DES FILTRES (CORRECTIF CLIC & CALQUES)
   ============================================================ */

/* 1. Nettoyage de la liste */
.widget_block .wc-block-product-categories-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 2. LE BOUTON (LI) - LA BASE */
.widget_block .wc-block-product-categories-list-item {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    
    background-color: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 12px;
    
    margin-bottom: 10px;
    padding: 10px 15px;
    
    transition: all 0.2s ease;
    cursor: pointer;
    
    /* --- CORRECTIF CRITIQUE DE CLIC --- */
    position: relative !important; /* Empêche le lien de sortir du bouton */
    z-index: 1;                    /* Garde chaque bouton à sa place */
    overflow: hidden;              /* Coupe tout ce qui dépasse */
}

/* 3. LE TEXTE (LIEN) */
.widget_block .wc-block-product-categories-list-item a {
    text-decoration: none !important;
    color: #444;
    font-weight: 600;
    font-size: 1rem;
    border: none !important;
    background: transparent !important;
    flex-grow: 1;
    z-index: 2; /* Le texte reste au dessus */
}

/* ASTUCE CLIC ÉTENDU (CORRIGÉE) */
.widget_block .wc-block-product-categories-list-item a::after {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 1; /* Reste en dessous du texte mais couvre le bouton */
}

/* 4. LE COMPTEUR */
.widget_block .wc-block-product-categories-list-item-count {
    background-color: #f3f3f3;
    color: #666;
    font-size: 0.85rem;
    font-weight: bold;
    padding: 4px 10px;
    border-radius: 20px;
    margin-left: 10px;
    z-index: 2; position: relative;
}

/* 5. HOVER */
.widget_block .wc-block-product-categories-list-item:hover {
    background-color: #f9f9f9;
    border-color: #ccc;
    transform: translateX(5px);
    z-index: 10; /* Passe au dessus des autres au survol */
}
.widget_block .wc-block-product-categories-list-item:hover a { color: #000; }

/* ------------------------------------------------------------
   ÉTAT ACTIF (VIA JAVASCRIPT FORCE)
   ------------------------------------------------------------ */
.widget_block .wc-block-product-categories-list-item.active-js-force {
    background-color: #111 !important;
    border-color: #000 !important;
    transform: scale(1.02);
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    z-index: 5;
}

.widget_block .wc-block-product-categories-list-item.active-js-force > a {
    color: #fff !important;
    font-weight: 700 !important;
}

.widget_block .wc-block-product-categories-list-item.active-js-force .wc-block-product-categories-list-item-count {
    background-color: #fff !important;
    color: #111 !important;
}

/* Icône Check */
.widget_block .wc-block-product-categories-list-item.active-js-force > a::before {
    content: '✓';
    display: inline-flex; align-items: center; justify-content: center;
    width: 22px; height: 22px; margin-right: 10px;
    background-color: #2ecc71; color: #fff;
    border-radius: 50%; font-size: 13px; font-weight: bold;
}

/* Stop hover sur actif */
.widget_block .wc-block-product-categories-list-item.active-js-force:hover {
    background-color: #111 !important;
    transform: scale(1.02);
    cursor: default;
}/* --------------------------------------------------------------------------
   6. PAGINATION
   -------------------------------------------------------------------------- */
.accessible-pagination {
    margin-top: 50px; text-align: center; width: 100%; padding: 20px 0; overflow: visible !important;
}
.accessible-pagination ul {
    display: inline-flex; list-style: none; padding: 0; margin: 0; gap: 12px;
}
.accessible-pagination ul li {
    display: inline-block; overflow: visible !important; padding: 0; margin: 0;
}
.accessible-pagination span.current, .accessible-pagination a {
    display: flex; align-items: center; justify-content: center; padding: 12px 22px;
    border-radius: 12px; background: #fff; color: #333; text-decoration: none; font-weight: 700;
    font-size: 1.1rem; box-shadow: 0 4px 10px rgba(0,0,0,0.08); border: 1px solid #ddd; transition: all 0.2s ease; box-sizing: border-box; 
}
.accessible-pagination a:hover { transform: translateY(-3px); border-color: #333; color: #000; }
.accessible-pagination span.current {
    background: #222; color: #fff; border-color: #222; transform: translateY(-3px); box-shadow: 0 8px 15px rgba(0,0,0,0.2);
}


/* --------------------------------------------------------------------------
   7. RESPONSIVE
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
    .accessible-shop-layout-v2 { grid-template-columns: 1fr; }
    .accessible-sidebar-v2 { position: static; margin-bottom: 40px; }
    .accessible-shop-header-v2 { grid-template-columns: 1fr; text-align: center; padding: 30px; }
}



/* SINGLE PRODUCT */
/* ============================================================
   PAGE PRODUIT UNIQUE (SINGLE PRODUCT) - STYLE ACCESSIBLE
   ============================================================ */

/* 1. CONTENEUR GLOBAL */
.accessible-single-container {
    max-width: 1300px;
    margin: 40px auto;
    padding: 0 20px;
    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    color: #333;
}

/* 2. FIL D'ARIANE (Breadcrumbs) */
.accessible-breadcrumbs {
    margin-bottom: 30px;
    font-size: 0.9rem;
    color: #777;
}
.accessible-breadcrumbs a { color: #555; text-decoration: none; }
.accessible-breadcrumbs a:hover { text-decoration: underline; color: #000; }


/* 3. LAYOUT PRINCIPAL (2 COLONNES) */
.accessible-single-layout {
    display: grid;
    grid-template-columns: 1fr 1fr; /* 50% - 50% */
    gap: 60px;
    align-items: start;
    margin-bottom: 80px;
}

/* --- COLONNE GAUCHE (IMAGES) --- */
.single-product-gallery .woocommerce-product-gallery__image img {
    border-radius: 20px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    border: 1px solid #eee;
}
/* On cache les miniatures moches par défaut pour laisser Woo gérer, 
   mais on s'assure que l'image principale est belle */


/* --- COLONNE DROITE (INFOS) --- */
.single-product-summary {
    padding: 10px;
}

/* Titre */
.single-title {
    font-size: 2.5rem;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 10px;
    color: #111;
}

/* Référence (JetEngine) */
.single-reference {
    font-size: 0.95rem;
    color: #888;
    margin-bottom: 20px;
    font-family: monospace; /* Style "code" pour la réf */
    background: #f5f5f5;
    display: inline-block;
    padding: 4px 10px;
    border-radius: 6px;
}
.single-reference span { font-weight: bold; color: #555; }

/* Prix */
.single-price {
    font-size: 2rem;
    color: #222;
    font-weight: 800;
    margin-bottom: 25px;
    display: flex;
    align-items: center;
}
.single-price ins { text-decoration: none; color: #e74c3c; margin-right: 10px; }
.single-price del { font-size: 1.2rem; color: #aaa; font-weight: normal; }

/* Description courte */
.single-short-desc {
    font-size: 1.1rem;
    line-height: 1.6;
    color: #555;
    margin-bottom: 30px;
    border-left: 4px solid #eee;
    padding-left: 20px;
}


/* --- CHAMPS CUSTOM (FICHE TECHNIQUE & VIDÉO) --- */
.single-custom-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 35px;
    padding-bottom: 30px;
    border-bottom: 1px solid #eee;
}

.custom-action-btn {
    display: inline-flex;
    align-items: center;
    padding: 12px 20px;
    border-radius: 12px;
    text-decoration: none !important;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.2s ease;
    border: 1px solid transparent;
}

.custom-action-btn .icon { margin-right: 10px; font-size: 1.2rem; }

/* Style PDF */
.pdf-btn {
    background-color: #fff;
    border-color: #e0e0e0;
    color: #e74c3c; /* Rouge PDF */
}
.pdf-btn:hover {
    background-color: #fff5f5;
    border-color: #e74c3c;
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(231, 76, 60, 0.15);
}

/* Style Vidéo */
.video-btn {
    background-color: #fff;
    border-color: #e0e0e0;
    color: #3498db; /* Bleu Vidéo */
}
.video-btn:hover {
    background-color: #f0f8ff;
    border-color: #3498db;
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(52, 152, 219, 0.15);
}


/* --- BOUTON AJOUT PANIER --- */
.single-add-to-cart-wrapper {
    margin-bottom: 30px;
}
/* Input quantité */
.single-add-to-cart-wrapper .quantity .qty {
    padding: 12px;
    border-radius: 10px;
    border: 1px solid #ccc;
    font-size: 1.1rem;
    width: 70px;
    text-align: center;
    margin-right: 15px;
    font-weight: bold;
}
/* Le bouton lui-même */
.single-add-to-cart-wrapper .button {
    background-color: #111 !important;
    color: #fff !important;
    padding: 18px 40px !important;
    border-radius: 14px !important;
    font-size: 1.2rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
    transition: transform 0.2s;
}
.single-add-to-cart-wrapper .button:hover {
    background-color: #333 !important;
    transform: scale(1.02);
}


/* 4. SECTION INFÉRIEURE (VIDÉO & TABS) */

/* Embed Vidéo */
.single-video-embed {
    margin-bottom: 60px;
    background: #000;
    border-radius: 20px;
    overflow: hidden;
    padding: 40px;
    text-align: center;
}
.single-video-embed h3 { color: #fff; margin-bottom: 20px; }
.video-container {
    position: relative;
    padding-bottom: 56.25%; /* Ratio 16:9 */
    height: 0;
    overflow: hidden;
    max-width: 900px;
    margin: 0 auto;
}
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    border-radius: 10px;
}

/* Onglets */
.single-tabs .woocommerce-tabs ul.tabs {
    padding: 0; margin: 0 0 30px 0; border: none !important;
    display: flex; gap: 20px;
}
.single-tabs .woocommerce-tabs ul.tabs li {
    background: #f5f5f5; border-radius: 12px; border: none !important;
    padding: 0 !important;
}
.single-tabs .woocommerce-tabs ul.tabs li a {
    padding: 15px 30px !important; color: #555 !important; font-weight: 600;
}
.single-tabs .woocommerce-tabs ul.tabs li.active {
    background: #222 !important; 
}
.single-tabs .woocommerce-tabs ul.tabs li.active a {
    color: #fff !important;
}
.single-tabs .woocommerce-Tabs-panel {
    background: #fff;
    padding: 40px;
    border-radius: 20px;
    border: 1px solid #eee;
    line-height: 1.8;
}


/* 5. RESPONSIVE */
@media (max-width: 900px) {
    .accessible-single-layout { grid-template-columns: 1fr; gap: 30px; }
    .single-title { font-size: 2rem; }
    .single-add-to-cart-wrapper { display: flex; flex-direction: column; gap: 15px; }
    .single-add-to-cart-wrapper .button { width: 100%; }
}

/* ============================================================
   CORRECTIFS SINGLE PRODUCT (GALERIE & PUCES)
   ============================================================ */

/* 1. RESET GLOBAL : On tue toutes les puces sur la page produit */
.accessible-single-container ul,
.accessible-single-container ol,
.accessible-single-container li {
    list-style: none !important;
    list-style-type: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* 2. CORRECTIF GALERIE WOOCOMMERCE (Les images en dessous) */

/* On force le conteneur des miniatures à s'afficher en ligne */
.woocommerce-product-gallery .flex-control-thumbs {
    display: flex !important;
    flex-wrap: wrap;
    gap: 10px; /* Espace entre les miniatures */
    margin-top: 15px !important;
    padding: 0 !important;
}

/* On donne une taille aux miniatures (ex: 4 par ligne) */
.woocommerce-product-gallery .flex-control-thumbs li {
    width: 80px !important; /* Taille fixe carrée */
    height: 80px !important;
    flex-grow: 0;
    overflow: hidden;
    border-radius: 10px;
    border: 1px solid #eee;
    cursor: pointer;
    list-style: none !important; /* Double sécurité anti-puce */
}

/* On s'assure que l'image remplit bien la miniature */
.woocommerce-product-gallery .flex-control-thumbs li img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    opacity: 0.6;
    transition: opacity 0.2s;
}

/* Miniature active ou au survol */
.woocommerce-product-gallery .flex-control-thumbs li img.flex-active,
.woocommerce-product-gallery .flex-control-thumbs li img:hover {
    opacity: 1;
}

/* 3. CORRECTIF ONGLETS (TABS) EN BAS */
.single-tabs ul.tabs {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important; /* S'assure qu'ils sont bien alignés */
    gap: 10px;
}
.single-tabs ul.tabs li {
    list-style: none !important;
    margin: 0 !important;
}

/* Supprimer les puces qui pourraient apparaître dans les produits apparentés */
.single-related ul.products li.product {
    list-style: none !important;
}


/* ============================================================
   DESIGN DES NOTIFICATIONS (CORRECTIF CHEVAUCHEMENT FINAL)
   ============================================================ */

/* 1. LA BOÎTE DE MESSAGE */
.woocommerce-message {
    background-color: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
    border-left: 5px solid #2ecc71 !important;
    border-top: none !important;
    
    color: #333 !important;
    border-radius: 12px !important;
    padding: 20px 30px !important;
    margin-bottom: 30px !important;
    
    /* FLEXBOX OBLIGATOIRE */
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap;
    gap: 0 !important; /* On gère l'espace via la marge de l'icône */
    
    box-shadow: 0 10px 30px rgba(0,0,0,0.08) !important;
    position: relative;
}

/* 2. L'ICÔNE (Le Check) */
.woocommerce-message::before {
    content: '✓' !important;
    
    /* LA CORRECTION EST ICI : On annule la position absolue du thème */
    position: static !important; 
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important; /* Sécurité anti-écrasement */
    
    background-color: #2ecc71 !important;
    color: #fff !important;
    border-radius: 50% !important;
    
    /* ESPACE GARANTI À DROITE DE L'ICÔNE */
    margin-right: 25px !important; 
    margin-top: 0 !important;
    left: auto !important; 
    top: auto !important;
    
    font-weight: 800;
    font-size: 14px;
    flex-shrink: 0;
}

/* 3. LE BOUTON "VOIR LE PANIER" */
.woocommerce-message .button.wc-forward {
    background-color: #111 !important;
    color: #fff !important;
    
    padding: 12px 25px !important;
    border-radius: 50px !important;
    
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    
    margin-left: auto !important; /* Pousse à droite */
    transition: all 0.2s ease;
    white-space: nowrap;
}

.woocommerce-message .button.wc-forward:hover {
    background-color: #333 !important;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

/* 4. RESPONSIVE */
@media (max-width: 768px) {
    .woocommerce-message .button.wc-forward {
        width: 100%;
        margin-left: 0 !important;
        margin-top: 15px !important;
        text-align: center;
    }
}

/* ============================================================
   PANIER V4 (PRIORITÉ MAXIMALE & ANTI-GRILLE)
   ============================================================ */

/* 1. LAYOUT 2 COLONNES */
body.woocommerce-cart .woocommerce {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 40px !important;
    align-items: flex-start !important;
}
body.woocommerce-cart .woocommerce-cart-form { flex: 1; }
body.woocommerce-cart .cart-collaterals { width: 380px; flex-shrink: 0; }

/* 2. ON TUE LA GRILLE DU THÈME (Le plus important) */
body.woocommerce-cart table.shop_table {
    border-collapse: separate !important; /* Sépare les lignes */
    border-spacing: 0 15px !important;    /* Espace vertical */
    border: none !important;
    background: transparent !important;
}

/* On force la suppression des bordures sur TOUTES les cellules */
body.woocommerce-cart table.shop_table th,
body.woocommerce-cart table.shop_table td {
    border-top: none !important;
    border-bottom: none !important;
    border-left: none !important;
    border-right: none !important;
    background-color: transparent !important;
}

/* 3. DESIGN "CARTE" (Ligne blanche arrondie) */
/* On remet un fond blanc et des bordures UNIQUEMENT sur la ligne */
body.woocommerce-cart table.shop_table tbody tr.cart_item td {
    background-color: #fff !important;
    border-top: 1px solid #eee !important;
    border-bottom: 1px solid #eee !important;
    padding: 20px 10px !important;
}

/* Arrondi Gauche */
body.woocommerce-cart table.shop_table tbody tr.cart_item td:first-child {
    border-left: 1px solid #eee !important;
    border-top-left-radius: 15px !important;
    border-bottom-left-radius: 15px !important;
}
/* Arrondi Droite */
body.woocommerce-cart table.shop_table tbody tr.cart_item td:last-child {
    border-right: 1px solid #eee !important;
    border-top-right-radius: 15px !important;
    border-bottom-right-radius: 15px !important;
}

/* 4. NETTOYAGE VISUEL DES CELLULES */
/* Image */
body.woocommerce-cart td.product-thumbnail img {
    width: 80px !important; border-radius: 8px !important;
}
/* Croix */
body.woocommerce-cart td.product-remove .remove {
    font-size: 2rem !important; color: #ccc !important; font-weight: 300 !important;
}
body.woocommerce-cart td.product-remove .remove:hover {
    color: red !important; background: none !important;
}

/* ============================================================
   3. TOTAL PANIER (SIDEBAR ÉLARGIE & AÉRÉE)
   ============================================================ */

/* ON ÉLARGIT LA BOÎTE (C'était 380px, on passe à 480px) */
body.woocommerce-cart .cart-collaterals {
    width: 480px !important; /* Beaucoup plus large */
    flex-shrink: 0 !important;
}

/* LE CONTENEUR BLANC */
body.woocommerce-cart .cart_totals {
    background: #fff !important;
    padding: 40px !important; /* Plus d'espace interne (padding) */
    border: 1px solid #eee !important;
    border-radius: 20px !important;
    position: sticky !important;
    top: 30px !important;
    box-shadow: 0 10px 40px rgba(0,0,0,0.05) !important;
}

/* TITRE "TOTAL PANIER" */
body.woocommerce-cart .cart_totals h2 {
    font-size: 1.8rem !important; /* Titre plus gros */
    font-weight: 800 !important;
    margin-bottom: 30px !important;
    text-transform: none !important;
    border-bottom: 2px solid #f5f5f5 !important;
    padding-bottom: 20px !important;
}

/* TABLEAU INTERNE (Nettoyage) */
body.woocommerce-cart .cart_totals table.shop_table {
    width: 100% !important;
    border: none !important;
    border-spacing: 0 !important;
    margin-bottom: 30px !important;
}

body.woocommerce-cart .cart_totals table.shop_table th,
body.woocommerce-cart .cart_totals table.shop_table td {
    background: transparent !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 1px solid #eee !important;
    padding: 20px 0 !important;
    vertical-align: top !important; /* Aligne le texte en haut si plusieurs lignes */
}

/* CORRECTIF SPÉCIFIQUE POUR LA LIGNE "TOTAL" (Qui s'écrasait) */
body.woocommerce-cart .cart_totals .order-total th,
body.woocommerce-cart .cart_totals .order-total td {
    border-bottom: none !important; /* Pas de ligne sous le total final */
    padding-top: 30px !important;   /* Espace au dessus du total */
}

/* Le Label "Total" */
body.woocommerce-cart .cart_totals .order-total th {
    font-size: 1.2rem !important;
    font-weight: 600 !important;
    color: #555 !important;
    width: 30% !important; /* Force une largeur pour l'étiquette */
}

/* Le Montant "1 229 €" */
body.woocommerce-cart .cart_totals .order-total td {
    font-size: 2rem !important; /* Prix très gros */
    font-weight: 800 !important;
    color: #000 !important;
    text-align: right !important;
}

/* EXPÉDITION (Texte plus lisible) */
body.woocommerce-cart .woocommerce-shipping-totals td {
    font-size: 0.95rem !important;
    color: #666 !important;
    line-height: 1.5 !important;
}

/* BOUTON "VALIDER" */
body.woocommerce-cart .checkout-button {
    background: #000 !important;
    color: #fff !important;
    border-radius: 12px !important;
    padding: 22px !important;      /* Bouton plus haut */
    font-size: 1.2rem !important;
    font-weight: bold !important;
    width: 100% !important;
    display: block !important;
    margin-top: 10px !important;
}
body.woocommerce-cart .checkout-button:hover {
    background: #333 !important;
    transform: translateY(-2px);
}
/* 6. MOBILE */
@media (max-width: 900px) {
    body.woocommerce-cart .woocommerce { flex-direction: column !important; }
    body.woocommerce-cart .cart-collaterals { width: 100% !important; }
    body.woocommerce-cart table.shop_table thead { display: none !important; }
    
    body.woocommerce-cart table.shop_table tbody tr.cart_item {
        display: flex !important; flex-wrap: wrap !important;
        background: #fff !important; margin-bottom: 20px !important;
        border: 1px solid #eee !important; border-radius: 15px !important;
        padding: 10px !important;
    }
    body.woocommerce-cart table.shop_table tbody tr.cart_item td {
        border: none !important; /* Pas de bordures internes sur mobile */
        padding: 5px !important;
    }
    
    /* Cache le prix unitaire sur mobile */
    body.woocommerce-cart td.product-price { display: none !important; }
    
    /* Layout Mobile */
    body.woocommerce-cart td.product-thumbnail { width: 80px !important; }
    body.woocommerce-cart td.product-name { flex: 1 !important; font-weight: bold !important; }
    body.woocommerce-cart td.product-quantity,
    body.woocommerce-cart td.product-subtotal { width: 50% !important; margin-top: 10px !important; }
    body.woocommerce-cart td.product-remove { position: absolute !important; top: 0 !important; right: 0 !important; }
}

/* ============================================================
   NOTIFICATION FLOTTANTE (AJAX TOAST)
   ============================================================ */

/* 1. LA BOÎTE (Cachée par défaut) */
.jenile-toast {
    position: fixed;
    top: 30px;
    right: 30px;
    z-index: 99999; /* Toujours au dessus de tout */
    
    background: #fff;
    padding: 20px 25px;
    border-radius: 12px;
    border-left: 5px solid #2ecc71; /* Barre verte Jenile */
    box-shadow: 0 10px 40px rgba(0,0,0,0.15);
    
    display: flex;
    align-items: center;
    gap: 20px;
    max-width: 450px;
    width: 90%; /* Pour mobile */
    
    /* Animation : Caché (décalé vers la droite) */
    opacity: 0;
    transform: translateX(100px);
    visibility: hidden;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); /* Effet rebond */
}

/* 2. L'ÉTAT VISIBLE (Quand le JS ajoute la classe) */
.jenile-toast.visible {
    opacity: 1;
    transform: translateX(0);
    visibility: visible;
}

/* 3. L'ICÔNE VERTE */
.jenile-toast .toast-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    background: #2ecc71;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 14px;
}

/* 4. LE TEXTE ET BOUTON */
.jenile-toast .toast-content {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
}

.jenile-toast .toast-message {
    font-weight: 600;
    color: #333;
    font-size: 0.95rem;
    line-height: 1.4;
}

.jenile-toast .toast-button {
    background: #000;
    color: #fff !important;
    text-decoration: none;
    font-size: 0.85rem;
    font-weight: 700;
    padding: 8px 15px;
    border-radius: 20px;
    align-self: flex-start; /* Bouton aligné à gauche */
    transition: background 0.2s;
}
.jenile-toast .toast-button:hover {
    background: #444;
}

/* 5. CROIX DE FERMETURE (Optionnelle) */
.jenile-toast .toast-close {
    background: transparent;
    border: none;
    font-size: 1.5rem;
    color: #ccc;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    margin-left: 10px;
    align-self: flex-start;
}
.jenile-toast .toast-close:hover {
    color: #000;
}

/* 6. MOBILE */
@media (max-width: 600px) {
    .jenile-toast {
        top: auto;
        bottom: 20px; /* En bas sur mobile pour l'accessibilité du pouce */
        right: 5%;
        left: 5%; /* Centré */
        width: 90%;
        transform: translateY(100px); /* Animation vient du bas */
    }
    .jenile-toast.visible {
        transform: translateY(0);
    }
}


/* --- LOGO DU SITE (Nouveau) --- */
.tmb-logo-wrapper {
  flex-shrink: 0; /* Empêche le logo de s'écraser */
  margin-right: 15px; /* Espace entre le logo et le premier lien */
  display: flex;
  align-items: center;
}

.tmb-logo-img {
  max-height: 40px; /* Hauteur max pour ne pas casser la navbar */
  width: auto;      /* Garde les proportions */
  display: block;
}

/* Style de secours si c'est du texte */
.tmb-logo-text {
  font-size: 20px;
  font-weight: 800;
  color: #111827;
  text-decoration: none;
  line-height: 1;
}

/* --- AJUSTEMENT LAYOUT (Pour coller Menu au Logo) --- */

/* IMPORTANT : On change le comportement de .tmb-inner 
   pour que le menu se colle au logo, et non au milieu.
*/
.tmb-inner {
  justify-content: flex-start !important; /* Tout aligner à gauche */
}

/* On pousse le bloc WooCommerce (Mon compte/Panier) tout à droite */
.tmb-woo {
  margin-left: auto; 
}


/* ============================================================
   PAGE CONTACT - DESIGN PREMIUM
   ============================================================ */

/* ------------------------------------------------------------
   1. LA STRUCTURE GLOBALE (Elementor Container)
   ------------------------------------------------------------ */
/* On cible le conteneur principal pour donner de l'air */
.e-con-inner {
    max-width: 1200px;
    margin: 0 auto;
    gap: 40px; /* Espace entre la colonne info et le formulaire */
    padding: 40px 20px;
}

/* ------------------------------------------------------------
   2. COLONNE GAUCHE (INFOS & MAP)
   ------------------------------------------------------------ */

/* Les Titres (H2) en Vert Jenile */
.elementor-widget-heading h2.elementor-heading-title {
    color: #8cbf3f !important; /* Le vert Jenile */
    font-size: 1.3rem !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
}

/* Les Textes et Liens (Téléphone, Adresse...) */
.elementor-widget-text-editor {
    margin-bottom: 30px; /* Espace après chaque bloc de texte */
}
.elementor-widget-text-editor p {
    font-size: 1rem;
    color: #444;
    line-height: 1.6;
    margin: 0;
}

/* Nettoyage des liens (Enlever le souligné moche) */
.elementor-widget-text-editor a {
    text-decoration: none !important;
    color: #111 !important;
    font-weight: 600;
    transition: color 0.2s;
    border-bottom: 1px solid transparent; /* Souligné uniquement au survol */
}
.elementor-widget-text-editor a:hover {
    color: #8cbf3f !important;
    border-color: #8cbf3f;
}

/* La Google Map */
.elementor-widget-google_maps iframe {
    border-radius: 20px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    border: 1px solid #fff;
    height: 300px !important; /* On force une hauteur agréable */
    width: 100% !important;
}


/* ------------------------------------------------------------
   3. COLONNE DROITE (LE FORMULAIRE JETFORM)
   ------------------------------------------------------------ */

/* On transforme la colonne du formulaire en "Carte" blanche */
/* Note : on cible le conteneur parent du shortcode formulaire */
.elementor-element-9768e87 {
    background-color: #ffffff;
    padding: 40px !important;
    border-radius: 24px;
    border: 1px solid #eee;
    box-shadow: 0 15px 40px rgba(0,0,0,0.05); /* Belle ombre portée */
}

/* Labels (Nom, Prénom...) */
.jet-form-builder__label-text {
    font-size: 0.9rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
    display: block;
}

/* Champs de texte (Inputs) */
.jet-form-builder__field.text-field {
    width: 100%;
    padding: 14px 18px !important;
    background-color: #f9f9f9;
    border: 1px solid #e0e0e0 !important;
    border-radius: 10px !important;
    font-size: 1rem;
    color: #333;
    transition: all 0.3s ease;
}

/* Focus sur les champs (Quand on clique dedans) */
.jet-form-builder__field.text-field:focus {
    background-color: #fff;
    border-color: #8cbf3f !important; /* Bordure verte */
    outline: none;
    box-shadow: 0 0 0 4px rgba(140, 191, 63, 0.1); /* Halo vert subtil */
}

/* Espacement entre les lignes du formulaire */
.jet-form-builder-row {
    margin-bottom: 20px !important;
}

/* Checkboxes (Oui / Non) */
.jet-form-builder__fields-group.checkradio-wrap {
    display: flex;
    gap: 20px;
    padding-top: 5px;
}
.jet-form-builder__field-label span {
    font-size: 0.95rem;
    color: #555;
    margin-left: 5px;
}

/* LE BOUTON "ENVOYER" (Transformation Totale) */
.jet-form-builder__action-button {
    width: 100%; /* Bouton pleine largeur */
    background-color: #111 !important; /* NOIR */
    color: #fff !important;
    
    font-family: inherit;
    font-weight: 700;
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    
    padding: 18px !important;
    border: none !important;
    border-radius: 12px !important;
    cursor: pointer;
    
    transition: all 0.2s ease;
    margin-top: 10px;
}

/* Survol du bouton */
.jet-form-builder__action-button:hover {
    background-color: #333 !important;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}


/* ------------------------------------------------------------
   4. RESPONSIVE (MOBILE)
   ------------------------------------------------------------ */
@media (max-width: 900px) {
    /* On passe les colonnes l'une sous l'autre */
    .e-con-inner {
        flex-direction: column;
    }
    
    /* On retire le style "Carte" sur mobile pour gagner de la place, 
       ou on le garde mais avec moins de padding */
    .elementor-element-9768e87 {
        padding: 25px !important;
        box-shadow: none;
        border: 1px solid #eee;
    }
    
    /* La map moins haute sur mobile */
    .elementor-widget-google_maps iframe {
        height: 250px !important;
    }
}


/* ============================================================
   PAGE PRO / B2B (TEMPLATE)
   ============================================================ */

/* VARIABLES LOCALES */
.pro-page-wrapper {
    --jenile-green: #8cbf3f;
    --dark: #111111;
    --grey-light: #f4f4f4;
    --white: #ffffff;
    --text: #444444;
    --radius: 20px;
    --shadow: 0 10px 40px rgba(0,0,0,0.08);
    
    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    color: var(--text);
    background-color: #fff;
    overflow-x: hidden;
}

.pro-container {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 20px;
}

/* BOUTONS */
.pro-btn {
    display: inline-block;
    padding: 15px 30px;
    border-radius: 50px;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 1px;
    text-decoration: none !important;
    transition: all 0.3s ease;
    cursor: pointer;
    border: 2px solid transparent;
}
.pro-btn-primary {
    background-color: var(--dark);
    color: var(--white) !important;
}
.pro-btn-primary:hover {
    background-color: var(--jenile-green);
    transform: translateY(-3px);
}
.pro-btn-outline {
    border-color: var(--dark);
    color: var(--dark) !important;
    background: transparent;
}
.pro-btn-outline:hover {
    background: var(--dark);
    color: var(--white) !important;
}
.pro-btn-white {
    background-color: #fff;
    color: #111 !important;
}
.pro-btn-white:hover {
    background-color: #eee;
}
.full-width { width: 100%; text-align: center; }


/* 1. HERO SECTION */
.pro-hero {
    padding: 100px 0;
    background: linear-gradient(135deg, #f9f9f9 0%, #edf1f4 100%);
    position: relative;
    overflow: hidden;
}
.pro-hero-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
    position: relative; z-index: 2;
}

.pro-logo-badge {
    font-size: 1.2rem; font-weight: 900; color: var(--jenile-green);
    text-transform: uppercase; margin-bottom: 20px; letter-spacing: 1px;
}
.pro-logo-badge span { color: var(--dark); }

.pro-hero-text h1 {
    font-size: 3.5rem; line-height: 1.1; color: var(--dark);
    margin-bottom: 25px; font-weight: 800;
}
.pro-hero-text h1 .highlight { color: var(--jenile-green); }
.pro-hero-text p { font-size: 1.2rem; margin-bottom: 35px; color: #555; max-width: 500px; }

.pro-btn-group { display: flex; gap: 15px; }

.pro-hero-image img {
    width: 100%; border-radius: var(--radius);
    box-shadow: 0 20px 60px rgba(0,0,0,0.15);
    transform: perspective(1000px) rotateY(-5deg);
    transition: transform 0.5s ease;
}
.pro-hero-image:hover img { transform: perspective(1000px) rotateY(0deg); }

/* Formes décoratives */
.pro-shape {
    position: absolute; border-radius: 50%; z-index: 1; opacity: 0.1;
}
.pro-shape-1 { width: 400px; height: 400px; background: var(--jenile-green); top: -50px; right: -50px; }
.pro-shape-2 { width: 200px; height: 200px; background: var(--dark); bottom: 50px; left: -50px; }


/* 2. FEATURES */
.pro-features { padding: 80px 0; background: #fff; }
.pro-features-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }

.pro-feature-card {
    padding: 35px; border-radius: var(--radius); background: #fff;
    border: 1px solid #eee; transition: all 0.3s ease;
}
.pro-feature-card:hover {
    box-shadow: var(--shadow); transform: translateY(-5px); border-color: var(--jenile-green);
}
.pro-icon-box {
    width: 50px; height: 50px; background: var(--grey-light);
    border-radius: 12px; display: flex; align-items: center; justify-content: center;
    font-size: 1.4rem; margin-bottom: 20px;
}
.pro-feature-card h3 { font-size: 1.3rem; margin-bottom: 10px; color: var(--dark); }
.pro-feature-card p { font-size: 0.95rem; color: #666; }


/* 3. PACKS GRID */
.pro-packs-section { padding: 80px 0; background-color: #f8f9fa; }
.pro-packs-header { text-align: center; margin-bottom: 60px; }
.pro-section-title { font-size: 2.5rem; color: var(--dark); margin-bottom: 15px; font-weight: 800; }
.pro-section-subtitle { font-size: 1.1rem; color: #777; max-width: 600px; margin: 0 auto; }

.pro-packs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 30px; }

.pro-pack-card {
    background: #fff; border-radius: 20px; overflow: hidden;
    box-shadow: var(--shadow); transition: all 0.3s ease;
    display: flex; flex-direction: column; height: 100%;
}
.pro-pack-card:hover { transform: translateY(-10px); }

.pro-pack-image { height: 220px; overflow: hidden; position: relative; background: #eee; }
.pro-pack-image img {
    width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease;
}
.pro-pack-card:hover .pro-pack-image img { transform: scale(1.08); }

.pro-pack-content { padding: 30px; flex-grow: 1; display: flex; flex-direction: column; }
.pro-pack-tag {
    background: var(--jenile-green); color: #fff; padding: 4px 10px;
    border-radius: 4px; font-size: 0.75rem; font-weight: 700; text-transform: uppercase;
    align-self: flex-start; margin-bottom: 10px;
}
.pro-pack-title a {
    font-size: 1.5rem; font-weight: 800; color: var(--dark); text-decoration: none;
    line-height: 1.2; display: block; margin-bottom: 15px;
}

.pro-pack-desc { font-size: 0.95rem; color: #666; margin-bottom: 25px; flex-grow: 1; }
/* Style des listes dans la description courte */
.pro-pack-desc ul { padding-left: 0; list-style: none; margin: 0; }
.pro-pack-desc li { position: relative; padding-left: 25px; margin-bottom: 8px; }
.pro-pack-desc li::before {
    content: '✓'; color: var(--jenile-green); font-weight: bold;
    position: absolute; left: 0;
}

.pro-pack-footer { margin-top: auto; border-top: 1px solid #eee; padding-top: 20px; display: flex; align-items: center; justify-content: space-between; gap: 15px;}
.pro-price { font-size: 1.2rem; font-weight: 800; color: var(--dark); white-space: nowrap; }

/* 4. CTA FOOTER */
.pro-cta-section {
    padding: 100px 0; background: var(--dark); color: #fff; text-align: center;
}
.pro-cta-section h2 { font-size: 2.5rem; margin-bottom: 20px; color: #fff; }
.pro-cta-section p { font-size: 1.1rem; color: #aaa; margin-bottom: 40px; }


/* ANIMATION */
.reveal-on-scroll { opacity: 0; transform: translateY(30px); transition: all 0.8s ease; }
.reveal-on-scroll.active { opacity: 1; transform: translateY(0); }

/* RESPONSIVE */
@media (max-width: 900px) {
    .pro-hero-content { grid-template-columns: 1fr; text-align: center; }
    .pro-btn-group { justify-content: center; }
    .pro-hero-text h1 { font-size: 2.5rem; }
    .pro-hero-image { display: none; }
    .pro-features-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   TABLEAU DOCS - MISE À JOUR VIDÉO
   ============================================================ */

/* Style pour la colonne mixte (PDF | Vidéo) */
.col-mixed .action-group {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

/* Lien PDF et Vidéo (Style Texte propre) */
.doc-link {
    text-decoration: none !important;
    font-weight: 600;
    font-size: 0.95rem;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
}

.doc-link.pdf { color: #333; }
.doc-link.pdf:hover { color: #000; text-decoration: underline !important; }

.doc-link.video { color: #e74c3c; } /* Rouge YouTube */
.doc-link.video:hover { color: #c0392b; text-decoration: underline !important; }

.doc-link .icon { margin-right: 5px; font-size: 1.1rem; }

/* Le séparateur vertical */
.separator {
    color: #ccc;
    font-size: 1.1rem;
    margin: 0 5px;
}

/* --- MODALE (POP-UP) --- */
.jenile-modal {
    display: none; /* Caché par défaut */
    position: fixed; 
    z-index: 99999; 
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    overflow: auto; 
    background-color: rgba(0,0,0,0.8); /* Fond noir transparent */
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(5px);
}

.jenile-modal-content {
    position: relative;
    background-color: #000;
    margin: auto;
    padding: 0;
    width: 90%;
    max-width: 900px;
    border-radius: 12px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.5);
    overflow: hidden;
}

/* Croix de fermeture */
.jenile-modal-close {
    color: #fff;
    position: absolute;
    top: -40px;
    right: 0;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
    line-height: 1;
    transition: color 0.2s;
}
.jenile-modal-close:hover {
    color: #e74c3c;
}

/* Container responsive pour iframe */
.jenile-video-container {
    position: relative;
    padding-bottom: 56.25%; /* Ratio 16:9 */
    height: 0;
    overflow: hidden;
}
.jenile-video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/* ============================================================
   MODALE VIDÉO (CORRECTIF Z-INDEX & POSITION)
   ============================================================ */

.jenile-modal {
    display: none; /* Caché par défaut */
    position: fixed !important; 
    z-index: 999999 !important; /* TRÈS HAUT pour passer au dessus du header */
    top: 0;
    left: 0;
    width: 100%; 
    height: 100%; 
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

/* Quand la classe .is-open est ajoutée par le JS */
.jenile-modal.is-open {
    display: flex !important;
    opacity: 1;
}

/* Le fond noir (Overlay) */
.jenile-modal-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background-color: rgba(0,0,0,0.85);
    backdrop-filter: blur(5px);
    cursor: pointer;
}

/* La boîte contenu */
.jenile-modal-content {
    position: relative;
    z-index: 1000000; /* Au dessus de l'overlay */
    background-color: #000;
    width: 90%;
    max-width: 960px; /* Grande taille vidéo */
    border-radius: 16px;
    box-shadow: 0 25px 50px rgba(0,0,0,0.5);
    overflow: hidden;
    transform: scale(0.95);
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.jenile-modal.is-open .jenile-modal-content {
    transform: scale(1);
}

/* Croix de fermeture */
.jenile-modal-close {
    position: absolute;
    top: 10px;
    right: 15px;
    background: rgba(0,0,0,0.5);
    color: #fff;
    border: none;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s;
}
.jenile-modal-close:hover {
    background: #e74c3c;
}

/* Iframe Responsive */
.jenile-video-container {
    position: relative;
    padding-bottom: 56.25%; /* Ratio 16:9 */
    height: 0;
    overflow: hidden;
    background: #000;
}
.jenile-video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* ============================================================
   TABLEAU DOCUMENTATION - DESIGN PREMIUM (MODERNISÉ)
   ============================================================ */

.jenile-docs-wrapper {
    max-width: 1400px;
    margin: 60px auto;
    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* 1. BARRE DE RECHERCHE (Style "Flottant") */
.jenile-docs-search {
    position: relative;
    margin-bottom: 40px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}
.jenile-docs-search input {
    width: 100%;
    padding: 18px 25px 18px 55px;
    border: 1px solid transparent; /* Pas de bordure par défaut */
    border-radius: 50px;
    background: #fff;
    font-size: 1.05rem;
    /* Ombre portée douce pour l'effet flottant */
    box-shadow: 0 10px 30px rgba(0,0,0,0.08); 
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.jenile-docs-search input:focus {
    outline: none;
    box-shadow: 0 15px 40px rgba(0,0,0,0.12);
    transform: translateY(-2px);
}
.jenile-docs-search .search-icon {
    position: absolute;
    left: 22px;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0.4;
    font-size: 1.2rem;
}

/* 2. CONTENEUR TABLEAU (Carte Blanche) */
.jenile-docs-table-container {
    background: #fff;
    border-radius: 24px;
    /* Ombre globale douce autour du tableau */
    box-shadow: 0 20px 60px rgba(0,0,0,0.05); 
    overflow: hidden; /* Pour couper les coins */
    border: 1px solid #f0f0f0;
}

.jenile-docs-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    text-align: left;
}

/* 3. EN-TÊTE (Épuré) */
.jenile-docs-table thead {
    background-color: #fafafa;
    border-bottom: 1px solid #eee;
}

.jenile-docs-table th {
    padding: 25px;
    font-weight: 800;
    color: #999; /* Gris clair pour les titres */
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 1.5px;
    border: none; /* Pas de bordures verticales */
}

/* 4. LES LIGNES (Effet Interactif) */
.jenile-docs-table tbody tr {
    border-bottom: 1px solid #f9f9f9;
    transition: all 0.2s ease;
}
.jenile-docs-table tbody tr:last-child {
    border-bottom: none;
}

/* Au survol d'une ligne */
.jenile-docs-table tbody tr:hover {
    background-color: #fcfcfc;
    transform: scale(1.005); /* Léger zoom */
    box-shadow: 0 10px 20px rgba(0,0,0,0.03); /* La ligne "sort" */
    position: relative;
    z-index: 2;
}

.jenile-docs-table td {
    padding: 20px 25px;
    vertical-align: middle;
    color: #444;
    border: none; /* Suppression des grilles moches */
}

/* 5. CONTENU SPÉCIFIQUE */

/* Image */
.doc-thumb-wrapper {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    border: 1px solid #eee;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}
.doc-thumb-wrapper img {
    width: 100%; height: 100%; object-fit: contain; padding: 5px;
}

/* Nom du produit */
.col-name strong {
    font-size: 1.1rem;
    color: #222;
    font-weight: 700;
    display: block;
}

/* Référence (Badge) */
.ref-badge {
    background: #f4f4f4;
    padding: 6px 10px;
    border-radius: 8px;
    font-family: monospace;
    font-size: 0.9rem;
    color: #666;
    font-weight: 600;
    letter-spacing: 0.5px;
}

/* 6. BOUTONS D'ACTION (Style "Capsule") */

.action-group {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

/* Style de base des boutons */
.doc-link, .doc-btn {
    text-decoration: none !important;
    font-weight: 600;
    font-size: 0.85rem;
    padding: 10px 18px; /* Plus d'espace */
    border-radius: 30px; /* Forme pilule */
    display: inline-flex;
    align-items: center;
    transition: all 0.2s ease;
    border: 1px solid transparent;
    cursor: pointer;
}
.doc-link .icon, .doc-btn .icon { margin-right: 8px; font-size: 1rem; }

/* Bouton PDF (Gris/Noir) */
.doc-link.pdf {
    background-color: #f7f7f7;
    color: #333;
}
.doc-link.pdf:hover {
    background-color: #222;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* Bouton Vidéo (Rouge léger) */
.doc-link.video {
    background-color: #fff5f5;
    color: #e74c3c;
    border: 1px solid #ffebeb;
}
.doc-link.video:hover {
    background-color: #e74c3c;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(231, 76, 60, 0.2);
}

/* Bouton Fiche Technique (Bleu/Gris) */
.btn-tech {
    background-color: #fff;
    border: 1px solid #eee;
    color: #666 !important;
}
.btn-tech:hover {
    border-color: #ccc;
    color: #000 !important;
}

/* On cache le séparateur textuel "|" car on utilise des boutons espacés */
.separator { display: none; }
.no-doc { color: #ccc; font-style: italic; font-size: 0.85rem; }


/* 7. RESPONSIVE MOBILE (Carte) */
@media (max-width: 800px) {
    .jenile-docs-table thead { display: none; }
    
    .jenile-docs-table, tbody, tr, td { display: block; width: 100%; }
    
    .jenile-docs-table tr {
        margin-bottom: 20px;
        background: #fff;
        border: 1px solid #eee;
        border-radius: 16px;
        padding: 20px;
        box-shadow: 0 5px 15px rgba(0,0,0,0.03);
    }
    
    .jenile-docs-table td {
        padding: 10px 0;
        text-align: right;
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-bottom: 1px dashed #f0f0f0;
    }
    .jenile-docs-table td:last-child { border: none; }
    
    /* Image centrée */
    .jenile-docs-table td.col-img {
        justify-content: center;
        margin-bottom: 10px;
        border-bottom: none;
    }
    .doc-thumb-wrapper { width: 80px; height: 80px; }
    
    /* Labels sur mobile */
    .jenile-docs-table td::before {
        content: attr(data-label);
        font-weight: 700;
        font-size: 0.8rem;
        color: #999;
        text-transform: uppercase;
    }
    
    /* Nom produit gros */
    .col-name { text-align: center !important; display: block !important; margin-bottom: 10px; }
    .col-name strong { font-size: 1.3rem; }
    .col-name::before { display: none; }
    
    .action-group { justify-content: flex-end; }
}

/* ==========================================================================
   MON COMPTE WOOCOMMERCE - DESIGN MODERNE ET ACCESSIBLE
   ========================================================================== */

.accessible-myaccount-container {
    max-width: 1460px;
    margin: 40px auto;
    padding: 0 30px;
    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    color: #333;
}

/* Header */
.accessible-myaccount-header {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 50px;
    align-items: center;
    margin-bottom: 60px;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    padding: 50px;
    border-radius: 30px;
}

.myaccount-title {
    font-size: 3rem;
    font-weight: 800;
    margin-bottom: 10px;
    line-height: 1.1;
    color: #111;
}

.myaccount-subtitle {
    font-size: 1.3rem;
    color: #555;
    margin: 0;
}

.myaccount-subtitle strong {
    color: #a4ce1f;
    font-weight: 600;
}

.myaccount-user-info {
    display: flex;
    align-items: center;
    gap: 20px;
    background: #fff;
    padding: 20px 30px;
    border-radius: 20px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
}

.user-avatar img {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 3px solid #a4ce1f;
    object-fit: cover;
}

.user-details {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.user-name {
    font-size: 1.1rem;
    font-weight: 600;
    color: #111;
}

.user-email {
    font-size: 0.9rem;
    color: #666;
}

/* Layout */
.accessible-myaccount-layout {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 50px;
    align-items: start;
}

/* Sidebar Navigation */
.accessible-myaccount-sidebar {
    background: #fff;
    padding: 30px;
    border-radius: 20px;
    border: 1px solid #eaeaea;
    box-shadow: 0 5px 20px rgba(0,0,0,0.03);
    position: sticky;
    top: 30px;
    z-index: 10;
}

.myaccount-nav {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.myaccount-nav-item {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px 20px;
    color: #555;
    text-decoration: none;
    border-radius: 12px;
    transition: all 0.2s ease;
    font-size: 1rem;
    font-weight: 500;
}

.myaccount-nav-item:hover {
    background: #f8f9fa;
    color: #a4ce1f;
    transform: translateX(5px);
}

.myaccount-nav-item.is-active {
    background: linear-gradient(135deg, #a4ce1f 0%, #8fb81a 100%);
    color: #fff;
    box-shadow: 0 4px 15px rgba(164, 206, 31, 0.3);
}

.myaccount-nav-item.is-active .nav-icon {
    color: #fff;
}

.myaccount-nav-item:focus {
    outline: 3px solid rgba(164, 206, 31, 0.3);
    outline-offset: 2px;
}

.nav-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    color: inherit;
}

.nav-icon svg {
    width: 100%;
    height: 100%;
}

.nav-label {
    flex: 1;
}

/* Content */
.accessible-myaccount-content {
    background: #fff;
    padding: 40px;
    border-radius: 20px;
    border: 1px solid #eaeaea;
    box-shadow: 0 5px 20px rgba(0,0,0,0.03);
    min-height: 500px;
}

.myaccount-content-wrapper {
    width: 100%;
}

/* WooCommerce Account Content Styles */
.woocommerce-account .woocommerce {
    width: 100%;
}

.woocommerce-account .woocommerce-MyAccount-content {
    width: 100%;
}

/* Tableau de bord */
.woocommerce-MyAccount-content .woocommerce-message,
.woocommerce-MyAccount-content .woocommerce-info,
.woocommerce-MyAccount-content .woocommerce-error {
    padding: 20px 25px;
    margin-bottom: 30px;
    border-radius: 12px;
    border-left: 4px solid;
    font-size: 1rem;
    line-height: 1.6;
}

.woocommerce-MyAccount-content .woocommerce-message {
    background: #e8f5e9;
    border-color: #4caf50;
    color: #2e7d32;
}

.woocommerce-MyAccount-content .woocommerce-info {
    background: #e3f2fd;
    border-color: #2196f3;
    color: #1565c0;
}

.woocommerce-MyAccount-content .woocommerce-error {
    background: #ffebee;
    border-color: #f44336;
    color: #c62828;
}

/* Tableaux (Commandes, etc.) */
.woocommerce-MyAccount-content table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 30px;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.woocommerce-MyAccount-content table thead {
    background: linear-gradient(135deg, #a4ce1f 0%, #8fb81a 100%);
    color: #fff;
}

.woocommerce-MyAccount-content table th {
    padding: 20px;
    text-align: left;
    font-weight: 600;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.woocommerce-MyAccount-content table td {
    padding: 20px;
    border-bottom: 1px solid #eaeaea;
    font-size: 0.95rem;
}

.woocommerce-MyAccount-content table tbody tr:hover {
    background: #f8f9fa;
}

.woocommerce-MyAccount-content table tbody tr:last-child td {
    border-bottom: none;
}

/* Boutons */
.woocommerce-MyAccount-content .button,
.woocommerce-MyAccount-content button[type="submit"],
.woocommerce-MyAccount-content input[type="submit"] {
    background: linear-gradient(135deg, #a4ce1f 0%, #8fb81a 100%);
    color: #fff;
    border: none;
    padding: 12px 30px;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    display: inline-block;
}

.woocommerce-MyAccount-content .button:hover,
.woocommerce-MyAccount-content button[type="submit"]:hover,
.woocommerce-MyAccount-content input[type="submit"]:hover {
    background: linear-gradient(135deg, #8fb81a 0%, #7aa316 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(164, 206, 31, 0.3);
}

.woocommerce-MyAccount-content .button:focus,
.woocommerce-MyAccount-content button[type="submit"]:focus,
.woocommerce-MyAccount-content input[type="submit"]:focus {
    outline: 3px solid rgba(164, 206, 31, 0.3);
    outline-offset: 2px;
}

.woocommerce-MyAccount-content .button.alt {
    background: #6c757d;
}

.woocommerce-MyAccount-content .button.alt:hover {
    background: #5a6268;
}

/* Formulaires */
.woocommerce-MyAccount-content form {
    margin-bottom: 30px;
}

.woocommerce-MyAccount-content .form-row {
    margin-bottom: 25px;
}

.woocommerce-MyAccount-content label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #333;
    font-size: 0.95rem;
}

.woocommerce-MyAccount-content input[type="text"],
.woocommerce-MyAccount-content input[type="email"],
.woocommerce-MyAccount-content input[type="password"],
.woocommerce-MyAccount-content input[type="tel"],
.woocommerce-MyAccount-content input[type="url"],
.woocommerce-MyAccount-content select,
.woocommerce-MyAccount-content textarea {
    width: 100%;
    padding: 12px 15px;
    border: 2px solid #eaeaea;
    border-radius: 8px;
    font-size: 1rem;
    font-family: inherit;
    transition: all 0.2s ease;
    background: #fff;
}

.woocommerce-MyAccount-content input[type="text"]:focus,
.woocommerce-MyAccount-content input[type="email"]:focus,
.woocommerce-MyAccount-content input[type="password"]:focus,
.woocommerce-MyAccount-content input[type="tel"]:focus,
.woocommerce-MyAccount-content input[type="url"]:focus,
.woocommerce-MyAccount-content select:focus,
.woocommerce-MyAccount-content textarea:focus {
    outline: none;
    border-color: #a4ce1f;
    box-shadow: 0 0 0 3px rgba(164, 206, 31, 0.1);
}

.woocommerce-MyAccount-content .woocommerce-address-fields {
    margin-top: 30px;
}

/* Adresses */
.woocommerce-Address {
    background: #f8f9fa;
    padding: 30px;
    border-radius: 12px;
    margin-bottom: 30px;
    border: 1px solid #eaeaea;
}

.woocommerce-Address-title {
    margin-bottom: 20px;
    font-size: 1.3rem;
    font-weight: 700;
    color: #111;
}

.woocommerce-Address-title h3 {
    margin: 0;
    font-size: inherit;
    font-weight: inherit;
}

.woocommerce-Address address {
    font-style: normal;
    line-height: 1.8;
    color: #555;
    margin-bottom: 20px;
}

/* Dashboard */
.woocommerce-MyAccount-content .woocommerce-Message {
    margin-bottom: 30px;
}

/* Texte de bienvenue du tableau de bord */
.woocommerce-MyAccount-content p {
    font-size: 1.1rem;
    line-height: 1.8;
    color: #555;
    margin-bottom: 30px;
}

.woocommerce-MyAccount-content p strong {
    color: #a4ce1f;
    font-weight: 600;
}

/* Liens dans le contenu */
.woocommerce-MyAccount-content a:not(.button):not(.woocommerce-Button) {
    color: #a4ce1f;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}

.woocommerce-MyAccount-content a:not(.button):not(.woocommerce-Button):hover {
    color: #8fb81a;
    text-decoration: underline;
}

/* Override des couleurs Elementor (rose/rouge) */
.elementor-button,
.elementor-button-wrapper .elementor-button,
.elementor-widget-button .elementor-button,
.elementor-button-link {
    background: linear-gradient(135deg, #a4ce1f 0%, #8fb81a 100%) !important;
    background-color: #a4ce1f !important;
    color: #fff !important;
    border-color: #a4ce1f !important;
}

.elementor-button:hover,
.elementor-button-wrapper .elementor-button:hover,
.elementor-widget-button .elementor-button:hover,
.elementor-button-link:hover {
    background: linear-gradient(135deg, #8fb81a 0%, #7aa316 100%) !important;
    background-color: #8fb81a !important;
    border-color: #8fb81a !important;
    color: #fff !important;
}

/* Override des styles inline Elementor */
.woocommerce-MyAccount-content [style*="background"]:not([style*="background-image"]),
.woocommerce-MyAccount-content [style*="background-color"] {
    background: linear-gradient(135deg, #a4ce1f 0%, #8fb81a 100%) !important;
    background-color: #a4ce1f !important;
}

/* Override des couleurs roses/rouges dans les styles inline */
.woocommerce-MyAccount-content [style*="rgb(255"],
.woocommerce-MyAccount-content [style*="rgb(236"],
.woocommerce-MyAccount-content [style*="rgb(244"],
.woocommerce-MyAccount-content [style*="#ff"],
.woocommerce-MyAccount-content [style*="#f4"],
.woocommerce-MyAccount-content [style*="#ec"],
.woocommerce-MyAccount-content [style*="rgb(233"] {
    background-color: #a4ce1f !important;
    background: linear-gradient(135deg, #a4ce1f 0%, #8fb81a 100%) !important;
    border-color: #a4ce1f !important;
    color: #fff !important;
}

/* Amélioration des boutons dans les formulaires */
.woocommerce-MyAccount-content form .button,
.woocommerce-MyAccount-content form button,
.woocommerce-MyAccount-content form input[type="submit"],
.woocommerce-MyAccount-content form .woocommerce-Button {
    background: linear-gradient(135deg, #a4ce1f 0%, #8fb81a 100%) !important;
    background-color: #a4ce1f !important;
    border-color: #a4ce1f !important;
    color: #fff !important;
    padding: 12px 30px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    transition: all 0.2s ease !important;
}

.woocommerce-MyAccount-content form .button:hover,
.woocommerce-MyAccount-content form button:hover,
.woocommerce-MyAccount-content form input[type="submit"]:hover,
.woocommerce-MyAccount-content form .woocommerce-Button:hover {
    background: linear-gradient(135deg, #8fb81a 0%, #7aa316 100%) !important;
    background-color: #8fb81a !important;
    border-color: #8fb81a !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 15px rgba(164, 206, 31, 0.3) !important;
}

/* Amélioration des formulaires d'adresse */
.woocommerce-Address {
    transition: all 0.2s ease;
}

.woocommerce-Address:hover {
    border-color: #a4ce1f;
    box-shadow: 0 4px 15px rgba(164, 206, 31, 0.1);
}

.woocommerce-Address-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}

.woocommerce-Address address strong {
    color: #333;
    font-weight: 600;
}

/* Boutons dans les cartes d'adresse */
.woocommerce-Address .edit {
    margin-top: 15px;
}

/* Texte de bienvenue du tableau de bord */
.woocommerce-MyAccount-content p {
    font-size: 1.1rem;
    line-height: 1.8;
    color: #555;
    margin-bottom: 30px;
}

.woocommerce-MyAccount-content p strong {
    color: #a4ce1f;
    font-weight: 600;
}

/* Liens dans le contenu */
.woocommerce-MyAccount-content a {
    color: #a4ce1f;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}

.woocommerce-MyAccount-content a:hover {
    color: #8fb81a;
    text-decoration: underline;
}

/* Boutons WooCommerce généraux */
.woocommerce-MyAccount-content .button,
.woocommerce-MyAccount-content .woocommerce-Button,
.woocommerce-MyAccount-content button.button,
.woocommerce-MyAccount-content input.button {
    background: linear-gradient(135deg, #a4ce1f 0%, #8fb81a 100%) !important;
    color: #fff !important;
    border: none !important;
    padding: 12px 30px !important;
    border-radius: 8px !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    display: inline-block !important;
    box-shadow: 0 2px 8px rgba(164, 206, 31, 0.2) !important;
}

.woocommerce-MyAccount-content .button:hover,
.woocommerce-MyAccount-content .woocommerce-Button:hover,
.woocommerce-MyAccount-content button.button:hover,
.woocommerce-MyAccount-content input.button:hover {
    background: linear-gradient(135deg, #8fb81a 0%, #7aa316 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 15px rgba(164, 206, 31, 0.3) !important;
    color: #fff !important;
}

.woocommerce-MyAccount-content .button:focus,
.woocommerce-MyAccount-content .woocommerce-Button:focus,
.woocommerce-MyAccount-content button.button:focus,
.woocommerce-MyAccount-content input.button:focus {
    outline: 3px solid rgba(164, 206, 31, 0.3) !important;
    outline-offset: 2px !important;
}

/* Boutons secondaires/alternatifs */
.woocommerce-MyAccount-content .button.alt,
.woocommerce-MyAccount-content .woocommerce-Button--alt {
    background: #6c757d !important;
}

.woocommerce-MyAccount-content .button.alt:hover,
.woocommerce-MyAccount-content .woocommerce-Button--alt:hover {
    background: #5a6268 !important;
}

/* Formulaires d'adresse */
.woocommerce-Address {
    background: #f8f9fa;
    padding: 30px;
    border-radius: 12px;
    margin-bottom: 30px;
    border: 1px solid #eaeaea;
    transition: all 0.2s ease;
}

.woocommerce-Address:hover {
    border-color: #a4ce1f;
    box-shadow: 0 4px 15px rgba(164, 206, 31, 0.1);
}

.woocommerce-Address-title {
    margin-bottom: 20px;
    font-size: 1.3rem;
    font-weight: 700;
    color: #111;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.woocommerce-Address-title h3 {
    margin: 0;
    font-size: inherit;
    font-weight: inherit;
}

.woocommerce-Address address {
    font-style: normal;
    line-height: 1.8;
    color: #555;
    margin-bottom: 20px;
    font-size: 1rem;
}

.woocommerce-Address address strong {
    color: #333;
    font-weight: 600;
}

/* Override des couleurs Elementor */
.elementor-button,
.elementor-button-wrapper .elementor-button,
.elementor-widget-button .elementor-button {
    background: linear-gradient(135deg, #a4ce1f 0%, #8fb81a 100%) !important;
    color: #fff !important;
    border-color: #a4ce1f !important;
}

.elementor-button:hover,
.elementor-button-wrapper .elementor-button:hover,
.elementor-widget-button .elementor-button:hover {
    background: linear-gradient(135deg, #8fb81a 0%, #7aa316 100%) !important;
    border-color: #8fb81a !important;
}

/* Override des couleurs roses/rouges par défaut */
.woocommerce-MyAccount-content .button[style*="background"],
.woocommerce-MyAccount-content .button[style*="background-color"],
.woocommerce-MyAccount-content input[type="submit"][style*="background"],
.woocommerce-MyAccount-content input[type="submit"][style*="background-color"] {
    background: linear-gradient(135deg, #a4ce1f 0%, #8fb81a 100%) !important;
    background-color: #a4ce1f !important;
}

/* Tableaux de commandes améliorés */
.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions .button {
    padding: 8px 20px !important;
    font-size: 0.9rem !important;
    margin: 5px 5px 5px 0 !important;
}

/* Messages et alertes */
.woocommerce-MyAccount-content .woocommerce-message a.button {
    margin-left: 15px;
}

/* Responsive */
@media (max-width: 1024px) {
    .accessible-myaccount-layout {
        grid-template-columns: 1fr;
    }
    
    .accessible-myaccount-sidebar {
        position: static;
        margin-bottom: 40px;
    }
    
    .myaccount-nav {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 10px;
    }
    
    .myaccount-nav-item {
        flex: 1;
        min-width: 150px;
        justify-content: center;
    }
    
    .myaccount-nav-item:hover {
        transform: translateY(-2px);
    }
}

@media (max-width: 768px) {
    .accessible-myaccount-container {
        padding: 0 20px;
    }
    
    .accessible-myaccount-header {
        grid-template-columns: 1fr;
        text-align: center;
        padding: 30px;
        gap: 30px;
    }
    
    .myaccount-title {
        font-size: 2rem;
    }
    
    .myaccount-subtitle {
        font-size: 1.1rem;
    }
    
    .myaccount-user-info {
        flex-direction: column;
        text-align: center;
    }
    
    .accessible-myaccount-content {
        padding: 25px;
    }
    
    .woocommerce-MyAccount-content table {
        font-size: 0.85rem;
    }
    
    .woocommerce-MyAccount-content table th,
    .woocommerce-MyAccount-content table td {
        padding: 12px 10px;
    }
    
    .woocommerce-MyAccount-content .button {
        width: 100%;
        text-align: center;
    }
}

/* ==========================================================================
   FORMULAIRE DE LOGIN/INSCRIPTION POUR UTILISATEURS NON CONNECTÉS
   ========================================================================== */

.accessible-myaccount-login {
    max-width: 600px;
    margin: 0 auto;
    padding: 40px 20px;
}

.myaccount-login-wrapper {
    background: #fff;
    padding: 50px;
    border-radius: 20px;
    border: 1px solid #eaeaea;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
}

.myaccount-login-wrapper h2 {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 30px;
    color: #111;
    text-align: center;
}

.myaccount-login-wrapper .woocommerce-form-login,
.myaccount-login-wrapper .woocommerce-form-register {
    margin-bottom: 40px;
}

.myaccount-login-wrapper .form-row {
    margin-bottom: 25px;
}

.myaccount-login-wrapper label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #333;
    font-size: 0.95rem;
}

.myaccount-login-wrapper input[type="text"],
.myaccount-login-wrapper input[type="email"],
.myaccount-login-wrapper input[type="password"] {
    width: 100%;
    padding: 14px 18px;
    border: 2px solid #eaeaea;
    border-radius: 12px;
    font-size: 1rem;
    background: #fff;
    color: #333;
    transition: all 0.3s ease;
    box-sizing: border-box;
}

.myaccount-login-wrapper input[type="text"]:focus,
.myaccount-login-wrapper input[type="email"]:focus,
.myaccount-login-wrapper input[type="password"]:focus {
    outline: none;
    border-color: #a4ce1f;
    box-shadow: 0 0 0 3px rgba(164, 206, 31, 0.1);
}

.myaccount-login-wrapper .woocommerce-form-login__rememberme {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 25px;
}

.myaccount-login-wrapper .woocommerce-form-login__rememberme input[type="checkbox"] {
    width: 20px;
    height: 20px;
    cursor: pointer;
}

.myaccount-login-wrapper .woocommerce-form-login__rememberme label {
    margin-bottom: 0;
    font-weight: 400;
    cursor: pointer;
}

.myaccount-login-wrapper .woocommerce-form-login__submit,
.myaccount-login-wrapper .woocommerce-form-register__submit {
    width: 100%;
    background: linear-gradient(135deg, #a4ce1f 0%, #8fb81a 100%);
    color: #fff;
    border: none;
    padding: 16px 30px;
    border-radius: 12px;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.myaccount-login-wrapper .woocommerce-form-login__submit:hover,
.myaccount-login-wrapper .woocommerce-form-register__submit:hover {
    background: linear-gradient(135deg, #8fb81a 0%, #7aa316 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(164, 206, 31, 0.3);
}

.myaccount-login-wrapper .woocommerce-LostPassword {
    text-align: center;
    margin-top: 20px;
}

.myaccount-login-wrapper .woocommerce-LostPassword a {
    color: #a4ce1f;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s ease;
}

.myaccount-login-wrapper .woocommerce-LostPassword a:hover {
    color: #8fb81a;
    text-decoration: underline;
}

.myaccount-login-wrapper .woocommerce-form-register {
    border-top: 2px solid #eaeaea;
    padding-top: 40px;
    margin-top: 40px;
}

.myaccount-login-wrapper .woocommerce-privacy-policy-text {
    font-size: 0.9rem;
    color: #666;
    margin-bottom: 20px;
    line-height: 1.6;
}

.myaccount-login-wrapper .woocommerce-privacy-policy-text a {
    color: #a4ce1f;
    text-decoration: none;
}

.myaccount-login-wrapper .woocommerce-privacy-policy-text a:hover {
    text-decoration: underline;
}

@media (max-width: 768px) {
    .accessible-myaccount-login {
        padding: 20px 15px;
    }
    
    .myaccount-login-wrapper {
        padding: 30px 20px;
    }
    
    .myaccount-login-wrapper h2 {
        font-size: 1.5rem;
    }
}

/* ==========================================================================
   MESSAGE DE REDIRECTION POUR UTILISATEURS NON CONNECTÉS
   ========================================================================== */

.myaccount-login-redirect {
    background: #fff;
    padding: 60px 50px;
    border-radius: 20px;
    border: 1px solid #eaeaea;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    text-align: center;
}

.myaccount-redirect-content {
    max-width: 500px;
    margin: 0 auto;
}

.myaccount-redirect-content h2 {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 20px;
    color: #111;
}

.myaccount-redirect-message {
    font-size: 1.1rem;
    color: #666;
    margin-bottom: 40px;
    line-height: 1.6;
}

.myaccount-redirect-actions {
    display: flex;
    flex-direction: column;
    gap: 15px;
    align-items: center;
}

.myaccount-redirect-button {
    display: inline-block;
    background: linear-gradient(135deg, #a4ce1f 0%, #8fb81a 100%);
    color: #fff;
    border: none;
    padding: 16px 40px;
    border-radius: 12px;
    font-size: 1.1rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor: pointer;
    min-width: 200px;
}

.myaccount-redirect-button:hover {
    background: linear-gradient(135deg, #8fb81a 0%, #7aa316 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(164, 206, 31, 0.3);
    color: #fff;
    text-decoration: none;
}

.myaccount-redirect-button:focus {
    outline: 3px solid rgba(164, 206, 31, 0.3);
    outline-offset: 2px;
}

.myaccount-redirect-link {
    display: inline-block;
    color: #a4ce1f;
    text-decoration: none;
    font-weight: 500;
    font-size: 1rem;
    transition: color 0.3s ease;
    padding: 10px 0;
}

.myaccount-redirect-link:hover {
    color: #8fb81a;
    text-decoration: underline;
}

@media (max-width: 768px) {
    .myaccount-login-redirect {
        padding: 40px 30px;
    }
    
    .myaccount-redirect-content h2 {
        font-size: 1.5rem;
    }
    
    .myaccount-redirect-message {
        font-size: 1rem;
    }
    
    .myaccount-redirect-button {
        width: 100%;
        min-width: auto;
    }
}