/*
Theme Name: TW4 Starter
Author: Vous
Version: 1.0.0
Text Domain: tw4-starter
*/

html {
  scroll-behavior: smooth;
}


@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
a { text-decoration: none;}
/* Variables */
:root {
	--size-very-big: 3.5rem;
	--size-big: 2.8rem;
	--size-medium: 1.6rem;
	--size-normal: 1.1rem;
	--size-small: 0.8rem;

	--color-title: #AAA;
	--color-text: #CCC;

	--color-lightest-blue: #EAF6FF;
	--color-light-blue: #3099EA;
	--color-middle-blue: #0060AF;
	--color-dark-blue: #07294A;
	--color-orange: #EFB076;
	--color-yellow: #FED339;
	--color-light-yellow: #FFF4CC;

	--color-light-grey: #ECECEC;
	--color-grey: #E5E5E5;

	--font-title: 'InterTight';
	--font-text: 'DMSans', sans-serif;
}
.nav-menu a {
  text-decoration: none;
}
.contact-top {
    text-transform: uppercase;
}
.btn_yellow {
    font-size: 12px;

    padding: 15px;
    background: var(--color-yellow);
    border-radius: 10px;
    padding: 6px;
    color: #000;
    text-decoration: none;
    transform: scale(1);
    transition-duration: .2s;
}
.woocommerce-tabs { display: none;}
.tw-woo-variations form.cart { margin: 0; }
.tw-woo-variations .variations { width: 100%; border: 0; margin: 0; }
.tw-woo-variations .variations th,
.tw-woo-variations .variations td { padding: 0; border: 0; }

