/* assets/style.css */
:root { --primary:#0b5ed7; --bg:#f7f9fc; --text:#111; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial; background: var(--bg); color: var(--text); }
.container { max-width: 960px; margin: 40px auto; padding: 24px; background: #fff; border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,0.06); }
h1,h2 { margin: 0 0 12px; }
label { display:block; margin: 8px 0 6px; font-weight: 600; }
input[type="text"], input[type="number"] { width:100%; padding:10px 12px; border:1px solid #ddd; border-radius: 8px; }
.btn { display:inline-block; background: var(--primary); color:#fff; padding:10px 16px; border-radius: 8px; text-decoration:none; border:0; cursor:pointer; }
.btn.secondary { background:#555; }
.row { display:flex; gap:20px; flex-wrap: wrap; }
.card { flex:1; min-width: 280px; padding:16px; border:1px solid #eee; border-radius: 10px; }
.table { width:100%; border-collapse: collapse; margin-top: 12px; }
.table th, .table td { padding:10px; border-bottom:1px solid #eee; text-align:left; font-size: 14px; }
.badge { display:inline-block; padding:4px 8px; border-radius:6px; font-size:12px; background:#eee; }
.badge.paid { background:#d1f7d6; }
.badge.pending { background:#fff3cd; }
.badge.failed { background:#ffd7d7; }
.footer { margin-top:16px; font-size:12px; color:#666; }
.code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; background:#f4f6fa; padding:6px 8px; border-radius:6px; }