import type { GameSliceSession } from "../types";
import { metricLabel, slicePanel } from "./sliceStyles";

export function SliceStationPanel({ session }: { session: GameSliceSession }) {
  return (
    <section style={{ ...slicePanel, padding: 12, minHeight: 118 }}>
      <strong style={{ color: "#22c55e", fontSize: 12 }}>Station</strong>
      <div style={{ display: "grid", gridTemplateColumns: "1fr auto", gap: 6, marginTop: 10, fontFamily: "var(--font-mono)", fontSize: 11 }}>
        <span style={metricLabel}>Status</span>
        <span>{session.dockedStationName ? "Docked" : "Undocked"}</span>
        <span style={metricLabel}>Facility</span>
        <span>{session.dockedStationName ?? "None"}</span>
        <span style={metricLabel}>Services</span>
        <span>{session.dockedStationName ? "Market / Fitting / Refining" : "Unavailable"}</span>
      </div>
    </section>
  );
}
