/* Alternatives for worksteps no module can do (the LLM fallback, parse/alternatives.py): the box above the
   Worksteps list (workflow layer) and under the Workstations' Worksteps report, the "no module" rows, the proposal
   cards. Tints are translucent so they sit on a light or a dark panel alike. */
.alt-box {
  --alt-accent: #2f6fdd;
  --alt-ok: #1e9e50;
  --alt-warn: #b7791f;
  --alt-bad: #c0392b;
  --alt-muted: #6b7280;
  --alt-line: rgba(127, 127, 127, 0.28);
  margin: 0 0 10px; padding: 8px 10px; font-size: 12.5px;
  border: 1px solid var(--alt-line); border-left: 3px solid var(--alt-bad); border-radius: 6px;
  background: rgba(192, 57, 43, 0.05);
}
#alt-box-twin { margin-top: 10px; }
.alt-box[hidden] { display: none; }
.alt-head { margin-bottom: 6px; line-height: 1.4; }
.alt-msg { margin: 6px 0; color: var(--alt-muted); }
.alt-box .btn, #prim-list .alt-find { font-size: 12px; padding: 3px 9px; }
.alt-box .btn:disabled, #prim-list .alt-find:disabled { opacity: 0.5; cursor: progress; }

.alt-card {
  margin-top: 8px; padding: 7px 9px; border: 1px solid var(--alt-line); border-radius: 6px;
  background: rgba(127, 127, 127, 0.04);
}
.alt-card.alt-accepted { border-left: 3px solid var(--alt-ok); }
.alt-card.alt-rejected { border-left: 3px solid var(--alt-warn); }
.alt-card.alt-no_proposal { border-left: 3px solid var(--alt-line); }
.alt-card-head { display: flex; align-items: center; gap: 8px; }
.alt-chip { font-size: 11px; padding: 1px 7px; border-radius: 10px; border: 1px solid currentColor; }
.alt-chip-ok { color: var(--alt-ok); }
.alt-chip-warn { color: var(--alt-warn); }
.alt-chip-none { color: var(--alt-muted); }
.alt-line, .alt-old, .alt-new {
  font-family: ui-monospace, Consolas, monospace; font-size: 11.5px; overflow-wrap: anywhere;
}
.alt-line { margin: 4px 0; color: var(--alt-muted); }
.alt-old { text-decoration: line-through; color: var(--alt-muted); }
.alt-new { color: var(--alt-ok); }
.alt-expl, .alt-changes { margin: 5px 0; padding-left: 18px; }
.alt-expl li, .alt-changes li { margin: 2px 0; }
.alt-reason { margin: 4px 0; color: var(--alt-muted); }
.alt-note { color: var(--alt-muted); }
.alt-buttons { display: flex; gap: 6px; margin-top: 6px; }

/* a workstep row with no module */
#prim-list li.alt-nomod { box-shadow: inset 3px 0 0 var(--alt-bad, #c0392b); }
#prim-list .alt-row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 4px;
  font-family: system-ui, "Segoe UI", sans-serif; font-size: 11.5px;
}
#prim-list .alt-badge {
  color: #c0392b; border: 1px solid currentColor; border-radius: 10px; padding: 0 6px; font-size: 11px;
}
#prim-list .alt-why { color: #6b7280; flex: 1 1 160px; min-width: 0; overflow-wrap: anywhere; }

/* the analysis running in the background (2026-10-31): spinner line, row states, covered / pending cards, the
   checked options the app found (a closed list under each card) */
.alt-busy { display: flex; align-items: center; gap: 8px; }
.alt-spinner {
  flex: none; width: 12px; height: 12px; border-radius: 50%;
  border: 2px solid var(--alt-line); border-top-color: var(--alt-accent);
  animation: alt-spin 0.9s linear infinite;
}
@keyframes alt-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .alt-spinner { animation: none; } }
.alt-fail { color: var(--alt-bad); }
.alt-card.alt-covered { border-left: 3px solid var(--alt-ok); opacity: 0.85; }
.alt-card.alt-pending { border-left: 3px dashed var(--alt-accent); }
.alt-card.alt-flash { box-shadow: 0 0 0 2px var(--alt-accent); transition: box-shadow 0.3s; }
.alt-options { margin: 5px 0 0; color: var(--alt-muted); }
.alt-options summary { cursor: pointer; font-size: 11.5px; }
.alt-options ul { margin: 4px 0; padding-left: 18px; }
.alt-options li { margin: 3px 0; font-size: 11.5px; overflow-wrap: anywhere; }
.alt-options li.alt-chosen { color: inherit; font-weight: 600; }
#prim-list .alt-rowstate {
  font-size: 11px; padding: 0 6px; border-radius: 10px; border: 1px solid currentColor; cursor: pointer;
  color: #6b7280;
}
#prim-list .alt-rowstate-accepted, #prim-list .alt-rowstate-covered { color: #1e9e50; }
#prim-list .alt-rowstate-rejected { color: #b7791f; }
#prim-list .alt-rowstate-pending { color: #2f6fdd; cursor: default; }
/* the analysis failed before the LLM judged a card (2026-10-31): it says so instead of waiting forever */
.alt-card.alt-unjudged { border-left: 3px dashed var(--alt-warn); }
#prim-list .alt-rowstate-unjudged { color: #b7791f; }

/* AUTO MODE (2026-10-31): the toggle, the changes applied (Undo), the steps the SOP does not have */
.alt-applied { margin: 6px 0; }
.alt-auto { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; font-size: 12px; }
.alt-applied-head { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.alt-applied-list { margin: 4px 0; padding-left: 0; list-style: none; }
.alt-applied-item { margin: 4px 0; padding: 5px 8px; border: 1px solid var(--alt-line); border-left: 3px solid var(--alt-ok);
  border-radius: 6px; }
.alt-applied-item .btn { margin-left: auto; }
.alt-options li.alt-typegap::marker { color: var(--alt-accent); }
#prim-list li.alt-added { box-shadow: inset 3px 0 0 rgba(47, 111, 221, 0.55); font-style: italic; }
#prim-list .alt-added-badge {
  font-style: normal; font-size: 10.5px; margin-right: 6px; padding: 0 5px; border-radius: 9px;
  border: 1px dashed #2f6fdd; color: #2f6fdd;
}
