/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 13 2025 | 22:11:04 */
//fix

/* ==========================================================
   SGIA — Checkout : thème épuré & moderne
   -> 2 colonnes desktop (form), recap sticky à droite
   -> Sélection paiement = carte <li> entière
   -> Zéro outline/bordure noire, focus rouge SGIA
   ========================================================== */

/* ---------- Variables (faciles à retoucher) ---------- */
:root{
  --sgi-accent: #C20E1A;
  --sgi-bg: #F6F7FB;
  --sgi-card: #FFFFFF;
  --sgi-line: #E6E7EC;
  --sgi-line-strong: #D5D7DE;
  --sgi-text-900: #121417;
  --sgi-text-700: #343A40;
  --sgi-text-500: #6B7280;
  --sgi-shadow: 0 8px 24px rgba(18,20,23,.06);
  --sgi-radius: 14px;
}

/* ---------- Fond global ---------- */
body.woocommerce-checkout{ background: var(--sgi-bg) !important; }

/* ---------- Titres d’onglets / sections ---------- */
body.woocommerce-checkout .sgi-tab-toggle{
  display:block !important;
  margin:24px 0 12px !important;
  font-family:'DIN', system-ui, -apple-system, Segoe UI, Roboto, sans-serif !important;
  font-weight:800 !important;
  font-size:16px !important;
  letter-spacing:.02em !important;
  text-transform:uppercase !important;
  color:var(--sgi-text-900) !important;
  border-bottom:1px solid var(--sgi-line) !important;
  padding-bottom:8px !important;
}

/* ---------- Layout 70/30 : form + recap (desktop) ---------- */
.woocommerce-checkout form.checkout{ display:block; }
@media (min-width:1024px){
  .woocommerce-checkout form.checkout{
    display:flex !important;
    align-items:flex-start !important;
    gap:32px !important;
  }
  #customer_details{
    flex:0 1 70% !important;
    max-width:70% !important;
  }
  #order_review{
    flex:0 0 30% !important;
    max-width:30% !important;
    position:sticky !important;
    top:24px !important;
  }
}

/* ---------- Cartes (infos, livraison, expédition, paiement, récap) ---------- */
body.woocommerce-checkout .sgi-billing,
body.woocommerce-checkout .woocommerce-shipping-fields,
body.woocommerce-checkout #sgi-shipping-methods,
body.woocommerce-checkout #payment,
body.woocommerce-checkout ul.shop_table.woocommerce-checkout-review-order-table{
  background: var(--sgi-card) !important;
  border: 1px solid var(--sgi-line) !important;
  border-radius: var(--sgi-radius) !important;
  box-shadow: var(--sgi-shadow) !important;
  padding: 22px !important;
  margin: 12px 0 24px !important;
}

/* Nettoyage <p> parasites Woo */
body.woocommerce-checkout .woocommerce-billing-fields > p,
body.woocommerce-checkout .woocommerce-shipping-fields > p{
  margin:0 !important; padding:0 !important; line-height:0 !important;
}

/* ---------- Grilles propres (desktop 2 colonnes / mobile 1) ---------- */
body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
body.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper{
  display:grid !important;
  grid-template-columns: 1fr !important;
  gap: 18px 22px !important;
}
@media (min-width:1024px){
  body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
  body.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
}

/* Pleine largeur pour quelques champs fréquents */
body.woocommerce-checkout #billing_address_1_field,
body.woocommerce-checkout #billing_email_field,
body.woocommerce-checkout #billing_date_de_naissance_field,
body.woocommerce-checkout #billing_company_field,
body.woocommerce-checkout #billing_country_field,
body.woocommerce-checkout #shipping_company_field,
body.woocommerce-checkout #shipping_country_field,
body.woocommerce-checkout #shipping_address_1_field,
body.woocommerce-checkout #shipping_address_2_field{
  grid-column:1 / -1 !important;
}

/* Reset lignes champs */
body.woocommerce-checkout .form-row{ margin:0 !important; padding:0 !important; }
body.woocommerce-checkout .form-row br{ display:none !important; }

