:root{
  --dsg-bg:#f4f7fb;
  --dsg-surface:#ffffff;
  --dsg-text:#14213d;
  --dsg-muted:#64748b;
  --dsg-primary:#0f766e;
  --dsg-primary-2:#0ea5e9;
  --dsg-accent:#f59e0b;
  --dsg-danger:#dc2626;
  --dsg-border:#e2e8f0;
  --dsg-shadow:0 18px 45px rgba(15,23,42,.10);
  --dsg-radius:18px;
}
*{box-sizing:border-box}
body{
  min-height:100vh;
  background:
    radial-gradient(circle at top left, rgba(14,165,233,.14), transparent 30rem),
    radial-gradient(circle at bottom right, rgba(15,118,110,.16), transparent 28rem),
    var(--dsg-bg)!important;
  color:var(--dsg-text)!important;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}
a{transition:.2s ease;color:var(--dsg-primary-2)}
.btn,.form-control,.custom-select{border-radius:12px!important}
.btn{font-weight:700;box-shadow:0 8px 18px rgba(15,23,42,.08);border:0!important}
.btn-primary{background:linear-gradient(135deg,var(--dsg-primary),var(--dsg-primary-2))!important}
.btn-success{background:linear-gradient(135deg,#16a34a,#22c55e)!important}
.btn-danger{background:linear-gradient(135deg,#dc2626,#f97316)!important}
.btn-warning{background:linear-gradient(135deg,#f59e0b,#fbbf24)!important;color:#111827!important}
.form-control:focus,.custom-select:focus{border-color:var(--dsg-primary-2)!important;box-shadow:0 0 0 .2rem rgba(14,165,233,.18)!important}
.card,.table,.modal-content,.jumbotron,.list-group-item{
  border:1px solid rgba(226,232,240,.92)!important;
  border-radius:var(--dsg-radius)!important;
  box-shadow:var(--dsg-shadow)!important;
  overflow:hidden;
}
.card-header,.modal-header{background:linear-gradient(135deg,rgba(15,118,110,.10),rgba(14,165,233,.10))!important;border-bottom:1px solid var(--dsg-border)!important}
.table{background:var(--dsg-surface)!important}
.table thead th{
  background:#0f172a!important;color:#fff!important;border:0!important;
  font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;
}
.table td,.table th{vertical-align:middle!important}
.table tbody tr:hover{background:#ecfeff!important}
.sidebar{
  background:linear-gradient(180deg,#0f172a 0%,#134e4a 100%)!important;
  box-shadow:18px 0 40px rgba(15,23,42,.16);
  position:sticky;top:0;align-self:flex-start;min-height:100vh;
}
.sidebar h4,.sidebar h3{font-weight:900;letter-spacing:.02em;margin-bottom:1.25rem!important}
.sidebar a{border-radius:14px!important;margin:.18rem 0;color:rgba(255,255,255,.92)!important}
.sidebar a:hover{background:rgba(255,255,255,.13)!important;transform:translateX(4px)}
.content{width:100%;padding:28px!important}
.dashboard-header,.page-title{font-weight:900;color:#0f172a;letter-spacing:-.03em}
.dsg-shell-note{
  background:linear-gradient(135deg,#ecfeff,#f0fdf4);
  border:1px solid #bae6fd;border-radius:18px;padding:16px 18px;margin:0 0 22px;
  box-shadow:0 14px 28px rgba(15,23,42,.08);
}
.dsg-shell-note strong{color:#0f766e}
.dsg-login-body{
  display:flex!important;align-items:center;justify-content:center;padding:24px;
  background:linear-gradient(135deg,#0f172a,#134e4a 50%,#0ea5e9)!important;
}
.dsg-login-card{
  width:100%;max-width:430px;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);
  border-radius:28px;padding:34px;box-shadow:0 28px 70px rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.45)
}
.dsg-brand-badge{display:inline-flex;align-items:center;gap:10px;background:#ecfeff;color:#0f766e;border-radius:999px;padding:8px 13px;font-weight:800;font-size:.8rem;margin-bottom:18px}
.dsg-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin:18px 0 28px}
.dsg-kpi{background:#fff;border:1px solid var(--dsg-border);border-radius:20px;padding:18px;box-shadow:var(--dsg-shadow)}
.dsg-kpi small{color:var(--dsg-muted);font-weight:700;text-transform:uppercase;letter-spacing:.04em}.dsg-kpi b{font-size:1.65rem;color:#0f172a}
.dsg-fab-help{position:fixed;right:22px;bottom:22px;z-index:9999;border-radius:999px!important;padding:13px 18px!important;background:linear-gradient(135deg,var(--dsg-primary),var(--dsg-primary-2))!important;color:#fff!important;box-shadow:0 18px 40px rgba(14,165,233,.32)!important}
.alert{border-radius:16px!important;border:0!important;box-shadow:0 10px 25px rgba(15,23,42,.08)}
@media(max-width:768px){body{display:block!important}.sidebar{position:relative;min-height:auto;width:100%!important}.content{padding:18px!important}.table-responsive{border-radius:18px}}
.dsg-ajax-search{background:#fff;border:1px solid var(--dsg-border);border-radius:20px;padding:16px;box-shadow:var(--dsg-shadow)}
.dsg-search-busy{opacity:.78;pointer-events:none}.dsg-search-busy:after{content:'Memuat hasil...';display:block;margin-top:10px;color:var(--dsg-primary);font-weight:800}
#belanja-dashboard-counter,#tambah-barang-counter{display:inline-block;background:#ecfeff;border:1px solid #bae6fd;color:#0f766e;border-radius:999px;padding:8px 14px;font-weight:800}


.dsg-theme-toggle{position:fixed;right:22px;bottom:78px;z-index:9999;border-radius:999px!important;width:48px;height:48px;background:#0f172a!important;color:#fff!important}
body.dsg-dark{--dsg-bg:#08111f;--dsg-surface:#0f172a;--dsg-text:#e5eefb;--dsg-muted:#9fb0c7;--dsg-border:#22304a;background:radial-gradient(circle at top left, rgba(14,165,233,.14), transparent 30rem),#08111f!important;color:#e5eefb!important}
body.dsg-dark .card,body.dsg-dark .table,body.dsg-dark .modal-content,body.dsg-dark .list-group-item,body.dsg-dark .dsg-kpi,body.dsg-dark .dsg-ajax-search{background:#0f172a!important;color:#e5eefb!important;border-color:#22304a!important}
body.dsg-dark .table td,body.dsg-dark .table th{border-color:#22304a!important}body.dsg-dark .form-control,body.dsg-dark .custom-select{background:#101b2e!important;color:#e5eefb!important;border-color:#334155!important}body.dsg-dark .text-muted{color:#9fb0c7!important}
.dsg-app{display:flex;min-height:100vh;background:var(--dsg-bg)}
.dsg-pro-sidebar{width:260px;min-height:100vh;background:linear-gradient(180deg,#0f172a,#0f766e);color:#fff;padding:20px;position:sticky;top:0;box-shadow:18px 0 40px rgba(15,23,42,.16)}
.dsg-pro-sidebar .brand{font-size:1.05rem;font-weight:900;letter-spacing:.02em;margin-bottom:22px;padding:12px 10px;border-radius:16px;background:rgba(255,255,255,.10)}
.dsg-pro-sidebar a{display:block;color:rgba(255,255,255,.92)!important;text-decoration:none;padding:11px 13px;border-radius:14px;margin:5px 0;font-weight:700}.dsg-pro-sidebar a:hover,.dsg-pro-sidebar a.active{background:rgba(255,255,255,.14)!important;transform:translateX(4px)}
.dsg-pro-main{flex:1;padding:28px;min-width:0}.dsg-page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px}.dsg-page-head h1{font-weight:900;letter-spacing:-.04em;margin:0}.dsg-page-subtitle{color:var(--dsg-muted);margin:6px 0 0}.dsg-panel{background:#fff;border:1px solid var(--dsg-border);border-radius:22px;padding:18px;box-shadow:var(--dsg-shadow);margin-bottom:20px}.dsg-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.dsg-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.dsg-badge-soft{display:inline-block;background:#ecfeff;color:#0f766e;border:1px solid #bae6fd;border-radius:999px;padding:8px 14px;font-weight:800}.dsg-table-card{background:#fff;border:1px solid var(--dsg-border);border-radius:22px;box-shadow:var(--dsg-shadow);overflow:hidden}body.dsg-dark .dsg-panel,body.dsg-dark .dsg-table-card{background:#0f172a;border-color:#22304a}@media(max-width:900px){.dsg-app{display:block}.dsg-pro-sidebar{width:100%;min-height:auto;position:relative}.dsg-pro-main{padding:18px}}


.dsg-build-badge,.dsg-dashboard-build{display:inline-block;background:#0f172a;color:#fff;border-radius:999px;padding:7px 12px;font-size:.78rem;font-weight:900;letter-spacing:.02em;margin:0 0 14px;box-shadow:0 10px 24px rgba(15,23,42,.18)}
.dsg-dashboard-build{margin-top:10px;background:linear-gradient(135deg,#0f766e,#0ea5e9)}
body.dsg-dark .dsg-build-badge{background:#e5eefb;color:#0f172a}
/* Fix horizontal table scrolling on mobile/small screens */
.dsg-table-card.table-responsive,
.dsg-table-card .table-responsive,
.table-responsive{
  overflow-x:auto!important;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x pan-y;
}
.dsg-table-card.table-responsive table,
.dsg-table-card .table-responsive table,
.table-responsive table{
  min-width:1180px;
  width:max-content;
  max-width:none;
}
.dsg-scroll-hint{font-size:.82rem;color:var(--dsg-muted);font-weight:700;margin:8px 0 10px;display:block}
@media(max-width:900px){.dsg-table-card{border-radius:18px}.dsg-table-card:before{content:'Geser tabel ke kanan/kiri →';display:block;padding:10px 14px;background:#ecfeff;color:#0f766e;font-weight:800;border-bottom:1px solid #bae6fd}}
body.dsg-dark .dsg-table-card:before{background:#10243a;color:#7dd3fc;border-color:#22304a}


.dsg-loading-card{max-width:560px;margin:120px auto!important;background:#fff;border:1px solid var(--dsg-border);border-radius:28px;padding:36px;box-shadow:var(--dsg-shadow)}
.dsg-loading-spinner{width:58px;height:58px;border-radius:999px;border:6px solid #dbeafe;border-top-color:#0f766e;margin:0 auto 22px;animation:dsgSpin 1s linear infinite}@keyframes dsgSpin{to{transform:rotate(360deg)}}
body.dsg-dark .dsg-loading-card{background:#0f172a;border-color:#22304a}

/* DSG top toolbar controls */
.dsg-top-tools{
  position:sticky;
  top:0;
  z-index:2147483000;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:8px;
  padding:10px 14px;
  background:rgba(248,250,252,.92);
  border-bottom:1px solid rgba(226,232,240,.9);
  backdrop-filter:blur(14px);
  box-shadow:0 10px 28px rgba(15,23,42,.08);
}
.dsg-top-tool-btn{
  border-radius:999px!important;
  font-weight:800!important;
  padding:8px 13px!important;
  border:1px solid #cbd5e1!important;
  background:#fff!important;
  color:#0f172a!important;
  box-shadow:0 6px 18px rgba(15,23,42,.08);
}
.dsg-top-tool-btn:hover{background:#eff6ff!important;color:#1d4ed8!important;border-color:#93c5fd!important;}
.dsg-fab-help,.dsg-dark-toggle{display:none!important;}
body.dsg-dark .dsg-top-tools{background:rgba(15,23,42,.92);border-bottom-color:rgba(51,65,85,.9);}
body.dsg-dark .dsg-top-tool-btn{background:#1e293b!important;color:#e2e8f0!important;border-color:#334155!important;}
body.dsg-dark .dsg-top-tool-btn:hover{background:#0f172a!important;color:#93c5fd!important;border-color:#60a5fa!important;}

/* Sidebar / panel hide mode. Covers common legacy panel/sidebar names used in the migrated app. */
body.dsg-sidebar-hidden aside,
body.dsg-sidebar-hidden .sidebar,
body.dsg-sidebar-hidden .side-bar,
body.dsg-sidebar-hidden .sidenav,
body.dsg-sidebar-hidden .side-nav,
body.dsg-sidebar-hidden .vertical-menu,
body.dsg-sidebar-hidden .left-panel,
body.dsg-sidebar-hidden .admin-sidebar,
body.dsg-sidebar-hidden .dsg-sidebar,
body.dsg-sidebar-hidden nav.sidebar,
body.dsg-sidebar-hidden #sidebar,
body.dsg-sidebar-hidden #sideBar,
body.dsg-sidebar-hidden #sidenav,
body.dsg-sidebar-hidden #sideNav,
body.dsg-sidebar-hidden #left-panel{
  display:none!important;
}
body.dsg-sidebar-hidden .main-content,
body.dsg-sidebar-hidden .content,
body.dsg-sidebar-hidden .page-content,
body.dsg-sidebar-hidden .container,
body.dsg-sidebar-hidden .container-fluid{
  max-width:100%!important;
}
@media(max-width:640px){.dsg-top-tools{justify-content:center;flex-wrap:wrap}.dsg-top-tool-btn{font-size:12px!important;padding:7px 10px!important}}

/* toolbar2: compact fixed top-right controls, no layout disruption */
body .dsg-top-tools{
  position:fixed!important;
  top:12px!important;
  right:18px!important;
  left:auto!important;
  bottom:auto!important;
  z-index:2147483640!important;
  width:auto!important;
  max-width:calc(100vw - 36px)!important;
  display:flex!important;
  flex-direction:row!important;
  justify-content:flex-end!important;
  align-items:center!important;
  gap:6px!important;
  padding:6px!important;
  margin:0!important;
  background:rgba(255,255,255,.88)!important;
  border:1px solid rgba(203,213,225,.9)!important;
  border-radius:999px!important;
  box-shadow:0 12px 28px rgba(15,23,42,.14)!important;
  backdrop-filter:blur(12px)!important;
}
body .dsg-top-tools .dsg-top-tool-btn{
  width:auto!important;
  min-width:0!important;
  height:auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  border-radius:999px!important;
  padding:6px 10px!important;
  margin:0!important;
  font-size:12px!important;
  line-height:1.2!important;
  font-weight:800!important;
  white-space:nowrap!important;
  transform:none!important;
}
body.dsg-dark .dsg-top-tools{background:rgba(15,23,42,.88)!important;border-color:rgba(51,65,85,.95)!important;}
body.dsg-sidebar-hidden .sidebar{display:none!important;}
body.dsg-sidebar-hidden .content{width:100%!important;max-width:100%!important;flex:1 1 auto!important;}
@media(max-width:720px){body .dsg-top-tools{top:8px!important;right:8px!important;max-width:calc(100vw - 16px)!important;overflow-x:auto!important;border-radius:18px!important}body .dsg-top-tools .dsg-top-tool-btn{font-size:11px!important;padding:6px 8px!important}}