@import"https://fonts.googleapis.com/css2?family=Macondo&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Macondo,cursive;background-color:#252525;color:#222;display:flex;justify-content:center;align-items:center;min-height:100vh}.main{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;max-width:600px;padding:16px}body::-webkit-scrollbar{display:none}@media(max-width:768px){.main{padding:12px}}.container{text-align:center;border:1px solid #000;padding:20px;border-radius:5px;margin-bottom:25px;background-color:#252525;max-width:500px;width:100%;margin-left:auto;margin-right:auto}.input{width:100%;padding:15px 20px;outline:none;border-radius:5px;margin:5px 0;border:1px solid #000;font-size:16px}.radio-container{display:flex;align-items:center;justify-content:center;margin:10px 0;gap:20px;flex-wrap:wrap}.radio-btn{display:flex;align-items:center;color:#f0f8ff}.label{margin-left:8px;cursor:pointer;font-size:20px}.submit-btn{background-color:#1062e6;color:#fff;border-radius:5px;padding:10px 20px;border:none;outline:none;cursor:pointer;font-size:16px;transition:background .2s ease}.submit-btn:hover{background-color:#0e52bf}.overview-container{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;flex-wrap:wrap;gap:10px}.balance{font-weight:500;font-size:1.5rem}.balance span{font-weight:700}.add-btn{cursor:pointer;background-color:#1062e6;color:#fff;padding:7px 20px;font-size:16px;border:none;text-transform:uppercase;border-radius:5px;transition:background-color .2s ease}.add-btn:hover{background-color:#0e52bf}.tracker-container{display:flex;flex-direction:column;width:600px;max-width:100%;background-color:#dceaff;padding:20px;border:1px solid #000;border-radius:15px;margin:10px auto}.heading{height:20lvh}.transaction-details{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:15px;flex-wrap:wrap}.expense-box,.income-box{flex:1;border:10px solid #252525;border-radius:10px;padding:5px 7px;background-color:#ebf3ff;text-align:center}.expense-box span,.income-box span{font-weight:700;font-size:25px;display:block}.expense-amount{color:red}.income-amount{color:green}.transaction-wrapper{margin-bottom:14px}.transaction-item{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:18px;color:#000;background:#ebefff;border:5px solid #fff}.expense-border{border-color:#ff4d4d}.income-border{border-color:#4dff88}.detail{font-size:16px}.amount{font-size:16px;font-weight:500}.remove-button{background:#353535;color:#fff;border:2px solid #fff;border-radius:10px;padding:4px 10px;cursor:pointer;font-size:14px}.remove-button:hover{background:#fff;color:#000}.date{display:flex;justify-content:space-between;margin:6px 8px 0;font-size:15px;color:#252525}.transactions-container{margin-top:20px}.transactions-heading{font-size:25px;font-weight:600;margin-bottom:10px}.search-input{width:100%;padding:15px 20px;outline:none;border-radius:5px;margin:5px 0 25px;border:5px solid #252525;background-color:#dceaff;font-size:16px}.transaction-items{display:flex;flex-direction:column;gap:10px}.no-transaction-text{text-align:center;color:#252525;font-size:16px}.date{display:flex;gap:65%;margin-left:5%;font-weight:700}.database-container{position:fixed;inset:0;pointer-events:none;z-index:9999}.menu-btn{pointer-events:auto;position:fixed;top:16px;left:16px;padding:7px 10px;font-size:18px;color:#fff;background:#606060;border:1px solid #fff;border-radius:5px;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.menu-btn:active{transform:scale(.92)}.backdrop{position:fixed;inset:0;background:#0009;opacity:0;pointer-events:none;transition:opacity .35s ease}.backdrop.show{opacity:1;pointer-events:auto}.drawer{position:fixed;left:0;height:90vh;width:100%;max-width:380px;background:#dceaff;transform:translate(-100%);transition:transform .45s cubic-bezier(.16,1,.3,1);border-radius:30px;padding:20px;pointer-events:auto;overflow-y:auto}.drawer::-webkit-scrollbar{display:none}.drawer-header h2{font-weight:80px;padding:0 15px;margin-left:20%}.drawer.open{transform:translate(150px)}.drawer-item{margin:10px;font-size:20px;background-color:#fff;border:2px solid #000;padding:5px;border-radius:10px;list-style:none}.drawer-item button{margin-left:45%;margin-bottom:5px;padding:2px 5px;border-radius:4px;border:1px solid #000;background-color:#353535;color:#fff}.close-btn{border:none;background:#f3f3f3;padding:8px 10px;border-radius:50%;border:2px solid #000}.week-data{list-style:none;color:#fff;background-color:#252525;padding:10px;border-radius:10px;transition:1s}.week-data li{margin-top:5px;border:2px solid #fff;padding:4px;border-radius:5px}@media(max-width:480px){.container{padding:20px 5px;border-radius:15px}.input{padding:10px 12px;font-size:14px;width:90%}.submit-btn{width:50%;font-size:15px}.overview-container{flex-direction:column;align-items:center}.add-btn{width:80%;font-size:15px}.tracker-container{padding:20px 15px;width:350px}.heading{margin:-40px 0}.transaction-details{flex-direction:column;gap:15px}.expense-box,.income-box{width:70%}.transactions-heading{font-size:25px;text-align:center}.search-input{padding:12px 15px;font-size:14px;width:100%;align-items:center}.drawer.open{transform:translate(20px)}.menu-btn{top:50px;left:50px;position:sticky;display:inline-flexbox;color:#000;border:2px solid #000;background-color:#606060;padding:0 5px;border-radius:5px}}