/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/* ==========================================================================
   0. PAGE
   ========================================================================== */

/* --- PAGE ACCUEIL --- */
/* -------------------- */

.notification-paiement {
    background-color: #0088cc;
    color: #ffffff;
    padding: 20px;
    border-radius: 8px;
	margin-top: 20px;
    margin-bottom: 15px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
    text-align: center;
    border: 1px solid #004494;
    font-family: Arial, sans-serif;
}

.notification-candidature {
    background-color: #a54a4a;
    color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    margin-top: 20px;
    margin-bottom: 25px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    text-align: center;
    border: 1px solid #8c3a3a;
    font-family: Arial, sans-serif;
}

.notification-conseil {
    background-color: #27ae60;
    color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    margin-top: 20px;
    margin-bottom: 25px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    text-align: center;
    border: 1px solid #219150;
    font-family: Arial, sans-serif;
}

.notification-titre {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
    letter-spacing: 0.5px;
}

.notification-texte {
    font-size: 16px;
    line-height: 1.5;
}

.notification-details {
    font-size: 14px;
    opacity: 0.9;
    display: inline-block;
    margin-top: 5px;
}

/* --- On stylise les liens à l'intérieur pour qu'ils soient lisibles sur fond vert --- */
.notification-conseil a {
    color: #ffffff !important;
    text-decoration: underline !important;
    font-weight: bold;
}

/* Ajustement pour les téléphones portables */
@media (max-width: 600px) {
    .notification-paiement, .notification-candidature, .notification-conseil {
        padding: 15px;
    }
    .notification-titre {
        font-size: 18px;
    }
    .notification-texte {
        font-size: 15px;
    }
    .notification-details {
        font-size: 13px;
    }
}

/* --- PAGE CONTACT --- */
/* -------------------- */

/* --- Bouton du formulaire de contact --- */
@media (max-width: 768px) {
  .ff-btn.ff-btn-submit {
    font-size: 14px !important;
    padding: 12px 10px !important;
  }
}

/* ==========================================================================
   1. BLOCS DE CONTACT FOOTER (ICÔNES (EMAIL-CLOCK) & TEXTE)
   ========================================================================== */

.footer-contact-block {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
}

.footer-contact-block i[class^="icon-"] {
    font-size: 35px !important;
    margin-right: 15px !important;
    flex-shrink: 0 !important;
    color: #0088cc !important;
}

.footer-contact-block .title {
    font-size: 1.1em;
    margin: 0 !important;
    padding: 0 !important;
}

.footer-contact-block .subtitle {
    font-size: 0.9em;
    opacity: 0.9;
    display: block;
}

.footer-contact-block a:hover {
	color: #0088cc !important;
}

/* ==========================================================================
   2. FORMULAIRE FOOTER
   ========================================================================== */

/* --- Structure générale du formulaire --- */
.footer-form-wrapper {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

/* --- Colonnes 85/15 --- */
.fluent_form_4 .ff-t-column-1 { 
    flex-basis: 85% !important; 
}

.fluent_form_4 .ff-t-column-2 { 
    flex-basis: 15% !important; 
}

/* --- Alignement --- */
.fluent_form_4 .ff-t-container {
    display: flex !important;
    gap: 0 !important;
    align-items: stretch !important;
    width: 100% !important;
}

/* --- Champ input --- */
.fluent_form_4 .ff-el-form-control {
    height: 50px !important;
    margin: 0 !important;
    border-radius: 5px 0 0 5px !important;
    width: 100% !important;
}

/* --- Le bouton : on colle à l'input --- */
.fluent_form_4 .ff-btn-submit {
    height: 50px !important;
    width: 100% !important;
    min-width: 140px !important;
    margin: 0 !important;
    padding: 0 20px !important;
    border: none !important;
    border-radius: 0 5px 5px 0 !important;
    color: #ffffff !important;
	font-size: 0.9em !important;
    font-weight: 600 !important;
    line-height: 50px !important;
    transition: all 0.3s ease-in-out !important;
}

/* --- Couleur et opacité --- */
.fluent_form_4 .ff-btn-submit {
    opacity: 1 !important;
    filter: none !important;
    color: #ffffff !important;
    background-color: #0088cc !important;
}

.fluent_form_4 .ff-btn-submit:hover {
    background-color: #0077b3 !important;
    opacity: 1 !important;
    cursor: pointer;
}

/* --- Fait disparaître le placeholder dès qu'on clique dans le champ --- */
.fluent_form_4 .ff-el-form-control:focus::placeholder {
    color: transparent !important;
}


/* --- Nettoyage des marges parasites --- */
.fluent_form_4 .ff-el-group {
    margin: 0 !important;
    padding: 0 !important;
}

/* --- Suppression du padding des Cellules --- */
.fluent_form_4 .ff-t-cell {
    padding: 0 !important;
}

/* ==========================================================================
   3. MENU FOOTER
   ========================================================================== */
  
/* --- Ajuste le bloc de copyright qui est remonté --- */
.copyright-footer {
    text-align: center !important;
    padding: 20px 0 !important;
}

/* --- Réduit les marges pour la ligne personnalisée --- */
.footer-row-clean > .col {
    margin-bottom: 10px !important;
    padding-bottom: 10px !important;
}

/* --- Bordure qui sépare la newsletter et le footer --- */
.divider-footer {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* ==========================================================================
   4. HARMONISATION DES BORDURES DU MENU FOOTER
   ========================================================================== */

/* --- Reset agressif : On éteint TOUTES les bordures natives de Flatsome sur ce menu --- */
.ux-menu--divider-solid,
.ux-menu--divider-solid .ux-menu-link,
.ux-menu--divider-solid .ux-menu-link__link,
.ux-menu--divider-solid .ux-menu-item {
    border: 0 !important;
    border-bottom: 0 !important;
    border-top: 0 !important;
    box-shadow: none !important;
}

/* --- Applique de la bordure --- */
.ux-menu--divider-solid .ux-menu-link {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}

/* --- On enlève la dernière pour éviter le doublon avec le bas du footer --- */
.ux-menu--divider-solid .ux-menu-item:last-child .ux-menu-link,
.ux-menu--divider-solid .ux-menu-link:last-child {
    border-bottom: none !important;
}

/* ==========================================================================
   5. MENU HEADER ET TOP BAR
   ========================================================================== */

/* --- Ajoute une bordure en haut et en bas du menu --- */
.wide-nav {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

#top-bar .custom-promo,
#top-bar .custom-promo * {
    color: #dddddd !important;
}

#top-bar .custom-promo a {
    color: #dddddd !important;
    text-decoration: none !important;
}

#top-bar .custom-promo a:hover {
    color: #ffffff !important;
}

