/**
 * SilviSabinaSapori — Rifiniture Mobile & Tablet
 * ------------------------------------------------------------
 * Caricato DOPO la responsive.css del framework, la completa.
 * Tutte le regole sono racchiuse in media query: su desktop non cambiano nulla.
 */

/* ---- Sicurezze globali (valgono ovunque ma innocue su desktop) ---- */
img, video, iframe, embed, object { max-width: 100%; }
img { height: auto; }

/* =====================================================================
   TABLET  (fino a 1024px)
   ===================================================================== */
@media only screen and (max-width: 1024px) {

  /* Contenitori a larghezza fissa → fluidi */
  .container,
  .row,
  .spb_row,
  .spb_content_element,
  .page-content,
  .post-content { max-width: 100% !important; }

  /* Griglia prodotti WooCommerce: 3 per riga su tablet */
  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product {
    width: 30.5% !important;
    margin: 0 4% 4% 0 !important;
  }
  .woocommerce ul.products li.product:nth-child(3n),
  .woocommerce-page ul.products li.product:nth-child(3n) { margin-right: 0 !important; }
  .woocommerce ul.products li.product:nth-child(4n),
  .woocommerce-page ul.products li.product:nth-child(4n) { clear: none !important; }
}

/* =====================================================================
   SMARTPHONE  (fino a 767px)
   ===================================================================== */
@media only screen and (max-width: 767px) {

  /* Nessuno scroll orizzontale */
  html, body { overflow-x: hidden; max-width: 100%; }

  /* Le colonne del page builder e della griglia vanno a piena larghezza */
  .one-half, .one-third, .two-third, .one-fourth, .three-fourth,
  .one-fifth, .two-fifth, .three-fifth, .four-fifth, .one-sixth,
  .column, [class*="col-sm-"], [class*="col-md-"],
  .spb_column, .sf-column {
    width: 100% !important;
    float: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    clear: both !important;
  }

  /* Padding laterale coerente per non incollare i testi ai bordi */
  .container, .page-content, .post-content,
  .spb_content_element, .spb_text_column {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  /* Testo leggibile: niente caratteri minuscoli */
  body { font-size: 16px; line-height: 1.6; }
  h1 { font-size: 30px !important; line-height: 1.15 !important; }
  h2 { font-size: 25px !important; line-height: 1.2 !important; }
  h3 { font-size: 21px !important; }
  h1, h2, h3, h4 { word-wrap: break-word; overflow-wrap: break-word; }

  /* Tabelle (anche prezzi/WooCommerce): scorrono senza rompere il layout */
  .entry-content table,
  .post-content table,
  .woocommerce table.shop_table,
  .woocommerce-cart table.cart,
  table.tablepress {
    display: block;
    width: 100% !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* Tap target comodi: menu mobile, bottoni, link del menu */
  .mobile-menu-link,
  .mobile-menu a,
  .sf-menu a,
  .btn, .button, button,
  .woocommerce a.button,
  .woocommerce button.button,
  input[type="submit"] {
    min-height: 46px;
    line-height: 1.3;
    display: inline-flex;
    align-items: center;
  }
  .mobile-menu-link, .mobile-menu a { padding-top: 12px !important; padding-bottom: 12px !important; }

  /* Campi form comodi da toccare, senza zoom automatico iOS (font >= 16px) */
  input, select, textarea { font-size: 16px !important; max-width: 100%; }
  input[type="text"], input[type="email"], input[type="tel"],
  input[type="search"], input[type="password"], select, textarea {
    min-height: 46px; width: 100%;
  }

  /* Shop: 2 prodotti per riga su smartphone */
  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product {
    width: 48% !important;
    margin: 0 4% 4% 0 !important;
  }
  .woocommerce ul.products li.product:nth-child(2n),
  .woocommerce-page ul.products li.product:nth-child(2n) { margin-right: 0 !important; }
  .woocommerce ul.products li.product:nth-child(3n),
  .woocommerce-page ul.products li.product:nth-child(3n) { clear: none !important; }
  .woocommerce ul.products li.product:nth-child(2n+1),
  .woocommerce-page ul.products li.product:nth-child(2n+1) { clear: both !important; }

  /* Carrello/checkout: bottoni a piena larghezza, più facili */
  .woocommerce #respond input#submit,
  .woocommerce a.button, .woocommerce button.button,
  .woocommerce .checkout button.button {
    width: 100%; justify-content: center; text-align: center;
  }
  .woocommerce-cart .wc-proceed-to-checkout a.checkout-button { width: 100%; }

  /* Immagini di sfondo "parallax" spesso pesano/saltano su mobile: le fissiamo */
  .spb_row.parallax, .row-parallax, [data-parallax] { background-attachment: scroll !important; }

  /* Slider/hero: altezze desktop troppo grandi → più contenute */
  .page-heading, .banner, .hero, .fullwidth-slider { min-height: 0 !important; }
}

/* =====================================================================
   SMARTPHONE PICCOLI  (fino a 480px)
   ===================================================================== */
@media only screen and (max-width: 480px) {
  /* Shop: 1 prodotto per riga sui telefoni più stretti */
  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product {
    width: 100% !important;
    margin: 0 0 22px 0 !important;
  }
  h1 { font-size: 26px !important; }
}
