/* LPG Ship — Simulator-specific styles (extends shared/simulator-theme.css) */

:root {
  --purple: #b060ff;
  --purple2: #8040cc;
  --lpg: #ff9944;
  --lpg2: #cc6622;
}

#main{display:grid;grid-template-columns:210px 1fr 215px;grid-template-rows:1fr 205px;gap:4px;padding:4px;height:calc(100vh - 43px);}

@keyframes lpgflash{0%,100%{background:rgba(255,153,68,.1)}50%{background:rgba(255,153,68,.35)}}

.btn-esd{background:rgba(255,51,102,.12);border-color:var(--red);color:var(--red);}
.btn-esd:hover{background:rgba(255,51,102,.3);}
.btn-esd.fired{background:var(--red2);color:#fff;animation:fireflash .5s infinite;}
.btn-bunk{background:rgba(255,153,68,.07);border-color:var(--lpg);color:var(--lpg);}
.btn-bunk:hover{background:rgba(255,153,68,.2);}
.btn-rst{background:rgba(255,255,255,.04);border-color:var(--muted);color:var(--muted);}
.btn-rst:hover{color:var(--white);border-color:var(--white);}

.alm-item.fire{border-left-color:var(--red);animation:fireflash 1s infinite;}
.alm-item.warn{border-left-color:var(--amber);background:rgba(255,204,0,.07);}
.alm-item.lpg-alm{border-left-color:var(--lpg);animation:lpgflash 1.2s infinite;}

.alm-item.clear{border-left-color:var(--green);opacity:.6;}

.alm-tag.F{background:rgba(255,51,102,.3);color:var(--red);}

.alm-tag.I{background:rgba(255,153,68,.2);color:var(--lpg);}

.det-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px;}
.det-cell{background:rgba(255,255,255,.03);border:1px solid var(--b1);border-radius:3px;padding:5px 7px;}
.det-cell.w10{border-color:var(--amber);background:rgba(255,204,0,.07);}
.det-cell.w50{border-color:var(--red);background:rgba(255,51,102,.1);animation:fireflash 1s infinite;}
.det-zone{font-size:10px;color:var(--muted);}
.det-val{font-family:var(--font-mono);font-size:17px;color:var(--green);margin:1px 0;}
.det-val.warn{color:var(--amber);}
.det-val.alarm{color:var(--red);}
.det-bar{height:4px;border-radius:2px;background:var(--green);transition:width .3s,background .3s;}

/* ── PIPELINE LINE-UP ── */
.pl-sec{font-size:9px;font-family:var(--font-mono,'Courier Prime',monospace);color:var(--muted,#7a5aa0);letter-spacing:1px;text-transform:uppercase;padding:4px 8px 1px;border-bottom:1px dashed rgba(255,255,255,.06);}
.pl-row{display:flex;align-items:center;gap:4px;padding:2px 8px;border-bottom:1px solid rgba(255,255,255,.03);}
.pl-id{font-family:var(--font-mono,'Courier Prime',monospace);font-size:10px;color:var(--muted,#7a5aa0);min-width:60px;}
.pl-desc{font-size:10px;color:rgba(237,224,255,.55);flex:1;}
.pl-vbtn{padding:1px 7px;font-size:8px;font-family:var(--font-mono,'Courier Prime',monospace);border-radius:2px;cursor:pointer;border:1px solid;transition:all .12s;flex-shrink:0;}
.pl-vbtn.open{border-color:var(--green,#39ff80);color:var(--green,#39ff80);background:rgba(57,255,128,.1);}
.pl-vbtn.closed{border-color:var(--red,#ff3366);color:var(--red,#ff3366);background:rgba(255,51,102,.08);}
.pl-vbtn.transitioning { background: rgba(255,171,0,0.12); border-color: var(--amber,#ffab00); color: var(--amber,#ffab00); }
.pl-vbtn.req{animation:plreq .8s infinite;}
.pl-status{margin:4px 8px;padding:3px 8px;border-radius:2px;font-family:var(--font-mono,'Courier Prime',monospace);font-size:9px;text-align:center;}
.pl-status.ok{border:1px solid var(--green,#39ff80);color:var(--green,#39ff80);background:rgba(57,255,128,.06);}
.pl-status.fault{border:1px solid var(--red,#ff3366);color:var(--red,#ff3366);background:rgba(255,51,102,.07);}
.pl-status.idle{border:1px solid var(--muted,#7a5aa0);color:var(--muted,#7a5aa0);}
.pl-toggle{padding:3px 8px;font-size:9px;font-family:var(--font-mono,'Courier Prime',monospace);color:var(--muted,#7a5aa0);background:rgba(0,0,0,.3);border:none;border-top:1px solid var(--b1,#2d1a4a);cursor:pointer;width:100%;text-align:left;letter-spacing:.5px;}
.pl-toggle:hover{color:var(--lpg,#ff9944);background:rgba(255,153,68,.04);}