/* ACTIVATION SUR TABLETTE ET MOBILE (jusqu'à 1024px) */
@media screen and (max-width: 1024px) {
    .custom-promo {
        text-align: center;
    }
}

/* ==========================================================================
   6. PRIX PRINCIPAL
   ========================================================================== */

/* --- Agrandissement du prix principal --- */
.product-page-price .woocommerce-Price-amount {
    font-size: 1.3em !important;
    font-weight: 700 !important;
    color: #000000 !important;
    display: inline-block !important;
    margin-bottom: 10px !important;
}

/* --- On cible le conteneur du prix --- */
.product-page-price bdi {
    display: flex;
    align-items: baseline !important;
}

/* --- Agrandir le symbole € séparément si besoin --- */
.product-page-price .woocommerce-Price-currencySymbol {
    font-size: 1.0em !important;
    display: inline-block !important;
}

/* ==========================================================================
   7. OMBRE SUR LA BANNER ACCUEIL
   ========================================================================== */

.banner {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* ==========================================================================
   8. STYLISE LES PUCES DE L'EDITEUR GUNTEBERG
   ========================================================================== */
   
ul.wp-block-list {
    list-style-type: disc !important;
    margin-left: 30px !important;
    padding-left: 0 !important;
}

/* ==========================================================================
   9. STYLE DES BOÎTES (Shadow & Hover)
   ========================================================================== */

/* --- Avec effet--- */
.box-style {
    background-color: #ffffff !important;
    border-radius: 8px !important;
    box-shadow: 0 22px 90px 0 rgba(18, 28, 109, 0.13) !important;
    transition: all 0.3s ease-in-out !important;
    display: block !important;
	position: relative !important;
    z-index: 1 !important;
	padding: 40px !important;
}

.box-style:hover {
    box-shadow: 0 30px 100px 0 rgba(18, 28, 109, 0.2) !important;
    transform: translateY(-5px) !important;
	z-index: 99 !important;
}

/* --- Sans effet --- */
.box-nostyle {
    background-color: #ffffff !important;
    border-radius: 8px !important;
    box-shadow: 0 22px 90px 0 rgba(18, 28, 109, 0.13) !important;
    transition: all 0.3s ease-in-out !important;
    display: block !important;
	position: relative !important;
    z-index: 1 !important;
	padding: 40px !important;
}

/* ==========================================================================
    10. ESPACE CLIENT (Woocommerce) - VERSION SÉCURISÉE
   ========================================================================== */

/* --- Désactive le soulignement des liens au survol uniquement sur cette page --- */
.woocommerce-account a:hover, 
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce-account .custom-card:hover {
    text-decoration: none !important;
}

/* --- Cache le menu de base --- */
.woocommerce-account ul.dashboard-links {
    display: none !important;
}

/* --- Structure 2 colonnes --- */
.woocommerce-account .woocommerce {
    display: flex !important;
    align-items: flex-start;
    padding: 20px 0;
}

/* --- Colonne de gauche --- */
.woocommerce-account .woocommerce-MyAccount-navigation {
    flex: 0 0 320px !important;
    background-color: #ffffff !important;
    margin-right: 30px !important;
    padding: 0 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important; 
    transition: transform 0.2s ease-in-out !important;
}

/* --- En-tête Avatar --- */
.woocommerce-account .user-profile-sidebar {
    text-align: center !important;
    padding: 40px 15px 30px !important;
    border-bottom: none !important;
}

.woocommerce-account .user-avatar img {
    border-radius: 50% !important;
    margin: 0 auto 15px !important;
    display: block !important;
    width: 80px !important;
    height: 80px !important;
}

.woocommerce-account .user-name {
    padding-bottom: 15px;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 15px !important;
    color: #333 !important;
    font-size: 16px !important;
}

.woocommerce-account .user-meta-infos {
    text-align: left;
    font-size: 12px;
    color: #666;
    margin-bottom: 20px;
}

.woocommerce-account .user-meta-infos .meta-label {
    text-transform: uppercase;
	margin-right: 5px;
	font-size: 11px;
	letter-spacing: 1.5px;
}

.woocommerce-account .meta-line {
    margin-bottom: 10px;
}

.woocommerce-account .user-meta-infos .meta-value {
    font-weight: bold !important;
	color: #666 !important; 
    font-size: 12px !important;
}

.woocommerce-account .user-logout {  
    text-decoration: none !important; 
}

.woocommerce-account .user-logout:hover { 
    text-decoration: none !important;
	text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15) !important;	
}

