/*
Theme Name: Dropship Fullscreen Mobile
Author: Dropship
Description: Tampilan aplikasi Dropship selebar HP pada ponsel maupun laptop.
Version: 1.0.2
License: GPL-2.0-or-later
Text Domain: dropship-fullscreen
*/
:root{--ds-bg:#eef2f8;--ds-ink:#10264d}
*{box-sizing:border-box}
html,body{margin:0!important;padding:0;min-height:100%;background:var(--ds-bg)}
body{color:var(--ds-ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;overflow-x:hidden}
img{max-width:100%;height:auto}
.site,.site-content,.content-area,.site-main,.entry-content,.wp-site-blocks{width:100%;max-width:none;margin:0;padding:0}
body.dma-app-page header,body.dma-app-page footer,body.dma-app-page .site-header,body.dma-app-page .site-footer,body.dma-app-page .wp-block-template-part,body.dma-app-page .entry-header,body.dma-app-page .page-header,body.dma-app-page .page-title,body.dma-app-page .entry-title,body.dma-app-page .wp-block-post-title,body.dma-app-page .breadcrumbs,body.dma-app-page .breadcrumb,body.dma-app-page .sidebar,body.dma-app-page #secondary{display:none!important}
/* Desktop: batasi seluruh halaman aplikasi, termasuk banner, ke lebar perangkat HP. */
@media(min-width:600px){
 body{background:#e9eef6}
 body #main,body main.site-main,body .site-main,body .entry-content,body .wp-site-blocks{
   width:100%!important;max-width:430px!important;min-height:100vh;margin-left:auto!important;margin-right:auto!important;
   padding:0!important;background:#fff;box-shadow:0 0 30px rgba(16,38,77,.10)
 }
 body #main{overflow:hidden}
 body #main img{max-width:100%;height:auto}
}
/* Mobile: aplikasi memenuhi lebar layar. */
@media(max-width:599px){
 html,body{width:100%;background:#fff}
 body #main,body main.site-main,body .site-main,body .entry-content,body .wp-site-blocks{
   width:100%!important;max-width:100%!important;min-height:100vh;margin:0!important;padding:0!important;background:#fff;box-shadow:none
 }
}
/* Halaman plugin memakai ruang layar penuh tanpa padding tema tambahan. */
body.dma-app-page #main,body.dma-app-page main,body.dma-app-page .site-main,body.dma-app-page .entry-content{
 width:100%!important;margin:0 auto!important;padding:0!important
}
@media(min-width:600px){
 body.dma-app-page #main,body.dma-app-page main,body.dma-app-page .site-main,body.dma-app-page .entry-content{max-width:430px!important}
}


/* Desktop centering fix for the Dropship app: let the page wrapper span
   the viewport, then center only the phone-width application itself. */
@media(min-width:600px){
 body.dma-app-page,
 body.dma-app-page #page,
 body.dma-app-page .site,
 body.dma-app-page #content,
 body.dma-app-page .site-content,
 body.dma-app-page .content-area,
 body.dma-app-page #main,
 body.dma-app-page main,
 body.dma-app-page .site-main,
 body.dma-app-page .entry-content,
 body.dma-app-page .wp-site-blocks{
   width:100%!important;
   max-width:none!important;
   margin-left:0!important;
   margin-right:0!important;
   padding-left:0!important;
   padding-right:0!important;
   transform:none!important;
 }
 body.dma-app-page #main,
 body.dma-app-page main,
 body.dma-app-page .site-main,
 body.dma-app-page .entry-content{
   width:100vw!important;
   max-width:100vw!important;
   margin-left:calc(50% - 50vw)!important;
   margin-right:0!important;
 }
 body.dma-app-page .dma-app{
   display:block!important;
   width:min(430px,100%)!important;
   max-width:430px!important;
   margin:14px auto 100px!important;
   left:auto!important;
   right:auto!important;
   transform:none!important;
 }
}


/* v1.0.4: desktop app centering - remove the narrow/clipping theme shell */
@media(min-width:600px){
  html,body{width:100%!important;max-width:none!important;overflow-x:hidden!important}
  body.dma-app-page #page,
  body.dma-app-page .site,
  body.dma-app-page #content,
  body.dma-app-page .site-content,
  body.dma-app-page .content-area,
  body.dma-app-page #main,
  body.dma-app-page main,
  body.dma-app-page .site-main,
  body.dma-app-page .entry-content,
  body.dma-app-page .wp-site-blocks{
    box-sizing:border-box!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:0!important;
    padding-right:0!important;
    overflow:visible!important;
    transform:none!important;
    float:none!important;
  }
  body.dma-app-page #main,
  body.dma-app-page main,
  body.dma-app-page .site-main,
  body.dma-app-page .entry-content{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:0!important;
  }
  body.dma-app-page .dma-app{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    display:block!important;
    float:none!important;
    width:400px!important;
    max-width:400px!important;
    margin:14px auto 110px!important;
    transform:none!important;
  }
  body.dma-app-page .dma-bottom-nav{
    position:fixed!important;
    left:50%!important;
    right:auto!important;
    width:min(400px,100vw)!important;
    transform:translateX(-50%)!important;
  }
}
