/* Breadcrumbs page (ticket 613), route #/synthetic-markers: the scripts table and the registered machines
   table. Both reuse table.data, .section, .table-scroll and .btn--small from console.css; only the
   rules below are new. A row opens nothing, so the pointer cursor table.data gives a row is undone.
   The script wizard (ticket 614, route #/synthetic-markers/new) draws its question and review screens
   with the shared rules in wizard.css; the finish screen it ends on (ticket 615) has the last rules here. */

table.breadcrumbs-table tbody tr {
  cursor: default;
}

.breadcrumbs-file {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  /* A long file name breaks where it must instead of widening its column (ticket 659). */
  overflow-wrap: anywhere;
}

/* The scripts table fits its container (ticket 659). console.css gives every `table.data td`
   `white-space: nowrap`, so each cell's narrowest width was its whole text and a fleet row made the
   table 1705 px wide in a 1230 px container, with Download, the token state and Remove script
   off-screen at 1440 px. The cells wrap here instead; the Created stamp stays on one line so a date
   never splits. The selector carries the `data` class on purpose: `table.data td` is (0,1,2) and a
   bare `.breadcrumbs-scripts td` (0,1,1) would lose to it. Under about 720 px the table keeps
   its min-width and scrolls sideways inside .table-scroll, as every table.data does. */
table.data.breadcrumbs-scripts td {
  white-space: normal;
}

table.data.breadcrumbs-scripts td:first-child {
  white-space: nowrap;
}

/* The last two columns, Download and Remove, are one button each (ticket 001086, audit page 31): they take
   the width of their buttons (`width: 1%` shrinks a column to its narrowest content, and a button never
   wraps) and leave the rest to the text columns; a fetch-token note under a button still wraps, so a fleet
   row cannot push the table past its container again (ticket 659). The count is from the right because a
   listed remote Station adds a column in the middle. */
table.data.breadcrumbs-scripts th:nth-last-child(-n + 2),
table.data.breadcrumbs-scripts td:nth-last-child(-n + 2) {
  width: 1%;
}

table.data.breadcrumbs-scripts td:nth-last-child(-n + 2) .btn {
  white-space: nowrap;
}

.breadcrumbs-missing {
  color: var(--ink-dim);
  font-style: italic;
}

/* A fleet script's fetch token (ticket 622): its state beside the Download button, in words as well as
   colour, and the line under the fleet row's Remove script button. */
.breadcrumbs-token {
  display: block;
  margin: 0.25rem 0 0;
  font-size: var(--fs-2xs);
  color: var(--ink-dim);
}

.breadcrumbs-token--active {
  color: var(--health-ok);
}

.breadcrumbs-token--expired {
  color: var(--st-4xx);
}

.breadcrumbs-token--revoked {
  color: var(--health-down);
}

.breadcrumbs-hint {
  display: block;
  margin-top: 0.25rem;
  max-width: 16rem;
  /* The td above it is nowrap in console.css, which kept this line on one row (ticket 659). */
  white-space: normal;
  color: var(--ink-dim);
  font-size: var(--fs-2xs);
  line-height: 1.4;
}

/* The revoke offer in a fleet row's Delete ask (ticket 652): the box and its words on their own line,
   above the help line that says what ticking it does. */
.breadcrumbs-revoke {
  display: block;
  margin-top: 0.25rem;
  color: var(--ink-body);
  font-size: var(--fs-xs);
  white-space: normal;
}

.breadcrumbs-revoke input {
  margin-right: 0.35rem;
}

/* A row of a batch (ticket 623) also has a "Download list (zip)" button, under the row's own Download. */
.breadcrumbs-batch {
  display: block;
  margin-top: 0.25rem;
}

/* ---- Finish screen (ticket 615): the file, then the commands to run it, each one copyable ------- */

.wizard-finish__section {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--border);
}

.wizard-finish__heading {
  margin: 0;
  font-size: var(--fs-md);
  color: var(--ink);
}

