/* ============================================================
   Myalpine.shop (shop 1) — modernisation visuelle v2
   Additif & reversible. Palette : vert alpin + bois + pin foret.
   ============================================================ */
:root{
  --map-green:#5ad132;
  --map-green-deep:#2f7d16;
  --map-wood:#c9a267;
  --map-pine:#1f3d2b;
  --map-paper:#f6f4ee;
  --map-serif:"Noto Sans Display","Raleway",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}
/* Noto Sans Display 900 (auto-hébergée, souverain) — pour les titres */
@font-face{font-family:"Noto Sans Display";font-style:normal;font-weight:900;font-display:swap;
  src:local("Noto Sans Display"),url("../fonts/shop_1/noto-sans-display-900.woff2") format("woff2");}

/* ---------- TYPOGRAPHIE ---------- */
h1,h2,h3,.h1,.h2,.h3,.product-title,.products-section-title,.page-header h1{
  font-family:var(--map-serif)!important;
  font-weight:700;
  letter-spacing:-.2px;
  color:var(--map-pine);
}
.page-product #main .product-title,
#product h1,
.product-detail-name,
.products-section-title,
#index .slider-title{font-weight:900!important;letter-spacing:-.4px}
.page-product #main .product-title,
#product h1,
.product-detail-name{font-size:2rem!important;line-height:1.12}

