/* ─────────────────────────────────────────────────────────────────
   ILAI Investment Group — Sheriff Bid Engine dashboard
   Brand sourced from ilai-investment.com
   palette: midnight navy + brushed gold + parchment text
   typography: Cormorant Garamond (display) + Inter (body)
   geometry: sharp corners (0px radius), thin gold rules
───────────────────────────────────────────────────────────────── */

:root {
    /* Brand palette */
    --c-bg:          #0A0E1A;   /* midnight navy — page background */
    --c-bg-soft:     #10162A;   /* slightly lifted surfaces */
    --c-bg-card:    #0F1424;   /* cards */
    --c-bg-elev:    #161D33;   /* table rows on hover, inputs */
    --c-border:     #1E2742;   /* hairline borders */
    --c-border-strong: #2A345A;
    --c-gold:        #C9A961;   /* primary accent */
    --c-gold-soft:   #8E7740;
    --c-gold-faint:  rgba(201, 169, 97, 0.18);
    --c-text:        #E8E6E1;   /* parchment off-white */
    --c-text-muted:  #A6ABB8;   /* WCAG AA on --c-bg */
    --c-text-faint:  #8089A0;   /* lifted from #5C6273 to clear AA on body bg */

    /* Semantic — desaturated to fit the dark editorial palette */
    --c-success:     #6BA67A;
    --c-warning:     #D4A547;
    --c-danger:      #C8616B;
    --c-info:        #6F8FB3;

    /* Typography */
    --font-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
    --font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    /* Geometry */
    --radius:       0px;        /* brand uses sharp corners */
    --radius-pill: 0px;
    --shadow-card: 0 1px 0 rgba(255, 255, 255, 0.03) inset;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
    background: var(--c-bg);
    color: var(--c-text);
    font-family: var(--font-body);
    font-size: 15px;
    line-height: 1.55;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    min-height: 100vh;
}

a {
    color: var(--c-gold);
    text-decoration: none;
    transition: opacity 0.15s ease, color 0.15s ease;
}
a:hover { opacity: 0.75; }

/* ─── Display typography ─── */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-display);
    font-weight: 500;
    color: var(--c-text);
    letter-spacing: -0.005em;
    line-height: 1.15;
}
h1 { font-size: 2.6rem; font-weight: 500; }
h2 { font-size: 1.55rem; font-weight: 500; }
h3 { font-size: 1.05rem; font-weight: 600; font-family: var(--font-body);
     letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-text-muted); }
h4 { font-size: 0.95rem; font-weight: 500; font-family: var(--font-body); }

p { margin: 0 0 0.6rem; color: var(--c-text); }
p.subtitle { color: var(--c-text-muted); font-size: 0.95rem; }
p.meta, span.meta, td.meta, ul.meta {
    color: var(--c-text-faint);
    font-size: 0.85rem;
    font-weight: 400;
    letter-spacing: 0.01em;
    line-height: 1.5;
}

strong { color: var(--c-text); font-weight: 600; }
.success { color: var(--c-success); font-weight: 500; }

/* ─── Top navigation ─── */
.navbar {
    background: var(--c-bg);
    border-bottom: 1px solid var(--c-border);
    padding: 1.4rem 0;
    position: sticky;
    top: 0;
    z-index: 50;
    backdrop-filter: blur(8px);
    background: rgba(10, 14, 26, 0.92);
}
.nav-content {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 2.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
}

.nav-brand {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}
.brand-mark {
    /* Bracket-i logo mark, mirroring ilai-investment.com */
    width: 36px;
    height: 36px;
    border: 1px solid var(--c-gold);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--c-gold);
    font-family: var(--font-display);
    font-style: italic;
    font-size: 1.15rem;
    line-height: 1;
    flex: 0 0 auto;
}
.brand-wordmark {
    display: flex;
    flex-direction: column;
    line-height: 1;
}
.brand-name {
    font-family: var(--font-body);
    font-size: 0.95rem;
    font-weight: 500;
    letter-spacing: 0.32em;
    color: var(--c-text);
    text-transform: uppercase;
}
.brand-sub {
    font-family: var(--font-body);
    font-size: 0.7rem;
    font-weight: 500;
    letter-spacing: 0.3em;
    color: var(--c-gold);
    text-transform: uppercase;
    margin-top: 0.35rem;
}