.tw-woo-variations .variations tr { display: grid; gap: .5rem; }
.tw-woo-variations .variations th { font-size: .875rem; font-weight: 600; color: #0f172a; text-align: left; }
.tw-woo-variations .variations select {
  width: 247px;
  border: 1px solid #d1d5db;
  background: #fff;
  padding: .6rem .75rem;
  font-size: .875rem;
}

.tw-woo-variations .reset_variations { font-size: .875rem; text-decoration: underline; color: #64748b; }

.tw-woo-variations .single_variation_wrap { margin-top: 1rem; display: grid; gap: 1rem; }

.tw-woo-variations .quantity .qty {
  width: 70px;
  border: 1px solid #d1d5db;
  padding: .6rem .5rem;
  text-align: center;
  font-weight: 600;
}

.tw-woo-variations .single_add_to_cart_button {
  border: 1px solid #d1d5db;
  background: #fff;
  padding: .75rem 1rem;
  font-weight: 600;
  cursor: pointer;
}
.tw-woo-variations .single_add_to_cart_button:hover { background: #f8fafc; }
.tw-woo-variations .woocommerce-variation-add-to-cart {
  display: flex;
  gap: .75rem;
  align-items: center;
  flex-wrap: wrap;
}
.n8-add-to-cart{
  background:#07294a !important;
  color:#fff !important;
}

.n8-add-to-cart:hover{
  background:#FED339 !important;
  color:#07294a !important;
}
.single_add_to_cart_button{
  background:#07294a !important;
  color:#fff !important;
}

.single_add_to_cart_button:hover{
  background:#FED339 !important;
  color:#07294a !important;
}

/* =========================
   WPMC NAV BUTTONS (EASY CARTONS)
========================= */

.wpmc-nav-wrapper{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-end;
  align-items: center;
  margin-top: 18px;
}

/* Base */
.wpmc-nav-wrapper .button{
  appearance: none;
  border: 1px solid rgba(2, 25, 43, .12);
  background: #fff;
  color: #07294a;
  font-weight: 800;
  font-size: 14px;
  line-height: 1;
  padding: 12px 16px;
  border-radius: 9999px;
  cursor: pointer;
  transition: transform .12s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease, border-color .18s ease, opacity .18s ease;
  box-shadow: 0 1px 0 rgba(2, 25, 43, .04), 0 8px 22px rgba(2, 25, 43, .08);
}

/* Hover/Focus */
.wpmc-nav-wrapper .button:hover{
  transform: translateY(-1px);
  box-shadow: 0 1px 0 rgba(2, 25, 43, .06), 0 14px 30px rgba(2, 25, 43, .14);
  border-color: rgba(2, 25, 43, .18);
}
.wpmc-nav-wrapper .button:focus{
  outline: none;
}
.wpmc-nav-wrapper .button:focus-visible{
  outline: 3px solid rgba(255, 213, 74, .55); /* jaune */
  outline-offset: 2px;
}

/* Bouton "retour" = secondaire */
#wpmc-back-to-cart{
  background: #fff;
  color: #07294a;
}

/* Boutons actifs = primaire (Suivant / Ignorer...) */
.wpmc-nav-wrapper .button.button-active{
  background: #07294a;
  color: #fff;
  border-color: rgba(7, 41, 74, .9);
}
.wpmc-nav-wrapper .button.button-active:hover{
  background: #061f36; /* un poil plus sombre */
}

/* Bouton actif + "current" -> accent jaune (plus visible) */
.wpmc-nav-wrapper .button.button-active.current{
  background: #ffd54a;
  color: #07294a;
  border-color: rgba(7, 41, 74, .18);
}
.wpmc-nav-wrapper .button.button-active.current:hover{
  background: #ffcf2e;
}

/* Inactif / disabled */
.wpmc-nav-wrapper .button.button-inactive,
.wpmc-nav-wrapper .button:disabled{
  opacity: .45;
  cursor: not-allowed;
  transform: none;
  box-shadow: 0 1px 0 rgba(2, 25, 43, .04), 0 8px 22px rgba(2, 25, 43, .06);
}
/* Si un bouton est inactif, il doit rester inactif même s'il a "current" */
.wpmc-nav-wrapper .button.button-inactive.current,
.wpmc-nav-wrapper .button.button-inactive.current:hover,
.wpmc-nav-wrapper .button.button-inactive.current:focus{
  background: #fff !important;
  color: #07294a !important;
  border-color: rgba(2, 25, 43, .12) !important;
  opacity: .45 !important;
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: 0 1px 0 rgba(2, 25, 43, .04), 0 8px 22px rgba(2, 25, 43, .06) !important;
  outline: none !important;
}


/* Petits ajustements responsive */
@media (max-width: 640px){
  .wpmc-nav-wrapper{
    justify-content: stretch;
  }
  .wpmc-nav-wrapper .button{
    width: 100%;
    justify-content: center;
  }
}
/* Bouton facture - Invoices for WooCommerce (shortcode bewpi) */
.woocommerce-order-received a[href*="bewpi_action=view"]{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  padding: 0 18px;
  border-radius: 9999px;
  background: #ffd54a;
  color: #07294a;
  font-weight: 800;
  font-size: 14px;
  line-height: 1;
  text-decoration: none;
  border: 1px solid rgba(7,41,74,.15);
  box-shadow: 0 1px 0 rgba(2, 25, 43, .04), 0 10px 24px rgba(2, 25, 43, .10);
  transition: transform .12s ease, box-shadow .18s ease, opacity .18s ease;
}
.woocommerce-order-received a[href*="bewpi_action=view"]:hover{
  transform: translateY(-1px);
  box-shadow: 0 1px 0 rgba(2, 25, 43, .06), 0 16px 30px rgba(2, 25, 43, .14);
  opacity: .95;
}
.woocommerce-order-received a[href*="bewpi_action=view"]:focus-visible{
  outline: 3px solid rgba(255, 213, 74, .55);
  outline-offset: 2px;
}
.woocommerce-MyAccount-navigation .is-active > a{
  background: #07294a;
  color: #fff;
  border-color: rgba(7,41,74,.85);
}
.woocommerce-MyAccount-navigation .is-active > a svg{
  color: #ffd54a;
}
/* Fix : menu Mon Compte qui s'écrase */
.woocommerce-MyAccount-navigation,
.woocommerce-MyAccount-navigation ul,
.woocommerce-MyAccount-navigation li,
.woocommerce-MyAccount-navigation li a{
  width: 100% !important;
}
.woocommerce-MyAccount-navigation li a{
  display: flex;
  box-sizing: border-box;
}

/* Etat actif */
.woocommerce-MyAccount-navigation .is-active > a{
  background: #07294a;
  color: #fff;
  border-color: rgba(7,41,74,.85);
}
.woocommerce-MyAccount-navigation .is-active > a svg{
  color: #ffd54a;
}
.woocommerce-account .woocommerce-MyAccount-content {
width: 100% !important;
}
.woocommerce-ordering { display: none;}

/* WooCommerce product loops: remove ul/li bullets and spacing */
.woocommerce ul.products{
  list-style: none !important;
  padding-left: 0;
  margin-left: 0;
}
#related-product li {
  list-style: none !important;
}

/* =========================
   WooCommerce Notices (EASY CARTONS)
========================= */

/* Base */
.woocommerce-notices-wrapper{
  margin: 18px 0;
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error{
  position: relative;
  border-radius: 18px;
  padding: 14px 16px 14px 52px; /* place pour l'icône */
  margin: 0 0 14px;
  font-weight: 700;
  font-size: 14px;
  line-height: 1.35;
  box-shadow: 0 1px 0 rgba(2, 25, 43, .04), 0 10px 28px rgba(2, 25, 43, .08);
  border: 1px solid rgba(2, 25, 43, .12);
  background: #fff;
  color: #07294a;
}

/* Icône (générique) */
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before{
  content: "";
  position: absolute;
  left: 16px;
  top: 14px;
  width: 24px;
  height: 24px;
  border-radius: 9999px;
  display: grid;
  place-items: center;
  font-weight: 900;
  font-size: 14px;
}

/* SUCCESS (message) */
.woocommerce-message{
  border-left: 6px solid #16a34a;              /* vert */
  background: linear-gradient(0deg, #ffffff, #ffffff), #fff;
}
.woocommerce-message::before{
  content: "✓";
  color: #16a34a;
  background: #dcfce7;
}

/* INFO */
.woocommerce-info{
  border-left: 6px solid #2563eb;              /* bleu */
}
.woocommerce-info::before{
  content: "i";
  color: #2563eb;
  background: #dbeafe;
}

/* ERROR */
.woocommerce-error{
  border-left: 6px solid #dc2626;              /* rouge */
}
.woocommerce-error::before{
  content: "!";
  color: #dc2626;
  background: #fee2e2;
}

/* Liens dans les notices (ex: Annuler ?) */
.woocommerce-message a,
.woocommerce-info a,
.woocommerce-error a{
  font-weight: 900;
  text-decoration: none;
  color: #07294a;
}

/* Lien "restore-item" (Annuler ?) -> style bouton */
.woocommerce-message a.restore-item,
.woocommerce-info a.restore-item,
.woocommerce-error a.restore-item{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 34px;
  padding: 0 12px;
  margin-left: 10px;
  border-radius: 9999px;
  background: #fed339;
  color: #07294a;
  border: 1px solid rgba(7, 41, 74, .15);
  box-shadow: 0 1px 0 rgba(2, 25, 43, .04), 0 8px 18px rgba(2, 25, 43, .10);
  transition: transform .12s ease, box-shadow .18s ease, opacity .18s ease;
}
.woocommerce-message a.restore-item:hover,
.woocommerce-info a.restore-item:hover,
.woocommerce-error a.restore-item:hover{
  transform: translateY(-1px);
  opacity: .95;
  box-shadow: 0 1px 0 rgba(2, 25, 43, .06), 0 14px 24px rgba(2, 25, 43, .14);
}

/* Accessibilité focus */
.woocommerce-message a:focus-visible,
.woocommerce-info a:focus-visible,
.woocommerce-error a:focus-visible{
  outline: 3px solid rgba(254, 211, 57, .55);
  outline-offset: 2px;
}

/* Mobile */
@media (max-width: 640px){
  .woocommerce-message,
  .woocommerce-info,
  .woocommerce-error{
    padding-left: 50px;
  }
  .woocommerce-message a.restore-item,
  .woocommerce-info a.restore-item,
  .woocommerce-error a.restore-item{
    margin-left: 0;
    margin-top: 10px;
  }
}

/* =========================
   CHECKOUT (WooCommerce + WPMC) — Easy Cartons
========================= */

.woocommerce-checkout form.checkout{
  max-width: 1100px;
  margin: 0 auto;
}

/* Titres */
.woocommerce-checkout h3,
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout #payment_heading{
  font-size: 18px;
  font-weight: 900;
  color: #07294a;
  margin: 0 0 14px;
}

/* Blocs (billing / review / payment) */
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-additional-fields,
.woocommerce-checkout #order_review,
.woocommerce-checkout #payment{
  background: #fff;
  border: 1px solid rgba(7,41,74,.12);
  border-radius: 24px;
  padding: 18px;
  box-shadow: 0 1px 0 rgba(2,25,43,.04), 0 14px 34px rgba(2,25,43,.08);
}

.woocommerce-additional-fields { margin-top: 20px;}
/* Espacements entre sections (WPMC step items) */
.wpmc-step-item{
  margin-bottom: 18px;
}

/* Grille des champs : 2 colonnes sur desktop */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper{
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
@media (min-width: 768px){
  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper{
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  /* Champs wide prennent toute la ligne */
  .woocommerce-checkout .form-row-wide{
    grid-column: 1 / -1;
  }
}

/* Labels */
.woocommerce-checkout .form-row label{
  display: block;
  margin-bottom: 6px;
  font-size: 12px;
  font-weight: 900;
  color: #07294a;
}

/* Checkout: laisser la grid gérer la largeur (annule les 47% WooCommerce) */
.woocommerce-checkout form.woocommerce-checkout .form-row-first,
.woocommerce-checkout form.woocommerce-checkout .form-row-last,
.woocommerce-checkout form.woocommerce-checkout .form-row-wide{
  width: 100% !important;
  float: none !important;
  clear: none !important;
}
/* Inputs */
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row select{
  width: 100%;
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(7,41,74,.18);
  background: #fff;
  padding: 10px 12px;
  font-size: 14px;
  font-weight: 700;
  color: #07294a;
  outline: none;
  box-shadow: inset 0 1px 0 rgba(2,25,43,.03);
}

.woocommerce-checkout .form-row textarea{
  height: auto;
  min-height: 90px;
  resize: vertical;
}

/* Focus */
.woocommerce-checkout .form-row input:focus,
.woocommerce-checkout .form-row textarea:focus,
.woocommerce-checkout .form-row select:focus{
  border-color: rgba(254,211,57,.9);
  box-shadow: 0 0 0 4px rgba(254,211,57,.35);
}

/* Validation Woo */
.woocommerce-checkout .woocommerce-invalid input,
.woocommerce-checkout .woocommerce-invalid select,
.woocommerce-checkout .woocommerce-invalid textarea{
  border-color: rgba(220,38,38,.85);
  box-shadow: 0 0 0 4px rgba(220,38,38,.20);
}

/* Select2 (Pays) */
.woocommerce-checkout .select2-container .select2-selection--single{
  height: 44px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(7,41,74,.18) !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 12px !important;
}
.woocommerce-checkout .select2-container .select2-selection__rendered{
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #07294a !important;
  padding-left: 0 !important;
}
.woocommerce-checkout .select2-container--default .select2-selection__arrow{
  height: 44px !important;
}

/* Point retrait : joli wrapper */
#daypart_field{
  margin-top: 10px;
}
#daypart_field select{
  height: 46px;
}

/* Horaires points retrait */
.woocommerce-checkout .local-h{
  margin-top: 12px;
  margin-bottom: 12px;
  padding: 14px;
  border-radius: 18px;
  border: 1px dashed rgba(7,41,74,.22);
  background: rgba(7,41,74,.03);
  color: #07294a;
  font-size: 13px;
}
.woocommerce-checkout .local-h strong{
  color: #07294a;
}

/* TABLE Récap */
.woocommerce-checkout table.shop_table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid rgba(7,41,74,.12);
}