/* ---------- HEADER / TOP ---------- */
.header-top{padding-top:.4rem;padding-bottom:.4rem;background:#fff}
/* Barre utilitaire du haut (tel/email/langue) : restaurer le foncé d'origine (thème=#222), harmonisé pin */
.header-nav{background:#26312a !important}
.header-nav, .header-nav a, .header-nav .header-nav-link, .header-nav .link-contact, .header-nav .link-phone{color:#e8efe6}
.header-nav a:hover, .header-nav .header-nav-link:hover{color:var(--map-green) !important}

/* Barre de recherche -> pilule bordee, focus vert */
.search-widget input[type=text],
.search_query.form-control,
input.search_query{
  border-radius:999px!important;
  border:1.5px solid #e2ddce!important;
  background:#faf9f5!important;
  padding-left:1.1rem!important;
}
.search-widget input[type=text]:focus,
.search_query.form-control:focus{
  border-color:var(--map-green)!important;
  box-shadow:0 0 0 3px rgba(90,209,50,.18)!important;
  background:#fff!important;
}

/* Icones compte / panier : accent vert deja present, on renforce le survol */
.blockcart:hover,.user-info:hover{color:var(--map-green-deep)}

/* ---------- BARRE DE NAVIGATION (menu principal) ---------- */
.menu.js-top-menu,.header-menu,.menu-bg{background:#26312a!important} /* pin fonce, plus chaud que le charcoal */
.menu.js-top-menu .top-menu > li > a,
.header-menu .top-menu > li > a{
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:.82rem;
  font-weight:600;
  padding-top:1rem!important;
  padding-bottom:1rem!important;
  position:relative;
}
.menu.js-top-menu .top-menu > li > a:hover{color:#fff!important}
.menu.js-top-menu .top-menu > li > a::after{
  content:"";position:absolute;left:1rem;right:1rem;bottom:.55rem;height:2px;
  background:var(--map-green);transform:scaleX(0);transform-origin:left;
  transition:transform .22s ease;
}
.menu.js-top-menu .top-menu > li > a:hover::after,
.menu.js-top-menu .top-menu > li.active > a::after{transform:scaleX(1)}

/* ---------- SOUS-MENUS : dropdown compact ancré + illustré (méga-menu) ---------- */
.menu .top-menu > li{position:relative; overflow:visible;}
.menu .top-menu > li:nth-last-child(-n+3) > .sub-menu.js-sub-menu{left:auto !important; right:0 !important;}
.menu .sub-menu.js-sub-menu{
  background:#fff !important;
  position:absolute !important;
  top:100% !important;
  left:0 !important; right:auto !important;
  width:340px !important; min-width:340px !important; max-width:340px !important;
  border:1px solid #ece7db;
  border-top:3px solid var(--map-green);
  box-shadow:0 22px 48px rgba(31,61,43,.18) !important;
  border-radius:12px;
  padding:.6rem !important;
  margin-top:2px;
  z-index:1050 !important;
}
.menu .sub-menu.js-sub-menu > .top-menu{display:block !important;}
.menu .sub-menu.js-sub-menu .top-menu > li.category{
  flex:0 0 100% !important; max-width:100% !important; width:100%;
  margin:0 !important; padding:0 !important;
}
/* item = miniature + libellé alignés */
.menu .sub-menu .category > .dropdown-item.dropdown-submenu{
  display:flex !important; align-items:center; gap:12px;
  padding:.45rem .55rem !important;
  border-radius:10px;
  font-size:.9rem; line-height:1.2;
  color:#33413a !important; font-weight:600;
  transition:background .16s ease, color .16s ease;
  cursor:pointer; text-align:left; white-space:normal;
}
.menu .sub-menu .submenu-img{
  width:44px !important; height:44px !important; min-width:44px; flex:0 0 44px;
  object-fit:cover; border-radius:9px;
  margin:0 !important; padding:0 !important;
  border:1px solid #e7e2d5 !important; background:var(--map-paper); box-shadow:none !important;
  transition:border-color .16s ease;
}
.menu .sub-menu .category > .dropdown-item.dropdown-submenu::after{
  content:"›"; margin-left:auto; padding-left:6px;
  color:var(--map-green); font-weight:800; opacity:0;
  transition:opacity .16s ease, transform .16s ease;
}
.menu .sub-menu .category > .dropdown-item.dropdown-submenu:hover{
  background:var(--map-paper); color:var(--map-green-deep) !important;
}
.menu .sub-menu .category > .dropdown-item.dropdown-submenu:hover .submenu-img{border-color:var(--map-wood) !important;}
.menu .sub-menu .category > .dropdown-item.dropdown-submenu:hover::after{opacity:1; transform:translateX(2px);}
/* Sous-sous-menu (niveau 3) */
.menu .sub-sub-menu{
  background:#fff !important;
  border:1px solid #e7e2d5; border-top:2px solid var(--map-green);
  box-shadow:0 14px 30px rgba(31,61,43,.14) !important;
  border-radius:10px; padding:.5rem !important;
}

/* ---------- ENCART "À LA UNE" (méga-menu Phase 2) ---------- */
.menu .sub-menu.js-sub-menu:has(.mega-feat){
  width:700px !important; min-width:700px !important;
  max-width:calc(100vw - 40px) !important;
  align-items:stretch;
  padding:0 !important; overflow:hidden;
}
/* n'afficher (en flex) QUE le panneau de la catégorie survolée */
.menu > ul > li:hover > .sub-menu.js-sub-menu:has(.mega-feat){display:flex !important;}
.menu .sub-menu.js-sub-menu:has(.mega-feat) > .top-menu{
  flex:1 1 auto; min-width:0; align-self:flex-start;
  padding:.9rem .9rem 1rem !important;
  display:grid !important; grid-template-columns:1fr 1fr; gap:2px 6px;
}
.menu .sub-menu.js-sub-menu:has(.mega-feat) > .top-menu > li.category{width:auto !important; max-width:none !important;}
.mega-feat{
  position:relative; flex:0 0 252px; align-self:stretch;
  display:flex; flex-direction:column; justify-content:flex-end;
  min-height:288px; background:var(--map-pine); color:#fff; text-decoration:none; overflow:hidden;
}
.mega-feat .mega-feat-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  object-position:center; transform:scale(1.05);
  border:0 !important; border-radius:0 !important; max-width:none; transition:transform .5s ease;}
.mega-feat:hover .mega-feat-img{transform:scale(1.1);}
/* Luminaire (Pin d'arolle) : cadrage serré sur la lampe */
.category-177 .mega-feat .mega-feat-img{object-position:center 30%; transform:scale(1.5); transform-origin:center 30%;}
.category-177 .mega-feat:hover .mega-feat-img{transform:scale(1.58);}
.mega-feat .mega-feat-scrim{position:absolute; inset:0; background:linear-gradient(0deg,rgba(15,26,17,.9),rgba(15,26,17,.12) 62%);}
.mega-feat .mega-feat-body{position:relative; padding:16px 18px; display:flex; flex-direction:column;}
.mega-feat .mega-feat-eyebrow{font-size:.62rem; letter-spacing:.2em; text-transform:uppercase; color:var(--map-green); font-weight:800;}
.mega-feat .mega-feat-title{font-family:var(--map-serif); font-size:1.18rem; color:#fff; font-weight:600; margin-top:3px;}
.mega-feat .mega-feat-txt{font-size:.78rem; color:#dfe8db; line-height:1.35; margin:3px 0 6px;}
.mega-feat .mega-feat-price{font-family:var(--map-serif); font-weight:700; color:var(--map-green); font-size:1.02rem;}
.mega-feat .mega-feat-cta{display:inline-block; align-self:flex-start; margin-top:10px; background:var(--map-green);
  color:#0f2409; font-weight:700; padding:8px 17px; border-radius:999px; font-size:.78rem; transition:background .16s ease;}
.mega-feat:hover .mega-feat-cta{background:#6fe046;}

/* ============================================================
   COMPOSANTS RÉUTILISABLES — descriptions produit (style "coches")
   Usage : <div class="alp-box"><ul class="alp-checks"><li><strong>…</strong></li></ul></div>
   ============================================================ */
.alp-box{background:#f5f7f2;border:1px solid #e7e2d5;border-left:4px solid var(--map-green);
  border-radius:0 12px 12px 0;padding:1.1rem 1.4rem;margin:1.4rem 0;}
.alp-lead{font-size:1.12em;line-height:1.6;color:var(--map-pine);font-weight:600;margin:0 0 1rem;}
.alp-h{font-family:var(--map-serif);font-weight:700;color:var(--map-pine);font-size:1.2em;margin:1.4rem 0 .6rem;}
.alp-checks{list-style:none;padding:0;margin:.6rem 0 1rem;}
.alp-checks li{position:relative;padding-left:1.9rem;margin:.55rem 0;line-height:1.55;}
.alp-checks li::before{content:"✓";position:absolute;left:0;top:0;color:var(--map-green-deep);font-weight:900;}
.alp-checks li strong{color:var(--map-pine);}
.alp-note{font-size:.85em;color:#7a7a7a;margin-top:1rem;line-height:1.5;}
.alp-table{width:100%;border-collapse:collapse;margin:1.2rem 0;font-size:.95em;}
.alp-table th{background:var(--map-pine);color:#fff;text-align:left;padding:.55rem .8rem;}
.alp-table td{padding:.5rem .8rem;border-bottom:1px solid #e7e2d5;}
.alp-table tr:nth-child(even) td{background:#f7f9f3;}

/* ============================================================
   CONFORT DE LECTURE — descriptions produit
   ============================================================ */
.product-description,.product-description-short{font-size:1.02rem;line-height:1.75;color:#3f4a42;}
.product-description{max-width:70ch;}
.product-description p{margin:0 0 1rem;}
.product-description h2,.product-description h3,.product-description h4{
  font-family:var(--map-serif);color:var(--map-pine);font-weight:700;line-height:1.25;margin:1.6rem 0 .6rem;}
.product-description ul:not(.alp-checks){padding-left:1.25rem;margin:.8rem 0 1.2rem;}
.product-description ul:not(.alp-checks) li{margin:.35rem 0;}
.product-description a{color:var(--map-green-deep);text-decoration:underline;}
.product-description strong{color:var(--map-pine);}
.product-description img{border-radius:10px;max-width:100%;height:auto;}

/* Tableaux dans les descriptions : auto-stylés même sans classe */
.product-description table{width:100%;border-collapse:collapse;margin:1.3rem 0;font-size:.96em;
  border:1px solid #e7e2d5;border-radius:10px;overflow:hidden;}
.product-description table th{background:var(--map-pine);color:#fff;text-align:left;padding:.6rem .85rem;font-weight:700;}
.product-description table td{padding:.55rem .85rem;border-top:1px solid #eee6d6;}
.product-description table tr:nth-child(even) td{background:#f7f9f3;}

/* Panneau Ingrédients / Composition réutilisable
   Usage : <div class="alp-ingredients"><div class="alp-ing-head">Ingrédients</div><div class="alp-ing-body">…</div></div> */
.alp-ingredients{border:1px solid #e7e2d5;border-radius:12px;overflow:hidden;margin:1.4rem 0;}
.alp-ingredients .alp-ing-head{background:var(--map-pine);color:#fff;font-weight:700;padding:.7rem 1.1rem;
  font-family:var(--map-serif);letter-spacing:.2px;}
.alp-ingredients .alp-ing-body{padding:1rem 1.2rem;line-height:1.7;color:#4a544c;background:#fbfcf9;}

/* Onglets produit plus nets */
.tabs .nav-tabs{border-bottom:2px solid #ece7db;}
.tabs .nav-tabs .nav-link{border:0 !important;color:#6b756d;font-weight:700;padding:.7rem 1.1rem;
  border-bottom:3px solid transparent !important;background:transparent !important;}
.tabs .nav-tabs .nav-link.active{color:var(--map-pine);border-bottom-color:var(--map-green) !important;}

/* ---------- BOUTONS ---------- */
.btn-primary,.btn-primary:focus,
.add-to-cart,
.btn-primary:not(:disabled):not(.disabled){
  background-color:var(--map-green)!important;
  border-color:var(--map-green)!important;
  color:#123305!important;
  font-weight:700;
  border-radius:999px!important;
  box-shadow:0 6px 18px rgba(90,209,50,.30);
  transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}
.btn-primary:hover,.add-to-cart:hover{
  background-color:#6fe046!important;border-color:#6fe046!important;
  transform:translateY(-2px);box-shadow:0 10px 24px rgba(90,209,50,.38);
}
.btn-secondary,.btn-outline-primary,.btn-outline-secondary{border-radius:999px}

/* ---------- PRIX ---------- */
.price,.product-price,.current-price,.current-price .price,.block-product-price{
  color:var(--map-green-deep)!important;font-weight:700;
}
.page-product .current-price .price,#product .current-price span{font-size:2rem!important}

/* ---------- FIL D ARIANE ---------- */
.breadcrumb{background:transparent!important;padding-left:0}
.breadcrumb a{color:#8a8f88}
.breadcrumb .active,.breadcrumb li:last-child a{color:var(--map-green-deep)}

/* ---------- CARTES PRODUIT ---------- */
.product-miniature .thumbnail-container{
  border-radius:16px;overflow:hidden;border:1px solid #e7e2d5;background:#fff;
  box-shadow:0 4px 18px rgba(31,61,43,.06);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.product-miniature:hover .thumbnail-container{
  transform:translateY(-5px);box-shadow:0 16px 34px rgba(31,61,43,.14);border-color:var(--map-wood);
}
.product-title a{font-weight:600;color:var(--map-pine)}
.product-title a:hover{color:var(--map-green-deep)}
.block-product-thumbnail img{border-radius:10px}

/* ---------- PAGE PRODUIT : encadre livraison ---------- */
.product-information .tax-shipping-delivery-label,
#product .delivery-information,
.product-actions{border-radius:12px}

/* ---------- SLIDER HERO (home) ---------- */
#index .slider-caption{
  background:linear-gradient(90deg,rgba(20,32,22,.60),rgba(20,32,22,.20) 65%,rgba(20,32,22,0));
  padding:2rem 2.6rem;max-width:60%;
}
#index .slider-title{color:#fff!important;text-shadow:0 2px 18px rgba(0,0,0,.4);line-height:1.05}
#index .slider-subtitle{color:#f2f6ef!important;text-shadow:0 1px 10px rgba(0,0,0,.45);font-weight:400}
@media (max-width:767px){
  #index .slider-caption{max-width:100%;padding:1.2rem 1.4rem;
    background:linear-gradient(0deg,rgba(20,32,22,.66),rgba(20,32,22,.15))}
}

/* ---------- BLOCS PTE HOME ---------- */
#index .block-content,#index .block-link{border-radius:16px;overflow:hidden}
#index .block-img{transition:transform .5s ease}
#index .block-link:hover .block-img{transform:scale(1.05)}

/* Lisibilité des titres de blocs sur photo */
#index .theme-blocks-topColumn .block-content .h2,
#index .theme-blocks-topColumn .block-content h2,
#index .theme-blocks-topColumn .block-title,
#index .theme-blocks-topColumn .block-content h3{
  text-shadow:0 1px 10px rgba(255,255,255,.55);
}

/* ---------- HOME : aligner le slider (gauche) et les 2 blocs (droite) ---------- */
@media (min-width:768px){
  #index .theme-blocks.col-md-4{display:flex;flex-direction:column}
  #index .theme-blocks.col-md-4 > .theme-blocks-topColumn{
    flex:1 1 0;
    margin-top:0 !important;
    margin-bottom:0 !important;
    display:flex;
  }
  #index .theme-blocks.col-md-4 > .theme-blocks-topColumn:first-child{
    margin-bottom:.5rem !important;
  }
  #index .theme-blocks-topColumn .block-content,
  #index .theme-blocks-topColumn .block-link{width:100%;height:100%}
  #index .theme-blocks-topColumn .block-link{display:flex !important;align-items:stretch}
  #index .theme-blocks-topColumn .block-img{height:100%;width:100%;object-fit:cover}
}