.nav-links {
    display: flex;
    align-items: center;
    gap: 2.4rem;
}
.nav-link {
    color: var(--c-text);
    font-size: 0.78rem;
    font-weight: 500;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    padding: 0.4rem 0;
    border-bottom: 1px solid transparent;
    position: relative;
    transition: color 0.18s ease, border-color 0.18s ease;
}
.nav-link:hover { color: var(--c-gold); opacity: 1; }
.nav-link.active {
    color: var(--c-gold);
    border-bottom-color: var(--c-gold);
}
.nav-link.logout { color: var(--c-text-muted); }

/* ─── Freshness banner (PR-2.5d CP-3) ───
   Renders only when the scheduled refresh has not run yet, the
   parcel snapshot is missing, or the data is older than the stale
   threshold. Hidden during normal fast-path operation. */
.freshness-banner {
    display: flex;
    align-items: baseline;
    gap: 0.85rem;
    flex-wrap: wrap;
    margin: 1.4rem 0;
    padding: 0.85rem 1.1rem;
    background: var(--c-bg-soft);
    border-left: 3px solid var(--c-warning);
    color: var(--c-text);
    font-size: 0.88rem;
    line-height: 1.5;
}
.freshness-banner.freshness-level-error {
    border-left-color: var(--c-danger);
    background: rgba(200, 97, 107, 0.11);
}
.freshness-banner .freshness-kind {
    font-family: var(--font-body);
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--c-warning);
    white-space: nowrap;
}
.freshness-banner.freshness-level-error .freshness-kind {
    color: var(--c-danger);
}
.freshness-banner .freshness-message {
    flex: 1 1 auto;
    color: var(--c-text);
}
.freshness-banner .freshness-meta {
    color: var(--c-text-muted);
    font-size: 0.78rem;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.freshness-banner .freshness-meta .freshness-age {
    color: var(--c-text-faint);
    margin-left: 0.4rem;
}

/* ─── Main layout ─── */
.main-content {
    max-width: 1400px;
    margin: 0 auto;
    padding: 3rem 2.5rem 5rem;
}

.page-header {
    margin-bottom: 2.6rem;
    padding-bottom: 1.6rem;
    border-bottom: 1px solid var(--c-border);
}
.page-header h1 {
    font-size: 3.2rem;
    margin-bottom: 0.5rem;
    color: var(--c-text);
}
.page-header .subtitle {
    color: var(--c-text-muted);
    font-size: 0.82rem;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 500;
}

.eyebrow {
    color: var(--c-gold);
    font-size: 0.78rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    font-weight: 500;
    margin-bottom: 0.5rem;
    display: inline-block;
}

/* ─── Stats / KPI cards ─── */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    margin-bottom: 2.4rem;
    border: 1px solid var(--c-border);
    background: var(--c-bg-card);
}
.stat-card {
    padding: 1.6rem 1.8rem;
    border-right: 1px solid var(--c-border);
    background: transparent;
}
.stat-card:last-child { border-right: none; }
.stat-card .stat-number {
    font-family: var(--font-display);
    font-size: 2.6rem;
    font-weight: 500;
    line-height: 1;
    color: var(--c-text);
    margin-bottom: 0.4rem;
}
.stat-card .stat-label {
    font-size: 0.78rem;
    color: var(--c-text-muted);
    letter-spacing: 0.26em;
    text-transform: uppercase;
    font-weight: 500;
}
.stat-card.stat-bid .stat-number { color: var(--c-gold); }
.stat-card.stat-escalate .stat-number { color: var(--c-warning); }
.stat-card.stat-pass .stat-number { color: var(--c-text-muted); }
.stat-card.stat-total .stat-number { color: var(--c-text); }

/* ─── Filters bar ─── */
.filters-bar {
    margin-bottom: 1.6rem;
    padding: 1rem 0;
    border-top: 1px solid var(--c-border);
    border-bottom: 1px solid var(--c-border);
}
.filters-form {
    display: flex;
    gap: 0.8rem;
    flex-wrap: wrap;
    align-items: center;
}

