/* =========================================================================
   Nelb WC Macchedil Pack — Mobile compatto (1.45.0)
   Solo ≤767px, desktop invariato. Su mobile le pagine erano lunghe e "grandi":
   tipografia globale del kit Elementor, spaziature dei contenitori, testata
   categoria, breadcrumb, griglie prodotto e scheda prodotto.
   - Agisce sulle variabili globali del kit (--e-global-typography-*), non sui
     singoli elementi: `body[class*="elementor-kit-"]` (0,1,1) vince su
     `.elementor-kit-NNN` (0,1,0) senza dipendere dall'ordine dei file.
   - I contenitori "atomici" di Elementor V4 hanno il padding diretto, quelli
     classici via variabili (--padding-*): dove serve si impostano entrambi, con
     !important perché le regole per elemento di Elementor sono più specifiche.
   - Nota brandbook: H1 24px / H2 19px su mobile (GUIDA-STILI: 28 / 22).
   - 1.46.0: le regole sulle classi del Pack hanno il prefisso `body`: con il CSS
     asincrono di LiteSpeed l'ordine di caricamento non è garantito.
   Disattivabile: add_filter( 'nelb_wcmp_mobile_compact', '__return_false' ).
   ========================================================================= */
@media (max-width:767px){
  /* 1 · tipografia globale del kit Elementor */
  body[class*="elementor-kit-"]{
    --e-global-typography-primary-font-size:24px;
    --e-global-typography-secondary-font-size:19px;
    --e-global-typography-text-line-height:1.5em;
    --e-global-typography-accent-line-height:1.5em;
    --e-global-typography-mact001-font-size:26px;
    --e-global-typography-mact002-font-size:17px;
    --e-global-typography-mact003-font-size:15px;
  }
  .elementor .mac-titolo-hero{font-size:26px}
  /* 1.45.1: H1 con dimensione fissa nei template (categorie Nolopoint 28px, prodotti a noleggio 26px) */
  body.tax-product_cat h1{font-size:var(--e-global-typography-primary-font-size) !important}
  body.single-product h1:not(.nelb-pdp-title__h){font-size:20px !important;line-height:1.2 !important}

  /* 2 · sezioni: al massimo 24px sopra/sotto */
  [data-elementor-type] > .e-con{--padding-top:min(var(--padding-top,24px),24px);--padding-bottom:min(var(--padding-bottom,24px),24px)}

  /* 3 · breadcrumb: una riga sola, poco spazio sopra e sotto */
  /* (le regole Elementor sui singoli contenitori sono più specifiche: serve !important sulle variabili) */
  .e-con:has(> .elementor-widget-nelb_breadcrumb),
  .e-con:has(> .e-con > .elementor-widget-nelb_breadcrumb){--padding-top:6px !important;--padding-bottom:6px !important;padding-top:6px !important;padding-bottom:6px !important}
  /* solo ultimo livello + pagina corrente, su una riga: "Betoniere / Betoniera IMER Minibeta 130" */
  body .nelb-crumb{flex-wrap:nowrap !important;overflow:hidden;font-size:12px !important;min-width:0}
  body .nelb-crumb > :not(:nth-last-child(-n+3)){display:none !important}
  body .nelb-crumb > a{flex:0 0 auto;white-space:nowrap}
  body .nelb-crumb .is-current{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

  /* 4 · griglie prodotti: card più larghe (un solo margine laterale), gap 8px, pulsante su una riga */
  .e-con:has(> .elementor-widget-nelb_product_grid){--padding-left:0px !important;--padding-right:0px !important;padding-left:0 !important;padding-right:0 !important}
  body .nelb-pg-grid{column-gap:8px !important;row-gap:8px !important}
  .elementor .nelb-pg-title{font-size:13px !important;line-height:1.35}
  body .nelb-pg-card .add_to_cart_button, .nelb-pg-card .button{font-size:12.5px !important;letter-spacing:0 !important;padding:11px 8px !important;white-space:nowrap;width:100%;text-align:center;line-height:1.1 !important;min-height:0 !important}

  /* 5 · testata categoria: occhiello, barretta e titolo vicini; descrizione 2 righe + "Leggi tutto" */
  body.tax-product_cat .e-con:has(> h1){gap:8px}
  body.tax-product_cat .e-con:has(> h1) > .elementor-widget-divider{--divider-element-spacing:0px;margin:0 !important}
  body.tax-product_cat .e-con:has(> h1) > .elementor-widget-divider .elementor-divider{padding:2px 0 !important}
  body.tax-product_cat h1 ~ .mac-paragrafo.nelb-clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  body .elementor button.nelb-more, button.nelb-more{appearance:none;background:transparent !important;border:0 !important;box-shadow:none !important;padding:2px 0 0 !important;width:auto !important;min-height:0 !important;font:800 12px/1.2 'Libre Franklin',sans-serif !important;letter-spacing:.06em;text-transform:uppercase;color:#FE3F12 !important;cursor:pointer;text-align:left}

  /* 6 · pagina prodotto: foto a tutta larghezza, miniature piccole sotto, titolo 18px, riquadri compatti */
  /* contenitori annidati attorno alla galleria: margini laterali solo sul primo livello (12px) */
  /* (i contenitori "atomici" di Elementor V4 hanno il padding diretto, quelli classici via variabili: si impostano entrambi) */
  [data-elementor-type] > .e-con:has(.elementor-widget-nelb_pdp_gallery){--padding-left:12px !important;--padding-right:12px !important;padding-left:12px !important;padding-right:12px !important}
  [data-elementor-type] > .e-con .e-con:has(.elementor-widget-nelb_pdp_gallery){--padding-left:0px !important;--padding-right:0px !important;padding-left:0 !important;padding-right:0 !important;--gap:12px !important;--row-gap:12px !important;gap:12px !important}
  body .nelb-pdp-gallery__main{aspect-ratio:4/3;background:#fff}
  body .nelb-pdp-gallery{--nelb-pdp-thumb:52px !important} /* la variabile arriva anche in linea dal widget */
  body .nelb-pdp-gallery__thumbs{flex-wrap:nowrap;overflow-x:auto;gap:8px;margin-top:8px;scrollbar-width:none}
  body .nelb-pdp-gallery__thumbs::-webkit-scrollbar{display:none}
  body .nelb-pdp-gallery .nelb-pdp-gallery__thumb{flex:0 0 auto}
  .e-con:has(> .elementor-widget-nelb_pdp_title){--padding-top:16px !important;--padding-bottom:16px !important;--padding-left:16px !important;--padding-right:16px !important;padding:16px !important;gap:10px !important}
  .elementor .nelb-pdp-title .nelb-pdp-title__h{font-size:18px !important;line-height:1.2}
  body .nelb-pdp-hl{grid-template-columns:repeat(3,1fr) !important;gap:6px}
  body .nelb-pdp-hl__box{padding:6px 4px;border-radius:8px}
  body .nelb-pdp-hl__box b{font-size:13px;line-height:1.2}
  body .nelb-pdp-hl__box small{font-size:9px;letter-spacing:.03em;line-height:1.2}
  body .nelb-pdp-buybox{margin-bottom:14px}
}

/* 1.49.0 · Banner Cookiebot compatto (≤767): 436 → 233px a 390px, pulsanti affiancati.
   Su mobile il testo del banner era l'elemento più grande della prima schermata
   (LCP della home per chi arriva la prima volta). Testi e pulsanti invariati.
   Solo la prima schermata (.CybotEdge): la vista "Dettagli" resta quella di Cookiebot. */
@media (max-width:767px){
body #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogHeader{padding:8px 14px!important}
body #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogPoweredbyCybot svg{height:18px!important;width:auto!important}
body #CybotCookiebotDialog.CybotEdge .CybotCookiebotScrollContainer{padding:0!important;min-height:0!important}
body #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyContent{padding:10px 14px 0!important}
body #CybotCookiebotDialog.CybotEdge .CybotCookiebotFader{display:none!important}
body #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyContentTitle{font-size:14px!important;margin:0 0 4px!important;line-height:1.3!important}
body #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyContentText{font-size:13px!important;line-height:1.4!important}
body #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyEdgeMoreDetails{margin:6px 14px 2px 0!important}
body #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyEdgeMoreDetailsLink{font-size:13px!important}
body #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogFooter .CybotCookiebotScrollArea{padding:8px 14px 12px!important}
body #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyButtonsWrapper{flex-direction:row!important;gap:8px!important}
body #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyButtonsWrapper .CybotCookiebotDialogBodyButton{flex:1 1 0!important;margin:0!important;padding:11px 6px!important;font-size:13px!important;width:auto!important}
body #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyButtonsWrapper .CybotCookiebotDialogArrow{margin-left:6px!important}
}

/* =========================================================================
   1.52.0 · Revisione mobile di tutte le pagine (audit 13/10/2026, 23 pagine a 390px)
   ========================================================================= */

/* Testi atomici (Elementor V4) con larghezza fissa: su tablet e mobile non devono
   uscire dal contenitore. In "Chi siamo" un paragrafo largo 1000px allargava la
   pagina a 695px e il telefono la rimpiccioliva tutta. */
@media (max-width:1024px){
  body .e-paragraph-base,body .e-heading-base{max-width:100%}
}

@media (max-width:767px){
  /* Tabelle nei testi (Cookie Policy: 5 colonne larghe 610–660px): scorrono
     dentro il loro riquadro invece di allargare la pagina. */
  body .elementor-widget-text-editor table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  body .elementor-widget-text-editor table th,body .elementor-widget-text-editor table td{min-width:110px}

  /* Margini laterali uniformi ~20px (prima fino a 60–114px: testo in colonna stretta).
     a) vecchie sezioni Elementor (Pagamento, Tempistiche, Privacy): 50px + 10px colonna */
  body .elementor-section.elementor-top-section{padding-left:10px!important;padding-right:10px!important;padding-top:24px!important;padding-bottom:24px!important}
  /* b) pagine legali con tre livelli annidati (Condizioni, Cookie Policy) */
  body.page-id-179 .e-con .e-con,body.page-id-156364 .e-con .e-con{--padding-left:0px!important;--padding-right:0px!important;padding-left:0!important;padding-right:0!important}
  body.page-id-179 .elementor-widget-text-editor,body.page-id-156364 .elementor-widget-text-editor,body.page-id-179 .elementor-widget-heading,body.page-id-156364 .elementor-widget-heading{padding-left:0!important;padding-right:0!important;margin-left:0!important;margin-right:0!important}
  body.page-id-179 .e-con.e-parent,body.page-id-156364 .e-con.e-parent{--padding-left:20px!important;--padding-right:20px!important;padding-left:20px!important;padding-right:20px!important}
  /* c) articolo del blog (template): 50px + 10px */
  body .elementor-element-0e29f24{--padding-left:10px!important;--padding-right:10px!important;padding-left:10px!important;padding-right:10px!important}

  /* Articolo: riquadro dell'immagine in evidenza alto 338px anche con un'immagine
     da 180px (e vuoto negli articoli senza immagine). */
  body .elementor-element-56c83cb{min-height:0!important;--min-height:0px!important;padding:16px 20px 0!important;--padding-top:16px!important;--padding-bottom:0px!important}
  body .elementor-element-56c83cb:not(:has(img)){display:none!important}
  body .elementor-element-56c83cb img{border-radius:14px}

  /* Titolo attaccato all'header: Blog, Condizioni, Configuratore linea vita */
  body.blog h1,body.page-id-179 h1,body.page-id-185344 h1{margin-top:20px!important}

  /* Modalità di pagamento: illustrazioni (banca, carta) larghe quanto lo schermo */
  body.page-id-224 .e-lottie__container{max-width:160px!important;margin:0 auto!important}

  /* Ricerca del blog a tutta larghezza (era al 50%: 170px) */
  body .nelb-bf .nelb-bf-search{max-width:100%!important;width:100%!important}
}