/* --- Le Menu de Gauche --- */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li {
    margin: 0 !important;
    padding: 0 !important;
    border-top: 1px solid #f0f0f0 !important;
    border-bottom: none !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    display: flex !important;
    align-items: center;
    padding: 16px 20px !important;
    color: #444 !important;
    font-size: 14px;
    font-weight: normal !important;
    background: transparent !important;
    text-decoration: none !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li:hover { 
    background-color: #fcfcfc !important; 
    text-decoration: none !important;
}

/* --- Marge entre l'icône et le texte --- */
.woocommerce-account .woocommerce-MyAccount-navigation ul li a i {
    margin-right: 15px !important;
    width: 20px !important;
    text-align: center !important;
}

/* --- L'onglet Actif --- */
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
    background-color: #0088cc !important;
    color: #ffffff !important;
}

/* --- Colonne de droite --- */
.woocommerce-account .woocommerce-MyAccount-content {
    flex: 1 !important;
    padding: 0 !important;
    background: transparent !important;
}

/* --- Les cartes du Dashboard --- */
.woocommerce-account .custom-dashboard-cards {
    display: flex;
    gap: 15px;
    margin-bottom: 40px;
}

.woocommerce-account .custom-card {
    flex: 1;
    background: #ffffff !important;
    border: 1px solid #0088cc !important;
    padding: 25px 10px !important;
    text-align: center !important;
    color: #555 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important; 
    text-decoration: none !important;
    transition: transform 0.2s ease-in-out !important;
}

.woocommerce-account .custom-card:hover { 
    background-color: #fcfcfc !important; 
    text-decoration: none !important;
	transform: translateY(-5px) !important;
    box-shadow: 0 6px 20px rgba(0,0,0,0.15) !important;
}

.woocommerce-account .custom-card i { 
    font-size: 20px !important; 
    color: #444 !important; 
    margin-bottom: 12px !important; 
}

.woocommerce-account .custom-card span { 
    font-size: 14px !important; 
}

/* --- Badge de commande --- */
.woocommerce-account .custom-card.card-orders {
    position: relative;
}

.woocommerce-account .order-badge {
    position: absolute !important;
    top: -10px !important;
    right: -10px !important;
    background-color: #e81123 !important;
    color: white !important;
    font-size: 11px !important;
    font-weight: bold !important;
    padding: 2px 7px !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2) !important;
    min-width: 20px !important;
    height: 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 10 !important;
}

/* --- Espace sous les titres avec icônes --- */
.woocommerce-account .woocommerce-MyAccount-content h3 i.fas {
    margin-right: 10px; /* Espace entre l'icône et le texte */
}

.woocommerce-account .woocommerce-MyAccount-content h3 {
    margin-bottom: 30px !important;
    border-bottom: 1px solid #f0f0f0;
    padding-bottom: 15px;
    color: #333;
}

/* --- Style des alertes / messages (Icône devant le texte) --- */
.woocommerce-account .message-container {
    background-color: #f0f9ff !important;
    border: 1px solid #0088cc !important;
    color: #004a7c !important;
    padding: 15px 20px !important;
    border-radius: 5px !important;
    margin-bottom: 30px !important;
    display: flex !important;
    flex-direction: row !important; 
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 15px !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05) !important;
    text-align: left !important;
}

/* --- L'icône devant le texte --- */
.woocommerce-account .message-container::before {
    content: "\f05a";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 20px;
    color: #0088cc;
    flex-shrink: 0;
}

/* --- Ajustement pour le bouton s'il y en a un --- */
.woocommerce-account .message-container a.button {
    background-color: #0088cc !important;
    color: #ffffff !important;
    border-radius: 3px !important;
    margin-left: auto !important;
    padding: 8px 15px !important;
    font-size: 13px !important;
}

/* --- CONFIGURATION MOBILE --- */
@media (max-width: 768px) {
    .woocommerce-account .woocommerce { 
        flex-direction: column !important; 
        padding: 15px !important; 
    }
    .woocommerce-account .woocommerce-MyAccount-navigation { 
        width: 100% !important; 
        margin-right: 0 !important; 
        margin-bottom: 20px !important; 
    }
    .woocommerce-account .custom-dashboard-cards { 
        flex-wrap: wrap !important; 
    }
    .woocommerce-account .custom-card { 
        min-width: 45% !important; 
    }
    .woocommerce-account .message-container {
        flex-direction: column !important;
        text-align: center !important;
    }
    .woocommerce-account .message-container a.button {
        margin-left: 0 !important;
        width: 100%;
    }

}

/* ==========================================================================
   11. TABLEAU DES SUIVI DES ASSEMBLAGES (HARMONISATION)
   ========================================================================== */

/* --- Structure du tableau --- */
#repair-results {
    table-layout: fixed !important;
	border-collapse: separate !important;
    border-spacing: 0 !important;
    width: 100% !important;
    border-radius: 10px !important;
    border: 1px solid #eeeeee !important;
    background-color: #ffffff !important;
    overflow: hidden !important;
    margin: 10px 0 !important;
}