/* ---------- Labels minimalistes ---------- */
body.woocommerce-checkout .form-row label{
  display:block !important;
  margin:0 0 6px !important;
  font-family:'DIN', system-ui, -apple-system, Segoe UI, Roboto, sans-serif !important;
  font-size:12px !important;
  font-weight:700 !important;
  letter-spacing:.04em !important;
  text-transform:uppercase !important;
  color:var(--sgi-text-500) !important;
}
body.woocommerce-checkout .form-row .required{ color:var(--sgi-text-500) !important; }
body.woocommerce-checkout .form-row .optional{ color:#9AA0A6 !important; font-weight:400 !important; }

/* ---------- Inputs modernes (zéro bordure noire) ---------- */
body.woocommerce-checkout .woocommerce-input-wrapper input.input-text,
body.woocommerce-checkout .woocommerce-input-wrapper input[type="text"],
body.woocommerce-checkout .woocommerce-input-wrapper input[type="email"],
body.woocommerce-checkout .woocommerce-input-wrapper input[type="tel"],
body.woocommerce-checkout .woocommerce-input-wrapper input[type="number"],
body.woocommerce-checkout .woocommerce-input-wrapper select,
body.woocommerce-checkout .woocommerce-input-wrapper textarea,
input.hasDatepicker{
  width:100% !important;
  min-height:48px !important;
  padding:12px 14px !important;
  background:#FAFBFF !important;
  border:1px solid var(--sgi-line) !important;
  border-radius:10px !important;
  font-family:'DIN', system-ui, -apple-system, Segoe UI, Roboto, sans-serif !important;
  font-size:15px !important;
  font-weight:500 !important;
  color:var(--sgi-text-900) !important;
  outline:none !important;
  box-shadow:none !important;
  appearance:none !important;
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease !important;
}

/* Placeholder discret */
body.woocommerce-checkout .woocommerce-input-wrapper input::placeholder,
body.woocommerce-checkout .woocommerce-input-wrapper textarea::placeholder{
  color:#A1A7B0 !important; opacity:1 !important;
}

/* Focus : ring rouge SGIA */
body.woocommerce-checkout .woocommerce-input-wrapper input:focus,
body.woocommerce-checkout .woocommerce-input-wrapper select:focus,
body.woocommerce-checkout .woocommerce-input-wrapper textarea:focus,
input.hasDatepicker:focus{
  border-color: var(--sgi-accent) !important;
  box-shadow: 0 0 0 3px rgba(194,14,26,.12) !important;
  background:#FFF !important;
  outline:none !important;
}

/* États Woo */
body.woocommerce-checkout .form-row.woocommerce-invalid input,
body.woocommerce-checkout .form-row.woocommerce-invalid select,
body.woocommerce-checkout .form-row.woocommerce-invalid textarea{
  border-color: var(--sgi-accent) !important;
  box-shadow: 0 0 0 3px rgba(194,14,26,.14) !important;
  background:#FFF !important;
}
body.woocommerce-checkout .form-row.woocommerce-validated input,
body.woocommerce-checkout .form-row.woocommerce-validated select,
body.woocommerce-checkout .form-row.woocommerce-validated textarea{
  border-color:#22C55E !important;
  box-shadow:0 0 0 3px rgba(34,197,94,.14) !important;
}

/* Pays <strong> comme un champ */
body.woocommerce-checkout #billing_country_field strong,
body.woocommerce-checkout #shipping_country_field strong{
  display:block !important;
  min-height:48px !important;
  padding:12px 14px !important;
  background:#FAFBFF !important;
  border:1px solid var(--sgi-line) !important;
  border-radius:10px !important;
  font-size:15px !important;
  font-weight:600 !important;
  color:var(--sgi-text-900) !important;
}

/* Autofill WebKit harmonisé */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus{
  -webkit-box-shadow: 0 0 0 1000px #FAFBFF inset !important;
  -webkit-text-fill-color: var(--sgi-text-900) !important;
  transition: background-color 5000s ease-in-out 0s !important;
}

