/* css controls custom MM components */

/* css for the mminputnumber to disable the css spinners */
.inpnum-nospinner::-webkit-outer-spin-button,
.inpnum-nospinner::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.inpnum-nospinner {
    -moz-appearance:textfield;
}

/* sticky */
@supports (position: sticky) {
    .sticky-bottom,
    .sticky-grid .dxbl-grid-pager-container {
        position: sticky;
        bottom: 0;
        z-index: 1020;
    }

    .sticky-grid .dxbl-grid-pager-container {
        background: var(--bs-white);
        border-top: 1px solid var(--bs-secondary);
    }

    .preview-container.preview-pane-bottom > .d-flex.flex-column.h-auto:first-child {
        position: sticky;
        top: 0;
        z-index: 1020;
    }
}


/* login box - start */
.login_box {
    background-color: rgba(255, 255, 255, 0.85);
    transition: 1s ease-in-out max-width;
    max-width: 90%;
    max-width: min(40rem, 90%);
}

    .login_box .card-header {
        background: initial;
    }

#login-div > div {
    justify-content: center !important;
    padding-top: 1.5rem;
}

@media (max-width: 575px) {
    #login-div > div {
        justify-content: start !important;
    }

    .login_box {
        width: 100%;
        /*box-shadow: none !important;
        border-radius: 0 !important;*/
        border: none !important;
        /*
        top: 2.5% !important;
        position: absolute;
        */
        justify-content: center;
        margin: 0;
    }
}
/* login box - finish */



/* batch avail - start */
.batch-avail-grid {
    moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -o-user-select: none;
}

    .batch-avail-grid th:not(:first-child) .dxbl-grid-header-content {
        justify-content: center;
    }

    .batch-avail-grid td {
        padding: 0 !important;
        position: relative;
    }

        .batch-avail-grid td:not(:first-child) > div {
            height: 1.5rem;
            font-weight: 600;
            text-align: center;
            position: absolute;
            top: 0;
            left: 0;
            height: 100%;
            width: 100%;
            line-height: 2;
        }

        .batch-avail-grid td > div[ava-type="0"][ava-type-new="-1"],
        .batch-avail-grid td > div[ava-type="1"][ava-type-new="-1"] {
            background-color: initial;
        }

        .batch-avail-grid td > div[ava-type="0"],
        .batch-avail-grid td > div[ava-type-new="0"],
        .batch-avail-grid td > div[ava-type="1"][ava-type-new="0"] {
            background-color: var(--bs-avail);
            color: black;
        }

        .batch-avail-grid td > div[ava-type="1"],
        .batch-avail-grid td > div[ava-type-new="1"],
        .batch-avail-grid td > div[ava-type-new="0"][ava-type-new="1"] {
            background-color: var(--bs-busy);
            color: var(--bs-white);
        }

        .batch-avail-grid td > div.selected {
            background-color: var(--bs-primary-offset);
            color: var(--bs-white);
        }

        .batch-avail-grid td > div.active {
            background-color: rgba(27,110,194, 0.5) !important;
        }

        .batch-avail-grid td > div[ava-job-no-idx]:not([ava-job-no-idx="-1"]) {
            background-color: var(--bs-warning) !important;
            color: var(--bs-black) !important;
        }

        .batch-avail-grid td > div[ava-job-no-idx="1"]:not([ava-job-no-idx="-1"]) {
            background-color: #a587cb !important;
            color: var(--bs-black) !important;
        }

        .batch-avail-grid td > div[ava-job-no-idx="2"]:not([ava-job-no-idx="-1"]) {
            background-color: #8faabf !important;
            color: var(--bs-black) !important;
        }

        .batch-avail-grid td > div[ava-job-no-idx="3"]:not([ava-job-no-idx="-1"]) {
            background-color: #bf6898 !important;
            color: var(--bs-black) !important;
        }

        .batch-avail-grid td > div[ava-job-no-idx="4"]:not([ava-job-no-idx="-1"]) {
            background-color: #0098d4 !important;
            color: var(--bs-black) !important;
        }

        .batch-avail-grid td > div[ava-job-no-idx="5"]:not([ava-job-no-idx="-1"]) {
            background-color: #EE7C0E !important;
            color: var(--bs-black) !important;
        }

.batch-avail-grid-key[ava-type="0"] {
    color: var(--bs-avail);
}