/* --- En-tête : Alignement et espacement --- */
#repair-results thead th {
    background: #ffffff !important;
    color: #333333 !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 0.75rem !important;
    padding: 15px !important;
    border-bottom: 1px solid #eeeeee !important;
}

/* --- Cellules --- */
#repair-results tbody td {
    background-color: #ffffff !important;
    padding: 15px !important; 
    vertical-align: middle !important;
    border-bottom: 1px solid #eeeeee !important;
    color: #999999 !important;
    font-size: 0.875rem !important;
}

/* --- Survol et fin de tableau --- */
#repair-results tbody tr:last-child td {
    border-bottom: none !important;
}

#repair-results tbody tr:hover td {
    background-color: #f5f7f9 !important;
}

/* --- Bouton --- */
#repair-results .view-details {
    background-color: #0088cc !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    font-weight: 700 !important;
    font-size: 0.75rem !important;
    padding: 6px 12px !important;
    border-radius: 5px !important;
    display: inline-block !important;
    text-decoration: none !important;
    border: none !important;
}

/* --- On retire les puces et le retrait automatique de la liste --- */
.uk-pagination {
    list-style: none !important;
    padding: 0 !important;
}

/* --- Sécurité pour forcer le retrait des puces sur chaque élément --- */
.uk-pagination li {
    list-style: none !important;
}

/* --- Supprime les puces fantômes injectées par certains thèmes via CSS --- */
.uk-pagination li::before {
    display: none !important;
    content: none !important;
}

/* CONFIGURATION TABLETTE & MOBILE */
@media (max-width: 1024px) {

	/* --- FIX PAGINATION (UIkit) --- */
    /* --- On vire la marge du conteneur de pagination --- */
    .uk-margin-medium-bottom {
        margin-bottom: 0 !important;
    }
	
	/* --- On vire la marge de la liste de pagination elle-même --- */
    .uk-pagination.uk-margin {
        margin-bottom: 0 !important;
    }

	/* --- LA ZONE DE SÉCURITÉ : On décolle le tableau du bord du cadre --- */
    .uk-overflow-auto {
        padding: 10px 1px !important;
        overflow: visible !important;
    }

    /* --- RESET RADICAL : On neutralise le tableau global qui fait le trait en bas/droite --- */
    table#repair-results.uk-table {
        border: none !important;
        background: transparent !important;
        border-collapse: unset !important;
        display: block !important;
        width: 100% !important;
    }

    /* --- TA CARTE (Chaque ligne TR) --- */
    table#repair-results.uk-table tbody,
    table#repair-results.uk-table tbody tr {
        display: block !important;
        width: 100% !important;
    }

    table#repair-results.uk-table tbody tr {
        background: #ffffff !important;
        border: 1px solid #e5e5e5 !important; 
        border-radius: 15px !important;
        margin-bottom: 25px !important;
        padding: 15px !important;
        box-shadow: 0 4px 12px rgba(0,0,0,0.05) !important;
        box-sizing: border-box !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* --- LES TRAITS INTERNES (Les cellules TD) --- */
    table#repair-results.uk-table tbody td {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        padding: 25px 0 !important;
        border: none !important;
        border-bottom: 1px solid #f2f2f2 !important; 
    }

    /* --- On retire le dernier trait sous le bouton Consulter --- */
    table#repair-results.uk-table tbody td:last-child {
        border-bottom: none !important;
        justify-content: center !important;
    }

    /* --- LE TITRE (Service) --- */
    table#repair-results.uk-table tbody td:nth-child(2) {
        display: block !important;
        padding-top: 0 !important;
    }

    table#repair-results.uk-table tbody td:nth-child(2) .uk-text-small {
        font-weight: bold !important;
        font-size: 1.1rem !important;
        color: #333 !important;
    }

    /* --- LIBELLÉS (Dates) --- */
    table#repair-results.uk-table tbody td:nth-child(3):before { content: "Créé le"; font-weight: 600; color: #666; }
    table#repair-results.uk-table tbody td:nth-child(4):before { content: "Mis à jour le"; font-weight: 600; color: #666; }

    /* --- BOUTON CONSULTER --- */
    table#repair-results.uk-table tbody td:last-child a.view-details {
        width: 100% !important;
        text-align: center !important;
    }

    /* --- Cache l'en-tête --- */
    table#repair-results.uk-table thead { display: none !important; }
}

/* ==========================================================================
   12. TABLEAU COMMANDES & EXPEDITIONS (HARMONISATION FINALE)
   ========================================================================== */

/* --- Structure globale du tableau --- */
.woocommerce-MyAccount-orders {
    table-layout: fixed !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    width: 100% !important;
    border-radius: 10px !important;
    border: 1px solid #eeeeee !important;
    background-color: #ffffff !important;
    overflow: hidden !important;
    margin: 10px 0 !important;
}

/* --- En-têtes (th) et Cellules (td) --- */
.woocommerce-MyAccount-orders thead th,
.woocommerce-MyAccount-orders tbody td,
.woocommerce-MyAccount-orders tbody th {
    background-color: #ffffff !important;
    padding: 15px !important;
    vertical-align: middle !important;
    border-bottom: 1px solid #eeeeee !important;
    text-align: center !important;
    color: #999999 !important;
    font-size: 0.875rem !important;
}

/* Style spécifique pour l'en-tête */
.woocommerce-MyAccount-orders thead th {
    color: #333333 !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 0.75rem !important;
}

