.card-item{background:#fff;border-radius:12px;padding:20px;border:2px solid #e0e0e0;transition:all .3s ease;box-shadow:0 2px 8px #0000001a}.card-item:hover{box-shadow:0 4px 12px #00000026;transform:translateY(-2px)}.card-item.inactive{opacity:.7;border-color:#ccc}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.card-type{font-weight:600;color:#333;font-size:1rem}.status-badge{padding:4px 12px;border-radius:12px;font-size:.75rem;font-weight:600;text-transform:uppercase}.card-number{font-size:1.5rem;font-weight:600;color:#333;margin-bottom:15px;letter-spacing:2px;font-family:Courier New,monospace}.card-details{display:flex;flex-direction:column;gap:8px;margin-bottom:20px;padding-top:15px;border-top:1px solid #e0e0e0}.card-expiry,.card-holder{display:flex;gap:10px;font-size:.9rem}.label{color:#666;font-weight:500}.value{color:#333}.error-message{background:#ffebee;color:#c62828;padding:10px;border-radius:6px;margin-bottom:15px;font-size:.9rem}.card-actions{display:flex;gap:10px;margin-top:15px}.card-actions .btn{flex:1;padding:10px;border:none;border-radius:6px;font-weight:600;cursor:pointer;transition:all .2s ease;font-size:.9rem}.card-actions .btn:disabled{opacity:.6;cursor:not-allowed}.btn-info{background:#2196f3;color:#fff}.btn-info:hover:not(:disabled){background:#1976d2}.card-warning{background:#fff3cd;border:1px solid #ffc107;padding:8px 12px;border-radius:6px;margin-bottom:15px;font-size:.85rem;color:#856404}.card-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px}.empty-state{text-align:center;padding:60px 20px;color:#666}.empty-icon{font-size:4rem;margin-bottom:20px}.empty-state h3{font-size:1.5rem;margin-bottom:10px;color:#333}.empty-state p{font-size:1rem;color:#888}@media (max-width: 768px){.card-list{grid-template-columns:1fr}}.add-card-form-container{margin-bottom:30px;padding:25px;background:#fff;border-radius:12px;border:2px solid #667eea}.add-card-form h3{margin-bottom:10px;color:#333;font-size:1.5rem}.form-group input{width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:border-color .3s ease}.form-group select{width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;background:#fff}.form-group input:focus{outline:none;border-color:#667eea}.form-group small{display:block;margin-top:5px;color:#888;font-size:.85rem}.add-recurring-form-container{margin-bottom:20px;padding:25px;background:#fff;border-radius:12px;border:2px solid #4caf50}.add-recurring-form h3{margin-bottom:10px;color:#333;font-size:1.5rem}.form-description{color:#666;margin-bottom:25px;line-height:1.6;font-size:.95rem}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;color:#333;font-weight:600;font-size:.95rem}.form-group input,.form-group select{width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:border-color .3s ease;background:#fff}.form-group input:focus,.form-group select:focus{outline:none;border-color:#4caf50}.error-message{background:#ffebee;color:#c62828;padding:12px;border-radius:8px;margin-bottom:20px;font-size:.9rem}.form-actions{display:flex;gap:15px;margin-top:25px}.form-actions .btn{flex:1;padding:12px 24px;border:none;border-radius:8px;font-weight:600;font-size:1rem;cursor:pointer;transition:all .2s ease}.form-actions .btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,#4caf50,#45a049);color:#fff}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #4caf5066}.recurring-payment-item{background:#fff;border-radius:12px;padding:20px;border:2px solid #e0e0e0;transition:all .3s ease;box-shadow:0 2px 8px #0000001a}.recurring-payment-item:hover{box-shadow:0 4px 12px #00000026;transform:translateY(-2px)}.recurring-payment-item.overdue{border-color:#f44336;background:#fff5f5}.payment-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:15px}.payment-info{flex:1}.payment-info h4{font-size:1.2rem;color:#333;margin-bottom:5px}.amount{font-size:1.5rem;font-weight:700;color:#667eea}.status-badge{padding:6px 14px;border-radius:12px;font-size:.8rem;font-weight:600;text-transform:uppercase}.status-badge.active{background:#4caf50;color:#fff}.status-badge.inactive{background:#ff9800;color:#fff}.payment-details{margin:20px 0;padding:15px;background:#f9f9f9;border-radius:8px}.detail-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #e0e0e0}.detail-row:last-child{border-bottom:none}.detail-row .label{color:#666;font-weight:500}.detail-row .value{color:#333;font-weight:600}.overdue-text{color:#f44336!important}.capitalize{text-transform:capitalize}.payment-actions{margin-top:15px}.payment-actions .btn{width:100%;padding:10px;border:none;border-radius:6px;font-weight:600;cursor:pointer;transition:all .2s ease;font-size:.9rem}.btn-danger:hover{background:#d32f2f}.recurring-payments{display:flex;flex-direction:column;gap:12px}.recurring-banner{border-radius:18px;padding:16px 14px;background:linear-gradient(135deg,#4f46e5,#6366f1);color:#f9fafb;display:flex;flex-direction:column;gap:10px}.recurring-banner-top{display:flex;align-items:center;gap:10px}.recurring-banner-icon{width:40px;height:40px;border-radius:14px;background:#ffffff29;display:flex;align-items:center;justify-content:center;font-size:20px}.recurring-banner-title{font-size:16px;font-weight:600}.recurring-banner-subtitle{font-size:12px;opacity:.9}.recurring-banner button{align-self:flex-start;margin-top:4px;border-radius:999px;padding:8px 18px;font-size:13px;background:#f9fafb;color:#111827;border:none}.empty-recurring{text-align:center;padding:24px 12px;color:#6b7280;font-size:13px}.empty-recurring .empty-icon{font-size:26px;margin-bottom:8px}.empty-recurring h3{font-size:14px;margin-bottom:4px;color:#111827}.empty-recurring p{font-size:12px;color:#9ca3af}.recurring-list{display:flex;flex-direction:column;gap:10px}.profile-container{max-width:430px;margin:0 auto;min-height:100vh;background:#f4f6fb;padding:16px 16px 80px;box-sizing:border-box;font-family:system-ui,-apple-system,BlinkMacSystemFont,SF Pro Text,sans-serif}.profile-header{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.profile-header-title-row{display:flex;align-items:center;gap:12px}.back-button{width:32px;height:32px;border-radius:999px;border:none;background:#0000000a;display:flex;align-items:center;justify-content:center;cursor:pointer}.back-button-icon{border:solid #111827;border-width:0 2px 2px 0;display:inline-block;padding:3px;transform:rotate(135deg)}.profile-header h1{font-size:28px;font-weight:700;color:#111827}.subtitle{color:#6b7280;font-size:13px}.profile-content{display:flex;flex-direction:column;gap:16px}.section{border-radius:18px;background:#fff;box-shadow:0 16px 40px #0f172a1f;padding:18px 16px}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.section-header h2{font-size:17px;font-weight:600;color:#111827}.section-caption{font-size:12px;color:#9ca3af;margin-top:2px}.payment-summary{display:flex;flex-direction:column;gap:8px}.due-amount{font-size:26px;font-weight:700;color:#111827}.payment-actions-row{display:grid;grid-template-columns:1fr;gap:8px;margin-top:6px}.loading{text-align:center;padding:60px 16px;font-size:15px;color:#6b7280}.bottom-nav-placeholder{position:fixed;left:0;right:0;bottom:0;height:64px;background:#fff;border-top:1px solid rgba(15,23,42,.06)}@media (min-width: 768px){.profile-container{margin-top:24px;margin-bottom:24px;border-radius:24px}}.callback-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;color:#fff;text-align:center}.callback-container h2{margin-bottom:20px;font-size:2rem}.callback-container p{font-size:1.2rem;opacity:.9;margin-bottom:20px}.spinner{border:4px solid rgba(255,255,255,.3);border-top:4px solid white;border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin-top:20px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;padding:20px}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#root{max-width:1200px;margin:0 auto}.btn{padding:12px 24px;border:none;border-radius:8px;font-weight:600;font-size:1rem;cursor:pointer;transition:all .2s ease;text-decoration:none;display:inline-block;text-align:center}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.btn-secondary{background:#f5f5f5;color:#333}.btn-secondary:hover:not(:disabled){background:#e0e0e0}.btn-danger{background:#f44336;color:#fff}.btn-danger:hover:not(:disabled){background:#d32f2f}.btn:disabled{opacity:.6;cursor:not-allowed}