:root{
  --ui-primary:#0d6efd;
  --ui-primary-soft:#eaf2ff;
  --ui-bg:#f4f6f9;
  --ui-surface:#ffffff;
  --ui-border:#dee2e6;
  --ui-text:#212529;
  --ui-muted:#6c757d;
  --ui-radius:10px;
  --ui-shadow:0 .125rem .25rem rgba(0,0,0,.075);
}

html{min-height:100%;-webkit-text-size-adjust:100%;background:var(--ui-bg)}
body{min-height:100dvh;background:var(--ui-bg);color:var(--ui-text);overflow-x:hidden;overscroll-behavior-y:contain;-webkit-tap-highlight-color:transparent}
a{text-decoration:none}
button,a,input,select,textarea{touch-action:manipulation}
input,select,textarea{font-size:max(16px,var(--app-font-size,14px))}

/* AdminLTE shell */
.app-wrapper{min-height:100dvh}
.app-main{background:var(--ui-bg)}
.app-content{padding-bottom:1rem}
.ui-page-container{padding-bottom:1rem}
.ui-content-header{padding:.9rem 0 .65rem}
.ui-page-title{font-size:1.35rem;font-weight:700;color:#1f2937;letter-spacing:-.015em}
.ui-page-subtitle{margin-top:.2rem;color:var(--ui-muted);font-size:.85rem}
.breadcrumb{font-size:.8rem}

/* Sidebar */
.ui-sidebar{border-right:0!important}
body.sidebar-theme-dark .ui-sidebar{background:#343a40!important}
body.sidebar-theme-primary .ui-sidebar{background:linear-gradient(180deg,#0d6efd,#084298)!important}
body.sidebar-theme-light .ui-sidebar{background:#fff!important;border-right:1px solid #dee2e6!important}
body.sidebar-theme-light .ui-sidebar .sidebar-brand{border-bottom-color:#dee2e6!important}
body.sidebar-theme-light .ui-sidebar .brand-link,
body.sidebar-theme-light .ui-sidebar .brand-text,
body.sidebar-theme-light .ui-sidebar .nav-link,
body.sidebar-theme-light .ui-sidebar .nav-header{color:#495057!important}
body.sidebar-theme-light .ui-sidebar .nav-link.active{color:#fff!important;background:#0d6efd!important}
body.sidebar-theme-light .sidebar-shift-card{background:#f8f9fa;border-color:#dee2e6;color:#495057}
body.sidebar-theme-light .sidebar-shift-card small{color:#6c757d}

.sidebar-brand{min-height:57px;border-bottom:1px solid rgba(255,255,255,.1)}
.brand-link{display:flex!important;align-items:center;gap:.65rem;min-width:0;padding:.7rem .9rem!important}
.brand-image{width:34px!important;height:34px!important;min-width:34px;max-height:none!important;margin:0!important;padding:3px;border-radius:7px;object-fit:contain}
.brand-fallback{display:grid;place-items:center;background:#fff;color:#0d6efd}
.brand-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.95rem}

.sidebar-wrapper{padding:.45rem .55rem .8rem}
.sidebar-menu .nav-link{border-radius:6px;margin-bottom:2px;padding:.58rem .7rem}
.sidebar-menu .nav-link .nav-icon{font-size:.95rem;width:1.55rem;margin-right:.2rem}
.sidebar-menu .nav-link p{font-size:.88rem;font-weight:500}
.sidebar-menu .nav-link.active{box-shadow:none}
.sidebar-menu .nav-header{padding:.9rem .7rem .35rem;font-size:.68rem;font-weight:700;letter-spacing:.08em;opacity:.66}
.sidebar-menu .nav-badge{font-size:.62rem;letter-spacing:.02em}

.sidebar-shift-card{display:flex;align-items:center;gap:.65rem;margin:.25rem .25rem .55rem;padding:.65rem .7rem;border:1px solid rgba(255,255,255,.11);border-radius:8px;background:rgba(255,255,255,.06);color:#fff}
.sidebar-shift-dot{width:9px;height:9px;border-radius:50%;background:#ffc107;flex:0 0 auto}
.sidebar-shift-card.is-open .sidebar-shift-dot{background:#20c997;box-shadow:0 0 0 4px rgba(32,201,151,.14)}
.sidebar-shift-copy{min-width:0;line-height:1.15}
.sidebar-shift-copy strong{display:block;font-size:.7rem;letter-spacing:.06em}
.sidebar-shift-copy small{display:block;margin-top:2px;color:rgba(255,255,255,.65);font-size:.67rem}

/* Header */
.ui-navbar{min-height:57px;padding:.35rem .65rem;box-shadow:0 1px 2px rgba(0,0,0,.035)}
.sidebar-toggle-link{width:38px;height:38px;display:grid!important;place-items:center;border-radius:6px}
.sidebar-toggle-link:hover{background:#f1f3f5}
.navbar-brand-mini{display:grid;width:34px;height:34px;place-items:center;border:1px solid #dee2e6;border-radius:7px;background:#fff;overflow:hidden}
.navbar-brand-mini img{width:100%;height:100%;padding:3px;object-fit:contain}
.navbar-app-name{display:block;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.88rem;font-weight:600;color:#495057}
.navbar-cafe-form{height:38px;display:flex;align-items:center;gap:.45rem;padding:0 .4rem 0 .65rem;border:1px solid #dee2e6;border-radius:7px;background:#fff;color:#6c757d}
.navbar-cafe-form .form-select{width:155px;border:0!important;box-shadow:none!important;background-color:transparent;font-size:.8rem;padding-top:.2rem;padding-bottom:.2rem}
.navbar-date{display:inline-flex;align-items:center;height:38px;padding:0 .7rem;border:1px solid #dee2e6;border-radius:7px;background:#fff;color:#6c757d;font-size:.8rem}

.user-nav-link{display:flex!important;align-items:center;padding:.3rem .45rem!important;border-radius:7px}
.user-nav-link:hover{background:#f1f3f5}
.user-avatar{width:32px;height:32px;display:inline-grid;place-items:center;border-radius:50%;background:#0d6efd;color:#fff;font-size:.82rem;font-weight:700;line-height:1}
.user-avatar-lg{width:58px;height:58px;font-size:1.15rem;border:3px solid rgba(255,255,255,.35)}
.user-name-text{max-width:135px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#495057;font-size:.82rem;font-weight:600}
.user-menu .dropdown-menu{border:0}
.user-menu .user-header{padding:1rem!important}
.user-menu .user-footer{padding:.65rem!important;background:#f8f9fa}

.license-pill{height:38px;display:inline-flex;align-items:center;gap:.4rem;padding:0 .7rem;border:1px solid #dee2e6;border-radius:7px;font-size:.76rem;font-weight:600;white-space:nowrap}
.license-ok{color:#146c43;background:#d1e7dd;border-color:#badbcc}
.license-life{color:#055160;background:#cff4fc;border-color:#b6effb}
.license-warn{color:#664d03;background:#fff3cd;border-color:#ffecb5}
.license-danger{color:#842029;background:#f8d7da;border-color:#f5c2c7}
.license-alert-card{padding:.8rem;border:1px solid #ffe69c;border-radius:8px;background:#fff3cd;color:#664d03}
.license-alert-card.danger{border-color:#f5c2c7;background:#f8d7da;color:#842029}
.ui-toast-container{z-index:1085;margin-top:56px}

/* Common components: AdminLTE-like, less custom */
.card,.modern-card,.card-soft,.kpi-card,.page-hero,.toolbar,.dashv2-card,.dashv2-hero{border-radius:var(--ui-radius)!important}
.card{border:1px solid rgba(0,0,0,.125);box-shadow:var(--ui-shadow)}
.card-header{background:#fff;border-bottom:1px solid rgba(0,0,0,.125)}
.card-title{font-weight:600}
.table-responsive{border-radius:8px}
.table>thead>tr>th{font-size:.77rem;font-weight:700;color:#495057;white-space:nowrap}
.table>tbody>tr>td{vertical-align:middle}
.form-control,.form-select,.input-group-text{border-radius:6px}
.input-group>.form-control:not(:first-child),.input-group>.form-select:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}
.input-group>.input-group-text:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}
.btn{border-radius:6px}
.badge{font-weight:600}
.dropdown-menu{border-radius:8px}
.alert{border-radius:8px}
.modal-content{border-radius:10px}

/* Keep legacy page selectors compatible */
.main-content{min-width:0}
.top-navbar{position:relative}
.page-content-wrapper{min-width:0}
.btn-round{border-radius:6px!important}

/* Footer */
.ui-footer{font-size:.8rem;padding:.75rem 1rem;background:#fff;border-top:1px solid #dee2e6}

/* PWA */
.pwa-install-sheet{position:fixed;inset:0;z-index:1090;display:none;align-items:flex-end;justify-content:center;padding:16px max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:rgba(15,23,42,.56);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.pwa-install-sheet.show{display:flex}
.pwa-install-card{width:min(460px,100%);padding:20px;border:1px solid #dee2e6;border-radius:12px;background:#fff;box-shadow:0 20px 50px rgba(0,0,0,.22)}
.pwa-install-card h3{margin:0 0 8px;font-size:1.05rem;font-weight:700}
.pwa-install-card p{margin:0;color:#6c757d;line-height:1.5}
.pwa-install-actions{display:flex;gap:10px;margin-top:16px}
.pwa-install-actions .btn{min-height:44px;flex:1}
.pwa-update-toast{position:fixed;z-index:1085;left:50%;bottom:max(18px,env(safe-area-inset-bottom));width:min(420px,calc(100% - 28px));transform:translateX(-50%);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:8px;background:#212529;color:#fff;box-shadow:0 10px 30px rgba(0,0,0,.2)}
.pwa-update-toast button{border:0;border-radius:5px;padding:7px 11px;background:#0d6efd;color:#fff;font-weight:600}

/* Mobile */
@media (max-width:991.98px){
  .ui-navbar{padding-top:max(.35rem,env(safe-area-inset-top));padding-left:max(.5rem,env(safe-area-inset-left));padding-right:max(.5rem,env(safe-area-inset-right))}
  .ui-content-header{padding:.7rem 0 .45rem}
  .ui-page-title{font-size:1.15rem}
  .ui-page-subtitle{font-size:.78rem}
  .app-content{padding-bottom:max(1rem,env(safe-area-inset-bottom))}
  .btn,.form-control,.form-select,.input-group-text{min-height:42px}
  .pos-cart{top:65px!important}
}
@media (max-width:575.98px){
  .ui-page-container{padding-left:.7rem;padding-right:.7rem}
  .ui-content-header .container-fluid{padding-left:.7rem;padding-right:.7rem}
  .ui-page-title{font-size:1.08rem}
  .ui-page-subtitle{display:none}
  .card-body{padding:.85rem}
  .table-responsive{font-size:.83rem}
  .user-menu .dropdown-menu{max-width:calc(100vw - 1rem)}
}
@media (display-mode:standalone){.browser-only{display:none!important}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}

@media print{
  .app-sidebar,.app-header,.ui-content-header,.app-footer{display:none!important}
  .app-wrapper{display:block!important}
  .app-main,.app-content{display:block!important;width:100%!important;max-width:100%!important}
}


/* DG-POS 4.3 mobile/PWA polish */
:root{
  --ui-radius:12px;
  --ui-shadow:0 2px 10px rgba(15,23,42,.06);
}
.ui-page-subtitle,.page-subtitle,.pos-subtitle,.help-text,.field-hint,.hero-sub,.kpi .hint{display:none!important}
.card{border:1px solid #e7eaf0;border-radius:12px;box-shadow:var(--ui-shadow);overflow:hidden}
.card-header{background:#fff;border-bottom:1px solid #edf0f4}
.form-control,.form-select,.input-group-text,.btn{border-radius:9px}
.form-control,.form-select{min-height:42px;border-color:#dfe3e8}
.form-control:focus,.form-select:focus{border-color:#86b7fe;box-shadow:0 0 0 .18rem rgba(13,110,253,.12)}
.btn{min-height:40px;font-weight:600}
.table>:not(caption)>*>*{padding:.72rem .75rem;border-bottom-color:#edf0f4}
.table thead th{white-space:nowrap;background:#f8fafc;color:#475569;font-size:.78rem;text-transform:uppercase;letter-spacing:.02em}
.badge{font-weight:600}
.modal-content,.offcanvas{border:0;border-radius:14px;box-shadow:0 22px 50px rgba(15,23,42,.18)}

@media (max-width:767.98px){
  body{padding-bottom:env(safe-area-inset-bottom)}
  .ui-content-header{padding:.65rem 0 .45rem}
  .ui-page-title{font-size:1.18rem}
  .container-fluid{padding-left:12px;padding-right:12px}
  .card{border-radius:11px}
  .card-header,.card-body,.card-footer{padding-left:12px;padding-right:12px}
  .table-responsive{margin-left:-12px;margin-right:-12px;width:calc(100% + 24px)}
  .table-responsive .table{min-width:680px}
  .form-label{margin-bottom:.3rem;font-size:.76rem;font-weight:700;color:#64748b}
  .btn{min-height:44px}
  .btn-sm{min-height:36px}
  .pagination .page-link{min-width:36px;min-height:36px;display:grid;place-items:center}
}

@media (display-mode:standalone){
  .app-header{padding-top:env(safe-area-inset-top)}
  .app-footer{padding-bottom:env(safe-area-inset-bottom)}
}

/* DG-POS 4.6 responsive application shell */
:root{
  --ui-bg:#f5f7f8;
  --ui-surface:#fff;
  --ui-border:#e3e9e7;
  --ui-text:#17211b;
  --ui-muted:#64736b;
  --ui-primary:#17643a;
  --ui-primary-soft:#eaf5ee;
  --ui-radius:14px;
  --ui-shadow:0 8px 24px rgba(16,40,26,.055);
  color-scheme:light;
}
html{scroll-behavior:smooth;scroll-padding-top:76px}
body{
  min-width:320px;
  font-size:max(14px,var(--app-font-size,14px))!important;
  line-height:1.5;
  background:var(--ui-bg);
}
.app-wrapper{min-height:100vh;min-height:100dvh}
.app-main{min-width:0}
.app-content{padding-bottom:clamp(1rem,2vw,1.5rem)}
.ui-page-container{padding-bottom:1.25rem}
.ui-content-header{
  padding:1rem 0 .85rem;
  border-bottom:1px solid rgba(20,50,32,.06);
}
.ui-content-header .ui-page-title{font-size:clamp(1.18rem,1rem + .45vw,1.5rem)!important;font-weight:750;letter-spacing:-.025em}
.ui-content-header .ui-page-subtitle{display:block!important;margin-top:.28rem;font-size:.88rem!important;line-height:1.4;opacity:.78}
.ui-content-header .breadcrumb{font-size:.82rem}

/* Sidebar structure and tap targets */
.ui-sidebar{box-shadow:4px 0 24px rgba(9,32,18,.09)!important}
.ui-sidebar .sidebar-brand{min-height:68px;padding:.55rem .2rem}
.ui-sidebar .brand-text{font-size:.98rem;letter-spacing:.01em}
.ui-sidebar .sidebar-wrapper{padding:.55rem .6rem calc(1rem + env(safe-area-inset-bottom))}
.ui-sidebar .sidebar-menu .nav-header{margin-top:.42rem;padding:.85rem .75rem .38rem;letter-spacing:.09em;font-size:.69rem!important;line-height:1.3;opacity:.62}
.ui-sidebar .sidebar-menu .nav-item{margin:.1rem 0}
.ui-sidebar .sidebar-menu .nav-link{min-height:43px;gap:.7rem;padding:.62rem .72rem;border-radius:10px;transition:background-color .16s ease,color .16s ease,transform .16s ease}
.ui-sidebar .sidebar-menu .nav-link .nav-icon-svg{width:18px!important;height:18px!important;min-width:18px;opacity:.86}
.ui-sidebar .sidebar-menu .nav-link p{font-size:.87rem!important;font-weight:550;line-height:1.35}
.ui-sidebar .sidebar-menu .nav-link:not(.active):hover{transform:translateX(2px);background:rgba(255,255,255,.09)!important}
.ui-sidebar .sidebar-menu .nav-link.active{box-shadow:inset 3px 0 0 rgba(255,255,255,.76),0 5px 14px rgba(0,0,0,.10)}
.ui-sidebar .nav-badge{margin-left:auto!important;margin-right:0!important;border-radius:999px;padding:.27rem .48rem;font-size:.63rem}
.sidebar-shift-card{min-height:54px;border-radius:12px!important}

/* Navbar, page surfaces, controls and footer */
.ui-navbar{min-height:64px;padding:.45rem .8rem;box-shadow:0 2px 10px rgba(20,40,28,.05);z-index:1020}
.ui-navbar .sidebar-toggle-link{width:42px;height:42px;border-radius:11px}
.ui-navbar .navbar-brand-mini{width:36px;height:36px;border-radius:10px}
.ui-navbar .navbar-cafe-form,.ui-navbar .navbar-date,.ui-navbar .license-pill{min-height:40px;border-radius:10px}
.ui-navbar .user-nav-link{min-height:42px;border-radius:11px}
.ui-navbar .user-avatar{width:34px;height:34px;background:#17643a}
.ui-page-container>.container-fluid{padding-left:0;padding-right:0}
.card,.wh-card,.og-card,.debt-card,.return-card{border:1px solid var(--ui-border)!important;border-radius:var(--ui-radius)!important;box-shadow:var(--ui-shadow)!important}
.card-header{padding:.9rem 1.05rem;font-weight:650}
.card-body{padding:1.05rem}
.table>:not(caption)>*>*{padding:.76rem .8rem}
.table thead th{background:#f6f9f7;color:#526158;font-size:.74rem;letter-spacing:.045em}
.table tbody tr:last-child>*{border-bottom-width:0}
.form-label{font-size:.83rem;font-weight:650;color:#3d5145}
.form-control,.form-select{border-color:#d9e2dd;border-radius:10px;transition:border-color .15s ease,box-shadow .15s ease}
.form-control:focus,.form-select:focus{border-color:#55966d;box-shadow:0 0 0 .2rem rgba(23,100,58,.12)}
.btn{min-height:40px;border-radius:10px;font-weight:650;transition:transform .15s ease,box-shadow .15s ease}
.btn:not(:disabled):active{transform:translateY(1px)}
.btn-success{--bs-btn-bg:#17643a;--bs-btn-border-color:#17643a;--bs-btn-hover-bg:#12512e;--bs-btn-hover-border-color:#12512e;--bs-btn-active-bg:#104628}
.btn-outline-primary{--bs-btn-color:#17643a;--bs-btn-border-color:#76a889;--bs-btn-hover-bg:#17643a;--bs-btn-hover-border-color:#17643a}
.alert{border-radius:12px}
.ui-footer{display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-height:52px;padding:.75rem 1.1rem;border-top:1px solid var(--ui-border);color:#627168!important}
.ui-footer .footer-meta{font-size:.78rem;color:#78877e}
.pwa-install-card{border-radius:20px!important}
.pwa-install-actions .btn{min-height:46px}

/* Keep dense order forms usable on tablets and phones. */
.og-item{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:.7rem!important;align-items:end;padding:12px 58px 12px 12px;margin:0 0 10px!important;border:1px solid #e2ebe5;border-radius:12px;background:#f8fbf9}
.og-field{display:block;min-width:0;margin:0}
.og-field>span{display:block;margin:0 0 .32rem;color:#617168;font-size:.72rem;font-weight:700;line-height:1.3}
.og-item .product-field,.og-item .material-field{grid-column:1/-1}
.og-item .form-control,.og-item .form-select{min-width:0}
.og-item .remove-item{position:absolute;top:12px;right:12px;display:grid;place-items:center;width:40px;min-width:40px;height:40px;padding:0}
.og-card .card-header{padding:1rem 1.05rem}
.og-card .table{min-width:690px}
.wh-hero{border-radius:18px}
.wh-tabs{position:relative;z-index:1}
.wh-tabs a{min-height:40px;display:inline-flex;align-items:center;gap:.35rem;border-radius:10px}
.wh-product{border-radius:14px}

@media(max-width:1199.98px){
  .og-item{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}
  .og-item .product{grid-column:1/-1}
}
@media(max-width:991.98px){
  .ui-navbar{min-height:58px;padding-left:max(.55rem,env(safe-area-inset-left));padding-right:max(.55rem,env(safe-area-inset-right))}
  .ui-page-container{padding-left:.9rem;padding-right:.9rem}
  .ui-sidebar{width:min(86vw,320px)}
  .ui-sidebar .sidebar-wrapper{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  .ui-content-header{padding:.85rem 0 .65rem}
  .ui-content-header .ui-page-subtitle{font-size:.84rem!important}
  .ui-footer{padding-bottom:max(.75rem,env(safe-area-inset-bottom))}
}
@media(max-width:575.98px){
  .ui-page-container{padding-left:.7rem;padding-right:.7rem}
  .ui-content-header .container-fluid{padding-left:.8rem;padding-right:.8rem}
  .ui-content-header .ui-page-subtitle{display:none!important}
  .ui-page-container>.container-fluid{padding-left:0;padding-right:0}
  .card-header{padding:.8rem .9rem}
  .card-body{padding:.9rem}
  .ui-footer{align-items:flex-start;flex-direction:column;gap:.18rem;padding-left:.9rem;padding-right:.9rem}
  .og-item{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:.55rem}
  .og-item .product{grid-column:1/-1}
  .og-item input,.og-item select{font-size:16px}
  .og-card .table{min-width:660px}
  .wh-hero{padding:18px;border-radius:15px}
  .wh-tabs{flex-wrap:nowrap;overflow-x:auto;padding-bottom:.35rem;scrollbar-width:thin}
  .wh-tabs a{flex:0 0 auto}
  .wh-pos{gap:.8rem}
  .wh-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
  .wh-product{padding:.75rem .5rem}
  .wh-cart-line{grid-template-columns:minmax(0,1fr) 76px auto}
  .user-menu .dropdown-menu{max-width:calc(100vw - 1rem)}
}
@media(hover:none){
  .btn:hover,.wh-product:hover{transform:none}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important}
}


/* DG-POS 4.7.7: aturan awal sidebar; final scroll fix berada di bagian akhir. */
@media (min-width: 992px) {
  body.layout-fixed .app-sidebar.ui-sidebar {
    position: sticky !important;
    top: 0 !important;
    align-self: start !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    max-height: 100vh !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
  }
  body.layout-fixed .app-sidebar.ui-sidebar .sidebar-brand {
    flex: 0 0 68px !important;
    height: 68px !important;
    min-height: 68px !important;
  }
  body.layout-fixed .app-sidebar.ui-sidebar .sidebar-wrapper {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: calc(100vh - 68px) !important;
    height: calc(100dvh - 68px) !important;
    max-height: calc(100dvh - 68px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    background: var(--sidebar-bg) !important;
  }
}
@media (max-width: 991.98px) {
  body.layout-fixed .app-sidebar.ui-sidebar .sidebar-wrapper {
    height: calc(100vh - 68px) !important;
    height: calc(100dvh - 68px) !important;
    max-height: calc(100dvh - 68px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    background: var(--sidebar-bg) !important;
  }
}
.ui-sidebar .sidebar-menu .nav-link > .nav-icon:not(.nav-icon-svg) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 1.35rem !important;
  width: 1.35rem !important;
  min-width: 1.35rem !important;
  max-width: 1.35rem !important;
  height: 1.2rem;
  font-size: 1rem !important;
  line-height: 1 !important;
  opacity: 1 !important;
  color: var(--sidebar-text) !important;
}
.ui-sidebar .sidebar-menu .nav-link.active > .nav-icon:not(.nav-icon-svg) {
  color: var(--sidebar-active-text) !important;
}


/* DG-POS 4.7.7: stabilkan sidebar sebagai area viewport, bukan setinggi konten. */
@media (min-width: 992px) {
  body.layout-fixed.sidebar-expand-lg .app-wrapper { align-items: stretch !important; }
  body.layout-fixed .app-wrapper > .app-sidebar.ui-sidebar {
    grid-area: lte-app-sidebar !important;
    grid-row: 1 / -1 !important;
    align-self: stretch !important;
    position: sticky !important;
    inset-block-start: 0 !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    max-height: 100vh !important;
    max-height: 100dvh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    background: var(--sidebar-bg) !important;
  }
  body.layout-fixed .app-wrapper > .app-sidebar.ui-sidebar > .sidebar-wrapper {
    flex: 1 1 0 !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: thin;
    background: var(--sidebar-bg) !important;
  }
}
@media (max-width: 991.98px) {
  body.layout-fixed .app-sidebar.ui-sidebar {
    max-height: 100dvh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    background: var(--sidebar-bg) !important;
  }
  body.layout-fixed .app-sidebar.ui-sidebar > .sidebar-wrapper {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: calc(100dvh - 68px) !important;
    max-height: calc(100dvh - 68px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: contain !important;
  }
}
/* Font Awesome tidak boleh mewarisi font teks yang dipilih di Pengaturan Aplikasi. */
.ui-sidebar .nav-icon.fa-solid,
.ui-sidebar .nav-icon.fa-regular { font-family: "Font Awesome 6 Free" !important; font-weight: 900 !important; }
.ui-sidebar .nav-icon.fa-regular { font-weight: 400 !important; }
.ui-sidebar .nav-icon.fa-brands { font-family: "Font Awesome 6 Brands" !important; font-weight: 400 !important; }
.ui-sidebar, .ui-sidebar .sidebar-wrapper { background-color: var(--sidebar-bg) !important; }

/* Angka Indonesia: tampilan ribuan rapih, nilai kanonis saat input/form diproses. */
.number-id-input{text-align:right;font-variant-numeric:tabular-nums;letter-spacing:.01em}


/* DG-POS 4.7.7 — perbaikan scroll halaman dan trackpad.
   Hindari scroll bersarang pada .app-main: biarkan dokumen menjadi area scroll utama,
   sementara menu sidebar memiliki area scroll tersendiri. */
html,
body {
  height: auto !important;
  min-height: 100% !important;
  max-width: 100%;
  overflow-x: clip !important;
  overflow-y: auto !important;
  overscroll-behavior-y: auto !important;
  scroll-behavior: auto;
}
body.layout-fixed .app-wrapper {
  height: auto !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  grid-template-rows: min-content auto min-content !important;
  align-content: start !important;
  overflow: visible !important;
}
body.layout-fixed .app-wrapper > main.app-main {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  overscroll-behavior: auto !important;
  align-self: stretch !important;
}
body.layout-fixed .app-main > .app-content,
body.layout-fixed .app-main > .app-content > .container-fluid {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}
body.layout-fixed .app-wrapper > .app-sidebar.ui-sidebar {
  position: sticky !important;
  top: 0 !important;
  align-self: start !important;
  height: 100vh !important;
  height: 100dvh !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  max-height: 100vh !important;
  max-height: 100dvh !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}
body.layout-fixed .app-wrapper > .app-sidebar.ui-sidebar > .sidebar-wrapper {
  flex: 1 1 0 !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: thin;
}
@media (max-width: 991.98px) {
  body.layout-fixed .app-wrapper > .app-sidebar.ui-sidebar {
    height: 100dvh !important;
    max-height: 100dvh !important;
  }
  body.layout-fixed .app-wrapper > .app-sidebar.ui-sidebar > .sidebar-wrapper {
    height: auto !important;
    max-height: none !important;
  }
}


/* DG-POS 4.7.7: sidebar selalu mengisi tinggi viewport; menu di dalamnya dapat discroll.
   Aturan dibuat spesifik untuk layout AdminLTE dan versi cache dinaikkan. */
body.layout-fixed.sidebar-expand-lg .app-wrapper { align-items:stretch!important; }
body.layout-fixed.sidebar-expand-lg .app-wrapper > #sidebar-wrapper.app-sidebar.ui-sidebar {
  grid-area:lte-app-sidebar!important;
  grid-row:1 / -1!important;
  align-self:stretch!important;
  position:sticky!important;
  inset-block-start:0!important;
  box-sizing:border-box!important;
  height:100vh!important;
  height:100dvh!important;
  min-height:100vh!important;
  min-height:100dvh!important;
  max-height:100vh!important;
  max-height:100dvh!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}
body.layout-fixed.sidebar-expand-lg .app-wrapper > #sidebar-wrapper.app-sidebar.ui-sidebar > .sidebar-wrapper {
  flex:1 1 0%!important;
  min-height:0!important;
  height:auto!important;
  max-height:none!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior-y:contain!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-width:thin;
}
@media(max-width:991.98px){
  body.layout-fixed .app-wrapper > #sidebar-wrapper.app-sidebar.ui-sidebar {
    height:100vh!important;height:100dvh!important;max-height:100vh!important;max-height:100dvh!important;
  }
  body.layout-fixed .app-wrapper > #sidebar-wrapper.app-sidebar.ui-sidebar > .sidebar-wrapper {
    flex:1 1 0%!important;min-height:0!important;height:auto!important;max-height:none!important;
    overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch!important;
  }
}


/* DG-POS 4.8.0: background sidebar dipaksa memenuhi tinggi viewport pada desktop. */
@media (min-width: 992px) {
  html body.layout-fixed.sidebar-expand-lg .app-wrapper > #sidebar-wrapper.app-sidebar.ui-sidebar {
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    width: var(--lte-sidebar-width, 250px) !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    max-height: 100vh !important;
    max-height: 100dvh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    background: var(--sidebar-bg) !important;
    z-index: 1050 !important;
  }
  html body.layout-fixed.sidebar-expand-lg #sidebar-wrapper.app-sidebar.ui-sidebar,
  html body.layout-fixed.sidebar-expand-lg #sidebar-wrapper.app-sidebar.ui-sidebar > .sidebar-brand,
  html body.layout-fixed.sidebar-expand-lg #sidebar-wrapper.app-sidebar.ui-sidebar > .sidebar-wrapper,
  html body.layout-fixed.sidebar-expand-lg #sidebar-wrapper.app-sidebar.ui-sidebar nav,
  html body.layout-fixed.sidebar-expand-lg #sidebar-wrapper.app-sidebar.ui-sidebar .sidebar-menu {
    background-color: var(--sidebar-bg) !important;
    background-image: none !important;
  }
  html body.layout-fixed.sidebar-expand-lg #sidebar-wrapper.app-sidebar.ui-sidebar > .sidebar-wrapper {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
}

/* Master Menu pilihan rasa/sambal pada layar order dan POS. */
.dg-choice-open{overflow:hidden!important}
.dg-choice-overlay{position:fixed;inset:0;z-index:20000;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(12,24,42,.58);backdrop-filter:blur(4px)}
.dg-choice-dialog{width:min(620px,100%);max-height:min(88dvh,800px);display:flex;flex-direction:column;overflow:hidden;border:1px solid rgba(255,255,255,.45);border-radius:18px;background:#fff;box-shadow:0 24px 80px rgba(0,0,0,.25)}
.dg-choice-titlebar{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:20px 22px 16px;border-bottom:1px solid #e8edf3;background:linear-gradient(135deg,#f8fbff,#fff)}
.dg-choice-eyebrow{font-size:.68rem;font-weight:800;letter-spacing:.12em;color:#1768f2}
.dg-choice-titlebar h3{margin:4px 0 3px;font-size:1.18rem;font-weight:800;color:#152238}
.dg-choice-titlebar p{margin:0;color:#748196;font-size:.82rem}
.dg-choice-close{width:36px;height:36px;border:1px solid #e1e7ef;border-radius:10px;background:#fff;color:#5b6675;font-size:1.45rem;line-height:1}
.dg-choice-body{padding:18px 22px;overflow:auto}
.dg-choice-group+.dg-choice-group{margin-top:18px;padding-top:18px;border-top:1px solid #edf0f5}
.dg-choice-head{display:flex;flex-direction:column;gap:3px;margin-bottom:10px;color:#253247}
.dg-choice-head strong{font-size:.92rem}
.dg-choice-head small{color:#7b8798;font-size:.76rem}
.dg-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.dg-choice-item{display:flex;align-items:center;gap:9px;min-height:44px;padding:9px 11px;border:1px solid #e1e7ef;border-radius:11px;background:#fff;color:#344054;font-size:.86rem;cursor:pointer;transition:border-color .15s,background .15s}
.dg-choice-item:has(input:checked){border-color:#7aa8ff;background:#eff6ff;color:#174ea6}
.dg-choice-item input{width:17px;height:17px;flex:0 0 auto;accent-color:#1768f2}
.dg-choice-actions{display:flex;justify-content:flex-end;gap:8px;padding:14px 22px;border-top:1px solid #e8edf3;background:#fbfcfe}
.dg-cart-choice-summary{margin-top:4px;color:#1d4ed8;font-size:.73rem;line-height:1.4;overflow-wrap:anywhere}
@media(max-width:520px){.dg-choice-overlay{padding:9px;align-items:flex-end}.dg-choice-dialog{max-height:88dvh;border-radius:17px 17px 12px 12px}.dg-choice-titlebar{padding:16px 16px 12px}.dg-choice-body{padding:15px 16px}.dg-choice-actions{padding:12px 16px}.dg-choice-grid{grid-template-columns:1fr}.dg-choice-item{min-height:42px}}


/* DG-POS 4.8.1: sinkronkan lebar kolom grid dengan sidebar fixed agar konten tidak tertindih. */
@media (min-width: 992px) {
  html body.layout-fixed.sidebar-expand-lg:not(.sidebar-collapse) .app-wrapper {
    grid-template-columns: var(--lte-sidebar-width, 250px) minmax(0, 1fr) !important;
    grid-template-areas:
      "lte-app-sidebar lte-app-header"
      "lte-app-sidebar lte-app-main"
      "lte-app-sidebar lte-app-footer" !important;
  }

  html body.layout-fixed.sidebar-expand-lg:not(.sidebar-collapse) .app-wrapper > #sidebar-wrapper.app-sidebar.ui-sidebar {
    inset: 0 auto 0 0 !important;
    margin-left: 0 !important;
    transform: none !important;
    width: var(--lte-sidebar-width, 250px) !important;
    min-width: var(--lte-sidebar-width, 250px) !important;
    max-width: var(--lte-sidebar-width, 250px) !important;
  }

  html body.layout-fixed.sidebar-expand-lg:not(.sidebar-collapse) .app-wrapper > .app-header,
  html body.layout-fixed.sidebar-expand-lg:not(.sidebar-collapse) .app-wrapper > main.app-main,
  html body.layout-fixed.sidebar-expand-lg:not(.sidebar-collapse) .app-wrapper > footer.app-footer {
    grid-column: 2 / 3 !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
  }

  /* Saat sidebar ditutup, hilangkan kolom kosong dan gunakan seluruh lebar konten. */
  html body.layout-fixed.sidebar-expand-lg.sidebar-collapse:not(.sidebar-mini) .app-wrapper {
    grid-template-columns: 0 minmax(0, 1fr) !important;
  }
  html body.layout-fixed.sidebar-expand-lg.sidebar-collapse:not(.sidebar-mini) .app-wrapper > .app-header,
  html body.layout-fixed.sidebar-expand-lg.sidebar-collapse:not(.sidebar-mini) .app-wrapper > main.app-main,
  html body.layout-fixed.sidebar-expand-lg.sidebar-collapse:not(.sidebar-mini) .app-wrapper > footer.app-footer {
    grid-column: 2 / 3 !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}