:root { --sidebar-w: 250px; --brand: #1f4e79; }
body { background: #f4f6f9; font-size: .925rem; }
.app { display: flex; min-height: 100vh; }
.sidebar { width: var(--sidebar-w); background: #14213d; color: #cfd8e3; flex-shrink: 0; }
@media (min-width: 992px) { .sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; } }
.sidebar.offcanvas-lg { --bs-offcanvas-width: var(--sidebar-w); --bs-offcanvas-bg: #14213d; }
.sidebar-brand { display: flex; align-items: center; gap: .6rem; padding: 1rem 1.1rem; font-weight: 600; color: #fff;
  font-size: 1.05rem; border-bottom: 1px solid rgba(255,255,255,.08); }
.sidebar-brand .bi { color: #f4b400; font-size: 1.3rem; }
.sidebar-scroll { overflow-y: auto; padding: .5rem 0 1.5rem; flex: 1; width: 100%; }
.sidebar .nav-link { display: flex; align-items: center; gap: .65rem; color: #cfd8e3; padding: .45rem 1.1rem; border-left: 3px solid transparent; }
.sidebar .nav-link:hover { color: #fff; background: rgba(255,255,255,.05); }
.sidebar .nav-link.active { color: #fff; background: rgba(255,255,255,.08); border-left-color: #f4b400; }
.nav-section { text-transform: uppercase; font-size: .7rem; letter-spacing: .08em; color: #7f8ea3; padding: 1rem 1.1rem .3rem; }
.main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.topbar { position: sticky; top: 0; z-index: 1020; display: flex; align-items: center; gap: .75rem; background: #fff;
  border-bottom: 1px solid #e3e7ed; padding: .6rem 1rem; }
.content { padding: 1.25rem; }
@media (max-width: 575px) { .content { padding: .75rem; } }
.card { border: 1px solid #e3e7ed; box-shadow: 0 1px 2px rgba(16,24,40,.04); }
.card-header { background: #fff; font-weight: 600; }
.stat-card .label { color: #6b7785; font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; }
.stat-card .value { font-size: 1.45rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.stat-card .icon { width: 42px; height: 42px; border-radius: 10px; display: grid; place-items: center; font-size: 1.25rem; }
.table { font-variant-numeric: tabular-nums; }
.table thead th { background: #f1f4f8; font-weight: 600; font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; color: #495566; white-space: nowrap; }
.num { text-align: right; white-space: nowrap; }
tr.row-section td { font-weight: 600; background: #f8fafc; }
tr.row-subtotal td { font-weight: 600; border-top: 1px solid #adb5bd; }
tr.row-total td { font-weight: 700; border-top: 2px solid #495057; border-bottom: 3px double #495057; background: #f8fafc; }
tr.row-muted td { color: #6c757d; }
.page-actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.page-actions h1 { font-size: 1.35rem; margin: 0; }
.lines-table input, .lines-table select { min-width: 80px; }
.lines-table td { vertical-align: top; }
.lines-table .product-col { min-width: 220px; }
.doc-meta dt { color: #6b7785; font-weight: 500; font-size: .8rem; }
.doc-meta dd { margin-bottom: .5rem; }
.login-wrap { min-height: 100vh; display: grid; place-items: center; background: linear-gradient(135deg,#14213d,#1f4e79); padding: 1rem; }
.login-card { width: 100%; max-width: 400px; }
.table-responsive { -webkit-overflow-scrolling: touch; }
@media print { .sidebar, .topbar, .no-print, .alert { display: none !important; } .content { padding: 0; } body { background: #fff; } }
/* Bootstrap makes .offcanvas-lg transparent on desktop; keep the dark sidebar. */
@media (min-width: 992px) { .sidebar.offcanvas-lg { background-color: #14213d !important; } }
.bar { border-radius: 3px 3px 0 0; min-height: 0; }
.bar-rev { background: var(--bs-primary); }
.bar-cost { background: #f1aeb5; }
.stat-card .min-w-0 { min-width: 0; }
@media (max-width: 575px) {
  .stat-card .value { font-size: 1.2rem; }
  .page-actions h1 small { display: block; }
  .page-actions .btn { padding: .3rem .6rem; font-size: .85rem; }
}