.batch-avail-grid-key[ava-type="1"] {
    color: var(--bs-busy);
}

.batch-avail-grid-key.selected {
    color: var(--bs-primary-offset);
}

.batch-avail-grid-key.active {
    color: rgba(27,110,194, 0.5) !important;
}

.batch-avail-grid-key[ava-job-no-idx="0"] {
    color: var(--bs-warning) !important;
}

.batch-avail-grid-key[ava-job-no-idx="1"] {
    color: #a587cb !important;
}

.batch-avail-grid-key[ava-job-no-idx="2"] {
    color: #8faabf !important;
}

.batch-avail-grid-key[ava-job-no-idx="3"] {
    color: #bf6898 !important;
}

.batch-avail-grid-key[ava-job-no-idx="4"] {
    color: #0098d4 !important;
}

.batch-avail-grid-key[ava-job-no-idx="5"] {
    color: #EE7C0E !important;
}


/* batch avail - finish */


/* quick add cand - start */
.new-cand-import-div {
    border: 0.2rem dashed var(--bs-secondary);
    color: var(--bs-secondary);
}

    .new-cand-import-div .fa-file-magnifying-glass {
        font-size: 2rem;
    }

    .new-cand-import-div .dxuc-button-container {
        display: none;
    }

    .new-cand-import-div .dxuc-file-icon {
        width: 2.2rem;
        height: 2.2rem;
    }

    .new-cand-import-div .dxuc-file-extension.badge {
        font-size: 8px;
    }

    .new-cand-import-div .dxuc-file-size {
        display: none;
    }

.preview-container.preview-container-quick-add {
    overflow: hidden;
}

    .preview-container.preview-container-quick-add > div {
        overflow: hidden;
    }

    .preview-container.preview-container-quick-add form {
        height: 100%;
    }

.quick-add-cand-file {
    font-size: 1rem;
}
/* quick add cand - finish */


/* mm-lookup - start */
.mm-lookup {
    position: relative;
    height: 1.9rem !important;
    background: var(--bs-white);
    /*
    border-width: 1px;
    border-color: var(--bs-secondary);
    border-style: solid;
    */
    border-radius: 0.25rem !important;
    width: 100% !important;
    align-items: center;
}

    .mm-lookup input {
        width: 100% !important;
        padding: 0.5rem !important;
        padding-right: 3rem !important;
        border: 0 !important;
        outline: none;
        background: transparent;
        height: 100%;
    }

    .main-nav .mm-lookup .dropdown-menu,
    .mm-lookup .dropdown-menu {
        position: absolute;
        width: 100% !important;
        margin-top: 1.3rem !important;
        max-height: calc(100vh - 4rem rem );
        overflow: auto;
    }

    .mm-lookup .fa-times {
        right: 0.5rem;
        top: calc(50% - 0.5rem);
        color: var(--bs-primary);
        position: absolute;
        cursor: pointer;
    }

    .mm-lookup .mm-lookup-option {
        cursor: pointer;
    }

        .mm-lookup .mm-lookup-option:hover {
            color: var(--bs-primary);
        }
/* mm-lookup - finish */

/* bootstrap alerts - start */
#bootstrap-alert-outer {
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 1100;
}

#bootstrap-alert-inner {
    padding-right: 1.75rem;
    padding-left: 1.75rem;
}

    #bootstrap-alert-inner .alert {
        bottom: 0;
        margin-top: 0;
        margin-bottom: 0;
        max-height: 0;
        font-size: 0rem;
        overflow: hidden;
        padding: 0;
        transition: all ease 0.5s;
    }

        #bootstrap-alert-inner .alert.show {
            margin-top: 0.5rem;
            margin-bottom: 1rem;
            max-height: 20rem;
            font-size: 0.8rem;
            padding: 0.75rem 1.25rem;
        }

        #bootstrap-alert-inner .alert.alert-position-right {
            left: 75%;
            right: 1.75rem;
        }

        #bootstrap-alert-inner .alert.alert-position-left {
            left: 1.75rem;
            right: 75%;
        }

        #bootstrap-alert-inner .alert.alert-position-center {
            left: 30%;
            right: 30%;
        }

        #bootstrap-alert-inner .alert .close {
            position: absolute;
            right: 0.5em;
            top: 0.5em;
        }

        #bootstrap-alert-inner .alert.alert-notification {
            background-color: #cce5ff;
            color: #004085;
        }

