/*
Theme Name:   	Techmarket Child
Theme URI:    	https://themeforest.net/item/techmarket-multidemo-electronics-store-woocommerce-theme/20241155
Author:         MadrasThemes
Author URI:     https://madrasthemes.com/
Description:  	This is the child theme for the techmarket theme
Template:     	techmarket
Version:      	1.4.5
License:      	GNU General Public License v2 or later
License URI:  	http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  	techmarket-child
Tags:         	e-commerce, two-columns, left-sidebar, right-sidebar, custom-colors, custom-menu, featured-images, full-width-template, threaded-comments, rtl-language-support, footer-widgets, sticky-post, theme-options
*/

/*Page checkout hide formulaire*/
#customer_details .col-1, #customer_details .col-2 .woocommerce-shipping-fields {
  display: none;
}

.yith-wcwl-share {
  display: none;
}

/* supprimer le menu departement */
#departments-menu {
  display: none !important;
}
/* la  femme avec des lunette
.kc-elm.kc-css-734536.kc_row {
  display: none !important;
}

*/


/*supp texte 'payement....'  */
.wc_payment_methods.payment_methods.methods {
  display: none !important;
}




/*liste de souhait --- supp le btn en haut */
body.single-product .yith-wcwl-add-to-wishlist--single,
.yith-wcwl-wishlistaddedbrowse > a,
.yith-wcwl-add-button a span {
  display: none !important;
}


/*page boutique l liste qui affiche le nombre de produits a affiché sur page  */

.form-techmarket-wc-ppp {
  display: none !important;
}

/* Espace au-dessus et en-dessous de votre sélecteur */
.container-colisage {
    display: block;        /* Force le passage à la ligne */
    width: 100%;           /* Prend toute la largeur disponible */
    margin-top: 20px;      /* Marge au-dessus (Espace avec les éléments précédents) */
    margin-bottom: 20px;   /* Marge en-dessous (Espace avec le bouton panier) */
}

/* Optionnel : Amélioration du style du select pour qu'il soit bien lisible */
.container-colisage select {
    display: block;
    margin-top: 5px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fff;
    cursor: pointer;
}

/* 1. S'assurer que le bloc Colisage prend toute la largeur et crée une séparation */
.container-colisage {
    display: block;
    width: 100%;
    margin-top: 15px;
    margin-bottom: 20px; /* Espace entre le select et le reste */
    clear: both;         /* Force le nettoyage des éléments flottants autour */
}

/* 2. Forcer le formulaire de panier (Quantité + Bouton) à passer en dessous */
form.cart {
    display: flex;
    flex-wrap: wrap;     /* Permet aux éléments de se réorganiser */
    width: 100%;
}

/* 3. Ajuster la quantité et le bouton pour qu'ils soient bien alignés */
.quantity {
    margin-right: 15px;  /* Espace entre la quantité et le bouton */
    display: inline-block;
}

.single_add_to_cart_button {
    display: inline-block;
    vertical-align: middle;
}

/* 1. Forcer le formulaire à devenir une pile verticale */
form.cart {
    display: flex !important;
    flex-direction: column !important; /* Force l'empilement vertical */
    align-items: flex-start !important; /* Aligne tout à gauche */
    gap: 15px; /* Espace entre chaque élément (Label, Quantité, Bouton) */
}

/* 2. Ajouter le Label manuellement au-dessus de la quantité */
.quantity::before {
    content: "Quantité :"; /* Le texte du label */
    display: block;
    margin-bottom: 10px;
}

/* 3. Ajuster la taille du champ quantité pour qu'il soit propre */
.quantity {
    display: flex;
    flex-direction: column;
}

/* 4. S'assurer que le bouton prend bien sa place */
.single_add_to_cart_button {
    width: 100%; /* Optionnel : si vous voulez un gros bouton sur toute la largeur */
    max-width: 300px;
}

.custom-ribbon-tag {
    position: absolute;
    top: 10px;
    left: 0;
    z-index: 10;
    background-color: #e62e3d; /* Couleur rouge du design */
    color: #ffffff;
    padding: 5px 25px 5px 15px;
    font-size: 14px;
    
    border-radius: 0 4px 4px 0; /* Arrondi à droite */
    border-top-left-radius: 15px; /* Arrondi spécial à gauche */
    border-bottom-left-radius: 15px;
    text-transform: uppercase;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
}

/* Ajout de la pointe en forme de flèche */
.custom-ribbon-tag::after {
    content: '';
    position: absolute;
    right: -10px;
    top: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 0 15px 10px;
    border-color: transparent transparent transparent #e62e3d;
}
.product { 
    position: relative; 
}