/* ============================================================================
   PROSPECT INTEL — unified visual system
   One card shell, one section header, one pill, one banner, one button family.
   All color via tokens (css/variables.css); keyframes live in animations.css.
   ========================================================================== */

/* ---- AI pulse (keyframe defined in animations.css) ---- */
.ai-pulse { animation: aiPulse 2s ease-in-out infinite; }

/* ---- Card shell ---- */
/* `.prospect-card` mirrors the global `.card` so result sections share one shell. */
.prospect-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 20px;
    margin-bottom: 16px;
}
.prospect-card--ai {
    border: 2px solid var(--prospect-tint-purple);
    background: linear-gradient(135deg, var(--bg-card), var(--prospect-tint-purple));
}
.prospect-card--dashed { border: 2px dashed var(--border); }

/* ---- Section header ---- */
.prospect-section-header { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.prospect-section-icon {
    font-size: 22px; width: 40px; height: 40px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 10px; flex-shrink: 0;
    background: var(--prospect-tint-blue);
}
.prospect-section-title { margin: 0; font-size: 16px; font-weight: 700; color: var(--text); }
.prospect-section-title--ai { color: var(--prospect-purple); }
.prospect-section-sub { margin: 2px 0 0; font-size: 12px; color: var(--text-secondary); }

/* Icon tint modifiers (replace inline rgba backgrounds) */
.prospect-icon--blue   { background: var(--prospect-tint-blue); }
.prospect-icon--green  { background: var(--prospect-tint-green); }
.prospect-icon--purple { background: var(--prospect-tint-purple); }
.prospect-icon--orange { background: var(--prospect-tint-orange); }
.prospect-icon--gold   { background: var(--prospect-tint-gold); }

/* ---- Pills (status, source badges, confidence chips) ---- */
.prospect-pill {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 11px; font-weight: 600; line-height: 1.4;
    padding: 3px 10px; border-radius: 20px; white-space: nowrap;
    background: var(--bg-input); color: var(--text-secondary);
    border: 1px solid transparent;
}
.prospect-pill--ok      { background: var(--prospect-tint-green);  color: var(--success); }
.prospect-pill--bad     { background: var(--prospect-tint-red);    color: var(--danger); }
.prospect-pill--warn    { background: var(--prospect-tint-orange); color: var(--warning); }
.prospect-pill--info    { background: var(--prospect-tint-blue);   color: var(--apple-blue); }
.prospect-pill--gold    { background: var(--prospect-tint-gold);   color: var(--prospect-gold); }
.prospect-pill--purple  { background: var(--prospect-tint-purple); color: var(--prospect-purple); }
.prospect-pill--neutral { background: var(--bg-input);             color: var(--text-secondary); }
.prospect-pill-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }

/* ---- Banners (empty / info / warn / error / success states) ---- */
.prospect-banner {
    display: flex; align-items: flex-start; gap: 10px;
    padding: 12px 14px; border-radius: 10px; font-size: 13px; line-height: 1.6;
    background: var(--bg-input); color: var(--text);
    border: 1px solid var(--border); border-left: 3px solid var(--text-secondary);
}
.prospect-banner--info    { background: var(--prospect-tint-blue);   border-left-color: var(--apple-blue); }
.prospect-banner--warn    { background: var(--prospect-tint-orange); border-left-color: var(--warning); }
.prospect-banner--error   { background: var(--prospect-tint-red);    border-left-color: var(--danger); }
.prospect-banner--success { background: var(--prospect-tint-green);  border-left-color: var(--success); }
.prospect-banner__icon { font-size: 16px; flex-shrink: 0; line-height: 1.4; }

/* ---- Two-column data grid (key/value pairs) ---- */
.prospect-data-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 640px) { .prospect-data-grid { grid-template-columns: 1fr; } }

