/* === MOBILE — Bottom nav, drawer, pull-to-refresh, pointer events === */
@media(max-width:768px){
.mob-bnav{position:fixed;bottom:0;left:0;right:0;height:calc(60px + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);background:var(--bg-secondary);border-top:1px solid var(--glass-border);display:flex;align-items:center;justify-content:space-around;z-index:200;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 -2px 12px rgba(0,0,0,.08)}
[data-theme="dark"] .mob-bnav{background:rgba(10,16,30,.95);box-shadow:0 -2px 16px rgba(0,0,0,.3)}
.mob-bnav-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 0;border:none;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent;min-width:56px;position:relative;font-family:inherit}
.mob-bnav-item svg{width:22px;height:22px;stroke:var(--text-tertiary);fill:none;stroke-width:1.8;transition:all .2s}
.mob-bnav-item span{font-size:.58rem;font-weight:600;color:var(--text-tertiary);transition:color .2s;line-height:1}
.mob-bnav-item.active svg{stroke:var(--accent);filter:drop-shadow(0 0 6px rgba(8,145,178,.4))}
.mob-bnav-item.active span{color:var(--accent)}
.mob-bnav-item.active::after{content:'';position:absolute;top:-1px;left:50%;transform:translateX(-50%);width:24px;height:2.5px;background:var(--accent);border-radius:0 0 3px 3px;box-shadow:0 0 8px rgba(0,212,255,.5)}
.nav-tabs-wrap{display:none!important}
/* Header fixo no topo no mobile — antes era position:sticky herdado de
   layout.css mas algum ancestor com overflow estava invalidando o sticky
   (PWA mode + overflow:hidden em #appWrapper quebrava sticky em iOS).
   position:fixed garante que SEMPRE fica visivel ao rolar.
   body recebe padding-top compensando o header (50px). */
.header{position:fixed!important;top:0!important;left:0!important;right:0!important;height:50px!important;padding:0 .75rem!important;z-index:200!important}
body{padding-top:50px!important}
.header-logo{width:28px!important;height:28px!important;font-size:.65rem!important;border-radius:7px!important}
.header-title{font-size:.85rem!important}
.header-subtitle{display:none!important}
.hdr-icon-btn{padding:6px!important}
.hdr-avatar{width:30px!important;height:30px!important;font-size:.68rem!important}
.hdr-user-name{display:none!important}
.hdr-avatar-area{gap:3px!important;padding:2px!important}
.main{padding-bottom:80px!important}
#filialBar{top:50px!important;padding:4px .6rem!important}
#filialBar .op-filter-btn{font-size:.58rem!important;padding:4px 9px!important}
.section{transition:opacity .2s ease;pointer-events:none}
.section.active{opacity:1;transform:translateY(0);pointer-events:auto}
.ptr-indicator{position:fixed;top:50px;left:50%;transform:translateX(-50%) translateY(-60px);z-index:150;width:36px;height:36px;border-radius:50%;background:var(--bg-secondary);border:1px solid var(--glass-border);box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:center;pointer-events:none;opacity:0;visibility:hidden}
.ptr-indicator svg{width:20px;height:20px;stroke:var(--accent);stroke-width:2;fill:none;transition:transform .2s}
.ptr-indicator.pulling{opacity:1;visibility:visible;transform:translateX(-50%) translateY(8px);transition:opacity .2s,visibility .2s,transform .2s}
.ptr-indicator.refreshing{opacity:1;visibility:visible;transform:translateX(-50%) translateY(8px);transition:opacity .2s,visibility .2s,transform .2s}
.ptr-indicator.refreshing svg{animation:ptrSpin .7s linear infinite}
@keyframes ptrSpin{to{transform:rotate(360deg)}}
.mob-drawer-overlay{position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.5);backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:opacity .3s}
.mob-drawer-overlay.open{opacity:1;pointer-events:auto}
.mob-drawer{position:fixed;bottom:0;left:0;right:0;z-index:301;background:var(--bg-secondary);border-radius:20px 20px 0 0;max-height:85vh;overflow-y:auto;-webkit-overflow-scrolling:touch;transform:translateY(100%);transition:transform .35s cubic-bezier(.32,.72,0,1);padding:0 0 calc(16px + env(safe-area-inset-bottom,0px));box-shadow:0 -8px 40px rgba(0,0,0,.2)}
[data-theme="dark"] .mob-drawer{background:rgba(10,16,30,.98);box-shadow:0 -8px 40px rgba(0,0,0,.5)}
.mob-drawer-overlay.open .mob-drawer{transform:translateY(0)}
.mob-drawer-handle{width:36px;height:4px;border-radius:4px;background:var(--text-tertiary);opacity:.3;margin:10px auto 6px}
.mob-drawer-title{font-size:.85rem;font-weight:700;padding:0 20px 12px;color:var(--text-primary);border-bottom:1px solid var(--border)}
.mob-drawer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;padding:12px 12px 0}
.mob-drawer-item{display:flex;flex-direction:column;align-items:center;gap:5px;padding:14px 4px;border-radius:12px;background:none;border:none;cursor:pointer;-webkit-tap-highlight-color:transparent;font-family:inherit;transition:background .15s}
.mob-drawer-item:active{background:var(--accent-light)}
.mob-drawer-item .mdi{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.15rem;background:var(--bg-tertiary);transition:all .2s}
.mob-drawer-item span{font-size:.6rem;font-weight:600;color:var(--text-secondary);text-align:center;line-height:1.2}
.mob-drawer-item.mdi-active .mdi{background:var(--accent);color:#fff;box-shadow:0 2px 10px rgba(8,145,178,.3)}
.mob-drawer-item.mdi-active span{color:var(--accent);font-weight:700}
.mob-drawer-cat{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--text-tertiary);padding:14px 20px 6px}
}
@media(min-width:769px){.mob-bnav,.mob-drawer-overlay,.ptr-indicator{display:none!important}}

/* Fix: ensure sections are always visible when active */
.section.active{opacity:1!important;transform:none!important;pointer-events:auto!important;height:auto!important;visibility:visible!important}