/* ─── Form controls ─── */
select, input[type="text"], input[type="password"], textarea {
    background: var(--c-bg-elev);
    color: var(--c-text);
    border: 1px solid var(--c-border);
    padding: 0.65rem 0.9rem;
    font-family: var(--font-body);
    font-size: 0.85rem;
    border-radius: var(--radius);
    outline: none;
    transition: border-color 0.15s ease;
    min-width: 160px;
}
select:focus, input:focus, textarea:focus {
    border-color: var(--c-gold);
}
textarea {
    width: 100%;
    resize: vertical;
    min-height: 80px;
    font-family: var(--font-body);
    line-height: 1.5;
    margin-bottom: 0.8rem;
}
label {
    display: block;
    font-size: 0.78rem;
    color: var(--c-text-muted);
    letter-spacing: 0.2em;
    text-transform: uppercase;
    font-weight: 500;
    margin-bottom: 0.45rem;
}
.status-select { min-width: 220px; margin-right: 0.6rem; }

/* ─── Buttons ─── */
.btn-primary, .btn-secondary {
    display: inline-block;
    padding: 0.78rem 1.6rem;
    font-family: var(--font-body);
    font-size: 0.78rem;
    font-weight: 500;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    border-radius: var(--radius);
    border: 1px solid var(--c-gold);
    cursor: pointer;
    transition: background 0.18s ease, color 0.18s ease;
    text-align: center;
}
.btn-primary {
    background: var(--c-gold);
    color: var(--c-bg);
}
.btn-primary:hover {
    background: transparent;
    color: var(--c-gold);
    opacity: 1;
}
.btn-secondary {
    background: transparent;
    color: var(--c-gold);
}
.btn-secondary:hover {
    background: var(--c-gold-faint);
    opacity: 1;
}
.btn-block { display: block; width: 100%; }
.btn-sm { padding: 0.5rem 1.1rem; font-size: 0.74rem; letter-spacing: 0.22em; }

/* ─── Cards ─── */
.card {
    background: var(--c-bg-card);
    border: 1px solid var(--c-border);
    padding: 1.8rem 2rem;
    margin-bottom: 1.6rem;
    box-shadow: var(--shadow-card);
}
.card h2 {
    font-size: 1.45rem;
    margin-bottom: 1.2rem;
    color: var(--c-text);
    padding-bottom: 0.8rem;
    border-bottom: 1px solid var(--c-border);
    font-weight: 500;
}
.card h3 {
    margin-top: 1.4rem;
    margin-bottom: 0.7rem;
}

.grid-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.6rem;
}
@media (max-width: 960px) {
    .grid-two-col { grid-template-columns: 1fr; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .stat-card:nth-child(2) { border-right: none; }
    .stat-card:nth-child(1), .stat-card:nth-child(2) { border-bottom: 1px solid var(--c-border); }
}

/* ─── Tables ─── */
.table-container {
    border: 1px solid var(--c-border);
    background: var(--c-bg-card);
    overflow-x: auto;
}
table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}
th, td {
    padding: 0.95rem 1.1rem;
    text-align: left;
    border-bottom: 1px solid var(--c-border);
    vertical-align: top;
}
thead th {
    background: var(--c-bg-soft);
    color: var(--c-text-muted);
    font-size: 0.74rem;
    font-weight: 500;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    border-bottom: 1px solid var(--c-border-strong);
    border-top: 1px solid var(--c-border-strong);
}
tbody tr { transition: background 0.15s ease; }
tbody tr:hover { background: var(--c-bg-elev); }
tbody tr:last-child td { border-bottom: none; }
.text-right { text-align: right; }
.text-center { text-align: center; }

.opportunities-table .address-link { color: var(--c-text); font-weight: 500; }
.opportunities-table .address-link:hover { color: var(--c-gold); }

.info-table { border: none; }
.info-table td, .info-table th { padding: 0.55rem 0.8rem; border-bottom: 1px solid var(--c-border); }
.info-table tr:last-child td { border-bottom: none; }
.info-table td:first-child { color: var(--c-text-muted); font-size: 0.82rem;
                              letter-spacing: 0.05em; text-transform: uppercase; }

.comparison-table thead th { background: transparent; }
.comparison-table .highlight-row td {
    background: var(--c-gold-faint);
    color: var(--c-text);
    font-weight: 600;
    border-top: 1px solid var(--c-gold-soft);
    border-bottom: 1px solid var(--c-gold-soft);
}
.comparison-table .highlight-row td:first-child { color: var(--c-gold); }