/* --- Barres de séparation verticales (Sauf dernière colonne) --- */
.woocommerce-MyAccount-orders thead th:not(:last-child),
.woocommerce-MyAccount-orders tbody td:not(:last-child),
.woocommerce-MyAccount-orders tbody th:not(:last-child) {
    border-right: 1px solid #eeeeee !important;
}

/* --- Gestion des colonnes (Largeurs) --- */
.woocommerce-orders-table__header-order-number { width: 12% !important; }
.woocommerce-orders-table__header-order-date   { width: 18% !important; }
.woocommerce-orders-table__header-order-status { width: 15% !important; }
.woocommerce-orders-table__header-order-total  { width: 25% !important; }
.woocommerce-orders-table__header-order-actions { width: 30% !important; }

/* Alignement à gauche pour la première colonne (N° de commande) */
.woocommerce-orders-table__cell-order-number {
    text-align: left !important;
    font-weight: 600 !important;
}

/* --- Boutons d'actions (Alignement horizontal et Bleu) --- */
.woocommerce-orders-table__cell-order-actions {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
}

.woocommerce-MyAccount-orders .woocommerce-button {
    background-color: #0088cc !important;
    color: #ffffff !important;
    border-radius: 5px !important;
    padding: 6px 12px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    display: inline-block !important;
    font-size: 0.75rem !important;
    white-space: nowrap !important;
    border: none !important;
}

.woocommerce-MyAccount-orders .woocommerce-button:hover {
    background-color: #006699 !important;
    color: #ffffff !important;
}

/* --- Finitions --- */
.woocommerce-MyAccount-orders tbody tr:last-child td,
.woocommerce-MyAccount-orders tbody tr:last-child th {
    border-bottom: none !important;
}

.woocommerce-MyAccount-orders tbody tr:hover td,
.woocommerce-MyAccount-orders tbody tr:hover th {
    background-color: #f5f7f9 !important;
}

/* CONFIGURATION TABLETTE & MOBILE */
@media (max-width: 1024px) {

    /* --- MARGE AU DESSUS DU TITRE --- */
    .woocommerce-MyAccount-content h3 {
        margin-top: 30px !important;
    }
	
	/* --- NEUTRALISATION DES CONTENEURS (Nettoyage des ombres et fonds) --- */
    .touch-scroll-table,
    .woocommerce-MyAccount-content, 
    .woocommerce-MyAccount-orders,
    .shop_table_responsive {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
        display: block !important;
        overflow: visible !important;
    }

    /* --- TRANSFORMATION DU TABLEAU EN BLOC --- */
    .woocommerce-MyAccount-orders thead {
        display: none !important;
    }

    .woocommerce-MyAccount-orders tbody, 
    .woocommerce-MyAccount-orders tr {
        display: block !important;
        width: 100% !important;
    }

    /* --- LA CARTE (Chaque ligne de commande) --- */
    .woocommerce-MyAccount-orders tr {
        background: #ffffff !important;
        border: 1px solid #e5e5e5 !important;
        border-radius: 15px !important;
        margin-bottom: 25px !important;
        padding: 15px !important;
        box-shadow: 0 4px 12px rgba(0,0,0,0.05) !important;
        box-sizing: border-box !important;
    }

    /* --- LES CELLULES (Lignes internes à la carte) --- */
    .woocommerce-MyAccount-orders tbody td,
    .woocommerce-MyAccount-orders tbody th {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        padding: 12px 0 !important;
        border: none !important;
        border-bottom: 1px solid #f2f2f2 !important;
        background: transparent !important;
        text-align: right !important;
    }

    /* --- Supprime les séparateurs verticaux du mode bureau --- */
    .woocommerce-MyAccount-orders tbody td:not(:last-child),
    .woocommerce-MyAccount-orders tbody th:not(:last-child) {
        border-right: none !important;
    }

    /* --- LIBELLÉS AUTOMATIQUES (Data-title) --- */
    .woocommerce-MyAccount-orders td[data-title]:before,
    .woocommerce-MyAccount-orders th[data-title]:before {
        content: attr(data-title);
        float: left;
        font-weight: 600;
        color: #666;
        text-transform: capitalize;
    }

    /* --- SECTION ACTIONS & BOUTONS --- */
    .woocommerce-MyAccount-orders .woocommerce-orders-table__cell-order-actions {
        border-bottom: none !important;
        display: block !important;
        text-align: center !important;
        padding-top: 20px !important;
    }

    .woocommerce-MyAccount-orders .woocommerce-orders-table__cell-order-actions:before {
        display: none !important;
    }

    .woocommerce-MyAccount-orders .woocommerce-button {
        width: 100% !important;
        margin: 5px 0 !important;
        display: block !important;
        box-sizing: border-box !important;
    }

    /* --- TITRE DE LA CARTE (Numéro de commande) --- */
    .woocommerce-orders-table__cell-order-number {
        border-bottom: 2px solid #0088cc !important;
        padding-bottom: 15px !important;
        margin-bottom: 5px !important;
    }
    
    .woocommerce-orders-table__cell-order-number a {
        font-weight: bold !important;
        color: #0088cc !important;
        font-size: 1.1rem !important;
    }
}

/* ==========================================================================
   13. STATUT DU SUPPORT
   ========================================================================== */

.statut-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 20px;
    margin-top: 8px;
}

