@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

:root {
    --shadow-1-color: rgba(0,0,0,0.1);
    --shadow-2-color: rgba(0,0,0,0.04);
    --shadow-3-color: rgba(0,0,0,0.02);
    --main-text-color: rgba(34, 34, 34, 1);
    --mud-palette-primary-hover: rgba(251, 229, 233, 1) !important;
    --mud-palette-action-default-hover: rgb(253, 43, 112,.1) !important;
    --mud-palette-tertiary: var(--line-color) !important;
    --mud-palette-tertiary-hover: rgba(204, 204, 204, .02) !important;
    --mud-palette-divider: #cccccc !important;
    --mud-palette-primary: #FD2B70 !important;
    --mud-palette-lines-inputs: #ccccccff;
    --mud-default-borderradius: 6px !important;
    --mud-elevation-1: 0px 2px 1px -1px var(--shadow-1-color),0px 1px 1px 0px var(--shadow-2-color),0px 1px 3px 0px var(--shadow-3-color) !important;
    --description-color: rgba(153, 153, 153, 1);
    --mud-typography-button-lineheight: 1.412 !important;
    --mud-typography-button-weight: 400 !important;
    --mud-typography-button-size: 1rem !important;
    --mud-zindex-dialog: 1405;
    --mud-appbar-height: 3rem !important;
}

:root {
    --line-color: rgba(221, 221, 221, 1);
    --header-table: rgba(241, 241, 241, 1);
    --dark-light-color: rgba(249, 249, 249, 1);
    --bs-dark-rgb: rgba(221, 221, 221, 1);
    --gray-color-text: rgba(200, 200, 200, 1);
    --line-dark-color: rgba(246, 246, 246, 1);
    --disabled-color: rgba(255, 255, 255, .2);
    --disabled-btn-color: rgba(96, 95, 109, 0.03);
    --disabled-text-color: rgba(153, 153, 153, 0.3);
    --secondary-color: rgba(230, 230, 230, 1);
    --overview-1-color: #EFF4FD;
    --overview-2-color: #FDF7EF;
    --overview-3-color: #F1FDEF;
    --overview-4-color: #F8EFFD;
    --bs-secondary-rgb: #007EFF;
    --bs-success-rgb: 18, 195, 57;
    --bs-success-rgba: #F1FDEF;
    --bs-danger-rgba: #FBE5E9;
    --bs-dark-rgba: #EEEEEE;
}

@media (min-width: 900px) {
    :root {
        --default-size: 13px;
        --mud-drawer-width-left: 14.29rem !important;
    }
}

@media (min-width: 1200px) {
    :root {
        --default-size: 14px;
        --mud-drawer-width-left: 17rem !important;
    }
}

@media (min-width: 1440px) {
    :root {
        --default-size: 16px;
        --mud-drawer-width-left: 18.75rem !important;
    }
}

html {
    font-size: var(--default-size);
}

body {
    font-size: 1rem;
    font-family: 'Roboto','Helvetica Neue', Helvetica, Arial, sans-serif;
    color: var(--main-text-color);
}

input, button, select, optgroup, textarea {
    text-align: inherit;
}

h1:focus {
    outline: none;
}

a, .btn-link {
    color: #0071c1;
}

p {
    margin-bottom: .25rem;
}

.link {
    cursor: pointer;
    text-decoration: none;
}

.bg-dark-light {
    background-color: var(--dark-light-color);
}

.cl-dark-light, .text-dark-light {
    color: var(--dark-light-color);
}

.bg-white {
    background-color: #fff;
}

.cl-white, .text-white {
    color: #fff;
}

.text-default {
    color: var(--main-text-color);
}

.text-description {
    color: var(--description-color);
}

.bg-primary {
    background-color: var(--mud-palette-primary) !important;
}

.cl-primary, .text-primary {
    color: var(--mud-palette-primary) !important;
}

.bg-secondary {
    background-color: var(--bs-secondary-rgb) !important;
}

.cl-secondary, .text-secondary {
    color: var(--bs-secondary-rgb) !important;
}

.bg-gray {
    background-color: var(--bs-dark-rgb);
}

.cl-gray, .text-gray {
    color: var(--gray-color-text);
}

.bg-overlay {
    background-color: rgba(0,0,0,.6);
}

.fi-black path {
    fill: #000;
}

.bg-overview-1 {
    background-color: var(--overview-1-color);
}

.bg-overview-2 {
    background-color: var(--overview-2-color);
}

.bg-overview-3 {
    background-color: var(--overview-3-color);
}

.bg-overview-4 {
    background-color: var(--overview-4-color);
}

.bg-success-rgba {
    background-color: var(--bs-success-rgba);
}

.bg-danger-rgba {
    background-color: var(--bs-danger-rgba);
}

.bg-dark-rgba {
    background-color: var(--bs-dark-rgba);
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }
/*--------------------------*/
.loading-progress {
    position: fixed;
    display: block;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,.1);
    z-index: 1404;
}

    .loading-progress .loading-progress-inner {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .loading-progress .mud-progress-circular.mud-progress-medium {
        width: 5rem;
        height: 5rem;
    }

.loading-progress-text {
    position: absolute;
    text-align: center;
    font-weight: bold;
    inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
}

    .loading-progress-text:after {
        content: var(--blazor-load-percentage-text, "Loading");
    }
/*--------------------------*/
.flex-wrap {
    -webkit-flex: none;
    -ms-flex: none;
    flex: none;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
}

.flex-fix {
    -webkit-flex: none;
    -ms-flex: none;
    flex: none;
}

.flex-1 {
    flex: 1 1;
}

.flex-line {
    position: relative;
    width: 100%;
    height: 1px;
}

    .flex-line::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 1px;
        background-color: var(--line-color);
    }

.flex-scroll {
    -webkit-flex: 1 1;
    -ms-flex: 1 1;
    flex: 1 1;
    overflow-x: hidden;
}

.ele-mid-hoz {
    left: 50%;
    transform: translateX(-50%);
}

.ele-mid-ver {
    top: 50%;
    transform: translateY(-50%);
}