@media (max-width: 575px) {
    .alert {
        position: relative !important;
    }

        .alert.alert-position-right,
        .alert.alert-position-left,
        .alert.alert-position-center {
            bottom: 0 !important;
            width: initial;
            left: 0;
            right: 0;
        }
}
/* bootstrap alerts - end */

/* quick search - start */
#quick-search .quick-search-div {
    position: absolute;
    top: 0.25rem;
    left: 1.5rem;
    bottom: 0.25rem;
    border-radius: 0.75rem;
    background-color: var(--bs-primary-light);
    z-index: -1 !important;
    display: flex;
    padding: 0.25rem;
    padding-left: 0;
    transition: 0.5s all ease;
    width: 0;
}


#quick-search.active .quick-search-div {
    width: 20rem;
    padding-left: 2.5rem;
}

.quick-search-div input {
    border-radius: 0.5rem;
    border: none;
    outline: none;
    min-width: 0;
    margin: 0.2rem;
}

#quick-search.active input {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    margin-left: 0.5rem;
    margin-right: 0.5rem;
}

.quick-search-results {
    position: absolute;
    background: var(--bs-primary-light);
    left: 2.75rem;
    right: 0;
    border-radius: 0.5rem;
    bottom: 1rem;
    z-index: -1;
    padding-bottom: 1.4rem;
}

    .quick-search-results > div:first-child {
        border-top-left-radius: 0.5rem;
        border-top-right-radius: 0.5rem;
    }

    .quick-search-results * {
        text-align: initial;
        padding: 0.5rem;
    }
/* quick search - end */

