
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Segoe UI',system-ui,-apple-system,sans-serif;background:#f2f4f8;color:#1a1a2e;min-height:100vh}
.wrap{max-width:960px;margin:0 auto;padding:20px 14px}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:1.05rem;color:#E84393}
.brand .dot{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#E84393,#16213e);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1rem}
.actions{display:flex;gap:8px;flex-wrap:wrap}
button{cursor:pointer;font-family:inherit;border:none;border-radius:10px;padding:9px 14px;font-size:.85rem;font-weight:600}
.btn{background:#E84393;color:#fff}
.btn.ghost{background:#fff;color:#E84393;border:1.5px solid #c8d0e0}
.btn.danger{background:#fff;color:#dc3545;border:1.5px solid #f0c0c6}
.card{background:#fff;border-radius:14px;padding:18px;box-shadow:0 2px 10px rgba(232,67,147,.06);margin-bottom:14px}
.card h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.6px;color:#6c757d;margin-bottom:12px}
.grid4{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.stat{background:#f8fafc;border:1.5px solid #eef1f6;border-radius:12px;padding:12px}
.stat .v{font-size:1.25rem;font-weight:800;color:#E84393}
.stat .l{font-size:.72rem;color:#6c757d;margin-top:2px}
.stat .v.pos{color:#28a745}.stat .v.neg{color:#dc3545}
.store{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid #f0f2f6}
.store:last-child{border-bottom:none}
.store .nm{flex:1;min-width:140px}
.store .nm b{font-size:.95rem}
.store .nm small{display:block;color:#6c757d;font-size:.72rem;margin-top:2px}
.metric{text-align:right;min-width:86px}
.metric .v{font-weight:800;font-size:.92rem}
.metric .l{font-size:.66rem;color:#6c757d}
.badge{display:inline-block;font-size:.64rem;font-weight:700;padding:2px 8px;border-radius:20px}
.badge.ok{background:#e8f5e9;color:#2e7d32}
.badge.warn{background:#fff3e0;color:#C2255C}
.badge.off{background:#fce4ec;color:#dc3545}
.toprow{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px dashed #e8ecf2;font-size:.9rem}
.toprow:last-child{border-bottom:none}
.toprow .rank{width:26px;color:#6c757d;font-weight:700}
.toprow .name{flex:1}
.toprow .val{font-weight:700}
/* auth */
.auth{max-width:380px;margin:6vh auto;background:#fff;border-radius:16px;padding:26px 22px;box-shadow:0 8px 30px rgba(232,67,147,.1)}
.auth h2{color:#E84393;margin-bottom:4px;font-size:1.2rem}
.auth p{color:#6c757d;font-size:.82rem;margin-bottom:18px}
.field{margin-bottom:14px}
.field label{display:block;font-size:.78rem;font-weight:600;color:#1a1a2e;margin-bottom:5px}
.field input{width:100%;padding:11px 12px;border:1.5px solid #d7dde8;border-radius:10px;font-size:.95rem;font-family:inherit}
.field input:focus{outline:none;border-color:#E84393}
.btn-block{width:100%;padding:12px;font-size:.95rem}
.alert{padding:10px 12px;border-radius:10px;font-size:.82rem;margin-bottom:12px}
.alert.err{background:#fce4ec;color:#dc3545}
.alert.ok{background:#e8f5e9;color:#2e7d32}
.hidden{display:none}
.sec{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;flex-wrap:wrap;gap:6px}
.sec h2{font-size:1.05rem;color:#E84393}
.muted{color:#6c757d;font-size:.78rem}
/* ── Kelola Data Cabang (Fase 1) ── */
.mtoolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:14px}
.sinput{flex:1;min-width:170px;padding:9px 10px;border:1.5px solid #d7dde8;border-radius:10px;font-size:.85rem;font-family:inherit;background:#fff}
.tabs{display:flex;gap:4px;background:#eef1f6;padding:4px;border-radius:10px;flex-wrap:wrap}
.tab{padding:7px 12px;border-radius:8px;background:transparent;color:#6c757d;font-size:.8rem;font-weight:700}
.tab.active{background:#fff;color:#E84393;box-shadow:0 1px 4px rgba(232,67,147,.14)}
.mrow{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #f0f2f6}
.mrow:last-child{border-bottom:none}
.mrow .em{font-size:1.3rem;width:34px;text-align:center;flex-shrink:0}
.mrow .info{flex:1;min-width:0}
.mrow .info b{font-size:.9rem}
.mrow .info small{display:block;color:#6c757d;font-size:.72rem;margin-top:2px}
.mrow .btns{display:flex;gap:6px;flex-shrink:0}
.mbtn{padding:6px 10px;font-size:.75rem;border-radius:8px}
.mbtn.edit{background:#eef3ff;color:#E84393}
.mbtn.del{background:#fdecec;color:#dc3545}
.arch-badge{font-size:.68rem;font-weight:700;color:#6c757d;background:#eef1f6;padding:2px 8px;border-radius:20px;white-space:nowrap}
.overlay{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;padding:16px}
.modal{background:#fff;border-radius:16px;padding:20px;width:100%;max-width:420px;max-height:90vh;overflow:auto}
.modal h2{color:#E84393;font-size:1.1rem;margin-bottom:4px}
.modal .sub{color:#6c757d;font-size:.78rem;margin-bottom:14px}
.mf{margin-bottom:10px}
.mf label{display:block;font-size:.78rem;font-weight:600;color:#1a1a2e;margin-bottom:5px}
.mf input,.mf select{width:100%;padding:10px 11px;border:1.5px solid #d7dde8;border-radius:10px;font-size:.9rem;font-family:inherit;background:#fff}
.mf input:focus,.mf select:focus{outline:none;border-color:#E84393}
.chk{display:flex;gap:8px;align-items:center;font-size:.85rem;font-weight:600;color:#1a1a2e}
.chk input{width:auto}
.cfg-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.cfg-grid .mf{margin:0}.cfg-wide{grid-column:1/-1}
.cfg-toggle{display:flex;align-items:flex-start;gap:8px;padding:9px 10px;border:1px solid #e6eaf0;border-radius:10px;background:#fbfcfe;font-size:.78rem;line-height:1.35}
.cfg-toggle input{margin-top:2px;accent-color:#E84393}.cfg-toggle b{display:block;color:#1a1a2e}.cfg-toggle small{display:block;color:#6c757d;margin-top:2px}
.photo-thumb{width:42px;height:42px;border-radius:10px;object-fit:cover;background:#f3f5f8;border:1px solid #e4e8ee;display:block}.photo-thumb.empty{display:none}
.photo-preview{width:90px;height:90px;border-radius:12px;object-fit:cover;background:#f3f5f8;border:1px dashed #cbd5e1;display:none}
@media(max-width:560px){.cfg-grid{grid-template-columns:1fr}.cfg-wide{grid-column:auto}}

/* ── Ningrat Kelola: shell aplikasi dashboard & UX layar kecil ── */
html{scroll-behavior:smooth}
.dashboard-section{scroll-margin-top:82px}
.brand-copy{display:flex;flex-direction:column;min-width:0;line-height:1.18}
.brand-title{font-size:1rem;font-weight:800;color:#E84393}
.brand-sub{font-size:.72rem;font-weight:650;color:#667085;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.connection-pill{display:inline-flex;align-items:center;gap:5px;font-size:.68rem;font-weight:750;color:#667085;background:#f1f3f7;border:1px solid #e5e9f0;border-radius:99px;padding:4px 7px;white-space:nowrap}
.connection-pill.online{color:#20733d;background:#eaf7ee;border-color:#d0ebd9}.connection-pill.offline{color:#a34b00;background:#fff5e8;border-color:#f5dbb9}
.install-action[hidden]{display:none!important}
.install-action{white-space:nowrap}
.menu-toggle{display:none;width:42px;height:42px;padding:0;border:1.5px solid #d8dee9;background:#fff;color:#1a1a2e;font-size:1.25rem;line-height:1}
.section-nav{display:flex;gap:7px;align-items:center;margin:-4px 0 16px;padding:4px;overflow-x:auto;scrollbar-width:none}.section-nav::-webkit-scrollbar{display:none}
.section-nav button{flex:0 0 auto;background:#fff;color:#596273;border:1px solid #e5e9f0;padding:8px 11px;font-size:.76rem}.section-nav button.active{background:#fff4eb;border-color:#ffb37c;color:#d95000}
.mobile-bottom-nav,.mobile-menu-overlay{display:none}
.dashboard-offline-note{display:none}
@media(max-width:700px){
  body.dashboard-open{padding-bottom:78px}
  .wrap{padding:10px 10px 8px}
  .topbar{position:sticky;top:0;z-index:35;margin:-10px -10px 12px;padding:10px;background:rgba(242,244,248,.97);backdrop-filter:blur(12px);border-bottom:1px solid #e4e8ef}
  .brand{gap:8px;min-width:0;flex:1}.brand .dot,.brand .dot img{width:38px!important;height:38px!important;border-radius:11px!important}
  .brand-title{font-size:.94rem}.brand-sub{max-width:175px;font-size:.67rem}.connection-pill{display:none}
  .actions{display:none}.menu-toggle{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
  .section-nav{display:none}
  .card{border-radius:15px;padding:14px;margin-bottom:11px;box-shadow:0 2px 10px rgba(23,32,51,.055)}
  .card h3{font-size:.75rem;margin-bottom:10px}.sec{margin-bottom:11px}.sec h2{font-size:1rem}.muted{font-size:.76rem}
  .grid4{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.stat{padding:11px}.stat .v{font-size:1.12rem}.stat .l{font-size:.67rem}
  .store{display:grid;grid-template-columns:1fr auto;gap:9px;padding:12px 0}.store .nm{grid-column:1/-1;min-width:0}.store .nm b{font-size:.9rem}.metric{min-width:0;text-align:left}.metric:last-child{text-align:right}
  .mtoolbar{gap:8px;margin-bottom:11px}.sinput{min-width:0;min-height:42px;font-size:16px}.mtoolbar>.sinput:first-child{flex:1 1 100%}
  .tabs{width:100%;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tab{flex:0 0 auto;padding:8px 10px}
  #btn-add-master,.mtoolbar>.btn{min-height:42px}.cfg-toggle{padding:11px 10px;font-size:.8rem}
  .mrow{gap:8px}.mrow .btns{gap:4px}.mbtn{padding:7px 8px}
  input,select,textarea{font-size:16px!important}
  .mobile-bottom-nav{position:fixed;z-index:40;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding:6px max(8px,env(safe-area-inset-left)) calc(6px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-right));background:rgba(255,255,255,.98);border-top:1px solid #e4e8ef;box-shadow:0 -8px 24px rgba(23,32,51,.09)}
  .mobile-bottom-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:51px;padding:4px 2px;background:transparent;color:#6c757d;border-radius:10px;font-size:.62rem;font-weight:750}.mobile-bottom-nav .nav-icon{font-size:1.2rem;line-height:1}.mobile-bottom-nav button.active{color:#e95a00;background:#fff3ea}
  .mobile-menu-overlay{position:fixed;z-index:75;inset:0;background:rgba(15,23,42,.43);padding:0;align-items:flex-end}.mobile-menu-overlay.show{display:flex}.mobile-menu-sheet{width:100%;max-height:84vh;overflow:auto;background:#fff;border-radius:22px 22px 0 0;padding:10px 14px calc(16px + env(safe-area-inset-bottom));box-shadow:0 -14px 35px rgba(15,23,42,.18)}
  .mobile-menu-handle{width:42px;height:4px;border-radius:99px;background:#dce2eb;margin:2px auto 12px}.mobile-menu-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.mobile-menu-head b{font-size:1rem}.mobile-menu-list{display:grid;gap:5px}.mobile-menu-list button{display:flex;align-items:center;gap:11px;width:100%;min-height:48px;padding:10px 12px;text-align:left;background:#fff;color:#1a1a2e;border:1px solid #e7ebf1;border-radius:12px;font-size:.87rem}.mobile-menu-list button .mi{font-size:1.1rem;width:22px;text-align:center}.mobile-menu-list button.danger{color:#c93343;background:#fffafa;border-color:#f5d3d8}.mobile-menu-list button.install{color:#c84d00;background:#fff7f1;border-color:#ffd5b8}.mobile-menu-list button[hidden]{display:none}
  .dashboard-offline-note{margin:-2px 0 10px;padding:8px 10px;border-radius:10px;background:#fff5e8;color:#925100;font-size:.73rem;line-height:1.35}.dashboard-offline-note.show{display:block}
  .auth{margin:3vh 12px;padding:22px 18px}.auth h2{font-size:1.1rem}
}
@media(min-width:701px){.dashboard-offline-note.show{display:block}.mobile-menu-overlay.show{display:none!important}}

/* Navigasi multi-halaman & modul franchise */
.section-nav a{flex:0 0 auto;background:#fff;color:#596273;border:1px solid #e5e9f0;padding:8px 11px;font-size:.76rem;border-radius:10px;text-decoration:none;font-weight:600;white-space:nowrap}.section-nav a.active{background:#fff4eb;border-color:#ffb37c;color:#d95000}.page-lead{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.page-lead h1{font-size:1.35rem;color:#1a1a2e;margin-bottom:4px}.page-lead p{font-size:.8rem;color:#6c757d;line-height:1.45}.inline-form{display:flex;align-items:end;gap:8px;flex-wrap:wrap}.inline-form .mf{min-width:145px;flex:1;margin:0}.data-table{width:100%;border-collapse:collapse;font-size:.78rem}.data-table th,.data-table td{padding:9px 8px;border-bottom:1px solid #edf0f4;text-align:left;vertical-align:top}.data-table th{font-size:.67rem;text-transform:uppercase;letter-spacing:.4px;color:#6c757d}.data-table tr:last-child td{border-bottom:0}.table-wrap{overflow-x:auto}.split-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.pill-select{display:flex;gap:7px;flex-wrap:wrap}.supply-balance{font-size:1.25rem;font-weight:800;color:#E84393}.supply-meta{font-size:.72rem;color:#6c757d;line-height:1.45}.order-card{border:1px solid #e7ebf1;border-left:4px solid #e7a52c;border-radius:12px;padding:12px;margin-bottom:10px}.order-card.paid{border-left-color:#28a745}.order-card.cancelled{border-left-color:#9aa2ad;opacity:.72}.order-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.order-head h3{margin:0 0 3px;text-transform:none;letter-spacing:0;font-size:.93rem;color:#1a1a2e}.order-total{font-weight:800;color:#E84393;white-space:nowrap}.order-lines{margin:9px 0;padding:8px 10px;border-radius:9px;background:#f8fafc;font-size:.75rem;line-height:1.55}.order-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}.notice{padding:10px 12px;border:1px solid #f2d59a;border-radius:10px;background:#fff9e9;color:#785614;font-size:.78rem;line-height:1.5;margin-bottom:12px}.notice.info{background:#eef6ff;border-color:#c9ddf5;color:#285b8f}.notice.success{background:#eaf7ee;border-color:#c9e8d2;color:#286c3c}.empty-state{text-align:center;color:#6c757d;padding:24px 12px;font-size:.82rem}.danger-text{color:#dc3545}.success-text{color:#258143}.small-btn{padding:6px 9px;font-size:.72rem}.stock-event-negative{color:#dc3545;font-weight:700}.stock-event-positive{color:#258143;font-weight:700}.mobile-bottom-nav a{text-decoration:none}.mobile-menu-list a{display:flex;align-items:center;gap:11px;width:100%;min-height:48px;padding:10px 12px;text-align:left;background:#fff;color:#1a1a2e;border:1px solid #e7ebf1;border-radius:12px;font-size:.87rem;text-decoration:none;font-weight:600}.mobile-menu-list a .mi{font-size:1.1rem;width:22px;text-align:center}@media(max-width:700px){.split-grid{grid-template-columns:1fr}.page-lead h1{font-size:1.18rem}.mobile-bottom-nav{grid-template-columns:repeat(5,1fr)}.mobile-bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:51px;padding:4px 2px;background:transparent;color:#6c757d;border-radius:10px;font-size:.62rem;font-weight:750}.mobile-bottom-nav a.active{color:#e95a00;background:#fff3ea}.data-table{min-width:620px}.inline-form{align-items:stretch}.inline-form .mf{min-width:130px}.order-head{flex-direction:column}.order-total{font-size:1rem}}

/* ── Owner sidebar responsif + navbar HP yang dapat diatur (v1.0.5) ── */
body{--owner-sidebar-width:248px}
.owner-sidebar{position:fixed;z-index:70;inset:0 auto 0 0;width:var(--owner-sidebar-width);display:flex;flex-direction:column;background:#17213a;color:#e8edf7;box-shadow:5px 0 24px rgba(15,23,42,.12);transition:width .2s ease,transform .2s ease}
.owner-sidebar-head{display:flex;align-items:center;gap:8px;padding:16px 13px;border-bottom:1px solid rgba(255,255,255,.09);flex-shrink:0}
.owner-sidebar-brand{display:flex;align-items:center;gap:10px;min-width:0;flex:1;color:#fff;text-decoration:none}
.owner-sidebar-brand img{width:38px;height:38px;border-radius:11px;flex:0 0 auto;box-shadow:0 3px 12px rgba(232,67,147,.28)}
.owner-sidebar-brand-copy{display:flex;flex-direction:column;min-width:0;line-height:1.2}.owner-sidebar-brand-copy b{font-size:.96rem;white-space:nowrap}.owner-sidebar-brand-copy small{margin-top:3px;color:#aeb9cf;font-size:.68rem;white-space:nowrap}
.owner-sidebar-collapse,.owner-sidebar-close{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;flex:0 0 auto;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.07);color:#fff;font-size:1.2rem}.owner-sidebar-close{display:none;font-size:1.4rem}
.owner-sidebar-caption{padding:17px 18px 7px;color:#8290aa;font-size:.62rem;font-weight:800;letter-spacing:1.1px;white-space:nowrap;flex-shrink:0}
.owner-sidebar-nav{display:grid;gap:4px;padding:4px 10px 14px;overflow-y:auto;min-height:0;flex:1;align-content:start}
.owner-sidebar-nav a,.owner-sidebar-tools button{display:flex;align-items:center;gap:11px;width:100%;min-height:44px;padding:10px 11px;border:1px solid transparent;border-radius:10px;background:transparent;color:#cbd5e5;text-decoration:none;text-align:left;font-size:.79rem;font-weight:650;white-space:nowrap}
.owner-sidebar-nav a:hover,.owner-sidebar-tools button:hover{background:rgba(255,255,255,.07);color:#fff}.owner-sidebar-nav a.active{background:linear-gradient(135deg,#E84393,#c9367c);color:#fff;box-shadow:0 5px 16px rgba(232,67,147,.23)}
.owner-nav-icon{display:inline-flex;align-items:center;justify-content:center;width:23px;min-width:23px;font-size:1.05rem;font-style:normal}.owner-nav-label{min-width:0;overflow:hidden;text-overflow:ellipsis}
.owner-sidebar-tools{display:grid;gap:4px;padding:11px 10px 14px;border-top:1px solid rgba(255,255,255,.09);flex-shrink:0}.owner-sidebar-tools button.install{color:#ffd7a8}.owner-sidebar-tools button.danger{color:#ffb7c0}.owner-sidebar-tools button[hidden]{display:none!important}.owner-sidebar-note{display:block;padding:5px 11px 0;color:#8290aa;font-size:.62rem;line-height:1.4;white-space:normal}
.owner-sidebar-mobile-action{display:none!important}.owner-sidebar-overlay{display:none}
body.owner-sidebar-collapsed{--owner-sidebar-width:76px}
.owner-sidebar-collapsed .owner-sidebar-head{flex-direction:column;padding:12px 8px}.owner-sidebar-collapsed .owner-sidebar-brand{flex:0 0 auto}.owner-sidebar-collapsed .owner-sidebar-brand-copy,.owner-sidebar-collapsed .owner-sidebar-caption,.owner-sidebar-collapsed .owner-sidebar .owner-nav-label{display:none}
.owner-sidebar-collapsed .owner-sidebar-nav{padding:8px}.owner-sidebar-collapsed .owner-sidebar-nav a,.owner-sidebar-collapsed .owner-sidebar-tools button{justify-content:center;padding:10px 8px}.owner-sidebar-collapsed .owner-sidebar-tools{padding:10px 8px}.owner-sidebar-collapsed .owner-sidebar-note{display:none}
@media(min-width:901px){
  body.dashboard-open .wrap{max-width:none;margin:0 0 0 var(--owner-sidebar-width);padding:22px 28px 30px;transition:margin-left .2s ease}
  body.dashboard-open .wrap>main,body.dashboard-open .topbar,body.dashboard-open .dashboard-offline-note{max-width:1100px;margin-left:auto;margin-right:auto}
  body.dashboard-open .topbar{margin-bottom:18px;flex-wrap:wrap}.topbar .actions{margin-left:auto}
  .owner-sidebar-collapse{flex-shrink:0}
}
@media(min-width:901px) and (max-width:1120px){.topbar .connection-pill{display:none}.topbar .actions button{padding:8px 9px;font-size:.74rem}}
@media(max-width:900px){
  body.dashboard-open{padding-bottom:78px}body.owner-sidebar-open{overflow:hidden}
  body.dashboard-open .wrap{margin-left:0;max-width:960px}
  .owner-sidebar{width:min(304px,86vw);transform:translateX(-105%);box-shadow:12px 0 35px rgba(15,23,42,.28)}
  body.owner-sidebar-open .owner-sidebar{transform:translateX(0)}
  .owner-sidebar-collapse{display:none}.owner-sidebar-close{display:inline-flex}.owner-sidebar-mobile-action{display:flex!important}
  body.owner-sidebar-collapsed .owner-sidebar-head{flex-direction:row;padding:16px 13px}body.owner-sidebar-collapsed .owner-sidebar-brand{flex:1}body.owner-sidebar-collapsed .owner-sidebar-brand-copy,body.owner-sidebar-collapsed .owner-sidebar-caption,body.owner-sidebar-collapsed .owner-sidebar .owner-nav-label{display:flex}
  body.owner-sidebar-collapsed .owner-sidebar-caption{display:block}body.owner-sidebar-collapsed .owner-sidebar-nav{padding:4px 10px 14px}body.owner-sidebar-collapsed .owner-sidebar-nav a,body.owner-sidebar-collapsed .owner-sidebar-tools button{justify-content:flex-start;padding:10px 11px}body.owner-sidebar-collapsed .owner-sidebar-note{display:block}
  .owner-sidebar-overlay{position:fixed;z-index:65;inset:0;background:rgba(15,23,42,.5);backdrop-filter:blur(2px)}body.dashboard-open.owner-sidebar-open .owner-sidebar-overlay{display:block}
  .topbar{position:sticky;top:0;z-index:35;background:rgba(242,244,248,.97);backdrop-filter:blur(12px)}.topbar .actions,.topbar .connection-pill{display:none}.menu-toggle{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}.brand{min-width:0;flex:1}
  body.dashboard-open .mobile-bottom-nav{--mobile-nav-count:5;position:fixed;z-index:40;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(var(--mobile-nav-count),minmax(0,1fr));gap:0;padding:6px max(8px,env(safe-area-inset-left)) calc(6px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-right));background:rgba(255,255,255,.98);border-top:1px solid #e4e8ef;box-shadow:0 -8px 24px rgba(23,32,51,.09)}
  body:not(.dashboard-open) .mobile-bottom-nav{display:none}
  .mobile-bottom-nav a,.mobile-bottom-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;min-height:53px;padding:4px 2px;background:transparent;color:#6c757d;border-radius:10px;font-size:.61rem;font-weight:750;text-decoration:none;line-height:1.08;text-align:center}
  .mobile-bottom-nav a.active{color:#e95a00;background:#fff3ea}.mobile-bottom-nav .nav-icon{font-size:1.18rem;line-height:1}.mobile-bottom-nav .nav-label{max-width:100%;overflow-wrap:anywhere}
}
/* Editor pintasan: tidak mengubah halaman atau hak akses. */
.nav-editor-overlay{position:fixed;z-index:120;inset:0;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(15,23,42,.58);backdrop-filter:blur(3px)}.nav-editor-overlay.show{display:flex}
.nav-editor-card{display:flex;flex-direction:column;width:100%;max-width:650px;max-height:92vh;overflow:hidden;background:#fff;border-radius:18px;padding:18px;box-shadow:0 20px 60px rgba(15,23,42,.25)}
.nav-editor-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.nav-editor-head h2{color:#E84393;font-size:1.12rem}.nav-editor-head p{margin-top:4px;color:#6c757d;font-size:.76rem}.nav-editor-head button{width:36px;height:36px;padding:0;font-size:1.2rem;flex:0 0 auto}
.nav-editor-help{margin:12px 0 10px;padding:10px 12px;border-radius:10px;background:#f5f7fb;color:#596273;font-size:.77rem;line-height:1.5}.nav-editor-list{display:grid;gap:6px;min-height:0;overflow-y:auto;padding:2px}
.nav-editor-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:9px;padding:8px 9px;border:1px solid #e5eaf1;border-radius:11px;background:#fff}.nav-editor-row:has(input:checked){border-color:#f1bfd5;background:#fff8fb}
.nav-editor-row label{display:flex;align-items:center;gap:8px;min-width:0;font-size:.82rem;font-weight:650;cursor:pointer}.nav-editor-row label span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-editor-row input{width:19px;height:19px;flex:0 0 auto;accent-color:#E84393}.nav-editor-icon{width:22px;text-align:center;font-size:1rem}
.nav-editor-position{color:#7b8494;font-size:.67rem;white-space:nowrap}.nav-editor-order{display:flex;gap:4px}.nav-editor-order button{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;border:1px solid #dbe2ec;background:#f8fafc;color:#3d4757;font-size:1rem}.nav-editor-order button:disabled{opacity:.3;cursor:not-allowed}
.nav-editor-status{min-height:18px;margin:9px 2px 0;color:#6c757d;font-size:.71rem;line-height:1.4}.nav-editor-actions{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:8px;margin-top:12px}.nav-editor-actions button{min-height:40px;padding:9px 11px;font-size:.76rem}
.dashboard-toast{position:fixed;z-index:130;left:50%;bottom:22px;transform:translate(-50%,18px);max-width:calc(100vw - 28px);padding:11px 16px;border-radius:12px;background:#17213a;color:#fff;box-shadow:0 8px 26px rgba(15,23,42,.25);font-size:.78rem;line-height:1.4;opacity:0;pointer-events:none;transition:opacity .18s,transform .18s}.dashboard-toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:700px){.nav-editor-overlay{padding:10px;align-items:flex-end}.nav-editor-card{max-height:88vh;border-radius:18px 18px 12px 12px;padding:15px 12px calc(14px + env(safe-area-inset-bottom))}.nav-editor-row{grid-template-columns:minmax(0,1fr) auto;gap:6px}.nav-editor-position{display:none}.nav-editor-actions{grid-template-columns:1fr 1fr}.nav-editor-actions span{display:none}.nav-editor-actions #btn-reset-nav-editor{grid-column:1/-1;grid-row:2}.nav-editor-actions #btn-cancel-nav-editor{grid-column:1;grid-row:1}.nav-editor-actions #btn-save-nav-editor{grid-column:2;grid-row:1}.dashboard-toast{bottom:86px}}
@media(prefers-reduced-motion:reduce){.owner-sidebar,body.dashboard-open .wrap,.dashboard-toast{transition:none}}

/* Peringatan stok cabang (<10) pada Ringkasan dan Cabang. */
.low-stock-list{display:grid;gap:8px;margin-top:10px}
.low-stock-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid #f0d3dc;border-radius:12px;background:#fff9fb}
.low-stock-row .grow{min-width:0}
.low-stock-row b,.low-stock-row small{display:block}
.low-stock-row small{margin-top:3px;color:#7b6870}
.low-stock-row .badge{flex:0 0 auto}
.low-stock-link{display:inline-block;margin-top:12px;font-size:12px;font-weight:800;color:#be285d;text-decoration:none}
.stock-warning-text{margin:0 0 8px;color:#9b4b13;font-weight:700}
.stock-warning-ok{margin:0;padding:10px 12px;border-radius:12px;background:#edf9f1;color:#237443;font-weight:700}
@media(max-width:560px){.low-stock-row{align-items:flex-start;flex-wrap:wrap;gap:7px}.low-stock-row .grow{flex-basis:100%}}
