/* 1998 Black Mesa terminal look: table layout, monospace, utilitarian; no orange. */

:root{
  --bg:#111;           /* page background */
  --panel:#1f1f1f;     /* panels */
  --muted:#cfcfcf;     /* text */
  --accent:#9fd3b5;    /* pale green for nominal */
  --warn:#ffd997;      /* pale amber for notice */
  --bad:#f38b86;       /* pale red */
  --border:#2b2b2b;
}

/* page base */
html,body{height:100%;margin:0;background:var(--bg);color:var(--muted);font-family:"Lucida Console","Courier New",monospace;font-size:13px}
table.page-table{width:100%;height:100%;border-collapse:collapse}
.hdr-left,.hdr-center,.hdr-right{padding:8px;border-bottom:1px solid var(--border)}
.header-text{font-weight:700;font-size:15px}
.subheader-text{font-size:11px;color:#aebdb2}
.logo-low{height:46px;image-rendering:pixelated;filter:contrast(0.95) brightness(0.85)}
.logo-low.big{height:96px}

/* main body */
.main-body{padding:12px;vertical-align:top}
.layout{width:100%;border-collapse:collapse}
.col-left{width:62%}
.col-right{width:38%}

/* panels and boxes */
.panel{background:var(--panel);border:1px solid var(--border);padding:8px;margin-bottom:10px}
.panel-title{font-weight:700;margin-bottom:6px}
.console{background:#070707;border:1px solid #1a1a1a;height:260px;overflow:auto;padding:6px;font-family:monospace;font-size:12px;color:#bfeecf}
.sched{width:100%;border-collapse:collapse}
.sched th{border-bottom:1px solid #2a2a2a;text-align:left;padding:4px}
.sched td{padding:6px;border-bottom:1px dashed rgba(255,255,255,0.02)}
.notes{line-height:1.45;color:#d7d7d7}
.term-box{background:var(--panel);border:1px solid var(--border);padding:10px}
.term-title{font-weight:700;margin-bottom:6px}
.term-text{font-size:12px;margin-bottom:8px}
.term-list .lt{color:#9fa9a2;width:120px;display:inline-block}

/* login box */
.login-box{background:#171717;border:1px solid var(--border);padding:10px}
.login-title{font-weight:700;margin-bottom:8px}
.fld{background:#000;border:1px solid #222;color:var(--muted);padding:6px;width:220px;font-family:monospace}
.btn{background:#0f0f0f;border:1px solid #333;color:var(--muted);padding:6px 10px;cursor:pointer;margin-right:6px}
.btn.muted{opacity:0.8}
.btn.danger{color:var(--bad);border-color:#4a2624}
.ctrl{width:100%}
.ctrl-btn{padding:4px 8px;margin-left:6px}
.led{font-weight:700;padding:2px 6px;border:1px solid #222;background:#0b0b0b}
.led.nominal{color:var(--accent)}
.led.active{color:var(--accent)}
.led.locked{color:var(--warn)}
.led.alert{color:var(--bad)}

/* footer */
.footer{padding:8px;border-top:1px solid var(--border);font-size:12px;text-align:center;color:#9a9a9a}

/* small misc */
.err{color:var(--bad);margin-top:8px}
.small-note{font-size:12px;color:#9a9a9a;margin-top:8px}
.term-table{width:100%}
.label{font-size:11px;color:#9aa6a0}

/* security page */
.camwrap{position:relative;background:#000;border:1px solid #222;height:360px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.cam-static{max-width:100%;max-height:100%;image-rendering:pixelated}
.cam-overlay{position:absolute;left:0;right:0;top:0;padding:10px;text-align:center;color:#e6e6e6;background:rgba(0,0,0,0.4);font-weight:700}

/* reboot overlay (bsod + boot) */
#rebootOverlay{position:fixed;left:0;top:0;right:0;bottom:0;background:#000;z-index:9999;display:flex;align-items:center;justify-content:center}
.bsod{background:#020a24;color:#cfe8ff;padding:24px;border:4px solid #123;max-width:760px;box-shadow:0 0 0 4px rgba(0,0,0,0.6)}
.bsod pre{font-family:monospace;font-size:13px}
.bootScreen{background:#000;color:#cfcfcf;padding:18px;border:1px solid #222;max-width:820px;max-height:520px;overflow:auto}
.bootScreen pre{font-family:monospace;font-size:14px}

/* low-FPS flicker (very subtle) */
.panel, .console, .term-box{animation:flick 900ms steps(1, end) infinite}
@keyframes flick{ 0%{opacity:1} 6%{opacity:0.96} 100%{opacity:1} }

/* responsive */
@media (max-width:900px){
  .col-left,.col-right{display:block;width:100%}
  .logo-low{height:36px}
  
/* Control & Monitor Section */
#control-monitor {
  background: #111;
  border: 1px solid #222;
  padding: 12px;
  font-family: "Courier New", monospace;
  color: #ccc;
  box-shadow: inset 0 0 6px #000;
}

#control-monitor h3 {
  border-bottom: 1px solid #222;
  margin-bottom: 8px;
  color: #aaa;
  font-size: 0.9em;
  letter-spacing: 1px;
}

.control-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 4px 0;
}

.toggle-btn {
  background: #0c0c0c;
  border: 1px solid #333;
  color: #00ff66;
  font-family: "Courier New", monospace;
  font-size: 0.85em;
  padding: 3px 10px;
  cursor: pointer;
  text-shadow: 0 0 3px #00ff66;
  transition: all 0.2s ease;
  width: 90px;
  text-align: center;
}

.toggle-btn:hover {
  border-color: #00ff66;
  box-shadow: 0 0 4px #00ff66 inset;
}

.toggle-btn.offline {
  color: #ff3b3b;
  text-shadow: 0 0 3px #ff3b3b;
  border-color: #400;
}

.main-btn {
  background: #151515;
  border: 1px solid #333;
  color: #ff6600;
  font-family: "Courier New", monospace;
  padding: 4px 12px;
  font-size: 0.85em;
  cursor: pointer;
  text-shadow: 0 0 4px #ff6600;
  transition: all 0.2s ease;
}

.main-btn:hover {
  background: #1a1a1a;
  border-color: #ff6600;
  box-shadow: 0 0 4px #ff6600 inset;
}

.button-row {
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
  gap: 6px;
}

}