/* WP QA SaaS Platform — Portal CSS */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;600&family=IBM+Plex+Sans:wght@400;500;600&display=swap');

/* ══ DARK THEME (default) ══════════════════════════════ */
:root {
    --bg:#0f1117;--surface:#1a1d27;--surface2:#22263a;--border:#2e3350;
    --text:#e2e6f3;--text2:#b0b8d4;--muted:#7b82a6;
    --critical:#ff4d6a;--warning:#f5a623;--info:#4d9eff;--success:#2ecc71;--accent:#7c6af7;
    --shadow:rgba(0,0,0,.4);
    --font:'IBM Plex Sans',sans-serif;--mono:'IBM Plex Mono',monospace;
    --radius:10px;
    --code-bg:rgba(0,0,0,.3);--code-color:#a8d8ff;
    --rev-total-bg:rgba(124,106,247,.06);
}

/* ══ LIGHT THEME ════════════════════════════════════════ */
.wpqas-theme-light {
    --bg:#eef0f7;--surface:#ffffff;--surface2:#f3f4fb;--border:#d8dcea;
    --text:#1a1d2e;--text2:#4a5068;--muted:#6b7280;
    --critical:#dc2626;--warning:#b45309;--info:#2563eb;--success:#16a34a;--accent:#6d5ae0;
    --shadow:rgba(0,0,0,.07);
    --code-bg:rgba(109,90,224,.07);--code-color:#4f35c2;
    --rev-total-bg:rgba(109,90,224,.05);
}

