/* Overlay Bigscreen Display (CC_049) */
/* Optimiert fuer 1920x1080 Projektion */

/* ── Basis ──────────────────────────────────────────────────────────────── */
body.overlay-body { margin: 0; padding: 0; background: #000; color: #fff; font-family: 'Courier New', Courier, monospace; overflow: hidden; width: 100vw; height: 100vh; }
.overlay-container { width: 100vw; height: 100vh; overflow: hidden; position: relative; }
.overlay-mode-label { position: absolute; top: 1.5rem; left: 50%; transform: translateX(-50%); font-size: 1.2rem; letter-spacing: 0.3em; color: rgba(0,229,255,0.7); text-transform: uppercase; z-index: 10; }

/* Standby */
.overlay-standby { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100vh; }
.standby-title { font-size: 4rem; letter-spacing: 0.5em; color: rgba(0,229,255,0.6); }
.standby-sub { font-size: 1.5rem; letter-spacing: 0.3em; color: rgba(255,255,255,0.3); margin-top: 1rem; }

/* ── COMBAT Mode ────────────────────────────────────────────────────────── */
.overlay-combat { width: 100%; height: 100vh; display: flex; align-items: center; justify-content: center; background: radial-gradient(ellipse at center, #001a00 0%, #000 70%); }
.overlay-radar { width: 90vh; height: 90vh; max-width: 90vw; }
.scope-ring { stroke: rgba(0,255,80,0.4); stroke-width: 2; fill: none; }
.range-ring { stroke: rgba(0,255,80,0.15); stroke-width: 1; fill: none; }
.cross-line { stroke: rgba(0,255,80,0.1); stroke-width: 1; }
.own-ship { fill: #00ff50; }
.own-ship-ring { fill: none; stroke: #00ff50; stroke-width: 1.5; opacity: 0.5; }
.sweep-line { stroke: rgba(0,255,80,0.6); stroke-width: 2; }
.contact { }
.contact-friendly circle { fill: #00bfff; stroke: #00bfff; }
.contact-hostile  circle { fill: #ff4444; stroke: #ff4444; }
.contact-neutral  circle { fill: #ffd700; stroke: #ffd700; }
.contact-unknown  circle { fill: #888;    stroke: #888; }
.contact-label-lg { font-size: 28px; fill: rgba(255,255,255,0.9); font-family: monospace; }

/* ── ALERT Mode ─────────────────────────────────────────────────────────── */
.overlay-alert { width: 100%; height: 100vh; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; }
.overlay-alert.green  { background: radial-gradient(ellipse at center, #003300 0%, #000 60%); }
.overlay-alert.yellow { background: radial-gradient(ellipse at center, #332200 0%, #000 60%); animation: alert-pulse-yellow 1.5s ease-in-out infinite; }
.overlay-alert.red    { background: radial-gradient(ellipse at center, #330000 0%, #000 60%); animation: alert-pulse-red 0.8s ease-in-out infinite; }
@keyframes alert-pulse-yellow { 0%, 100% { background: radial-gradient(ellipse at center, #332200 0%, #000 60%); } 50% { background: radial-gradient(ellipse at center, #665500 0%, #111 60%); } }
@keyframes alert-pulse-red    { 0%, 100% { background: radial-gradient(ellipse at center, #330000 0%, #000 60%); } 50% { background: radial-gradient(ellipse at center, #660000 0%, #110000 60%); } }
.alert-pulse { position: absolute; inset: 0; pointer-events: none; }
.alert-content { text-align: center; z-index: 1; }
.alert-text-large { font-size: 8rem; font-weight: bold; letter-spacing: 0.3em; text-transform: uppercase; text-shadow: 0 0 40px currentColor; }
.overlay-alert.green  .alert-text-large { color: #00ff80; }
.overlay-alert.yellow .alert-text-large { color: #ffd700; }
.overlay-alert.red    .alert-text-large { color: #ff4444; }
.alert-sub { font-size: 2rem; letter-spacing: 0.4em; margin-top: 1rem; opacity: 0.7; }

/* ── NAVIGATION Mode ────────────────────────────────────────────────────── */
.overlay-navigation { width: 100%; height: 100vh; display: flex; align-items: center; justify-content: center; background: #000814; }
.nav-starmap { width: 100%; height: 100vh; }
.star { fill: rgba(255,255,255,0.7); }
.nav-grid-line { stroke: rgba(0,80,160,0.2); stroke-width: 1; }
.current-position .pos-marker { fill: #00e5ff; }
.current-position .pos-ring { fill: none; stroke: #00e5ff; stroke-width: 1.5; opacity: 0.5; }
.current-position .pos-line { stroke: rgba(0,229,255,0.4); stroke-width: 1; }
.current-position .pos-label { fill: #00e5ff; font-size: 14px; font-family: monospace; }
.course-line { stroke: rgba(0,229,255,0.5); stroke-width: 2; fill: none; }
.course-arrow { fill: rgba(0,229,255,0.7); }
.waypoint-target .waypoint-ring { fill: none; stroke: #ffd700; stroke-width: 2; }
.waypoint-target .waypoint-label { fill: #ffd700; font-size: 14px; font-family: monospace; }

/* ── STATUS Mode ────────────────────────────────────────────────────────── */
.overlay-status { width: 100%; height: 100vh; background: #050810; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2rem; padding: 2rem; box-sizing: border-box; }
.status-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; width: 100%; max-width: 1600px; }
.status-card { border-radius: 8px; padding: 1.5rem; border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04); display: flex; flex-direction: column; gap: 0.75rem; }
.status-card.condition-nominal   { border-color: rgba(0,255,80,0.3); }
.status-card.condition-degraded  { border-color: rgba(255,215,0,0.4); }
.status-card.condition-damaged   { border-color: rgba(255,100,0,0.5); }
.status-card.condition-offline   { border-color: rgba(255,50,50,0.5); background: rgba(80,0,0,0.15); }
.sys-name { font-size: 1.3rem; letter-spacing: 0.08em; color: #ccc; text-transform: uppercase; }
.sys-health-bar { height: 12px; background: rgba(255,255,255,0.08); border-radius: 6px; overflow: hidden; }
.sys-health-fill { height: 100%; transition: width 0.5s; border-radius: 6px; }
.sys-health-fill.condition-nominal   { background: #00ff50; }
.sys-health-fill.condition-degraded  { background: #ffd700; }
.sys-health-fill.condition-damaged   { background: #ff6400; }
.sys-health-fill.condition-offline   { background: #ff3232; }
.sys-condition { font-size: 1rem; letter-spacing: 0.12em; font-weight: bold; }
.badge-nominal   { color: #00ff50; }
.badge-degraded  { color: #ffd700; }
.badge-damaged   { color: #ff6400; }
.badge-offline   { color: #ff3232; }

/* ── MISSION Mode ───────────────────────────────────────────────────────── */
.overlay-mission { width: 100%; height: 100vh; background: #050810; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2rem; }
.mission-title { font-size: 3.5rem; letter-spacing: 0.25em; color: #00e5ff; text-transform: uppercase; text-align: center; }
.objective-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 1.5rem; width: 100%; max-width: 1200px; }
.objective-item { display: flex; align-items: center; gap: 1.5rem; font-size: 2rem; padding: 1rem 2rem; border-radius: 8px; border: 1px solid rgba(255,255,255,0.08); background: rgba(255,255,255,0.03); }
.objective-item.completed { border-color: rgba(0,255,80,0.3); background: rgba(0,80,30,0.2); }
.objective-item.pending   { border-color: rgba(0,229,255,0.2); }
.objective-item.failed    { border-color: rgba(255,68,68,0.35); background: rgba(80,10,10,0.2); }
.obj-icon { font-size: 2.5rem; width: 3rem; text-align: center; }
.objective-item.completed .obj-icon { color: #00ff50; }
.objective-item.pending   .obj-icon { color: rgba(0,229,255,0.5); }
.objective-item.failed    .obj-icon { color: #ff4444; }
.obj-text { }
.objective-item.completed .obj-text { color: #aaa; text-decoration: line-through; }
.no-objectives { color: #555; font-size: 2rem; font-style: italic; }

/* ── VICTORY / DEFEAT End Screens ───────────────────────────────────────── */
.overlay-endscreen { width: 100%; height: 100vh; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; }
.overlay-endscreen.victory { background: radial-gradient(ellipse at center, #002200 0%, #000 60%); animation: victory-glow 2s ease-in-out infinite; }
.overlay-endscreen.defeat  { background: radial-gradient(ellipse at center, #1a0000 0%, #000 60%); }
@keyframes victory-glow { 0%, 100% { background: radial-gradient(ellipse at center, #002200 0%, #000 60%); } 50% { background: radial-gradient(ellipse at center, #004400 0%, #001100 60%); } }
.end-content { text-align: center; z-index: 1; }
.end-title { font-size: 7rem; font-weight: bold; letter-spacing: 0.3em; text-transform: uppercase; }
.overlay-endscreen.victory .end-title { color: #ffd700; text-shadow: 0 0 60px #ffd700, 0 0 120px rgba(255,215,0,0.5); }
.overlay-endscreen.defeat  .end-title { color: #ff3232; text-shadow: 0 0 60px #ff3232; }
.end-subtitle { font-size: 2.5rem; letter-spacing: 0.2em; margin-top: 1.5rem; opacity: 0.8; }
.overlay-endscreen.victory .end-subtitle { color: #aaffaa; }
.overlay-endscreen.defeat  .end-subtitle { color: #ffaaaa; }
.end-decoration { font-size: 4rem; margin-top: 2rem; letter-spacing: 1rem; }
.overlay-endscreen.victory .end-decoration { color: #ffd700; }
.overlay-endscreen.defeat  .end-decoration { color: #555; }