/* --- VERSION VERT (OUVERT) --- */
.statut-badge.ouvert {
    background: rgba(46, 204, 113, 0.1);
}
.statut-badge.ouvert .dot-clignotant {
    background-color: #2ecc71;
    animation: pulse-green 2s infinite;
}
.statut-badge.ouvert .statut-texte {
    color: #27ae60;
}

/* --- VERSION ROUGE (FERMÉ) --- */
.statut-badge.ferme {
    background: rgba(231, 76, 60, 0.1);
}
.statut-badge.ferme .dot-clignotant {
    background-color: #e74c3c;
    animation: pulse-red 2s infinite;
}
.statut-badge.ferme .statut-texte {
    color: #c0392b;
}

/* --- ANIMATIONS --- */
.dot-clignotant {
    height: 8px;
    width: 8px;
    border-radius: 50%;
    margin-right: 8px;
}

@keyframes pulse-green {
    0% { box-shadow: 0 0 0 0 rgba(46, 204, 113, 0.7); }
    70% { box-shadow: 0 0 0 6px rgba(46, 204, 113, 0); }
    100% { box-shadow: 0 0 0 0 rgba(46, 204, 113, 0); }
}

@keyframes pulse-red {
    0% { box-shadow: 0 0 0 0 rgba(231, 76, 60, 0.7); }
    70% { box-shadow: 0 0 0 6px rgba(231, 76, 60, 0); }
    100% { box-shadow: 0 0 0 0 rgba(231, 76, 60, 0); }
}