/* ---- Buttons ---- */
.prospect-btn {
    font-size: 14px; font-weight: 600; padding: 10px 16px; border-radius: 10px;
    border: 1px solid var(--border); background: var(--bg-input); color: var(--text);
    cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    transition: filter 0.15s ease, background 0.15s ease;
}
.prospect-btn:hover { filter: brightness(1.05); }
.prospect-btn--primary { background: var(--apple-blue); color: #fff; border-color: transparent; }
.prospect-btn--success { background: var(--success);    color: #fff; border-color: transparent; }
.prospect-btn--ghost   { background: transparent; }
.prospect-btn--block   { width: 100%; }
.prospect-btn--lg      { font-size: 15px; padding: 14px 18px; border-radius: 12px; }
.prospect-search-dot {
    width: 10px; height: 10px; border-radius: 50%; display: inline-block;
    background: var(--success); box-shadow: 0 0 6px var(--success);
}

/* ---- Top / bottom action bar ---- */
.prospect-actionbar {
    display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
    padding: 14px 16px; margin-bottom: 16px;
    background: var(--bg-card); border: 1px solid var(--border); border-radius: 14px;
    position: sticky; top: 8px; z-index: 5;
}
.prospect-actionbar__spacer { flex: 1 1 auto; }

/* ---- AI analysis content blocks ---- */
.ai-content-block { margin-bottom: 20px; }
.ai-content-block:last-child { margin-bottom: 8px; }
.ai-content-block h4 { margin: 0 0 8px; font-size: 14px; display: flex; align-items: center; gap: 8px; }
.ai-content-block p, .ai-content-block ul { margin: 0; font-size: 13px; line-height: 1.7; }
.ai-content-block ul { padding-left: 20px; }
.ai-content-block li { margin-bottom: 4px; }

/* ---- Legacy stat pill (kept for back-compat with existing JS) ---- */
.prospect-stat-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.prospect-stat { font-size: 12px; padding: 5px 12px; border-radius: 20px; font-weight: 600; display: inline-flex; align-items: center; gap: 4px; }

/* ---- Records accordion ---- */
.prospect-accordion { border-top: 1px solid var(--border); }
.prospect-accordion summary {
    display: flex; align-items: center; gap: 10px; padding: 14px 0;
    font-weight: 600; font-size: 14px; cursor: pointer; list-style: none;
    color: var(--text); user-select: none;
}
.prospect-accordion summary::-webkit-details-marker { display: none; }
.prospect-accordion summary::after {
    content: '›'; margin-left: auto; font-size: 18px; color: var(--text-secondary);
    transition: transform 0.2s ease; font-weight: 400;
}
.prospect-accordion[open] summary::after { transform: rotate(90deg); }
.prospect-accordion .accordion-body { padding-bottom: 14px; }
/* Status pill inside accordion summaries — back-compat alias of .prospect-pill */
.prospect-accordion .status-pill,
.status-pill {
    font-size: 11px; padding: 2px 10px; border-radius: 10px; font-weight: 600; white-space: nowrap;
    background: var(--bg-input); color: var(--text-secondary);
}
.status-pill.is-ok     { background: var(--prospect-tint-green);  color: var(--success); }
.status-pill.is-bad    { background: var(--prospect-tint-red);    color: var(--danger); }
.status-pill.is-warn   { background: var(--prospect-tint-orange); color: var(--warning); }
.status-pill.is-info   { background: var(--prospect-tint-blue);   color: var(--apple-blue); }
.status-pill.is-gold   { background: var(--prospect-tint-gold);   color: var(--prospect-gold); }
.status-pill.is-purple { background: var(--prospect-tint-purple); color: var(--prospect-purple); }

/* ---- AI collapsible groups ---- */
.ai-group { margin-bottom: 8px; border-radius: 12px; }
.ai-group summary {
    display: flex; align-items: center; gap: 8px; padding: 12px 16px;
    font-weight: 600; font-size: 14px; cursor: pointer;
    background: var(--bg-input); border-radius: 12px;
    list-style: none; color: var(--text); user-select: none;
}
.ai-group summary::-webkit-details-marker { display: none; }
.ai-group summary .group-count {
    font-size: 11px; font-weight: 500; color: var(--text-secondary);
    background: var(--bg-card); padding: 1px 8px; border-radius: 8px;
}
.ai-group summary::after {
    content: '▾'; margin-left: auto; font-size: 12px; color: var(--text-secondary);
    transition: transform 0.2s ease;
}
.ai-group:not([open]) summary::after { transform: rotate(-90deg); }
.ai-group[open] summary { border-radius: 12px 12px 0 0; }
.ai-group .ai-group-body { padding: 16px; background: var(--bg-input); border-radius: 0 0 12px 12px; }

/* ---- Collapsible card ---- */
.collapsible-card > summary {
    display: flex; align-items: center; gap: 10px; cursor: pointer;
    list-style: none; user-select: none;
}
.collapsible-card > summary::-webkit-details-marker { display: none; }
.collapsible-card > summary::after {
    content: '›'; margin-left: auto; font-size: 18px; color: var(--text-secondary);
    transition: transform 0.2s ease;
}
.collapsible-card[open] > summary::after { transform: rotate(90deg); }

/* ---- Candidate selection cards ---- */
.prospect-select-card {
    border: 1px solid var(--border); border-radius: 12px; padding: 14px 16px;
    margin-bottom: 10px; background: var(--bg-input);
}
.prospect-select-card__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }

/* ---- Print: drive off explicit data-* attributes, not :has() ---- */
@media print {
    [data-no-print] { display: none !important; }
    header, .header-top, .step-title, .progress-track,
    .logo-controls, .btn-utility, .btn-secondary,
    button, select, input,
    .tool-back-btn, .bottom-nav, .dark-mode-toggle { display: none !important; }

    #prospectResults { display: block !important; }
    .plugin-container, main { padding: 0 !important; margin: 0 !important; }
    .card, .prospect-card { box-shadow: none !important; border: 1px solid #ccc !important; break-inside: avoid; page-break-inside: avoid; margin-bottom: 12px !important; }

    /* Print-safe palette regardless of dark mode */
    body, body.dark-mode, * { color: #1a1a1e !important; background: #fff !important; }
    .prospect-pill, .status-pill, .prospect-stat, .prospect-banner { border: 1px solid #ccc !important; }

    [data-printable]:first-child::before,
    #prospectResults::before {
        content: 'Prospect Investigation Report';
        display: block; font-size: 22px; font-weight: 700; text-align: center;
        padding: 16px 0 8px; border-bottom: 2px solid #333; margin-bottom: 20px;
    }
    #prospectResults::after {
        content: 'Generated by Altech · altech.agency';
        display: block; text-align: center; font-size: 10px; color: #999 !important;
        padding-top: 16px; border-top: 1px solid #ddd; margin-top: 16px;
    }

    details > *:not(summary) { display: block !important; }
    .prospect-accordion summary::after,
    .ai-group summary::after,
    .collapsible-card > summary::after { display: none !important; }

    @page { margin: 0.6in; size: letter; }
}