/* system/apps/repo-tools/styles.css
 *
 * First increment (Sept 17, 2026) of the four-tab consolidation --
 * see this app's app.js header and branch-workflow-plan.md's "Next
 * thread" section. The font-size/select/button rules below are
 * deliberately copied from apps/manage-repo-files/styles.css rather
 * than left as a dependency on that app's stylesheet still being
 * loaded -- these are proven, on-device-confirmed fixes (single font
 * size via var(--fs-md) + inheritance, select width capped so a long
 * branch name can't force the page wider than the screen, native form
 * controls given `font: inherit`) that this app needs to stand on its
 * own, especially since apps/manage-repo-files is expected to be
 * retired once History and its own tab migrate in here. Not extracted
 * to shared-app-styles yet -- with apps/manage-repo-files still
 * running its own near-identical copy in parallel this round, calling
 * it a genuine shared convention and centralizing it is better done
 * in the same pass that actually deletes that duplicate, not before.
 */
.repo-tools {
  width: 100%;
  text-align: left;
  font-size: var(--fs-md);
}

.repo-tools select,
.repo-tools input,
.repo-tools textarea,
.repo-tools button {
  font: inherit;
}

.repo-tools select {
  /* Same reasoning as manage-repo-files: an unstyled <select> has no
     width limit by default, and a long branch name can force the row
     -- and the page -- wider than the screen. */
  max-width: 65vw;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.repo-tools input[type="text"] {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.repo-tools .status-line {
  font-family: var(--font-sans);
  font-size: inherit;
  color: var(--slate-light);
  margin-top: 10px;
  white-space: pre-wrap;
}

.repo-tools .rt-label {
  display: block;
  font-weight: 600;
  color: var(--slate);
  margin-top: 14px;
  margin-bottom: 6px;
}

.repo-tools .rt-subhead {
  margin-top: 22px;
  margin-bottom: 4px;
  font-size: inherit;
  font-weight: 700;
}

.repo-tools button {
  padding: 9px 16px;
  border-radius: 999px;
  border: 1.5px solid var(--brand);
  background: var(--brand);
  color: #fff;
  font-family: var(--font-sans);
  font-weight: 600;
  cursor: pointer;
}
.repo-tools button.secondary { background: #fff; color: var(--brand); }
.repo-tools button.danger { background: #fff; color: #c23b3b; border-color: #c23b3b; }
.repo-tools button:disabled { opacity: 0.5; cursor: default; }
.repo-tools .row-buttons { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; }

/* ---------- tab bar ---------- */
.repo-tools .rt-tab-bar {
  display: flex;
  gap: 6px;
  margin-bottom: 14px;
  border-bottom: 1.5px solid var(--line);
}
.repo-tools .rt-tab-btn {
  background: none;
  border: none;
  border-radius: 0;
  color: var(--slate-light);
  font-weight: 600;
  padding: 8px 4px 10px;
  margin-bottom: -1.5px;
  border-bottom: 2.5px solid transparent;
}
.repo-tools .rt-tab-btn--active {
  color: var(--brand);
  border-bottom-color: var(--brand);
}
.repo-tools .rt-tab-btn--reset {
  color: #c23b3b;
}
.repo-tools .rt-tab-btn--reset.rt-tab-btn--active {
  color: #c23b3b;
  border-bottom-color: #c23b3b;
}
.repo-tools .rt-tab-panel.hidden { display: none; }

/* ---------- reset-to-main: the button IS the page (philosophy.md,
   "content vs. action") -- not one of several actions on a page of
   content, so it doesn't follow the label/status-line/button rhythm
   the rest of this app uses. ---------- */
.repo-tools .rt-reset-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 36px 12px 12px;
  gap: 18px;
}
.repo-tools .rt-reset-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  border: none;
  background: #c23b3b;
  color: #fff;
  box-shadow: 0 4px 18px rgba(194, 59, 59, 0.45);
}
.repo-tools .rt-reset-btn:active {
  background: #a52f2f;
  box-shadow: 0 2px 8px rgba(194, 59, 59, 0.45);
}
.repo-tools .rt-reset-btn svg { fill: #fff; }
.repo-tools .rt-reset-btn-label {
  font-weight: 700;
  font-size: var(--fs-md);
  letter-spacing: 0.02em;
}
.repo-tools .rt-reset-note {
  max-width: 42ch;
  color: var(--slate-light);
}

/* ---------- build status list ---------- */
.repo-tools .rt-builds-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.repo-tools .rt-build-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.repo-tools .rt-build-branch {
  font-weight: 600;
  overflow-wrap: anywhere;
}
.repo-tools .rt-build-status {
  font-size: var(--fs-2xs);
  color: var(--slate-light);
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--paper);
}
.repo-tools .rt-build-status--success { color: #1e8e5a; background: #e6f6ee; }
.repo-tools .rt-build-status--fail { color: #c23b3b; background: #fdeaea; }
.repo-tools .rt-build-status--running,
.repo-tools .rt-build-status--queued,
.repo-tools .rt-build-status--initializing { color: #7a5a12; background: #fff7e6; }
.repo-tools .rt-build-link {
  margin-left: auto;
  font-weight: 600;
}