import { readFileSync } from "node:fs";
import { describe, expect, it } from "vitest";

describe("platform web shared theme CSS", () => {
  it("suppresses nested state frames inside shared framed surfaces", () => {
    const themeCss = readFileSync(new URL("./base.css", import.meta.url), "utf8");
    const nestedStateReset = themeCss.slice(themeCss.indexOf("A state view inside an already framed surface"));

    expect(nestedStateReset).toContain(".state-view::after");
    expect(nestedStateReset).toContain("content: none");
    expect(nestedStateReset).toContain("background: transparent");
  });

  it("keeps server card runtime actions as compact overlay menus", () => {
    const themeCss = readFileSync(new URL("./base.css", import.meta.url), "utf8");
    const popoverRule = themeCss.slice(themeCss.indexOf(".runtime-action-popover"), themeCss.indexOf("/* ---- catalog / detail lists ---- */"));

    expect(popoverRule).toContain("position: fixed");
    expect(popoverRule).toContain("z-index: 45");
    expect(popoverRule).toContain(".runtime-action-grid");
    expect(popoverRule).toContain("grid-template-columns: repeat(2, minmax(0, 1fr))");
  });

  it("keeps server card stat tiles readable over busy backgrounds", () => {
    const themeCss = readFileSync(new URL("./base.css", import.meta.url), "utf8");
    const statRule = themeCss.slice(themeCss.indexOf(".server-card-stat {"), themeCss.indexOf(".server-card-meters"));

    expect(statRule).toContain("border: 1px solid");
    expect(statRule).toContain("--surface-solid");
    expect(statRule).toContain("font-weight: 850");
    expect(themeCss).toContain(':root[data-custom-background="true"] .server-card-stat');
  });

  it("keeps magical custom-background signal rows readable without the jelly wash", () => {
    const themeCss = readFileSync(new URL("./base.css", import.meta.url), "utf8");
    const signalRule = themeCss.slice(
      themeCss.indexOf(':root[data-custom-background="true"][data-theme-palette="magical-girl"] .signal-item'),
      themeCss.indexOf(':root[data-custom-background="true"][data-theme-palette="magical-girl"] .signal-item strong')
    );

    expect(signalRule).toContain("rgba(58, 44, 56, 0.72)");
    expect(signalRule).toContain("backdrop-filter: blur(12px) saturate(0.92)");
    expect(signalRule).not.toContain("var(--jelly-highlight), var(--glass-wash), var(--surface-solid)");
  });

  it("keeps shared controls off the heavy jelly and corner-sparkle button wash", () => {
    const themeCss = readFileSync(new URL("./base.css", import.meta.url), "utf8");
    const primaryCommandRule = themeCss.slice(themeCss.indexOf(".primary-command {"), themeCss.indexOf(".action-strip .primary-command"));

    expect(themeCss).toContain("--control-surface");
    expect(themeCss).toContain("--primary-command-surface");
    expect(themeCss).not.toContain("background: var(--jelly-highlight), var(--glass-wash), var(--surface-solid)");
    expect(themeCss).not.toContain("linear-gradient(145deg, rgba(255, 255, 255, 0.72), transparent 36%)");
    expect(primaryCommandRule).not.toContain("background-position: right 8px top 4px, center, center");
  });

  it("keeps magical-girl custom-background panel overlays restrained", () => {
    const themeCss = readFileSync(new URL("./base.css", import.meta.url), "utf8");
    const customMagicalRule = themeCss.slice(
      themeCss.indexOf(':root[data-custom-background="true"][data-theme-palette="magical-girl"] {'),
      themeCss.indexOf(':root[data-custom-background="true"][data-theme-palette="magical-girl"] .app-sidebar')
    );

    expect(customMagicalRule).toContain("--frame-accessory-opacity: 0.22");
    expect(customMagicalRule).toContain("rgba(22, 22, 29, 0.64)");
    expect(customMagicalRule).not.toContain("255, 119, 200, 0.78");
  });

  it("styles runtime task progress as a dialog with staged status", () => {
    const themeCss = readFileSync(new URL("./base.css", import.meta.url), "utf8");
    const progressRule = themeCss.slice(themeCss.indexOf(".runtime-task-backdrop"), themeCss.indexOf("/* ---- narrow screens ---- */"));

    expect(progressRule).toContain(".runtime-task-panel");
    expect(progressRule).toContain(".runtime-task-meter-track");
    expect(progressRule).toContain(".runtime-task-stages");
    expect(progressRule).toContain(".runtime-task-log");
    expect(progressRule).toContain("prefers-reduced-motion");
  });
});