/* Friend requests, look A (src/routes/friends.js requestList, requestsCard, bellRequests, homeRequests): the friends-list row
   (friends.css .fr-row) with one line and two buttons. Loaded on every page with friends.css (layout.js), since requests show in
   the bell dropdown and on Home. Phones stack Accept (on top, full width) and Decline; wider screens put them side by side. */
.rq-list { list-style: none; margin: 0; padding: 0; }
.rq-acts { display: grid; gap: 12px; margin: 12px 0 0; grid-column: 1 / -1; position: relative; z-index: 2; }
.rq-acts form { margin: 0; }
.rq-acts .btn { width: 100%; min-height: 44px; }
.rq-h3 { margin: 16px 0 4px; font-size: 1.05rem; }
.rq-pill { background: var(--sun-soft); white-space: nowrap; }
.rq-sent .fr-face { opacity: .85; }
.rq-a .fr-live small { margin-left: 4px; }
@media (min-width: 768px) {
  .rq-acts { grid-template-columns: 1fr 1fr; }
  .rq-acts.rq-cancel { grid-template-columns: auto; }
  /* /friends rows: the buttons move right, as a friend row's do */
  .rq-wrap .fr-row .rq-acts { grid-column: 3; margin-top: 0; align-self: center; grid-template-columns: auto auto; }
  .rq-wrap .fr-row .rq-acts .btn { width: auto; }
}

/* Bell dropdown (and the Bell Tower page): requests sit above the pings, under their own heading, until answered. */
.rq-bell { padding-bottom: 6px; border-bottom: 2px dashed var(--rule); }
.rq-bell-h { display: block; margin-top: 4px; font: 600 var(--fs-sm) var(--display); color: var(--emph); }
.bell-panel .fr-row { padding: 10px 0; }
.bell-panel .fr-name { font-size: 1rem; }
.bell-panel { max-height: calc(100vh - 120px); overflow-y: auto; } /* a long list of requests scrolls inside the dropdown */

/* Home: requests open the Friends today card. */
.rq-home { margin-bottom: 12px; padding-bottom: 12px; border-bottom: 2px dashed var(--rule); }
.rq-home .rq-h3 { margin-top: 0; }
.rq-home .fr-name { font-size: 1.05rem; }
