/*
 * Apple90 Responsive Layer
 * Mobile-first overflow, navigation, forms, data tables and touch behavior.
 * Uses broadly supported CSS features; no browser-specific JS required.
 */
:root{--app-safe-top:env(safe-area-inset-top,0px);--app-safe-right:env(safe-area-inset-right,0px);--app-safe-bottom:env(safe-area-inset-bottom,0px);--app-safe-left:env(safe-area-inset-left,0px)}
html{width:100%;min-height:100%;-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:16px}
body{width:100%;min-width:320px;min-height:100%;margin:0;overflow-x:hidden}
*,*::before,*::after{box-sizing:border-box}
img,svg,video,canvas,iframe{max-width:100%}
img,video{height:auto}
button,input,select,textarea{max-width:100%;font:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
input,select,textarea{min-width:0}
pre,code{max-width:100%;overflow-x:auto}
table{max-width:100%}
.content-container,.page-section,.section-content,.main-content,.dashboard-content{min-width:0;max-width:100%}
.page-section{width:100%;overflow-wrap:anywhere}
.flex,.grid{min-width:0}
[class*="grid-cols-"]>*{min-width:0}
.overflow-x-auto,.table-responsive,.table-container{max-width:100%;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.table-responsive table,.table-container table{min-width:620px}
input,select,textarea{font-size:16px}
button,.btn,.action-btn,.nav-link,.nav-item{min-height:40px}
.modal,.modal-content,.dialog,.dropdown-menu{max-width:calc(100vw - 24px)}
.modal,.dialog{max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain}
.floating-btn{bottom:calc(16px + var(--app-safe-bottom))}
#userSidebar{max-width:100vw}
#userSidebar img{max-width:100%}
.content-container{overflow-wrap:anywhere}
@media(max-width:1200px){
 .content-container{padding-left:16px;padding-right:16px}
 .dashboard-grid,.stats-grid,.cards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:992px){
 body{overflow-x:hidden}
 #userSidebar{z-index:1000}
 .content-container{width:100%;max-width:100%;padding-left:14px;padding-right:14px}
 .page-section{padding-left:0;padding-right:0}
 .sidebar,.user-sidebar{max-width:min(86vw,320px)}
 .dashboard-grid,.stats-grid,.cards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .modal,.dialog{width:min(680px,calc(100vw - 24px))}
}
@media(max-width:768px){
 html{scroll-padding-top:10px}
 body{font-size:14px}
 .content-container{padding-left:10px;padding-right:10px}
 .dashboard-grid,.stats-grid,.cards-grid,.form-grid,.settings-grid{grid-template-columns:minmax(0,1fr)!important}
 .page-section{margin-left:0!important;margin-right:0!important}
 .page-section h1{font-size:clamp(20px,5vw,28px)}
 .page-section h2{font-size:clamp(17px,4vw,22px)}
 .page-section table{font-size:12px}
 .page-section th,.page-section td{padding:9px 8px;white-space:normal;overflow-wrap:anywhere}
 .page-section form .grid{grid-template-columns:minmax(0,1fr)!important}
 .page-section input,.page-section select,.page-section textarea{width:100%;min-height:42px}
 .page-section button,.page-section .action-btn,.page-section .btn{max-width:100%}
 .modal,.dialog{width:calc(100vw - 20px);max-width:560px;max-height:calc(100vh - 20px);max-height:calc(100dvh - 20px);padding:16px}
 .table-responsive,.table-container{width:100%;overflow-x:auto}
 .table-responsive table,.table-container table{min-width:600px}
 .flex.items-center.justify-between{flex-wrap:wrap;gap:10px}
}
@media(max-width:576px){
 body{min-width:320px}
 .content-container{padding-left:8px;padding-right:8px}
 .page-section{padding-top:8px}
 .page-section .rounded-xl,.page-section .rounded-2xl{border-radius:14px}
 .page-section .p-6{padding:14px}
 .page-section .p-5{padding:12px}
 .page-section .p-4{padding:10px}
 .page-section .gap-6{gap:12px}
 .page-section .gap-5{gap:10px}
 .page-section .gap-4{gap:9px}
 .page-section .mb-6{margin-bottom:14px}
 .page-section .mb-4{margin-bottom:10px}
 .page-section .text-3xl{font-size:1.45rem;line-height:1.35}
 .page-section .text-2xl{font-size:1.25rem;line-height:1.4}
 .page-section .text-xl{font-size:1.1rem;line-height:1.45}
 .page-section .w-full{max-width:100%}
 .page-section .flex-col-mobile{flex-direction:column}
 .page-section .action-buttons{display:flex;flex-wrap:wrap;gap:8px}
 .page-section .action-buttons>*{flex:1 1 100%}
 .page-section table{min-width:560px}
 .modal,.dialog{width:calc(100vw - 16px);padding:13px;border-radius:16px}
 .floating-btn{right:12px;bottom:calc(12px + var(--app-safe-bottom))}
}
@media(max-width:380px){
 .content-container{padding-left:6px;padding-right:6px}
 .page-section .p-4,.page-section .p-5,.page-section .p-6{padding:9px}
 .page-section .text-3xl{font-size:1.3rem}
 .page-section .text-2xl{font-size:1.15rem}
 .modal,.dialog{width:calc(100vw - 12px);padding:10px}
}
@media(orientation:landscape) and (max-height:520px){
 .modal,.dialog{max-height:calc(100vh - 12px);max-height:calc(100dvh - 12px)}
 .store-modern .store-header{padding-bottom:4px}
 .store-modern .store-icon{width:54px;height:54px;margin-bottom:6px}
 .store-modern .stepper-modern{margin:8px auto 12px}
}
@media(hover:none),(pointer:coarse){
 .store-modern .product-card:hover{transform:none}
 .store-modern button,.store-modern a{touch-action:manipulation}
 .store-modern .store-category-btn,.store-modern .store-more-btn{min-height:44px}
 .store-modern .product-card{min-height:136px}
}
@supports not (height:100dvh){
 .modal,.dialog{max-height:calc(100vh - 24px)}
}
@supports (padding:max(0px)){
 body{padding-left:0;padding-right:0}
 .app-bottom-bar,.bottom-nav{padding-bottom:max(8px,var(--app-safe-bottom))}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
@media print{
 #userSidebar,.sidebar,.store-topbar,.bottom-nav,.floating-btn{display:none!important}
 body,.store-page-shell{background:#fff!important;color:#111!important}
 .page-section{display:block!important;break-inside:avoid}
}