/* Simulator-specific overrides -- uses shared/simulator-theme.css */

/* UV BWTS accent colors */
:root{
  --ice:#7df4ff;--ice2:#40c8e0;
  --blue:#448aff;--teal:#00bcd4;--teal2:#0097a7;
  --uv:#b388ff;--uv2:#7c4dff;
}

/* Grid layout */
#main{display:grid;grid-template-columns:230px 1fr 240px;gap:4px;padding:4px;height:calc(100vh - 43px);}

/* UV accent theming */
.htitle{color:var(--ice);}
.hbadge{background:rgba(125,244,255,.07);border-color:var(--ice);color:var(--ice);}
.ph{color:var(--ice);}
.phdot.uv{background:var(--uv);}
.phdot.amber{background:var(--amber);}

/* UV-specific keyframes */
@keyframes uvglow{0%,100%{box-shadow:0 0 6px rgba(179,136,255,.3)}50%{box-shadow:0 0 16px rgba(179,136,255,.7)}}
@keyframes flow{0%{stroke-dashoffset:20}100%{stroke-dashoffset:0}}

/* Gauge bar UV accents */
.g-bar.uv{background:var(--uv);}
.g-bar.teal{background:var(--teal);}

/* UV-specific button states */
.cb-btn.uv-on{background:rgba(179,136,255,.15);border-color:var(--uv);color:var(--uv);animation:uvglow 2s infinite;}
.btn-ballast{background:rgba(68,138,255,.1);border-color:var(--blue);color:var(--blue);}
.btn-ballast:hover{background:rgba(68,138,255,.25);}
.btn-ballast.active{background:rgba(68,138,255,.25);box-shadow:0 0 10px rgba(68,138,255,.3);}
.btn-deballast{background:rgba(0,188,212,.1);border-color:var(--teal);color:var(--teal);}
.btn-deballast:hover{background:rgba(0,188,212,.25);}
.btn-deballast.active{background:rgba(0,188,212,.25);box-shadow:0 0 10px rgba(0,188,212,.3);}
.btn-stop{background:rgba(255,68,68,.1);border-color:var(--red);color:var(--red);}
.btn-stop:hover{background:rgba(255,68,68,.25);}
.btn-neut{background:rgba(255,193,7,.08);border-color:var(--amber);color:var(--amber);}
.btn-neut:hover{background:rgba(255,193,7,.2);}
.btn-neut.active{background:rgba(255,193,7,.2);}

/* Tank UV accents */
.tank-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:6px;}
.tank-box{border:1px solid var(--b2);border-radius:3px;padding:5px;background:rgba(255,255,255,.02);}
.tank-box.selected{border-color:var(--ice);background:rgba(125,244,255,.04);}
.tank-box.filling{border-color:var(--blue);background:rgba(68,138,255,.06);}
.tank-box.discharging{border-color:var(--teal);background:rgba(0,188,212,.06);}
.tank-name{font-size:9px;font-family:var(--font-mono);color:var(--ice);margin-bottom:3px;letter-spacing:.5px;}
.tank-level-bar{height:40px;background:rgba(255,255,255,.04);border-radius:2px;border:1px solid var(--b1);position:relative;overflow:hidden;margin-bottom:3px;}
.tank-fill{position:absolute;bottom:0;left:0;right:0;background:rgba(68,138,255,.35);border-top:1px solid var(--blue);transition:height .8s;}
.tank-fill.treated{background:rgba(0,230,118,.2);border-top-color:var(--green);}
.tank-pct{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:var(--font-mono);font-size:10px;color:var(--white);text-shadow:0 0 4px #000;}
.tank-meta{font-size:9px;color:var(--muted);}
.tank-meta span{color:var(--white);}

/* Status block UV variants */
.status-block{border:1px solid var(--b1);border-radius:3px;padding:6px 8px;margin-bottom:5px;}
.status-block.ok{border-color:rgba(0,230,118,.4);background:rgba(0,230,118,.03);}
.status-block.uv{border-color:rgba(179,136,255,.4);background:rgba(179,136,255,.04);animation:uvglow 2.5s infinite;}

/* Sub-block layout */
.sb-title{font-size:9px;font-family:var(--font-mono);letter-spacing:.5px;margin-bottom:4px;display:flex;justify-content:space-between;align-items:center;}
.sb-val{font-family:var(--font-mono);font-size:14px;}
.sb-val.green{color:var(--green);}
.sb-val.amber{color:var(--amber);}
.sb-val.red{color:var(--red);}
.sb-val.uv{color:var(--uv);}
.sb-unit{font-size:9px;color:var(--muted);margin-left:3px;}
.sb-sub{font-size:9px;color:var(--muted);margin-top:2px;}

/* D-2 compliance */
.d2-table{width:100%;border-collapse:collapse;font-size:9px;}
.d2-table th{font-family:var(--font-mono);color:var(--muted);font-weight:600;padding:3px 5px;text-align:left;border-bottom:1px solid var(--b1);letter-spacing:.5px;}
.d2-table td{padding:3px 5px;border-bottom:1px solid rgba(255,255,255,.04);font-family:var(--font-mono);}
.d2-table tr:last-child td{border:none;}
.d2-pass{color:var(--green);}
.d2-fail{color:var(--red);animation:blink .8s infinite;}
.d2-warn{color:var(--amber);}

/* Tab UV accent */
.tab-btn.active{border-color:var(--ice);color:var(--ice);background:rgba(125,244,255,.06);}

/* Modal */
#modal-bg{position:absolute;inset:0;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;z-index:100;display:none;}
#modal{background:var(--bg2);border:1px solid var(--ice);border-radius:6px;padding:24px;width:480px;max-height:80vh;overflow-y:auto;}
#modal h2{color:var(--ice);font-family:var(--font-mono);font-size:13px;margin-bottom:8px;letter-spacing:2px;}
#modal p{color:var(--muted);font-size:11px;line-height:1.6;margin-bottom:14px;}
.m-btns{display:flex;flex-direction:column;gap:6px;}
.m-btn{padding:10px 14px;border:1px solid var(--b2);background:rgba(255,255,255,.03);color:var(--white);cursor:pointer;border-radius:3px;text-align:left;font-size:11px;transition:all .15s;}
.m-btn:hover{border-color:var(--ice);color:var(--ice);background:rgba(125,244,255,.07);}
.m-btn .mt{font-weight:600;font-size:12px;}
.m-btn .md{color:var(--muted);font-size:10px;margin-top:2px;}
.m-sep{border:none;border-top:1px solid var(--b1);margin:10px 0;}

/* Log item variants */
.log-item.op{color:var(--teal);}
.log-item.alert{color:var(--amber);}