/* =========================================================
   SOWWWL — CSS GLOBAL FINAL (V2 PAPER COMMERCE)
   ========================================================= */

/* ---------------------------------------------------------
   1) FOND BLANC "PAPIER" + HALOS ROTATIFS + HUE SHIFT
   --------------------------------------------------------- */
body{
  background:#ffffff !important;
}

/* Halos vivants */
body::before{
  content:"";
  position:fixed;
  inset:-22vh -22vw;
  z-index:-2;
  pointer-events:none;
  background:
    radial-gradient(60vw 60vw at 30% 25%, rgba(0,255,160,.10), transparent 55%),
    radial-gradient(55vw 55vw at 75% 35%, rgba(255,170,80,.08), transparent 55%),
    radial-gradient(70vw 70vw at 55% 85%, rgba(0,160,255,.06), transparent 55%);
  transform-origin:50% 50%;
  opacity:.95;
  filter: blur(24px) saturate(1.05);
  transform: translateZ(0);
  animation:
    sowwwlFloat 18s ease-in-out infinite alternate,
    sowwwlSpin 42s linear infinite,
    sowwwlHue 28s linear infinite;
}

/* Grain léger */
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.14;
  background-image: repeating-linear-gradient(
    0deg,
    rgba(0,0,0,.018),
    rgba(0,0,0,.018) 1px,
    transparent 1px,
    transparent 3px
  );
  mix-blend-mode:multiply;
  animation:sowwwlGrain 1.1s steps(2) infinite;
}

@keyframes sowwwlFloat{
  0%   { transform: translate3d(-1.2vw, -1vh, 0) scale(1.02); }
  100% { transform: translate3d( 1.2vw,  1vh, 0) scale(1.04); }
}
@keyframes sowwwlSpin{
  from{ transform: rotate(0deg) translateZ(0) scale(1.03); }
  to  { transform: rotate(360deg) translateZ(0) scale(1.03); }
}
@keyframes sowwwlHue{
  from{ filter: blur(24px) saturate(1.05) hue-rotate(0deg); }
  to  { filter: blur(24px) saturate(1.05) hue-rotate(360deg); }
}
@keyframes sowwwlGrain{
  0% { transform: translate3d(0,0,0); }
  100% { transform: translate3d(-1%,1%,0); }
}

@media (prefers-reduced-motion: reduce){
  body::before, body::after{ animation:none !important; }
}

/* ---------------------------------------------------------
   2) HEADER OISEAU — UNE SEULE LIGNE (DESKTOP + MOBILE)
   --------------------------------------------------------- */
.header-bottom-bottom .tg-container.tg-flex-container{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px !important;
  flex-wrap:nowrap !important;
}
.header-bottom-bottom .tg-container.tg-flex-container > *{
  flex:0 0 auto !important;
  min-width:0;
}

/* Réseaux sociaux sur une ligne */
.header-bottom-bottom ul.tg-social-menu,
.header-bottom-bottom .tg-social-menu,
.header-bottom-bottom .menu-social-container ul{
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  flex-wrap:nowrap !important;
  margin:0 !important;
  padding:0 !important;
}

/* Menu principal (oiseau) */
.header-bottom-bottom .main-navigation{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
}
.header-bottom-bottom .main-navigation .nav-menu,
.header-bottom-bottom .main-navigation ul{
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  flex-wrap:nowrap !important;
  margin:0 !important;
  padding:0 !important;
}
.header-bottom-bottom .main-navigation .nav-menu a{
  display:inline-flex !important;
  align-items:center !important;
  white-space:nowrap !important;
  line-height:1 !important;
  padding:6px 8px !important;
}

