/* Science Survey UI (CC_048) */

/* ── Layout ─────────────────────────────────────────────────────────────── */
.survey-layout { display: flex; flex-direction: column; gap: 0.75rem; padding: 1rem; height: 100%; }
.survey-header { display: flex; align-items: center; justify-content: space-between; }
.scan-progress-badge { font-family: monospace; font-size: 0.9rem; color: #00e5ff; background: rgba(0,229,255,0.1); border: 1px solid rgba(0,229,255,0.3); border-radius: 4px; padding: 0.25rem 0.75rem; }
.survey-main { display: grid; grid-template-columns: 1fr 280px; gap: 1rem; flex: 1; min-height: 0; }
.grid-area { display: flex; flex-direction: column; }
.detail-area { display: flex; flex-direction: column; }

/* ── Fortschrittsbalken ─────────────────────────────────────────────────── */
.scan-progress { height: 6px; background: rgba(255,255,255,0.08); border-radius: 3px; overflow: hidden; }
.progress-bar { height: 100%; background: transparent; }
.progress-fill { height: 100%; background: linear-gradient(90deg, #00c853, #00e5ff); transition: width 0.5s ease; }

/* ── SVG-Gitter ─────────────────────────────────────────────────────────── */
.scan-grid-wrapper { width: 100%; }
.sector-grid { width: 100%; height: auto; max-height: 580px; display: block; background: rgba(0,0,0,0.4); border: 1px solid rgba(0,229,255,0.2); border-radius: 6px; }
.grid-line { stroke: rgba(0,229,255,0.1); stroke-width: 1; }

/* Sektoren */
.sector { cursor: pointer; transition: opacity 0.15s; }
.sector.unscanned { fill: #0a1628; stroke: rgba(0,229,255,0.25); stroke-width: 1; }
.sector.unscanned:hover { fill: #0d2040; stroke: rgba(0,229,255,0.6); stroke-width: 1.5; }

/* Ergebnis-Typen */
.sector.scanned { cursor: pointer; stroke-width: 1; }
.sector.finding-mineral  { fill: rgba(139, 90,  43, 0.45); stroke: #8b5a2b; }
.sector.finding-anomaly  { fill: rgba(138, 43, 226, 0.35); stroke: #8a2be2; }
.sector.finding-artifact { fill: rgba(255,215,  0, 0.35); stroke: #ffd700; }
.sector.finding-signal   { fill: rgba(  0,255,255, 0.25); stroke: #00ffff; }
.sector.finding-lifesign { fill: rgba( 50,205, 50, 0.35); stroke: #32cd32; }
.sector.finding-empty    { fill: rgba( 80, 80, 80, 0.25); stroke: rgba(120,120,120,0.4); }

/* Labels */
.finding-label { font-size: 14px; font-weight: bold; font-family: monospace; pointer-events: none; }
.finding-label-mineral  { fill: #c8843a; }
.finding-label-anomaly  { fill: #bf7fff; }
.finding-label-artifact { fill: #ffd700; }
.finding-label-signal   { fill: #00ffff; }
.finding-label-lifesign { fill: #7fff7f; }
.finding-label-empty    { fill: #888; }
.coord-label { font-size: 9px; fill: rgba(255,255,255,0.3); font-family: monospace; pointer-events: none; }

/* ── Detailpanel ────────────────────────────────────────────────────────── */
.detail-panel { background: rgba(255,255,255,0.04); border: 1px solid rgba(0,229,255,0.2); border-radius: 6px; padding: 1rem; min-height: 200px; }
.detail-title { margin: 0 0 0.75rem; font-size: 1rem; color: #00e5ff; font-family: monospace; text-transform: uppercase; }
.detail-content { display: flex; flex-direction: column; gap: 0.6rem; }
.detail-row { display: flex; justify-content: space-between; align-items: center; font-size: 0.85rem; }
.detail-label { color: #888; text-transform: uppercase; font-size: 0.75rem; letter-spacing: 0.05em; }
.detail-value { color: #eee; font-family: monospace; }
.analysis { display: block; }
.analysis-notes { color: #bbb; font-size: 0.82rem; line-height: 1.5; font-style: italic; }
.unscanned-msg { color: #555; font-style: italic; font-size: 0.85rem; padding: 0.5rem 0; }

/* Ergebnis-Badge */
.finding-badge { display: inline-block; padding: 0.3rem 0.75rem; border-radius: 4px; font-weight: bold; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.08em; }
.finding-badge.finding-mineral  { background: rgba(139,90,43,0.3); border: 1px solid #8b5a2b; color: #c8843a; }
.finding-badge.finding-anomaly  { background: rgba(138,43,226,0.25); border: 1px solid #8a2be2; color: #bf7fff; }
.finding-badge.finding-artifact { background: rgba(255,215,0,0.2); border: 1px solid #ffd700; color: #ffd700; }
.finding-badge.finding-signal   { background: rgba(0,255,255,0.15); border: 1px solid #00ffff; color: #00ffff; }
.finding-badge.finding-lifesign { background: rgba(50,205,50,0.2); border: 1px solid #32cd32; color: #7fff7f; }
.finding-badge.finding-empty    { background: rgba(80,80,80,0.2); border: 1px solid #555; color: #999; }

/* Intensitaets-Balken */
.intensity-bar { height: 8px; background: rgba(255,255,255,0.08); border-radius: 4px; overflow: hidden; }
.intensity-fill { height: 100%; transition: width 0.4s; }
.finding-bar-mineral  { background: #8b5a2b; }
.finding-bar-anomaly  { background: #8a2be2; }
.finding-bar-artifact { background: #ffd700; }
.finding-bar-signal   { background: #00ffff; }
.finding-bar-lifesign { background: #32cd32; }
.finding-bar-empty    { background: #555; }

/* Artefakt-Alarm */
.artifact-alert { margin-top: 0.5rem; padding: 0.5rem 0.75rem; background: rgba(255,215,0,0.15); border: 1px solid #ffd700; border-radius: 4px; color: #ffd700; font-size: 0.82rem; font-weight: bold; animation: artifact-pulse 1.5s ease-in-out infinite; }
@keyframes artifact-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }

/* ── Legende ────────────────────────────────────────────────────────────── */
.finding-legend { display: flex; flex-wrap: wrap; gap: 0.75rem 1.5rem; font-size: 0.78rem; padding: 0.5rem 0; border-top: 1px solid rgba(255,255,255,0.07); }
.legend-item { color: #888; }
.legend-item.finding-mineral  { color: #c8843a; }
.legend-item.finding-anomaly  { color: #bf7fff; }
.legend-item.finding-artifact { color: #ffd700; }
.legend-item.finding-signal   { color: #00ffff; }
.legend-item.finding-lifesign { color: #7fff7f; }
.legend-item.finding-empty    { color: #777; }

/* ── P3: Scan-Ripple-Animation ──────────────────────────────────────────── */
.sector.scanning { animation: sector-scan-ripple 1.2s ease-out; }
@keyframes sector-scan-ripple {
    0%   { opacity: 1; }
    30%  { opacity: 0.3; stroke-width: 3; }
    70%  { opacity: 0.8; }
    100% { opacity: 1; }
}

/* ── Hilfe-Box (Survey, Pipeline) ───────────────────────────────────────── */
.howto-box { background: rgba(0,229,255,0.04); border: 1px solid rgba(0,229,255,0.2); border-radius: 6px; padding: 0.5rem 0.8rem; font-size: 0.85rem; color: #cfe; }
.howto-box summary { cursor: pointer; color: #7ec8e3; font-weight: bold; }
.howto-box ol { margin: 0.4rem 0 0; padding-left: 1.2rem; line-height: 1.5; }

/* ── Survey-Rework: Status, Modi, Tuner ─────────────────────────────────── */
.survey-status { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; align-items: center; margin-bottom: 0.4rem; font-size: 0.8rem; }
.survey-sector-label { color: #8aa; font-family: monospace; }
.energy-meter { display: flex; align-items: center; gap: 0.5rem; flex: 1; min-width: 220px; }
.energy-label { color: #888; font-size: 0.7rem; letter-spacing: 0.05em; }
.energy-bar { flex: 1; height: 8px; background: rgba(255,255,255,0.08); border-radius: 4px; overflow: hidden; }
.energy-fill { height: 100%; background: linear-gradient(90deg, #00c853, #00e5ff); transition: width 0.4s; }
.energy-fill.energy-low { background: #ff5252; }
.energy-value { font-family: monospace; color: #00e5ff; }
.energy-power { font-family: monospace; color: #7a9; }
.energy-power.energy-power-low { color: #ffab40; }
.survey-alert { font-size: 0.8rem; padding: 0.3rem 0.6rem; margin-bottom: 0.4rem; border-left: 3px solid #00e5ff; background: rgba(0,229,255,0.07); color: #cfe; border-radius: 3px; }
.survey-alert--danger { border-left-color: #ff5252; background: rgba(255,82,82,0.12); color: #ffb3b3; }
/* Abgelehnte Aktion: Bernstein wie andere Warnungen — kein Befund, aber auch keine Gefahr. */
.survey-alert--rejected { border-left-color: #ffb300; background: rgba(255,179,0,0.12); color: #ffe0a3; }

.survey-modes { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.mode-btn { cursor: pointer; }
.mode-btn input { position: absolute; opacity: 0; pointer-events: none; }
.mode-btn > span { display: inline-block; padding: 0.35rem 0.8rem; border: 1px solid rgba(0,229,255,0.3); border-radius: 4px; color: #9cc; font-size: 0.82rem; }
.mode-btn input:checked + span { background: rgba(0,229,255,0.18); border-color: #00e5ff; color: #e0fbff; font-weight: bold; }
.mode-btn input:focus-visible + span { outline: 2px solid #00e5ff; outline-offset: 2px; }

.survey-tuner { border: 1px solid #ffb300; background: rgba(255,179,0,0.07); border-radius: 4px; padding: 0.4rem 0.6rem; margin-bottom: 0.5rem; }
.tuner-label { display: block; color: #ffcc66; font-size: 0.72rem; letter-spacing: 0.05em; margin-bottom: 0.2rem; }
.tuner-slider { width: 100%; accent-color: #ffb300; }
.tune-meter { display: flex; align-items: center; gap: 0.5rem; font-size: 0.78rem; }
.tune-bar { flex: 1; height: 6px; background: rgba(255,255,255,0.08); border-radius: 3px; overflow: hidden; }
.tune-fill { height: 100%; background: #ffb300; transition: width 0.15s; }
.tune-fill.tune-locked { background: #00e676; }
.tune-value { font-family: monospace; color: #ffcc66; min-width: 12em; }

/* Gitter: Abdeckung, Markierung, Gefahr, Echos, Breitband */
.sector.unscanned.covered { fill: #0d2436; stroke: rgba(0,229,255,0.45); stroke-dasharray: 4 3; }
.sector.unscanned.flagged { fill: rgba(255,82,82,0.12); stroke: #ff5252; }
.flag-label { font-size: 30px; fill: #ff5252; pointer-events: none; }
.sector.finding-hazard { fill: rgba(255,82,82,0.30); stroke: #ff5252; }
.finding-label-hazard { fill: #ff8a80; }
.finding-badge.finding-hazard { background: rgba(255,82,82,0.2); border: 1px solid #ff5252; color: #ff8a80; }
.finding-bar-hazard { background: #ff5252; }
.legend-item.finding-hazard { color: #ff8a80; }
.echo { font-size: 15px; font-weight: bold; font-family: monospace; pointer-events: none; }
.echo-energy { fill: #d9a6ff; color: #d9a6ff; }
.echo-metal  { fill: #e0a060; color: #e0a060; }
.echo-bio    { fill: #7fff7f; color: #7fff7f; }
.echo-hazard { fill: #ff6e6e; color: #ff6e6e; }
.detail-value .echo-energy, .detail-value .echo-metal, .detail-value .echo-bio, .detail-value .echo-hazard { margin-left: 0.4em; font-weight: bold; }
.broadband-area { fill: none; stroke: rgba(0,229,255,0.35); stroke-width: 2; stroke-dasharray: 8 6; pointer-events: none; }
.broadband-area.broadband-hazard { stroke: rgba(255,82,82,0.55); }
.broadband-badges { font-size: 15px; font-weight: 700; pointer-events: none; paint-order: stroke; stroke: rgba(0,0,0,0.8); stroke-width: 3px; }
.broadband-badges .bb-off { fill: rgba(160,190,200,0.28); }
.bb-chip { display: inline-block; padding: 0 0.35em; margin-right: 0.25em; border-radius: 3px; border: 1px solid currentColor; font-weight: bold; }
.bb-chip.bb-off { color: rgba(160,190,200,0.35); text-decoration: line-through; font-weight: normal; }
.broadband-log { list-style: none; margin: 0.5rem 0 0; padding: 0; font-size: 0.78rem; display: flex; flex-direction: column; gap: 0.2rem; max-height: 8.5rem; overflow-y: auto; }
.broadband-log li { color: #9cc; }
.broadband-log li.broadband-hazard { color: #ff8a80; }
.broadband-center { font-family: monospace; margin-right: 0.4em; }

@media (max-width: 760px) {
    .survey-main { grid-template-columns: 1fr; }
}

/* ── Probenpipeline ─────────────────────────────────────────────────────── */
.pipeline-layout { display: flex; flex-direction: column; gap: 0.75rem; padding: 1rem; }
.research-points-line { color: #ffd600; font-size: 0.9rem; margin-bottom: 0.5rem; }
.pipeline-table-wrapper { overflow-x: auto; }
.pipeline-table { width: 100%; border-collapse: collapse; font-size: 0.82rem; }
.pipeline-table th, .pipeline-table td { padding: 0.35rem 0.5rem; border-bottom: 1px solid rgba(255,255,255,0.06); text-align: left; }
.pipeline-table tr.row--processing { background: rgba(0,229,255,0.06); }
.pipeline-table tr.row--completed { opacity: 0.65; }
.btn-analyse { font-size: 0.75rem; padding: 0.2rem 0.5rem; background: #0a3a5a; color: #7ec8e3; border-radius: 3px; text-decoration: none; white-space: nowrap; }
.quality-badge { font-size: 0.72rem; font-weight: bold; padding: 0.1rem 0.4rem; border-radius: 3px; border: 1px solid currentColor; }
.quality-badge.badge--EXCELLENT { color: #00e676; }
.quality-badge.badge--GOOD { color: #7ec8e3; }
.quality-badge.badge--POOR { color: #ffab40; }
.quality-badge.badge--FAILED { color: #ff5252; }
.muted { color: #666; font-size: 0.75rem; }
.progress-bar-mini { display: inline-block; width: 60px; height: 6px; background: rgba(255,255,255,0.08); border-radius: 3px; overflow: hidden; vertical-align: middle; }
.progress-fill-mini { height: 100%; background: linear-gradient(90deg, #00c853, #00e5ff); }

/* Survey als Vorstufe der Signalsuche: feste Quellen im Raster und im Detail */
.finding-source { font-size: 9px; font-family: monospace; fill: #ffd27a; letter-spacing: 0.06em; pointer-events: none; }
.survey-recenter { margin-left: auto; font-size: 0.72rem; padding: 2px 8px; }
.survey-source { margin-top: 8px; padding: 8px; border: 1px solid rgba(255, 210, 122, 0.5); border-radius: 4px;
  background: rgba(255, 210, 122, 0.08); display: grid; gap: 4px; font-size: 0.82rem; }
.survey-source__title { font-weight: 700; color: #ffd27a; }
.survey-source__hint { color: var(--text-muted, #8b93a1); font-size: 0.76rem; }

/* Gebietsscan (Wärmekarte) */
.survey-heat { width: 100%; max-width: 560px; aspect-ratio: 1; display: block; background: rgba(0, 0, 0, 0.35); border-radius: 6px; }
.survey-heat .cell { stroke: rgba(159, 194, 255, 0.18); stroke-width: 1; cursor: pointer; }
.survey-heat .cell--sel { stroke: #ffb347; stroke-width: 3; }
.survey-heat .cell--scan { stroke: var(--accent-cyan, #22d3ee); stroke-width: 3; stroke-dasharray: 6 4; }
.survey-heat .val { fill: #fff; font: 600 16px var(--font-mono, monospace); pointer-events: none; }
.survey-heat .band { fill: rgba(255, 255, 255, 0.75); font: 10px var(--font-mono, monospace); pointer-events: none; }
.survey-heat .ship { fill: #ffb347; pointer-events: none; }
.survey-cell { display: grid; gap: 8px; }
.survey-heat .val--dark { fill: #1b1206; }

/*
  Survey auf breiten Schirmen (ab 1800 px, z. B. 2560×1070 oder 1920×1080): ohne Scrollen.
  Nur #survey-console (science.css gilt auch für die Signalsuche). Energie, Lageleiste, Meldungen und
  Anleitung stehen links untereinander, Raster und Zellen-/Gebietswahl rechts daneben statt darunter;
  die Seite darf breiter werden als die Standardhülle (1400 px) und füllt bis zum unteren Rand.
*/
@media (min-width: 1800px) {
    .station-main:has(#survey-console) { max-width: min(2400px, 100%); display: flex; flex-direction: column; }
    #survey-console {
        flex: 1 0 auto;
        height: auto;
        padding: 0;
        display: grid;
        grid-template-columns: minmax(0, 560px) minmax(0, 1fr);
        grid-template-rows: repeat(6, auto) 1fr;
        gap: 0.75rem 1rem;
        align-content: start;
    }
    #survey-console > :not(.survey-main) { grid-column: 1; }
    #survey-console > [hidden], #survey-console > .pro-msg:empty { display: none; }
    #survey-console > .survey-main { grid-column: 2; grid-row: 1 / -1; grid-template-columns: minmax(0, 1fr) 320px; align-items: start; }
    /* Raster so groß, wie die Fensterhöhe erlaubt (statt fest 560 px). */
    #survey-console .survey-heat { max-width: min(100%, calc(100vh - 240px)); }
}