.signals-table .signal-unavailable { opacity: 0.45; }

.comps-table th, .comps-table td { font-size: 0.78rem; padding: 0.55rem 0.7rem; }

/* ─── Badges & pills ─── */
.badge, .risk-badge, .status-pill {
    display: inline-block;
    padding: 0.32rem 0.75rem;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    border-radius: var(--radius);
    border: 1px solid var(--c-border-strong);
    background: transparent;
    color: var(--c-text-muted);
}
.badge-bid       { color: var(--c-gold);    border-color: var(--c-gold); background: var(--c-gold-faint); }
.badge-escalate  { color: var(--c-warning); border-color: var(--c-warning); background: rgba(212, 165, 71, 0.10); }
.badge-pass      { color: var(--c-text-faint); border-color: var(--c-border-strong); }
.badge-pending   { color: var(--c-text-muted); }

/* ─── Plaintiff filter badges (PR 2 Step C) ─── */
.badge-biddable        { color: var(--c-success); border-color: rgba(107, 166, 122, 0.5); background: rgba(107, 166, 122, 0.10); }
.badge-tight           { color: var(--c-warning); border-color: rgba(212, 165, 71, 0.5);  background: rgba(212, 165, 71, 0.10); }
.badge-plaintiff_lock  { color: var(--c-danger);  border-color: rgba(200, 97, 107, 0.55); background: rgba(200, 97, 107, 0.12); }
.badge-unknown         { color: var(--c-text-faint); border-color: var(--c-border-strong); }
.plaintiff-tooltip {
    border-bottom: 1px dotted var(--c-border-strong);
    cursor: help;
}
.plaintiff-differential {
    margin-left: 0.4rem;
    font-size: 0.68rem;
    color: var(--c-text-faint);
    letter-spacing: 0.04em;
    text-transform: none;
}
.docket-link {
    display: inline-block;
    padding: 0.2rem 0.55rem;
    font-size: 0.7rem;
    border: 1px solid var(--c-border-strong);
    color: var(--c-text-muted);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.docket-link:hover { color: var(--c-gold); border-color: var(--c-gold); opacity: 1; }
.bid-margin-positive { color: var(--c-success); }
.bid-margin-negative { color: var(--c-danger); }
.bid-margin-neutral  { color: var(--c-text-muted); }

/* ─── Insights tile (PR 2 Step C) ─── */
.insights-tile {
    background: var(--c-bg-card);
    border: 1px solid var(--c-border);
    border-left: 2px solid var(--c-gold);
    padding: 1.2rem 1.6rem;
    margin: 0 0 1.4rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1.2rem 2rem;
}
.insights-tile .insight-cell { min-width: 0; }
.insights-tile .insight-label {
    font-size: 0.68rem;
    color: var(--c-text-faint);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 0.35rem;
}
.insights-tile .insight-value {
    font-family: var(--font-display);
    font-size: 1.6rem;
    color: var(--c-text);
    font-weight: 500;
    line-height: 1.1;
}
.insights-tile .insight-note {
    font-size: 0.72rem;
    color: var(--c-text-faint);
    margin-top: 0.25rem;
    font-style: italic;
}

.risk-clean    { color: var(--c-success); border-color: rgba(107, 166, 122, 0.4); }
.risk-flag     { color: var(--c-warning); border-color: rgba(212, 165, 71, 0.4); }
.risk-escalate { color: var(--c-warning); border-color: rgba(212, 165, 71, 0.5); background: rgba(212, 165, 71, 0.08); }
.risk-kill     { color: var(--c-danger);  border-color: rgba(200, 97, 107, 0.5); background: rgba(200, 97, 107, 0.10); }

.status-pill   { background: var(--c-bg-elev); color: var(--c-text-muted); }

.days-urgent { color: var(--c-danger); font-weight: 600; }
.days-soon   { color: var(--c-warning); font-weight: 600; }

.vacancy-score {
    display: inline-block;
    padding: 0.22rem 0.55rem;
    font-weight: 600;
    font-size: 0.82rem;
    border-radius: var(--radius);
}
.vac-occupied { color: var(--c-text-muted); }
.vac-low      { color: var(--c-info); }
.vac-med      { color: var(--c-warning); }
.vac-high     { color: var(--c-danger); font-weight: 700; }

/* ─── Decision banner (parcel detail) ─── */
.decision-banner {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
    align-items: center;
    gap: 1.4rem;
    padding: 1.8rem 2.2rem;
    margin: 1.6rem 0;
    background: var(--c-bg-card);
    border: 1px solid var(--c-border);
    border-left: 3px solid var(--c-gold);
}
@media (max-width: 960px) {
    .decision-banner {
        grid-template-columns: 1fr 1fr;
        gap: 1.2rem 1.6rem;
        padding: 1.4rem 1.6rem;
    }
    .decision-banner .banner-divider { display: none; }
    .decision-banner .banner-value { font-size: 1.6rem; }
}
@media (max-width: 540px) {
    .decision-banner { grid-template-columns: 1fr; }
}
.banner-divider {
    width: 1px;
    height: 50px;
    background: var(--c-border);
}
.banner-label {
    font-size: 0.74rem;
    color: var(--c-text-muted);
    letter-spacing: 0.26em;
    text-transform: uppercase;
    font-weight: 500;
    margin-bottom: 0.5rem;
}
.banner-value {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 500;
    color: var(--c-text);
    line-height: 1;
}
.decision-banner-bid     { border-left-color: var(--c-gold); }
.decision-banner-escalate { border-left-color: var(--c-warning); }
.decision-banner-pass    { border-left-color: var(--c-text-faint); }
.decision-banner-pending { border-left-color: var(--c-border-strong); }

.decision-banner-bid     .banner-decision .banner-value { color: var(--c-gold); }
.decision-banner-escalate .banner-decision .banner-value { color: var(--c-warning); }
.decision-banner-pass    .banner-decision .banner-value { color: var(--c-text-faint); }

/* ─── Reasoning box ─── */
.reasoning-box {
    background: var(--c-bg-card);
    border: 1px solid var(--c-border);
    border-left: 2px solid var(--c-gold);
    padding: 1.4rem 1.8rem;
    margin-bottom: 1.6rem;
}
.reasoning-box h3 {
    margin-top: 0;
    margin-bottom: 0.8rem;
    color: var(--c-gold);
}
.reasoning-box ul { padding-left: 1.4rem; }
.reasoning-box li { margin-bottom: 0.4rem; color: var(--c-text); }

/* ─── Risk sections (KILL/WARN/INFO/MANUAL) ─── */
.risk-section { margin-bottom: 1.2rem; }
.risk-section ul { padding-left: 1.2rem; }
.risk-section li { margin-bottom: 0.32rem; }

.kill-header    { color: var(--c-danger);  border-bottom: 1px solid rgba(200, 97, 107, 0.3); padding-bottom: 0.4rem; }
.warning-header { color: var(--c-warning); border-bottom: 1px solid rgba(212, 165, 71, 0.3); padding-bottom: 0.4rem; }
.info-header    { color: var(--c-info);    border-bottom: 1px solid rgba(111, 143, 179, 0.3); padding-bottom: 0.4rem; }
.kill-list li    { color: var(--c-danger); }
.warning-list li { color: var(--c-warning); }
.info-list li    { color: var(--c-info); }
.action-list li  { color: var(--c-text); }

/* Section divider used between recorded-docs / city-records / lien blocks */
.risk-section--divided {
    margin-top: 1.2rem;
    padding-top: 1rem;
    border-top: 1px solid var(--c-border);
}

/* Small inline source tag inside h2, e.g. "ARV Analysis · RentCast" */
.h2-source {
    font-family: var(--font-body);
    font-size: 0.74rem;
    font-weight: 500;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--c-text-muted);
    margin-left: 0.7rem;
    vertical-align: middle;
}

