/* Battery Hybrid — Simulator-specific styles (extends shared/simulator-theme.css) */

#main{display:grid;grid-template-columns:230px 1fr 230px;grid-template-rows:1fr 185px;gap:4px;padding:4px;height:calc(100vh - 42px);}

#bottom{grid-column:1/4;display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px;}
.row{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px;}
  .lbl{font-size:10px;color:var(--muted);}
  .val{font-family:var(--font-mono);font-size:13px;color:var(--white);}
  .val.ok{color:var(--green);}
  .val.warn{color:var(--amber);}
  .val.bad{color:var(--red);}
  .soc-bar-track{height:16px;background:rgba(255,255,255,.04);border-radius:3px;overflow:hidden;border:1px solid var(--border);margin-bottom:6px;position:relative;}
  .soc-bar{height:100%;transition:width .5s,background .3s;border-radius:3px;}
  .soc-num{position:absolute;right:6px;top:50%;transform:translateY(-50%);font-family:var(--font-mono);font-size:11px;font-weight:700;}
  .big-num{font-family:var(--font-mono);font-size:22px;}
  .mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-bottom:8px;}
  .mode-btn{padding:8px 4px;font-size:10px;font-family:var(--font-mono);border-radius:3px;cursor:pointer;border:1px solid var(--border2);background:rgba(0,0,0,.3);color:var(--muted);transition:all .15s;text-align:center;}
  .mode-btn.active.diesel{background:rgba(41,121,255,.15);border-color:var(--blue);color:#7ab3ff;}
  .mode-btn.active.hybrid{background:rgba(0,229,255,.1);border-color:var(--cyan);color:var(--cyan);}
  .mode-btn.active.battery{background:rgba(0,230,118,.12);border-color:var(--green);color:var(--green);}
  .mode-btn.active.charging{background:rgba(255,171,0,.1);border-color:var(--amber);color:var(--amber);}
  .mode-btn:hover{border-color:var(--white);color:var(--white);}
  .mode-btn:disabled{opacity:.3;cursor:not-allowed;}
  .dg-mini{background:var(--bg2);border:1px solid var(--border);border-radius:2px;padding:6px;margin-bottom:6px;}
  .dg-mini-title{display:flex;justify-content:space-between;margin-bottom:4px;}
  .dg-mini-name{font-size:10px;font-weight:600;color:var(--cyan);}
  .dg-mini-status{font-size:9px;font-family:var(--font-mono);padding:1px 5px;border-radius:2px;}
  .dg-mini-status.ON{background:rgba(0,230,118,.15);color:var(--green);}
  .dg-mini-status.OFF{background:rgba(90,138,170,.08);color:var(--muted);}
  .mini-bar-track{height:6px;background:rgba(255,255,255,.04);border-radius:2px;overflow:hidden;border:1px solid var(--border);margin-bottom:3px;}
  .mini-bar{height:100%;transition:width .3s,background .3s;border-radius:2px;}
.ack-btn{width:100%;padding:5px;font-size:10px;font-family:var(--font-mono);background:rgba(255,171,0,.1);border:1px solid var(--amber);color:var(--amber);cursor:pointer;border-radius:2px;margin-bottom:6px;}
  .ack-btn:hover{background:rgba(255,171,0,.25);}
.big-btn.green{background:rgba(0,230,118,.08);border-color:var(--green);color:var(--green);}
  .big-btn.green:hover{background:rgba(0,230,118,.2);}
  .big-btn.amber{background:rgba(255,171,0,.08);border-color:var(--amber);color:var(--amber);}
  .big-btn.amber:hover{background:rgba(255,171,0,.2);}
  .big-btn.red{background:rgba(255,23,68,.1);border-color:var(--red);color:var(--red);}
  .big-btn.red:hover{background:rgba(255,23,68,.25);}
  .big-btn:disabled{opacity:.3;cursor:not-allowed;}
  .em-badge{padding:6px 10px;border-radius:3px;text-align:center;margin-bottom:6px;font-size:10px;font-family:var(--font-mono);}
  .em-badge.low{background:rgba(0,230,118,.1);border:1px solid var(--green);color:var(--green);}
  .em-badge.mid{background:rgba(255,171,0,.1);border:1px solid var(--amber);color:var(--amber);}
  .em-badge.high{background:rgba(255,23,68,.12);border:1px solid var(--red);color:var(--red);}
.peak-bar-row{display:flex;align-items:center;gap:4px;margin-bottom:4px;}
  .peak-lbl{font-size:9px;color:var(--muted);width:70px;flex-shrink:0;}
  .peak-track{flex:1;height:10px;background:rgba(255,255,255,.04);border-radius:2px;overflow:hidden;border:1px solid var(--border);}
  .peak-bar{height:100%;border-radius:2px;transition:width .4s;}
