/* ── WAPRO Frontend Styles ─────────────────────────────── */
:root{
  --wapro-primary:#6366f1;
  --wapro-green:#10b981;
  --wapro-red:#ef4444;
  --wapro-yellow:#f59e0b;
  --wapro-blue:#3b82f6;
  --wapro-gray:#6b7280;
  --wapro-light:#f9fafb;
  --wapro-border:#e5e7eb;
  --wapro-radius:10px;
}

/* Dashboard wrapper */
.wapro-dashboard{max-width:1000px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#111}

/* Stats bar */
.wapro-stats-bar{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}
.wapro-stat{flex:1;min-width:120px;background:#fff;border:1px solid var(--wapro-border);border-radius:var(--wapro-radius);padding:18px 14px;text-align:center;box-shadow:0 1px 4px rgba(0,0,0,.05)}
.wapro-stat.highlight{border-color:var(--wapro-primary);background:linear-gradient(135deg,#eef2ff,#fff)}
.wapro-stat .sv{display:block;font-size:1.5em;font-weight:700;color:var(--wapro-primary)}
.wapro-stat.highlight .sv{color:var(--wapro-green)}
.wapro-stat .sl{display:block;font-size:.75em;color:var(--wapro-gray);margin-top:3px}

/* Tabs */
.wapro-tabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:2px solid var(--wapro-border);margin-bottom:20px}
.wapro-tab{background:none;border:none;padding:10px 16px;cursor:pointer;font-size:.9em;color:var(--wapro-gray);border-bottom:2px solid transparent;margin-bottom:-2px;transition:.2s}
.wapro-tab:hover{color:var(--wapro-primary)}
.wapro-tab.active{color:var(--wapro-primary);border-bottom-color:var(--wapro-primary);font-weight:600}

/* Panels */
.wapro-panel{display:none;animation:wapro-fade .2s ease}
.wapro-panel.active{display:block}
@keyframes wapro-fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

/* Tables */
.wapro-table{width:100%;border-collapse:collapse;font-size:.88em;background:#fff;border-radius:var(--wapro-radius);overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.06)}
.wapro-table th{background:#f3f4f6;padding:10px 12px;text-align:left;font-weight:600;font-size:.82em;text-transform:uppercase;letter-spacing:.04em;color:var(--wapro-gray)}
.wapro-table td{padding:10px 12px;border-top:1px solid var(--wapro-border)}
.wapro-table tr:hover td{background:#fafafa}

/* Badges */
.wapro-badge{display:inline-block;padding:2px 10px;border-radius:20px;font-size:.75em;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.wapro-badge--active,.wapro-badge--approved,.wapro-badge--completed{background:#d1fae5;color:#065f46}
.wapro-badge--pending{background:#fef3c7;color:#92400e}
.wapro-badge--rejected,.wapro-badge--failed,.wapro-badge--suspended{background:#fee2e2;color:#991b1b}
.wapro-badge--paid,.wapro-badge--processing{background:#dbeafe;color:#1e40af}
.wapro-badge--draft{background:#f3f4f6;color:#6b7280}
.wapro-badge--cps,.wapro-badge--cpa{background:#ede9fe;color:#5b21b6}
.wapro-badge--cpl,.wapro-badge--cpc{background:#fce7f3;color:#9d174d}
.wapro-badge--revshare{background:#ecfdf5;color:#065f46}

/* Notices */
.wapro-notice{padding:14px 18px;background:#eff6ff;border-left:4px solid var(--wapro-primary);border-radius:4px;margin:16px 0}
.wapro-pending{background:#fffbeb;border-left-color:var(--wapro-yellow)}
.wapro-error{background:#fef2f2;border-left-color:var(--wapro-red)}
.wapro-success{background:#f0fdf4;border-left-color:var(--wapro-green)}

/* Buttons */
.wapro-btn-primary{background:var(--wapro-primary);color:#fff;border:none;padding:10px 22px;border-radius:6px;cursor:pointer;font-size:.9em;font-weight:600;transition:.15s}
.wapro-btn-primary:hover{background:#4f46e5}
.wapro-btn-sm{background:var(--wapro-primary);color:#fff;padding:6px 14px;border-radius:4px;text-decoration:none;font-size:.82em;font-weight:600}

/* Copy row */
.wapro-copy-row{display:flex;gap:8px;align-items:center}
.wapro-copy-row input{flex:1;padding:8px 12px;border:1px solid var(--wapro-border);border-radius:6px;font-size:.88em;background:#f9fafb}
.wapro-copy-row button,.wapro-copy-row a{padding:8px 16px;background:var(--wapro-primary);color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:.85em;font-weight:600;white-space:nowrap;text-decoration:none}
.wapro-copy-row button:hover{background:#4f46e5}

/* Mini input inside tables */
.wapro-mini-input{width:200px;padding:4px 8px;border:1px solid var(--wapro-border);border-radius:4px;font-size:.8em}

/* Form */
.wapro-form label,.wapro-register-form label{display:block;font-weight:600;margin:12px 0 4px;font-size:.88em}
.wapro-register-form input[type=text],.wapro-register-form input[type=email],.wapro-register-form select,.wapro-register-form textarea,
.wapro-form input[type=text],.wapro-form input[type=url],.wapro-form input[type=email],.wapro-form input[type=number],.wapro-form select,.wapro-form textarea{
  width:100%;max-width:500px;padding:9px 12px;border:1px solid var(--wapro-border);border-radius:6px;font-size:.9em;box-sizing:border-box}
.wapro-form-row{display:flex;gap:16px;flex-wrap:wrap}
.wapro-form-row>div{flex:1;min-width:150px}
.wapro-form-col{display:flex;flex-direction:column;gap:8px;max-width:500px}

/* Affiliate type grid */
.wapro-type-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin:12px 0 20px}
.wapro-type-card{display:flex;flex-direction:column;align-items:center;padding:14px;border:2px solid var(--wapro-border);border-radius:var(--wapro-radius);cursor:pointer;transition:.15s;text-align:center}
.wapro-type-card:hover{border-color:var(--wapro-primary);background:#f5f3ff}
.wapro-type-card input{margin-bottom:6px;accent-color:var(--wapro-primary)}
.wapro-type-card span{font-size:.85em;font-weight:600}
.wapro-type-card:has(input:checked){border-color:var(--wapro-primary);background:#eef2ff}

/* Campaign cards */
.wapro-campaign-list,.wapro-dashboard #tab-campaigns{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.wapro-campaign-card{background:#fff;border:1px solid var(--wapro-border);border-radius:var(--wapro-radius);padding:18px;box-shadow:0 1px 4px rgba(0,0,0,.05)}
.wcc-header{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:8px}
.wcc-meta{display:flex;gap:12px;flex-wrap:wrap;font-size:.8em;color:var(--wapro-gray);margin:10px 0}
.wapro-campaign-card button{margin-top:10px;background:var(--wapro-primary);color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.85em;font-weight:600}

/* Smart links */
.sl-offer-row{display:flex;gap:8px;margin-bottom:8px}
.sl-url{flex:3!important;max-width:none!important}
.sl-weight{flex:1!important;max-width:70px!important}
.wapro-sl-row{background:#fff;border:1px solid var(--wapro-border);border-radius:8px;padding:12px;margin-bottom:10px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* Code blocks */
.wapro-code-block{width:100%;max-width:600px;padding:10px;background:#1e1e2e;color:#cdd6f4;border:none;border-radius:6px;font-family:monospace;font-size:.82em;resize:none}

/* Result box */
.wapro-result-box{padding:12px;background:#f0fdf4;border:1px solid #86efac;border-radius:6px;font-size:.88em}

/* Payout CTA */
.wapro-payout-cta{background:linear-gradient(135deg,#ede9fe,#dbeafe);border-radius:var(--wapro-radius);padding:20px;margin-bottom:20px}
.wapro-payout-cta button{background:var(--wapro-green);color:#fff;border:none;padding:10px 22px;border-radius:6px;cursor:pointer;font-size:.9em;font-weight:700}

/* Approved badge */
.wapro-approved-badge{color:var(--wapro-green);font-weight:600;font-size:.88em}

/* WCFM specific */
.wapro-wcfm .wapro-wcfm-section{background:#fff;border:1px solid var(--wapro-border);border-radius:var(--wapro-radius);padding:20px;margin-bottom:20px}
.wapro-wcfm .wapro-wcfm-section h3{margin-top:0;padding-bottom:10px;border-bottom:1px solid var(--wapro-border)}

/* Admin tabs */
.wapro-admin-tabs{display:flex;gap:4px;margin-bottom:20px;border-bottom:2px solid var(--wapro-border)}
.wapro-atab{padding:8px 18px;text-decoration:none;color:var(--wapro-gray);border-bottom:2px solid transparent;margin-bottom:-2px;font-size:.9em;font-weight:600}
.wapro-atab.active,.wapro-atab:hover{color:var(--wapro-primary);border-bottom-color:var(--wapro-primary)}

/* Admin wrap */
.wapro-admin-wrap .wapro-stats-bar{margin:16px 0 24px}

/* Advertiser portal */
.wapro-advertiser-portal .wapro-form{background:#fff;border:1px solid var(--wapro-border);border-radius:var(--wapro-radius);padding:24px;max-width:600px;margin-bottom:30px}

@media(max-width:600px){
  .wapro-stats-bar{gap:8px}
  .wapro-stat{min-width:100px;padding:12px 8px}
  .wapro-tabs{gap:2px}
  .wapro-tab{padding:8px 10px;font-size:.8em}
  .wapro-table{font-size:.78em}
  .wapro-type-grid{grid-template-columns:1fr 1fr}
}
