:root { --brand: #0b4f6c; --brand-2: #01baef; }
body { background: #f5f7fa; }
.bg-brand { background: var(--brand) !important; }
.text-brand { color: var(--brand) !important; }
.btn-brand { background: var(--brand); color: #fff; border-color: var(--brand); }
.btn-brand:hover { background: #083a50; color: #fff; }
.card { border: 0; box-shadow: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04); }
.hero { background: linear-gradient(135deg, var(--brand), #127a9f); color: #fff; border-radius: .75rem; }
.stat .value { font-size: 1.6rem; font-weight: 600; }
.stat .label { font-size: .8rem; color: #6c757d; text-transform: uppercase; letter-spacing: .03em; }
.timeline { list-style: none; padding-left: 0; }
.timeline li { border-left: 2px solid #dee2e6; padding: 0 0 .9rem 1rem; position: relative; }
.timeline li::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--brand); position: absolute; left: -6px; top: 5px; }
.steps { display: flex; flex-wrap: wrap; gap: .25rem; }
.steps .step { flex: 1 1 90px; text-align: center; font-size: .75rem; padding: .4rem .25rem; border-radius: .35rem; background: #e9ecef; color: #6c757d; }
.steps .step.done { background: #d1e7dd; color: #0f5132; }
.steps .step.current { background: var(--brand); color: #fff; font-weight: 600; }
.sidebar { min-height: 100vh; background: #0f2633 !important; }
.sidebar .offcanvas-body, .sidebar.offcanvas-md { --bs-offcanvas-bg: #0f2633; }
.sidebar .nav-link { color: #cfd8dc; padding: .45rem .9rem; border-radius: .35rem; font-size: .92rem; }
.sidebar .nav-link:hover, .sidebar .nav-link.active { background: rgba(255,255,255,.1); color: #fff; }
.sidebar .nav-section { color: #78909c; font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; padding: .8rem .9rem .2rem; }
.table td, .table th { vertical-align: middle; }
.table-sm td { font-size: .9rem; }
.overdue { color: #b02a37; font-weight: 600; }
@media print {
  .no-print, .sidebar, nav, footer, .btn { display: none !important; }
  body { background: #fff; }
  .card { box-shadow: none; border: 1px solid #ccc; }
  main, .col-md-9, .col-lg-10 { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; }
}
