/*
Theme Name: Fleur Child
Theme URI: http://fleur.qodeinteractive.com
Description: A child theme of Fleur Theme
Author: Mikado Themes
Author URI: http://themeforest.net/user/mikado-themes
Version: 1.1.9
Template: fleur
*/

/* ==========================================================================
   Jour de Roses - Styles "Mon compte" WooCommerce (le thème Fleur ne stylait
   quasiment rien sur ces pages : navigation sans icônes, formulaires bruts).
   ========================================================================== */

.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce-account .woocommerce-MyAccount-navigation {
    box-sizing: border-box;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0 0 30px;
    border: 1px solid #eee;
    border-radius: 6px;
    overflow: hidden;
}

.woocommerce-account .woocommerce-MyAccount-navigation-link {
    border-bottom: 1px solid #eee;
}

.woocommerce-account .woocommerce-MyAccount-navigation-link:last-child {
    border-bottom: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation-link a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 18px;
    text-decoration: none;
    color: #4a4a4a;
    transition: background .2s;
}

.woocommerce-account .woocommerce-MyAccount-navigation-link a:before {
    font-family: 'FontAwesome';
    font-size: 15px;
    width: 18px;
    text-align: center;
}

.woocommerce-account .woocommerce-MyAccount-navigation-link.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation-link a:hover {
    background: #f8ecef;
    color: #a44a63;
}

.woocommerce-account .woocommerce-MyAccount-navigation-link--dashboard a:before { content: '\f0e4'; }
.woocommerce-account .woocommerce-MyAccount-navigation-link--orders a:before { content: '\f0ae'; }
.woocommerce-account .woocommerce-MyAccount-navigation-link--downloads a:before { content: '\f0ed'; }
.woocommerce-account .woocommerce-MyAccount-navigation-link--edit-address a:before { content: '\f041'; }
.woocommerce-account .woocommerce-MyAccount-navigation-link--payment-methods a:before { content: '\f09d'; }
.woocommerce-account .woocommerce-MyAccount-navigation-link--edit-account a:before { content: '\f007'; }
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a:before { content: '\f08b'; }

/* Formulaires (édition du compte, mot de passe, adresses) */
.woocommerce-account .woocommerce-MyAccount-content form .form-row,
.woocommerce-account .woocommerce-EditAccountForm .woocommerce-form-row,
.woocommerce-account .woocommerce-ResetPassword .woocommerce-form-row,
.woocommerce-account .woocommerce-address-fields .form-row {
    margin-bottom: 20px;
}

.woocommerce-account .woocommerce-MyAccount-content label {
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
}

.woocommerce-account .woocommerce-MyAccount-content input[type="text"],
.woocommerce-account .woocommerce-MyAccount-content input[type="email"],
.woocommerce-account .woocommerce-MyAccount-content input[type="tel"],
.woocommerce-account .woocommerce-MyAccount-content input[type="password"],
.woocommerce-account .woocommerce-MyAccount-content select {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    padding: 10px 40px 10px 12px;
    height: auto;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.woocommerce-account .woocommerce-MyAccount-content span.password-input,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Input {
    position: relative;
    display: block;
    max-width: none;
}

.woocommerce-account .woocommerce-MyAccount-content .show-password-input {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

.woocommerce-account .woocommerce-MyAccount-content button:not(.show-password-input),
.woocommerce-account .woocommerce-MyAccount-content input[type="submit"] {
    padding: 12px 28px;
    border-radius: 4px;
    background: #4a1d33;
    color: #fff;
    border: none;
    cursor: pointer;
}

/* Tableau des commandes */
.woocommerce-account .woocommerce-orders-table {
    width: 100%;
    border-collapse: collapse;
}

.woocommerce-account .woocommerce-orders-table th,
.woocommerce-account .woocommerce-orders-table td {
    padding: 12px 10px;
    border-bottom: 1px solid #eee;
    text-align: left;
}

.woocommerce-account .woocommerce-orders-table .woocommerce-button {
    padding: 8px 16px;
    border-radius: 4px;
    background: #222;
    color: #fff;
    text-decoration: none;
    display: inline-block;
}

/* Adresses */
.woocommerce-account .woocommerce-Addresses {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.woocommerce-account .woocommerce-Address {
    flex: 1 1 300px;
    padding: 20px;
    border: 1px solid #eee;
    border-radius: 6px;
}

.woocommerce-account .woocommerce-Address-title h3 {
    margin-top: 0;
}

/* Marge avant le footer sur les pages Mon compte (contenu collé en bas sinon) */
.woocommerce-account .woocommerce-MyAccount-content {
    margin-bottom: 60px;
}

body.woocommerce-account #main,
body.woocommerce-account .mkd-content {
    padding-bottom: 40px;
}

/* Marge avant le footer sur le panier (contenu collé en bas sinon) */
body.woocommerce-cart .woocommerce {
    margin-bottom: 60px;
}


/* Les <select> natifs (Pays/région, État, et nos champs commune/boutique/heure) rendent
   petits par défaut : le padding seul ne suffit pas sur un <select>, il faut désactiver
   l'apparence native du navigateur pour que la taille et la flèche soient cohérentes avec
   les champs texte du thème. */
.woocommerce-checkout select,
.woocommerce-cart select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    box-sizing: border-box;
    padding: 20px 45px 20px 25px;
    border: 1px solid #ebebeb;
    border-radius: 0;
    font-size: 14px;
    background-color: #fff;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23999999' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 15px center;
    background-size: 16px;
}

/* Distinction visuelle claire entre l'adresse de livraison (à gauche, priorisée) et la
   facturation (à droite) — évite de confondre les deux blocs identiques. */
#customer_details .col-1 {
    background: #f5f5f5;
    padding: 25px;
    border-radius: 6px;
}

#customer_details .col-2 {
    background: #fafafa;
    padding: 25px;
    border-radius: 6px;
}

