:root{
  --primary:#1e3a8a;
  --primary-light:#3b5bdb;
  --bg:#f4f6fb;
  --card:#ffffff;
  --border:#e2e6f0;
  --text:#1f2333;
  --muted:#6b7280;
  --danger:#dc2626;
  --success:#16a34a;
  --warning:#d97706;
}
*{box-sizing:border-box;}
body{
  margin:0;
  font-family:'Segoe UI',Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
}
a{color:var(--primary-light);text-decoration:none;}
a:hover{text-decoration:underline;}

/* Layout */
.app{display:flex;min-height:100vh;}
.sidebar{
  width:230px;
  background:#ffffff;
  border-right:1px solid var(--border);
  padding:18px 0;
  flex-shrink:0;
}
.sidebar .brand{
  display:flex;align-items:center;gap:10px;
  padding:0 18px 18px 18px;border-bottom:1px solid var(--border);margin-bottom:10px;
}
.sidebar .brand img{width:36px;height:36px;border-radius:6px;object-fit:cover;}
.sidebar .brand strong{font-size:15px;color:var(--primary);}
.sidebar nav a{
  display:block;padding:10px 18px;color:var(--text);font-size:14px;border-left:3px solid transparent;
}
.sidebar nav a:hover{background:#eef1fb;text-decoration:none;}
.sidebar nav a.active{border-left-color:var(--primary);background:#eef1fb;color:var(--primary);font-weight:600;}
.sidebar nav .section-label{
  font-size:11px;text-transform:uppercase;color:var(--muted);padding:14px 18px 4px;letter-spacing:.05em;
}

.main{flex:1;min-width:0;}
.topbar{
  display:flex;justify-content:space-between;align-items:center;
  background:#fff;border-bottom:1px solid var(--border);padding:12px 24px;
}
.topbar .user{font-size:14px;color:var(--muted);}
.content{padding:24px;}

h1,h2,h3{color:var(--primary);margin-top:0;}
.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;flex-wrap:wrap;gap:10px;}

.card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;margin-bottom:20px;}