/* Numériques lisibles */
#billing_code_postal,#billing_phone,#shipping_postcode{
  font-variant-numeric: tabular-nums !important;
}

/* ---------- Méthodes d’expédition ---------- */
#sgi-shipping-methods{ padding:18px !important; }
#sgi-shipping-methods .woocommerce-shipping-methods,
#sgi-shipping-methods ul#shipping_method{
  list-style:none !important; margin:0 !important; padding:0 !important;
  display:grid !important; gap:12px !important;
}
#sgi-shipping-methods li{ position:relative !important; }
#sgi-shipping-methods input[type="radio"][name^="shipping_method"]{
  position:absolute !important; inset:0 !important; opacity:0 !important; pointer-events:none !important;
}
#sgi-shipping-methods li label{
  display:flex !important; align-items:center !important; justify-content:space-between !important; gap:12px !important;
  padding:14px 16px 14px 52px !important;
  background:#FFFFFF !important;
  border:1px solid var(--sgi-line) !important;
  border-radius:10px !important;
  cursor:pointer !important;
  font-family:'DIN', system-ui, -apple-system, Segoe UI, Roboto, sans-serif !important;
  font-size:14px !important; font-weight:700 !important; color:var(--sgi-text-900) !important;
  transition:border-color .15s ease, box-shadow .15s ease, transform .05s ease !important;
}
#sgi-shipping-methods li label::before{
  content:"" !important; position:absolute !important; left:18px !important; top:50% !important; transform:translateY(-50%) !important;
  width:18px !important; height:18px !important; border:1.5px solid var(--sgi-text-500) !important; border-radius:50% !important; background:#FFF !important;
}
#sgi-shipping-methods li label:hover{ border-color: var(--sgi-line-strong) !important; }
#sgi-shipping-methods li label:active{ transform: scale(.998) !important; }
#sgi-shipping-methods input[type="radio"][name^="shipping_method"]:checked + label{
  border-color: var(--sgi-accent) !important;
  box-shadow: 0 0 0 3px rgba(194,14,26,.12) !important;
}
#sgi-shipping-methods input[type="radio"][name^="shipping_method"]:checked + label::after{
  content:"" !important; position:absolute !important; left:22px !important; top:50% !important; transform:translateY(-50%) !important;
  width:10px !important; height:10px !important; border-radius:50% !important; background: var(--sgi-accent) !important;
}
#sgi-shipping-methods .amount, #sgi-shipping-methods .woocommerce-Price-amount{
  font-weight:800 !important; letter-spacing:.02em !important; text-transform:uppercase !important; color:var(--sgi-text-900) !important;
}

/* ---------- Paiement : cartes <li> sélectionnables ---------- */
#payment{ padding:18px !important; background:var(--sgi-card) !important; }
#payment .wc_payment_methods{
  list-style:none !important; margin:0 !important; padding:0 !important;
  display:grid !important; gap:12px !important; border:none !important;
}
#payment .wc_payment_method{
  position:relative !important;
  background:#FFFFFF !important;
  border:1px solid var(--sgi-line) !important;
  border-radius:10px !important;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease !important;
}
/* cacher radio natif */
#payment .wc_payment_method > input[type="radio"]{
  position:absolute !important; inset:0 !important; opacity:0 !important; pointer-events:none !important;
}
/* zone cliquable */
#payment .wc_payment_method > label{
  display:block !important; position:relative !important; padding:14px 16px 14px 52px !important; cursor:pointer !important;
  font-family:'DIN', system-ui, -apple-system, Segoe UI, Roboto, sans-serif !important; font-size:14px !important; font-weight:700 !important; color:var(--sgi-text-900) !important;
}
#payment .wc_payment_method > label::before{
  content:"" !important; position:absolute !important; left:18px !important; top:50% !important; transform:translateY(-50%) !important;
  width:18px !important; height:18px !important; border:1.5px solid var(--sgi-text-500) !important; border-radius:50% !important; background:#FFF !important;
}

