:root{--primary-gradient:linear-gradient(135deg,#3b82f6,#4338ca);--primary-color:#3b82f6;--primary-dark:#4338ca;--success-color:#10b981;--warning-color:#f59e0b;--error-color:#ef4444;--info-color:#3b82f6;--text-primary:#1f2937;--text-secondary:#6b7280;--text-muted:#9ca3af;--border-color:#e5e7eb;--bg-gray:#f9fafb;--bg-white:#fff;--shadow-md:0 4px 6px -1px rgba(0,0,0,.1);--shadow-lg:0 10px 15px -3px rgba(0,0,0,.1);--radius-md:8px;--radius-lg:12px;--radius-xl:16px}.smartpay-dashboard{flex-grow:1;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;padding:40px 20px}.smartpay-dashboard *{box-sizing:border-box}.smartpay-dashboard .dashboard-container{margin:0 auto;max-width:1400px}.smartpay-dashboard .dashboard-layout{align-items:start;display:grid;gap:30px;grid-template-columns:280px 1fr}.smartpay-dashboard .dashboard-sidebar{background:var(--bg-white);border-right:1px solid var(--border-color);display:flex;flex-direction:column;min-height:calc(100vh - 80px);overflow:hidden;padding:0;position:sticky;top:40px}.smartpay-dashboard .sidebar-profile{background:var(--primary-gradient);color:#fff;overflow:hidden;padding:30px 24px;position:relative;text-align:center}.smartpay-dashboard .sidebar-profile:before{right:-30%;top:-50%}.smartpay-dashboard .sidebar-profile:after,.smartpay-dashboard .sidebar-profile:before{background:hsla(0,0%,100%,.1);border-radius:50%;content:"";height:200px;position:absolute;width:200px}.smartpay-dashboard .sidebar-profile:after{bottom:-50%;left:-30%}.smartpay-dashboard .profile-avatar-wrapper{height:80px;margin:0 auto 16px;position:relative;width:80px;z-index:1}.smartpay-dashboard .sidebar-avatar{border:3px solid hsla(0,0%,100%,.3);border-radius:50%;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.smartpay-dashboard .profile-status{background:var(--success-color);border:3px solid #fff;border-radius:50%;bottom:5px;height:16px;position:absolute;right:5px;width:16px}.smartpay-dashboard .profile-name{font-size:1.125rem;font-weight:700;margin:0 0 4px;position:relative;z-index:1}.smartpay-dashboard .sidebar-profile .profile-email{font-size:.875rem;margin:0 0 16px;opacity:.9;position:relative;word-break:break-word;z-index:1}.smartpay-dashboard .sidebar-profile .profile-badge{align-items:center;backdrop-filter:blur(10px);background:hsla(0,0%,100%,.2);border:1px solid hsla(0,0%,100%,.3);border-radius:20px;display:inline-flex;font-size:.813rem;font-weight:600;gap:6px;padding:6px 14px;position:relative;z-index:1}.smartpay-dashboard .sidebar-nav{display:flex;flex:1;flex-direction:column;gap:4px;justify-content:space-between;padding:12px}.smartpay-dashboard .sidebar-block{display:flex;flex-direction:column;gap:4px}.smartpay-dashboard .sidebar-nav .nav-item{align-items:center;border-radius:var(--radius-md);color:var(--text-secondary);display:flex;font-size:.938rem;font-weight:600;gap:12px;padding:12px 14px;position:relative;text-decoration:none;transition:all .2s ease}.smartpay-dashboard .sidebar-nav .nav-item:hover{background:var(--bg-gray);color:var(--text-primary)}.smartpay-dashboard .sidebar-nav .nav-item.active{background:#e5e7eb;color:var(--text-primary)}.smartpay-dashboard .sidebar-nav .nav-item svg{flex-shrink:0}.smartpay-dashboard .sidebar-nav .nav-divider{background:var(--border-color);height:1px;margin:8px 0}.smartpay-dashboard .sidebar-nav .nav-logout{color:var(--error-color)}.smartpay-dashboard .sidebar-nav .nav-logout:hover{background:#fee2e2;color:var(--error-color)}.smartpay-dashboard .dashboard-main{min-width:0}.smartpay-dashboard .dashboard-header{margin-bottom:20px;padding:4px 0 20px}.smartpay-dashboard .dashboard-header .header-content{align-items:center;display:flex;gap:20px;justify-content:space-between}.smartpay-dashboard .dashboard-header h1{color:var(--text-primary);font-size:2rem;font-weight:800;line-height:1.2;margin:0 0 8px}.smartpay-dashboard .dashboard-header .subtitle{color:var(--text-secondary);font-size:1rem;margin:0}.smartpay-dashboard .stats-grid{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin-bottom:30px}.smartpay-dashboard .stat-card{align-items:center;background:var(--bg-white);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);display:flex;gap:20px;padding:24px;transition:transform .3s ease,box-shadow .3s ease}.smartpay-dashboard .stat-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px)}.smartpay-dashboard .stat-icon{align-items:center;border-radius:var(--radius-md);display:flex;flex-shrink:0;height:56px;justify-content:center;width:56px}.smartpay-dashboard .stat-icon.purple{background:linear-gradient(135deg,#667eea20,#764ba220);color:var(--primary-color)}.smartpay-dashboard .stat-icon.green{background:linear-gradient(135deg,#10b98120,#05966920);color:var(--success-color)}.smartpay-dashboard .stat-icon.blue{background:linear-gradient(135deg,#3b82f620,#2563eb20);color:var(--info-color)}.smartpay-dashboard .stat-icon.orange{background:linear-gradient(135deg,#f59e0b20,#d9770620);color:var(--warning-color)}.smartpay-dashboard .stat-content{display:flex;flex-direction:column;gap:8px}.smartpay-dashboard .stat-label{color:var(--text-secondary);font-size:.875rem;font-weight:500;letter-spacing:1px;text-transform:uppercase}.smartpay-dashboard .stat-value{color:var(--text-primary);font-size:2rem;font-weight:800;line-height:1}.smartpay-dashboard .stat-value.status-active{color:var(--success-color);font-size:1.25rem}.smartpay-dashboard .dashboard-grid{display:grid;gap:30px;grid-template-columns:1fr 1fr}.smartpay-dashboard .dashboard-section{background:var(--bg-white);border:1px solid var(--border-color);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);display:flex;flex-direction:column;padding:30px}.smartpay-dashboard .section-header{align-items:center;border-bottom:2px solid var(--border-color);display:flex;justify-content:space-between;margin-bottom:24px;padding-bottom:16px}.smartpay-dashboard .section-header h2{align-items:center;color:var(--text-primary);display:flex;font-size:1.25rem;font-weight:700;gap:10px;margin:0}.smartpay-dashboard .section-link{color:var(--primary-color);font-size:.938rem;font-weight:600;text-decoration:none;transition:color .2s ease}.smartpay-dashboard .section-link:hover{color:var(--primary-dark);text-decoration:underline}.smartpay-dashboard .memberships-list{display:flex;flex-direction:column;gap:20px}.smartpay-dashboard .membership-card{background:var(--bg-gray);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:20px;transition:all .3s ease}.smartpay-dashboard .membership-card:hover{border-color:var(--primary-color);box-shadow:var(--shadow-md)}.smartpay-dashboard .membership-header{align-items:flex-start;display:flex;gap:16px;justify-content:space-between;margin-bottom:16px}.smartpay-dashboard .membership-info h3{color:var(--text-primary);font-size:1.125rem;font-weight:700;margin:0 0 8px}.smartpay-dashboard .membership-status{border-radius:12px;display:inline-block;font-size:.813rem;font-weight:600;letter-spacing:.5px;padding:4px 12px;text-transform:uppercase}.smartpay-dashboard .membership-status.status-active{background:#d1fae5;color:#065f46}.smartpay-dashboard .membership-status.status-inactive{background:#fee2e2;color:#991b1b}.smartpay-dashboard .membership-price{color:var(--primary-color);font-size:1.5rem;font-weight:800;text-align:right;white-space:nowrap}.smartpay-dashboard .price-period{color:var(--text-secondary);font-size:1rem;font-weight:500}.smartpay-dashboard .membership-details{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}.smartpay-dashboard .detail-row{align-items:center;color:var(--text-primary);display:flex;font-size:.938rem;gap:10px}.smartpay-dashboard .detail-icon{font-size:1.25rem}.smartpay-dashboard .membership-actions{display:flex;flex-wrap:wrap;gap:10px}.smartpay-dashboard .payments-list{display:flex;flex:1;flex-direction:column;gap:12px;justify-content:center}.smartpay-dashboard .payment-item{align-items:center;background:var(--bg-gray);border:1px solid var(--border-color);border-radius:var(--radius-md);display:flex;gap:16px;padding:16px;transition:all .2s ease}.smartpay-dashboard .payment-item:hover{background:#f3f4f6;border-color:var(--primary-color)}.smartpay-dashboard .payment-icon{align-items:center;border-radius:50%;display:flex;flex-shrink:0;height:40px;justify-content:center;width:40px}.smartpay-dashboard .payment-icon.status-completed{background:#d1fae5;color:var(--success-color)}.smartpay-dashboard .payment-icon.status-pending{background:#fef3c7;color:var(--warning-color)}.smartpay-dashboard .payment-info{flex:1;min-width:0}.smartpay-dashboard .payment-info h4{color:var(--text-primary);font-size:.938rem;font-weight:600;margin:0 0 4px}.smartpay-dashboard .payment-date{color:var(--text-secondary);font-size:.813rem}.smartpay-dashboard .payment-amount{align-items:flex-end;display:flex;flex-direction:column;gap:4px;text-align:right}.smartpay-dashboard .payment-amount .amount{color:var(--text-primary);font-size:1.125rem;font-weight:700}.smartpay-dashboard .payment-status{font-size:.75rem;font-weight:600;letter-spacing:.5px;text-transform:uppercase}.smartpay-dashboard .payment-status.status-completed{color:var(--success-color)}.smartpay-dashboard .payment-status.status-pending{color:var(--warning-color)}.smartpay-dashboard .payment-action .btn-icon{align-items:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;display:flex;height:36px;justify-content:center;transition:all .2s ease;width:36px}.smartpay-dashboard .payment-action .btn-icon:hover{background:var(--bg-gray);color:var(--primary-color)}.smartpay-dashboard .empty-state{padding:60px 20px;text-align:center}.smartpay-dashboard .empty-state.small{padding:40px 20px}.smartpay-dashboard .empty-state svg{margin-bottom:20px}.smartpay-dashboard .empty-state h3{color:var(--text-primary);font-size:1.25rem;font-weight:700;margin:0 0 8px}.smartpay-dashboard .empty-state p{color:var(--text-secondary);font-size:1rem;margin:0 0 24px}.smartpay-dashboard .btn{align-items:center;border:none;border-radius:var(--radius-md);cursor:pointer;display:inline-flex;font-family:inherit;font-size:1rem;font-weight:700;gap:10px;justify-content:center;padding:12px 24px;text-align:center;text-decoration:none;transition:all .3s ease;white-space:nowrap}.smartpay-dashboard .btn-primary{background:var(--primary-gradient);box-shadow:0 4px 12px rgba(102,126,234,.3);color:#fff}.smartpay-dashboard .btn-primary:hover:not(:disabled){box-shadow:0 6px 20px rgba(102,126,234,.4);transform:translateY(-2px)}.smartpay-dashboard .btn-secondary{background:var(--bg-gray);border:2px solid var(--border-color);color:var(--text-primary)}.smartpay-dashboard .btn-secondary:hover:not(:disabled){background:#f3f4f6;border-color:var(--text-secondary)}.smartpay-dashboard .btn-outline{background:transparent;border:2px solid var(--primary-color);color:var(--primary-color)}.smartpay-dashboard .btn-outline:hover:not(:disabled){background:var(--primary-color);color:#fff}.smartpay-dashboard .btn-sm{font-size:.875rem;padding:8px 16px}.smartpay-dashboard .btn:disabled{cursor:not-allowed;opacity:.6;transform:none}.smartpay-dashboard .btn:hover:not(:disabled) .btn-arrow{transform:translateX(4px)}@media (max-width:1024px){.smartpay-dashboard .dashboard-layout{grid-template-columns:240px 1fr}.smartpay-dashboard .dashboard-grid{grid-template-columns:1fr}}@media (max-width:768px){.smartpay-dashboard{padding:20px 10px}.smartpay-dashboard .dashboard-layout{gap:20px;grid-template-columns:1fr}.smartpay-dashboard .dashboard-sidebar{position:static}.smartpay-dashboard .dashboard-header{padding:24px 20px}.smartpay-dashboard .dashboard-header .header-content{align-items:flex-start;flex-direction:column}.smartpay-dashboard .stats-grid{grid-template-columns:1fr}.smartpay-dashboard .dashboard-section{padding:24px 20px}.smartpay-dashboard .membership-header{align-items:flex-start;flex-direction:column}.smartpay-dashboard .membership-price{text-align:left}}@media (max-width:480px){.smartpay-dashboard .dashboard-header h1,.smartpay-dashboard .stat-value{font-size:1.5rem}.smartpay-dashboard .membership-card{padding:16px}}.smartpay-dashboard .sp-dash-stats{display:grid;gap:16px;grid-template-columns:repeat(4,1fr);margin-bottom:28px}.smartpay-dashboard .sp-dash-stat{background:var(--bg-white);border:1px solid var(--border-color);border-radius:var(--radius-lg);display:flex;flex-direction:column;gap:6px;padding:20px}.smartpay-dashboard .sp-dash-stat__label{color:var(--text-muted);font-size:.75rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.smartpay-dashboard .sp-dash-stat__value{color:var(--text-primary);font-size:1.6rem;font-weight:700;line-height:1.1}.smartpay-dashboard .sp-dash-stat__meta{color:var(--text-secondary);font-size:.8rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.smartpay-dashboard .sp-dash-panel{background:var(--bg-white);border:1px solid var(--border-color);border-radius:var(--radius-lg);margin-bottom:24px;overflow:hidden}.smartpay-dashboard .sp-dash-panel__head{align-items:center;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;padding:16px 20px}.smartpay-dashboard .sp-dash-panel__head h2{color:var(--text-primary);font-size:1rem;font-weight:600;margin:0}.smartpay-dashboard .sp-dash-link{color:var(--primary-color);font-size:.85rem;font-weight:600;text-decoration:none}.smartpay-dashboard .sp-dash-link:hover{text-decoration:underline}.smartpay-dashboard .sp-dash-table-wrap{overflow-x:auto;width:100%}.smartpay-dashboard .sp-dash-table{border-collapse:collapse;font-size:.9rem;width:100%}.smartpay-dashboard .sp-dash-table thead th{background:var(--bg-gray);border-bottom:1px solid var(--border-color);color:var(--text-muted);font-size:.72rem;font-weight:600;letter-spacing:.05em;padding:12px 20px;text-align:left;text-transform:uppercase;white-space:nowrap}.smartpay-dashboard .sp-dash-table tbody td{border-bottom:1px solid var(--border-color);color:var(--text-primary);padding:14px 20px;vertical-align:middle}.smartpay-dashboard .sp-dash-table tbody tr:last-child td{border-bottom:none}.smartpay-dashboard .sp-dash-table tbody tr:hover{background:var(--bg-gray)}.smartpay-dashboard .sp-dash-table__actions{text-align:right}.smartpay-dashboard .sp-dash-muted{color:var(--text-muted)}.smartpay-dashboard .sp-dash-badge{background:#f3f4f6;border-radius:999px;color:#374151;display:inline-block;font-size:.75rem;font-weight:600;line-height:1.4;padding:3px 10px;white-space:nowrap}.smartpay-dashboard .sp-dash-badge.is-active,.smartpay-dashboard .sp-dash-badge.is-completed{background:#dcfce7;color:#166534}.smartpay-dashboard .sp-dash-badge.is-processing,.smartpay-dashboard .sp-dash-badge.is-trialling{background:#dbeafe;color:#1e40af}.smartpay-dashboard .sp-dash-badge.is-pending{background:#fef3c7;color:#92400e}.smartpay-dashboard .sp-dash-badge.is-cancelled,.smartpay-dashboard .sp-dash-badge.is-failed,.smartpay-dashboard .sp-dash-badge.is-failing,.smartpay-dashboard .sp-dash-badge.is-revoked{background:#fee2e2;color:#991b1b}.smartpay-dashboard .sp-dash-badge.is-abandoned,.smartpay-dashboard .sp-dash-badge.is-expired,.smartpay-dashboard .sp-dash-badge.is-refunded,.smartpay-dashboard .sp-dash-badge.is-suspended{background:#f3f4f6;color:#4b5563}.smartpay-dashboard .sp-dash-btn{background:var(--bg-white);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--primary-color);display:inline-block;font-size:.82rem;font-weight:600;padding:6px 14px;text-decoration:none;transition:all .15s ease}.smartpay-dashboard .sp-dash-btn:hover{background:var(--bg-gray);border-color:var(--primary-color)}.smartpay-dashboard .sp-dash-btn--sm{font-size:.78rem;padding:4px 12px}.smartpay-dashboard .sp-dash-empty{color:var(--text-secondary);padding:48px 20px;text-align:center}.smartpay-dashboard .sp-dash-empty p{font-size:.95rem;margin:0}@media (max-width:900px){.smartpay-dashboard .sp-dash-stats{grid-template-columns:repeat(2,1fr)}}@media (max-width:600px){.smartpay-dashboard .sp-dash-stats{grid-template-columns:1fr}.smartpay-dashboard .sp-dash-table thead{display:none}.smartpay-dashboard .sp-dash-table,.smartpay-dashboard .sp-dash-table tbody,.smartpay-dashboard .sp-dash-table td,.smartpay-dashboard .sp-dash-table tr{display:block;width:100%}.smartpay-dashboard .sp-dash-table tr{border-bottom:1px solid var(--border-color);padding:8px 0}.smartpay-dashboard .sp-dash-table tbody td{align-items:center;border:none;display:flex;gap:16px;justify-content:space-between;padding:8px 20px}.smartpay-dashboard .sp-dash-table tbody td:before{color:var(--text-muted);content:attr(data-label);font-size:.72rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.smartpay-dashboard .sp-dash-table__actions{text-align:left}}.smartpay-dashboard .sp-dash-kv{padding:8px 20px}.smartpay-dashboard .sp-dash-kv__row{align-items:center;border-bottom:1px solid var(--border-color);display:flex;font-size:.9rem;gap:16px;justify-content:space-between;padding:12px 0}.smartpay-dashboard .sp-dash-kv__row:last-child{border-bottom:none}.smartpay-dashboard .sp-dash-kv__key{color:var(--text-secondary)}.smartpay-dashboard .sp-dash-kv__val{color:var(--text-primary);text-align:right}.smartpay-dashboard .sp-dash-panel__foot{border-top:1px solid var(--border-color);padding:16px 20px}.smartpay-dashboard .sp-dash-cards{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.smartpay-dashboard .sp-dash-card{background:var(--bg-white);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:20px}.smartpay-dashboard .sp-dash-card__head{align-items:center;display:flex;gap:12px;justify-content:space-between;margin-bottom:12px}.smartpay-dashboard .sp-dash-card__title{color:var(--text-primary);font-size:.95rem;font-weight:700}.smartpay-dashboard .sp-dash-card__price{color:var(--text-primary);font-size:1.5rem;font-weight:700;line-height:1.1;margin-bottom:16px}.smartpay-dashboard .sp-dash-card__period{color:var(--text-muted);font-size:.85rem;font-weight:500}.smartpay-dashboard .sp-dash-card__row{align-items:center;border-top:1px solid var(--border-color);display:flex;font-size:.85rem;gap:12px;justify-content:space-between;padding:8px 0}.smartpay-dashboard .sp-dash-card__row span{color:var(--text-secondary)}.smartpay-dashboard .sp-dash-card__row strong{color:var(--text-primary);font-weight:600}