.statut-texte {
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==========================================================================
   14. SUIVI DE L'EXPEDITION
   ========================================================================== */

/* --- On force le conteneur principal et le formulaire --- */
.track-order-section, 
.order_track_form, 
.search_order_form {
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
}

/* --- On force les paragraphes --- */
.track-order-section .form-row,
.track-order-section .tracking_form p {
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    display: block !important;
}

/* --- Force le bloc de suivi détaillé TrackShip à 100% --- */
.enhanced_tracking_detail,
.enhanced_tracking_detail.col,
.tracking_number_wrap,
.enhanced_tracking_content,
.enhanced_overview,
.enhanced_tracking_details {
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    float: none !important;
    box-sizing: border-box !important;
}

/* --- Nettoyage des balises <mark> dans le message de commande --- */
.woocommerce-MyAccount-content p mark {
    background: transparent !important;
    color: inherit !important;
    font-weight: bold !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* --- Numéro de commande plus visible --- */
.woocommerce-MyAccount-content p mark.order-number {
    color: #0088cc !important;
}

/* ==========================================================================
   15. CATALOGUE DES PRODUITS (Optimisé pour alignement et réactivité)
   ========================================================================== */

/* --- Conteneur global du bloc texte --- */
.box-text-products {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
}

/* --- Conteneur alignant le titre et les badges --- */
.box-text-products .title-wrapper {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 10px;
    width: 100%;
}

/* --- Style du titre --- */
.box-text-products .product-title {
    margin-bottom: 0 !important;
    display: inline-block !important;
    flex-shrink: 0;
}

/* --- Enveloppe globale badges --- */
.box-text-products .pc-inline-wrapper {
    display: inline-flex !important;
    align-items: center !important; 
    flex-wrap: wrap !important; 
    gap: 8px !important;
    margin-top: 5px !important;
}

/* --- Badges --- */
.box-text-products .pc-inline-wrapper .pc-badges-group {
    display: flex !important;
    gap: 5px !important;
    flex-wrap: wrap;
}

.box-text-products .pc-inline-wrapper .pc-status-badge {
    font-size: 9px !important;
    padding: 2px 5px !important;
    white-space: nowrap !important;
}

/* --- Textes (Mini slogan, slogan, garantie) --- */
.box-text-products .pc-mini-slogan, 
.box-text-products .pc-slogan, 
.box-text-products .pc-garantie {
    display: block !important;
    width: 100% !important;
    flex-basis: auto !important;
    line-height: 1.3 !important;
    overflow: visible !important;
}

.box-text-products .pc-mini-slogan {
    font-size: 11px !important; 
    color: #555 !important;
    font-weight: 500 !important; 
    margin-top: 5px !important; 
}

.box-text-products .pc-slogan {
    font-size: 11px !important;
    color: #666 !important;
    font-style: italic !important; 
    margin-top: 4px !important; 
}

.box-text-products .pc-garantie {
    font-size: 10px !important; 
    color: #777 !important;
    margin-top: 2px !important;
}

/* --- Alignement vertical --- */
.box-text-products.flex-row.align-top {
    align-items: flex-start !important; 
}

.box-text-products .price-wrapper {
    margin-top: 8px !important;
    width: 100% !important;
}

/* --- Forcer le prix promotionnel et le prix barré sur une seule ligne à DROITE --- */
.box-text-products .price-wrapper .price {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
}

/* --- Ajuster le style du prix barré --- */
.box-text-products .price-wrapper .price del {
    display: inline-block !important;
    margin-bottom: 0 !important;
    font-size: 0.9em !important;
}

/* --- Ajuster le style du prix promo --- */
.box-text-products .price-wrapper .price ins {
    display: inline-block !important;
    text-decoration: none !important;
}

/* --- ON CASSE L'ALIGNEMENT SUR MOBILE --- */
@media (max-width: 849px) {
    .box-text-products .title-wrapper {
        flex-direction: column !important;
        align-items: flex-start !important;
    }
}

/* ==========================================================================
   16. CONTENEUR EN DESSOUS DU SOUS TOTAL
   ========================================================================== */
   
/* --- Supprimer la marge sous le total des options (Plugin EPO) --- */
.tc-totals-form, #tm-epo-totals,
.tm-extra-product-options-totals {
    margin-bottom: 0px !important;
    padding-bottom: 0px !important;
}

/* Classes pour le lien Conseil */
.container-conseil {
    text-align: center; 
    margin-top: 15px; 
    margin-bottom: 5px;
}
    
.lien-expert {
    color: #ff6600;
    font-weight: bold;
    text-decoration: none;
    font-size: 15px;
    transition: color 0.3s ease;
}
    
.lien-expert:hover {
    color: #cc5200;
    text-decoration: none;
}

/* Classes pour les 3 Box de réassurance */
.container-reassurance {
    display: flex;
    gap: 12px;
    margin-top: 20px;
    flex-wrap: wrap; 
}

.box-reassurance {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 15px;
    background-color: #fff5ed;
    border-radius: 5px;
    font-size: 14px;
    color: #333;
    border: 2px solid #ff6600;
    flex: 1;
    min-width: 120px;
}

.icon-reassurance {
    font-size: 24px;
    margin-bottom: 8px;
}

/* ==========================================================================
   17. DESCRIPTION USAGE PC
   ========================================================================== */

.product-usage-banner {
    display: flex;
    align-items: center;
    gap: 8px;
    background-color: #0088cc;
    border: 2px solid #006699;
    padding: 10px 15px;
    margin-bottom: 15px;
    border-radius: 4px;
    font-size: 14px;
}
.usage-icon {
    font-size: 18px;
}
.usage-label {
    font-weight: bold;
    color: #fff;
}
.usage-text {
    color: #fff;
    font-style: italic;
}

/* ==========================================================================
   18. PRIX PROMO PAGE PRODUIT
   ========================================================================== */
   
/* --- Rendre le prix barré plus visible et rouge --- */
.product-page-price del .woocommerce-Price-amount {
    color: #cc0000 !important;
    font-size: 16px !important;
    text-decoration: line-through !important;
    opacity: 1 !important;
}

/* ==========================================================================
   19. CACHER LE BLOC DE VENTES CROISEES DANS LE PANIER
   ========================================================================== */

.cross-sells {
    display: none !important;
}

/* ==========================================================================
   20. NOS REALISATIONS
   ========================================================================== */

/* --- Masquer la sidebar sur toutes les pages de Réalisations --- */
body.post-type-archive-realisations .post-sidebar,
body.single-realisations .post-sidebar {
    display: none !important;
}

/* --- Forcer le conteneur principal à 100% de la largeur --- */
body.post-type-archive-realisations .large-9.col,
body.single-realisations .large-9.col {
    max-width: 100% !important;
    flex-basis: 100% !important;
}

/* --- Masquer les éléments inutiles (meta, pied de page, boutons) --- */
body.post-type-archive-realisations .entry-meta,
body.single-realisations .entry-meta,
body.post-type-archive-realisations a.more-link.button,
body.single-realisations a.more-link.button {
    display: none !important;
}

/* --- Masquer l'en-tête natif de Flatsome sur les fiches de réalisations --- */
body.single-realisations .entry-header {
    display: none !important;
}

body.single-realisations .entry-author {
    display: none !important;
}

/* --- Définition du style de la box normale --- */
.mon-composant-box {
    background-color: #f8f8f8;
    border-radius: 8px;
    border: 1px solid #eee;
    padding: 20px;
    text-align: center;
    transition: all 0.4s ease;
}

/* --- Effet au survol --- */
.mon-composant-box:hover {
    box-shadow: 0 30px 100px 0 rgba(18, 28, 109, 0.2) !important;
    transform: translateY(-5px) !important;
    z-index: 99 !important;
    background-color: #ffffff;
}

/* --- Dédescendre le titre "Dernières réalisations" --- */
.section-title-container-realisations {
    margin-top: 45px;
    margin-bottom: 30px;
}

/* --- Style de la carte avec contour fin et élégant --- */
.realisation-card {
    background: #fff;
    margin-bottom: 30px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    transition: transform 0.3s;
    border: 1px solid #e1e1e1; 
}

/* --- Style de l'image pour qu'elle soit bien alignée avec le contour --- */
.img-wrapper img {
    width: 100%;
    display: block;
    height: 100%;
    object-fit: cover;
    border: 1px solid #e1e1e1; 
}

/* --- Style de la bande blanche et du titre --- */
.title-band {
    background: #ffffff;
    color: #666666;
    padding: 25px 15px;
    text-align: center;
    font-weight: 600;
    font-size: 1.2em;
}

.galerie-img {
    object-fit: cover;
    border: 1px solid #eee;
    border-radius: 4px;
	box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    transition: transform 0.3s;
}

/* ==========================================================================
   21. POPUP PANIER
   ========================================================================== */

.nav-dropdown.nav-dropdown-simple {
    width: 400px !important;
    max-width: 90vw !important;
}

/* --- Compacter les titres (dt) et les valeurs (dd) pour éviter le chaos visuel --- */
.tc-epo-metadata.variation {
    padding: 10px !important;
    background: #f8f8f8 !important;
    border-radius: 5px !important;
    margin: 5px 0 !important;
}

/* --- Mettre le titre de la pièce en gras et la valeur juste en dessous en plus petit --- */
.tc-epo-metadata dt.tc-name {
    font-size: 11px !important;
    font-weight: bold !important;
    color: #555 !important;
    margin-bottom: 2px !important;
}

.tc-epo-metadata dd.tc-value {
    font-size: 12px !important;
    margin-bottom: 8px !important;
    color: #000 !important;
    border-bottom: 1px solid #ddd;
}

/* --- On supprime la bordure sur le dernier élément --- */
.tc-epo-metadata dd.tc-value:last-child {
    border-bottom: none !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* --- Réduire la taille de l'image pour que le texte occupe plus de place en largeur --- */
.woocommerce-mini-cart-item img {
    width: 60px !important;
    height: auto !important;
}

/* --- Force le DT (titre) à prendre toute la largeur pour pousser le DD en dessous --- */
.tc-epo-metadata.variation dt {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 11px !important;
}

/* --- Force le DD (valeur) à passer en bloc en dessous --- */
.tc-epo-metadata.variation dd {
    display: block !important;
    width: 100% !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
}

/* ==========================================================================
   22. CACHE LE MESSAGE NATIF DE WOOCOMMERCE 
   ========================================================================== */

.woocommerce-message.message-wrapper {
    display: none !important;
}

/* ==========================================================================
   23. TOASTR 
   ========================================================================== */

/* --- Rend le toastr totalement opaque --- */
#toast-container > div {
    opacity: 1 !important;
    background-color: #333 !important;
    filter: alpha(opacity=100);
}

/* --- Rendre le vert du succès (ajout) bien opaque aussi --- */
#toast-container > div.toast-success {
    background-color: #27ae60 !important;
}

/* --- Rendre le bleu de l'info (suppression) bien opaque aussi --- */
#toast-container > div.toast-info {
    background-color: #3498db !important; 
}