/* Mobile : une ligne garantie (scroll horizontal si besoin) */
@media (max-width: 860px){
  .header-bottom-bottom .tg-container.tg-flex-container{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .header-bottom-bottom .tg-container.tg-flex-container::-webkit-scrollbar{ display:none; }
}

/* ---------------------------------------------------------
   3) INTERACTIONS VISUELLES (SANS TEXTE)
   --------------------------------------------------------- */
.header-bottom-bottom .main-navigation .nav-menu a{
  position:relative;
  transition: transform .12s ease;
}
.header-bottom-bottom .main-navigation .nav-menu a::after{
  content:"";
  position:absolute;
  left:50%;
  top:120%;
  width:28px;
  height:10px;
  transform:translateX(-50%);
  border-radius:999px;
  opacity:0;
  filter:blur(6px);
  background:rgba(0,255,160,.35);
  transition:opacity .12s ease, transform .12s ease;
}
.header-bottom-bottom .main-navigation .nav-menu a:hover::after,
.header-bottom-bottom .main-navigation .nav-menu a:focus-visible::after{
  opacity:1;
  transform:translateX(-50%) scale(1.1);
}
.header-bottom-bottom .main-navigation .nav-menu a:hover,
.header-bottom-bottom .main-navigation .nav-menu a:focus-visible{
  transform:translateY(-1px) rotate(-2deg);
}

/* ---------------------------------------------------------
   4) ANTI-DUPLICATION MENU STICKY
   --------------------------------------------------------- */
.tg-sticky-header .main-navigation,
.tg-sticky-header .tg-site-menu{
  display:none !important;
}

/* ---------------------------------------------------------
   5) WooCommerce — PAPER UI (PREMIUM + CONVERSION)
   --------------------------------------------------------- */

/* Tokens clairs (cohérents avec ton fond) */
:root{
  --wc-radius: 16px;
  --wc-radius-sm: 12px;

  --wc-ink: rgba(10,10,12,.92);
  --wc-muted: rgba(10,10,12,.62);

  --wc-card: rgba(255,255,255,.78);
  --wc-card-2: rgba(255,255,255,.64);

  --wc-border: rgba(10,10,12,.10);
  --wc-border-2: rgba(10,10,12,.14);

  --wc-shadow: 0 18px 55px rgba(0,0,0,.10);
  --wc-shadow-soft: 0 10px 26px rgba(0,0,0,.08);

  /* accent = ton halo vert, mais discret */
  --wc-accent: rgba(0,255,160,.70);
  --wc-accent-2: rgba(0,160,255,.55);
}

/* Couleurs de base Woo */
.woocommerce, .woocommerce-page{
  color: var(--wc-ink);
}

/* Layout respirant */
.woocommerce div.product,
.woocommerce-cart .cart-collaterals,
.woocommerce-checkout form.checkout,
.woocommerce-checkout #order_review,
.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce form.woocommerce-cart-form,
.woocommerce .woocommerce-notices-wrapper{
  background: linear-gradient(180deg, var(--wc-card), var(--wc-card-2));
  border: 1px solid var(--wc-border);
  border-radius: var(--wc-radius);
  box-shadow: var(--wc-shadow-soft);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.woocommerce form.woocommerce-cart-form,
.woocommerce-checkout form.checkout,
.woocommerce div.product{
  padding: clamp(14px, 2.2vw, 26px);
}

/* Titles / meta */
.woocommerce .woocommerce-breadcrumb,
.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering{
  color: var(--wc-muted);
}

/* Inputs / selects */
.woocommerce input[type="text"],
.woocommerce input[type="email"],
.woocommerce input[type="tel"],
.woocommerce input[type="password"],
.woocommerce textarea,
.woocommerce select,
.woocommerce .select2-container .select2-selection{
  background: rgba(255,255,255,.82) !important;
  color: var(--wc-ink) !important;
  border: 1px solid var(--wc-border) !important;
  border-radius: var(--wc-radius-sm) !important;
  box-shadow: none !important;
  min-height: 46px;
  padding: 10px 12px;
  outline: none;
}

.woocommerce input:focus,
.woocommerce textarea:focus,
.woocommerce select:focus,
.woocommerce .select2-container--default .select2-selection--single:focus{
  border-color: var(--wc-border-2) !important;
  box-shadow: 0 0 0 4px rgba(0,255,160,.14) !important;
}

/* Quantity */
.woocommerce .quantity .qty{
  width: 92px !important;
  text-align: center;
}

/* Notices clean */
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error{
  border-radius: var(--wc-radius);
  border: 1px solid var(--wc-border);
  background: rgba(255,255,255,.72);
  color: var(--wc-ink);
  box-shadow: var(--wc-shadow-soft);
}

/* Buttons — clean pill, “editorial luxury” */
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #payment #place_order,
.woocommerce-page #payment #place_order{
  border-radius: 999px !important;
  border: 1px solid rgba(10,10,12,.14) !important;
  background: rgba(255,255,255,.92) !important;
  color: rgba(10,10,12,.92) !important;
  padding: 12px 18px !important;
  line-height: 1 !important;
  font-weight: 650 !important;
  letter-spacing: .2px;
  text-transform: none !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.10);
  transition: transform .15s ease, box-shadow .15s ease, filter .2s ease, border-color .2s ease, background .2s ease;
}