.ele-mid {
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

.flex-direction-column {
    flex-direction: column;
}

[class*='br--line'] {
    display: block;
    width: 100%;
    border-top-color: var(--line-dark-color);
    border-top-style: solid;
    height: 0 !important;
    opacity: 1 !important;
    margin: 0;
    background: none;
}

.br--line {
    border-top-width: 1px;
}

.br--line-2 {
    border-top-width: 2px;
}

.br--line-4 {
    border-top-width: 4px;
}

.br--line-8 {
    border-top-width: 8px;
}

.line_ver {
    width: 1px;
    background-color: var(--line-color);
}

.line_hoz {
    height: 1px;
    background-color: var(--line-color);
}

.rotate-45 {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

.w-90 {
    width: 90%;
}

.w-95 {
    width: 95%;
}

.w-240px {
    width: 240px;
}

.bg-img-default {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.svg-icon__stroke {
    stroke: #d9d9d9;
}

.form-check-input {
    width: 1.15rem;
    height: 1.15rem;
}

.form-check .form-check-input {
    margin-left: -1rem;
}

.form-check-input[type=checkbox] {
    border-radius: 0;
}

.form-check-input:checked {
    background-color: var(--mud-palette-primary);
    border-color: var(--mud-palette-primary);
}

.form-check-input:focus {
    border-color: var(--mud-palette-primary);
    box-shadow: 0 0 0 .25rem var(--mud-palette-primary-hover);
}

.form-switch {
    display: flex;
    padding-left: 0;
}

    .form-switch .form-check-input[type=checkbox] {
        border-radius: 2rem;
        width: 3rem;
        margin-left: 0;
    }

/*------------------------------------*/
.disabled {
    pointer-events: none;
    color: rgba(0, 0, 0, 0.25) !important;
    opacity: 50%;
}

.small {
    font-size: 80% !important;
}

.dot {
    display: flex;
    width: 8px;
    height: 8px;
    background-color: #fff;
    border-radius: 50%;
}

.text-right {
    text-align: right !important;
}

.text-left {
    text-align: left !important;
}

.text-center {
    text-align: center !important;
}

.text-uppercase {
    text-transform: uppercase;
}

.break-all {
    word-break: break-all;
}

.bold {
    font-weight: 700 !important;
}

.circle {
    border-radius: 50% !important;
}

.text-1-line {
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
}
/*------------------------------------*/
.mud-input-control {
    margin-top: 0;
}

.mud-input-adornment-end {
    margin-left: 0px;
    margin-inline-start: 0px;
}

.mud-input-label-outlined {
    transform: translate(14px,18px) scale(1);
}

.mud-input > input.mud-input-root.mud-input-root-filled,
div.mud-input-slot.mud-input-root.mud-input-root-filled {
    /*padding: 12px 10px 13px 10px;*/
    padding: 19px 12px 16px 12px;
}

.mud-input.mud-input-filled.mud-input-underline:before,
.mud-input.mud-input-filled.mud-input-underline:after {
    display: none
}

.mud-input.mud-input-filled {
    border-radius: 0;
    background-color: transparent !important;
    border: 1px solid var(--line-color);
}

.mud-input.mud-disabled {
    /*background-color: var(--disabled-color);*/
    background-color: var(--bs-dark-rgb);
    background-image: repeating-linear-gradient(135deg,transparent,transparent 1px,#fff 1px,#fff 5px,transparent 5px,transparent 6px,#fff 6px,#fff 10px);
    background-size: 7px 7px;
}

.mud-input-small .mud-input > input.mud-input-root, .mud-input-small div.mud-input-slot.mud-input-root {
    height: 34px;
    padding: 0 13px;
}
/*------------------------------------*/
.mud-button {
    border: 1px solid transparent;
    text-transform: inherit;
    height: 3rem /*3.5rem*/;
}

    .mud-button.rounded {
        border-radius: .25rem !important;
    }

.mud-button-filled {
    --mud-palette-primary-text: #ffffff;
}

    .mud-button-filled.mud-button-filled-default {
        --mud-palette-action-default-hover: rgba(238, 238, 238, 1);
        --mud-palette-text-primary: var(--mud-palette-primary);
    }

    .mud-button-filled.mud-button-filled-primary:hover, .mud-button-filled.mud-button-filled-primary:focus-visible {
        background-color: transparent;
        color: var(--mud-palette-primary);
        border: 1px solid var(--mud-palette-primary);
        box-shadow: none;
    }

.mud-button.flat {
    border-radius: 0 !important;
}

.mud-button-filled-size-large {
    padding: 1rem;
}

.mud-button-filled-size-small {
    height: 2.75rem;
}

.mud-button-root.transparent {
    background-color: transparent;
}

.mud-dialog .mud-dialog-title {
    padding: 1.05rem;
}

    .mud-dialog .mud-dialog-title .mud-button-close {
        background-color: transparent !important;
        right: auto;
        left: 8px;
        color: #222;
    }

.mud-button-label {
    text-align: center;
}

.mud-dialog.header-line .mud-dialog-title {
    position: relative;
}

    .mud-dialog.header-line .mud-dialog-title::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 1px;
        background-color: var(--line-color);
    }
/*-------------------*/
.mud-appbar {
    z-index: 1303;
}

.mud-drawer.mud-drawer-temporary.mud-drawer-pos-left {
    top: var(--mud-appbar-height);
    height: calc(100% - var(--mud-appbar-height));
}

.mud-popover.mud-popover-open {
    z-index: 1403 !important;
}
/*----------------------*/
.mud-nav-item,
.mud-nav-group {
    padding: 1px .5rem;
}

    .mud-nav-group .mud-nav-item {
        padding: 1px 0;
    }

.mud-nav-link {
    border-radius: .5rem;
    font-weight: 700;
}

.mud-nav-link {
    text-decoration: none;
}

    .mud-nav-link:hover:not(.mud-nav-link-disabled),
    .mud-nav-link:focus:not(.mud-nav-link-disabled),
    .mud-nav-link.active:not(.mud-nav-link-disabled) {
        color: var(--mud-palette-primary);
    }

.mud-nav-item.active .mud-nav-link {
    color: var(--mud-palette-primary);
    background-color: var(--mud-palette-action-default-hover);
}

.mud-nav-link-text svg {
    padding: 0 10px 0 0;
    width: 2.25rem;
}

.page_subnav {
    position: relative;
    flex: none;
}

.subnav_wrapper {
    position: relative;
    flex: none;
    transition-duration: .3s;
    overflow: hidden;
    height: 100%;
}

.btn_subnav {
    position: absolute;
    width: 20px;
    height: 40px;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.08);
    border-radius: 8px 0 0 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
    cursor: pointer;
}

    .btn_subnav .ico-left {
    }

.page_subnav.collapsed .subnav_wrapper {
    width: 0px;
}

.page_subnav.expanded .subnav_wrapper {
    width: var(--mud-drawer-width-left);
}

.page_subnav.collapsed .btn_subnav {
    transform: rotate(180deg) translateX(-20px);
}

.subnav {
    width: var(--mud-drawer-width-left);
    position: relative;
    height: 100%;
    padding-top: .5rem;
    overflow-y: auto;
    overflow-x: hidden;
}

.page-wraper {
    display: flex;
    padding-top: var(--mud-appbar-height);
    height: 100vh;
    overflow: hidden;
}

.page-content {
    overflow-y: scroll;
    background-color: var(--dark-light-color);
    position: relative;
}

    .page-content::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0px;
        height: 100%;
        width: 1px;
        background-color: var(--line-color);
    }

.mud-simple-table table * tr > td,
.mud-simple-table table * tr th {
    padding: .5rem;
    font-size: 1rem;
    /*width:0px;*/
    overflow: hidden;
    white-space: nowrap;
}

    .mud-simple-table table * tr > td:last-child {
        min-width: 1rem;
    }

    .mud-simple-table table * tr > td span {
        white-space: nowrap;
        /*overflow: hidden;
        text-overflow: ellipsis;*/
        display: block;
    }

.mud-simple-table table * tr > th {
    font-weight: 700;
    line-height: 1;
    /*min-width:1px;*/
    /*width:1px;*/
}

.tbl-dark .mud-table-head,
.tbl-dark.mud-table-sticky-header * .mud-table-root .mud-table-head * .mud-table-cell {
    background-color: var(--header-table);
}

    .tbl-dark .mud-table-head th {
        padding: .75rem .5rem;
    }

    .tbl-dark .mud-table-head th {
        white-space: nowrap;
    }

.add-more {
    position: absolute;
    right: 0;
    z-index: 1;
    margin-right: -10px;
    top: 15px;
    background-color: #fff;
    border-radius: 50%
}

.box-filter {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    width: 400px;
    overflow: hidden;
    flex-wrap: wrap;
}

    .box-filter .expanded {
        transform: translateX(0%);
    }

    .box-filter .collapsed {
        transform: translateX(100%);
    }

    .box-filter .content {
        width: 100%;
        transition: transform 300ms linear;
        position: relative;
    }

.btn-filter * {
    color: var(--main-text-color);
}

.icon-margin-0 .mud-input-adornment {
    margin-top: 0;
}
/*----------------modal----------------------*/
.modal-fullscreen {
    width: calc(100vw - var(--mud-appbar-height));
}

.mud-dialog-title {
    -webkit-flex: none;
    -ms-flex: none;
    flex: none;
}

.center-tilte .mud-dialog-title {
    text-align: center;
}

.modal-dialog-actions {
    position: fixed;
    right: 0;
    top: 8px;
    z-index: 1;
}

.section-n {
    width: 100%;
    margin: auto;
    max-width: 1200px;
}

.mud-dialog {
    -webkit-flex: none;
    -ms-flex: none;
    flex: none;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
}

    .mud-dialog .outline-none {
        -webkit-flex: 1 1;
        -ms-flex: 1 1;
        flex: 1 1;
        overflow-x: hidden;
    }

        .mud-dialog .outline-none > div {
            height: 100%;
            -webkit-flex: none;
            -ms-flex: none;
            flex: none;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-flex-direction: column;
            -ms-flex-direction: column;
            flex-direction: column;
        }

    .mud-dialog .mud-dialog-content {
        padding: 0;
        -webkit-flex: 1 1;
        -ms-flex: 1 1;
        flex: 1 1;
        overflow-x: hidden;
    }

    .mud-dialog .mud-dialog-actions {
        padding: 0;
        -webkit-flex: none;
        -ms-flex: none;
        flex: none;
        position: sticky;
        bottom: 0;
        left: 0;
        background-color: #fff;
        z-index: 1;
    }

.table-wraper {
    width: 0;
    min-width: 100%;
    position: relative;
}

.mud-menu {
    display: flex;
}

.mud-avatar-outlined-default {
    border-color: var(--mud-palette-lines-default)
}

.footer-line .mud-dialog-actions {
    border-top: 1px solid var(--mud-palette-lines-inputs);
}
/*---------------------------*/
.dropzone {
    border: 3px dashed steelblue;
    padding: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #eee;
    box-shadow: inset 0 0 8px rgba(0,0,0,0.2);
    color: #444;
    font-size: 1.5rem;
    cursor: pointer;
    position: relative;
}

    .dropzone:hover {
        background-color: #f3f3f3;
        color: #333;
    }

    .dropzone input[type=file] {
        position: absolute;
        width: 100%;
        height: 100%;
        opacity: 0;
        cursor: pointer;
    }

.dropzone-drag {
    background-color: palegreen;
}

.tabs-header-sticky {
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 0;
    z-index: 12;
}

.btn-del-img {
    position: absolute;
    top: 0;
    right: 0;
}

.drag {
    cursor: grabbing;
}

.mud-chip.chip-in-select {
    border-radius: 2px;
}

.mud-chipset.flex-wrap {
    flex-direction: row;
    flex: auto;
}

.mud-picker.no-line .mud-input.mud-input-underline:before {
    display: none;
}

.mud-picker.no-line .mud-input-control > .mud-input-control-input-container > div.mud-input.mud-input-text {
    margin-top: 0;
}

.simple-mud-table-bordered td {
    border-bottom: 1px solid var(--mud-palette-table-lines);
    padding: .5rem 1rem !important;
}

    .simple-mud-table-bordered td:not(:last-child) {
        border-right: 1px solid var(--mud-palette-table-lines);
    }

.mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    font-weight: 700;
}

.mud-dialog-fit {
    max-width: none;
    max-width: fit-content;
    height: auto;
}

.mud-paper {
    border-radius: var(--mud-default-borderradius) !important;
}

.mud-paper-square {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}

    .mud-paper-square .content {
        position: absolute;
        padding: 0;
        left: 0;
        width: 100%;
    }

    .mud-paper-square:before {
        content: '';
        display: table;
        padding-bottom: 100%;
        height: 0;
    }

.mud-paper-outlined.selected, .mud-paper-outlined.hover:hover {
    --mud-palette-lines-default: var(--mud-palette-primary);
}

.mud-picker-full .mud-input-control {
    height: 100%;
}

    .mud-picker-full .mud-input-control > .mud-input-control-input-container {
        height: 100%;
    }

        .mud-picker-full .mud-input-control > .mud-input-control-input-container > div.mud-input.mud-input-text {
            margin: 0;
            height: 100%;
        }

