/* GFC Builds: tenant Screening and notifications (11/1). Same tokens as app.css and
   tabs.css: navy chrome, 2px edges, 48px+ targets, green pass, red fail, amber waiting. */

.sc-body .card { margin-top: 14px; }
.sc-card { padding: 16px; }
.sc-ch { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.sc-ch h2 { margin: 0; font: 850 17px/1.25 var(--font); color: var(--ink); }
.sc-ch .s { font: 650 14px/1.2 var(--font); color: var(--ink-2); }
.sc-muted { margin: 8px 0 12px; font: 600 14.5px/1.4 var(--font); color: var(--ink-2); }
.sc-line { margin: 0 0 10px; font: 600 15px/1.45 var(--font); color: var(--ink); }
.sc-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 360px) { .sc-two { grid-template-columns: 1fr; } }

/* status pills */
.sc-pill { display: inline-flex; align-items: center; min-height: 26px; padding: 0 10px; border-radius: var(--r-pill); font: 850 12.5px/1 var(--font); white-space: nowrap; }
.sc-st-new { background: var(--navy-tint); color: var(--navy); }
.sc-st-work { background: var(--sunk); color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--hair); }
.sc-st-wait { background: var(--amber-tint); color: var(--amber-ink); box-shadow: inset 0 0 0 1.5px var(--amber-edge); }
.sc-st-ok { background: var(--green-tint); color: var(--green); box-shadow: inset 0 0 0 1.5px var(--green-edge); }
.sc-st-no { background: var(--red-tint); color: var(--red); box-shadow: inset 0 0 0 1.5px var(--red-edge); }
.sc-st-off { background: var(--sunk); color: var(--ink-3); }
.sc-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.sc-under { color: var(--red); }

/* status card */
.sc-decide { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 6px; }
.sc-onb {
  display: flex; align-items: center; gap: 10px; min-height: 52px; margin: 4px 0 10px; padding: 0 14px; border-radius: var(--r-md);
  background: var(--green-tint); color: var(--green); font: 800 15.5px/1.2 var(--font); text-decoration: none; box-shadow: inset 0 0 0 1.5px var(--green-edge);
}
.sc-onb span { flex: 1; }

/* income */
.sc-inc { display: grid; gap: 4px; }
.sc-inc b { font: 900 30px/1.05 var(--font); letter-spacing: -.02em; color: var(--ink); }
.sc-inc span { font: 650 15px/1.35 var(--font); color: var(--ink-2); }

/* applicants and documents */
.sc-plist, .sc-docs { display: grid; gap: 8px; margin-bottom: 12px; }
.sc-prow, .sc-doc {
  appearance: none; display: flex; align-items: center; gap: 12px; width: 100%; min-height: 64px; padding: 9px 12px;
  border: var(--bw) solid var(--line); border-radius: var(--r-md); background: var(--card); color: var(--ink); font: inherit; text-align: left; text-decoration: none; cursor: pointer;
}
.sc-prow > div, .sc-doc > div { flex: 1; min-width: 0; }
.sc-prow b, .sc-doc b { display: block; font: 800 15.5px/1.25 var(--font); }
.sc-prow .s, .sc-doc .s { display: block; margin-top: 2px; font: 600 13.5px/1.3 var(--font); color: var(--ink-2); overflow-wrap: anywhere; }
.sc-prow .avatar { width: 40px; height: 40px; font-size: 13px; }
.sc-prow > .ic, .sc-doc > .ic { flex: none; color: var(--ink-3); }
.sc-people { display: grid; gap: 10px; margin-bottom: 10px; }
.sc-person { display: grid; gap: 6px; padding: 10px; border-radius: var(--r-md); background: var(--sunk); border: var(--bw-hair) solid var(--hair); }
.sc-up { min-height: 20px; margin: 8px 0 0; font: 650 14.5px/1.3 var(--font); color: var(--ink-2); }

/* checklist */
.sc-checks { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.sc-check {
  appearance: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 60px; padding: 9px 12px;
  border: var(--bw) solid var(--line); border-radius: var(--r-md); background: var(--card); color: var(--ink); font: inherit; text-align: left; cursor: pointer;
}
.sc-check > div { min-width: 0; flex: 1; }
.sc-check b { display: block; font: 800 15px/1.25 var(--font); }
.sc-check .s { display: block; margin-top: 2px; font: 600 13px/1.3 var(--font); color: var(--ink-2); }
.sc-state { flex: none; display: inline-flex; align-items: center; min-height: 28px; padding: 0 10px; border-radius: var(--r-pill); font: 850 12.5px/1 var(--font); white-space: nowrap; }
.sc-ok { background: var(--green-tint); color: var(--green); box-shadow: inset 0 0 0 1.5px var(--green-edge); }
.sc-no { background: var(--red-tint); color: var(--red); box-shadow: inset 0 0 0 1.5px var(--red-edge); }
.sc-na { background: var(--sunk); color: var(--ink-3); }
.sc-todo { background: var(--amber-tint); color: var(--amber-ink); box-shadow: inset 0 0 0 1.5px var(--amber-edge); }

/* Jango review */
.sc-rec { display: grid; gap: 10px; margin-bottom: 6px; }
.sc-rec .tb-verdict { justify-self: start; }
.sc-rec p { margin: 0; font: 650 15.5px/1.45 var(--font); color: var(--ink); }
.sc-sec { margin-top: 14px; padding-top: 12px; border-top: var(--bw-hair) solid var(--hair); }
.sc-sec h3 { margin: 0 0 6px; font: 850 14px/1.2 var(--font); letter-spacing: .04em; text-transform: uppercase; color: var(--ink-2); }
.sc-sec > p { margin: 0 0 6px; font: 650 15px/1.4 var(--font); color: var(--ink); }
.sc-list { margin: 4px 0 0; padding-left: 20px; display: grid; gap: 4px; font: 600 15px/1.4 var(--font); color: var(--ink); }
.sc-good li::marker { color: var(--green); }
.sc-bad li::marker { color: var(--red); }
.sc-mini { display: block; margin-top: 8px; font: 800 13.5px/1.2 var(--font); color: var(--ink-2); }
.sc-sec + .btn, .sc-card > .btn-block { margin-top: 14px; }
.sc-reading { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: var(--r-md); background: var(--navy-tint); }
.sc-reading .ic { flex: none; width: 24px; height: 24px; color: var(--navy); }
.sc-reading b { display: block; font: 800 15.5px/1.25 var(--font); color: var(--navy); }
.sc-reading .s { display: block; margin-top: 2px; font: 600 13.5px/1.3 var(--font); color: var(--ink-2); }

/* the bell on the top bar */
.sc-bell {
  position: relative; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%;
  color: var(--on-navy); text-decoration: none;
}
.sc-bell .ic { width: 25px; height: 25px; }
.sc-bell em {
  position: absolute; top: 4px; right: 2px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px;
  background: var(--amber); color: var(--navy); font: 900 11.5px/20px var(--font); font-style: normal; text-align: center;
}

/* a guest's top bar holds View only, the bell and the avatar: on a phone the bell wins */
@media (max-width: 430px) { .topbar-r:has(.sc-bell) .viewonly { display: none; } }

/* notifications list */
.sc-note.unread { border-color: var(--navy); background: var(--navy-tint); }
.sc-note .row-ic { flex: none; }
.sc-when { color: var(--ink-3) !important; }

/* Home */
.sc-home { margin: 16px 0; }
.sc-home-row { margin: 16px 0; }
.sc-home-row .row-ic { flex: none; }