/* Accent ring on hover */
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #payment #place_order:hover{
  transform: translateY(-1px);
  border-color: rgba(0,255,160,.40) !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.12);
  filter: brightness(1.02);
}

/* Primary CTA variant (place order / add to cart) */
.woocommerce .single_add_to_cart_button,
.woocommerce #payment #place_order,
.woocommerce a.checkout-button{
  background: linear-gradient(135deg, rgba(0,255,160,.18), rgba(0,160,255,.12)) !important;
  border-color: rgba(0,255,160,.35) !important;
}

/* Secondary buttons */
.woocommerce button[name="update_cart"],
.woocommerce .coupon button.button{
  background: rgba(255,255,255,.70) !important;
  border-color: rgba(10,10,12,.12) !important;
  box-shadow: none;
}

/* Product grid cards */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
  background: rgba(255,255,255,.72);
  border: 1px solid var(--wc-border);
  border-radius: var(--wc-radius);
  padding: 14px;
  box-shadow: var(--wc-shadow-soft);
  transition: transform .15s ease, border-color .2s ease, box-shadow .2s ease;
}
.woocommerce ul.products li.product:hover{
  transform: translateY(-2px);
  border-color: rgba(0,255,160,.30);
  box-shadow: 0 18px 55px rgba(0,0,0,.12);
}

/* Price */
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce ul.products li.product .price{
  color: rgba(10,10,12,.90);
  font-weight: 650;
}

/* Tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  border-radius: 999px;
  border: 1px solid var(--wc-border);
  background: rgba(255,255,255,.70);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{
  border-color: rgba(0,255,160,.35);
  background: rgba(255,255,255,.90);
}

/* Tables */
.woocommerce-checkout-review-order-table,
.woocommerce table.shop_table{
  border-radius: var(--wc-radius);
  overflow: hidden;
  border: 1px solid var(--wc-border);
  background: rgba(255,255,255,.66);
}
.woocommerce table.shop_table th,
.woocommerce table.shop_table td{
  border-color: rgba(10,10,12,.06) !important;
  color: var(--wc-ink);
}

/* Links + small UI */
.woocommerce a{
  color: rgba(10,10,12,.88);
  text-decoration-color: rgba(0,255,160,.35);
  text-underline-offset: 3px;
}
.woocommerce a:hover{
  text-decoration-color: rgba(0,255,160,.65);
}
.woocommerce .single_add_to_cart_button{
  position: relative;
}
.woocommerce .single_add_to_cart_button::after{
  content:"";
  position:absolute;
  left:50%;
  top:120%;
  width:140px;
  height:16px;
  transform:translateX(-50%);
  border-radius:999px;
  opacity:.55;
  filter:blur(10px);
  background: rgba(0,255,160,.28);
  pointer-events:none;
}


/* =========================================================
   FIN — SOWWWL CSS GLOBAL (V2)
   ========================================================= */