/* Encadré coloré pour les infos de paiement + bouton Commander plus visible, aligné à droite */
#payment.woocommerce-checkout-payment {
    background: #f5f5f5;
    border: 1px solid #ebebeb;
    border-radius: 6px;
    padding: 25px;
    margin-top: 20px;
}

#payment .form-row.place-order {
    text-align: right;
}

#payment #place_order {
    display: inline-block;
    padding: 18px 45px;
    font-size: 16px;
    font-weight: 700;
    background: #4a1d33;
    color: #fff;
    border: none;
    border-radius: 4px;
}

#payment #place_order:hover {
    background: #6a2a4a;
}

.woocommerce .button {
    color: #fff !important;
}

/* Mini-panier deroulant (mkd-btns-holder) : les libelles FR (Commander / Voir le panier)
   sont plus longs que les libelles EN d'origine (Checkout / View Cart) et ne tiennent plus
   cote a cote dans le padding tres reduit prevu par le theme. On empile les deux boutons
   en pleine largeur pour un rendu propre. */
.mkd-cart-bottom .mkd-btns-holder {
    display: flex;
    flex-direction: column;
}

.mkd-cart-bottom .mkd-btns-holder a.mkd-btn {
    display: block;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    padding: 8px 10px !important;
    font-size: 12px;
    margin: 0 0 8px 0 !important;
}

.mkd-cart-bottom .mkd-btns-holder a.mkd-btn:last-child {
    margin-bottom: 0 !important;
}

/* Le theme applique par erreur le meme style gris italique (prevu pour le placeholder) au
   texte reellement saisi dans les champs du formulaire de commande. On force la couleur
   noire pour le texte saisi, en laissant intact le style du placeholder (::placeholder). */
.woocommerce-checkout form.checkout input[type="text"],
.woocommerce-checkout form.checkout input[type="email"],
.woocommerce-checkout form.checkout input[type="password"],
.woocommerce-checkout form.checkout input[type="tel"],
.woocommerce-checkout form.checkout textarea {
    color: #000 !important;
    font-style: normal !important;
}

/* Page panier : bouton Commander plus visible, aligne a droite, avec marge au-dessus */
.woocommerce-cart .wc-proceed-to-checkout {
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
}

.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
    padding: 16px 45px !important;
    font-size: 15px !important;
}

/* Liste des modes d'expedition (retrait boutique / livraison) : retire les puces et espace les lignes */
.woocommerce-cart #shipping_method,
.woocommerce-cart #shipping_method li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.woocommerce-cart #shipping_method li {
    margin-bottom: 10px;
}

.woocommerce-cart #shipping_method li:last-child {
    margin-bottom: 0;
}

/* Un peu plus d'air dans les lignes du tableau recapitulatif du panier */
.woocommerce-cart .cart_totals table td,
.woocommerce-cart .cart_totals table th {
    padding: 15px !important;
}

/* Pages boutique (Centre-ville / Anatole France / Domaine de Lacoste) : grille univers du


/* Pages boutique (Centre-ville / Anatole France / Domaine de Lacoste) : grille "univers du
   magasin" (9 categories sans icone), bloc horaires/adresse/carte, et bandeau reassurance
   (identique a celui de la page d'accueil). */