.wpqas-theme-light .wpqas-portal-header  { box-shadow:0 1px 4px var(--shadow); }
.wpqas-theme-light .wpqas-stat           { box-shadow:0 1px 4px var(--shadow); }
.wpqas-theme-light .wpqas-card           { box-shadow:0 1px 4px var(--shadow); }
.wpqas-theme-light .wpqas-site-card      { box-shadow:0 1px 4px var(--shadow); }
.wpqas-theme-light .wpqas-plan-card      { box-shadow:0 2px 8px var(--shadow); }
.wpqas-theme-light .wpqas-plan-popular   { box-shadow:0 4px 20px rgba(109,90,224,.2) !important; }
.wpqas-theme-light .wpqas-float-panel    { box-shadow:0 8px 32px rgba(0,0,0,.14); }
.wpqas-theme-light .wpqas-float-toggle   { box-shadow:0 4px 18px rgba(109,90,224,.4); }
.wpqas-theme-light .wpqas-chat-main      { box-shadow:0 2px 12px var(--shadow); }
.wpqas-theme-light .wpqas-upgrade-banner { background:rgba(109,90,224,.07); border-color:rgba(109,90,224,.2); }
.wpqas-theme-light .wpqas-usage-fill     { background:linear-gradient(90deg,#6d5ae0,#9d8bf4); }
.wpqas-theme-light .wpqas-table tbody tr:hover { background:rgba(109,90,224,.03); }
.wpqas-theme-light .wpqas-chat-bubble code { background:var(--code-bg); color:var(--code-color); }
.wpqas-theme-light .wpqas-typing span   { background:var(--muted); }

/* ══ BASE ═══════════════════════════════════════════════ */
.wpqas-portal { font-family:var(--font); color:var(--text); background:var(--bg); min-height:100vh; transition:background .25s,color .25s; }
.wpqas-portal * { box-sizing:border-box; }

/* ── FLASH ── */
.wpqas-flash { padding:14px 20px; border-radius:8px; margin-bottom:20px; font-size:14px; }
.wpqas-flash.success { background:rgba(46,204,113,.12); border:1px solid rgba(46,204,113,.3); color:var(--success); }
.wpqas-flash.warning { background:rgba(245,166,35,.12); border:1px solid rgba(245,166,35,.3); color:var(--warning); }

/* ── AUTH ── */
.wpqas-auth-wrap { display:flex; justify-content:center; align-items:center; min-height:80vh; }
.wpqas-auth-box { background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:40px; width:100%; max-width:420px; }
.wpqas-auth-logo { font-size:20px; font-weight:700; text-align:center; margin-bottom:24px; }
.wpqas-auth-tabs { display:flex; border:1px solid var(--border); border-radius:8px; overflow:hidden; margin-bottom:24px; }
.wpqas-auth-tab { flex:1; text-align:center; padding:10px; font-size:14px; color:var(--muted); text-decoration:none; transition:all .15s; background:transparent; }
.wpqas-auth-tab.active { background:var(--accent); color:#fff; }

/* ── NAV ── */
.wpqas-portal-header { background:var(--surface); border-bottom:1px solid var(--border); display:flex; align-items:center; padding:0 20px; position:sticky; top:0; z-index:100; transition:background .25s; }
.wpqas-portal-brand { font-size:15px; font-weight:700; padding:16px 18px 16px 0; border-right:1px solid var(--border); margin-right:8px; white-space:nowrap; }
.wpqas-portal-nav { display:flex; flex:1; overflow-x:auto; }
.wpqas-nav-item { padding:16px 12px; font-size:13px; color:var(--muted); text-decoration:none; display:flex; align-items:center; gap:6px; transition:all .15s; border-bottom:2px solid transparent; white-space:nowrap; }
.wpqas-nav-item:hover,.wpqas-nav-item.active { color:var(--text); border-bottom-color:var(--accent); }
.wpqas-portal-user { display:flex; align-items:center; gap:8px; padding-left:14px; border-left:1px solid var(--border); font-size:13px; white-space:nowrap; }
.wpqas-plan-badge { background:rgba(124,106,247,.15); border:1px solid rgba(124,106,247,.3); color:var(--accent); padding:3px 10px; border-radius:20px; font-size:11px; font-family:var(--mono); }
.wpqas-logout { color:var(--muted); text-decoration:none; font-size:12px; }
.wpqas-logout:hover { color:var(--critical); }

/* ── THEME TOGGLE ── */
.wpqas-theme-toggle { background:var(--surface2); border:1px solid var(--border); border-radius:20px; cursor:pointer; padding:5px 12px; font-size:12px; color:var(--muted); display:flex; align-items:center; gap:5px; transition:all .15s; font-family:var(--font); white-space:nowrap; }
.wpqas-theme-toggle:hover { border-color:var(--accent); color:var(--text); }

/* ── CONTENT ── */
.wpqas-content { padding:28px 30px; }
.wpqas-content-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:24px; }
.wpqas-content-header h2,.wpqas-content h2 { font-size:20px; font-weight:600; margin:0 0 24px; color:var(--text); }
.wpqas-section-title { font-size:12px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.08em; margin:28px 0 14px; }

/* ── CARDS ── */
.wpqas-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:20px 22px; margin-bottom:16px; transition:background .25s,border-color .15s; }
.wpqas-card h3 { font-size:11px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.07em; margin:0 0 14px; padding-bottom:10px; border-bottom:1px solid var(--border); }

/* ── STAT ROW ── */
.wpqas-stat-row { display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin-bottom:20px; }
.wpqas-stat { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:18px 16px; position:relative; overflow:hidden; transition:background .25s; }
.wpqas-stat::before { content:''; position:absolute; top:0;left:0;right:0;height:3px; }
.wpqas-stat-critical::before { background:var(--critical); }
.wpqas-stat-open::before     { background:var(--warning); }
.wpqas-stat-resolved::before { background:var(--success); }
.wpqas-stat-sites::before    { background:var(--info); }
.wpqas-stat-scans::before    { background:var(--accent); }
.wpqas-stat-val { font-size:30px; font-weight:600; font-family:var(--mono); line-height:1; margin-bottom:5px; }
.wpqas-stat-critical .wpqas-stat-val { color:var(--critical); }
.wpqas-stat-open .wpqas-stat-val     { color:var(--warning); }
.wpqas-stat-resolved .wpqas-stat-val { color:var(--success); }
.wpqas-stat-sites .wpqas-stat-val    { color:var(--info); }
.wpqas-stat-scans .wpqas-stat-val    { color:var(--accent); }
.wpqas-stat-lbl { font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.07em; }

/* ── USAGE BAR ── */
.wpqas-usage-bar { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:16px 20px; margin-bottom:20px; }
.wpqas-usage-label { display:flex; justify-content:space-between; font-size:13px; color:var(--text2); margin-bottom:10px; }
.wpqas-usage-track { background:var(--surface2); border-radius:4px; height:8px; overflow:hidden; }
.wpqas-usage-fill { height:100%; background:linear-gradient(90deg,var(--accent),#a78bfa); border-radius:4px; transition:width .5s ease; }

/* ── UPGRADE BANNER ── */
.wpqas-upgrade-banner { background:rgba(124,106,247,.08); border:1px solid rgba(124,106,247,.2); border-radius:8px; padding:14px 20px; margin-bottom:20px; font-size:14px; }
.wpqas-upgrade-banner a { color:var(--accent); font-weight:600; }

/* ── SITES GRID ── */
.wpqas-sites-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:16px; }
.wpqas-site-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:20px; transition:border-color .15s,background .25s; }
.wpqas-site-card:hover { border-color:var(--accent); }
.wpqas-site-card-header { display:flex; gap:12px; align-items:flex-start; margin-bottom:14px; }
.wpqas-site-icon { font-size:24px; }
.wpqas-site-name { font-size:15px; font-weight:600; color:var(--text); }
.wpqas-site-url  { font-size:12px; color:var(--muted); font-family:var(--mono); }
.wpqas-site-stats { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:14px; }
.wpqas-site-footer { display:flex; justify-content:space-between; align-items:center; }
.wpqas-site-last { font-size:12px; color:var(--muted); }

/* ── PILLS ── */
.wpqas-pill { display:inline-block; padding:3px 9px; border-radius:20px; font-size:11px; font-weight:600; text-transform:uppercase; font-family:var(--mono); }
.wpqas-pill-critical { background:rgba(255,77,106,.12); color:var(--critical); border:1px solid rgba(255,77,106,.25); }
.wpqas-pill-warning  { background:rgba(245,166,35,.12); color:var(--warning); border:1px solid rgba(245,166,35,.25); }
.wpqas-pill-open     { background:rgba(245,166,35,.12); color:var(--warning); border:1px solid rgba(245,166,35,.25); }
.wpqas-pill-info     { background:rgba(77,158,255,.12); color:var(--info); border:1px solid rgba(77,158,255,.25); }
.wpqas-pill-ok       { background:rgba(46,204,113,.12); color:var(--success); border:1px solid rgba(46,204,113,.25); }

/* ── TYPE TAGS ── */
.wpqas-type-tag { display:inline-block; padding:2px 8px; border-radius:4px; font-size:11px; font-weight:500; }
.wpqas-type-broken_link { background:rgba(255,77,106,.1); color:var(--critical); }
.wpqas-type-seo         { background:rgba(77,158,255,.1); color:var(--info); }
.wpqas-type-performance { background:rgba(245,166,35,.1); color:var(--warning); }
.wpqas-type-consistency { background:rgba(124,106,247,.1); color:var(--accent); }
.wpqas-type-form        { background:rgba(46,204,113,.1); color:var(--success); }
.wpqas-type-layout      { background:rgba(77,158,255,.1); color:var(--info); }
.wpqas-type-browser     { background:rgba(245,166,35,.1); color:var(--warning); }

/* ── PRICING ── */
.wpqas-pricing-header { text-align:center; margin-bottom:32px; }
.wpqas-pricing-header h2 { font-size:28px; margin-bottom:8px; color:var(--text); }
.wpqas-pricing-header p  { color:var(--muted); font-size:15px; }
.wpqas-pricing-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; max-width:1100px; margin:0 auto 24px; }
.wpqas-pricing-grid.no-free { grid-template-columns:repeat(3,1fr); max-width:860px; }
.wpqas-plan-card { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:26px 22px; position:relative; transition:border-color .15s,background .25s; }
.wpqas-plan-card:hover { border-color:var(--accent); }
.wpqas-plan-popular { border-color:var(--accent); box-shadow:0 0 28px rgba(124,106,247,.2); }
.wpqas-plan-free-card { border-color:rgba(46,204,113,.3); }
.wpqas-plan-badge-top { position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--accent); color:#fff; padding:4px 14px; border-radius:20px; font-size:11px; font-weight:700; white-space:nowrap; }
.wpqas-current-badge { background:var(--success) !important; }
.wpqas-plan-name  { font-size:17px; font-weight:700; margin-bottom:4px; color:var(--text); }
.wpqas-plan-price { font-size:36px; font-weight:700; font-family:var(--mono); margin-bottom:2px; color:var(--text); }
.wpqas-plan-price span { font-size:15px; color:var(--muted); font-weight:400; }
.wpqas-plan-price-free { font-size:30px; font-weight:700; font-family:var(--mono); color:var(--success); margin-bottom:2px; }
.wpqas-plan-price-sub { font-size:11px; color:var(--muted); margin-bottom:16px; }
.wpqas-plan-features { list-style:none; padding:0; margin:0 0 22px; }
.wpqas-plan-features li { padding:7px 0; font-size:13px; border-bottom:1px solid var(--border); color:var(--text2); }
.wpqas-plan-features li:last-child { border:none; }
.wpqas-plan-actions { display:flex; flex-direction:column; gap:10px; }
.wpqas-plan-current-label { text-align:center; color:var(--success); font-weight:600; padding:12px 0; }
.wpqas-paypal-btn-wrap { min-height:40px; }
.wpqas-pricing-footer { text-align:center; color:var(--muted); font-size:13px; margin-top:16px; }

