/*
Theme Name:   Petit Paris Child
Template:     petitparis
Version:      2.4.1
Description:  Thème enfant pour le thème Petit Paris.
Author:       Le designer
Author URI:   vvvdesigner.com
Text Domain:  petitparis-child
*/


/* =====================================================
   1. BOUTON AJOUTER AU PANIER — PAGE PRODUIT
   Objectif : styliser le bouton WooCommerce "Ajouter au panier"
===================================================== */

.single_add_to_cart_button{
  position:relative !important;
  display:inline-block !important;
  padding:15px 40px !important;
  font-size:18px !important;
  font-weight:700 !important;
  color:#fff !important;
  background-color:#fbc7b7 !important;
  border:2px solid #fbc7b7 !important;
  border-radius:10px !important;
  cursor:pointer !important;
  overflow:hidden !important;
  z-index:1 !important;
  transition:all .4s ease !important;
  box-shadow:0 4px 15px rgba(0,0,0,.20) !important;
}

/* Effet lumineux sur le bouton */
.single_add_to_cart_button::before{
  content:"" !important;
  position:absolute !important;
  top:0 !important;
  left:50% !important;
  width:0 !important;
  height:100% !important;
  background-color:rgba(255,255,255,.50) !important;
  transition:all .6s ease !important;
  z-index:0 !important;
}

/* Hover bouton ajouter au panier */
.single_add_to_cart_button:hover{
  background-color:#000 !important;
  color:#fff !important;
  border-color:#fbc7b7 !important;
  box-shadow:0 15px 30px rgba(0,0,0,.40) !important;
  transform:translateY(-5px) !important;
}

.single_add_to_cart_button:hover::before{
  width:100% !important;
  left:0 !important;
}


/* =====================================================
   2. VARIATIONS PRODUITS — CORRECTION AFFICHAGE SELECT
   Objectif : corriger l’affichage des choix de variation
   Exemple : formats, parfums, options produits
===================================================== */

.woocommerce .elementor-28687 .elementor-element.elementor-element-30f75fb form.cart table.variations td.value select,
.woocommerce div.product.elementor.elementor-28687 .elementor-element.elementor-element-30f75fb form.cart table.variations td.value:before,
.woocommerce .elementor-31769 .elementor-element.elementor-element-95bf916 form.cart table.variations td.value select,
.woocommerce div.product.elementor.elementor-31769 .elementor-element.elementor-element-95bf916 form.cart table.variations td.value:before{
  font-size:1em;
  font-weight:900;
  text-transform:uppercase;
  font-style:italic;
  letter-spacing:-.5px;
  word-spacing:0;
  line-height:normal !important;
  padding:10px;
  margin:5px;
}


/* =====================================================
   3. PRIX PRODUITS — COULEUR ET TAILLE
   Objectif : forcer le prix WooCommerce en noir
===================================================== */

.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product span.price{
  color:#000 !important;
  font-size:1.25em;
}


/* =====================================================
   4. CHECKOUT — BLOC PAIEMENT WOOCOMMERCE
   Objectif : rendre le bloc paiement plus propre et premium
===================================================== */

.woocommerce-checkout #payment{
  border-radius:28px;
  background:#fff8f5;
  border:1px solid rgba(251,199,183,.65);
  padding:22px;
}

/* Labels des moyens de paiement */
.woocommerce-checkout #payment ul.payment_methods li label{
  font-weight:800;
  color:#111;
}


/* =====================================================
   5. STRIPE — RENOMMER "OPTIONS DE PAIEMENT"
   Objectif : remplacer le texte Stripe par :
   "Paiement 100% sécurisé • Carte bancaire • Stripe"
===================================================== */

/* Cache le texte original ajouté par Stripe */
label[for="payment_method_stripe"]{
  font-size:0 !important;
}

/* Nouveau texte principal */
label[for="payment_method_stripe"]::before{
  content:"Paiement 100% sécurisé";
  font-size:16px;
  font-weight:800;
  color:#111;
}

/* Texte secondaire Stripe */
label[for="payment_method_stripe"]::after{
  content:"  • Carte bancaire • Stripe";
  font-size:15px;
  font-weight:700;
  color:#fbc7b7;
}