#payment .wc_payment_method:has(> input[type="radio"]:checked) > label::after{
  content:"" !important; position:absolute !important; left:22px !important; top:50% !important; transform:translateY(-50%) !important;
  width:10px !important; height:10px !important; border-radius:50% !important; background: var(--sgi-accent) !important;
}
/* Sélection = ENTIER <li> encadré (2) fallback via .active) */
#payment .wc_payment_method.active{
  border-color: var(--sgi-accent) !important;
  box-shadow: 0 0 0 3px rgba(194,14,26,.12) !important;
  background:#FFF !important;
}
#payment .wc_payment_method.active > label::after{
  content:"" !important; position:absolute !important; left:22px !important; top:50% !important; transform:translateY(-50%) !important;
  width:10px !important; height:10px !important; border-radius:50% !important; background: var(--sgi-accent) !important;
}

.sgi_payment_box{
  display:block !important; padding:0 16px 16px 52px !important;
  font-size:13px !important; color:var(--sgi-text-700) !important;
}

/* Terms (checkbox) */
.payment-terms{ margin:14px 0 !important; padding-left:2px !important; }
.payment-terms input[type="checkbox"]{ position:absolute !important; opacity:0 !important; }
.payment-terms label{
  position:relative !important; padding-left:32px !important; display:block !important; cursor:pointer !important;
  font-size:14px !important; font-family:'DIN', system-ui, -apple-system, Segoe UI, Roboto, sans-serif !important; color:var(--sgi-text-900) !important;
}
.payment-terms label::before{
  content:"" !important; position:absolute !important; left:0 !important; top:3px !important; width:18px !important; height:18px !important;
  border:1.5px solid black !important; border-radius:4px !important; background:#FFF !important;
}
.payment-terms input[type="checkbox"]:checked + label::before{
  border-color: var(--sgi-accent) !important; background: var(--sgi-accent) !important;
}
.payment-terms input[type="checkbox"]:checked + label::after{
  content:"" !important; position:absolute !important; left:5px !important; top:8px !important; width:8px !important; height:4px !important;
  border:2px solid #fff !important; border-top:none !important; border-right:none !important; transform:rotate(-45deg) !important;
}

/* ---------- Récap commande (ul.shop_table) ---------- */
ul.shop_table.woocommerce-checkout-review-order-table{
  padding:20px !important; border-radius:var(--sgi-radius) !important;
}
ul.shop_table.woocommerce-checkout-review-order-table li{
  display:flex !important; align-items:flex-start !important; justify-content:space-between !important;
  gap:14px !important; padding:12px 0 !important; margin:0 !important;
  font-family:'DIN', system-ui, -apple-system, Segoe UI, Roboto, sans-serif !important;
  font-size:14px !important; line-height:1.4 !important; color:var(--sgi-text-900) !important;
}
ul.shop_table.woocommerce-checkout-review-order-table li:last-child{ border-bottom:0 !important; }
ul.shop_table.woocommerce-checkout-review-order-table li .amount,
ul.shop_table.woocommerce-checkout-review-order-table li .woocommerce-Price-amount{
  font-weight:800 !important; letter-spacing:.02em !important; color:var(--sgi-text-900) !important;
}
ul.shop_table.woocommerce-checkout-review-order-table li.order-total{
  padding-top:16px !important; margin-top:8px !important; border-top:1px solid var(--sgi-line-strong) !important;
}
ul.shop_table.woocommerce-checkout-review-order-table li.order-total .amount{
  font-size:18px !important; color:var(--sgi-accent) !important;
}

/* ---------- CTA principal ---------- */
#place_order{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  padding:16px 24px !important; border-radius:10px !important; border:1px solid var(--sgi-accent) !important;
  background: #c20e1a !important; color:#fff !important; font-weight:800 !important; text-transform:uppercase !important; letter-spacing:.02em !important;
  box-shadow: 0 8px 20px rgba(194,14,26,.20) !important;
  transition: transform .05s ease, box-shadow .15s ease !important;
}
#place_order:hover{ box-shadow: 0 12px 26px rgba(194,14,26,.26) !important; }
#place_order:active{ transform: translateY(1px) !important; }