/* ─── ARV scenarios ─── */
.arv-scenarios {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    margin-bottom: 1.2rem;
    border: 1px solid var(--c-border);
}
.arv-scenario {
    padding: 1.4rem 1.6rem;
    text-align: center;
    border-right: 1px solid var(--c-border);
    background: var(--c-bg-card);
}
.arv-scenario:last-child { border-right: none; }
.arv-label {
    font-size: 0.74rem;
    color: var(--c-text-muted);
    letter-spacing: 0.26em;
    text-transform: uppercase;
    font-weight: 500;
    margin-bottom: 0.55rem;
}
.arv-value {
    font-family: var(--font-display);
    font-size: 1.7rem;
    font-weight: 500;
    color: var(--c-text);
    line-height: 1;
}
.arv-low  .arv-value { color: var(--c-text-muted); }
.arv-mid  .arv-value { color: var(--c-gold); }
.arv-high .arv-value { color: var(--c-text); }

/* ─── Checklist ─── */
.checklist { list-style: none; padding: 0; }
.checklist li {
    padding: 0.65rem 0;
    border-bottom: 1px solid var(--c-border);
    color: var(--c-text);
    font-size: 0.92rem;
}
.checklist li:last-child { border-bottom: none; }

/* ─── Timeline / history ─── */
.timeline { padding-left: 1rem; border-left: 1px solid var(--c-border); }
.timeline-event {
    padding: 0.8rem 0 0.8rem 1.2rem;
    position: relative;
    border-bottom: 1px solid var(--c-border);
}
.timeline-event:last-child { border-bottom: none; }
.timeline-event::before {
    content: '';
    width: 7px; height: 7px;
    background: var(--c-gold);
    position: absolute;
    left: -1.45rem;
    top: 1.15rem;
    border-radius: 50%;
}
.timeline-time {
    font-size: 0.78rem;
    color: var(--c-text-faint);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 0.3rem;
}
.timeline-action { color: var(--c-text); margin-bottom: 0.35rem; }
.timeline-details { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.detail-pill {
    display: inline-block;
    padding: 0.22rem 0.65rem;
    background: var(--c-bg-elev);
    border: 1px solid var(--c-border);
    color: var(--c-text-muted);
    font-size: 0.78rem;
}

/* ─── Vacancy detail ─── */
.vacancy-recommendation {
    color: var(--c-text);
    font-size: 1rem;
    font-style: italic;
    font-family: var(--font-display);
    margin-bottom: 0.5rem;
}

/* ─── Parcel header ─── */
.parcel-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.6rem;
    flex-wrap: wrap;
    margin-bottom: 0.4rem;
    padding-bottom: 1.4rem;
    border-bottom: 1px solid var(--c-border);
}
.parcel-header h1 {
    font-size: 2.6rem;
    margin-bottom: 0.4rem;
    line-height: 1.1;
}
.parcel-header .subtitle {
    font-size: 0.82rem;
    color: var(--c-text-muted);
    letter-spacing: 0.2em;
    text-transform: uppercase;
    font-weight: 500;
}