/* =====================================================
   6. PAYPAL — LABEL DU MOYEN DE PAIEMENT
   Objectif : garder PayPal propre et lisible
===================================================== */

.woocommerce-checkout #payment ul.payment_methods li.payment_method_ppcp-gateway label{
  font-weight:800;
  color:#111;
}


/* =====================================================
   7. BOUTON COMMANDER — CHECKOUT
   Objectif : styliser le bouton final de commande
===================================================== */

.woocommerce-checkout #place_order{
  border-radius:999px !important;
  background:#111 !important;
  color:#fff !important;
  font-weight:900 !important;
  padding:16px 28px !important;
  transition:all .3s ease !important;
}

.woocommerce-checkout #place_order:hover{
  background:#fbc7b7 !important;
  color:#111 !important;
  transform:translateY(-3px);
  box-shadow:0 18px 45px rgba(0,0,0,.22);
}


/* =====================================================
   8. RESPONSIVE CHECKOUT
   Objectif : améliorer l’affichage mobile du paiement
===================================================== */

@media(max-width:767px){

  .woocommerce-checkout #payment{
    border-radius:22px;
    padding:18px;
  }

  label[for="payment_method_stripe"]::before{
    display:block;
    font-size:15px;
    line-height:1.4;
  }

  label[for="payment_method_stripe"]::after{
    display:block;
    margin-top:4px;
    font-size:13px;
    line-height:1.4;
  }

  .woocommerce-checkout #place_order{
    width:100%;
    padding:16px 22px !important;
  }

}

/* =====================================================
   9. CHECKOUT — RÉASSURANCE STRIPE / 3D SECURE
===================================================== */

.vvv-spp-payment-security{
  display:flex;
  align-items:flex-start;
  gap:14px;
  margin:0 0 18px;
  padding:17px 18px;
  border:1px solid rgba(251,199,183,.82);
  border-radius:20px;
  background:linear-gradient(135deg,#fff 0%,#fff8f5 100%);
  color:#111;
  box-shadow:0 10px 30px rgba(57,35,28,.055);
}

.vvv-spp-payment-security__icon{
  display:grid;
  flex:0 0 42px;
  width:42px;
  height:42px;
  place-items:center;
  border-radius:14px;
  background:#fbc7b7;
  color:#111;
}

.vvv-spp-payment-security__icon svg{
  width:23px;
  height:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.vvv-spp-payment-security__copy{
  display:block;
  min-width:0;
}

.vvv-spp-payment-security__copy strong{
  display:block;
  margin:1px 0 5px;
  color:#111;
  font-size:14px;
  font-weight:900;
  line-height:1.25;
}

.vvv-spp-payment-security__copy > span{
  display:block;
  color:#67544e;
  font-size:12px;
  font-weight:600;
  line-height:1.55;
}

@media(max-width:767px){
  .vvv-spp-payment-security{
    gap:11px;
    padding:15px;
    border-radius:17px;
  }

  .vvv-spp-payment-security__icon{
    flex-basis:38px;
    width:38px;
    height:38px;
    border-radius:12px;
  }

  .vvv-spp-payment-security__copy strong{
    font-size:13px;
  }

  .vvv-spp-payment-security__copy > span{
    font-size:11px;
  }
}


/* =====================================================
   10. CHECKOUT — DESIGN PREMIUM DU BLOC CARTE BANCAIRE
===================================================== */

.woocommerce-checkout #payment{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(17,17,17,.08);
  border-radius:32px;
  padding:26px;
  background:
    radial-gradient(circle at top right, rgba(251,199,183,.48), transparent 34%),
    linear-gradient(145deg,#fffdfc 0%,#fff7f4 46%,#fff 100%);
  box-shadow:0 26px 70px rgba(69,38,28,.10);
}

.woocommerce-checkout #payment::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.45) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.45) 1px, transparent 1px);
  background-size:22px 22px;
  opacity:.34;
  pointer-events:none;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.4), transparent 82%);
}

.woocommerce-checkout #payment > *{
  position:relative;
  z-index:1;
}

