﻿:root {
    --mud-palette-lines-inputs: #EBECF2;
    --mud-elevation-1: 0 4px 2px 0 rgba(207, 216, 220, 0.20) !important;
}


.mud-collapse-entered {
    width: 100%;
}

@media (max-width: 600px) {
    .mud-xs-table .mud-table-root .mud-table-head, .mud-xs-table .mud-table-root .mud-table-foot {
        display: contents
    }
}

@media (max-width: 600px) {
    .mud-xs-table .mud-table-cell {
        display: table-cell;
        border: 0;
        padding: 14px 16px;
        text-align: start !important;
        border-bottom: 1px solid var(--mud-palette-table-lines);
    }
}

@media (max-width: 600px) {
    .mud-xs-table .mud-table-cell:before {
        content: none;
    }
}

@media (max-width: 600px) {
    .mud-xs-table .mud-table-row .mud-table-cell:last-child {
        border-bottom: none;
        border-bottom: 1px solid var(--mud-palette-table-lines);
    }
}

.mud-table-root .mud-table-head .mud-table-cell {
    color: var(--doka-theme-primary);
    font-weight: 600;
    white-space: normal !important;
    word-break: auto-phrase;
    line-height: normal !important;
    padding-left: 8px;
}

@media (max-width: 600px) {
    .mud-table-root .mud-table-head .mud-table-cell {
        color: var(--doka-theme-primary);
        font-weight: 600;
        line-height: var(--font-size-xs);
    }
}

.mud-table-container {
    width: 100%;
    overflow-y: auto;
    border-radius: var(--doka-mud-table-radius) !important;
}

.mud-table-cell {
    font-weight: 500;
    font-size: var(--font-size-xs);
}

@media (max-width: 600px) {
    .mud-xs-table .mud-table-smalldevices-sortselect {
        display: none;
    }
}

.mud-table-sort-label {
    line-height: var(--font-size-lg);
}

.mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(odd) {
    background-color: #FFFFFF;
}

.mud-picker-view {
    margin-top: -50% !important;
}

.mud-picker button[aria-label="Clear"] {
    z-index: 99;
}

.mud-input-outlined-border {
    background: var(--doka-palette-white) !important;
    z-index: 1 !important;
    border-color: #FFFFFF !important;
    border-radius: var(--doka-border-radius-input) !important;
    height: var(--doka-input-height) !important;
}

.mud-input:hover {
    cursor: pointer;
    border: 1px solid var(--doka-theme-primary);
    border-radius: var(--mud-default-borderradius);
}

.mud-input-slot {
    background: white;
    z-index: 2;
    font-weight: 500 !important;
    line-height: 20px !important;
    font-size: 16px !important;
}

.mud-input-label {
    z-index: 3 !important;
    height: var(--doka-input-height) !important;
}

.mud-tab {
    text-transform: none;
}

.mud-tabs-tabbar {
    background-color: transparent;
}

.mud-card {
    border: var(--doka-card-border);
    border-radius: var(--doka-border-radius-card);
}

.mud-card-content {
    padding: var(--doka-card-content-padding);
}

.mud-paper.doka-card-list-item {
    padding: 24px;
    border: var(--doka-card-border);
    min-width: 360px;
    width: calc((100% - var(--doka-card-list-gap)) / 2);
}

.mud-input-adornment {
    z-index: 4;
}

.mud-icon-button-size-small.mud-icon-button-edge-end {
    z-index: 2;
}

.doka-checkbox .mud-icon-root.mud-svg-icon {
    fill: #EBECF2;
    background-color: #EBECF2;
    border-radius: 6px;
}

.doka-checkbox .mud-icon-root {
    width: 26px;
    height: 26px;
}

.mud-drawer:not(.mud-drawer-fixed) {
    position: fixed;
}

.mud-popover.account-dropdown-popover {
    transform: translateX(-50%) !important;
}

.mud-icon-button:hover {
    background-color: unset !important;
}

.mud-icon-button.mud-ripple::after {
    transition: none !important;
}

.mud-dialog.receipt-dialog {
    max-width: 800px;
}

.mud-dialog {
    width: 488px;
    padding: 12px;
    border-radius: var(--doka-border-radius-dialog) !important;
    border: 1px solid white;
}

.mud-dialog-content {
    padding: 0px !important;
    margin: 0px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    justify-content: center !important;
    align-items: center !important;
}

.mud-button {
    border-radius: var(--doka-border-radius-button) !important;
    height: var( --doka-button-height);
    box-shadow: none !important;
}

.mud-input {
    display: flex;
    align-items: baseline;
    border-radius: var(--doka-border-radius-input) !important;
}

.mud-input-control-input-container {
    height: var(--doka-input-height) !important;
    box-shadow: 0 4px 2px 0 rgba(207, 216, 220, 0.20);
}