.wizard-code {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.wizard-code__label {
  margin: 0;
  color: var(--ink-dim);
  font-size: var(--fs-xs);
}

.wizard-code__row {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.wizard-code__pre {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  padding: 0.6rem 0.75rem;
  background: var(--panel-deep);
  border: 1px solid var(--border-strong);
  border-radius: 0.45rem;
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  line-height: 1.5;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  user-select: all;
}

.wizard-code__row .btn {
  flex: 0 0 auto;
}

/* ---- Synthetic Files tab (ticket 001021): the tab bar, the create form, the result and the list ---- */

.markers-tabs {
  margin: 0 0 1rem;
}

.synthetic-files-make,
.synthetic-files-result,
.synthetic-files-list {
  margin-bottom: 1.5rem;
}

.synthetic-files-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.synthetic-files-field {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  color: var(--ink-dim);
  font-size: var(--fs-xs);
}

.synthetic-files-field legend {
  padding: 0;
  margin-bottom: 0.35rem;
  color: var(--ink-dim);
  font-size: var(--fs-xs);
}

.synthetic-files-choices {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  gap: 0.6rem;
}

/* One kind or one Connector: a bordered card with the radio, its name and its line of help. */
.synthetic-files-choice {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.2rem 0.5rem;
  padding: 0.7rem 0.85rem;
  border: 1px solid var(--border-strong);
  border-radius: 0.6rem;
  background: var(--glass);
  cursor: pointer;
}

.synthetic-files-choice:focus-within {
  border-color: var(--border-gold);
  box-shadow: 0 0 0 2px var(--gold-soft);
}

.synthetic-files-choice.is-disabled {
  cursor: default;
  opacity: 0.8;
}

.synthetic-files-choice__label {
  color: var(--ink);
  font-size: var(--fs-base);
  font-weight: 600;
}

.synthetic-files-choice .breadcrumbs-hint {
  flex: 1 1 100%;
  max-width: none;
}

.synthetic-files-field .breadcrumbs-hint {
  max-width: 40rem;
}

/* The placement warning above Create, and the one in the result: said in a gold note box. */
.synthetic-files-warning {
  margin: 0;
  padding: 0.6rem 0.75rem;
  border: 1px solid var(--border-gold);
  border-radius: 6px;
  background: var(--gold-soft);
  color: var(--ink-body);
  font-size: var(--fs-xs);
  line-height: 1.5;
}

.synthetic-files-warning:empty {
  display: none;
}

.synthetic-files-error {
  max-width: none;
  min-height: 1.2em;
  color: var(--health-down);
}

.synthetic-files-form__actions,
.synthetic-files-result__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}

.synthetic-files-file {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  margin: 0.75rem 0;
}

.synthetic-files-file__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.synthetic-files-file__name {
  color: var(--ink-dim);
  font-size: var(--fs-xs);
}

.synthetic-files-file__body {
  margin: 0;
  padding: 0.6rem 0.75rem;
  background: var(--panel-deep);
  border: 1px solid var(--border-strong);
  border-radius: 0.45rem;
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  line-height: 1.5;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/* The list: the memo wraps where it must, the Revoke ask sits in its cell, and a revoked row is dimmed. */
table.data.synthetic-files-table td {
  white-space: normal;
}

table.data.synthetic-files-table td:nth-child(4),
table.data.synthetic-files-table td:nth-child(5) {
  white-space: nowrap;
}

.synthetic-files-memo {
  overflow-wrap: anywhere;
}

.synthetic-files-row--revoked td {
  color: var(--ink-dim);
}

.synthetic-files-actions .btn + .btn {
  margin-left: 0.35rem;
}

/* An alert a Synthetic File raised names the file under its summary on the Fleet page (ticket 001021). */
.fleet-alerts__file {
  display: block;
  margin-top: 0.2rem;
  color: var(--ink-dim);
  font-size: var(--fs-2xs);
  white-space: normal;
}