:root{
  --pos-primary:#0f766e;
  --pos-primary-dark:#115e59;
  --pos-accent:#f59e0b;
  --pos-bg:#f1f5f9;
}
body{background:var(--pos-bg);font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;}
.app-navbar{background:linear-gradient(90deg,var(--pos-primary),var(--pos-primary-dark));}
.app-navbar .navbar-brand,.app-navbar .nav-link{color:#fff !important;}
.app-navbar .nav-link:hover{color:#ffe8b3 !important;}
.card{border:0;border-radius:.85rem;box-shadow:0 1px 3px rgba(15,23,42,.08);}
.card-header{background:#fff;border-bottom:1px solid #e2e8f0;font-weight:600;border-radius:.85rem .85rem 0 0 !important;}
.btn-primary{background:var(--pos-primary);border-color:var(--pos-primary);}
.btn-primary:hover,.btn-primary:focus{background:var(--pos-primary-dark);border-color:var(--pos-primary-dark);}
.text-primary{color:var(--pos-primary) !important;}
.stat-card{border-left:4px solid var(--pos-primary);}
.stat-card .stat-value{font-size:1.45rem;font-weight:700;}
table.dataTable thead th{background:#f8fafc;}
/* ---------- POS ---------- */
.pos-wrap{height:calc(100vh - 130px);}
.pos-products{overflow-y:auto;max-height:calc(100vh - 240px);}
.product-tile{cursor:pointer;transition:.15s;border:1px solid #e2e8f0;border-radius:.7rem;background:#fff;padding:.65rem;height:100%;}
.product-tile:hover{border-color:var(--pos-primary);transform:translateY(-2px);}
.product-tile .p-name{font-weight:600;font-size:.85rem;line-height:1.2;}
.product-tile .p-price{color:var(--pos-primary);font-weight:700;font-size:.85rem;}
.product-tile .p-stock{font-size:.72rem;color:#64748b;}
.cart-list{max-height:38vh;overflow-y:auto;}
.cart-item{border-bottom:1px dashed #e2e8f0;padding:.5rem 0;}
.qty-input{width:62px;text-align:center;}
.summary-row{display:flex;justify-content:space-between;font-size:.92rem;padding:.15rem 0;}
.summary-total{font-size:1.3rem;font-weight:800;color:var(--pos-primary);}
.pay-btn.active{background:var(--pos-primary);color:#fff;border-color:var(--pos-primary);}
/* ---------- Login ---------- */
.login-page{min-height:100vh;display:flex;align-items:center;background:linear-gradient(135deg,#0f766e,#134e4a);}
.login-card{max-width:420px;width:100%;margin:auto;}
/* ---------- Struk ---------- */
.receipt{width:80mm;margin:0 auto;background:#fff;padding:10px 12px;font-family:"Courier New",monospace;font-size:12px;color:#000;}
.receipt h5{text-align:center;margin:0;font-size:14px;font-weight:700;}
.receipt .rc-line{border-top:1px dashed #000;margin:6px 0;}
.receipt table{width:100%;font-size:11.5px;}
.receipt td{vertical-align:top;}
.text-end{text-align:right;}
@media print{
  body{background:#fff;}
  .no-print,nav,footer,.app-topbar,.app-sidebar,.app-sidebar-backdrop{display:none !important;}
  .app-main{margin-left:0 !important;padding:0 !important;}
  .receipt{width:auto;box-shadow:none;}
  @page{margin:4mm;}
}

/* ---------- Layout Sidebar (menu vertikal kiri) ---------- */
:root{--pos-sidebar-w:250px;--pos-sidebar-w-sm:66px;--pos-topbar-h:54px;}
.app-topbar{position:sticky;top:0;z-index:1040;height:var(--pos-topbar-h);display:flex;align-items:center;padding:0 .75rem;
  background:linear-gradient(90deg,var(--pos-primary),var(--pos-primary-dark));color:#fff;box-shadow:0 1px 4px rgba(15,23,42,.15);}
.app-topbar .app-brand{color:#fff;text-decoration:none;font-weight:700;display:flex;align-items:center;white-space:nowrap;}
.app-topbar .nav-link,.app-topbar .navbar-nav .nav-link{color:#fff !important;}
.app-sidebar-toggle{color:#fff;border:1px solid rgba(255,255,255,.35);line-height:1;padding:.25rem .5rem;}
.app-sidebar-toggle:hover{color:#fff;background:rgba(255,255,255,.15);}
.app-shell{display:flex;align-items:stretch;min-height:calc(100vh - var(--pos-topbar-h));}
.app-sidebar{width:var(--pos-sidebar-w);flex:0 0 var(--pos-sidebar-w);background:#0b3b38;color:#dbeae8;
  position:sticky;top:var(--pos-topbar-h);align-self:flex-start;height:calc(100vh - var(--pos-topbar-h));overflow-y:auto;
  transition:width .18s ease,flex-basis .18s ease,transform .18s ease;}
.app-sidebar::-webkit-scrollbar{width:6px;}
.app-sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:6px;}
.app-sidebar-nav{padding:.6rem .5rem 2rem;}
.app-nav{gap:2px;}
.app-nav .nav-link{color:#cfe3e0;border-radius:.55rem;padding:.5rem .7rem;font-size:.9rem;display:flex;align-items:center;gap:.6rem;white-space:nowrap;}
.app-nav .nav-link i{font-size:1.05rem;width:1.25rem;text-align:center;flex:0 0 1.25rem;}
.app-nav .nav-link:hover{background:rgba(255,255,255,.09);color:#fff;}
.app-nav .nav-link.active{background:var(--pos-primary);color:#fff;font-weight:600;}
.app-nav .dropdown-toggle::after{margin-left:auto;transition:transform .15s ease;}
.app-nav .dropdown-toggle.open::after,.app-nav .dropdown-toggle[aria-expanded="true"]::after{transform:rotate(180deg);}
.app-nav .sub-menu{list-style:none;margin:.15rem 0 .2rem;padding:0 0 0 1.85rem;}
.app-nav .sub-menu .dropdown-item{color:#b9d2ce;font-size:.83rem;padding:.34rem .55rem;border-radius:.45rem;white-space:normal;}
.app-nav .sub-menu .dropdown-item:hover{background:rgba(255,255,255,.1);color:#fff;}
.app-nav .sub-menu .dropdown-item.active{background:var(--pos-primary);color:#fff;}
.app-nav .sub-menu .dropdown-divider{border-color:rgba(255,255,255,.16);margin:.3rem 0;}
.app-main{flex:1 1 auto;min-width:0;padding:1.25rem;}
/* Mode ringkas (desktop) */
body.sidebar-collapsed .app-sidebar{width:var(--pos-sidebar-w-sm);flex-basis:var(--pos-sidebar-w-sm);}
body.sidebar-collapsed .app-nav .nav-link{justify-content:center;padding:.55rem .2rem;}
body.sidebar-collapsed .app-nav .nav-link span,
body.sidebar-collapsed .app-nav .sub-menu,
body.sidebar-collapsed .app-nav .dropdown-toggle::after{display:none;}
body.sidebar-collapsed .app-nav .nav-link{font-size:0;gap:0;}
body.sidebar-collapsed .app-nav .nav-link i{font-size:1.15rem;}
.app-sidebar-backdrop{display:none;}
@media (max-width:991.98px){
  .app-sidebar{position:fixed;left:0;top:var(--pos-topbar-h);z-index:1035;transform:translateX(-100%);width:var(--pos-sidebar-w);flex-basis:0;box-shadow:2px 0 12px rgba(0,0,0,.25);}
  body.sidebar-open .app-sidebar{transform:translateX(0);}
  body.sidebar-collapsed .app-sidebar{width:var(--pos-sidebar-w);}
  body.sidebar-collapsed .app-nav .nav-link{justify-content:flex-start;font-size:.9rem;gap:.6rem;padding:.5rem .7rem;}
  body.sidebar-collapsed .app-nav .sub-menu{display:block;}
  body.sidebar-open .app-sidebar-backdrop{display:block;position:fixed;inset:var(--pos-topbar-h) 0 0 0;background:rgba(15,23,42,.45);z-index:1030;}
  .app-brand-text{max-width:45vw;overflow:hidden;text-overflow:ellipsis;}
  .app-main{padding:1rem .75rem;}
}
/* Halaman kasir: sesuaikan tinggi area kerja dengan topbar baru */
.pos-wrap{height:calc(100vh - 140px);}
/* Tabel matriks hak akses */
.perm-table thead th{position:sticky;top:0;background:#f8fafc;z-index:2;}
.perm-table td,.perm-table th{vertical-align:middle;}