button.mud-button-root.mud-button.mud-button-filled.mud-button-filled-primary.btn-disabled {
    background-color: var(--mud-palette-secondary) !important;
    color: black !important;
    border-color: var(--mud-palette-action-disabled-background) !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
    opacity: 1 !important;
    pointer-events: none !important
}

button.mud-button-root.mud-button.mud-button-outlined.mud-button-outlined-primary.btn-disabled {
    background-color: var(--mud-palette-secondary) !important;
    color: black !important;
    border-color: var(--mud-palette-action-disabled-background) !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
    opacity: 1 !important;
    pointer-events: none !important
}

button.mud-button-root.mud-button.mud-button-filled.mud-button-filled-primary.icon-btn-disabled {
    background-color: var(--mud-palette-secondary) !important;
    color: white !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
    opacity: 1 !important;
    pointer-events: none !important;
    border: 1px solid var(--mud-palette-secondary) !important;
}

.accounts-pagination .mud-icon-button-label {
    background: var(--doka-palette-white) !important;
    color: var(--doka-palette-primary) !important;
    height: 24px;
    width: 22px;
    border-radius: 4px;
}

.accounts-pagination .mud-pagination-item mud-pagination-item-selected .mud-pagination-item {
    background: var(--doka-palette-primary) !important;
    color: var(--doka-palette-white) !important;
    height: 24px;
    width: 22px;
    border-radius: 4px;
}

.accounts-pagination .mud-pagination-item {
    background: var(--doka-palette-white) !important;
    border-radius: 4px;
    margin: 0 0px;
    padding: 0 0px;
}

.mud-pagination .mud-pagination-item > * {
    margin: 0 0px;
    padding: 0 0px;
    height: 24px;
    min-width: 24px;
}

.mud-pagination {
    gap: 4px;
}

.customer-campaign-dialog .mud-dialog-content {
    align-items: stretch !important;
    max-width: 600px;
    overflow: clip;
    border-radius: var(--mud-default-borderradius) var(--mud-default-borderradius) 0 0;
}

.customer-campaign-dialog .mud-dialog-content table {
    width: 100% !important;
}

.customer-campaign-dialog .mud-dialog-content img {
    display: block;
    width: auto !important;
    max-width: 100%;
    height: auto !important;
    max-height: calc(100dvh - 2 * var(--mud-appbar-height) - 2 * 13px - 12px - var(--doka-button-height));
}

.campaign-carousel-container .d-flex .justify-center {
    justify-content: flex-start !important;
    padding-left: 6px;
}

.send-email-box .mud-input-control-input-container {
    justify-content: center !important;
}

.send-email-box .mud-input {
    color: var(--mud-palette-text-secondary);
}

.mud-input:has(input:focus) legend {
    width: 0 !important;
}

.mud-navmenu.mud-navmenu-default .mud-nav-link.active:not(.mud-nav-link-disabled) {
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    background: linear-gradient(104deg, rgba(255, 255, 255, 0.20) 0%, rgba(255, 255, 255, 0.02) 100%) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.07), 0 5px 20px rgba(31, 156, 235, 0.07) !important;
    color: var(--doka-palette-white) !important;
}

.mud-avatar.mud-avatar-large {
    width: auto;
    height: auto;
}

.mud-grid-spacing-xs-6 > .mud-grid-item {
    padding-left: 20px;
    padding-top: 16px;
}

.mud-pagination .mud-pagination-item .mud-button {
    font-size: 12px;
}

.mud-button-text.mud-button-text-primary:hover {
    background: inherit !important;
    opacity: 60%;
}

.mud-chart-donut .mud-donut-ring {
    stroke: none;
}

.base-statements .mud-expand-panel .mud-expand-panel-header {
    padding: 0px 8px 0px 12px;
}

.base-statements .mud-expand-panel .mud-expand-panel-content.mud-expand-panel-gutters {
    padding: 0px;
}

.base-statements .mud-expand-panel-content mud-expand-panel-gutters {
    padding: 0px 16px;
}

.base-statements .mud-expand-panel.mud-panel-expanded {
    margin: 0px
}

.base-statements .mud-expand-panel.mud-expand-panel-border {
    border-bottom: 0px;
}

.mud-radio-group {
    gap: 20px !important;
}

.mud-ripple-radio {
    padding: 0 8px 0 0 !important
}

.mud-table-head {
    background-color: var(--doka-mud-table-header-background-color);
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    color: white;
    height: 40px;
}

.mud-tooltip.mud-popover {
    border-radius: 8px;
    font-size: 12px;
    font-weight: var(--mud-typography-h6-weight);
    line-height: 18px;
}