/* ---------- Checkbox “Adresse différente” (pro & épuré) ---------- */
#ship-to-different-address.sgi-custom-checkbox{ margin:16px 0 0 !important; }
#ship-to-different-address.sgi-custom-checkbox label{
  position:relative !important; display:flex !important; align-items:center !important; gap:12px !important;
  padding:14px 16px 14px 48px !important; background:#FAFBFF !important; border:1px solid #E6E7EC !important;
  border-radius:10px !important; cursor:pointer !important;
  font-family:'DIN', system-ui, -apple-system, Segoe UI, Roboto, sans-serif !important; font-size:14px !important; font-weight:700 !important; color:#121417 !important;
  transition:border-color .15s ease, box-shadow .15s ease, background-color .15s ease !important;
}
#ship-to-different-address.sgi-custom-checkbox label br{ display:none !important; }
#ship-to-different-address.sgi-custom-checkbox input[type="checkbox"]{
  position:absolute !important; inset:0 !important; opacity:0 !important; cursor:pointer !important;
}
#ship-to-different-address.sgi-custom-checkbox label::before{
  content:"" !important; position:absolute !important; left:16px !important; top:50% !important; transform:translateY(-50%) !important;
  width:18px !important; height:18px !important; border:1.5px solid #D5D7DE !important; border-radius:4px !important; background:#FFFFFF !important;
}
#ship-to-different-address.sgi-custom-checkbox label:hover{ border-color:#D5D7DE !important; }
#ship-to-different-address.sgi-custom-checkbox:has(input:focus-visible) label{
  outline:2px solid rgba(17,24,39,.18) !important; outline-offset:2px !important;
}
#ship-to-different-address.sgi-custom-checkbox:has(input:checked) label{
  border-color:#C20E1A !important; background:#FFFFFF !important; box-shadow:0 0 0 3px rgba(194,14,26,.12) !important;
}
#ship-to-different-address.sgi-custom-checkbox:has(input:checked) label::before{
  background:#C20E1A !important; border-color:#C20E1A !important;
}
#ship-to-different-address.sgi-custom-checkbox:has(input:checked) label::after{
  content:"" !important; position:absolute !important; left:20px !important; top:50% !important; transform:translateY(-50%) rotate(-45deg) !important;
  width:10px !important; height:6px !important; border:2px solid #FFFFFF !important; border-top:none !important; border-right:none !important;
}
#ship-to-different-address.sgi-custom-checkbox label > span{ line-height:1.35 !important; color:#121417 !important; }

h3.sgi-heading{ display:none !important; }

/* Masquer le tout premier élément de la liste (souvent le <p> vide) */
.woocommerce-billing-fields__field-wrapper > *:first-child{
  display:none !important;
}

.woocommerce-billing-fields__field-wrapper > p:empty{
  display:none !important;
}

/* Cacher le bouton "Valider" sous les méthodes de livraison */
#sgi-shipping-methods ul#shipping_method button.tab-toggle,
#sgi-shipping-methods ul#shipping_method a[href="#pay_tab"],
#sgi-shipping-methods ul#shipping_method p:last-child{
  display: none !important;
}

/* Checkout – masquer les <p> vides (et la toute première) dans l’adresse de livraison */
.woocommerce-checkout .shipping_address > p:empty,
.woocommerce-checkout .shipping_address .woocommerce-shipping-fields__field-wrapper > p:empty{
  display:none !important;
}

/* Sécurité : cache aussi le tout premier <p> même s’il contient des espaces */
.woocommerce-checkout .shipping_address .woocommerce-shipping-fields__field-wrapper > p:first-child{
  display:none !important;
}

/* Si un <p> ne contient qu’un <br>, on le masque aussi (navigateurs modernes) */
@supports(selector(:has(*))){
  .woocommerce-checkout .shipping_address .woocommerce-shipping-fields__field-wrapper > p:has(> br){
    display:none !important;
  }
}


