/* ── Reset & base ── */
*,*::before,*::after{box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,sans-serif;color:#1a1a2e;line-height:1.5;margin:0;padding:0;background:#f5f6fa}
.ppm{color:#1a1a2e;line-height:1.5}

/* ── Container ── */
.ppm-container{max-width:1280px;margin:0 auto;padding:24px 20px}

/* ── Navigation ── */
.ppm-nav{background:#fff;border-bottom:2px solid #0070ba;box-shadow:0 1px 3px rgba(0,0,0,0.06)}
.ppm-nav-inner{max-width:1280px;margin:0 auto;padding:0 20px;display:flex;align-items:center;height:56px;gap:24px}
.ppm-nav-brand{font-size:16px;font-weight:700;color:#0070ba;text-decoration:none;letter-spacing:-0.3px}
.ppm-nav-links{display:flex;gap:4px;margin-left:24px}
.ppm-nav-link{padding:8px 16px;font-size:13px;font-weight:600;color:#667085;text-decoration:none;border-radius:6px;transition:all .15s}
.ppm-nav-link:hover{background:#f0f2f5;color:#344054}
.ppm-nav-link.active{background:#e8f4fd;color:#0070ba}
.ppm-nav-user{margin-left:auto;display:flex;align-items:center;gap:10px}
.ppm-nav-username{font-size:13px;font-weight:600;color:#344054}

/* ── Auth pages ── */
.ppm-auth-page{display:flex;align-items:center;justify-content:center;min-height:100vh;background:#f5f6fa}
.ppm-auth-card{background:#fff;border:1px solid #e4e7ec;border-radius:12px;padding:32px;width:100%;max-width:400px;box-shadow:0 4px 16px rgba(0,0,0,0.06)}
.ppm-auth-header{text-align:center;margin-bottom:24px}
.ppm-auth-header h2{margin:0 0 4px;font-size:24px;font-weight:800;color:#0070ba}
.ppm-auth-header p{margin:0;font-size:14px;color:#667085}
.ppm-auth-card .ppm-field{margin-bottom:14px}

/* ── Header bar ── */
.ppm-header{display:flex;align-items:center;justify-content:space-between;padding:20px 0 16px;border-bottom:3px solid #0070ba;margin-bottom:24px}
.ppm-header h2{margin:0;font-size:22px;font-weight:700;color:#1a1a2e;letter-spacing:-0.3px}
.ppm-header .ppm-meta{display:flex;gap:10px;align-items:center}
.ppm-badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600;letter-spacing:0.3px}
.ppm-badge-env{background:#e8f4fd;color:#0070ba}
.ppm-badge-ver{background:#f0f0f0;color:#666}

/* ── Cards ── */
.ppm-card{background:#fff;border:1px solid #e4e7ec;border-radius:10px;padding:24px;margin-bottom:20px;box-shadow:0 1px 3px rgba(0,0,0,0.04)}
.ppm-card-header{display:flex;align-items:center;gap:10px;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid #f0f2f5}
.ppm-card-header h3{margin:0;font-size:16px;font-weight:700;color:#1a1a2e}
.ppm-card-header .ppm-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0}
.ppm-icon-blue{background:#e8f4fd;color:#0070ba}
.ppm-icon-green{background:#e6f9ee;color:#12b76a}
.ppm-icon-amber{background:#fef7e6;color:#f79009}
.ppm-icon-red{background:#fde8e8;color:#f04438}
.ppm-icon-purple{background:#f0e8fd;color:#7c3aed}

/* ── Stat grid ── */
.ppm-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin:16px 0}
.ppm-stat{background:#fff;border:1px solid #e4e7ec;border-radius:10px;padding:18px 16px;text-align:center;transition:box-shadow .15s,transform .15s}
.ppm-stat:hover{box-shadow:0 4px 12px rgba(0,0,0,0.06);transform:translateY(-1px)}
.ppm-stat-value{font-size:28px;font-weight:800;line-height:1.1;margin-bottom:4px}
.ppm-stat-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;color:#667085}

/* ── Colour accents ── */
.ppm-c-blue{color:#0070ba}
.ppm-c-green{color:#12b76a}
.ppm-c-amber{color:#f79009}
.ppm-c-red{color:#f04438}
.ppm-c-gray{color:#667085}

/* ── Donut ── */
.ppm-donut-wrap{display:flex;align-items:center;justify-content:center;gap:24px;padding:10px 0}
.ppm-donut{position:relative;width:110px;height:110px}
.ppm-donut svg{transform:rotate(-90deg)}
.ppm-donut-label{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.ppm-donut-pct{font-size:22px;font-weight:800;color:#1a1a2e}
.ppm-donut-sub{font-size:10px;color:#667085;text-transform:uppercase;letter-spacing:0.4px}
.ppm-donut-legend{display:flex;flex-direction:column;gap:8px}
.ppm-legend-item{display:flex;align-items:center;gap:8px;font-size:13px;color:#344054}
.ppm-legend-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}

/* ── Currency breakdown ── */
.ppm-currency-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin:16px 0}
.ppm-cur-card{background:#fafbfc;border:1px solid #e4e7ec;border-radius:10px;padding:16px;position:relative;overflow:hidden}
.ppm-cur-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:#0070ba}
.ppm-cur-badge{display:inline-block;background:#0070ba;color:#fff;font-size:13px;font-weight:700;padding:4px 12px;border-radius:6px;margin-bottom:10px;letter-spacing:0.5px}
.ppm-cur-rows{display:flex;flex-direction:column;gap:6px}
.ppm-cur-row{display:flex;justify-content:space-between;font-size:13px}
.ppm-cur-row span:first-child{color:#667085}
.ppm-cur-row span:last-child{font-weight:600;color:#344054}

/* ── Tabs ── */
.ppm-tabs{display:flex;gap:0;border-bottom:2px solid #e4e7ec;margin-bottom:20px}
.ppm-tab{padding:12px 22px;font-size:13px;font-weight:600;color:#667085;text-decoration:none;border-bottom:3px solid transparent;margin-bottom:-2px;transition:all .15s;cursor:pointer}
.ppm-tab:hover{color:#344054;background:#fafbfc}
.ppm-tab-active{color:#0070ba;border-bottom-color:#0070ba}
.ppm-tab-count{display:inline-block;background:#f0f2f5;color:#667085;font-size:11px;font-weight:700;padding:2px 8px;border-radius:10px;margin-left:6px}
.ppm-tab-active .ppm-tab-count{background:#e8f4fd;color:#0070ba}

/* ── Tables ── */
.ppm-table-wrap{overflow-x:auto;border:1px solid #e4e7ec;border-radius:10px;margin:16px 0}
.ppm-table{width:100%;border-collapse:collapse;font-size:13px}
.ppm-table thead{background:#f9fafb}
.ppm-table th{padding:12px 14px;text-align:left;font-weight:600;color:#667085;font-size:11px;text-transform:uppercase;letter-spacing:0.4px;border-bottom:1px solid #e4e7ec;white-space:nowrap}
.ppm-table td{padding:10px 14px;border-bottom:1px solid #f2f4f7;color:#344054}
.ppm-table tbody tr:last-child td{border-bottom:none}
.ppm-table tbody tr:hover{background:#f9fafb}
.ppm-table .mono{font-family:"SF Mono",SFMono-Regular,Consolas,"Liberation Mono",Menlo,monospace;font-size:11px;color:#475467}
.ppm-table a{color:#0070ba;text-decoration:none;font-weight:500}
.ppm-table a:hover{text-decoration:underline}
.ppm-table tfoot{background:#f9fafb;border-top:2px solid #e4e7ec}
.ppm-table tfoot td{padding:10px 14px;font-weight:700;font-size:12px;color:#344054;border-bottom:none !important}

/* ── Pills / Badges ── */
.ppm-pill{display:inline-block;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600;white-space:nowrap}
.ppm-pill-green{background:#e6f9ee;color:#12b76a}
.ppm-pill-amber{background:#fef7e6;color:#f79009}
.ppm-pill-red{background:#fde8e8;color:#f04438}
.ppm-pill-blue{background:#e8f4fd;color:#0070ba}
.ppm-pill-purple{background:#f3e8ff;color:#7c3aed}
.ppm-pill-gray{background:#f0f2f5;color:#667085}
.ppm-cur-pill{padding:2px 8px;border-radius:4px;font-size:11px;font-weight:700;letter-spacing:0.3px;background:#f0f2f5;color:#344054}
.ppm-cur-usd{background:#dbeafe;color:#1d4ed8}
.ppm-cur-eur{background:#d1fae5;color:#065f46}
.ppm-cur-gbp{background:#fce7f3;color:#9d174d}
.ppm-cur-inr{background:#fff7ed;color:#c2410c}
.ppm-cur-aud{background:#fef3c7;color:#92400e}
.ppm-cur-cad{background:#fee2e2;color:#991b1b}
.ppm-cur-jpy{background:#f3e8ff;color:#7c3aed}
.ppm-cur-sgd{background:#ccfbf1;color:#0f766e}
.ppm-cur-aed{background:#e0e7ff;color:#4338ca}
.ppm-cur-brl{background:#d9f99d;color:#3f6212}
.ppm-cur-chf{background:#fecdd3;color:#be123c}
.ppm-cur-nzd{background:#cffafe;color:#155e75}
.ppm-cur-myr{background:#ede9fe;color:#5b21b6}
.ppm-cur-zar{background:#fef9c3;color:#854d0e}
.ppm-cur-hkd{background:#fbcfe8;color:#a21caf}
.ppm-status-ok{color:#12b76a;font-weight:700}
.ppm-status-bad{color:#f04438;font-weight:700}
.ppm-pill-refund{background:#fde8e8;color:#b42318;border:1px solid #fbb1b1}
.ppm-pill-dispute{background:#fef3f2;color:#912018;border:1px solid #fda29b;animation:ppm-pulse 2s infinite}
.ppm-pill-pending{background:#fef7e6;color:#7a4510;border:1px solid #fde1a0}
.ppm-pill-denied{background:#f0f2f5;color:#667085;border:1px solid #d0d5dd;text-decoration:line-through}
@keyframes ppm-pulse{0%,100%{opacity:1}50%{opacity:.7}}

/* ── Match confidence pills ── */
.ppm-match-txnid{background:#e6f9ee;color:#085d3a}
.ppm-match-invoice{background:#e8f4fd;color:#0070ba}
.ppm-match-fuzzy{background:#fef7e6;color:#7a4510}

/* ── Invoice status ── */
.ppm-inv-paid{color:#12b76a;font-weight:600;font-size:11px}
.ppm-inv-unpaid{color:#f79009;font-weight:600;font-size:11px}
.ppm-inv-cancelled{color:#f04438;font-weight:600;font-size:11px}
.ppm-inv-other{color:#667085;font-weight:600;font-size:11px}

/* ── Buttons ── */
.ppm-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 18px;border:none;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;text-decoration:none;transition:all .15s;line-height:1.4}
.ppm-btn:hover{transform:translateY(-1px);box-shadow:0 2px 8px rgba(0,0,0,0.1)}
.ppm-btn-primary{background:#0070ba;color:#fff}
.ppm-btn-primary:hover{background:#005ea6;color:#fff}
.ppm-btn-primary:disabled{background:#b0d4ed;cursor:not-allowed;transform:none;box-shadow:none}
.ppm-btn-secondary{background:#f0f2f5;color:#344054}
.ppm-btn-secondary:hover{background:#e4e7ec;color:#1a1a2e}
.ppm-btn-danger{background:#fde8e8;color:#f04438}
.ppm-btn-danger:hover{background:#f04438;color:#fff}
.ppm-btn-success{background:#e6f9ee;color:#12b76a}
.ppm-btn-success:hover{background:#12b76a;color:#fff}
.ppm-btn-sm{padding:6px 14px;font-size:12px;border-radius:6px}
.ppm-btn-group{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}

/* ── Forms ── */
.ppm-form-row{display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap}
.ppm-field{display:flex;flex-direction:column;gap:5px}
.ppm-field label{font-size:12px;font-weight:600;color:#344054;text-transform:uppercase;letter-spacing:0.3px}
.ppm-field input,.ppm-field select{padding:9px 14px;border:1px solid #d0d5dd;border-radius:8px;font-size:14px;color:#344054;background:#fff;transition:border-color .15s,box-shadow .15s}
.ppm-field input:focus,.ppm-field select:focus{outline:none;border-color:#0070ba;box-shadow:0 0 0 3px rgba(0,112,186,0.12)}

/* ── Alerts ── */
.ppm-alert{padding:14px 18px;border-radius:8px;margin-bottom:16px;font-size:13px;display:flex;align-items:flex-start;gap:10px;line-height:1.5}
.ppm-alert a{color:inherit;font-weight:600;text-decoration:underline}
.ppm-alert-info{background:#e8f4fd;border:1px solid #b6dff7;color:#0c5776}
.ppm-alert-success{background:#e6f9ee;border:1px solid #a6ebc4;color:#085d3a}
.ppm-alert-warning{background:#fef7e6;border:1px solid #fde1a0;color:#7a4510}
.ppm-alert-danger{background:#fde8e8;border:1px solid #fbb1b1;color:#7a1018}

/* ── Search & Filters ── */
.ppm-search input{padding:8px 14px;border:1px solid #d0d5dd;border-radius:8px;font-size:13px;width:260px;transition:border-color .15s}
.ppm-search input:focus{outline:none;border-color:#0070ba;box-shadow:0 0 0 3px rgba(0,112,186,0.12)}
.ppm-filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.ppm-filter-btn{padding:5px 12px;border:1px solid #d0d5dd;border-radius:6px;font-size:12px;font-weight:500;color:#667085;background:#fff;cursor:pointer;transition:all .15s}
.ppm-filter-btn:hover{border-color:#0070ba;color:#0070ba}
.ppm-filter-btn.active{background:#0070ba;color:#fff;border-color:#0070ba}
.ppm-filter-select{padding:5px 10px;border:1px solid #d0d5dd;border-radius:6px;font-size:12px;color:#344054;background:#fff}

/* ── Date presets ── */
.ppm-presets{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.ppm-preset{padding:5px 12px;border:1px solid #d0d5dd;border-radius:6px;font-size:12px;font-weight:500;color:#344054;background:#fff;cursor:pointer;transition:all .15s}
.ppm-preset:hover{background:#e8f4fd;border-color:#0070ba;color:#0070ba}

/* ── Copy button ── */
.ppm-copy{display:inline-block;margin-left:4px;padding:1px 5px;font-size:10px;border:1px solid #d0d5dd;border-radius:4px;color:#667085;background:#fff;cursor:pointer;vertical-align:middle;transition:all .15s;line-height:1.3}
.ppm-copy:hover{background:#e8f4fd;border-color:#0070ba;color:#0070ba}
.ppm-copy.copied{background:#e6f9ee;border-color:#12b76a;color:#12b76a}

/* ── Expandable detail row ── */
.ppm-detail-row{display:none}
.ppm-detail-row.open{display:table-row}
.ppm-detail-cell{padding:12px 18px !important;background:#f9fafb;border-bottom:1px solid #e4e7ec !important}
.ppm-detail-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;font-size:12px}
.ppm-detail-item{display:flex;flex-direction:column;gap:2px}
.ppm-detail-label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:0.4px;color:#667085}
.ppm-detail-value{color:#344054;word-break:break-all}
.ppm-expand-btn{display:inline-block;width:20px;height:20px;text-align:center;line-height:20px;font-size:11px;border-radius:4px;cursor:pointer;color:#667085;background:#f0f2f5;transition:all .15s;user-select:none;flex-shrink:0}
.ppm-expand-btn:hover{background:#e8f4fd;color:#0070ba}
.ppm-expand-btn.open{background:#0070ba;color:#fff;transform:rotate(90deg)}

/* ── Loading overlay ── */
.ppm-overlay{display:none;position:fixed;inset:0;background:rgba(255,255,255,0.85);z-index:9999;align-items:center;justify-content:center;flex-direction:column;gap:16px}
.ppm-overlay.active{display:flex}
.ppm-spinner{width:48px;height:48px;border:4px solid #e4e7ec;border-top-color:#0070ba;border-radius:50%;animation:ppm-spin .8s linear infinite}
@keyframes ppm-spin{to{transform:rotate(360deg)}}
.ppm-overlay-text{font-size:14px;font-weight:600;color:#344054}

/* ── Utility ── */
.ppm-muted{color:#98a2b3}
.ppm-text-right{text-align:right}