.woocommerce-checkout table.shop_table th,
.woocommerce-checkout table.shop_table td{
  padding: 12px 14px;
  font-size: 14px;
  color: #07294a;
}

.woocommerce-checkout table.shop_table thead th{
  background: rgba(7,41,74,.06);
  font-weight: 900;
}

.woocommerce-checkout table.shop_table tbody tr:not(:last-child) td{
  border-bottom: 1px solid rgba(7,41,74,.10);
}

.woocommerce-checkout table.shop_table tfoot th{
  font-weight: 900;
}
.woocommerce-checkout table.shop_table tfoot tr.order-total td strong{
  font-size: 16px;
}

/* Paiement : liste methods */
.woocommerce-checkout .wc_payment_methods{
  list-style: none;
  padding: 0;
  margin: 0;
}
.woocommerce-checkout .wc_payment_method{
  border: 1px solid rgba(7,41,74,.12);
  border-radius: 18px;
  padding: 14px;
  margin-bottom: 10px;
  background: #fff;
}
.woocommerce-checkout .wc_payment_method label{
  font-size: 14px;
  font-weight: 900;
  color: #07294a;
  display: flex;
  align-items: center;
  gap: 10px;
}
.woocommerce-checkout .wc_payment_method img{
  max-height: 32px;
}

