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

/* Electrochlorination accent colors */
:root{ --ec:#ffc107;--ec2:#ff8f00;--ec3:#ffe082; }

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

/* EC accent theming */
#header{border-bottom-color:var(--ec2);}
.htitle{color:var(--ec);}
.hbadge{background:rgba(255,193,7,.07);border-color:var(--ec);color:var(--ec);}
#fs-btn:hover{border-color:var(--ec);color:var(--ec);}
.ph{color:var(--ec);}
.phdot.ec{background:var(--ec);}

/* EC-specific keyframes */
@keyframes ecglow{0%,100%{box-shadow:0 0 6px rgba(255,193,7,.3)}50%{box-shadow:0 0 18px rgba(255,193,7,.7)}}

/* Gauge values & bars */
.g-lbl{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:3px;}
.g-lbl span:first-child{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;}
.g-val{font-family:var(--font-mono);font-size:13px;color:var(--green);}
.g-val.ec{color:var(--ec);}
.g-val.warn{color:var(--amber);}
.g-val.alarm{color:var(--red);animation:blink .6s infinite;}
.g-unit{font-size:9px;color:var(--muted);margin-left:2px;}
.g-bar.ec{background:var(--ec);}

/* Status block EC variants */
.status-block{border:1px solid var(--b1);border-radius:3px;padding:6px 8px;margin-bottom:5px;}
.status-block.on{border-color:rgba(255,193,7,.5);background:rgba(255,193,7,.04);animation:ecglow 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;}
.sb-val{font-family:var(--font-mono);}
.sb-sub{font-size:9px;color:var(--muted);margin-top:2px;}
.sb-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px;margin-top:4px;}
.sb-item{font-size:9px;}
.sb-item .lbl{color:var(--muted);}
.sb-item .val{font-family:var(--font-mono);font-size:11px;color:var(--white);}

/* EC-specific button states */
.cb-btn.ec-on{background:rgba(255,193,7,.15);border-color:var(--ec);color:var(--ec);animation:ecglow 2s infinite;}
.btn-bal{background:rgba(68,138,255,.1);border-color:#448aff;color:#448aff;}
.btn-bal:hover,.btn-bal.active{background:rgba(68,138,255,.25);}
.btn-deb{background:rgba(0,188,212,.1);border-color:#00bcd4;color:#00bcd4;}
.btn-deb:hover,.btn-deb.active{background:rgba(0,188,212,.25);}
.btn-stp{background:rgba(255,68,68,.1);border-color:var(--red);color:var(--red);}
.btn-stp:hover{background:rgba(255,68,68,.25);}
.btn-ec{background:rgba(255,193,7,.1);border-color:var(--ec);color:var(--ec);}
.btn-ec:hover,.btn-ec.active{background:rgba(255,193,7,.25);}
.btn-neut{background:rgba(0,188,212,.08);border-color:#00bcd4;color:#00bcd4;}
.btn-neut:hover,.btn-neut.active{background:rgba(0,188,212,.2);}

/* Electrode bars */
.elec-bars{display:flex;gap:3px;margin:4px 0;}
.elec-bar{flex:1;height:28px;border-radius:2px;position:relative;border:1px solid var(--b1);background:rgba(255,255,255,.03);}
.elec-fill{position:absolute;bottom:0;left:0;right:0;border-radius:2px;transition:height .5s;}
.elec-lbl{position:absolute;bottom:2px;left:0;right:0;text-align:center;font-size:8px;font-family:var(--font-mono);}

/* Tank EC accents */
.tank-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-bottom:5px;}
.tank-box{border:1px solid var(--b2);border-radius:3px;padding:4px;background:rgba(255,255,255,.02);}
.tank-box.sel{border-color:var(--ec);background:rgba(255,193,7,.04);}
.tank-box.filling{border-color:#448aff;}
.tank-box.dischg{border-color:#00bcd4;}
.tank-name{font-size:9px;font-family:var(--font-mono);color:var(--ec);margin-bottom:2px;}
.tank-bar{height:32px;background:rgba(255,255,255,.04);border-radius:2px;border:1px solid var(--b1);position:relative;overflow:hidden;}
.tank-fill{position:absolute;bottom:0;left:0;right:0;background:rgba(255,193,7,.25);border-top:1px solid var(--ec);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;text-shadow:0 0 4px #000;}
.tank-meta{font-size:9px;color:var(--muted);}

/* TRO display */
.tro-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px;margin-bottom:5px;}
.tro-box{border:1px solid var(--b1);border-radius:3px;padding:5px;text-align:center;}
.tro-lbl{font-size:8px;font-family:var(--font-mono);color:var(--muted);margin-bottom:3px;}
.tro-val{font-family:var(--font-mono);font-size:14px;}
.tro-unit{font-size:8px;color:var(--muted);}

/* Tab EC accent */
.tab-btn.active{border-color:var(--ec);color:var(--ec);background:rgba(255,193,7,.06);}

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

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