/* remakes-d: review fixes (Remakes & Returns, scoped to .rm) */

/* Overview: one card/row style for every section */
.rm .list .ores .rmright { flex: none; display: inline-flex; align-items: center; justify-content: flex-end; text-align: right; }
.rm .rmempty { margin: 0; padding: 14px 16px; background: var(--surface); border: 1px solid var(--divider); border-radius: var(--r-card); }

/* Inline error summary on the new remake form */
.rm .rmerrsum { margin-top: 16px; padding: 10px 12px; border-radius: var(--r-ctl); background: var(--red-bg); color: var(--red); font-size: 0.875rem; font-weight: 600; }
.rm .rmerrsum[hidden] { display: none; }
.rm .fileb + .small:empty { display: none; }
.rm .err { color: var(--red); font-size: 0.875rem; }
.rm .fld > .err:not([hidden]), .rm .step > .err:not([hidden]) { display: block; margin-top: 4px; }

/* Phones and touch: 44px targets, tidy tab strips, no clipped text */
@media (max-width: 640px), (pointer: coarse) {
  .rm .subnav a, .rm .btn, .rm .tab, .rm .link.quiet, .rm .morelinks .link, .rm .xfoot .link, .rm .altlist .link,
  .rm .formact .link, .rm .submitbar .link, .rm .seg span, .rm .fileb, .rm .copts summary { min-height: 44px; }
  .rm .link { min-height: 44px; display: inline-flex; align-items: center; gap: 4px; }
  .rm .copts summary { display: flex; align-items: center; cursor: pointer; }
  .rm .ohead .meta a { min-height: 44px; display: inline-flex; align-items: center; }
  .rm .chkl { min-height: 44px; display: flex; align-items: center; gap: 8px; }
}
@media (max-width: 640px) {
  /* Four tabs: wrap onto two lines rather than hiding one off-screen */
  .rm .subnav { flex-wrap: wrap; overflow: visible; gap: 0 18px; }
  .rm .lineedit .tform { align-items: end; }
  .rm .ores .what b, .rm .ores .what span { overflow-wrap: anywhere; }
  .rm .list .ores { flex-wrap: wrap; gap: 4px 8px; }
  .rm .list .ores .what { flex: 1 1 100%; order: 0; }
  .rm .list .ores .rmright { justify-content: flex-start; }
  .rm .seg label { flex: 1 1 0; }
  .rm .seg span { width: 100%; justify-content: center; }
  .rm .submitbar .btn { flex: 1 1 100%; }
  .rm .facts dd, .rm .xsent { overflow-wrap: anywhere; }
}