/* org chart - start */
/*chart nodes*/
.orgchart {
    display: inline-block;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

    .orgchart.printing {
        position: absolute;
        top: 0;
        left: 0;
        background-color: var(--bs-white);
        min-width: 100vw;
        min-height: 100vh;
    }

        .orgchart.printing .nodecontent, .orgchart.printing .nodecontent.bg-primary {
            background-color: initial !important;
            color: var(--bs-black);
            border: 1px solid #aaa;
        }

            .orgchart.printing .nodecontent .fa {
                color: #aaa;
            }

    .orgchart, .orgchart ul {
        padding: 0;
        margin-left: auto;
        margin-right: auto;
    }

        /*align children horizontally using CSS flex*/
        .orgchart ul {
            display: flex;
        }

        /*align nodecontent and children list vertically*/
        .orgchart li {
            display: flex;
            flex-direction: column;
            position: relative;
        }

        /*arrange the nodecontent centered above the children list*/
        .orgchart .nodecontent {
            align-self: center;
            position: relative;
            margin: 20px 5px;
            border-radius: 10px;
            padding: 0.5em;
            color: var(--bs-white);
            display: flex;
            align-items: center;
        }

        .orgchart .nodecontent {
            cursor: default;
        }

        .orgchart li.vertical ul .nodecontent:hover {
            text-decoration: underline;
        }

        .orgchart .nodecontent > div {
            padding: 0.5em;
            flex-grow: 1;
            text-align: center;
        }

        .orgchart li.vertical li {
            white-space: nowrap;
        }

            .orgchart li.vertical li .nodecontent {
                color: initial;
                padding: 0 0.2em;
            }

li > div + ul > li.vertical:first-child > div {
    margin-top: 0;
}

    li > div + ul > li.vertical:first-child > div::before {
        display: none !important;
    }

.orgchart .collapsed > ul,
.orgchart .collapsed + ul,
.orgchart .collapsed + ul + ul {
    display: none;
}

.orgchart .fa {
    font-size: 1.4em;
    margin-left: auto;
    width: initial;
    padding-left: 0.3em;
}

/*connections*/
.orgchart li::before,
.orgchart .nodecontent::after,
.orgchart .nodecontent::before {
    box-sizing: border-box;
    content: '';
    position: absolute;
    border: 0px solid #aaa;
}

.orgchart li:not(:only-child)::before {
    border-top-width: 1px;
    width: 100%;
    height: 20px;
    top: 0px;
}

.orgchart li:first-child::before {
    width: calc(50% + 1px);
    right: 0;
    border-left-width: 1px;
    border-top-left-radius: 7px;
}

.orgchart li:last-child::before {
    width: calc(50% + 1px);
    border-right-width: 1px;
    border-top-right-radius: 7px;
}

.orgchart .nodecontent::after,
.orgchart .nodecontent::before {
    border-left-width: 1px;
    width: 1px;
    height: 20px;
    left: calc(50% - 1px);
}

.orgchart .nodecontent::before {
    top: -20px;
}

.orgchart .nodecontent::after {
    bottom: -20px;
}

.orgchart li:first-child:not(:only-child) > .nodecontent::before,
.orgchart li:last-child:not(:only-child) > .nodecontent::before {
    border-left-width: 0px;
}

.orgchart .leaf > .nodecontent::after,
.orgchart .root > .nodecontent::before,
.orgchart .nodecontent.collapsed::after,
.orgchart .collapsed > .nodecontent::after {
    display: none;
}

/*vertical nodes*/
.orgchart li.vertical > ul {
    flex-direction: column;
    align-items: flex-start;
    margin: 0 5px;
    position: relative;
}

    .orgchart li.vertical > ul > li > .nodecontent {
        margin: 10px 0 0 10px;
    }

    /*vertical connectors*/
    .orgchart li.vertical > ul::before {
        box-sizing: border-box;
        content: '';
        position: absolute;
        top: -1px;
        left: 10px;
        height: 10px;
        width: calc(50% - 19px);
        border-top: 1px solid #aaa;
    }

.orgchart li.vertical > .nodecontent::after {
    border-width: 0 1px 1px 0;
    border-bottom-right-radius: 7px;
    width: 10px;
    left: auto;
    right: calc(50% - 1px);
}

.orgchart li.vertical > ul > li::before {
    border-width: 0 0 0 1px;
    left: 0px;
    height: 100%;
    width: 10px;
    border-radius: 0;
}

.orgchart li.vertical > ul > li:first-child::before {
    top: -1px;
    height: calc(100% + 2px);
    border-top-width: 1px;
    border-top-left-radius: 7px;
}

.orgchart li.vertical > ul > li:last-child::before {
    height: calc(50% + 6px);
    border-bottom-width: 2px;
    border-bottom-left-radius: 7px;
}

.orgchart li.vertical > ul > li > .nodecontent::before {
    height: 1px;
    width: 9px;
    top: calc(50% - 1px);
    left: -9px;
    border-width: 1px 0 0 0;
}

.orgchart li.vertical > ul > li:last-child > .nodecontent::before {
    display: none;
}
/* org chart - end */

/* mm input - start */
.mm-input .form-control {
    /* border: none; */
}

.mm-input .valid.modified:not([type=checkbox]) {
    outline: 0;
}

.mm-input input,
.mm-input .form-control:focus {
    background-color: transparent;
}

.mm-input .bg-white input,
.mm-input .bg-white .form-control:focus {
    background-color: var(--bs-white);
}

.mm-input .dxbl-input-group {
    /* border-bottom: 1px solid var(--bs-secondary); */
}

.dxbl-edit-clbv.invalid + .postcode-holder .form-control {
    border-color: var(--bs-danger) !important;
}

.mm-input .dxbl-dropdown-edit.invalid .dxbl-input-group,
.dxbl-edit-clbv.invalid + .postcode-holder .dxbl-input-group,
.mm-input .dxbl-edit-clbv.invalid .dxbl-input-group {
    /* border-bottom: 1px solid var(--bs-danger) !important; */
    background-color: var(--bs-gray-100);
}

.mm-input .dxbl-calendar.invalid, .mm-input .dxbl-calendar.valid.modified, .mm-input .dxbl-checkbox.invalid, .mm-input .dxbl-checkbox.valid.modified, .mm-input .dxbl-combobox.invalid, .mm-input .dxbl-combobox.valid.modified, .mm-input .dxbl-date-time-edit.invalid, .mm-input .dxbl-date-time-edit.valid.modified, .mm-input .dxbl-listbox.invalid, .mm-input .dxbl-listbox.valid.modified, .mm-input .dxbl-memo.invalid, .mm-input .dxbl-memo.valid.modified, .mm-input .dxbl-spin-edit.invalid, .mm-input .dxbl-spin-edit.valid.modified, .mm-input .dxbl-tagbox.invalid, .mm-input .dxbl-tagbox.valid.modified, .mm-input .dxbl-textbox.invalid, .mm-input .dxbl-textbox.valid.modified {
    /* outline: none; */
}

.mm-input input {
    /* padding: 0 !important; */
}

.mm-input .form-control,
.mm-input .form-control:focus {
    /* border-radius: 0; */
    box-shadow: initial !important;
}

.mm-input input::placeholder,
.mm-input textarea::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    font-style: italic;
    opacity: 1; /* Firefox */
}

