/* BEWOK LGM / Dark Premium - Elegant Clean - Minimalist Premium (Option D)
   Brand-only presentation layer. Functional layout, content, and business logic unchanged. */
:root {
  color-scheme:dark;
  --paper:#0b0b0c;
  --card:#151719;
  --ink:#f4f0e7;
  --ink-soft:#d3cfc5;
  --muted:#aaa69d;
  --slate:#b7b0a3;
  --primary:#d4af37;
  --primary-dark:#f0c85b;
  --primary-tint:#292315;
  --primary-soft:#201d17;
  --amber:#e1b94b;
  --amber-tint:#2b2417;
  --coral:#e47d73;
  --coral-tint:#301e1e;
  --line:#39352e;
  --line-soft:#292720;
  --bg-start:#090a0c;
  --bg-end:#111315;
  --ui-green:#d4af37; --ui-blue:#d4af37; --ui-cyan:#d4af37;
  --ui-amber:#d4af37; --ui-purple:#d4af37; --ui-coral:#d4af37;
  --ui-green-light:#242018; --ui-blue-light:#242018; --ui-cyan-light:#242018;
  --ui-amber-light:#242018; --ui-purple-light:#242018; --ui-coral-light:#242018;
  --shadow:0 12px 30px rgba(0,0,0,.35);
  --shadow-soft:0 4px 16px rgba(0,0,0,.27);
  --shadow-3d:0 10px 26px rgba(0,0,0,.34);
  --shadow-3d-soft:0 3px 12px rgba(0,0,0,.26);
  --shadow-pressed:inset 0 2px 7px rgba(0,0,0,.32);
}
html,body{background:#0b0b0c!important;color:var(--ink)}
body{background:linear-gradient(145deg,#0b0b0d 0%,#111316 65%,#090a0c 100%)!important}
.auth-screen{background:radial-gradient(ellipse at 50% 27%,rgba(203,160,55,.10),transparent 48%)}
.auth-shell{width:min(440px,100%)}
.auth-brand{justify-content:center;gap:15px;margin-bottom:23px}
.auth-brand h1{color:#f8f2e2;letter-spacing:.025em}
.auth-brand p{max-width:280px;color:#aaa59a;font-size:11.5px;line-height:1.4}
.auth-brand .brand-kicker{color:var(--primary);font-size:9px;letter-spacing:.12em}
.brand-mark,.side-brand,.mobile-brand{
  background:#0e1012!important;
  border:1px solid rgba(212,175,55,.32)!important;
  box-shadow:0 5px 18px rgba(0,0,0,.35)!important;
}
.brand-mark{width:77px;height:77px;border-radius:16px}
.brand-mark img{width:72px;height:72px;object-fit:contain}
.side-brand img{width:56px;height:56px}
.mobile-brand img{width:39px;height:39px}
.side-brand,.mobile-brand{border-radius:13px}
.side-nav,.topbar,.bottom-dock{
  background:#111315!important;
  border:1px solid #302c22!important;
  box-shadow:0 8px 28px rgba(0,0,0,.30)!important;
}
.side-nav{border-radius:17px}
.side-brand-copy strong{color:var(--primary);letter-spacing:.03em}
.side-brand-copy small{color:var(--muted)}
.topbar{border-radius:15px}
.top-kicker,.section-kicker,.brand-kicker{color:var(--primary)!important}
.nav-item{color:#c5c1b8!important;border:1px solid transparent!important;border-radius:10px}
.nav-item svg{filter:none!important}
.nav-item:hover{background:#211e17!important;color:#f2d27b!important;box-shadow:none!important}
.nav-item.active{
  background:linear-gradient(90deg,#e3bd59,#b98a22)!important;
  border-color:#e8bf60!important;
  color:#17130a!important;
  box-shadow:none!important;
}
.nav-item.active svg{color:#17130a!important}
.icon-btn,.local-chip,.status-badge{
  background:#1c1e20!important;
  border:1px solid #39352b!important;
  color:#e7dfcb!important;
  box-shadow:none!important;
}
.icon-btn:hover{background:#2c271c!important;color:#f0c85b!important;border-color:#806a36!important}
.local-chip i,.status-badge i{background:#d4af37!important}
.workspace-panel,.auth-card,.pdf-panel,.sheet-panel{
  background:#151719!important;
  border:1px solid #363127!important;
  box-shadow:0 10px 30px rgba(0,0,0,.26)!important;
  color:var(--ink);
}
.auth-card{border-radius:18px;padding:27px 25px}
.auth-heading h2,.page-head h1,.section-title h3,.sheet-head h3{color:#f5f1e8!important}
.page-head,.section-block,.settings-item{border-color:#39352e!important}
label,.auth-card label,.sheet-panel label{color:#d2cbc0!important}
.field, input.field,select.field,textarea.field,
input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea{
  background:#101214!important;
  color:#f2efe6!important;
  border-color:#444035!important;
  box-shadow:none!important;
}
.field::placeholder,input::placeholder,textarea::placeholder{color:#8c887e!important;opacity:1}
.field:hover,input:hover,select:hover,textarea:hover{border-color:#817048!important}
.field:focus,input:focus,select:focus,textarea:focus{
  background:#131518!important;
  border-color:#d4af37!important;
  box-shadow:0 0 0 2px rgba(212,175,55,.14)!important;
  outline:none;
}
input[type=checkbox],input[type=radio]{accent-color:#d4af37}
option{background:#151719;color:#f2efe6}
.primary,.auth-card .primary{
  background:linear-gradient(120deg,#eccd70,#c99d35)!important;
  color:#1a150b!important;
  border:1px solid #dfbc62!important;
  box-shadow:none!important;
  border-radius:11px;
  font-weight:850;
}
.primary:hover{background:linear-gradient(120deg,#ffe18c,#d8ac46)!important;filter:none!important}
.primary:disabled,.soft:disabled{opacity:.43!important;cursor:not-allowed!important;box-shadow:none!important}
.soft,.mini-btn,.segmented button.active{
  background:#29251c!important;
  color:#ebcb75!important;
  border:1px solid #5e5134!important;
  box-shadow:none!important;
}
.soft:hover,.mini-btn:hover{background:#38301d!important}
.danger{background:#9f3c35!important;color:#fff!important;box-shadow:none!important}
.ghost{color:#c5bca8!important}
.auth-eye{background:transparent!important;border:0!important;color:#bbb5a7!important}
.auth-eye:hover,.auth-eye:focus-visible{background:#262318!important;color:#edc76b!important}
.auth-text-link{color:#e0bd67!important}
.auth-help{color:var(--muted)!important}
.kpi,.finance-summary-card,#page-boss .boss-summary-card,.operations-summary-card,
#page-boss .boss-balance-card,.customer-stat-card,.customer-detail-stat,
.dashboard-stat,.overview-card{
  background:linear-gradient(145deg,#1e2022,#151719)!important;
  color:#f4f0e7!important;
  border:1px solid #393329!important;
  box-shadow:none!important;
  border-radius:12px;
}
.kpi::after{display:none!important}
.kpi small,.kpi strong,.finance-summary-card span,.finance-summary-card small,
#page-boss .boss-summary-card span,#page-boss .boss-summary-card small,
.operations-summary-card span,.operations-summary-card small,
#page-boss .boss-balance-card span{color:#b9b3a7!important}
.kpi strong,.finance-summary-card strong,#page-boss .boss-summary-card strong,
.operations-summary-card strong,#page-boss .boss-balance-title,#page-boss .boss-balance-value,
#page-boss .boss-balance-details b{color:#f5f1e7!important}
.kpi strong,.finance-summary-card strong,#page-boss .boss-summary-card strong,.operations-summary-card strong{font-variant-numeric:tabular-nums}
.process-flow span,.metric-strip,.item-row,.list-row,.segmented,
.menu-option,.correction-box,.summary-card,.customer-summary-card,
.receipt-summary-grid,.customer-history-row,.record-detail-row,
#dismantleOutputs .dismantle-output-row{
  background:#1b1d20!important;
  color:#f1ede3!important;
  border:1px solid #39352d!important;
  box-shadow:none!important;
}
.process-flow span i,.menu-option-icon{
  background:#29251b!important;
  color:#d4af37!important;
  border:1px solid #57482b!important;
  box-shadow:none!important;
}
.process-flow span{color:#e3c678!important}
.list-row small,.menu-option small,.settings-item small{color:var(--muted)!important}
.menu-option:hover{background:#29251b!important;border-color:#a3843b!important;transform:none!important}
.menu-grid-operations>.menu-option:last-child{background:#1b1d20!important}
.menu-option strong,.list-row strong{color:#eee8dc!important}
.segmented{background:#121416!important}
.segmented button{color:#aca79d!important}
.segmented button.active{color:#f2d27b!important}
.badge.ok{background:#23372c!important;color:#a9e2be!important}
.badge.warn{background:#393021!important;color:#f0c66e!important}
.badge.blue{background:#202e37!important;color:#a9c8df!important}
.badge{border:1px solid #3e392d}
.sheet-scrim,.modal{background:rgba(0,0,0,.74)!important}
.sheet-handle{background:#625436!important}
.menu-option-icon svg{color:inherit}
.pdf-icon{background:#d4af37!important;color:#15110b!important}
.pdf-panel p,.sheet-panel p{color:#b8b1a6!important}
.pdf-browser-frame{background:white!important}
.toast{background:#262217!important;color:#ffe5a3!important;border:1px solid #7f6328}
/* Tabular data / record summaries / modal table surfaces */
.table-wrap,.customer-table-wrap,.history-table-wrap,.record-detail-table,
table,thead,tbody,tr,th,td{
  border-color:#39352e!important;
}
th,thead tr{background:#24231f!important;color:#ebc973!important}
td,tbody tr{background:#151719!important;color:#e4ded3!important}
tbody tr:nth-child(even) td{background:#1b1c1e!important}
tr:hover td{background:#242119!important}
#page-boss .boss-balance-details{border-top-color:#39352e!important}
#page-boss .boss-balance-details span{color:#beb9ae!important}
#page-boss .boss-balance-status.negative,#page-boss .boss-balance-value.negative{color:#ffaaa0!important}
#page-boss .boss-balance-status.positive,#page-boss .boss-balance-value.positive{color:#a7e0b8!important}
/* Specific panels with hard-coded mint/white from inherited styles */
.customer-page,.customer-stat-grid>*,.customer-filter-bar,.customer-custom-range,
.customer-detail-panel,.customer-detail-panel .sheet-panel,
.record-detail-panel,.record-detail-card,.history-card,.list-actions .mini-btn,
.finance-entry-panel,.finance-action-buttons,.finance-overview-grid,
.boss-balance-grid,.product-entry-panel,.dismantle-result-summary span,
#receiptEntryPanel,#incomeEntryPanel,#financeEntryPanel{
  color:var(--ink)!important;
}
.dismantle-result-summary span{
  background:#29251b!important;border-color:#514530!important;color:#e6ca8b!important;
}
/* Readable links without recoloring danger/success meaning */
a{color:#edc96e}
a:hover{color:#ffe29b}
:focus-visible{outline:2px solid #d4af37;outline-offset:2px}
@media(max-width:767px){
 .bottom-dock{background:#111315!important}
 .nav-item.active{border-color:#e8bf60!important}
 .auth-brand{gap:12px}
 .brand-mark{width:68px;height:68px}
 .brand-mark img{width:64px;height:64px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Pemberian bon dari detail Pelanggan (bukan Data Master). */
.customer-bon-actions{display:flex;justify-content:flex-start;gap:10px;flex-wrap:wrap;margin:0 0 12px}
.customer-bon-actions button{min-height:40px;min-width:145px}.customer-bon-actions button:disabled{opacity:.5;cursor:not-allowed}
.customer-bon-form{padding:15px;margin:0 0 15px;background:#1b1d20;border:1px solid #514530;border-radius:12px;box-shadow:none}
.customer-bon-form .section-title{margin:0 0 12px}
.customer-bon-form .button-row{margin-top:12px}.customer-debt-outstanding{margin:0 0 12px;font-size:12px;color:var(--text-muted,#bcb8ad)}.customer-debt-outstanding strong{color:#f0c65c}
.customer-bon-form button:disabled{opacity:.55;cursor:wait}
@media(max-width:560px){.customer-bon-actions button{flex:1 1 145px;min-width:0}.customer-bon-form .form-grid.two{grid-template-columns:1fr}.customer-bon-form .button-row>button{flex:1 1 auto}}


/* === BEWOK LGM | SEMI 3D PREMIUM ICON SYSTEM (approved visual) ===
   Scoped to icons, navigation and card presentation; no application logic changes.
   SVGs are self-contained and bundled locally (no remote icon libraries). */
:root { --bevel-edge:#947230; --metal-glow:rgba(245,189,63,.18) }
.side-nav{border-color:#514022!important;box-shadow:0 14px 36px rgba(0,0,0,.47),inset 0 1px 0 rgba(255,216,120,.075)!important}
.side-brand{width:65px;height:65px;margin-inline:auto;margin-bottom:9px!important;border-radius:17px!important;background:radial-gradient(circle at 32% 25%,#24211b,#0a0b0d 74%)!important;border-color:#775a26!important;box-shadow:0 5px 15px #0009,inset 0 1px 0 #ffdf7344!important}
.side-brand img{width:57px;height:57px;object-fit:contain}
.side-brand-copy{text-align:center;padding:0 2px 13px}
.side-brand-copy strong{font-size:14px;letter-spacing:.06em}
.side-icons{gap:5px}
.side-icons .nav-item,.side-bottom .nav-item{min-height:53px;gap:11px;padding-left:9px;padding-right:8px;font-weight:750;letter-spacing:.005em;isolation:isolate}
.nav-item .nav-glyph{display:grid;place-items:center;flex:0 0 37px;width:37px;height:37px;border-radius:11px;background:linear-gradient(145deg,#2d2b28,#101112 80%);border:1px solid #51432e;box-shadow:0 3px 7px #0008,inset 0 1px 0 #fff2,inset 0 -1px 0 #0009;transition:box-shadow .16s,border-color .16s,transform .16s}
.nav-item .nav-glyph img{width:29px;height:29px;display:block;object-fit:contain;filter:drop-shadow(0 1px 2px #0009)}
.nav-item:hover{background:linear-gradient(90deg,#28231b,#18191a)!important;color:#ffe3a2!important;border-color:#57462a!important;box-shadow:inset 0 1px 0 #ffdb6321!important}
.nav-item:hover .nav-glyph{border-color:#c39641;transform:translateY(-1px);box-shadow:0 4px 10px #000a,0 0 12px #d6a73a31,inset 0 1px 0 #f7d4875e}
.nav-item.active{background:linear-gradient(105deg,#ffe18a 0%,#e4b845 32%,#b78020 70%,#e1ad3a 100%)!important;border-color:#ffdf86!important;color:#1b1306!important;box-shadow:0 3px 8px #0008,inset 0 1px 0 #fff9,inset 0 -2px 2px #70450d50!important}
.nav-item.active .nav-glyph{background:linear-gradient(145deg,#40301b,#171715)!important;border-color:#6b4f22;box-shadow:0 3px 7px #0007,inset 0 1px 0 #ffdc6c38}
.nav-item.active .nav-glyph img{filter:drop-shadow(0 1px 1px #0008)}
.icon-btn{background:linear-gradient(145deg,#292927,#111315)!important;border-color:#53452f!important;border-radius:13px;box-shadow:0 4px 8px #0008,inset 0 1px 0 #fff2!important;transition:transform .12s,border-color .12s,box-shadow .12s}
.icon-btn .premium-control-icon{width:28px;height:28px;object-fit:contain;display:block;filter:drop-shadow(0 1px 1px #0009)}
.icon-btn:hover{background:linear-gradient(145deg,#3b3121,#171717)!important;border-color:#cdab5e!important;box-shadow:0 5px 13px #0009,0 0 14px #dbab4530!important}
.icon-btn:active{transform:translateY(1px)}
.auth-eye img{display:block;width:22px;height:22px;object-fit:contain}
.auth-eye[aria-pressed="true"] img{filter:brightness(1.2)}
/* Popup icon tiles */
.menu-grid{gap:10px}
.menu-option{min-width:0;min-height:90px;padding:12px 10px;grid-template-columns:49px minmax(0,1fr);border-radius:15px!important;background:linear-gradient(150deg,#222326,#131517)!important;border:1px solid #54462e!important;box-shadow:0 6px 13px #0007,inset 0 1px 0 #ffe9ae17!important;transition:transform .14s,border-color .14s,box-shadow .14s}
.menu-option .menu-option-icon{width:49px;height:49px;border-radius:13px;background:linear-gradient(145deg,#34302b,#161616)!important;border:1px solid #6b542c!important;box-shadow:0 3px 8px #0009,inset 0 1px 0 #ffe8a037!important}
.menu-option-icon img{display:block;width:39px;height:39px;object-fit:contain;filter:drop-shadow(0 2px 2px #0006)}
.menu-option:hover{background:linear-gradient(145deg,#2a241b,#18191c)!important;transform:translateY(-1px)!important;border-color:#bb9545!important;box-shadow:0 8px 18px #0008,0 0 0 1px #9c722740!important}
.menu-option:active{transform:translateY(1px)!important}
.menu-option strong{line-height:1.25}
.menu-option small{line-height:1.35}
/* Dashboard KPIs: textured gold icons on restrained dark cards */
.kpi{display:flex;gap:12px;align-items:center;padding:14px!important;min-height:104px!important;background:linear-gradient(150deg,#202124,#101214)!important;border:1px solid #53452d!important;box-shadow:0 6px 15px #0005,inset 0 1px 0 #ffe6a418!important;overflow:hidden}
.kpi .kpi-symbol{width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;border-radius:13px;background:linear-gradient(145deg,#3a3326,#141517);border:1px solid #74582e;box-shadow:0 3px 11px #0008,inset 0 1px 0 #ffda793e}
.kpi .kpi-symbol img{width:41px;height:41px;object-fit:contain;filter:drop-shadow(0 1px 2px #0008)}
.kpi .kpi-text{min-width:0;flex:1}
.kpi .kpi-text small{display:block;font-size:10px;line-height:1.45;opacity:1!important;color:#c5bfb3!important}
.kpi .kpi-text strong{display:block;margin-top:4px;font-size:clamp(14px,1.45vw,19px);line-height:1.25;color:#fff8e8!important;overflow-wrap:anywhere}
/* Overview cards also share metallic icon language */
.operations-summary-card{position:relative;padding:13px 12px 13px 59px!important;justify-content:center;gap:5px;min-height:108px!important;border-color:#4c3b25!important;box-shadow:0 5px 11px #0006,inset 0 1px 0 #fff1!important}
.operations-summary-card .overview-3d-icon{position:absolute;left:10px;top:calc(50% - 20px);width:40px;height:40px;object-fit:contain;filter:drop-shadow(0 2px 2px #0008)}
.operations-summary-card span{font-size:10px}
.operations-summary-card strong{font-size:clamp(13px,1.3vw,18px)}
/* Existing customer, finance, and boss statistic cards receive matching emblem icons (no JS logic edits). */
.customer-stat-card,.finance-summary-card,#page-boss .boss-summary-card{position:relative;padding-left:56px!important;min-height:102px!important;justify-content:center}
.customer-stat-card::before,.finance-summary-card::before,#page-boss .boss-summary-card::before{content:"";position:absolute;left:10px;top:calc(50% - 19px);width:38px;height:38px;display:block;background:center/contain no-repeat url('icons/wallet.svg');filter:drop-shadow(0 2px 2px #0008)}
.customer-stat-card:nth-child(4n+1)::before{background-image:url('icons/customers.svg')}
.customer-stat-card:nth-child(4n+2)::before{background-image:url('icons/activity.svg')}
.customer-stat-card:nth-child(4n+3)::before{background-image:url('icons/receive.svg')}
.customer-stat-card:nth-child(4n+4)::before{background-image:url('icons/wallet.svg')}
.finance-summary-card:nth-child(5n+1)::before{background-image:url('icons/wallet.svg')}
.finance-summary-card:nth-child(5n+2)::before{background-image:url('icons/cash-in.svg')}
.finance-summary-card:nth-child(5n+3)::before{background-image:url('icons/cash-out.svg')}
.finance-summary-card:nth-child(5n+4)::before{background-image:url('icons/debt.svg')}
.finance-summary-card:nth-child(5n+5)::before{background-image:url('icons/profit.svg')}
#page-boss .boss-summary-card:nth-child(4n+1)::before{background-image:url('icons/boss.svg')}
#page-boss .boss-summary-card:nth-child(4n+2)::before{background-image:url('icons/shipment.svg')}
#page-boss .boss-summary-card:nth-child(4n+3)::before{background-image:url('icons/cash-in.svg')}
#page-boss .boss-summary-card:nth-child(4n+4)::before{background-image:url('icons/profit.svg')}
/* Search icons are drawn from the same vector family. */
.premium-search-icon{width:21px;height:21px;object-fit:contain;flex:0 0 21px;display:block}
.data-search img.premium-search-icon,.customer-search-wrap img.premium-search-icon{width:21px;height:21px;flex:0 0 21px}
/* Compact desktop: glyph centered and labels hidden as before. */
@media(min-width:768px) and (max-width:1100px){
 .side-brand{width:61px;height:61px;margin-inline:auto!important}.side-brand img{width:54px;height:54px}
 .side-icons .nav-item,.side-bottom .nav-item{width:55px;height:53px;padding:0;display:grid;place-items:center}
 .nav-item .nav-glyph{width:40px;height:40px;flex-basis:40px}
}
/* Mobile dock remains five shortcuts with 3D glyphs, no horizontal overflow. */
@media(max-width:767px){
 .bottom-dock .nav-item{display:flex;flex-direction:column;justify-content:center;gap:2px;padding:6px 1px!important;min-width:0;overflow:visible}
 .bottom-dock .nav-item .nav-glyph{width:33px;height:31px;flex:0 0 31px;border-radius:9px}
 .bottom-dock .nav-item .nav-glyph img{width:26px;height:26px}
 .bottom-dock .nav-item span:last-child{font-size:9px;line-height:1.18;max-width:100%;text-overflow:clip}
 .kpi{gap:7px;padding:11px 9px!important;min-height:100px!important}
 .kpi .kpi-symbol{width:36px;height:36px;flex-basis:36px;border-radius:10px}
 .kpi .kpi-symbol img{width:31px;height:31px}
 .kpi .kpi-text strong{font-size:14px}
 .customer-stat-card,.finance-summary-card,#page-boss .boss-summary-card{padding-left:48px!important}
 .customer-stat-card::before,.finance-summary-card::before,#page-boss .boss-summary-card::before{left:7px;width:34px;height:34px}
}
@media(max-width:390px){
 .bottom-dock .nav-item span:last-child{font-size:8px}
 .kpi{flex-direction:column;align-items:flex-start}
 .kpi .kpi-text strong{font-size:14px}
 .menu-option{grid-template-columns:42px minmax(0,1fr);gap:7px;padding:9px 7px}
 .menu-option .menu-option-icon{width:41px;height:41px}
 .menu-option-icon img{width:34px;height:34px}
}
@media(prefers-reduced-motion:reduce){.nav-item .nav-glyph,.icon-btn,.menu-option{transition:none!important}}

/* Pelanggan: dropdown Periode + pencarian horizontal, sesuai ACC. */
.customer-filter-bar{max-width:100%;align-items:end}
.customer-period-label .field,.customer-search-wrap .field{border:1px solid #514530!important;border-radius:11px!important;background:#101214!important;box-shadow:none!important;min-height:42px}
.customer-period-label .field{cursor:pointer;padding:0 34px 0 13px;color:#f0cc76!important}
.customer-search-wrap img.premium-search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);pointer-events:none;z-index:1}
.customer-search-wrap .field{padding-left:43px}
.customer-filter-section .customer-custom-range{margin-top:10px}
@media(max-width:560px){.customer-filter-bar{grid-template-columns:1fr;gap:10px}}

/* Shared list filters: consistent horizontal alignment and non-flow search glyph. */
.data-toolbar{align-items:center;column-gap:8px;row-gap:8px}
.data-toolbar>.data-tool-select,
.data-toolbar>.data-search,
.data-toolbar>.data-reset{box-sizing:border-box;align-self:center;height:42px;min-height:42px;margin:0}
.data-toolbar>.data-tool-select{flex:0 1 160px;width:160px;min-width:0;max-width:190px}
.data-toolbar>.data-search{position:relative;display:flex;align-items:center;flex:1 1 220px;min-width:140px}
.data-toolbar>.data-search input{box-sizing:border-box;width:100%;height:42px;min-height:42px;padding-left:43px;margin:0}
.data-toolbar>.data-search img.premium-search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);pointer-events:none;z-index:1;margin:0}
.data-toolbar>.data-reset{flex:0 0 76px;width:76px;padding:0 8px}
@media(max-width:760px){
 .data-toolbar{align-items:stretch}
 .data-toolbar>.data-tool-select{width:100%;max-width:100%}
 .data-toolbar>.data-search{width:100%;min-width:0;grid-column:1/-1}
 .data-toolbar>.data-reset{width:100%;grid-column:1/-1}
}

/* Saldo hutang/piutang: empat jenis saldo berbeda, memakai kartu keuangan yang sama. */
#financeDebtCards .finance-summary-card:nth-child(1)::before{background-image:url('icons/customers.svg')}
#financeDebtCards .finance-summary-card:nth-child(2)::before{background-image:url('icons/boss.svg')}
#financeDebtCards .finance-summary-card:nth-child(3)::before{background-image:url('icons/debt.svg')}
#financeDebtCards .finance-summary-card:nth-child(4)::before{background-image:url('icons/wallet.svg')}

/* Kelola Akun: concise Settings card and single-form Black & Gold dialog. */
#ownerLoginSecurity .owner-security-summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px;border:1px solid #39352e;border-radius:14px;background:#191b1d;min-width:0}
#ownerLoginSecurity .owner-security-summary>div{min-width:0}
#ownerLoginSecurity .owner-security-summary strong{display:block;color:#f2e8ce;font-size:13px}
#ownerLoginSecurity .owner-security-summary small{display:block;margin-top:5px;color:#aaa69d;font-size:11px;line-height:1.5}
#ownerLoginSecurity #openOwnerAccountSheet{min-width:135px;flex-shrink:0}
#ownerAccountSheet .owner-account-panel{width:min(510px,100%);overflow-y:auto;overscroll-behavior:contain}
#ownerAccountSheet .owner-account-choices{display:grid;gap:10px}
#ownerAccountSheet .owner-account-choices button{width:100%;min-height:68px;padding:13px 16px;text-align:left;border-radius:13px;border:1px solid #51432a;background:linear-gradient(145deg,#23221e,#17191b);color:#edd49a;box-shadow:0 6px 13px rgba(0,0,0,.22)}
#ownerAccountSheet .owner-account-choices button:hover,#ownerAccountSheet .owner-account-choices button:focus-visible{border-color:#d4af37;background:#29251d}
#ownerAccountSheet .owner-account-choices button strong{display:block;font-size:13px}
#ownerAccountSheet .owner-account-choices button small{display:block;color:#b5ad9d;font-size:11px;margin-top:4px;line-height:1.4}
#ownerAccountSheet .owner-account-form-panel{min-width:0}
#ownerAccountSheet .owner-account-form-content{margin-top:15px}
#ownerAccountSheet .owner-account-back{width:100%;font-size:12px;min-height:38px}
#ownerAccountSheet .owner-account-form{min-width:0}
#ownerAccountSheet .owner-account-form strong{color:#f4e6bf}
#ownerAccountSheet .owner-account-form small{line-height:1.5;color:#b8b1a6}
@media(max-width:560px){#ownerLoginSecurity .owner-security-summary{flex-direction:column;align-items:stretch}#ownerLoginSecurity #openOwnerAccountSheet{width:100%}}


/* Dashboard charts replace unused process flow. */
.dashboard-chart-grid{display:grid;grid-template-columns:1.45fr 1fr;gap:16px;margin-top:16px}
.dashboard-chart-card .section-title p{margin:.35rem 0 0;color:var(--muted);font-size:.92rem}
.dashboard-chart-body{min-height:320px}
.dashboard-chart-empty{display:flex;align-items:center;justify-content:center;min-height:260px;border:1px dashed #4b4438;border-radius:14px;background:#17191b;color:#b7af9f;text-align:center;padding:18px}
.dashboard-trend-wrap,.dashboard-donut-wrap{display:flex;flex-direction:column;gap:14px}
.dashboard-chart-legend{display:flex;gap:14px;flex-wrap:wrap}
.dashboard-chart-legend span{display:inline-flex;align-items:center;gap:8px;color:#dcd5c8;font-size:.92rem}
.dashboard-chart-legend i{display:inline-block;width:12px;height:12px;border-radius:999px;box-shadow:0 0 0 1px rgba(255,255,255,.08) inset}
.dashboard-trend-svg{width:100%;height:auto;display:block}
.dashboard-trend-axis{stroke:#403a2f;stroke-width:1}
.dashboard-trend-grid{stroke:#312c24;stroke-width:1;stroke-dasharray:4 6}
.dashboard-trend-label{fill:#bdb5a8;font-size:11px}
.dashboard-trend-value{fill:#d8d1c4;font-size:10px}
.dashboard-trend-line-purchase{fill:none;stroke:#d4af37;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
.dashboard-trend-line-sales{fill:none;stroke:#6d7cff;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
.dashboard-trend-area-purchase{fill:rgba(212,175,55,.10)}
.dashboard-trend-area-sales{fill:rgba(109,124,255,.08)}
.dashboard-trend-point-purchase{fill:#d4af37;stroke:#fff4c8;stroke-width:1.5}
.dashboard-trend-point-sales{fill:#6d7cff;stroke:#d9e0ff;stroke-width:1.5}
.dashboard-donut-wrap{display:grid;grid-template-columns:minmax(210px,260px) 1fr;align-items:center;gap:18px}
.dashboard-donut-visual{position:relative;display:flex;align-items:center;justify-content:center;min-height:260px}
.dashboard-donut-svg{width:100%;max-width:250px;height:auto;display:block;transform:rotate(-90deg)}
.dashboard-donut-center{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:4px;width:124px;height:124px;border-radius:999px;background:#101215;border:1px solid #3b3428;box-shadow:inset 0 0 0 1px rgba(255,255,255,.03)}
.dashboard-donut-center strong{font-size:1.2rem;color:#f3eee2;line-height:1.1}
.dashboard-donut-center small{color:#b8b0a3}
.dashboard-donut-list{display:flex;flex-direction:column;gap:10px}
.dashboard-donut-item{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid #39352d;border-radius:12px;background:#17191b;color:#ede7db}
.dashboard-donut-item i{width:12px;height:12px;border-radius:999px;display:block}
.dashboard-donut-item strong{font-size:.95rem;color:#f3eee2}
.dashboard-donut-item small{color:#b8b0a3}
.dashboard-donut-item b{font-size:.95rem;color:#edc96e}
@media(max-width:980px){.dashboard-chart-grid{grid-template-columns:1fr}.dashboard-donut-wrap{grid-template-columns:1fr}.dashboard-donut-list{width:100%}}
@media(max-width:767px){.dashboard-chart-body{min-height:unset}.dashboard-trend-svg{min-height:260px}.dashboard-donut-center{width:112px;height:112px}.dashboard-donut-center strong{font-size:1.05rem}}

/* Admin Operasional: Dashboard / Menu / Pengaturan; Bongkar: five direct pages. */
@media(max-width:767px){.bottom-dock.admin-operations{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Pembelian: quick customer creation (also on compact screens). */
.receipt-customer-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.receipt-customer-field>label{margin:0}
.receipt-customer-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;align-items:center;min-width:0}
.receipt-customer-row .field{width:100%;min-width:0;margin:0}
.receipt-customer-row button{white-space:nowrap;min-height:43px;padding:9px 12px;border-radius:12px}
.receipt-new-customer-panel{width:min(470px,100%);overflow-y:auto;overscroll-behavior:contain}
.receipt-new-customer-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}
.receipt-new-customer-actions button{min-height:43px}
@media(max-width:390px){.receipt-customer-row{gap:6px}.receipt-customer-row button{font-size:11px;padding-inline:8px}}

/* Saldo awal Bon ditampilkan hanya pada detail Pelanggan Owner. */
.customer-opening-bon-note{font-size:13px;line-height:1.55;color:#bfb5a0;margin:0 0 14px}

/* Stok awal gudang: panel ringkas, fokus input tanpa mengubah layout menu. */
#openingStockPanel .section-title{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
#openingStockPanel .section-title p{margin:.35rem 0 0;color:var(--muted)}
#openingStockPanel .receipt-summary-grid{margin:12px 0}
#openingStockPanel .receipt-summary-grid .summary-line:first-child{border-bottom:0;margin:0;padding:7px 0}
#openingStockPanel #saveOpeningStock{min-width:190px}
@media(max-width:560px){#openingStockPanel .section-title{flex-wrap:wrap}#openingStockPanel #saveOpeningStock{width:100%}}

/* Contrast audit: replace inherited pale Udhma surfaces across BEWOK LGM.
   UI-only. No PDF canvas, transactional data, or application flow changes. */
.wage-recap-empty,
.customer-history-list,
.customer-detail-meta,
.record-detail-row,
.customer-custom-range,
.customer-table-card,
.data-table-card,
.data-custom-dates,
.product-excel-summary span,
.pdf-preview-size,
.pdf-preview-native-hint{
  background:#191b1d!important;
  border-color:#484033!important;
  color:#f0eadd!important;
  box-shadow:none!important;
}
/* Empty states remain readable on the same dark surface (including mobile). */
.wage-recap-empty,.customer-empty,.record-detail-empty,.data-empty,
.customer-table-card .customer-empty,.data-table-card .data-empty{
  color:#d6cfc3!important;
  opacity:1!important;
}
.customer-empty,.record-detail-empty{
  background:#191b1d!important;
  border-color:#484033!important;
}
.customer-detail-meta span,.customer-detail-meta b,
.customer-history-row b,.customer-history-row strong,
.record-detail-row b,.record-detail-row>strong,
.pdf-preview-native-hint b,.product-excel-summary span{
  color:#f0eadd!important;
}
.customer-detail-meta span{color:#d6cfc3!important}
.customer-history-row span,.record-detail-row small,
.pdf-preview-native-hint span{color:#c8c1b4!important}
/* Readable labels and amounts across shared lists, finance and report screens. */
#app .table-status.ok{color:#a9e8c2!important;background:#23372c!important}
#app .table-status.warn{color:#f5d286!important;background:#393021!important}
#app .table-status.danger{color:#ffb7ac!important;background:#3d2422!important}
#app .table-status.blue{color:#b6d8f6!important;background:#202e37!important}
#app .amount-in{color:#8de1ad!important}
#app .amount-out{color:#ffa9a0!important}
/* A disabled action must look unavailable but not become illegible. */
#app .soft:disabled,#app .mini-btn:disabled,
#app .data-reset:disabled,#app .data-page-btn:disabled,
#app .customer-table-pager button:disabled{
  opacity:.82!important;
  color:#d1b873!important;
  cursor:not-allowed!important;
  box-shadow:none!important;
}
#app .primary:disabled{opacity:.78!important;cursor:not-allowed!important}
.customer-history-row.is-voided{opacity:.85}
/* Keep the PDF preview's white document canvas intact. */
.pdf-browser-frame{background:#fff!important}
/* Search, pagination and reset controls must not keep a pale gradient. */
#app .data-reset,#app .data-page-btn{
  background:#25221b!important;
  color:#edc979!important;
  border:1px solid #5e4f30!important;
  box-shadow:none!important;
}
#app .data-reset:hover:not(:disabled),#app .data-page-btn:hover:not(:disabled){
  background:#332c1e!important;
  color:#ffe09a!important;
}
/* Correction banner inherited a dark-amber label intended for a light theme. */
#app .correction-box>strong{color:#f0d18c!important}