:root{ --color-primary:#111827; }


/* ==== CSS migré depuis le Customizer (2908) ==== */
/* Arrondir toutes les images d'une fiche produit WooCommerce (Kadence) */
.woocommerce div.product div.images img,
.woocommerce div.product div.thumbnails img {
    border-radius: 15px; /* ajuste la valeur selon ton style */
    overflow: hidden;
}

/* ===== Accordéons Suppléments (checkboxes) ===== */
.sup-accordion{
  margin: 18px 0 10px;
  display: grid;
  gap: 12px;
}

.sup-item{
  background: var(--global-palette9, #fff);
  border: 1px solid var(--global-palette6, #e5e7eb);
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(16,24,40,.04);
  overflow: hidden;
}

/* Header bouton */
.sup-toggle{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  background: transparent;
  border: 0;
  padding: 12px 14px;
  font-weight: 600;
  font-size: 0.98rem;
  cursor: pointer;
  color: var(--global-palette3, #111827);
}
.sup-toggle:hover{
  background: rgba(17,24,39,.03);
}

/* Flèche */
.sup-caret{
  transition: transform .2s ease;
}
.sup-item.open .sup-caret{
  transform: rotate(180deg);
}

/* Panneau repliable */
.sup-panel{
  max-height: 0;
  overflow: hidden;
  transition: max-height .25s ease;
  padding: 0 14px;
  background: var(--global-palette9, #fff);
}

/* Quand ouvert, ajoute un padding intérieur */
.sup-item.open .sup-panel{
  padding: 8px 14px 12px;
}

/* Checkboxes */
.sup-check{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0;
  font-size: 0.95rem;
  cursor: pointer;
  user-select: none;
}
.sup-check input[type="checkbox"]{
  width: 18px;
  height: 18px;
  accent-color: var(--global-palette, #3b82f6); /* Couleur principale Kadence */
}
.sup-check em{
  font-style: normal;
  color: #6b7280;
  margin-left: 4px;
}

/* Espacement avec le bouton panier */
.single_add_to_cart_button{
  margin-top: 10px;
}

/* Panier / Commande : lisibilité des “Suppléments” */
.woocommerce-cart .product-name .wc-item-meta,
.woocommerce-checkout-review-order .product-name .wc-item-meta,
.woocommerce-order .product-name .wc-item-meta{
  margin-top: 6px;
  font-size: 0.92rem;
  line-height: 1.35;
}
.woocommerce-cart .wc-item-meta .wc-item-meta-label{
  font-weight: 600;
}

.pasta-options{
  display: grid;
  gap: 14px;
  margin: 16px 0 10px;
}
.pasta-group{
  border: 1px solid var(--global-palette6, #e5e7eb);
  border-radius: 14px;
  padding: 14px 16px;
  background: var(--global-palette9, #fff);
}
.pasta-group legend{
  font-weight: 700;
  font-size: .98rem;
  padding: 0 6px;
  margin-left: 4px;
}
.pasta-group .sup-check{
  display: flex; align-items: center; gap: 10px;
  padding: 6px 0; font-size: .95rem;
}

/* 🌿 SUPPRESSION des blocs .poke-composer (Compos’ Poké) */
/* 🌿 SUPPRESSION des blocs .salade-composer (Compos’ Salade) */

/* === reste du CSS inchangé === */

body {
  background-image: url("https://bowlandbox.fr/wp-content/uploads/2025/08/MENU-FINALE.png");
  background-repeat: repeat; /* ou no-repeat si tu veux qu'une seule image */
  background-size: cover;    /* cover = prend tout l’écran */
  background-attachment: fixed; /* option : effet "parallaxe" */
}

.page-title {
  margin-top: 60px;   /* valeur positive = descend le texte */
}

.poke-utensiles-inline{
  display:flex;
  align-items:center;
  gap:18px;
  margin:12px 0 6px;
}
.poke-utensiles-inline .poke-utensiles-label{
  font-weight:600;
  opacity:.8;
}
.poke-utensiles-inline .poke-utensile{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
@media (max-width: 520px){
  .poke-utensiles-inline{ flex-wrap:wrap; gap:12px; }
}

/* Mettre le label "Ustensiles" en gras */
.poke-utensiles-inline .poke-utensiles-label {
  font-weight: bold;
  opacity: 1;
  margin-right: 8px;
}

/* Aligner le champ quantité avec le bouton "Ajouter au panier" */
.woocommerce div.product form.cart {
  display: flex;
  align-items: center;
  gap: 10px;
}

.woocommerce div.product form.cart .quantity {
  margin: 0;
}

.woocommerce div.product form.cart .single_add_to_cart_button {
  margin: 0;
}

/* Ligne des cases : côte-à-côte, sans libellé visible */
.poke-utensiles-inline {
  display: flex;
  align-items: center;
  gap: 18px;
  margin: 8px 0 14px;
}
.poke-utensiles-inline .poke-utensiles-label { 
  display: none; 
}
.poke-utensiles-inline label.utensile {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  font-weight: 500;
}

.bb-ustensiles-row {
  display: flex;
  align-items: center;
  gap: 20px; /* espace horizontal entre les cases */
  margin: 8px 0 10px;
}

.bb-ustensiles-row .bb-check {
  display: inline-flex;
  align-items: center;
  gap: 6px;   /* espace entre la case et le texte */
  font-size: .95rem;
}

/* quand coché → juste changer le fond */
.sup-check input[type="checkbox"]:checked,
.sup-check input[type="radio"]:checked {
  background: #111827;         /* fond vert */
  border-color: #111827;
}

/* ---- RESET FORT des cases dans nos blocs .sup-check ---- */
.sup-check input[type="checkbox"],
.sup-check input[type="radio"]{
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  width: 20px;
  height: 20px;
  border: 2px solid #111827;   /* couleur bordure */
  border-radius: 4px;
  background: #fff;
  background-image: none !important;   /* tue les SVG/ico Kadence/UA */
  box-shadow: none !important;
  outline: none !important;
  position: relative;
  cursor: pointer;
  transition: all .2s ease;
}

/* état coché : fond + bordure, mais AUCUN pictogramme */
.sup-check input[type="checkbox"]:checked,
.sup-check input[type="radio"]:checked{
  background: #111827;         /* couleur quand coché */
  border-color: #111827;
  background-image: none !important;
}

/* tue toute pseudo-décoration éventuelle posée par le thème */
.sup-check::before, .sup-check::after,
.sup-check span::before, .sup-check span::after { content: none !important; }

/* au cas où le thème dessine une coche sur le label */
.sup-check label::before, .sup-check label::after { content: none !important; }

/* accessoire : survol/focus (optionnel) */
.sup-check input[type="checkbox"]:focus,
.sup-check input[type="radio"]:focus{
  box-shadow: 0 0 0 2px rgba(17,24,39,.15) !important;
}

/* ===== Reset FORT des cases .sup-check ===== */
.sup-check input[type="checkbox"],
.sup-check input[type="radio"]{
  /* neutralise tous rendus natifs */
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;

  width: 20px;
  height: 20px;
  border: 2px solid #111827;       /* bordure à ta couleur */
  border-radius: 4px;
  background: #fff !important;
  background-image: none !important; /* tue les SVG/ico */
  box-shadow: none !important;
  outline: none !important;
  accent-color: auto;                /* évite l’accent-color violet */
  position: relative;
  cursor: pointer;
  transition: all .2s ease;
}

/* état coché : pas de pictogramme, seulement fond/bordure */
.sup-check input[type="checkbox"]:checked,
.sup-check input[type="radio"]:checked{
  background: #111827 !important;   /* fond quand coché */
  border-color: #111827 !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* supprime toute pseudo déco (thème) sur l'input */
.sup-check input[type="checkbox"]::before,
.sup-check input[type="checkbox"]::after,
.sup-check input[type="radio"]::before,
.sup-check input[type="radio"]::after{
  content: none !important;
  display: none !important;
}

/* supprime toute pseudo déco (thème) sur le label/texte */
.sup-check::before, .sup-check::after,
.sup-check label::before, .sup-check label::after,
.sup-check span::before, .sup-check span::after{
  content: none !important;
  display: none !important;
}

/* Optionnel: focus doux */
.sup-check input[type="checkbox"]:focus,
.sup-check input[type="radio"]:focus{
  box-shadow: 0 0 0 2px rgba(17,24,39,.15) !important;
}

/* Applique le même fond aux pages Shop et Catégories */
body.woocommerce-shop,
body.post-type-archive-product,
body.tax-product_cat {
  background-image: url('https://bowlandbox.fr/wp-content/uploads/2025/08/MENU-FINALE.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}

/* S'assure que le contenu n'écrase pas le fond */
body.woocommerce-page .site,
body.woocommerce-page .site-main,
body.woocommerce-page .content-area {
  background: transparent !important;
}
/* Si la galerie ne s'initialise pas, affiche quand même l'image */
.woocommerce div.product div.images,
.woocommerce div.product div.images .woocommerce-product-gallery,
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
  opacity: 1 !important;
  visibility: visible !important;
}
.woocommerce div.product div.images .woocommerce-product-gallery__image {
  display: block !important;
}
