/* Shivshahi Network — final small-screen containment shared by every page. */
:root{--sn-mobile-height:100dvh}
html{
  width:100%;max-width:100%;min-width:0;
  overflow-x:hidden;
  -webkit-text-size-adjust:100%;text-size-adjust:100%;
}
body{
  width:100%;max-width:100%;min-width:0;
  overflow-x:hidden;
}
*,*::before,*::after{box-sizing:border-box}
img,video,canvas,svg,iframe{max-width:100%}
input,select,textarea,button{min-width:0;max-width:100%}
.phone,.app,.app-shell,.shell,.screen,.page,.page-wrap,.wrapper,.container,.content,.scroll-content{
  min-width:0;max-width:100%;
}

@media(max-width:430px){
  html,body{height:100%;min-height:100%;margin:0!important;padding:0!important}
  .phone{
    position:fixed!important;inset:0!important;
    width:100%!important;max-width:100%!important;
    height:var(--sn-mobile-height)!important;
    min-height:var(--sn-mobile-height)!important;
    max-height:var(--sn-mobile-height)!important;
    margin:0!important;border:0!important;border-radius:0!important;
    transform:none!important;overflow:hidden!important;box-shadow:none!important;
  }
  #appScreen,#adminScreen,#shopScreen,#socialScreen,#leaderboardScreen,
  #myOrdersScreen,#orderDetailScreen,#cartScreen,#yojanaScreen,
  #ladakiPaithaniPlanScreen,#referScreen,#faqScreen,#aboutScreen,
  #loginScreen,#registerScreen,#forgotScreen{
    width:100%!important;max-width:100%!important;
    height:100%!important;max-height:100%!important;min-height:0!important;
    margin:0!important;box-sizing:border-box!important;
  }
  .scroll-content,.shop-products-scroll,.sn-scroll,.lbp-scroll,
  #myOrdersList,#orderDetailBody{
    min-width:0!important;min-height:0!important;max-width:100%!important;
    overscroll-behavior-y:contain;
    -webkit-overflow-scrolling:touch;
  }
  .header,.admin-header,.shop-main-header,.sn-topbar,.topbar{
    width:100%!important;max-width:100%!important;min-width:0!important;
    padding-left:clamp(7px,3vw,14px)!important;
    padding-right:clamp(7px,3vw,14px)!important;
    box-sizing:border-box!important;
  }
  .navbar{
    width:100%!important;max-width:100%!important;min-width:0!important;
    padding-left:4px!important;padding-right:4px!important;
    box-sizing:border-box!important;overflow:visible!important;
  }
  .navbar>.nav-item,.navbar>.nav-center-wrap{
    flex:1 1 20%!important;min-width:0!important;max-width:20%!important;
    padding-left:2px!important;padding-right:2px!important;
  }
  .navbar .nav-item span,.navbar .nav-center-wrap>span{
    display:block!important;max-width:100%!important;
    overflow:hidden!important;text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:clamp(7px,2.35vw,10px)!important;
  }
  .modal-content,.login-card,.addr-modal-box,.shopPhotoPickerPanel{
    max-width:calc(100vw - 18px)!important;
  }
  .quick-grid,.features-grid,.team-grid,.shop-grid{max-width:100%!important;min-width:0!important}
}

/* Generated bill: keep its toolbar below the notch/status bar and always show the top. */
#orderBillModal{
  box-sizing:border-box!important;
  padding-top:max(8px,env(safe-area-inset-top,0px))!important;
  padding-left:env(safe-area-inset-left,0px)!important;
  padding-right:env(safe-area-inset-right,0px)!important;
  overscroll-behavior:contain!important;
}
#orderBillModal>div{
  width:100%!important;
  max-width:430px!important;
  max-height:calc(100dvh - env(safe-area-inset-top,0px) - 8px)!important;
  min-height:0!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  scroll-behavior:auto!important;
}
.order-bill-mobile-toolbar{
  position:sticky;top:0;z-index:8;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  min-height:46px;padding:8px 12px;
  color:#f5d78e;background:linear-gradient(135deg,#2d1660,#3a1a6b,#4d2480);
  border-bottom:1px solid rgba(201,168,76,.55);
  font:800 13px/1.2 'Noto Sans Devanagari','Poppins',sans-serif;
  box-shadow:0 3px 12px rgba(16,6,31,.2);
}
.order-bill-mobile-toolbar button{
  width:32px;height:32px;min-width:32px;border:1px solid rgba(245,215,142,.45);
  border-radius:50%;background:rgba(255,255,255,.1);color:#fff;
  font-size:14px;font-weight:900;cursor:pointer;
}
#orderBillPrintArea{scroll-margin-top:46px}

@media(max-width:360px){
  .header,.admin-header,.shop-main-header,.sn-topbar,.topbar{
    gap:5px!important;padding-left:7px!important;padding-right:7px!important;
  }
  .logo-name{font-size:clamp(13px,4.8vw,17px)!important;letter-spacing:1px!important}
  .logo-sub{font-size:7px!important;letter-spacing:1.5px!important}
  .navbar{min-height:58px!important}
  .navbar .nav-item i{font-size:15px!important}
  .navbar .nav-center-coin{width:50px!important;height:50px!important;max-width:50px!important}
  .navbar .nav-item span,.navbar .nav-center-wrap>span{font-size:7.5px!important}
  .auth-screen{padding-left:12px!important;padding-right:12px!important}
  .login-card{padding-left:14px!important;padding-right:14px!important}
}

@media(max-width:320px){
  .navbar{padding-left:1px!important;padding-right:1px!important}
  .navbar>.nav-item,.navbar>.nav-center-wrap{padding-left:0!important;padding-right:0!important}
  .navbar .nav-item span,.navbar .nav-center-wrap>span{font-size:7px!important;letter-spacing:0!important}
  .navbar .nav-center-coin{width:46px!important;height:46px!important;max-width:46px!important}
  .header,.admin-header,.shop-main-header,.sn-topbar,.topbar{padding-left:5px!important;padding-right:5px!important}
}

@media(max-width:430px) and (max-height:650px){
  .header,.admin-header,.shop-main-header,.sn-topbar,.topbar{padding-bottom:7px!important}
  .navbar{min-height:54px!important}
  .navbar .nav-center-coin{width:46px!important;height:46px!important;max-width:46px!important}
}

@media(max-width:930px) and (orientation:landscape){
  .phone{width:100%!important;max-width:100%!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important}
}
