:root{--bg-primary: #f4f7fa;--bg-secondary: #ffffff;--text-primary: #333333;--text-secondary: #555555;--border-color: #e0e0e0;--input-bg: #ffffff}body.dark-mode{--bg-primary: #1a1a2d;--bg-secondary: #282844;--text-primary: #ffffff;--text-secondary: #d0d0e0;--border-color: #4a4a6a;--input-bg: #1a1a2d}html,body{margin:0;padding:0;height:100%;width:100%;background-color:var(--bg-primary);color:var(--text-primary);font-family:system-ui,-apple-system,sans-serif;transition:background-color .3s ease,color .3s ease}.app-layout{display:flex;height:100vh;overflow:hidden}.main-view{flex-grow:1;display:flex;flex-direction:column;height:100%;overflow-y:auto;background-color:var(--bg-primary)}.main-content{padding:24px;flex-grow:1;min-height:100%}.edit-btn{background-color:#1677ff;color:#fff;border:none;padding:4px 10px;border-radius:4px;cursor:pointer;margin-right:8px}.delete-btn{background-color:#ff4d4f;color:#fff;border:none;padding:4px 10px;border-radius:4px;cursor:pointer}body.dark-mode .savings-bucket-card,body.dark-mode .bucket-card,body.dark-mode .bill-card,body.dark-mode .upcoming-bill-card,body.dark-mode .networth-summary-card,body.dark-mode .chart-card,body.dark-mode .stat-card,body.dark-mode .modal-content,body.dark-mode .notification-popover{background-color:var(--bg-secondary)!important;color:var(--text-primary)!important;border:1px solid var(--border-color);box-shadow:0 4px 10px #00000080}body.dark-mode label,body.dark-mode h3,body.dark-mode h4,body.dark-mode strong{color:#fff!important}body.dark-mode input,body.dark-mode select,body.dark-mode textarea{background-color:var(--input-bg);color:#fff;border:1px solid #555}body.dark-mode p,body.dark-mode span,body.dark-mode .stat-label,body.dark-mode .notification-item{color:var(--text-secondary)}body.dark-mode tr:nth-child(2n){background-color:#2f2f4f}body.dark-mode th{background-color:var(--bg-secondary);color:#fff}body.dark-mode td{color:#ddd}.navbar{display:flex;justify-content:space-between;align-items:center;padding:0 24px;height:60px;background-color:var(--bg-secondary);border-bottom:1px solid var(--border-color);color:var(--text-primary);box-shadow:0 2px 4px #0000000d;transition:background-color .3s,border-color .3s}.navbar-logo{font-size:1.5rem;font-weight:700;color:var(--text-primary)}.navbar-icons{display:flex;align-items:center;gap:24px;font-size:1.25rem}.navbar-icon-link{text-decoration:none;color:inherit;line-height:1}.notification-wrapper{position:relative}.navbar-icon-button{background:none;border:none;padding:0;margin:0;font-size:1.25rem;color:inherit;cursor:pointer;position:relative;line-height:1}.notification-badge{position:absolute;top:-5px;right:-8px;background-color:#ff4d4f;color:#fff;border-radius:50%;width:18px;height:18px;font-size:.7rem;font-weight:600;display:flex;align-items:center;justify-content:center;line-height:1}.notification-popover{position:absolute;top:55px;right:20px;width:320px;background-color:#fff;border-radius:8px;box-shadow:0 5px 15px #00000026;z-index:1001;border:1px solid #e0e0e0}.popover-header{font-weight:600;padding:12px 16px;border-bottom:1px solid #f0f0f0}.no-notifications{padding:30px 20px;text-align:center;color:#777}.notification-list{list-style-type:none;padding:0;margin:0;max-height:400px;overflow-y:auto}.notification-item a{display:block;padding:12px 16px;text-decoration:none;color:#333;font-size:.9rem}.notification-item a:hover{background-color:#f4f7fa}.notification-item strong{color:#1677ff}.sidebar{width:240px;height:100vh;overflow-y:auto;background-color:var(--bg-secondary);border-right:1px solid var(--border-color);box-shadow:2px 0 4px #0000000d;transition:background-color .3s,border-color .3s}.sidebar-nav{display:flex;flex-direction:column;padding:12px;margin:0}.sidebar-link{display:block;padding:12px 16px;text-decoration:none;color:var(--text-primary);font-weight:500;border-radius:6px;margin-bottom:4px;transition:background-color .2s,color .2s}.sidebar-link:hover{background-color:var(--hover-bg)}.sidebar-link.active{background-color:var(--sidebar-active-bg);color:var(--sidebar-active-text);font-weight:600}.expense-form h3{text-align:center;margin-top:0;margin-bottom:24px;font-size:1.5rem}.form-group label,.form-group-radio label{display:block;margin-bottom:8px;font-weight:500;color:#333}.form-group-radio .radio-options{display:flex;gap:20px}.dashboard-page{display:flex;flex-direction:column;gap:20px;max-width:1200px;margin:0 auto;width:100%}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}.charts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:20px}.chart-card{background-color:#fff;padding:20px;border-radius:12px;box-shadow:0 4px 12px #0000000d;min-height:350px;display:flex;flex-direction:column}.no-data{text-align:center;color:#888;margin-top:50px}.bills-section{margin-top:20px}.bills-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin-top:15px}.stat-card{background-color:#282844;border-radius:8px;box-shadow:0 4px 12px #0000001a;padding:24px;display:flex;align-items:center;gap:20px;color:#f0f0f0}.stat-icon-container{flex-shrink:0;background-color:#007bff1a;color:#007bff;width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem}.stat-info .stat-title{font-size:.9rem;font-weight:500;color:#a9a9c0;text-transform:uppercase}.stat-info .stat-value{display:block;font-size:2rem;font-weight:600;color:#fff;margin-top:4px}.stat-info .stat-change{font-size:.9rem;font-weight:500;margin-left:8px}.text-green{color:#2ed47a}.text-red{color:#ff4d4f}.text-grey{color:#a9a9c0}.stats-container,.data-container{background-color:var(--bg-secondary);padding:20px;border-radius:8px;box-shadow:0 2px 4px #0000000d;color:var(--text-primary);transition:background-color .3s,color .3s}.data-table-scrollable{width:100%;max-height:400px;overflow-y:auto}.data-table{margin-top:24px;width:100%;overflow-x:auto}.data-table table{width:100%;border-collapse:collapse;text-align:left;background-color:transparent}.data-table-scrollable thead th{position:sticky;top:0;background-color:var(--table-header-bg);z-index:1}.data-table th{background-color:var(--table-header-bg);font-weight:600;color:var(--text-secondary);padding:12px 16px;border-bottom:1px solid var(--border-color)}.data-table td{padding:12px 16px;border-bottom:1px solid var(--border-color);color:var(--text-primary)}.data-table tbody tr{background-color:transparent!important;transition:background-color .2s}.data-table tbody tr:hover{background-color:var(--hover-bg)!important}.data-table td[colSpan]{text-align:center;color:var(--text-secondary);padding:40px}.want-need-cell{text-transform:capitalize}body.dark-mode .data-table th,body.dark-mode .data-table td{border-bottom-color:#3a3a5a}body.dark-mode .data-table th{background-color:#25253e}.chart-container{position:relative}.chart-total{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;color:var(--text-secondary);font-size:1rem;line-height:1.3}.chart-total span{font-size:1.75rem;font-weight:600;color:var(--text-primary)}.stats-legend{margin-top:20px;display:flex;flex-direction:column;gap:12px}.stats-legend div{display:flex;align-items:center;justify-content:space-between;font-size:.9rem;color:var(--text-primary)}.stats-legend div span:first-child{display:flex;align-items:center;gap:8px}.stats-legend div span:last-child{font-weight:600}.legend-dot{width:10px;height:10px;border-radius:50%}.custom-tooltip{background-color:#000000e6;padding:10px;border-radius:6px;color:#fff;border:1px solid #4a4a6a}.custom-tooltip .label{font-weight:600;margin:0}.custom-tooltip .intro{margin:0;padding-top:5px}body.dark-mode .data-container,body.dark-mode .stats-container{background-color:#282844!important;color:#f0f0f0!important;border:1px solid #4a4a6a}body.dark-mode .data-table,body.dark-mode .data-table table,body.dark-mode .data-table tbody,body.dark-mode .data-table tr{background-color:transparent!important;color:#f0f0f0!important}body.dark-mode .data-table tbody tr:hover{background-color:#3a3a5a!important}body.dark-mode .data-table td,body.dark-mode .data-table th{border-bottom-color:#4a4a6a!important;color:#f0f0f0!important}body.dark-mode .data-table th{background-color:#323250!important;color:#a9a9c0!important}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background-color:#fff;padding:30px;border-radius:8px;box-shadow:0 4px 12px #00000026;position:relative;min-width:400px}.modal-close-btn{position:absolute;top:10px;right:15px;background:none;border:none;font-size:1.75rem;color:#999;cursor:pointer}.modal-close-btn:hover{color:#333}.income-form h3{text-align:center;margin-top:0;margin-bottom:24px;font-size:1.5rem}.buckets-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.buckets-header h2{margin:0}.add-new-btn{background-color:#1677ff;color:#fff;border:none;padding:8px 16px;border-radius:6px;font-weight:500;cursor:pointer}.add-new-btn:hover{background-color:#096dd9}.buckets-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px}.bucket-card{background-color:#fff;border-radius:8px;padding:20px;box-shadow:0 2px 4px #0000000d}.bucket-card-header{display:flex;justify-content:space-between;font-weight:500;color:#555;margin-bottom:16px}.bucket-amount{font-size:1.75rem;font-weight:600}.bucket-goal{color:#777}.bucket-card-footer{margin-top:20px;display:flex;align-items:center;gap:10px}.progress-bar-outline{flex-grow:1;height:10px;background-color:#f0f0f0;border-radius:5px;overflow:hidden}.progress-bar-fill{height:100%;background-color:#52c41a;border-radius:5px}.bucket-delete-btn{background-color:#f0f0f0;border:1px solid #d9d9d9;color:#777;font-weight:600;border-radius:50%;width:24px;height:24px;line-height:22px;text-align:center;padding:0;cursor:pointer;transition:all .2s}.card-actions{display:flex;gap:8px}.bucket-delete-btn,.bucket-edit-btn{background-color:#f0f0f0;border:1px solid #d9d9d9;color:#777;font-weight:600;border-radius:50%;width:24px;height:24px;line-height:22px;text-align:center;padding:0;cursor:pointer;transition:all .2s;font-size:14px}.bucket-delete-btn:hover{background-color:#ff4d4f;border-color:#ff4d4f;color:#fff}.bucket-edit-btn:hover{background-color:#1677ff;border-color:#1677ff;color:#fff}.bucket-add-btn{background-color:#f0f0f0;border:1px solid #d9d9d9;color:#777;font-weight:600;border-radius:50%;width:24px;height:24px;line-height:22px;text-align:center;padding:0;cursor:pointer;transition:all .2s;font-size:14px}.bucket-add-btn:hover{background-color:#2ed47a;border-color:#2ed47a;color:#fff}.bucket-remaining{font-size:.9rem;font-weight:500;color:#777;text-align:center;margin-top:12px}.bucket-remaining.complete{color:#2ed47a;font-weight:600}.bucket-form h3{text-align:center;margin-top:0;margin-bottom:24px;font-size:1.5rem}.form-group{margin-bottom:16px}.form-group label{display:block;margin-bottom:8px;font-weight:500;color:#333}.form-group input{width:100%;padding:10px;border:1px solid #d9d9d9;border-radius:6px;box-sizing:border-box}.form-row{display:flex;gap:16px}.form-row .form-group{flex:1}.form-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}.form-actions button{padding:10px 20px;border:none;border-radius:6px;font-weight:500;cursor:pointer}.btn-cancel{background-color:#f0f0f0;color:#333}.btn-cancel:hover{background-color:#e0e0e0}.btn-add{background-color:#1677ff;color:#fff}.btn-add:hover{background-color:#096dd9}.bucket-form .form-group select{width:100%;padding:10px;border:1px solid #d9d9d9;border-radius:6px;box-sizing:border-box;background-color:#fff;font-family:inherit;font-size:.9rem}.form-group-checkbox{flex-basis:100px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding-top:10px}.form-group-checkbox label{margin-bottom:12px;font-weight:500;color:#333}.form-group-checkbox input{transform:scale(1.5)}.retirement-layout{display:grid;grid-template-columns:340px 1fr;gap:24px;align-items:start}.retirement-left-column{display:flex;flex-direction:column;gap:24px}.retirement-right-column{width:100%}.stats-container-retirement{width:100%;background-color:var(--bg-secondary);padding:24px;border-radius:8px;box-shadow:none;border:1px solid var(--border-color);color:var(--text-primary)}.adjust-goal-btn{float:right;background:none;border:1px solid var(--border-color);padding:4px 10px;border-radius:6px;cursor:pointer;color:var(--text-secondary);font-size:.85rem;transition:all .2s}.adjust-goal-btn:hover{background-color:var(--hover-bg);color:var(--text-primary)}.monthly-deposit{margin-top:40px;text-align:center}.monthly-deposit span{font-size:.9rem;color:var(--text-secondary)}.monthly-deposit strong{display:block;font-size:1.75rem;font-weight:600;margin-top:4px;color:var(--text-primary)}.retirement-summary{display:flex;justify-content:space-around;margin-top:-20px}.retirement-summary div{text-align:center}.retirement-summary span{font-size:.9rem;color:var(--text-secondary)}.retirement-summary strong{display:block;font-size:1.1rem;font-weight:600;color:var(--text-primary)}.time-left{text-align:center;font-size:.9rem;color:var(--text-secondary);margin-top:24px;background-color:var(--hover-bg);padding:10px;border-radius:6px}.breakdown-card{width:100%;background-color:var(--bg-secondary);padding:20px;border-radius:8px;box-shadow:none;border:1px solid var(--border-color);color:var(--text-primary)}.breakdown-card h3{margin-top:0;font-size:1.1rem;border-bottom:1px solid var(--border-color);padding-bottom:12px;margin-bottom:16px}.breakdown-list{list-style-type:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}.breakdown-item{display:flex;justify-content:space-between;align-items:center;font-size:.95rem}.breakdown-item span{color:var(--text-secondary)}.breakdown-item strong{font-weight:600;color:var(--text-primary)}.breakdown-item.empty{color:var(--text-secondary);justify-content:center;font-size:.9rem;padding:10px}@media(max-width:1024px){.retirement-layout{grid-template-columns:1fr}}.contribution-form h3{text-align:center;margin-top:0;margin-bottom:24px;font-size:1.5rem}.contribution-form .form-group{margin-bottom:16px}.contribution-form .form-group label{display:block;margin-bottom:8px;font-weight:500;color:#333}.contribution-form .form-group input,.contribution-form .form-group select{width:100%;padding:10px;border:1px solid #d9d9d9;border-radius:6px;box-sizing:border-box;font-family:inherit;font-size:.9rem}.contribution-form .form-row{display:flex;gap:16px}.contribution-form .form-row .form-group{flex:1}.contribution-form .form-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}.contribution-form .form-actions button{padding:10px 20px;border:none;border-radius:6px;font-weight:500;cursor:pointer}.contribution-form .btn-cancel{background-color:#f0f0f0;color:#333}.contribution-form .btn-cancel:hover{background-color:#e0e0e0}.contribution-form .btn-add{background-color:#1677ff;color:#fff}.contribution-form .btn-add:hover{background-color:#096dd9}.contribution-form .custom-type-input{margin-top:10px;padding-left:10px;border-left:3px solid #1677ff}.contribution-form .custom-type-input label{font-size:.85rem;font-weight:600;color:#555}.bill-page-layout{display:flex;flex-direction:column;gap:24px}.bill-form h3{text-align:center;margin-top:0;margin-bottom:24px;font-size:1.5rem}.bill-form .form-group{margin-bottom:16px}.bill-form .form-group label{display:block;margin-bottom:8px;font-weight:500;color:#333}.bill-form .form-group input,.bill-form .form-group select{width:100%;padding:10px;border:1px solid #d9d9d9;border-radius:6px;box-sizing:border-box;font-family:inherit;font-size:.9rem}.bill-form .form-row{display:flex;gap:16px}.bill-form .form-row .form-group{flex:1}.bill-form .form-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}.bill-form .form-actions button{padding:10px 20px;border:none;border-radius:6px;font-weight:500;cursor:pointer}.bill-form .btn-cancel{background-color:#f0f0f0;color:#333}.bill-form .btn-cancel:hover{background-color:#e0e0e0}.bill-form .btn-add{background-color:#1677ff;color:#fff}.bill-form .btn-add:hover{background-color:#096dd9}.bill-form .form-group-checkbox{flex-basis:100px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding-top:10px}.bill-form .form-group-checkbox label{margin-bottom:12px;font-weight:500;color:#333}.bill-form .form-group-checkbox input{transform:scale(1.5);width:auto}.bill-form .custom-type-input{margin-top:10px;padding-left:10px;border-left:3px solid #1677ff}.bill-form .custom-type-input label{font-size:.85rem;font-weight:600;color:#555}.networth-summary-card{background-color:#fff;border-radius:8px;box-shadow:0 2px 4px #0000000d;padding:24px;margin-bottom:24px}.total-networth{text-align:center}.total-networth span{font-size:1.1rem;color:#555}.total-networth strong{display:block;font-size:2.5rem;font-weight:600;margin-top:4px;color:#2ed47a}.graph-container{width:100%;margin-top:16px}.data-container{width:100%;background-color:#fff;padding:20px;border-radius:8px;box-shadow:0 2px 4px #0000000d}.add-new-btn{background-color:#1677ff;color:#fff;border:none;padding:8px 16px;border-radius:6px;font-weight:500;cursor:pointer;float:right;margin-bottom:16px}.asset-form h3{text-align:center;margin-top:0;margin-bottom:24px;font-size:1.5rem}.asset-form .form-group{margin-bottom:16px}.asset-form .form-group label{display:block;margin-bottom:8px;font-weight:500;color:#333}.asset-form .form-group input,.asset-form .form-group select{width:100%;padding:10px;border:1px solid #d9d9d9;border-radius:6px;box-sizing:border-box;font-family:inherit;font-size:.9rem}.asset-form .form-row{display:flex;gap:16px}.asset-form .form-row .form-group{flex:1}.asset-form .form-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}.asset-form .form-actions button{padding:10px 20px;border:none;border-radius:6px;font-weight:500;cursor:pointer}.asset-form .btn-cancel{background-color:#f0f0f0;color:#333}.asset-form .btn-cancel:hover{background-color:#e0e0e0}.asset-form .btn-add{background-color:#1677ff;color:#fff}.asset-form .btn-add:hover{background-color:#096dd9}.asset-form .custom-type-input{margin-top:10px;padding-left:10px;border-left:3px solid #1677ff}.asset-form .custom-type-input label{font-size:.85rem;font-weight:600;color:#555}.profile-page-grid{display:grid;grid-template-columns:1fr 2fr;gap:24px}.data-container{background-color:#fff;padding:20px;border-radius:8px;box-shadow:0 2px 4px #0000000d}.profile-card h3,.history-card h3{margin-top:0;margin-bottom:24px}.profile-card .form-group{margin-bottom:16px}.profile-card .form-group label{display:block;margin-bottom:8px;font-weight:500;color:#333}.profile-card .form-group input,.profile-card .form-group textarea{width:100%;padding:10px;border:1px solid #d9d9d9;border-radius:6px;box-sizing:border-box;font-family:inherit;font-size:.9rem}.btn-save-profile{background-color:#1677ff;color:#fff;border:none;padding:10px 20px;border-radius:6px;font-weight:500;cursor:pointer;width:100%}.btn-save-profile:hover{background-color:#096dd9}.history-card .data-table{max-height:600px;overflow-y:auto}.type-income,.amount-income{color:#2ed47a;font-weight:500}.type-expense,.amount-expense{color:#ff4d4f;font-weight:500}@media(max-width:1024px){.profile-page-grid{grid-template-columns:1fr}}.settings-page{max-width:800px;margin:0 auto}.settings-page h2{font-size:2rem;margin-bottom:24px}.data-container{background-color:#fff;padding:24px;border-radius:8px;box-shadow:0 2px 4px #0000000d;margin-bottom:24px}.data-container h3{margin-top:0;border-bottom:1px solid #f0f0f0;padding-bottom:16px;margin-bottom:24px}.settings-form .form-group{margin-bottom:16px}.settings-form .form-group label{display:block;margin-bottom:8px;font-weight:500;color:#333}.settings-form .form-group input{width:100%;max-width:400px;padding:10px;border:1px solid #d9d9d9;border-radius:6px;box-sizing:border-box;font-family:inherit;font-size:.9rem}.form-note{font-size:.85rem;color:#777;margin-top:10px}.btn-save-settings,.btn-manage-subscription{background-color:#1677ff;color:#fff;border:none;padding:10px 20px;border-radius:6px;font-weight:500;cursor:pointer}.btn-save-settings:hover,.btn-manage-subscription:hover{background-color:#096dd9}.danger-zone{border:2px solid #ff4d4f}.danger-zone h3{color:#ff4d4f}.btn-delete-account{background-color:#ff4d4f;color:#fff;border:none;padding:10px 20px;border-radius:6px;font-weight:500;cursor:pointer}.btn-delete-account:hover{background-color:#cf1322}.preference-item{display:flex;justify-content:space-between;align-items:center}.preference-item label{font-weight:500;font-size:1rem}.toggle-switch{position:relative;display:inline-block;width:50px;height:28px}.toggle-switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;transition:.4s;border-radius:28px}.slider:before{position:absolute;content:"";height:20px;width:20px;left:4px;bottom:4px;background-color:#fff;transition:.4s;border-radius:50%}input:checked+.slider{background-color:#1677ff}input:checked+.slider:before{transform:translate(22px)}.admin-container{padding:24px;max-width:1200px;margin:0 auto}.admin-header{margin-bottom:24px}.user-table-container{background:var(--bg-secondary);border-radius:12px;box-shadow:0 2px 8px #0000000d;overflow-x:auto}.user-table{width:100%;border-collapse:collapse;text-align:left}.user-table th,.user-table td{padding:16px;border-bottom:1px solid var(--border-color)}.user-table th{color:var(--text-secondary);font-weight:600;white-space:nowrap}.client-info{display:flex;align-items:center;gap:12px}.client-avatar{width:36px;height:36px;background-color:#1677ff;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:18px}.status-badge{padding:6px 12px;border-radius:20px;font-size:14px;font-weight:500}.status-badge.subscribed{background-color:#4caf501a;color:#4caf50}.status-badge.not-subscribed{background-color:#9e9e9e1a;color:#9e9e9e}body.dark-mode .status-badge.subscribed{background-color:#4caf5033}body.dark-mode .status-badge.not-subscribed{background-color:#ffffff1a;color:#d0d0e0}body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;background-color:#f4f7fa}
