/* ============================================================================
   DoorVault — shared free PM-statement audit widget (PM_AUDIT_ENABLED)
   --------------------------------------------------------------------------
   Styles for the widget mounted by pm-audit-widget.js on both
   /tools/pm-statement-audit and /start. Reuses the shared editorial token
   vocabulary (--accent, --bg-card, --bg-elevated, --border-color,
   --border-subtle, --text-primary, --text-secondary, --danger,
   --accent-muted, --accent-glow, --accent-hover) that assets/site.css
   remaps at :root on every landing page, so no page-local variables are
   required. Buttons are fully self-contained (.pma-btn*) so the widget
   never depends on a host page's own .btn-primary/.btn-ghost definitions.
   ============================================================================ */
.d-none{display:none;}

.pma-widget{max-width:640px;}
.pma-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:14px;padding:28px;}
.pma-card-title{font-size:1.15rem;font-weight:700;color:var(--text-primary);margin-bottom:6px;}
.pma-card-sub{font-size:0.9rem;color:var(--text-secondary);line-height:1.6;margin-bottom:20px;}

.pma-dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:32px 20px;border:1.5px dashed var(--border-color);border-radius:12px;cursor:pointer;text-align:center;transition:border-color 0.2s,background 0.2s,opacity 0.2s;}
.pma-dropzone:hover,.pma-dropzone-active{border-color:var(--accent);background:var(--accent-muted);}
.pma-dropzone.pma-dropzone-locked{opacity:0.5;cursor:default;}
.pma-dropzone.pma-dropzone-locked:hover{border-color:var(--border-color);background:none;}
.pma-dropzone i{font-size:1.6rem;color:var(--accent);}
.pma-dropzone-label{font-size:0.92rem;font-weight:600;color:var(--text-primary);}
.pma-dropzone-hint{font-size:0.78rem;color:var(--text-secondary);}
.pma-dropzone-note{margin-top:8px;font-size:0.78rem;color:var(--text-secondary);text-align:center;}

.pma-turnstile{min-height:0;display:flex;justify-content:center;background:transparent;border:none;}
.pma-turnstile:not(:empty){margin-top:16px;}
.pma-turnstile iframe{border:none!important;}

/* Self-contained buttons — never depend on a host page's own button classes. */
.pma-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 28px;border-radius:6px;font-weight:700;font-size:0.95rem;font-family:inherit;text-decoration:none;cursor:pointer;border:none;transition:background 0.2s ease,transform 0.2s ease,border-color 0.2s ease,color 0.2s ease;}
.pma-btn-primary{background:var(--accent);color:#141414;}
.pma-btn-primary:hover{background:var(--accent-hover);transform:translateY(-1px);}
.pma-btn-ghost{background:transparent;color:var(--text-primary);border:1px solid var(--border-color);font-weight:600;padding:13px 27px;}
.pma-btn-ghost:hover{border-color:var(--accent);color:var(--accent);}
.pma-submit{width:100%;margin-top:18px;}
.pma-submit:disabled{opacity:0.5;cursor:not-allowed;transform:none;}

.pma-locked-note{margin-top:18px;font-size:0.9rem;color:var(--text-secondary);line-height:1.6;transition:opacity 0.25s ease;}
.pma-locked-note.pma-locked-pulse{opacity:0.5;}
.pma-locked-cta{color:var(--accent);font-weight:600;text-decoration:none;}
.pma-locked-cta:hover{text-decoration:underline;}
.pma-privacy-note{margin-top:12px;font-size:0.8125rem;color:var(--text-secondary);line-height:1.5;}
.pma-error{margin-top:14px;font-size:0.86rem;color:var(--danger);}

/* Progressive "Knox is reading" experience */
.pma-progress{margin-top:18px;}
.pma-progress-track{position:relative;height:2px;background:var(--border-color);border-radius:100px;overflow:hidden;}
.pma-progress-fill{position:absolute;top:0;left:0;bottom:0;width:0%;background:var(--accent);border-radius:100px;transition:width 0.6s ease;}
.pma-steps{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:2px;}
.pma-step{display:flex;align-items:center;gap:10px;padding:7px 0;font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.76rem;letter-spacing:0.05em;text-transform:uppercase;color:var(--text-secondary);transition:opacity 0.3s ease,color 0.3s ease;}
.pma-step-dot{position:relative;width:7px;height:7px;border-radius:50%;background:var(--border-color);flex-shrink:0;}
.pma-step-pending{opacity:0.4;}
.pma-step-active{color:var(--text-primary);opacity:1;}
.pma-step-active .pma-step-dot{background:var(--accent);animation:pma-pulse 1.6s ease-in-out infinite;}
.pma-step-done{color:var(--text-secondary);opacity:0.85;}
.pma-step-done .pma-step-dot{background:transparent;width:7px;height:7px;}
.pma-step-done .pma-step-dot::before{content:'\2713';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--accent);font-size:0.7rem;line-height:1;}
@keyframes pma-pulse{0%,100%{box-shadow:0 0 0 0 var(--accent-glow);}50%{box-shadow:0 0 0 5px transparent;}}
.pma-progress-copy{margin-top:16px;font-size:0.82rem;color:var(--text-secondary);line-height:1.6;}
.pma-progress-elapsed{font-family:'IBM Plex Mono',ui-monospace,monospace;color:var(--text-secondary);margin-left:2px;}
@media(prefers-reduced-motion:reduce){.pma-step-active .pma-step-dot{animation:none;}.pma-progress-fill{transition:none;}}

