/* Rollins: app-only rules, after the idp-theme webjar's theme.css. Colours and sizes come from its tokens. */

[x-cloak] { display: none !important; }
.fill { display: contents; }

body { background: var(--color-surface); }
.rollins { min-height: 100vh; display: flex; flex-direction: column; }
.rollins-navbar { border-bottom: 1px solid var(--color-divider); }
.rollins-body { flex: 1; padding-bottom: 4rem; }
.rollins-body .admin-main { max-width: 72rem; }

/* side nav: long app names end in an ellipsis */
.rollins-nav-app { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }

/* stat tiles over a target's QA tab and the rebuild plan */
.rollins-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: var(--space-4); }
.rollins-stats .card-body { display: flex; flex-direction: column; gap: var(--space-1); }
.rollins-stat { font-size: 1.75rem; font-weight: 600; line-height: 1.2; letter-spacing: -0.01em; }

/* table cells: a link with a mono line under it */
.rollins-row-link { font-weight: 500; color: var(--color-fg); text-decoration: none; }
.rollins-row-link:hover { text-decoration: underline; }
.rollins-sub { font-size: 0.75rem; color: var(--color-fg-subtle); overflow-wrap: anywhere; }
.rollins-dashboard td { vertical-align: top; }
.rollins-last { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; }

.rollins-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--color-fg-subtle); }
.rollins-dot.tone-success { background: var(--color-success-fg); }
.rollins-dot.tone-danger { background: var(--color-danger-fg); }
.rollins-dot.tone-warning { background: var(--color-warn-fg); }
.rollins-dot.tone-info { background: var(--color-info-fg); animation: rollins-pulse 1.2s ease-in-out infinite; }
@keyframes rollins-pulse { 50% { opacity: 0.35; } }

/* branch picker */
.rollins-picker td { vertical-align: middle; }
.rollins-group-row td { padding-top: var(--space-4); background: var(--color-surface-sunken); }
.rollins-pick-row { cursor: pointer; }
.rollins-check { display: inline-flex; align-items: center; gap: var(--space-2); }
.rollins-pick-row:hover td { background: var(--color-row-hover); }
.rollins-pick-row.is-blocked { cursor: default; }
.rollins-pick-row.is-blocked td { color: var(--color-fg-muted); }
.rollins-ticket a.rollins-branch-name { max-width: 28rem; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* prod: one row per ticket, its commits under the summary */
.rollins-ship-commits { list-style: none; margin: var(--space-1) 0 0; padding: 0; display: flex; flex-direction: column; gap: 2px; font-size: 0.8125rem; }
.rollins-ship-commits li { color: var(--color-fg-secondary); }

.rollins-commit-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); }

/* step lists: deploy progress, resolved-merge checks, rebuild rows, pipeline steps */
.rollins-steps, .rollins-checks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.rollins-steps li, .rollins-checks li, .rollins-inline-step { display: flex; align-items: center; gap: var(--space-2); }
.rollins-step-mark { width: 1.25rem; flex: none; text-align: center; font-family: var(--font-mono); color: var(--color-fg-subtle); }
.is-passed .rollins-step-mark, .is-merged .rollins-step-mark { color: var(--color-success-fg); }
.is-failed .rollins-step-mark, .is-conflict .rollins-step-mark { color: var(--color-danger-fg); }
.is-running .rollins-step-mark, .is-merging .rollins-step-mark { color: var(--color-info-fg); animation: rollins-pulse 1.2s ease-in-out infinite; }
.is-pending { color: var(--color-fg-muted); }
.rollins-dropped td:not(.table-check) { color: var(--color-fg-subtle); text-decoration: line-through; text-decoration-color: var(--color-border-strong); }
.rollins-dropped td .badge { text-decoration: none; }

.rollins-code {
  margin: 0;
  padding: var(--space-3) var(--space-4);
  font: 400 0.8125rem/1.6 var(--font-mono);
  white-space: pre-wrap;
  background: var(--color-surface-sunken);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}

/* pipeline or rollout: one row per step, its log under it */
.rollins-pipeline { display: flex; flex-direction: column; }
.rollins-pipeline-step + .rollins-pipeline-step { border-top: 1px solid var(--color-divider); }
.rollins-pipeline-head {
  display: flex; align-items: center; gap: var(--space-2); width: 100%;
  padding: var(--space-3) var(--space-5); background: none; border: 0; color: inherit; text-align: left; cursor: pointer;
}
.rollins-pipeline-head:hover { background: var(--color-row-hover); }
.rollins-log { margin: 0 var(--space-5) var(--space-4); max-height: 20rem; overflow: auto; }

/* confirmations: a native dialog.modal opened with showModal(), so the theme's ::backdrop dims the page;
   wider than the theme's 28rem for the list of commits */
.rollins-dialog { --bs-modal-width: 34rem; }

.rollins-toasts { position: fixed; right: var(--space-6); bottom: 4rem; z-index: 1100; display: flex; flex-direction: column; gap: var(--space-2); }

.rollins-signin { margin: 12vh auto 0; max-width: 26rem; display: flex; flex-direction: column; gap: var(--space-4); }

/* mock-only */
.rollins-mock-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 1090;
  display: flex; align-items: center; gap: var(--space-3);
  padding: var(--space-2) var(--space-4);
  background: var(--color-surface-raised); border-top: 1px dashed var(--color-border-strong);
}
.rollins-mock-bar.is-hidden { right: auto; border-right: 1px dashed var(--color-border-strong); }

@media (max-width: 900px) {
  .rollins-body.admin { grid-template-columns: minmax(0, 1fr); }
  .rollins-mock-bar { overflow-x: auto; }
}

.rollins-attention { margin: var(--space-1) 0 0; padding-left: 1.1rem; display: flex; flex-direction: column; gap: 2px; }

/* Jira and Bitbucket links */
.rollins-badge-link { text-decoration: none; }
.rollins-badge-link:hover { filter: brightness(1.15); }
.rollins-keys { display: inline-flex; flex-wrap: wrap; gap: var(--space-2); }
.rollins-keys a, .rollins-ext { color: inherit; text-underline-offset: 2px; }
.rollins-ticket { display: flex; flex-direction: column; gap: 2px; min-width: 16rem; }
.rollins-ticket-summary { font-size: 0.8125rem; color: var(--color-fg-secondary); }
td > .rollins-ext, td > a.rollins-ext { display: inline-block; max-width: 16rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }

/* e2e runs after the deploy is live and is not waited for */
.rollins-pipeline-step.is-after-live { border-top: 1px dashed var(--color-border-strong); }
.rollins-pipeline-step.is-after-live::before {
  content: "after the deploy is live · not waited for";
  display: block; padding: var(--space-2) var(--space-5) 0;
  font: 500 0.6875rem/1.4 var(--font-mono); letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-fg-subtle);
}