.breadcrumb {
    margin-bottom: 1.6rem;
}
.breadcrumb a {
    color: var(--c-text-muted);
    font-size: 0.78rem;
    letter-spacing: 0.26em;
    text-transform: uppercase;
}
.breadcrumb a:hover { color: var(--c-gold); }

/* ─── Login ─── */
.login-container {
    min-height: calc(100vh - 80px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
}
.login-card {
    background: var(--c-bg-card);
    border: 1px solid var(--c-border);
    padding: 3rem 3.2rem;
    width: 100%;
    max-width: 420px;
    position: relative;
}
.login-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--c-gold), transparent);
    opacity: 0.6;
}
.login-header {
    text-align: center;
    margin-bottom: 2.4rem;
    padding-bottom: 1.6rem;
    border-bottom: 1px solid var(--c-border);
}
.login-header .brand-mark {
    margin: 0 auto 1.2rem;
    width: 56px; height: 56px;
    font-size: 1.7rem;
}
.login-header h1 {
    font-family: var(--font-body);
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: 0.4em;
    text-transform: uppercase;
    color: var(--c-text);
    margin-bottom: 0.4rem;
}
.login-subtitle {
    font-size: 0.78rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--c-gold);
    font-weight: 500;
}
.login-tagline {
    font-family: var(--font-display);
    font-style: italic;
    font-size: 1rem;
    color: var(--c-text-muted);
    margin-top: 0.8rem;
}
.login-form .form-group { margin-bottom: 1.2rem; }
.login-form input { width: 100%; }
.login-form button { margin-top: 0.6rem; }
.login-footer {
    text-align: center;
    margin-top: 2rem;
    padding-top: 1.2rem;
    border-top: 1px solid var(--c-border);
    font-size: 0.74rem;
    color: var(--c-text-faint);
    letter-spacing: 0.26em;
    text-transform: uppercase;
}

