/* ═══════════════════════════════════════════
   PORTFOLIO MONITORING SHELL — pm- prefix
   The page frame, header, action buttons and status banner shared by every investor monitoring page
   (/investor/monitoring/{dealId}/… and /investor/monitoring/{dealId}/market-intel) via MonitoringHeader.razor.
═══════════════════════════════════════════ */
.pm-page {
    --pm-bg-card:       #0c1a38;
    --pm-bg-card2:      #0f2040;
    --pm-bg-card3:      #07132f;
    --pm-border:        rgba(255,255,255,0.10);
    --pm-border-soft:   rgba(255,255,255,0.06);
    --pm-text:          #e0e6f5;
    --pm-text-muted:    #6b7fa8;
    --pm-text-soft:     #a0b0c8;
    --pm-green:         #22c55e;
    --pm-green-dim:     rgba(34,197,94,0.12);
    --pm-red:           #ef4444;
    --pm-red-dim:       rgba(239,68,68,0.12);
    --pm-yellow:        #f59e0b;
    --pm-yellow-dim:    rgba(245,158,11,0.12);
    --pm-blue:          #3b82f6;
    --pm-blue-dim:      rgba(59,130,246,0.12);
    --pm-cyan:          #22d3ee;
    --pm-cyan-dim:      rgba(34,211,238,0.12);
    --pm-purple:        #a78bfa;
    --pm-purple-dim:    rgba(167,139,250,0.12);
    --pm-amber:         #f59e0b;
    --pm-amber-dim:     rgba(245,158,11,0.12);
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 1rem 3rem;
    color: var(--pm-text);
    font-family: inherit;
}

/* ── Loading ── */
.pm-loading { text-align:center; padding:80px 20px; color:var(--pm-text-muted); }

/* ── Header ── */
.pm-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem 0 1rem;
    flex-wrap: wrap;
}
.pm-back-btn {
    display: inline-flex; align-items: center; gap: 6px;
    background: transparent; border: 1px solid var(--pm-border);
    border-radius: 8px; padding: 0.45rem 1rem; font-size: 0.8rem;
    color: var(--pm-text-soft); cursor: pointer; font-family: inherit;
    transition: border-color 0.2s, color 0.2s; white-space: nowrap;
    width: auto !important;
}
.pm-back-btn:hover { border-color: var(--pm-blue); color: var(--pm-blue); }
.pm-header-left { display:flex; flex-direction:column; gap:0.35rem; flex:1; min-width:0; }
.pm-header-breadcrumb { font-size:0.72rem; color:var(--pm-text-muted); }
.pm-header-title { font-size:1.35rem; font-weight:700; color:var(--pm-text); line-height:1.2; }
.pm-header-meta { display:flex; flex-wrap:wrap; align-items:center; gap:0.5rem; }
.pm-sector-badge {
    font-size:0.68rem; font-weight:600; text-transform:uppercase; letter-spacing:0.5px;
    padding:0.2rem 0.6rem; border-radius:6px;
    background:var(--pm-blue-dim); color:var(--pm-blue); border:1px solid rgba(59,130,246,0.25);
}
.pm-funded-badge {
    font-size:0.68rem; font-weight:600; text-transform:uppercase; letter-spacing:0.5px;
    padding:0.2rem 0.6rem; border-radius:6px;
    background:var(--pm-green-dim); color:var(--pm-green); border:1px solid rgba(34,197,94,0.25);
}
/* The Portfolio page's "External" pill (pf-badge ext), so an outside position reads the same on both pages. */
.pm-external-badge {
    font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.05em;
    padding:0.2rem 0.6rem; border-radius:999px;
    background:rgba(224,176,80,0.16); color:#e6c07a; border:1px solid rgba(224,176,80,0.3);
}
.pm-header-right { display:flex; align-items:center; gap:0.6rem; flex-wrap:wrap; }
.pm-health-ring { position:relative; width:56px; height:56px; flex-shrink:0; }
.pm-health-ring svg { transform:rotate(-90deg); }
.pm-health-ring-label {
    position:absolute; inset:0; display:flex; flex-direction:column;
    align-items:center; justify-content:center; line-height:1.1;
}
.pm-health-ring-val { font-size:0.85rem; font-weight:700; color:var(--pm-green); }
.pm-health-ring-sub { font-size:0.48rem; color:var(--pm-text-muted); text-transform:uppercase; letter-spacing:0.4px; }

/* ── Action buttons ── */
.pm-btn {
    display:inline-flex; align-items:center; gap:6px;
    border-radius:8px; padding:0.45rem 1.1rem; font-size:0.8rem;
    font-weight:600; cursor:pointer; font-family:inherit;
    border:1px solid; transition:all 0.18s; white-space:nowrap;
    width: auto !important;
}
.pm-btn-secondary { background:rgba(255,255,255,0.06); border-color:var(--pm-border); color:var(--pm-text-soft); }
.pm-btn-secondary:hover { background:rgba(255,255,255,0.1); border-color:rgba(255,255,255,0.2); }
.pm-btn-primary { background:rgba(59,130,246,0.15); border-color:rgba(59,130,246,0.4); color:#7eb3ff; }
.pm-btn-primary:hover { background:rgba(59,130,246,0.22); border-color:rgba(59,130,246,0.6); }
/* Investor primary / confirm CTA — the investor-wide green (#10b981). */
.pm-btn-go { background:#10b981; border-color:#10b981; color:#04140d; font-weight:800; padding:0.55rem 1.2rem; }
.pm-btn-go:hover:not(:disabled) { background:#0ea372; border-color:#0ea372; }
.pm-btn-go:disabled { opacity:0.55; cursor:default; }
.pm-btn-go:focus-visible { outline:2px solid #bcd4ff; outline-offset:2px; }

/* ── Commencement banner ── */
.pm-commence-banner {
    display:flex; align-items:center; gap:0.75rem; flex-wrap:wrap;
    background:rgba(34,197,94,0.07); border:1px solid rgba(34,197,94,0.2);
    border-radius:10px; padding:0.65rem 1rem; margin-bottom:1rem; font-size:0.8rem;
}
.pm-commence-banner strong { color:var(--pm-green); }
.pm-commence-banner span { color:var(--pm-text-soft); }
.pm-commence-banner .pm-del-hint { display:block; margin-top:0.3rem; color:#c9d6ef; }

@media (max-width: 768px) {
    .pm-header { flex-direction:column; }
    .pm-header-right { width:100%; justify-content:flex-start; }
    .pm-health-ring { display:none; }
}
