/* ══════════════════════════════════════════════════════════════
   Notespark — contact scan review

   Extends the Contacts page rather than restyling it: .contact-card,
   .contacts-tab and .contact-detail-chip all come from nota-contacts.css.
   Only what's new to the review queue lives here.

   Load AFTER nota-contacts.css.
   ══════════════════════════════════════════════════════════════ */

.scan-card {
    cursor: default;
    align-items: flex-start;
}

/* The avatar slot carries a kind icon rather than initials, tinted by
   confidence — so a column of these reads as a heat map before you've
   read a single value. */
.scan-card .contact-card-avatar span {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}

/* ── Confidence badges ──────────────────────────────────────── */

.scan-badge {
    display: inline-block;
    margin-left: 8px;
    padding: 2px 7px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
    vertical-align: middle;
}

.nota.theme-light .scan-high {
    background: rgba(5, 150, 105, .12);
    color: #047857;
}

.nota.theme-light .scan-medium {
    background: rgba(217, 119, 6, .13);
    color: #b45309;
}

.nota.theme-light .scan-low {
    background: rgba(0, 0, 0, .06);
    color: #6b7280;
}

.nota.theme-light .scan-count {
    background: rgba(108, 92, 231, .10);
    color: #6C5CE7;
    text-transform: none;
    letter-spacing: 0;
}

/* ── The context line ───────────────────────────────────────────
   The sentence the value was found in. This earns more room than a
   normal card sub-line: it's the evidence the user is judging, and
   truncating it to one line would defeat the purpose. */

.nota.theme-light .scan-context {
    margin: 6px 0 8px;
    padding: 7px 10px;
    border-radius: 8px;
    background: rgba(0, 0, 0, .03);
    border-left: 2px solid rgba(0, 0, 0, .10);
    font-size: 12.5px;
    line-height: 1.45;
    color: #4b5563;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* The source note is a button, not a chip — it navigates. */
.scan-source {
    border: none;
    cursor: pointer;
    font: inherit;
}

.nota.theme-light .scan-source:hover {
    background: rgba(108, 92, 231, .08);
    color: #6C5CE7;
}

/* ── Actions ────────────────────────────────────────────────── */

.scan-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    margin-left: auto;
    padding-left: 10px;
}

.scan-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px;
    border-radius: 999px;
    border: 1px solid transparent;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background .13s ease, color .13s ease, border-color .13s ease;
}

.scan-btn:disabled {
    opacity: .5;
    cursor: default;
}

.nota.theme-light .scan-accept {
    background: #6C5CE7;
    color: #fff;
}

.nota.theme-light .scan-accept:hover:not(:disabled) {
    background: #5A4BD6;
}

.nota.theme-light .scan-edit,
.nota.theme-light .scan-dismiss {
    background: transparent;
    color: #6b7280;
    padding: 7px 9px;
}

.nota.theme-light .scan-edit:hover {
    background: rgba(0, 0, 0, .05);
    color: #13132b;
}

/* Dismiss is permanent — it writes a row that suppresses this value on
   every future scan. Red on hover so it doesn't get tapped casually. */
.nota.theme-light .scan-dismiss:hover {
    background: rgba(220, 38, 38, .08);
    color: #dc2626;
}

.scan-footer {
    display: flex;
    justify-content: center;
    padding: 18px 0 30px;
}

.scan-modal-src {
    margin: 4px 0 14px;
    font-size: 12.5px;
    color: #6b7280;
}

/* ── Narrow screens ─────────────────────────────────────────────
   Three buttons in a row beside the body doesn't fit a phone. The
   actions drop below and spread, with Add taking the space since it's
   the one being aimed for. */

@media (max-width: 640px) {

    .scan-card {
        flex-wrap: wrap;
    }

    .scan-actions {
        width: 100%;
        margin-left: 0;
        padding-left: 0;
        margin-top: 10px;
    }

    .scan-accept {
        flex: 1 1 auto;
        justify-content: center;
    }

    .nota.theme-light .scan-context {
        -webkit-line-clamp: 2;
    }
}