/* Settings → Sleep and wake… (web/src/components/wake/WakePanel.tsx), built like the Profiles and
   Phones panels from their pieces (.profile-note for a profile's hooks, .profile-shown for
   Telegram's Auto / Off, .path-add for the fields): a row per switch, its label left and the
   switch right; the state line under the main switch, the buttons its state offers, the log; then
   the reaper and Telegram (its router's line while wake runs); Switch over…'s question and what it
   took over. The toolbar's "Wake stopped" (components/wake/WakeNote.tsx) is drawn
   as "Setup incomplete" (setup.css). Every rule here selects by class: the other sheets are
   upstream's, rule for rule. */

.wake-body { display: flex; flex-direction: column; gap: 10px; }
.wake-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.wake-label { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.wake-label .sheet-meta { font-weight: 400; }

/* The state line: what wake does now, in the panel's text color; down, in orange. */
.wake-state { margin: 0; line-height: 1.4; overflow-wrap: anywhere; }
.wake-state[data-state="crashed"],
.wake-state[data-state="notRunning"],
.wake-state[data-state="portTaken"] { color: var(--orange); }
.wake-read-only { margin: 0; }
.wake-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.wake-actions .button:disabled { opacity: 0.5; }

/* wake.log's last lines: scrolled, never wider than the panel. */
.wake-log {
  max-height: 240px;
  margin: 0;
  padding: 8px 10px;
  overflow: auto;
  border-radius: 8px;
  background: var(--fill);
  color: var(--label-2);
  font: 11.5px/1.45 var(--mono);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/* A shown profile without wake's hooks, or with the old plugin's: a note on an orange tint. */
.wake-hooks { --lane: var(--orange); }

/* A switch: a track with a knob, the accent's when on. */
.wake-switch {
  position: relative;
  flex: none;
  width: 38px;
  height: 22px;
  padding: 0;
  border: 0;
  border-radius: 11px;
  background: var(--fill-2);
  transition: background 150ms ease;
}
.wake-switch[aria-checked="true"] { background: var(--accent); }
.wake-switch:disabled { opacity: 0.5; }
.wake-switch:focus-visible { box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 35%, transparent); outline: 0; }
.wake-knob {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgb(0 0 0 / 0.25);
  transition: transform 150ms ease;
}
.wake-switch[aria-checked="true"] .wake-knob { transform: translateX(16px); }

/* The reaper and Telegram, each set off from what is above it. */
.wake-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 6px;
  padding-top: 12px;
  border-top: 0.5px solid var(--separator);
}
.wake-field { display: flex; align-items: center; gap: 8px; color: var(--label-2); font-size: 12px; }
.wake-field > span { flex: none; font-weight: 600; }
.wake-minutes { width: 72px; }
.wake-field-names { align-items: flex-start; flex-direction: column; gap: 4px; }
.wake-exclude { align-self: stretch; min-height: 64px; resize: vertical; font: 12px var(--mono); }
.wake-telegram-line { overflow-wrap: anywhere; }
.wake-launcher { align-self: flex-start; }
.wake-launcher:disabled { opacity: 0.5; }

/* Switch over… (the separate herdr-wake plugin holds wake): its question, then what it took over
   (or what the takeover at wake's first start did, until seen),
   each a note on the accent's tint, the lines one under the other. */
.wake-confirm,
.wake-switched,
.wake-taken-over { --lane: var(--accent); flex-direction: column; align-items: flex-start; gap: 8px; }
.wake-confirm p,
.wake-switched p,
.wake-taken-over p { align-self: stretch; overflow-wrap: anywhere; }

/* What the Telegram router does while wake runs. */
.wake-router { margin: 0; overflow-wrap: anywhere; }