:root {
  --coffee: #5b3a29;
  --coffee-dark: #3e2619;
  --coffee-soft: #f4ece6;
  --bs-primary: #6f4630;
  --bs-primary-rgb: 111, 70, 48;
  --bs-link-color: #6f4630;
  --bs-link-color-rgb: 111, 70, 48;
  --bs-link-hover-color: #3e2619;
}
body { background: #f6f3f0; font-size: .925rem; }
.btn-primary { --bs-btn-bg: #6f4630; --bs-btn-border-color: #6f4630; --bs-btn-hover-bg: #5b3a29; --bs-btn-hover-border-color: #5b3a29; --bs-btn-active-bg: #3e2619; --bs-btn-active-border-color: #3e2619; --bs-btn-disabled-bg: #8a6a58; --bs-btn-disabled-border-color: #8a6a58; }
.btn-outline-primary { --bs-btn-color: #6f4630; --bs-btn-border-color: #6f4630; --bs-btn-hover-bg: #6f4630; --bs-btn-hover-border-color: #6f4630; --bs-btn-active-bg: #5b3a29; }
.form-control:focus, .form-select:focus { border-color: #b08a72; box-shadow: 0 0 0 .2rem rgba(111,70,48,.18); background: #fffbe6; }
.topbar { background: var(--coffee-dark); position: sticky; top: 0; z-index: 1030; }
.sidemenu { width: 230px; min-height: calc(100vh - 56px); background: #fff; border-right: 1px solid #e6dcd5; }
@media (min-width: 992px) { .sidemenu { position: sticky; top: 56px; height: calc(100vh - 56px); overflow-y: auto; flex-shrink: 0; } }
.menu-group { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: #9a8478; padding: .9rem 1rem .3rem; font-weight: 600; }
.menu-link { display: flex; align-items: center; gap: .6rem; padding: .38rem 1rem; color: #3b2f2a; text-decoration: none; border-left: 3px solid transparent; }
.menu-link:hover { background: var(--coffee-soft); color: var(--coffee-dark); }
.menu-link.active { background: var(--coffee-soft); border-left-color: var(--coffee); color: var(--coffee-dark); font-weight: 600; }
.main { min-width: 0; }
.card { border: 1px solid #e6dcd5; border-radius: .6rem; }
.stat-card .label { font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; color: #8a776d; }
.stat-card .value { font-size: 1.35rem; font-weight: 700; color: #2d211b; font-variant-numeric: tabular-nums; }
.stat-card .icon { font-size: 1.6rem; color: var(--coffee); opacity: .75; }
.num, .table td.text-end { font-variant-numeric: tabular-nums; }
.report-table { background: #fff; border-radius: .5rem; }
.report-table thead th { position: sticky; top: 0; white-space: nowrap; font-size: .8rem; }
.table-sm td, .table-sm th { padding: .3rem .45rem; }
.lines-table input, .lines-table select { min-width: 70px; }
.lines-table .w-product { min-width: 200px; }
.lines-table td.calc { background: #faf7f5; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.totals-box { background: #fff; border: 1px solid #e6dcd5; border-radius: .5rem; }
.totals-box .grand { font-size: 1.3rem; font-weight: 700; color: var(--coffee-dark); }
.badge-type { font-size: .7rem; }

/* PIN login */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #3e2619 0%, #6f4630 60%, #a77b5d 100%); padding: 16px; }
.login-card { width: 100%; max-width: 380px; border: 0; border-radius: 1rem; box-shadow: 0 20px 50px rgba(0,0,0,.35); }
.pin-dots { display: flex; justify-content: center; gap: 14px; margin: 14px 0 18px; }
.pin-dots span { width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--coffee); }
.pin-dots span.filled { background: var(--coffee); }
.pin-pad { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.pin-pad button { height: 58px; font-size: 1.4rem; font-weight: 600; border-radius: .75rem; }
.user-pick .btn-check:checked + .btn { background: var(--coffee); color: #fff; border-color: var(--coffee); }

/* Printing */
@media print {
  body { background: #fff; font-size: 11px; }
  .main { padding: 0 !important; }
  .card { border: 0; }
  .report-table thead th { position: static; }
  a { color: #000; text-decoration: none; }
  .page-head { display: none !important; }
}
.invoice { background: #fff; max-width: 210mm; margin: 0 auto; padding: 10mm; font-size: 12px; }
.invoice table { width: 100%; border-collapse: collapse; }
.invoice th, .invoice td { border: 1px solid #333; padding: 3px 5px; }
.invoice .no-border td { border: 0; }
@media print { .invoice { padding: 0; max-width: none; } }