.mud-picker-full .mud-input > input.mud-input-root {
    height: 100% !important;
}

.upload-item {
    text-align: center;
}

    .upload-item img {
        display: block;
    }

.upload-item-img {
    border: 1px solid var(--line-color);
    margin-bottom: 3px;
    width: 80px;
    height: 80px;
    overflow: hidden;
    padding: 1px;
    transition: all ease-in-out .3s;
}

.upload-item:hover .upload-item-img {
    border-color: var(--mud-palette-primary);
    cursor: pointer;
}

.btn-del-img {
    display: none;
    transition: all ease-in-out .3s;
    z-index: 1;
}

.upload-item:hover .btn-del-img {
    display: block;
}

.mud-snackbar-custome {
    max-width: none;
    min-width: 100vw;
    margin-top: 0;
    justify-content: center;
}

    .mud-snackbar-custome .mud-snackbar-content-action {
        position: absolute;
        right: 2rem;
    }

.mud-table .mud-avatar.mud-avatar-medium {
    width: 3.25rem;
    height: 3.25rem;
    font-size: 1.25rem;
}

.mud-table .mud-chip {
    /*display:flex;*/
}

#mud-snackbar-container {
    top: var(--mud-appbar-height);
}

.lottie-1 {
    position: absolute;
    height: 75%;
    top: 5%;
}

.lottie-2 {
    position: absolute;
    height: 75%;
    bottom: -26%;
}

.mud-avatar {
    display: flex;
    margin: auto;
    width: 3.5rem;
    height: 3.5rem;
}

    .mud-avatar.mud-avatar-large {
        width: 7rem;
        height: 7rem;
    }

    .mud-avatar.mud-avatar-medium {
        width: 3.5rem;
        height: 3.5rem;
    }

.avatar.mud-avatar.mud-avatar-medium {
    width: 40px;
    height: 40px;
}

.mud-drawer .mud-navmenu {
    padding: .5rem 0;
}

.mud-tabs.flex-scroll .mud-tabs-toolbar-content .mud-tabs-toolbar-wrapper {
    width: 100%;
}

.mud-tabs-toolbar-content .mud-tabs-toolbar-wrapper > div {
    flex: 1 1 0;
}

.mud-select-input-extended .flex-wrap {
    flex: auto;
    height: auto;
    flex-direction: inherit;
}

div.mud-input-slot.mud-input-root.mud-select-input-custom {
    padding: 12px 13px !important;
    height: auto !important;
    min-height: 30px;
}

.mud-navmenu {
    /*margin: .5rem 0 0 0;*/
}

.mud-simple-table table {
    border: 1px solid var(--mud-palette-table-lines);
    border-bottom: none;
}

.align-items-start .mud-checkbox {
    align-items: start;
}

.mud-input > input.mud-input-root, div.mud-input-slot.mud-input-root {
    /*height:2rem!important;*/
    height: 1.25rem !important;
    padding: 18px 14px;
}

.mud-input-label-inputcontrol.top {
    top: -1rem;
}

.mud-input-label-inputcontrol.bottom {
    top: .5rem;
}

.mud-select .mud-select-input .mud-input-slot {
    display: flex;
    align-items: center;
}

.mud-list.mud-list-padding {
    padding: 0;
}
/*-------------------------------*/
.select-box {
    position: relative;
    display: block;
    width: 100%;
    margin: 0 auto;
    color: #60666d;
}

    .select-box .select {
        position: relative;
        width: 100%;
    }

        .select-box .select svg {
            position: absolute;
            right: 12px;
            top: calc(50% - 3px);
            width: 15px;
            height: 9px;
            stroke-width: 2px;
            fill: #9098a9;
            stroke-linecap: round;
            stroke-linejoin: round;
            pointer-events: none;
        }

        .select-box .select select {
            -webkit-appearance: none;
            padding: 15px 14px;
            width: 100%;
            border: 1px solid #e8eaed;
            border-radius: 0;
            background: #fff;
            box-shadow: none;
            cursor: pointer;
            transition: all 150ms ease;
        }

            .select-box .select select:required:invalid {
                color: #5a667f;
            }

            .select-box .select select option {
                color: #223254;
                padding: 6px 0;
            }

                .select-box .select select option[value=""][disabled] {
                    display: none;
                }

            .select-box .select select:focus {
                outline: none;
                box-shadow: 0 0 0 1px var(--mud-palette-primary);
                border-color: var(--mud-palette-primary);
            }

            .select-box .select select:hover + svg {
                fill: var(--mud-palette-primary);
            }

    .select-box .sprites {
        position: absolute;
        width: 0;
        height: 0;
        pointer-events: none;
        user-select: none;
    }

.mud-chip-text.mud-chip-color-primary {
    color: inherit;
    background-color: var(--mud-palette-action-default);
}

    .mud-chip-text.mud-chip-color-primary:hover:not(.mud-disabled), .mud-chip-text.mud-chip-color-primary:focus-visible:not(.mud-disabled) {
        background-color: var(--mud-palette-action-default);
    }

.mud-dialog-title h6 {
    font-size: 1.5rem;
}

.modal-dialog-actions.sub-nav {
    left: 0;
    top: 60px;
    font-size: .85rem;
}

.mud-breadcrumb-item > a {
    color: var(--mud-palette-primary);
    text-decoration: none !important;
}

.like-subnav .mud-tabs-toolbar {
    width: var(--mud-drawer-width-left);
}

.like-subnav .mud-tabs-toolbar-content .mud-tabs-toolbar-wrapper {
    width: 100%;
}

.like-subnav .mud-tab {
    justify-content: space-between;
    font-weight: 400;
    line-height: inherit;
    text-align: left;
    display: flex;
}

    .like-subnav .mud-tab .icon {
        margin-right: 6px;
    }

        .like-subnav .mud-tab .icon svg {
            fill: #222;
            width: 18px;
        }

    .like-subnav .mud-tab .title {
        color: inherit !important;
    }

    .like-subnav .mud-tab.mud-tab-active {
        color: inherit;
        background-color: var(--mud-palette-primary-hover);
    }

        .like-subnav .mud-tab.mud-tab-active .title {
            font-weight: 700;
        }

.like-subnav .mud-tab-slider {
    background: none;
}

.small-select.mud-select .mud-select-input .mud-input-slot {
    padding: .315rem;
    font-size: .85rem;
}

.list-search-role .icon {
    margin-right: 6px;
}

    .list-search-role .icon svg {
        fill: #222;
        width: 18px;
    }

.list-search-role li {
    padding-left: 42px;
}
/*--------------------------------------*/
.form-floating > .form-control, .form-floating > .form-select {
    height: calc(3.375rem + 2px);
}

.btn {
    display: inline-flex;
    height: calc(3.375rem + 2px);
}

    .btn.disabled, .btn:disabled {
        background-color: var(--disabled-btn-color) !important;
        border-color: var(--disabled-btn-color) !important;
        color: var(--disabled-text-color) !important;
    }

.btn-primary {
    background-color: var(--mud-palette-primary);
    border-color: var(--mud-palette-primary);
}

    .btn-primary:hover {
        background-color: transparent;
        color: var(--mud-palette-primary);
        border-color: var(--mud-palette-primary);
    }

    .btn-check:focus + .btn-primary, .btn-primary:focus {
        color: #fff;
        background-color: var(--mud-palette-primary);
        border-color: var(--mud-palette-primary);
        box-shadow: 0 0 0 .25rem var(--mud-palette-primary-hover)
    }

    .btn-check:active + .btn-primary, .btn-check:checked + .btn-primary, .btn-primary.active, .btn-primary:active, .show > .btn-primary.dropdown-toggle {
        color: #fff;
        background-color: var(--mud-palette-primary);
        border-color: var(--mud-palette-primary)
    }

        .btn-check:active + .btn-primary:focus, .btn-check:checked + .btn-primary:focus, .btn-primary.active:focus, .btn-primary:active:focus, .show > .btn-primary.dropdown-toggle:focus {
            box-shadow: 0 0 0 .25rem var(--mud-palette-primary-hover)
        }

    .btn-primary.disabled, .btn-primary:disabled {
        color: #fff;
        background-color: var(--mud-palette-primary);
        border-color: var(--mud-palette-primary)
    }

.btn-secondary {
    color: #fff;
    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
    box-shadow: none;
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background-color: transparent;
        border-color: var(--secondary-color);
        box-shadow: none;
    }

.btn-rounded {
    border-radius: 1rem;
}

.btn-small {
    height: calc(2rem + 2px);
    font-size: .85rem;
}

.form-floating > label {
    padding: 0;
    margin: 1rem .75rem;
    height: auto;
}

.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label {
    transform: scale(.75) translateY(-2.15rem) translateX(.15rem);
    font-weight: 700;
    background-color: #fff;
    opacity: 1;
}

.form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown),
.form-floating > .form-select:focus, .form-floating > .form-select:not(:placeholder-shown) {
    padding-top: 1.125rem;
    padding-bottom: 1.125rem;
}

.form-control:focus, .form-select:focus {
    border-color: var(--mud-palette-primary);
    box-shadow: 0 0 0 .25rem var(--mud-palette-primary-hover);
}

.form-control[readonly] {
    background-color: #fff;
}

.form-floating.form-search > .form-control {
    padding-left: 2.5rem;
}

