/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */


/* Style de base du badge de rupture */
.fl-stock-badge {
    display: inline-block;
    width: 100%;
    padding: 8px 12px;
    margin-bottom: 10px;
    background: var(--e-global-color-primary);
    color: var(--e-global-color-3fd60f0);
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .04em;
    border-radius: 4px;
}

/* Ajustement spécifique à l'archive WooCommerce */
.fl-stock-badge--archive {
    margin-bottom: 8px;
}

/* Conteneur image du template Elementor */
.product-thumb {
    position: relative !important;
    display: block !important;
    width: 100%;
}

/* Forcer l'image à occuper toute la largeur disponible */
.product-thumb .product-image,
.product-thumb .product-image .elementor-widget-container,
.product-thumb .product-image a,
.product-thumb .product-image img {
    display: block;
    width: 100%;
}

/* Positionnement du badge au centre de l'image dans le carrousel */
.product-thumb .stock-badge-wrapper {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 99 !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none;
}

/* Style du badge dans le carrousel */
.product-thumb .fl-stock-badge {
    display: inline-block;
    white-space: nowrap;
    padding: 10px 18px;
    background: var(--e-global-color-primary);
    color: var(--e-global-color-3fd60f0);
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 4px;
}

/* Point d'ancrage du badge sur les fiches archive */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link {
    position: relative;
    display: block;
}

/* Image archive en pleine largeur */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link img {
    display: block;
    width: 100%;
}

/* Positionnement du badge au centre visuel de l'image sur l'archive */
.woocommerce ul.products li.product .fl-stock-badge--archive {
    position: absolute !important;
    top: 38%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 20;

    width: max-content;
    max-width: 85%;
    padding: 10px 18px;
    background: var(--e-global-color-primary);
    color: var(--e-global-color-3fd60f0);

    font-size: 13px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .05em;
    border-radius: 4px;

    pointer-events: none;
}

/* Masquer le badge sur les produits en stock */
.woocommerce ul.products li.product:not(.outofstock) .fl-stock-badge--archive {
    display: none;
}

/* Ajout marge entre éléments liste filtrage Woo Filter */
#products-filter .editablecat {
  margin-bottom: 5px;
}

/* Option personnalisation sur fiche produit via Extra Product Options */
.thwepo-extra-options,
.thwepo-extra-options tbody,
.thwepo-extra-options tr,
.thwepo-extra-options td {
    background-color: transparent !important;
}

/* Produits variables : le champ passe sur sa propre ligne */
.woocommerce-variation-add-to-cart {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px;
    align-items: stretch;
}

/* Le tableau de personnalisation prend toute la largeur */
.woocommerce-variation-add-to-cart .thwepo-extra-options {
    flex-basis: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 8px;
}

/* État normal input personnalisation */
.thwepo-extra-options input.thwepof-input-field {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    border: 1px solid var(--e-global-color-secondary) !important;
}

/* État focus input personnalisation */
.thwepo-extra-options input.thwepof-input-field:focus,
.thwepo-extra-options input.thwepof-input-field:focus-visible {
    border: 1px solid var(--e-global-color-primary) !important;
    outline: none !important;
    box-shadow: none !important;
}

/* Affiche le label au-dessus du champ de saisie */
.thwepo-extra-options tr {
    display: flex;
    flex-direction: column;
}

/* Force les cellules du tableau à occuper toute la largeur */
.thwepo-extra-options td.label,
.thwepo-extra-options td.value {
    display: block;
    width: 100% !important;
    padding: 0 !important;
}

/* Réduit l'espace sous le label */
.thwepo-extra-options td.label {
    margin-bottom: 4px;
}

/* Supprime les marges éventuelles du texte du label */
.thwepo-extra-options .label-tag {
    display: block;
    margin: 0;
}

/* Garde la quantité à sa largeur naturelle */
.woocommerce-variation-add-to-cart .quantity {
    flex: 0 0 auto;
}

/* Le bouton prend l'espace restant sans déborder */
.woocommerce-variation-add-to-cart .single_add_to_cart_button {
    flex: 1 1 auto;
    min-width: 180px;
}

/* Masque uniquement le H2 généré par WooCommerce dans les onglets */
.woocommerce-tabs .woocommerce-Tabs-panel > h2:first-child {
    display: none;
}