/* ptbackdrop — lien menu + bannière accueil (chargés sur tout le site). */

/* Bandeau d'annonce pleine largeur (hook displayBanner) */
.ptb-announce {
  background: linear-gradient(90deg, #12433f 0%, #14a89c 100%);
  text-align: center;
}
.ptb-announce-link {
  display: block; padding: 9px 16px;
  color: #fff !important; text-decoration: none;
  font-weight: 600; font-size: 14px; letter-spacing: .2px;
  transition: opacity .15s;
}
.ptb-announce-link:hover { opacity: .9; text-decoration: underline; }
@media (max-width: 600px) { .ptb-announce-link { font-size: 12.5px; padding: 8px 12px; } }

/* Lien « Je crée mon fond » dans la nav */
.ptb-navcta { display: inline-flex; align-items: center; }
.ptb-navcta-link {
  display: inline-flex; align-items: center; gap: 6px;
  background: #c48a97; color: #fff !important; text-decoration: none;
  padding: 8px 16px; border-radius: 22px; font-weight: 600; font-size: 14px;
  transition: background .15s, transform .15s;
}
.ptb-navcta-link:hover { background: #b0788a; transform: translateY(-1px); }
.ptb-navcta-icon { font-size: 12px; }
.ptb-navcta-upload {
  display: inline-flex; align-items: center;
  margin-right: 10px; padding: 7px 15px; border-radius: 22px;
  border: 1.5px solid #c48a97; background: #fff; color: #a86e7c !important;
  text-decoration: none; font-weight: 600; font-size: 14px; white-space: nowrap;
  transition: background .15s, color .15s, transform .15s;
}
.ptb-navcta-upload:hover { background: #f6edf0; transform: translateY(-1px); }

/* Bannière accueil */
.ptb-banner {
  margin: 0 0 28px; border-radius: 16px; overflow: hidden;
  background: linear-gradient(120deg, #f6e7ec 0%, #efe3d7 55%, #e7eee9 100%);
}
.ptb-banner-inner { padding: 40px 30px; text-align: center; max-width: 720px; margin: 0 auto; }
.ptb-banner-kicker { letter-spacing: 3px; font-size: 12px; color: #b0788a; font-weight: 700; margin: 0 0 8px; }
.ptb-banner-title { font-size: 30px; margin: 0 0 12px; color: #2c2c2c; }
.ptb-banner-text { color: #5a5a5a; font-size: 15px; margin: 0 auto 22px; max-width: 540px; }
.ptb-banner-btn {
  display: inline-block; background: #c48a97; color: #fff !important; text-decoration: none;
  padding: 13px 30px; border-radius: 26px; font-weight: 600; font-size: 16px;
  transition: background .15s, transform .15s;
}
.ptb-banner-btn:hover { background: #b0788a; transform: translateY(-1px); }

@media (max-width: 600px) {
  .ptb-banner-inner { padding: 30px 18px; }
  .ptb-banner-title { font-size: 23px; }
}

/* ============================================================
   Menu principal (blocktopdropdownmenu / Superfish)
   ============================================================ */

/* CORRECTIF « le sous-menu se ferme tout seul » :
   le CSS d'origine ouvre le sous-menu de 1er niveau à top:57px alors que la barre
   fait 50px de haut → 7px de vide transparent où le survol se perd. On le colle
   au bas de la barre (flush) pour supprimer cette zone morte. Desktop uniquement. */
@media (min-width: 768px) {
  #block_top_menu .sf-menu > li:hover > ul,
  #block_top_menu .sf-menu > li.sfHover > ul { top: 100% !important; }
}

/* Couleurs des menus saisonniers (ciblés par l'URL de la catégorie, robuste). */
#block_top_menu .sf-menu > li > a[href*="esprit-de-noel"]   { color: #c62828 !important; } /* Noël — rouge */
#block_top_menu .sf-menu > li > a[href*="esprit-d-automne"] { color: #cf7a24 !important; } /* Automne — orange pastel */
#block_top_menu .sf-menu > li > a[href*="esprit-de-paques"] { color: #d76a9f !important; } /* Pâques — rosé */

/* « Fonds épurés » — item mis en avant + petit effet au survol (soulignement animé + couleur/espacement). */
#block_top_menu .sf-menu > li > a[href*="fonds-epures-sans-decor"] {
  color: #0f8b81 !important; position: relative;
  transition: color .2s ease, letter-spacing .2s ease;
}
#block_top_menu .sf-menu > li > a[href*="fonds-epures-sans-decor"]::after {
  content: ""; position: absolute; left: 12px; right: 12px; bottom: 4px; height: 2px;
  background: linear-gradient(90deg, #14a89c, #7fded3);
  transform: scaleX(0); transform-origin: left; transition: transform .25s ease;
}
#block_top_menu .sf-menu > li > a[href*="fonds-epures-sans-decor"]:hover {
  color: #14a89c !important; letter-spacing: .4px;
}
#block_top_menu .sf-menu > li > a[href*="fonds-epures-sans-decor"]:hover::after { transform: scaleX(1); }

/* ============================================================
   Slider d'accueil (ps_imageslider) — moins haut
   Recadrage « cover » centré : réduit la hauteur sans déformer.
   ============================================================ */
#carousel .carousel-inner,
#carousel .carousel-item { max-height: 500px; }
#carousel .carousel-item img {
  height: 500px; width: 100%;
  object-fit: cover; object-position: center;
}
@media (max-width: 767px) {
  #carousel .carousel-inner, #carousel .carousel-item { max-height: none; height: auto; }
  #carousel .carousel-item img { height: auto; object-fit: contain; }
}

/* Badge « 🔥 Hit » (produits on_sale mis en avant) */
.product-flag.hit-flag {
  background: linear-gradient(135deg, #ff7a18, #d81e1e) !important;
  color: #fff !important; font-weight: 700; letter-spacing: .3px;
  box-shadow: 0 2px 6px rgba(216,30,30,.35);
}

/* Fiche produit : on masque le flag standard (bande sur l'aperçu) et on pose le badge
   DIRECTEMENT en haut à gauche du cadre d'aperçu (voir .ptb-bd-hit ci-dessous). */
.product-container .product-flags { display: none !important; }
.ptb-bd-frame { position: relative; }
.ptb-bd-hit {
  position: absolute; top: 10px; left: 10px; z-index: 4;
  background: linear-gradient(135deg, #ff7a18, #d81e1e); color: #fff;
  font-weight: 700; font-size: 13px; letter-spacing: .3px;
  padding: 5px 12px; border-radius: 999px; box-shadow: 0 2px 6px rgba(0,0,0,.25);
  pointer-events: none;
}

/* Couleurs saisonnières — AUSSI sur mobile (menu déroulant, tous niveaux) */
#block_top_menu a[href*="esprit-de-noel"], #mobile_top_menu_wrapper a[href*="esprit-de-noel"], #_mobile_top_menu a[href*="esprit-de-noel"] { color: #c62828 !important; }
#block_top_menu a[href*="esprit-d-automne"], #mobile_top_menu_wrapper a[href*="esprit-d-automne"], #_mobile_top_menu a[href*="esprit-d-automne"] { color: #cf7a24 !important; }
#block_top_menu a[href*="esprit-de-paques"], #mobile_top_menu_wrapper a[href*="esprit-de-paques"], #_mobile_top_menu a[href*="esprit-de-paques"] { color: #d76a9f !important; }
#block_top_menu a[href*="fonds-epures-sans-decor"], #mobile_top_menu_wrapper a[href*="fonds-epures-sans-decor"], #_mobile_top_menu a[href*="fonds-epures-sans-decor"] { color: #0f8b81 !important; }

/* ============================================================
   Bloc sous-catégories (page catégorie) — plus de vie
   ============================================================ */
.block-categories { border: 1px solid #e6e9ee; border-radius: 14px; padding: 18px 20px; background: #fff; box-shadow: 0 3px 14px rgba(20,40,60,.05); }
.block-categories .category-top-menu > li > a.h6 { display: inline-block; color: #0e7490; font-weight: 800; letter-spacing: .5px; position: relative; padding-bottom: 8px; margin-bottom: 8px; }
.block-categories .category-top-menu > li > a.h6::after { content: ""; position: absolute; left: 0; bottom: 0; width: 46px; height: 3px; border-radius: 3px; background: linear-gradient(90deg, #14a89c, #7fded3); }
.block-categories .category-sub-menu li { margin: 2px 0; }
.block-categories .category-sub-menu a { display: inline-block; color: #3a4a5a; text-decoration: none; padding: 6px 8px 6px 18px; position: relative; border-radius: 8px; transition: color .15s, background .15s, padding .15s; }
.block-categories .category-sub-menu a::before { content: ""; position: absolute; left: 4px; top: 50%; transform: translateY(-50%); width: 6px; height: 6px; border-radius: 50%; background: #c9d2dc; transition: background .15s, transform .15s; }
.block-categories .category-sub-menu a:hover { color: #0e7490; background: #f2fbfb; padding-left: 22px; }
.block-categories .category-sub-menu a:hover::before { background: #14a89c; transform: translateY(-50%) scale(1.35); }

/* ============================================================
   Barre CTA mobile fixe (Créer / Envoyer un fond) + survol sous-menu
   ============================================================ */
.ptb-mcta { display: none; }
@media (max-width: 767px) {
  .ptb-mcta { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 9999; gap: 8px; padding: 8px 10px; background: rgba(255,255,255,.97); box-shadow: 0 -2px 12px rgba(0,0,0,.14); }
  .ptb-mcta a { flex: 1; text-align: center; padding: 12px 6px; border-radius: 24px; font-weight: 700; font-size: 13.5px; text-decoration: none; white-space: nowrap; }
  .ptb-mcta-up { border: 1.5px solid #c48a97; color: #a86e7c !important; background: #fff; }
  .ptb-mcta-create { background: #c48a97; color: #fff !important; }
  body { padding-bottom: 66px; }
}
/* Sous-menu déroulant (desktop) — plus de vie au survol */
#block_top_menu .sf-menu ul a { transition: color .15s, background .15s; }
#block_top_menu .sf-menu ul a:hover { color: #0e7490 !important; background: #f2fbfb !important; }

/* Correctif affichage du <select> Pays/État (texte tronqué "←" + trop pâle) dans le formulaire d'adresse */
select[name="id_country"], select[name="id_state"] {
  height: auto !important;
  min-height: 44px !important;
  line-height: 1.5 !important;
  padding: 10px 34px 10px 12px !important;
  color: #333940 !important;
  font-size: 15px !important;
}

/* Description de catégorie : taille réduite (la police déco était trop grosse) */
#category-description, #category-description p, .category-description, .category-description p {
  font-size: 16px !important;
  line-height: 1.6 !important;
}

/* « À partir de » discret au-dessus du prix du configurateur */
.ptb-bd-from { display: block; font-size: .5em; font-weight: 400; color: #7a8794; letter-spacing: .3px; line-height: 1.2; }

/* « À partir de » sur TOUTES les vignettes produit (listes, accueil, nouveautés, meilleures ventes) */
.product-miniature .product-price-and-shipping .price::before {
  content: "À partir de ";
  display: block;
  font-size: .68em;
  font-weight: 400;
  color: #7a8794;
  letter-spacing: .2px;
  margin-bottom: 1px;
}
/* Ligne HT (n° TVA intracom) sous le prix TTC de la vignette */
.product-miniature .product-price-and-shipping .price .ptb-price-ht {
  display: block;
  font-size: .6em;
  font-weight: 400;
  color: #9aa5b1;
  letter-spacing: .1px;
  margin-top: 1px;
}

/* Badge « Fond » / « Nappe » sur les vignettes (distingue les designs en double) */
.product-miniature .ptb-type-tag {
  position: absolute; top: 8px; left: 8px; z-index: 4;
  font-size: 11px; font-weight: 700; letter-spacing: .3px;
  padding: 3px 10px; border-radius: 999px; color: #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,.2); pointer-events: none;
}
.product-miniature .ptb-tag-nappe { background: #c48a97; }
.product-miniature .ptb-tag-fond { background: #0e7490; }

/* Tailles en tuiles/boutons (nappes) au lieu du menu déroulant */
.product-variants .product-variants-item ul { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 8px 0 0; list-style: none; }
.product-variants .product-variants-item li { margin: 0; float: none !important; }
.product-variants .product-variants-item label { margin: 0; display: block; }
.product-variants .product-variants-item .input-radio { position: absolute; opacity: 0; width: 0; height: 0; }
.product-variants .product-variants-item .radio-label {
  display: block; padding: 9px 16px; border: 1.5px solid #d9dee4; border-radius: 10px;
  cursor: pointer; font-weight: 600; color: #3a4a5a; background: #fff;
  transition: all .15s; font-variant-numeric: tabular-nums;
}
.product-variants .product-variants-item .radio-label:hover { border-color: #14a89c; }
.product-variants .product-variants-item .input-radio:checked + .radio-label {
  border-color: #14a89c !important; background: #14a89c !important; color: #fff !important;
  box-shadow: 0 2px 8px rgba(20,168,156,.28);
}

/* ============================================================
   Panier / Commande — livraison offerte, décompte HT/TVA/TTC, RGPD
   ============================================================ */
/* Compteur « livraison offerte » */
.ptb-freeship-line { display: block !important; background: #eefaf6; border: 1px solid #bfe9dc; border-radius: 10px; padding: 10px 14px !important; margin: 4px 0 10px; }
.ptb-freeship-line .ptb-fs-label { color: #0e7a70; font-weight: 600; font-size: 14px; }
.ptb-freeship-line .ptb-fs-ok { color: #0f8b81; }
/* Ligne Total HT injectée */
.ptb-ht-line .label { color: #5a5a5a; }
.ptb-ht-line .value { color: #5a5a5a; }
/* Étoile « obligatoire » sur les cases RGPD */
.ptb-req-star { color: #d81e1e; font-weight: 700; margin-left: 2px; }
/* Retirer le bloc informatif « emballage / envoi séparé » (panier) */
.ets-htmlBox-hook .shipping-info { display: none !important; }

/* Page de confirmation — bandeau BRAVO + feux d'artifice */
.ptb-bravo { text-align: center; background: linear-gradient(120deg, #f6e7ec 0%, #efe3d7 55%, #e7eee9 100%); border: 1px solid #e6d3da; border-radius: 16px; padding: 26px 20px; margin: 0 0 22px; }
.ptb-bravo-emoji { font-size: 30px; letter-spacing: 6px; }
.ptb-bravo-title { color: #b0788a; margin: 10px 0 6px; font-size: 26px; }
.ptb-bravo-sub { color: #5a5a5a; font-size: 15px; margin: 0 auto; max-width: 520px; }
@media (max-width: 600px) { .ptb-bravo-title { font-size: 21px; } }