:root{--primary:#1976d2;--primary-dark:#1565c0;--primary-light:#bbdefb;--accent:#ff6f00;--text:#333;--text-light:#666;--bg:#fafafa;--white:#fff;--border:#e0e0e0;--success:#4caf50;--danger:#f44336;--warning:orange;--shadow:0 2px 8px #0000001a;color:var(--text);background:var(--bg);font-family:Segoe UI,system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.5}*{box-sizing:border-box;margin:0;padding:0}html{width:100%;overflow-x:hidden}body{width:100%;min-height:100vh;overflow-x:hidden}img{max-width:100%;height:auto}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}.page-container{max-width:1200px;margin:0 auto;padding:1.5rem}.loading-screen{min-height:50vh;color:var(--text-light);justify-content:center;align-items:center;font-size:1.1rem;display:flex}.error-message{color:var(--danger);background:#ffebee;border-radius:6px;margin-bottom:1rem;padding:.75rem 1rem;font-size:.9rem}.success-message{color:var(--success);background:#e8f5e9;border-radius:6px;margin-bottom:1rem;padding:.75rem 1rem;font-size:.9rem}.btn{border:1px solid var(--border);cursor:pointer;background:var(--white);color:var(--text);border-radius:8px;justify-content:center;align-items:center;gap:.4rem;padding:.55rem 1.2rem;font-size:.9rem;font-weight:600;line-height:1.4;transition:background .15s,opacity .15s;display:inline-flex}.btn:hover{background:#f5f5f5}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--primary);color:var(--white);border-color:var(--primary)}.btn-primary:hover{background:var(--primary-dark)}.btn-danger{background:var(--danger);color:var(--white);border-color:var(--danger)}.btn-danger:hover{background:#d32f2f}.btn-outline{border:1px solid var(--primary);color:var(--primary);background:0 0}.btn-outline:hover{background:#e3f2fd}.btn-link{color:var(--primary);background:0 0;border:none;padding:.3rem .5rem;font-weight:500}.btn-link:hover{text-decoration:underline}.btn-sm{padding:.35rem .75rem;font-size:.82rem}.btn-block{width:100%}.btn-icon{border-radius:8px;width:38px;height:38px;padding:0}.form-input,.form-select,.form-textarea{border:1px solid var(--border);background:var(--white);width:100%;color:var(--text);border-radius:8px;padding:.6rem .75rem;font-family:inherit;font-size:.9rem;transition:border-color .15s}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 2px #1976d226}.form-input:disabled,.form-select:disabled{color:#999;background:#f5f5f5}.form-textarea{resize:vertical;min-height:80px}.form-label{color:#555;margin-bottom:4px;font-size:.82rem;font-weight:600;display:block}.form-group{flex-direction:column;gap:.25rem;display:flex}.card{background:var(--white);border:1px solid var(--border);border-radius:10px;overflow:hidden;box-shadow:0 1px 3px #0000000f}.card-body{padding:1.25rem}.table-responsive{-webkit-overflow-scrolling:touch;border:1px solid var(--border);border-radius:8px;width:100%;overflow-x:auto}.data-table{border-collapse:collapse;background:var(--white);width:100%}.table-responsive .data-table{border:none;border-radius:0}.data-table th{text-align:left;color:#555;border-bottom:2px solid var(--border);white-space:nowrap;background:#fafafa;padding:.75rem 1rem;font-size:.82rem;font-weight:600}.data-table td{vertical-align:middle;border-bottom:1px solid #f0f0f0;padding:.65rem 1rem;font-size:.88rem}.data-table tr:last-child td{border-bottom:none}.data-table tr:hover td{background:#fafafa}.data-table a[href^=tel\:],.data-table a[href^=mailto\:]{color:inherit;pointer-events:none;text-decoration:none}.table-pagination{border-top:1px solid var(--border);justify-content:center;align-items:center;gap:.5rem;padding:.75rem;display:flex}.table-pagination button{border-radius:6px;min-width:36px;height:36px}.table-pagination .active{background:var(--primary);color:var(--white);border-color:var(--primary)}.modal-overlay{z-index:9999;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--white);border-radius:12px;width:90vw;max-width:450px;max-height:85vh;padding:1.25rem;overflow-y:auto}.modal h3{margin:0 0 1rem;font-size:1.1rem}.modal-actions{justify-content:flex-end;gap:.5rem;margin-top:1.25rem;display:flex}.tabs-header{border-bottom:2px solid var(--border);gap:0;margin-bottom:1rem;display:flex}.tab-btn{cursor:pointer;color:#666;background:0 0;border:none;border-bottom:2px solid #0000;margin-bottom:-2px;padding:.65rem 1.25rem;font-size:.9rem;font-weight:500;transition:color .15s,border-color .15s}.tab-btn:hover{color:var(--primary)}.tab-btn.active{color:var(--primary);border-bottom-color:var(--primary);font-weight:600}.dashboard-wrap{min-height:calc(100vh - 48px);display:flex}.dashboard-content{flex:1;padding:1.5rem;overflow:auto}.sidebar{background:var(--white);border-right:1px solid var(--border);flex-shrink:0;width:220px;overflow-y:auto}.sidebar-close-btn{cursor:pointer;color:#999;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;display:none}.sidebar-close-btn:hover{color:#555;background:#f0f0f0}.sidebar-toggle-btn,.sidebar-overlay-bg{display:none}.sidebar-item{cursor:pointer;border-radius:6px;margin:0 .5rem .25rem;padding:.75rem 1rem;font-size:.9rem;transition:background .15s}.sidebar-item:hover{background:#f5f5f5}.sidebar-item.active{color:var(--primary);background:#e3f2fd;font-weight:600}.sidebar-item.active-admin{color:var(--danger);background:#ffebee;font-weight:600}.navbar{color:var(--white);background:#000;align-items:center;gap:.25rem;height:56px;padding:0 .75rem;display:flex}.navbar a{color:var(--white)}.navbar-brand{color:var(--white);flex-shrink:0;align-items:center;height:100%;margin-right:.25rem;padding:4px 0;font-size:1.2rem;font-weight:700;text-decoration:none;display:flex}.navbar-spacer{flex:1}.navbar-btn{color:var(--white);cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:6px;align-items:center;gap:.35rem;padding:.35rem .6rem;font-size:.85rem;font-weight:500;display:inline-flex;position:relative}.navbar-btn svg{flex-shrink:0}.navbar-btn:hover{background:#ffffff26}.navbar-badge{display:none}@media (width<=768px){.navbar-label{display:none}.navbar-brand{margin-right:0;font-size:1rem}.navbar-btn{padding:.4rem}.navbar-badge{background:var(--danger);color:var(--white);border-radius:8px;justify-content:center;align-items:center;min-width:16px;height:16px;padding:0 4px;font-size:.65rem;font-weight:700;display:flex;position:absolute;top:-2px;right:-2px}}.switch-wrap{cursor:pointer;align-items:center;gap:.5rem;display:inline-flex}.switch-track{background:#ccc;border-radius:11px;width:40px;height:22px;transition:background .2s;position:relative}.switch-track.on{background:var(--primary)}.switch-track:after{content:"";background:#fff;border-radius:50%;width:18px;height:18px;transition:transform .2s;position:absolute;top:2px;left:2px}.switch-track.on:after{transform:translate(18px)}.multi-select-wrap{position:relative}.multi-select-tags{border:1px solid var(--border);background:var(--white);cursor:pointer;border-radius:8px;flex-wrap:wrap;gap:.3rem;min-height:42px;padding:.4rem;display:flex}.multi-select-tag{color:var(--primary);background:#e3f2fd;border-radius:4px;align-items:center;gap:.3rem;padding:.2rem .5rem;font-size:.8rem;display:flex}.multi-select-tag button{cursor:pointer;color:var(--primary);background:0 0;border:none;padding:0;font-size:.9rem;line-height:1}.multi-select-dropdown{background:var(--white);border:1px solid var(--border);z-index:100;max-height:200px;box-shadow:var(--shadow);border-radius:8px;margin-top:2px;position:absolute;top:100%;left:0;right:0;overflow-y:auto}.multi-select-option{cursor:pointer;align-items:center;gap:.5rem;padding:.5rem .75rem;font-size:.88rem;display:flex}.multi-select-option:hover{background:#f5f5f5}.date-range{align-items:center;gap:.5rem;display:flex}.date-range input[type=date]{border:1px solid var(--border);border-radius:8px;padding:.5rem;font-family:inherit;font-size:.88rem}.detail-panel{border-left:1px solid var(--border);background:var(--white);flex-shrink:0;width:400px;padding:1.25rem;overflow-y:auto}.user-avatar{color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:56px;height:56px;font-size:1.4rem;font-weight:700;display:flex}.user-row-selected td{background:#e3f2fd!important}.text-link-subtle{color:#999;cursor:pointer;background:0 0;border:none;padding:0;font-size:.82rem;text-decoration:underline}.text-link-subtle:hover{color:var(--danger,#e53935)}.info-row{border-bottom:1px solid #f5f5f5;justify-content:space-between;align-items:center;padding:.5rem 0;display:flex}.info-label{color:#999;font-size:.8rem}.info-value{font-size:.9rem;font-weight:500}.section-title{color:#666;text-transform:uppercase;letter-spacing:.5px;margin:1.25rem 0 .75rem;font-size:.85rem;font-weight:600}.show-mobile{display:none}.product-card-mobile{border:1px solid var(--border);cursor:pointer;background:#fff;border-radius:10px;margin-bottom:.6rem;padding:.75rem;transition:background .15s,box-shadow .15s}.product-card-mobile:active{background:#f7f9fc}.cart-sticky-bar{z-index:90;border-top:1px solid var(--border);background:#fff;align-items:center;gap:.8rem;padding:.65rem 1rem;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -2px 12px #00000014}.cart-sticky-bar.show-mobile{display:none}@media (width<=768px){.cart-sticky-bar.show-mobile{display:flex}}.home-products-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.25rem;display:grid}@media (width<=520px){.home-products-grid{grid-template-columns:repeat(2,1fr);gap:.75rem}}@media (width<=360px){.home-products-grid{grid-template-columns:1fr}}.grid-2col{grid-template-columns:1fr 1fr;gap:.75rem;display:grid}@media (width<=480px){.grid-2col{grid-template-columns:1fr}}@media (width<=768px){.page-container{padding:.75rem}.hide-mobile{display:none!important}.show-mobile{display:block}.sidebar{z-index:100;box-shadow:none;transition:transform .25s;position:fixed;top:48px;bottom:0;left:0;transform:translate(-100%)}.sidebar.open{transform:translate(0);box-shadow:4px 0 16px #00000026}.sidebar-close-btn{display:flex}.sidebar-toggle-btn{cursor:pointer;color:#555;background:#fff;border:1px solid #e0e0e0;border-radius:8px;align-items:center;gap:.4rem;margin-bottom:1rem;padding:.4rem .6rem;font-size:.88rem;font-weight:500;display:flex;box-shadow:0 1px 3px #00000014}.sidebar-toggle-btn:active{background:#f0f0f0}.sidebar-overlay-bg{z-index:99;background:#0000004d;display:block;position:fixed;inset:48px 0 0}.dashboard-wrap{flex-direction:column}.dashboard-content{padding:.75rem}.detail-panel{z-index:100;border-left:none;width:100%;padding:1rem;position:fixed;inset:48px 0 0}.data-table th{padding:.6rem .75rem;font-size:.78rem}.data-table td{padding:.55rem .75rem;font-size:.84rem}.modal{border-radius:10px;width:95vw;padding:1rem}.modal-actions{flex-direction:column}.modal-actions .btn{width:100%}.tabs-header{-webkit-overflow-scrolling:touch;flex-wrap:nowrap;overflow-x:auto}.tab-btn{white-space:nowrap;flex-shrink:0;padding:.6rem 1rem;font-size:.85rem}.btn{min-height:42px;padding:.6rem 1rem;font-size:.88rem}.btn-sm{min-height:36px;padding:.4rem .7rem}.btn-icon{width:42px;height:42px}.form-input,.form-select,.form-textarea{padding:.65rem .75rem;font-size:.92rem}.form-label{font-size:.84rem}.date-range{flex-wrap:wrap}.date-range input[type=date]{flex:1;min-width:0}.form-select,.form-input{min-width:0}.switch-track{width:44px;height:24px}.switch-track:after{width:20px;height:20px}.switch-track.on:after{transform:translate(20px)}}