.auth-loading{text-align:center;font-size:1.5em;margin-top:2em}.app-error{text-align:center;padding:1rem}.app-top{background-color:var(--color-grey-lighten-4);margin-bottom:1rem;display:grid;grid-template-areas:"form" "stats";row-gap:1rem}@media (min-width: 68.75em){.app-top{grid-template-columns:1fr 1fr;column-gap:2rem;grid-template-areas:"form stats"}}.app-top .new-transaction{grid-area:form;margin:.5rem 2.5%}@media (min-width: 42.5em){.app-top .new-transaction{margin-left:5%;margin-right:5%}}.app-top .global-stats{grid-area:stats;margin:.5rem 2.5%}@media (min-width: 42.5em){.app-top .global-stats{margin-left:5%;margin-right:5%}}.app-bottom{width:95%;margin:0 auto 2em}@media (min-width: 42.5em){.app-bottom{width:90%}}.popup-dialog [role=dialog]{width:90vw}.popup-dialog h4{font-size:1.1rem;font-weight:700}.user{z-index:20}@media (min-width: 42.5em){.user{right:5%}}.user img{border-radius:50%;cursor:pointer;width:2.5em}.user .profile{background-color:#fff;border-radius:2px;box-shadow:0 2px 10px #0003;display:none;list-style:none;margin:0;padding:0;width:max-content;position:absolute;top:3.5rem;right:5%}.user li{padding:1rem}.user .settings,.user .recurring{cursor:pointer}.user .jwt-token{display:none;max-width:40rem;word-break:break-all}@media (min-width: 68.75em){.user .jwt-token{display:list-item}}.user .logout{background-color:var(--color-grey-lighten-4);border-top:1px solid var(--color-grey-lighten-2);cursor:pointer}.user .logout:hover{background-color:var(--color-grey-lighten-2)}.user.profile-active .profile{display:block}.header{background-color:var(--color-green);width:100%;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:10}.header h1{color:var(--color-grey-lighten-4);font-family:Shadows Into Light Two,cursive;margin:0 0 0 5%;padding:.625rem 0}.header .user{margin:0 5% 0 0;padding:.625rem 0}.header .display-from{margin:0}.login{padding-top:5em;text-align:center}.login .btn{background-color:var(--color-light-blue-darken-1);border-color:var(--color-light-blue-darken-4);color:var(--color-grey-lighten-4);font-size:1.5em}.login .btn:hover{background-color:var(--color-light-blue-darken-2)}label{margin-right:.5em;margin-top:.3rem;text-align:right;width:5em}@media (max-width: 42.4em){label:not(:focus):not(:active){clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}}@media (min-width: 42.5em){label{margin-right:.5em}}@media (min-width: 68.75em){label{margin-right:1em}}.new-transaction{display:grid;justify-content:space-between;align-content:baseline;grid-template-columns:48% 48%;row-gap:1rem}.new-transaction [data-form-name=memo] textarea{height:calc(2.25rem + 2px)}.new-transaction .actions{grid-column:2;display:flex;justify-content:flex-end}.new-transaction .actions [type=submit]{order:1;text-transform:capitalize}.new-transaction .actions button+button{margin-right:.7rem}.new-transaction .input-group{width:100%}@media (min-width: 42.5em){.new-transaction .input-group{width:calc(100% - 5.5em)}}@media (min-width: 68.75em){.new-transaction .input-group{width:calc(100% - 6em)}}.new-transaction .input-group .hint{cursor:help}.new-transaction .react-hint__content{font-size:.8rem}.chart{display:grid;grid-template-columns:38px 1fr;grid-template-areas:". chart-top" "y-axis chart-body" "spacer x-axis";width:100%}.chart .chart-top{grid-area:chart-top}.chart .nav{justify-self:center;justify-content:space-around;margin-bottom:1rem;width:100%}.chart .nav button{border:1px solid rgba(0,0,0,.2)}.chart .y-axis{grid-area:y-axis;border-right:1px solid rgba(0,0,0,.2);padding-right:.5rem;display:flex;flex-direction:column-reverse}.chart .y-axis .interval{text-align:right}.chart .y-axis .label{font-size:.8em;top:-.75rem;position:relative}.chart .x-axis{grid-area:x-axis;border-top:1px solid rgba(0,0,0,.2)}.chart .chart-body{grid-area:chart-body;align-self:end}.chart .chart-body .chart-column{cursor:pointer}.chart .chart-body .chart-column.has-popup-open,.chart .chart-body .chart-column:hover{background-color:#0003}.chart .grid-lines{grid-area:chart-body;display:flex;flex-direction:column;justify-content:flex-end}.chart .grid-lines .interval{border-top:1px dotted rgba(0,0,0,.2)}.chart .spacer{grid-area:spacer;border-top:1px solid rgba(0,0,0,.2);border-right:1px solid rgba(0,0,0,.2);padding-top:.5rem}.categories-chart .weeks-columns,.categories-chart .weeks-labels{display:flex;flex-direction:row-reverse;justify-content:space-between;padding-left:.25rem}@media (min-width: 42.5em){.categories-chart .weeks-columns,.categories-chart .weeks-labels{padding-left:.5rem}}.categories-chart .week-column,.categories-chart .week-label{width:1.5rem}@media (min-width: 42.5em){.categories-chart .week-column,.categories-chart .week-label{width:2.5rem}}.categories-chart .week-label{font-size:.8em}.week-column{display:flex;flex-direction:column-reverse}.cashflow-chart .months-graph,.cashflow-chart .months-labels{display:flex;flex-direction:row-reverse;justify-content:space-between;padding-left:.25rem}@media (min-width: 42.5em){.cashflow-chart .months-graph,.cashflow-chart .months-labels{padding-left:.5rem}}.cashflow-chart .cashflow-column{display:grid;grid-template-areas:"main";align-items:end}.cashflow-chart .debit-column{grid-area:main}.cashflow-chart .credit-column{grid-area:main;width:1rem;margin:0 auto}@media (min-width: 42.5em){.cashflow-chart .credit-column{width:1.5rem}}.cashflow-chart .debit-column,.cashflow-chart .credit-column{display:flex;flex-direction:column-reverse}.cashflow-chart .debit-column,.cashflow-chart .month-label{width:1.5rem}@media (min-width: 42.5em){.cashflow-chart .debit-column,.cashflow-chart .month-label{width:2.5rem}}.cashflow-chart .month-label{font-size:.8em}.cashflow-column .bar-piece{background-color:var(--color-blue-grey-lighten-4)}.cashflow-column .debit-column [data-account-index="0"]{background-color:var(--color-light-green-accent-4)}.cashflow-column .debit-column [data-account-index="1"]{background-color:var(--color-light-green-accent-3)}.cashflow-column .debit-column [data-account-index="2"]{background-color:var(--color-light-green-accent-2)}.cashflow-column .debit-column [data-account-index="3"]{background-color:var(--color-light-green-accent-1)}.cashflow-column .credit-column [data-account-index="0"]{background-color:var(--color-red-lighten-2)}.cashflow-column .credit-column [data-account-index="1"]{background-color:var(--color-red-lighten-3)}.cashflow-column .credit-column [data-account-index="2"]{background-color:var(--color-red-lighten-4)}.cashflow-column .credit-column [data-account-index="3"]{background-color:var(--color-red-lighten-5)}.flow-details{margin-bottom:1rem}.flow-details h5{font-weight:600;text-transform:capitalize}.flow-details .total{font-weight:600}.version-selector{margin-left:3rem}.budget-stat{color:var(--color-grey);font-style:italic}.sub-budget-tally-short{color:var(--color-green)}.sub-budget-tally-exceed{color:var(--color-red-lighten-3)}.global-stats .tabs-selector{max-width:100dvw}.global-stats .tab-content{margin-top:1rem}.global-stats .MuiTabs-indicator{background:none}.global-stats .Mui-selected{background-color:var(--color-grey-lighten-2)}.global-stats [role=tab]{border-right:2px solid var(--color-grey-lighten-2);border-bottom:2px solid var(--color-grey-lighten-2)}.global-stats [role=tab]:last-of-type{border-right:none}.stats .table{width:100%}@media (min-width: 42.5em){.stats .table{width:50%}}@media (min-width: 68.75em){.stats .table{width:100%}}.table .stat>td{border-top:none}.stat .total{font-weight:700}.carousel-indicators li{background-color:#000}.carriedover-transactions{padding:.5rem .75rem}.stat-popover{padding:1rem}.explanation{display:inline-grid;grid-template-columns:1fr 1fr;justify-content:space-between;column-gap:2rem;row-gap:1rem}.weekly{padding-bottom:1rem;border-bottom:1px solid var(--color-grey-lighten-2)}.weekly:last-of-type{border-bottom:none}.week-title{grid-area:title}.weekly-transactions{margin:0}.weekly-transactions tr{display:flex;flex-flow:row wrap}@media (min-width: 42.5em){.weekly-transactions tr{display:table-row}}.weekly-transactions td,.weekly-transactions th{width:25%;padding:.5rem}@media (min-width: 42.5em){.weekly-transactions td,.weekly-transactions th{padding:.75rem}}.week-secondary{grid-area:secondary;margin-bottom:1rem}.week-stats{margin-bottom:1rem}.week-stats h6{margin:1rem 0 .75rem}.week-stats h6 svg{margin-left:.3rem;margin-bottom:.2rem}.week-stats details summary{font-size:1.25rem}.week-stats .categories-stats{margin-top:.75rem}.week-stats .categories-stats td{padding:.45rem .75rem}.week-stats .stat .stat-label{position:relative}.week-stats .stat details{margin-left:.5rem;display:inline-block}.week-stats .stat details summary{font-size:1rem}.week-stats .stat details .category-transactions{position:absolute;left:2rem;margin-top:.5rem;z-index:1;background-color:#fff;border:1px solid rgba(0,0,0,.2);border-radius:5px;padding:1rem .75rem 1rem 2rem;width:max-content}.week-stats .stat details .category-transactions td{padding:.25rem}.week-stats .stat details .carried-over{font-style:italic}.applicable-recurring .recurring-item{margin:.45rem 0}.transaction{clear:left;cursor:pointer}@media (min-width: 42.5em){.transaction{cursor:default}}.transaction [data-field=day]{width:3.5rem}.transaction [data-field=action]{width:4rem}.transaction [data-field=merchant]{width:calc(100% - 20px - 14rem);word-break:break-word}.transaction [data-field=amount]{color:#fff;width:6.5rem}.transaction [data-field=amount] .span-hint{margin-right:0}@media (min-width: 42.5em){.transaction [data-field=amount]{width:8rem}}.transaction [data-field=credit-account],.transaction [data-field=debit-account]{background-color:var(--color-blue-grey-lighten-4);width:10px;cursor:pointer;padding:0}.transaction [data-field=credit-account][data-account-name=expense],.transaction [data-field=debit-account][data-account-name=expense]{background-color:var(--color-red-lighten-3)}.transaction [data-field=credit-account][data-account-name=income],.transaction [data-field=debit-account][data-account-name=income]{background-color:var(--color-light-green-accent-4)}.transaction [data-field=credit-account][data-account-name=schwab],.transaction [data-field=debit-account][data-account-name=schwab]{background-color:var(--color-cyan)}.transaction [data-field=credit-account][data-account-name=travel],.transaction [data-field=debit-account][data-account-name=travel]{background-color:var(--color-blue)}.credit-account-popover h4,.debit-account-popover h4,.amount-popover h4{font-size:.9em;margin-bottom:0}.actions-popover div{cursor:pointer;padding:.5rem}.actions-popover div:hover{background-color:var(--color-grey-lighten-4)}.compact-transaction{display:flex;gap:.5em}.compact-transaction .status{display:flex;align-items:center}.transactions{position:relative}.transactions .filter{position:absolute;right:0;width:40%;top:-.5rem}@media (min-width: 68.5em){.transactions .filter{width:auto}}@media (min-width: 68.75em){.transactions .filter{top:-2rem}}.transactions-loading{margin:0 auto;width:2rem}.transactions-container{margin-top:1rem;display:grid;grid-template-areas:"title" "primary" "secondary";row-gap:1rem}@media (min-width: 68.75em){.transactions-container{grid-template-areas:"title title" "primary secondary";grid-template-columns:2fr 1fr;column-gap:2rem}}.transactions-container .transactions-list{grid-area:primary}.cashflow th,.cashflow td{border-right-width:1px}.cashflow th:last-of-type,.cashflow td:last-of-type{border-right-width:0}.cashflow tr.highlight{font-weight:700;text-transform:capitalize}.user-settings .MuiDialogContent-root{display:grid;gap:1rem;grid-template-areas:"profile" "accounts" "categories"}@media (min-width: 42.5em){.user-settings .MuiDialogContent-root{grid-template-areas:"profile accounts" "categories categories";grid-template-rows:auto 1fr}}@media (min-width: 68.75em){.user-settings .MuiDialogContent-root{grid-template-areas:"profile accounts" "categories categories"}}.user-settings .profile{grid-area:profile}.user-settings .profile .profile-fields{display:grid;grid-template-columns:40% 1fr;column-gap:1rem}.user-settings .list{flex-basis:18rem}.user-settings .list.accounts{grid-area:accounts}.user-settings .list.categories{grid-area:categories}.user-settings .item{display:flex;justify-content:space-between;align-items:center;margin:.5rem 0;padding:.3rem;gap:.3rem}.user-settings .item:hover{background-color:var(--color-grey-lighten-4)}.user-settings .color-swatch-picker{position:relative;flex-shrink:0}.user-settings .color-swatch-picker .current-swatch{display:block;width:1.5rem;height:1.5rem;border-radius:3px;border:1px solid var(--color-grey-lighten-2)}.user-settings .color-swatch-picker .color-swatches{position:absolute;z-index:10;display:grid;grid-template-columns:repeat(6,1.5rem);gap:2px;padding:.4rem;background:#fff;border:1px solid var(--color-grey-lighten-2);border-radius:4px;box-shadow:0 2px 8px #00000026}.user-settings .color-swatch-picker .swatch{width:1.5rem;height:1.5rem;border:1px solid var(--color-grey-lighten-2);border-radius:2px;cursor:pointer;padding:0}.user-settings .color-swatch-picker .swatch:hover{outline:2px solid var(--color-blue-grey-darken-4);outline-offset:1px}.user-settings .item-actions{display:flex;column-gap:.2em}.user-settings .to-be-added{color:var(--color-green)}.user-settings .to-be-removed{color:var(--color-red-lighten-3);text-decoration:line-through}a:not([href]){color:inherit;text-decoration:none}.span-hint{color:#212529;margin:0 .5em}.span-hint svg{cursor:help}.legend{border-radius:3px;display:inline-block;margin-right:.7rem;width:.7rem;height:1.3rem}.badge,.legend,.bar-piece{background-color:var(--cat-color, var(--color-blue-grey-darken-4))}.sr-only:not(:focus):not(:active){clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.form-group{display:flex}.icon-button{background-color:transparent;padding:0;border:none;margin-left:1em}.icon-button:hover{color:var(--color-light-blue)}.text-popover{padding:.75rem;font-size:.9rem}.recurring{padding:1rem 0}.recurring .item{display:flex;justify-content:space-between;align-items:center;margin:.5rem 0;padding:.3rem;gap:.3rem}.recurring .item .buttons{display:flex;gap:.3rem}.recurring .item:hover{background-color:var(--color-grey-lighten-4)}
