/* Request search (/search/) on top of /shared/ui.css and /csr.css. Layout pieces (lhead, lsearch, pills,
   fpanel, chips, scope, fab, rt) come from ui.css; this file only adds what is specific to this page. */

body.csr { height: 100vh; }
.lhead { background: var(--surface); border-bottom: 1px solid var(--line); }
.mact { display: flex; justify-content: flex-end; gap: 8px; margin-top: 4px; }

/* results: a table on desktop (Customer Service is used mostly at a desk), cards on phones */
.res { flex: 1; min-height: 0; display: flex; flex-direction: column; padding: 8px var(--gutter) 12px; }
.rhead { flex: none; padding: 2px 2px 8px; font-size: .9rem; }
.tw { flex: 1; min-height: 0; overflow: auto; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); }
.rt .id a { font-weight: 700; text-decoration: none; }
.rt .cust b { display: block; font-weight: 600; }
.rt .cust small { display: block; color: var(--muted); }
.rt .nw { white-space: nowrap; }
.rt .late { color: var(--danger); font-weight: 700; }
.rt .prio.p3 { color: var(--danger); font-weight: 600; }
.rt .prio.p1 { color: var(--muted); }
.empty { padding: 40px 20px; }
.morebar { display: flex; justify-content: center; padding: 12px 12px 88px; }   /* room so the New request button never covers Show more */
.morebar .btn[hidden] { display: none; }

@media (max-width: 720px) {
  body.csr { height: auto; }
  .tw { overflow: visible; }
  .rt thead { display: none; }
  .rt, .rt tbody, .rt tr, .rt td { display: block; }
  .rt tr { padding: 10px 12px; border-bottom: 1px solid var(--line); }
  .rt td { padding: 1px 0; border: 0; }
  .rt td:nth-child(1), .rt td:nth-child(2), .rt td:nth-child(6), .rt td:nth-child(8) { display: inline-block; margin-right: 10px; }
  .rt td:nth-child(7), .rt td:nth-child(9), .rt td:nth-child(10) { display: none; }
}