/* ==========================================================================
   3. Applicazione ai widget Elementor standard
   Contenuto = descrizione prodotto (.elementor-widget-woocommerce-product-content)
               corpo articolo (.elementor-widget-ae-post-content)
   ========================================================================== */

/* Testo di lettura (Editor di testo, Fisarmonica/Toggle) */
:is(.single-product .elementor-widget-woocommerce-product-content, .single-post .elementor-widget-ae-post-content)
  :is(.elementor-widget-text-editor, .elementor-widget-accordion, .elementor-widget-toggle) :is(p, li, blockquote, dd) {
  font-size: var(--unid-fs-body);
  line-height: var(--unid-lh-body);
}
/* Larghezza dei paragrafi: solo negli articoli (colonna di lettura). Nelle schede
   prodotto il testo resta a tutta larghezza come titoli e box, altrimenti la
   pagina risulta sbilanciata (verificato sul Master Criminologia in staging). */

/* Titoli dentro il testo */
:is(.single-product .elementor-widget-woocommerce-product-content, .single-post .elementor-widget-ae-post-content)
  .elementor-widget-text-editor h2 { font-size: var(--unid-fs-h2); line-height: var(--unid-lh-heading); }
:is(.single-product .elementor-widget-woocommerce-product-content, .single-post .elementor-widget-ae-post-content)
  .elementor-widget-text-editor h3 { font-size: var(--unid-fs-h3); line-height: var(--unid-lh-heading); font-weight: 600; }
/* h4: il tema ha "h4 { font-size: 0.9333rem !important }" (14px). Qui serve !important,
   limitato al testo di articoli e schede, così l'H4 è sempre più grande del testo
   anche se quella regola del tema resta. */
:is(.single-product .elementor-widget-woocommerce-product-content, .single-post .elementor-widget-ae-post-content)
  .elementor-widget-text-editor h4 { font-size: var(--unid-fs-h4) !important; line-height: var(--unid-lh-heading) !important; font-weight: 700; }
/* Spazio sopra i titoli nel testo: separano meglio i paragrafi */
:is(.single-product .elementor-widget-woocommerce-product-content, .single-post .elementor-widget-ae-post-content)
  .elementor-widget-text-editor :is(h2, h3, h4) { margin-top: 1.4em; margin-bottom: .5em; }
:is(.single-product .elementor-widget-woocommerce-product-content, .single-post .elementor-widget-ae-post-content)
  .elementor-widget-text-editor > .elementor-widget-container > :is(h2, h3, h4):first-child { margin-top: 0; }

/* Titoli di sezione della scheda prodotto (widget Titolo): 22px desktop / 20px mobile.
   Sono tanti e con icona: a 26px risultano troppo pesanti. Nell'articolo il widget
   Titolo è il titolo della pagina (30px) e resta com'è. */
.single-product .elementor-widget-woocommerce-product-content .elementor-widget-heading .elementor-heading-title {
  font-size: var(--unid-fs-h3);
  line-height: var(--unid-lh-heading);
}

/* Tabelle dentro il testo (non tocca le tabelle prezzi dei plugin, es. .dc-features-table) */
:is(.single-product .elementor-widget-woocommerce-product-content, .single-post .elementor-widget-ae-post-content)
  .elementor-widget-text-editor table :is(td, th) {
  font-size: var(--unid-fs-table);
  line-height: 1.5;
}
:is(.single-product .elementor-widget-woocommerce-product-content, .single-post .elementor-widget-ae-post-content)
  .elementor-widget-text-editor table th { font-weight: 700; }
/* Mobile: la tabella scorre dentro la colonna invece di allargare la pagina */
@media (max-width: 767px) {
  :is(.single-product .elementor-widget-woocommerce-product-content, .single-post .elementor-widget-ae-post-content)
    .elementor-widget-text-editor table {
    display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch;
  }
}


/* ==========================================================================
   4. Pagine prodotto in HTML + CSS: grandezze centralizzate qui
   --------------------------------------------------------------------------
   Il CSS delle singole pagine NON va modificato. Queste regole cambiano solo
   il font-size (e l'interlinea dei paragrafi) delle classi delle pagine HTML;
   bordi, box, badge, colori e FAQ restano quelli del CSS della pagina.
   Il prefisso body.single-product dà la priorità senza !important.
   Tutte le pagine che usano le stesse classi si adeguano da sole.
   Per un nuovo prefisso di classi (es. .unidp-xxx-) aggiungere qui le righe
   seguendo la tabella dei ruoli nel LEGGIMI.
   ========================================================================== */