/* Checkbox CGV */
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper{
  margin-top: 14px;
}
.woocommerce-checkout .woocommerce-form__label-for-checkbox{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(7,41,74,.12);
  background: rgba(7,41,74,.03);
  color: #07294a;
  font-weight: 800;
}
.woocommerce-checkout .woocommerce-form__input-checkbox{
  width: 18px;
  height: 18px;
  margin-top: 2px;
}

/* Bouton final */
.woocommerce-checkout #place_order{
  width: 100%;
  height: 52px;
  border-radius: 16px;
  background: #07294a;
  color: #fff;
  font-weight: 900;
  font-size: 15px;
  border: 1px solid rgba(7,41,74,.15);
  box-shadow: 0 1px 0 rgba(2,25,43,.05), 0 14px 30px rgba(2,25,43,.12);
  transition: transform .12s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}
.woocommerce-checkout #place_order:hover{
  background: #fed339;
  color: #07294a;
  transform: translateY(-1px);
  box-shadow: 0 1px 0 rgba(2,25,43,.06), 0 18px 34px rgba(2,25,43,.16);
}
.woocommerce-checkout #place_order:focus-visible{
  outline: 3px solid rgba(254,211,57,.55);
  outline-offset: 2px;
}

/* WPMC nav buttons (si tu veux homogénéiser) */
.wpmc-nav-wrapper .wpmc-nav-button,
.wpmc-nav-wrapper #wpmc-back-to-cart{
  height: 44px;
  border-radius: 9999px;
  font-weight: 900;
  padding: 0 16px;
  border: 1px solid rgba(7,41,74,.15);
  background: #fff;
  color: #07294a;
  transition: transform .12s ease, opacity .18s ease, background .18s ease, color .18s ease;
}
.wpmc-nav-wrapper .button-active{
  background: #07294a;
  color: #fff;
}
.wpmc-nav-wrapper .button-active:hover{
  background: #fed339;
  color: #07294a;
  transform: translateY(-1px);
}
.wpmc-nav-wrapper .button-inactive{
  opacity: .5;
  cursor: not-allowed;
}
/* Fix checkbox CGV (WooCommerce) */
.woocommerce-checkout .woocommerce-form__input-checkbox,
.woocommerce-checkout input[type="checkbox"].input-checkbox{
  display: inline-block !important; /* ou block */
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  vertical-align: middle !important;
  flex: 0 0 18px !important;
}

/* Garder un alignement clean avec le texte */
.woocommerce-checkout .woocommerce-form__label-for-checkbox{
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.woocommerce-checkout .woocommerce-form__label-for-checkbox span{
  line-height: 1.3; margin: 20px;
}
/* Espace avant le bouton de paiement */
.woocommerce-checkout .place-order{
  margin-top: 16px;
}

.woocommerce-checkout #place_order{
  margin-top: 12px;   /* espace avec les CGV */
}

/* Optionnel : un peu d’air en bas du bloc paiement */
.woocommerce-checkout #payment{
  padding-bottom: 22px;
}
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper{
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(7,41,74,.10);
}
/* Espace entre texte confidentialité et bloc CGV */
.woocommerce-checkout .woocommerce-privacy-policy-text{
  margin: 14px 0 18px;
}

.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper{
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(7,41,74,.10);
}

/* Optionnel : donner un peu d'air au label CGV lui-même */
.woocommerce-checkout .woocommerce-form__label-for-checkbox{
  margin-top: 6px;
}