@import"https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap";.container{max-width:1140px;width:100%;margin:0 auto;padding-right:.6rem;padding-left:.6rem}.container-fluid{max-width:100%;margin:0}.container-row{display:flex;flex-wrap:wrap;margin-right:-.6rem;margin-left:-.6rem}.container-row>*{max-width:100%;padding-right:.6rem;padding-left:.6rem}.container .col-1{position:relative;flex:0 0 auto;width:8.3333333333%}.container .col-2{position:relative;flex:0 0 auto;width:16.6666666667%}.container .col-3{position:relative;flex:0 0 auto;width:25%}.container .col-4{position:relative;flex:0 0 auto;width:33.3333333333%}.container .col-5{position:relative;flex:0 0 auto;width:41.6666666667%}.container .col-6{position:relative;flex:0 0 auto;width:50%}.container .col-7{position:relative;flex:0 0 auto;width:58.3333333333%}.container .col-8{position:relative;flex:0 0 auto;width:66.6666666667%}.container .col-9{position:relative;flex:0 0 auto;width:75%}.container .col-10{position:relative;flex:0 0 auto;width:83.3333333333%}.container .col-11{position:relative;flex:0 0 auto;width:91.6666666667%}.container .col-12{position:relative;flex:0 0 auto;width:100%}@media (min-width: 576px){.container .col-sm-1{position:relative;flex:0 0 auto;width:8.3333333333%}.container .col-sm-2{position:relative;flex:0 0 auto;width:16.6666666667%}.container .col-sm-3{position:relative;flex:0 0 auto;width:25%}.container .col-sm-4{position:relative;flex:0 0 auto;width:33.3333333333%}.container .col-sm-5{position:relative;flex:0 0 auto;width:41.6666666667%}.container .col-sm-6{position:relative;flex:0 0 auto;width:50%}.container .col-sm-7{position:relative;flex:0 0 auto;width:58.3333333333%}.container .col-sm-8{position:relative;flex:0 0 auto;width:66.6666666667%}.container .col-sm-9{position:relative;flex:0 0 auto;width:75%}.container .col-sm-10{position:relative;flex:0 0 auto;width:83.3333333333%}.container .col-sm-11{position:relative;flex:0 0 auto;width:91.6666666667%}.container .col-sm-12{position:relative;flex:0 0 auto;width:100%}}@media (min-width: 768px){.container .col-md-1{position:relative;flex:0 0 auto;width:8.3333333333%}.container .col-md-2{position:relative;flex:0 0 auto;width:16.6666666667%}.container .col-md-3{position:relative;flex:0 0 auto;width:25%}.container .col-md-4{position:relative;flex:0 0 auto;width:33.3333333333%}.container .col-md-5{position:relative;flex:0 0 auto;width:41.6666666667%}.container .col-md-6{position:relative;flex:0 0 auto;width:50%}.container .col-md-7{position:relative;flex:0 0 auto;width:58.3333333333%}.container .col-md-8{position:relative;flex:0 0 auto;width:66.6666666667%}.container .col-md-9{position:relative;flex:0 0 auto;width:75%}.container .col-md-10{position:relative;flex:0 0 auto;width:83.3333333333%}.container .col-md-11{position:relative;flex:0 0 auto;width:91.6666666667%}.container .col-md-12{position:relative;flex:0 0 auto;width:100%}}@media (min-width: 992px){.container .col-lg-1{position:relative;flex:0 0 auto;width:8.3333333333%}.container .col-lg-2{position:relative;flex:0 0 auto;width:16.6666666667%}.container .col-lg-3{position:relative;flex:0 0 auto;width:25%}.container .col-lg-4{position:relative;flex:0 0 auto;width:33.3333333333%}.container .col-lg-5{position:relative;flex:0 0 auto;width:41.6666666667%}.container .col-lg-6{position:relative;flex:0 0 auto;width:50%}.container .col-lg-7{position:relative;flex:0 0 auto;width:58.3333333333%}.container .col-lg-8{position:relative;flex:0 0 auto;width:66.6666666667%}.container .col-lg-9{position:relative;flex:0 0 auto;width:75%}.container .col-lg-10{position:relative;flex:0 0 auto;width:83.3333333333%}.container .col-lg-11{position:relative;flex:0 0 auto;width:91.6666666667%}.container .col-lg-12{position:relative;flex:0 0 auto;width:100%}}@media (min-width: 1200px){.container .col-xl-1{position:relative;flex:0 0 auto;width:8.3333333333%}.container .col-xl-2{position:relative;flex:0 0 auto;width:16.6666666667%}.container .col-xl-3{position:relative;flex:0 0 auto;width:25%}.container .col-xl-4{position:relative;flex:0 0 auto;width:33.3333333333%}.container .col-xl-5{position:relative;flex:0 0 auto;width:41.6666666667%}.container .col-xl-6{position:relative;flex:0 0 auto;width:50%}.container .col-xl-7{position:relative;flex:0 0 auto;width:58.3333333333%}.container .col-xl-8{position:relative;flex:0 0 auto;width:66.6666666667%}.container .col-xl-9{position:relative;flex:0 0 auto;width:75%}.container .col-xl-10{position:relative;flex:0 0 auto;width:83.3333333333%}.container .col-xl-11{position:relative;flex:0 0 auto;width:91.6666666667%}.container .col-xl-12{position:relative;flex:0 0 auto;width:100%}}@media (min-width: 1400px){.container .col-xxl-1{position:relative;flex:0 0 auto;width:8.3333333333%}.container .col-xxl-2{position:relative;flex:0 0 auto;width:16.6666666667%}.container .col-xxl-3{position:relative;flex:0 0 auto;width:25%}.container .col-xxl-4{position:relative;flex:0 0 auto;width:33.3333333333%}.container .col-xxl-5{position:relative;flex:0 0 auto;width:41.6666666667%}.container .col-xxl-6{position:relative;flex:0 0 auto;width:50%}.container .col-xxl-7{position:relative;flex:0 0 auto;width:58.3333333333%}.container .col-xxl-8{position:relative;flex:0 0 auto;width:66.6666666667%}.container .col-xxl-9{position:relative;flex:0 0 auto;width:75%}.container .col-xxl-10{position:relative;flex:0 0 auto;width:83.3333333333%}.container .col-xxl-11{position:relative;flex:0 0 auto;width:91.6666666667%}.container .col-xxl-12{position:relative;flex:0 0 auto;width:100%}}*,*:before,*:after{box-sizing:border-box;font-family:Inter,sans-serif;font-size:10px;margin:0;padding:0}html{scroll-behavior:smooth}body{background-color:#e5e5e5}button:focus-visible{border:none;outline:none}.xtrack-container{height:100vh;display:flex;justify-content:center;align-items:center;overflow-x:hidden}.app-content{display:flex;flex-direction:column;position:relative;width:37.5rem;max-width:90%;height:75rem;max-height:96vh;margin:0 auto;background-color:#fff;border:6px solid #262626;border-radius:2.8rem;overflow:hidden}.app-content:after{position:absolute;content:"";width:13.4rem;height:.5rem;bottom:.8rem;left:50%;transform:translate(-50%);background-color:#000;border-radius:10rem;z-index:5}.app-content.dialog-active:before{position:absolute;content:"";width:100%;height:100%;top:0;left:0;background-color:#0009;z-index:3}.app-content .top-section{position:relative;padding:2.2rem 1rem 3.4rem;background:linear-gradient(-176.669deg,#fff6e5,#f8edd8 99%);border-radius:2.8rem;z-index:2}.app-content h1{margin-bottom:2rem;font-weight:700;font-size:1.3rem;color:#161719}.app-content h2{font-weight:500;font-size:1.2rem;line-height:1.3;text-align:center;text-transform:capitalize;color:#91919f}.app-content .reset-btn{position:absolute;left:6px;bottom:0;font-weight:700;font-size:1rem;text-transform:capitalize;color:#fd3c4a;text-decoration:underline;background-color:transparent;border:none;outline:none;cursor:pointer}.app-content .container-info{margin-top:1.7rem}.app-content .container-info>.container-row>div[class^=col-]:not(:last-child){margin-bottom:1rem}.app-content .container-row .btn{margin-top:4rem}.app-content .bottom-section{flex:1 1 100%;margin-top:-3rem;padding:0 1rem;background:linear-gradient(180deg,#8b50ff3d,#8b50ff00)}.app-content .floating-btn{position:absolute;width:4rem;height:4rem;right:2rem;bottom:2rem;display:flex;justify-content:center;align-items:center;z-index:100}.app-content .floating-btn .add-transaction{padding:1.5rem;background-color:#7f3dff;border:none;border-radius:50%;outline:none;cursor:pointer;transition:all .5s}.app-content .floating-btn .add-transaction:hover{background-color:#7f3dffcc}.app-content .floating-btn .add-transaction img{transition:all .5s}.app-content .floating-btn .add-transaction.dialog-active img{transform:rotate(45deg)}.balance{font-weight:600}.expense-info{padding:1.6rem 1.3rem;border-radius:2.8rem}.expense-info.income{background-color:#00a86b}.expense-info.expenses{background-color:#fd3c4a}.expense-info .info{font-weight:500;font-size:1.2rem;color:#fff;text-transform:capitalize}.icon-container{display:flex;justify-content:center;align-items:center;padding:.7rem;border-radius:1.2rem}.icon-container img{width:2.6rem;height:2rem;object-fit:contain}.btn{padding:1.5rem;font-weight:600;font-size:1.4rem;color:#fff;text-transform:capitalize;background-color:#7f3dff;border:none;border-radius:1.6rem;outline:none;cursor:pointer;transition:all .5s}.btn:hover{background-color:#7f3dffcc}.transaction-dialog{position:absolute;width:100%;height:57%;padding:2.2rem 1rem;background-color:#fff;left:0;bottom:-57%;border-top-right-radius:2.8rem;border-top-left-radius:2.8rem;transition:all .5s;z-index:4}.transaction-dialog.active{bottom:0}.transaction-dialog form{width:100%;height:100%}.transaction-dialog form .form-row{display:flex;flex-direction:column;justify-content:space-between}.transaction-dialog form .form-row:not(:last-child){margin-bottom:1.6rem}.transaction-dialog form .form-row label{border-width:0;clip:rect(1px,1px,1px,1px);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.transaction-dialog form .form-row input{padding:1.2rem 1.6rem;font-weight:400;font-size:1.3rem;color:#000;background-color:transparent;border:2px solid #e5e5e5;border-radius:1.6rem;outline:none}.transaction-dialog form .form-row input::placeholder{font-weight:400;color:#000;opacity:1;text-transform:capitalize}.transaction-dialog form .form-row input:focus,.transaction-dialog form .form-row input:focus-visible{border-color:#7f3dff;box-shadow:0 0 0 1px #7f3dff;outline:none}.transaction-dialog form .form-row select{position:relative;padding:1.2rem 1.6rem;font-weight:400;font-size:1.3rem;color:#000;background-color:transparent;border:2px solid #e5e5e5;border-radius:1.6rem;outline:none;text-transform:capitalize;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url(/angle-down-solid.svg);background-size:10px 10px;background-position:95% center;background-repeat:no-repeat}.transaction-dialog form .form-row select:focus,.transaction-dialog form .form-row select:focus-visible{border-color:#7f3dff;box-shadow:0 0 0 1px #7f3dff;outline:none}.transaction-dialog form .form-row option{font-weight:400;font-size:1.3rem;color:#000;text-transform:capitalize}.xtrack-tab{margin-top:4rem;display:flex;flex-direction:column}.tab-btn-container .tab-btn{padding:.8rem 2.4rem;font-weight:500;font-size:1.4rem;line-height:1.8rem;color:#91919f;text-transform:capitalize;background-color:transparent;border:none;border-radius:1.6rem;outline:none;transition:all .5s;cursor:pointer}.tab-btn-container .tab-btn:not(:last-child){margin-right:1rem}.tab-btn-container .tab-btn:hover,.tab-btn-container .tab-btn.active{font-weight:700;color:#fcac12;background-color:#fceed4}.tab-content-container{padding-bottom:4rem}.tab-content-container .content{height:34vh;padding-top:2rem}.tab-content-container .content .no-stats,.tab-content-container .content .no-transaction-info{font-weight:600;font-size:1.4rem;text-align:center}.transaction-container{height:100%;overflow-y:auto}.transaction-container .container-row{padding:1.4rem 1.6rem;background-color:#fcfcfc;border-radius:1.6rem}.transaction-container .container-row:not(:last-child){margin-bottom:1rem}.transaction-container div[class^=col-]{display:flex;align-items:center}.transaction-container div[class^=col-]:last-child{justify-content:flex-end}.transaction-container .transaction-description{font-weight:500;font-size:1.3rem;color:#000}.transaction-container .balance{font-weight:600;font-size:1.3rem;color:#00a86b}
