/* Header, filters and footer belong only to Dashboard > Jaringan. */
.network-topbar{height:64px;gap:20px;background:var(--surface);padding-inline:28px}
.network-top-context{display:flex;align-items:center;gap:16px;min-width:0}
.network-top-context nav{display:flex;align-items:center;gap:10px;font-size:12px;white-space:nowrap}
.network-top-context nav a,.network-top-context nav>span:first-of-type{color:var(--muted)}
.network-demo-mark{display:flex;align-items:center;gap:6px;border:0;padding:6px 0;background:transparent;color:var(--muted);font-size:11px;white-space:nowrap}
.network-demo-mark .status-dot{width:5px;height:5px}
.network-topbar .topbar-right{flex:0 0 auto;gap:10px;justify-content:flex-end}
.network-topbar :is(.command-trigger,.theme-toggle,.notif-button){height:38px;min-height:38px;background:transparent;border-color:transparent;color:var(--muted);border-radius:7px;box-shadow:none}
.network-topbar :is(.theme-toggle,.notif-button){width:38px;min-width:38px;padding:8px}
.network-topbar .command-trigger{min-width:0;width:235px;padding:8px 10px;font-size:12px}
.network-topbar :is(.command-trigger,.theme-toggle,.notif-button):hover{background:var(--hover);color:var(--ink)}
.network-topbar .command-shortcut{margin-left:auto}
.network-topbar .user-button{min-height:40px;padding:0 0 0 16px;gap:10px;border-left:1px solid var(--line);max-width:250px}
.network-topbar .avatar{width:36px;height:36px}
.network-topbar .user-label{min-width:0}
.network-topbar .user-label strong{max-width:175px;overflow:hidden;text-overflow:ellipsis;font-size:12px}
.network-topbar .user-label small{font-size:11px}
.network-topbar .notif-count{border-color:var(--surface)}

.network-preview .page-dashboard .network-viewbar{overflow:visible;margin-bottom:16px}
.network-preview .network-viewbar .tabs{display:flex;gap:8px;width:100%}
.network-preview .network-viewbar .tab{display:flex;justify-content:center;align-items:center;min-width:115px;min-height:42px;padding:10px 16px;font-size:12px;border-radius:6px 6px 0 0}
.network-preview .network-viewbar .tab:hover{background:var(--hover)}
.network-preview .network-viewbar .tab.active{color:var(--accent);border-bottom:2px solid var(--accent)}
.network-preview .network-filter-panel{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px 18px}

.network-preview .network-toolbar label,.network-preview .network-utility-drawer label{font-size:12px;font-weight:550;color:var(--muted)}
.network-preview .network-toolbar select{width:100%;height:40px;min-height:40px;padding:8px 10px;font-size:12px;background:var(--surface);color:var(--ink)}