/* ─── Flash messages ─── */
.flash-container {
    max-width: 1400px;
    margin: 1rem auto 0;
    padding: 0 2.5rem;
}
.flash {
    padding: 0.85rem 1.2rem;
    border-left: 2px solid var(--c-gold);
    background: var(--c-bg-card);
    color: var(--c-text);
    margin-bottom: 0.6rem;
    font-size: 0.88rem;
}
.flash-success { border-left-color: var(--c-success); }
.flash-warning { border-left-color: var(--c-warning); }
.flash-error,
.flash-danger  { border-left-color: var(--c-danger); }

/* ─── Empty states ─── */
.empty-state {
    text-align: center;
    padding: 5rem 2rem;
    border: 1px solid var(--c-border);
    background: var(--c-bg-card);
}
.empty-icon {
    font-size: 2.2rem;
    color: var(--c-text-faint);
    margin-bottom: 1rem;
    opacity: 0.5;
}
.empty-state h2 {
    color: var(--c-text);
    font-size: 1.6rem;
    margin-bottom: 0.6rem;
}
.empty-state p { color: var(--c-text-muted); }

/* ─── Footer ─── */
.footer {
    margin-top: 5rem;
    padding: 2rem 2.5rem;
    border-top: 1px solid var(--c-border);
    text-align: center;
}
.footer p {
    color: var(--c-text-faint);
    font-size: 0.74rem;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    font-weight: 500;
}

/* ─── Selection / scrollbar polish ─── */
::selection { background: var(--c-gold-faint); color: var(--c-text); }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--c-bg); }
::-webkit-scrollbar-thumb { background: var(--c-border-strong); }
::-webkit-scrollbar-thumb:hover { background: var(--c-gold-soft); }

/* ─── PR-2.5b Opportunity columns (solver + sheriff discount) ─── */
.win-badge {
    display: inline-block;
    padding: 0.18rem 0.5rem;
    font-size: 0.78rem;
    font-weight: 600;
    border: 1px solid var(--c-border-strong);
    letter-spacing: 0.04em;
}
.win-high { color: var(--c-success); border-color: rgba(107, 166, 122, 0.55); background: rgba(107, 166, 122, 0.10); }
.win-med  { color: var(--c-warning); border-color: rgba(212, 165, 71, 0.55); background: rgba(212, 165, 71, 0.10); }
.win-low  { color: var(--c-danger);  border-color: rgba(200, 97, 107, 0.55); background: rgba(200, 97, 107, 0.10); }

.trapped-high { color: var(--c-danger); font-weight: 600; }
.trapped-ok   { color: var(--c-text-muted); }

.dscr-low { color: var(--c-danger); font-weight: 600; }
.dscr-ok  { color: var(--c-success); }

.bind-tag {
    display: inline-block;
    padding: 0.12rem 0.4rem;
    font-size: 0.68rem;
    border: 1px solid var(--c-border-strong);
    color: var(--c-text-muted);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.conf-badge {
    display: inline-block;
    padding: 0.12rem 0.4rem;
    font-size: 0.68rem;
    border: 1px solid var(--c-border-strong);
    letter-spacing: 0.04em;
    text-transform: lowercase;
}
.conf-per-zip   { color: var(--c-success); border-color: rgba(107, 166, 122, 0.55); }
.conf-shrinkage { color: var(--c-warning); border-color: rgba(212, 165, 71, 0.55); }
.conf-fallback  { color: var(--c-text-faint); }

.filter-toggle, .filter-slider {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--c-text-muted);
    font-size: 0.78rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 0 0.4rem;
}
.filter-slider input[type="range"] { width: 110px; accent-color: var(--c-gold); }
.filter-slider-value { color: var(--c-gold); font-variant-numeric: tabular-nums; min-width: 2.4em; }

/* ─── PR-2.5b: Mobile responsive — collapse low-priority opp columns ─── */
/* Below ~960px we hide Exp. Bid / DSCR / Bind / Conf to keep the
   mobile-priority cluster (Max Bid · Max Bid Solver · Cap. Trapped · Win %)
   readable. Existing columns are untouched. */
@media (max-width: 960px) {
    .col-mobile-optional { display: none !important; }
}

/* Sticky header so the new column cluster stays anchored when the
   table scrolls horizontally on narrow viewports. */
.opportunities-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
}