.woocommerce-checkout #payment ul.payment_methods{
  margin:0;
  padding:0;
  border:0;
  list-style:none;
}

.woocommerce-checkout #payment ul.payment_methods > li{
  position:relative;
  margin:0 0 16px;
  padding:20px 20px 16px;
  border:1px solid rgba(17,17,17,.08);
  border-radius:24px;
  background:rgba(255,255,255,.86);
  box-shadow:0 10px 30px rgba(66,37,27,.05);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.woocommerce-checkout #payment ul.payment_methods > li:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 38px rgba(66,37,27,.09);
}

.woocommerce-checkout #payment ul.payment_methods > li:last-child{
  margin-bottom:0;
}

.woocommerce-checkout #payment ul.payment_methods > li > input[type="radio"]{
  position:absolute;
  top:23px;
  left:18px;
  width:18px;
  height:18px;
  margin:0;
  accent-color:#111;
}

.woocommerce-checkout #payment ul.payment_methods > li > label{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 12px;
  min-height:22px;
  margin:0;
  padding-left:32px;
  font-family:'Mulish',sans-serif;
  font-size:16px;
  font-weight:800;
  line-height:1.35;
  color:#111;
}

.woocommerce-checkout #payment ul.payment_methods > li.payment_method_stripe > label::before,
.woocommerce-checkout #payment ul.payment_methods > li.payment_method_stripe > label::after{
  content:none !important;
}

.woocommerce-checkout #payment ul.payment_methods > li.payment_method_stripe > label::after{
  content:none !important;
}

.woocommerce-checkout #payment ul.payment_methods > li.payment_method_stripe > label{
  padding-right:120px;
}

.woocommerce-checkout #payment ul.payment_methods > li.payment_method_stripe > label + img,
.woocommerce-checkout #payment ul.payment_methods > li.payment_method_stripe img[alt*="Stripe"],
.woocommerce-checkout #payment ul.payment_methods > li.payment_method_stripe .payment_method_icons,
.woocommerce-checkout #payment ul.payment_methods > li.payment_method_stripe .wc-stripe-card-icons-container{
  filter:grayscale(0);
}

.woocommerce-checkout #payment ul.payment_methods > li.payment_method_stripe::after{
  content:"CB • VISA • MASTERCARD";
  position:absolute;
  top:20px;
  right:20px;
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 12px;
  border-radius:999px;
  background:#111;
  color:#fff;
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
}

.woocommerce-checkout #payment ul.payment_methods > li:has(> input[type="radio"]:checked){
  border-color:rgba(17,17,17,.16);
  box-shadow:0 18px 44px rgba(38,21,15,.11);
  background:linear-gradient(180deg,#fff 0%,#fff7f4 100%);
}

.woocommerce-checkout #payment div.payment_box,
.woocommerce-checkout #payment .payment_box{
  margin:16px 0 0 !important;
  padding:18px !important;
  border:1px solid rgba(251,199,183,.75);
  border-radius:22px;
  background:#fff;
  color:#4d3b35;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8), 0 10px 28px rgba(74,43,32,.05);
}

.woocommerce-checkout #payment div.payment_box::before,
.woocommerce-checkout #payment .payment_box::before{
  display:none !important;
}

.woocommerce-checkout #payment .payment_box p{
  color:#5e4d47;
  font-size:14px;
  line-height:1.6;
}

.woocommerce-checkout #payment #wc-stripe-cc-form,
.woocommerce-checkout #payment .wc-credit-card-form,
.woocommerce-checkout #payment .wc-stripe-elements-field{
  margin-top:14px;
}

.woocommerce-checkout #payment .StripeElement,
.woocommerce-checkout #payment .wc-stripe-elements-field,
.woocommerce-checkout #payment input#stripe-card-element,
.woocommerce-checkout #payment .__PrivateStripeElement{
  border:1px solid #ecd7d0 !important;
  border-radius:16px !important;
  background:#fff !important;
  box-shadow:none !important;
}

.woocommerce-checkout #payment .wc-stripe-elements-field{
  padding:13px 14px !important;
  transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.woocommerce-checkout #payment .wc-stripe-elements-field:focus-within{
  border-color:#111 !important;
  box-shadow:0 0 0 4px rgba(251,199,183,.36) !important;
  transform:translateY(-1px);
}

