:root{--bg-color-a: #eeeeef;--bg-color-b: #cccddf;--bg-color-c: #ddd;--text-color-a: #333;--text-color-b: #555;--border-color: #555;--outline-color: #48e;--transparent-color: #48e3;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#ffffffde;color-scheme:dark;background-color:#333;scrollbar-width:thin;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box;margin:0;padding:0}.dark{--bg-color-a: #111224;--bg-color-b: #333446;--bg-color-c: #2d3064;--text-color-a: #fff;--text-color-b: #eee;--border-color: #aaa;--transparent-color: #48e1;color-scheme:dark}body{background-color:var(--bg-color-b);min-height:100dvh;color-scheme:light}.layout-container{min-height:100vh;height:100%;display:flex;flex-direction:column;justify-content:space-evenly}h1{display:none;top:0;left:70px;position:absolute;color:var(--text-color-a)}select,input[type=date]{cursor:pointer}.width-padding-container{flex:1;margin:0}@media screen and (min-width: 600px){.width-padding-container{padding:0 10px}.expenses-table{border-radius:10px}}.button{border:none;border-radius:8px;padding:8px 10px;cursor:pointer;font-weight:700;display:flex;align-items:center;justify-content:center;gap:10px;color:#fff;background-color:#5409da;transition:scale .3s ease,transform .3s ease}.button:hover{scale:1.05}.button:active{opacity:.8}.button.close{background-color:transparent;color:var(--text-color-a);padding:0}.button.close:hover{transform:rotate(90deg);scale:1;color:var(--outline-color)}.button.delete{background-color:#d37;padding:5px}.button.edit{background-color:#26c;padding:5px}.button.add{background-color:#26c}.button.save{background-color:#3d7}.button.discard{background-color:#d37}.close-button-container{display:flex;justify-content:end}.max-width{max-width:1800px;margin:auto}.options-container{display:flex;gap:10px;justify-content:end}.blur{background-color:#0002;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);width:100%;height:100dvh;position:fixed;top:0;left:0;display:none;place-items:center;z-index:20}.flex-column-container{display:flex;flex-direction:column;gap:5px}.flex-row-container{display:flex;gap:10px;align-items:center}.input{padding:10px;border-radius:8px;border:1px solid var(--border-color);border-bottom:3px solid var(--border-color);background-color:var(--bg-color-a);color:var(--text-color-a);transition:border-bottom-color .3s ease}.input:focus-visible{outline:none;border-bottom-color:#48e}.theme-selector{border-radius:10px;border:none;background-color:var(--bg-color-a);padding:0 10px;font-weight:700;color:var(--text-color-a)}.theme-selector:focus-visible{outline:none}.header{position:sticky;top:0;background-color:var(--transparent-color);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);padding:10px;margin-bottom:30px;box-shadow:0 0 10px #0006;z-index:10}.expense-filter-section{position:absolute;left:0;right:0;margin:auto;width:fit-content;height:auto;display:none;background-color:var(--bg-color-a);color:var(--text-color-a);flex-direction:column;padding:10px;gap:20px;border-radius:8px}.expense-filter-header{width:100%;display:flex;justify-content:space-between;border-bottom:2px solid var(--border-color);color:var(--text-color-b);align-items:center;padding-bottom:10px}.expense-filter{display:flex;flex-direction:column;gap:20px;margin:0 auto}.expense-filter .filter{display:flex;flex-direction:column;border-radius:8px;padding:10px;gap:10px}.expense-filter .filter label{font-size:1.1em}.expense-form{background-color:var(--bg-color-a);color:var(--text-color-a);flex-direction:column;padding:20px;border-radius:10px;width:300px;margin:0 auto;gap:10px;display:none;position:absolute;left:0;right:0}.expense-form .category-error{color:#f44}.visible{display:flex}.expense-charts{position:absolute;left:0;right:0;width:fit-content;border-radius:10px;margin:0 auto;display:none;background-color:var(--bg-color-a);color:var(--text-color-a);flex-direction:column;padding:10px;align-items:center;z-index:30}.expense-charts .total-amount{font-size:1.1em;margin-top:10px}.modal{opacity:0;transform:translateY(30px);transition:transform .3s ease,opacity .3s ease,display .3s ease allow-discrete}.modal.opened{opacity:1;transform:translateY(0);display:flex;transition:transform .3s ease,opacity .3s ease}@starting-style{.modal.opened{opacity:0;transform:translateY(30px)}}.expenses-table{background-color:var(--bg-color-a);border-collapse:collapse;margin:0 auto;width:100%;color:var(--text-color-a);font-size:.8em}.expenses-table th{text-align:start}.expenses-table th:last-child{display:none}.expenses-table th{color:var(--text-color-b)}.expenses-table th,.expenses-table td{padding:5px}.expenses-table .cell{animation:showDown .3s ease both}.expenses-table td{border-top:2px solid var(--border-color)}.expenses-table td #category{border-radius:7px;padding:2px 5px}.expenses-table .edit-cell{width:100%;display:flex;flex-direction:column;justify-content:space-between;gap:20px;animation:show .3s ease both}.expenses-table .edit-cell .edit-inputs{display:flex;gap:20px;flex-wrap:wrap;align-items:center}.expenses-table .edit-cell .edit-inputs .input-wrapper{display:flex;flex-direction:column;gap:5px}.expenses-table .edit-cell .edit-inputs .input-wrapper label{font-size:15px}.expenses-table .edit-cell .flex-row-container{justify-content:end}.footer{height:100px;color:var(--text-color-a);background-color:var(--bg-color-c);padding:30px;margin-top:30px}.footer p{text-align:center}.grid-dashboard{width:100%;height:100%;flex:1;display:grid}.Housing{background-color:#48e8}.Utilities{background-color:#4f06}.Transportation{background-color:#4888}.Groceries{background-color:#4ee6}.Health{background-color:#84e8}.Insurance{background-color:#8e76}.Entertainment{background-color:#bc96}.Education{background-color:#8448}.Shopping{background-color:#e488}.Travel{background-color:#e848}.Gifts{background-color:#e888}.Saving{background-color:#e448}.Investments{background-color:#fe86}.Miscellaneous{background-color:#6668}.option-button-text{display:none}.button[title=print],.button[title="show charts"]{display:flex}.loader{position:absolute;margin:auto;top:300px;left:0;right:0;width:40px;height:40px;border-radius:50%;border:4px solid #48e;border-top:4px solid transparent;animation:spin 1s ease infinite}@media screen and (min-width: 400px){.expenses-table{font-size:1em}}@media screen and (min-width: 450px){.expenses-table th,.expenses-table td{padding:10px}}@media screen and (min-width: 540px){.option-button-text{display:block}}@media screen and (min-width: 950px){.options-container .button{display:none}.options-container .button[title=print],.options-container .button[title="toggle theme"],.options-container .button[title="show charts"]{display:flex}.blur:has(.expense-filter-section){display:flex;width:fit-content;height:fit-content;position:sticky;top:85px;background-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;z-index:1}h1{display:block}.expense-filter-section{display:flex;position:sticky;top:85px;left:0;opacity:1;border-radius:0 10px 10px 0;z-index:1;transform:translateY(0);height:auto}.expense-filter-section.modal{transition:none}.expense-filter-header .button{display:none}.expense-charts .expense-filter-header .button{display:flex}.expenses-table{font-size:1.1em}.expenses-table th:last-child{display:flex}.grid-dashboard{grid-template-columns:auto 1fr auto;margin:0 auto}}@media screen and (min-width: 1280px){.options-container .button[title="show charts"]{display:none}.blur:has(.expense-charts){display:flex;width:fit-content;height:fit-content;position:sticky;top:85px;background-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;z-index:1}.expense-charts{position:sticky;top:85px;opacity:1;display:flex;height:fit-content;border-radius:10px 0 0 10px;transform:translateY(0);z-index:1}.expense-charts .expense-filter-header .button{display:none}.expense-charts.modal{transition:none}}@media screen and (min-width: 1800px){.expense-filter-section,.expense-charts{border-radius:10px}}@media print{.header,.footer{display:none}.grid-dashboard{display:flex;align-content:start;gap:20px;padding:20px 20px 20px 0;max-width:1300px;margin:0 auto}.expenses-table{width:100%;flex:1;border-radius:10px;font-size:1.2em}.expenses-table th:last-child,.expenses-table td:last-child{display:none}.expenses-table th,.expenses-table td{padding:10px}.blur:has(.expense-charts){display:flex;width:fit-content;height:fit-content;position:static;background-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;z-index:1}.expense-charts{position:static;opacity:1;display:flex;height:fit-content;border-radius:10px 0 0 10px;transform:translateY(0);z-index:1}.expense-charts .expense-filter-header .button{display:none}.expense-charts.modal{transition:none}}@media (prefers-reduced-motion: reduce){.cell{animation:none}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes show{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes showDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}
