@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap";:root{--bg-color:#060709;--surface-color:#0e1115;--surface-lighter:#181d25;--accent-primary:#bf5af2;--accent-secondary:#1fd5f9;--text-primary:#fafafa;--text-secondary:#abb0ba;--text-muted:#737b8c;--status-active:#1dc964;--status-warning:#eebd2b;--status-danger:#f04242;--glass-bg:#14181f66;--glass-border:#ffffff14;--shadow-sm:0 4px 12px #0006;--shadow-xl:0 20px 40px #0009;--font-main:"Outfit", sans-serif;--radius-md:12px;--radius-lg:20px;--transition:all .3s cubic-bezier(.4, 0, .2, 1);--sidebar-width:260px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg-color:#ebeef4;--surface-color:#f9fafb;--surface-lighter:#dadee7;--text-primary:#1d2330;--text-secondary:#4c5567;--text-muted:#737b8c;--glass-bg:#ffffffd9;--glass-border:#14181f1f;--shadow-sm:0 4px 12px #00000014;--shadow-xl:0 20px 40px #dce6fa80;--accent-primary:#a936e2;--accent-secondary:#11b4d4}*{box-sizing:border-box;-webkit-font-smoothing:antialiased;margin:0;padding:0}body{font-family:var(--font-main);background-color:var(--bg-color);color:var(--text-primary);background-image:radial-gradient(circle at 0 0,#bf5af20d 0%,#0000 40%),radial-gradient(circle at 100% 100%,#1fd5f90d 0%,#0000 40%);min-height:100vh;overflow-x:hidden}button{cursor:pointer;transition:var(--transition);background:0 0;border:none;font-family:inherit}input,select,textarea{font-family:inherit;font-size:1rem}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-color)}::-webkit-scrollbar-thumb{background:var(--surface-lighter);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.glass{background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border)}.gradient-text{background:linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}@keyframes pulse{0%{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.app-container{min-height:100vh;display:flex}.side-nav{width:var(--sidebar-width);border-right:1px solid var(--glass-border);height:100vh;transition:var(--transition);z-index:100;flex-direction:column;padding:2rem 1.5rem;display:flex;position:sticky;top:0}.side-nav.collapsed{margin-left:calc(-1 * var(--sidebar-width));opacity:0;pointer-events:none}.side-nav-header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.sidebar-toggle-inside{color:var(--text-muted)}.sidebar-toggle-inside:hover{color:var(--accent-secondary)}.logo{align-items:center;gap:.75rem;margin-bottom:0;display:flex}.login-logo{object-fit:contain;width:100%;max-width:240px;height:auto}.nav-logo{object-fit:contain;filter:drop-shadow(0 0 10px #ffffff1a);width:100%;height:auto}.nav-items{flex-direction:column;gap:.5rem;display:flex}.nav-item{border-radius:var(--radius-md);color:var(--text-secondary);transition:var(--transition);align-items:center;gap:1rem;padding:.875rem 1rem;text-decoration:none;display:flex}.nav-item:hover{color:var(--text-primary);background:#ffffff0d}.nav-item.active{color:var(--text-primary);box-shadow:inset 0 0 0 1px var(--glass-border);background:#ffffff1a}.active-filter{font-weight:600;color:var(--accent-secondary)!important}.nav-category-label{text-transform:uppercase;color:var(--text-muted);letter-spacing:1.5px;margin:1.5rem 0 .5rem 1rem;font-size:.75rem;font-weight:600}.nav-divider{background:var(--glass-border);height:1px;margin:1rem 0}.nav-btn-primary{margin-top:.5rem;color:var(--accent-secondary)!important;border:1px solid var(--accent-secondary)!important;background:linear-gradient(135deg,#bf5af21a,#1fd5f91a)!important}.nav-btn-primary:hover{background:linear-gradient(135deg,#bf5af233,#1fd5f933)!important}.nav-item.alert-success.active{color:var(--status-active);background:#1dc96426;box-shadow:inset 0 0 0 1px #1dc96433}.nav-item.alert-danger.active{color:var(--status-danger);background:#f0424226;box-shadow:inset 0 0 0 1px #f0424233}.nav-item.alert-warning.active{color:var(--status-warning);background:#eebd2b26;box-shadow:inset 0 0 0 1px #eebd2b33}.nav-dropdown{flex-direction:column;display:flex}.dropdown-trigger{justify-content:flex-start;gap:1rem}.chevron{margin-left:auto;transition:transform .3s}.chevron.open{transform:rotate(180deg)}.dropdown-content{flex-direction:column;gap:.25rem;margin-top:.25rem;padding-left:3rem;animation:.3s slideUp;display:flex}.dropdown-item{border-radius:var(--radius-md);color:var(--text-muted);text-align:left;transition:var(--transition);padding:.5rem .75rem;font-size:.8125rem}.dropdown-item:hover{color:var(--text-primary);background:#ffffff0d}.dropdown-item.selected{color:var(--accent-secondary);font-weight:600}.nav-divider.mini{width:80%;margin:.5rem 0 .5rem .5rem}.dropdown-item-wrapper{justify-content:space-between;align-items:center;padding-right:.5rem;display:flex}.dropdown-item-wrapper .dropdown-item{flex:1}.btn-mini-delete{opacity:0;color:var(--text-muted);transition:var(--transition);border-radius:4px;padding:4px}.dropdown-item-wrapper:hover .btn-mini-delete{opacity:1}.btn-mini-delete:hover{color:var(--status-danger);background:#ef44441a}.add-cat-inline{align-items:center;gap:.5rem;padding:.25rem .5rem .5rem .75rem;display:flex}.add-cat-inline input{border:1px solid var(--glass-border);color:var(--text-primary);background:#ffffff0d;border-radius:4px;outline:none;width:100%;padding:4px 8px;font-size:.75rem}.add-cat-inline button{color:var(--accent-secondary);padding:4px}.add-cat-inline button:hover{transform:scale(1.2)}.main-content{flex:1;max-width:1400px;margin:0 auto;padding:2rem 3rem}.top-header{justify-content:space-between;align-items:center;margin-bottom:2.5rem;display:flex}.search-bar{border-radius:var(--radius-md);align-items:center;gap:.75rem;width:400px;padding:.75rem 1.25rem;display:flex}.search-bar input{color:var(--text-primary);background:0 0;border:none;outline:none;width:100%}.header-actions{align-items:center;gap:1.5rem;display:flex}.notification-bell{cursor:pointer;color:var(--text-secondary);transition:var(--transition);margin-right:.5rem;position:relative}.user-profile,.user-profile-nav{border-radius:var(--radius-md);border:1px solid var(--glass-border);background:#ffffff08;align-items:center;gap:1rem;margin-top:auto;padding:.75rem 1rem;display:flex}.user-profile-nav{margin-top:1rem;margin-bottom:1rem}.user-info{flex-direction:column;flex:1;align-items:flex-start;display:flex}.user-name{color:var(--text-primary);font-size:.875rem;font-weight:600}.user-role{color:var(--text-muted);font-size:.75rem}.user-avatar{background:linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));color:#fff;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:.875rem;font-weight:700;display:flex;box-shadow:0 4px 10px #0000004d}.user-avatar:hover{filter:brightness(1.2);transform:scale(1.1)}.system-controls{border-left:1px solid var(--glass-border);align-items:center;gap:.75rem;margin:0 1.5rem;padding-left:1.5rem;display:flex}.btn-icon{width:40px;height:40px;color:var(--text-secondary);border:1px solid var(--glass-border);background:#ffffff0d;border-radius:50%;justify-content:center;align-items:center;display:flex}.btn-icon:hover{color:var(--accent-secondary);background:#ffffff1a;transform:translateY(-2px)}.badge{background:var(--status-danger);color:#fff;border-radius:10px;padding:2px 6px;font-size:.7rem;font-weight:700;position:absolute;top:-5px;right:-5px}.btn-primary{background:linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));color:#fff;border-radius:var(--radius-md);align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-weight:600;display:flex;box-shadow:0 10px 20px #0003}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 15px 30px #0000004d}.btn-secondary{color:var(--text-primary);border-radius:var(--radius-md);border:1px solid var(--glass-border);background:#ffffff0d;align-items:center;gap:.5rem;padding:.6rem 1rem;font-size:.875rem;display:flex}.btn-secondary:hover{background:#ffffff1a}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem;margin-bottom:3rem;display:grid}.stat-card{border-radius:var(--radius-lg);flex-direction:column;gap:.25rem;padding:1.5rem;display:flex}.stat-label{color:var(--text-secondary);font-size:.875rem}.stat-value{font-size:2rem;font-weight:700}.stat-card.warning{border-left:4px solid var(--status-warning)}.stat-card.danger{border-left:4px solid var(--status-danger)}.subs-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem;animation:.5s fadeIn;display:grid}.sub-card{border-radius:var(--radius-lg);transition:var(--transition);flex-direction:column;gap:1rem;padding:1.5rem;display:flex;position:relative;overflow:hidden}.sub-card:hover{background:#ffffff14;transform:translateY(-5px)}.sub-card:before{content:"";background:var(--accent-primary);width:4px;height:100%;position:absolute;top:0;left:0}.sub-card.expiring-soon:before{background:var(--status-warning)}.sub-card.expired:before{background:var(--status-danger)}.sub-header{justify-content:space-between;align-items:flex-start;display:flex}.sub-info h3{margin-bottom:.25rem;font-size:1.25rem;font-weight:600}.category-tag{color:var(--text-muted);background:#ffffff0d;border-radius:4px;padding:2px 8px;font-size:.75rem}.sub-actions{gap:.5rem;display:flex}.sub-actions button{color:var(--text-muted);padding:4px}.sub-actions button:hover{color:var(--text-primary)}.delete-btn:hover{color:var(--status-danger)!important}.sub-details{border-top:1px solid var(--glass-border);justify-content:space-between;align-items:center;padding:.75rem 0;display:flex}.sub-meta{border-bottom:1px solid var(--glass-border);flex-direction:column;gap:.5rem;padding-bottom:.75rem;display:flex}.meta-item{justify-content:space-between;font-size:.8125rem;display:flex}.meta-label{color:var(--text-muted)}.meta-value{color:var(--text-secondary);font-weight:500}.meta-value.accent{color:var(--accent-secondary);font-weight:600}.detail-item{color:var(--text-secondary);align-items:center;gap:.5rem;font-size:.875rem;display:flex}.status-indicator{align-items:center;gap:.5rem;font-size:.8125rem;font-weight:500;display:flex}.status-dot{border-radius:50%;width:8px;height:8px}.status-dot.active{background:var(--status-active);box-shadow:0 0 10px var(--status-active)}.status-dot.expiring-soon{background:var(--status-warning);box-shadow:0 0 10px var(--status-warning)}.status-dot.expired{background:var(--status-danger);box-shadow:0 0 10px var(--status-danger)}.sub-footer{justify-content:space-between;align-items:center;margin-top:.5rem;display:flex}.support-link{color:var(--text-muted);cursor:help;align-items:center;gap:.5rem;font-size:.8125rem;display:flex}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;background:#000c;justify-content:center;align-items:center;width:100%;height:100%;padding:1rem;display:flex;position:fixed;top:0;left:0}.modal-content{border-radius:var(--radius-lg);width:100%;max-width:600px;padding:2.5rem;animation:.4s slideUp}.modal-content h2{margin-bottom:2rem;font-size:1.75rem}.form-group{flex-direction:column;gap:.5rem;margin-bottom:1.25rem;display:flex}.form-row{grid-template-columns:1fr 1fr;gap:1.25rem;display:grid}label{color:var(--text-secondary);font-size:.875rem;font-weight:500}input,select,textarea{border:1px solid var(--glass-border);border-radius:var(--radius-md);color:var(--text-primary);transition:var(--transition);background:#ffffff0d;outline:none;padding:.75rem 1rem}textarea{resize:vertical;min-height:100px}.sub-description{color:var(--text-muted);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-top:.5rem;font-size:.8125rem;line-height:1.4;display:-webkit-box;overflow:hidden}select option{background-color:var(--surface-color);color:var(--text-primary)}[data-theme=dark] select{background-color:var(--surface-color)}input:focus,select:focus{border-color:var(--accent-secondary);background:#ffffff14}.modal-actions{justify-content:flex-end;gap:1rem;margin-top:2rem;display:flex}.btn-muted{border-radius:var(--radius-md);color:var(--text-secondary);padding:.75rem 1.5rem}.empty-state{text-align:center;color:var(--text-muted);grid-column:1/-1;padding:5rem 0}.app-container.sidebar-hidden .main-content{padding-left:5rem;padding-right:5rem}[data-theme=light] body{background-image:radial-gradient(circle at 0 0,#a936e208 0%,#0000 40%),radial-gradient(circle at 100% 100%,#11b4d408 0%,#0000 40%)}[data-theme=light] .glass{background:#fff9;border-color:#14181f0d}.login-container{background-image:radial-gradient(circle at 30% 30%,#bf5af21a 0%,#0000 50%),radial-gradient(circle at 70% 70%,#1fd5f91a 0%,#0000 50%);justify-content:center;align-items:center;width:100vw;height:100vh;display:flex}.login-card{border-radius:var(--radius-lg);flex-direction:column;gap:1.5rem;width:100%;max-width:420px;padding:3rem;display:flex}.logo.central{justify-content:center;margin-bottom:.5rem}.login-subtitle{text-align:center;color:var(--text-secondary);margin-top:-1rem;margin-bottom:1rem;font-size:.875rem}.login-footer{text-align:center;color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;margin-top:1rem;font-size:.7rem}.w-full{justify-content:center;width:100%}.loading-container{height:100vh;color:var(--text-secondary);flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;display:flex}.loader{border:4px solid var(--glass-border);border-bottom-color:var(--accent-secondary);box-sizing:border-box;border-radius:50%;width:48px;height:48px;animation:1s linear infinite rotation}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.notification-wrapper{position:relative}.notifications-dropdown{border-radius:var(--radius-lg);width:320px;max-height:480px;box-shadow:var(--shadow-xl);z-index:1000;flex-direction:column;animation:.3s slideUp;display:flex;position:absolute;top:calc(100% + 15px);right:-50px}.dropdown-header{border-bottom:1px solid var(--glass-border);padding:1.25rem 1.5rem}.dropdown-header h4{font-size:1rem;font-weight:600}.notifications-list{padding:.5rem;overflow-y:auto}.empty-notifications{text-align:center;color:var(--text-muted);padding:2rem;font-size:.875rem}.notification-item{border-radius:var(--radius-md);transition:var(--transition);align-items:center;gap:1rem;padding:1rem;display:flex}.notification-item:hover{background:#ffffff0d}.notification-item .dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.notification-item.expired .dot{background:var(--status-danger);box-shadow:0 0 8px var(--status-danger)}.notification-item.warning .dot{background:var(--status-warning);box-shadow:0 0 8px var(--status-warning)}.notif-content{flex:1}.notif-content p{margin-bottom:.25rem;font-size:.875rem}.notif-content small{color:var(--text-muted)}.notification-bell .badge{background:var(--status-danger);color:#fff;border:2px solid var(--bg-color);border-radius:9px;justify-content:center;align-items:center;min-width:18px;height:18px;padding:0 4px;font-size:.65rem;font-weight:700;display:flex;position:absolute;top:-2px;right:-2px}