:root{
    --sidebar-width: 270px;
    --app-bg: #f5f7fb;
    --card-bg: #ffffff;
    --text: #1f2937;
    --muted: #6b7280;
    --border: #e5e7eb;
    --brand: #2563eb;
    --brand-soft: #eaf1ff;
    --success-soft: #e8f8ef;
    --warning-soft: #fff7e6;
    --danger-soft: #ffecec;
}
*{box-sizing:border-box}
body{background:var(--app-bg); color:var(--text); font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;}
a{text-decoration:none}
.auth-page{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px; background:linear-gradient(135deg,#eef4ff,#f9fafb 45%,#fff7ed)}
.auth-card{width:100%; max-width:430px; background:white; border:1px solid var(--border); border-radius:24px; box-shadow:0 18px 50px rgba(15,23,42,.08); padding:30px;}
.brand-mark{width:64px; height:64px; border-radius:20px; background:var(--brand-soft); display:flex; align-items:center; justify-content:center; font-size:30px; color:var(--brand); overflow:hidden;}
.brand-mark img{width:100%; height:100%; object-fit:cover;}
.app-shell{display:flex; min-height:100vh;}
.sidebar{width:var(--sidebar-width); background:#0f172a; color:#e5e7eb; position:fixed; inset:0 auto 0 0; padding:18px 14px; overflow-y:auto; z-index:1030;}
.sidebar-brand{display:flex; align-items:center; gap:12px; padding:10px 12px 20px; color:white;}
.sidebar-logo{width:46px; height:46px; border-radius:14px; background:rgba(255,255,255,.1); display:flex; align-items:center; justify-content:center; overflow:hidden;}
.sidebar-logo img{width:100%;height:100%;object-fit:cover;}
.sidebar small{color:#94a3b8;}
.sidebar .nav-link{color:#cbd5e1; border-radius:12px; padding:10px 12px; margin:2px 0; display:flex; align-items:center; gap:10px;}
.sidebar .nav-link:hover,.sidebar .nav-link.active{background:rgba(37,99,235,.22); color:#fff;}
.sidebar-section{font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:#64748b; margin:18px 12px 6px;}
.main{margin-left:var(--sidebar-width); width:calc(100% - var(--sidebar-width)); min-height:100vh;}
.topbar{height:70px; background:white; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; padding:0 24px; position:sticky; top:0; z-index:1020;}
.content{padding:24px;}
.page-hero{background:linear-gradient(135deg,#fff,#f8fbff); border:1px solid var(--border); border-radius:22px; padding:22px; display:flex; justify-content:space-between; gap:16px; align-items:center; margin-bottom:20px;}
.page-hero h1{font-size:26px; margin:0 0 4px; font-weight:800;}
.page-hero p{margin:0; color:var(--muted);}
.app-card{background:var(--card-bg); border:1px solid var(--border); border-radius:18px; box-shadow:0 10px 30px rgba(15,23,42,.04);}
.app-card .card-header{background:transparent; border-bottom:1px solid var(--border); padding:16px 18px; font-weight:700;}
.app-card .card-body{padding:18px;}
.stat-card{background:white; border:1px solid var(--border); border-radius:18px; padding:18px; height:100%;}
.stat-icon{width:44px; height:44px; border-radius:14px; display:flex; align-items:center; justify-content:center; background:var(--brand-soft); color:var(--brand); font-size:22px;}
.stat-value{font-size:28px; font-weight:800; line-height:1; margin-top:14px;}
.stat-label{font-size:13px; color:var(--muted); margin-top:6px;}
.table>thead th{font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:#64748b; border-bottom:1px solid var(--border);}
.table td{vertical-align:middle;}
.badge-soft{background:var(--brand-soft); color:var(--brand);}
.scan-input{font-size:24px; padding:14px 18px; border-radius:16px;}
.cart-line{border:1px solid var(--border); border-radius:14px; padding:12px; margin-bottom:10px; background:#fff;}
.receipt-paper{background:white; color:#111; max-width:380px; margin:auto; padding:18px; font-family:"Courier New",monospace;}
.receipt-a4{background:white; color:#111; max-width:820px; margin:auto; padding:38px; border:1px solid #ddd;}
.print-actions{position:sticky; top:74px; z-index:1000; background:#f5f7fb; padding:10px;}
.mobile-menu-btn{display:none;}
.sidebar-backdrop{display:none; position:fixed; inset:0; background:rgba(15,23,42,.45); z-index:1025;}
.img-thumb{width:52px; height:52px; object-fit:cover; border-radius:12px; border:1px solid var(--border); background:#f8fafc;}
@media (max-width: 991px){
    .sidebar{transform:translateX(-100%); transition:.2s ease;}
    .sidebar.show{transform:translateX(0);}
    .sidebar-backdrop.show{display:block;}
    .main{margin-left:0; width:100%;}
    .mobile-menu-btn{display:inline-flex;}
    .topbar{padding:0 14px;}
    .content{padding:16px;}
    .page-hero{flex-direction:column; align-items:flex-start;}
}
@media print{
    body{background:white!important;}
    .sidebar,.topbar,.print-actions,.no-print{display:none!important;}
    .main{margin:0!important; width:100%!important;}
    .content{padding:0!important;}
    .receipt-paper,.receipt-a4{box-shadow:none; border:0; max-width:none;}
}