/* KHAVINDO V3 Tahap 11: V2-inspired left nav + operational terminal cards.
   Presentation only. No stock mutations, no route rewrites, no schema changes. */
:root{--kh-sidebar:#123d2b;--kh-accent:#198754;--kh-soft:#f4f6f5;--kh-border:#dce8e1}
html,body{min-height:100%}body{background:var(--kh-soft)}
.kh-app-shell{display:flex;min-height:100vh;align-items:stretch}
.kh-sidebar{width:248px;min-width:248px;background:var(--kh-sidebar);color:white;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;z-index:70;box-shadow:2px 0 15px rgba(10,35,24,.08);overflow-y:auto}
.kh-sidebar-brand{display:flex;align-items:center;gap:11px;color:white!important;text-decoration:none;padding:23px 17px 24px}
.kh-brand-icon{width:34px;height:34px;background:#277650;border:1px solid #529a73;border-radius:8px;display:grid;place-items:center;font-weight:900;font-size:18px;color:white}
.kh-sidebar-brand strong{display:block;font-size:17px;letter-spacing:1.1px;line-height:1.15}.kh-sidebar-brand small{display:block;font-size:9px;color:#b7d8c5;letter-spacing:.6px;margin-top:4px}
.kh-sidebar-caption{color:#84b39a;font-weight:800;font-size:10px;letter-spacing:1.8px;padding:8px 21px 10px}
.kh-sidebar-nav{padding:0 10px;display:flex;flex-direction:column;gap:8px}.kh-nav-group{border-radius:8px}.kh-nav-group>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:11px;padding:12px;color:#e9f5ee;font-size:12px;font-weight:800;border-radius:6px;user-select:none}.kh-nav-group>summary::-webkit-details-marker{display:none}.kh-nav-group>summary:hover,.kh-nav-group[open]>summary{background:rgba(255,255,255,.09)}.kh-group-icon{width:20px;text-align:center;font-size:17px;line-height:1}.kh-chevron{margin-left:auto;color:#bad2c3;transition:transform .2s}.kh-nav-group[open] .kh-chevron{transform:rotate(180deg)}
.kh-nav-items{padding:3px 0 6px 31px;display:flex;flex-direction:column;gap:3px}.kh-nav-items>a,.kh-nav-single{display:block;color:#b8d2c2!important;text-decoration:none;font-size:11px;font-weight:650;padding:9px 12px;border-radius:6px}.kh-nav-items>a:hover,.kh-nav-single:hover{background:#1b5539;color:white!important}.kh-nav-items>a.is-active,.kh-nav-single.is-active{background:#25754c;color:white!important;border-left:3px solid #b7ddc2;padding-left:9px}.kh-nav-single{display:flex;align-items:center;gap:11px;margin-top:5px;padding:12px;font-size:12px;font-weight:800;color:#e9f5ee!important}.kh-superuser-mark{font-size:10px;margin-left:auto}.kh-sidebar-bottom{margin-top:auto;padding:18px 20px;color:#8aae97;font-size:10px;border-top:1px solid #3a6b4d;letter-spacing:.8px}
.kh-content{flex:1;min-width:0}.kh-topbar{height:64px;background:white!important;border-bottom:1px solid #dce6df;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:0 28px!important;color:#173d2b!important;position:sticky;top:0;z-index:20;box-shadow:0 2px 5px rgba(0,0,0,.02)}.kh-topbar-title{font-weight:800;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kh-topbar-profile{display:flex;gap:16px;align-items:center}.kh-profile-name{font-weight:700;font-size:12px;text-align:right;line-height:1.2}.kh-profile-name small{display:block;color:#688175;font-size:9px;margin-top:4px}.kh-topbar-profile form{margin:0}.kh-logout{background:#f0f6f2!important;color:#14633b!important;border:1px solid #d6e5da!important;border-radius:6px;font-size:11px;padding:8px 12px}.kh-logout:hover{background:#e0eee5!important}.kh-main{width:100%;max-width:1660px;margin:0 auto;padding:27px 26px 70px}.kh-menu-toggle{display:none;background:transparent;color:#126b40;border:1px solid #d4e3d9;font-size:19px;width:36px;height:36px;padding:0;border-radius:6px}.kh-sidebar-backdrop{display:none}
.kh-guest-shell{min-height:100vh}.kh-guest-top{background:#126b40;color:white;padding:18px 24px;font-weight:800;letter-spacing:1px}.kh-guest-top small{font-size:10px;margin-left:10px;font-weight:500;letter-spacing:normal}.kh-guest-main{margin:0 auto;padding:28px 16px;max-width:900px}
/* Production dashboard — taken from the V2 information hierarchy, rebuilt on V3 stock/job relations. */
.kh-dashboard-head{display:flex;align-items:start;justify-content:space-between;gap:18px;margin-bottom:18px}.kh-dashboard-head h1{margin:0 0 5px;font-size:25px}.kh-dashboard-head p{margin:0;color:#6a7c71;font-size:12px}.kh-dashboard-action{white-space:nowrap;margin-top:4px}
.kh-dashboard-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}.kh-summary-card{text-align:left;border:1px solid #dbe8df;border-top:4px solid #208455;border-radius:7px;padding:16px;background:#fff;display:flex;flex-direction:column;gap:5px;box-shadow:0 2px 5px rgba(11,49,27,.03);color:#173d2b;min-width:0}.kh-summary-card:hover,.kh-summary-card.is-selected{border-color:#2b9a60;background:#f7fcf8}.kh-summary-title{font-weight:800;font-size:12px}.kh-summary-card strong{font-size:25px;line-height:1.35;letter-spacing:-.7px}.kh-summary-unit{font-size:10px;font-weight:700;color:#176c40}.kh-summary-meta{font-size:10px;color:#778a7e}.kh-summary-card:last-child{border-top-color:#507e9e}
.kh-dashboard-filter{border:1px solid var(--kh-border);border-radius:7px;background:#fff;padding:15px;margin-bottom:17px}.kh-dashboard-filter-form{display:flex;flex-wrap:wrap;align-items:end;gap:10px}.kh-filter-field{width:min(100%,240px)}.kh-filter-wide{flex:1;min-width:220px}.kh-filter-field label{margin:0 0 5px;font-size:10px}.kh-dashboard-filter-form>button,.kh-reset-link{min-height:36px}.kh-reset-link{display:inline-flex;align-items:center}.kh-filter-hint{margin:8px 0 0;color:#65776b;font-size:10px}
.kh-terminal-carousel{border:1px solid var(--kh-border);border-radius:8px;background:#fff;overflow:hidden;box-shadow:0 2px 6px rgba(0,0,0,.03)}.kh-carousel-nav{display:flex;align-items:center;gap:9px;padding:11px 13px;background:#fbfcfb;border-bottom:1px solid #dfebe3}.kh-slide-arrow{width:34px;height:34px;flex:0 0 auto;display:grid;place-items:center;background:#fff;color:#146a3d;border:1px solid #d0e0d5;font-size:22px;padding:0;line-height:1}.kh-slide-arrow:hover{background:#f0f7f3}.kh-terminal-tabs{display:flex;gap:6px;flex:1;justify-content:center;align-items:center;overflow-x:auto;scrollbar-width:thin;padding:3px}.kh-terminal-tab{background:#fff;color:#206343;border:1px solid #d0e0d6;font-size:10px;padding:8px 10px;white-space:nowrap;font-weight:750}.kh-terminal-tab span{opacity:.7}.kh-terminal-tab.is-active{background:#126b40;color:#fff;border-color:#126b40}.kh-slider-window{width:100%;overflow:hidden}.kh-slider-track{display:flex;transition:transform .42s ease;align-items:stretch}.kh-terminal-slide{flex:0 0 100%;min-width:0;padding:18px}.kh-terminal-slide[aria-hidden="true"]{visibility:hidden}.kh-slide-head{display:flex;justify-content:space-between;gap:15px;align-items:center;padding-bottom:13px;margin-bottom:17px;border-bottom:1px solid #e1eae4}.kh-slide-head h2{margin:0 0 4px;font-size:18px}.kh-slide-head p{font-size:11px;margin:0;color:#76867c}.kh-slide-count{font-size:10px;border-radius:20px;padding:6px 10px;background:#eaf5ed;color:#166c40;font-weight:750;white-space:nowrap}.kh-item-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:stretch}.kh-item-card{min-width:0;border:1px solid #dae9df;border-radius:7px;background:#fcfdfc;padding:12px;display:flex;flex-direction:column;gap:10px}.kh-item-card:hover{background:#f8fcf9}.kh-item-order{border:1px solid #d5e8dc;background:#f0f8f3;padding:10px;border-radius:6px;display:flex;justify-content:space-between;gap:10px}.kh-item-order>div{min-width:0}.kh-item-order strong{display:block;overflow-wrap:anywhere;font-size:11px;color:#156a3c}.kh-item-order small{font-size:9px;color:#6d8074}.kh-label{font-size:8px;color:#698374;letter-spacing:.8px;font-weight:850;display:block;margin-bottom:3px}.kh-item-stock{font-weight:850;color:#126b40;white-space:nowrap;font-size:16px}.kh-item-stock small{display:block;text-align:right;font-size:8px}.kh-item-description{display:flex;flex-direction:column;gap:4px}.kh-item-description strong{font-size:13px;line-height:1.35;overflow-wrap:anywhere}.kh-item-description>span,.kh-item-description>small{color:#728277;font-size:10px}.kh-item-jobs{display:flex;flex-direction:column;gap:7px}.kh-job-row{border:1px solid #e4ece6;background:#fff;border-radius:6px;padding:10px;font-size:10px}.kh-job-name{display:flex;justify-content:space-between;gap:5px;align-items:center}.kh-job-name b{font-size:10px;color:#166b3e}.kh-job-name span{font-size:9px;color:#71877a}.kh-job-work{font-weight:800;margin-top:5px}.kh-job-details{margin-top:4px;color:#687c6c}.kh-job-quantity{margin-top:7px;text-align:right;font-weight:850;color:#126b40}.kh-empty{margin:30px 0;padding:35px 20px;text-align:center;background:#f8fbf9;border:1px dashed #cfe0d6;border-radius:7px;color:#698173;font-size:12px}.kh-carousel-footer{border-top:1px solid #e4ece6;background:#fbfcfb;padding:11px 16px;display:flex;align-items:center;justify-content:space-between;gap:10px}.kh-carousel-dots{display:flex;gap:6px}.kh-carousel-dot{border:1px solid #89c2a2;width:9px;height:9px;min-height:9px;border-radius:50%;padding:0;background:#d4e7da}.kh-carousel-dot.is-active{background:#126b40;border-color:#126b40}.kh-carousel-footer small{color:#71877b;font-size:9px}.kh-dashboard-footnote{display:flex;justify-content:space-between;gap:18px;padding:12px 0;align-items:center}.kh-dashboard-footnote a{font-size:11px;color:#147446;font-weight:800}.kh-dashboard-footnote p{font-size:10px;color:#74887a;max-width:650px;text-align:right;margin:0}
@media(max-width:1270px){.kh-item-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.kh-dashboard-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:930px){.kh-sidebar{position:fixed;left:0;top:0;bottom:0;transform:translateX(-100%);transition:transform .22s ease}.kh-app-shell.kh-sidebar-open .kh-sidebar{transform:translateX(0)}.kh-app-shell.kh-sidebar-open .kh-sidebar-backdrop{display:block;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:65}.kh-menu-toggle{display:grid;place-items:center}.kh-main{padding:20px 16px 50px}.kh-topbar{padding:0 15px!important}.kh-topbar-title{margin-right:auto}.kh-profile-name{display:none}}
@media(max-width:650px){.kh-dashboard-head{flex-direction:column}.kh-dashboard-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.kh-summary-card{padding:11px}.kh-summary-card strong{font-size:21px}.kh-item-grid{grid-template-columns:1fr}.kh-terminal-slide{padding:12px}.kh-slide-head{flex-wrap:wrap}.kh-carousel-footer{flex-wrap:wrap}.kh-dashboard-footnote{flex-direction:column;align-items:start}.kh-dashboard-footnote p{text-align:left}.kh-filter-field,.kh-filter-wide{width:100%;flex:auto}.kh-topbar-title{font-size:11px}.kh-logout{padding:6px 8px}}
@media(prefers-reduced-motion:reduce){.kh-slider-track,.kh-sidebar{transition:none}}

/* Tahap 12A: sidebar auto-collapse with optional pin. Active only on desktop. */
.kh-sidebar-pin{display:flex;align-items:center;gap:10px;background:transparent!important;color:#d9eadd!important;padding:8px;border:1px solid #44795b!important;border-radius:7px;font-size:11px;cursor:pointer;width:100%}
.kh-sidebar-pin:hover{background:#20573b!important}
.kh-master-tools{background:#fff;border:1px solid #dae7dd;border-radius:10px;padding:15px;display:flex;justify-content:space-between;align-items:end;gap:14px;flex-wrap:wrap;margin:18px 0}
.kh-master-tabs{display:flex;gap:8px;flex-wrap:wrap}.kh-master-tab{background:#eff6f1!important;color:#215d3e!important;border:1px solid #d7e4da!important;font-size:12px;display:inline-flex;gap:8px;align-items:center}.kh-master-tab[aria-selected="true"]{color:#fff!important;background:#126b40!important;border-color:#126b40!important}.kh-master-tab span{font-size:10px;opacity:.8}
.kh-master-search-wrap{flex:1;min-width:220px;max-width:380px;margin:0}.kh-master-search-wrap input{margin-top:5px}
.kh-master-panel[hidden],tr[data-kh-master-row][hidden]{display:none!important}
@media(min-width:931px){
 .kh-app-shell.kh-nav-collapsed .kh-sidebar{width:65px;min-width:65px}
 .kh-sidebar{transition:width .2s ease,min-width .2s ease}
 .kh-app-shell.kh-nav-collapsed .kh-sidebar-brand{padding-left:15px;padding-right:9px}
 .kh-app-shell.kh-nav-collapsed .kh-sidebar-brand>span:last-child,.kh-app-shell.kh-nav-collapsed .kh-sidebar-caption,.kh-app-shell.kh-nav-collapsed .kh-group-label,.kh-app-shell.kh-nav-collapsed .kh-chevron,.kh-app-shell.kh-nav-collapsed .kh-nav-label,.kh-app-shell.kh-nav-collapsed .kh-superuser-mark,.kh-app-shell.kh-nav-collapsed .kh-sidebar-bottom .kh-pin-label{display:none}
 .kh-app-shell.kh-nav-collapsed .kh-nav-group:not([open])>summary,.kh-app-shell.kh-nav-collapsed .kh-nav-group[open]>summary,.kh-app-shell.kh-nav-collapsed .kh-nav-single{font-size:0;justify-content:center;padding:12px 6px}
 .kh-app-shell.kh-nav-collapsed .kh-nav-group .kh-nav-items{display:none}
 .kh-app-shell.kh-nav-collapsed .kh-sidebar-bottom{padding:12px 9px}
 .kh-app-shell.kh-nav-collapsed .kh-sidebar-pin{justify-content:center}
 .kh-app-shell.kh-nav-collapsed .kh-sidebar-nav{padding:0 5px}
}
@media(max-width:930px){.kh-sidebar-pin{display:none}}
@media(prefers-reduced-motion:reduce){.kh-sidebar{transition:none}}