/* mobile-product-fix 2026-07-08 v3 — mobillayout produktsidor (alla templates).
   ANGRA: ta bort denna fil + den markta enqueue-raden i functions.php.
   Backuper: /root/cssfix-backup-2026-07-08/
   div-prefix pa selektorerna = vinner over pluginets styles.css oavsett laddningsordning. */
@media (max-width: 991px) {

  /* 1) Toppgap + bild-under-header: pluginets .productDetails{margin-top:120px}
        (styles.css:12137) margin-collapsar genom .container -> hela sidan inkl
        absoluta headern skjuts ner och bilden hamnar bakom menyn.
        Padding collapsar inte -> headern stannar pa y=0. */
  div.productDetails {
    margin-top: 0;
    padding-top: 100px;
  }

  /* 2) Sidopadding: templaten har 0 sidopadding under 992px -> titel/pris/knapp
        kant-i-kant. 20px = samma som sajtens ovriga mobilmall. */
  div.productDetails .productSummary {
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
  }
  div.productDetails .productThumbnail {
    padding-left: 20px;
    box-sizing: border-box;
  }
  div.productTabs {
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
  }

  /* 3) Ingen inre scroll i produktinfon: pluginet satter max-height:410px +
        overflow:auto pa .productSummary for ALLT under 1500px (styles.css ~12744)
        -> tartor med manga val far en div man maste swipa i. Pa mobil ska sidan
        scrolla, inte diven. */
  div.productDetails .productSummary {
    max-height: none;
    overflow: visible;
  }
}

/* v4: tart-templaten (sidor wrappade i #main-content.page) har REDAN egen
   toppmarginal (100px) och sidopadding (20px via yttre .container) -> mina
   tillagg ovan dubblade dem dar. Nollstall inom den templaten sa spacingen
   blir identisk med vanliga produktsidor. Vanliga varor saknar #main-content. */
@media (max-width: 991px) {
  #main-content.page div.productDetails { padding-top: 0; }
  #main-content.page div.productDetails .productSummary { padding-left: 0; padding-right: 0; }
  #main-content.page div.productDetails .productThumbnail { padding-left: 0; }
  #main-content.page div.productTabs { padding-left: 0; padding-right: 0; }
}
