*{box-sizing:border-box}body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;background:#f1f5f9;color:#0f172a}button,input,select{font-family:inherit}.app{min-height:100vh;display:flex;background:#f1f5f9}.sidebar{width:280px;background:#020617;color:#fff;min-height:100vh;padding:22px;display:flex;flex-direction:column}.logo{font-size:22px;font-weight:700}.logo-subtitle{margin-top:6px;color:#94a3b8;font-size:14px}.menu{margin-top:36px;flex:1}.menu button{width:100%;border:0;background:transparent;color:#cbd5e1;display:flex;align-items:center;gap:12px;padding:13px 14px;border-radius:16px;cursor:pointer;font-size:15px;text-align:left}.menu button.active{background:#fff;color:#020617;font-weight:600}.cashbox{background:#0f172a;border-radius:18px;padding:16px;color:#cbd5e1;font-size:14px}.cashbox strong{color:#fff;display:block;margin-bottom:6px}.cashbox .ok{color:#86efac;margin-top:10px}.main{flex:1;padding:28px;overflow:auto}.header{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:24px}.header h1{margin:0;font-size:26px}.header p{margin:6px 0 0;color:#64748b}.header-actions{display:flex;gap:10px}select,.input-search{border:1px solid #cbd5e1;border-radius:16px;padding:11px 14px;background:#fff}.btn{border:0;background:#020617;color:#fff;border-radius:16px;padding:11px 16px;cursor:pointer;font-weight:600}.btn.secondary{background:#fff;color:#0f172a;border:1px solid #cbd5e1}.grid-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:18px}.card{background:#fff;border:1px solid #e2e8f0;border-radius:24px;padding:20px;box-shadow:0 8px 18px #0f172a0a}.metric-title{color:#64748b;font-size:14px}.metric-value{font-size:25px;font-weight:700;margin-top:8px}.metric-note{color:#64748b;font-size:14px;margin-top:7px}.sales-layout{display:grid;grid-template-columns:1fr 390px;gap:18px}.search-row{display:flex;gap:10px;margin-bottom:18px}.search-box{flex:1;display:flex;gap:10px;align-items:center;border:1px solid #cbd5e1;border-radius:18px;padding:0 14px}.search-box input{border:0;outline:none;width:100%;padding:13px 0;font-size:14px}.product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.product-card{text-align:left;background:#fff;border:1px solid #e2e8f0;border-radius:20px;padding:16px;cursor:pointer}.product-card:hover{border-color:#64748b}.product-name{font-weight:700}.product-meta{color:#64748b;font-size:13px;margin-top:5px}.product-price{font-weight:700;margin-top:10px}.cart-title{display:flex;align-items:center;justify-content:space-between}.cart-title h2{margin:0}.cart-title p{color:#64748b;margin:5px 0 0;font-size:14px}.cart-items{margin-top:18px;display:grid;gap:12px}.cart-item{border:1px solid #e2e8f0;border-radius:18px;padding:14px}.cart-item-top{display:flex;justify-content:space-between;gap:10px}.cart-item-name{font-weight:700}.cart-item-meta{color:#64748b;font-size:13px;margin-top:4px}.cart-item-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:12px}.qty{display:flex;align-items:center;gap:8px}.qty button{width:26px;height:26px;border:1px solid #cbd5e1;background:#fff;border-radius:9px;cursor:pointer}.remove{border:0;background:transparent;color:#94a3b8;cursor:pointer}.totals{border-top:1px solid #e2e8f0;margin-top:18px;padding-top:18px;display:grid;gap:8px}.total-row{display:flex;justify-content:space-between;color:#475569}.total-final{font-size:20px;font-weight:800;color:#0f172a}.payment-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:18px}.payment-grid button{height:48px}.table-wrapper{overflow:hidden;border:1px solid #e2e8f0;border-radius:18px}table{width:100%;border-collapse:collapse;font-size:14px}thead{background:#f8fafc;color:#64748b}th,td{padding:13px;border-bottom:1px solid #e2e8f0}th{text-align:left;font-weight:600}td.right,th.right{text-align:right}.badge{display:inline-flex;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:700}.badge.ok{background:#dcfce7;color:#166534}.badge.warn{background:#fef3c7;color:#92400e}.branch-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.branch-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:18px}.stat{background:#f8fafc;border-radius:16px;padding:14px}.stat span{color:#64748b;font-size:13px}.stat strong{display:block;margin-top:6px}@media (max-width: 1100px){.sales-layout,.branch-grid,.grid-metrics,.product-grid{grid-template-columns:1fr}.sidebar{width:230px}}