.layout{display:flex;min-height:100vh;background-color:#f5f5f5;transition:all .3s ease}.layout.dark-mode{background-color:#494a56;color:#e2e8f0}.layout.dark-mode .main-content{background-color:#535563}.layout.dark-mode .content{background-color:#4c4e5b;color:#e2e8f0}.dark-sidebar{background:#4c4e5b!important;color:#e2e8f0!important;border-right:1px solid #2d3748;box-shadow:0 0 10px #0000000d}.dark-sidebar .sidebar-header{border-bottom:1px solid #4a5568!important;background:#4c4e5b!important}.dark-sidebar .nav-item{color:#a0aec0!important;background:#4c4e5b!important}.dark-sidebar .nav-item:hover{background:#2d3748!important;color:#e2e8f0!important}.dark-sidebar .nav-item.active{background:#4dabf7!important;color:#fff!important}.dark-header{background:#4c4e5b!important;color:#e2e8f0!important;border-bottom:1px solid #4a5568!important}.dark-header .welcome-text,.dark-header .menu-toggle{color:#e2e8f0!important}.sidebar{width:250px;background:#2c3e50;color:#fff;transition:all .3s ease;position:fixed;height:100vh;overflow-y:auto;z-index:1000}.sidebar.closed{width:70px}.sidebar-header{padding:20px;text-align:center;border-bottom:1px solid #34495e;height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.logo{width:40px;height:40px;margin-bottom:10px;transition:all .3s ease}.sidebar.open .logo{width:80px;height:80px}.sidebar-header h2{margin:0;font-size:1.2rem;white-space:nowrap;transition:opacity .3s ease}.sidebar.closed .sidebar-header h2{display:none}.close-sidebar{position:absolute;top:15px;right:15px;background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;display:none}.sidebar-nav{padding:20px 0}.nav-item{display:flex;align-items:center;padding:12px 20px;color:#bdc3c7;text-decoration:none;transition:all .3s ease;white-space:nowrap;overflow:hidden}.nav-item:hover{background:#34495e;color:#fff}.nav-item.active{background:#3498db;color:#fff}.nav-icon{margin-right:15px;font-size:1.2rem;min-width:20px;text-align:center}.sidebar.closed .nav-icon{margin-right:0}.sidebar.closed .nav-label{display:none}.main-content{flex:1;display:flex;flex-direction:column;margin-left:250px;transition:margin-left .3s ease;width:100%}.sidebar.closed~.main-content{margin-left:70px}.header{background:#fff;padding:15px 30px;box-shadow:0 2px 4px #4d4c4c78;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:100}.menu-toggle{background:none;border:none;font-size:1.5rem;cursor:pointer;padding:5px 10px;transition:transform .3s ease;z-index:1001;color:#333}.menu-toggle:hover{transform:scale(1.1)}.content{flex:1;padding:20px;overflow-y:auto;background:#f5f5f5}.welcome-text{margin-right:15px;font-weight:500;color:#4299e1}.theme-toggle-btn{background:#f8f9fa;border:1px solid #dee2e6;border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.2rem;transition:all .3s ease}.theme-toggle-btn:hover{transform:scale(1.1);border-color:#007bff}.layout.dark-mode .theme-toggle-btn{background:#2d3748;border-color:#4a5568;color:#e2e8f0}.mobile-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#78757580;z-index:999}@media (max-width: 768px){.sidebar{transform:translate(-100%);width:280px!important}.sidebar.open{transform:translate(0)}.sidebar.mobile.closed{transform:translate(-100%)}.main-content{margin-left:0!important;width:100%}.close-sidebar{display:block}.header{padding:15px 20px}.content{padding:15px}.welcome-text{font-size:.9rem}}@media (max-width: 480px){.sidebar{width:100%!important}.header{padding:12px 15px}.content{padding:10px}.welcome-text{font-size:.8rem;margin-right:10px}}.nav-icon-wrapper{display:flex;align-items:center;justify-content:center;width:24px;height:24px;margin-right:12px}.nav-icon-svg{width:20px;height:20px;transition:all .2s ease}.nav-item.active .nav-icon-svg{color:#3498db;transform:scale(1.1)}.dark-sidebar .nav-icon-svg{color:#cbd5e0}.dark-sidebar .nav-item.active .nav-icon-svg{color:#464a4d;font-weight:700}.nav-item:hover .nav-icon-svg{transform:scale(1.1)}.menu-icon{width:24px;height:24px}.menu-toggle{background:none;border:none;cursor:pointer;padding:8px;border-radius:6px;display:flex;align-items:center;justify-content:center;color:#4a5568;transition:all .2s ease}.menu-toggle:hover{background:#f7fafc;transform:scale(1.1)}.dark-header .menu-toggle{color:#e2e8f0}.dark-header .menu-toggle:hover{background:#2d3748}.close-icon{width:20px;height:20px}.close-sidebar{position:absolute;top:20px;right:20px;background:none;border:none;color:#4a5568;cursor:pointer;padding:6px;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.close-sidebar:hover{background:#f7fafc;transform:scale(1.1)}.dark-sidebar .close-sidebar{color:#cbd5e0}.dark-sidebar .close-sidebar:hover{background:#2d3748}.theme-icon{width:20px;height:20px}.theme-toggle-btn{background:none;border:none;cursor:pointer;padding:8px 12px;border-radius:6px;display:flex;align-items:center;justify-content:center;color:#4a5568;font-size:20px;transition:all .2s ease;margin-left:10px}.theme-toggle-btn:hover{background:#f7fafc;transform:scale(1.1)}.dark-header .theme-toggle-btn{color:#e2e8f0}.dark-header .theme-toggle-btn:hover{background:#2d3748}.logo{width:40px;height:40px;object-fit:contain;margin-right:10px}.sidebar-header{display:flex;align-items:center;padding:20px;border-bottom:1px solid #e2e8f0}.dark-sidebar .sidebar-header{border-bottom-color:#2d3748}.nav-item{display:flex;align-items:center;padding:12px 20px;text-decoration:none;color:#4a5568;transition:all .2s ease;border-left:3px solid transparent}.dark-sidebar .nav-item{color:#cbd5e0}.dark-sidebar .nav-item:hover{background:#2d3748}.nav-item.active{background:#4a5568;border-left-color:#3498db;color:#e2e8f0}.dark-sidebar .nav-item.active{background:#2d3748;border-left-color:#63b3ed;color:#e2e8f0}.header-actions{display:flex;align-items:center;gap:15px}@media (max-width: 768px){.nav-icon-wrapper{width:20px;height:20px;margin-right:10px}.nav-icon-svg{width:18px;height:18px}.menu-icon{width:20px;height:20px}.theme-icon{width:18px;height:18px}}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);padding:20px}.login-container{background:#fff;padding:40px;border-radius:10px;box-shadow:0 10px 30px #0003;width:100%;max-width:400px}.login-header{text-align:center;margin-bottom:30px}.login-logo{width:60px;height:60px;margin-bottom:15px}.login-header h1{color:#2c3e50;margin-bottom:10px;font-size:1.8rem}.login-header p{color:#7f8c8d;margin:0}.login-form{display:flex;flex-direction:column;gap:20px}.form-group label{margin-bottom:8px;font-weight:600;color:#2c3e50}.form-group input{padding:12px;border:1px solid #bdc3c7;border-radius:5px;font-size:1rem;transition:border-color .3s ease}.form-group input:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 2px #3498db33}.login-btn{background:#3498db;color:#fff;border:none;padding:12px;border-radius:5px;font-size:1rem;font-weight:600;cursor:pointer;transition:background-color .3s ease;margin-top:10px}.login-btn:hover:not(:disabled){background:#2980b9}.login-btn:disabled{background:#bdc3c7;cursor:not-allowed}.error-message{background:#f8d7da;color:#721c24;padding:12px;border-radius:5px;border:1px solid #f5c6cb;text-align:center}.login-footer{margin-top:20px;text-align:center;color:#7f8c8d;font-size:.9rem}.dashboard{padding:20px;background-color:#f8f9fa;min-height:100vh;transition:background-color .3s ease}:root.dark-mode .dashboard,.layout.dark-mode .dashboard{background:linear-gradient(135deg,#4c4e5b,#4c4e5b);background-color:#4c4e5b}.dashboard-header{margin-bottom:30px}.header-content{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px}.header-text h1{color:#2c3e50;margin-bottom:8px;font-size:28px;font-weight:600;transition:color .3s ease}.header-text p{color:#6c757d;font-size:16px;margin:0;transition:color .3s ease}:root.dark-mode .header-text h1,.layout.dark-mode .header-text h1{color:#f0f2f5;text-shadow:0 2px 4px rgba(0,0,0,.3)}:root.dark-mode .header-text p,.layout.dark-mode .header-text p{color:#a3b1c6;opacity:.9}.time-filter{display:flex;flex-direction:column;gap:8px}.filter-label{font-size:12px;font-weight:600;color:#6c757d;text-transform:uppercase;letter-spacing:.5px;transition:color .3s ease}.time-range-buttons{display:flex;background:#fff;padding:4px;border-radius:12px;box-shadow:0 2px 10px #00000014;border:1px solid #e9ecef;gap:4px;transition:all .3s ease}.time-range-btn{display:flex;align-items:center;gap:8px;padding:10px 16px;border:none;background:transparent;border-radius:8px;cursor:pointer;transition:all .3s ease;font-size:14px;font-weight:500;color:#6c757d;min-width:100px;justify-content:center}.time-range-btn:hover{background:#f8f9fa;color:#495057;transform:translateY(-1px)}.time-range-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 12px #667eea4d}:root.dark-mode .filter-label,.layout.dark-mode .filter-label{color:#a3b1c6;font-weight:600}:root.dark-mode .time-range-buttons,.layout.dark-mode .time-range-buttons{background:#2a2d3a;border:1px solid #3a3f52;box-shadow:0 4px 12px #00000040}:root.dark-mode .time-range-btn,.layout.dark-mode .time-range-btn{color:#a3b1c6;background:transparent}:root.dark-mode .time-range-btn:hover,.layout.dark-mode .time-range-btn:hover{background:#35384a;color:#e2e8f0;box-shadow:0 2px 8px #0003}:root.dark-mode .time-range-btn.active,.layout.dark-mode .time-range-btn.active{background:linear-gradient(135deg,#4dabf7,#2d8de8);color:#fff;box-shadow:0 4px 16px #4dabf74d;border:1px solid rgba(77,171,247,.3)}.dashboard .stats-grid{display:grid!important;grid-template-columns:repeat(2,minmax(300px,1fr))!important;gap:30px!important;margin-bottom:40px!important}.stat-card-modern{background:#fff;border-radius:20px;padding:40px;box-shadow:0 10px 40px #00000014,0 2px 10px #0000000d,inset 0 1px #fffc;position:relative;overflow:hidden;transition:all .4s cubic-bezier(.175,.885,.32,1.1);border:1px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.stat-card-modern:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 20px 60px #00000026,0 8px 20px #0000001a,inset 0 1px #ffffffe6}.stat-card-modern:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#fffc,#fff6,#fffc);border-radius:20px 20px 0 0}.stat-chart-container{position:absolute;top:20px;right:20px;width:80px;height:80px}.stat-pie-chart{width:100%;height:100%;filter:drop-shadow(0 4px 8px rgba(0,0,0,.1))}.pie-background{stroke:#f0f2f5}.pie-progress{transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dasharray .8s ease-out}.pie-center-dot{filter:drop-shadow(0 2px 4px rgba(0,0,0,.2));animation:pulse 2s infinite}.pie-value{font-size:10px;font-weight:700;fill:#2c3e50;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;filter:drop-shadow(0 1px 1px rgba(255,255,255,.8))}.chart-indicator-line{position:absolute;top:50%;left:-10px;width:20px;height:2px;border-radius:1px;transform:translateY(-50%);opacity:.7}.stat-content-modern{position:relative;z-index:2}.stat-header-modern{display:flex;align-items:flex-start;gap:16px;margin-bottom:20px}.stat-icon-modern{position:relative;width:48px;height:48px;flex-shrink:0}.icon-emoji{position:relative;z-index:2;font-size:24px;display:flex;align-items:center;justify-content:center;height:100%;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.icon-background{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:12px;opacity:.15;transform:rotate(45deg);transition:all .3s ease}.stat-card-modern:hover .icon-background{transform:rotate(0) scale(1.1);opacity:.2}.stat-titles{flex:1}.stat-value-modern{margin:0 0 4px;font-size:28px;font-weight:800;color:#2c3e50;background:linear-gradient(135deg,#2c3e50,#4a6583);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.5px;line-height:1}.stat-title-modern{margin:0;color:#6c757d;font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;opacity:.8}.stat-meta{border-top:1px solid rgba(0,0,0,.05);padding-top:16px}.change-container{display:flex;align-items:center;margin-bottom:12px}.stat-change-modern{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:700;padding:6px 12px;border-radius:20px;transition:all .3s ease}.stat-change-modern.positive{background:linear-gradient(135deg,#28a74526,#28a7450d);color:#28a745;border:1px solid rgba(40,167,69,.2)}.stat-change-modern.negative{background:linear-gradient(135deg,#dc354526,#dc35450d);color:#dc3545;border:1px solid rgba(220,53,69,.2)}.change-icon{width:12px;height:12px}.stat-description-modern{display:flex;justify-content:space-between;align-items:center}.description-text{font-size:12px;color:#adb5bd;font-weight:500;max-width:70%}.progress-dots{display:flex;gap:4px}.progress-dot{width:6px;height:6px;border-radius:50%;opacity:.3;transition:all .3s ease}.progress-dot.active{opacity:1;transform:scale(1.2)}.stat-pattern{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;opacity:.3;z-index:1;border-radius:20px;overflow:hidden}.pattern-svg{width:100%;height:100%}:root.dark-mode .stat-card-modern,.layout.dark-mode .stat-card-modern{background:linear-gradient(145deg,#2a2d3a,#242735);border:1px solid #3a3f52;box-shadow:0 8px 32px #00000040,0 2px 8px #00000026,inset 0 1px #ffffff0d;position:relative;overflow:hidden}:root.dark-mode .stat-card-modern:before,.layout.dark-mode .stat-card-modern:before{background:linear-gradient(90deg,#4dabf7cc,#2d8de899,#4dabf7cc)}:root.dark-mode .stat-card-modern:hover,.layout.dark-mode .stat-card-modern:hover{transform:translateY(-6px);box-shadow:0 16px 48px #00000059,0 6px 16px #00000040,inset 0 1px #ffffff14;border-color:#4a5168}:root.dark-mode .pie-background,.layout.dark-mode .pie-background{stroke:#ffffff1a}:root.dark-mode .pie-value,.layout.dark-mode .pie-value{fill:#f0f2f5;filter:drop-shadow(0 1px 2px rgba(0,0,0,.4))}:root.dark-mode .stat-value-modern,.layout.dark-mode .stat-value-modern{background:linear-gradient(135deg,#f0f2f5,#c8d0e0);-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 1px 2px rgba(0,0,0,.2)}:root.dark-mode .stat-title-modern,.layout.dark-mode .stat-title-modern{color:#a3b1c6;opacity:.9}:root.dark-mode .stat-meta,.layout.dark-mode .stat-meta{border-top:1px solid rgba(255,255,255,.08)}:root.dark-mode .description-text,.layout.dark-mode .description-text{color:#8a96b0}:root.dark-mode .stat-change-modern.positive,.layout.dark-mode .stat-change-modern.positive{background:linear-gradient(135deg,#48bb7840,#48bb781a);color:#5cd985;border:1px solid rgba(72,187,120,.4);box-shadow:0 2px 8px #48bb7833}:root.dark-mode .stat-change-modern.negative,.layout.dark-mode .stat-change-modern.negative{background:linear-gradient(135deg,#f5656540,#f565651a);color:#ff7a7a;border:1px solid rgba(245,101,101,.4);box-shadow:0 2px 8px #f5656533}:root.dark-mode .progress-dot.active,.layout.dark-mode .progress-dot.active{box-shadow:0 0 6px currentColor}:root.dark-mode .stat-card-modern:nth-child(1):hover,.layout.dark-mode .stat-card-modern:nth-child(1):hover{background:linear-gradient(145deg,#2a2d3a,#1e2b3c);border-color:#3a5a8a}:root.dark-mode .stat-card-modern:nth-child(2):hover,.layout.dark-mode .stat-card-modern:nth-child(2):hover{background:linear-gradient(145deg,#2a2d3a,#1e3c2a);border-color:#3a8a5a}:root.dark-mode .stat-card-modern:nth-child(3):hover,.layout.dark-mode .stat-card-modern:nth-child(3):hover{background:linear-gradient(145deg,#2a2d3a,#3c2a2a);border-color:#8a5a5a}:root.dark-mode .stat-card-modern:nth-child(4):hover,.layout.dark-mode .stat-card-modern:nth-child(4):hover{background:linear-gradient(145deg,#2a2d3a,#3c3a2a);border-color:#8a8a5a}.analytics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin-bottom:30px}.analytics-card{background:#fff;padding:24px;border-radius:12px;box-shadow:0 2px 10px #00000014;border:1px solid transparent;transition:all .3s ease}.analytics-card.full-width{grid-column:1 / -1}:root.dark-mode .analytics-card,.layout.dark-mode .analytics-card{background:linear-gradient(145deg,#2a2d3a,#242735);border:1px solid #3a3f52;box-shadow:0 4px 20px #00000040}:root.dark-mode .analytics-card:hover,.layout.dark-mode .analytics-card:hover{box-shadow:0 8px 32px #00000059;border-color:#4a5168}.analytics-card h3{margin:0 0 20px;color:#2c3e50;font-size:18px;font-weight:600;transition:color .3s ease}:root.dark-mode .analytics-card h3,.layout.dark-mode .analytics-card h3{color:#f0f2f5;text-shadow:0 1px 2px rgba(0,0,0,.3)}.status-chart{display:flex;flex-direction:column;gap:12px}.status-bar{display:flex;align-items:center;gap:12px}.status-label{display:flex;align-items:center;gap:8px;min-width:100px;font-size:14px;color:#495057;transition:color .3s ease}.status-dot{width:8px;height:8px;border-radius:50%}.status-progress{flex:1;height:8px;background:#e9ecef;border-radius:4px;overflow:hidden;transition:background .3s ease}.status-progress-bar{height:100%;transition:width .3s ease}.status-count{font-size:14px;font-weight:600;color:#495057;min-width:30px;text-align:right;transition:color .3s ease}:root.dark-mode .status-label,.layout.dark-mode .status-label{color:#e2e8f0}:root.dark-mode .status-progress,.layout.dark-mode .status-progress{background:#35384a}:root.dark-mode .status-count,.layout.dark-mode .status-count{color:#f0f2f5}.products-chart{display:flex;flex-direction:column;gap:12px}.product-bar{display:flex;justify-content:space-between;align-items:center;padding:12px;background:#f8f9fa;border-radius:8px;border-left:4px solid #007bff;transition:all .3s ease}.product-info{display:flex;align-items:center;gap:8px}.product-rank{font-weight:700;color:#007bff;font-size:14px;transition:color .3s ease}.product-name{font-weight:500;color:#2c3e50;transition:color .3s ease}.sales-count{font-size:14px;color:#6c757d;font-weight:500;transition:color .3s ease}:root.dark-mode .product-bar,.layout.dark-mode .product-bar{background:#35384a;border-left:4px solid #4dabf7;box-shadow:0 2px 8px #0003}:root.dark-mode .product-bar:hover,.layout.dark-mode .product-bar:hover{background:#3a3f52;transform:translate(2px)}:root.dark-mode .product-rank,.layout.dark-mode .product-rank{color:#4dabf7}:root.dark-mode .product-name,.layout.dark-mode .product-name{color:#e2e8f0}:root.dark-mode .sales-count,.layout.dark-mode .sales-count{color:#a3b1c6}.metrics-card .metrics-grid{display:grid;grid-template-columns:1fr;gap:16px}.metric{text-align:center;padding:16px;background:#f8f9fa;border-radius:8px;border:1px solid transparent;transition:all .3s ease}.metric-value{font-size:24px;font-weight:700;color:#007bff;margin-bottom:4px;transition:color .3s ease}.metric-label{font-size:14px;color:#6c757d;transition:color .3s ease}:root.dark-mode .metric,.layout.dark-mode .metric{background:#35384a;border:1px solid #3a3f52;box-shadow:0 2px 8px #0003}:root.dark-mode .metric:hover,.layout.dark-mode .metric:hover{background:#3a3f52;transform:translateY(-2px)}:root.dark-mode .metric-value,.layout.dark-mode .metric-value{color:#4dabf7;text-shadow:0 1px 2px rgba(0,0,0,.3)}:root.dark-mode .metric-label,.layout.dark-mode .metric-label{color:#a3b1c6}.hourly-revenue{display:flex;align-items:flex-end;justify-content:space-between;gap:2px;height:200px;padding:20px 0 40px;width:100%;position:relative;border-bottom:1px solid #e9ecef}.hour-bar{display:flex;flex-direction:column;align-items:center;flex:1;gap:8px;position:relative;height:100%;justify-content:flex-end}.revenue-bar{width:100%;max-width:30px;background:linear-gradient(to top,#007bff,#66b3ff);border-radius:4px 4px 0 0;min-height:4px;transition:all .3s ease;cursor:pointer;position:relative}.revenue-bar:hover{background:linear-gradient(to top,#0056b3,#39f);transform:scale(1.05)}.hour-label{font-size:11px;color:#6c757d;font-weight:500;position:absolute;bottom:-25px;transform:none;writing-mode:horizontal-tb;text-align:center;width:100%}.revenue-tooltip{position:absolute;top:-10px;left:50%;transform:translate(-50%) translateY(-100%);background:#2c3e50;color:#fff;padding:12px 16px;border-radius:8px;font-size:12px;font-weight:500;white-space:nowrap;opacity:0;visibility:hidden;transition:all .3s ease;z-index:1000;pointer-events:none;box-shadow:0 8px 25px #00000026;min-width:140px;text-align:center;border:1px solid rgba(255,255,255,.1)}.revenue-tooltip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:6px solid transparent;border-top-color:#2c3e50}.revenue-tooltip .time{font-weight:600;margin-bottom:6px;color:#fff;font-size:13px}.revenue-tooltip .amount{font-size:16px;font-weight:700;margin-bottom:6px;color:#4cd964}.revenue-tooltip .change{font-size:11px;padding:4px 8px;border-radius:12px;background:#ffffff26;font-weight:600}.revenue-tooltip .change.positive{color:#4cd964;background:#4cd96426}.revenue-tooltip .change.negative{color:#ff3b30;background:#ff3b3026}.hour-bar:hover .revenue-tooltip{opacity:1;visibility:visible;top:-15px}.hour-bar:hover .revenue-bar{background:linear-gradient(to top,#0056b3,#39f);box-shadow:0 4px 12px #007bff4d}:root.dark-mode .hourly-revenue,.layout.dark-mode .hourly-revenue{border-bottom:1px solid #3a3f52}:root.dark-mode .hour-label,.layout.dark-mode .hour-label{color:#a3b1c6}:root.dark-mode .revenue-bar,.layout.dark-mode .revenue-bar{background:linear-gradient(to top,#4dabf7,#66b3ff)}:root.dark-mode .revenue-bar:hover,.layout.dark-mode .revenue-bar:hover{background:linear-gradient(to top,#2d8de8,#4dabf7);box-shadow:0 4px 12px #4dabf74d}:root.dark-mode .revenue-tooltip,.layout.dark-mode .revenue-tooltip{background:#2a2d3a;border:1px solid #3a3f52;color:#f0f2f5;box-shadow:0 8px 32px #0006}:root.dark-mode .revenue-tooltip:after,.layout.dark-mode .revenue-tooltip:after{border-top-color:#2a2d3a}:root.dark-mode .revenue-tooltip .time,.layout.dark-mode .revenue-tooltip .time{color:#f0f2f5}:root.dark-mode .revenue-tooltip .amount,.layout.dark-mode .revenue-tooltip .amount{color:#5cd985}:root.dark-mode .revenue-tooltip .change,.layout.dark-mode .revenue-tooltip .change{background:#ffffff14}:root.dark-mode .revenue-tooltip .change.positive,.layout.dark-mode .revenue-tooltip .change.positive{color:#5cd985;background:#5cd98533}:root.dark-mode .revenue-tooltip .change.negative,.layout.dark-mode .revenue-tooltip .change.negative{color:#ff7a7a;background:#ff7a7a33}.dashboard-section{background:#fff;padding:24px;border-radius:12px;box-shadow:0 2px 10px #00000014;border:1px solid transparent;transition:all .3s ease}:root.dark-mode .dashboard-section,.layout.dark-mode .dashboard-section{background:linear-gradient(145deg,#2a2d3a,#242735);border:1px solid #3a3f52;box-shadow:0 4px 20px #00000040}:root.dark-mode .dashboard-section:hover,.layout.dark-mode .dashboard-section:hover{box-shadow:0 8px 32px #00000059;border-color:#4a5168}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.section-header h2{margin:0;color:#2c3e50;font-size:20px;font-weight:600;transition:color .3s ease}.section-badge{background:#007bff;color:#fff;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:600;transition:background .3s ease}:root.dark-mode .section-header h2,.layout.dark-mode .section-header h2{color:#f0f2f5;text-shadow:0 1px 2px rgba(0,0,0,.3)}:root.dark-mode .section-badge,.layout.dark-mode .section-badge{background:linear-gradient(135deg,#4dabf7,#2d8de8);color:#fff;box-shadow:0 2px 8px #4dabf74d}.dashboard .orders-table{overflow-x:auto;border-radius:8px;border:1px solid #e9ecef;transition:border-color .3s ease}.dashboard .orders-table table{width:100%;border-collapse:collapse;min-width:800px;table-layout:auto}.dashboard .orders-table th{background:#f8f9fa;padding:16px 12px;text-align:left;font-weight:600;color:#495057;border-bottom:2px solid #e9ecef;font-size:13px;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;transition:all .3s ease}.dashboard .orders-table td{padding:16px 12px;border-bottom:1px solid #e9ecef;vertical-align:top;font-size:14px;transition:all .3s ease}.dashboard .order-id{font-family:Courier New,monospace;font-weight:600;color:#495057;font-size:13px;transition:color .3s ease}.customer-name strong{color:#2c3e50;font-weight:600;display:block;margin-bottom:2px;transition:color .3s ease}.customer-phone{font-size:12px;color:#6c757d;transition:color .3s ease}.item-preview{padding:6px 8px;background:#f8f9fa;border-radius:4px;font-size:12px;color:#495057;border-left:3px solid #007bff;transition:all .3s ease}.more-items{font-size:11px;color:#6c757d;font-style:italic;padding:4px 8px;transition:color .3s ease}.dashboard .order-items{flex-direction:column;gap:4px}.item-preview{margin-bottom:10px}.item-preview:last-child{margin-bottom:0}.dashboard .order-time{color:#6c757d;font-size:13px;font-weight:500;transition:color .3s ease}.orders-table tr:hover{background-color:#f8f9fa;transition:background-color .3s ease}.orders-table tr:last-child td{border-bottom:none}.dashboard .order-total{font-weight:700!important;color:#28a745!important;font-size:14px!important;background:none!important;transition:color .3s ease}:root.dark-mode .orders-table,.layout.dark-mode .orders-table{border:1px solid #3a3f52}:root.dark-mode .orders-table th,.layout.dark-mode .orders-table th{background:#35384a;color:#f0f2f5;border-bottom:2px solid #3a3f52}:root.dark-mode .orders-table td,.layout.dark-mode .orders-table td{border-bottom:1px solid #3a3f52;color:#e2e8f0}:root.dark-mode .orders-table tr:hover,.layout.dark-mode .orders-table tr:hover{background-color:#35384a}:root.dark-mode .order-id,.layout.dark-mode .order-id{color:#e2e8f0}:root.dark-mode .customer-name strong,.layout.dark-mode .customer-name strong{color:#f0f2f5}:root.dark-mode .customer-phone,.layout.dark-mode .customer-phone{color:#a3b1c6}:root.dark-mode .item-preview,.layout.dark-mode .item-preview{background:#35384a;color:#e2e8f0;border-left:3px solid #4dabf7}:root.dark-mode .item-preview:hover,.layout.dark-mode .item-preview:hover{background:#3a3f52}:root.dark-mode .more-items,.layout.dark-mode .more-items{color:#a3b1c6}:root.dark-mode .order-time,.layout.dark-mode .order-time{color:#a3b1c6}:root.dark-mode .order-total,.layout.dark-mode .order-total{color:#5cd985!important}.status-badge.completed{background:linear-gradient(135deg,#28a745,#1e7e34)}.status-badge.pending{background:linear-gradient(135deg,#ffc107,#e0a800)}.status-badge.cancelled{background:linear-gradient(135deg,#dc3545,#c82333)}.status-badge.processing{background:linear-gradient(135deg,#17a2b8,#138496)}:root.dark-mode .no-orders,.layout.dark-mode .no-orders{background:linear-gradient(145deg,#2a2d3a,#242735);border:1px solid #3a3f52;min-height:200px;display:flex;flex-direction:column;justify-content:center;align-items:center}.dashboard :root.dark-mode .no-data,.dashboard .layout.dark-mode .no-data{color:#8a96b0}.dashboard :root.dark-mode .loading,.dashboard .layout.dark-mode .loading{color:#a3b1c6}.dashboard :root.dark-mode .analytics-card:has(.no-data),.dashboard .layout.dark-mode .analytics-card:has(.no-data){background:linear-gradient(145deg,#2a2d3a,#242735);border:1px solid #3a3f52;min-height:200px;display:flex;flex-direction:column;justify-content:center;align-items:center}.dashboard :root.dark-mode .analytics-card.full-width:has(.no-data),.dashboard .layout.dark-mode .analytics-card.full-width:has(.no-data){min-height:300px}.dashboard :root.dark-mode .analytics-card .no-data,.dashboard .layout.dark-mode .analytics-card .no-data{color:#8a96b0;background:transparent}@media (max-width: 768px){.dashboard{padding:16px}.header-content{flex-direction:column;gap:16px;align-items:flex-start}.time-range-buttons{flex-wrap:wrap}.time-range-btn{min-width:80px;padding:8px 12px}.btn-text{font-size:12px}.dashboard .stats-grid{display:flex!important;flex-direction:column!important;gap:20px!important}.analytics-grid{grid-template-columns:repeat(1,minmax(300px,1fr))!important}.hourly-revenue{height:150px;gap:1px}.revenue-bar{max-width:20px}.hour-label{font-size:9px;bottom:-20px}.orders-table{margin:0 -16px}.dashboard :root.dark-mode .stat-card-modern,.dashboard .layout.dark-mode .stat-card-modern{padding:20px}.dashboard :root.dark-mode .stat-chart-container,.dashboard .layout.dark-mode .stat-chart-container{width:70px;height:70px}}@media (max-width: 480px){.dashboard .stats-grid{display:flex!important;flex-direction:column!important;gap:20px!important}.time-range-buttons{width:100%}.time-range-btn{flex:1;min-width:auto}.btn-icon{display:none}.stat-header-modern{flex-direction:column;gap:12px}.stat-icon-modern{width:40px;height:40px}.icon-emoji{font-size:20px}}:root.dark-mode *,.layout.dark-mode *{transition:background-color .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease,transform .3s ease}.dashboard .no-orders{background:linear-gradient(145deg,#f8f9facc,#e9ecef99);border-radius:12px;padding:60px 40px;text-align:center;border:2px dashed #dee2e6;min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;transition:all .3s ease}.dashboard .no-orders:before{content:"📦";font-size:64px;opacity:.4;display:block;margin-bottom:16px}.dashboard .no-orders h4{margin:0 0 8px;color:#495057;font-size:18px;font-weight:600}.dashboard .no-orders p{margin:0;color:#6c757d;font-size:14px;max-width:300px;line-height:1.5}.dashboard .no-orders .btn-refresh{margin-top:16px;padding:10px 24px;background:#3498db;color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease}.dashboard .no-orders .btn-refresh:hover{background:#2980b9;transform:translateY(-2px);box-shadow:0 4px 12px #3498db4d}.dashboard-welcome-section{background:#fff;border-radius:16px;padding:30px;margin-bottom:30px;border:1px solid #eaeaea;box-shadow:0 4px 20px #0000000d}.layout.dark-mode .dashboard-welcome-section{background:#252631;border-color:#2d3748;box-shadow:0 4px 20px #00000026}.greeting-icon{width:60px;height:60px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:28px;color:#fff}.layout.dark-mode .greeting-icon{background:linear-gradient(135deg,#4dabf7,#2d8de8)}.welcome-title{margin:0;font-size:28px;font-weight:700;color:#2c3e50}.layout.dark-mode .welcome-title{color:#e2e8f0}.admin-name{color:#667eea}.layout.dark-mode .admin-name{color:#4dabf7}.welcome-subtitle{margin:0;display:flex;align-items:center;gap:12px;font-size:16px;color:#6c757d}.layout.dark-mode .welcome-subtitle{color:#a0aec0}.cafe-role{font-weight:600;color:#667eea;background:#667eea1a;padding:4px 12px;border-radius:20px}.layout.dark-mode .cafe-role{color:#4dabf7;background:#4dabf71a}.stat-summary{background:#f8f9fa;border:1px solid #eaeaea}.layout.dark-mode .stat-summary{background:#2d3748;border-color:#4a5568}.time-filter-section{background:#f8f9fa;border:1px solid #eaeaea}.layout.dark-mode .time-filter-section{background:#2d3748;border-color:#4a5568}.time-range-btn{background:#fff;border:1px solid #dee2e6;color:#495057}.layout.dark-mode .time-range-btn{background:#252631;border-color:#4a5568;color:#e2e8f0}.time-range-btn.active{background:#667eea;color:#fff;border-color:#667eea}.layout.dark-mode .time-range-btn.active{background:#4dabf7;border-color:#4dabf7}.product-form-container{max-width:800px;margin:0 auto;padding:20px}.product-form{background:#fff;border-radius:16px;padding:30px;box-shadow:0 4px 20px #00000014;border:1px solid #e9ecef}.layout.dark-mode .product-form{background:#252631!important;border:1px solid #4a5568!important;color:#e2e8f0!important}.form-header{margin-bottom:30px;border-bottom:2px solid #e9ecef;padding-bottom:20px}.layout.dark-mode .form-header{border-bottom:2px solid #4a5568!important}.form-header h2{color:#2c3e50;margin:0 0 8px;font-size:1.8rem;font-weight:700}.layout.dark-mode .form-header h2{color:#e2e8f0!important}.form-header p{color:#7f8c8d;margin:0;font-size:1rem}.form-label{font-weight:600;color:#2c3e50;margin-bottom:8px;font-size:.9rem}.form-input,.form-select,.form-textarea{padding:12px 16px;border:2px solid #e9ecef;border-radius:8px;font-size:1rem;transition:all .3s ease;background:#fff;font-family:inherit;color:#2c3e50}.layout.dark-mode .form-input,.layout.dark-mode .form-select,.layout.dark-mode .form-textarea{background:#2d3748!important;border:2px solid #4a5568!important;color:#e2e8f0!important}.layout.dark-mode .form-input::placeholder,.layout.dark-mode .form-select::placeholder,.layout.dark-mode .form-textarea::placeholder{color:#a0aec0!important}.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.layout.dark-mode .form-input:focus,.layout.dark-mode .form-select:focus,.layout.dark-mode .form-textarea:focus{border-color:#4dabf7!important;box-shadow:0 0 0 3px #4dabf71a!important}.form-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%232c3e50' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:16px;padding-right:40px;cursor:pointer;width:100%;box-sizing:border-box}.layout.dark-mode .form-select{background-color:#2d3748!important;border-color:#4a5568!important;color:#e2e8f0!important}.form-textarea{resize:vertical;min-height:100px;line-height:1.5}.form-help{color:#7f8c8d;font-size:.8rem;margin-top:4px}.checkbox-label{display:flex;align-items:center;cursor:pointer;font-weight:500;color:#2c3e50;gap:10px}.checkbox-custom{width:20px;height:20px;border:2px solid #bdc3c7;border-radius:4px;position:relative;transition:all .3s ease;background:#fff;display:flex;align-items:center;justify-content:center}.checkbox-input:checked+.checkbox-custom:after{content:"✓";color:#fff;font-size:12px;font-weight:700}.layout.dark-mode .checkbox-label:hover .checkbox-custom{border-color:#4dabf7!important}.image-preview{margin-top:12px}.image-preview img{max-width:200px;max-height:150px;border-radius:8px;border:2px solid #e9ecef;object-fit:cover;box-shadow:0 2px 8px #0000001a}.layout.dark-mode .image-preview img{border:2px solid #4a5568!important;box-shadow:0 2px 8px #0003!important}.form-actions{display:flex;justify-content:flex-end;gap:12px;padding-top:25px;border-top:1px solid #e9ecef;margin-top:20px}.btn-secondary:disabled{opacity:.6;cursor:not-allowed;transform:none}.layout.dark-mode .btn-secondary:hover:not(:disabled){background:#2d3748!important}.form-input[type=number]{-moz-appearance:textfield}.form-input[type=number]::-webkit-outer-spin-button,.form-input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.form-input:focus-visible,.form-select:focus-visible,.form-textarea:focus-visible{outline:2px solid #3498db;outline-offset:2px}.layout.dark-mode .form-input:focus-visible,.layout.dark-mode .form-select:focus-visible,.layout.dark-mode .form-textarea:focus-visible{outline:2px solid #4dabf7!important;outline-offset:2px}.price-input-group{position:relative}.price-input-group:before{content:"$";position:absolute;left:16px;top:50%;transform:translateY(-50%);color:#6c757d;font-weight:600}.layout.dark-mode .price-input-group:before{color:#a0aec0!important}.form-input.has-currency{padding-left:36px}.category-select-wrapper{position:relative}.category-select-wrapper:after{display:none!important;content:none!important}.layout.dark-mode .product-form,.layout.dark-mode .form-input,.layout.dark-mode .form-select,.layout.dark-mode .form-textarea,.layout.dark-mode .checkbox-custom,.layout.dark-mode .btn-primary,.layout.dark-mode .btn-secondary{transition:background-color .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease!important}.layout.dark-mode .product-form *{color:inherit!important}.status-indicator{display:inline-flex;align-items:center;gap:6px;margin-left:10px;font-size:.85rem;color:#28a745}.layout.dark-mode .status-indicator{color:#48bb78!important}.status-indicator:before{content:"•";font-size:20px}.required-field:after{content:" *";color:#e74c3c}.layout.dark-mode .required-field:after{color:#f56565!important}@media (max-width: 768px){.product-form-container{padding:0 16px}.product-form{padding:20px}.form-row{grid-template-columns:1fr;gap:15px}.form-actions{flex-direction:column}.btn-primary,.btn-secondary{width:100%;justify-content:center}.image-preview img{max-width:150px;max-height:120px}}.form-section{margin-bottom:25px;padding-bottom:20px;border-bottom:1px solid #e9ecef}.layout.dark-mode .form-section{border-bottom:1px solid #4a5568!important}.form-section:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.field-description{font-size:.85rem;color:#6c757d;margin-top:4px;font-style:italic}.layout.dark-mode .field-description{color:#a0aec0!important}.form-select{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}@-moz-document url-prefix(){.layout.dark-mode .form-select{color:#e2e8f0!important;color-scheme:dark!important}}.crop-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000f2;display:flex;align-items:center;justify-content:center;z-index:9999}.crop-modal{background:#1a1a1a;border-radius:12px;width:90%;max-width:500px;overflow:hidden}.crop-header{padding:20px;text-align:center;border-bottom:1px solid #333}.crop-header h3{margin:0 0 8px;color:#fff;font-size:1.2rem}.crop-container{width:100%;height:400px;position:relative;overflow:hidden;background:#000;-webkit-user-select:none;user-select:none;touch-action:none}.crop-image{position:absolute;top:50%;left:50%;width:100%;height:100%;transform:translate(-50%,-50%);background-size:contain;background-repeat:no-repeat;background-position:center;will-change:transform}.crop-frame{position:absolute;top:50%;left:50%;width:300px;height:300px;transform:translate(-50%,-50%);border:2px solid white;box-shadow:0 0 0 9999px #00000080}.crop-guide:before{content:"";position:absolute;top:33.33%;left:0;right:0;height:1px;background:#ffffff4d}.crop-controls{display:flex;padding:20px;gap:12px;background:#1a1a1a;border-top:1px solid #333}.crop-btn{flex:1;padding:12px;border:none;border-radius:8px;font-weight:600;cursor:pointer;font-size:.95rem;transition:all .2s ease}.crop-btn.cancel{background:#333;color:#fff}.crop-btn.cancel:hover{background:#444}.crop-btn.reset{background:#555;color:#fff}.crop-btn.reset:hover{background:#666}.crop-btn.apply{background:#0095f6;color:#fff}.crop-btn.apply:hover{background:#0081d6}.layout.dark-mode .crop-modal{background:#1a1a1a!important}.layout.dark-mode .crop-header{border-bottom:1px solid #333!important}.layout.dark-mode .crop-controls{background:#1a1a1a!important;border-top:1px solid #333!important}@media (max-width: 768px){.crop-modal{width:95%}.crop-container{height:350px}.crop-frame{width:250px;height:250px}.crop-controls{padding:15px}.crop-btn{padding:10px;font-size:.9rem}}.crop-container{width:100%;height:400px;position:relative;overflow:hidden;background:#000;-webkit-user-select:none;user-select:none;touch-action:none;display:flex;align-items:center;justify-content:center}.crop-image-wrapper{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transform-origin:center center;will-change:transform;max-width:100%;max-height:100%}.crop-image-wrapper img{display:block;width:auto;height:auto;max-width:100%;max-height:100%}.crop-frame{position:absolute;top:50%;left:50%;width:300px;height:300px;transform:translate(-50%,-50%);border:2px solid white;box-shadow:0 0 0 9999px #000000b3;pointer-events:none}.crop-guide{position:absolute;top:33.33%;left:0;right:0;height:1px;background:#ffffff4d}.crop-guide:before{content:"";position:absolute;top:66.66%;left:0;right:0;height:1px;background:#ffffff4d}.crop-frame:before,.crop-frame:after{content:"";position:absolute;width:20px;height:20px;border:2px solid white}.crop-frame:before{top:-2px;left:-2px;border-right:none;border-bottom:none}.crop-frame:after{bottom:-2px;right:-2px;border-left:none;border-top:none}.crop-image-wrapper{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transform-origin:center center;will-change:transform;max-width:400px;max-height:400px;width:auto;height:auto}.crop-image-wrapper img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}.crop-container{position:relative;overflow:hidden;background:#000;-webkit-user-select:none;user-select:none;touch-action:none;width:400px;height:400px}.crop-image-wrapper{position:absolute;will-change:transform;cursor:move}.crop-image-wrapper img{display:block;pointer-events:none}.crop-frame{position:absolute;pointer-events:none;z-index:10}.crop-controls{display:flex;padding:20px;gap:12px;background:#252525;border-top:1px solid #333}.crop-btn{flex:1;padding:14px 20px;border:none;border-radius:8px;font-weight:600;cursor:pointer;font-size:1rem;transition:all .2s ease}.crop-btn.cancel{background:#4a5568;color:#fff}.crop-btn.cancel:hover{background:#2d3748;transform:translateY(-1px)}.crop-btn.reset{background:#718096;color:#fff}.crop-btn.reset:hover{background:#4a5568;transform:translateY(-1px)}.crop-btn.apply{background:linear-gradient(135deg,#0095f6,#0081d6);color:#fff}.crop-btn.apply:hover{background:linear-gradient(135deg,#0081d6,#006cbf);transform:translateY(-1px)}@media (max-width: 768px){.crop-modal{margin:20px;max-width:calc(100vw - 40px)}.crop-container{width:100%;height:auto;aspect-ratio:1 / 1}.crop-controls{flex-direction:column}.crop-btn{width:100%}}.crop-zoom-info{position:absolute;bottom:10px;right:10px;background:#000000b3;color:#fff;padding:4px 8px;border-radius:4px;font-size:.8rem;pointer-events:none}.crop-preview-hint{position:absolute;bottom:10px;left:50%;transform:translate(-50%);background:#000000b3;color:#fff;padding:6px 12px;border-radius:20px;font-size:.8rem;pointer-events:none;white-space:nowrap}@media (hover: none) and (pointer: coarse){.crop-btn{padding:16px 20px}.crop-container{touch-action:pan-x pan-y pinch-zoom}}.crop-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000f2;display:flex;align-items:center;justify-content:center;z-index:9999;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.crop-modal{background:#1a1a1a;border-radius:12px;width:auto;max-width:500px;overflow:hidden;box-shadow:0 20px 60px #00000080}.crop-header{padding:20px;text-align:center;border-bottom:1px solid #333;background:#252525}.crop-header h3{margin:0 0 8px;color:#fff;font-size:1.3rem;font-weight:600}.crop-header p{margin:0;color:#aaa;font-size:.9rem}.crop-container{padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#000;min-height:400px}:global(.ReactCrop){max-width:400px!important;max-height:400px!important}:global(.ReactCrop__crop-selection){border:2px solid #00ff00!important;box-shadow:0 0 0 9999px #000000b3!important}:global(.ReactCrop__drag-handle){width:12px!important;height:12px!important;background:#0f0!important;border:2px solid #000!important}:global(.ReactCrop__drag-handle:after){display:none!important}.crop-info{display:flex;gap:20px;margin-top:15px;color:#fff;font-size:.9rem}.crop-size,.output-size{background:#00000080;padding:8px 12px;border-radius:6px}.crop-info strong{color:#0f0;font-weight:600}.crop-controls{display:flex;padding:20px;gap:10px;background:#252525;border-top:1px solid #333;flex-wrap:wrap;justify-content:center}.crop-btn{flex:1;min-width:100px;padding:12px 16px;border:none;border-radius:8px;font-weight:600;cursor:pointer;font-size:.95rem;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:8px}.crop-btn.cancel{background:#dc3545;color:#fff}.crop-btn.cancel:hover{background:#c82333;transform:translateY(-1px)}.crop-btn.reset{background:#6c757d;color:#fff}.crop-btn.reset:hover{background:#5a6268;transform:translateY(-1px)}.crop-btn.square{background:#17a2b8;color:#fff}.crop-btn.square:hover{background:#138496;transform:translateY(-1px)}.crop-btn.full{background:#28a745;color:#fff}.crop-btn.full:hover{background:#218838;transform:translateY(-1px)}.crop-btn.apply{background:linear-gradient(135deg,#007bff,#0056b3);color:#fff}.crop-btn.apply:hover{background:linear-gradient(135deg,#0056b3,#004085);transform:translateY(-1px)}.crop-btn:active{transform:translateY(0)}.layout.dark-mode .crop-overlay{background:#000000f2}.layout.dark-mode .crop-modal{background:#1a1a1a}@media (max-width: 768px){.crop-modal{margin:10px;max-width:calc(100vw - 20px)}.crop-container{padding:10px}.crop-controls{flex-direction:column}.crop-btn{width:100%;min-width:unset}.crop-info{flex-direction:column;gap:10px;align-items:center}}@media (hover: none) and (pointer: coarse){.crop-btn{padding:16px 20px}:global(.ReactCrop__drag-handle){width:20px!important;height:20px!important}}:global(.ReactCrop__rule-of-thirds-vt:before),:global(.ReactCrop__rule-of-thirds-vt:after),:global(.ReactCrop__rule-of-thirds-hz:before),:global(.ReactCrop__rule-of-thirds-hz:after){background-color:#ffffff80!important}:global(.ReactCrop__drag-bar){background-color:#0f0!important}.image-warning{color:#ff6b6b;font-size:.85rem;margin-top:5px;display:block}.current-image-info{margin-top:10px;padding:10px;background:#f8f9fa;border-radius:8px;border:1px solid #e9ecef}.layout.dark-mode .current-image-info{background:#2d3748!important;border:1px solid #4a5568!important}.current-image-text{margin:0;color:#495057;font-weight:500}.layout.dark-mode .current-image-text{color:#e2e8f0!important}@keyframes marching-ants{0%{background-position:0 0,0 100%,0 0,100% 0}to{background-position:20px 0,-20px 100%,0 -20px,100% 20px}}:root{--rc-drag-handle-size: 12px;--rc-drag-handle-mobile-size: 24px;--rc-drag-handle-bg-colour: rgba(0, 0, 0, .2);--rc-drag-bar-size: 6px;--rc-border-color: rgba(255, 255, 255, .7);--rc-focus-color: #0088ff}.ReactCrop{position:relative;display:inline-block;cursor:crosshair;max-width:100%}.ReactCrop *,.ReactCrop *:before,.ReactCrop *:after{box-sizing:border-box}.ReactCrop--disabled,.ReactCrop--locked{cursor:inherit}.ReactCrop__child-wrapper{overflow:hidden;max-height:inherit}.ReactCrop__child-wrapper>img,.ReactCrop__child-wrapper>video{display:block;max-width:100%;max-height:inherit}.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__child-wrapper>img,.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__child-wrapper>video{touch-action:none}.ReactCrop:not(.ReactCrop--disabled) .ReactCrop__crop-selection{touch-action:none}.ReactCrop__crop-mask{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;width:calc(100% + .5px);height:calc(100% + .5px)}.ReactCrop__crop-selection{position:absolute;top:0;left:0;transform:translateZ(0);cursor:move}.ReactCrop--disabled .ReactCrop__crop-selection{cursor:inherit}.ReactCrop--circular-crop .ReactCrop__crop-selection{border-radius:50%}.ReactCrop--circular-crop .ReactCrop__crop-selection:after{pointer-events:none;content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border:1px solid var(--rc-border-color);opacity:.3}.ReactCrop--no-animate .ReactCrop__crop-selection{outline:1px dashed white}.ReactCrop__crop-selection:not(.ReactCrop--no-animate .ReactCrop__crop-selection){animation:marching-ants 1s;background-image:linear-gradient(to right,#fff 50%,#444 50%),linear-gradient(to right,#fff 50%,#444 50%),linear-gradient(to bottom,#fff 50%,#444 50%),linear-gradient(to bottom,#fff 50%,#444 50%);background-size:10px 1px,10px 1px,1px 10px,1px 10px;background-position:0 0,0 100%,0 0,100% 0;background-repeat:repeat-x,repeat-x,repeat-y,repeat-y;color:#fff;animation-play-state:running;animation-timing-function:linear;animation-iteration-count:infinite}.ReactCrop__crop-selection:focus{outline:2px solid var(--rc-focus-color);outline-offset:-1px}.ReactCrop--invisible-crop .ReactCrop__crop-mask,.ReactCrop--invisible-crop .ReactCrop__crop-selection{display:none}.ReactCrop__rule-of-thirds-vt:before,.ReactCrop__rule-of-thirds-vt:after,.ReactCrop__rule-of-thirds-hz:before,.ReactCrop__rule-of-thirds-hz:after{content:"";display:block;position:absolute;background-color:#fff6}.ReactCrop__rule-of-thirds-vt:before,.ReactCrop__rule-of-thirds-vt:after{width:1px;height:100%}.ReactCrop__rule-of-thirds-vt:before{left:33.3333333333%}.ReactCrop__rule-of-thirds-vt:after{left:66.6666666667%}.ReactCrop__rule-of-thirds-hz:before,.ReactCrop__rule-of-thirds-hz:after{width:100%;height:1px}.ReactCrop__rule-of-thirds-hz:before{top:33.3333333333%}.ReactCrop__rule-of-thirds-hz:after{top:66.6666666667%}.ReactCrop__drag-handle{position:absolute;width:var(--rc-drag-handle-size);height:var(--rc-drag-handle-size);background-color:var(--rc-drag-handle-bg-colour);border:1px solid var(--rc-border-color)}.ReactCrop__drag-handle:focus{background:var(--rc-focus-color)}.ReactCrop .ord-nw{top:0;left:0;transform:translate(-50%,-50%);cursor:nw-resize}.ReactCrop .ord-n{top:0;left:50%;transform:translate(-50%,-50%);cursor:n-resize}.ReactCrop .ord-ne{top:0;right:0;transform:translate(50%,-50%);cursor:ne-resize}.ReactCrop .ord-e{top:50%;right:0;transform:translate(50%,-50%);cursor:e-resize}.ReactCrop .ord-se{bottom:0;right:0;transform:translate(50%,50%);cursor:se-resize}.ReactCrop .ord-s{bottom:0;left:50%;transform:translate(-50%,50%);cursor:s-resize}.ReactCrop .ord-sw{bottom:0;left:0;transform:translate(-50%,50%);cursor:sw-resize}.ReactCrop .ord-w{top:50%;left:0;transform:translate(-50%,-50%);cursor:w-resize}.ReactCrop__disabled .ReactCrop__drag-handle{cursor:inherit}.ReactCrop__drag-bar{position:absolute}.ReactCrop__drag-bar.ord-n{top:0;left:0;width:100%;height:var(--rc-drag-bar-size);transform:translateY(-50%)}.ReactCrop__drag-bar.ord-e{right:0;top:0;width:var(--rc-drag-bar-size);height:100%;transform:translate(50%)}.ReactCrop__drag-bar.ord-s{bottom:0;left:0;width:100%;height:var(--rc-drag-bar-size);transform:translateY(50%)}.ReactCrop__drag-bar.ord-w{top:0;left:0;width:var(--rc-drag-bar-size);height:100%;transform:translate(-50%)}.ReactCrop--new-crop .ReactCrop__drag-bar,.ReactCrop--new-crop .ReactCrop__drag-handle,.ReactCrop--fixed-aspect .ReactCrop__drag-bar,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-n,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-e,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-s,.ReactCrop--fixed-aspect .ReactCrop__drag-handle.ord-w{display:none}@media (pointer: coarse){.ReactCrop .ord-n,.ReactCrop .ord-e,.ReactCrop .ord-s,.ReactCrop .ord-w{display:none}.ReactCrop__drag-handle{width:var(--rc-drag-handle-mobile-size);height:var(--rc-drag-handle-mobile-size)}}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:10000;animation:fadeIn .3s ease;padding:20px}.confirmation-modal{background:#fff;border-radius:16px;max-width:450px;width:100%;box-shadow:0 20px 60px #0000004d;animation:slideUp .3s ease;overflow:hidden}.modal-header{display:flex;align-items:center;padding:24px;border-bottom:2px solid;gap:12px}.modal-icon{font-size:1.5rem;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:50%;box-shadow:0 2px 8px #0000001a}.modal-title{flex:1}.modal-title h3{margin:0;color:#2c3e50;font-size:1.3rem;font-weight:600}.modal-close-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;color:#7f8c8d;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .3s ease}.modal-body p{margin:0;color:#5a6c7d;font-size:1rem;line-height:1.5;text-align:center}.modal-actions{display:flex;gap:12px;padding:0 24px 24px;justify-content:flex-end}.btn{padding:10px 20px;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:8px;min-width:80px;justify-content:center}.btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-secondary{background:#6c757d;color:#fff}.btn-secondary:hover:not(:disabled){background:#5a6268;transform:translateY(-1px)}.btn-danger{background:linear-gradient(135deg,#e74c3c,#c0392b);color:#fff;box-shadow:0 2px 8px #e74c3c4d}.btn-danger:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #e74c3c66}.btn-warning{background:linear-gradient(135deg,#f39c12,#e67e22);color:#fff;box-shadow:0 2px 8px #f39c124d}.btn-warning:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #f39c1266}.btn-info{background:linear-gradient(135deg,#3498db,#2980b9);color:#fff;box-shadow:0 2px 8px #3498db4d}.btn-info:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #3498db66}.btn-success{background:linear-gradient(135deg,#27ae60,#229954);color:#fff;box-shadow:0 2px 8px #27ae604d}.btn-success:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #27ae6066}.loading-spinner-small{width:16px;height:16px;border:2px solid transparent;border-top:2px solid currentColor;border-radius:50%;animation:spin 1s linear infinite}@media (max-width: 480px){.modal-overlay{padding:16px}.modal-header,.modal-body{padding:20px}.modal-actions{flex-direction:column;padding:0 20px 20px}.btn{width:100%}}.products-page{max-width:1200px;margin:0 auto;padding:20px}:root.dark-mode .products-page,.layout.dark-mode .products-page{background-color:var(--bg-primary, #4c4e5b)}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;flex-wrap:wrap;gap:20px}.page-header h1{color:#2c3e50;margin:0;font-size:2.2rem;font-weight:700;transition:color .3s ease}:root.dark-mode .page-header h1,.layout.dark-mode .page-header h1{color:var(--text-primary, #e2e8f0)}:root.dark-mode .btn-primary,.layout.dark-mode .btn-primary{background:linear-gradient(135deg,var(--primary-color, #4dabf7),var(--primary-hover, #339af0));box-shadow:0 2px 8px #4dabf74d}:root.dark-mode .btn-primary:hover,.layout.dark-mode .btn-primary:hover{box-shadow:0 4px 12px #4dabf766}.products-table{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 4px 20px #00000014;border:1px solid #e9ecef;transition:all .3s ease}:root.dark-mode .products-table,.layout.dark-mode .products-table{background:var(--card-bg, #252631);border:1px solid var(--border-color, #4a5568);box-shadow:var(--card-shadow, 0 4px 20px rgba(0, 0, 0, .3))}.products-table table{width:100%;border-collapse:collapse}.products-table th,.products-table td{padding:16px;text-align:left;border-bottom:1px solid #e9ecef;transition:all .3s ease}.products-table th{background:#f8f9fa;font-weight:600;color:#2c3e50;font-size:.9rem;text-transform:uppercase;letter-spacing:.5px;transition:all .3s ease}.products-table tr:hover{background-color:#f8f9fa;transition:background-color .3s ease}.products-table tr:last-child td{border-bottom:none}:root.dark-mode .products-table th,.layout.dark-mode .products-table th{background:var(--table-header-bg, #2d3748);color:var(--text-primary, #e2e8f0);border-bottom:2px solid var(--border-color, #4a5568)}:root.dark-mode .products-table td,.layout.dark-mode .products-table td{border-bottom:1px solid var(--border-color, #4a5568);color:var(--text-primary, #e2e8f0)}:root.dark-mode .products-table tr:hover,.layout.dark-mode .products-table tr:hover{background-color:var(--table-hover, #2d3748)}:root.dark-mode .products-table tr:last-child td,.layout.dark-mode .products-table tr:last-child td{border-bottom:none}.product-image-container{width:60px;height:60px;border-radius:8px;overflow:hidden;cursor:pointer;display:flex;align-items:center;justify-content:center;background-color:#f5f5f5;border:1px solid #e0e0e0;transition:all .3s ease}.product-image{width:100%;height:100%;object-fit:cover;transition:transform .3s ease;display:block}.product-image-container:hover .product-image{transform:scale(1.1)}.image-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease;color:#fff;font-size:12px}.product-image-container:hover .image-overlay{opacity:1}:root.dark-mode .image-overlay,.layout.dark-mode .image-overlay{background:#000c}.product-info{display:flex;flex-direction:column;gap:4px}.product-info strong{color:#2c3e50;font-weight:600;transition:color .3s ease}.product-info small{color:#7f8c8d;font-size:.85rem;line-height:1.4;transition:color .3s ease}:root.dark-mode .product-info strong,.layout.dark-mode .product-info strong{color:var(--text-primary, #e2e8f0)}:root.dark-mode .product-info small,.layout.dark-mode .product-info small{color:var(--text-secondary, #a0aec0)}.action-buttons{display:flex;gap:10px;justify-content:flex-start;min-width:140px}.btn-edit{background:linear-gradient(135deg,#f39c12,#e67e22);color:#fff;border:none;padding:10px 18px;border-radius:6px;cursor:pointer;font-size:.85rem;font-weight:500;transition:all .3s ease;box-shadow:0 2px 6px #f39c124d;min-width:60px;display:flex;align-items:center;justify-content:center;flex:1}.btn-delete{background:linear-gradient(135deg,#e74c3c,#c0392b);color:#fff;border:none;padding:10px 18px;border-radius:6px;cursor:pointer;font-size:.85rem;font-weight:500;transition:all .3s ease;box-shadow:0 2px 6px #e74c3c4d;min-width:70px;display:flex;align-items:center;justify-content:center;flex:1}:root.dark-mode .btn-edit,.layout.dark-mode .btn-edit{background:linear-gradient(135deg,#f39c12,#e67e22)}:root.dark-mode .btn-delete,.layout.dark-mode .btn-delete{background:linear-gradient(135deg,#e74c3c,#c0392b)}:root.dark-mode .status-active,.layout.dark-mode .status-active{background:#4caf5033;color:#4caf50}:root.dark-mode .status-inactive,.layout.dark-mode .status-inactive{background:#f4433633;color:#f44336}.image-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.image-modal-content{background:#fff;border-radius:16px;max-width:90%;max-height:90%;overflow:hidden;box-shadow:0 20px 60px #00000080;animation:slideUp .3s ease;border:1px solid transparent;transition:all .3s ease}.image-modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid #e9ecef;background:#f8f9fa;transition:all .3s ease}.image-modal-header h3{margin:0;color:#2c3e50;font-size:1.2rem;transition:color .3s ease}.modal-close-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;color:#7f8c8d;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .3s ease}.modal-close-btn:hover{background:#e74c3c;color:#fff}.image-modal-body{padding:24px;display:flex;justify-content:center;align-items:center;max-height:70vh}.image-modal-body img{max-width:400px;max-height:400px;width:auto;height:auto;object-fit:contain;border-radius:8px}:root.dark-mode .image-modal-overlay,.layout.dark-mode .image-modal-overlay{background:#000000f2}:root.dark-mode .image-modal-content,.layout.dark-mode .image-modal-content{background:var(--card-bg, #252631);border:1px solid var(--border-color, #4a5568)}:root.dark-mode .image-modal-header,.layout.dark-mode .image-modal-header{background:var(--bg-tertiary, #2d3748);border-bottom:1px solid var(--border-color, #4a5568)}:root.dark-mode .image-modal-header h3,.layout.dark-mode .image-modal-header h3{color:var(--text-primary, #e2e8f0)}:root.dark-mode .modal-close-btn,.layout.dark-mode .modal-close-btn{color:var(--text-secondary, #a0aec0)}:root.dark-mode .modal-close-btn:hover,.layout.dark-mode .modal-close-btn:hover{background:var(--error-color, #f56565);color:#fff}.loading,.error,.no-data{text-align:center;padding:60px 20px;background:#fff;border-radius:16px;margin:20px 0;box-shadow:0 4px 20px #00000014;border:1px solid transparent;transition:all .3s ease}.loading{color:#3498db;display:flex;flex-direction:column;align-items:center;gap:16px}.error{color:#e74c3c;background:#fdf2f2;border:1px solid #fbd5d5}.no-data{color:#7f8c8d;background:#f8f9fa}:root.dark-mode .loading,.layout.dark-mode .loading,:root.dark-mode .no-data,.layout.dark-mode .no-data{background:var(--card-bg, #252631);border:1px solid var(--border-color, #4a5568);box-shadow:var(--card-shadow, 0 4px 20px rgba(0, 0, 0, .3))}:root.dark-mode .loading,.layout.dark-mode .loading{color:var(--primary-color, #4dabf7)}:root.dark-mode .no-data,.layout.dark-mode .no-data{color:var(--text-secondary, #a0aec0)}:root.dark-mode .error,.layout.dark-mode .error{background:var(--bg-tertiary, #2d3748);color:var(--error-color, #f56565);border:1px solid var(--error-color, #f56565)}.product-addons{position:relative;display:inline-block}.addons-count{background:#e3f2fd;color:#1976d2;padding:4px 8px;border-radius:12px;font-size:.8rem;font-weight:500;cursor:pointer;transition:all .3s ease}.addons-tooltip{display:none;position:absolute;background:#fff;border:1px solid #e9ecef;border-radius:8px;padding:12px;box-shadow:0 4px 12px #0000001a;z-index:1000;min-width:200px;top:100%;left:0;transition:all .3s ease}.product-addons:hover .addons-tooltip{display:block}.addon-item{padding:4px 0;border-bottom:1px solid #f1f3f4;font-size:.85rem;transition:all .3s ease}.addon-item:last-child{border-bottom:none}.no-addons{color:#6c757d;font-style:italic;font-size:.85rem;transition:color .3s ease}:root.dark-mode .addons-count,.layout.dark-mode .addons-count{background:var(--primary-light, #1a365d);color:var(--primary-color, #4dabf7)}:root.dark-mode .addons-tooltip,.layout.dark-mode .addons-tooltip{background:var(--card-bg, #252631);border:1px solid var(--border-color, #4a5568);box-shadow:var(--card-shadow, 0 4px 12px rgba(0, 0, 0, .3));color:var(--text-primary, #e2e8f0)}:root.dark-mode .addon-item,.layout.dark-mode .addon-item{border-bottom:1px solid var(--border-light, #2d3748);color:var(--text-primary, #e2e8f0)}:root.dark-mode .no-addons,.layout.dark-mode .no-addons{color:var(--text-muted, #718096)}@media (max-width: 768px){.products-page{padding:16px}.page-header{flex-direction:column;align-items:stretch}.page-header h1{font-size:1.8rem}.products-table{overflow-x:auto}.products-table table{min-width:800px}.btn-edit,.btn-delete{padding:6px 12px;font-size:.8rem}}:root.dark-mode *,.layout.dark-mode *{transition:background-color .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease}.image-fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:#adb5bd;font-size:24px;background:#f8f9fa}.dark-mode .image-fallback{background:#2d3748;color:#718096}.category-form-page{max-width:800px;margin:0 auto;padding:24px;background:#f5f5f5;min-height:100vh}.layout.dark-mode .category-form-page{background:#252631!important;color:#e2e8f0!important}.form-header{margin-bottom:32px;text-align:center}.form-header h1{font-size:2rem;font-weight:700;color:#2d3748;margin-bottom:8px;transition:color .3s ease}.form-header p{color:#252631;font-size:1rem;transition:color .3s ease}.layout.dark-mode .form-header h1{color:#e2e8f0!important}.layout.dark-mode .form-header p{color:#a0aec0!important}.category-form{border-radius:16px;padding:32px;box-shadow:0 2px 12px #00000014;border:1px solid #e2e8f0;transition:all .3s ease}.layout.dark-mode .category-form{background:#252631!important;border:1px solid #252631!important;box-shadow:0 2px 12px #0000004d!important}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:32px}@media (max-width: 768px){.form-grid{grid-template-columns:1fr}}.form-label{font-weight:600;color:#2d3748;margin-bottom:8px;font-size:.9rem;transition:color .3s ease}.form-input,.form-textarea{padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-size:1rem;transition:all .2s ease;background:#fff;color:#2d3748}.form-input:focus,.form-textarea:focus{outline:none;border-color:#4299e1;box-shadow:0 0 0 3px #4299e11a}.form-input.error,.form-textarea.error{border-color:#e53e3e}.layout.dark-mode .form-input,.layout.dark-mode .form-textarea{background:#2d3748!important;border:2px solid #4a5568!important;color:#e2e8f0!important}.layout.dark-mode .form-input::placeholder,.layout.dark-mode .form-textarea::placeholder{color:#a0aec0!important}.layout.dark-mode .form-input:focus,.layout.dark-mode .form-textarea:focus{border-color:#4dabf7!important;box-shadow:0 0 0 3px #4dabf71a!important}.layout.dark-mode .form-input.error,.layout.dark-mode .form-textarea.error{border-color:#f56565!important}.error-message{color:#e53e3e;font-size:.8rem;margin-top:4px;font-weight:500;transition:color .3s ease}.help-text{color:#718096;font-size:.8rem;margin-top:4px;line-height:1.4;transition:color .3s ease}.layout.dark-mode .error-message{color:#f56565!important}.layout.dark-mode .help-text{color:#a0aec0!important}.checkbox-label{display:flex;align-items:center;cursor:pointer;font-weight:500;color:#2d3748;transition:color .3s ease}.checkbox-custom{width:20px;height:20px;border:2px solid #cbd5e0;border-radius:4px;margin-right:12px;position:relative;transition:all .2s ease;background:#fff}.checkbox-input:checked+.checkbox-custom{background:#4299e1;border-color:#4299e1}.checkbox-input:disabled+.checkbox-custom{background:#f7fafc;border-color:#e2e8f0;cursor:not-allowed}.layout.dark-mode .checkbox-input:disabled+.checkbox-custom{background:#1a1b23!important;border-color:#4a5568!important}.form-actions{display:flex;justify-content:flex-end;gap:16px;padding-top:24px;border-top:1px solid #e2e8f0;transition:border-color .3s ease}.layout.dark-mode .form-actions{border-top:1px solid #252631!important}.btn-primary,.btn-secondary{padding:12px 24px;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .2s ease;font-size:.9rem}.btn-primary{background:#4299e1;color:#fff}.btn-primary:hover:not(:disabled){background:#3182ce;transform:translateY(-1px)}.btn-primary:disabled{background:#cbd5e0;cursor:not-allowed;transform:none}.btn-secondary{background:#fff;color:#4a5568;border:2px solid #e2e8f0}.btn-secondary:hover:not(:disabled){background:#f7fafc;border-color:#cbd5e0}.btn-secondary:disabled{color:#a0aec0;cursor:not-allowed}.layout.dark-mode .btn-primary:hover:not(:disabled){background:#339af0!important}.layout.dark-mode .btn-primary:disabled{background:#4a5568!important;color:#a0aec0!important}.layout.dark-mode .btn-secondary{background:#252631!important;color:#e2e8f0!important;border:2px solid #4a5568!important}.layout.dark-mode .btn-secondary:hover:not(:disabled){background:#2d3748!important;border-color:#a0aec0!important}.layout.dark-mode .btn-secondary:disabled{color:#718096!important;background:#1a1b23!important}@media (max-width: 768px){.category-form-page{padding:16px}.category-form{padding:24px}.form-grid{grid-template-columns:1fr;gap:20px}.form-actions{flex-direction:column-reverse}.btn-primary,.btn-secondary{width:100%}}.layout.dark-mode .category-form,.layout.dark-mode .form-input,.layout.dark-mode .form-textarea,.layout.dark-mode .checkbox-custom,.layout.dark-mode .btn-primary,.layout.dark-mode .btn-secondary{transition:background-color .3s ease,border-color .3s ease,color .3s ease,box-shadow .3s ease!important}.categories-page{padding:24px;max-width:1200px;margin:0 auto;background:#f5f5f5;min-height:100vh}.layout.dark-mode .categories-page{background:#4c4e5b!important;color:#e2e8f0!important}.page-header{margin-bottom:32px}.header-content{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.header-text h1{font-size:2rem;font-weight:700;color:#2d3748;margin-bottom:8px;transition:color .3s ease}.header-text p{color:#718096;font-size:1rem;transition:color .3s ease}.layout.dark-mode .header-text h1{color:#e2e8f0!important}.layout.dark-mode .header-text p{color:#a0aec0!important}.btn-primary{background:#4299e1;color:#fff;border:none;padding:12px 24px;border-radius:8px;cursor:pointer;font-weight:600;transition:all .2s ease;white-space:nowrap}.btn-primary:hover{background:#3182ce;transform:translateY(-1px)}.layout.dark-mode .btn-primary{background:#4dabf7!important}.layout.dark-mode .btn-primary:hover{background:#339af0!important}.stats-overview{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:32px}.stat-label{font-size:.9rem;color:#718096;font-weight:500;transition:color .3s ease}.categories-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:24px}.category-card{background:#fff;border-radius:16px;padding:24px;box-shadow:0 2px 12px #00000014;border:1px solid #f3f4f6;transition:all .3s ease;display:flex;flex-direction:column}.category-card:hover{transform:translateY(-4px);box-shadow:0 8px 25px #00000026}.layout.dark-mode .category-card{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 2px 12px #0000004d!important}.layout.dark-mode .category-card:hover{box-shadow:0 8px 25px #0006!important;border-color:#4dabf7!important}.category-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}.category-info{flex:1}.category-name{font-size:1.25rem;font-weight:600;color:#2d3748;margin-bottom:8px;transition:color .3s ease}.category-description{color:#718096;font-size:.9rem;line-height:1.4;margin:0;transition:color .3s ease}.category-status{flex-shrink:0}.layout.dark-mode .category-name{color:#e2e8f0!important}.layout.dark-mode .category-description{color:#a0aec0!important}.status-badge{padding:6px 12px;border-radius:20px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.status-badge.active{background:#c6f6d5;color:#22543d}.status-badge.inactive{background:#fed7d7;color:#742a2a}.category-stats{display:flex;justify-content:space-around;margin:20px 0;padding:16px 0;border-top:1px solid #f7fafc;border-bottom:1px solid #f7fafc;transition:border-color .3s ease}.layout.dark-mode .category-stats{border-top:1px solid #4a5568!important;border-bottom:1px solid #4a5568!important}.stat-item{text-align:center}.stat-value{display:block;font-size:1.5rem;font-weight:700;color:#4299e1;margin-bottom:4px;transition:color .3s ease}.stat-label{font-size:.8rem;color:#718096;font-weight:500;transition:color .3s ease}.layout.dark-mode .stat-item .stat-label{color:#a0aec0!important}.category-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:auto}.btn-add-product{display:flex;align-items:center;gap:6px;padding:8px 16px;background:#48bb78;color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:.85rem;font-weight:500;transition:all .2s ease}.btn-add-product:hover{background:#38a169;transform:scale(1.05)}.btn-edit,.btn-delete{padding:8px 12px;border:none;border-radius:6px;cursor:pointer;font-size:.8rem;font-weight:500;transition:all .2s ease}.btn-edit{background:#ed8936;color:#fff}.btn-edit:hover{background:#d71}.btn-delete{background:#e53e3e;color:#fff}.btn-delete:hover{background:#c53030}.layout.dark-mode .btn-add-product{background:#48bb78!important}.layout.dark-mode .btn-add-product:hover{background:#38a169!important}.layout.dark-mode .btn-edit{background:#ed8936!important}.layout.dark-mode .btn-edit:hover{background:#d71!important}.empty-category-notice{text-align:center;padding:16px;background:#f7fafc;border-radius:8px;margin-top:16px;transition:all .3s ease}.empty-category-notice p{color:#718096;margin-bottom:8px;font-size:.9rem;transition:color .3s ease}.categories-page .btn-text{background:none;border:none;color:#4299e1;cursor:pointer;font-size:.85rem;font-weight:500}.btn-text:hover{text-decoration:underline}.layout.dark-mode .empty-category-notice{background:#2d3748!important;border:1px solid #4a5568!important}.layout.dark-mode .empty-category-notice p{color:#a0aec0!important}.categories-page .layout.dark-mode .btn-text{color:#4dabf7!important}.no-categories{text-align:center;padding:60px 20px;background:#fff;border-radius:16px;box-shadow:0 2px 12px #00000014;border:1px solid transparent;transition:all .3s ease}.no-categories-icon{font-size:4rem;margin-bottom:20px}.no-categories h3{font-size:1.5rem;color:#2d3748;margin-bottom:12px;transition:color .3s ease}.no-categories p{color:#718096;margin-bottom:24px;transition:color .3s ease}.layout.dark-mode .no-categories{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 2px 12px #0000004d!important}.layout.dark-mode .no-categories h3{color:#e2e8f0!important}.layout.dark-mode .no-categories p{color:#a0aec0!important}.loading,.error{text-align:center;padding:60px 20px;font-size:1.1rem;background:#fff;border-radius:12px;border:1px solid transparent;transition:all .3s ease}.layout.dark-mode .loading{background:#252631!important;border:1px solid #4a5568!important;color:#4dabf7!important}.layout.dark-mode .error{background:#2d3748!important;border:1px solid #f56565!important;color:#f56565!important}.stat-item.clickable{cursor:pointer;transition:all .2s ease;border-radius:6px;padding:4px}.stat-item.clickable:hover{background:#007bff1a;transform:translateY(-1px)}.stat-item.clickable:active{transform:translateY(0)}.layout.dark-mode .stat-item.clickable:hover{background:#4dabf733!important}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal-content{background:#fff;border-radius:12px;width:100%;max-width:500px;max-height:80vh;overflow-y:auto;box-shadow:0 10px 40px #0003;border:1px solid transparent}.modal-header{padding:20px;border-bottom:1px solid #e9ecef;display:flex;justify-content:space-between;align-items:center}.modal-header h3{margin:0;color:#2c3e50;font-size:18px}.modal-body{padding:20px}.products-list,.orders-list{display:flex;flex-direction:column;gap:12px}.product-item,.order-item{padding:16px;background:#f8f9fa;border-radius:8px;border-left:4px solid #007bff;transition:all .3s ease}.product-info h4,.order-info h4{margin:0 0 8px;color:#2c3e50;font-size:16px}.product-info p,.order-info p{margin:0 0 8px;color:#6c757d;font-size:14px}.product-meta,.order-meta{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.price,.total{font-weight:600;color:#28a745}.prep-time,.date{color:#6c757d;font-size:13px}.status{padding:4px 8px;border-radius:12px;font-size:12px;font-weight:500}.status.active{background:#d4edda;color:#155724}.status.inactive{background:#f8d7da;color:#721c24}.status.pending{background:#fff3cd;color:#856404}.status.completed{background:#d1ecf1;color:#0c5460}.no-data{text-align:center;color:#6c757d;font-style:italic;padding:40px 20px}.layout.dark-mode .modal-overlay{background:#000000b3}.layout.dark-mode .modal-content{background:#252631!important;border:1px solid #4a5568!important}.layout.dark-mode .modal-header{border-bottom:1px solid #4a5568!important}.layout.dark-mode .product-item,.layout.dark-mode .order-item{background:#2d3748!important;border-left:4px solid #4dabf7!important}.layout.dark-mode .product-info h4,.layout.dark-mode .order-info h4{color:#e2e8f0!important}.layout.dark-mode .product-info p,.layout.dark-mode .order-info p{color:#a0aec0!important}.layout.dark-mode .price,.layout.dark-mode .total{color:#48bb78!important}.layout.dark-mode .prep-time,.layout.dark-mode .date,.layout.dark-mode .no-data{color:#a0aec0!important}.layout.dark-mode .status.active{background:#4caf5033!important;color:#4caf50!important}.layout.dark-mode .status.inactive{background:#f4433633!important;color:#f44336!important}.layout.dark-mode .status.pending{background:#ffc10733!important;color:#ffc107!important}.layout.dark-mode .status.completed{background:#17a2b833!important;color:#17a2b8!important}.orders-stats{margin-bottom:20px;padding:12px;background:#e9ecef;border-radius:6px;text-align:center;transition:all .3s ease}.orders-count{margin:0;font-weight:500;color:#495057;transition:color .3s ease}.order-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.order-header h4{margin:0;color:#2c3e50}.order-info p{margin:4px 0;font-size:14px;color:#495057}.order-info strong{color:#2c3e50}.status-badge{padding:4px 8px;border-radius:12px;font-size:11px;font-weight:600;text-transform:uppercase;color:#fff}.layout.dark-mode .orders-stats{background:#2d3748!important}.layout.dark-mode .orders-count,.layout.dark-mode .order-header h4{color:#e2e8f0!important}.layout.dark-mode .order-info p{color:#a0aec0!important}.layout.dark-mode .order-info strong{color:#e2e8f0!important}@media (max-width: 768px){.categories-page{padding:16px}.header-content{flex-direction:column;align-items:stretch}.categories-grid{grid-template-columns:1fr}.category-actions{flex-direction:column;align-items:stretch}.btn-add-product{justify-content:center;margin-bottom:12px}.action-buttons{justify-content:center}}.layout.dark-mode .stat-card,.layout.dark-mode .category-card,.layout.dark-mode .category-stats,.layout.dark-mode .modal-content,.layout.dark-mode .product-item,.layout.dark-mode .order-item{transition:background-color .3s ease,border-color .3s ease,box-shadow .3s ease!important}.addons-page{max-width:1200px;margin:0 auto;padding:20px;background:#f5f5f5;min-height:100vh}.layout.dark-mode .addons-page{background:#4c4e5b!important;color:#e2e8f0!important}.page-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:30px;flex-wrap:wrap;gap:20px}.header-content h1{color:#2c3e50;margin:0 0 8px;font-size:2.2rem;font-weight:700;transition:color .3s ease}.header-content p{color:#7f8c8d;margin:0;font-size:1.1rem;transition:color .3s ease}.layout.dark-mode .header-content h1{color:#e2e8f0!important}.layout.dark-mode .header-content p{color:#a0aec0!important}.btn-primary{background:linear-gradient(135deg,#3498db,#2980b9);color:#fff;border:none;padding:12px 24px;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #3498db4d;display:flex;align-items:center;gap:8px}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #3498db66}.layout.dark-mode .btn-primary{background:linear-gradient(135deg,#4dabf7,#339af0)!important;box-shadow:0 2px 8px #4dabf74d!important}.layout.dark-mode .btn-primary:hover{box-shadow:0 4px 12px #4dabf766!important}.addon-form-container{background:#fff;border-radius:16px;padding:30px;box-shadow:0 4px 20px #00000014;border:1px solid #e9ecef;margin-bottom:30px;transition:all .3s ease}.layout.dark-mode .addon-form-container{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 4px 20px #0000004d!important}.addon-form h2{color:#2c3e50;margin-bottom:25px;font-size:1.5rem;font-weight:600;border-bottom:2px solid #e9ecef;padding-bottom:12px;transition:all .3s ease}.layout.dark-mode .addon-form h2{color:#e2e8f0!important;border-bottom:2px solid #4a5568!important}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}@media (max-width: 768px){.form-row{grid-template-columns:1fr}}.form-input,.form-select{padding:12px 16px;border:2px solid #e9ecef;border-radius:8px;font-size:1rem;transition:all .3s ease;background:#fff;color:#2c3e50}.form-input:focus,.form-select:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.form-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232c3e50' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 12px center;background-size:16px;padding-right:40px;cursor:pointer}.layout.dark-mode .form-input,.layout.dark-mode .form-select{background:#2d3748!important;border:2px solid #4a5568!important;color:#e2e8f0!important}.layout.dark-mode .form-input::placeholder,.layout.dark-mode .form-select::placeholder{color:#a0aec0!important}.layout.dark-mode .form-input:focus,.layout.dark-mode .form-select:focus{border-color:#4dabf7!important;box-shadow:0 0 0 3px #4dabf71a!important}.form-help{color:#7f8c8d;font-size:.8rem;margin-top:4px;transition:color .3s ease}.layout.dark-mode .form-help{color:#a0aec0!important}.form-actions{display:flex;justify-content:flex-end;gap:12px;padding-top:20px;border-top:1px solid #e9ecef;transition:border-color .3s ease}.btn-secondary{background:#6c757d;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease}.layout.dark-mode .btn-secondary{background:#4a5568!important;color:#e2e8f0!important}.layout.dark-mode .btn-secondary:hover{background:#2d3748!important}.addons-content{background:#f5f5f5;border-radius:16px;padding:30px;box-shadow:0 4px 20px #00000014;transition:all .3s ease}.layout.dark-mode .addons-content{background:#494a56!important;border:1px solid #4a5568!important;box-shadow:0 4px 20px #0000004d!important}.addons-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:30px}.stat-card{background:linear-gradient(135deg,#f8f9fa,#e9ecef);padding:20px;border-radius:12px;text-align:center;border:1px solid #e9ecef;transition:all .3s ease}.layout.dark-mode .stat-card{background:linear-gradient(135deg,#2d3748,#4a5568)!important;border:1px solid #4a5568!important}.stat-number{display:block;font-size:2rem;font-weight:700;color:#2c3e50;margin-bottom:8px;transition:color .3s ease}.stat-label{color:#7f8c8d;font-size:.9rem;font-weight:500;transition:color .3s ease}.addons-table-container{overflow-x:auto;border-radius:8px;border:1px solid #e9ecef;transition:border-color .3s ease}.layout.dark-mode .addons-table-container{border:1px solid #4a5568!important}.addons-table{width:100%;border-collapse:collapse}.addons-table th,.addons-table td{padding:16px;text-align:left;border-bottom:1px solid #e9ecef;transition:all .3s ease}.addons-table th{background:#f8f9fa;font-weight:600;color:#2c3e50;font-size:.9rem;text-transform:uppercase;letter-spacing:.5px;transition:all .3s ease}.addons-table tr:hover{background-color:#f8f9fa;transition:background-color .3s ease}.addons-table tr:last-child td{border-bottom:none}.layout.dark-mode .addons-table th{background:#2d3748!important;color:#e2e8f0!important;border-bottom:2px solid #4a5568!important}.layout.dark-mode .addons-table td{border-bottom:1px solid #4a5568!important;color:#e2e8f0!important}.layout.dark-mode .addons-table tr:hover{background-color:#2d3748!important}.layout.dark-mode .addons-table tr:last-child td{border-bottom:none!important}.addon-name strong{color:#2c3e50;font-weight:600;transition:color .3s ease}.layout.dark-mode .addon-name strong{color:#e2e8f0!important}.category-badge{background:#e3f2fd;color:#1976d2;padding:6px 12px;border-radius:20px;font-size:.8rem;font-weight:500;transition:all .3s ease}.product-tag{background:#f3e5f5;color:#7b1fa2;padding:4px 8px;border-radius:12px;font-size:.8rem;font-weight:500;transition:all .3s ease}.status-badge{padding:6px 12px;border-radius:20px;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.status-active{background:#d4edda;color:#155724}.status-inactive{background:#f8d7da;color:#721c24}.layout.dark-mode .category-badge{background:#4dabf733!important;color:#4dabf7!important}.layout.dark-mode .product-tag{background:#ba68c833!important;color:#ba68c8!important}.layout.dark-mode .status-active{background:#4caf5033!important;color:#4caf50!important}.layout.dark-mode .status-inactive{background:#f4433633!important;color:#f44336!important}.action-buttons{display:flex;gap:8px}.btn-edit,.btn-delete{border:none;padding:8px;border-radius:6px;cursor:pointer;font-size:1rem;transition:all .3s ease;width:36px;height:36px;display:flex;align-items:center;justify-content:center}.btn-edit{background:linear-gradient(135deg,#f39c12,#e67e22);color:#fff;box-shadow:0 2px 6px #f39c124d}.btn-edit:hover{transform:translateY(-1px);box-shadow:0 4px 8px #f39c1266}.btn-delete{background:linear-gradient(135deg,#e74c3c,#c0392b);color:#fff;box-shadow:0 2px 6px #e74c3c4d}.btn-delete:hover{transform:translateY(-1px);box-shadow:0 4px 8px #e74c3c66}.layout.dark-mode .btn-edit{background:linear-gradient(135deg,#f39c12,#e67e22)!important}.layout.dark-mode .btn-delete{background:linear-gradient(135deg,#e74c3c,#c0392b)!important}.empty-state{text-align:center;padding:60px 20px;color:#7f8c8d;border-radius:12px;background:#fff;border:1px solid #e9ecef;transition:all .3s ease}.empty-state-icon{font-size:4rem;margin-bottom:20px}.empty-state h3{color:#2c3e50;margin-bottom:12px;transition:color .3s ease}.empty-state p{margin-bottom:24px;font-size:1.1rem;transition:color .3s ease}.layout.dark-mode .empty-state{background:#252631!important;border:1px solid #4a5568!important;color:#a0aec0!important}.layout.dark-mode .empty-state h3{color:#e2e8f0!important}.layout.dark-mode .empty-state p{color:#a0aec0!important}.loading-container,.error-message{text-align:center;padding:60px 20px;background:#fff;border-radius:16px;margin:20px 0;box-shadow:0 4px 20px #00000014;border:1px solid transparent;transition:all .3s ease}.loading-spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #3498db;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 16px;transition:all .3s ease}.error-message h3{color:#e74c3c;margin-bottom:12px;transition:color .3s ease}.layout.dark-mode .loading-container,.layout.dark-mode .error-message{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 4px 20px #0000004d!important}.layout.dark-mode .loading-spinner{border:4px solid #2d3748!important;border-top:4px solid #4dabf7!important}.layout.dark-mode .error-message h3{color:#f56565!important}@media (max-width: 768px){.addons-page{padding:16px}.page-header{flex-direction:column;align-items:stretch}.form-row,.addons-stats{grid-template-columns:1fr}.addons-table{min-width:800px}.action-buttons{flex-direction:column;gap:6px}.btn-edit,.btn-delete{width:32px;height:32px;font-size:.9rem}}.layout.dark-mode .addon-form-container,.layout.dark-mode .addons-content,.layout.dark-mode .stat-card,.layout.dark-mode .empty-state,.layout.dark-mode .loading-container,.layout.dark-mode .error-message,.layout.dark-mode .form-input,.layout.dark-mode .form-select,.layout.dark-mode .btn-primary,.layout.dark-mode .btn-secondary,.layout.dark-mode .btn-edit,.layout.dark-mode .btn-delete{transition:background-color .3s ease,border-color .3s ease,color .3s ease,box-shadow .3s ease!important}.orders-page{padding:20px;background-color:#f8f9fa;min-height:100vh}.layout.dark-mode .orders-page{background:#4c4e5b!important;color:#e2e8f0!important}.orders-content{background:#fff;border-radius:12px;box-shadow:0 2px 20px #00000014;overflow:hidden;border:1px solid transparent;transition:all .3s ease}.layout.dark-mode .orders-content{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 2px 20px #0000004d!important}.layout.dark-mode .tabs{background:#252631!important;border-bottom:1px solid #252631!important}.layout.dark-mode .tab{background:#494a56!important;color:#a0aec0!important;border:1px solid #494a56!important}.layout.dark-mode .tab:hover{color:#e2e8f0!important;background:#494a56!important}.layout.dark-mode .tab.active{background:#494a56!important;color:#4dabf7!important;border-color:#4a5568!important;border-bottom-color:#252631!important;box-shadow:0 -2px 4px #0000001a!important}.loading,.error,.no-data{text-align:center;padding:60px 20px;color:#494a56;font-size:16px;transition:all .3s ease}.layout.dark-mode .loading,.layout.dark-mode .no-data{color:#a0aec0!important}.layout.dark-mode .error{color:#f56565!important;background:#494a56!important;border:1px solid #f56565!important}.orders-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:20px;padding:24px}.order-card{background:#fff;border:1px solid #e9ecef;border-radius:12px;padding:20px;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #0000000f}.order-card:hover{transform:translateY(-2px);box-shadow:0 4px 20px #0000001f;border-color:#007bff}.layout.dark-mode .order-card{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 2px 8px #0000004d!important}.layout.dark-mode .order-card:hover{box-shadow:0 4px 20px #0006!important;border-color:#4dabf7!important}.order-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid #f1f3f4;transition:border-color .3s ease}.layout.dark-mode .order-card-header{border-bottom:1px solid #4a5568!important}.order-id{font-family:Courier New,monospace;font-weight:600;color:#495057;font-size:14px;transition:color .3s ease}.status-badge{display:inline-block;padding:6px 12px;border-radius:20px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#fff;text-align:center;min-width:80px}.layout.dark-mode .order-id{color:#e2e8f0!important}.order-card-body,.customer-info{margin-bottom:16px}.customer-info strong{color:#2c3e50;font-weight:600;font-size:16px;display:block;margin-bottom:4px;transition:color .3s ease}.customer-info .phone{font-size:13px;color:#6c757d;transition:color .3s ease}.layout.dark-mode .customer-info strong{color:#e2e8f0!important}.layout.dark-mode .customer-info .phone{color:#a0aec0!important}.order-items-preview{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.order-item-preview{display:flex;align-items:center;gap:8px;padding:8px;background:#f8f9fa;border-radius:6px;font-size:13px;transition:all .3s ease}.item-quantity{font-weight:600;color:#007bff;min-width:24px;transition:color .3s ease}.item-name{color:#495057;flex:1;transition:color .3s ease}.more-items{font-size:12px;color:#6c757d;font-style:italic;padding:6px;background:#e9ecef;border-radius:4px;text-align:center;transition:all .3s ease}.no-items{font-size:13px;color:#6c757d;font-style:italic;text-align:center;padding:8px;background:#f8f9fa;border-radius:6px;transition:all .3s ease}.layout.dark-mode .order-item-preview{background:#2d3748!important}.layout.dark-mode .item-quantity{color:#4dabf7!important}.layout.dark-mode .item-name{color:#e2e8f0!important}.layout.dark-mode .more-items,.layout.dark-mode .no-items{background:#2d3748!important;color:#a0aec0!important}.order-meta{display:flex;justify-content:space-between;align-items:center;padding-top:12px;border-top:1px solid #f1f3f4;transition:border-color .3s ease}.order-total{font-weight:700;color:#28a745;font-size:16px;transition:color .3s ease}.order-time{font-size:12px;color:#6c757d;transition:color .3s ease}.layout.dark-mode .order-meta{border-top:1px solid #4a5568!important}.layout.dark-mode .order-total{color:#48bb78!important}.layout.dark-mode .order-time{color:#a0aec0!important}.order-card-footer{display:flex;justify-content:flex-end}.status-select-wrapper{position:relative;width:100%}.status-select{width:100%;padding:10px 36px 10px 16px;border:1.5px solid #e1e5e9;border-radius:8px;font-size:13px;font-weight:500;background:#fff;color:#2c3e50;cursor:pointer;transition:all .2s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236c757d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 12px center;background-size:14px}.status-select:hover{border-color:#007bff;background-color:#f8fbff}.status-select:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 3px #007bff1a}.layout.dark-mode .status-select{background:#2d3748!important;border:1.5px solid #4a5568!important;color:#e2e8f0!important}.layout.dark-mode .status-select:hover{border-color:#4dabf7!important;background-color:#2d3748!important}.layout.dark-mode .status-select:focus{border-color:#4dabf7!important;box-shadow:0 0 0 3px #4dabf71a!important}.status-select[value=pending]{border-left:3px solid #ffc107}.status-select[value=confirmed]{border-left:3px solid #17a2b8}.status-select[value=preparing]{border-left:3px solid #007bff}.status-select[value=ready]{border-left:3px solid #28a745}.status-select[value=completed]{border-left:3px solid #6c757d}.status-select[value=cancelled]{border-left:3px solid #dc3545}.layout.dark-mode .status-select[value=pending]{border-left:3px solid #ffc107!important}.layout.dark-mode .status-select[value=confirmed]{border-left:3px solid #17a2b8!important}.layout.dark-mode .status-select[value=preparing]{border-left:3px solid #4dabf7!important}.layout.dark-mode .status-select[value=ready]{border-left:3px solid #48bb78!important}.layout.dark-mode .status-select[value=completed]{border-left:3px solid #a0aec0!important}.layout.dark-mode .status-select[value=cancelled]{border-left:3px solid #f56565!important}.status-select option{padding:12px 16px;font-weight:500;border-radius:4px;margin:2px 0}.status-select option[value=pending]{background:#fffbf0;color:#856404}.status-select option[value=confirmed]{background:#f0fdff;color:#0c5460}.status-select option[value=preparing]{background:#f0f7ff;color:#004085}.status-select option[value=ready]{background:#f0fff4;color:#155724}.status-select option[value=completed]{background:#f8f9fa;color:#383d41}.status-select option[value=cancelled]{background:#fff5f5;color:#721c24}.layout.dark-mode .status-select option{background:#2d3748!important;color:#e2e8f0!important}.layout.dark-mode .status-select option[value=pending]{background:#ffc1071a!important;color:#ffc107!important}.layout.dark-mode .status-select option[value=confirmed]{background:#17a2b81a!important;color:#17a2b8!important}.layout.dark-mode .status-select option[value=preparing]{background:#4dabf71a!important;color:#4dabf7!important}.layout.dark-mode .status-select option[value=ready]{background:#48bb781a!important;color:#48bb78!important}.layout.dark-mode .status-select option[value=completed]{background:#a0aec01a!important;color:#a0aec0!important}.layout.dark-mode .status-select option[value=cancelled]{background:#f565651a!important;color:#f56565!important}.order-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.order-modal-content{background:#fff;border-radius:12px;width:100%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 10px 40px #0003;border:1px solid transparent;transition:all .3s ease}.order-modal-header{padding:24px;border-bottom:1px solid #e9ecef;display:flex;justify-content:space-between;align-items:center;transition:border-color .3s ease}.order-modal-header h3{margin:0;color:#2c3e50;font-size:20px;transition:color .3s ease}.layout.dark-mode .order-modal-overlay{background:#000000b3!important}.layout.dark-mode .order-modal-content{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 10px 40px #0000004d!important}.layout.dark-mode .order-modal-header{border-bottom:1px solid #4a5568!important}.layout.dark-mode .order-modal-header h3{color:#e2e8f0!important}.order-modal-body{padding:24px}.order-detail-section{margin-bottom:24px}.order-detail-section h4{margin:0 0 16px;color:#495057;font-size:16px;font-weight:600;transition:color .3s ease}.order-info-grid{display:grid;gap:12px}.info-item{display:flex;justify-content:space-between;align-items:center;padding:8px 0}.info-item label{font-weight:500;color:#6c757d;font-size:14px;transition:color .3s ease}.info-item span{color:#2c3e50;font-size:14px;transition:color .3s ease}.total-amount{font-weight:700;color:#28a745;font-size:16px!important;transition:color .3s ease}.customer-details{display:grid;gap:12px}.order-items-list{display:flex;flex-direction:column;gap:8px}.order-item-detail{display:flex;justify-content:space-between;align-items:flex-start;padding:12px;background:#f8f9fa;border-radius:8px;transition:all .3s ease}.order-item-info{flex:1}.order-item-name{font-weight:600;color:#2c3e50;margin-bottom:4px;font-size:14px;transition:color .3s ease}.order-item-quantity{font-size:13px;color:#6c757d;transition:color .3s ease}.order-item-price{font-weight:600;color:#28a745;font-size:14px;transition:color .3s ease}.order-total-section{border-top:2px solid #e9ecef;padding-top:16px;transition:border-color .3s ease}.order-total{display:flex;justify-content:space-between;align-items:center;padding:16px;background:#e9ecef;border-radius:8px;font-weight:600;font-size:18px;color:#2c3e50;transition:all .3s ease}.layout.dark-mode .order-detail-section h4{color:#e2e8f0!important}.layout.dark-mode .info-item label{color:#a0aec0!important}.layout.dark-mode .info-item span{color:#e2e8f0!important}.layout.dark-mode .total-amount{color:#48bb78!important}.layout.dark-mode .order-item-detail{background:#2d3748!important}.layout.dark-mode .order-item-name{color:#e2e8f0!important}.layout.dark-mode .order-item-quantity{color:#a0aec0!important}.layout.dark-mode .order-item-price{color:#48bb78!important}.layout.dark-mode .order-total-section{border-top:2px solid #4a5568!important}.layout.dark-mode .order-total{background:#2d3748!important;color:#e2e8f0!important}.status-badge[style*=pending],.status-badge:not([style]){background:#ffc107!important;color:#212529!important}.status-badge[style*=confirmed]{background:#17a2b8!important;color:#fff!important}.status-badge[style*=preparing]{background:#007bff!important;color:#fff!important}.status-badge[style*=ready]{background:#28a745!important;color:#fff!important}.status-badge[style*=completed]{background:#6c757d!important;color:#fff!important}.status-badge[style*=cancelled]{background:#dc3545!important;color:#fff!important}.layout.dark-mode .status-badge[style*=pending],.layout.dark-mode .status-badge:not([style]){background:#ffc107!important;color:#212529!important}.layout.dark-mode .status-badge[style*=confirmed]{background:#17a2b8!important;color:#fff!important}.layout.dark-mode .status-badge[style*=preparing]{background:#007bff!important;color:#fff!important}.layout.dark-mode .status-badge[style*=ready]{background:#28a745!important;color:#fff!important}.layout.dark-mode .status-badge[style*=completed]{background:#6c757d!important;color:#fff!important}.layout.dark-mode .status-badge[style*=cancelled]{background:#dc3545!important;color:#fff!important}@media (max-width: 768px){.orders-page{padding:16px}.tabs{padding:16px 16px 0;gap:2px}.tab{padding:10px 16px;font-size:14px;flex:1;min-width:auto;text-align:center}.orders-grid{grid-template-columns:1fr;gap:16px;padding:16px}.order-card{padding:16px}.order-modal-content{margin:20px;max-width:calc(100vw - 40px)}.status-select{padding:8px 32px 8px 12px;font-size:12px}}@media (max-width: 480px){.page-header h1{font-size:24px}.page-header p{font-size:14px}.order-card-header,.order-meta{flex-direction:column;gap:8px;align-items:flex-start}.info-item{flex-direction:column;align-items:flex-start;gap:4px}}@media print{.orders-page{background:#fff;padding:0}.page-header{text-align:center;margin-bottom:20px}.tabs,.order-card-footer{display:none}.orders-content{box-shadow:none;border:1px solid #ddd}.order-card{break-inside:avoid;box-shadow:none;border:1px solid #ddd}}.order-modal-body .info-item{align-items:flex-start}.order-modal-body .info-item label{min-width:80px;margin-right:16px}.order-modal-body .status-select-wrapper{flex:1}.layout.dark-mode .orders-content,.layout.dark-mode .order-card,.layout.dark-mode .tab,.layout.dark-mode .status-select,.layout.dark-mode .order-modal-content,.layout.dark-mode .order-item-detail,.layout.dark-mode .order-total{transition:background-color .3s ease,border-color .3s ease,color .3s ease,box-shadow .3s ease!important}.customers-page{padding:20px;background-color:#f8f9fa;min-height:100vh}.layout.dark-mode .customers-page{background:#4c4e5b!important;color:#e2e8f0!important}.page-header h1{color:#2c3e50;margin-bottom:8px;font-size:28px;font-weight:600;transition:color .3s ease}.page-header p{color:#6c757d;font-size:16px;margin:0;transition:color .3s ease}.customers-content{background:#fff;border-radius:12px;box-shadow:0 2px 20px #00000014;overflow:hidden;border:1px solid transparent;transition:all .3s ease}.layout.dark-mode .customers-content{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 2px 20px #0000004d!important}.tabs{display:flex;gap:4px;padding:20px 24px 0;background:#f8f9fa;border-bottom:1px solid #e9ecef;flex-wrap:wrap;transition:all .3s ease}.layout.dark-mode .tabs{background:#252631!important;border-bottom:1px solid #4a5568!important}.tab{padding:12px 24px;border:none;background:#fff;cursor:pointer;border-radius:8px 8px 0 0;font-weight:500;color:#6c757d;transition:all .3s ease;border:1px solid transparent;border-bottom:none;position:relative;bottom:-1px}.tab:hover{color:#495057;background:#f8f9fa}.tab.active{background:#fff;color:#007bff;border-color:#e9ecef;border-bottom-color:#fff;box-shadow:0 -2px 4px #0000000a}.layout.dark-mode .tab{background:#252631!important;color:#a0aec0!important;border:1px solid #4a5568!important}.layout.dark-mode .tab:hover{color:#e2e8f0!important;background:#2d3748!important}.layout.dark-mode .tab.active{background:#252631!important;color:#4dabf7!important;border-color:#4a5568!important;border-bottom-color:#252631!important;box-shadow:0 -2px 4px #0000001a!important}.loading,.error,.no-data{text-align:center;padding:60px 20px;color:#6c757d;font-size:16px;transition:all .3s ease}.error{color:#dc3545;background:#f8d7da;padding:20px;border-radius:8px;margin:20px;border:1px solid transparent;transition:all .3s ease}.no-data{color:#6c757d;font-style:italic}.empty-state{text-align:center;padding:40px 20px}.empty-state p{margin-bottom:8px;color:#6c757d;transition:color .3s ease}.empty-state small{color:#adb5bd;transition:color .3s ease}.layout.dark-mode .loading,.layout.dark-mode .no-data,.layout.dark-mode .empty-state p{color:#a0aec0!important}.layout.dark-mode .empty-state small{color:#718096!important}.customers-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;padding:24px}.customer-card{background:#fff;border:1px solid #e9ecef;border-radius:12px;padding:20px;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #0000000f}.customer-card:hover{transform:translateY(-2px);box-shadow:0 4px 20px #0000001f;border-color:#007bff}.layout.dark-mode .customer-card{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 2px 8px #0000004d!important}.layout.dark-mode .customer-card:hover{box-shadow:0 4px 20px #0006!important;border-color:#4dabf7!important}.customer-card-header{display:flex;align-items:flex-start;gap:12px;margin-bottom:16px}.customer-avatar{width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,#007bff,#0056b3);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;flex-shrink:0}.layout.dark-mode .customer-avatar{background:linear-gradient(135deg,#4dabf7,#339af0)!important}.customer-basic-info{flex:1}.customer-basic-info h3{margin:0 0 4px;color:#2c3e50;font-size:16px;font-weight:600;transition:color .3s ease}.customer-id{font-size:12px;color:#6c757d;font-family:Courier New,monospace;transition:color .3s ease}.status-badge{padding:6px 12px;border-radius:20px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;text-align:center;min-width:70px}.status-badge.active{background:#d4edda;color:#155724}.status-badge.inactive{background:#f8d7da;color:#721c24}.layout.dark-mode .customer-basic-info h3{color:#e2e8f0!important}.layout.dark-mode .customer-id{color:#a0aec0!important}.layout.dark-mode .status-badge.active{background:#4caf5033!important;color:#4caf50!important}.layout.dark-mode .status-badge.inactive{background:#f4433633!important;color:#f44336!important}.customer-card-body{margin-bottom:16px}.contact-info{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.contact-item{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid #f8f9fa;transition:border-color .3s ease}.contact-label{font-size:12px;color:#6c757d;font-weight:500;transition:color .3s ease}.contact-value{font-size:13px;color:#495057;font-weight:500;transition:color .3s ease}.layout.dark-mode .contact-item{border-bottom:1px solid #4a5568!important}.layout.dark-mode .contact-label{color:#a0aec0!important}.layout.dark-mode .contact-value{color:#e2e8f0!important}.customer-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px;padding:16px;background:#f8f9fa;border-radius:8px;transition:all .3s ease}.stat{text-align:center}.stat-value{display:block;font-size:18px;font-weight:700;color:#007bff;margin-bottom:4px;transition:color .3s ease}.stat-label{font-size:12px;color:#6c757d;text-transform:uppercase;letter-spacing:.5px;transition:color .3s ease}.layout.dark-mode .customer-stats{background:#2d3748!important}.layout.dark-mode .stat-value{color:#4dabf7!important}.last-order{display:flex;justify-content:space-between;align-items:center;padding:12px;background:#e9ecef;border-radius:6px;transition:all .3s ease}.last-order-label{font-size:12px;color:#6c757d;font-weight:500;transition:color .3s ease}.last-order-date{font-size:13px;color:#495057;font-weight:600;transition:color .3s ease}.layout.dark-mode .last-order{background:#2d3748!important}.layout.dark-mode .last-order-label{color:#a0aec0!important}.layout.dark-mode .last-order-date{color:#e2e8f0!important}.customer-card-footer{display:flex;justify-content:flex-end}.btn-view{padding:8px 16px;background:#007bff;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:13px;font-weight:500;transition:all .2s ease}.btn-view:hover{background:#0056b3;transform:translateY(-1px)}.layout.dark-mode .btn-view{background:#4dabf7!important}.layout.dark-mode .btn-view:hover{background:#339af0!important}.customer-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.customer-modal-content{background:#fff;border-radius:12px;width:100%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 10px 40px #0003;border:1px solid transparent;transition:all .3s ease}.customer-modal-header{padding:24px;border-bottom:1px solid #e9ecef;display:flex;justify-content:space-between;align-items:center;transition:border-color .3s ease}.customer-modal-header h3{margin:0;color:#2c3e50;font-size:20px;transition:color .3s ease}.modal-close-btn{background:none;border:none;font-size:24px;cursor:pointer;color:#6c757d;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s ease}.modal-close-btn:hover{background:#f8f9fa;color:#495057}.layout.dark-mode .customer-modal-overlay{background:#000000b3!important}.layout.dark-mode .customer-modal-content{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 10px 40px #0000004d!important}.layout.dark-mode .customer-modal-header{border-bottom:1px solid #4a5568!important}.layout.dark-mode .customer-modal-header h3{color:#e2e8f0!important}.layout.dark-mode .modal-close-btn{color:#a0aec0!important}.layout.dark-mode .modal-close-btn:hover{background:#2d3748!important;color:#e2e8f0!important}.customer-modal-body{padding:24px}.customer-profile-section{display:flex;align-items:center;gap:16px;margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid #e9ecef;transition:border-color .3s ease}.customer-avatar-large{width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,#007bff,#0056b3);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:24px;flex-shrink:0}.layout.dark-mode .customer-avatar-large{background:linear-gradient(135deg,#4dabf7,#339af0)!important}.customer-profile-info{flex:1}.customer-profile-info h2{margin:0 0 4px;color:#2c3e50;font-size:24px;font-weight:600;transition:color .3s ease}.customer-profile-info .customer-id{font-size:14px;color:#6c757d;margin-bottom:8px;display:block;transition:color .3s ease}.status-badge.large{padding:8px 16px;font-size:12px;min-width:80px}.layout.dark-mode .customer-profile-section{border-bottom:1px solid #4a5568!important}.layout.dark-mode .customer-profile-info h2{color:#e2e8f0!important}.layout.dark-mode .customer-profile-info .customer-id{color:#a0aec0!important}.customer-detail-section{margin-bottom:24px}.customer-detail-section h4{margin:0 0 16px;color:#495057;font-size:16px;font-weight:600;transition:color .3s ease}.detail-grid{display:grid;gap:12px}.detail-item{display:flex;justify-content:space-between;align-items:center;padding:12px;background:#f8f9fa;border-radius:8px;transition:all .3s ease}.detail-item label{font-weight:500;color:#6c757d;font-size:14px;transition:color .3s ease}.detail-item span{color:#2c3e50;font-size:14px;font-weight:500;transition:color .3s ease}.layout.dark-mode .customer-detail-section h4{color:#e2e8f0!important}.layout.dark-mode .detail-item{background:#2d3748!important}.layout.dark-mode .detail-item label{color:#a0aec0!important}.layout.dark-mode .detail-item span{color:#e2e8f0!important}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.stat-card{text-align:center;padding:16px;background:#f8f9fa;border-radius:8px;border:1px solid #e9ecef;transition:all .3s ease}.stat-card-value{font-size:20px;font-weight:700;color:#007bff;margin-bottom:4px;transition:color .3s ease}.stat-card-label{font-size:12px;color:#6c757d;text-transform:uppercase;letter-spacing:.5px;transition:color .3s ease}.layout.dark-mode .stat-card{background:#2d3748!important;border:1px solid #4a5568!important}.layout.dark-mode .stat-card-value{color:#4dabf7!important}.layout.dark-mode .stat-card-label{color:#a0aec0!important}.activity-list{display:flex;flex-direction:column;gap:12px}.activity-item{display:flex;align-items:center;gap:12px;padding:12px;background:#f8f9fa;border-radius:8px;transition:all .3s ease}.activity-icon{font-size:18px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:50%;flex-shrink:0;transition:all .3s ease}.activity-info{flex:1}.activity-title{font-weight:600;color:#2c3e50;font-size:14px;margin-bottom:2px;transition:color .3s ease}.activity-description{font-size:13px;color:#6c757d;transition:color .3s ease}.layout.dark-mode .activity-item{background:#2d3748!important}.layout.dark-mode .activity-icon{background:#252631!important;color:#e2e8f0!important}.layout.dark-mode .activity-title{color:#e2e8f0!important}.layout.dark-mode .activity-description{color:#a0aec0!important}@media (max-width: 768px){.customers-page{padding:16px}.tabs{padding:16px 16px 0;gap:2px}.tab{padding:10px 16px;font-size:14px;flex:1;min-width:auto;text-align:center}.customers-grid{grid-template-columns:1fr;gap:16px;padding:16px}.customer-card{padding:16px}.customer-modal-content{margin:20px;max-width:calc(100vw - 40px)}.stats-grid{grid-template-columns:1fr;gap:8px}.customer-profile-section{flex-direction:column;text-align:center}}@media (max-width: 480px){.page-header h1{font-size:24px}.page-header p{font-size:14px}.customer-stats{grid-template-columns:1fr;gap:8px}.contact-item{flex-direction:column;align-items:flex-start;gap:4px}}@media print{.customers-page{background:#fff;padding:0}.page-header{text-align:center;margin-bottom:20px}.tabs,.customer-card-footer{display:none}.customers-content{box-shadow:none;border:1px solid #ddd}.customer-card{break-inside:avoid;box-shadow:none;border:1px solid #ddd}}.layout.dark-mode .customers-content,.layout.dark-mode .customer-card,.layout.dark-mode .tab,.layout.dark-mode .customer-modal-content,.layout.dark-mode .detail-item,.layout.dark-mode .stat-card,.layout.dark-mode .activity-item{transition:background-color .3s ease,border-color .3s ease,color .3s ease,box-shadow .3s ease!important}.reviews-page{padding:20px;max-width:1400px;margin:0 auto;height:100vh;display:flex;flex-direction:column;background-color:#f8f9fa}.layout.dark-mode .reviews-page{background:#4c4e5b!important;color:#e2e8f0!important}.page-header{text-align:center;margin-bottom:24px;flex-shrink:0}.page-header h1{font-size:2rem;font-weight:700;color:#2d3748;margin-bottom:8px;transition:color .3s ease}.page-header p{font-size:1rem;color:#718096;transition:color .3s ease}.reviews-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:24px;flex-shrink:0}.stat-card{background:#fff;padding:20px;border-radius:12px;text-align:center;box-shadow:0 2px 8px #00000014;border:1px solid #e2e8f0;transition:all .3s ease}.stat-card.total-reviews{border-left:4px solid #4299e1}.stat-card.average-rating{border-left:4px solid #48bb78}.stat-card.rating-distribution{border-left:4px solid #ed8936}.layout.dark-mode .stat-card{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 2px 8px #0000004d!important}.layout.dark-mode .stat-card.total-reviews{border-left:4px solid #4dabf7!important}.layout.dark-mode .stat-card.average-rating{border-left:4px solid #48bb78!important}.layout.dark-mode .stat-card.rating-distribution{border-left:4px solid #ed8936!important}.stat-number{font-size:2rem;font-weight:700;color:#2d3748;margin-bottom:4px;transition:color .3s ease}.stat-label{font-size:.85rem;color:#718096;font-weight:500;transition:color .3s ease}.layout.dark-mode .stat-number{color:#e2e8f0!important}.reviews-container{flex:1;overflow:hidden;display:flex;flex-direction:column}.reviews-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;overflow-y:auto;padding:4px;max-height:100%}.review-card{background:#fff;border-radius:12px;padding:16px;box-shadow:0 2px 6px #0000000f;border:1px solid #e2e8f0;transition:all .2s ease;display:flex;flex-direction:column;height:fit-content;min-height:220px}.review-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.layout.dark-mode .review-card{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 2px 6px #0000004d!important}.layout.dark-mode .review-card:hover{box-shadow:0 4px 12px #0006!important;border-color:#4dabf7!important}.review-card-header{display:flex;align-items:flex-start;gap:12px;margin-bottom:12px}.reviewer-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#4299e1,#667eea);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.9rem;flex-shrink:0}.layout.dark-mode .reviewer-avatar{background:linear-gradient(135deg,#4dabf7,#667eea)!important}.reviewer-main{flex:1;min-width:0}.reviewer-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:4px}.reviewer-name{font-size:.95rem;font-weight:600;color:#2d3748;margin:0;line-height:1.2;transition:color .3s ease}.layout.dark-mode .reviewer-name{color:#e2e8f0!important}.status-badge{padding:4px 8px;border-radius:12px;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;flex-shrink:0}.status-badge.excellent{background:#c6f6d5;color:#22543d;border:1px solid #9ae6b4}.status-badge.good{background:#fed7d7;color:#742a2a;border:1px solid #feb2b2}.status-badge.average{background:#feebcb;color:#744210;border:1px solid #fbd38d}.layout.dark-mode .status-badge.excellent{background:#4caf5033!important;color:#4caf50!important;border:1px solid rgba(76,175,80,.3)!important}.layout.dark-mode .status-badge.good{background:#f4433633!important;color:#f44336!important;border:1px solid rgba(244,67,54,.3)!important}.layout.dark-mode .status-badge.average{background:#ffc10733!important;color:#ffc107!important;border:1px solid rgba(255,193,7,.3)!important}.review-meta{display:flex;flex-wrap:wrap;gap:6px;font-size:.75rem;line-height:1.3}.review-date{font-weight:500;color:#718096;transition:color .3s ease}.review-contact-label{color:#718096;font-weight:500;transition:color .3s ease}.review-contact-value{color:#4299e1;font-weight:500;transition:color .3s ease}.layout.dark-mode .review-meta,.layout.dark-mode .review-date,.layout.dark-mode .review-contact-label{color:#a0aec0!important}.layout.dark-mode .review-contact-value{color:#4dabf7!important}.review-rating{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;padding:8px 0;border-bottom:1px solid #f7fafc;transition:border-color .3s ease}.layout.dark-mode .review-rating{border-bottom:1px solid #4a5568!important}.stars{color:#f6ad55;font-size:1.1rem;letter-spacing:1px}.rating-value{background:#2d3748;color:#fff;padding:4px 8px;border-radius:8px;font-size:.8rem;font-weight:600;transition:all .3s ease}.layout.dark-mode .rating-value{background:#4a5568!important;color:#e2e8f0!important}.review-comment{line-height:1.4;color:#4a5568;font-size:.85rem;margin-bottom:12px;background:#f7fafc;padding:12px;border-radius:8px;border-left:3px solid #4299e1;flex:1;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;transition:all .3s ease}.layout.dark-mode .review-comment{color:#e2e8f0!important;background:#2d3748!important;border-left:3px solid #4dabf7!important}.review-actions{display:flex;justify-content:flex-end;margin-top:auto}.btn-delete{display:flex;align-items:center;gap:4px;padding:6px 12px;background:#e53e3e;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:.8rem;font-weight:500;transition:all .2s ease}.btn-delete:hover{background:#c53030;transform:scale(1.05)}.delete-icon{font-size:.8rem}.layout.dark-mode .btn-delete{background:#e53e3e!important}.layout.dark-mode .btn-delete:hover{background:#c53030!important}.no-reviews{text-align:center;padding:40px 20px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000f;border:1px solid #e2e8f0;transition:all .3s ease}.no-reviews-icon{font-size:3rem;margin-bottom:16px}.no-reviews h3{font-size:1.25rem;color:#2d3748;margin-bottom:8px;transition:color .3s ease}.no-reviews p{color:#718096;font-size:.9rem;transition:color .3s ease}.layout.dark-mode .no-reviews{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 2px 8px #0000004d!important}.layout.dark-mode .no-reviews h3{color:#e2e8f0!important}.layout.dark-mode .no-reviews p{color:#a0aec0!important}.loading,.error{text-align:center;padding:40px 20px;font-size:1rem;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000f;border:1px solid transparent;transition:all .3s ease}.loading{color:#4299e1}.error{color:#e53e3e;background:#fed7d7;border:1px solid #feb2b2}.layout.dark-mode .loading,.layout.dark-mode .error{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 2px 8px #0000004d!important}.layout.dark-mode .loading{color:#4dabf7!important}.layout.dark-mode .error{color:#f56565!important;background:#2d3748!important;border:1px solid #f56565!important}.reviews-grid::-webkit-scrollbar{width:6px}.reviews-grid::-webkit-scrollbar-track{background:#f7fafc;border-radius:3px;transition:background .3s ease}.reviews-grid::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:3px;transition:background .3s ease}.reviews-grid::-webkit-scrollbar-thumb:hover{background:#a0aec0}.layout.dark-mode .reviews-grid::-webkit-scrollbar-track{background:#2d3748!important}.layout.dark-mode .reviews-grid::-webkit-scrollbar-thumb{background:#4a5568!important}.layout.dark-mode .reviews-grid::-webkit-scrollbar-thumb:hover{background:#718096!important}@media (max-width: 768px){.reviews-page{padding:16px;height:auto}.reviews-grid{grid-template-columns:1fr;max-height:none}.reviews-stats{grid-template-columns:1fr}.reviewer-top{flex-direction:column;align-items:flex-start;gap:4px}.page-header h1{font-size:1.75rem}}@media (max-width: 1024px){.reviews-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}}.layout.dark-mode .stat-card,.layout.dark-mode .review-card,.layout.dark-mode .no-reviews,.layout.dark-mode .loading,.layout.dark-mode .error,.layout.dark-mode .review-comment{transition:background-color .3s ease,border-color .3s ease,color .3s ease,box-shadow .3s ease!important}.promotions-page{padding:20px;background-color:#f8f9fa;min-height:calc(100vh - 64px)}.layout.dark-mode .promotions-page{background:#4c4e5b!important;color:#e2e8f0!important}.promotions-page .promotions-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;padding-bottom:20px;border-bottom:1px solid #eaeaea}.layout.dark-mode .promotions-page .promotions-header{border-bottom-color:#2d3748!important}.promotions-page .header-content h1{margin:0 0 8px;color:#2c3e50;font-size:28px;font-weight:700}.layout.dark-mode .promotions-page .header-content h1{color:#e2e8f0!important}.promotions-page .header-content p{margin:0;color:#6c757d;font-size:15px}.promotions-page .btn-create-promotion{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:8px;box-shadow:0 2px 5px #667eea33}.promotions-page .btn-create-promotion:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea4d}.promotions-page .btn-create-promotion span{font-size:20px;font-weight:300}.layout.dark-mode .promotions-page .btn-create-promotion{background:linear-gradient(135deg,#4dabf7,#2d8de8)!important;box-shadow:0 2px 5px #4dabf733!important}.promotions-page .error-alert{background:#fff5f5;border:1px solid #fed7d7;border-radius:8px;padding:12px 20px;margin-bottom:20px;display:flex;justify-content:space-between;align-items:center;color:#c53030}.layout.dark-mode .promotions-page .error-alert{background:#2d2525!important;border-color:#5c3a3a!important;color:#ff7a7a!important}.promotions-page .error-alert button{background:none;border:none;color:inherit;cursor:pointer;font-size:20px;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;opacity:.7}.promotions-page .error-alert button:hover{opacity:1}.promotions-page .promotions-controls{background:#fff;border-radius:10px;padding:20px;margin-bottom:20px;box-shadow:0 1px 3px #0000001a;border:1px solid #eaeaea}.layout.dark-mode .promotions-page .promotions-controls{background:#252631!important;border-color:#2d3748!important}.promotions-page .controls-left,.promotions-page .controls-right{display:flex;align-items:center;gap:15px;flex-wrap:wrap}.promotions-page .controls-left{margin-bottom:15px}@media (min-width: 768px){.promotions-page .promotions-controls{display:flex;justify-content:space-between;align-items:center}.promotions-page .controls-left{margin-bottom:0}}.promotions-page .view-toggle{display:flex;background:#f8f9fa;border-radius:6px;overflow:hidden;border:1px solid #dee2e6}.layout.dark-mode .promotions-page .view-toggle{background:#2d3748!important;border-color:#4a5568!important}.promotions-page .view-btn{padding:8px 16px;border:none;background:transparent;cursor:pointer;font-size:14px;color:#6c757d;display:flex;align-items:center;gap:6px;transition:all .2s ease}.promotions-page .view-btn.active{background:#3498db;color:#fff}.layout.dark-mode .promotions-page .view-btn.active{background:#4dabf7!important}.promotions-page .search-box{position:relative;flex:1;border:none!important;background:none!important;box-shadow:none!important}.promotions-page .search-box input{width:100%;padding:10px 16px 10px 40px;border:1px solid #dee2e6;border-radius:6px;font-size:12px;background:#fff;transition:all .2s ease}.promotions-page .search-box input:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.layout.dark-mode .promotions-page .search-box input{color:#e2e8f0!important;border:none!important;background:none!important;box-shadow:none!important}.promotions-page .filter-select{padding:9px 12px;border:1px solid #dee2e6;border-radius:6px;background:#fff;font-size:14px;color:#495057;cursor:pointer;transition:all .2s ease;min-width:140px}.promotions-page .filter-select:focus{outline:none;border-color:#3498db}.layout.dark-mode .promotions-page .filter-select{background:#2d3748!important;border-color:#4a5568!important;color:#e2e8f0!important}.promotions-page .btn-refresh{padding:9px 16px;background:#f8f9fa;border:1px solid #dee2e6;border-radius:6px;font-size:14px;color:#495057;cursor:pointer;display:flex;align-items:center;gap:6px;transition:all .2s ease}.promotions-page .btn-refresh:hover:not(:disabled){background:#e9ecef;border-color:#adb5bd}.promotions-page .btn-refresh:disabled{opacity:.6;cursor:not-allowed}.layout.dark-mode .promotions-page .btn-refresh{background:#2d3748!important;border-color:#4a5568!important;color:#e2e8f0!important}.promotions-page .promotions-count{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding:10px 0;border-bottom:1px solid #eaeaea;color:#6c757d;font-size:14px}.layout.dark-mode .promotions-page .promotions-count{border-bottom-color:#2d3748!important;color:#a0aec0!important}.promotions-page .drag-hint{display:flex;align-items:center;gap:6px;font-size:13px;opacity:.7}.promotions-page .promotions-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:400px;gap:20px}.promotions-page .spinner{width:50px;height:50px;border:4px solid rgba(52,152,219,.1);border-top:4px solid #3498db;border-radius:50%;animation:spin 1s linear infinite}.layout.dark-mode .promotions-page .spinner{border-color:#4dabf71a!important;border-top-color:#4dabf7!important}.promotions-page .no-promotions{margin-top:40px}.promotions-page .empty-state{text-align:center;padding:60px 20px;background:#fff;border-radius:12px;box-shadow:0 2px 10px #0000000d;border:2px dashed #dee2e6}.layout.dark-mode .promotions-page .empty-state{background:#252631!important;border-color:#4a5568!important}.promotions-page .empty-state .icon-promotion{font-size:64px;margin-bottom:20px;display:block;opacity:.4}.promotions-page .empty-state h3{margin:0 0 12px;color:#2c3e50;font-size:22px;font-weight:600}.layout.dark-mode .promotions-page .empty-state h3{color:#e2e8f0!important}.promotions-page .empty-state p{color:#6c757d;max-width:400px;margin:0 auto 24px;line-height:1.5}.layout.dark-mode .promotions-page .empty-state p{color:#a0aec0!important}.promotions-page .btn-create-first{padding:12px 28px;background:#3498db;color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 5px #3498db33}.promotions-page .btn-create-first:hover{background:#2980b9;transform:translateY(-2px);box-shadow:0 4px 12px #3498db4d}.layout.dark-mode .promotions-page .btn-create-first{background:#4dabf7!important}.promotions-page .promotions-container.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px;margin-top:20px}.promotions-page .promotions-container.list{display:flex;flex-direction:column;gap:16px;margin-top:20px}.promotions-page .promotion-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px #00000014;transition:all .3s ease;border:1px solid #eaeaea}.layout.dark-mode .promotions-page .promotion-card{background:#252631!important;border-color:#2d3748!important;box-shadow:0 2px 8px #0003!important}.promotions-page .promotion-card:hover{transform:translateY(-3px);box-shadow:0 8px 25px #0000001f}.layout.dark-mode .promotions-page .promotion-card:hover{box-shadow:0 8px 25px #0000004d!important}.promotions-page .promotion-image{width:100%;height:180px;position:relative;overflow:hidden}.promotions-page .promotion-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.promotions-page .promotion-card:hover .promotion-image img{transform:scale(1.05)}.promotions-page .promotion-type{position:absolute;top:12px;right:12px;background:#000c;color:#fff;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:600;display:flex;align-items:center;gap:6px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.promotions-page .promotion-content{padding:20px}.promotions-page .promotion-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px;gap:10px}.promotions-page .promotion-title{margin:0;font-size:18px;font-weight:600;color:#2c3e50;flex:1;line-height:1.3}.layout.dark-mode .promotions-page .promotion-title{color:#e2e8f0!important}.promotions-page .status-badge{padding:4px 12px;border-radius:20px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}.promotions-page .status-badge.active{background:#28a74526;color:#28a745;border:1px solid rgba(40,167,69,.3)}.promotions-page .status-badge.upcoming{background:#ffc10726;color:#ffc107;border:1px solid rgba(255,193,7,.3)}.promotions-page .status-badge.expired{background:#dc354526;color:#dc3545;border:1px solid rgba(220,53,69,.3)}.promotions-page .status-badge.inactive{background:#6c757d26;color:#6c757d;border:1px solid rgba(108,117,125,.3)}.promotions-page .promotion-description{margin:0 0 15px;color:#6c757d;font-size:14px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.layout.dark-mode .promotions-page .promotion-description{color:#a0aec0!important}.promotions-page .discount-badge{display:inline-block;padding:8px 16px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:6px;font-weight:600;font-size:14px;margin-bottom:15px;box-shadow:0 2px 4px #667eea33}.layout.dark-mode .promotions-page .discount-badge{background:linear-gradient(135deg,#4dabf7,#2d8de8)!important}.promotions-page .promotion-code{display:flex;align-items:center;gap:10px;margin-bottom:15px;padding:12px;background:#f8f9fa;border-radius:8px;border:1px solid #dee2e6}.layout.dark-mode .promotions-page .promotion-code{background:#2d3748!important;border-color:#4a5568!important}.promotions-page .coupon-code{font-family:Courier New,monospace;font-weight:600;color:#495057;flex:1;font-size:15px}.layout.dark-mode .promotions-page .coupon-code{color:#e2e8f0!important}.promotions-page .btn-copy-code{padding:6px 14px;background:#3498db;color:#fff;border:none;border-radius:4px;font-size:13px;font-weight:500;cursor:pointer;transition:background .2s ease}.promotions-page .btn-copy-code:hover{background:#2980b9}.layout.dark-mode .promotions-page .btn-copy-code{background:#4dabf7!important}.promotions-page .promotion-dates{margin-bottom:15px}.promotions-page .date-item{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:14px}.promotions-page .date-item strong{color:#495057;font-weight:600}.layout.dark-mode .promotions-page .date-item strong{color:#e2e8f0!important}.promotions-page .date-item span{color:#6c757d}.layout.dark-mode .promotions-page .date-item span{color:#a0aec0!important}.promotions-page .days-left{font-size:12px;color:#6c757d;margin-left:6px;font-weight:500}.promotions-page .promotion-meta{display:flex;justify-content:space-between;align-items:center;margin-top:15px;padding-top:15px;border-top:1px solid #eaeaea;font-size:13px;color:#6c757d}.layout.dark-mode .promotions-page .promotion-meta{border-top-color:#2d3748!important;color:#a0aec0!important}.promotions-page .promotion-actions{display:flex;gap:10px;margin-top:20px;padding-top:20px;border-top:1px solid #eaeaea}.layout.dark-mode .promotions-page .promotion-actions{border-top-color:#2d3748!important}.promotions-page .btn-action{flex:1;padding:10px 12px;border:1px solid #dee2e6;border-radius:6px;background:#fff;color:#495057;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:6px}.promotions-page .btn-action:hover{transform:translateY(-1px);box-shadow:0 2px 6px #0000001a}.promotions-page .btn-action.btn-edit{border-color:#f39c12;background-color:#f39c12;color:#fff}.promotions-page .btn-action.btn-edit:hover{background:#f59b0a;color:#fff}.promotions-page .btn-action.btn-status.inactive{border-color:#28a745;background-color:#28a745;color:#fff}.promotions-page .btn-action.btn-status{border-color:#6c757d;background-color:#a75228;color:#fff}.promotions-page .btn-action.btn-status:hover{background:#a75228;color:#fff}.promotions-page .btn-action.btn-status.inactive:hover{border-color:#28a745;background-color:#145a24;color:#fff}.promotions-page .btn-action.btn-delete{border-color:#dc3545;background-color:#dc3545;color:#fff}.promotions-page .btn-action.btn-delete:hover{background:#e6061c;color:#fff}.promotion-form-container{background:#fff;border-radius:12px;padding:30px;box-shadow:0 2px 10px #00000014;border:1px solid #eaeaea}.layout.dark-mode .promotion-form-container{background:#252631!important;border-color:#2d3748!important}.promotion-form-container .form-header{margin-bottom:30px;padding-bottom:20px;border-bottom:1px solid #eaeaea}.layout.dark-mode .promotion-form-container .form-header{border-bottom-color:#2d3748!important}.promotion-form-container .form-header h2{margin:0 0 8px;color:#2c3e50;font-size:24px;font-weight:600}.layout.dark-mode .promotion-form-container .form-header h2{color:#e2e8f0!important}.promotion-form-container .form-header p{margin:0;color:#6c757d;font-size:15px}.promotion-form-container .form-section{margin-bottom:30px}.promotion-form-container .form-section h3{margin:0 0 20px;color:#2c3e50;font-size:18px;font-weight:600;padding-bottom:10px;border-bottom:2px solid #f1f3f5}.layout.dark-mode .promotion-form-container .form-section h3{color:#e2e8f0!important;border-bottom-color:#2d3748!important}.promotion-form-container .form-group{margin-bottom:20px}.promotion-form-container .form-group label{display:block;margin-bottom:8px;font-weight:500;color:#495057}.layout.dark-mode .promotion-form-container .form-group label{color:#e2e8f0!important}.promotion-form-container .required{color:#dc3545}.promotion-form-container input,.promotion-form-container textarea,.promotion-form-container select{width:100%;padding:12px;border:1px solid #dee2e6;border-radius:6px;font-size:14px;background:#fff;color:#495057;transition:all .2s ease}.promotion-form-container input:focus,.promotion-form-container textarea:focus,.promotion-form-container select:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.layout.dark-mode .promotion-form-container input,.layout.dark-mode .promotion-form-container textarea,.layout.dark-mode .promotion-form-container select{background:#2d3748!important;border-color:#4a5568!important;color:#e2e8f0!important}.promotion-form-container .error{border-color:#dc3545!important}.promotion-form-container .error-message{display:block;margin-top:6px;font-size:13px;color:#dc3545}.promotion-stats{background:#fff;border-radius:12px;padding:25px;margin-bottom:30px;box-shadow:0 2px 10px #0000000d;border:1px solid #eaeaea}.layout.dark-mode .promotion-stats{background:#252631!important;border-color:#2d3748!important}.promotion-stats .stats-header{margin-bottom:25px}.promotion-stats .stats-header h2{margin:0 0 8px;color:#2c3e50;font-size:22px;font-weight:600}.layout.dark-mode .promotion-stats .stats-header h2{color:#e2e8f0!important}.promotion-stats .stats-header p{margin:0;color:#6c757d;font-size:15px}.promotion-stats .stats-grid{display:grid;grid-template-columns:repeat(2,minmax(300px,1fr));gap:20px;margin-bottom:30px}.promotion-stats .stat-card{background:#f8f9fa;border-radius:10px;padding:20px;border-left:4px solid #3498db;transition:all .3s ease;grid-template-columns:repeat(2,minmax(300px,1fr))}.layout.dark-mode .promotion-stats .stat-card{background:#2d3748!important}.promotion-stats .stat-card:hover{transform:translateY(-3px);box-shadow:0 4px 15px #0000001a}.promotion-stats .stat-content h3{margin:0 0 10px;font-size:14px;font-weight:500;color:#6c757d;text-transform:uppercase;letter-spacing:.5px}.promotion-stats .stat-value{font-size:32px;font-weight:700;color:#2c3e50;margin:0}.layout.dark-mode .promotion-stats .stat-value{color:#e2e8f0!important}@media (max-width: 768px){.promotions-page{padding:15px}.promotions-page .promotions-header{flex-direction:column;align-items:stretch;gap:15px}.promotions-page .header-content{text-align:center}.promotions-page .btn-create-promotion{align-self:center}.promotions-page .promotions-container.grid,.promotion-stats .stats-grid{grid-template-columns:1fr}.promotions-page .promotions-controls{padding:15px}.promotions-page .controls-left,.promotions-page .controls-right{width:100%}.promotions-page .search-box{min-width:100%}.promotion-form-container{padding:20px}}@media (max-width: 480px){.promotions-page{padding:10px}.promotions-page .header-content h1{font-size:24px}.promotions-page .promotion-content{padding:15px}.promotions-page .promotion-actions{flex-direction:column}.promotions-page .btn-action{width:100%}}.promotion-stats-modern{margin-bottom:40px}.promotion-stats-modern .stats-header{margin-bottom:30px}.promotion-stats-modern .stats-header h2{margin:0 0 8px;color:#2c3e50;font-size:28px;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.05)}.promotion-stats-modern .stats-header p{margin:0;color:#6c757d;font-size:16px;font-weight:400}.layout.dark-mode .promotion-stats-modern .stats-header h2{color:#f0f2f5!important;text-shadow:0 1px 2px rgba(0,0,0,.3)}.layout.dark-mode .promotion-stats-modern .stats-header p{color:#a3b1c6!important}.promotion-stats-modern .stats-grid{display:grid!important;grid-template-columns:repeat(2,minmax(300px,1fr))!important;gap:30px!important;margin-bottom:40px!important}.promotion-stats-modern .stat-card-modern{background:#fff;border-radius:20px;padding:40px;box-shadow:0 10px 40px #00000014,0 2px 10px #0000000d,inset 0 1px #fffc;position:relative;overflow:hidden;transition:all .4s cubic-bezier(.175,.885,.32,1.1);border:1px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.promotion-stats-modern .stat-card-modern:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 20px 60px #00000026,0 8px 20px #0000001a,inset 0 1px #ffffffe6}.promotion-stats-modern .stat-card-modern:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#fffc,#fff6,#fffc);border-radius:20px 20px 0 0}.promotion-stats-modern .stat-chart-container{position:absolute;top:20px;right:20px;width:80px;height:80px}.promotion-stats-modern .stat-pie-chart{width:100%;height:100%;filter:drop-shadow(0 4px 8px rgba(0,0,0,.1))}.promotion-stats-modern .pie-background{stroke:#f0f2f5;fill:none}.promotion-stats-modern .pie-progress{transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dasharray .8s ease-out;fill:none;stroke-linecap:round}.promotion-stats-modern .pie-center-dot{filter:drop-shadow(0 2px 4px rgba(0,0,0,.2));animation:pulse 2s infinite;r:4}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.promotion-stats-modern .pie-value{font-size:25px!important;font-weight:800;fill:#2c3e50;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;filter:drop-shadow(0 1px 1px rgba(255,255,255,.8))}.promotion-stats-modern .chart-indicator-line{position:absolute;top:50%;left:-10px;width:20px;height:2px;border-radius:1px;transform:translateY(-50%);opacity:.7}.promotion-stats-modern .stat-content-modern{position:relative;z-index:2}.promotion-stats-modern .stat-header-modern{display:flex;align-items:flex-start;gap:16px;margin-bottom:20px}.promotion-stats-modern .stat-icon-modern{position:relative;width:48px;height:48px;flex-shrink:0}.promotion-stats-modern .icon-emoji{position:relative;z-index:2;font-size:24px;display:flex;align-items:center;justify-content:center;height:100%;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.promotion-stats-modern .icon-background{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:12px;opacity:.15;transform:rotate(45deg);transition:all .3s ease}.promotion-stats-modern .stat-card-modern:hover .icon-background{transform:rotate(0) scale(1.1);opacity:.2}.promotion-stats-modern .stat-titles{flex:1}.promotion-stats-modern .stat-value-modern{margin:0 0 4px;font-size:28px;font-weight:800;color:#2c3e50;background:linear-gradient(135deg,#2c3e50,#4a6583);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.5px;line-height:1}.promotion-stats-modern .stat-title-modern{margin:0;color:#6c757d;font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;opacity:.8}.promotion-stats-modern .stat-meta{border-top:1px solid rgba(0,0,0,.05);padding-top:16px}.promotion-stats-modern .change-container{display:flex;align-items:center;margin-bottom:12px}.promotion-stats-modern .stat-change-modern{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:700;padding:6px 12px;border-radius:20px;transition:all .3s ease}.promotion-stats-modern .stat-change-modern.positive{background:linear-gradient(135deg,#28a74526,#28a7450d);color:#28a745;border:1px solid rgba(40,167,69,.2)}.promotion-stats-modern .stat-change-modern.negative{background:linear-gradient(135deg,#dc354526,#dc35450d);color:#dc3545;border:1px solid rgba(220,53,69,.2)}.promotion-stats-modern .change-icon{width:12px;height:12px}.promotion-stats-modern .stat-description-modern{display:flex;justify-content:space-between;align-items:center}.promotion-stats-modern .description-text{font-size:12px;color:#adb5bd;font-weight:500;max-width:70%}.promotion-stats-modern .progress-dots{display:flex;gap:4px}.promotion-stats-modern .progress-dot{width:6px;height:6px;border-radius:50%;opacity:.3;transition:all .3s ease}.promotion-stats-modern .progress-dot.active{opacity:1;transform:scale(1.2)}.promotion-stats-modern .stat-pattern{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;opacity:.3;z-index:1;border-radius:20px;overflow:hidden}.promotion-stats-modern .pattern-svg{width:100%;height:100%}.layout.dark-mode .promotion-stats-modern .stat-card-modern{background:linear-gradient(145deg,#2a2d3a,#242735);border:1px solid #3a3f52;box-shadow:0 8px 32px #00000040,0 2px 8px #00000026,inset 0 1px #ffffff0d}.layout.dark-mode .promotion-stats-modern .stat-card-modern:before{background:linear-gradient(90deg,#4dabf7cc,#2d8de899,#4dabf7cc)}.layout.dark-mode .promotion-stats-modern .stat-card-modern:hover{transform:translateY(-6px);box-shadow:0 16px 48px #00000059,0 6px 16px #00000040,inset 0 1px #ffffff14;border-color:#4a5168}.layout.dark-mode .promotion-stats-modern .pie-background{stroke:#ffffff1a}.layout.dark-mode .promotion-stats-modern .pie-value{fill:#f0f2f5;filter:drop-shadow(0 1px 2px rgba(0,0,0,.4))}.layout.dark-mode .promotion-stats-modern .stat-value-modern{background:linear-gradient(135deg,#f0f2f5,#c8d0e0);-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 1px 2px rgba(0,0,0,.2)}.layout.dark-mode .promotion-stats-modern .stat-title-modern{color:#a3b1c6;opacity:.9}.layout.dark-mode .promotion-stats-modern .stat-meta{border-top:1px solid rgba(255,255,255,.08)}.layout.dark-mode .promotion-stats-modern .description-text{color:#8a96b0}.layout.dark-mode .promotion-stats-modern .stat-change-modern.positive{background:linear-gradient(135deg,#48bb7840,#48bb781a);color:#5cd985;border:1px solid rgba(72,187,120,.4);box-shadow:0 2px 8px #48bb7833}.layout.dark-mode .promotion-stats-modern .stat-change-modern.negative{background:linear-gradient(135deg,#f5656540,#f565651a);color:#ff7a7a;border:1px solid rgba(245,101,101,.4);box-shadow:0 2px 8px #f5656533}.layout.dark-mode .promotion-stats-modern .progress-dot.active{box-shadow:0 0 6px currentColor}.promotion-stats-modern .stats-details-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:30px}.promotion-stats-modern .distribution-section,.promotion-stats-modern .recent-section{background:#fff;border-radius:16px;padding:24px;box-shadow:0 4px 16px #0000000d;border:1px solid #eaeaea}.layout.dark-mode .promotion-stats-modern .distribution-section,.layout.dark-mode .promotion-stats-modern .recent-section{background:linear-gradient(145deg,#2a2d3a,#242735);border:1px solid #3a3f52;box-shadow:0 4px 20px #00000040}.promotion-stats-modern .distribution-section h3,.promotion-stats-modern .recent-section h3{margin:0 0 20px;color:#2c3e50;font-size:18px;font-weight:600}.layout.dark-mode .promotion-stats-modern .distribution-section h3,.layout.dark-mode .promotion-stats-modern .recent-section h3{color:#f0f2f5!important}.promotion-stats-modern .type-progress-item-modern{margin-bottom:20px}.promotion-stats-modern .type-header-modern{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.promotion-stats-modern .type-info{display:flex;align-items:center;gap:10px}.promotion-stats-modern .type-bullet{width:12px;height:12px;border-radius:50%}.promotion-stats-modern .type-name-modern{font-weight:600;color:#495057;font-size:14px}.layout.dark-mode .promotion-stats-modern .type-name-modern{color:#e2e8f0!important}.promotion-stats-modern .type-count-modern{display:flex;gap:6px;font-size:13px}.promotion-stats-modern .count-value{font-weight:700;color:#2c3e50}.promotion-stats-modern .count-active{color:#6c757d}.layout.dark-mode .promotion-stats-modern .count-value{color:#f0f2f5!important}.layout.dark-mode .promotion-stats-modern .count-active{color:#a3b1c6!important}.promotion-stats-modern .progress-container-modern{margin-top:8px}.promotion-stats-modern .progress-track{height:6px;background:#f0f2f5;border-radius:3px;overflow:hidden;margin-bottom:6px}.layout.dark-mode .promotion-stats-modern .progress-track{background:#35384a}.promotion-stats-modern .progress-bar-modern{height:100%;border-radius:3px;transition:width .6s ease-out}.promotion-stats-modern .progress-label{display:flex;justify-content:space-between;align-items:center;font-size:11px}.promotion-stats-modern .percentage{color:#6c757d;font-weight:600}.promotion-stats-modern .status-dots{font-size:8px;letter-spacing:2px;color:#28a745}.promotion-stats-modern .recent-list-modern{display:flex;flex-direction:column;gap:12px}.promotion-stats-modern .recent-item-modern{display:flex;align-items:center;gap:12px;padding:12px;background:#f8f9fa;border-radius:10px;border-left:3px solid #4dabf7;transition:all .3s ease}.layout.dark-mode .promotion-stats-modern .recent-item-modern{background:#2d3748;border-left:3px solid #4dabf7}.promotion-stats-modern .recent-item-modern:hover{transform:translate(4px);background:#e9ecef}.layout.dark-mode .promotion-stats-modern .recent-item-modern:hover{background:#35384a}.promotion-stats-modern .recent-icon{font-size:20px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:#4dabf71a;border-radius:8px;color:#4dabf7}.promotion-stats-modern .recent-content{flex:1}.promotion-stats-modern .recent-title-modern{font-weight:600;color:#2c3e50;font-size:14px;margin-bottom:4px}.layout.dark-mode .promotion-stats-modern .recent-title-modern{color:#f0f2f5!important}.promotion-stats-modern .recent-meta-modern{display:flex;gap:8px;align-items:center;font-size:11px}.promotion-stats-modern .status-badge-modern{padding:2px 8px;border-radius:10px;font-weight:600;text-transform:uppercase;letter-spacing:.3px}.promotion-stats-modern .status-badge-modern.active{background:#28a74526;color:#28a745}.promotion-stats-modern .status-badge-modern.inactive{background:#6c757d26;color:#6c757d}.promotion-stats-modern .type-badge{padding:2px 8px;background:#4dabf71a;color:#4dabf7;border-radius:10px;font-weight:600}.promotion-stats-modern .days-left-modern{color:#6c757d;font-weight:500}.promotion-stats-modern .recent-value{display:flex;flex-direction:column;align-items:center;gap:4px}.promotion-stats-modern .days-badge{padding:4px 8px;background:linear-gradient(135deg,#4dabf7,#2d8de8);color:#fff;border-radius:6px;font-size:12px;font-weight:700;min-width:36px;text-align:center}.promotion-stats-modern .no-recent-data{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;color:#6c757d}.promotion-stats-modern .no-data-icon{font-size:48px;opacity:.4;margin-bottom:16px}.layout.dark-mode .promotion-stats-modern .no-recent-data{color:#a3b1c6}@media (max-width: 1200px){.promotion-stats-modern .stats-grid{grid-template-columns:repeat(2,1fr)!important}.promotion-stats-modern .stats-details-grid{grid-template-columns:1fr;gap:20px}}@media (max-width: 768px){.promotion-stats-modern .stats-grid{grid-template-columns:1fr!important;gap:20px!important}.promotion-stats-modern .stat-card-modern{padding:30px}.promotion-stats-modern .stat-chart-container{width:60px;height:60px}}@media (max-width: 480px){.promotion-stats-modern .stat-card-modern{padding:20px}.promotion-stats-modern .stat-value-modern{font-size:24px}.promotion-stats-modern .recent-meta-modern{flex-wrap:wrap;gap:4px}}.promotion-stats-modern .type-progress-modern:empty{display:none}.promotion-stats-modern .type-progress-modern.no-data{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;padding:40px 20px;text-align:center;color:#6c757d}.promotion-stats-modern .no-distribution-data{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;padding:40px 20px}.promotion-stats-modern .no-distribution-icon{font-size:48px;opacity:.4;margin-bottom:16px;color:#adb5bd}.promotion-stats-modern .no-distribution-text{font-size:16px;font-weight:500;color:#6c757d;margin-bottom:8px}.promotion-stats-modern .no-distribution-subtext{font-size:14px;color:#adb5bd;max-width:250px;line-height:1.4}.layout.dark-mode .promotion-stats-modern .no-distribution-icon{color:#8a96b0}.layout.dark-mode .promotion-stats-modern .no-distribution-text{color:#a3b1c6}.layout.dark-mode .promotion-stats-modern .no-distribution-subtext{color:#8a96b0}.type-selector{display:flex;gap:10px;flex-wrap:wrap}.type-btn{flex:1;min-width:120px;padding:12px 16px;border:2px solid #dee2e6;border-radius:8px;background:#fff;color:#495057;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:8px}.type-btn:hover:not(:disabled){border-color:#3498db;transform:translateY(-2px);box-shadow:0 3px 8px #3498db1a}.type-btn.active{border-color:#3498db;background:#3498db;color:#fff;box-shadow:0 2px 6px #3498db33}.type-btn:disabled{opacity:.6;cursor:not-allowed}.type-btn.active[data-type=banner]{background:linear-gradient(135deg,#667eea,#764ba2)!important;border-color:#667eea!important}.type-btn.active[data-type=coupon]{background:linear-gradient(135deg,#f093fb,#f5576c)!important;border-color:#f5576c!important}.type-btn.active[data-type=offer]{background:linear-gradient(135deg,#4facfe,#00f2fe)!important;border-color:#4facfe!important}.layout.dark-mode .type-btn{background:#2d3748;border-color:#4a5568;color:#e2e8f0}.layout.dark-mode .type-btn.active[data-type=banner]{background:linear-gradient(135deg,#5a67d8,#805ad5)!important}.layout.dark-mode .type-btn.active[data-type=coupon]{background:linear-gradient(135deg,#d53f8c,#ed64a6)!important}.layout.dark-mode .type-btn.active[data-type=offer]{background:linear-gradient(135deg,#3182ce,#63b3ed)!important}.discount-type-selector{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}@media (min-width: 480px){.discount-type-selector{grid-template-columns:repeat(4,1fr)}}.discount-type-btn{padding:12px 10px;border:2px solid #dee2e6;border-radius:8px;background:#fff;color:#495057;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease;text-align:center;white-space:nowrap}.discount-type-btn:hover:not(:disabled){border-color:#3498db;transform:translateY(-2px);box-shadow:0 3px 8px #3498db1a}.discount-type-btn.active{border-color:#3498db;background:#3498db;color:#fff;box-shadow:0 2px 6px #3498db33}.discount-type-btn:disabled{opacity:.6;cursor:not-allowed}.layout.dark-mode .discount-type-btn{background:#2d3748;border-color:#4a5568;color:#e2e8f0}.form-actions .btn-cancel,.form-actions .btn-submit{padding:14px 28px;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .3s ease;border:none;min-width:140px}.form-actions .btn-cancel{background:#fff;border:2px solid #dee2e6!important;color:#6c757d}.form-actions .btn-cancel:hover:not(:disabled){background:#f8f9fa;border-color:#adb5bd!important;transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.form-actions .btn-submit{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 2px 5px #667eea33}.form-actions .btn-submit:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #667eea4d}.form-actions .btn-submit:disabled,.form-actions .btn-cancel:disabled{opacity:.6;cursor:not-allowed;transform:none!important;box-shadow:none!important}.layout.dark-mode .form-actions .btn-cancel{background:#2d3748;border-color:#4a5568!important;color:#e2e8f0}.layout.dark-mode .form-actions .btn-cancel:hover:not(:disabled){background:#4a5568}.layout.dark-mode .form-actions .btn-submit{background:linear-gradient(135deg,#4dabf7,#2d8de8)!important;box-shadow:0 2px 5px #4dabf733!important}.layout.dark-mode .form-actions .btn-submit:hover:not(:disabled){box-shadow:0 4px 12px #4dabf74d!important}.layout.dark-mode .discount-type-btn.active{border-color:#4dabf7!important;background:#4dabf7!important;color:#fff!important;box-shadow:0 2px 6px #4dabf74d!important}.layout.dark-mode .discount-type-btn:hover:not(:disabled){border-color:#4dabf7!important;box-shadow:0 3px 8px #4dabf733!important}.profile-page{max-width:1000px;margin:0 auto;padding:20px;background-color:#f8f9fa}.layout.dark-mode .profile-page{background:#4c4e5b!important;color:#e2e8f0!important}.page-header{margin-bottom:30px}.page-header h1{color:#2c3e50;font-size:2rem;margin:0;transition:color .3s ease}.profile-page .profile-content{display:grid;grid-template-columns:1fr 350px;gap:30px;align-items:start}.profile-page .profile-card{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 20px #00000014;border:1px solid #e2e8f0;transition:all .3s ease}.layout.dark-mode .profile-card{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 2px 20px #0000004d!important}.profile-header{display:flex;align-items:flex-start;margin-bottom:30px;padding-bottom:25px;border-bottom:1px solid #ecf0f1;transition:border-color .3s ease}.layout.dark-mode .profile-header{border-bottom:1px solid #4a5568!important}.profile-avatar{width:80px;height:80px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2rem;margin-right:20px;color:#fff;border:3px solid white;box-shadow:0 4px 12px #00000026;transition:all .3s ease}.layout.dark-mode .profile-avatar{border:3px solid #252631!important;background:linear-gradient(135deg,#4dabf7,#667eea)!important;box-shadow:0 4px 12px #0000004d!important}.profile-info h2{margin:0 0 8px;color:#2c3e50;font-size:1rem;transition:color .3s ease}.profile-info{display:flex;flex-direction:column;align-items:flex-start;gap:6px}.layout.dark-mode .profile-info h2{color:#e2e8f0!important}.profile-info .role{margin:0 0 12px;color:#7f8c8d;font-size:.9rem;background:#f8f9fa;padding:6px 16px;border-radius:20px;display:inline-block;border:1px solid #e2e8f0;font-weight:600;text-transform:uppercase;letter-spacing:.5px;transition:all .3s ease}.layout.dark-mode .profile-info .role,.layout.dark-mode .profile-info .role.admin{background:#4dabf733!important;color:#4dabf7!important;border:1px solid rgba(77,171,247,.3)!important}.layout.dark-mode .profile-info .role.moderator{background:#ed893633!important;color:#ed8936!important;border:1px solid rgba(237,137,54,.3)!important}.layout.dark-mode .profile-info .role.user{background:#48bb7833!important;color:#48bb78!important;border:1px solid rgba(72,187,120,.3)!important}.join-date{font-size:.9rem;color:#95a5a6;transition:color .3s ease;padding-left:0;margin-top:4px}.layout.dark-mode .join-date{color:#a0aec0!important}.btn-edit-profile{background:#3498db;color:#fff;border:none;padding:12px 18px;border-radius:8px;cursor:pointer;margin-left:auto;font-weight:600;transition:all .3s ease}.btn-edit-profile:hover{background:#2980b9;transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.layout.dark-mode .btn-edit-profile{background:#4dabf7!important;color:#fff!important;border:1px solid transparent!important}.layout.dark-mode .btn-edit-profile:hover{background:#4299e1!important;box-shadow:0 4px 12px #0000004d!important}.profile-form{margin-top:10px}.form-section{margin-bottom:30px}.form-section h3{color:#2c3e50;margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid #ecf0f1;font-size:1.2rem;transition:all .3s ease}.layout.dark-mode .form-section h3{color:#e2e8f0!important;border-bottom:2px solid #4a5568!important}.form-grid{display:flex;flex-direction:column;gap:20px}.form-group.full-width{width:100%}.form-label{font-weight:600;color:#2c3e50;margin-bottom:8px;font-size:14px;transition:color .3s ease}.form-input{padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-size:14px;transition:all .3s ease;background:#fff;color:#2d3748}.form-input:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.form-input:disabled{background-color:#f8f9fa;color:#6c757d;cursor:not-allowed}.layout.dark-mode .form-input{background:#2d3748!important;border:2px solid #4a5568!important;color:#e2e8f0!important}.layout.dark-mode .form-input:focus{border-color:#4dabf7!important;box-shadow:0 0 0 3px #4dabf733!important}.layout.dark-mode .form-input:disabled{background-color:#4a5568!important;color:#a0aec0!important}.phone-input-container{display:flex;gap:12px;align-items:center;width:100%;flex-wrap:nowrap}.country-code-select{flex:0 0 140px;padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;background:#fff;font-size:14px;transition:all .3s ease;color:#2d3748;max-width:140px;width:100%}.country-code-select:focus{outline:none;border-color:#3498db}.phone-number-input{flex:1;min-width:150px;padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-size:14px;transition:all .3s ease;background:#fff;color:#2d3748;width:100%}.phone-number-input:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.layout.dark-mode .country-code-select,.layout.dark-mode .phone-number-input{background:#2d3748!important;border:2px solid #4a5568!important;color:#e2e8f0!important}.layout.dark-mode .country-code-select:focus,.layout.dark-mode .phone-number-input:focus{border-color:#4dabf7!important;box-shadow:0 0 0 3px #4dabf733!important}.phone-preview{margin-top:8px;font-size:12px;color:#6c757d;font-style:italic;transition:color .3s ease}.layout.dark-mode .phone-preview{color:#a0aec0!important}.profile-details{margin-top:10px}.details-section{margin-bottom:0}.details-section h3{color:#2c3e50;margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid #ecf0f1;font-size:1.2rem;transition:all .3s ease}.layout.dark-mode .details-section h3{color:#e2e8f0!important;border-bottom:2px solid #4a5568!important}.details-grid{display:flex;flex-direction:column;gap:16px}.detail-item{display:flex;justify-content:space-between;align-items:center;padding:16px;background:#f8f9fa;border-radius:8px;border-left:4px solid #3498db;border:1px solid #e2e8f0;transition:all .3s ease}.layout.dark-mode .detail-item{background:#2d3748!important;border-left:4px solid #4dabf7!important;border:1px solid #4a5568!important}.detail-label{font-weight:600;color:#2c3e50;font-size:14px;transition:color .3s ease}.layout.dark-mode .detail-label{color:#e2e8f0!important}.detail-value{color:#6c757d;font-size:14px;text-align:right;transition:color .3s ease}.layout.dark-mode .detail-value{color:#a0aec0!important}.form-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:30px;padding-top:25px;border-top:1px solid #ecf0f1;transition:border-color .3s ease}.btn-primary{background:#3498db;color:#fff;border:none;padding:12px 30px;border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;transition:all .3s ease;min-width:120px;border:1px solid transparent}.btn-primary:hover:not(:disabled){background:#2980b9;transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.btn-primary:disabled{background:#bdc3c7;cursor:not-allowed;transform:none;border:1px solid #e2e8f0}.layout.dark-mode .btn-primary{background:#4dabf7!important;color:#fff!important}.layout.dark-mode .btn-primary:hover:not(:disabled){background:#4299e1!important;box-shadow:0 4px 12px #0000004d!important}.layout.dark-mode .btn-primary:disabled{background:#4a5568!important;color:#a0aec0!important;border:1px solid #4a5568!important}.btn-secondary{background:#6c757d;color:#fff;border:none;padding:12px 30px;border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;transition:all .3s ease;min-width:120px;border:1px solid transparent}.btn-secondary:hover:not(:disabled){background:#5a6268;transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.btn-secondary:disabled{background:#bdc3c7;cursor:not-allowed;transform:none;border:1px solid #e2e8f0}.layout.dark-mode .btn-secondary:hover:not(:disabled){background:#4a5568!important;box-shadow:0 4px 12px #0000004d!important}.layout.dark-mode .btn-secondary:disabled{background:#4a5568!important;color:#a0aec0!important;border:1px solid #4a5568!important}.profile-stats{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 20px #00000014;height:fit-content;position:sticky;top:20px;border:1px solid #e2e8f0;transition:all .3s ease}.layout.dark-mode .profile-stats{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 2px 20px #0000004d!important}.profile-stats h3{margin-bottom:20px;color:#2c3e50;border-bottom:2px solid #ecf0f1;padding-bottom:10px;font-size:1.2rem;transition:all .3s ease}.layout.dark-mode .profile-stats h3{color:#e2e8f0!important;border-bottom:2px solid #4a5568!important}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.stat-item{text-align:center;padding:20px 15px;background:#f8f9fa;border-radius:8px;transition:all .3s ease;border:1px solid #e2e8f0}.stat-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.layout.dark-mode .stat-item{background:#2d3748!important;border:1px solid #4a5568!important}.layout.dark-mode .stat-item:hover{box-shadow:0 4px 12px #0000004d!important;border-color:#4dabf7!important}.stat-number{display:block;font-size:1.8rem;font-weight:700;color:#3498db;margin-bottom:5px;transition:color .3s ease}.layout.dark-mode .stat-number{color:#4dabf7!important}.stat-label{font-size:.85rem;color:#6c757d;font-weight:500;transition:color .3s ease}.layout.dark-mode .stat-label{color:#a0aec0!important}.image-upload-section{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:15px}.profile-image-input{display:none}.profile-image-label{background:#3498db;color:#fff;padding:10px 20px;border-radius:6px;font-size:.9rem;cursor:pointer;transition:all .3s ease;border:1px solid transparent;text-align:center;min-width:140px}.profile-image-label:hover{background:#2980b9;transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.profile-image-label:active{transform:translateY(0)}.profile-image-label:disabled{background:#bdc3c7;cursor:not-allowed;transform:none;border:1px solid #e2e8f0}.layout.dark-mode .profile-image-label{background:#4dabf7!important;color:#fff!important}.layout.dark-mode .profile-image-label:hover:not(:disabled){background:#4299e1!important;box-shadow:0 4px 12px #0000004d!important}.layout.dark-mode .profile-image-label:disabled{background:#4a5568!important;color:#a0aec0!important;border:1px solid #4a5568!important}.profile-avatar-container{display:flex;flex-direction:column;align-items:center;gap:15px}.profile-avatar{width:100px;height:100px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2.5rem;color:#fff;overflow:hidden;border:4px solid white;box-shadow:0 4px 12px #00000026;cursor:pointer;transition:all .3s ease}.profile-avatar:hover{transform:scale(1.05);box-shadow:0 6px 20px #0003}.layout.dark-mode .profile-avatar{border:4px solid #252631!important;background:linear-gradient(135deg,#4dabf7,#667eea)!important;box-shadow:0 4px 12px #0000004d!important}.layout.dark-mode .profile-avatar:hover{box-shadow:0 6px 20px #0006!important}.profile-image{width:100%;height:100%;object-fit:cover}.avatar-fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.profile-card::-webkit-scrollbar{width:6px}.profile-card::-webkit-scrollbar-track{background:#f7fafc;border-radius:3px;transition:background .3s ease}.profile-card::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:3px;transition:background .3s ease}.profile-card::-webkit-scrollbar-thumb:hover{background:#a0aec0}.layout.dark-mode .profile-card::-webkit-scrollbar-track{background:#2d3748!important}.layout.dark-mode .profile-card::-webkit-scrollbar-thumb{background:#4a5568!important}.layout.dark-mode .profile-card::-webkit-scrollbar-thumb:hover{background:#718096!important}.layout.dark-mode .profile-card,.layout.dark-mode .profile-stats,.layout.dark-mode .stat-item,.layout.dark-mode .detail-item,.layout.dark-mode .btn-primary,.layout.dark-mode .btn-secondary,.layout.dark-mode .profile-image-label{transition:background-color .3s ease,border-color .3s ease,color .3s ease,box-shadow .3s ease!important}@media (max-width: 968px){.profile-content{grid-template-columns:1fr;gap:20px}.profile-stats{position:static}}@media (max-width: 768px){.profile-page{padding:15px}.profile-header{flex-direction:column;text-align:center;gap:15px}.profile-avatar{margin-right:0}.btn-edit-profile{margin-left:0;width:100%}.country-code-select{flex:none;width:100%}.phone-number-input{width:100%}.form-actions{flex-direction:column}.stats-grid{grid-template-columns:1fr}.detail-item{flex-direction:column;align-items:flex-start;gap:8px}.detail-value{text-align:left}.profile-avatar{width:80px;height:80px;font-size:2rem}.profile-image-label{padding:8px 16px;font-size:.8rem;min-width:120px}.phone-input-container{flex-direction:column;gap:10px}.country-code-select{flex:none;width:100%;max-width:100%}.phone-number-input{flex:none;width:100%}}@media (max-width: 480px){.profile-card,.profile-stats{padding:20px}.page-header h1{font-size:1.5rem}.phone-input-container{flex-direction:column;gap:10px}.country-code-select{flex:none;width:100%;max-width:100%}.phone-number-input{flex:none;width:100%}}.profile-page .profile-stats .stats-grid{display:flex;flex-direction:column;gap:15px}@media (max-width: 768px){.profile-page .profile-stats .stats-grid{grid-template-columns:1fr!important}}.settings-page{max-width:1000px;margin:0 auto;padding:20px;background-color:#f8f9fa}.layout.dark-mode .settings-page{background:#4c4e5b!important;color:#e2e8f0!important}.settings-header{margin-bottom:40px}.settings-header h1{color:#2c3e50;margin-bottom:8px;font-size:2.5rem;font-weight:700;transition:color .3s ease}.settings-header p{color:#7f8c8d;font-size:1.1rem;margin:0;transition:color .3s ease}.layout.dark-mode .settings-header h1{color:#e2e8f0!important}.layout.dark-mode .settings-header p{color:#a0aec0!important}.settings-sections{display:flex;flex-direction:column;gap:30px}.settings-section{background:#fff;border-radius:16px;padding:30px;box-shadow:0 4px 20px #00000014;border:1px solid #e2e8f0;transition:all .3s ease}.layout.dark-mode .settings-section{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 4px 20px #0000004d!important}.section-header{margin-bottom:25px}.section-header h2{color:#2c3e50;margin-bottom:8px;font-size:1.5rem;font-weight:600;transition:color .3s ease}.section-header p{color:#7f8c8d;margin:0;transition:color .3s ease}.layout.dark-mode .section-header h2{color:#e2e8f0!important}.layout.dark-mode .section-header p{color:#a0aec0!important}.settings-form{margin-top:20px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:25px}.form-group{display:flex;flex-direction:column}.form-group.full-width{grid-column:1 / -1}.form-label{font-weight:600;color:#2c3e50;margin-bottom:8px;font-size:.9rem;transition:color .3s ease}.layout.dark-mode .form-label{color:#e2e8f0!important}.form-input,.form-textarea,.form-select{padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-size:1rem;transition:all .3s ease;background:#fff;color:#2d3748}.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.form-textarea{resize:vertical;min-height:80px;font-family:inherit}.form-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=US-ASCII,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'><path fill='%23666' d='M2 0L0 2h4zm0 5L0 3h4z'/></svg>");background-repeat:no-repeat;background-position:right 12px center;background-size:12px;padding-right:40px}.layout.dark-mode .form-input,.layout.dark-mode .form-textarea,.layout.dark-mode .form-select{background:#2d3748!important;border:2px solid #4a5568!important;color:#e2e8f0!important}.layout.dark-mode .form-input:focus,.layout.dark-mode .form-textarea:focus,.layout.dark-mode .form-select:focus{border-color:#4dabf7!important;box-shadow:0 0 0 3px #4dabf733!important}.layout.dark-mode .form-select{background-image:url("data:image/svg+xml;charset=US-ASCII,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'><path fill='%23a0aec0' d='M2 0L0 2h4zm0 5L0 3h4z'/></svg>")}.image-preview{margin-top:8px}.image-preview img{max-width:100px;max-height:100px;border-radius:8px;border:2px solid #e2e8f0;object-fit:cover;transition:border-color .3s ease}.layout.dark-mode .image-preview img{border:2px solid #4a5568!important}.form-actions{display:flex;justify-content:flex-end;gap:12px;padding-top:20px;border-top:1px solid #e2e8f0;transition:border-color .3s ease}.layout.dark-mode .form-actions{border-top:1px solid #4a5568!important}.btn-primary{background:linear-gradient(135deg,#3498db,#2980b9);color:#fff;border:none;padding:12px 24px;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:8px;box-shadow:0 2px 8px #3498db4d;border:1px solid transparent}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #3498db66}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}.layout.dark-mode .btn-primary{background:linear-gradient(135deg,#4dabf7,#4299e1)!important;color:#fff!important}.layout.dark-mode .btn-primary:hover:not(:disabled){box-shadow:0 4px 12px #4dabf766!important}.btn-secondary{background:#6c757d;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease;border:1px solid transparent}.btn-secondary:hover{background:#5a6268;transform:translateY(-1px)}.layout.dark-mode .btn-secondary{background:#718096!important;color:#fff!important}.layout.dark-mode .btn-secondary:hover{background:#4a5568!important;box-shadow:0 4px 12px #0000004d!important}.logout-section{background:linear-gradient(135deg,#fff5f5,#fff);border:1px solid #fbd5d5;transition:all .3s ease}.layout.dark-mode .logout-section{background:linear-gradient(135deg,#f565651a,#2d3748)!important;border:1px solid #f56565!important}.logout-actions{display:flex;justify-content:center}.danger-btn{background:linear-gradient(135deg,#e74c3c,#c0392b);color:#fff;border:none;padding:14px 28px;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:10px;box-shadow:0 2px 8px #e74c3c4d;border:1px solid transparent}.danger-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #e74c3c66}.danger-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.layout.dark-mode .danger-btn{background:linear-gradient(135deg,#f56565,#e53e3e)!important;color:#fff!important}.layout.dark-mode .danger-btn:hover:not(:disabled){box-shadow:0 4px 12px #f5656566!important}.btn-icon{font-size:1.2rem}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.modal-content{background:#fff;border-radius:16px;padding:0;max-width:400px;width:90%;box-shadow:0 20px 60px #0000004d;animation:slideUp .3s ease;border:1px solid #e2e8f0;transition:all .3s ease}.layout.dark-mode .modal-overlay{background:#000000b3!important}.layout.dark-mode .modal-content{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 20px 60px #0006!important}.modal-header{padding:24px 24px 0}.modal-header h3{margin:0;color:#2c3e50;font-size:1.3rem;transition:color .3s ease}.modal-body{padding:20px 24px}.modal-body p{margin:0 0 12px;color:#5a6c7d;transition:color .3s ease}.layout.dark-mode .modal-body p{color:#a0aec0!important}.warning-text{color:#e74c3c!important;font-weight:500;transition:color .3s ease}.layout.dark-mode .warning-text{color:#f56565!important}.modal-actions{padding:0 24px 24px;display:flex;gap:12px;justify-content:flex-end}.btn{padding:10px 20px;border:none;border-radius:6px;font-weight:600;cursor:pointer;transition:all .3s ease;border:1px solid transparent}.layout.dark-mode .btn-danger{background:#f56565!important;color:#fff!important}.layout.dark-mode .btn-danger:hover{background:#e53e3e!important}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center}.loading-spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #3498db;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px;transition:all .3s ease}.loading-spinner-small{width:16px;height:16px;border:2px solid transparent;border-top:2px solid white;border-radius:50%;animation:spin 1s linear infinite}.layout.dark-mode .loading-spinner{border:4px solid #4a5568!important;border-top:4px solid #4dabf7!important}.layout.dark-mode .loading-spinner-small{border-top:2px solid #e2e8f0!important}.checkbox-group{margin-top:8px}.checkbox-label{display:flex;align-items:center;cursor:pointer;font-weight:500;color:#2d3748;gap:10px;transition:color .3s ease}.checkbox-input{display:none}.checkbox-custom{width:20px;height:20px;border:2px solid #e2e8f0;border-radius:4px;position:relative;transition:all .3s ease;background:#fff}.checkbox-input:checked+.checkbox-custom{background:#3498db;border-color:#3498db}.checkbox-input:checked+.checkbox-custom:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:12px;font-weight:700}.checkbox-label:hover .checkbox-custom{border-color:#3498db}.layout.dark-mode .checkbox-label{color:#e2e8f0!important}.layout.dark-mode .checkbox-custom{background:#2d3748!important;border:2px solid #4a5568!important}.layout.dark-mode .checkbox-input:checked+.checkbox-custom{background:#4dabf7!important;border-color:#4dabf7!important}.success-message{padding:12px 16px;background:#48bb781a;border:1px solid #48bb78;border-radius:8px;color:#48bb78;font-weight:500;margin-top:16px;display:flex;align-items:center;gap:8px;transition:all .3s ease}.layout.dark-mode .success-message{background:#48bb7833!important;border:1px solid #48bb78!important;color:#48bb78!important}.layout.dark-mode .settings-section,.layout.dark-mode .btn-primary,.layout.dark-mode .btn-secondary,.layout.dark-mode .danger-btn,.layout.dark-mode .form-input,.layout.dark-mode .form-textarea,.layout.dark-mode .form-select{transition:background-color .3s ease,border-color .3s ease,color .3s ease,box-shadow .3s ease!important}@media (max-width: 768px){.settings-page{padding:16px}.form-grid{grid-template-columns:1fr}.settings-section{padding:20px}.modal-actions{flex-direction:column}.btn{width:100%}}@keyframes slideUp{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}Add this at the TOP of your Users.css file *{box-sizing:border-box}.users-page{position:relative;padding:20px;background-color:#f8f9fa;min-height:100vh}.modal-overlay{position:fixed!important;top:0!important;left:0!important;right:0!important;bottom:0!important;background:#000000bf!important;display:flex!important;align-items:center!important;justify-content:center!important;z-index:999999!important;padding:20px;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{position:relative!important;background:#fff!important;border-radius:12px!important;padding:24px!important;max-width:500px!important;width:90%!important;max-height:90vh!important;overflow-y:auto!important;box-shadow:0 20px 60px #00000080!important;border:2px solid #3498db!important;z-index:1000000!important;animation:slideUp .3s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.filter-group select,.edit-row select,.form-group select,.modal select{background-color:#fff!important;border:2px solid #e2e8f0!important;border-radius:8px!important;padding:10px 40px 10px 16px!important;font-size:14px!important;color:#2d3748!important;cursor:pointer!important;-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23495057' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 12px center!important;background-size:16px!important;min-height:42px!important}.layout.dark-mode .filter-group select,.layout.dark-mode .edit-row select,.layout.dark-mode .form-group select,.layout.dark-mode .modal select{background-color:#252631!important;border:2px solid #4a5568!important;color:#e2e8f0!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23e2e8f0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E")!important}.filter-group select:focus,.edit-row select:focus,.form-group select:focus,.modal select:focus{outline:none!important;border-color:#3498db!important}.layout.dark-mode .filter-group select:focus,.layout.dark-mode .edit-row select:focus,.layout.dark-mode .form-group select:focus,.layout.dark-mode .modal select:focus{border-color:#4dabf7!important}.modal,.modal *{visibility:visible!important;opacity:1!important;display:block!important}.layout.dark-mode .modal{background:#1a202c!important;color:#e2e8f0!important;border:2px solid #4dabf7!important}.modal-body,.modal-header,.modal-footer{position:relative;z-index:1}.modal :global(*){all:revert!important}.modal-close{background:none!important;border:none!important;font-size:28px!important;line-height:1!important;cursor:pointer!important;color:#6c757d!important;width:36px!important;height:36px!important;display:flex!important;align-items:center!important;justify-content:center!important;border-radius:50%!important;transition:all .2s ease!important;position:absolute!important;top:20px!important;right:20px!important;z-index:2!important}.modal-close:hover{background:#0000001a!important;color:#495057!important}.layout.dark-mode .modal-close{color:#a0aec0!important}.layout.dark-mode .modal-close:hover{background:#ffffff1a!important;color:#e2e8f0!important}.modal-header{padding-right:50px!important;padding-bottom:20px!important;margin-bottom:20px!important;border-bottom:2px solid #e2e8f0!important}.edit-row{display:flex!important;gap:10px!important;align-items:center!important;background:#f8f9fa!important;padding:10px!important;border-radius:8px!important;margin-top:10px!important;border:1px solid #e2e8f0!important}.edit-row input,.edit-row select{padding:8px 12px!important;border:1px solid #ccc!important;border-radius:4px!important;font-size:14px!important}.edit-row input{flex:1!important;min-width:150px!important}.edit-row select{min-width:120px!important}.edit-buttons{display:flex!important;gap:5px!important}.save-btn,.cancel-btn{padding:8px 16px!important;border:none!important;border-radius:4px!important;cursor:pointer!important;font-size:14px!important;font-weight:600!important;transition:all .2s ease!important}.save-btn{background:#28a745!important;color:#fff!important}.save-btn:hover{background:#218838!important}.cancel-btn{background:#6c757d!important;color:#fff!important}.cancel-btn:hover{background:#5a6268!important}.user-profile-header{display:flex;align-items:center;gap:20px;margin-bottom:24px;padding-bottom:24px;border-bottom:2px solid #e2e8f0}.user-avatar.large{width:80px;height:80px}.avatar-placeholder.large{width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;align-items:center;justify-content:center;font-size:32px;font-weight:600}.user-profile-info h4{margin:0 0 8px;color:#2c3e50;font-size:20px;font-weight:600}.user-role-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:600;background:#f8f9fa;border:1px solid #e2e8f0;margin-top:8px}.user-details-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:24px}.detail-item label{display:block;margin-bottom:4px;font-size:12px;color:#6c757d;text-transform:uppercase;letter-spacing:.5px;font-weight:600}.detail-item span{display:block;color:#4c4e5b;font-size:14px;font-weight:500}.layout.dark-mode .users-page{background:#4c4e5b!important;color:#e2e8f0!important}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.page-header h1{font-size:28px;font-weight:600;color:#2c3e50;margin-bottom:8px}.layout.dark-mode .page-header h1{color:#e2e8f0!important}.page-header p{color:#6c757d;font-size:16px;margin:0}.layout.dark-mode .page-header p{color:#a0aec0!important}.page-header .btn-primary{display:flex;align-items:center;gap:8px;padding:12px 24px;background:#3498db;color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s ease;border:1px solid transparent}.page-header .btn-primary:hover{background:#2980b9;transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.layout.dark-mode .page-header .btn-primary{background:#4dabf7!important;color:#fff!important}.layout.dark-mode .page-header .btn-primary:hover{background:#4299e1!important;box-shadow:0 4px 12px #0000004d!important}.filters-section{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;gap:16px;flex-wrap:wrap}.search-box{flex:1;min-width:300px;display:flex;align-items:center;gap:12px;padding:12px 16px;background:#fff;border:2px solid #e2e8f0;border-radius:8px;transition:all .3s ease}.layout.dark-mode .search-box{background:#252631!important;border:2px solid #4a5568!important}.search-box input{flex:1;border:none;background:transparent;font-size:14px;color:#2d3748}.layout.dark-mode .search-box input{color:#e2e8f0!important}.search-box input:focus{outline:none}.filter-controls{display:flex;gap:12px;align-items:center}.filter-group{display:flex;align-items:center;gap:8px;padding:10px 16px;background:#f8f9fa;border:2px solid #f8f9fa;border-radius:8px;transition:all .3s ease}.layout.dark-mode .filter-group{background:#4c4e5b!important;border:2px solid #4c4e5b!important}.filter-group select{border:none;background:transparent;font-size:14px;color:#2d3748;cursor:pointer}.layout.dark-mode .filter-group select{color:#e2e8f0!important}.filter-group select:focus{outline:none}.stats-grid{display:grid;grid-template-columns:repeat(5,minmax(200px,1fr))!important;gap:20px;margin-bottom:30px}.stat-info h3{margin:0 0 4px!important;font-size:24px!important;font-weight:700!important;color:#2c3e50!important;display:block!important;visibility:visible!important;opacity:1!important}.stat-info p{margin:0!important;color:#6c757d!important;font-size:14px!important;display:block!important;visibility:visible!important;opacity:1!important}.stat-card *{visibility:visible!important;opacity:1!important;display:block!important}.stat-card{background:#fff;padding:20px;border-radius:12px;display:flex;align-items:center;gap:16px;box-shadow:0 2px 20px #00000014;border:1px solid #e2e8f0;transition:all .3s ease}.layout.dark-mode .stat-card{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 2px 20px #0000004d!important}.stat-icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;border-radius:12px}.stat-info h3{margin:0 0 4px;font-size:24px;font-weight:700;color:#2c3e50}.layout.dark-mode .stat-info h3{color:#e2e8f0!important}.stat-info p{margin:0;color:#6c757d;font-size:14px}.layout.dark-mode .stat-info p{color:#a0aec0!important}.users-table-container{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 2px 20px #00000014;border:1px solid #e2e8f0;transition:all .3s ease}.layout.dark-mode .users-table-container{background:#252631!important;border:1px solid #4a5568!important;box-shadow:0 2px 20px #0000004d!important}.users-table{width:100%;border-collapse:collapse}.users-table th{background:#f8f9fa;padding:16px;text-align:left;font-weight:600;color:#495057;border-bottom:2px solid #e2e8f0;font-size:13px;text-transform:uppercase;letter-spacing:.5px;transition:all .3s ease}.layout.dark-mode .users-table th{background:#2d3748!important;color:#e2e8f0!important;border-bottom:2px solid #4a5568!important}.users-table td{padding:16px;border-bottom:1px solid #e2e8f0;vertical-align:middle;transition:all .3s ease}.layout.dark-mode .users-table td{border-bottom:1px solid #4a5568!important;color:#e2e8f0!important}.user-info{display:flex;align-items:center;gap:12px}.user-avatar{width:40px;height:40px}.user-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;border:2px solid white}.layout.dark-mode .user-avatar img{border:2px solid #252631!important}.avatar-placeholder{width:100%;height:100%;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:16px;border:2px solid white}.layout.dark-mode .avatar-placeholder{background:linear-gradient(135deg,#4dabf7,#667eea)!important;border:2px solid #252631!important}.user-details{display:flex;flex-direction:column}.user-details strong{color:#2c3e50;font-size:14px;margin-bottom:2px;font-weight:600}.layout.dark-mode .user-details strong{color:#e2e8f0!important}.user-email,.user-phone{font-size:12px;color:#6c757d}.layout.dark-mode .user-email,.layout.dark-mode .user-phone{color:#a0aec0!important}.role-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:600;background:#f8f9fa;border:1px solid #e2e8f0;transition:all .3s ease}.layout.dark-mode .role-badge{background:#2d3748!important;border:1px solid #4a5568!important}.role-badge.owner{background:#f3e8ff;color:#6b21a8;border-color:#d8b4fe}.layout.dark-mode .role-badge.owner{background:#a855f733!important;color:#a855f7!important;border-color:#a855f74d!important}.role-badge.admin{background:#dbeafe;color:#1e40af;border-color:#93c5fd}.layout.dark-mode .role-badge.admin{background:#3b82f633!important;color:#3b82f6!important;border-color:#3b82f64d!important}.role-badge.staff{background:#dcfce7;color:#166534;border-color:#86efac}.layout.dark-mode .role-badge.staff{background:#22c55e33!important;color:#22c55e!important;border-color:#22c55e4d!important}.status-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:600;border:1px solid transparent;transition:all .3s ease}.status-badge.active{background:#d4edda;color:#155724;border-color:#c3e6cb}.layout.dark-mode .status-badge.active{background:#48bb7833!important;color:#48bb78!important;border-color:#48bb784d!important}.status-badge.inactive{background:#f8d7da;color:#721c24;border-color:#f5c6cb}.layout.dark-mode .status-badge.inactive{background:#f5656533!important;color:#f56565!important;border-color:#f565654d!important}.last-login,.never-logged-in{font-size:13px;color:#6c757d}.layout.dark-mode .last-login,.layout.dark-mode .never-logged-in{color:#a0aec0!important}.actions{display:flex;gap:8px}.btn-icon{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:2px solid #e2e8f0;border-radius:6px;background:#fff;color:#495057;cursor:pointer;transition:all .3s ease}.layout.dark-mode .btn-icon{background:#2d3748!important;border:2px solid #4a5568!important;color:#e2e8f0!important}.btn-icon:hover:not(:disabled){background:#f8f9fa;border-color:#3498db;transform:translateY(-1px);box-shadow:0 2px 8px #0000001a}.layout.dark-mode .btn-icon:hover:not(:disabled){background:#4a5568!important;border-color:#4dabf7!important;box-shadow:0 2px 8px #0000004d!important}.btn-icon:disabled{opacity:.5;cursor:not-allowed;background:#f8f9fa;border-color:#e2e8f0}.layout.dark-mode .btn-icon:disabled{background:#4a5568!important;border-color:#4a5568!important;color:#a0aec0!important}.btn-icon.danger{color:#dc3545;border-color:#f8d7da}.btn-icon.danger:hover:not(:disabled){background:#f8d7da;color:#721c24;border-color:#dc3545}.layout.dark-mode .btn-icon.danger{color:#f56565!important;border-color:#f565654d!important}.layout.dark-mode .btn-icon.danger:hover:not(:disabled){background:#f5656533!important;color:#f56565!important;border-color:#f56565!important}.no-data{text-align:center;padding:40px;color:#6c757d;font-style:italic}.layout.dark-mode .no-data{color:#a0aec0!important}.modal-header{padding:24px;border-bottom:2px solid #e2e8f0;display:flex;justify-content:space-between;align-items:center;transition:all .3s ease}.layout.dark-mode .modal-header{border-bottom:2px solid #4a5568!important}.modal-header h3{margin:0;color:#2c3e50;font-size:20px;font-weight:600}.layout.dark-mode .modal-header h3{color:#e2e8f0!important}.modal-body{padding:24px}.form-group label{display:block;margin-bottom:8px;font-weight:600;color:#495057;font-size:14px}.layout.dark-mode .form-group label{color:#e2e8f0!important}.form-group input,.form-group select{width:100%;padding:12px;border:2px solid #e2e8f0;border-radius:8px;font-size:14px;color:#2d3748;background:#fff;transition:all .3s ease}.layout.dark-mode .form-group input,.layout.dark-mode .form-group select{background:#2d3748!important;border:2px solid #4a5568!important;color:#e2e8f0!important}.form-group input:focus,.form-group select:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.layout.dark-mode .form-group input:focus,.layout.dark-mode .form-group select:focus{border-color:#4dabf7!important;box-shadow:0 0 0 3px #4dabf733!important}.form-group input.error,.form-group select.error{border-color:#dc3545}.layout.dark-mode .form-group input.error,.layout.dark-mode .form-group select.error{border-color:#f56565!important}.error-text{color:#dc3545;font-size:12px;margin-top:4px;display:block}.layout.dark-mode .error-text{color:#f56565!important}.form-group small{display:block;margin-top:4px;color:#6c757d;font-size:12px}.layout.dark-mode .form-group small{color:#a0aec0!important}.role-options{display:flex;flex-direction:column;gap:12px}.role-option{display:flex;align-items:flex-start;gap:12px;padding:16px;border:2px solid #e2e8f0;border-radius:8px;cursor:pointer;transition:all .3s ease}.layout.dark-mode .role-option{border:2px solid #4a5568!important}.role-option:hover{border-color:#3498db;background:#f8fbff}.layout.dark-mode .role-option:hover{border-color:#4dabf7!important;background:#4dabf71a!important}.role-option input[type=radio]{margin-top:2px}.role-content{flex:1}.role-header{display:flex;align-items:center;gap:8px;margin-bottom:4px}.role-header strong{font-size:14px;color:#2c3e50}.layout.dark-mode .role-header strong{color:#e2e8f0!important}.role-description{margin:0;font-size:12px;color:#6c757d;line-height:1.4}.layout.dark-mode .role-description{color:#a0aec0!important}.modal-footer{padding:24px;border-top:2px solid #e2e8f0;display:flex;justify-content:flex-end;gap:12px;transition:all .3s ease}.layout.dark-mode .modal-footer{border-top:2px solid #4a5568!important}.btn-secondary{padding:12px 24px;border:2px solid #e2e8f0;border-radius:8px;background:#fff;color:#495057;font-weight:600;cursor:pointer;transition:all .3s ease}.layout.dark-mode .btn-secondary{background:#2d3748!important;border:2px solid #4a5568!important;color:#e2e8f0!important}.btn-secondary:hover:not(:disabled){background:#f8f9fa;border-color:#3498db;transform:translateY(-1px);box-shadow:0 2px 8px #0000001a}.layout.dark-mode .btn-secondary:hover:not(:disabled){background:#4a5568!important;border-color:#4dabf7!important;box-shadow:0 2px 8px #0000004d!important}.btn-secondary:disabled{opacity:.5;cursor:not-allowed;background:#f8f9fa;border-color:#e2e8f0}.layout.dark-mode .btn-secondary:disabled{background:#4a5568!important;border-color:#4a5568!important;color:#a0aec0!important}.notification{position:fixed;top:20px;right:20px;z-index:1001;min-width:300px;max-width:400px;border-radius:12px;box-shadow:0 2px 20px #00000014;animation:slideIn .3s ease;border:1px solid transparent;transition:all .3s ease}.layout.dark-mode .notification{box-shadow:0 2px 20px #0000004d!important}.notification.success{background:#d4edda;border-color:#c3e6cb;color:#155724}.layout.dark-mode .notification.success{background:#48bb7833!important;border-color:#48bb784d!important;color:#48bb78!important}.notification.error{background:#f8d7da;border-color:#f5c6cb;color:#721c24}.layout.dark-mode .notification.error{background:#f5656533!important;border-color:#f565654d!important;color:#f56565!important}.notification-content{display:flex;align-items:center;gap:12px;padding:16px}.notification-close{margin-left:auto;background:none;border:none;font-size:20px;color:inherit;cursor:pointer;opacity:.7;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .3s ease}.notification-close:hover{opacity:1;background:#0000001a}.layout.dark-mode .notification-close:hover{background:#ffffff1a!important}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.loading{text-align:center;padding:60px 20px;color:#6c757d;font-size:16px;transition:all .3s ease}.layout.dark-mode .loading{color:#a0aec0!important}.layout.dark-mode .users-table-container,.layout.dark-mode .stat-card,.layout.dark-mode .filter-group,.layout.dark-mode .search-box,.layout.dark-mode .modal,.layout.dark-mode .role-option,.layout.dark-mode .notification{transition:background-color .3s ease,border-color .3s ease,color .3s ease,box-shadow .3s ease!important}@media (max-width: 768px){.users-page .stats-grid{display:flex!important;flex-direction:column!important;gap:20px!important}.users-page{padding:16px}.page-header{flex-direction:column;align-items:flex-start;gap:16px}.filters-section{flex-direction:column;align-items:stretch}.search-box{min-width:100%}.filter-controls{width:100%}.filter-group{flex:1}.users-table{display:block;overflow-x:auto}.user-details-grid{grid-template-columns:1fr}.modal{margin:20px;max-width:95%!important}.user-profile-header{flex-direction:column;text-align:center;gap:15px}.modal-footer{flex-direction:column}.btn-primary,.btn-secondary{width:100%}.edit-row{flex-direction:column!important}.edit-row input,.edit-row select{width:100%!important}}@media (max-width: 480px){.page-header h1{font-size:24px}.users-page .stats-grid{display:flex!important;flex-direction:column!important;gap:20px!important}.actions{flex-wrap:wrap}.user-info{flex-direction:column;align-items:flex-start;gap:8px}.user-avatar{width:32px;height:32px}.avatar-placeholder{font-size:14px}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:#f5f5f5;color:#333;line-height:1.6}#root{min-height:100vh}.text-center{text-align:center}.text-right{text-align:right}.mb-20{margin-bottom:20px}.mt-20{margin-top:20px}.p-20{padding:20px}.form-group{margin-bottom:20px}.form-label{display:block;margin-bottom:5px;font-weight:700;color:#2c3e50}.form-input{width:100%;padding:10px;border:1px solid #bdc3c7;border-radius:5px;font-size:1rem}.form-input:focus{outline:none;border-color:#3498db}.btn{padding:10px 20px;border:none;border-radius:5px;cursor:pointer;font-size:1rem;transition:background-color .3s ease}.btn-primary{background:#3498db;color:#fff}.btn-primary:hover{background:#2980b9}.btn-success{background:#27ae60;color:#fff}.btn-success:hover{background:#219a52}.btn-danger{background:#e74c3c;color:#fff}.btn-danger:hover{background:#c0392b}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px}.loading-spinner{border:4px solid #f3f3f3;border-top:4px solid #3498db;border-radius:50%;width:40px;height:40px;animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.error{color:#e74c3c;background:#fdf2f2;padding:10px;border-radius:4px;border:1px solid #e74c3c}