/**
 * Compléments de style du configurateur.
 *
 * Strict nécessaire (BRIEF §38) : uniquement les états que le design validé
 * ne prévoyait pas, l'erreur de saisie et la bascule vers le devis. Aucune
 * règle existante du thème n'est redéfinie, et les variables --geopaca-*
 * du thème enfant sont réutilisées.
 */

/* Champ de dimension en erreur. */
.geopaca-dimension-field.geopaca-field-error input
{
    border-color: #c0392b;
    box-shadow: 0 0 0 2px rgba(192, 57, 43, .12);
}

/* Message contextuel : erreur de saisie. */
.geopaca-quote-info.geopaca-state-error
{
    border-left: 3px solid #c0392b;
    background: rgba(192, 57, 43, .07);
    color: #922b21;
}

/* Message contextuel : bascule vers la demande de devis. */
.geopaca-quote-info.geopaca-state-quote
{
    border-left: 3px solid var(--geopaca-blue, #0096bf);
    background: rgba(0, 150, 191, .09);
    color: var(--geopaca-text-secondary, #555);
}

/* ==========================================================================
   Panier : configuration de la découpe
   ========================================================================== */

/* Lignes de configuration sous le nom du produit, rendues par WooCommerce
   sous forme de liste de définitions. */
.geopaca-cart-products .product-name dl.variation,
.geopaca-checkout-review dl.variation
{
    margin: 8px 0 0;
    padding: 0;
    font-size: 13px;
    line-height: 1.5;
}

.geopaca-cart-products .product-name dl.variation dt,
.geopaca-checkout-review dl.variation dt
{
    clear: left;
    float: left;
    margin: 0 6px 0 0;
    padding: 0;
    color: var(--geopaca-muted, #6b7075);
    font-weight: 400;
}

.geopaca-cart-products .product-name dl.variation dd,
.geopaca-checkout-review dl.variation dd
{
    margin: 0 0 2px;
    padding: 0;
    color: var(--geopaca-text, #222);
    font-weight: 600;
}

.geopaca-cart-products .product-name dl.variation dd p,
.geopaca-checkout-review dl.variation dd p
{
    margin: 0;
    padding: 0;
}

/* Lien de retour au configurateur.
   Le thème met en gras et en 18px tous les liens de la cellule « produit » :
   il faut donc être plus spécifique pour que cette action ne soit pas prise
   pour un second titre. */
.geopaca-cart-products .product-name p.geopaca-cart-edit
{
    margin: 6px 0 0 !important;
}

.geopaca-cart-products .product-name p.geopaca-cart-edit a
{
    color: var(--geopaca-blue, #0096bf) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    text-decoration: none;
}

.geopaca-cart-products .product-name p.geopaca-cart-edit a:hover
{
    color: var(--geopaca-blue, #0096bf) !important;
    text-decoration: underline;
}

/* Sur mobile, la carte produit empile ses cellules. Les lignes de
   configuration restent alignées à gauche, libellé et valeur sur la même
   ligne pour ne pas doubler la hauteur de la carte. */
@media only screen and (max-width: 768px)
{
    body.woocommerce-cart .geopaca-cart-products .product-name dl.variation
    {
        margin-top: 10px;
        text-align: left;
    }

    body.woocommerce-cart .geopaca-cart-products .product-name dl.variation dt,
    body.woocommerce-cart .geopaca-cart-products .product-name dl.variation dd
    {
        text-align: left;
    }

    body.woocommerce-cart .geopaca-cart-products .product-name p.geopaca-cart-edit
    {
        text-align: left;
    }
}

/* ==========================================================================
   Affichage TTC : mention de TVA dans le total
   ========================================================================== */

/* En affichage toutes taxes, WooCommerce retire la ligne TVA du récapitulatif
   et la reporte dans le total sous la forme « (dont X TVA) ». Sans mise en
   forme, cette mention hérite de la taille et de la couleur du total et
   déséquilibre le bloc. On la repasse en note discrète, sous le montant. */
.geopaca-cart-totals .order-total small.includes_tax,
.geopaca-checkout-review .order-total small.includes_tax
{
    display: block !important;
    margin-top: 2px;
    /* La mention tient sur une ligne : coupée entre le montant et « TVA »,
       elle se lit deux fois avant d'être comprise. Seule la colonne du
       checkout est assez étroite pour la casser ; sur mobile, les deux
       colonnes occupent toute la largeur. */
    white-space: nowrap;
    color: var(--geopaca-muted, #6b7075) !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.3;
}

/* Ligne « Expédition » du panier, sans montant tant que l'adresse n'est pas
   connue. Le libellé reste discret pour ne pas concurrencer les montants. */
.geopaca-cart-totals tr.geopaca-cart-shipping-pending td
{
    color: var(--geopaca-text-secondary, #555) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
}

/* Rappel de la tolérance sous le récapitulatif de commande.

   Le thème centre le contenu de cette colonne : le rappel s'y retrouvait en
   trois lignes ferrées au milieu, sans rapport avec les lignes de
   configuration juste au-dessus. */
.geopaca-checkout-review tr.geopaca-checkout-tolerance td
{
    padding-top: 10px !important;
    text-align: left !important;
    border-bottom: 0 !important;
    color: var(--geopaca-muted, #6b7075) !important;
    font-size: 12px !important;
    line-height: 1.4;
}

/* Reconnaissance « produit sur mesure », au-dessus du bouton de paiement. */
.geopaca-custom-made
{
    margin: 0 0 16px !important;
    padding: 12px 14px;
    border-radius: 4px;
    background: var(--geopaca-surface, #f7f8f9);
}

.geopaca-custom-made label
{
    display: flex !important;
    align-items: flex-start;
    gap: 10px;
    margin: 0 !important;
    color: var(--geopaca-text-secondary, #555) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.45;
}

/* Position imposée : d'autres feuilles du site, dont un Bootstrap chargé
   par une extension tierce, placent les cases à cocher en absolu, ce qui
   les ferait recouvrir le début du texte. */
.geopaca-custom-made input[type="checkbox"]
{
    position: static !important;
    flex: 0 0 auto;
    margin: 2px 0 0 !important;
    width: 16px;
    height: 16px;
    accent-color: var(--geopaca-green, #00ac34);
}

/* Le texte ne doit pas non plus recevoir de retrait prévu pour une case
   positionnée en absolu. */
.geopaca-custom-made label > span
{
    padding-left: 0 !important;
}

/* ==========================================================================
   Messages du tunnel
   ==========================================================================
   Les messages d'erreur et d'information n'étaient pas prévus par la
   maquette : Divi leur applique son bleu vif par défaut, étranger à la
   charte, et trompeur pour une erreur. On reprend la présentation des
   messages du configurateur, avec un filet de couleur à gauche. */

body.woocommerce-cart .woocommerce-error,
body.woocommerce-cart .woocommerce-message,
body.woocommerce-cart .woocommerce-info,
body.woocommerce-checkout .woocommerce-error,
body.woocommerce-checkout .woocommerce-message,
body.woocommerce-checkout .woocommerce-info
{
    margin: 0 0 20px !important;
    padding: 14px 16px !important;
    border: 0 !important;
    border-left: 3px solid var(--geopaca-blue, #0096bf) !important;
    border-radius: 4px !important;
    background: rgba(0, 150, 191, .08) !important;
    color: var(--geopaca-text-secondary, #555) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    list-style: none !important;
    text-align: left !important;
}

/* Une erreur doit se distinguer d'une simple information. */
body.woocommerce-cart .woocommerce-error,
body.woocommerce-checkout .woocommerce-error
{
    border-left-color: #c0392b !important;
    background: rgba(192, 57, 43, .07) !important;
    color: #922b21 !important;
}

/* Une confirmation reprend le vert de la charte. */
body.woocommerce-cart .woocommerce-message,
body.woocommerce-checkout .woocommerce-message
{
    border-left-color: var(--geopaca-green, #00ac34) !important;
    background: rgba(0, 172, 52, .07) !important;
}

/* Divi préfixe ces blocs d'une icône et d'un retrait dont on n'a pas besoin. */
body.woocommerce-cart .woocommerce-error::before,
body.woocommerce-cart .woocommerce-message::before,
body.woocommerce-cart .woocommerce-info::before,
body.woocommerce-checkout .woocommerce-error::before,
body.woocommerce-checkout .woocommerce-message::before,
body.woocommerce-checkout .woocommerce-info::before
{
    content: none !important;
}

body.woocommerce-cart .woocommerce-error li,
body.woocommerce-cart .woocommerce-message li,
body.woocommerce-cart .woocommerce-info li,
body.woocommerce-checkout .woocommerce-error li,
body.woocommerce-checkout .woocommerce-message li,
body.woocommerce-checkout .woocommerce-info li
{
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

body.woocommerce-cart .woocommerce-error li + li,
body.woocommerce-checkout .woocommerce-error li + li
{
    margin-top: 6px !important;
}

/* ==========================================================================
   Checkout : champ imposé par le pays
   ========================================================================== */

/* Code postal de Monaco : en lecture seule, signalé visuellement sans
   ressembler à un champ désactivé, puisqu'il est bien soumis. */
.geopaca-checkout-page input.input-text.geopaca-field-locked
{
    background: var(--geopaca-surface, #f7f8f9) !important;
    color: var(--geopaca-text-secondary, #555) !important;
    cursor: default;
}

/* Envoi de la configuration en cours. */
.geopaca-add-to-cart.is-busy
{
    cursor: progress;
    opacity: .75;
}

/* Le second repère de surface peut être vidé selon le profil :
   on évite alors qu'il laisse un blanc dans la ligne. */
.geopaca-surface-limits span:empty
{
    display: none;
}

/* ==========================================================================
   Page de confirmation : récapitulatif de la commande
   ==========================================================================
   La maquette n'a jamais montré cette table remplie d'un vrai produit.
   WooCommerce y rend le nom en lien, que Divi affiche en bleu vif : sur la
   seule ligne de la commande, cela ressemble à un lien égaré plutôt qu'au
   titre de ce qui vient d'être acheté. */

body.woocommerce-order-received .woocommerce-order-details .product-name > a
{
    color: var(--geopaca-text, #222) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    text-decoration: none;
}

body.woocommerce-order-received .woocommerce-order-details .product-name > a:hover
{
    color: var(--geopaca-green, #00ac34) !important;
    text-decoration: underline;
}

/* La quantité vaut toujours 1, une commande ne portant qu'une découpe
   (BRIEF-MAJ §4). Elle n'a pas à concurrencer le titre. */
body.woocommerce-order-received .woocommerce-order-details .product-name .product-quantity
{
    color: var(--geopaca-muted, #6b7075) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
}

/* Lignes de configuration : WooCommerce emploie ici une liste, là où le
   panier emploie une liste de définitions. Même rendu de part et d'autre,
   pour que le client retrouve ce qu'il a vu avant de payer. */
body.woocommerce-order-received .woocommerce-order-details ul.wc-item-meta
{
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 2px 10px;
    margin: 8px 0 0 !important;
    padding: 0 !important;
    font-size: 13px;
    line-height: 1.5;
    list-style: none !important;
}

/* Même correction qu'au panier et au paiement : les étiquettes n'ayant pas
   la même longueur, chaque valeur commençait ailleurs et le bloc prenait un
   air d'escalier. Elles occupent ici une colonne à leur mesure.

   WooCommerce enferme chaque paire dans un `li`, là où il emploie ailleurs
   une liste de définitions dont les deux balises sont voisines. `display:
   contents` efface cette enveloppe pour que la grille voie les paires, sans
   quoi l'alignement ne vaudrait qu'à l'intérieur de chaque ligne. */
body.woocommerce-order-received .woocommerce-order-details ul.wc-item-meta li
{
    display: contents;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

body.woocommerce-order-received .woocommerce-order-details ul.wc-item-meta .wc-item-meta-label
{
    color: var(--geopaca-muted, #6b7075) !important;
    font-weight: 400 !important;
}

body.woocommerce-order-received .woocommerce-order-details ul.wc-item-meta li > p
{
    display: inline;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--geopaca-text, #222) !important;
    font-weight: 600 !important;
}

/* ==========================================================================
   Bouton « Commander » du menu, à l'intérieur du parcours
   ==========================================================================
   Ce bouton mène au configurateur : c'est une porte d'entrée. Une fois le
   client entré, elle n'a plus d'usage, et sur la fiche produit elle est
   nuisible — un clic recharge la page et efface la configuration en cours.

   Sur le panier, le retour utile existe déjà sous le produit (« Modifier la
   configuration »), et il conserve la saisie au lieu de la jeter.

   Le checkout et la page de confirmation sont déjà traités par le thème
   (BRIEF §28 et §34), qui y masque l'en-tête entier. */

body.single-product #top-menu li.menu-commander,
body.woocommerce-cart #top-menu li.menu-commander,
body.single-product .et_mobile_menu li.menu-commander,
body.woocommerce-cart .et_mobile_menu li.menu-commander
{
    display: none !important;
}

/* ==========================================================================
   Page de confirmation : sortie
   ==========================================================================
   Le tunnel écarte la navigation pour ne pas distraire pendant l'achat. Une
   fois le paiement fait, il n'y a plus rien dont on puisse être distrait, et
   le client ne doit pas rester sans issue. Ce lien existe pour qui le
   cherche, sans concurrencer quoi que ce soit. */

body.woocommerce-order-received p.geopaca-order-exit
{
    margin: 28px 0 0 !important;
    text-align: center;
}

body.woocommerce-order-received p.geopaca-order-exit a
{
    color: var(--geopaca-blue, #0096bf) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-decoration: none;
}

body.woocommerce-order-received p.geopaca-order-exit a:hover
{
    color: var(--geopaca-green, #00ac34) !important;
    text-decoration: underline;
}

/* ==========================================================================
   Checkout : lignes de configuration dans la colonne étroite
   ==========================================================================
   Au panier, ces lignes s'écrivent « étiquette puis valeur à la suite », et
   la largeur disponible s'en accommode. Dans la colonne du paiement, deux
   fois plus étroite, elles se cassaient à des endroits arbitraires et le
   bloc prenait un air d'escalier.

   Le défaut n'était pas la fin des lignes mais leur début : les étiquettes
   n'ayant pas la même longueur, chaque valeur commençait ailleurs. Elles
   occupent désormais une colonne à leur mesure, et les valeurs démarrent
   toutes au même endroit.

   Les aligner à droite serait pire : cela créerait au milieu de la cellule
   un bord qui ne correspond à rien, et ouvrirait un vide jusqu'au
   sous-total voisin. */

.geopaca-checkout-review dl.variation
{
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 3px 12px;
}

.geopaca-checkout-review dl.variation dt
{
    float: none;
    clear: none;
    margin: 0 !important;
}

.geopaca-checkout-review dl.variation dd
{
    margin: 0 !important;
}

/* Le nom du produit occupe déjà trois lignes dans cette colonne : il n'a pas
   besoin de l'interligne large hérité du panier. */
.geopaca-checkout-review .product-name
{
    line-height: 1.35;
}

/* ==========================================================================
   Repère de progression du tunnel
   ==========================================================================
   Le tunnel écarte le menu et le panier pour ne pas distraire pendant
   l'achat. Restaient trois pages où le client ne sait ni où il en est, ni
   ce qu'il lui reste à faire. Les pastilles rondes reprennent celles du
   configurateur et de la demande de devis : même façon d'avancer pas à pas,
   d'un bout à l'autre du parcours.

   L'étape franchie garde le vert, mais creux ; seule l'étape courante est
   pleine. Sans quoi les deux se confondent et le repère ne repère plus. */

/* La largeur est bornée ici, et non dans chaque layout : au-delà, les filets
   s'étirent au point de ne plus se lire comme une progression. C'est une
   contrainte du repère lui-même, pas un choix de page. Centré : il coiffe les
   deux colonnes, il n'appartient ni à l'une ni à l'autre. */
.geopaca-tunnel-steps
{
    display: flex;
    align-items: center;
    max-width: 760px;
    margin: 0 auto 34px !important;
    padding: 0 !important;
    list-style: none !important;
}

.geopaca-tunnel-step
{
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    gap: 10px;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--geopaca-muted, #6b7075);
    font-size: 14px;
    line-height: 1.3;
    list-style: none !important;
}

.geopaca-tunnel-step:first-child
{
    flex: 0 0 auto;
}

/* Le filet qui relie une étape à la précédente, et qui absorbe la place
   disponible : les trois repères se répartissent d'eux-mêmes. */
.geopaca-tunnel-step + .geopaca-tunnel-step::before
{
    content: "";
    flex: 1 1 auto;
    min-width: 20px;
    height: 1px;
    margin-right: 10px;
    background: var(--geopaca-border, #dfe3e6);
}

.geopaca-tunnel-step.is-done::before,
.geopaca-tunnel-step.is-current::before
{
    background: var(--geopaca-green, #00ac34);
}

.geopaca-tunnel-step-mark
{
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border: 1px solid var(--geopaca-border, #dfe3e6);
    border-radius: 50%;
    background: #fff;
    font-size: 13px;
    font-weight: 600;
}

.geopaca-tunnel-step.is-done .geopaca-tunnel-step-mark
{
    border-color: var(--geopaca-green, #00ac34);
    color: var(--geopaca-green, #00ac34);
}

.geopaca-tunnel-step.is-current .geopaca-tunnel-step-mark
{
    border-color: var(--geopaca-green, #00ac34);
    background: var(--geopaca-green, #00ac34);
    color: #fff;
}

.geopaca-tunnel-step.is-done
{
    color: var(--geopaca-text-secondary, #555);
}

.geopaca-tunnel-step.is-current
{
    color: var(--geopaca-text, #222);
    font-weight: 600;
}

/* Sous 600 px, les trois intitulés ne tiennent plus côte à côte. Seul celui
   de l'étape courante reste : c'est la seule réponse attendue à cette
   largeur, les pastilles disant le reste. */
@media only screen and (max-width: 600px)
{
    .geopaca-tunnel-step:not(.is-current) .geopaca-tunnel-step-label
    {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }

    .geopaca-tunnel-step:not(.is-current)
    {
        gap: 0;
    }
}

/* ==========================================================================
   Panier vide
   ==========================================================================
   Une commande ne porte qu'une découpe : la retirer vide le panier d'un
   coup, et le client se retrouvait devant une page nue. Le bloc reprend la
   carte du panier — même bord, même fond — pour que la page garde sa forme
   quand son contenu a disparu. */

.geopaca-cart-empty
{
    max-width: 760px;
    margin: 0 auto;
    padding: 34px 30px;
    border: 1px solid var(--geopaca-border, #dfe3e6);
    border-radius: 6px;
    background: #fff;
    text-align: center;
}

.geopaca-cart-empty h2
{
    margin: 0 0 8px !important;
    padding: 0 !important;
    color: var(--geopaca-text, #222) !important;
    font-size: 21px !important;
    font-weight: 600 !important;
    line-height: 1.3;
}

.geopaca-cart-empty p
{
    margin: 0 !important;
    color: var(--geopaca-text-secondary, #555) !important;
    font-size: 14px !important;
    line-height: 1.5;
}

.geopaca-cart-empty p + p
{
    margin-top: 22px !important;
}

.geopaca-cart-empty-action
{
    display: inline-block;
    padding: 13px 28px;
    border-radius: 4px;
    background: var(--geopaca-green, #00ac34);
    color: #fff !important;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
}

.geopaca-cart-empty-action:hover
{
    background: var(--geopaca-green-dark, #009a2f);
    color: #fff !important;
}

/* ==========================================================================
   Destination hors barème
   ==========================================================================
   Le thème met en gras et à droite le contenu de cette cellule, hérité du
   message d'alerte de WooCommerce. Ce n'est plus une alerte : le client n'a
   rien fait de mal, on lui explique seulement que sa commande relève du
   devis. */

.geopaca-no-shipping
{
    margin: 0 !important;
    color: var(--geopaca-text-secondary, #555) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.5;
    text-align: left !important;
}

.geopaca-no-shipping a
{
    color: var(--geopaca-green, #00ac34) !important;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}

.geopaca-no-shipping a:hover
{
    text-decoration: underline;
}