.mm-input input:-ms-input-placeholder,
.mm-input textarea:-ms-input-placeholder { /* Internet Explorer 10-11 */
    font-style: italic;
}

.mm-input input::-ms-input-placeholder,
.mm-input textarea::-ms-input-placeholder { /* Microsoft Edge */
    font-style: italic;
}

.mm-cb.mm-cb-basic {
    height: auto;
    padding-bottom: 0;
}

    .mm-cb.mm-cb-basic input {
        width: 13rem;
    }

    .mm-cb.mm-cb-basic .border-secondary {
        border: 1px solid #b0b0b0 !important;
        border-radius: 0.2rem;
        padding: 0.25rem !important;
    }

    .mm-cb.mm-cb-basic .dxbl-edit-clbv {
        flex-grow: 1;
    }

.mm-cb-basic h6 {
    display: none;
}

.mm-cb-basic > div {
    margin: 0;
}

.mm-cb .mm-cb-dropdown.mm-cb-top {
    top: initial;
    bottom: 100%;
}

.mm-textarea {
    resize: none;
    overflow: hidden;
    min-height: 1.8rem;
    height: 1.8rem;
    outline: none;
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    border: 1px solid #b0b0b0;
    border-radius: 0.2rem;
    color: inherit;
}

.quick-add-header {
    color: var(--bs-primary) !important;
    font-weight: 700;
    width: 100% !important;
    padding-top: 0.5rem;
    padding-bottom: 0.25rem;
    text-transform: uppercase;
    /* font-weight-bold w-100 pt-3 pb-1 text-uppercase text-primary */
}

[data-mode="Default"] > div[data-mode="FindUk"],
[data-mode="FindUk"] > div[data-mode="Default"] {
    max-height: 3.2rem;
    min-height: 3.2rem;
    overflow: hidden !important;
}

    [data-mode="Default"] > div[data-mode="FindUk"] .quick-add-client-body,
    [data-mode="FindUk"] > div[data-mode="Default"] .quick-add-client-body {
        display: none;
    }
/* mm input - finish */


/* mm step-indicator - start */
.step-indicator .step-indicator-bar {
    background: var(--bs-secondary);
    position: absolute;
    left: 0;
    right: 0;
    top: calc(50% - 2px);
    height: 2px;
}

.step-indicator .step-indicator-circle {
    flex-grow: 1;
    position: relative;
}

    .step-indicator .step-indicator-circle::after {
        content: "";
        height: 1rem;
        width: 1rem;
        border-radius: 100%;
        background: var(--bs-white);
        border: 1px solid var(--bs-secondary);
        display: inline-block;
        top: calc(50% - 0.5rem);
        left: 50%;
        position: absolute;
    }

.mm-progress-circle circle {
    /* transform-origin: 1rem 1rem; */
}

.mm-progress-circle circle {
    stroke: var(--bs-gray-300);
}

    .mm-progress-circle circle.stroke-primary {
        stroke: var(--bs-primary);
    }
/* mm step-indicator - finish */


/* preview-header image - start */
.preview-header > div {
    padding-left: 8.5rem;
}

img.preview-pane-header-img {
    height: 4.4rem;
    aspect-ratio: 1;
    background-color: var(--bs-white);
}

.preview-header-section {
    color: var(--bs-primary);
    font-size: 0.9rem;
}
/* preview-header image - end */


/* grid card - start */
.card-grid {
    border: 1px solid var(--bs-border-color);
}

.grid-card {
    padding-top: calc(var(--bs-gutter-x) * 0.5);
    padding-bottom: calc(var(--bs-gutter-x) * 0.5);
    display: flex;
}

    .grid-card > div {
        background: white;
        flex-grow: 1;
        position: relative;
    }

.card-grid-pager .card-grid-pager-size-selector {
    align-items: center;
}

    .card-grid-pager .card-grid-pager-size-selector .dxbl-text-edit {
        width: 5rem;
    }

.card-grid-pager {
    border-top: 1px solid var(--bs-border-color);
}

