:root{--font-primary: rgba(245, 245, 245, .806);--background: #474e5a;--foreground: #15191f;--dark-secondary: #31353a73;--inputBackground: lightgray}body{background-color:#474e5a}.layout-container{padding:1rem;display:flex;flex-direction:column;gap:1rem;min-width:300px}.header{background-color:#15191f;border-radius:10px;order:-1;display:flex;justify-content:space-between;padding:1rem}.dashboard{background-color:#15191f;border-radius:10px;padding:1rem}.content{background-color:#15191f;border-radius:10px}.hamburger{display:none}.logo{display:flex;align-items:center}.logo img:hover{cursor:pointer}.logo img{width:33px}.logged-in{display:flex;align-items:center;color:#f5f5f5;color:#f5f5f5ce}.user-icon{display:flex;align-items:center}.user-icon:hover,.logout{cursor:pointer}.welcome{padding-left:.5rem}.logout{padding:.5rem;border-radius:25px;background-color:#d3d3d31b;margin-left:1rem}.dash-dropdown{display:flex;justify-content:space-between;align-items:center}.dash-dropdown:hover{cursor:pointer}.dash-dropdown h2{color:#f5f5f5ce;font-size:1.3rem}.dash-arrow-wrapper{display:flex;align-items:center}.dash-right-arrow{width:25px}.dash-right-arrow.open{transform:rotate(90deg)}.dash-options-desktop{display:none}.dash-options{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}.dash-options li{color:#f5f5f5ce;border-radius:25px;padding:.75rem;background-color:#31353a73;text-align:center}.dash-options li:hover{cursor:pointer;color:#f5f5f5}.expenses-menu-item.selected,.income-menu-item.selected,.debt-menu-item.selected{border:solid 1px aquamarine}.expense-content-container{padding:1rem;display:flex;gap:1rem;flex-direction:column;color:var(--font-primary)}.expense-table-container{max-height:300px;overflow-y:auto;scrollbar-width:none;border-radius:5px}.expense-table-headers{display:flex;border-top:solid gray 1px;border-left:solid gray 1px;border-right:solid gray 1px;border-top-left-radius:5px;border-top-right-radius:5px}.expense-table-headers li{flex:1;padding:.25rem;display:flex;align-items:center;justify-content:center}.expense-table-headers li:nth-child(2){border-left:solid gray 1px;border-right:solid gray 1px}.expense-row-container{display:flex;border-top:1px black solid}.expense-row-container .expense-row-inputs:nth-child(2){border-left:black solid 1px;border-right:black solid 1px}.expense-row-inputs{flex:1;display:flex;background-color:#d3d3d3;padding:.25rem}.expense-row-inputs:last-child{background-color:#d3d3d3}.expense-row-inputs input,.net-total-container input{width:100%;background-color:#d3d3d3;border:none}.delete-row{position:absolute;right:.5rem;font-size:xx-small;visibility:hidden;opacity:0;transition:opacity .2s ease-in,visibility 0s linear .2s}.expense-row-container:hover .expense-row-inputs:last-of-type .delete-row{visibility:visible;opacity:1;transition-delay:0s;cursor:pointer}.expense-row-container:last-of-type>.expense-row-inputs:first-child{border-bottom-left-radius:5px}.expense-row-container:last-of-type>.expense-row-inputs:last-child{border-bottom-right-radius:5px}.expense-row-inputs input[type=text]:focus,.expense-row-inputs input[type=number]:focus{outline:none}.checkbox-container{display:flex;justify-content:center;position:relative}.checkbox-container input{width:15px}.add-row{align-self:flex-start;font-size:x-large;color:#d3d3d3;margin-top:1px;padding:.25rem;display:inline-block}.add-row:hover{cursor:pointer;color:#fff}.monthly-total-container,.monthly-remaining-container,.net-monthly-container{display:flex;flex-direction:column;border:1px gray solid;align-items:center;border-radius:5px}.monthly-total-label,.monthly-remaining-label{padding:.25rem;text-align:center}.monthly-total-amount,.monthly-remaining-amount,.net-total-container{width:100%;background-color:#d3d3d3;text-align:center;color:#000;padding:.25rem;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.remaining-expense-donut{display:flex;justify-content:center;padding:1rem;min-height:250px}.monthly-expendable-container{border:1px solid gray;border-radius:5px}.expendable-income-bar{display:flex;justify-content:center;padding:1rem;min-height:250px}.net-monthly-container input{display:flex;justify-content:center;align-items:center;text-align:center;font-size:medium}.net-monthly-container input:focus{outline:none}.sheets-container{display:flex;gap:1rem;align-items:center;margin-bottom:-1rem;position:relative}.hamburger-sheets-container{display:flex;justify-content:center;align-items:center;background-color:#d3d3d31b;padding:.5rem;border-radius:50%;transition:all .5s ease}.hamburger-sheets-container:hover{cursor:pointer;background-color:var(--background)}.hamburger-sheets-container img{width:25px;filter:invert()}.current-sheet-mobile{display:flex;justify-content:space-between;align-items:center;width:100%;background-color:var(--dark-secondary);border-radius:10px;position:relative}.current-sheet-mobile:hover{cursor:pointer}.current-sheet{display:flex;justify-content:space-between;align-items:center;width:100%;background-color:var(--dark-secondary);border-radius:15px;position:relative}.current-sheet:hover{cursor:pointer}.current-sheet-desktop{display:none}.sheet-arrow-container{display:flex;justify-content:center;align-items:center;padding:.25rem;margin-right:.5rem;transition:transform .5s ease;background-color:var(--foreground);border-radius:50%;z-index:5}.sheet-arrow-container.rotated{transform:rotate(-90deg)}.sheet-arrow-container:hover{cursor:pointer}.sheet-arrow-container img{width:20px;transform:translate(1px)}.sheet-container{display:flex;justify-content:space-between;align-items:center;border-bottom:1px rgba(128,128,128,.255) solid;padding:1rem}.sheet-label{padding:.75rem;white-space:nowrap;overflow:auto}.sheet-container:hover{cursor:pointer;background-color:var(--dark-secondary)}.sheet-overlay-backdrop.show{position:fixed;inset:0;background:#00000057;z-index:51}.sheet-overlay{height:40vh;position:fixed;border-radius:10px;bottom:0;left:0;right:0;z-index:5;background-color:var(--foreground);overflow-y:scroll;scrollbar-width:none;transform:translateY(100%);transition:transform 1.25s ease}.sheet-overlay.show{transform:translateY(0)}.sheet-menu{position:absolute;background-color:var(--foreground);border-radius:10px;width:100px;right:0;top:-6.5rem;box-shadow:0 1px 3px #000000b3;visibility:hidden;z-index:5;opacity:0;transform:translateY(4px) scale(.98);transition:opacity .5s ease,transform .5s ease}.sheet-menu.show{opacity:1;transform:translateY(0) scale(1);visibility:visible}.sheet-menu div{padding:1rem;background-color:var(--dark-secondary)}.sheet-menu div:hover{cursor:pointer}.rename-sheet{border-top-left-radius:10px;border-top-right-radius:10px}.rename-sheet:hover{background-color:var(--background)}.delete-sheet{border-bottom-left-radius:10px;border-bottom-right-radius:10px}.delete-sheet:hover{background-color:#ff000084}.sheet-label-input{outline:none;background-color:var(--inputBackground);border-radius:5px;border:none;padding:.25rem .5rem;font-size:.75rem}.add-sheet{margin:1rem;padding:.75rem;border-radius:25px;background-color:var(--dark-secondary);border:solid 1px var(--dark-secondary);color:var(--font-primary);font-size:.9rem}.add-sheet:hover{cursor:pointer;border-color:var(--background)}.spinner{display:flex;justify-content:center;align-items:center;padding:1rem}.spinner img{max-width:100px}.menu-overlay{position:fixed;inset:0;background:#2c2c2c0b;z-index:4}.desktop{display:none}@media (min-width: 720px){.layout-container.no-dash .dashboard{display:none}.layout-container{display:grid;grid-template-columns:250px 1fr;grid-template-rows:65px 1fr;height:100vh;grid-template-areas:"dashboard header" "dashboard content"}.layout-container.no-dash{display:grid;grid-template-columns:250px 1fr;grid-template-rows:65px 1fr;height:100vh;grid-template-areas:"header header" "content content"}.header{grid-area:header}.dashboard{grid-area:dashboard}.content{grid-area:content;overflow-y:auto;min-height:0}.hamburger{width:40px;display:flex;align-self:center;border-radius:25px;transition:all .5s ease}.hamburger:hover{cursor:pointer;background-color:#d3d3d31b}.hamburger img{width:100%;filter:invert(1);padding:.4rem}.logo{display:none}.logo-register{display:block}.dash-arrow-wrapper{display:none}.dash-dropdown{display:flex;justify-content:center;align-items:center}.dash-options{display:none}.dash-options-desktop-container{height:100%;display:flex;flex-direction:column;justify-content:center}.dash-options-desktop{display:flex;flex-direction:column;gap:2rem;margin-top:1rem}.dash-options-desktop li{color:#f5f5f5ce;padding:.75rem;border-radius:15px;background-color:#31353a73;text-align:center}.dash-options-desktop li:hover{cursor:pointer;background-color:#474e5a;color:#f5f5f5}.dash-dropdown:hover{cursor:auto}.expenses-menu-item.selected,.income-menu-item.selected,.debt-menu-item.selected{border:none;background-color:var(--background)}.expense-content-container{display:grid;height:100%;gap:1rem;align-items:start;justify-items:stretch;grid-template-columns:minmax(300px,500px) 1fr 1fr;grid-template-rows:1fr 1fr 60px;grid-template-areas:"exp-table net-income total-exp" "exp-table remaining expendable" "exp-table remaining expendable" "sheets sheets sheets"}.expense-table-container{min-width:300px;max-width:500px;max-height:95%;justify-self:start;width:100%;position:relative;overflow-y:auto}.table-with-add{grid-area:exp-table;height:100%}.add-row{margin-top:1px}.net-monthly-container{grid-area:net-income}.monthly-total-container{grid-area:total-exp}.monthly-remaining-container{grid-area:remaining;grid-row-start:1;margin-top:5rem}.monthly-expendable-container{grid-area:expendable;border:solid 1px gray;border-radius:5px;grid-row-start:1;margin-top:5rem}.sheets-wrapper{grid-area:sheets;display:flex;align-items:center;margin-bottom:-1rem;gap:1rem}.remaining-expense-donut,.expendable-income-bar{max-height:250px;min-width:250px}.current-sheet-mobile{display:none}.current-sheet.desktop{max-width:25%}.current-sheet-desktop:hover{cursor:pointer}.current-sheet.selected{background-color:var(--background)}.mobile{display:none}.desktop{display:flex}.new-sheet-container{width:40px;height:40px;display:flex;justify-content:center;align-items:center;padding:1.25rem;background-color:var(--dark-secondary);border-radius:50%;transition:all .5s ease}.new-sheet-container:hover{cursor:pointer;background-color:var(--background)}.new-sheet{font-size:1.5rem;transform:translateY(-1px)}.sheets-container{margin-bottom:auto;width:100vw}.sheets-container>:nth-child(n+15){display:none}.sheets-container::-webkit-scrollbar{display:none}.sheet-scroll-buttons-container{display:flex;gap:1rem}.scroll-left-container,.scroll-right-container{display:flex;justify-content:center;align-items:center;background-color:var(--dark-secondary);padding:.7rem;border-radius:25px;transition:all .5s ease}.scroll-left-container:hover,.scroll-right-container:hover{cursor:pointer;background-color:var(--background)}.scroll-left-button{transform:translate(-1px)}.scroll-right-button{transform:translate(2px)}.sheet-overlay{height:40vh;position:fixed;border-radius:10px;left:40%;right:40%;min-width:300px;bottom:0;z-index:5;background-color:var(--foreground);overflow-y:scroll;transform:translateY(100%);transition:transform 1s ease}}.debt-title{color:#f5f5f5ce;padding:1rem;text-align:center;min-height:300px}.income-title{color:#f5f5f5ce;padding:1rem;text-align:center;min-height:300px}*{box-sizing:border-box;padding:0;margin:0;list-style:none;font-family:Nunito,sans-serif}.signup-container{display:flex;flex-direction:column;gap:1rem;padding:1rem;min-height:100vh;min-width:300px}.signup-header{color:#f5f5f5e8;background-color:#15191f;border-radius:10px;display:flex;justify-content:center;align-items:center;padding:.75rem}.signup-content{background-color:#15191f;border-radius:10px;display:flex;flex-direction:column;align-items:center;flex:1;padding:1rem;gap:1rem}.demo-option{font-size:large;font-weight:600;border-radius:10px;padding:.5rem;background:linear-gradient(135deg,#16a050df,#79e835);border:none;color:#000000b7;width:100%;max-width:400px;margin-bottom:1rem;margin-top:1rem}.demo-option:hover{cursor:pointer}.signup-form{color:#f5f5f5f3;display:flex;flex-direction:column;gap:1rem;width:100%;max-width:400px}.sign-header{text-align:center;color:#d6d6d6f3;border-top:solid gray 1px;padding-top:1rem}.email-wrapper,.password-wrapper,.form-input-wrapper{display:flex;flex-direction:column}.signup-form label{color:#f5f5f5d9;margin-bottom:5px}.signup-form input{background-color:#d3d3d3e0;border:none;outline:none;border-radius:8px;padding:.5rem;font-size:large}.signup-button{margin-top:1rem;font-size:large;font-weight:600;border-radius:10px;padding:.5rem;background:linear-gradient(135deg,#16a050df,#79e835);border:none;color:#000000b7}.signup-button:hover{cursor:pointer}.signup-content p{color:#f5f5f5d9;font-size:medium;display:flex;justify-content:center}a{color:#90ee90e3;text-decoration:none;margin-left:5px}.demo-option,.signup-button{background:linear-gradient(135deg,#16a050df,#79e835,#16a050df);background-size:200% 200%;transition:background-position 2s ease,box-shadow 2s ease,color 1s ease-in-out}.demo-option:hover,.signup-button:hover{box-shadow:0 0 5px #ffffff38;background-position:right center;color:#f5f5f5}