/* Case table age: short form under the "Opened" header on wide screens, full label on phones */
.rm .rtable .rmshort { display: none; }
@media (min-width: 900px) {
  .rm .rtable .rmlong { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .rm .rtable .rmshort { display: inline; }
}

/* Remake & Warranty simplification (6 Oct 2026) */
.rm .rmcredit { display: flex; align-items: center; gap: 8px; margin: 12px 0 0; color: var(--muted); }
.rm .rmcredit svg { flex: none; width: 18px; height: 18px; }
.rm .rmcredit a { font-weight: 600; }
.rm .rmref { display: inline-flex; flex-direction: column; gap: 2px; min-width: 0; }
.rm .rmkind { font-size: 0.75rem; font-weight: 600; color: var(--muted); }
.rm .rmkind.warranty { color: var(--blue-ink); }
.rm .rmdetails { white-space: pre-wrap; overflow-wrap: anywhere; padding: 12px 14px; margin-bottom: 14px; background: var(--ground); border: 1px solid var(--divider); border-radius: var(--r-ctl); font-size: 0.9375rem; line-height: 1.5; }
.rm #rm-details { min-height: 140px; }
.rm .rmfiles { margin-top: 0; }
/* Status steps under the case heading */
.rm .rmsteps { list-style: none; margin: 4px 0 18px; padding: 0; display: flex; gap: 0; counter-reset: none; }
.rm .rmsteps li { flex: 1 1 0; min-width: 0; position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; font-size: 0.875rem; color: var(--muted); }
.rm .rmsteps li::before { content: ""; position: absolute; top: 11px; left: -50%; right: 50%; height: 2px; background: var(--line); z-index: 0; }
.rm .rmsteps li:first-child::before { display: none; }
.rm .rmsteps li.done::before, .rm .rmsteps li.now::before { background: var(--blue-btn); }
.rm .rmsteps i { position: relative; z-index: 1; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; border: 2px solid var(--line); background: var(--surface); font-style: normal; }
.rm .rmsteps i svg { width: 14px; height: 14px; }
.rm .rmsteps li.done i { background: var(--blue-btn); border-color: var(--blue-btn); color: var(--on-accent); }
.rm .rmsteps li.now i { border-color: var(--blue-btn); box-shadow: inset 0 0 0 4px var(--surface); background: var(--blue-btn); }
.rm .rmsteps li.now { color: var(--ink); font-weight: 700; }
.rm .rmsteps span { overflow-wrap: anywhere; }
@media (max-width: 640px) {
  /* Phones: only the current step keeps its label, so seven steps fit without scrolling */
  .rm .rmsteps li:not(.now) span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .rm .rmsteps li.now { flex: 2 1 0; }
  .rm .rmcredit { align-items: flex-start; }
}

/* ---------- Declutter pass (go-live) ---------- */
.rm .rmtop { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; margin-bottom: 20px; }
.rm .rmtop .rmcredit { margin: 0; }
.rm .rmwhy { margin: 0 0 10px; color: var(--amber); font-weight: 600; }
.rm .rmact { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.rmmore { position: relative; }
.rmmore > summary { list-style: none; display: inline-flex; align-items: center; gap: 4px; cursor: pointer; }
.rmmore > summary::-webkit-details-marker { display: none; }
.rmmore > summary .ic { width: 16px; height: 16px; }
.rmmenu { position: absolute; left: 0; top: calc(100% + 4px); z-index: 20; min-width: 220px; display: flex; flex-direction: column; padding: 4px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: var(--sh-pop); }
.rmmi { padding: 9px 12px; border: 0; border-radius: 6px; background: none; color: var(--ink); font: inherit; font-size: 0.875rem; text-align: left; cursor: pointer; white-space: nowrap; }
.rmmi:hover, .rmmi:focus-visible { background: var(--surface2); }
@media (pointer: coarse) { .rmmi { padding: 12px; } }
.rm .rmsteps { margin-bottom: 14px; }
.rm .ohead { margin-bottom: 10px; }
.rm .rmact { margin-bottom: 16px; }
.rm .rmact + .inform { margin-top: -4px; margin-bottom: 16px; }
.rtable.c.c2 .rhead, .rtable.c.c2 .rrow { grid-template-columns: 130px minmax(0, 1.4fr) minmax(0, 1.2fr) 170px 100px 110px; }
@media (max-width: 899px) { .rtable.c.c2 .rrow { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.rm .rmpri { font-weight: 700; }
.rm .rmpri.red { color: var(--red); }
.rm .rmpri.amber { color: var(--amber); }

/* ---------- Calm pass (6 Oct 2026): one header, one create button, shared by the pages in this group ---------- */
.hbar { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; margin-bottom: 8px; }
.hbar .pagehead { flex: 1 1 260px; min-width: 0; margin-bottom: 8px; }
.hbar h1 { font-size: 1.5rem; line-height: 1.25; }
.hbar .pagehead .lede { font-size: 0.9375rem; }
.hbar-act { flex: none; display: flex; align-items: center; gap: 8px; padding-top: 2px; }
.hbar + .subnav, .hbar + .tabs, .hbar + .stack, .hbar + .addrow, .hbar + .oneline { margin-top: 8px; }
.rm .hbar + .stack { margin-top: 20px; }
@media (max-width: 640px) {
  .hbar-act { width: 100%; }
  .hbar-act .btn { flex: 1 1 auto; justify-content: center; min-height: 44px; }
}
/* A tab with nothing in it is quieter and drops its count */
.tab.zero { font-weight: 500; opacity: 0.8; }
.tab.zero .n { display: none; }
.tab[aria-selected="true"].zero { opacity: 1; }
/* One-line empty state (no mascot) */
.oneline { margin: 0; padding: 14px 16px; background: var(--surface); border: 1px solid var(--divider); border-radius: var(--r-card); color: var(--muted); font-size: 0.9375rem; }
/* Reasons and notes are 14px or larger on these pages */
.rm .small, .crpage .small, .rtpage .small { font-size: 0.875rem; }
.rm .btn.small, .rtpage .btn.small { font-size: 0.875rem; }

/* ---------- Agent D design pass (remakes.js): tab counts, overdue rows, assign / park buttons ---------- */
.rmmod .subnav a .n { margin-left: 6px; font-size: 0.8125rem; font-weight: 600; color: var(--muted); }
.rtable.c .rrow.late { background: var(--red-bg); }
.rtable.c .rrow.urg { box-shadow: inset 3px 0 0 var(--red); }
.rmact { flex-wrap: wrap; }
.rmact .btn .ic { margin-right: 2px; }