.btn{
  display:inline-block;padding:9px 16px;border-radius:7px;border:1px solid var(--primary);
  background:var(--primary);color:#fff;cursor:pointer;font-size:14px;text-decoration:none;
}
.btn:hover{background:var(--primary-light);text-decoration:none;}
.btn-outline{background:#fff;color:var(--primary);}
.btn-outline:hover{background:#eef1fb;}
.btn-danger{background:var(--danger);border-color:var(--danger);}
.btn-danger:hover{background:#b91c1c;}
.btn-sm{padding:5px 10px;font-size:12px;}
.btn-wa{background:#25D366;border-color:#25D366;}
.btn-wa:hover{background:#1ebe57;}

table{width:100%;border-collapse:collapse;background:#fff;}
.card{overflow-x:auto;}
table th, table td{padding:10px 12px;border-bottom:1px solid var(--border);text-align:left;font-size:14px;}
table th{background:#f7f8fc;color:var(--primary);font-weight:600;}
table tr:hover td{background:#fafbff;}

.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.form-group{margin-bottom:12px;}
.form-group label{display:block;font-size:13px;font-weight:600;color:var(--text);margin-bottom:5px;}
.form-group input, .form-group select, .form-group textarea{
  width:100%;padding:9px 11px;border:1px solid var(--border);border-radius:6px;font-size:14px;background:#fff;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus{outline:2px solid var(--primary-light);border-color:var(--primary-light);}

.badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:12px;font-weight:600;}
.badge-open{background:#fef3c7;color:#92400e;}
.badge-in_progress{background:#dbeafe;color:#1e40af;}
.badge-completed{background:#dcfce7;color:#166534;}
.badge-invoiced{background:#e0e7ff;color:#3730a3;}
.badge-paid{background:#dcfce7;color:#166534;}
.badge-unpaid{background:#fee2e2;color:#991b1b;}
.badge-partial{background:#fef3c7;color:#92400e;}
.badge-pending{background:#fef3c7;color:#92400e;}
.badge-confirmed{background:#dbeafe;color:#1e40af;}
.badge-cancelled{background:#fee2e2;color:#991b1b;}
.badge-done{background:#dcfce7;color:#166534;}
.badge-sent{background:#dbeafe;color:#1e40af;}
.badge-draft{background:#f1f5f9;color:#475569;}
.badge-accepted{background:#dcfce7;color:#166534;}
.badge-declined{background:#fee2e2;color:#991b1b;}
.badge-ordered{background:#dbeafe;color:#1e40af;}
.badge-received{background:#dcfce7;color:#166534;}

.alert{padding:12px 16px;border-radius:8px;margin-bottom:16px;font-size:14px;}
.alert-success{background:#dcfce7;color:#166534;border:1px solid #86efac;}
.alert-danger{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5;}

.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:24px;}
.stat-card{background:#fff;border:1px solid var(--border);border-radius:10px;padding:18px;}
.stat-card .num{font-size:26px;font-weight:700;color:var(--primary);}
.stat-card .label{font-size:13px;color:var(--muted);}

.items-table input{padding:6px 8px;font-size:13px;}
.items-table td{padding:6px;}
.text-right{text-align:right;}
.text-muted{color:var(--muted);font-size:13px;}
.mt-0{margin-top:0;}

/* Print job card / invoice / estimate */
.print-sheet{background:#fff;max-width:850px;margin:0 auto;padding:30px;border:1px solid var(--border);}
.print-header{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:2px solid var(--primary);padding-bottom:14px;margin-bottom:14px;}
.print-header .logo-block{display:flex;gap:12px;align-items:center;}
.print-header .logo-block img{width:70px;height:70px;object-fit:cover;border-radius:8px;}
.print-header .contact-box{background:#1f2333;color:#fff;padding:8px 12px;border-radius:6px;font-size:13px;margin-top:6px;}
.print-meta{display:grid;grid-template-columns:1fr 1fr;gap:6px 24px;font-size:14px;margin-bottom:16px;}
.print-meta div{border-bottom:1px dotted #ccc;padding:3px 0;}
.print-table{width:100%;border-collapse:collapse;margin-bottom:16px;}
.print-table th{background:#1f2333;color:#fff;padding:8px;font-size:13px;}
.print-table td{padding:8px;border-bottom:1px solid #ddd;font-size:13px;}
.print-totals{margin-left:auto;width:280px;}
.print-totals div{display:flex;justify-content:space-between;padding:4px 0;font-size:14px;}
.print-totals .grand{font-weight:700;font-size:16px;border-top:2px solid var(--primary);padding-top:8px;}
.sign-row{display:flex;justify-content:space-between;margin-top:40px;font-size:14px;}
.sign-row .line{border-top:1px solid #333;width:220px;padding-top:4px;text-align:center;}

@media print{
  .no-print{display:none !important;}
  .app{display:block;}
  .content{padding:0;}
  body{background:#fff;}
}
.menu-btn{
  display:none;
  background:none;border:1px solid var(--border);border-radius:6px;
  font-size:18px;padding:4px 10px;cursor:pointer;color:var(--primary);
}
.sidebar-overlay{
  display:none;
  position:fixed;inset:0;background:rgba(15,20,35,.45);z-index:40;
}
.sidebar-overlay.open{display:block;}

@media (max-width:800px){
  .app{flex-direction:column;}
  .menu-btn{display:inline-block;}
  .sidebar{
    position:fixed;top:0;left:0;bottom:0;width:250px;z-index:50;
    transform:translateX(-100%);transition:transform .2s ease;
    box-shadow:2px 0 12px rgba(0,0,0,.15);
    overflow-y:auto;
  }
  .sidebar.open{transform:translateX(0);}
  .form-grid{grid-template-columns:1fr;}
  .print-sheet{padding:14px;}
  .print-header{flex-direction:column;gap:10px;}
  table{font-size:13px;}
  .content{padding:14px;}
}
