/* ANO Site Hub V8 - Shell layout */
.v8-home{display:flex;flex-direction:column;gap:14px}
.v8-card{background:var(--u-surface);border:1px solid var(--u-line);border-radius:18px;padding:16px;box-shadow:0 1px 0 rgba(0,0,0,.02)}
.v8-cap{display:block;margin:0;font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--u-muted)}
.v8-sec{display:flex;flex-direction:column;gap:8px}
.v8-sum{display:flex;flex-direction:column;gap:12px}
.v8-sum-top{display:flex;justify-content:space-between;align-items:flex-end;gap:10px}
.v8-big{font-size:2rem;font-weight:850;line-height:1.05;color:var(--u-text);font-variant-numeric:tabular-nums}
.v8-big span{font-size:.95rem;font-weight:650;color:var(--u-muted)}
.v8-sum-r{text-align:right}
.v8-sum-r b{display:block;font-size:.95rem}
.v8-sum-r b.ok{color:#0f8a6a}.v8-sum-r b.warn{color:#b26a00}
.v8-sum-r small{color:var(--u-muted);font-size:.74rem}
.v8-bar{display:flex;height:9px;border-radius:6px;overflow:hidden;background:var(--u-surface2)}
.v8-bar i{display:block;height:100%}
.v8-st{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:8px}
.v8-stb{margin:0!important;display:flex!important;flex-direction:column;align-items:center;gap:2px;padding:10px 4px!important;border-radius:14px!important;background:var(--u-surface2)!important;border:1px solid var(--u-line)!important;color:var(--u-text)!important;box-shadow:none!important;min-height:58px}
.v8-stb b{font-size:1.1rem;font-variant-numeric:tabular-nums}
.v8-stb span{font-size:.64rem;color:var(--u-muted);font-weight:650;text-align:center;line-height:1.2;overflow-wrap:normal;word-break:normal;hyphens:none}
.v8-stb.ok b{color:#0f8a6a}.v8-stb.bad b{color:#c0392b}.v8-stb.warn b{color:#b26a00}
.v8-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.v8-tile{margin:0!important;display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:96px;padding:12px 4px!important;border-radius:16px!important;background:var(--u-surface)!important;border:1px solid var(--u-line)!important;color:var(--u-text)!important;box-shadow:none!important;text-align:center}
.v8-tile .ico{width:22px;height:22px;color:var(--u-primary);background:color-mix(in srgb,var(--u-primary) 14%,transparent);border-radius:11px;padding:8px;box-sizing:content-box}
.v8-tile b{font-size:.84rem}
.v8-tile small{font-size:.68rem;color:var(--u-muted);font-weight:600;line-height:1.25}
.v8-att{display:flex;flex-direction:column;gap:7px}
.v8-att .v8-cap{margin-bottom:2px}
.v8-row{margin:0!important;width:100%;display:flex!important;align-items:center;gap:10px;padding:10px 12px!important;border-radius:14px!important;background:var(--u-surface2)!important;border:1px solid var(--u-line)!important;color:var(--u-text)!important;box-shadow:none!important;text-align:left}
.v8-ri{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex:none;background:color-mix(in srgb,var(--u-primary) 14%,transparent)}
.v8-ri .ico{width:17px;height:17px;color:var(--u-primary)}
.v8-row.warn .v8-ri{background:#fff1d6}.v8-row.warn .v8-ri .ico{color:#a76400}
.v8-row.bad .v8-ri{background:#fde4e1}.v8-row.bad .v8-ri .ico{color:#c0392b}
.v8-rt{flex:1;min-width:0;display:flex;flex-direction:column}
.v8-rt b{font-size:.86rem}
.v8-rt small{font-size:.72rem;color:var(--u-muted);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v8-badge{font-size:.76rem;font-weight:800;padding:2px 9px;border-radius:999px;background:var(--u-surface);border:1px solid var(--u-line);font-variant-numeric:tabular-nums}
.v8-chev{color:var(--u-muted);font-size:1.2rem;line-height:1}
.v8-ok{display:flex;align-items:center;gap:7px;margin:4px 2px 0;font-size:.8rem;font-weight:700;color:#0f8a6a}
.v8-ok .ico{width:16px;height:16px}
.v8-today{padding:0;overflow:hidden}
.v8-today>summary{display:flex;align-items:center;gap:10px;padding:13px 14px;cursor:pointer;list-style:none}
.v8-today>summary::-webkit-details-marker{display:none}
.v8-today>summary b{font-size:.88rem}
.v8-btn2{margin:0!important;display:inline-flex!important;align-items:center;gap:6px;padding:8px 12px!important;min-height:38px;border-radius:12px!important;background:var(--u-surface2)!important;border:1px solid var(--u-line)!important;color:var(--u-primary)!important;font-weight:750!important;font-size:.8rem!important;box-shadow:none!important}
.v8-btn2 .ico{width:15px;height:15px}
.v8-fold{width:34px;height:34px;border-radius:10px;border:1px solid var(--u-line);display:flex;align-items:center;justify-content:center;flex:none}
.v8-fold::before{content:"";width:8px;height:8px;border-right:2px solid var(--u-muted);border-bottom:2px solid var(--u-muted);transform:translateY(-2px) rotate(45deg);transition:transform .15s}
.v8-today[open] .v8-fold::before{transform:translateY(2px) rotate(-135deg)}
#v8TodayBody{padding:0 14px}
#v8TodayBody .hx-today{background:transparent;border:0;box-shadow:none;padding:0;margin:0}
.v8-today-acts{display:flex;gap:8px;padding:10px 14px 14px}
.v8-today-acts button{flex:1;margin:0!important;display:inline-flex!important;align-items:center;justify-content:center;gap:6px}
.v8-today-acts .ico{width:16px;height:16px}
.v8-recent{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.v8-recent button{flex:none;width:158px;margin:0!important;text-align:left;padding:10px 12px!important;border-radius:14px!important;background:var(--u-surface)!important;border:1px solid var(--u-line)!important;color:var(--u-text)!important;box-shadow:none!important;scroll-snap-align:start;display:flex!important;flex-direction:column;gap:2px}
.v8-recent b{font-size:.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v8-recent small{font-size:.68rem;color:var(--u-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v8-empty{text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px;padding:26px 16px}
.v8-empty .ico{width:34px;height:34px;color:var(--u-muted)}
.v8-empty p{margin:0;color:var(--u-muted);font-size:.86rem;line-height:1.45}
.v8-primary{margin:6px 0 0!important;display:inline-flex!important;align-items:center;gap:7px}
.v8-primary .ico{width:16px;height:16px}

/* segmented control (Site Lookup, Map, Reports, Site history) */
.v8-seg{display:flex;gap:4px;padding:4px;margin:10px 0 12px;border-radius:14px;background:var(--u-surface2);border:1px solid var(--u-line)}
.v8-seg button{flex:1;margin:0!important;padding:9px 6px!important;min-height:40px;border-radius:10px!important;background:transparent!important;border:0!important;color:var(--u-muted)!important;font-weight:750!important;font-size:.8rem!important;box-shadow:none!important;line-height:1.2}
.v8-seg button.on{background:var(--u-surface)!important;color:var(--u-text)!important;box-shadow:0 1px 3px rgba(0,0,0,.12)!important}
.v8-seg button small{color:var(--u-muted);font-weight:700;margin-left:2px}

/* Site Lookup modes */
#search[data-mode="one"] .bulk-panel{display:none}
#search[data-mode="bulk"] #query,#search[data-mode="bulk"] details.advanced:not(.bulk-panel),#search[data-mode="bulk"] #results,#search[data-mode="bulk"]>p.muted{display:none}
#search[data-mode="bulk"] .bulk-panel>summary{display:none}
#search[data-mode="bulk"] .bulk-panel{border:0;padding:0;background:transparent}

/* Map modes */
#map[data-mode="peta"]>*:not(h2):not(.v8-seg):not(.v8-peta){display:none!important}
#map[data-mode="laluan"]>.v8-peta{display:none!important}
#map[data-mode="peta"] #hxSiteMap>summary{display:none}
.v8-offline{margin-top:12px;border:1px solid var(--u-line);border-radius:14px;background:var(--u-surface);overflow:hidden}
.v8-offline>summary{display:flex;align-items:center;gap:10px;padding:12px 14px;cursor:pointer;list-style:none}
.v8-offline>summary::-webkit-details-marker{display:none}
.v8-offline>summary .ico{width:18px;height:18px;color:var(--u-primary)}
.v8-offline>summary span{display:flex;flex-direction:column}
.v8-offline>summary small{color:var(--u-muted);font-size:.72rem}
.v8-offline>.map-offline-panel{padding:0 12px 12px}

/* Reports: section headers inside Data quality / Equipment breakdowns */
.v8-rephead h2{margin:0}
.v8-subh{margin:4px 0 2px;font-size:1.02rem}
#incidents .ih-head h3.v8-subh{margin-top:0}

/* More: groups */
.v8-group{margin:14px 4px 6px;font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--u-muted)}
.menu-list .v8-group:first-child{margin-top:4px}

/* Master data: import history folded */
.px-sec.v8-collapse>.px-sec-h{cursor:pointer;user-select:none}
.px-sec.v8-collapse>.px-sec-b{display:none}
.px-sec.v8-collapse.open>.px-sec-b{display:block}
.v8-chevd{margin-left:auto;transform:rotate(90deg);transition:transform .15s;font-size:1.3rem}
.px-sec.v8-collapse.open .v8-chevd{transform:rotate(-90deg)}

/* Work log: other types folded, export preview */
.hx-moretypes{margin-top:8px}
.hx-moretypes>summary{cursor:pointer;font-size:.82rem;font-weight:750;color:var(--u-primary);padding:6px 2px}
.hx-moretypes .hx-types{margin-top:6px}
.hx-prev{border:1px solid var(--u-line);border-radius:14px;padding:12px;margin:0 0 12px;background:var(--u-surface2)}
.hx-prev-h{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}
.hx-prev-h strong{font-size:.86rem}
.hx-prev-h .hx-primary{margin:0!important;display:inline-flex!important;align-items:center;gap:6px;padding:8px 12px!important}
.hx-prev-h .ico{width:15px;height:15px}
.hx-pre{margin:0 0 6px;max-height:240px;overflow:auto;white-space:pre-wrap;font:12px/1.5 ui-monospace,Menlo,Consolas,monospace;background:var(--u-surface);border:1px solid var(--u-line);border-radius:10px;padding:10px;color:var(--u-text)}
#hxBdHint{margin:0 0 6px;color:#0f8a6a;font-weight:650}

/* Site history sheet */
.v8-hist .v8-seg{margin-top:0}
.v8-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.v8-list li{border:1px solid var(--u-line);border-radius:12px;padding:10px 12px;background:var(--u-surface);display:flex;flex-direction:column;gap:2px}
.v8-list b{font-size:.84rem}.v8-list span{font-size:.82rem}
.v8-list small{font-size:.74rem;color:var(--u-muted);overflow-wrap:anywhere}
.v8-hint{color:var(--u-muted);font-size:.82rem;line-height:1.45}

html[data-theme="dark"] .v8-row.warn .v8-ri{background:#3a2e14}html[data-theme="dark"] .v8-row.warn .v8-ri .ico{color:#ffcf70}
html[data-theme="dark"] .v8-row.bad .v8-ri{background:#3a1d1b}html[data-theme="dark"] .v8-row.bad .v8-ri .ico{color:#ff9d92}
html[data-theme="dark"] .v8-ok,html[data-theme="dark"] #hxBdHint{color:#7fe0bd}
html[data-theme="dark"] .v8-stb.ok b,html[data-theme="dark"] .v8-sum-r b.ok{color:#7fe0bd}html[data-theme="dark"] .v8-stb.bad b{color:#ff9d92}html[data-theme="dark"] .v8-stb.warn b,html[data-theme="dark"] .v8-sum-r b.warn{color:#ffcf70}
@media (prefers-color-scheme:dark){
html:not([data-theme]) .v8-row.warn .v8-ri{background:#3a2e14}html:not([data-theme]) .v8-row.warn .v8-ri .ico{color:#ffcf70}
html:not([data-theme]) .v8-row.bad .v8-ri{background:#3a1d1b}html:not([data-theme]) .v8-row.bad .v8-ri .ico{color:#ff9d92}
html:not([data-theme]) .v8-ok,html:not([data-theme]) #hxBdHint{color:#7fe0bd}
html:not([data-theme]) .v8-stb.ok b,html:not([data-theme]) .v8-sum-r b.ok{color:#7fe0bd}html:not([data-theme]) .v8-stb.bad b{color:#ff9d92}html:not([data-theme]) .v8-stb.warn b,html:not([data-theme]) .v8-sum-r b.warn{color:#ffcf70}
}
@media (max-width:360px){.v8-tiles{gap:6px}.v8-tile b{font-size:.78rem}}

.hx-bd .hx-grid2{grid-template-columns:1fr!important}
#incidents .hx-seg button{white-space:nowrap;font-size:.76rem}