/* ==========================================================================
   24. LISTE DES AVIS 
   ========================================================================== */

/* --- Conteneurs & Mise en page --- */
.ti-reviews-list {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 20px !important;
    justify-content: flex-start;
}

.ti-review-item {
    flex: 0 0 calc((100% - 40px) / 3) !important; 
    background: #ffffff;
    padding: 20px;
    border-radius: 12px;
    border: 1px solid #f0f0f0;
    box-shadow: 0 4px 10px rgba(0,0,0,0.06);
    box-sizing: border-box;
    transition: all 0.3s ease-in-out !important;
    display: flex !important; 
    flex-direction: column !important; 
}

.ti-review-item:hover {
    box-shadow: 0 30px 100px 0 rgba(18, 28, 109, 0.2) !important;
    transform: translateY(-5px) !important;
}

/* --- En-tête & Message --- */
.ti-header {
    text-align: center;
    margin-bottom: 30px;
    padding: 20px;
    background: #fff;
    border: 1px solid #f0f0f0;
    border-radius: 8px;
	box-shadow: 0 4px 10px rgba(0,0,0,0.06);
    box-sizing: border-box;
    transition: all 0.3s ease-in-out !important;
}

.ti-custom-message {
    text-align: center; 
    margin: 20px 0; 
    font-style: italic; 
    color: #555;
}

.ti-score-number {
    font-size: 32px;
    font-weight: 800;
    color: #333;
    line-height: 1;
}

.ti-score-out-of {
    font-size: 16px;
    color: #888;
}

.ti-header-info {
    display: flex;
    justify-content: center;
    gap: 10px;
    font-size: 14px;
}

.ti-rating-text {
    font-weight: bold;
    color: #2e7d32;
}

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

.ti-header-score {
    margin-bottom: 5px;
}

.ti-header-info {
    margin-top: 10px;
}

/* --- Éléments de l'avis --- */
.ti-author-info {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.ti-author-info img {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-width: none !important;
    width: 33px !important;
    height: 33px !important;
    object-fit: contain !important;
}

.ti-stars {
    color: #FFD700;
    font-size: 22px;
    margin-bottom: 8px;
    letter-spacing: 2px;
}

.ti-date {
    font-size: 11px; 
    color: #888; 
}

.ti-text {
    font-size: 15px;
    color: #444;
    line-height: 1.5;
}

/* --- Bouton "Lire la suite" --- */
.ti-read-more {
    font-size: 12px; 
    color: #2563eb; 
    text-decoration: underline;
    margin-top: auto; 
    text-align: right;
}

.ti-read-more a:hover {
    color: #1d4ed8;
}

/* --- Responsivité (Mobile/Tablette) --- */
@media (max-width: 1024px) {
    .ti-review-item { flex: 0 0 calc((100% - 20px) / 2) !important; }
}

@media (max-width: 767px) {
    .ti-review-item { flex: 0 0 100% !important; }
}

/* ==========================================================================
   25. DESACTIVE LES SOULIGNEMENTS DE UIKIT DU AU PLUGIN TICKET
   ========================================================================== */
   
/* Nettoie TOUS les liens et boutons de l'en-tête (Menu, Panier, Comptes, etc.) */
.header a, 
.header-nav a, 
.header-bottom-nav a,
.header-cart-link {
    text-decoration: none !important;
    border-bottom: none !important;
}

/* Empêche UIkit de perturber les boutons du site */
button, 
.button, 
a.button {
    text-decoration: none !important;
    background-image: none !important;
}

/* Désactive le soulignement des liens du menu au survol */
.ux-menu-link__link:hover,
.ux-menu-link__link:hover span,
.ux-menu-link__link:hover::after,
.ux-menu-link__link:hover::before {
  text-decoration: none !important;
}