/* spendingtracker-server/Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-nsgywoc14j] {
    height: 100%;
    font-family: var(--bs-font-sans-serif);
}

[b-nsgywoc14j] .icon-back {
    -webkit-mask-image: url("SpendingTracker/images/back.svg");
    mask-image: url("SpendingTracker/images/back.svg");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    width: 1rem;
    height: 1rem;
    background-repeat: no-repeat;
    background-color: var(--dxbl-btn-color);
}

[b-nsgywoc14j] .content {
    overflow: auto;
}

[b-nsgywoc14j] .back-button:hover .icon-back {
    background-color: var(--dxbl-btn-hover-color);
}

@media (max-width: 768px) {
    [b-nsgywoc14j] .layout-sidebar {
        grid-area: header / header / header / header !important;
    }
}
/* spendingtracker-server/Components/Layout/NavMenu.razor.rz.scp.css */
#sidebar[b-5wzmonpj53] {
    min-width: 15rem;
    max-width: 15rem;
    box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.16);
    transition: transform 0.1s ease-out;
    height: 100%;
    max-height: 100%;
    background-image: linear-gradient(180deg, var(--bs-primary) 0%, var(--bs-black) 150%);
}

[b-5wzmonpj53] .sidebar-header {
    padding: 2rem 1rem;
}

.logo[b-5wzmonpj53] {
    text-align: center;
}

[b-5wzmonpj53] .menu-button-container {
    display: none;
    align-self: center;
}

.menu-button[b-5wzmonpj53] {
    padding: 0.375rem;
    width: 1.875rem;
    height: 1.875rem;
    background-image: url("SpendingTracker/images/menu.svg");
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
}

[b-5wzmonpj53] .menu {
    background-color: inherit;
}

    [b-5wzmonpj53] .menu .dxbl-menu-item-list {
        gap: 0.5rem;
    }

[b-5wzmonpj53] .menu-item {
    color: var(--bs-white);
}

[b-5wzmonpj53] .icon {
    width: 1rem;
    height: 1rem;
    background-position: center;
    background-repeat: no-repeat;
    margin-left: 0.5rem;
}

[b-5wzmonpj53] .home-icon {
    background-image: url("SpendingTracker/images/home.svg");
}

[b-5wzmonpj53] .weather-icon {
    background-image: url("SpendingTracker/images/weather.svg");
}

[b-5wzmonpj53] .counter-icon {
    background-image: url("SpendingTracker/images/counter.svg");
}

[b-5wzmonpj53] .docs-icon {
    mask-image: url("SpendingTracker/images/doc.svg");
    -webkit-mask-image: url("SpendingTracker/images/doc.svg");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: var(--dxbl-btn-color);
}

[b-5wzmonpj53] .demos-icon {
    mask-image: url("SpendingTracker/images/demos.svg");
    -webkit-mask-image: url("SpendingTracker/images/demos.svg");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: var(--dxbl-btn-color);
}

[b-5wzmonpj53] .footer-button:hover .demos-icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-5wzmonpj53] .footer-button:hover .docs-icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-5wzmonpj53] .footer {
    text-align: center;
    gap: 0.5rem;
    padding-bottom: 1.5rem;
}

#sidebar.expanded[b-5wzmonpj53]  .layout-item {
    display: block;
}

#sidebar.expanded[b-5wzmonpj53]  .footer {
    display: block;
}

@media (max-width: 768px) {
    #sidebar[b-5wzmonpj53] {
        min-width: inherit;
        max-width: inherit;
    }

        #sidebar.expanded[b-5wzmonpj53] {
            position: fixed;
            width: 100%;
            z-index: 3;
        }

            #sidebar.expanded[b-5wzmonpj53]  .sidebar-header {
                border-bottom: 1px solid var(--bs-white);
            }

            #sidebar.expanded .menu-button[b-5wzmonpj53] {
                background-image: url("SpendingTracker/images/close.svg");
            }

        #sidebar:not(.expanded)[b-5wzmonpj53]  .dxbl-gridlayout-root {
            gap: unset !important;
        }

    .logo[b-5wzmonpj53] {
        text-align: inherit;
    }

    [b-5wzmonpj53] .menu-button-container {
        display: block;
    }

    [b-5wzmonpj53] .layout-item {
        display: none;
    }

    [b-5wzmonpj53] .footer {
        display: none;
    }
}
/* spendingtracker-server/Components/Modules/BasicSettings.razor.rz.scp.css */
div.settingsScreen[b-47sgw00e3s] {
    color: black;
    font-size: 8pt;
    background-color: #eaf1fa;
    border: 1px solid #8ba0bc;
    border-radius: 5px;
}
div.settingsHeader[b-47sgw00e3s] {
    border-bottom: 1px solid #bbc8d7;
    background: linear-gradient(180deg, #dee8f5, #cdd9e9);
    font-family: "Barlow", sans-serif;
}

p.settingsHeaderText[b-47sgw00e3s] {
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    color: #1e395b;
    padding-left: 9px;
    padding-right: 11px;
    padding-top: 3px;
    padding-bottom: 6px;
    margin-bottom:0px;
}

div.settingsHint[b-47sgw00e3s] {
    padding-top: 10px;
    height: 75px;
    width: 100%;
    font-weight: bolder;
    font: 11px "Barlow", sans-serif;
    font-size: 8pt;
    text-align: center;
    line-height: 14pt;
}

div.settingsSetupBody[b-47sgw00e3s] {
    margin: 0 auto;
    width: 460px;
    color: black;
    font-weight: normal;
    font-style: normal;
    font: 11px "Barlow", sans-serif;
    font-family: "Barlow", sans-serif;
    font-size: 8pt;
    color: black;
}

div.settingsSetupRow[b-47sgw00e3s] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 25.333px;
}

p.settingsSetupText[b-47sgw00e3s]{
    flex: 1;
    margin: 0;
}

[b-47sgw00e3s] .spindEdit {
    height: 21px;
    width: 100px;
    background-color: white;
    color: black;
    border: 1px solid #8ba0bc;
    border-radius: 0px;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
}