/* ── FORMS / INPUTS ── */
.wpqas-input { background:var(--surface2); border:1px solid var(--border); color:var(--text); border-radius:7px; padding:9px 12px; font-family:var(--font); font-size:13px; width:100%; transition:border-color .15s,background .25s; }
.wpqas-input:focus { outline:none; border-color:var(--accent); }
.wpqas-form-group { margin-bottom:14px; }
.wpqas-form-group label { display:block; font-size:12px; color:var(--muted); margin-bottom:6px; text-transform:uppercase; letter-spacing:.05em; }
.wpqas-form-row { display:flex; gap:10px; align-items:flex-end; }
.wpqas-form-row .wpqas-input { flex:1; }
.wpqas-check-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:10px; }
.wpqas-check-item { display:flex; align-items:center; gap:8px; font-size:13px; cursor:pointer; color:var(--text2); }
.wpqas-scans-remaining { font-size:13px; color:var(--muted); margin:14px 0; }

/* ── BUTTONS ── */
.wpqas-btn { display:inline-flex; align-items:center; gap:6px; padding:8px 16px; border-radius:7px; font-size:13px; font-weight:500; cursor:pointer; border:1px solid var(--border); background:var(--surface2); color:var(--text); text-decoration:none; transition:all .15s; font-family:var(--font); }
.wpqas-btn:hover { border-color:var(--accent); color:var(--accent); }
.wpqas-btn-primary { background:var(--accent); border-color:var(--accent); color:#fff !important; }
.wpqas-btn-primary:hover { opacity:.88; color:#fff !important; border-color:var(--accent); }
.wpqas-btn-success { background:var(--success); border-color:var(--success); color:#fff !important; }
.wpqas-btn-success:hover { opacity:.88; color:#fff !important; }
.wpqas-btn-danger { border-color:rgba(255,77,106,.3); color:var(--critical); background:transparent; }
.wpqas-btn-danger:hover { background:rgba(255,77,106,.08); color:var(--critical); border-color:var(--critical); }
.wpqas-btn-full { width:100%; justify-content:center; padding:11px; font-size:14px; }
.wpqas-btn-lg { padding:12px 24px; font-size:15px; }
.wpqas-btn-sm { padding:5px 10px; font-size:11px; }
.wpqas-btn:disabled { opacity:.5; cursor:not-allowed; }

/* Light mode: ensure solid-colour buttons always have white text */
.wpqas-theme-light .wpqas-btn-primary,
.wpqas-theme-light .wpqas-btn-primary:hover,
.wpqas-theme-light .wpqas-btn-primary:focus { color:#fff !important; background:var(--accent); }
.wpqas-theme-light .wpqas-btn-success,
.wpqas-theme-light .wpqas-btn-success:hover  { color:#fff !important; background:var(--success); }
.wpqas-theme-light .wpqas-stripe-checkout,
.wpqas-theme-light .wpqas-start-free          { color:#fff !important; }
/* Plain buttons in light mode: hover shows accent border + accent text (readable on white) */
.wpqas-theme-light .wpqas-btn:not(.wpqas-btn-primary):not(.wpqas-btn-success):not(.wpqas-btn-danger):hover {
    background:rgba(109,90,224,.07);
    color:var(--accent);
    border-color:var(--accent);
}

/* ── TABLE ── */
.wpqas-table { width:100%; border-collapse:collapse; font-size:13px; }
.wpqas-table thead tr { background:var(--surface2); }
.wpqas-table th { padding:10px 12px; text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-weight:600; border-bottom:1px solid var(--border); }
.wpqas-table td { padding:11px 12px; border-bottom:1px solid var(--border); vertical-align:top; color:var(--text); }
.wpqas-table tbody tr:hover { background:rgba(124,106,247,.04); }
.wpqas-table a { color:var(--accent); }
.wpqas-td-actions { display:flex; gap:6px; white-space:nowrap; }
.wpqas-filter-row { display:flex; align-items:center; gap:8px; margin-bottom:16px; flex-wrap:wrap; font-size:13px; color:var(--muted); }
.wpqas-filter-btn { padding:5px 14px; border:1px solid var(--border); border-radius:20px; font-size:12px; text-decoration:none; color:var(--muted); transition:all .15s; background:transparent; }
.wpqas-filter-btn:hover,.wpqas-filter-btn.active { background:var(--accent); border-color:var(--accent); color:#fff !important; }

/* ── SCAN STATUS ── */
.wpqas-scan-status { background:var(--surface2); border:1px solid var(--border); border-radius:8px; padding:12px 16px; font-size:13px; margin-top:14px; display:flex; align-items:center; gap:10px; color:var(--text2); }
.wpqas-scan-pulse { width:10px; height:10px; border-radius:50%; background:var(--success); animation:pulse 1.2s infinite; flex-shrink:0; }
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.4)}}
.wpqas-result-section { margin-bottom:24px; }
.wpqas-result-type-hdr { font-size:14px; font-weight:600; margin-bottom:10px; padding:10px 14px; background:var(--surface2); border-radius:6px; border-left:3px solid var(--accent); color:var(--text); }

/* ── BILLING ── */
.wpqas-billing-header { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid var(--border); }
.wpqas-billing-plan  { font-size:22px; font-weight:700; margin-bottom:4px; color:var(--text); }
.wpqas-billing-price { font-size:16px; color:var(--muted); font-family:var(--mono); margin-bottom:8px; }
.wpqas-billing-actions { display:flex; flex-direction:column; gap:8px; align-items:flex-end; }
.wpqas-billing-details { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.wpqas-billing-details div { font-size:13px; color:var(--text2); }
.wpqas-billing-details span { color:var(--muted); display:block; font-size:11px; text-transform:uppercase; letter-spacing:.05em; margin-bottom:2px; }

/* ── MISC ── */
.wpqas-empty { text-align:center; color:var(--muted); padding:48px 0; font-size:14px; }
.wpqas-msg { font-size:13px; padding:8px 0; }
.wpqas-msg.success { color:var(--success); }
.wpqas-msg.error   { color:var(--critical); }
.wpqas-limit-note  { font-size:13px; color:var(--muted); }
.wpqas-url-link    { font-size:16px; }
.wpqas-limit-note a,.wpqas-empty a { color:var(--accent); }

/* ══════════════════════════════════════════════════════
   CHAT PAGE
   ══════════════════════════════════════════════════════ */
.wpqas-chat-content { padding:20px 24px; }
.wpqas-chat-layout { display:grid; grid-template-columns:260px 1fr; gap:16px; height:calc(100vh - 118px); min-height:500px; }
.wpqas-chat-sidebar { display:flex; flex-direction:column; gap:12px; overflow-y:auto; }
.wpqas-chat-sidebar .wpqas-card { padding:14px 16px; }
.wpqas-ctx-stats { display:flex; gap:6px; margin-bottom:10px; }
.wpqas-ctx-c,.wpqas-ctx-w,.wpqas-ctx-i { flex:1; text-align:center; padding:8px 4px; border-radius:8px; font-size:10px; font-family:var(--mono); border:1px solid transparent; }
.wpqas-ctx-c span,.wpqas-ctx-w span,.wpqas-ctx-i span { display:block; font-size:20px; font-weight:700; margin-bottom:2px; }
.wpqas-ctx-c { background:rgba(255,77,106,.1); color:var(--critical); border-color:rgba(255,77,106,.2); }
.wpqas-ctx-w { background:rgba(245,166,35,.1); color:var(--warning); border-color:rgba(245,166,35,.2); }
.wpqas-ctx-i { background:rgba(77,158,255,.1); color:var(--info); border-color:rgba(77,158,255,.2); }
.wpqas-ctx-note  { font-size:11px; color:var(--muted); line-height:1.5; margin:0; }
.wpqas-ctx-site  { font-size:13px; margin-bottom:10px; padding:8px 10px; background:var(--surface2); border-radius:6px; border:1px solid var(--border); color:var(--text2); }
.wpqas-site-switch { display:block; padding:7px 10px; font-size:12px; color:var(--muted); text-decoration:none; border-radius:6px; transition:all .15s; margin-bottom:4px; }
.wpqas-site-switch:hover,.wpqas-site-switch.active { background:rgba(124,106,247,.1); color:var(--text); }
.wpqas-quick-prompts { display:flex; flex-direction:column; gap:5px; }
.wpqas-qp-btn { text-align:left; padding:8px 11px; background:var(--surface2); border:1px solid var(--border); border-radius:7px; color:var(--text2); font-size:11px; cursor:pointer; transition:all .15s; font-family:var(--font); line-height:1.4; }
.wpqas-qp-btn:hover { border-color:var(--accent); background:rgba(124,106,247,.06); color:var(--text); }

/* Chat window */
.wpqas-chat-main { background:var(--surface); border:1px solid var(--border); border-radius:12px; display:flex; flex-direction:column; overflow:hidden; min-height:0; transition:background .25s; }
.wpqas-chat-window { flex:1; overflow-y:auto; padding:20px; display:flex; flex-direction:column; gap:14px; scroll-behavior:smooth; }
.wpqas-chat-window::-webkit-scrollbar { width:4px; }
.wpqas-chat-window::-webkit-scrollbar-thumb { background:var(--border); border-radius:4px; }
.wpqas-chat-welcome { display:flex; gap:12px; align-items:flex-start; background:rgba(124,106,247,.07); border:1px solid rgba(124,106,247,.18); border-radius:10px; padding:16px; }
.wpqas-chat-avatar { font-size:24px; flex-shrink:0; }
.wpqas-chat-welcome strong { display:block; font-size:14px; margin-bottom:5px; color:var(--text); }
.wpqas-chat-welcome p { font-size:12px; color:var(--muted); margin:0; line-height:1.6; }
.wpqas-chat-msg { display:flex; gap:9px; align-items:flex-start; animation:msg-in .2s ease; }
@keyframes msg-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.wpqas-chat-msg.user { flex-direction:row-reverse; }
.wpqas-chat-av { width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:14px; flex-shrink:0; border:1px solid var(--border); background:var(--surface2); }
.wpqas-chat-msg.assistant .wpqas-chat-av { background:rgba(124,106,247,.12); border-color:rgba(124,106,247,.25); }
.wpqas-chat-bubble { max-width:78%; padding:11px 14px; border-radius:11px; font-size:13px; line-height:1.7; border:1px solid var(--border); color:var(--text); background:var(--surface2); }
.wpqas-chat-msg.user .wpqas-chat-bubble { background:var(--accent); border-color:var(--accent); color:#fff; border-radius:11px 11px 2px 11px; }
.wpqas-chat-msg.assistant .wpqas-chat-bubble { border-radius:11px 11px 11px 2px; }
.wpqas-chat-bubble strong { color:var(--text); }
.wpqas-chat-msg.user .wpqas-chat-bubble strong { color:#fff; }
.wpqas-chat-bubble code { background:var(--code-bg); padding:1px 5px; border-radius:4px; font-family:var(--mono); font-size:11px; color:var(--code-color); }
.wpqas-chat-bubble pre { background:var(--code-bg); padding:10px; border-radius:6px; overflow-x:auto; margin:8px 0; font-family:var(--mono); font-size:11px; }
.wpqas-chat-bubble ul { padding-left:16px; margin:6px 0; }
.wpqas-chat-bubble li { margin-bottom:3px; }
.wpqas-chat-bubble h3 { font-size:13px; margin:10px 0 5px; }
.wpqas-chat-bubble p { margin:0 0 7px; }
.wpqas-chat-bubble p:last-child { margin:0; }
.wpqas-typing { display:flex; gap:4px; align-items:center; padding:4px 0; }
.wpqas-typing span { width:7px; height:7px; border-radius:50%; background:var(--muted); animation:bounce .9s infinite; display:inline-block; }
.wpqas-typing span:nth-child(2) { animation-delay:.15s; }
.wpqas-typing span:nth-child(3) { animation-delay:.3s; }
@keyframes bounce{0%,100%{transform:translateY(0)}40%{transform:translateY(-6px)}}
.wpqas-chat-input-area { border-top:1px solid var(--border); padding:14px 16px 12px; }
.wpqas-chat-input-row { display:flex; gap:8px; align-items:flex-end; }
.wpqas-chat-input-row textarea { flex:1; background:var(--surface2); border:1px solid var(--border); color:var(--text); border-radius:9px; padding:9px 13px; font-family:var(--font); font-size:13px; resize:none; max-height:120px; line-height:1.5; transition:border-color .15s,background .25s; }
.wpqas-chat-input-row textarea:focus { outline:none; border-color:var(--accent); }
.wpqas-chat-input-row textarea::placeholder { color:var(--muted); }
#wpqas-chat-send { width:38px; height:38px; border-radius:9px; background:var(--accent); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; color:#fff; transition:all .15s; flex-shrink:0; }
#wpqas-chat-send:hover { opacity:.85; transform:scale(1.04); }
#wpqas-chat-send:disabled { background:var(--surface2); color:var(--muted); cursor:not-allowed; transform:none; }

/* ══════════════════════════════════════════════════════
   FLOATING CHATBOX
   ══════════════════════════════════════════════════════ */
.wpqas-float-wrap { position:fixed; bottom:24px; right:24px; z-index:9999; display:flex; flex-direction:column; align-items:flex-end; gap:10px; }
.wpqas-float-toggle { width:54px; height:54px; border-radius:50%; background:var(--accent); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:22px; box-shadow:0 4px 20px rgba(124,106,247,.45); transition:all .2s; position:relative; }
.wpqas-float-toggle:hover { transform:scale(1.07); opacity:.92; }
.wpqas-float-close { display:none; color:#fff; font-size:18px; }
.wpqas-float-wrap.open .wpqas-float-open { display:none; }
.wpqas-float-wrap.open .wpqas-float-close { display:flex; align-items:center; justify-content:center; width:100%; height:100%; }
.wpqas-float-badge { position:absolute; top:-4px; right:-4px; background:var(--critical); color:#fff; font-size:9px; width:17px; height:17px; border-radius:50%; display:flex; align-items:center; justify-content:center; border:2px solid var(--bg); font-family:var(--mono); font-weight:700; }
.wpqas-float-panel { width:340px; background:var(--surface); border:1px solid var(--border); border-radius:14px; box-shadow:0 16px 48px rgba(0,0,0,.5); display:none; flex-direction:column; overflow:hidden; animation:float-in .22s cubic-bezier(.34,1.5,.64,1); transition:background .25s; }
@keyframes float-in{from{opacity:0;transform:scale(.85) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}
.wpqas-float-wrap.open .wpqas-float-panel { display:flex; }
.wpqas-float-header { padding:12px 14px; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; background:linear-gradient(135deg,rgba(124,106,247,.12) 0%,transparent 100%); }
.wpqas-float-header-l { display:flex; gap:9px; align-items:center; }
.wpqas-float-av { font-size:20px; }
.wpqas-float-title { font-size:13px; font-weight:600; color:var(--text); }
.wpqas-float-sub { font-size:10px; color:var(--success); font-family:var(--mono); }
.wpqas-float-header-r { display:flex; gap:6px; }
.wpqas-float-expand,.wpqas-float-clear { background:none; border:none; cursor:pointer; color:var(--muted); font-size:14px; padding:2px 4px; border-radius:4px; transition:color .15s; text-decoration:none; }
.wpqas-float-expand:hover,.wpqas-float-clear:hover { color:var(--text); }
.wpqas-float-msgs { max-height:280px; overflow-y:auto; padding:12px 12px 6px; display:flex; flex-direction:column; gap:10px; scroll-behavior:smooth; }
.wpqas-float-msgs::-webkit-scrollbar { width:3px; }
.wpqas-float-msgs::-webkit-scrollbar-thumb { background:var(--border); border-radius:3px; }
.wpqas-float-msg { display:flex; gap:7px; }
.wpqas-float-msg.user { flex-direction:row-reverse; }
.wpqas-float-bubble { max-width:88%; padding:8px 11px; border-radius:9px; font-size:12px; line-height:1.6; border:1px solid var(--border); animation:msg-in .2s ease; color:var(--text); background:var(--surface2); }
.wpqas-float-msg.assistant .wpqas-float-bubble { border-radius:9px 9px 9px 2px; }
.wpqas-float-msg.user .wpqas-float-bubble { background:var(--accent); color:#fff; border-color:var(--accent); border-radius:9px 9px 2px 9px; }
.wpqas-float-bubble strong { color:var(--text); }
.wpqas-float-msg.user .wpqas-float-bubble strong { color:#fff; }
.wpqas-float-bubble code { background:var(--code-bg); padding:1px 4px; border-radius:3px; font-family:var(--mono); font-size:10px; color:var(--code-color); }
.wpqas-float-bubble ul { padding-left:14px; margin:5px 0; }
.wpqas-float-quick-row { padding:7px 10px; display:flex; gap:5px; border-top:1px solid var(--border); overflow-x:auto; }
.wpqas-float-quick-row::-webkit-scrollbar { display:none; }
.wpqas-fq-btn { white-space:nowrap; padding:4px 9px; background:var(--surface2); border:1px solid var(--border); border-radius:20px; color:var(--muted); font-size:10px; cursor:pointer; transition:all .15s; font-family:var(--font); }
.wpqas-fq-btn:hover { border-color:var(--accent); color:var(--text); background:rgba(124,106,247,.08); }
.wpqas-float-input-row { padding:9px 11px; border-top:1px solid var(--border); display:flex; gap:7px; align-items:center; }
#wpqas-float-input { flex:1; background:var(--surface2); border:1px solid var(--border); color:var(--text); border-radius:7px; padding:7px 11px; font-family:var(--font); font-size:11px; transition:border-color .15s; }
#wpqas-float-input:focus { outline:none; border-color:var(--accent); }
#wpqas-float-input::placeholder { color:var(--muted); }
#wpqas-float-send { width:30px; height:30px; border-radius:7px; background:var(--accent); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; color:#fff; transition:all .15s; flex-shrink:0; }
#wpqas-float-send:hover { opacity:.85; }
#wpqas-float-send:disabled { background:var(--surface2); color:var(--muted); cursor:not-allowed; }

/* ══════════════════════════════════════════════════════
   ADMIN STYLES (inside WP admin)
   ══════════════════════════════════════════════════════ */
.wpqas-admin-wrap { max-width:1200px; }
.wpqas-admin-wrap h1 { font-size:22px; margin-bottom:20px; color:#1a1d2e; }
.wpqas-admin-stats { display:flex; gap:14px; margin-bottom:24px; flex-wrap:wrap; }
.wpqas-admin-stat { background:#fff; border:1px solid #e2e5ef; border-radius:10px; padding:18px 22px; min-width:150px; position:relative; overflow:hidden; }
.wpqas-admin-stat::before { content:''; position:absolute; top:0;left:0;right:0;height:3px; background:linear-gradient(90deg,#7c6af7,#a78bfa); }
.wpqas-admin-stat-val { font-size:28px; font-weight:700; font-family:monospace; color:#7c6af7; line-height:1.1; }
.wpqas-admin-stat-lbl { font-size:11px; color:#6b7280; text-transform:uppercase; letter-spacing:.06em; margin-top:3px; }
.wpqas-admin-panel { background:#fff; border:1px solid #e2e5ef; border-radius:10px; padding:22px 24px; margin-bottom:18px; }
.wpqas-admin-panel h2 { font-size:15px; margin:0 0 16px; padding-bottom:12px; border-bottom:1px solid #e2e5ef; color:#1a1d2e; }

/* Revenue page */
.wpqas-rev-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:24px; }
.wpqas-rev-card { background:#fff; border:1px solid #e2e5ef; border-radius:12px; padding:20px; display:flex; align-items:center; gap:14px; transition:transform .15s,box-shadow .15s; }
.wpqas-rev-card:hover { transform:translateY(-2px); box-shadow:0 4px 16px rgba(0,0,0,.07); }
.wpqas-rev-icon { font-size:26px; width:48px; height:48px; border-radius:12px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.wpqas-rev-primary .wpqas-rev-icon { background:#f0effe; }
.wpqas-rev-success .wpqas-rev-icon { background:#f0fdf4; }
.wpqas-rev-accent  .wpqas-rev-icon { background:#eff6ff; }
.wpqas-rev-info    .wpqas-rev-icon { background:#fffbeb; }
.wpqas-rev-val { font-size:26px; font-weight:700; font-family:monospace; line-height:1.1; margin-bottom:3px; color:#1a1d2e; }
.wpqas-rev-lbl { font-size:12px; color:#6b7280; display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.wpqas-rev-sub { font-size:11px; color:#9ca3af; }
.wpqas-rev-growth { font-size:11px; font-weight:700; padding:2px 7px; border-radius:4px; }
.wpqas-rev-growth.up   { background:#f0fdf4; color:#16a34a; }
.wpqas-rev-growth.down { background:#fef2f2; color:#dc2626; }
.wpqas-rev-two-col { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:18px; }
.wpqas-rev-table { border-collapse:collapse; width:100%; }
.wpqas-rev-table th { padding:10px 14px; font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:#6b7280; border-bottom:2px solid #e2e5ef; text-align:left; background:#f9fafb; }
.wpqas-rev-table td { padding:12px 14px; border-bottom:1px solid #f0f1f6; font-size:13px; vertical-align:middle; color:#1a1d2e; }
.wpqas-rev-table tbody tr:hover { background:#fafbff; }
.wpqas-rev-total-row td { background:#f0effe; font-weight:600; border-top:2px solid #ddd5fe; color:#4f35c2; }
.wpqas-rev-free-row td { color:#9ca3af; font-style:italic; }
.wpqas-rev-plan-dot { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:6px; vertical-align:middle; }
.wpqas-rev-dot-free    { background:#9ca3af; }
.wpqas-rev-dot-starter { background:#3b82f6; }
.wpqas-rev-dot-pro     { background:#7c6af7; }
.wpqas-rev-dot-agency  { background:#f59e0b; }
.wpqas-rev-plan-pill { background:#f0effe; color:#6d5ae0; padding:3px 10px; border-radius:4px; font-size:11px; font-weight:600; }
.wpqas-rev-gw { font-size:12px; font-weight:600; display:inline-flex; align-items:center; gap:4px; }
.wpqas-rev-gw-stripe { color:#635bff; }
.wpqas-rev-gw-paypal { color:#0070ba; }
.wpqas-rev-stats-list { display:flex; flex-direction:column; }
.wpqas-rev-stat-row { display:flex; justify-content:space-between; align-items:center; padding:13px 0; border-bottom:1px solid #f0f1f6; font-size:13px; }
.wpqas-rev-stat-row:last-child { border-bottom:none; }
.wpqas-rev-stat-row span { color:#6b7280; }
.wpqas-rev-stat-row strong { color:#1a1d2e; font-family:monospace; }
.wpqas-text-success { color:#16a34a !important; }
.wpqas-text-danger  { color:#dc2626 !important; }

/* Shared pills inside admin */
.wpqas-admin-wrap .wpqas-pill { display:inline-block; padding:3px 9px; border-radius:20px; font-size:11px; font-weight:600; text-transform:uppercase; font-family:monospace; }
.wpqas-admin-wrap .wpqas-pill-ok       { background:#f0fdf4; color:#16a34a; border:1px solid #bbf7d0; }
.wpqas-admin-wrap .wpqas-pill-open     { background:#fffbeb; color:#b45309; border:1px solid #fde68a; }
.wpqas-admin-wrap .wpqas-pill-critical { background:#fef2f2; color:#dc2626; border:1px solid #fecaca; }

/* ══════════════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════════════ */
@media(max-width:1100px) {
    .wpqas-pricing-grid { grid-template-columns:repeat(2,1fr); }
    .wpqas-pricing-grid.no-free { grid-template-columns:repeat(2,1fr); max-width:100%; }
    .wpqas-rev-grid { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:900px) {
    .wpqas-portal-nav  { display:none; }
    .wpqas-stat-row    { grid-template-columns:repeat(2,1fr); }
    .wpqas-pricing-grid,.wpqas-pricing-grid.no-free { grid-template-columns:1fr; }
    .wpqas-chat-layout { grid-template-columns:1fr; }
    .wpqas-chat-sidebar { display:none; }
    .wpqas-float-panel { width:calc(100vw - 32px); }
    .wpqas-rev-two-col { grid-template-columns:1fr; }
    .wpqas-rev-grid    { grid-template-columns:1fr 1fr; }
    .wpqas-billing-header { flex-direction:column; gap:16px; }
    .wpqas-billing-details { grid-template-columns:1fr; }
    .wpqas-content { padding:20px 16px; }
}

/* ══════════════════════════════════════════════════════
   CHECKOUT PAGE
   ══════════════════════════════════════════════════════ */
.wpqas-checkout-back { display:inline-flex; align-items:center; gap:6px; color:var(--muted); text-decoration:none; font-size:13px; margin-bottom:24px; transition:color .15s; }
.wpqas-checkout-back:hover { color:var(--text); }

.wpqas-checkout-wrap { display:grid; grid-template-columns:360px 1fr; gap:32px; max-width:860px; align-items:start; }
.wpqas-checkout-wrap .wpqas-checkout-back { grid-column:1/-1; }

/* Order summary card */
.wpqas-checkout-summary { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:28px; position:sticky; top:80px; }
.wpqas-checkout-plan-name { font-size:13px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.07em; margin-bottom:8px; }
.wpqas-checkout-price { font-size:42px; font-weight:700; font-family:var(--mono); color:var(--text); line-height:1; margin-bottom:4px; }
.wpqas-checkout-price span { font-size:16px; font-weight:400; color:var(--muted); }
.wpqas-checkout-features { list-style:none; padding:0; margin:20px 0; border-top:1px solid var(--border); }
.wpqas-checkout-features li { padding:9px 0; font-size:13px; color:var(--text2); border-bottom:1px solid var(--border); }
.wpqas-checkout-features li:last-child { border:none; }
.wpqas-checkout-guarantee { font-size:11px; color:var(--muted); text-align:center; padding-top:14px; border-top:1px solid var(--border); line-height:1.6; }

/* Payment methods panel */
.wpqas-checkout-methods { display:flex; flex-direction:column; gap:14px; }
.wpqas-checkout-methods-title { font-size:18px; font-weight:600; color:var(--text); margin-bottom:4px; }

.wpqas-payment-option { background:var(--surface); border:2px solid var(--border); border-radius:12px; padding:20px; transition:border-color .2s; }
.wpqas-payment-option:hover { border-color:var(--accent); }
.wpqas-payment-option-header { display:flex; align-items:center; gap:14px; margin-bottom:16px; }
.wpqas-payment-logo { display:flex; align-items:center; justify-content:center; width:64px; height:40px; background:var(--surface2); border:1px solid var(--border); border-radius:8px; flex-shrink:0; padding:6px; }
.wpqas-payment-name { font-size:15px; font-weight:600; color:var(--text); }
.wpqas-payment-sub  { font-size:12px; color:var(--muted); margin-top:2px; }

/* Light mode tweaks */
.wpqas-theme-light .wpqas-checkout-summary { box-shadow:0 2px 12px var(--shadow); }
.wpqas-theme-light .wpqas-payment-option    { box-shadow:0 1px 4px var(--shadow); }
.wpqas-theme-light .wpqas-payment-logo      { background:#f8f8ff; }

@media(max-width:760px) {
    .wpqas-checkout-wrap { grid-template-columns:1fr; }
    .wpqas-checkout-summary { position:static; }
}

/* Checkout — setup notices */
.wpqas-checkout-setup-notice { background:rgba(245,166,35,.08); border:1px solid rgba(245,166,35,.3); border-radius:8px; padding:12px 16px; font-size:13px; color:var(--text2); margin-bottom:4px; }
.wpqas-checkout-setup-notice a { color:var(--accent); font-weight:600; }
.wpqas-checkout-not-configured { background:var(--surface); border:2px dashed var(--border); border-radius:12px; padding:40px 28px; text-align:center; }
.wpqas-checkout-not-configured-icon { font-size:40px; margin-bottom:14px; }
.wpqas-checkout-not-configured-title { font-size:17px; font-weight:600; color:var(--text); margin-bottom:10px; }
.wpqas-checkout-not-configured-text { font-size:13px; color:var(--muted); line-height:1.7; }
.wpqas-checkout-not-configured-text a { color:var(--accent); font-weight:600; }

/* Current plan banner on pricing page */
.wpqas-current-plan-banner { display:flex; justify-content:space-between; align-items:center; background:var(--surface); border:1px solid var(--border); border-left:4px solid var(--accent); border-radius:8px; padding:14px 18px; margin-bottom:20px; font-size:13px; color:var(--text2); gap:16px; flex-wrap:wrap; }
.wpqas-theme-light .wpqas-current-plan-banner { box-shadow:0 1px 4px var(--shadow); }