.pma-tile-enter{opacity:0;transform:translateY(6px);}
.pma-tile-enter-active{opacity:1;transform:translateY(0);transition:opacity 0.3s ease,transform 0.3s ease;}

.pma-result{margin-top:28px;padding-top:24px;border-top:1px solid var(--border-subtle);}
.pma-summary{font-size:0.98rem;color:var(--text-primary);font-weight:600;margin-bottom:18px;line-height:1.6;}
.pma-statement-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:22px;}
.pma-stat{background:var(--bg-elevated);border-radius:10px;padding:12px 14px;}
.pma-stat-label{display:block;font-size:0.72rem;text-transform:uppercase;letter-spacing:0.06em;color:var(--text-secondary);margin-bottom:4px;}
.pma-stat-value{display:block;font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:0.95rem;font-weight:600;color:var(--text-primary);word-break:break-word;}
.pma-findings{display:flex;flex-direction:column;gap:14px;}
.pma-finding{border:1px solid var(--border-subtle);border-radius:12px;padding:16px 18px;background:var(--bg-elevated);}
.pma-finding-high{border-color:rgba(210,112,91,0.4);}
.pma-finding-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px;}
.pma-chip{font-size:0.68rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;border-radius:100px;padding:3px 10px;}
.pma-chip-high{background:rgba(210,112,91,0.15);color:var(--danger);border:1px solid rgba(210,112,91,0.35);}
.pma-chip-medium{background:var(--accent-muted);color:var(--accent);border:1px solid rgba(212,168,67,0.35);}
.pma-chip-info{background:rgba(255,255,255,0.06);color:var(--text-secondary);border:1px solid var(--border-subtle);}
.pma-finding-title{font-size:0.92rem;font-weight:700;color:var(--text-primary);}
.pma-finding-detail{font-size:0.86rem;color:var(--text-secondary);line-height:1.6;margin-bottom:8px;}
.pma-finding-lines{display:flex;flex-direction:column;gap:4px;}
.pma-finding-line{display:flex;justify-content:space-between;gap:12px;font-size:0.82rem;color:var(--text-secondary);border-top:1px solid var(--border-subtle);padding-top:6px;}
.pma-finding-line .pma-amt{font-family:'IBM Plex Mono',ui-monospace,monospace;color:var(--text-primary);white-space:nowrap;}

.pma-capture{margin-top:24px;padding-top:22px;border-top:1px solid var(--border-subtle);}
.pma-capture-copy{font-size:0.9rem;color:var(--text-secondary);line-height:1.6;margin-bottom:14px;}
.pma-capture-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px;}
.pma-email-input{flex:1;min-width:200px;padding:11px 14px;font-size:16px;background:var(--bg-elevated);border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);}
.pma-email-input::placeholder{color:var(--text-secondary);}
.pma-capture-note{font-size:0.82rem;color:var(--text-secondary);margin-bottom:10px;}

/* Phones: the upload card is the page's primary action, and on a phone the
   fixed bottom chrome (sticky CTA, cookie banner) eats the last ~150px of the
   viewport. Tighten the card's own vertical rhythm so the submit button rides
   as high as it can. Type sizes and copy are untouched. */
@media(max-width:600px){
    .pma-statement-grid{grid-template-columns:1fr 1fr;}
    .pma-capture-row{flex-direction:column;}
    .pma-card{padding:20px;}
    .pma-dropzone{padding:22px 16px;}
    .pma-turnstile:not(:empty){margin-top:10px;}
    .pma-submit{margin-top:10px;}
}
