/* Panelman's chrome, and the console's colour contract.

   The console never assumes a theme (package decision 2026-09-03-S). Its
   colours resolve through `--mkadmin-*` FIRST, then a host's own published
   properties, then CSS system colours as a guaranteed-paired last resort. A
   host that wants to state exactly what the console should use sets the
   `--mkadmin-*` block and needs nothing else. Panelman does — see `.mkadmin`
   at the foot of this file.

   THE RULE: NEVER SET A COLOUR ON ONE SIDE ONLY. Every rule that sets a
   background sets its text colour in the same rule, and the reverse. That is
   package decision 2026-09-03-T, and every one of the five faults found on the
   first dark host was that mistake. */

:root {
  /* Declared so the browser paints native control parts, scrollbars and any
     system colour to match this application rather than defaulting to the
     reader's preference. Panelman is a light design and says so.

     NOTE: this does NOT reach the console. `.mkadmin` sets its own
     `color-scheme: light dark` so that ITS last-resort system colours follow
     the reader — which is correct for a package that cannot know its host,
     and is exactly why the console must be told its colours explicitly rather
     than left to fall through. See the `.mkadmin` block. */
  color-scheme: light;

  --pm-bg: #f6f7f9;
  --pm-surface: #ffffff;
  --pm-surface-2: #eceff3;
  --pm-ink: #16202b;
  --pm-ink-soft: #55636f;
  --pm-ink-faint: #6b7481;
  --pm-line: #d3d9e0;
  --pm-accent: #1d4f78;
  --pm-accent-ink: #ffffff;
  --pm-danger: #b3261e;
  --pm-ok-bg: #e6f4ea;
  --pm-ok-ink: #14532d;
  --pm-ok-line: #96d5ab;
  --pm-warn-bg: #fdece9;
  --pm-warn-ink: #7a2318;
  --pm-warn-line: #f0b0a4;
  --pm-muted-bg: #eceff3;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--pm-bg);
  color: var(--pm-ink);
  font: 15px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

a { color: var(--pm-accent); }

.topbar {
  display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap;
  padding: .7rem 1.25rem;
  background: var(--pm-accent); color: var(--pm-accent-ink);
}
.topbar a { color: var(--pm-accent-ink); text-decoration: none; }
.topbar a:hover { text-decoration: underline; }
.brand { font-weight: 700; letter-spacing: .02em; }
.topbar nav { display: flex; gap: 1rem; }
.who { margin-left: auto; display: flex; align-items: center; gap: 1rem; }
.inline { display: inline; }
.linkish {
  background: none; border: 0; padding: 0; cursor: pointer;
  color: var(--pm-accent-ink); font: inherit; text-decoration: underline;
}

main { max-width: 1100px; margin: 1.5rem auto; padding: 0 1.25rem; }

/* ---- the message area. `ok` and `warn` must never look the same. ---- */
.messages { max-width: 1100px; margin: 1rem auto 0; padding: 0 1.25rem; list-style: none; }
.msg { padding: .7rem .9rem; border-radius: 6px; border: 1px solid; margin-bottom: .5rem; }
.msg-ok   { background: var(--pm-ok-bg);   color: var(--pm-ok-ink);   border-color: var(--pm-ok-line); }
.msg-warn { background: var(--pm-warn-bg); color: var(--pm-warn-ink); border-color: var(--pm-warn-line); }

.card {
  background: var(--pm-surface); color: var(--pm-ink);
  border: 1px solid var(--pm-line); border-radius: 8px;
  padding: 1rem 1.15rem; margin-bottom: 1.15rem;
}
h1, h2, h3 { line-height: 1.25; }
h1 { font-size: 1.5rem; margin: 0 0 .75rem; }
h2 { font-size: 1.15rem; margin: 0 0 .6rem; }

table { border-collapse: collapse; width: 100%; }
th, td { text-align: left; padding: .45rem .6rem; border-bottom: 1px solid var(--pm-line); }
th { color: var(--pm-ink-soft); font-weight: 600; font-size: .85rem; text-transform: uppercase; letter-spacing: .03em; }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
tr.total td { font-weight: 700; border-top: 2px solid var(--pm-line); }

input[type=text], input[type=email], input[type=password], input[type=number], textarea {
  background: var(--pm-surface); color: var(--pm-ink);
  border: 1px solid var(--pm-line); border-radius: 5px; padding: .45rem .55rem;
  font: inherit; width: 100%;
}
button.primary {
  background: var(--pm-accent); color: var(--pm-accent-ink);
  border: 1px solid var(--pm-accent); border-radius: 5px;
  padding: .5rem .95rem; font: inherit; cursor: pointer;
}
button.danger {
  background: var(--pm-warn-bg); color: var(--pm-warn-ink);
  border: 1px solid var(--pm-warn-line); border-radius: 5px;
  padding: .3rem .6rem; font: inherit; cursor: pointer;
}

.field { margin-bottom: .8rem; }
.field label { display: block; font-weight: 600; margin-bottom: .25rem; }
.hint { color: var(--pm-ink-soft); font-size: .875rem; }

/* ---- provenance. Never quiet, never optional. ---- */
.provenance {
  background: var(--pm-muted-bg); color: var(--pm-ink);
  border: 1px solid var(--pm-line); border-left: 4px solid var(--pm-accent);
  border-radius: 6px; padding: .6rem .8rem; margin-bottom: 1.15rem;
  font-size: .9rem;
}
.provenance strong { color: var(--pm-ink); }

.greyed { color: var(--pm-ink-soft); }
.exception { color: var(--pm-warn-ink); }
.pill {
  display: inline-block; padding: .1rem .5rem; border-radius: 999px;
  background: var(--pm-muted-bg); color: var(--pm-ink-soft);
  border: 1px solid var(--pm-line); font-size: .8rem;
}
.foot { max-width: 1100px; margin: 2rem auto; padding: 0 1.25rem; color: var(--pm-ink-soft); font-size: .85rem; }

/* ======================================================================
   THE ADMINISTRATION CONSOLE'S PALETTE
   ======================================================================

   WHAT WENT WRONG, so it is not repeated. The first version of this file
   published `--mkadmin-bg`, `--mkadmin-border` and `--mkadmin-accent-fg` on
   `:root`. **THE CONSOLE READS NONE OF THOSE THREE NAMES.** They were
   invented here rather than read out of the package's own
   `console/templates/_admin_console.css`, and a custom property that nothing
   reads is silent — it does not warn, it simply never applies.

   What the console actually reads is the eleven names below. Five of them
   were never published at all.

   The consequence was black-on-black at `/admin`. `--mk-surface` resolves as
   `var(--mkadmin-surface, var(--card, Canvas))`; Panelman published neither
   `--mkadmin-surface` nor `--card`, so it fell through to the system colour
   `Canvas`. `.mkadmin` declares `color-scheme: light dark`, so on a reader
   whose browser prefers dark, `Canvas` is near-black — while `--mkadmin-fg`
   WAS published, as this application's dark ink. Dark text, dark surface,
   on tabs, cards and every form control. The rest of the application was
   unaffected because nothing outside `.mkadmin` resolves through that chain.

   Set on `.mkadmin` rather than `:root` so the console's palette is one
   block a reader can check against the package's list, instead of being
   mixed into the application's own variables.

   DO NOT ADD A NAME HERE WITHOUT CHECKING IT AGAINST
   `_admin_console.css` — that file is the authority on what is read, and
   guessing is what caused this. */
.mkadmin {
  /* Text. `--mkadmin-fg` is the only one of these the broken version got
     right, which is precisely why it was black on black: correct ink over a
     surface that had fallen through to a system colour. */
  --mkadmin-fg: var(--pm-ink);
  --mkadmin-muted: var(--pm-ink-soft);
  --mkadmin-faint: var(--pm-ink-faint);

  /* Surfaces, and the line between them. `--mkadmin-surface` is the one whose
     absence produced the fault. */
  --mkadmin-surface: var(--pm-surface);
  --mkadmin-surface-2: var(--pm-surface-2);
  --mkadmin-line: var(--pm-line);

  /* Form controls — the role dropdowns among them. A control that sets one
     side inherits the other from the host, so both are stated. */
  --mkadmin-field-bg: var(--pm-surface);
  --mkadmin-field-fg: var(--pm-ink);

  /* THE PAIR THAT MUST NEVER BE SPLIT. The package's note is explicit: one is
     unreadable without the other. This is the same pair the application's own
     topbar and primary buttons use, so a selected tab reads as the same
     control as everything else on the screen. */
  --mkadmin-accent: var(--pm-accent);
  --mkadmin-accent-ink: var(--pm-accent-ink);

  /* "This one deletes something" has to keep meaning that, so it cannot be
     the accent. A red that is legible on this application's white cards. */
  --mkadmin-danger: var(--pm-danger);
}