.woocommerce-checkout #payment .wc-stripe-elements-field label,
.woocommerce-checkout #payment .form-row label{
  color:#111;
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
}

.woocommerce-checkout #payment .wc-stripe-elements-field input,
.woocommerce-checkout #payment .wc-stripe-elements-field select,
.woocommerce-checkout #payment .wc-stripe-elements-field .InputElement{
  color:#111 !important;
}

.vvv-spp-stripe-trust{
  margin-bottom:16px;
  padding:16px;
  border:1px solid rgba(251,199,183,.85);
  border-radius:18px;
  background:linear-gradient(145deg,#fff8f5 0%,#fff 100%);
}

.vvv-spp-stripe-trust__head{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}

.vvv-spp-stripe-trust__badge,
.vvv-spp-stripe-trust__cards{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.06em;
}

.vvv-spp-stripe-trust__badge{
  background:#111;
  color:#fff;
}

.vvv-spp-stripe-trust__cards{
  background:#f7e7e1;
  color:#6f5147;
}

.vvv-spp-stripe-trust p{
  margin:0 0 12px;
}

.vvv-spp-stripe-trust ul{
  display:grid;
  gap:8px;
  margin:0;
  padding:0;
  list-style:none;
}

.vvv-spp-stripe-trust li{
  position:relative;
  padding-left:24px;
  color:#4f3f3a;
  font-size:13px;
  font-weight:700;
  line-height:1.45;
}

.vvv-spp-stripe-trust li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:0;
  display:grid;
  width:18px;
  height:18px;
  place-items:center;
  border-radius:50%;
  background:#fbc7b7;
  color:#111;
  font-size:11px;
}

.woocommerce-checkout #payment .form-row.place-order{
  margin-top:18px;
  padding-top:18px;
  border-top:1px solid rgba(17,17,17,.08);
}

.woocommerce-checkout #place_order{
  width:100%;
  min-height:58px;
  border-radius:18px !important;
  background:linear-gradient(135deg,#111 0%,#2b211d 100%) !important;
  color:#fff !important;
  font-size:13px !important;
  font-weight:900 !important;
  letter-spacing:.08em;
  text-transform:uppercase;
  box-shadow:0 22px 45px rgba(17,17,17,.16);
}

.woocommerce-checkout #place_order:hover{
  background:linear-gradient(135deg,#fbc7b7 0%,#ebbaa9 100%) !important;
  color:#111 !important;
}

.woocommerce-checkout #payment .woocommerce-privacy-policy-text,
.woocommerce-checkout #payment .terms,
.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper{
  color:#6b5750;
  font-size:12px;
  line-height:1.65;
}

.woocommerce-checkout #payment .woocommerce-privacy-policy-text a,
.woocommerce-checkout #payment .terms a,
.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper a{
  color:#111;
  font-weight:800;
}

@media(max-width:767px){
  .woocommerce-checkout #payment{
    border-radius:24px;
    padding:18px;
  }

  .woocommerce-checkout #payment ul.payment_methods > li{
    padding:16px 16px 14px;
    border-radius:20px;
  }

  .woocommerce-checkout #payment ul.payment_methods > li.payment_method_stripe::after{
    position:static;
    margin:10px 0 0 32px;
    width:max-content;
    max-width:calc(100% - 32px);
    white-space:normal;
  }

  .woocommerce-checkout #payment ul.payment_methods > li > label{
    padding-left:30px;
    padding-right:0;
    font-size:15px;
  }

  .woocommerce-checkout #payment ul.payment_methods > li > input[type="radio"]{
    top:18px;
    left:14px;
  }

  .woocommerce-checkout #payment div.payment_box,
  .woocommerce-checkout #payment .payment_box{
    padding:15px !important;
    border-radius:18px;
  }

  .vvv-spp-stripe-trust__head{
    align-items:flex-start;
    justify-content:flex-start;
  }

  .woocommerce-checkout #place_order{
    min-height:54px;
    font-size:12px !important;
  }
}