.jdr-univers-col {
    padding-left: 25px;
    padding-right: 25px;
}

.jdr-shop-hours-row {
    padding-top: 40px;
    padding-bottom: 60px;
    background-color: #f5f5f5;
}

.jdr-shop-reassurance {
    padding-top: 69px;
    padding-bottom: 20px;
    background: #F3D1E1 url(https://dev.jourderoses.fr/wp-content/uploads/2026/01/JDR_Miniature-rassurance-fond-1.png?id=11718);
    background-position: 0 0;
    background-repeat: repeat;
}

.jdr-shop-card-col {
    padding-left: 30px;
    padding-right: 30px;
}

/* Fil d'Ariane masque sur mobile (pas joli sur petit ecran) - meme point de rupture que le
   theme (768px, bascule vers le header mobile). */
@media only screen and (max-width: 768px) {
    .mkd-breadcrumbs,
    .mkd-breadcrumbs-holder {
        display: none !important;
    }
}

/* Fil d'Ariane masque sur les articles (actualites), toutes tailles d'ecran. */
.single-post .mkd-breadcrumbs,
.single-post .mkd-breadcrumbs-holder {
    display: none !important;
}

/* Page "A propos" (page-id-2549) uniquement : les 6 cases de la grille "Nos engagements" ont
   des textes de longueurs differentes, ce qui les rendait de tailles inegales. Hauteur minimale
   uniforme sur chaque case, cascadee jusqu'au fond colore (vc_column-inner) pour qu'il remplisse
   bien tout l'espace reserve plutot que de laisser un patch de couleur plus court que la case. */
.page-id-2549 .jdr-univers-col {
    min-height: 420px;
    display: flex;
    flex-direction: column;
}

.page-id-2549 .jdr-univers-col .vc_column-inner,
.page-id-2549 .jdr-univers-col .wpb_wrapper,
.page-id-2549 .jdr-univers-col .mkd-iwt {
    height: 100%;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

/* Panier mobile (<600px) : le theme parent masquait entierement l'image, la quantite et le
   bouton supprimer d'un produit (woocommerce-responsive.css) -> impossible de modifier la
   quantite ou retirer un produit sur mobile. On reaffiche ces 3 colonnes et on transforme
   chaque ligne produit en petite "carte" (grille CSS) plutot que de laisser un tableau a 6
   colonnes illisible sur un ecran etroit. */
@media only screen and (max-width: 600px) {
    .woocommerce-cart .woocommerce form:not(.woocommerce-shipping-calculator) table .product-quantity,
    .woocommerce-cart .woocommerce form:not(.woocommerce-shipping-calculator) table .product-remove,
    .woocommerce-cart .woocommerce form:not(.woocommerce-shipping-calculator) table .product-thumbnail {
        display: block !important;
    }

    .woocommerce-cart table.cart thead {
        display: none;
    }

    .woocommerce-cart table.cart tr.woocommerce-cart-form__cart-item {
        display: grid;
        grid-template-columns: 56px 1fr auto;
        grid-template-areas:
            "thumb name   remove"
            "thumb price  price"
            "qty   qty    subtotal";
        column-gap: 12px;
        row-gap: 6px;
        align-items: center;
        padding: 15px 5px !important;
    }

    .woocommerce-cart table.cart tr.woocommerce-cart-form__cart-item td {
        padding: 0 !important;
        border: none !important;
    }

    .woocommerce-cart table.cart td.product-thumbnail {
        grid-area: thumb;
    }
    .woocommerce-cart table.cart td.product-thumbnail img {
        width: 56px;
        height: 56px;
        object-fit: cover;
        border-radius: 4px;
    }
    .woocommerce-cart table.cart td.product-name {
        grid-area: name;
        font-weight: 600;
        text-align: left !important;
    }
    .woocommerce-cart table.cart td.product-remove {
        grid-area: remove;
        text-align: right !important;
    }
    .woocommerce-cart table.cart td.product-remove a {
        font-size: 22px;
        line-height: 1;
    }
    .woocommerce-cart table.cart td.product-price {
        grid-area: price;
        color: #999;
        font-size: 13px;
        text-align: left !important;
    }
    .woocommerce-cart table.cart td.product-quantity {
        grid-area: qty;
    }
    .woocommerce-cart table.cart td.product-subtotal {
        grid-area: subtotal;
        font-weight: 600;
        text-align: right !important;
        align-self: end;
    }
}