.grid-card .grid-card-btns {
    right: 0;
    bottom: 0;
    display: flex;
}

    .grid-card .grid-card-btns > div {
        aspect-ratio: 1;
        align-items: center;
        display: flex;
    }

.grid-card .fa.fa-phone,
.grid-card .fa.fa-envelope,
.grid-card .fa.fa-flag,
.grid-card .fa.fa-traffic-light-go,
.grid-card .fa.fa-traffic-light-stop {
    width: 1.5rem;
    text-align: center;
    color: var(--bs-primary);
    margin-right: 0.5rem;
    border-radius: 0.25rem;
}

.bg-pulse {
    background: var(--bg-start, var(--bs-warning));
    color: var(--fg-start, var(--fs-warning));
    animation: bg-pulse-anim 2s linear infinite;
}

    .bg-pulse.bg-pulse-warning {
        --bg-start: var(--bs-warning);
        --bg-end: #EE7C0E;
        --fg-start: var(--bs-black);
        --fg-end: var(--bs-black);
    }

@keyframes bg-pulse-anim {
    50% {
        background-color: var(--bg-end, var(--bs-danger));
    }
}
/* grid card - end */


/* html editor - start */
.html-editor-toolbar {
    background-color: #f1f0f0 !important;
    padding:0 !important;
}

    .html-editor-toolbar + .dx-htmleditor.dx-htmleditor-outlined {
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }
/* html editor - start */


/* warning bar - start */
.warning-bar {
    background-image: linear-gradient(45deg, var(--bs-warning) 25%, #888 25%, #888 50%, var(--bs-warning) 50%, var(--bs-warning) 75%, #888 75%, #888 100%);
    background-size: 56.57px 56.57px;
    width: 100%;
    margin-top: -0.5rem;
    margin-bottom: 0.5rem;
    border-bottom: 1px solid white !important;
    text-align: center;
    color: black;
}
/* warning bar - end */

/* diary - start */
.dxsc-apt-bg.card {
}

.diary-carousel .carousel-inner {
    padding-bottom: 1rem !important;
}

.diary-carousel .carousel-indicators {
    margin-bottom: 0.5rem !important;
}

    .diary-carousel .carousel-indicators > li {
        width: 2em;
        height: 0.25rem;
        border-radius: 0.25rem;
        margin-left: 0.2rem;
        margin-right: 0.2rem;
        background-color: var(--bs-secondary) !important;
        cursor: pointer;
    }

        .diary-carousel .carousel-indicators > li.active {
            background-color: var(--bs-primary) !important;
        }
/* diary - end */


@media (max-width: 576px) {
    .dxbl-modal > .dxbl-modal-root > .dxbl-popup.mm-dx-popup-wide {
        max-width: 100%;
        overflow: hidden;
    }
}

@media (max-width: 767px) {
    .dxbl-modal > .dxbl-modal-root > .dxbl-popup.mm-dx-popup-wide {
        margin: 1rem;
    }
}

@media (min-width: 768px) {
    .dxbl-modal > .dxbl-modal-root > .dxbl-popup.mm-dx-popup-wide {
        max-width: min(80%, 70rem);
    }
}




.con-icon {
    border-radius: 100%;
    background: var(--bs-white);
    color: var(--bs-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1;
    text-align: center;
    height: 100%;
    background-image: url(/images/DefaultCandidateHeader.png);
    background-size: cover;
}

.fa-kit-duotone.fa-sparkles {
    font-size: 1.5em;
}

.mm-button .fa-kit-duotone.fa-sparkles {
    font-size: 1.2em;
}


.upload-photo-holder {
    /*
    height: 75px;
    width: 75px;
    */
}

.upload-photo-hover {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0,0,0,0.5);
    border-radius: 100%;
}

    .upload-photo-holder .fa {
        height: 1.5em;
        font-size: 1.2em;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        color: var(--bs-primary);

        background: white;
        border: 1px solid rgb(220,220,220);
        border-radius: 100%;
        top: initial;
    }


.hover-show-child-parent > .hover-show-child-child {
    display: none;
}

.hover-show-child-parent:not(.hover-show-child-parent-inactive):hover > .hover-show-child-child {
    display: flex;
}


.dxbl-wait-indicator.dxbl-wait-indicator-spin.mm-indicator {
    align-items: center;
    display: flex;
    animation: none;
}