.mud-table .mud-table-cell {
    color: var(--doka-mud-table-row-cell-text-color);
    font-size: var(--mud-typography-h6-size);
    font-weight: var(--mud-typography-h6-weight);
    line-height: 0;
    border: 0.5px solid #00000033 !important;
    height: var(--doka-mud-table-cell-height);
}

.mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(2n+1) {
    background-color: var(--doka-mud-table-striped-color-odd) !important;
}

.mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(2n) {
    background-color: var(--doka-mud-table-striped-color-even) !important;
}

.signing-dialog .mud-dialog-container.mud-dialog-center {
    justify-content: right;
}

.mud-dialog-container.mud-dialog-centerright {
    padding-right: 0px;
}

.mud-dialog-fullscreen {
    width: auto;
    padding: 0px;
    border: 0px;
}

.mud-button:hover {
    background-color: inherit;
}

.accounts-open-popover .mud-list .mud-menu-list {
    max-height: inherit;
    overflow-y: auto;
    background: var(--doka-palette-gray-default) !important;
    border-radius: 16px !important;
}

.mud-menu-list {
    padding: 0px;
    border-radius: 16px;
}

.mud-popover.mud-popover-open {
    border-radius: 16px;
}

.mud-tooltip {
    max-width: 232px !important;
    width: fit-content !important;
    white-space: normal;
    border-radius: var(--mud-default-borderradius) !important;
}

.mud-input-control .mud-input-outlined-with-label .mud-input-input-control .document-textfield {
    margin-top: 0px;
}

.mud-carousel {
    border-radius: 12px;
}

.mud-swipearea {
    border-radius: 12px;
}

.mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    margin-top: 4px !important;
    margin-left: 12px !important;
    transform: none;
    font-size: var(--mud-typography-h6-size) !important;
    font-weight: var(--mud-typography-h6-weight) !important;
    line-height: 16px !important;
    color: var(--doka-palette-text-secondary) !important;
}

.mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    margin-top: 4px !important;
    margin-left: 12px !important;
    transform: none;
    font-size: var(--mud-typography-h6-size) !important;
    font-weight: var(--mud-typography-h6-weight) !important;
    line-height: 16px !important;
    color: var(--doka-palette-text-secondary) !important;
}

.mud-input-control > .mud-input-control-input-container > .mud-input-label-inputcontrol {
    font-size: 16px;
    line-height: 20px !important;
    font-weight: var(--mud-typography-h6-weight);
}

.mud-input-label-inputcontrol {
    margin-top: -8px !important;
}

.mud-input.mud-input-outlined > .mud-input-outlined-border legend {
    display: none;
}

.mud-select-input ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    margin-top: -8px !important;
    color: var(--doka-palette-text-secondary);
    font-size: 16px !important;
    font-weight: var(--mud-typography-h6-weight) !important;
    line-height: 20px !important;
}

.mud-select-input.mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    margin-top: 4px !important;
    font-size: var(--mud-typography-h6-size) !important;
    font-weight: var(--mud-typography-h6-weight) !important;
    line-height: 18px !important;
}

.button-sub-container .mud-input > input.mud-input-root-outlined {
    padding: 22.5px 14px;
}

.button-sub-container .mud-input-control.mud-input-outlined-with-label {
    margin-top: 0px;
}

.send-email-success .document-textfield .mud-input-outlined-border {
    border: 1px solid var(--doka-palette-success) !important;
    border-radius: 8px;
}

.send-email-error .document-textfield .mud-input-outlined-border {
    border: 1px solid var(--doka-palette-error) !important;
    border-radius: 8px;
}

.mud-input.mud-input-outlined.mud-shrink > .mud-input-outlined-border legend {
    top: 3px;
}

.no-transaction-container {
    justify-items: center;
    text-align: center;
}

.mud-input-control.mud-input-required > .mud-input-control-input-container > .mud-input-label::after {
    content: "" !important
}

p.mud-typography.mud-typography-body1.mud-input-adornment-text {
    font-size: 14px;
}

.doka-amount-input .mud-typography.mud-typography-body1.mud-input-adornment-text {
    font-size: var(--doka-typography-h6-size) !important;
    font-weight: var(--doka-typography-h6-weight);
    color: var(--doka-legend-label-color);
}

.mud-input-helper-text {
    line-height: 1;
}

.mud-table-root .mud-table-body .mud-table-cell {
    padding: 0px;
    padding-inline-start: 8px;
}

.mud-input-label-outlined {
    padding: 0px !important;
}

.mud-drawer.mud-drawer-temporary.mud-drawer-pos-right.mud-drawer--open:not(.mud-drawer--initial) {
    scrollbar-width: none;
}

.menu-drawer .mud-drawer-content {
    padding: 12px 4px 12px 4px;
}

