/* Daily Life Doc, round 33 (zone I): the card Invite in Settings (js/settings/settings-invite.js): the Account card's
   fields (.ac-f), Copy link and Send text side by side, the link shown only when the browser refused the clipboard,
   then the list: the name, the state words in grey, End in red for a waiting invite. */

.iv-err { margin: -4px 2px 12px; }
.iv-go { display: flex; flex-wrap: wrap; gap: 8px; }
.iv-link { margin-top: 10px; }
.iv-link input { width: 100%; min-height: 42px; padding: 0 12px; border: 0; border-radius: 12px; background: var(--field); color: var(--ink); font: inherit;
  font-size: var(--t-xs); }
.iv-list:not(:empty) { margin-top: 14px; }
.iv-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; align-items: center; box-sizing: border-box; min-height: 50px; padding: 10px 0;
  border-top: 1px solid var(--cardline); }
.iv-row.iv-new { animation: iv-in .2s ease-out; }
.iv-row b { font-size: var(--t-s); font-weight: 600; color: var(--ink); overflow-wrap: anywhere; }
.iv-row span { font-size: var(--t-xs); color: var(--ink3); text-align: right; }
.iv-end { padding: 6px 2px; font-size: var(--t-xs); font-weight: 600; color: var(--bad); }
.iv-end:hover { color: var(--bad-d); }
@keyframes iv-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .iv-row.iv-new { animation: none; } }
@media (max-width: 400px) {
  .iv-row { grid-template-columns: minmax(0, 1fr) auto; row-gap: 2px; }
  .iv-row span { grid-column: 1; grid-row: 2; text-align: left; }
  .iv-end { grid-column: 2; grid-row: 1 / span 2; }
  .iv-go .pill { flex: 1; }
}