:root { --primary:#2563EB; --bg:#f8fafc; --card:#fff; --text:#1e293b; --border:#e2e8f0; }
*{box-sizing:border-box;margin:0;padding:0;font-family:system-ui,-apple-system,sans-serif;}
body{background:var(--bg);color:var(--text);line-height:1.5;}
.container{max-width:1200px;margin:0 auto;padding:20px;}
header{background:var(--primary);color:#fff;padding:16px 20px;border-radius:8px;margin-bottom:20px;display:flex;justify-content:space-between;align-items:center;}
header h1{font-size:1.25rem;}
.btn{background:var(--primary);color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:0.9rem;}
.btn:hover{opacity:0.9;}
.btn.secondary{background:#64748b;}
.btn.danger{background:#dc2626;}
.card{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:20px;margin-bottom:16px;box-shadow:0 1px 3px rgba(0,0,0,0.05);}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;}
label{display:block;font-size:0.85rem;font-weight:600;margin-bottom:4px;color:#475569;}
input,select,textarea{width:100%;padding:8px 12px;border:1px solid var(--border);border-radius:6px;font-size:0.9rem;margin-bottom:12px;}
textarea{min-height:80px;resize:vertical;}
table{width:100%;border-collapse:collapse;font-size:0.9rem;}
th,td{text-align:left;padding:10px;border-bottom:1px solid var(--border);}
th{color:#64748b;font-size:0.8rem;text-transform:uppercase;}
.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:0.75rem;font-weight:600;}
.badge.draft{background:#e2e8f0;color:#475569;}
.badge.sent{background:#dbeafe;color:#1d4ed8;}
.badge.partial{background:#fef3c7;color:#92400e;}
.badge.paid{background:#d1fae5;color:#065f46;}
.hidden{display:none !important;}
.tabs{display:flex;gap:4px;margin-bottom:16px;border-bottom:2px solid var(--border);}
.tab{padding:10px 16px;cursor:pointer;border-bottom:2px solid transparent;color:#64748b;font-size:0.9rem;}
.tab.active{border-color:var(--primary);color:var(--primary);font-weight:600;}
.error{color:#dc2626;font-size:0.85rem;margin-top:-8px;margin-bottom:12px;}
.success{color:#059669;font-size:0.85rem;margin-top:-8px;margin-bottom:12px;}
.row{display:flex;gap:12px;}
.row > *{flex:1;}
.line-item-row{display:flex;gap:8px;align-items:flex-end;margin-bottom:8px;}
.line-item-row input{flex:2;}
.line-item-row input.qty{flex:0.5;}
.line-item-row input.price{flex:1;}
.line-item-row .btn.danger{flex:0;padding:8px 10px;}
#aiResponse{background:#f1f5f9;padding:12px;border-radius:6px;white-space:pre-wrap;font-size:0.85rem;max-height:300px;overflow:auto;}
.loading{opacity:0.6;pointer-events:none;}
.total-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--border);font-size:0.9rem;}
.total-row.grand{font-size:1.1rem;font-weight:700;border-top:2px solid var(--primary);border-bottom:none;padding-top:12px;margin-top:8px;}