/* ==============================================================
   ApniDukan — PC / Tablet friendly layer
   The site is built mobile-first (app style: sticky top bar,
   bottom nav, horizontal scroll rows). Instead of breaking that
   proven layout, on bigger screens we center it like a real app
   inside a soft "phone frame" so it looks intentional and clean
   on a laptop/desktop monitor too, instead of stretching ugly.
   Loaded LAST on every page + uses !important so it safely wins
   over each page's own inline <style> block.
   ============================================================== */

/* Tablet and up */
@media (min-width: 641px){
  html{
    background:#e7ebf1 !important;
  }
  body{
    max-width:480px !important;
    margin:0 auto !important;
    min-height:100vh !important;
    box-shadow:0 0 60px rgba(0,0,0,.18) !important;
    position:relative !important;
  }

  /* Fixed bottom bars (nav, buy bar, chat input, footer actions)
     must stay aligned to the app frame, not the full browser width */
  .bottomNav,
  .stickyBuyBar,
  .footer,
  .inputBar{
    max-width:480px !important;
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) !important;
  }

  /* Inline-styled fixed bottom banners (e.g. compare bar) */
  div[style*="position:fixed"][style*="left:0"][style*="right:0"]{
    max-width:480px !important;
    margin:0 auto !important;
    left:0 !important; right:0 !important;
  }
}

/* Bigger desktop monitors: a touch roomier, still app-shaped */
@media (min-width: 1024px){
  body{ max-width:520px !important; }
  .bottomNav,
  .stickyBuyBar,
  .footer,
  .inputBar{ max-width:520px !important; }
}

/* ---- Universal safety rules (all screen sizes) ---- */
img{ max-width:100%; height:auto; }
table{ max-width:100%; }
* { -webkit-tap-highlight-color: transparent; }