.app{display:flex;flex-direction:column;height:100vh}.app-body{display:flex;flex:1}.content{flex:1;padding:2rem}.header{background-color:#4caf50;color:#fff;padding:1rem;text-align:center}.sidebar{margin:0;padding:0;width:120px;position:sticky;height:100%;overflow:hidden;top:0}.sidebar a{text-decoration:none;font-size:18px}.sidebar a:hover{text-decoration:underline}.sidebar li{list-style:none;margin-bottom:1.5rem}.sidebar ul{padding:.6rem}.sidebarToggle{margin:10px 20px;padding:5px 15px;border-radius:5px;border:none;background-color:#4caf50;color:#f1f1f1;font-size:15px;cursor:pointer}.sidebarToggle:hover{background-color:#438d45}.dashboard{padding:2rem;width:400px;height:600px;margin:40px auto;display:flex;flex-direction:column;align-items:center;padding:20px;box-shadow:0 4px 8px #0000004d;background-color:#f9f9f9}.chart-container{width:300px;height:300px}.chart-container canvas{width:100%!important;height:100%!important}.transactions{padding:2rem;width:400px;height:600px;margin:40px auto;display:flex;flex-direction:column;align-items:center;padding:20px;box-shadow:0 4px 8px #0000004d;background-color:#f9f9f9}.transactions form{display:grid;gap:2.3rem;width:80%}.radio-group{display:flex;align-items:center}.transactions ul{list-style:none;padding:0}.transactions li{background-color:#f4f4f4;padding:.5rem;margin:.5rem 0;border-radius:4px}.transactions input{padding:5px;border-radius:4px;border:1px solid #ccc;font-size:16px}.transactions-submit{padding:10px;background-color:#4caf50;color:#fff;border:none;border-radius:4px;font-size:16px;cursor:pointer}.transactions-submit:hover{background-color:#438d45}input[type=radio],label{display:inline-block;margin-right:10px;width:80%}.transaction-list{width:80%;overflow-y:auto;overflow-x:auto}.transaction-list li{padding:1rem}.transaction-list button{padding:.2rem .5rem;margin-left:20px;border:none;border-radius:4px;cursor:pointer;font-size:.9rem;transition:background-color .3s ease}.budget-planner{padding:2rem;width:400px;height:300px;margin:40px auto;display:flex;flex-direction:column;align-items:center;padding:20px;box-shadow:0 4px 8px #0000004d;background-color:#f9f9f9}.budget-planner form{display:flex;flex-direction:column;gap:1rem}.budget-planner p{font-size:1.5rem}.budget-planner input{padding:10px;margin-bottom:15px;border-radius:4px;border:1px solid #ccc;font-size:16px}.budget-planner button{padding:10px;background-color:#4caf50;color:#fff;border:none;border-radius:4px;font-size:16px;cursor:pointer}.budget-planner button:hover{background-color:#438d45}.reports,.assets{padding:2rem;width:400px;height:400px;margin:40px auto;display:flex;flex-direction:column;align-items:center;padding:20px;box-shadow:0 4px 8px #0000004d;background-color:#f9f9f9}.assets form{display:grid;gap:2rem;width:80%}.assets input,.assets select{padding:5px;border-radius:4px;border:1px solid #ccc;font-size:16px}.assets-submit{padding:10px;background-color:#4caf50;color:#fff;border:none;border-radius:4px;font-size:16px;cursor:pointer}.assets-submit:hover{background-color:#438d45}.loginForm{display:flex;flex-direction:column;align-items:center;justify-content:center;width:400px;height:600px;margin:50px auto;padding:20px;box-shadow:0 4px 8px #0000004d;background-color:#f9f9f9}.loginForm label{margin-bottom:.5rem;font-size:14px;color:#333}.loginForm input{width:80%;padding:10px;margin-bottom:15px;border-radius:4px;border:1px solid #ccc;font-size:16px}.loginForm button{width:80%;padding:10px;background-color:#4caf50;color:#fff;border:none;border-radius:4px;font-size:16px;cursor:pointer}.loginForm button:hover{background-color:#438d45}.loginForm p{margin-top:20px;color:#333}.loginForm a{color:#4caf50;text-decoration:none}.loginForm a:hover{text-decoration:underline}.registerForm{display:flex;flex-direction:column;align-items:center;justify-content:center;width:400px;height:600px;margin:50px auto;padding:20px;box-shadow:0 4px 8px #0000004d;background-color:#f9f9f9}.registerForm label{margin-bottom:.5rem;font-size:14px;color:#333}.registerForm input{width:80%;padding:10px;margin-bottom:15px;border-radius:4px;border:1px solid #ccc;font-size:16px}.registerForm button{width:80%;padding:10px;background-color:#4caf50;color:#fff;border:none;border-radius:4px;font-size:16px;cursor:pointer}.registerForm button:hover{background-color:#438d45}.registerForm p{margin-top:20px;color:#333}.registerForm a{color:#4caf50;text-decoration:none}.registerForm a:hover{text-decoration:underline}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}body{font-family:Inter,sans-serif;font-optical-sizing:auto}