.form-search {
    position: relative;
}

    .form-search .icon {
        position: absolute;
        left: 0;
        top: 0;
        height: 100%;
        width: 2.5rem;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 50%;
        background-image: url('data:image/svg+xml,<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20.7495 19.6929L15.0855 14.0289C16.4466 12.3949 17.1253 10.299 16.9805 8.17731C16.8356 6.05561 15.8784 4.07143 14.3079 2.63752C12.7374 1.20361 10.6745 0.430388 8.54844 0.478697C6.42236 0.527006 4.39674 1.39313 2.89298 2.89689C1.38922 4.40065 0.5231 6.42626 0.474791 8.55235C0.426482 10.6784 1.19971 12.7413 2.63361 14.3118C4.06752 15.8823 6.0517 16.8396 8.1734 16.9844C10.2951 17.1292 12.391 16.4505 14.025 15.0894L19.689 20.7534L20.7495 19.6929ZM1.99948 8.75338C1.99948 7.41836 2.39536 6.11332 3.13706 5.00328C3.87876 3.89325 4.93296 3.02809 6.16636 2.5172C7.39976 2.0063 8.75696 1.87263 10.0663 2.13308C11.3757 2.39353 12.5784 3.03641 13.5224 3.98041C14.4665 4.92442 15.1093 6.12715 15.3698 7.43652C15.6302 8.74589 15.4966 10.1031 14.9857 11.3365C14.4748 12.5699 13.6096 13.6241 12.4996 14.3658C11.3895 15.1075 10.0845 15.5034 8.74948 15.5034C6.95987 15.5014 5.24414 14.7896 3.9787 13.5242C2.71326 12.2587 2.00146 10.543 1.99948 8.75338Z" fill="%23777777"/></svg>');
    }

    .form-search label {
        left: 2.5rem;
    }

    .form-search .form-control {
        height: calc(3.375rem + 2px);
    }

.form-control[readonly] {
    background-color: #fff;
}

.form-floating.form-search.suf > .form-control {
    padding: 0;
    padding-right: 2.5rem;
}

.form-search.suf .icon {
    position: absolute;
    left: auto;
    right: 0;
    top: 0;
    height: 100%;
    width: 2.5rem;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50%;
    background-image: url('data:image/svg+xml,<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20.7495 19.6929L15.0855 14.0289C16.4466 12.3949 17.1253 10.299 16.9805 8.17731C16.8356 6.05561 15.8784 4.07143 14.3079 2.63752C12.7374 1.20361 10.6745 0.430388 8.54844 0.478697C6.42236 0.527006 4.39674 1.39313 2.89298 2.89689C1.38922 4.40065 0.5231 6.42626 0.474791 8.55235C0.426482 10.6784 1.19971 12.7413 2.63361 14.3118C4.06752 15.8823 6.0517 16.8396 8.1734 16.9844C10.2951 17.1292 12.391 16.4505 14.025 15.0894L19.689 20.7534L20.7495 19.6929ZM1.99948 8.75338C1.99948 7.41836 2.39536 6.11332 3.13706 5.00328C3.87876 3.89325 4.93296 3.02809 6.16636 2.5172C7.39976 2.0063 8.75696 1.87263 10.0663 2.13308C11.3757 2.39353 12.5784 3.03641 13.5224 3.98041C14.4665 4.92442 15.1093 6.12715 15.3698 7.43652C15.6302 8.74589 15.4966 10.1031 14.9857 11.3365C14.4748 12.5699 13.6096 13.6241 12.4996 14.3658C11.3895 15.1075 10.0845 15.5034 8.74948 15.5034C6.95987 15.5014 5.24414 14.7896 3.9787 13.5242C2.71326 12.2587 2.00146 10.543 1.99948 8.75338Z" fill="%23777777"/></svg>');
}

.form-search.suf label {
    left: auto;
}

.list-group-item-action:focus, .list-group-item-action:hover, .list-group-item-action:active, .list-group-item-action.active {
    background-color: var(--mud-palette-primary-hover);
}

.item-radio {
    position: relative;
}

    .item-radio .button-label {
        display: flex;
        cursor: pointer;
        color: #292929;
        background: #fff;
        transition: 0.3s;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

        .item-radio .button-label:hover {
            background: #d6d6d6;
            color: #101010;
        }

.item-radio-input:checked + .button-label {
    background: var(--mud-palette-primary);
    color: #fff;
}

    .item-radio-input:checked + .button-label:hover, .item-radio-input:checked + .button-label:active {
        background: var(--mud-palette-primary);
        color: #fff;
    }

.item-radio-input:disabled + .button-label {
    background: var(--disabled-bgcolor) !important;
}

.form-switch .form-check-input {
    width: 3rem;
    height: 1.75rem;
}

.form-check {
    display: block;
    min-height: 1.75rem;
    padding-left: 1.75em;
    margin-bottom: .175rem;
}

.form-check-input {
    width: 1.5rem;
    height: 1.5rem;
    box-shadow: none !important;
}

.form-check .form-check-input[type=checkbox] {
    border-radius: 0;
    margin-left: -1.75rem;
}

.form-check .form-check-input[type=radio] {
    margin-left: -1.75rem;
}

.form-check-input:checked {
    background-color: var(--mud-palette-primary) !important;
    border-color: var(--mud-palette-primary) !important;
}

.form-check-input:focus {
    border-color: var(--mud-palette-primary);
    box-shadow: none /* 0 0 0 0.25rem var(--primary-shadow-color);*/
}

.form-check-input[type=checkbox]:indeterminate {
    background: none;
}

.form-check .form-check-label {
    margin-top: .5rem;
    margin-left: .25rem;
}

.field-icon {
    position: absolute;
    z-index: 2;
    top: 0;
    right: 0;
    height: 100%;
    width: 3rem;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50%;
    background-image: url('data:image/svg+xml,<svg width="22" height="21" viewBox="0 0 22 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.725 11.525L13.625 10.425C14.0583 9.24167 13.8333 8.25833 12.95 7.475C12.0667 6.69167 11.1083 6.49167 10.075 6.875L8.975 5.775C9.25833 5.59167 9.575 5.45833 9.925 5.375C10.275 5.29167 10.6333 5.25 11 5.25C12.1833 5.25 13.1875 5.6625 14.0125 6.4875C14.8375 7.3125 15.25 8.31667 15.25 9.5C15.25 9.86667 15.2042 10.2292 15.1125 10.5875C15.0208 10.9458 14.8917 11.2583 14.725 11.525ZM17.95 14.75L16.95 13.75C17.7667 13.15 18.4792 12.4792 19.0875 11.7375C19.6958 10.9958 20.1417 10.25 20.425 9.5C19.5917 7.65 18.3417 6.1875 16.675 5.1125C15.0083 4.0375 13.2 3.5 11.25 3.5C10.55 3.5 9.83333 3.56667 9.1 3.7C8.36667 3.83333 7.79167 3.99167 7.375 4.175L6.225 3C6.80833 2.73333 7.55417 2.5 8.4625 2.3C9.37083 2.1 10.2583 2 11.125 2C13.5083 2 15.6875 2.67917 17.6625 4.0375C19.6375 5.39583 21.0833 7.21667 22 9.5C21.5667 10.5667 21.0083 11.5417 20.325 12.425C19.6417 13.3083 18.85 14.0833 17.95 14.75ZM19.4 20.4L15.2 16.275C14.6167 16.5083 13.9583 16.6875 13.225 16.8125C12.4917 16.9375 11.75 17 11 17C8.56667 17 6.35833 16.3208 4.375 14.9625C2.39167 13.6042 0.933333 11.7833 0 9.5C0.333333 8.63333 0.795833 7.7875 1.3875 6.9625C1.97917 6.1375 2.7 5.35 3.55 4.6L0.4 1.45L1.45 0.375L20.375 19.3L19.4 20.4ZM4.575 5.65C3.95833 6.1 3.3625 6.69167 2.7875 7.425C2.2125 8.15833 1.8 8.85 1.55 9.5C2.4 11.35 3.67917 12.8125 5.3875 13.8875C7.09583 14.9625 9.03333 15.5 11.2 15.5C11.75 15.5 12.2917 15.4667 12.825 15.4C13.3583 15.3333 13.7583 15.2333 14.025 15.1L12.425 13.5C12.2417 13.5833 12.0167 13.6458 11.75 13.6875C11.4833 13.7292 11.2333 13.75 11 13.75C9.83333 13.75 8.83333 13.3417 8 12.525C7.16667 11.7083 6.75 10.7 6.75 9.5C6.75 9.25 6.77083 9 6.8125 8.75C6.85417 8.5 6.91667 8.275 7 8.075L4.575 5.65Z" fill="%23222222"/></svg>');
}

    .field-icon.fa-eye {
        background-image: url('data:image/svg+xml,<svg width="22" height="15" viewBox="0 0 22 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.003 11.75C12.1843 11.75 13.1875 11.3365 14.0125 10.5096C14.8375 9.6826 15.25 8.67843 15.25 7.49705C15.25 6.31568 14.8365 5.3125 14.0096 4.4875C13.1826 3.6625 12.1784 3.25 10.9971 3.25C9.81568 3.25 8.8125 3.66348 7.9875 4.49045C7.1625 5.3174 6.75 6.32157 6.75 7.50295C6.75 8.68432 7.16348 9.6875 7.99045 10.5125C8.8174 11.3375 9.82157 11.75 11.003 11.75ZM10.9941 10.3C10.2147 10.3 9.55417 10.0272 9.0125 9.48163C8.47083 8.93603 8.2 8.27353 8.2 7.49413C8.2 6.71471 8.47279 6.05417 9.01837 5.5125C9.56397 4.97083 10.2265 4.7 11.0059 4.7C11.7853 4.7 12.4458 4.97279 12.9875 5.51837C13.5292 6.06397 13.8 6.72647 13.8 7.50587C13.8 8.28529 13.5272 8.94583 12.9816 9.4875C12.436 10.0292 11.7735 10.3 10.9941 10.3ZM11 15C8.56667 15 6.36667 14.3083 4.4 12.925C2.43333 11.5417 0.966667 9.73333 0 7.5C0.966667 5.26667 2.43333 3.45833 4.4 2.075C6.36667 0.691667 8.56667 0 11 0C13.4333 0 15.6333 0.691667 17.6 2.075C19.5667 3.45833 21.0333 5.26667 22 7.5C21.0333 9.73333 19.5667 11.5417 17.6 12.925C15.6333 14.3083 13.4333 15 11 15ZM10.9958 13.5C13.0153 13.5 14.8708 12.9542 16.5625 11.8625C18.2542 10.7708 19.5417 9.31667 20.425 7.5C19.5417 5.68333 18.2556 4.22917 16.5667 3.1375C14.8779 2.04583 13.0237 1.5 11.0042 1.5C8.98474 1.5 7.12917 2.04583 5.4375 3.1375C3.74583 4.22917 2.45 5.68333 1.55 7.5C2.45 9.31667 3.74442 10.7708 5.43327 11.8625C7.12214 12.9542 8.97631 13.5 10.9958 13.5Z" fill="%23222222"/></svg>');
    }

.like-select {
    padding-right: 2.5rem;
    position: relative;
}

    .like-select:active {
        border-color: var(--mud-palette-primary);
    }

    .like-select::after {
        content: '';
        position: absolute;
        height: 100%;
        width: 2.5rem;
        right: 0;
        top: 0;
        background-image: url('data:image/svg+xml,<svg width="28" height="15" viewBox="0 0 28 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.9973 12.1061L2.36127 0.783415C2.2675 0.690193 2.15617 0.616495 2.03373 0.566583C1.91129 0.51667 1.78016 0.491535 1.64794 0.492634C1.51572 0.493731 1.38503 0.521042 1.26344 0.572981C1.14184 0.624921 1.03175 0.700459 0.939542 0.795225C0.847332 0.889992 0.774831 1.0021 0.726235 1.12507C0.67764 1.24804 0.653914 1.37943 0.656431 1.51164C0.658948 1.64384 0.687657 1.77423 0.740899 1.89526C0.79414 2.01629 0.870855 2.12556 0.966606 2.21675L13.2999 14.2167C13.4866 14.3984 13.7368 14.5 13.9973 14.5C14.2577 14.5 14.5079 14.3984 14.6946 14.2167L27.0279 2.21675C27.1237 2.12556 27.2004 2.01629 27.2536 1.89526C27.3069 1.77422 27.3356 1.64383 27.3381 1.51163C27.3406 1.37943 27.3169 1.24804 27.2683 1.12507C27.2197 1.0021 27.1472 0.889991 27.055 0.795224C26.9628 0.700457 26.8527 0.62492 26.7311 0.57298C26.6095 0.521041 26.4788 0.49373 26.3466 0.492633C26.2144 0.491534 26.0833 0.516669 25.9608 0.566582C25.8384 0.616494 25.727 0.690192 25.6333 0.783414L13.9973 12.1061Z" fill="%23333333"/></svg>');
        background-repeat: no-repeat;
        background-position: center;
        background-size: 50%;
    }

.long-cell span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 20rem;
    max-width: 20rem;
}

