:root{--primary:#4CAF50;--secondary:#2196F3;--success:#4CAF50;--warning:#FF9800;--danger:#f44336;--info:#00BCD4;--dark:#333;--light:#f5f5f5;--border:#ddd}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:var(--light);color:var(--dark);line-height:1.6}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--primary) 0%,var(--secondary) 100%);padding:20px}.login-box{background:white;padding:40px;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,0.3);max-width:450px;width:100%}.logo-section{text-align:center;margin-bottom:30px}.logo-section h1{font-size:36px;color:var(--primary);margin-bottom:8px}.tagline{color:#666;font-size:14px}.tabs{display:flex;gap:10px;margin-bottom:30px}.tab-btn{flex:1;padding:12px;border:2px solid var(--border);background:white;border-radius:8px;cursor:pointer;font-weight:600;transition:all .3s}.tab-btn.active{background:var(--primary);color:white;border-color:var(--primary)}.auth-form{display:none}.auth-form.active{display:block}.header{background:white;box-shadow:0 2px 8px rgba(0,0,0,0.1);padding:15px 30px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:100}.header-left{display:flex;align-items:center;gap:15px}.header-title{font-size:24px;color:var(--primary)}.header-subtitle{color:#666;font-size:14px}.header-nav{display:flex;gap:5px}.header-nav a{padding:10px 20px;border-radius:8px;text-decoration:none;color:var(--dark);font-weight:500;transition:all .3s}.header-nav a:hover{background:var(--light)}.header-nav a.active{background:var(--primary);color:white}.logout-btn{color:var(--danger)!important}.container{max-width:1400px;margin:0 auto;padding:30px 20px}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.section-title{margin:30px 0 20px 0}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-weight:500}.form-control,input,select,textarea{width:100%;padding:12px 15px;border:2px solid var(--border);border-radius:8px;font-size:15px;transition:border-color .3s}.form-control:focus,input:focus,select:focus{outline:none;border-color:var(--primary)}.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px}.btn{padding:12px 24px;border:none;border-radius:8px;cursor:pointer;font-size:15px;font-weight:600;transition:all .3s;text-decoration:none;display:inline-block}.btn-primary{background:var(--primary);color:white}.btn-primary:hover{background:#45a049;transform:translateY(-2px);box-shadow:0 4px 12px rgba(76,175,80,0.3)}.btn-success{background:var(--success);color:white}.btn-danger{background:var(--danger);color:white}.btn-sm{padding:6px 12px;font-size:13px}.btn-block{width:100%;display:block}.btn-lg{padding:16px 32px;font-size:18px}.card{background:white;padding:25px;border-radius:12px;box-shadow:0 4px 6px rgba(0,0,0,0.1)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:30px}.stat-card{background:white;padding:25px;border-radius:12px;box-shadow:0 4px 6px rgba(0,0,0,0.1);color:white;transition:transform .3s}.stat-card:hover{transform:translateY(-5px)}.stat-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.stat-header h3{font-size:14px;font-weight:500;opacity:.9}.stat-icon{font-size:24px}.stat-value{font-size:36px;font-weight:bold;margin-bottom:10px}.stat-footer{font-size:13px;opacity:.8}.stat-success{background:var(--success)}.stat-primary{background:var(--primary)}.stat-warning{background:var(--warning)}.stat-info{background:var(--info)}.quick-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:30px}.action-card{background:white;padding:30px;border-radius:12px;box-shadow:0 4px 6px rgba(0,0,0,0.1);text-align:center;text-decoration:none;color:var(--dark);transition:all .3s}.action-card:hover{transform:translateY(-5px);box-shadow:0 8px 16px rgba(0,0,0,0.15)}.action-icon{font-size:48px;margin-bottom:15px}.action-card h3{margin-bottom:8px}.action-card p{color:#666;font-size:14px}.table-container{background:white;border-radius:12px;box-shadow:0 4px 6px rgba(0,0,0,0.1);overflow:hidden}table{width:100%;border-collapse:collapse}thead{background:var(--light)}th,td{padding:15px;text-align:left}th{font-weight:600}tr:not(:last-child) td{border-bottom:1px solid var(--border)}tbody tr:hover{background:#fafafa}.pos-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:25px}.pos-left,.pos-right{display:flex;flex-direction:column;gap:20px}.products-list{max-height:400px;overflow-y:auto;margin-top:15px;border:2px solid var(--border);border-radius:8px;padding:10px}.product-item{display:flex;justify-content:space-between;align-items:center;padding:12px;border-bottom:1px solid var(--border);cursor:pointer;transition:background .3s}.product-item:hover{background:var(--light)}.product-item.selected{background:#e8f5e9}.product-name{font-weight:500;margin-bottom:4px}.product-info{font-size:13px;color:#666}.cart-item{display:flex;justify-content:space-between;align-items:center;padding:15px;border-bottom:1px solid var(--border)}.cart-item-name{font-weight:500;margin-bottom:4px}.cart-item-price{font-size:13px;color:#666}.cart-item-actions{display:flex;gap:10px;align-items:center}.cart-item-qty{font-weight:bold;min-width:30px;text-align:center}.total-card{background:var(--primary);color:white;padding:30px;border-radius:12px;text-align:center}.total-card h3{font-size:16px;margin-bottom:10px;opacity:.9}.total-amount{font-size:40px;font-weight:bold}.modal{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);z-index:1000;align-items:center;justify-content:center;backdrop-filter:blur(4px)}.modal-content{background:white;max-width:600px;width:90%;padding:30px;border-radius:12px;max-height:90vh;overflow-y:auto}.modal-footer{display:flex;gap:10px;margin-top:20px}.alert{padding:15px 20px;border-radius:8px;margin:15px 0}.alert-success{background:#e8f5e9;color:#2e7d32;border-left:4px solid #2e7d32}.alert-warning{background:#fff3e0;color:#e65100;border-left:4px solid #e65100}.badge{padding:4px 12px;border-radius:12px;font-size:12px;font-weight:600}.badge-success{background:#e8f5e9;color:#2e7d32}.badge-danger{background:#ffebee;color:#c62828}.text-center{text-align:center}.text-muted{color:#999}.mt-2{margin-top:20px}.footer-info{text-align:center;margin-top:30px;padding-top:20px;border-top:1px solid var(--border)}.footer-info p{color:#999;font-size:13px}@media (max-width:768px){.pos-grid{grid-template-columns:1fr}.header{flex-direction:column;gap:15px}.header-nav{width:100%;flex-wrap:wrap;justify-content:center}.page-header{flex-direction:column;gap:15px;align-items:flex-start}}