[b-47sgw00e3s] .settingsSpinButtons {
    background: linear-gradient(to bottom, #e3eefb, #c6d7e7);
    color: #536080;
    border: 1px solid #8ba0bc;
    border-radius: 0;
    --dxbl-text-edit-btn-hover-image-color: #536080;
    --dxbl-btn-hover-color: #536080 !important;
    --dxbl-btn-hover-border-color: #8ba0bc !important;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #f8e18b, #f7eaac) !important;
    --dxbl-btn-hover-bg: #536080 !important;
    --dxbl-btn-border-radius: 0;
}

div.buttonContainer[b-47sgw00e3s] {
    display: grid;
    height: 75px;
    align-content: end;
    justify-content: center;
    padding-bottom: 10px;
}

button.submitButton[b-47sgw00e3s] {
    color: #1e395b;
    font-weight: normal;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    vertical-align: middle;
    border: 1px solid #abbad0;
    background: #d1dfef url('edtBtnBack.png') repeat-x left top;
    padding: 3px 15px;
    cursor: pointer;
}
    button.submitButton:hover[b-47sgw00e3s] {
        color: #1e395b;
        background: linear-gradient(180deg, #fbf4dd, #f7e089, #fcf8e5);
        border: 1px solid #eecc53;
    }

p.buttonText[b-47sgw00e3s] {
    font-family: "Barlow", sans-serif;
    font-size: 12pt;
    color: #1e395b;
    font-weight: normal;
    margin-bottom: 0px;
}
/* spendingtracker-server/Components/Modules/BudgetDetailsModule.razor.rz.scp.css */
p[b-nloi1nghzk] {
    color: black;
    font-weight: normal;
    font-style: normal;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
}

h4[b-nloi1nghzk] {
    text-align: left;
    margin-left: 10px;
    padding-bottom: 15px;
    font-family: "Barlow", sans-serif;
    font-size: 30px;
    color: #595959;
}

/* New payment css start*/
div.payment[b-nloi1nghzk] {
    margin: 0 auto;
    width: 1002px;
    background-color: white;
    margin-bottom: 30px;
}

div.newPayment[b-nloi1nghzk] {
    height: 150px;
    width: 1000px;
    margin: 0 auto;
    font-size: medium;
    font-style: normal;
    text-align: start;
    border: 1px solid #abbad0;
    border-radius: 5px;
    white-space: normal;
    font-variant: normal;
    background-color: #eaf1fa;
    color: black;
}

div.newPaymentHeader[b-nloi1nghzk] {
    background: linear-gradient(to bottom, #dde8f5, #cdd9e8);
    border-bottom: 1px solid #bbc8d7;
    height: 25px;
    padding: 3px 11px 6px 9px;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    color: #1e395b;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
}

p.newPaymentHeaderText[b-nloi1nghzk] {
    padding-left: 9px;
    padding-right: 11px;
    padding-top: 3px;
    padding-bottom: 6px;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    color: #1e395b;
}

label.newPaymentLabel[b-nloi1nghzk] {
    color: black;
    font-weight: normal;
    font-style: normal;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    padding-top: 10px;
    padding-left: 9px;
}

div.newPaymentBody[b-nloi1nghzk] {
    display: flex;
    width: 100%;
    padding-left: 9px;
    padding-right: 11px;
    padding-top: 2px;
    padding-bottom: 10px;
    vertical-align: top;
}

p.newPaymentCommand[b-nloi1nghzk] {
    font-weight: bolder;
    margin-bottom: 5px;
}

[b-nloi1nghzk] .paymentDateEdit {
    height: 23.33px;
    width: 120px;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    margin-right: 15px;
    background-color: white;
    color: black;
    border: 1px solid #8ba0bc;
    border-radius: 0px;
}

[b-nloi1nghzk] .paymentDateEditDropdown {
    background: linear-gradient(to bottom, #e3eefb, #c6d7e7);
    border: 1px solid #8ba0bc;
    border-radius: 0;
    color: #536080;
    --dxbl-text-edit-btn-hover-image-color: #536080;
    --dxbl-btn-hover-color: #536080 !important;
    --dxbl-btn-hover-border-color: #8ba0bc !important;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #f8e18b, #f7eaac) !important;
    --dxbl-btn-hover-bg: #536080 !important;
}

[b-nloi1nghzk] .paymentDateEditDropdownBody {
    --dxbl-calendar-bg: red !important;
    --dxbl-calendar-color: #1e395b !important;
}

[b-nloi1nghzk] .paymentTitleEdit {
    height: 23.33px;
    width: 250px;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    margin-right: 15px;
    background-color: white;
    color: black;
    border-radius: 0px;
}

[b-nloi1nghzk] .paymentAmmountEdit {
    height: 23.33px;
    width: 90px;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    margin-right: 15px;
    background-color: white;
    color: black;
    border: 1px solid #8ba0bc;
    border-radius: 0px;
}

[b-nloi1nghzk] .paymentAmmountEditButtons {
    background: linear-gradient(to bottom, #e3eefb, #c6d7e7);
    color: #536080;
    border: 1px solid #8ba0bc;
    border-radius: 0;
    --dxbl-text-edit-btn-hover-image-color: #536080;
    --dxbl-btn-hover-color: #536080 !important;
    --dxbl-btn-hover-border-color: #8ba0bc !important;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #f8e18b, #f7eaac) !important;
    --dxbl-btn-hover-bg: #536080 !important;
}

[b-nloi1nghzk] .paymentCategoryInputEditButton {
    background: linear-gradient(to bottom, #e3eefb, #c6d7e7);
    color: #536080;
    border: 1px solid #8ba0bc;
    border-radius: 0;
    --dxbl-text-edit-btn-hover-image-color: #536080;
    --dxbl-btn-hover-color: #536080 !important;
    --dxbl-btn-hover-border-color: #8ba0bc !important;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #f8e18b, #f7eaac) !important;
    --dxbl-btn-hover-bg: #536080 !important;
}

[b-nloi1nghzk] .paymentCategoryEdit {
    height: 23.33px;
    width: 370px;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    margin-right: 15px;
    color: #b2b7bd;
    border: 1px solid #8ba0bc;
    border-radius: 0px;
    cursor: default;
    --dxbl-listbox-bg: white !important;
}

[b-nloi1nghzk] .paymentCategoryInputEdit {
    background-color: white;
    border-radius: 0;
    --dxbl-listbox-bg: white;
    --dxbl-edit-dropdown-color: white;
}

[b-nloi1nghzk] .paymentCreateButton {
    border: 1px solid #abbad0;
    background: linear-gradient(to bottom, #f1f2f4, #ebedf2);
    padding: 3px 15px;
    cursor: pointer;
    font-weight: normal;
    font-size: 8pt;
    height: 23.33px;
    color: rgb(30, 57, 91);
    --dxbl-btn-hover-bg: linear-gradient(to bottom, #f1f2f4, #ebedf2);
    --dxbl-btn-hover-color: rgb(30, 57, 91);
    --dxbl-btn-hover-border-color: #abbad0;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #f1f2f4, #ebedf2);
}
/* New payment css end*/

/* Grid css start*/

[b-nloi1nghzk] .budgetExportButton {
    color: #1e395b;
    font-weight: normal;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    border: 1px solid #b7c8d5;
    border-radius: 6px;
    background: linear-gradient(to bottom, #ffffff, #eaf0f5);
    padding: 1px;
    cursor: pointer;
    width: 170px;
    height: 35px;
    --dxbl-btn-hover-color: rgb(30, 57, 91);
    --dxbl-btn-hover-border-color: #b7c8d5;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #ffffff, #eaf0f5);
    margin-top: 10px;
}

[b-nloi1nghzk] .budgetDetails {
    color: Black;
    border: 1px solid #8ba0bc;
    border-radius: 0;
    margin-bottom: 0px;
    --dxbl-grid-bg: white;
    --dxbl-grid-header-bg: #e7f0fa;
    --dxbl-grid-footer-bg: unset;
}

label.normalText[b-nloi1nghzk] {
    color: black;
    font-weight: normal;
    font-style: normal;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
}

label.actual[b-nloi1nghzk] {
    color: #2373b5 !important;
    font-weight: bold !important;
    font-size: 9pt !important;
}

label.budgeted[b-nloi1nghzk] {
    color: #278205 !important;
    font-size: 7.5pt !important;
}

label.cumulative[b-nloi1nghzk] {
    color: gray !important;
    font-size: 7.5pt !important;
}

div.footerDiv[b-nloi1nghzk] {
    height: fit-content;
}

[b-nloi1nghzk] .dxbl-grid.budgetDetails {
    --dxbl-grid-bg: red !important;
}

img.imgButton[b-nloi1nghzk] {
    cursor: pointer;
    white-space: nowrap;
}

div.formHeader[b-nloi1nghzk] {
    width: 100%;
}

h2.formHeaderText[b-nloi1nghzk] {
    color: #333333;
    font-weight: bold;
    font-style: normal;
    font-size: 13px;
    font-family: "Barlow", sans-serif;
    border-bottom-width: 1px;
    border-bottom-style: dashed;
    border-bottom-color: rgb(187, 187, 187);
    width: fit-content;
}

div.formLayoutBody[b-nloi1nghzk] {
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    margin-top: 12px;
    padding-bottom: 6px;
    padding-left: 18px;
    padding-right: 18px;
    padding-top: 6px;
    text-align: left;
    width: 100%;
}

div.formBodyEditContainer[b-nloi1nghzk] {
    display: flex;
    flex-wrap: wrap;
}

p.basicSettingsHint[b-nloi1nghzk] {
    margin-top: 30px;
    margin-bottom: 0px;
    color: black;
    font-weight: normal;
    font-style: normal;
    font-size: 8.5pt;
    font-family: "Barlow", sans-serif;
}

label.gridMonthHeader[b-nloi1nghzk] {
    font-weight: bold;
}

text.groupText[b-nloi1nghzk] {
    text-wrap: nowrap;
}

div.buttonAlignment[b-nloi1nghzk] {
    align-content: center;
    height: 100%;
    margin: 0 auto;
}

[b-nloi1nghzk] .editFormButtons {
    border: 1px solid #006699;
    border-radius: 5px;
    color: #0d45b7;
    background: linear-gradient(180deg, #f2f7fa, #a6cadb);
    font-size: 10px;
    font-weight: bold;
    width: 70px;
    height: 22px;
    --dxbl-btn-hover-box-shadow: none;
    --dxbl-btn-hover-color: rgb(13, 69, 183);
    --dxbl-btn-hover-border-color: #006699;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #f2f7fa, #a6cadb);
}

div.taskSelectorBody[b-nloi1nghzk] {
    width: 250px;
    height: 28px;
    position: relative;
    top: 43px;
    left: 732px;
}

[b-nloi1nghzk] .taskSelector {
    border: 1px solid #cecece;
    border-radius: 5px;
    color: #777777;
    box-shadow: none;
}

[b-nloi1nghzk] .taskSelectorButtons {
    border-left: 1px solid #cecece;
    background: linear-gradient(180deg, #ffffff, #e9e9e9)
}

div.exportButtonBody[b-nloi1nghzk]{
    margin-bottom: 30px;
}

p.taskSelectorId[b-nloi1nghzk] {
    visibility: hidden;
}
/* Grid css end*/
/* New category css start*/
div.newCategory[b-nloi1nghzk] {
    height: 130px;
    width: 1000px;
    margin: 0 auto;
    font-size: medium;
    font-style: normal;
    text-align: start;
    border: 1px solid #abbad0;
    border-radius: 5px;
    white-space: normal;
    font-variant: normal;
    background-color: #eaf1fa;
    color: black;
}

div.newCategoryHeader[b-nloi1nghzk] {
    background: linear-gradient(to bottom, #dde8f5, #cdd9e8);
    border-bottom: 1px solid #bbc8d7;
    height: 25px;
    padding: 3px 11px 6px 9px;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    color: #1e395b;
    text-align: start;
    vertical-align: middle;
    white-space: nowrap;
}

p.newCategoryHeaderText[b-nloi1nghzk] {
    padding-left: 9px;
    padding-right: 11px;
    padding-top: 3px;
    padding-bottom: 6px;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    color: #1e395b;
}

div.newCategoryBody[b-nloi1nghzk] {
    display: flex;
    width: 100%;
    margin-top: 11px;
    padding-left: 9px;
    padding-right: 11px;
    padding-top: 2px;
    padding-bottom: 0px;
    vertical-align: top;
}

p.newCategoryCommand[b-nloi1nghzk] {
    font-weight: bolder;
    margin-bottom: 5px;
}

[b-nloi1nghzk] .categoryTextEdit {
    height: 21px;
    width: 100%;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    background-color: white;
    color: black;
    border-radius: 0px;
}

div .categoryCommandBox[b-nloi1nghzk] {
    width: 250px;
    padding: 10px;
}

[b-nloi1nghzk] .categoryAmmountEdit {
    width: 100%;
    height: 21px;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    margin-right: 15px;
    background-color: white;
    color: black;
    border: 1px solid #8ba0bc;
    border-radius: 0px;
}

[b-nloi1nghzk] .categoryAmmountEditButtons {
    background: linear-gradient(to bottom, #e3eefb, #c6d7e7);
    color: #536080;
    border: 1px solid #8ba0bc;
    border-radius: 0;
    --dxbl-text-edit-btn-hover-image-color: #536080;
    --dxbl-btn-hover-color: #536080 !important;
    --dxbl-btn-hover-border-color: #8ba0bc !important;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #f8e18b, #f7eaac) !important;
    --dxbl-btn-hover-bg: #536080 !important;
}

[b-nloi1nghzk] .createCategoryButton {
    border: 1px solid #abbad0;
    background: linear-gradient(to bottom, #f1f2f4, #ebedf2);
    padding: 3px 15px;
    cursor: pointer;
    width: 170px;
    height: 32px;
    color: #1e395b;
    text-align: center;
    font-weight: normal;
    font-style: normal;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    --dxbl-btn-hover-bg: linear-gradient(to bottom, #f1f2f4, #ebedf2);
    --dxbl-btn-hover-color: #648096;
    --dxbl-btn-hover-border-color: #abbad0;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #f1f2f4, #ebedf2);
    --dxbl-btn-border-width: 1px;
}

[b-nloi1nghzk] .categoryTypeEdit {
    height: 21px;
    width: 100%;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    margin-right: 15px;
    color: #b2b7bd;
    border: 1px solid #8ba0bc;
    border-radius: 0px;
    cursor: default;
}

[b-nloi1nghzk] .categoryTypeInputEdit {
    background-color: white;
    border-radius: 0;
    --dxbl-listbox-bg: white;
    --dxbl-edit-dropdown-color: white;
    --dxbl-listbox-item-hover-bg: red !important;
}

[b-nloi1nghzk] .categoryPriorityEdit {
    height: 21px;
    width: 100%;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    margin-right: 15px;
    color: #b2b7bd;
    border: 1px solid #8ba0bc;
    border-radius: 0px;
    cursor: default;
}

[b-nloi1nghzk] .categoryPriorityInputEdit {
    background-color: white;
    border-radius: 0;
    --dxbl-listbox-bg: white;
    --dxbl-edit-dropdown-color: white;
}

[b-nloi1nghzk] .categoryAmmountEdit {
    height: 21px;
    width: 100%;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    margin-right: 15px;
    background-color: white;
    color: black;
    border: 1px solid #8ba0bc;
    border-radius: 0px;
}

[b-nloi1nghzk] .paymentCategoryInputEditButton {
    background: linear-gradient(to bottom, #e3eefb, #c6d7e7);
    color: #536080;
    border: 1px solid #8ba0bc;
    border-radius: 0;
    --dxbl-text-edit-btn-hover-image-color: #536080;
    --dxbl-btn-hover-color: #536080 !important;
    --dxbl-btn-hover-border-color: #8ba0bc !important;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #f8e18b, #f7eaac) !important;
    --dxbl-btn-hover-bg: #536080 !important;
}

[b-nloi1nghzk] .dxbl-listbox-item {
    --dxbl-listbox-item-hover-bg: red;
}
/* New category css end*/
/* spendingtracker-server/Components/Modules/BudgetSummary.razor.rz.scp.css */
div.summaryMain[b-2djd51jm1v]{
    display: flex;
}

div.budgetSummary[b-2djd51jm1v] {
    margin-right: 30px;
    border: 1px solid;
    border-color: gray;
    border-radius: 5px;
    width: 33%;
    background-color: #eaf1fa;
    height: fit-content;
}

div.mostExpensiveCategory[b-2djd51jm1v] {
    margin-right: 30px;
    border: solid 1px;
    border-color: gray;
    border-radius: 5px;
    width: 33%;
    background-color: #eaf1fa;
    height: fit-content;
}

div.budgetUsage[b-2djd51jm1v] {
    border: solid 1px;
    border-color: gray;
    border-radius: 5px;
    width: 33%;
    background-color: #eaf1fa;
    height: fit-content;
}

div.summaryHeader[b-2djd51jm1v] {
    background: linear-gradient(to bottom, #dde8f5, #cdd9e8);
    border-bottom: 1px solid #bbc8d7;
    height: 23px;
    padding-left: 9px;
    padding-right: 11px;
    padding-top: 3px;
    padding-bottom: 6px;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    color: #1e395b;
}

div.summaryData[b-2djd51jm1v]{
    display:flex;
}

div.bottomFiller[b-2djd51jm1v]{
    width: 100%;
    height: 8px;
}

div.data[b-2djd51jm1v]{
    width:152px;
}

div.values[b-2djd51jm1v] {
    width:fit-content;
    text-align: end;
}

div.budgetUsageCategory[b-2djd51jm1v]{
    width:152px !important;
    display: flex;
    align-content: center;
    padding-bottom: 10px;
}

p.summaryTitle[b-2djd51jm1v] {
    color: black;
    font-weight: bolder;
    font-style: normal;
    font-size: 10pt;
    font-family: "Barlow", sans-serif;
    margin-bottom: 2px;
    padding-left: 9px;
    padding-right: 11px;
    padding-top: 10px;
}

p.summaryText[b-2djd51jm1v] {
    color: black;
    font-weight: normal;
    font-style: normal;
    font-size: 10pt;
    font-family: "Barlow", sans-serif;
    margin-bottom: 2px;
    padding-left: 9px;
    padding-right: 11px;
    padding-top: 10px;
}

p.budgetSummary[b-2djd51jm1v] {
    color: black;
    font-weight: normal;
    font-style: normal;
    font-size: 10pt;
    font-family: "Barlow", sans-serif;
    margin-bottom: 2px;
    padding-left: 9px;
    padding-right: 11px;
    padding-bottom: 2px;
}

p.budgetUsageAmmount[b-2djd51jm1v] {
    padding-top: 10px;
    padding-bottom: 0px;
}
/* spendingtracker-server/Components/Modules/PaymentForCategory.razor.rz.scp.css */
:root[b-2ejnjjg11m] {
    --bs-body-bg: linear-gradient(to bottom, #f5f9fe, #ecf2f7);
}

body[b-2ejnjjg11m] {
    background-color: #D3E4F6;
    color: black;
    font-size: 8pt;
    padding: 0px;
    margin: 0px;
}

p[b-2ejnjjg11m] {
    color: black;
    font-weight: normal;
    font-style: normal;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
}

    p.hintText[b-2ejnjjg11m] {
        padding-top: 30px;
        color: black;
        text-align: center;
        font-weight: normal;
        font-style: normal;
        font-size: 10pt;
        font-family: "Barlow", sans-serif;
        cursor: help;
    }

    p.newPaymentCommand[b-2ejnjjg11m] {
        font-weight: bolder;
        margin-bottom: 5px;
    }

    p.newPaymentHeaderText[b-2ejnjjg11m] {
        padding-left: 9px;
        padding-right: 11px;
        padding-top: 3px;
        padding-bottom: 6px;
        font-size: 8pt;
        font-family: "Barlow", sans-serif;
        color: #1e395b;
    }

h2[b-2ejnjjg11m] {
    text-align: left;
    margin-left: 30px;
    padding-bottom: 20px;
    font-family: "Barlow", sans-serif;
    font-size: 30px;
    color: #595959;
}

    h2.paymentSummaryHeader[b-2ejnjjg11m] {
        margin-top: 30px;
        padding-bottom: 10px;
    }

label[b-2ejnjjg11m] {
    color: black;
    font-weight: normal;
    font-style: normal;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
}

    label.newPaymentLabel[b-2ejnjjg11m] {
        padding-top: 10px;
        padding-left: 9px;
    }

span#Footer1_lblVersion[b-2ejnjjg11m] {
    text-align: center;
}

div.menu_layout[b-2ejnjjg11m] {
    background: linear-gradient(180deg, #ffffff, #f1f0f1);
    border-radius: 5px 5px 0 0;
    overflow: auto;
    border-bottom: 1px solid #b8c1c8;
    height: 93px;
    overflow: hidden;
}

div.paymentScreen[b-2ejnjjg11m] {
    font-family: Barlow, sans-serif !important;
    background-color: white;
    text-align: left;
    text-align: center;
    align-content: center;
    align-items: center;
    height: 100%;
}

div.pagehead[b-2ejnjjg11m] {
    height: auto !important;
    margin: 0 auto;
    margin-top: 5px !important;
    width: 1083px;
    border-radius: 5px;
}

div.chartHolder[b-2ejnjjg11m] {
    display: flex;
    justify-content: center;
    align-items: center;
}

div.newPaymentScreen[b-2ejnjjg11m] {
    height: 150px;
    width: 1000px;
    margin: 0 auto;
    font-size: medium;
    font-style: normal;
    text-align: start;
    border: 1px solid #abbad0;
    border-radius: 5px;
    white-space: normal;
    font-variant: normal;
    background-color: #eaf1fa;
    color: black;
}

div.newPaymentHeader[b-2ejnjjg11m] {
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    color: #1e395b;
    background: linear-gradient(to bottom, #dde8f5, #cdd9e8);
    vertical-align: middle;
    white-space: nowrap;
    height: 25px;
    border-bottom: 1px solid #bbc8d7;
}

div.newPaymentBody[b-2ejnjjg11m] {
    display: flex;
    width: 100%;
    padding-left: 9px;
    padding-right: 11px;
    padding-top: 2px;
    padding-bottom: 10px;
    vertical-align: top;
}

div.paymentGrid[b-2ejnjjg11m] {
    background-attachment: scroll;
    background-color: rgb(247, 247, 247);
    border-style: solid;
    border-width: 1px;
    border-color: #8b8b8b;
    background-image: none;
    background-repeat: repeat;
    display: block;
    margin: 0 auto;
    margin-bottom: 20px;
    padding-bottom: 18px;
    padding-left: 18px;
    padding-right: 18px;
    padding-top: 18px;
    text-align: left;
    width: 960px;
}

div.footertext[b-2ejnjjg11m] {
    margin: 10px auto 10px auto;
    width: 1002px;
    background-color: white;
    text-align: center;
    color: black;
    font-weight: normal;
    font-style: normal;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
}

table.statusBar[b-2ejnjjg11m] {
    width: 100%;
    height: 26px;
    background: #cfddee;
    border: 1px solid #8ba0bc;
    border-top: 0px;
}

a.editPaymentButton[b-2ejnjjg11m] {
    background-color: transparent;
    border: none;
    margin: 0px 3px 0px 0px;
    color: #337cd4;
    text-decoration: none;
    cursor: pointer;
}

a.deletePaymentButton[b-2ejnjjg11m] {
    background-color: transparent;
    border: none;
    margin: 0px 3px 0px 0px;
    color: #337cd4;
    text-decoration: none;
    cursor: pointer;
}

[b-2ejnjjg11m] .paymentExportButton {
    width: 170px;
    height: 35px;
    border: 1px solid #abbad0;
    background: linear-gradient(to bottom, #f1f2f4, #ebedf2);
    padding: 1px;
    cursor: pointer;
    margin-top: 37px;
    color: #1e395b;
    --dxbl-btn-hover-bg: linear-gradient(to bottom, #f1f2f4, #ebedf2);
    --dxbl-btn-hover-color: #1e395b;
    --dxbl-btn-hover-border-color: #abbad0;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #f1f2f4, #ebedf2);
}

.paymentExportButton:hover[b-2ejnjjg11m] {
    border: 1px solid #abbad0;
    background: linear-gradient(to bottom, #f1f2f4, #ebedf2);
    padding: 1px;
    cursor: pointer;
}

[b-2ejnjjg11m] .paymentCreateButton {
    border: 1px solid #abbad0;
    background: linear-gradient(to bottom, #f1f2f4, #ebedf2);
    padding: 3px 15px;
    cursor: pointer;
    font-weight: normal;
    font-size: 8pt;
    height: 23.33px;
    color: rgb(30, 57, 91);
    --dxbl-btn-hover-bg: linear-gradient(to bottom, #f1f2f4, #ebedf2);
    --dxbl-btn-hover-color: rgb(30, 57, 91);
    --dxbl-btn-hover-border-color: #abbad0;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #f1f2f4, #ebedf2);
}

[b-2ejnjjg11m] .allPaymentsGrid {
    color: Black;
    border: 1px solid #8ba0bc;
    border-radius: 0;
    margin-bottom: 0px;
    --dxbl-grid-bg: white;
    --dxbl-grid-header-bg: #e7f0fa;
}

[b-2ejnjjg11m] .paymentDateEdit {
    height: 23.33px;
    width: 120px;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    margin-right: 15px;
    background-color: white;
    color: black;
    border: 1px solid #8ba0bc;
    border-radius: 0px;
}

[b-2ejnjjg11m] .paymentTitleEdit {
    height: 23.33px;
    width: 250px;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    margin-right: 15px;
    background-color: white;
    color: black;
    border-radius: 0px;
}

[b-2ejnjjg11m] .paymentAmmountEdit {
    height: 23.33px;
    width: 90px;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    margin-right: 15px;
    background-color: white;
    color: black;
    border: 1px solid #8ba0bc;
    border-radius: 0px;
}

[b-2ejnjjg11m] .paymentAmmountEditButtons {
    background: linear-gradient(to bottom, #e3eefb, #c6d7e7);
    color: #536080;
    border: 1px solid #8ba0bc;
    border-radius: 0;
    --dxbl-text-edit-btn-hover-image-color: #536080;
    --dxbl-btn-hover-color: #536080 !important;
    --dxbl-btn-hover-border-color: #8ba0bc !important;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #f8e18b, #f7eaac) !important;
    --dxbl-btn-hover-bg: #536080 !important;
}

[b-2ejnjjg11m] .paymentCategoryEdit {
    height: 23.33px;
    width: 370px;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    margin-right: 15px;
    color: #b2b7bd;
    border: 1px solid #8ba0bc;
    border-radius: 0px;
    cursor: default;
    background-color: white;
}

[b-2ejnjjg11m] .paymentCategoryInputEditButton {
    --dxbl-text-edit-btn-disabled-bg: linear-gradient(180deg, #f5f9fe, #ecf2f7);
    border: 1px solid #8ba0bc;
    border-radius: 0;
    color: #536080;
}

[b-2ejnjjg11m] gridHeaderImprovements {
    background-color: #e7f0fa;
    opacity: 1;
}

[b-2ejnjjg11m] .gridHeaderImprovements span:first-child {
    width: 100%;
    text-align: center;
}

[b-2ejnjjg11m] .gridHeaderImprovements th:first-child {
    background-color: #e7f0fa;
    opacity: 1;
}

[b-2ejnjjg11m] .paymentDateEditDropdown {
    background: linear-gradient(to bottom, #e3eefb, #c6d7e7) !important;
    border: 1px solid #8ba0bc;
    border-radius: 0;
    color: #536080;
    --dxbl-text-edit-btn-hover-image-color: #536080;
    --dxbl-btn-hover-color: #536080 !important;
    --dxbl-btn-hover-border-color: #8ba0bc !important;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #f8e18b, #f7eaac) !important;
    --dxbl-btn-hover-bg: #536080 !important;
}

[b-2ejnjjg11m] .paymentDateEditDropdownBody {
    --dxbl-calendar-bg: red !important;
    --dxbl-calendar-color: #1e395b !important;
}

[b-2ejnjjg11m] .paymentChart {
    margin: 0, auto;
    font-family: Barlow, sans-serif !important;
}

[b-2ejnjjg11m] paymentGridCommandHeader {
    --dxbl-grid-bg: white;
    --dxbl-grid-header-bg: #e7f0fa;
}


[b-2ejnjjg11m] .dxbl-grid .dxbl-grid-table > thead > tr > th.dxbl-grid-fixed-cell:not(.dxbl-grid-empty-cell), .dxbl-grid .dxbl-grid-table > thead > tr > td.dxbl-grid-fixed-cell:not(.dxbl-grid-empty-cell)[b-2ejnjjg11m] {
    background: #e7f0fa !important;
    color: black;
}

[b-2ejnjjg11m] .dxbl-grid .dxbl-grid-table > thead .dxbl-grid-header-row > th:not(.dxbl-grid-empty-cell)::before {
    content: "";
    position: absolute;
    z-index: -1;
    left: unset;
    top: unset;
    right: unset;
    bottom: unset;
    border-radius: inherit;
    background-color: currentcolor;
    opacity: 0%;
}

[b-2ejnjjg11m] .dxbl-date-time-edit-calendar {
    --dxbl-calendar-bg: white !important;
    --dxbl-calendar-color: white !important;
}

[b-2ejnjjg11m] .test {
    --dxbl-calendar-bg: white !important;
    --dxbl-calendar-color: white !important;
}

[b-2ejnjjg11m] .menuBar.dxbl-menu.dxbl-menu-horizontal {
    --dxbl-menu-bg: transparent !important;
}

[b-2ejnjjg11m] .menuButton {
    height: 24px;
    margin-top: 20px;
    background: linear-gradient(180deg, #3197f1, #2368c4);
    color: white;
    font: 9pt "Barlow", sans-serif !important;
    --dxbl-menu-item-font-size: 9pt;
    font-weight: bolder;
    padding-top: 4px;
    padding-bottom: 5px;
    --dxbl-dropdown-border-color: #7EACB1;
}

    [b-2ejnjjg11m] .menuButton.menuMargin {
        margin-right: 22px;
    }

[b-2ejnjjg11m].paymentEditForm {
    background-color: #ecf2f9;
}

div.categoryPaymentEditBody[b-2ejnjjg11m] {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

[b-2ejnjjg11m] .paymentDateEditor {
    width: 170px;
    height: 20px;
    font: 11px "Barlow", sans-serif;
    color: black;
    border-radius: 0px;
}

[b-2ejnjjg11m] .paymentTitleEditor {
    width: 150px;
    height: 20px;
    font: 11px "Barlow", sans-serif;
    color: black;
    border-radius: 0px;
}

[b-2ejnjjg11m] .paymentValueEditor {
    width: 170px;
    height: 20px;
    font: 11px "Barlow", sans-serif;
    color: black;
    border-radius: 0px;
}

[b-2ejnjjg11m] .paymentFormLayoutItem {
    width: fit-content;
}

div.editButtonBody[b-2ejnjjg11m]{
    display:flex;
    flex-wrap: wrap;
    align-content: end;
    margin-right:50px;
}
[b-2ejnjjg11m] .paymentEditFormButtons {
    height: fit-content;
    padding: 0px;
    color: #1e395b;
    background-color: transparent;
    border: none;
    font-family: "Barlow", sans-serif;
    --dxbl-btn-font-size: 11pt;
    --dxbl-btn-hover-bg: transparent;
    --dxbl-btn-hover-background: transparent;
    --dxbl-btn-hover-color: #1e395b;
}

    [b-2ejnjjg11m] .paymentEditFormButtons.paddingRight {
        margin-right: 5px;
    }

[b-2ejnjjg11m] .paymentEditFormButtons:hover {
    text-decoration: underline;
}

[b-2ejnjjg11m] .editorCaption {
    font-size: 11pt;
    font-family: "Barlow", sans-serif;
    color: Black;
}

[b-2ejnjjg11m] .settingsSpinButtons {
    background: linear-gradient(to bottom, #e3eefb, #c6d7e7);
    color: #536080;
    border: 1px solid #8ba0bc;
    border-radius: 0;
    --dxbl-text-edit-btn-hover-image-color: #536080;
    --dxbl-btn-hover-color: #536080 !important;
    --dxbl-btn-hover-border-color: #8ba0bc !important;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #f8e18b, #f7eaac) !important;
    --dxbl-btn-hover-bg: #536080 !important;
    --dxbl-btn-border-radius: 0;
}
/* spendingtracker-server/Components/Modules/SpTrackerMenu.razor.rz.scp.css */
div.logo[b-4v0ltdf2d5] {
    float: left;
    padding-left: 35px;
    width: 155px;
}

span.moneyScore[b-4v0ltdf2d5] {
    position: relative;
    top: -5px;
    left: -40px;
    z-index: 3;
}

a.feedback[b-4v0ltdf2d5] {
    font-family: "Barlow", sans-serif;
    font-size: 8pt;
    font-weight: bold;
    padding-right: 5px;
    cursor: pointer;
    color: #1e395b;
    text-decoration: none;
    text-align: right;
}
a.feedback:hover[b-4v0ltdf2d5] {
    text-decoration: underline;
}

.userBarPL[b-4v0ltdf2d5] {
    position: relative;
    left:846px;
    bottom:40px;
    width:fit-content;
    padding-top: 10px;
    color: #595959;
    text-align: right;
    font-weight: normal;
    font-style: normal;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    display: flex;
}

.userBarEN[b-4v0ltdf2d5] {
    position: relative;
    left: 802px;
    bottom: 40px;
    width: fit-content;
    padding-top: 10px;
    color: #595959;
    text-align: right;
    font-weight: normal;
    font-style: normal;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    display: flex;
}

p.normalText[b-4v0ltdf2d5] {
    font-family: "Barlow", sans-serif;
    font-size: 10pt;
    color: black;
    font-weight: normal;
    font-style: normal;
}

ul[b-4v0ltdf2d5] {
    height: 24px !important;
}

div.recommend[b-4v0ltdf2d5] {
    place-self: center;
    width: 530px;
    font-family: "Barlow", sans-serif;
    font-size: 10pt;
    font-weight: normal;
    background-color: #EEF1FA;
    padding: 15px;
    margin-top:15px;
}

div.opinionBody[b-4v0ltdf2d5] {
    display: block;
    margin-top: 0em;
    unicode-bidi: isolate;
    border-width: 2px;
    border-style: groove;
    border-color: rgb(192, 192, 192);
}

div.popupFooter[b-4v0ltdf2d5]{
    display: flex;
    width:100%;
    text-align: center;
    vertical-align: bottom;
    height: fit-content;
    margin-bottom: 15px;
}

p.opinionText[b-4v0ltdf2d5] {
    align-content: center;
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    unicode-bidi: isolate;
    color: black;
    font-weight: normal;
    font-style: normal;
    font-size: 9pt;
    font-family: "Barlow", sans-serif;
    margin-bottom:30px;
}

p.footerText[b-4v0ltdf2d5] {
    width:100%;
    margin-top:20px;
    color: #949494;
    font-size: 7pt;
    margin-bottom: 0px;
}

[b-4v0ltdf2d5] .opinionCaption {
    color: #003;
    font-weight: bolder;
    font-style: normal;
    font-size: 8pt;
    --dxbl-text-font-family: "Barlow", sans-serif;
    margin-left: 22px;
    margin-right: 12px;
}

    [b-4v0ltdf2d5] .opinionCaption.commentCaption {
        margin-right: 17px;
    }

[b-4v0ltdf2d5] .invitationCaption {
    color: #003;
    font-weight: bolder;
    font-style: normal;
    font-size: 8pt;
    --dxbl-text-font-family: "Barlow", sans-serif;
    margin-left: 22px;
    margin-right: 12px;
}

[b-4v0ltdf2d5] .opinionEmail {
    width: 350px;
    height: 23px;
    margin: 5px;
    border-radius: 0px;
    background-color: white;
    color: black;
    border-radius: 0px;
    margin: 0, auto;
}

[b-4v0ltdf2d5] .commentTextBox {
    width: 350px;
    height: 200px;
    color: black;
    font-weight: normal;
    font-style: normal;
    font-size: 7pt;
    font-family: "Barlow", sans-serif;
}

[b-4v0ltdf2d5] .emailButton {
    margin: 0 auto;
    color: black !important;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    font-weight: bolder;
    border-radius: 0px;
    border: 1px solid #000;
    background-color: #f0f0f0;
    --dxbl-btn-hover-bg: #f0f0f0;
    --dxbl-btn-hover-border-color: #000;
    --dxbl-btn-hover-background: #000;
    padding-left: 6px;
    padding-right: 6px;
    padding-top: 1px;
    padding-bottom: 1px;
    margin-bottom: 23px;
    margin-top: 18px;
}

[b-4v0ltdf2d5] .formItem{
    margin-top: 28px;
}

[b-4v0ltdf2d5] .commentPopup{
    margin-top: 5px;
}

button.closeButton[b-4v0ltdf2d5] {
    position: absolute;
    right: 5px;
    bottom: 13px;
    width: 20px;
    height: 20px;
    background-image: url('SpendingTracker/images/closeButton.svg'); /* Path to your image */
    background-size: cover; /* Ensures the image covers the entire background */
    background-repeat: no-repeat; /* Prevents the image from repeating */
    background-position: center; /* Centers the image */
    background-color: transparent;
    border: none;
}
    button.closeButton:hover[b-4v0ltdf2d5] {
        border: none;
        background-image: url('SpendingTracker/images/closeButton_hover.svg'); /* Path to your image */
        background-size: cover; /* Ensures the image covers the entire background */
        background-repeat: no-repeat; /* Prevents the image from repeating */
        background-position: center; /* Centers the image */
        background-color: transparent;
    }

div.menuBarBackground[b-4v0ltdf2d5] {
    position: relative;
    height: 24px;
    width: 722px;
    left: 361px;
    bottom: 113px;
    z-index: -1;
    background: linear-gradient(180deg, #3197f1, #2368c4);
    border-radius: 5px 0 0 5px;
}
/* spendingtracker-server/Components/Pages/Account/Login.razor.rz.scp.css */
div.page[b-fmngfcak41] {
    margin: 0 auto;
    width: 1083px;
    height: 300px;
    background-color: white;
    box-shadow: 0px 0px 10px 3px grey;
    text-align: left;
    border-radius: 5px;
    margin-top: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

div.content[b-fmngfcak41] {
    margin-top: 20px;
    margin-bottom: 20px;
    padding-top: 20px;
    padding-bottom: 20px;
    border: 1px solid #909aa6;
    width: fit-content;
    border-radius: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: fit-content;
    text-align: center;
}


div.form-group[b-fmngfcak41] {
    display: flex;
    margin-bottom: 10px;
}

label.caption[b-fmngfcak41] {
    width: 170px;
    color: #648096;
    font-weight: normal;
    font-style: normal;
    font-size: 15px;
    font-family: "Barlow", sans-serif;
}

[b-fmngfcak41] .input {
    width: 181px;
    padding: 7px 0 0 5px;
    height: 32px;
    outline: none;
    border: 1px solid;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: rgb(227, 244, 243);
    border-right-color: rgb(227, 244, 243);
    border-bottom: 1px solid rgb(131, 169, 200);
    border-left-color: rgb(227, 244, 243);
    color: rgb(3, 57, 88);
    background-color: transparent;
    font: normal normal normal 13px / normal "Barlow", sans-serif;
}

div.buttonBody[b-fmngfcak41] {
    margin-left: 10px;
    width: 170px;
    height: 35px;
    border: 1px solid #b7c8d5;
    border-radius: 5px;
    background: linear-gradient(180deg, #ffffff, #eaf0f5);
}

a.loginButton[b-fmngfcak41] {
    color: #1e395b;
    font-weight: normal;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    text-decoration: none;
}

button.loginButton[b-fmngfcak41] {
    width: 170px;
    height: 35px;
    border: 1px solid #b7c8d5;
    border-radius: 5px;
    background: linear-gradient(180deg, #ffffff, #eaf0f5);
    color: #1e395b;
    font-weight: normal;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
    text-decoration: none;
}

button.loginButton.margin[b-fmngfcak41] {
    margin-left: 11px;
}
/* spendingtracker-server/Components/Pages/Index.razor.rz.scp.css */
div.page[b-8eljxpr5l4] {
    margin: 0 auto;
    width: 1083px;
    background-color: white;
    box-shadow: 0px 0px 10px 3px grey;
    text-align: left;
    border-radius: 5px;
    margin-top: 15px;
}

div.menu_layout[b-8eljxpr5l4] {
    background: linear-gradient(180deg, #ffffff, #f1f0f1);
    border-radius: 5px 5px 0 0;
    overflow: auto;
    border-bottom: 1px solid #b8c1c8;
    height: 93px;
    overflow: hidden;
}

div.content[b-8eljxpr5l4] {
    margin: 0 auto;
    min-height: 800px;
    width: 1000px;
    height: auto;
}

div.hintbar[b-8eljxpr5l4] {
    padding-top: 30px;
    color: black;
    text-align: center;
    font-weight: normal;
    font-style: normal;
    font-size: 10pt;
    font-family: "Barlow", sans-serif;
}

span.hintbarText[b-8eljxpr5l4] {
    font-family: "Barlow", sans-serif;
    font-size: 10pt;
    font-weight: normal;
    cursor: help;
}

div.stats[b-8eljxpr5l4] {
    margin: 0 auto;
    width: 100%;
    background-color: white;
    height: 70px;
    overflow: hidden;
}

div.basicDetails[b-8eljxpr5l4] {
    padding-right: 10px;
    padding-left: 10px;
    width: 980px;
    background-color: white;
}

div.footertext[b-8eljxpr5l4] {
    margin: 10px auto 0 auto;
    width: 100%;
    background-color: white;
    text-align: center;
}

p.normalText[b-8eljxpr5l4] {
    color: black;
    font-weight: normal;
    font-style: normal;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
}

[b-8eljxpr5l4] .menuBar.dxbl-menu.dxbl-menu-horizontal {
    --dxbl-menu-bg: transparent !important;
}

[b-8eljxpr5l4] .menuButton {
    height: 24px;
    margin-top: 20px;
    background: linear-gradient(180deg, #3197f1, #2368c4);
    color: white;
    font: 9pt "Barlow", sans-serif !important;
    --dxbl-menu-item-font-size: 9pt;
    font-weight: bolder;
    padding-right: 13px;
    padding-left: 13px;
    padding-top: 4px;
    padding-bottom: 5px;
    --dxbl-dropdown-border-color: #7EACB1;
}

    [b-8eljxpr5l4] .menuButton.menuMargin {
        margin-right: 22px;
    }

[b-8eljxpr5l4] .formBody {
    align-content: center;
}

[b-8eljxpr5l4] .commentTextBox {
    width: 350px;
}
/* spendingtracker-server/Components/Pages/Information.razor.rz.scp.css */
div.menu_layout[b-wb5z7hc9vm] {
    background: linear-gradient(180deg, #ffffff, #f1f0f1);
    border-radius: 5px 5px 0 0;
    overflow: auto;
    border-bottom: 1px solid #b8c1c8;
    height: 93px;
    overflow: hidden;
}

[b-wb5z7hc9vm] .menuButton {
    height: 24px;
    margin-top: 20px;
    background: linear-gradient(180deg, #3197f1, #2368c4);
    color: white;
    font: 9pt "Barlow", sans-serif !important;
    --dxbl-menu-item-font-size: 9pt;
    font-weight: bolder;
    padding-top: 4px;
    padding-bottom: 5px;
    --dxbl-dropdown-border-color: #7EACB1;
}

    [b-wb5z7hc9vm] .menuButton.menuMargin {
        margin-right: 22px;
    }

div.page[b-wb5z7hc9vm] {
    margin: 0 auto;
    width: 1083px;
    background-color: white;
    box-shadow: 0px 0px 10px 3px grey;
    text-align: left;
    border-radius: 5px;
    margin-top: 15px;
    min-height: 800px;
}

h3[b-wb5z7hc9vm] {
    margin: 0 auto;
    margin-top: 30px;
    margin-bottom: 30px;
    width: fit-content;
    color: black;
    text-align: center;
    font-weight: normal;
    font-style: normal;
    font-size: 10pt;
    font-family: "Barlow", sans-serif;
    cursor: help;
}

[b-wb5z7hc9vm] .informationMemo {
    margin: 0 auto;
    width: 800px;
    height: 400px;
    background-color: white;
    border: 1px solid #8ba0bc;
    border-radius: 0;
    font-family: "Barlow", sans-serif;
    font-size: 8pt;
    --dxbl-text-edit-border-color: #8ba0bc;
    box-shadow: none;
}

div.footer[b-wb5z7hc9vm] {
    margin: 10px auto 0 auto;
    text-align: center;
}

p.footerText[b-wb5z7hc9vm] {
    color: black;
    font-weight: normal;
    font-style: normal;
    font-size: 8pt;
    font-family: "Barlow", sans-serif;
}
/* spendingtracker-server/Components/Pages/Payments.razor.rz.scp.css */
[b-pzjrfkb3ko] .paymentEditForm {
    background-color: #ecf2f9;
}
/* spendingtracker-server/Components/Pages/SpTracker.razor.rz.scp.css */
div.page[b-btie0h3oyk] {
    margin: 0 auto;
    width: 1083px;
    background-image: none !important;
    background-color: white;
    text-align: left;
    color: black;
    font-size: 8pt;
    align-content: center;
    align-items: center;
    box-shadow: 0px 0px 10px 3px grey;
}

div.pagehead[b-btie0h3oyk] {
    margin-top: 15px !important;
    margin-bottom: 5px !important;
    border-radius: 5px;
}

div.menu_layout[b-btie0h3oyk] {
    background: linear-gradient(180deg, #ffffff, #f1f0f1);
    border-radius: 5px 5px 0 0;
    overflow: auto;
    border-bottom: 1px solid #b8c1c8;
    height: 93px;
    overflow: hidden;
}

div.hintBar[b-btie0h3oyk] {
    padding-top: 30px;
    color: black;
    text-align: center;
    font-weight: normal;
    font-style: normal;
    font-size: 10pt;
    font-family: "Barlow", sans-serif;
}

div.summary[b-btie0h3oyk] {
    margin: 0 auto;
    width: 1002px;
    background-color: white;
    margin-bottom: 30px;
}

div.payment[b-btie0h3oyk] {
    margin: 0 auto;
    width: 1002px;
    background-color: white;
    margin-bottom: 30px;
}

div.stats[b-btie0h3oyk] {
    margin: 0 auto;
    width: 1002px;
    background-color: white;
}

div.footerGraphic[b-btie0h3oyk] {
    background-image: none !important;
    width: 1083px;
    height: 16px;
}

p.hintText[b-btie0h3oyk] {
    font-family: "Barlow", sans-serif;
    font-size: 10pt;
    font-weight: normal;
    cursor: help;
}

h4[b-btie0h3oyk] {
    text-align: left;
    margin-left: 10px;
    padding-bottom: 15px;
    font-family: "Barlow", sans-serif;
    font-size: 30px;
    color: #595959;
}

[b-btie0h3oyk] .menuBar.dxbl-menu.dxbl-menu-horizontal {
    --dxbl-menu-bg: transparent !important;
    z-index: 99999;
}

[b-btie0h3oyk] .dxbl-grid.budgetDetails {
    --dxbl-grid-bg: #e4effa;
    --dxbl-grid-border-width: 1px;
    --dxbl-grid-border-style: solid;
    --dxbl-grid-border-color: #8ba0bc;
    --dxbl-grid-fixed-column-border-color: #8ba0bc;
    --dxbl-grid-color: Black;
    --dxbl-grid-font-family: "Barlow", sans-serif;
    --dxbl-grid-border-radius: 0;
    --dxbl-grid-footer-bg: #e2ebf6;
    --dxbl-grid-font-size: 8pt;
    --dxbl-grid-footer-color:red !important;
    width: 990px;
}

[b-btie0h3oyk] .dxbl-grid > .dxbl-grid-top-panel > .dxbl-grid-group-panel-container {
    background-color: #cfddee;
}

[b-btie0h3oyk] .dxbl-grid .dxbl-grid-table .dxbl-grid-detail-cell {
    background-color: #e9edf3;
    padding: 0px;
}

[b-btie0h3oyk] .dxbl-grid .dxbl-grid-table .dxbl-grid-expand-button-cell + td {
    font-size: 12pt;
}

[b-btie0h3oyk] .dxbl-grid-header-content {
    font-size: 11px;
    font-weight: normal;
}

[b-btie0h3oyk] .dxbl-grid > .dxbl-grid-top-panel > .dxbl-grid-group-panel-container .dxbl-grid-header {
    background: linear-gradient(180deg, #edf4fb, #e4effa);
    width: 102px;
    color: #1e395b;
    font-family: "Barlow", sans-serif;
    border: 1px solid #8ba0bc;
    font-weight: normal;
    text-align: left;
}

[b-btie0h3oyk] .dxbl-grid-command-cell dxbl-align-center {
    padding: 0 !important;
}

[b-btie0h3oyk] .basicCategoryEdition {
    --dxbl-fl-group-border-radius: 0 !important;
    --dxbl-fl-group-bg: rgb(238, 243, 255);
}

[b-btie0h3oyk] .formItemCaption {
    color: black;
    font-weight: normal;
    font-style: normal;
    font-size: 11px;
    --dxbl-text-font-family: "Barlow", sans-serif;
    margin-bottom: 18px;
}

[b-btie0h3oyk] .categoryNameEdition {
    font-weight: normal;
    font-style: normal;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    border-radius: 0px;
    border-color: #8ba0bc;
    height: 21px;
    width: 170px;
    color: black;
    background-color: white;
    --dxbl-text-edit-focus-shadow-color: transparent;
}

[b-btie0h3oyk] .subcategoryNameEdition {
    font-weight: normal;
    font-style: normal;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    border-radius: 0px;
    border-color: #8ba0bc;
    height: 21px;
    width: 170px;
    color: black;
    background-color: white;
    --dxbl-text-edit-focus-shadow-color: transparent;
}

[b-btie0h3oyk] .priorityEdit {
    height: 21px;
    width: 130px;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    margin-right: 15px;
    color: #b2b7bd;
    border: 1px solid #8ba0bc;
    border-radius: 0px;
    cursor: default;
}

[b-btie0h3oyk] .priorityInputEdit {
    font-weight: normal;
    font-style: normal;
    font-family: "Barlow", sans-serif;
    font-size: 11pt;
    color: black;
    background-color: white;
    border-radius: 0;
    --dxbl-listbox-bg: white;
    --dxbl-edit-dropdown-color: white;
}

[b-btie0h3oyk] .priorityEditButtons,
[b-btie0h3oyk] .priorityEditButtons:disabled {
    background: linear-gradient(180deg, #e3eefb, #c6d7e7);
    border: 1px solid #8ba0bc;
    border-radius: 0;
    color: #536080;
}

[b-btie0h3oyk] .spindEdit {
    height: 21px;
    width: 88.67px;
    background-color: white;
    color: black;
    border: 1px solid #8ba0bc;
    border-radius: 0px;
    font-family: "Barlow", sans-serif;
    font-size: 12pt;
}

[b-btie0h3oyk] .settingsSpinButtons {
    background: linear-gradient(180deg, #e3eefb, #c6d7e7);
    color: #536080;
    border: 1px solid #8ba0bc;
    border-radius: 0;
    --dxbl-text-edit-btn-hover-image-color: #536080;
    --dxbl-btn-hover-color: #536080 !important;
    --dxbl-btn-hover-border-color: #8ba0bc !important;
    --dxbl-btn-hover-background: linear-gradient(to bottom, #f8e18b, #f7eaac) !important;
    --dxbl-btn-hover-bg: #536080 !important;
    --dxbl-btn-border-radius: 0;
}

[b-btie0h3oyk] .center-align {
    align-content: center;
}

[b-btie0h3oyk] .formLayoutItem {
    width: fit-content;
    padding-right: 0px !important;
}

[b-btie0h3oyk] .changeBudgetSettingButton {
    text-decoration: underline;
    cursor: pointer;
    color: #1e395b;
    --dxbl-btn-hover-bg: transparent;
    --dxbl-btn-hover-background: transparent;
    --dxbl-btn-hover-color: #1e395b;
    height: fit-content;
    width: fit-content;
    padding: 0;
    background-color: transparent;
    border: none;
}

[b-btie0h3oyk] .topBreak {
    margin-top: 22px;
}

[b-btie0h3oyk] .spindEdit.smallerEdit {
    width: 60px !important;
    font-size: 11px;
}

[b-btie0h3oyk] .settingsSpinButtons.smallSpinButtons {
    width: 15px;
}

[b-btie0h3oyk] .menuButton {
    height: 24px;
    margin-top: 20px;
    background: linear-gradient(180deg, #3197f1, #2368c4);
    color: white;
    font: 9pt "Barlow", sans-serif !important;
    --dxbl-menu-item-font-size: 9pt;
    font-weight: bolder;
    padding-top: 4px;
    padding-bottom: 5px;
    --dxbl-dropdown-border-color: #7EACB1;
}

    [b-btie0h3oyk] .menuButton.menuMargin {
        margin-right: 22px;
    }

[b-btie0h3oyk] .categoryTypeInputEdit {
    --dxbl-listbox-item-hover-bg: red !important;
}