.short-cell span {
    min-width: 10rem;
    max-width: 10rem;
}

.form-required .form-control {
    padding-right: 2.5rem;
}

.form-required::after {
    content: '*';
    color: red;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 1rem;
    font-size: 1.35rem;
}
/*---------------------*/
.ico {
    display: block;
    background-size: 50%;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 50%;
    width: 18px;
    height: 18px;
}

    .ico.checked {
        background-color: #12C339;
        background-image: url('data:image/svg+xml,<svg width="33" height="24" viewBox="0 0 33 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.99219 11.9922L11.9922 20.9922L29.9922 2.99219" stroke="white" stroke-width="4.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    }

    .ico.promotion {
        background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.6583 17.5021L2.5 9.34375V11.0104C2.5 11.4521 2.675 11.8771 2.99167 12.1854L9.48333 18.6771C10.1333 19.3271 11.1917 19.3271 11.8417 18.6771L17.0167 13.5021C17.6667 12.8521 17.6667 11.7937 17.0167 11.1437L10.6583 17.5021Z" fill="%23222222"/><path d="M9.48333 14.5083C9.80833 14.8333 10.2333 15 10.6583 15C11.0833 15 11.5083 14.8333 11.8333 14.5083L17.0083 9.33333C17.6583 8.68333 17.6583 7.625 17.0083 6.975L10.5167 0.483333C10.2083 0.175 9.78333 0 9.34167 0H4.16667C3.25 0 2.5 0.75 2.5 1.66667V6.84167C2.5 7.28333 2.675 7.70833 2.99167 8.01667L9.48333 14.5083ZM4.16667 1.66667H9.34167L15.8333 8.15833L10.6583 13.3333L4.16667 6.84167V1.66667Z" fill="%23222222"/><path d="M6.04167 4.58333C6.61696 4.58333 7.08333 4.11696 7.08333 3.54167C7.08333 2.96637 6.61696 2.5 6.04167 2.5C5.46637 2.5 5 2.96637 5 3.54167C5 4.11696 5.46637 4.58333 6.04167 4.58333Z" fill="%23222222"/></svg>');
        background-size: 100%;
    }

    .ico.reward {
        background-image: url('data:image/svg+xml,<svg width="19" height="20" viewBox="0 0 19 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M9.05199 4.14062C8.16019 4.14063 7.30492 4.49489 6.67432 5.12549C6.04372 5.75609 5.68945 6.61136 5.68945 7.50316C5.68945 8.39496 6.04372 9.25023 6.67432 9.88083C7.30492 10.5114 8.16019 10.8657 9.05199 10.8657C9.94379 10.8657 10.7991 10.5114 11.4297 9.88083C12.0603 9.25023 12.4145 8.39496 12.4145 7.50316C12.4145 6.61136 12.0603 5.75609 11.4297 5.12549C10.7991 4.49489 9.94379 4.14063 9.05199 4.14062ZM7.24139 7.50316C7.24139 7.02296 7.43215 6.56243 7.7717 6.22288C8.11126 5.88332 8.57179 5.69256 9.05199 5.69256C9.53219 5.69256 9.99272 5.88332 10.3323 6.22288C10.6718 6.56243 10.8626 7.02296 10.8626 7.50316C10.8626 7.98336 10.6718 8.44389 10.3323 8.78345C9.99272 9.123 9.53219 9.31376 9.05199 9.31376C8.57179 9.31376 8.11126 9.123 7.7717 8.78345C7.43215 8.44389 7.24139 7.98336 7.24139 7.50316Z" fill="%23222222"/><path fill-rule="evenodd" clip-rule="evenodd" d="M9.05297 1.60306e-07C7.70004 -9.28742e-05 6.37227 0.365732 5.21029 1.05873C4.04832 1.75172 3.09541 2.74608 2.45248 3.93649C1.80956 5.1269 1.50057 6.46904 1.55823 7.82074C1.61589 9.17244 2.03806 10.4834 2.78003 11.6147L0.103452 16.2498C0.0291496 16.3789 -0.00643219 16.5267 0.000955284 16.6754C0.00834276 16.8242 0.0583875 16.9677 0.145114 17.0888C0.231841 17.2099 0.351585 17.3034 0.490049 17.3583C0.628513 17.4132 0.779846 17.4271 0.92598 17.3983L3.63049 16.8665L4.52131 19.4737C4.56932 19.615 4.65703 19.7394 4.77394 19.8321C4.89085 19.9248 5.03199 19.9818 5.18048 19.9963C5.32896 20.0108 5.47848 19.9822 5.61113 19.914C5.74378 19.8457 5.85393 19.7406 5.9284 19.6113L8.59774 14.9886C8.90095 15.0069 9.20499 15.0069 9.50821 14.9886L12.1775 19.6113C12.2521 19.7406 12.3623 19.8456 12.495 19.9138C12.6278 19.982 12.7773 20.0105 12.9258 19.9959C13.0743 19.9812 13.2154 19.9241 13.3323 19.8313C13.4491 19.7385 13.5367 19.614 13.5846 19.4727L14.4723 16.8592L17.1789 17.3972C17.3251 17.4263 17.4766 17.4126 17.6153 17.3578C17.7539 17.303 17.8738 17.2095 17.9607 17.0883C18.0476 16.9672 18.0977 16.8236 18.1051 16.6747C18.1125 16.5258 18.0769 16.378 18.0025 16.2488L15.3269 11.6147C16.069 10.4833 16.4911 9.17227 16.5488 7.82048C16.6064 6.46869 16.2973 5.12648 15.6542 3.93604C15.0112 2.7456 14.0581 1.75125 12.896 1.05833C11.7339 0.365409 10.406 -0.000279521 9.05297 1.60306e-07ZM3.10387 7.50104C3.10387 5.92324 3.73065 4.41006 4.84632 3.29439C5.96199 2.17872 7.47517 1.55194 9.05297 1.55194C10.6308 1.55194 12.1439 2.17872 13.2596 3.29439C14.3753 4.41006 15.0021 5.92324 15.0021 7.50104C15.0021 9.07884 14.3753 10.592 13.2596 11.7077C12.1439 12.8234 10.6308 13.4501 9.05297 13.4501C7.47517 13.4501 5.96199 12.8234 4.84632 11.7077C3.73065 10.592 3.10387 9.07884 3.10387 7.50104ZM6.96716 14.7082C5.79032 14.3674 4.71499 13.7433 3.83535 12.8904L2.30203 15.5463L3.99572 15.2131C4.17977 15.177 4.37067 15.2088 4.53311 15.3026C4.69555 15.3963 4.81853 15.5458 4.87929 15.7232L5.43799 17.3569L6.96716 14.7082ZM12.6659 17.3528L11.1388 14.7082C12.3156 14.3674 13.3909 13.7432 14.2706 12.8904L15.8018 15.5422L14.1071 15.2049C13.9225 15.1683 13.7309 15.2001 13.5679 15.2943C13.405 15.3885 13.2819 15.5388 13.2215 15.717L12.6659 17.3528Z" fill="%23222222"/></svg>');
        background-size: 100%;
    }

    .ico.gift {
        background-image: url('data:image/svg+xml,<svg width="18" height="17" viewBox="0 0 18 17" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.91797 13.2266V15.2474H16.0846V13.2266H1.91797ZM1.91797 3.9974H4.52214C4.45269 3.8724 4.39714 3.71615 4.35547 3.52865C4.3138 3.34115 4.29297 3.17101 4.29297 3.01823C4.29297 2.3643 4.52214 1.80845 4.98047 1.35069C5.4388 0.892937 5.98741 0.664062 6.6263 0.664062C7.05326 0.664062 7.44819 0.771701 7.81109 0.986979C8.17401 1.20226 8.45964 1.47656 8.66797 1.8099L9.01172 2.35156L9.35547 1.8099C9.57769 1.46267 9.86252 1.1849 10.2099 0.976562C10.5574 0.768229 10.9315 0.664062 11.3324 0.664062C12.0006 0.664062 12.5638 0.889757 13.0221 1.34115C13.4805 1.79253 13.7096 2.35407 13.7096 3.02575C13.7096 3.17351 13.6923 3.32378 13.6576 3.47656C13.6228 3.62934 13.5707 3.80295 13.5013 3.9974H16.0846C16.418 3.9974 16.7096 4.1224 16.9596 4.3724C17.2096 4.6224 17.3346 4.91406 17.3346 5.2474V15.2474C17.3346 15.5807 17.2096 15.8724 16.9596 16.1224C16.7096 16.3724 16.418 16.4974 16.0846 16.4974H1.91797C1.58464 16.4974 1.29297 16.3724 1.04297 16.1224C0.792969 15.8724 0.667969 15.5807 0.667969 15.2474V5.2474C0.667969 4.91406 0.792969 4.6224 1.04297 4.3724C1.29297 4.1224 1.58464 3.9974 1.91797 3.9974ZM1.91797 10.9974H16.0846V5.2474H10.8971L12.9805 8.14323L11.9805 8.89323L9.0013 4.76823L6.02214 8.89323L5.02214 8.14323L7.10547 5.2474H1.91797V10.9974ZM6.64714 4.1224C6.95269 4.1224 7.21311 4.01476 7.42839 3.79948C7.64366 3.5842 7.7513 3.32378 7.7513 3.01823C7.7513 2.71267 7.64366 2.45226 7.42839 2.23698C7.21311 2.0217 6.95269 1.91406 6.64714 1.91406C6.34158 1.91406 6.08116 2.0217 5.86589 2.23698C5.65061 2.45226 5.54297 2.71267 5.54297 3.01823C5.54297 3.32378 5.65061 3.5842 5.86589 3.79948C6.08116 4.01476 6.34158 4.1224 6.64714 4.1224ZM11.3346 4.1224C11.6534 4.1224 11.9206 4.01476 12.1362 3.79948C12.3518 3.5842 12.4596 3.32378 12.4596 3.01823C12.4596 2.71267 12.3518 2.45226 12.1362 2.23698C11.9206 2.0217 11.6534 1.91406 11.3346 1.91406C11.043 1.91406 10.7895 2.0217 10.5742 2.23698C10.3589 2.45226 10.2513 2.71267 10.2513 3.01823C10.2513 3.32378 10.3589 3.5842 10.5742 3.79948C10.7895 4.01476 11.043 4.1224 11.3346 4.1224Z" fill="black"/></svg>');
        background-size: 100%;
    }

.info-address, .info-phone, .info-contact {
    position: relative;
    padding-left: 1.25rem;
}

    .info-address::before, .info-phone::before, .info-contact::before {
        content: '';
        width: 2rem;
        height: 2rem;
        position: absolute;
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;
        background-size: 45%;
        background-position: top left;
        left: 0;
        top: 3px;
    }

    .info-address::before {
        background-image: url('data:image/svg+xml,<svg width="14" height="20" viewBox="0 0 14 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7 9.5C6.33696 9.5 5.70107 9.23661 5.23223 8.76777C4.76339 8.29893 4.5 7.66304 4.5 7C4.5 6.33696 4.76339 5.70107 5.23223 5.23223C5.70107 4.76339 6.33696 4.5 7 4.5C7.66304 4.5 8.29893 4.76339 8.76777 5.23223C9.23661 5.70107 9.5 6.33696 9.5 7C9.5 7.3283 9.43534 7.65339 9.3097 7.95671C9.18406 8.26002 8.99991 8.53562 8.76777 8.76777C8.53562 8.99991 8.26002 9.18406 7.95671 9.3097C7.65339 9.43534 7.3283 9.5 7 9.5ZM7 0C5.14348 0 3.36301 0.737498 2.05025 2.05025C0.737498 3.36301 0 5.14348 0 7C0 12.25 7 20 7 20C7 20 14 12.25 14 7C14 5.14348 13.2625 3.36301 11.9497 2.05025C10.637 0.737498 8.85652 0 7 0Z" fill="%23777777"/></svg>');
    }

    .info-phone::before {
        background-image: url('data:image/svg+xml,<svg width="18" height="17" viewBox="0 0 18 17" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.5559 10.906L12.1009 11.359C12.1009 11.359 11.0179 12.435 8.06288 9.49698C5.10788 6.55898 6.19088 5.48298 6.19088 5.48298L6.47688 5.19698C7.18388 4.49498 7.25088 3.36698 6.63388 2.54298L5.37388 0.859979C4.60988 -0.160021 3.13488 -0.29502 2.25988 0.57498L0.68988 2.13498C0.25688 2.56698 -0.0331206 3.12498 0.00187944 3.74498C0.0918794 5.33198 0.809879 8.74498 4.81388 12.727C9.06088 16.949 13.0459 17.117 14.6749 16.965C15.1909 16.917 15.6389 16.655 15.9999 16.295L17.4199 14.883C18.3799 13.93 18.1099 12.295 16.8819 11.628L14.9719 10.589C14.1659 10.152 13.1859 10.28 12.5559 10.906Z" fill="%23777777"/></svg>');
    }

    .info-contact::before {
        background-image: url('data:image/svg+xml,<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3 14C3 12 7 10.9 9 10.9C11 10.9 15 12 15 14V15H3M12 6C12 6.79565 11.6839 7.55871 11.1213 8.12132C10.5587 8.68393 9.79565 9 9 9C8.20435 9 7.44129 8.68393 6.87868 8.12132C6.31607 7.55871 6 6.79565 6 6C6 5.20435 6.31607 4.44129 6.87868 3.87868C7.44129 3.31607 8.20435 3 9 3C9.79565 3 10.5587 3.31607 11.1213 3.87868C11.6839 4.44129 12 5.20435 12 6ZM0 2V16C0 16.5304 0.210714 17.0391 0.585786 17.4142C0.960859 17.7893 1.46957 18 2 18H16C16.5304 18 17.0391 17.7893 17.4142 17.4142C17.7893 17.0391 18 16.5304 18 16V2C18 1.46957 17.7893 0.960859 17.4142 0.585786C17.0391 0.210714 16.5304 0 16 0H2C1.46957 0 0.960859 0.210714 0.585786 0.585786C0.210714 0.960859 0 1.46957 0 2Z" fill="%23777777"/></svg>');
    }

.hover-black svg {
    fill: #ccc;
}

.hover-black:hover svg, .hover-black:active svg {
    fill: #000 !important;
}

.mud-tab {
    color: var(--description-color);
}
/*--------------------------------*/
.stt-draff .mud-chip-filled {
    color: #fff !important;
    background: #000 !important;
}

.stt-new-order .mud-chip-filled {
    color: #fff !important;
    background: #CAB70F !important;
}

.stt-confirmed .mud-chip-filled {
    color: #fff !important;
    background: #CAB70F;
}

.stt-ready .mud-chip-filled {
    color: #fff !important;
    background: #000 !important;
}

.stt-finished .mud-chip-filled {
    color: #fff !important;
    background: #34A1C4 !important;
}

.stt-destroyed .mud-chip-filled {
    color: #fff !important;
    background: #999 !important;
}
/*-------------*/
.steps-group {
    display: flex;
}

.step-item {
    flex: 1 1;
    position: relative;
}

    .step-item.current p {
        opacity: 1;
    }

.step-number {
    display: flex;
    align-items: center;
    position: relative;
    justify-content: center;
}

    .step-number::after {
        content: '';
        flex: 1 1 auto;
        height: 1px;
        background-color: #999;
        width: calc(100% - 12px);
        position: absolute;
        right: 50%;
        top: 50%;
        z-index: 0;
    }

    .step-number .mud-chip {
        z-index: 1;
        width: 24px;
    }

.step-item.active .step-number .mud-chip {
    background-color: #000 !important;
    color: #fff !important;
}

.step-number .mud-chip > .mud-chip-content {
    justify-content: center;
}

.steps-group .step-item:first-child .step-number::after {
    background-color: transparent;
}

.stt-destroyed .step-number::after {
    background-color: #ccc;
}

.steps-group-column {
    flex-direction: column;
}

    .steps-group-column .step-item {
        display: grid;
        grid-template-columns: 1fr auto;
    }

    .steps-group-column .step-number {
        /*position:absolute;*/
        overflow: hidden;
        align-items: flex-start;
    }

        .steps-group-column .step-number::after {
            width: 1px;
            height: 100%;
        }

.steps-group.steps-group-column .step-item:first-child .step-number::after {
    background-color: #999;
}

.steps-group.steps-group-column .step-item:last-child .step-number::after {
    background-color: transparent;
}

.fixed-header {
    position: relative;
}

    .fixed-header .mud-paper-outlined {
        position: fixed;
        z-index: 1;
        width: 100%;
        left: 0
    }

    .fixed-header .mud-tabs-panels {
        padding-top: 50px;
    }

.circle-progress {
    height: 8.5rem;
    width: 8.5rem;
    border-radius: 50%;
    background: conic-gradient(var(--mud-palette-primary) 3.6deg, rgba(0, 0, 0, 0.2) 0deg);
    display: flex;
    align-items: center;
    justify-content: center;
}

    .circle-progress::before {
        content: '';
        position: absolute;
        height: 7rem;
        width: 7rem;
        border-radius: 50%;
        background-color: #f0ff;
    }

.progress-value {
    position: relative;
}

.mobile-frame {
    --mobile-frame-height: 40.6875rem;
    height: var(--mobile-frame-height);
    /*width: 19.375rem;*/
    width: calc(var(--mobile-frame-height) * 9 / 16);
    background-color: #fff;
    margin: auto;
    box-shadow: 0 10px 20px rgb(0 0 0/10%);
    overflow-y: auto;
    overflow-x: hidden;
    border: .5rem solid #000;
    border-radius: 1.5rem;
    position: relative;
    margin: 2rem 3.25rem;
}

    .mobile-frame.small {
        --mobile-frame-height: 272px;
        width: calc(var(--mobile-frame-height) * 9 / 16);
        margin: 0;
        border-width: .25rem;
    }

.item-library {
    width: 7.25rem;
    display: flex;
    flex-direction: column;
}

.item-library-ratio {
    outline: var(--bs-dark-rgba) solid 1px;
}

.ratio-3x4 {
    --bs-aspect-ratio: calc(4 / 3 * 100%)
}

.ratio-9x16 {
    --bs-aspect-ratio: calc(16 / 9 * 100%)
}

.ratio-9x21 {
    --bs-aspect-ratio: calc(21 / 9 * 100%)
}

.overflowwhencolleps, .overflowonexpand {
    overflow-y: auto;
    overflow-x: hidden;
}

.overflowwhencolleps {
    height: 100%;
}

.profile-panel-list {
    position: relative;
    font-size: 0;
    display: block;
    background-color: #fff;
    height: calc(100% - 80px);
    padding-top: 18px;
    padding-bottom: 10px;
}

.profile-panel-entry {
    margin: auto auto 5px;
    width: calc(100% - 20px);
    border-radius: 4px;
    transition: .3s ease-out;
    padding: 0;
}

    .leftpanel-parent-child-section, .profile-panel-entry a {
        display: -webkit-flex;
        display: flex;
        -webkit-align-items: center;
        align-items: center;
        padding: 8px 10px;
        position: relative;
        z-index: 1;
        cursor: pointer;
    }

.submenu-active-svg {
    fill: var(--custom_color4) !important;
}

.profile-panel-entry svg {
    margin-right: 14px;
    fill: #1b2952;
    position: relative;
}

.collapse-submenu {
    visibility: hidden;
    background-color: #fff;
    color: #7782a1;
    border-radius: 6px;
    position: fixed;
    z-index: 1;
    padding: 10px 10px 5px;
    font-size: 13px;
    line-height: 21px;
    text-align: left !important;
    box-shadow: 0 1px 8px rgba(0,0,0,.12);
    white-space: nowrap;
    transition: .2s;
}

.leftpanel-parent-child-section, .profile-panel-entry a {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    padding: 8px 10px;
    position: relative;
    z-index: 1;
    cursor: pointer;
}

.collapse-submenu .collapse-submenulink {
    width: 150px;
    padding: 8px 14px;
    font-size: 12px;
    font-family: "Axiforma-Regular";
    color: #7782a1;
    line-height: 12px;
    border-radius: 4px;
    margin-bottom: 5px;
}

.sidebar-submenu li {
    font-size: 12px;
    font-family: "Axiforma-Regular";
    width: calc(100% - 10px);
    padding: 8px 14px;
    list-style-type: none;
    border-radius: 4px;
    cursor: pointer;
    margin-bottom: 5px;
}

    .sidebar-submenu li p {
        color: #7782a1;
        text-align: left !important;
    }

.shadow-0 {
    box-shadow: none !important;
}

.ico-drag {
    display: block;
    width: 2.5rem;
    height: 2.5rem;
    background-image: url('data:image/svg+xml,<svg width="256" height="256" xmlns="http://www.w3.org/2000/svg"><g><svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24" width="256" height="256"><path fill="%23231f20" d="M19.6 11.5c-5.1 0-10.2 0-15.3 0-.6 0-.6 1 0 1 5.1 0 10.2 0 15.3 0C20.3 12.5 20.3 11.5 19.6 11.5L19.6 11.5zM19.6 7.5c-5.1 0-10.2 0-15.3 0-.6 0-.6 1 0 1 5.1 0 10.2 0 15.3 0C20.3 8.5 20.3 7.5 19.6 7.5L19.6 7.5zM19.6 15.5c-5.1 0-10.2 0-15.3 0-.6 0-.6 1 0 1 5.1 0 10.2 0 15.3 0C20.3 16.5 20.3 15.5 19.6 15.5L19.6 15.5z"></path></svg></g></svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 70%;
    cursor: grab;
}

.disabled .ico-drag {
    background-image: url('data:image/svg+xml,<svg width="256" height="256" xmlns="http://www.w3.org/2000/svg"><g><svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24" width="256" height="256"><path fill="%23c4c4c4" d="M19.6 11.5c-5.1 0-10.2 0-15.3 0-.6 0-.6 1 0 1 5.1 0 10.2 0 15.3 0C20.3 12.5 20.3 11.5 19.6 11.5L19.6 11.5zM19.6 7.5c-5.1 0-10.2 0-15.3 0-.6 0-.6 1 0 1 5.1 0 10.2 0 15.3 0C20.3 8.5 20.3 7.5 19.6 7.5L19.6 7.5zM19.6 15.5c-5.1 0-10.2 0-15.3 0-.6 0-.6 1 0 1 5.1 0 10.2 0 15.3 0C20.3 16.5 20.3 15.5 19.6 15.5L19.6 15.5z"></path></svg></g></svg>');
}

.list-group-item-light.list-group-item-action.active {
    color: #636464;
    background-color: #e5e5e5;
    border-color: #e5e5e5 !important;
}

.bg-coupon {
    color: #fff;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url('data:image/svg+xml,<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M46.0952 1.38286C46.0964 1.12338 46.1505 0.866883 46.2544 0.629088C46.3582 0.391293 46.5095 0.177219 46.699 0L1.30095 0C1.49048 0.177219 1.6418 0.391293 1.74563 0.629088C1.84946 0.866883 1.90361 1.12338 1.90476 1.38286C1.90476 1.88803 1.70408 2.37252 1.34687 2.72973C0.989658 3.08694 0.505174 3.28762 0 3.28762L0 4.50476C0.505174 4.50476 0.989658 4.70544 1.34687 5.06265C1.70408 5.41987 1.90476 5.90435 1.90476 6.40952C1.90476 6.9147 1.70408 7.39918 1.34687 7.75639C0.989658 8.11361 0.505174 8.31429 0 8.31429L0 9.52381C0.505174 9.52381 0.989658 9.72449 1.34687 10.0817C1.70408 10.4389 1.90476 10.9234 1.90476 11.4286C1.90476 11.9337 1.70408 12.4182 1.34687 12.7754C0.989658 13.1327 0.505174 13.3333 0 13.3333L0 14.5486C0.505174 14.5486 0.989658 14.7493 1.34687 15.1065C1.70408 15.4637 1.90476 15.9482 1.90476 16.4533C1.90476 16.9585 1.70408 17.443 1.34687 17.8002C0.989658 18.1574 0.505174 18.3581 0 18.3581L0 19.5752C0.505174 19.5752 0.989658 19.7759 1.34687 20.1331C1.70408 20.4903 1.90476 20.9748 1.90476 21.48C1.90476 21.9852 1.70408 22.4697 1.34687 22.8269C0.989658 23.1841 0.505174 23.3848 0 23.3848L0 24.6C0.505174 24.6 0.989658 24.8007 1.34687 25.1579C1.70408 25.5151 1.90476 25.9996 1.90476 26.5048C1.90476 27.0099 1.70408 27.4944 1.34687 27.8516C0.989658 28.2088 0.505174 28.4095 0 28.4095L0 29.6267C0.505174 29.6267 0.989658 29.8273 1.34687 30.1846C1.70408 30.5418 1.90476 31.0263 1.90476 31.5314C1.90476 32.0366 1.70408 32.5211 1.34687 32.8783C0.989658 33.2355 0.505174 33.4362 0 33.4362L0 34.6667C0.505174 34.6667 0.989658 34.8673 1.34687 35.2246C1.70408 35.5818 1.90476 36.0663 1.90476 36.5714C1.90476 37.0766 1.70408 37.5611 1.34687 37.9183C0.989658 38.2755 0.505174 38.4762 0 38.4762L0 39.6933C0.505174 39.6933 0.989658 39.894 1.34687 40.2512C1.70408 40.6084 1.90476 41.0929 1.90476 41.5981C1.90476 42.1033 1.70408 42.5878 1.34687 42.945C0.989658 43.3022 0.505174 43.5029 0 43.5029L0 44.72C0.505174 44.72 0.989658 44.9207 1.34687 45.2779C1.70408 45.6351 1.90476 46.1196 1.90476 46.6248C1.90258 46.8829 1.84793 47.138 1.74413 47.3744C1.64033 47.6108 1.48955 47.8237 1.30095 48H46.699C46.4229 47.7384 46.2314 47.4002 46.1492 47.0288C46.067 46.6574 46.0978 46.2699 46.2378 45.9163C46.3777 45.5626 46.6204 45.2589 46.9345 45.0443C47.2485 44.8298 47.6196 44.7142 48 44.7124V43.4952C47.4948 43.4952 47.0103 43.2946 46.6531 42.9373C46.2959 42.5801 46.0952 42.0957 46.0952 41.5905C46.0952 41.0853 46.2959 40.6008 46.6531 40.2436C47.0103 39.8864 47.4948 39.6857 48 39.6857V38.4762C47.4948 38.4762 47.0103 38.2755 46.6531 37.9183C46.2959 37.5611 46.0952 37.0766 46.0952 36.5714C46.0952 36.0663 46.2959 35.5818 46.6531 35.2246C47.0103 34.8673 47.4948 34.6667 48 34.6667V33.4514C47.4948 33.4514 47.0103 33.2508 46.6531 32.8935C46.2959 32.5363 46.0952 32.0518 46.0952 31.5467C46.0952 31.0415 46.2959 30.557 46.6531 30.1998C47.0103 29.8426 47.4948 29.6419 48 29.6419V28.4248C47.4948 28.4248 47.0103 28.2241 46.6531 27.8669C46.2959 27.5097 46.0952 27.0252 46.0952 26.52C46.0952 26.0148 46.2959 25.5303 46.6531 25.1731C47.0103 24.8159 47.4948 24.6152 48 24.6152V23.4C47.4948 23.4 47.0103 23.1993 46.6531 22.8421C46.2959 22.4849 46.0952 22.0004 46.0952 21.4952C46.0952 20.9901 46.2959 20.5056 46.6531 20.1484C47.0103 19.7912 47.4948 19.5905 48 19.5905V18.3657C47.4948 18.3657 47.0103 18.165 46.6531 17.8078C46.2959 17.4506 46.0952 16.9661 46.0952 16.461C46.0952 15.9558 46.2959 15.4713 46.6531 15.1141C47.0103 14.7569 47.4948 14.5562 48 14.5562V13.3333C47.4948 13.3333 47.0103 13.1327 46.6531 12.7754C46.2959 12.4182 46.0952 11.9337 46.0952 11.4286C46.0952 10.9234 46.2959 10.4389 46.6531 10.0817C47.0103 9.72449 47.4948 9.52381 48 9.52381V8.31429C47.4948 8.31429 47.0103 8.11361 46.6531 7.75639C46.2959 7.39918 46.0952 6.9147 46.0952 6.40952C46.0952 5.90435 46.2959 5.41987 46.6531 5.06265C47.0103 4.70544 47.4948 4.50476 48 4.50476V3.28762C47.4948 3.28762 47.0103 3.08694 46.6531 2.72973C46.2959 2.37252 46.0952 1.88803 46.0952 1.38286Z" fill="%23D8002B"/></svg>');
    width: 3rem;
    height: 3rem;
}

.logo-loading {
    width: 64px !important;
    height: 64px !important;
    position: absolute;
    border-radius: 120px;
    animation: boxShadow 2s infinite alternate-reverse;
    animation-delay: 0ms;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

    .logo-loading:before {
        position: absolute;
        content: "";
        inset: 0;
        background: radial-gradient(circle at bottom, #FE9041 0%, #FF504D 33%, #BD00FF 66%, #534EEB 100%) top right/300% 400%;
        -webkit-mask: url('data:image/svg+xml,<svg height="64" viewBox="0 0 71 72" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M35.0755 0L0 11.1595V60.8271L35.0831 72L70.1662 60.8271V11.1595L35.0755 0ZM43.851 54.8309H12.5597V40.5654L22.68 31.4365H40.9207V26.9417H16.0497V17.1691H50.8768V31.4365L40.9265 40.5654H22.7755V45.0602H43.851V54.8309ZM57.6046 54.8309H47.3524V45.0602H57.6046V54.8309Z" fill="currentColor" /></svg>');
        mask: url('data:image/svg+xml,<svg height="64" viewBox="0 0 71 72" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M35.0755 0L0 11.1595V60.8271L35.0831 72L70.1662 60.8271V11.1595L35.0755 0ZM43.851 54.8309H12.5597V40.5654L22.68 31.4365H40.9207V26.9417H16.0497V17.1691H50.8768V31.4365L40.9265 40.5654H22.7755V45.0602H43.851V54.8309ZM57.6046 54.8309H47.3524V45.0602H57.6046V54.8309Z" fill="currentColor" /></svg>');
        animation: colorChange 2s infinite alternate-reverse;
        animation-delay: 0ms;
    }

@keyframes colorChange {
    to {
        background-position: bottom right;
    }
}

@keyframes boxShadow {
    0% {
        box-shadow: 0 0 0 20px rgba(97, 92, 237, 0.2), 0 0 0 40px rgba(97, 92, 237, 0.2);
    }

    100% {
        box-shadow: 0 0 0 20px rgba(255, 80, 77, 0.2), 0 0 0 40px rgba(255, 80, 77, 0.2);
    }
}

.snippet-hoz {
    width: 6rem;
    border: 1px solid #ccc;
    border-radius: 8px;
}

    .snippet-hoz .mud-input > input.mud-input-root, .snippet-hoz div.mud-input-slot.mud-input-root {
        position: absolute;
        text-align: center;
    }

    .snippet-hoz .mud-input-control.mud-input-number-control .mud-input-numeric-spin {
        position: relative;
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
    }

    .snippet-hoz .mud-input {
        margin: 0 !important;
    }

    .snippet-hoz .mud-button {
        height: 1.75rem;
        width: 1.75rem;
        margin: 3px;
        border-color: #ccc;
        background-color: var(--mud-palette-primary-hover);
        color: var(--mud-palette-primary);
    }

.form-floating.has-key label {
    margin-left: 52px;
}

.form-floating.has-key > .form-control {
    padding-left: 52px;
}

.tabs-cus .mud-tabs-panels.mud-tabs-vertical {
    width: 348px;
}

.tabs-cus .mud-tabs-toolbar-content .mud-tabs-toolbar-wrapper {
    align-items: center;
}

.section {
    display: block;
    position: relative;
    transition: all .1s ease-in-out;
}

    .section[data-fullscreen="true"] {
        width: 100%;
        height: 100%;
    }

.bg-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.preview_1x1 {
}

.expansionStep {
}

    .expansionStep .mud-panel-expanded {
        margin: 0;
    }

    .expansionStep .mud-expand-panel::after {
        content: '';
        background-color: var(--line-color);
        width: 1px;
        position: absolute;
        top: 40px;
        left: 20px;
        bottom: 0;
    }

    .expansionStep .mud-expand-panel .mud-expand-panel-header {
        padding: 4px;
        min-height: 32px;
    }

    .expansionStep .mud-expand-panel-icon {
        display: none;
    }

.badge-cus {
    width: 32px;
    height: 32px !important;
    border-radius: 50% !important;
    margin: 0;
}

.ico_close {
    background-repeat: no-repeat;
    background-position: center;
    background-size: 75%;
    background-image: url('data:image/svg+xml,<svg width="10" height="9" viewBox="0 0 10 9" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 0.5L9 8.5L1 0.5ZM1 8.5L9 0.5L1 8.5Z" fill="%23FD2B70"/><path d="M1 0.5L9 8.5M1 8.5L9 0.5" stroke="%23777777" stroke-linecap="round" stroke-linejoin="round"/></svg>');
}

.no-underline .mud-input.mud-input-underline::before,
.no-underline .mud-input.mud-input-underline::after {
    display: none;
}
/*----------------------------*/

.wrap-collabsible input.toggle[type='checkbox'] {
    display: none;
}

.lbl-toggle {
    display: block;
    font-family: monospace;
    text-transform: uppercase;
    text-align: center;
    cursor: pointer;
    transition: all 0.25s ease-out;
    z-index: 1;
    position: relative;
}

.collapsible-content {
    max-height: 0px;
    overflow: hidden;
    transition: max-height .25s ease-in-out;
    position: relative;
    opacity: 0;
}

.toggle:checked + .lbl-toggle + .collapsible-content {
    max-height: 1500px;
    opacity: 1;
}

.toggle:checked + .lbl-toggle {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.collapsible-content {
    padding: .5rem 0;
}

    .collapsible-content .content-inner {
        padding: 0 0 1rem 29px;
        position: relative;
    }

.wrap-collabsible {
    position: relative;
}

    .wrap-collabsible::after {
        content: '';
        background-color: var(--line-color);
        width: 1px;
        position: absolute;
        top: 2rem;
        left: 1rem;
        bottom: 0;
    }

.collapsible-content p {
    margin-bottom: 0;
}