/* Italpark — MEGA MENU "indice + vetrina" (due colonne). Child theme. NIENTE PILLOLE. */

/* ---- barra menu su una riga sola, full-width ---- */
@media (min-width:1200px){
  .header-bottom__row{flex-wrap:wrap;align-items:center;}
  .header-bottom__row .ps-mainmenu--desktop{flex:0 0 100% !important;max-width:100% !important;order:5;margin-top:.55rem;}
  .header-bottom .ps-searchbar{max-width:300px;margin-left:auto;}
  .ps-mainmenu__desktop .ps-mainmenu__tree{justify-content:center;gap:.1rem;border-top:1px solid #ece9e3;padding-top:.35rem;flex-wrap:nowrap;}
  .ps-mainmenu__desktop .ps-mainmenu__tree-link{padding-left:.85rem !important;padding-right:.85rem !important;font-size:.96rem;font-weight:600;color:#2D4F1D;text-transform:uppercase;letter-spacing:.035em;position:relative;transition:color .25s ease;}
  .ps-mainmenu__desktop .ps-mainmenu__tree-link:hover{color:#9a7b3f;}
  /* "Cicciottezza" uniforme: in home il menu è bianco su hero scuro (sembra più pieno),
     nelle altre pagine è verde su bianco e lo STESSO peso (500 imposto da immersive.css)
     appare più sottile. Solo su non-home alzo il peso per pareggiare la resa percepita,
     mantenendo la stessa dimensione. Specificità+!important per battere immersive.css. */
  /* ESCLUSA la Storia (cms-id-4): ha la hero immersiva bianca su scuro come la home → peso 500 */
  body:not(.page-index):not(.cms-id-4) .header .ps-mainmenu--desktop .ps-mainmenu__tree-link,
  body:not(.page-index):not(.cms-id-4) .ps-mainmenu__desktop .ps-mainmenu__tree-link{font-weight:700 !important;}
  /* niente freccia/tendina NATIVA PrestaShop sulle famiglie mega: apriamo noi il pannello.
     La tendina nativa Hummingbird è .js-sub-menu.submenu (id submenu-category-N), NON .ps-mainmenu__tree-dropdown. */
  .ps-mainmenu__desktop .ps-mainmenu__tree-item.itlp-has-mega .ps-mainmenu__tree-dropdown-toggle{display:none !important;}
  .ps-mainmenu__desktop .ps-mainmenu__tree-item.itlp-has-mega .submenu,
  .ps-mainmenu__desktop .ps-mainmenu__tree-item.itlp-has-mega .js-sub-menu{display:none !important;}
  /* underline accent su TUTTE le voci — position:absolute = non altera l'altezza del link → allineamento uniforme cat/CMS */
  .ps-mainmenu__desktop .ps-mainmenu__tree-item > .ps-mainmenu__tree-item-wrapper .ps-mainmenu__tree-link::after{
    content:"";position:absolute;left:.85rem;right:.85rem;bottom:9px;height:2px;width:0;margin:0 auto;background:#9a7b3f;transition:width .3s ease;}
  .ps-mainmenu__desktop .ps-mainmenu__tree-item:hover > .ps-mainmenu__tree-item-wrapper .ps-mainmenu__tree-link::after,
  .ps-mainmenu__desktop .ps-mainmenu__tree-item.itlp-active > .ps-mainmenu__tree-item-wrapper .ps-mainmenu__tree-link::after{width:calc(100% - 1.7rem);}
}

/* ---- pannello: tendina compatta sotto la voce ---- */
.itlp-mega-panel{
  position:absolute;z-index:1200;width:720px;max-width:calc(100vw - 32px);
  /* vetro scuro: fallback rgba opaco (leggibile anche senza backdrop-filter) + blur dove supportato */
  background:rgba(16,20,14,.80);
  -webkit-backdrop-filter:blur(16px) saturate(1.08);
  backdrop-filter:blur(16px) saturate(1.08);
  border:1px solid rgba(255,255,255,.10);border-top:3px solid #9a7b3f;
  box-shadow:0 28px 70px -20px rgba(0,0,0,.60);
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .2s ease,transform .22s cubic-bezier(.16,.84,.24,1),visibility 0s .22s;
}
/* se il browser supporta backdrop-filter, alleggerisco il fondo per far "respirare" il blur */
@supports ((-webkit-backdrop-filter:blur(2px)) or (backdrop-filter:blur(2px))){
  .itlp-mega-panel{background:rgba(16,20,14,.72);}
}
.itlp-mega-panel.open{opacity:1;visibility:visible;transform:translateY(0);transition:opacity .2s ease,transform .22s cubic-bezier(.16,.84,.24,1);}

.itlp-mega-box{display:grid;grid-template-columns:minmax(210px,34%) 1fr;}

/* ---- colonna sinistra: indice ---- */
.itlp-mega-list{padding:1.1rem 0 1rem;border-right:1px solid rgba(255,255,255,.10);background:transparent;}
.itlp-mega-fam{
  display:flex;align-items:center;justify-content:space-between;gap:.4rem;
  padding:.1rem 1.3rem .75rem;margin-bottom:.5rem;border-bottom:1px solid rgba(255,255,255,.14);
  font-family:'Cormorant',Georgia,serif;font-size:1.22rem;font-weight:600;line-height:1.1;
  letter-spacing:.02em;color:#f3efe6;text-decoration:none;
}
.itlp-mega-fam:hover{color:#e8c36b;}
.itlp-mega-fam .itlp-mega-arrow{font-size:.95rem;opacity:.7;transition:transform .25s ease;}
.itlp-mega-fam:hover .itlp-mega-arrow{transform:translateX(3px);}
.itlp-mega-list ul{list-style:none;margin:0;padding:0;}
.itlp-mega-link{
  display:flex;align-items:center;justify-content:space-between;gap:.5rem;
  padding:.5rem 1.3rem;border-left:2px solid transparent;
  font-family:'Poppins',system-ui,sans-serif;font-size:.9rem;font-weight:400;
  color:#d8d3c7;text-decoration:none;transition:background .18s,color .18s,border-color .18s;
}
.itlp-mega-link .itlp-chev{opacity:0;transform:translateX(-4px);transition:opacity .18s,transform .18s;color:#e8c36b;font-size:1.05rem;}
.itlp-mega-link:hover,.itlp-mega-link.active{background:rgba(255,255,255,.09);color:#ffffff;border-left-color:#9a7b3f;}
.itlp-mega-link.active{font-weight:500;}
.itlp-mega-link:hover .itlp-chev,.itlp-mega-link.active .itlp-chev{opacity:1;transform:translateX(0);}

/* ---- colonna destra: vetrina ---- */
.itlp-mega-preview{display:flex;flex-direction:column;text-decoration:none;color:inherit;padding:1.1rem 1.3rem 1.2rem;min-height:300px;}
.itlp-mega-pimg{
  display:block;height:200px;border-radius:6px;overflow:hidden;
  background-size:cover;background-position:center top;background-color:#2a2e26;
  box-shadow:0 10px 28px -10px rgba(0,0,0,.55);
}
.itlp-mega-pimg.itlp-fade{animation:itlpImgIn .45s ease both;}
@keyframes itlpImgIn{from{opacity:.25;transform:scale(1.015);}to{opacity:1;transform:scale(1);}}
.itlp-mega-ptxt{display:block;padding-top:.85rem;}
.itlp-mega-pname{
  display:block;font-family:'Cormorant',Georgia,serif;font-size:1.5rem;font-weight:600;line-height:1.12;color:#f3efe6;
}
.itlp-mega-pdesc{
  display:block;margin-top:.35rem;font-family:'Poppins',system-ui,sans-serif;
  font-size:.86rem;font-weight:300;line-height:1.5;color:#c7c2b6;
}
.itlp-mega-pcta{
  display:inline-block;margin-top:.7rem;font-family:'Poppins',system-ui,sans-serif;
  font-size:.74rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:#e8c36b;
}
.itlp-mega-pcta::after{content:"";display:block;width:0;height:1px;background:#9a7b3f;margin-top:.28rem;transition:width .3s ease;}
.itlp-mega-preview:hover .itlp-mega-pcta::after{width:100%;}
.itlp-mega-preview:hover .itlp-mega-pname{color:#ffffff;}

/* mobile: nessun mega (resta il menu offcanvas nativo) */
@media (max-width:1199px){ .itlp-mega-panel{display:none !important;} }

/* ===== HEADER — Opzione A: logo CENTRATO protagonista + cerca a ICONA (desktop ≥1200) ===== */
@media (min-width:1200px){
  .header-bottom .header-bottom__row{position:relative !important;justify-content:center !important;}
  /* LOGO centrato e grande — justify-content:center sulla riga + margin 0 (batte Bootstrap me-auto/me-md-0) */
  .header-bottom .header-bottom__row .header-bottom__logo{margin:0 !important;justify-content:center;}
  .header-bottom .header-bottom__row .header-bottom__logo img.logo{height:82px !important;width:auto !important;max-height:none !important;}
  /* CERCA → spostata nel menu (JS) come ultima voce dopo "Contattaci".
     FIX 2026-10-09: l'input si espande FUORI FLUSSO (position:absolute, overlay verso SINISTRA della lente)
     così la voce-lente resta larga quanto la sola icona e la riga-menu (justify-content:center) NON si
     ri-centra più su hover. Prima l'input cresceva in flusso (0→190px) → layout shift ("spagina"). */
  .ps-mainmenu__desktop .ps-mainmenu__tree .itlp-search-item{display:flex;align-items:center;margin-left:.3rem;flex:0 0 auto;}
  .header-bottom .header-bottom__row #_desktop_ps_searchbar{position:relative !important;right:auto;top:auto !important;bottom:auto;margin:0 !important;z-index:30;width:auto !important;min-width:0 !important;overflow:visible;}
  .header-bottom .header-bottom__row #ps_searchbar{width:auto !important;min-width:0 !important;}
  .header-bottom .header-bottom__row #_desktop_ps_searchbar .ps-searchbar,
  .header-bottom .header-bottom__row #_desktop_ps_searchbar .ps-searchbar__form{position:relative;width:auto !important;max-width:none !important;display:inline-flex;align-items:center;}
  .header-bottom .header-bottom__row #_desktop_ps_searchbar .ps-searchbar__magnifier{color:#2D4F1D;font-size:22px !important;line-height:1 !important;padding:4px 6px;cursor:pointer;position:relative;z-index:2;}
  /* input = overlay assoluto a sinistra della lente; width 0 da chiuso = zero ingombro in flusso */
  .header-bottom .header-bottom__row #_desktop_ps_searchbar .ps-searchbar__input{
    position:absolute;right:100%;top:50%;transform:translateY(-50%);margin-right:4px;
    width:0 !important;min-width:0 !important;padding:0 !important;
    border:1px solid transparent !important;border-radius:4px;background:#fff;
    box-shadow:none !important;overflow:hidden;opacity:0;
    transition:width .35s ease,padding .35s ease,opacity .2s ease,border-color .3s ease;}
  .header-bottom .header-bottom__row #_desktop_ps_searchbar:hover .ps-searchbar__input,
  .header-bottom .header-bottom__row #_desktop_ps_searchbar:focus-within .ps-searchbar__input{
    width:230px !important;padding:8px 10px !important;opacity:1;border-color:#d8d2c7 !important;
    box-shadow:0 8px 22px -12px rgba(0,0,0,.35) !important;}
}
