/* Prospect assessment pages (/assessments). Scoped to .assess-*; reuses the
   live ops-metric-card, threat-mix-* and work-pill classes from ui-refresh.css
   for everything else. Loaded from the page's extra_head (before ui-refresh.css),
   so nothing here may share a selector with that file. */

/* ---- setup steps ---- */
.assess-steps { list-style: none; padding: 0; margin: 0; counter-reset: assess-step; }
.assess-steps > li {
    counter-increment: assess-step;
    position: relative;
    padding: 0.55rem 0 0.55rem 2.2rem;
    border-top: 1px solid var(--ui-border, #353c47);
}
.assess-steps > li:first-child { border-top: 0; }
.assess-steps > li::before {
    content: counter(assess-step);
    position: absolute; left: 0; top: 0.55rem;
    width: 1.5rem; height: 1.5rem; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 0.8rem;
    background: rgba(95, 186, 246, 0.14); color: #9fd4ff;
}
.assess-steps > li.is-done::before { content: "\2713"; background: rgba(84, 200, 105, 0.18); color: #8fdda1; }
.assess-step-title { font-weight: 600; margin-bottom: 0.3rem; }
.assess-link-box { font-family: var(--bs-font-monospace); font-size: 0.78rem; }

/* ---- live hero ---- */
.assess-hero {
    display: grid;
    grid-template-columns: minmax(200px, 280px) 1fr;
    gap: 1.25rem;
    align-items: center;
}
@media (max-width: 767.98px) { .assess-hero { grid-template-columns: 1fr; } }
.assess-count {
    font-size: 3.4rem;
    line-height: 1;
    font-weight: 800;
    color: #ff7b7b;
    font-variant-numeric: tabular-nums;
    transition: color 0.4s ease;
}
.assess-count.is-zero { color: #f2f6fd; }
.assess-count.is-bump { color: #ffb3b3; }
.assess-count-label { color: var(--ui-text-muted, #b4bfce); font-size: 0.85rem; margin-top: 0.2rem; }
.assess-progress { height: 0.9rem; border-radius: 999px; background: rgba(255, 255, 255, 0.06); }
.assess-progress .progress-bar { transition: width 0.8s ease; }
.assess-progress-line { display: flex; justify-content: space-between; gap: 0.75rem; flex-wrap: wrap;
    font-size: 0.85rem; color: var(--ui-text-muted, #b4bfce); margin-top: 0.4rem; }
.assess-progress-line strong { color: #f2f6fd; font-variant-numeric: tabular-nums; }
.assess-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0.6rem; }
.assess-tile-critical { border-left-color: rgba(228, 96, 96, 0.85) !important; }
.assess-tile-high { border-left-color: rgba(226, 174, 61, 0.85) !important; }
.assess-feed td, .assess-table td { vertical-align: middle; }
.assess-feed tr.is-new { animation: assess-flash 2.4s ease-out; }
@keyframes assess-flash { from { background: rgba(228, 96, 96, 0.22); } to { background: transparent; } }
.assess-nowrap { white-space: nowrap; }
.assess-clip { max-width: 28rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* The AI's one sentence under a subject: wraps inside the clipped cell. */
.assess-reason { white-space: normal; font-size: 0.78rem; line-height: 1.3; color: var(--ui-text-muted, #b4bfce); margin-top: 0.15rem; }

/* ---- report ---- */
.assess-headline { font-size: 1.55rem; font-weight: 700; line-height: 1.25; color: #f2f6fd; margin: 0; }
.assess-headline-num { color: #ff7b7b; font-variant-numeric: tabular-nums; }
.assess-headline.is-zero .assess-headline-num { color: #f2f6fd; }
.assess-sub { color: var(--ui-text-muted, #b4bfce); font-size: 0.9rem; margin-top: 0.35rem; }
.assess-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
@media (max-width: 991.98px) { .assess-grid-2 { grid-template-columns: 1fr; } }
.assess-rank { list-style: none; padding: 0; margin: 0; }
.assess-rank li { display: flex; justify-content: space-between; gap: 0.75rem; padding: 0.2rem 0;
    border-top: 1px solid rgba(90, 105, 124, 0.18); font-size: 0.85rem; }
.assess-rank li:first-child { border-top: 0; }
.assess-rank li span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.assess-method { font-size: 0.78rem; color: var(--ui-text-dim, #8b949e); }
.assess-print-only { display: none; }

/* ---- the prospect's own pages (/check/<token>, assessment_public_base.html) ---- */
body.assess-public { background: #0d1117; color: #edf3fb; min-height: 100vh; }
.assess-public-bar { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem;
    border-bottom: 1px solid var(--ui-border, #30363d); background: #11161d; color: #edf3fb; }
.assess-public-bar__note { margin-left: auto; font-size: 0.82rem; color: var(--ui-text-muted, #b4bfce); }
.assess-public-main { max-width: 72rem; margin: 0 auto; padding: 1.25rem 1rem 2.5rem; }
.assess-public-narrow { max-width: 34rem; margin: 3rem auto 0; }
.assess-promises { padding-left: 1.1rem; color: var(--ui-text-muted, #b4bfce); font-size: 0.9rem; }
.assess-terms { border: 1px solid var(--ui-border, #30363d); border-radius: 0.6rem; padding: 0.75rem 1rem;
    margin: 0.5rem 0 1rem; max-height: 22rem; overflow: auto; background: rgba(255, 255, 255, 0.02); }
.assess-terms__title { font-size: 0.95rem; font-weight: 700; margin: 0 0 0.4rem; }
.assess-terms__list { padding-left: 1.1rem; margin: 0; font-size: 0.86rem; color: var(--ui-text-muted, #b4bfce); }
.assess-terms__list li { margin-bottom: 0.35rem; }
.assess-start-form { max-width: 44rem; }
.assess-msg__subject { font-size: 1.25rem; font-weight: 700; margin: 0 0 0.6rem; overflow-wrap: anywhere; }
.assess-msg__facts { display: grid; grid-template-columns: 7rem 1fr; gap: 0.2rem 0.75rem; margin: 0; font-size: 0.9rem; }
.assess-msg__facts dt { color: var(--ui-text-muted, #b4bfce); font-weight: 600; }
.assess-msg__facts dd { margin: 0; overflow-wrap: anywhere; }
.assess-msg__reasons, .assess-msg__links { padding-left: 1.1rem; margin: 0; font-size: 0.88rem; }
.assess-msg__links code { color: #ffb3b3; overflow-wrap: anywhere; white-space: normal; }
.assess-msg__prose { font-size: 0.88rem; white-space: pre-line; overflow-wrap: anywhere; }
.assess-msg__body { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 0.82rem; max-height: 32rem; overflow: auto;
    background: rgba(255, 255, 255, 0.03); border: 1px solid var(--ui-border, #30363d); border-radius: 0.5rem;
    padding: 0.75rem; color: #dbe4f0; margin: 0; }

/* ---- print: A4, light, no chrome ---- */
@media print {
    @page { size: A4; margin: 12mm; }
    html, body, body.app-shell, main.page-shell {
        background: #fff !important;
        color: #111 !important;
    }
    .app-topnav, footer.footer, .toast-container, .assess-noprint, #segConfirmModal, .assess-public-bar { display: none !important; }
    .assess-print-only { display: block !important; }
    .page-shell { max-width: none !important; padding: 0 !important; }
    .assess-report .card, .assess-report .ops-metric-card {
        background: #fff !important;
        border: 1px solid #ccc !important;
        box-shadow: none !important;
        break-inside: avoid;
    }
    .assess-report .card-header { background: #f3f4f6 !important; border-bottom: 1px solid #ccc !important; }
    .assess-report, .assess-report *:not(.badge):not(.threat-mix-bar):not(.threat-mix-bar *):not(.threat-mix-dot) {
        color: #111 !important;
    }
    .assess-report .page-title, .assess-headline, .assess-report .ops-metric-card__value { color: #111 !important; }
    .assess-report .assess-headline-num { color: #b42318 !important; }
    .assess-report .table { --bs-table-bg: #fff; --bs-table-color: #111; font-size: 9pt; }
    .assess-report .table th, .assess-report .table td { background: #fff !important; border-color: #ddd !important; }
    .assess-report tr { break-inside: avoid; }
    .assess-report a { text-decoration: none !important; }
    .assess-report .badge, .assess-report .threat-mix-bar, .assess-report .threat-mix-bar span,
    .assess-report .threat-mix-dot {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    .assess-clip { max-width: 16rem; }
    .assess-reason { color: #444 !important; }
    .table-responsive { overflow: visible !important; }
}

/* ---- the free check's setup pages (2026-11-01, wider 11-02): the sign-in
   page's centred card (licences.css .pay-transit), roomy, left-aligned inside,
   with the steps side by side. ---- */
.assess-public .pay-transit { min-height: calc(100vh - 7rem); }
.pay-transit__shell.ck-shell { max-width: 46rem; }
.pay-transit .ck-shell .card-body { padding: 2.5rem 2.75rem 2.25rem; text-align: left; }
body.ui-premium main .pay-transit .ck-shell .card-body h1.pay-transit__title { font-size: 1.65rem !important; margin: 0 0 0.5rem !important; }
.ck-shell .pay-transit__line { font-size: 1.02rem; color: var(--ui-text-muted, #b4bfce); margin: 0 0 1.75rem; }
.ck-steps { display: flex; gap: 0.5rem; list-style: none; padding: 0; margin: 0 0 1.5rem; }
.ck-steps li { flex: 1; display: flex; align-items: center; gap: 0.35rem; padding-top: 0.5rem;
    border-top: 3px solid var(--ui-border, #353c47); font-size: 0.85rem; color: var(--ui-text-dim, #94a2b6); }
.ck-steps li.is-done { border-top-color: var(--ui-success, #27b071); color: var(--ui-text-muted, #b4bfce); }
.ck-steps li.is-current { border-top-color: var(--ui-accent, #36a9f5); color: var(--ui-text, #ecf1f8); font-weight: 600; }
.ck-how { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.85rem; list-style: none; padding: 0;
    margin: 0 0 1.75rem; counter-reset: ck; }
.ck-how li { counter-increment: ck; padding: 1.1rem 1rem; border: 1px solid var(--ui-border, #353c47); border-radius: 10px;
    background: rgba(255, 255, 255, 0.02); font-size: 0.86rem; color: var(--ui-text-muted, #b4bfce); line-height: 1.4; }
.ck-how li::before { content: counter(ck); display: flex; align-items: center; justify-content: center;
    width: 1.8rem; height: 1.8rem; margin-bottom: 0.65rem; border-radius: 50%; font-size: 0.85rem; font-weight: 700;
    background: var(--ui-accent-soft, rgba(54, 169, 245, 0.16)); color: var(--ui-accent, #36a9f5); }
.ck-how strong { display: block; margin-bottom: 0.2rem; color: var(--ui-text, #ecf1f8); font-size: 0.97rem; font-weight: 600; }
.ck-form { display: flex; gap: 0.6rem; }
.ck-form .form-control { flex: 1; min-width: 0; }
.ck-fine { font-size: 0.82rem; line-height: 1.5; color: var(--ui-text-dim, #94a2b6); margin: 1.1rem 0 0; }
.ck-more { margin-top: 0.6rem; font-size: 0.82rem; color: var(--ui-text-dim, #94a2b6); }
.ck-more summary { cursor: pointer; color: var(--ui-accent, #36a9f5); }
.ck-more p { margin: 0.5rem 0 0; line-height: 1.5; }
.ck-shell .assess-terms { max-height: 15rem; }
/* Start page (operator 2026-11-02: "make this more attractive, simpler"): a
   small "Free check" label over the question, three visible trust points
   instead of a paragraph, the detail one click away. */
.ck-eyebrow { display: inline-block; margin: 0 0 0.6rem; padding: 0.2rem 0.65rem; border-radius: 999px;
    font-size: 0.75rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase;
    background: var(--ui-success-soft, rgba(39, 176, 113, 0.14)); color: var(--ui-success, #27b071); }
.ck-trust { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; list-style: none; padding: 0; margin: 1.25rem 0 0; }
.ck-trust__item { display: flex; align-items: center; gap: 0.45rem; font-size: 0.86rem; color: var(--ui-text-muted, #b4bfce); }
.ck-trust__item .bi { color: var(--ui-success, #27b071); font-size: 0.95rem; }
.ck-more__list { margin: 0.5rem 0 0; padding-left: 1.1rem; line-height: 1.5; }
.ck-more__item + .ck-more__item { margin-top: 0.25rem; }
@media (max-width: 640px) {
    .pay-transit .ck-shell .card-body { padding: 1.6rem 1.25rem 1.4rem; }
    body.ui-premium main .pay-transit .ck-shell .card-body h1.pay-transit__title { font-size: 1.35rem !important; }
    .ck-how { grid-template-columns: 1fr; gap: 0.6rem; }
    .ck-form { flex-direction: column; }
    .ck-trust { flex-direction: column; gap: 0.4rem; }
}