@import url(https://fonts.googleapis.com/css2?family=TASA+Explorer:wght@400..800&display=swap);body{margin:0}:root{--bg-primary:#f9fafb;--text-primary:#111827;--text-secondary:#6b7280;--text-tertiary:#9ca3af;--border-color:#0000001a;--card-shadow:0 1px 3px 0 #0000001a;--balance-card-bg:#fa8f43;--stat-card-bg:#00e600;--stat-icon-bg:#fee2e2;--stat-icon-color:#dc2626;--balance-text:#fff;--load-wallet-btn-bg:#fff;--load-wallet-btn-text:#111827;--load-wallet-btn-hover:#f3f4f6}.dashboard.dark-mode{--bg-primary:#0f172a;--bg-secondary:#1e293b;--text-primary:#f1f5f9;--text-secondary:#cbd5e1;--text-tertiary:#64748b;--border-color:#ffffff1a;--card-shadow:0 1px 3px 0 #0000004d;--balance-card-bg:#91ade6;--stat-card-bg:#1e293b;--stat-icon-bg:#fb923c33;--stat-icon-color:#ffebdb;--balance-text:#fff;--load-wallet-btn-bg:#f1f5f9;--load-wallet-btn-text:#0f172a;--load-wallet-btn-hover:#e2e8f0}.dashboard{background-color:#f9fafb;background-color:var(--bg-primary);min-height:100vh;transition:background-color .3s ease}.dashboard-header{background-color:#fff;background-color:var(--bg-secondary);box-shadow:0 1px 3px 0 #0000001a;box-shadow:var(--card-shadow);justify-content:space-between;padding:12px 16px;transition:background-color .3s ease,box-shadow .3s ease}.dashboard-header,.header-left{align-items:center;display:flex}.header-left{gap:16px;height:80px}.menu-button{background:none;border:none;color:#6b7280;color:var(--text-secondary);cursor:pointer;transition:color .2s}.menu-button:hover{color:#111827;color:var(--text-primary)}.breadcrumb{color:#6b7280;color:var(--text-secondary)}.breadcrumb-separator{color:#9ca3af;color:var(--text-tertiary);margin:0 8px}.breadcrumb-current{color:#111827;color:var(--text-primary)}.theme-toggle-button{align-items:center;background:none;border:2px solid #9ca3af;border:2px solid var(--text-tertiary);border-radius:8px;color:#6b7280;color:var(--text-secondary);cursor:pointer;display:flex;justify-content:center;padding:8px;transition:all .3s ease}.theme-toggle-button:hover{background-color:#0000000d;border-color:#6b7280;border-color:var(--text-secondary);color:#111827;color:var(--text-primary)}.dashboard.dark-mode .theme-toggle-button:hover{background-color:#ffffff1a}.date-selector-text{color:#111827;color:var(--text-primary);font-weight:500}.dashboard-main{padding:16px}.date-selector{margin-bottom:24px}.date-selector-button{align-items:center;cursor:pointer;display:flex;gap:8px}.balance-card{background:#fa8f43;background:var(--balance-card-bg);border-radius:16px;color:var(--balance-text);margin-bottom:24px;overflow:hidden;position:relative;transition:background-color .3s ease}.balance-content{position:relative;z-index:10}.balance-greeting{color:#111827;color:var(--text-primary);font-size:20px;font-weight:500;margin-bottom:8px}.balance-subtitle{color:#fffc;margin-bottom:16px}.balance-amount{color:#fff;font-size:32px;font-weight:700;margin-bottom:16px}.load-wallet-button{background-color:#fff;background-color:var(--load-wallet-btn-bg);border:none;color:#111827;color:var(--load-wallet-btn-text);padding:8px 24px;transition:background-color .2s}.load-wallet-button:hover{background-color:#f3f4f6;background-color:var(--load-wallet-btn-hover)}.balance-icon-container{position:absolute;right:24px;top:50%;transform:translateY(-50%)}.balance-icon-circle{align-items:center;background-color:#fff3;border-radius:50%;display:flex;height:80px;justify-content:center;width:80px}.stats-grid{grid-gap:16px;gap:16px;grid-template-columns:repeat(2,1fr);margin-bottom:24px}.stat-card-dash{background:#777;border:1px solid #ffffff1a;border-radius:16px;box-shadow:0 1px 3px 0 #0000001a;box-shadow:var(--card-shadow);box-shadow:0 8px 24px #0000001a;padding:1rem;transition:background-color .3s ease,box-shadow .3s ease}.stat-card-dash.sales{background-color:#006994}.stat-card-dash.orders{background-color:#00008b}.stat-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:12px}.stat-label{color:#6b7280}.stat-icon{background-color:#fee2e2;background-color:var(--stat-icon-bg);border-radius:8px;color:#dc2626;color:var(--stat-icon-color);height:32px;transition:background-color .3s ease,color .3s ease;width:32px}.stat-value{color:#111827;color:var(--text-primary);font-size:24px;font-weight:700}.error-state,.loading-state{align-items:center;border-radius:4px;display:flex;font-size:.875rem;gap:8px;padding:8px}.loading-state{background-color:#3b82f61a;color:#3b82f6}.dashboard.dark-mode .loading-state{background-color:#3b82f633;color:#60a5fa}.error-state{background-color:#ef44441a;color:#ef4444}.dashboard.dark-mode .error-state{background-color:#ef444433;color:#f87171}.error-message{flex:1 1;font-size:.875rem}.retry-button{align-items:center;background:none;border:1px solid;display:flex;padding:4px;transition:all .2s}.retry-button:hover{background-color:currentColor;color:#fff}.balance-actions{align-items:center;display:flex;gap:12px;margin-top:16px}.refresh-button{border:none;transition:all .2s}.balance-last-updated{font-size:.75rem;margin-top:4px}.stat-refresh-button{align-items:center;background:none;border:none;border-radius:2px;color:#6b7280;color:var(--text-secondary);cursor:pointer;display:flex;opacity:.6;padding:2px;transition:opacity .2s}.stat-refresh-button:hover:not(:disabled){opacity:1}.stat-refresh-button:disabled{cursor:not-allowed}.dashboard.dark-mode .stat-card{background-color:#00e600;background-color:var(--stat-card-bg)}.analytics-card{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;box-shadow:0 4px 6px #0000001a;color:#fff;margin-bottom:24px;padding:24px;transition:transform .2s ease,box-shadow .2s ease}.analytics-card:hover{box-shadow:0 8px 12px #00000026;transform:translateY(-2px)}.analytics-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:24px}.analytics-title-section{align-items:center;display:flex;gap:12px}.analytics-title{font-size:20px;font-weight:600;letter-spacing:.3px;margin:0}.analytics-icon{animation:pulse 2s ease-in-out infinite;opacity:.9}.analytics-content{align-items:center;display:flex;justify-content:center;min-height:80px}.analytics-stats{align-items:center;display:flex;gap:32px;justify-content:space-around;width:100%}.analytics-stat{flex:1 1;padding:8px;text-align:center}.analytics-stat-value{font-size:32px;font-weight:700;line-height:1.2;margin-bottom:8px;text-shadow:0 2px 4px #0000001a}.analytics-stat-label{font-size:13px;font-weight:500;letter-spacing:1px;opacity:.9;text-transform:uppercase}.analytics-stat-divider{background:#ffffff40;border-radius:1px;height:60px;width:2px}.dark-mode .analytics-card{background:linear-gradient(135deg,#5a67d8,#6b46c1);box-shadow:0 4px 6px #0000004d}.dark-mode .analytics-card:hover{box-shadow:0 8px 12px #0006}@media (max-width:768px){.analytics-card{margin-bottom:20px;padding:20px}.analytics-title{font-size:18px}.analytics-stats{gap:20px}.analytics-stat-value{font-size:26px}.analytics-stat-label{font-size:11px}.analytics-stat-divider{height:50px}}@media (max-width:480px){.analytics-card{padding:16px}.analytics-header{margin-bottom:16px}.analytics-title-section{gap:8px}.analytics-title{font-size:16px}.analytics-icon{height:18px;width:18px}.analytics-stats{flex-direction:column;gap:16px}.analytics-stat-divider{display:none}.analytics-stat{background:#ffffff1a;border-radius:8px;padding:12px;width:100%}.analytics-stat-value{font-size:24px}}.analytics-content .error-state,.analytics-content .loading-state{align-items:center;color:#fff;display:flex;gap:8px;justify-content:center;padding:20px;width:100%}.analytics-content .loading-spinner{animation:spin 1s linear infinite}.analytics-content .error-state{flex-direction:column;gap:12px}.analytics-content .error-icon{opacity:.8}.analytics-content .error-message{font-size:14px;opacity:.9}.analytics-content .retry-button{align-items:center;background:#fff3;border:1px solid #ffffff4d;border-radius:6px;color:#fff;cursor:pointer;display:flex;font-size:13px;gap:6px;padding:6px 12px;transition:all .2s ease}.analytics-content .retry-button:hover{background:#ffffff4d;transform:translateY(-1px)}.analytics-content .retry-button:active{transform:translateY(0)}.analytics-header .refresh-button{align-items:center;background:#fff3;border:1px solid #ffffff4d;border-radius:8px;color:#fff;cursor:pointer;display:flex;justify-content:center;padding:8px;transition:all .2s ease}.analytics-header .refresh-button:hover:not(:disabled){background:#ffffff4d;transform:rotate(90deg)}.analytics-header .refresh-button:disabled{cursor:not-allowed;opacity:.5}.analytics-header .refresh-button:disabled svg{animation:spin 1s linear infinite}@keyframes valueUpdate{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.analytics-stat-value.updating{animation:valueUpdate .3s ease}.telecom-container{min-height:200px;padding:2rem 1rem}.telecom-grid{grid-gap:1.5rem;align-items:center;display:grid;gap:1.5rem;grid-template-columns:repeat(4,1fr);margin:0 auto;max-width:800px}.telecom-item{flex-direction:column;gap:.75rem}.circle-wrapper,.telecom-item{align-items:center;display:flex}.circle-wrapper{aspect-ratio:1;background:#fff;border-radius:50%;box-shadow:0 4px 6px #0000001a;justify-content:center;max-width:150px;overflow:hidden;width:100%}.telecom-logo{border-radius:50%;height:100%;object-fit:cover;width:100%}.telecom-name{color:#111827;color:var(--text-primary);font-size:.9rem;font-weight:700;letter-spacing:.5px;margin:0;text-align:center}@media (max-width:768px){.telecom-grid{gap:1rem}.circle-wrapper{max-width:80px}.telecom-name{font-size:.7rem}}@media (max-width:480px){.telecom-container{padding:1.5rem .5rem}.telecom-grid{gap:.5rem}.circle-wrapper{max-width:60px}.telecom-name{font-size:.6rem}}.stats-grid-horizontal{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(2,1fr);margin-bottom:24px}.balance-card{background:linear-gradient(135deg,#91ade6,#7b9fd9);border-radius:12px;box-shadow:0 4px 6px #0000001a;color:#fff;padding:24px;transition:transform .2s ease,box-shadow .2s ease}.balance-card:hover{box-shadow:0 8px 12px #00000026;transform:translateY(-2px)}.balance-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:24px}.balance-title-section{align-items:center;display:flex;gap:12px}.balance-title{color:#fff;font-size:20px;font-weight:600;letter-spacing:.3px;margin:0}.balance-icon{animation:pulse 2s ease-in-out infinite;opacity:.9}@keyframes pulse{0%,to{opacity:.9}50%{opacity:1}}.balance-content{min-height:80px}.balance-content,.balance-stats{align-items:center;display:flex;justify-content:center}.balance-stats{width:100%}.balance-stat{align-items:center;display:flex;flex:1 1;flex-direction:column;justify-content:center;padding:8px;text-align:center}.balance-stat-value{color:#fff;font-size:32px;font-weight:700;line-height:1.2;margin-bottom:8px;text-shadow:0 2px 4px #0000001a}.balance-stat-label{color:#fff;font-size:13px;font-weight:500;letter-spacing:1px;margin-bottom:4px;opacity:.9;text-transform:uppercase}.balance-last-updated{color:#ffffffb3;font-size:11px;margin:4px 0 12px}.load-wallet-button{background-color:#fff3;border:1px solid #ffffff4d;border-radius:24px;color:#fff;cursor:pointer;font-size:14px;font-weight:500;margin-top:8px;padding:10px 28px;transition:all .2s ease}.load-wallet-button:hover:not(:disabled){background-color:#ffffff4d;transform:translateY(-1px)}.load-wallet-button:disabled{cursor:not-allowed;opacity:.5}.refresh-button{background:#fff3;border:1px solid #ffffff4d;border-radius:8px;color:#fff;justify-content:center;padding:8px;transition:all .2s ease}.refresh-button:hover:not(:disabled){background:#ffffff4d;transform:rotate(90deg)}.refresh-button:disabled{opacity:.5}.refresh-button:disabled svg{animation:spin 1s linear infinite}.commission-card{background:#7b7b7b;border-radius:12px;box-shadow:0 4px 6px #0000001a;display:flex;flex-direction:column;padding:10px;transition:transform .2s ease,box-shadow .2s ease}.commission-card:hover{box-shadow:0 8px 12px #00000026;transform:translateY(-2px)}.commission-header{margin-bottom:16px}.commission-label{font-size:13px;letter-spacing:1px;text-transform:uppercase}.commission-content{flex:1 1}.dark-mode .balance-card{background:linear-gradient(135deg,#5a67d8,#4c51bf);height:100%}.dark-mode .commission-card{background:linear-gradient(135deg,#34d399,#10b981)}@media (max-width:768px){.stats-grid-horizontal{gap:12px;grid-template-columns:repeat(2,1fr)}.balance-card,.commission-card{padding:20px}.balance-title{font-size:18px}.balance-header{margin-bottom:20px}.balance-stat-value{font-size:26px}.balance-stat-label{font-size:11px}.load-wallet-button{font-size:13px;padding:8px 24px}.commission-label{font-size:11px}}@media (max-width:480px){.stats-grid-horizontal{gap:8px;grid-template-columns:repeat(2,1fr)}.balance-card,.commission-card{padding:16px}.balance-header{margin-bottom:16px}.balance-title-section{gap:8px}.balance-title{font-size:16px}.balance-icon{height:18px;width:18px}.balance-stat-value{font-size:24px}.balance-stat-label{font-size:10px}.balance-last-updated{font-size:9px;margin-bottom:8px}.load-wallet-button{font-size:12px;padding:8px 20px}.refresh-button{padding:6px}.commission-label{font-size:10px}.commission-header{margin-bottom:12px}}.commission-widget{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;box-shadow:0 4px 6px #0000001a;margin:16px 0;padding:16px}.commission-widget.loading{align-items:center;color:#fff;display:flex;gap:8px;justify-content:center}.commission-content{align-items:center;display:flex;flex-direction:column;gap:12px}.commission-details{display:flex;flex:1 1;flex-direction:column;gap:4px}.commission-label{color:#ffffffe6;font-size:12px;font-weight:500}.commission-amount{color:#fff;font-size:20px;font-weight:700}.minimum-notice{color:#fff;font-size:13px;font-weight:500}.redeem-button{background:#fff;color:#667eea;transition:all .3s ease}.redeem-button:hover:not(:disabled){box-shadow:0 4px 12px #00000026;transform:translateY(-2px)}.confirmation-modal{box-shadow:0 20px 25px -5px #0000001a;overflow:hidden}.modal-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:20px}.modal-content p{color:#4a5568;margin:0 0 16px}.redemption-amount{background:#f7fafc;border:2px solid #667eea;border-radius:8px;color:#667eea;padding:16px}.redemption-note{color:#92400e;font-size:14px;gap:8px;padding:12px}.modal-actions{background:#f7fafc;padding:20px}.cancel-button,.confirm-button{padding:12px;transition:all .3s ease}.cancel-button{border:1px solid #e2e8f0;color:#4a5568}.cancel-button:hover:not(:disabled){background:#f7fafc}.confirm-button{background:linear-gradient(135deg,#667eea,#764ba2)}.confirm-button:hover:not(:disabled){box-shadow:0 4px 12px #667eea66;transform:translateY(-2px)}.cancel-button:disabled,.confirm-button:disabled{opacity:.6}.dark-mode .confirmation-modal{background:#1a202c}.dark-mode .modal-content p{color:#a0aec0}.dark-mode .redemption-amount{background:#2d3748;border-color:#90cdf4;color:#90cdf4}.dark-mode .modal-actions{background:#2d3748}.dark-mode .cancel-button{background:#2d3748;border-color:#4a5568;color:#e2e8f0}.dark-mode .cancel-button:hover:not(:disabled){background:#374151}.package-option{background:var(--bg-secondary,#f8f9fa);border:2px solid var(--border-color,#e0e0e0)}.package-option:hover{background:var(--bg-hover,#f0f7f0);border-color:var(--primary-color,#4caf50)}.package-option.selected{background:var(--primary-light,#e8f5e9);border-color:var(--primary-color,#4caf50)}.package-option svg{color:var(--text-secondary,#666)}.package-option.selected svg{color:var(--primary-color,#4caf50)}.package-option span{color:var(--text-primary)}.package-option .check-icon{color:var(--primary-color,#4caf50)}.dark-mode .package-option{background:var(--bg-secondary-dark,#2a2a2a);border-color:var(--border-color-dark,#444)}.dark-mode .package-option:hover{background:var(--bg-hover-dark,#333)}.dark-mode .package-option.selected{border-color:var(--primary-color,#4caf50)}.dark-mode .package-label{color:var(--text-primary-dark,#e0e0e0)}:root{--sidebar-bg:#fff;--sidebar-text-primary:#111827;--sidebar-text-secondary:#374151;--sidebar-text-muted:#9ca3af;--sidebar-icon-color:#6b7280;--sidebar-border-color:#e5e7eb;--sidebar-hover-bg:#f9fafb;--sidebar-close-hover:#f3f4f6;--sidebar-dashboard-bg:#ede9fe;--sidebar-dashboard-hover:#ddd6fe;--sidebar-dashboard-icon:#7c3aed;--sidebar-dashboard-text:#581c87;--sidebar-signout-color:#dc2626;--sidebar-signout-hover:#fef2f2}.sidebar-panel.dark-mode{--sidebar-bg:#1e293b;--sidebar-text-primary:#f1f5f9;--sidebar-text-secondary:#cbd5e1;--sidebar-text-muted:#64748b;--sidebar-icon-color:#94a3b8;--sidebar-border-color:#334155;--sidebar-hover-bg:#334155;--sidebar-close-hover:#334155;--sidebar-dashboard-bg:#334155;--sidebar-dashboard-hover:#475569;--sidebar-dashboard-icon:#a78bfa;--sidebar-dashboard-text:#c4b5fd;--sidebar-signout-color:#f87171;--sidebar-signout-hover:#450a0a}.sidebar-overlay{bottom:0;left:0;position:fixed;right:0;top:0;z-index:50}.sidebar-overlay.visible{visibility:visible}.sidebar-overlay.invisible{visibility:hidden}.sidebar-backdrop{background-color:#00000080;bottom:0;left:0;position:absolute;right:0;top:0;transition:opacity .3s ease}.sidebar-backdrop.open{opacity:1}.sidebar-backdrop.closed{opacity:0}.sidebar-panel{background-color:#fff;background-color:var(--sidebar-bg);box-shadow:0 20px 25px -5px #0000001a;height:100%;left:0;overflow-y:auto;position:absolute;top:0;transform:translateX(-100%);transition:transform .3s ease,background-color .3s ease;width:320px}.sidebar-panel.open{transform:translateX(0)}.sidebar-content{padding:16px}.sidebar-header{justify-content:space-between;margin-bottom:24px}.sidebar-brand,.sidebar-header{align-items:center;display:flex}.sidebar-brand{gap:12px}.sidebar-logo{align-items:center;border-radius:8px;display:flex;height:10px;justify-content:center;margin-inline:30px;width:10px}.sidebar-title{color:#111827;color:var(--sidebar-text-primary);font-size:18px;font-weight:600;transition:color .3s ease}.close-button{background:none;border:none;border-radius:8px;color:#6b7280;color:var(--sidebar-icon-color);cursor:pointer;padding:4px;transition:background-color .2s}.close-button:hover{background-color:#f3f4f6;background-color:var(--sidebar-close-hover)}.dashboard-item{margin-bottom:24px}.dashboard-link{align-items:center;background-color:#ede9fe;background-color:var(--sidebar-dashboard-bg);border-radius:8px;cursor:pointer;display:flex;gap:12px;padding:12px;text-decoration:none;transition:background-color .2s}.dashboard-link:hover{background-color:#ddd6fe;background-color:var(--sidebar-dashboard-hover)}.dashboard-icon{color:#7c3aed;color:var(--sidebar-dashboard-icon);transition:color .3s ease}.dashboard-text{color:#581c87;color:var(--sidebar-dashboard-text);font-weight:500;transition:color .3s ease}.sidebar-section{margin-bottom:24px}h3.section-title{color:#9ca3af;color:var(--sidebar-text-muted);font-size:20px;font-weight:700;letter-spacing:.05em;margin-bottom:12px;text-transform:uppercase;transition:color .3s ease}.menu-items{display:flex;flex-direction:column;gap:8px}.menu-item{align-items:center;border-radius:8px;color:inherit;cursor:pointer;display:flex;gap:12px;padding:12px;text-decoration:none;transition:background-color .2s}.menu-item:hover{background-color:#f9fafb;background-color:var(--sidebar-hover-bg)}.menu-icon{color:#6b7280;color:var(--sidebar-icon-color);transition:color .3s ease}.menu-icon.green{color:#059669}.sidebar-panel.dark-mode .menu-icon.green{color:#34d399}.menu-text{color:#374151;color:var(--sidebar-text-secondary);transition:color .3s ease}.sign-out-section{border-top:1px solid #e5e7eb;border-top:1px solid var(--sidebar-border-color);padding-top:16px;transition:border-color .3s ease}.sign-out-button{align-items:center;background:none;border:none;border-radius:8px;color:#dc2626;color:var(--sidebar-signout-color);cursor:pointer;display:flex;gap:12px;padding:12px;transition:background-color .2s,color .3s ease;width:100%}.sign-out-button:hover{background-color:#fef2f2;background-color:var(--sidebar-signout-hover)}.sign-out-text{font-weight:500}.sidebar-panel.dark-mode::-webkit-scrollbar{width:8px}.sidebar-panel.dark-mode::-webkit-scrollbar-track{background:#1e293b}.sidebar-panel.dark-mode::-webkit-scrollbar-thumb{background:#475569;border-radius:4px}.sidebar-panel.dark-mode::-webkit-scrollbar-thumb:hover{background:#64748b}:root{--header-bg:#ffcc08}.mtn-page.dark-mode{--bg-primary:#0f172a;--bg-secondary:#1e293b;--text-primary:#f1f5f9;--text-secondary:#cbd5e1;--border-color:#334155;--card-bg:#1e293b;--header-bg:#ffcc08;--button-bg:linear-gradient(135deg,#fbbf24,#f59e0b);--button-hover:linear-gradient(135deg,#f59e0b,#d97706);--error-bg:#ef444433;--error-border:#ef444466;--error-text:#f87171;--success-text:#34d399;--info-bg:#1e293b;--info-border:#334155;--info-text:#60a5fa;--wallet-bg:#ffffff1a;--wallet-hover:#fff3;--input-bg:#1e293b;--input-border:#334155;--input-country-bg:#334155;--selected-bg:#334155;--selected-border:#fbbf24;--modal-bg:#1e293b;--modal-detail-bg:#334155;--modal-detail-border:#475569;--modal-text:#f1f5f9;--modal-header-text:#f97316}.mtn-page{background:#f8fafc;background:var(--bg-primary);color:#1e293b;color:var(--text-primary);margin:0 auto;max-width:800px;min-height:100vh;padding:20px;transition:background-color .3s ease,color .3s ease}.mtn-header-mtn{align-items:center;background-color:#ffcc08;border-radius:12px;box-shadow:0 2px 4px #0000001a;display:flex;gap:16px;margin-bottom:32px;padding:20px}@media (max-width:640px){.mtn-page{padding:16px}.bundles-grid{gap:12px;grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.mtn-header{padding:16px}.modal-actions{flex-direction:column}.cancel-button,.confirm-button{padding:14px 16px;width:100%}}.header-right{align-items:center;display:flex;gap:12px}.cart-icon-button{align-items:center;background:#ffffff1a;border:1px solid #fff3;border-radius:12px;color:#fff;cursor:pointer;display:flex;justify-content:center;padding:10px 12px;position:relative;transition:all .3s ease}.cart-icon-button:hover{background:#fff3;transform:translateY(-2px)}.cart-icon-button:disabled{cursor:not-allowed;opacity:.5}.cart-badge{background:#f44;border:2px solid #fc0;border-radius:50%;color:#fff;font-size:11px;font-weight:700;height:20px;position:absolute;right:-5px;top:-5px;width:20px}.add-to-cart-button,.cart-badge{align-items:center;display:flex;justify-content:center}.add-to-cart-button{background:linear-gradient(135deg,#fc0,#f90);border:none;border-radius:8px;color:#000;cursor:pointer;font-size:14px;font-weight:600;gap:6px;margin-top:12px;padding:8px 12px;transition:all .3s ease;width:100%}.add-to-cart-button:hover:not(:disabled){box-shadow:0 4px 12px #fc06;transform:translateY(-2px)}.add-to-cart-button:disabled{cursor:not-allowed;opacity:.5}.cart-overlay{align-items:center;animation:fadeIn .3s ease;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#000000b3;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:1000}.cart-modal{animation:slideUp .3s ease;background:#fff;border-radius:20px;box-shadow:0 10px 40px #0000004d;display:flex;flex-direction:column;max-height:80vh;max-width:500px;width:100%}.dark-mode .cart-modal{background:#1a1a1a;border:1px solid #ffffff1a}.cart-header{align-items:center;border-bottom:1px solid #0000001a;display:flex;justify-content:space-between;padding:20px}.dark-mode .cart-header{border-bottom-color:#ffffff1a}.cart-header h3{align-items:center;color:#333;display:flex;font-size:20px;gap:10px;margin:0}.dark-mode .cart-header h3{color:#fff}.close-cart-button{background:none;border:none;border-radius:8px;color:#666;cursor:pointer;padding:5px;transition:all .3s ease}.close-cart-button:hover{background:#0000000d;color:#333}.dark-mode .close-cart-button{color:#999}.dark-mode .close-cart-button:hover{background:#ffffff1a;color:#fff}.cart-content{flex:1 1;overflow-y:auto;padding:20px}.empty-cart{align-items:center;color:#999;display:flex;flex-direction:column;justify-content:center;padding:40px 20px;text-align:center}.empty-cart svg{margin-bottom:20px;opacity:.3}.empty-cart p{font-size:16px;margin:5px 0}.empty-cart-hint{font-size:14px;opacity:.7}.cart-items{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}.cart-item{align-items:center;background:#ffcc000d;border:1px solid #fc03;border-radius:12px;display:flex;gap:12px;padding:15px;transition:all .3s ease}.dark-mode .cart-item{background:#ffcc0014;border-color:#fc03}.cart-item:hover{box-shadow:0 2px 8px #0000001a;transform:translateX(5px)}.cart-item-info{display:flex;flex:1 1;flex-direction:column;gap:4px}.cart-item-data{color:#333;font-size:16px;font-weight:600}.dark-mode .cart-item-data{color:#fff}.cart-item-price{color:#666;font-size:13px}.dark-mode .cart-item-price{color:#999}.cart-item-actions{align-items:center;display:flex;gap:8px}.quantity-button{align-items:center;background:#fff;border:1px solid #ddd;border-radius:6px;color:#333;cursor:pointer;display:flex;height:28px;justify-content:center;transition:all .2s ease;width:28px}.dark-mode .quantity-button{background:#2a2a2a;border-color:#444;color:#fff}.quantity-button:hover{background:#fc0;border-color:#fc0;color:#000}.cart-item-quantity{color:#333;font-size:14px;font-weight:600;min-width:30px;text-align:center}.dark-mode .cart-item-quantity{color:#fff}.remove-button{align-items:center;background:#f44;border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;height:28px;justify-content:center;margin-left:8px;transition:all .2s ease;width:28px}.remove-button:hover{background:#c00;transform:scale(1.1)}.cart-item-total{color:#fc0;font-size:15px;font-weight:700;min-width:80px;text-align:right}.dark-mode .cart-item-total{color:#fc0}.cart-summary{background:#00000008;border-radius:12px;margin-bottom:16px;padding:16px}.dark-mode .cart-summary{background:#ffffff0d}.cart-summary-row{align-items:center;color:#666;display:flex;font-size:14px;justify-content:space-between;padding:8px 0}.dark-mode .cart-summary-row{color:#999}.cart-summary-row.total{border-top:2px solid #0000001a;color:#333;font-size:16px;margin-top:8px;padding-top:12px}.dark-mode .cart-summary-row.total{border-top-color:#ffffff1a;color:#fff}.cart-summary-row.highlight{color:#fc0;font-weight:600}.cart-summary-row strong{color:#333;font-weight:600}.dark-mode .cart-summary-row strong{color:#fff}.cart-summary-row.total strong{color:#fc0;font-size:18px}.cart-summary-row.highlight strong{color:#fc0}.cart-actions{display:flex;gap:12px}.clear-cart-button{background:#fff;border:2px solid #ddd;border-radius:12px;color:#666;cursor:pointer;flex:1 1;font-size:15px;font-weight:600;padding:14px 20px;transition:all .3s ease}.dark-mode .clear-cart-button{background:#2a2a2a;border-color:#444;color:#999}.clear-cart-button:hover{background:#f44;border-color:#f44;color:#fff;transform:translateY(-2px)}.checkout-button{align-items:center;background:linear-gradient(135deg,#fc0,#f90);border:none;border-radius:12px;color:#000;cursor:pointer;display:flex;flex:2 1;font-size:15px;font-weight:700;gap:8px;justify-content:center;padding:14px 20px;transition:all .3s ease}.checkout-button:hover:not(:disabled){box-shadow:0 6px 20px #fc06;transform:translateY(-2px)}.checkout-button:disabled{cursor:not-allowed;opacity:.5}@media (max-width:768px){.cart-modal{max-height:90vh}.cart-header h3{font-size:18px}.cart-item{flex-wrap:wrap}.cart-item-total{border-top:1px solid #0000001a;margin-top:8px;padding-top:8px;text-align:left;width:100%}.cart-actions{flex-direction:column}.checkout-button,.clear-cart-button{width:100%}}.add-to-cart-section{margin-top:24px;padding:0 20px}.add-to-cart-button-main{align-items:center;animation:slideIn .3s ease;background:linear-gradient(135deg,#fc0,#f90);border:none;border-radius:12px;box-shadow:0 4px 15px #ffcc004d;color:#000;cursor:pointer;display:flex;font-size:16px;font-weight:700;gap:10px;justify-content:center;padding:16px 24px;transition:all .3s ease;width:100%}.add-to-cart-button-main:hover:not(:disabled){box-shadow:0 6px 25px #ffcc0080;transform:translateY(-3px)}.add-to-cart-button-main:active:not(:disabled){transform:translateY(-1px)}.add-to-cart-button-main:disabled{cursor:not-allowed;opacity:.5}@media (max-width:768px){.add-to-cart-section{padding:0 16px}.add-to-cart-button-main{font-size:15px;padding:14px 20px}}:root{--header-bg:#e32526;--button-bg:linear-gradient(135deg,#fbbf24,#f59e0b);--button-hover:linear-gradient(135deg,#f59e0b,#d97706);--success-text:#059669;--selected-bg:#fffbeb;--selected-border:#fbbf24;--modal-detail-bg:#fffbeb;--modal-detail-border:#fed7aa;--modal-text:#9a3412;--modal-header-text:#ea580c;--popular-badge-bg:#10b981}.telecel-page.dark-mode{--bg-primary:#0f172a;--bg-secondary:#1e293b;--text-primary:#f1f5f9;--text-secondary:#cbd5e1;--border-color:#334155;--card-bg:#1e293b;--header-bg:#e32526;--button-bg:linear-gradient(135deg,#fbbf24,#f59e0b);--button-hover:linear-gradient(135deg,#f59e0b,#d97706);--error-bg:#ef444433;--error-border:#ef444466;--error-text:#f87171;--success-text:#34d399;--info-bg:#1e293b;--info-border:#334155;--info-text:#60a5fa;--wallet-bg:#ffffff1a;--wallet-hover:#fff3;--input-bg:#1e293b;--input-border:#334155;--input-country-bg:#334155;--selected-bg:#334155;--selected-border:#fbbf24;--modal-bg:#1e293b;--modal-detail-bg:#334155;--modal-detail-border:#475569;--modal-text:#f1f5f9;--modal-header-text:#f97316;--popular-badge-bg:#34d399}.telecel-page{background:#f8fafc;background:var(--bg-primary);color:#1e293b;color:var(--text-primary);margin:0 auto;max-width:800px;min-height:100vh;padding:20px;transition:background-color .3s ease,color .3s ease}.telecel-header{background:#e32526;background:var(--header-bg);border-radius:12px;box-shadow:0 2px 4px #0000001a;gap:16px;margin-bottom:32px;padding:20px}.telecel-header,.telecel-logo{align-items:center;display:flex}.telecel-logo{border-radius:3px;height:34px;justify-content:center;width:34px}.telecel-icon{color:#fff}.page-title{color:#1e293b;color:var(--text-primary);font-size:24px}.page-subtitle{color:#64748b;color:var(--text-secondary);margin:4px 0 0}.bundle-card.selected{background:#fffbeb;border-color:#fbbf24}.bundle-card.popular{border-color:#10b981;border-color:var(--popular-badge-bg)}.popular-badge{background:#10b981;background:var(--popular-badge-bg);border-bottom-left-radius:8px;color:#fff;font-size:12px;font-weight:600;padding:4px 12px;position:absolute;right:0;top:0}.data-amount{margin-bottom:12px}.validity{align-items:center;color:#64748b;color:var(--text-secondary);display:flex;font-size:12px;gap:4px;justify-content:center;margin-bottom:8px;opacity:.7}.price-amount{color:#059669}.selected-indicator{background:#fbbf24}.summary-row.total{color:#059669}.purchase-button{background:linear-gradient(135deg,#fbbf24,#f59e0b)}.purchase-button:hover:not(.disabled){background:linear-gradient(135deg,#f59e0b,#d97706)}.modal-header h3,.modal-header svg{color:#ea580c}.modal-content>p{color:#9a3412}.confirmation-details{background:#fffbeb;border:1px solid #fed7aa}.detail-row{color:#9a3412}.detail-row:not(:last-child){border-bottom:1px solid #fed7aa}.detail-row strong{color:#ea580c}.cancel-button,.detail-row.highlight{background:#fffbeb;border:1px solid #fed7aa}.cancel-button{color:#ea580c}.confirm-button{background:linear-gradient(135deg,#f97316,#ea580c);border:1px solid #ea580c}.confirm-button:hover:not(:disabled){background:linear-gradient(135deg,#ea580c,#dc2626);box-shadow:0 4px 12px #f973164d}.modal-actions .loading-spinner{margin-right:8px}@media (max-width:640px){.telecel-page{padding:16px}.bundles-grid{gap:12px;grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.telecel-header{padding:16px}.page-title{font-size:20px}.modal-actions{flex-direction:column}.cancel-button,.confirm-button{padding:14px 16px;width:100%}}:root{--bg-primary:#f8fafc;--text-primary:#1e293b;--text-secondary:#64748b;--border-color:#d1d5db;--card-bg:#fff;--header-bg:linear-gradient(180deg,#e90000,#e90000,#0018b8,#0018b8);--button-bg:linear-gradient(135deg,#dc2626,#b91c1c);--button-hover:linear-gradient(135deg,#b91c1c,#991b1b);--error-bg:#ef44441a;--error-border:#ef44444d;--error-text:#ef4444;--success-text:#10b981;--info-bg:#eff6ff;--info-border:#dbeafe;--info-text:#1e40af;--wallet-bg:#ffffff1a;--wallet-hover:#ffffff26;--input-bg:#fff;--input-border:#d1d5db;--input-country-bg:#f3f4f6;--selected-bg:#fef2f2;--selected-border:#dc2626;--modal-bg:#fff;--modal-detail-bg:#fef2f2;--modal-detail-border:#fecaca;--modal-text:#7f1d1d;--modal-header-text:#dc2626;--bundle-type-color:#10b981}.at-bigtime-page.dark-mode{--bg-primary:#0f172a;--bg-secondary:#1e293b;--text-primary:#f1f5f9;--text-secondary:#cbd5e1;--border-color:#334155;--card-bg:#1e293b;--header-bg:linear-gradient(180deg,#e90000,#e90000,#0018b8,#0018b8);--button-bg:linear-gradient(135deg,#dc2626,#b91c1c);--button-hover:linear-gradient(135deg,#b91c1c,#991b1b);--error-bg:#ef444433;--error-border:#ef444466;--error-text:#f87171;--success-text:#34d399;--info-bg:#1e293b;--info-border:#334155;--info-text:#60a5fa;--wallet-bg:#ffffff1a;--wallet-hover:#fff3;--input-bg:#1e293b;--input-border:#334155;--input-country-bg:#334155;--selected-bg:#334155;--selected-border:#dc2626;--modal-bg:#1e293b;--modal-detail-bg:#334155;--modal-detail-border:#475569;--modal-text:#f1f5f9;--modal-header-text:#ef4444;--bundle-type-color:#34d399}.at-bigtime-page{background:#f8fafc;background:var(--bg-primary);color:#1e293b;color:var(--text-primary);margin:0 auto;max-width:800px;min-height:100vh;padding:20px;transition:background-color .3s ease,color .3s ease}.at-bigtime-header{align-items:center;background:linear-gradient(180deg,#e90000,#e90000,#0018b8,#0018b8);background:var(--header-bg);border-radius:12px;box-shadow:0 2px 4px #0000001a;display:flex;gap:16px;margin-bottom:32px;padding:20px}.back-button{background:var(--card-bg);border:1px solid #d1d5db;border:1px solid var(--border-color);color:#64748b;color:var(--text-secondary)}.back-button:hover{background:#fff;background:var(--bg-secondary);color:#1e293b;color:var(--text-primary)}.header-content{gap:6px}.at-bigtime-logo{align-items:center;border-radius:3px;display:flex;height:34px;justify-content:center;width:34px}.wallet-display{align-items:center;background:#ffffff1a;background:var(--wallet-bg);border-radius:8px;color:#1e293b;color:var(--text-primary);cursor:pointer;display:flex;gap:8px;min-width:120px;padding:8px 12px;transition:all .2s}.wallet-display:hover{background:#ffffff26;background:var(--wallet-hover)}.wallet-display.loading{cursor:default;opacity:.7}.wallet-display.error{background:#ef44441a;background:var(--error-bg);color:#ef4444;color:var(--error-text)}.wallet-display.error:hover{background:#ef44444d}.refresh-icon{opacity:.6;transition:transform .2s}.wallet-display:hover .refresh-icon{transform:rotate(180deg)}.phone-input-section{background:#fff;background:var(--card-bg);border-radius:12px;box-shadow:0 2px 4px #0000001a;margin-bottom:32px;padding:24px}.input-label{color:#1e293b;color:var(--text-primary);display:block;font-size:14px;font-weight:600;margin-bottom:8px}.phone-input-container{background:#fff;background:var(--input-bg);border:1px solid #d1d5db;border:1px solid var(--input-border);border-radius:8px;display:flex;overflow:hidden}.country-code{background:#f3f4f6;background:var(--input-country-bg);border-right:1px solid #d1d5db;border-right:1px solid var(--input-border);font-weight:600}.country-code,.phone-input{color:#1e293b;color:var(--text-primary);padding:12px 16px}.phone-input{background:#fff;background:var(--input-bg);border:none;flex:1 1;font-size:16px;outline:none}.phone-input::placeholder{opacity:.7}.input-helper,.phone-input::placeholder{color:#64748b;color:var(--text-secondary)}.input-helper{font-size:12px;margin:8px 0 0}.bundles-section{margin-bottom:32px}.section-title{color:#1e293b;color:var(--text-primary)}.bundles-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.bundle-card{background:#fff;background:var(--card-bg);border:2px solid #d1d5db;border:2px solid var(--border-color);border-radius:12px;cursor:pointer;overflow:hidden;padding:20px 16px;position:relative;transition:all .2s}.bundle-card:hover:not(.disabled){box-shadow:0 4px 12px #0003;transform:translateY(-2px)}.bundle-card.selected{background:#fef2f2;background:var(--selected-bg);border-color:#dc2626;border-color:var(--selected-border)}.bundle-card.disabled{cursor:not-allowed;opacity:.5}.insufficient-badge{background:#ef4444e6;border-radius:4px;color:#fff;font-size:.7rem;font-weight:500;padding:2px 6px;position:absolute;right:8px;top:8px}.bundle-content{text-align:center}.bundle-data{align-items:center;display:flex;flex-direction:column;gap:2px}.data-amount{color:#1e293b;color:var(--text-primary);display:block;font-size:24px;font-weight:700;margin-bottom:8px}.bundle-type{color:#10b981;color:var(--bundle-type-color);font-size:.7rem;font-weight:600;letter-spacing:.5px;opacity:.8;text-transform:uppercase}.price-amount{color:#10b981;color:var(--success-text);font-size:16px;font-weight:600}.selected-indicator{align-items:center;background:#dc2626;border-radius:50%;color:#fff;display:flex;height:24px;justify-content:center;left:8px;position:absolute;top:8px;width:24px}.purchase-summary{background:#fff;background:var(--card-bg);border-radius:12px;box-shadow:0 2px 4px #0000001a;margin-bottom:24px;overflow:hidden}.summary-content{padding:24px}.summary-content h3{font-size:18px;font-weight:700;margin-bottom:16px}.summary-content h3,.summary-row{color:#1e293b;color:var(--text-primary)}.summary-row{align-items:center;display:flex;font-size:14px;justify-content:space-between;padding:8px 0}.summary-row.total{border-top:1px solid #d1d5db;border-top:1px solid var(--border-color);color:#10b981;color:var(--success-text);font-size:16px;font-weight:600;margin-top:8px;padding-top:16px}.purchase-section{margin-bottom:32px}.purchase-button{align-items:center;background:linear-gradient(135deg,#dc2626,#b91c1c);background:var(--button-bg);border:none;border-radius:12px;color:#fff;cursor:pointer;display:flex;font-size:16px;font-weight:600;gap:8px;justify-content:center;padding:16px;transition:all .2s;width:100%}.purchase-button:hover:not(.disabled){background:linear-gradient(135deg,#b91c1c,#991b1b);background:var(--button-hover);transform:translateY(-1px)}.purchase-button.disabled{background:#9ca3af;cursor:not-allowed}.confirmation-overlay{bottom:0;left:0;right:0;top:0}.confirmation-modal{animation:modalSlideIn .3s ease-out;background:var(--modal-bg);box-shadow:0 10px 30px #0000004d;color:#1e293b;color:var(--text-primary);max-height:90vh;max-width:400px;overflow:auto}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-header{border-bottom:1px solid #d1d5db;border-bottom:1px solid var(--border-color)}.modal-header svg{flex-shrink:0}.modal-header h3,.modal-header svg{color:#dc2626;color:var(--modal-header-text)}.modal-header h3{font-size:18px;font-weight:600;margin:0}.modal-content{padding:20px 24px}.modal-content>p{color:#7f1d1d;color:var(--modal-text);font-size:14px;margin:0 0 16px}.confirmation-details{background:#fef2f2;background:var(--modal-detail-bg);border:1px solid #fecaca;border:1px solid var(--modal-detail-border);border-radius:12px;margin-bottom:16px;padding:16px}.detail-row{align-items:center;color:#7f1d1d;color:var(--modal-text);display:flex;font-size:14px;justify-content:space-between;padding:8px 0}.detail-row:not(:last-child){border-bottom:1px solid #fecaca;border-bottom:1px solid var(--modal-detail-border)}.detail-row strong{color:#dc2626;color:var(--modal-header-text);font-weight:600}.detail-row.highlight{background:#fef2f2;background:var(--modal-detail-bg);border:1px solid #fecaca;border:1px solid var(--modal-detail-border);border-radius:8px;margin:8px -8px -8px;padding:12px 8px}.detail-row.highlight strong{font-size:16px}.confirmation-note{align-items:center;color:#64748b;color:var(--text-secondary);display:flex;font-size:13px;gap:8px}.modal-actions{border-top:1px solid #d1d5db;border-top:1px solid var(--border-color)}.cancel-button,.confirm-button{border:none;border-radius:10px;padding:12px 16px}.cancel-button{background:#fef2f2;background:var(--modal-detail-bg);border:1px solid #fecaca;border:1px solid var(--modal-detail-border);color:#dc2626;color:var(--modal-header-text)}.cancel-button:hover:not(:disabled){opacity:.8}.cancel-button:disabled{cursor:not-allowed;opacity:.6}.confirm-button{align-items:center;background:linear-gradient(135deg,#dc2626,#b91c1c);border:1px solid #b91c1c;display:flex;gap:8px;justify-content:center}.confirm-button:hover:not(:disabled){background:linear-gradient(135deg,#b91c1c,#991b1b);box-shadow:0 4px 12px #dc26264d}.confirm-button:disabled{background:#9ca3af;border-color:#9ca3af;color:#cbd5e1;cursor:not-allowed}.info-section{margin-bottom:32px}.info-card{background:#eff6ff;background:var(--info-bg);border:1px solid #dbeafe;border:1px solid var(--info-border);display:flex;gap:16px;padding:20px}.info-icon{flex-shrink:0;margin-top:2px}.info-content h4,.info-icon{color:#1e40af;color:var(--info-text)}.info-content h4{font-size:16px;font-weight:600;margin:0 0 12px}.info-content ul{color:#1e40af;color:var(--info-text);margin:0;padding-left:16px}.info-content li{font-size:14px;margin-bottom:4px}.error-message{color:#ef4444;color:var(--error-text);font-size:14px;margin:8px 0}.error-message.wallet-error{background:#ef44441a;background:var(--error-bg);border:1px solid #ef44444d;border:1px solid var(--error-border);border-radius:6px;padding:8px 12px}@media (max-width:640px){.at-bigtime-page{padding:16px}.bundles-grid{gap:12px;grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.at-bigtime-header{padding:16px}.modal-actions{flex-direction:column}.cancel-button,.confirm-button{padding:14px 16px;width:100%}}.topup-container{background:#f8f9fa;display:flex;flex-direction:column;gap:1rem;min-height:100vh;padding:1rem;transition:background-color .3s ease}.back-button{border:1px solid #e5e7eb;color:#374151;font-size:.9rem;font-weight:500;gap:.5rem;padding:.75rem 1rem;width:-webkit-fit-content;width:fit-content}.back-button:hover{background:#f3f4f6;border-color:#ff8c00;color:#ff8c00}.header-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 2px 10px #0000001a;color:#374151;padding:2rem;text-align:center;transition:all .3s ease}.header-icon{align-items:center;background:#ff8c00;border-radius:50%;color:#fff;display:inline-flex;height:64px;justify-content:center;margin-bottom:1rem;width:64px}.header-card h1{color:#ff8c00;font-size:1.75rem;font-weight:800;letter-spacing:1px;margin:0 0 1rem;transition:color .3s ease}.header-card p{color:#6b7280;font-size:1rem;line-height:1.6;margin:0;transition:color .3s ease}.topup-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 2px 10px #0000001a;color:#374151;padding:2rem;transition:all .3s ease}.card-header{border-bottom:2px solid #f3f4f6;color:#ff8c00;font-size:1.1rem;font-weight:700;gap:.75rem;padding-bottom:1rem;transition:border-color .3s ease}.card-header,.current-balance{align-items:center;display:flex;margin-bottom:1.5rem}.current-balance{background:#f8f9fa;border:1px solid #e5e7eb;border-radius:8px;justify-content:space-between;padding:1rem 1.5rem;transition:all .3s ease}.balance-label{color:#6b7280;font-weight:500;transition:color .3s ease}.balance-amount{color:#374151;font-size:1.25rem;font-weight:800;transition:color .3s ease}.form-group{margin-bottom:1.5rem}.form-group label{color:#374151;display:block;font-size:.9rem;margin-bottom:.75rem;transition:color .3s ease}.required{color:#ef4444}.currency{color:#ff8c00;font-weight:700;left:1rem;position:absolute;top:50%;transform:translateY(-50%);z-index:1}.amount-input{background:#fff;border:2px solid #e5e7eb;border-radius:8px;box-sizing:border-box;color:#374151;font-size:1rem;font-weight:500;padding:1rem 1rem 1rem 3rem;transition:all .2s ease;width:100%}.amount-input::placeholder{color:#9ca3af}.amount-input:focus{border-color:#ff8c00;box-shadow:0 0 0 3px #ff8c001a;outline:none}.load-button{align-items:center;background:#ff8c00;border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:1rem;font-weight:600;gap:.75rem;justify-content:center;margin-bottom:2rem;padding:1.25rem 1.5rem;transition:all .2s ease;width:100%}.load-button:hover:not(:disabled){background:#e67e00}.load-button:disabled{background:#d1d5db;cursor:not-allowed}.spinner{border:2px solid #ffffff4d;border-radius:50%;border-top-color:#fff;height:20px;width:20px}.features{grid-gap:.75rem;display:grid;gap:.75rem;grid-template-columns:1fr}.feature{background:#f8f9fa;border:1px solid #e5e7eb;border-radius:6px;color:#6b7280;font-size:.9rem;font-weight:500;gap:.75rem;justify-content:space-evenly;padding:.75rem;transition:all .3s ease}.check,.feature{align-items:center;display:flex}.check{background:#ff8c00;border-radius:50%;color:#fff;flex-shrink:0;font-size:.7rem;font-weight:700;height:20px;justify-content:center;width:20px}.topup-container.dark-mode{background:#1a1a1a}.topup-container.dark-mode .back-button{background:#2d2d2d;border-color:#404040;color:#e5e7eb}.topup-container.dark-mode .back-button:hover{background:#3a3a3a;border-color:#ff8c00;color:#ff8c00}.topup-container.dark-mode .header-card{background:#2d2d2d;border-color:#404040;box-shadow:0 2px 10px #0000004d;color:#e5e7eb}.topup-container.dark-mode .header-card p{color:#9ca3af}.topup-container.dark-mode .topup-card{background:#2d2d2d;border-color:#404040;box-shadow:0 2px 10px #0000004d;color:#e5e7eb}.topup-container.dark-mode .card-header{border-bottom-color:#404040}.topup-container.dark-mode .current-balance{background:#1a1a1a;border-color:#404040}.topup-container.dark-mode .balance-label{color:#9ca3af}.topup-container.dark-mode .balance-amount,.topup-container.dark-mode .form-group label{color:#e5e7eb}.topup-container.dark-mode .amount-input{background:#1a1a1a;border-color:#404040;color:#e5e7eb}.topup-container.dark-mode .amount-input::placeholder{color:#6b7280}.topup-container.dark-mode .amount-input:focus{border-color:#ff8c00;box-shadow:0 0 0 3px #ff8c0033}.topup-container.dark-mode .feature{background:#1a1a1a;border-color:#404040;color:#9ca3af}.topup-container.dark-mode .load-button:disabled{background:#404040;color:#6b7280}.order-placement-history{background:#f8f9fa;min-height:50vh;padding:1rem;transition:background-color .3s ease}.order-placement-history .header{background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 2px 10px #0000001a;margin-bottom:1.5rem;padding:1.5rem;transition:all .3s ease}.order-placement-history .header-content{gap:1rem}.order-placement-history .header-icon{align-items:center;background:#ff8c00;border-radius:50%;color:#fff;display:flex;height:48px;justify-content:center;width:48px}.order-placement-history .header-text h1{color:#374151;font-size:1.5rem;font-weight:800}.order-placement-history .header-text p{color:#6b7280;font-size:.9rem;margin:.25rem 0 0}.order-placement-history .refresh-button{align-items:center;background:#ff8c00;border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-weight:600;gap:.5rem;padding:.75rem 1.25rem;transition:all .2s ease}.order-placement-history .refresh-button:hover:not(:disabled){background:#e67e00}.order-placement-history .refresh-button:disabled{background:#d1d5db;cursor:not-allowed}.order-placement-history .loading-spinner{animation:spin 1s linear infinite}.order-placement-history .error-banner{align-items:center;background:#fee2e2;border:1px solid #fecaca;border-radius:8px;display:flex;justify-content:space-between;margin-bottom:1.5rem;padding:1rem}.order-placement-history .error-banner p{color:#dc2626;font-weight:500;margin:0}.order-placement-history .retry-button{background:#dc2626;border:none;border-radius:6px;color:#fff;cursor:pointer;font-weight:600;padding:.5rem 1rem;transition:background .2s ease}.order-placement-history .retry-button:hover{background:#b91c1c}.order-placement-history .content{background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 2px 10px #0000001a;padding:2rem;transition:all .3s ease}.order-placement-history .empty-state{padding:3rem 1rem;text-align:center}.order-placement-history .empty-icon{color:#d1d5db;margin-bottom:1rem}.order-placement-history .empty-state h3{color:#374151;font-size:1.25rem;margin:0 0 .5rem;transition:color .3s ease}.order-placement-history .empty-state p{color:#6b7280;margin:0;transition:color .3s ease}.order-placement-history .orders-section h2{color:#374151;font-size:1.25rem;font-weight:700;margin:0 0 1rem;transition:color .3s ease}.order-placement-history .orders-list{display:flex;flex-direction:column;gap:1rem}.order-placement-history .order-card{background:#f8f9fa;border:1px solid #e5e7eb;border-radius:8px;padding:1.5rem;transition:all .3s ease}.order-placement-history .order-card:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.order-placement-history .order-header{align-items:center;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;margin-bottom:1rem;padding-bottom:1rem;transition:border-color .3s ease}.order-placement-history .order-id{display:flex;flex-direction:column;gap:.25rem}.order-placement-history .order-id-label{color:#6b7280;font-size:.75rem;font-weight:500;letter-spacing:.5px;text-transform:uppercase;transition:color .3s ease}.order-placement-history .spec{color:#ff8c00;font-family:monospace;font-size:.9rem;font-weight:700}.order-placement-history .order-details{display:flex;flex-direction:column;gap:.75rem}.order-placement-history .order-amount,.order-placement-history .order-date{align-items:center;display:flex;justify-content:space-between}.order-placement-history .amount-label,.order-placement-history .date-label{color:#6b7280;font-size:.9rem;font-weight:500;transition:color .3s ease}.order-placement-history .amount-value{color:#ff8c00;font-size:1.1rem;font-weight:700}.order-placement-history .date-value{color:#374151;font-size:.9rem;transition:color .3s ease}.order-placement-history.dark-mode{background:#1a1a1a}.order-placement-history.dark-mode .header{background:#2d2d2d;border-color:#404040;box-shadow:0 2px 10px #0000004d}.order-placement-history.dark-mode .header-text h1{color:#e5e7eb}.order-placement-history.dark-mode .header-text p{color:#9ca3af}.order-placement-history.dark-mode .content{background:#2d2d2d;border-color:#404040;box-shadow:0 2px 10px #0000004d}.order-placement-history.dark-mode .empty-state h3{color:#e5e7eb}.order-placement-history.dark-mode .empty-state p{color:#9ca3af}.order-placement-history.dark-mode .orders-section h2{color:#e5e7eb}.order-placement-history.dark-mode .order-card{background:#1a1a1a;border-color:#404040}.order-placement-history.dark-mode .order-card:hover{box-shadow:0 4px 12px #0006}.order-placement-history.dark-mode .order-header{border-bottom-color:#404040}.order-placement-history.dark-mode .amount-label,.order-placement-history.dark-mode .date-label,.order-placement-history.dark-mode .order-id-label{color:#9ca3af}.order-placement-history.dark-mode .date-value{color:#e5e7eb}.order-placement-history.dark-mode .error-banner{background:#3a1a1a;border-color:#5a2a2a}@media (min-width:768px){.topup-container{margin:0 auto;max-width:600px;padding:2rem}.header-card,.topup-card{padding:2.5rem}.features{gap:1rem;grid-template-columns:repeat(3,1fr)}.feature{flex-direction:column;gap:.5rem;padding:1rem .5rem;text-align:center}.order-placement-history{padding:2rem}.order-placement-history .content{padding:2.5rem}}@media (min-width:1024px){.topup-container{max-width:700px;padding:3rem}.header-card h1{font-size:2rem}.header-card p{font-size:1.1rem}.current-balance{padding:1.25rem 2rem}.balance-amount{font-size:1.5rem}.order-placement-history{padding:3rem}}@media (max-width:767px){.topup-container{gap:.75rem;padding:.75rem}.header-card{padding:1.5rem}.header-card h1{font-size:1.5rem}.header-card p{font-size:.9rem}.header-icon{height:56px;width:56px}.topup-card{padding:1.5rem}.current-balance{flex-direction:column;gap:.5rem;padding:1rem;text-align:center}.balance-amount{font-size:1.5rem}.features{gap:.5rem}.feature{font-size:.85rem;padding:.75rem}.load-button{font-size:.9rem;padding:1rem}.order-placement-history .header{align-items:flex-start;flex-direction:column;gap:1rem}.order-placement-history .refresh-button{justify-content:center;width:100%}.order-placement-history .content{padding:1.5rem}}@media (max-width:480px){.topup-container{padding:.5rem}.header-card,.topup-card{padding:1.25rem}.back-button{font-size:.85rem;padding:.5rem .75rem}.order-placement-history{padding:.75rem}.order-placement-history .header{padding:1rem}.order-placement-history .content{padding:1.25rem}}:root{--bg-primary:#f7f7f7;--bg-secondary:#fff;--bg-tertiary:#f8f9fa;--bg-hover:#e9ecef;--bg-card:#fffffff2;--text-primary:#2d3436;--text-secondary:#636e72;--text-tertiary:#495057;--text-light:#666;--border-primary:#ddd;--border-secondary:#e9ecef;--border-tertiary:#fff3;--status-success-bg:#d4edda;--status-success-text:#155724;--status-error-bg:#f8d7da;--status-error-text:#721c24;--status-warning-bg:#fff3cd;--status-warning-text:#856404;--status-neutral-bg:#e2e3e5;--status-neutral-text:#383d41;--network-mtn-bg:#fff3cd;--network-mtn-text:#856404;--network-telecel-bg:#f8d7da;--network-telecel-text:#721c24;--network-at-bg:#d1ecf1;--network-at-text:#0c5460;--accent-primary:#667eea;--accent-primary-hover:#5a67d8;--accent-secondary:#764ba2;--accent-success:#28a745;--accent-success-hover:#218838;--accent-danger:#dc3545;--accent-danger-hover:#c82333;--shadow-light:#0000001a;--shadow-medium:#0000000d;--shadow-strong:#00000014;--code-bg:#e9ecef;--code-text:#495057;--scrollbar-track:#f1f1f1;--scrollbar-thumb:#c1c1c1;--scrollbar-thumb-hover:#a8a8a8;--focus-ring:#667eea1a;--focus-border:#667eea}.dark-mode{--bg-primary:#1a1a1a;--bg-secondary:#2d2d2d;--bg-tertiary:#1a1a1a;--bg-hover:#3a3a3a;--bg-card:#2d2d2df2;--text-primary:#e5e7eb;--text-secondary:#9ca3af;--text-tertiary:#d1d5db;--text-light:#9ca3af;--border-primary:#404040;--border-secondary:#404040;--border-tertiary:#4040404d;--status-success-bg:#1a4d2e;--status-success-text:#4ade80;--status-error-bg:#4d1a1a;--status-error-text:#f87171;--status-warning-bg:#4d3d1a;--status-warning-text:#fbbf24;--status-neutral-bg:#2d2d2d;--status-neutral-text:#9ca3af;--network-mtn-bg:#4d3d1a;--network-mtn-text:#fbbf24;--network-telecel-bg:#4d1a1a;--network-telecel-text:#f87171;--network-at-bg:#1a3d4d;--network-at-text:#22d3ee;--accent-primary:#667eea;--accent-primary-hover:#7c8ef0;--accent-secondary:#764ba2;--accent-success:#28a745;--accent-success-hover:#34c759;--accent-danger:#dc3545;--accent-danger-hover:#e54858;--shadow-light:#0000004d;--shadow-medium:#0003;--shadow-strong:#0006;--code-bg:#1a1a1a;--code-text:#d1d5db;--scrollbar-track:#2d2d2d;--scrollbar-thumb:#505050;--scrollbar-thumb-hover:#606060;--focus-ring:#667eea33;--focus-border:#667eea}.order-history-page{background:#f7f7f7;background:var(--bg-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;min-height:100vh;padding:20px;transition:background-color .3s ease}.order-history-header{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff2;background:var(--bg-card);border:1px solid #fff3;border:1px solid var(--border-tertiary);border-radius:16px;box-shadow:0 8px 32px #0000001a;box-shadow:0 8px 32px var(--shadow-light);display:flex;margin-bottom:30px;padding:20px;transition:all .3s ease}.back-button{background:#f8f9fa;background:var(--bg-tertiary);border-radius:12px;color:#2d3436;color:var(--text-primary);height:48px;margin-right:16px;width:48px}.back-button:hover{background:#e9ecef;background:var(--bg-hover);transform:translateY(-1px)}.header-content{flex:1 1}.header-content,.page-logo{align-items:center;display:flex}.page-logo{background:linear-gradient(135deg,#667eea,#764ba2);background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));border-radius:12px;height:48px;justify-content:center;margin-right:16px;width:48px}.history-icon{color:#fff}.header-text h1{color:#2d3436;color:var(--text-primary);font-size:24px;font-weight:700;margin:0;transition:color .3s ease}.header-text p{color:#636e72;color:var(--text-secondary);font-size:14px;margin:4px 0 0;transition:color .3s ease}.user-email{color:#666;color:var(--text-light);font-size:.8rem;margin-top:.25rem;transition:color .3s ease}.refresh-button{align-items:center;background:#f8f9fa;background:var(--bg-tertiary);border:1px solid #e9ecef;border:1px solid var(--border-secondary);border-radius:6px;color:#2d3436;color:var(--text-primary);cursor:pointer;display:flex;font-size:.9rem;gap:.5rem;padding:.5rem 1rem;transition:all .3s ease}.refresh-button:hover:not(:disabled){background:#e9ecef;background:var(--bg-hover)}.refresh-button:disabled{cursor:not-allowed;opacity:.6}.error-banner{align-items:center;background:#f8d7da;background:var(--status-error-bg);border-radius:8px;color:#721c24;color:var(--status-error-text);display:flex;justify-content:space-between;margin-bottom:1rem;padding:1rem;transition:all .3s ease}.retry-button{background:#dc3545;background:var(--accent-danger);border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:.9rem;padding:.5rem 1rem;transition:background .3s ease}.retry-button:hover{background:#c82333;background:var(--accent-danger-hover)}.error-message{color:#666;color:var(--text-light);padding:2rem;text-align:center;transition:color .3s ease}.controls-section{align-items:center;display:flex;flex-wrap:wrap;gap:16px;margin-bottom:24px}.search-container{flex:1 1;min-width:250px;position:relative}.search-icon{color:#636e72;color:var(--text-secondary);left:16px;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:color .3s ease}.search-input{background:#fff;background:var(--bg-secondary);border:1px solid #ddd;border:1px solid var(--border-primary);border-radius:12px;box-sizing:border-box;color:#2d3436;color:var(--text-primary);padding:14px 16px 14px 48px;transition:all .2s ease;width:100%}.search-input::placeholder{color:#636e72;color:var(--text-secondary)}.search-input:focus{border-color:#667eea;border-color:var(--focus-border);box-shadow:0 0 0 3px #667eea1a;box-shadow:0 0 0 3px var(--focus-ring)}.filter-container{align-items:center;display:flex;position:relative}.filter-icon{color:#636e72;color:var(--text-secondary);margin-right:8px;transition:color .3s ease}.filter-select{background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:12px;color:#2d3436;color:var(--text-primary);cursor:pointer;min-width:150px;padding:14px 16px;transition:all .3s ease}.filter-select:focus{border-color:var(--focus-border);box-shadow:0 0 0 3px var(--focus-ring)}.export-button{align-items:center;background:#28a745;background:var(--accent-success);border:none;border-radius:12px;color:#fff;cursor:pointer;display:flex;font-size:14px;font-weight:600;gap:8px;padding:14px 20px;transition:all .2s ease}.export-button:hover{background:#218838;background:var(--accent-success-hover);transform:translateY(-1px)}.export-button:disabled{cursor:not-allowed;opacity:.5;transform:none}.stats-section{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin-bottom:24px}.stat-card{background:var(--bg-secondary);border-radius:12px;box-shadow:0 4px 16px #0000001a;box-shadow:0 4px 16px var(--shadow-light);padding:20px;text-align:center;transition:all .3s ease}.stat-card:hover{transform:translateY(-2px)}.stat-number{color:#2d3436;color:var(--text-primary);font-size:32px;font-weight:700;margin-bottom:4px}.stat-label,.stat-number{transition:color .3s ease}.stat-label{color:#636e72;color:var(--text-secondary);font-size:14px}.table-section{background:#fff;background:var(--bg-secondary);border-radius:16px;box-shadow:0 8px 32px #0000001a;box-shadow:0 8px 32px var(--shadow-light);overflow:hidden;transition:all .3s ease}.loading-container{color:#636e72;color:var(--text-secondary);padding:60px 20px}.loading-spinner{border:4px solid #f8f9fa;border-top:4px solid #667eea;border:4px solid var(--bg-tertiary);border-top-color:var(--accent-primary)}.empty-state{align-items:center;display:flex;flex-direction:column;justify-content:center}.empty-icon,.empty-state{color:#636e72;color:var(--text-secondary)}.empty-icon{margin-bottom:20px;opacity:.5}.empty-state h3{color:#2d3436;color:var(--text-primary);font-size:20px;margin:0 0 12px;transition:color .3s ease}.empty-state p{color:#636e72;color:var(--text-secondary);line-height:1.5;margin:0;max-width:400px;transition:color .3s ease}.table-container{overflow-x:auto}.orders-table th{background:var(--bg-tertiary);border-bottom:2px solid #e9ecef;border-bottom:2px solid var(--border-secondary);text-align:left;white-space:nowrap}.orders-table td,.orders-table th{color:#2d3436;color:var(--text-primary);padding:16px 12px;transition:all .3s ease}.orders-table td{border-bottom:1px solid #e9ecef;border-bottom:1px solid var(--border-secondary);vertical-align:middle}.order-row:hover{background:#f8f9fa;background:var(--bg-tertiary)}.order-id code{background:#e9ecef;background:var(--code-bg);border-radius:6px;color:#495057;color:var(--code-text);font-family:Courier New,monospace;font-size:12px;padding:4px 8px;transition:all .3s ease}.phone-number{color:#2d3436;color:var(--text-primary);font-weight:500;transition:color .3s ease}.network-badge{border-radius:20px;font-weight:600;letter-spacing:.5px;padding:4px 12px;transition:all .3s ease}.network-mtn{background:#fff3cd;background:var(--network-mtn-bg);color:#856404;color:var(--network-mtn-text)}.network-telecel{background:#f8d7da;background:var(--network-telecel-bg);color:#721c24;color:var(--network-telecel-text)}.network-at{background:#d1ecf1;background:var(--network-at-bg);color:#0c5460;color:var(--network-at-text)}.network-default{background:#e2e3e5;background:var(--status-neutral-bg);color:#383d41;color:var(--status-neutral-text)}.data-size strong{color:#667eea;color:var(--accent-primary);font-weight:700}.amount strong{color:#28a745;color:var(--accent-success);font-weight:700}.datetime{text-align:center}.date{color:#2d3436;color:var(--text-primary);font-size:14px;font-weight:600;transition:color .3s ease}.time{color:#636e72;color:var(--text-secondary);font-size:12px;margin-top:2px}.status-badge{transition:all .3s ease}.status-completed{background:#d4edda;background:var(--status-success-bg);color:#155724;color:var(--status-success-text)}.status-failed{background:#f8d7da;background:var(--status-error-bg);color:#721c24;color:var(--status-error-text)}.status-pending{background:#fff3cd;background:var(--status-warning-bg);color:#856404;color:var(--status-warning-text)}.status-unknown{background:#e2e3e5;background:var(--status-neutral-bg);color:#383d41;color:var(--status-neutral-text)}.view-button{align-items:center;background:#667eea;background:var(--accent-primary);border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;height:32px;justify-content:center;transition:all .2s ease;width:32px}.view-button:hover{background:#5a67d8;background:var(--accent-primary-hover);transform:scale(1.1)}.results-info{background:#fff;background:var(--bg-secondary);border-radius:12px;box-shadow:0 4px 16px #0000000d;box-shadow:0 4px 16px var(--shadow-medium);margin-top:16px;padding:16px 20px;text-align:center;transition:all .3s ease}.results-info p{color:#636e72;color:var(--text-secondary);font-size:14px;margin:0;transition:color .3s ease}.order-placement-history{background:#fff;background:var(--bg-secondary);border-radius:12px;box-shadow:0 2px 8px #00000014;box-shadow:0 2px 8px var(--shadow-strong);margin-top:30px;padding:20px;transition:all .3s ease}.order-placement-history .header{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}.order-placement-history .header-content{align-items:center;display:flex;gap:12px}.order-placement-history .header-text h1{color:#2d3436;color:var(--text-primary);font-size:20px;font-weight:600;margin:0;transition:color .3s ease}.order-placement-history .header-text p{color:#636e72;color:var(--text-secondary);font-size:14px;margin:0;transition:color .3s ease}.orders-section h2{color:#2d3436;color:var(--text-primary);font-size:18px;margin-bottom:15px;transition:color .3s ease}.orders-list{display:flex;flex-direction:column;gap:15px}.order-card{background:#f8f9fa;background:var(--bg-tertiary);border:1px solid #e9ecef;border:1px solid var(--border-secondary);border-radius:10px;padding:15px;transition:all .3s ease}.order-card:hover{background:#fff;background:var(--bg-secondary);box-shadow:0 2px 10px #00000014;box-shadow:0 2px 10px var(--shadow-strong)}.order-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:12px}.order-id{color:#666;color:var(--text-light);font-size:18px;transition:color .3s ease}.order-id-label{font-weight:700;margin-right:4px}.order-id .spec{color:#667eea;color:var(--accent-primary);font-size:18px}.order-details{display:flex;flex-wrap:wrap;gap:15px;justify-content:space-between;margin-bottom:12px}.amount-label,.date-label{color:#636e72;color:var(--text-secondary);font-size:13px;font-weight:500;transition:color .3s ease}.amount-value,.date-value{color:#2d3436;color:var(--text-primary);font-size:14px;font-weight:600;transition:color .3s ease}.order-actions{text-align:right}.table-container::-webkit-scrollbar{height:8px}.table-container::-webkit-scrollbar-track{background:#f1f1f1;background:var(--scrollbar-track);border-radius:10px}.table-container::-webkit-scrollbar-thumb{background:#c1c1c1;background:var(--scrollbar-thumb);border-radius:10px}.table-container::-webkit-scrollbar-thumb:hover{background:#a8a8a8;background:var(--scrollbar-thumb-hover)}@media (max-width:768px){.order-history-page{padding:16px}.order-history-header{flex-direction:column;gap:16px;text-align:center}.back-button{align-self:flex-start}.controls-section{align-items:stretch;flex-direction:column}.search-container{min-width:auto}.stats-section{gap:12px;grid-template-columns:repeat(2,1fr)}.stat-card{padding:16px 12px}.stat-number{font-size:24px}.orders-table{font-size:14px}.orders-table td,.orders-table th{padding:12px 8px}.order-id code{font-size:10px;padding:2px 6px}.network-badge,.status-badge{font-size:10px;padding:4px 8px}}@media (max-width:480px){.header-text h1{font-size:20px}.stats-section{grid-template-columns:1fr}.table-container{border-radius:12px}.orders-table td,.orders-table th{font-size:12px;padding:10px 6px}.orders-table td:nth-child(3),.orders-table td:nth-child(5),.orders-table th:nth-child(3),.orders-table th:nth-child(5){display:none}}.auth-page{align-items:center;background-image:linear-gradient(#ffffff80,#ffffff80),url(/static/media/bg.0ea1b322408eaad65a76.jpg);background-position:50%;background-repeat:no-repeat;background-size:cover;display:flex;justify-content:center;min-height:100vh;padding:20px}.auth-header{margin-bottom:32px;text-align:center}.brand-logo{box-shadow:0 10px 30px #4fc3f74d;margin:0 auto 20px}.brand-logo:before{background:#fff;border-radius:50%;content:"";opacity:.2;position:absolute}.brand-title{color:#4fc3f7;font-size:20px;font-weight:600;letter-spacing:1px;margin:0 0 8px}.auth-form-container{margin-bottom:32px}.auth-form{animation:fadeIn .3s ease-in-out;display:flex;flex-direction:column}.form-group{gap:0}.form-group label{color:#333;margin-bottom:5px}.input-container{align-items:center;display:flex;position:relative}.input-icon{color:#999;font-size:18px;left:16px;z-index:1}.input-container input{background:#fafafa;border:1px solid #e0e0e0;border-radius:10px;box-sizing:border-box;color:#333;font-size:16px;padding:16px 16px 16px 50px;transition:all .3s ease;width:100%}.input-container input::placeholder{color:#bbb;font-weight:400;padding-left:20px}.input-container input:focus{background:#fff;border-color:#4fc3f7;box-shadow:0 0 0 3px #4fc3f71a;padding-left:20px}.input-container input.error{animation:shake .5s ease-in-out;background:#fff5f5;border-color:#ff5252}@keyframes shake{0%,to{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}.input-container input:disabled{background:#f5f5f5;cursor:not-allowed}.password-toggle{border-radius:6px;color:#999;padding:8px;right:16px;transition:all .2s ease;z-index:1}.password-toggle:hover{background:#f5f5f5;color:#4fc3f7}.password-toggle:disabled{cursor:not-allowed;opacity:.5}.error-text{align-items:center;color:#ff5252;display:flex;font-size:12px;gap:4px;margin-top:5px}.submit-error{background:#ffebee;border:1px solid #ffcdd2;border-radius:10px;color:#c62828;font-size:14px;margin-bottom:15px;padding:12px 16px;text-align:center}.submit-button{align-items:center;background:linear-gradient(135deg,#4fc3f7,#29b6f6);border:none;border-radius:25px;box-shadow:0 8px 25px #4fc3f766;color:#fff;cursor:pointer;display:flex;font-size:16px;font-weight:600;gap:8px;justify-content:center;padding:16px 24px;transition:all .3s ease}.submit-button:hover:not(:disabled){box-shadow:0 12px 35px #4fc3f780;transform:translateY(-2px)}.submit-button:active{transform:translateY(0)}.submit-button:disabled{cursor:not-allowed;opacity:.7;transform:none}.submit-button.success{background:linear-gradient(135deg,#28a745,#20c997)}.loading-spinner{border:2px solid #ffffff4d}@media (max-width:768px){.auth-page{align-items:center;padding:20px}.auth-container{border-radius:20px;max-width:350px;padding:40px 25px}.brand-title{font-size:18px}.brand-subtitle{font-size:13px}}@media (max-width:480px){.auth-container{margin:20px;padding:35px 20px}.brand-title{font-size:18px}.input-container input{font-size:16px;padding:14px 14px 14px 45px}.input-icon{left:14px}.password-toggle{right:14px}.submit-button{font-size:15px;padding:14px 20px}}.link-button:focus,.password-toggle:focus,.submit-button:focus,.tab-button:focus{outline:2px solid #4fc3f7;outline-offset:2px}.input-container input:focus{outline:none}.auth-container.loading{pointer-events:none;position:relative}.auth-container.loading:after{background:#fffc;border-radius:20px;bottom:0;content:"";left:0;position:absolute;right:0;top:0;z-index:10}.brand-logo{align-items:center;background:#fff;border:3px solid #fff;border-radius:50%;color:#fff;display:flex;height:100px;justify-content:center;margin:-100px auto 20px;overflow:hidden;position:relative;width:100px;z-index:1}.auth-container{animation:slideUp .6s ease-out;background-color:#fff;border:none;border-radius:20px;box-shadow:0 20px 60px #00000026;margin-top:40px;max-width:400px;padding:40px 30px;position:relative;width:100%}.brand-logo:before{display:none}.auth-toggle p{margin-right:5px;padding:10px;text-align:center}.auth-toggle button,.auth-toggle p{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:TASA Explorer,sans-serif;font-weight:600}.auth-toggle button{border:1px solid #0000;border-radius:3px;color:#29b6f6;padding:5px;text-decoration:underline}.auth-toggle button:hover{background-color:initial;border:1px solid #000;color:#29b6f6}.auth-container{padding-bottom:10px}.success-message-container{padding:40px 20px;text-align:center}.success-message-container .success-icon{color:#10b981;margin-bottom:24px}.success-message-container h2{color:#1f2937;font-size:24px;font-weight:600;margin-bottom:16px}.success-message-container p{color:#374151;line-height:1.6;margin-bottom:12px}.text-muted{color:#6b7280!important;font-size:14px}.text-button{background:none;border:none;color:#6366f1;cursor:pointer;font-size:14px;font-weight:500;padding:8px;transition:color .2s}.text-button:hover:not(:disabled){color:#4f46e5;text-decoration:underline}.text-button:disabled{cursor:not-allowed;opacity:.5}.admin-page{background-color:#f8fafc;min-height:100vh;padding:0}.admin-header{align-items:center;background:#fff;box-shadow:0 1px 3px #0000001a;display:flex;justify-content:space-between;padding:1rem 1.5rem;position:-webkit-sticky;position:sticky;top:0;z-index:10}.back-button{background:none;border-radius:.5rem;color:#6b7280;padding:.5rem;transition:all .2s}.back-button:hover{background-color:#f3f4f6;color:#374151}.admin-title-section{align-items:center;display:flex;flex:1 1;gap:.75rem;justify-content:center}.admin-shield-icon{color:#dc2626}.admin-title{color:#1f2937;font-size:1.5rem;font-weight:600;margin:0}.admin-user-info{color:#6b7280;font-size:.875rem;font-weight:500}.admin-loading{align-items:center;display:flex;flex-direction:column;gap:1rem;justify-content:center;min-height:60vh}.loading-spinner{border:3px solid #e5e7eb;border-top-color:#dc2626;height:32px;width:32px}.access-denied{align-items:center;display:flex;justify-content:center;min-height:60vh;padding:2rem}.access-denied-content{max-width:400px;text-align:center}.access-denied-icon{display:flex;justify-content:center;margin-bottom:1.5rem}.access-denied-icon svg{background-color:#fee2e2;border-radius:50%;color:#dc2626;height:96px;padding:1rem;width:96px}.access-denied h2{color:#1f2937;font-size:1.5rem;font-weight:600;margin-bottom:1rem}.access-denied p{color:#6b7280;line-height:1.5;margin-bottom:1rem}.back-to-dashboard-btn{background-color:#dc2626;border:none;border-radius:.5rem;color:#fff;cursor:pointer;font-weight:500;padding:.75rem 1.5rem;transition:background-color .2s}.back-to-dashboard-btn:hover{background-color:#b91c1c}.admin-tabs{background:#fff;border-bottom:1px solid #e5e7eb;display:flex;overflow-x:auto}.admin-tab{align-items:center;background:none;border:none;border-bottom:2px solid #0000;color:#6b7280;cursor:pointer;display:flex;font-weight:500;gap:.5rem;padding:1rem 1.5rem;transition:all .2s;white-space:nowrap}.admin-tab:hover{background-color:#f9fafb;color:#374151}.admin-tab.active{border-bottom-color:#dc2626;color:#dc2626}.admin-content{padding:2rem 1.5rem}.admin-overview{margin:0 auto;max-width:1200px}.stats-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-bottom:2rem}.stat-card{background:#fff;box-shadow:0 1px 3px #0000001a;gap:1rem;padding:1.5rem}.stat-card,.stat-icon{align-items:center;border-radius:.75rem;display:flex}.stat-icon{color:#fff;height:48px;justify-content:center;width:48px}.stat-icon.users{background-color:#3b82f6}.stat-icon.orders{background-color:#10b981}.stat-icon.revenue{background-color:#f59e0b}.stat-icon.active{background-color:#8b5cf6}.stat-info h3{color:#1f2937;font-size:1.5rem;font-weight:600;margin:0}.stat-info p{color:#6b7280;font-size:.875rem;margin:0}.recent-activity{background:#fff;border-radius:.75rem;box-shadow:0 1px 3px #0000001a;padding:1.5rem}.recent-activity h3{color:#1f2937;font-size:1.125rem;font-weight:600;margin:0 0 1rem}.activity-list{display:flex;flex-direction:column;gap:.75rem}.activity-item{align-items:center;background-color:#f9fafb;border-radius:.5rem;display:flex;justify-content:space-between;padding:.75rem}.activity-time{color:#6b7280;font-size:.75rem;font-weight:500}.activity-description{color:#374151;font-size:.875rem}.admin-orders,.admin-revenue,.admin-users{background:#fff;border-radius:.75rem;box-shadow:0 1px 3px #0000001a;padding:2rem;text-align:center}.admin-orders h3,.admin-revenue h3,.admin-users h3{color:#1f2937;margin:0 0 1rem}.admin-orders p,.admin-revenue p,.admin-users p{color:#6b7280;margin:0}@media (max-width:768px){.admin-header{padding:1rem}.admin-title-section{justify-content:flex-start;margin-left:1rem}.admin-user-info{display:none}.admin-content{padding:1rem}.stats-grid{gap:1rem;grid-template-columns:1fr}.activity-item{align-items:flex-start;flex-direction:column;gap:.25rem}}.admin-orders{padding:20px}.orders-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}.orders-header h3{color:#333;margin:0}.refresh-btn{border-radius:6px;transition:background-color .2s}.refresh-btn:disabled{background:#ccc}.no-orders,.orders-loading{align-items:center;color:#666;display:flex;flex-direction:column;justify-content:center;padding:40px}.no-orders svg{margin-bottom:16px;opacity:.5}.orders-table-container{background:#fff;border-radius:8px;box-shadow:0 2px 10px #0000001a;overflow-x:auto}.orders-table{border-collapse:collapse;min-width:600px;width:100%}.orders-table td,.orders-table th{border-bottom:1px solid #eee;padding:12px 16px;text-align:left}.orders-table th{background:#f8f9fa;color:#333;font-size:14px;font-weight:600;letter-spacing:.5px;text-transform:uppercase}.orders-table td{color:#666;font-size:14px}.orders-table tbody tr:hover{background:#f8f9fa}.orders-table tbody tr:last-child td{border-bottom:none}.bundle-size{background:#e7f3ff;border-radius:4px;color:#06c;font-size:12px;font-weight:500;padding:4px 8px}.loading-spinner{border:4px solid #f3f3f3;margin-bottom:16px}.network-badge{border-radius:12px;font-size:12px;font-weight:500;padding:2px 8px;text-transform:uppercase}.network-mtn{background:#ffeb3b;color:#f57f17}.network-telecel{background:#e3f2fd;color:#1565c0}.network-at{background:#f3e5f5;color:#7b1fa2}.network-default{background:#f5f5f5;color:#666}.orders-controls{gap:1rem}.filter-group,.orders-controls{align-items:center;display:flex}.filter-group{gap:.5rem}.filter-select{border:1px solid #ddd;border-radius:4px;font-size:.9rem;padding:.5rem}.admin-users{padding:20px}.users-header{align-items:center;display:flex;flex-wrap:wrap;gap:15px;justify-content:space-between;margin-bottom:20px}.users-header h3{color:#333;font-size:24px;font-weight:600;margin:0}.users-controls{align-items:center;display:flex;flex-wrap:wrap;gap:15px}.search-group{position:relative}.search-input{border:2px solid #e1e5e9;border-radius:8px;font-size:14px;min-width:300px;padding:8px 16px;transition:border-color .2s ease}.search-input:focus{border-color:#007bff;box-shadow:0 0 0 3px #007bff1a;outline:none}.search-input::placeholder{color:#6c757d}.users-loading{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:60px 20px;text-align:center}.users-loading p{color:#666;font-size:16px;margin-top:15px}.no-users{align-items:center;color:#6c757d;display:flex;flex-direction:column;justify-content:center;padding:60px 20px;text-align:center}.no-users svg{color:#dee2e6;margin-bottom:20px}.no-users p{color:#495057;font-size:18px;font-weight:500;margin-bottom:8px}.no-users small{color:#6c757d;font-size:14px}.users-table-container{background:#fff;border:1px solid #e1e5e9;border-radius:12px;box-shadow:0 2px 8px #0000001a;overflow:hidden}.users-table{border-collapse:collapse;font-size:14px;width:100%}.users-table thead{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.users-table thead th{border:none;font-size:13px;font-weight:600;letter-spacing:.5px;padding:16px 12px;text-align:left;text-transform:uppercase}.users-table tbody tr{border-bottom:1px solid #f1f3f4;transition:background-color .15s ease}.users-table tbody tr:hover{background-color:#f8f9fa}.users-table tbody tr:last-child{border-bottom:none}.users-table tbody td{color:#495057;padding:16px 12px;vertical-align:middle}.users-table tbody td:first-child{color:#007bff;font-weight:500}.user-name{color:#28a745;font-weight:500}@media (max-width:768px){.users-header{align-items:stretch;flex-direction:column}.users-controls{justify-content:center}.search-input{max-width:none;min-width:100%}.users-table-container{overflow-x:auto}.users-table{min-width:600px}.users-table tbody td,.users-table thead th{font-size:13px;padding:12px 8px}}.loading-spinner{border:3px solid #f3f3f3;border-top-color:#007bff;height:40px;width:40px}.refresh-btn{background:#007bff;font-size:14px;font-weight:500}.refresh-btn:hover:not(:disabled){background:#0056b3;transform:translateY(-1px)}.refresh-btn:disabled{background:#6c757d;transform:none}.refresh-btn .spinning{animation:spin 1s linear infinite}.error-message{background:#fee!important;border:1px solid #fcc!important;border-radius:5px!important;color:#c33!important;margin:10px 0!important;padding:10px!important}.error-message strong{font-weight:600}.topup-table-container{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000d;margin-top:20px;overflow:hidden}.topup-table{background:#fff;border-collapse:collapse;font-size:14px;width:100%}.topup-table thead{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.topup-table th{border:none;font-size:12px;font-weight:600;letter-spacing:.5px;padding:16px 12px;text-align:left;text-transform:uppercase}.topup-table tbody tr{border-bottom:1px solid #f1f3f4;transition:all .2s ease}.topup-table tbody tr:hover{background-color:#f8faff;box-shadow:0 2px 4px #667eea1a;transform:translateY(-1px)}.topup-table tbody tr:last-child{border-bottom:none}.topup-table td{border:none;color:#2d3748;padding:16px 12px;vertical-align:middle}.topup-table td:first-child{color:#667eea;font-family:Monaco,Menlo,monospace;font-size:13px;font-weight:600}.topup-table td:nth-child(2){color:#718096;font-family:Monaco,Menlo,monospace;font-size:13px}.topup-table td:nth-child(3){color:#2b6cb0;font-weight:600}.topup-table td:nth-child(4){color:#38a169;font-size:15px;font-weight:700}.status-badge.pending{background:linear-gradient(135deg,#ed8936,#dd6b20);color:#fff}.status-badge.completed{background:linear-gradient(135deg,#4299e1,#3182ce);color:#fff}.status-badge.failed{background:linear-gradient(135deg,#f56565,#e53e3e);color:#fff}.topup-table td:nth-child(6),.topup-table td:nth-child(7){color:#718096;font-size:13px}.topup-loading{align-items:center;color:#718096;display:flex;flex-direction:column;justify-content:center;padding:60px 20px}.topup-loading .loading-spinner{animation:spin 1s linear infinite;border:3px solid #e2e8f0;border-radius:50%;border-top-color:#667eea;height:40px;margin-bottom:16px;width:40px}.no-topups{align-items:center;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000d;color:#718096;display:flex;flex-direction:column;justify-content:center;padding:60px 20px}.no-topups svg{color:#cbd5e0;margin-bottom:16px}.no-topups p{color:#4a5568;font-size:18px;font-weight:600;margin:0 0 8px}.no-topups small{color:#a0aec0;line-height:1.5;text-align:center}.topup-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:24px}.topup-header h3{color:#2d3748;font-size:24px;font-weight:700;margin:0}.topup-controls,.topup-header h3{align-items:center;display:flex;gap:12px}.filter-select:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.refresh-btn{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 2px 4px #667eea33}.refresh-btn:hover:not(:disabled){box-shadow:0 4px 12px #667eea4d}@media (max-width:768px){.topup-table-container{overflow-x:auto}.topup-table{min-width:800px}.topup-header{align-items:stretch;flex-direction:column;gap:16px}.topup-controls{justify-content:center}}.topup-table-container>div:first-child{background:#f7fafc;border-bottom:1px solid #e2e8f0;color:#4a5568;font-weight:500;padding:16px 20px}.wallet-table-container{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000d;margin-top:20px;overflow:hidden}.wallet-table{background:#fff;border-collapse:collapse;font-size:14px;width:100%}.wallet-table thead{background:linear-gradient(135deg,#38a169,#2f855a);color:#fff}.wallet-table th{border:none;font-size:12px;font-weight:600;letter-spacing:.5px;padding:16px 12px;text-align:left;text-transform:uppercase}.wallet-table tbody tr{border-bottom:1px solid #f1f3f4;transition:all .2s ease}.wallet-table tbody tr:hover{background-color:#f0fff4;box-shadow:0 2px 4px #38a1691a;transform:translateY(-1px)}.wallet-table tbody tr:last-child{border-bottom:none}.wallet-table td{border:none;color:#2d3748;padding:16px 12px;vertical-align:middle}.wallet-table td:first-child{color:#2b6cb0;font-size:14px;font-weight:600}.wallet-table td:nth-child(2){color:#718096;font-family:Monaco,Menlo,monospace;font-size:13px}.wallet-table td:nth-child(3){background:linear-gradient(90deg,#f0fff4,#0000);border-left:3px solid #38a169;color:#38a169;font-size:16px;font-weight:700}.wallet-table td:nth-child(4){color:#2d3748;font-weight:600;text-align:center}.status-badge{box-shadow:0 2px 4px #0000001a;font-size:11px;letter-spacing:.5px;padding:6px 12px;text-transform:uppercase}.status-badge.active{background:linear-gradient(135deg,#48bb78,#38a169);color:#fff}.status-badge.inactive{background:linear-gradient(135deg,#a0aec0,#718096);color:#fff}.status-badge.suspended{background:linear-gradient(135deg,#f56565,#e53e3e);color:#fff}.wallet-table td:nth-child(6),.wallet-table td:nth-child(7){color:#718096;font-size:13px}.wallet-loading{align-items:center;color:#718096;display:flex;flex-direction:column;justify-content:center;padding:60px 20px}.wallet-loading .loading-spinner{animation:spin 1s linear infinite;border:3px solid #e2e8f0;border-radius:50%;border-top-color:#38a169;height:40px;margin-bottom:16px;width:40px}.no-wallets{align-items:center;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000d;color:#718096;display:flex;flex-direction:column;justify-content:center;padding:60px 20px}.no-wallets svg{color:#cbd5e0;margin-bottom:16px}.no-wallets p{color:#4a5568;font-size:18px;font-weight:600;margin:0 0 8px}.no-wallets small{color:#a0aec0;line-height:1.5;text-align:center}.wallet-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:24px}.wallet-header h3{color:#2d3748;font-size:24px;font-weight:700;margin:0}.wallet-controls,.wallet-header h3{align-items:center;display:flex;gap:12px}.filter-select{background:#fff;border:2px solid #e2e8f0;border-radius:8px;color:#2d3748;font-size:14px;min-width:120px;padding:8px 12px;transition:all .2s ease}.filter-select:focus{border-color:#38a169;box-shadow:0 0 0 3px #38a1691a;outline:none}.refresh-btn{align-items:center;background:linear-gradient(135deg,#38a169,#2f855a);border:none;border-radius:8px;box-shadow:0 2px 4px #38a16933;color:#fff;cursor:pointer;display:flex;font-weight:600;gap:8px;padding:8px 16px;transition:all .2s ease}.refresh-btn:hover:not(:disabled){box-shadow:0 4px 12px #38a1694d;transform:translateY(-2px)}.refresh-btn:disabled{cursor:not-allowed;opacity:.7}.spinning{animation:spin 1s linear infinite}@keyframes balance-highlight{0%{background-position:-100% 0}to{background-position:100% 0}}.wallet-table td:nth-child(3):hover{animation:balance-highlight 1s ease-in-out;background:linear-gradient(90deg,#f0fff4,#e6fffa 50%,#f0fff4);background-size:200% 100%}.wallet-table tr:has(td:nth-child(3):contains("0.00")) td:nth-child(3){background:linear-gradient(90deg,#f7fafc,#0000);border-left-color:#cbd5e0;color:#718096}.wallet-table td[data-balance-high=true]{background:linear-gradient(90deg,#f0fff4,#e6fffa 25%,#0000);border-left:3px solid #22c55e;position:relative}.wallet-table td[data-balance-high=true]:after{content:"💰";font-size:12px;position:absolute;right:8px;top:50%;transform:translateY(-50%)}@media (max-width:768px){.wallet-table-container{overflow-x:auto}.wallet-table{min-width:800px}.wallet-header{align-items:stretch;flex-direction:column;gap:16px}.wallet-controls{justify-content:center}}.wallet-table-container>div:first-child{background:linear-gradient(90deg,#f0fff4,#fff);border-bottom:1px solid #e2e8f0;color:#4a5568;font-weight:500;padding:16px 20px}.admin-action-btn{border:none;border-radius:4px;cursor:pointer;font-weight:500;transition:all .2s ease-in-out}.admin-action-btn:hover:not(:disabled){box-shadow:0 2px 4px #0000001a;transform:translateY(-1px)}.admin-action-btn.done{background-color:#48bb78!important;cursor:not-allowed;opacity:.7}.admin-action-btn.undone{background-color:#ed8936!important}.admin-action-btn.undone:hover{background-color:#dd7324!important}.admin-action-btn:disabled{cursor:not-allowed}.orders-table td:last-child,.orders-table th:last-child{text-align:center;width:120px}.admin-commission{animation:fadeIn .3s ease-in;width:100%}.commission-header{align-items:center;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;margin-bottom:24px}.commission-header h3{color:#2d3748;font-size:20px;font-weight:600;margin:0}.commission-controls{align-items:center;display:flex;flex-wrap:wrap;gap:12px}.commission-loading{align-items:center;display:flex;flex-direction:column;gap:16px;justify-content:center;padding:60px 20px}.commission-loading .loading-spinner{animation:spin .8s linear infinite;border:4px solid #e2e8f0;border-radius:50%;border-top-color:#4299e1;height:48px;width:48px}.commission-loading p{color:#718096;font-size:14px;font-weight:500}.no-commissions{align-items:center;background:#f7fafc;border:2px dashed #cbd5e0;border-radius:12px;display:flex;flex-direction:column;justify-content:center;padding:80px 20px;text-align:center}.no-commissions svg{color:#a0aec0;margin-bottom:16px}.no-commissions p{color:#4a5568;font-size:18px;font-weight:600;margin:8px 0}.no-commissions small{color:#718096;display:block;font-size:14px;max-width:400px}.commission-table-container{background:#fff;border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 1px 3px #0000001a;overflow:hidden}.commission-table{border-collapse:collapse;font-size:14px;width:100%}.commission-table thead{background:linear-gradient(90deg,#667eea 0,#764ba2)}.commission-table thead tr{border-bottom:2px solid #e2e8f0}.commission-table th{color:#fff;font-size:13px;font-weight:600;letter-spacing:.5px;padding:16px 12px;position:-webkit-sticky;position:sticky;text-align:left;text-transform:uppercase;top:0;white-space:nowrap;z-index:10}.commission-table tbody tr{border-bottom:1px solid #e2e8f0;transition:background-color .2s ease}.commission-table tbody tr:hover{background-color:#f7fafc}.commission-table tbody tr:last-child{border-bottom:none}.commission-table td{color:#2d3748;padding:16px 12px;vertical-align:middle}.commission-table td:first-child{color:#4299e1;font-family:Courier New,monospace;font-size:13px;font-weight:600}.commission-table td:nth-child(3){color:#38a169;font-size:15px;font-weight:700}.package-badge{font-size:12px;transition:all .2s ease}.package-wallet{background:linear-gradient(135deg,#e3f2fd,#bbdefb);border:1px solid #90caf9;color:#1565c0}.package-momo{background:linear-gradient(135deg,#f3e5f5,#e1bee7);border:1px solid #ce93d8;color:#6a1b9a}.package-badge:hover{box-shadow:0 2px 4px #0000001a;transform:translateY(-1px)}.commission-table .status-badge{border-radius:20px;display:inline-block;font-size:12px;font-weight:600;letter-spacing:.3px;padding:6px 12px;text-transform:capitalize;transition:all .2s ease}.commission-table .status-badge.pending{background:linear-gradient(135deg,#fef5e7,#fdebd0);border:1px solid #f9e79f;color:#d68910}.commission-table .status-badge.approved{background:linear-gradient(135deg,#d4edda,#c3e6cb);border:1px solid #c3e6cb;color:#155724}.commission-table .status-badge.completed{background:linear-gradient(135deg,#d1ecf1,#bee5eb);border:1px solid #bee5eb;color:#0c5460}.commission-table .status-badge.rejected{background:linear-gradient(135deg,#f8d7da,#f5c6cb);border:1px solid #f5c6cb;color:#721c24}.commission-table button{border:none;border-radius:6px;box-shadow:0 1px 3px #0000001a;cursor:pointer;font-size:12px;font-weight:600;letter-spacing:.3px;padding:6px 12px;text-transform:capitalize;transition:all .2s ease}.commission-table button:hover{box-shadow:0 4px 8px #00000026;transform:translateY(-1px)}.commission-table button:active{box-shadow:0 1px 2px #0000001a;transform:translateY(0)}.commission-table button[style*="48bb78"]{background:linear-gradient(135deg,#48bb78,#38a169);color:#fff}.commission-table button[style*="48bb78"]:hover{background:linear-gradient(135deg,#38a169,#2f855a)}.commission-table button[style*=e53e3e]{background:linear-gradient(135deg,#e53e3e,#c53030);color:#fff}.commission-table button[style*=e53e3e]:hover{background:linear-gradient(135deg,#c53030,#9b2c2c)}.commission-table button[style*="4299e1"]{background:linear-gradient(135deg,#4299e1,#3182ce);color:#fff}.commission-table button[style*="4299e1"]:hover{background:linear-gradient(135deg,#3182ce,#2c5282)}.commission-table td:last-child>div{display:flex;flex-wrap:wrap;gap:6px}.commission-table td span[title]{cursor:help;position:relative}.commission-table td span[title]:hover{color:#4299e1;text-decoration:underline}.commission-table td:nth-child(6),.commission-table td:nth-child(7){color:#718096;font-size:12px;white-space:nowrap}.commission-table td:nth-child(2){color:#4a5568;font-weight:500}@media (max-width:1200px){.commission-table{font-size:13px}.commission-table td,.commission-table th{padding:12px 8px}.commission-table .status-badge,.package-badge{font-size:11px;padding:4px 8px}}@media (max-width:992px){.commission-header{align-items:flex-start;flex-direction:column}.commission-controls{justify-content:space-between;width:100%}.commission-table-container{overflow-x:auto}.commission-table{min-width:1000px}}@media (max-width:768px){.commission-header h3{font-size:18px}.commission-controls{flex-direction:column;width:100%}.filter-group,.search-group{width:100%}.commission-table{font-size:12px;min-width:900px}.commission-table td,.commission-table th{padding:10px 6px}.commission-table button{font-size:11px;padding:4px 8px}.package-badge{font-size:10px;padding:3px 6px}.no-commissions{padding:40px 20px}.no-commissions svg{height:40px;width:40px}}.commission-table tbody tr{animation:fadeIn .3s ease-in}.commission-table tbody tr:hover{background:linear-gradient(90deg,#f7fafc 0,#edf2f7);box-shadow:0 2px 4px #0000000d}.commission-table tbody tr:nth-child(2n){background-color:#fafbfc}.commission-table tbody tr:nth-child(2n):hover{background:linear-gradient(90deg,#f7fafc 0,#edf2f7)}.commission-table-container::-webkit-scrollbar{height:8px}.commission-table-container::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.commission-table-container::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:10px}.commission-table-container::-webkit-scrollbar-thumb:hover{background:#a0aec0}@keyframes successPulse{0%,to{box-shadow:0 0 0 0 #48bb78b3}50%{box-shadow:0 0 0 10px #48bb7800}}.commission-table button:active[style*="48bb78"]{animation:successPulse .6s ease-out}.transactions-table{background-color:#fff;border-collapse:collapse;border-radius:12px;box-shadow:0 2px 8px #0000000d;font-family:Inter,system-ui,sans-serif;font-size:14px;margin-top:1.5rem;overflow:hidden;width:100%}.transactions-table thead{background-color:#f8fafc}.transactions-table th{border-bottom:2px solid #e2e8f0;color:#334155;font-weight:600;padding:12px 16px;text-align:left}.transactions-table td{border-bottom:1px solid #f1f5f9;color:#475569;padding:12px 16px;vertical-align:middle}.transactions-table tbody tr:nth-child(2n){background-color:#f9fafb}.transactions-table tbody tr:hover{background-color:#f1f5f9;transition:background-color .2s ease}.type-badge{border-radius:20px;font-weight:600;padding:4px 10px;text-transform:capitalize}.type-badge.credit{background-color:#dcfce7;color:#166534}.type-badge.debit{background-color:#fee2e2;color:#991b1b}.source-badge{background-color:#e0f2fe;border-radius:12px;color:#0369a1;padding:4px 8px}.status-badge{border-radius:20px;padding:5px 10px}.status-badge.completed{background-color:#dcfce7;color:#166534}.status-badge.pending{background-color:#fef9c3;color:#92400e}.status-badge.failed{background-color:#fee2e2;color:#991b1b}@media (max-width:768px){.transactions-table td,.transactions-table th{font-size:13px;padding:10px 12px}.transactions-table{font-size:13px}}.profile-page{background:linear-gradient(135deg,#f5f7fa,#c3cfe2);min-height:100vh;padding:20px}.profile-header{align-items:center;display:flex;gap:16px;margin-bottom:30px;padding:0 10px}.profile-content{margin:0 auto;max-width:800px}.status-message{align-items:center;animation:slideIn .3s ease;border-radius:12px;display:flex;font-weight:500;gap:10px;margin-bottom:25px;padding:15px 20px}.status-message.success{background:#f0fff4;border:1px solid #9ae6b4;color:#38a169}.status-message.error{background:#fed7d7;border:1px solid #feb2b2;color:#e53e3e}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.profile-card{background:#fff;border-radius:20px;box-shadow:0 4px 30px #0000001a;margin-bottom:30px;padding:40px}.avatar-section{align-items:center;display:flex;gap:30px;margin-bottom:30px}.avatar-wrapper{position:relative}.avatar{box-shadow:0 4px 20px #667eea4d;font-size:24px;font-weight:700;height:100px;width:100px}.avatar,.avatar-edit-btn{align-items:center;background:#667eea;border-radius:50%;color:#fff;display:flex;justify-content:center}.avatar-edit-btn{border:2px solid #fff;bottom:5px;cursor:pointer;height:32px;position:absolute;right:5px;transition:all .3s ease;width:32px}.avatar-edit-btn:hover{background:#5a67d8;transform:scale(1.1)}.user-info{flex:1 1}.user-name{color:#2d3748;font-size:24px;font-weight:700;margin:0 0 8px}.user-email{color:#718096;font-size:16px;margin:0 0 20px}.user-stats{display:flex;gap:30px}.stat-item{align-items:center;color:#4a5568;display:flex;font-weight:500;gap:8px}.action-buttons{display:flex;gap:15px}.btn{align-items:center;border:none;border-radius:10px;cursor:pointer;display:flex;font-size:14px;font-weight:600;gap:8px;padding:12px 24px;transition:all .3s ease}.btn-primary{background:#667eea;color:#fff}.btn-primary:hover{box-shadow:0 6px 20px #667eea66;transform:translateY(-2px)}.btn-secondary{background:#f7fafc;border:1px solid #e2e8f0;color:#4a5568}.btn-secondary:hover{background:#edf2f7;box-shadow:0 4px 15px #0000001a;transform:translateY(-2px)}.form-section{background:#fff;border-radius:20px;box-shadow:0 4px 30px #0000001a;margin-bottom:30px;padding:30px}.section-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:30px}.section-header h3{color:#2d3748;font-size:20px;font-weight:700;margin:0}.cancel-btn{align-items:center;background:#fed7d7;border:none;border-radius:10px;color:#e53e3e;cursor:pointer;display:flex;height:40px;justify-content:center;transition:all .3s ease;width:40px}.cancel-btn:hover{background:#feb2b2;transform:scale(1.1)}.password-form,.profile-form{display:flex;flex-direction:column;gap:20px}.form-row{grid-gap:20px;display:grid;gap:20px;grid-template-columns:1fr 1fr}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{color:#2d3748;font-size:14px;font-weight:600}.input-wrapper{position:relative}.input-icon{left:12px}.input-icon,.password-toggle{color:#a0aec0;position:absolute;top:50%;transform:translateY(-50%)}.password-toggle{background:none;border:none;border-radius:4px;cursor:pointer;padding:4px;right:12px;transition:all .3s ease}.password-toggle:hover{background:#f7fafc;color:#667eea}.input-wrapper input{padding-left:45px;padding-right:45px}input{border:2px solid #e2e8f0;border-radius:10px;font-family:inherit;font-size:14px;padding:12px 15px;transition:border-color .3s ease;width:100%}input:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a;outline:none}.password-requirements{margin-bottom:10px;margin-top:-10px}.password-requirements p{color:#718096;font-size:13px;margin:0}.form-actions{display:flex;gap:15px;justify-content:flex-end;margin-top:20px}.btn-cancel{background:#f7fafc;border:1px solid #e2e8f0;color:#4a5568}.btn-cancel:hover{background:#edf2f7}.btn-save{background:linear-gradient(135deg,#38a169,#48bb78);color:#fff}.btn-save:hover:not(:disabled){box-shadow:0 6px 20px #38a16966;transform:translateY(-2px)}.btn-save:disabled{cursor:not-allowed;opacity:.7}.details-section{background:#fff;border-radius:20px;box-shadow:0 4px 30px #0000001a;padding:30px}.details-section h3{color:#2d3748;font-size:20px;font-weight:700;margin:0 0 25px}.details-grid{grid-gap:20px;display:grid;gap:20px}.detail-item{align-items:center;background:#f7fafc;border-radius:12px;display:flex;gap:15px;padding:20px;transition:all .3s ease}.detail-item:hover{background:#edf2f7;transform:translateX(5px)}.detail-icon{align-items:center;background:#667eea;border-radius:10px;color:#fff;display:flex;flex-shrink:0;height:40px;justify-content:center;width:40px}.detail-content{display:flex;flex:1 1;flex-direction:column;gap:4px}.detail-label{color:#718096;font-size:13px;font-weight:500}.detail-value{color:#2d3748;font-size:15px;font-weight:600}.loading-spinner{animation:spin 1s linear infinite;border:2px solid #ffffff40;border-radius:50%;border-top-color:#fff;height:20px;width:20px}.loading-spinner.small{height:16px;width:16px}@media (max-width:768px){.profile-page{padding:15px}.page-title{font-size:24px}.profile-card{padding:25px}.avatar-section{flex-direction:column;gap:20px;text-align:center}.user-stats{gap:20px}.action-buttons,.user-stats{justify-content:center}.form-section{padding:20px}.form-row{gap:15px;grid-template-columns:1fr}.form-actions{justify-content:center}.details-section{padding:20px}}.commission-page{animation:fadeIn .3s ease-in;margin:0 auto;max-width:1200px;padding:20px}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.commission-header{margin-bottom:30px}.page-title{align-items:center;color:#1a1a1a;display:flex;gap:12px;margin-bottom:8px}.page-subtitle{color:#666;font-size:14px;margin-left:40px}.commission-summary{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-bottom:40px}.summary-card{align-items:center;background:#fff;border-radius:16px;box-shadow:0 2px 8px #00000014;display:flex;gap:16px;overflow:hidden;padding:24px;position:relative;transition:transform .2s ease,box-shadow .2s ease}.summary-card:hover{box-shadow:0 4px 12px #0000001f;transform:translateY(-2px)}.summary-card:before{content:"";height:4px;left:0;position:absolute;right:0;top:0}.summary-card.pending:before{background:linear-gradient(90deg,#10b981,#059669)}.summary-card.earned:before{background:linear-gradient(90deg,#3b82f6,#2563eb)}.summary-card.history:before{background:linear-gradient(90deg,#8b5cf6,#7c3aed)}.card-icon{align-items:center;border-radius:12px;display:flex;flex-shrink:0;height:56px;justify-content:center;width:56px}.summary-card.pending .card-icon{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.summary-card.earned .card-icon{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff}.summary-card.history .card-icon{background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff}.card-content{display:flex;flex:1 1;flex-direction:column;gap:4px}.card-label{color:#666;font-size:13px;font-weight:500}.card-amount{color:#1a1a1a;font-size:24px;font-weight:700}.redeem-button{align-items:center;background:linear-gradient(135deg,#10b981,#059669);border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:14px;font-weight:600;gap:6px;padding:10px 20px;transition:all .2s ease}.redeem-button:hover:not(:disabled){background:linear-gradient(135deg,#059669,#047857);transform:translateY(-1px)}.redeem-button:disabled{cursor:not-allowed;opacity:.5}.info-section{margin-bottom:40px}.section-title{align-items:center;color:#1a1a1a;display:flex;font-size:20px;font-weight:700;gap:10px;margin-bottom:20px}.info-cards{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.info-card{background:#fff;border-radius:12px;box-shadow:0 2px 8px #00000014;padding:24px;text-align:center}.info-number{align-items:center;background:linear-gradient(135deg,#10b981,#059669);border-radius:50%;color:#fff;display:flex;font-size:18px;font-weight:700;height:40px;justify-content:center;margin:0 auto 16px;width:40px}.info-card h3{color:#1a1a1a;font-size:16px;font-weight:600;margin-bottom:8px}.info-card p{color:#666;font-size:14px;line-height:1.5}.history-section{margin-bottom:40px}.history-table{background:#fff;border-radius:12px;box-shadow:0 2px 8px #00000014;overflow:hidden}.history-table table{border-collapse:collapse;width:100%}.history-table thead{background:#f8f9fa}.history-table th{color:#666;font-size:13px;font-weight:600;letter-spacing:.5px;padding:16px;text-align:left;text-transform:uppercase}.history-table td{border-top:1px solid #f0f0f0;color:#1a1a1a;font-size:14px;padding:16px}.date-cell{align-items:center;color:#666;display:flex;gap:8px}.request-id{color:#666;font-family:monospace;font-size:13px}.amount-cell{color:#10b981;font-weight:600}.status-badge{border-radius:12px;display:inline-block;font-size:12px;font-weight:600;padding:4px 12px;text-transform:capitalize}.status-pending{background:#fef3c7;color:#92400e}.status-approved{background:#d1fae5;color:#065f46}.status-completed{background:#dbeafe;color:#1e40af}.status-rejected{background:#fee2e2;color:#991b1b}.empty-state{color:#999;padding:60px 20px;text-align:center}.empty-state svg{color:#ddd;margin-bottom:16px}.empty-state p{color:#666;font-size:16px;font-weight:600;margin-bottom:8px}.empty-state span{color:#999;font-size:14px}.confirmation-overlay{align-items:center;animation:fadeIn .2s ease;background:#00000080;display:flex;inset:0;justify-content:center;padding:20px;position:fixed;z-index:1000}.confirmation-modal{animation:slideUp .3s ease;background:#fff;border-radius:16px;box-shadow:0 20px 40px #0003;max-width:450px;width:100%}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal-header{align-items:center;border-bottom:1px solid #f0f0f0;display:flex;gap:12px;padding:24px 24px 16px}.modal-header svg{color:#10b981}.modal-header h3{color:#1a1a1a;font-size:20px;font-weight:700}.modal-content{padding:24px}.modal-content p{color:#666;font-size:14px;margin-bottom:16px}.redemption-amount{background:#f0fdf4;border-radius:12px;color:#10b981;font-size:32px;font-weight:700;margin-bottom:16px;padding:20px;text-align:center}.redemption-note{background:#fef3c7;border-left:3px solid #f59e0b;border-radius:8px;display:flex;gap:12px;padding:16px}.redemption-note svg{color:#d97706;flex-shrink:0}.redemption-note span{color:#92400e;font-size:13px;line-height:1.5}.modal-actions{display:flex;gap:12px;padding:16px 24px 24px}.cancel-button,.confirm-button{align-items:center;border-radius:8px;cursor:pointer;display:flex;flex:1 1;font-size:14px;font-weight:600;gap:8px;justify-content:center;padding:12px 24px;transition:all .2s ease}.cancel-button{background:#fff;border:2px solid #e5e7eb;color:#666}.cancel-button:hover:not(:disabled){background:#f9fafb;border-color:#d1d5db}.confirm-button{background:linear-gradient(135deg,#10b981,#059669);border:none;color:#fff}.confirm-button:hover:not(:disabled){background:linear-gradient(135deg,#059669,#047857);transform:translateY(-1px)}.cancel-button:disabled,.confirm-button:disabled{cursor:not-allowed;opacity:.5}.loading-container{align-items:center;display:flex;flex-direction:column;gap:16px;justify-content:center;min-height:400px}.spinner{animation:spin 1s linear infinite;color:#10b981}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@media (max-width:768px){.commission-page{padding:16px}.page-title{font-size:24px}.commission-summary{grid-template-columns:1fr}.summary-card{flex-direction:row}.history-table{overflow-x:auto}.history-table table{min-width:600px}.info-cards{grid-template-columns:1fr}}.back-button{border:2px solid #e5e7eb;border-radius:8px;color:#666;display:inline-flex;font-weight:600;gap:8px;margin-bottom:16px;padding:8px 16px;transition:all .2s ease}.back-button:hover{background:#f9fafb;border-color:#d1d5db;transform:translateX(-2px)}.package-badge{align-items:center;border-radius:6px;display:inline-flex;font-size:13px;font-weight:600;gap:6px;padding:6px 12px;white-space:nowrap}.package-wallet{background:#e3f2fd;border:1px solid #bbdefb;color:#1976d2}.package-momo{background:#f3e5f5;border:1px solid #e1bee7;color:#7b1fa2}.dark-mode .package-wallet{background:#1976d226;border-color:#1976d24d;color:#90caf9}.dark-mode .package-momo{background:#7b1fa226;border-color:#7b1fa24d;color:#ce93d8}.package-selection{margin:20px 0;width:100%}.package-label{color:var(--text-primary);display:block;font-size:14px;font-weight:600;margin-bottom:12px}.package-options{display:flex;gap:12px;width:100%}.package-option{align-items:center;background:#f8f9fa;border:2px solid #e0e0e0;border-radius:12px;cursor:pointer;display:flex;flex:1 1;flex-direction:column;gap:8px;justify-content:center;min-height:100px;padding:16px;position:relative;transition:all .3s ease}.package-option:hover{background:#f0f7f0;border-color:#4caf50;box-shadow:0 4px 8px #0000001a;transform:translateY(-2px)}.package-option.selected{background:#e8f5e9;border-color:#4caf50;box-shadow:0 0 0 3px #4caf501a}.package-option svg{color:#666}.package-option.selected svg{color:#4caf50}.package-option span{font-size:14px;font-weight:600}.package-option .check-icon{background:#fff;border-radius:50%;color:#4caf50;padding:2px;position:absolute;right:8px;top:8px}.dark-mode .package-option{background:#2a2a2a;border-color:#444}.dark-mode .package-option:hover{background:#333}.dark-mode .package-option.selected{background:#4caf5026;border-color:#4caf50}.dark-mode .package-label{color:#e0e0e0}@media (max-width:768px){.history-table table{font-size:12px}.package-badge{font-size:11px;padding:4px 8px}}@media (max-width:480px){.package-options{flex-direction:column}.package-option{width:100%}}*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:TASA Explorer,sans-serif}.App{text-align:left}:root{--cc-bg-gradient-start:#f5f7fa;--cc-bg-gradient-end:#c3cfe2;--cc-bg-primary:#fff;--cc-bg-secondary:#f7fafc;--cc-bg-tertiary:#edf2f7;--cc-text-primary:#2d3748;--cc-text-secondary:#718096;--cc-text-accent:#667eea;--cc-border-green:#38a169;--cc-border-purple:#805ad5;--cc-card-green-start:#f0fff4;--cc-card-green-end:#c6f6d5;--cc-card-purple-start:#faf5ff;--cc-card-purple-end:#e9d8fd;--cc-icon-green-start:#38a169;--cc-icon-green-end:#48bb78;--cc-icon-purple-start:#805ad5;--cc-icon-purple-end:#9f7aea;--cc-shadow-light:#0000001a;--cc-shadow-medium:#00000026;--cc-shadow-hover:#667eea26;--cc-shadow-icon-green:#38a16966;--cc-shadow-icon-purple:#805ad566;--cc-shadow-card:#00000014;--cc-shadow-hours:#0000000d;--cc-hover-overlay:#00000008}.dark-mode{--cc-bg-gradient-start:#1a1a1a;--cc-bg-gradient-end:#2d2d2d;--cc-bg-primary:#2d2d2d;--cc-bg-secondary:#1a1a1a;--cc-bg-tertiary:#252525;--cc-text-primary:#e5e7eb;--cc-text-secondary:#9ca3af;--cc-text-accent:#818cf8;--cc-border-green:#4ade80;--cc-border-purple:#a78bfa;--cc-card-green-start:#1a4d2e;--cc-card-green-end:#2d5f3f;--cc-card-purple-start:#2d1a4d;--cc-card-purple-end:#3f2d5f;--cc-icon-green-start:#22c55e;--cc-icon-green-end:#4ade80;--cc-icon-purple-start:#a78bfa;--cc-icon-purple-end:#c4b5fd;--cc-shadow-light:#0000004d;--cc-shadow-medium:#0006;--cc-shadow-hover:#818cf833;--cc-shadow-icon-green:#4ade804d;--cc-shadow-icon-purple:#a78bfa4d;--cc-shadow-card:#0003;--cc-shadow-hours:#00000026;--cc-hover-overlay:#ffffff0d}.customer-care-page{background:linear-gradient(135deg,#f5f7fa,#c3cfe2);background:linear-gradient(135deg,var(--cc-bg-gradient-start) 0,var(--cc-bg-gradient-end) 100%);min-height:100vh;padding:20px;transition:background .3s ease}.customer-care-header{align-items:center;display:flex;gap:16px;margin-bottom:30px;padding:0 10px}.back-button{align-items:center;background:#fff;background:var(--cc-bg-primary);border:none;border-radius:10px;box-shadow:0 2px 10px #0000001a;box-shadow:0 2px 10px var(--cc-shadow-light);color:#2d3748;color:var(--cc-text-primary);cursor:pointer;display:flex;height:40px;justify-content:center;transition:all .3s ease;width:40px}.back-button:hover{box-shadow:0 4px 15px #00000026;box-shadow:0 4px 15px var(--cc-shadow-medium);transform:translateY(-2px)}.page-title{color:#2d3748;color:var(--cc-text-primary);font-size:28px;font-weight:700;margin:0;transition:color .3s ease}.customer-care-content{background:#fff;background:var(--cc-bg-primary);border-radius:20px;box-shadow:0 4px 30px #0000001a;box-shadow:0 4px 30px var(--cc-shadow-light);min-height:500px;padding:40px;transition:all .3s ease}.section-header{margin-bottom:50px;text-align:center}.section-header h2{color:#2d3748;color:var(--cc-text-primary);font-size:32px;font-weight:700;margin:0 0 15px;transition:color .3s ease}.section-header p{color:#718096;color:var(--cc-text-secondary);font-size:18px;margin:0;transition:color .3s ease}.contact-methods{grid-gap:30px;display:grid;gap:30px;margin-bottom:50px;margin-left:auto;margin-right:auto;max-width:800px}.contact-card{align-items:flex-start;border:2px solid;border-radius:20px;cursor:pointer;display:flex;gap:25px;overflow:hidden;padding:35px;position:relative;transition:all .3s ease}.contact-card:before{bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease}.contact-card.green{background:linear-gradient(135deg,#f0fff4,#c6f6d5);background:linear-gradient(135deg,var(--cc-card-green-start) 0,var(--cc-card-green-end) 100%);border-color:#38a169;border-color:var(--cc-border-green)}.contact-card.green:before{background:linear-gradient(135deg,#38a169,#48bb78);background:linear-gradient(135deg,var(--cc-icon-green-start) 0,var(--cc-icon-green-end) 100%)}.contact-card.purple{background:linear-gradient(135deg,#faf5ff,#e9d8fd);background:linear-gradient(135deg,var(--cc-card-purple-start) 0,var(--cc-card-purple-end) 100%);border-color:#805ad5;border-color:var(--cc-border-purple)}.contact-card.purple:before{background:linear-gradient(135deg,#805ad5,#9f7aea);background:linear-gradient(135deg,var(--cc-icon-purple-start) 0,var(--cc-icon-purple-end) 100%)}.contact-card:hover{box-shadow:0 12px 35px #00000026;box-shadow:0 12px 35px var(--cc-shadow-medium);transform:translateY(-8px)}.contact-card:hover:before{opacity:.03}.dark-mode .contact-card:hover:before{opacity:.1}.contact-card:hover .contact-info h3,.contact-card:hover .contact-value{color:#2d3748;color:var(--cc-text-primary)}.contact-icon{align-items:center;border-radius:15px;color:#fff;display:flex;font-weight:700;height:60px;justify-content:center;position:relative;transition:all .3s ease;width:60px;z-index:1}.contact-card.green .contact-icon{background:linear-gradient(135deg,#38a169,#48bb78);background:linear-gradient(135deg,var(--cc-icon-green-start) 0,var(--cc-icon-green-end) 100%);box-shadow:0 4px 15px #38a16966;box-shadow:0 4px 15px var(--cc-shadow-icon-green)}.contact-card.purple .contact-icon{background:linear-gradient(135deg,#805ad5,#9f7aea);background:linear-gradient(135deg,var(--cc-icon-purple-start) 0,var(--cc-icon-purple-end) 100%);box-shadow:0 4px 15px #805ad566;box-shadow:0 4px 15px var(--cc-shadow-icon-purple)}.contact-info{flex:1 1;position:relative;z-index:1}.contact-info h3{color:#2d3748;color:var(--cc-text-primary);font-size:22px;font-weight:700;margin:0 0 10px;transition:color .3s ease}.contact-description{color:#718096;color:var(--cc-text-secondary);font-size:16px;line-height:1.5;margin:0 0 20px;transition:color .3s ease}.contact-value{color:#2d3748;color:var(--cc-text-primary);display:block;font-size:18px;font-weight:700;margin-bottom:12px;transition:color .3s ease}.contact-hours{align-items:center;color:#718096;color:var(--cc-text-secondary);display:flex;font-size:14px;font-weight:500;gap:8px;transition:color .3s ease}.hours-section{background:linear-gradient(135deg,#f7fafc,#edf2f7);background:linear-gradient(135deg,var(--cc-bg-secondary) 0,var(--cc-bg-tertiary) 100%);border-radius:20px;box-shadow:0 4px 20px #0000000d;box-shadow:0 4px 20px var(--cc-shadow-hours);margin:0 auto;max-width:700px;padding:40px;transition:all .3s ease}.hours-section h3{color:#2d3748;color:var(--cc-text-primary);font-size:24px;font-weight:700;margin-bottom:35px;text-align:center;transition:color .3s ease}.hours-grid{grid-gap:20px;display:grid;gap:20px}.hours-item{align-items:center;background:#fff;background:var(--cc-bg-primary);border-left:4px solid #0000;border-radius:15px;box-shadow:0 2px 15px #00000014;box-shadow:0 2px 15px var(--cc-shadow-card);display:flex;justify-content:space-between;padding:20px 30px;transition:all .3s ease}.hours-item:hover{box-shadow:0 4px 25px #667eea26;box-shadow:0 4px 25px var(--cc-shadow-hover);transform:translateX(5px)}.day{color:#2d3748;color:var(--cc-text-primary);font-weight:600}.day,.time{font-size:16px;transition:color .3s ease}.time{color:#667eea;color:var(--cc-text-accent);font-weight:700}@media (max-width:768px){.customer-care-page{padding:15px}.page-title{font-size:24px}.customer-care-content{padding:25px}.section-header h2{font-size:26px}.section-header p{font-size:16px}.contact-card{flex-direction:column;gap:20px;padding:25px;text-align:center}.contact-icon{margin:0 auto}.hours-section{padding:25px}.hours-item{flex-direction:column;gap:8px;padding:15px 20px;text-align:center}.hours-item:hover{transform:translateY(-3px)}}@media (max-width:480px){.customer-care-content{padding:20px}.section-header{margin-bottom:30px}.section-header h2{font-size:22px}.contact-methods{gap:20px;margin-bottom:30px}.contact-card{padding:20px}.contact-info h3{font-size:18px}.hours-section{padding:20px}.hours-section h3{font-size:20px;margin-bottom:25px}}
/*# sourceMappingURL=main.098213fd.css.map*/