.is-navigable .mud-expanded {
    border-radius: 6px !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    background: linear-gradient(104deg, rgba(255, 255, 255, 0.20) 0%, rgba(255, 255, 255, 0.02) 100%) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.07), 0 5px 20px rgba(31, 156, 235, 0.07) !important;
    color: var(--doka-palette-white) !important;
    width: 100%;
    padding: 4px !important;
}

.is-navigable .mud-nav-link-expand-icon.mud-transform {
    fill: var(--doka-color-white-to-yellow) !important;
}

.is-static .mud-expanded {
    border: none !important;
    background: transparent !important;
    color: var(--menu-color-txt) !important;
}

.is-static .mud-nav-link-expand-icon.mud-transform {
    fill: var(--mud-palette-primary) !important;
}

.mud-drawer.mud-drawer-temporary.mud-drawer-pos-left {
    scrollbar-width: none;
}

.mud-grid-item-xs-12 {
    place-items: unset;
}

@media (min-width: 488px) {
    .mud-grid-item-xs-12 {
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

@media (min-width: 1280px) {
    .mud-grid-item-xs-12 {
        place-items: unset;
    }
}

.doka-title {
    font-size: var(--mud-typography-h6-size);
}

.text-ellipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.mud-appbar .mud-toolbar-appbar {
    height: var(--mud-appbar-height);
}

.dashboard-item-width {
    width: 488px;
}

@media screen and (max-width:488px) {
    .dashboard-item-width {
        width: auto;
    }
}

.transactions-switch {
    border-radius: 8px;
    background: var(--mud-palette-white);
    padding: 0px 12px;
    font-weight: 500;
    height: 52px;
    align-content: center;
}

.communication-switch {
    border-radius: 8px;
    background: var(--mud-palette-white);
    padding: 0px 16px;
    font-weight: 500;
    align-content: center;
}

.text-secondary-color {
    color: var(--doka-palette-text-secondary) !important;
}

.mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--mud-palette-primary) !important;
}

.mud-popover.mud-popover-relative-width {
    border-radius: 8px;
    transform: translateY(4px) !important;
}

#bank-update-drawer-personel-message-item .mud-card-content {
    display: flex;
    flex-direction: column;
    gap: 8px;
    overflow-wrap: anywhere;
    background-color: #D0EBFF;
    border-radius: 8px 8px 8px 0;
}

.table-term-interest-rates-drawer {
    width: 340px;
    align-self: center;
}

.mud-select.mud-autocomplete .mud-select-input {
    cursor: pointer;
}

.mud-popover .mud-list-item {
    border-bottom: none !important;
    background-image: linear-gradient(var(--doka-palette-divider-light), var(--doka-palette-divider-light));
    background-size: calc(100% - 2px) 1px;
    background-repeat: no-repeat;
    background-position: center bottom;
}

.mud-input.mud-disabled {
    color: var(--mud-palette-secondary);
}

.mud-disabled .mud-input-adornment .mud-input-adornment-icon {
    fill: var(--mud-palette-secondary) !important;
}

.mud-input.mud-input-outlined.mud-input-adorned-end {
    padding-inline-end: 12px;
}

.mud-input > input.mud-input-root-outlined.mud-input-root-adorned-end {
    padding-inline-start: 12px;
}

.mud-radio p {
    font-size: var(--mud-typography-h3-size);
    font-weight: var(--mud-typography-h3-weight);
}

.mud-input > input.mud-input-root-outlined, div.mud-input-slot.mud-input-root-outlined {
    padding: 20.5px 14px;
}

.mud-divider-light {
    opacity: 0.5;
}

.mud-list-item-text p {
    font-size: var(--doka-typography-h5-size);
    font-weight: var(--doka-typography-h4-weight);
}

button.mud-button-root.mud-icon-button.mud-ripple.mud-ripple-icon.mud-picker-calendar-day.mud-day.mud-hidden {
    opacity: 0 !important;
}

.accounts-open-popover.mud-ripple::after {
    display: none !important;
    background-image: none !important;
    opacity: 0 !important;
    transition: none !important;
}

.customer-campaign-dialog.mud-dialog {
    width: auto;
    padding: 12px;
    border-radius: var(--doka-border-radius-dialog) !important;
    border: 1px solid var(--doka-dialog-color-background-gray);
    background-color: var(--doka-dialog-color-background-gray);
}

.bank-update-personel-card .mud-card-content ul {
    margin-left: 15px;
}

.customer-campaign-dialog .mud-dialog-actions {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    max-width: 100%;
    gap: 8px;
    padding: 12px 0 0;
    contain: inline-size;
}

.customer-campaign-dialog .mud-dialog-actions > :not(:first-child) {
    margin: 0;
}

.customer-campaign-dialog .mud-dialog-actions > .mud-button {
    flex: 1 1 0;
    min-width: fit-content;
    white-space: nowrap;
}