.network-preview .network-filter-feedback{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px}
.network-preview .network-filter-status{font-size:12px;line-height:1.6;color:var(--muted);margin:8px 0 0}
.network-preview .network-filter-status:empty{display:none}
.network-preview .network-filter-feedback .active-filters{padding:0;margin:10px 0 0;gap:8px}
.network-preview .network-filter-feedback .filter-chip{max-width:100%;font-size:11px}
.network-preview .network-filter-feedback .filter-chip strong{max-width:220px}
.network-preview .network-filter-feedback .form-error:empty{display:none}
.network-preview .network-filter-feedback .form-error{flex-basis:100%;margin-top:8px}
.network-compact-footer{gap:8px;margin-top:28px;padding:18px 0;font-size:12px;line-height:1.8;color:var(--muted)}
.network-compact-footer>div{display:flex;justify-content:space-between;align-items:baseline;gap:8px 24px}
.network-compact-footer>div>span:first-child{min-width:0}
.network-compact-footer button{border:0;padding:0;background:transparent;color:var(--accent);font-size:12px;white-space:nowrap;line-height:1.8}
.sidebar-foot{padding:14px 20px 18px}
.sidebar-foot-top{min-height:32px;gap:8px}
.sidebar-foot>.shp-signature{margin-top:12px;gap:10px}
.sidebar-foot .shp-signature>span{min-width:0}
.network-preview .network-utility-drawer .modal-body{font-size:13px;line-height:1.8}
.network-preview .network-utility-drawer .modal-body h3{margin:24px 0 10px;font-size:14px}
.network-preview .network-utility-drawer .modal-body h3:first-child{margin-top:0}
.network-preview .network-utility-drawer .modal-body p{margin:12px 0;color:var(--muted)}
.network-preview .network-utility-drawer .network-filter{display:flex;flex-direction:column;gap:6px;margin-bottom:20px;min-width:0}
.network-preview .network-utility-drawer :is(select,input){width:100%;min-height:40px;height:40px;background:var(--surface);font-size:13px;color:var(--ink)}
.network-preview .network-drawer-main{display:none}
.network-preview .network-draft-main-context{padding:12px 14px;border:1px solid var(--line);background:var(--surface-soft);border-radius:8px;overflow-wrap:anywhere;margin:0 0 24px!important;font-size:12px}
.network-preview .network-draft-dates{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:4px 0 20px}
.network-preview .network-draft-dates[hidden]{display:none}
.network-preview .network-utility-footer{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px;padding:16px 24px}
.network-preview .network-utility-footer .btn{font-size:12px;min-height:38px;padding:8px 12px}
.network-preview .network-utility-footer>.ghost{padding-inline:0;color:var(--muted);white-space:normal;text-align:left}
.network-preview .network-app-facts{margin:0;display:grid;gap:10px}
.network-preview .network-app-facts>div{display:grid;grid-template-columns:145px minmax(0,1fr);gap:12px;align-items:start}
.network-preview .network-app-facts dt{color:var(--muted)}
.network-preview .network-app-facts dd{margin:0;color:var(--ink);overflow-wrap:anywhere}
@media(max-width:1280px){
 .network-topbar{padding-inline:24px;gap:12px}
 .network-topbar .command-trigger{width:205px}
 .network-top-context{gap:10px}

}
@media(max-width:1050px){
 .network-topbar .command-trigger{width:38px;padding:8px}
 .network-topbar .command-trigger>span,.network-topbar .command-shortcut{display:none}
}
@media(max-width:900px){
 .network-topbar{padding-inline:20px}
 .network-topbar .topbar-right{gap:8px}
 .network-topbar .user-button{padding-left:12px;max-width:52px}
 .network-topbar .user-button>.icon{display:none}
}
@media(max-width:680px){
 .network-topbar{padding-inline:12px;height:60px;gap:8px}
 .network-top-context nav,.network-demo-mark{display:none}
 .network-topbar .topbar-right{gap:6px;margin-left:auto}
 .network-topbar .user-button{padding-left:10px;gap:0}

.network-preview .network-viewbar .tabs{gap:0}
 .network-preview .network-viewbar .tab{min-width:0;flex:1;padding:10px 4px;font-size:11px}
 .network-preview .network-filter-panel{padding:16px 18px}

.network-preview .network-filter-feedback .filter-chip strong{max-width:140px}
 .network-preview .network-drawer-main{display:block}
 .network-preview .network-draft-main-context{display:none}
 .network-compact-footer>div{flex-direction:column;gap:3px}
 .network-compact-footer{gap:10px;padding:16px 0}
 .network-preview .network-utility-footer{flex-wrap:wrap;padding:16px 20px;gap:12px}
 .network-preview .network-utility-footer>.actions{margin-left:auto}
 .network-preview .network-app-facts>div{grid-template-columns:110px minmax(0,1fr);gap:10px}
}
@media(max-width:380px){

.network-preview .network-utility-footer{flex-direction:column;align-items:stretch}
 .network-preview .network-utility-footer>.actions{width:100%;margin:0;justify-content:flex-end}
 .network-preview .network-app-facts>div{grid-template-columns:1fr;gap:0}
 .network-preview .network-draft-dates{grid-template-columns:1fr}
}