:root {
  --occott-primary: #1d4ed8;
  --occott-dark: #0f172a;
}
body { background: #f4f6fb; font-family: 'Segoe UI', Arial, sans-serif; }

.sidebar {
  width: 250px; min-height: 100vh; background: var(--occott-dark); color: #fff; position: sticky; top: 0;
}
.sidebar .brand { color: #fff; font-weight: 700; font-size: 1.2rem; text-decoration: none; }
.sidebar .brand span { color: #60a5fa; }
.sidebar .nav-link { color: #cbd5e1; padding: .55rem .75rem; border-radius: .4rem; margin-bottom: 2px; }
.sidebar .nav-link:hover, .sidebar .nav-link.active { background: rgba(255,255,255,.08); color: #fff; }
.sidebar .nav-link i { width: 20px; margin-right: 6px; }

.main-content { min-height: 100vh; }
.topbar { background: #fff; border-bottom: 1px solid #e5e7eb; }

.stat-card { background: #fff; border-radius: .6rem; padding: 1.1rem 1.3rem; box-shadow: 0 1px 3px rgba(0,0,0,.06); border: 1px solid #eef0f4;}
.stat-card .label { color: #64748b; font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; }
.stat-card .value { font-size: 1.7rem; font-weight: 700; color: #0f172a; }

.card-panel { background: #fff; border-radius: .6rem; padding: 1.3rem; box-shadow: 0 1px 3px rgba(0,0,0,.06); border: 1px solid #eef0f4; }

.badge-status { padding: .35em .7em; border-radius: 20px; font-size: .75rem; font-weight: 600; }
.status-new, .status-draft, .status-booked, .status-submitted { background:#e2e8f0; color:#334155; }
.status-active, .status-paid, .status-completed, .status-delivered, .status-converted, .status-approved { background:#dcfce7; color:#166534; }
.status-pending, .status-in_progress, .status-verify_pending, .status-partially_paid { background:#fef3c7; color:#92400e; }
.status-rejected, .status-cancelled, .status-lost, .status-inactive { background:#fee2e2; color:#991b1b; }

table.table thead th { font-size: .78rem; text-transform: uppercase; color:#64748b; border-bottom-width: 1px; }

.login-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; background: linear-gradient(135deg,#0f172a,#1d4ed8);}
.login-card { background:#fff; border-radius: .8rem; padding: 2.5rem; width: 100%; max-width: 400px; box-shadow: 0 10px 40px rgba(0,0,0,.25);}