.ngx-datatable {
    display: block;
    overflow: hidden;
    justify-content: center;
    position: relative;
    transform: translateZ(0)
}

.ngx-datatable [hidden] {
    display: none!important
}

.ngx-datatable *,.ngx-datatable *:before,.ngx-datatable *:after {
    box-sizing: border-box
}

.ngx-datatable.scroll-vertical .datatable-body {
    overflow-y: auto
}

.ngx-datatable.scroll-vertical.virtualized .datatable-body .datatable-row-wrapper {
    position: absolute
}

.ngx-datatable.scroll-horz .datatable-body {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch
}

.ngx-datatable.fixed-header .datatable-header .datatable-header-inner {
    white-space: nowrap
}

.ngx-datatable.fixed-header .datatable-header .datatable-header-inner .datatable-header-cell {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.ngx-datatable.fixed-row .datatable-scroll,.ngx-datatable.fixed-row .datatable-scroll .datatable-body-row {
    white-space: nowrap
}

.ngx-datatable.fixed-row .datatable-scroll .datatable-body-row .datatable-body-cell,.ngx-datatable.fixed-row .datatable-scroll .datatable-body-row .datatable-body-group-cell {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.ngx-datatable .datatable-body-row,.ngx-datatable .datatable-row-center,.ngx-datatable .datatable-header-inner {
    display: flex;
    flex-direction: row;
    -o-flex-flow: row;
    flex-flow: row
}

.ngx-datatable .datatable-body-cell,.ngx-datatable .datatable-header-cell {
    overflow-x: hidden;
    vertical-align: top;
    display: inline-block;
    line-height: 1.625
}

.ngx-datatable .datatable-body-cell:focus,.ngx-datatable .datatable-header-cell:focus {
    outline: none
}

.ngx-datatable .datatable-row-left,.ngx-datatable .datatable-row-right {
    z-index: 9
}

.ngx-datatable .datatable-row-left,.ngx-datatable .datatable-row-center,.ngx-datatable .datatable-row-group,.ngx-datatable .datatable-row-right {
    position: relative
}

.ngx-datatable .datatable-header {
    display: block;
    overflow: hidden
}

.ngx-datatable .datatable-header .datatable-header-inner {
    align-items: stretch;
    -webkit-align-items: stretch
}

.ngx-datatable .datatable-header .datatable-header-cell {
    position: relative;
    display: inline-block
}

.ngx-datatable .datatable-header .datatable-header-cell.sortable .datatable-header-cell-wrapper {
    cursor: pointer
}

.ngx-datatable .datatable-header .datatable-header-cell.longpress .datatable-header-cell-wrapper {
    cursor: move
}

.ngx-datatable .datatable-header .datatable-header-cell .sort-btn {
    line-height: 100%;
    vertical-align: middle;
    display: inline-block;
    cursor: pointer
}

.ngx-datatable .datatable-header .datatable-header-cell .resize-handle,.ngx-datatable .datatable-header .datatable-header-cell .resize-handle--not-resizable {
    display: inline-block;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 5px;
    padding: 0 4px;
    visibility: hidden
}

.ngx-datatable .datatable-header .datatable-header-cell .resize-handle {
    cursor: ew-resize
}

.ngx-datatable .datatable-header .datatable-header-cell.resizeable:hover .resize-handle,.ngx-datatable .datatable-header .datatable-header-cell:hover .resize-handle--not-resizable {
    visibility: visible
}

.ngx-datatable .datatable-header .datatable-header-cell .targetMarker {
    position: absolute;
    top: 0;
    bottom: 0
}

.ngx-datatable .datatable-header .datatable-header-cell .targetMarker.dragFromLeft {
    right: 0
}

.ngx-datatable .datatable-header .datatable-header-cell .targetMarker.dragFromRight {
    left: 0
}

.ngx-datatable .datatable-header .datatable-header-cell .datatable-header-cell-template-wrap {
    height: inherit
}

.ngx-datatable .datatable-body {
    position: relative;
    z-index: 10;
    display: block
}

.ngx-datatable .datatable-body .datatable-scroll {
    display: inline-block
}

.ngx-datatable .datatable-body .datatable-row-detail {
    overflow-y: hidden
}

.ngx-datatable .datatable-body .datatable-row-wrapper {
    display: flex;
    flex-direction: column
}

.ngx-datatable .datatable-body .datatable-body-row {
    outline: none
}

.ngx-datatable .datatable-body .datatable-body-row>div {
    display: flex
}

.ngx-datatable .datatable-footer {
    display: block;
    width: 100%;
    overflow: auto
}

.ngx-datatable .datatable-footer .datatable-footer-inner {
    display: flex;
    align-items: center;
    width: 100%
}

.ngx-datatable .datatable-footer .selected-count .page-count {
    flex: 1 1 40%
}

.ngx-datatable .datatable-footer .selected-count .datatable-pager {
    flex: 1 1 60%
}

.ngx-datatable .datatable-footer .page-count {
    flex: 1 1 20%
}

.ngx-datatable .datatable-footer .datatable-pager {
    flex: 1 1 80%;
    text-align: right
}

.ngx-datatable .datatable-footer .datatable-pager .pager,.ngx-datatable .datatable-footer .datatable-pager .pager li {
    padding: 0;
    margin: 0;
    display: inline-block;
    list-style: none
}

.ngx-datatable .datatable-footer .datatable-pager .pager li,.ngx-datatable .datatable-footer .datatable-pager .pager li a {
    outline: none
}

.ngx-datatable .datatable-footer .datatable-pager .pager li a {
    cursor: pointer;
    display: inline-block
}

.ngx-datatable .datatable-footer .datatable-pager .pager li.disabled a {
    cursor: not-allowed
}

.ngx-datatable.material {
    background: #fff;
    box-shadow: 0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f
}

.ngx-datatable.material.striped .datatable-row-odd {
    background: #eee
}

.ngx-datatable.material.single-selection .datatable-body-row.active,.ngx-datatable.material.single-selection .datatable-body-row.active .datatable-row-group,.ngx-datatable.material.multi-selection .datatable-body-row.active,.ngx-datatable.material.multi-selection .datatable-body-row.active .datatable-row-group,.ngx-datatable.material.multi-click-selection .datatable-body-row.active,.ngx-datatable.material.multi-click-selection .datatable-body-row.active .datatable-row-group {
    background-color: #304ffe;
    color: #fff
}

.ngx-datatable.material.single-selection .datatable-body-row.active:hover,.ngx-datatable.material.single-selection .datatable-body-row.active:hover .datatable-row-group,.ngx-datatable.material.multi-selection .datatable-body-row.active:hover,.ngx-datatable.material.multi-selection .datatable-body-row.active:hover .datatable-row-group,.ngx-datatable.material.multi-click-selection .datatable-body-row.active:hover,.ngx-datatable.material.multi-click-selection .datatable-body-row.active:hover .datatable-row-group {
    background-color: #193ae4;
    color: #fff
}

.ngx-datatable.material.single-selection .datatable-body-row.active:focus,.ngx-datatable.material.single-selection .datatable-body-row.active:focus .datatable-row-group,.ngx-datatable.material.multi-selection .datatable-body-row.active:focus,.ngx-datatable.material.multi-selection .datatable-body-row.active:focus .datatable-row-group,.ngx-datatable.material.multi-click-selection .datatable-body-row.active:focus,.ngx-datatable.material.multi-click-selection .datatable-body-row.active:focus .datatable-row-group {
    background-color: #2041ef;
    color: #fff
}

.ngx-datatable.material:not(.cell-selection) .datatable-body-row:hover,.ngx-datatable.material:not(.cell-selection) .datatable-body-row:hover .datatable-row-group {
    background-color: #eee;
    transition-property: background;
    transition-duration: .3s;
    transition-timing-function: linear
}

.ngx-datatable.material:not(.cell-selection) .datatable-body-row:focus,.ngx-datatable.material:not(.cell-selection) .datatable-body-row:focus .datatable-row-group {
    background-color: #ddd
}

.ngx-datatable.material.cell-selection .datatable-body-cell:hover,.ngx-datatable.material.cell-selection .datatable-body-cell:hover .datatable-row-group {
    background-color: #eee;
    transition-property: background;
    transition-duration: .3s;
    transition-timing-function: linear
}

.ngx-datatable.material.cell-selection .datatable-body-cell:focus,.ngx-datatable.material.cell-selection .datatable-body-cell:focus .datatable-row-group {
    background-color: #ddd
}

.ngx-datatable.material.cell-selection .datatable-body-cell.active,.ngx-datatable.material.cell-selection .datatable-body-cell.active .datatable-row-group {
    background-color: #304ffe;
    color: #fff
}

.ngx-datatable.material.cell-selection .datatable-body-cell.active:hover,.ngx-datatable.material.cell-selection .datatable-body-cell.active:hover .datatable-row-group {
    background-color: #193ae4;
    color: #fff
}

.ngx-datatable.material.cell-selection .datatable-body-cell.active:focus,.ngx-datatable.material.cell-selection .datatable-body-cell.active:focus .datatable-row-group {
    background-color: #2041ef;
    color: #fff
}

.ngx-datatable.material .empty-row {
    height: 50px;
    text-align: left;
    padding: .5rem 1.2rem;
    vertical-align: top;
    border-top: 0
}

.ngx-datatable.material .loading-row {
    text-align: left;
    padding: .5rem 1.2rem;
    vertical-align: top;
    border-top: 0
}

.ngx-datatable.material .datatable-header .datatable-row-left,.ngx-datatable.material .datatable-body .datatable-row-left {
    background-color: #fff;
    background-position: 100% 0;
    background-repeat: repeat-y;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABCAYAAAD5PA/NAAAAFklEQVQIHWPSkNeSBmJhTQVtbiDNCgASagIIuJX8OgAAAABJRU5ErkJggg==)
}

.ngx-datatable.material .datatable-header .datatable-row-right,.ngx-datatable.material .datatable-body .datatable-row-right {
    background-position: 0 0;
    background-color: #fff;
    background-repeat: repeat-y;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABCAYAAAD5PA/NAAAAFklEQVQI12PQkNdi1VTQ5gbSwkAsDQARLAIGtOSFUAAAAABJRU5ErkJggg==)
}

.ngx-datatable.material .datatable-header {
    border-bottom: 1px solid rgba(0,0,0,.12)
}

.ngx-datatable.material .datatable-header .datatable-header-cell {
    text-align: left;
    padding: .9rem 1.2rem;
    font-weight: 400;
    background-color: #fff;
    color: #0000008a;
    vertical-align: bottom;
    font-size: 12px;
    font-weight: 500
}

.ngx-datatable.material .datatable-header .datatable-header-cell .datatable-header-cell-wrapper {
    position: relative
}

.ngx-datatable.material .datatable-header .datatable-header-cell.longpress .draggable:after {
    transition: transform .4s ease,opacity .4s ease;
    opacity: .5;
    transform: scale(1)
}

.ngx-datatable.material .datatable-header .datatable-header-cell .draggable:after {
    content: " ";
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -30px 0 0 -30px;
    height: 60px;
    width: 60px;
    background: #eee;
    border-radius: 100%;
    opacity: 1;
    filter: none;
    transform: scale(0);
    z-index: 9999;
    pointer-events: none
}

.ngx-datatable.material .datatable-header .datatable-header-cell.dragging .resize-handle {
    border-right: none
}

.ngx-datatable.material .datatable-header .resize-handle {
    border-right: solid 1px #eee
}

.ngx-datatable.material .datatable-body {
    position: relative
}

.ngx-datatable.material .datatable-body .datatable-row-detail {
    background: #f5f5f5;
    padding: 10px
}

.ngx-datatable.material .datatable-body .datatable-group-header {
    background: #f5f5f5;
    border-bottom: solid 1px #d9d8d9;
    border-top: solid 1px #d9d8d9
}

.ngx-datatable.material .datatable-body .datatable-body-row .datatable-body-cell,.ngx-datatable.material .datatable-body .datatable-body-row .datatable-body-group-cell {
    text-align: left;
    padding: .9rem 1.2rem;
    vertical-align: top;
    border-top: 0;
    color: #000000de;
    transition: width .3s ease;
    font-size: 14px;
    font-weight: 400
}

.ngx-datatable.material .datatable-body .progress-linear {
    display: block;
    position: sticky;
    width: 100%;
    height: 5px;
    padding: 0;
    margin: 0;
    top: 0
}

.ngx-datatable.material .datatable-body .progress-linear .container {
    display: block;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 5px;
    transform: translate(0) scale(1);
    background-color: #aad1f9
}

.ngx-datatable.material .datatable-body .progress-linear .container .bar {
    transition: all .2s linear;
    animation: query .8s infinite cubic-bezier(.39,.575,.565,1);
    transition: transform .2s linear;
    background-color: #106cc8;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 5px
}

.ngx-datatable.material .datatable-footer {
    border-top: 1px solid rgba(0,0,0,.12);
    font-size: 12px;
    font-weight: 400;
    color: #0000008a
}

.ngx-datatable.material .datatable-footer .page-count {
    line-height: 50px;
    height: 50px;
    padding: 0 1.2rem
}

.ngx-datatable.material .datatable-footer .datatable-pager {
    margin: 0 10px
}

.ngx-datatable.material .datatable-footer .datatable-pager li {
    vertical-align: middle
}

.ngx-datatable.material .datatable-footer .datatable-pager li.disabled a {
    color: #00000042!important;
    background-color: transparent!important
}

.ngx-datatable.material .datatable-footer .datatable-pager li.active a {
    background-color: #9e9e9e33;
    font-weight: 700
}

.ngx-datatable.material .datatable-footer .datatable-pager a {
    height: 22px;
    min-width: 24px;
    line-height: 22px;
    padding: 0 6px;
    border-radius: 3px;
    margin: 6px 3px;
    text-align: center;
    vertical-align: top;
    color: #0000008a;
    text-decoration: none;
    vertical-align: bottom
}

.ngx-datatable.material .datatable-footer .datatable-pager a:hover {
    color: #000000bf;
    background-color: #9e9e9e33
}

.ngx-datatable.material .datatable-footer .datatable-pager .datatable-icon-left,.ngx-datatable.material .datatable-footer .datatable-pager .datatable-icon-skip,.ngx-datatable.material .datatable-footer .datatable-pager .datatable-icon-right,.ngx-datatable.material .datatable-footer .datatable-pager .datatable-icon-prev {
    font-size: 20px;
    line-height: 20px;
    padding: 0 3px
}

.ngx-datatable.material .datatable-summary-row .datatable-body-row,.ngx-datatable.material .datatable-summary-row .datatable-body-row:hover {
    background-color: #ddd
}

.ngx-datatable.material .datatable-summary-row .datatable-body-row .datatable-body-cell {
    font-weight: 700
}

.datatable-checkbox {
    position: relative;
    margin: 0;
    cursor: pointer;
    vertical-align: middle;
    display: inline-block;
    box-sizing: border-box;
    padding: 0
}

.datatable-checkbox input[type=checkbox] {
    position: relative;
    margin: 0 1rem 0 0;
    cursor: pointer;
    outline: none
}

.datatable-checkbox input[type=checkbox]:before {
    transition: all .3s ease-in-out;
    content: "";
    position: absolute;
    left: 0;
    z-index: 1;
    width: 1rem;
    height: 1rem;
    border: 2px solid #f2f2f2
}

.datatable-checkbox input[type=checkbox]:checked:before {
    transform: rotate(-45deg);
    height: .5rem;
    border-color: #009688;
    border-top-style: none;
    border-right-style: none
}

.datatable-checkbox input[type=checkbox]:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 1rem;
    height: 1rem;
    background: #fff;
    cursor: pointer
}

@keyframes query {
    0% {
        opacity: 1;
        transform: translate(35%) scaleX(.3)
    }

    to {
        opacity: 0;
        transform: translate(-50%) scaleX(0)
    }
}

@charset "UTF-8";@font-face {
    font-family: data-table;
    src: url(data-table.19a1c5c211a201d8.eot);
    src: url(data-table.19a1c5c211a201d8.eot?#iefix) format("embedded-opentype"),url(data-table.d233a8724a9532b6.woff) format("woff"),url(data-table.4f99927ffc558471.ttf) format("truetype"),url(data-table.029992b38cb863a4.svg#data-table) format("svg");
    font-weight: 400;
    font-style: normal
}

[data-icon]:before {
    font-family: data-table!important;
    content: attr(data-icon);
    font-style: normal!important;
    font-weight: 400!important;
    font-variant: normal!important;
    text-transform: none!important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

[class^=datatable-icon-]:before,[class*=" datatable-icon-"]:before {
    font-family: data-table!important;
    font-style: normal!important;
    font-weight: 400!important;
    font-variant: normal!important;
    text-transform: none!important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.datatable-icon-filter:before {
    content: "b"
}

.datatable-icon-collapse:before {
    content: "a"
}

.datatable-icon-expand:before {
    content: "c"
}

.datatable-icon-close:before {
    content: "d"
}

.datatable-icon-up:before {
    content: "e"
}

.datatable-icon-down:before {
    content: "f"
}

.datatable-icon-sort-unset:before {
    content: "c";
    opacity: .5
}

.datatable-icon-sort:before {
    content: "g"
}

.datatable-icon-done:before {
    content: "h"
}

.datatable-icon-done-all:before {
    content: "i"
}

.datatable-icon-search:before {
    content: "j"
}

.datatable-icon-pin:before {
    content: "k"
}

.datatable-icon-add:before {
    content: "m"
}

.datatable-icon-left:before {
    content: "o"
}

.datatable-icon-right:before {
    content: "p"
}

.datatable-icon-skip:before {
    content: "q"
}

.datatable-icon-prev:before {
    content: "r"
}

/*!
 * Cropper.js v1.6.2
 * https://fengyuanchen.github.io/cropperjs
 *
 * Copyright 2015-present Chen Fengyuan
 * Released under the MIT license
 *
 * Date: 2024-04-21T07:43:02.731Z
 */
.cropper-container {
    direction: ltr;
    font-size: 0;
    line-height: 0;
    position: relative;
    touch-action: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none
}

.cropper-container img {
    backface-visibility: hidden;
    display: block;
    height: 100%;
    image-orientation: 0deg;
    max-height: none!important;
    max-width: none!important;
    min-height: 0!important;
    min-width: 0!important;
    width: 100%
}

.cropper-wrap-box,.cropper-canvas,.cropper-drag-box,.cropper-crop-box,.cropper-modal {
    inset: 0;
    position: absolute
}

.cropper-wrap-box,.cropper-canvas {
    overflow: hidden
}

.cropper-drag-box {
    background-color: #fff;
    opacity: 0
}

.cropper-modal {
    background-color: #000;
    opacity: .5
}

.cropper-view-box {
    display: block;
    height: 100%;
    outline: 1px solid #39f;
    outline-color: #3399ffbf;
    overflow: hidden;
    width: 100%
}

.cropper-dashed {
    border: 0 dashed #eee;
    display: block;
    opacity: .5;
    position: absolute
}

.cropper-dashed.dashed-h {
    border-bottom-width: 1px;
    border-top-width: 1px;
    height: calc(100% / 3);
    left: 0;
    top: calc(100% / 3);
    width: 100%
}

.cropper-dashed.dashed-v {
    border-left-width: 1px;
    border-right-width: 1px;
    height: 100%;
    left: calc(100% / 3);
    top: 0;
    width: calc(100% / 3)
}

.cropper-center {
    display: block;
    height: 0;
    left: 50%;
    opacity: .75;
    position: absolute;
    top: 50%;
    width: 0
}

.cropper-center:before,.cropper-center:after {
    background-color: #eee;
    content: " ";
    display: block;
    position: absolute
}

.cropper-center:before {
    height: 1px;
    left: -3px;
    top: 0;
    width: 7px
}

.cropper-center:after {
    height: 7px;
    left: 0;
    top: -3px;
    width: 1px
}

.cropper-face,.cropper-line,.cropper-point {
    display: block;
    height: 100%;
    opacity: .1;
    position: absolute;
    width: 100%
}

.cropper-face {
    background-color: #fff;
    left: 0;
    top: 0
}

.cropper-line {
    background-color: #39f
}

.cropper-line.line-e {
    cursor: ew-resize;
    right: -3px;
    top: 0;
    width: 5px
}

.cropper-line.line-n {
    cursor: ns-resize;
    height: 5px;
    left: 0;
    top: -3px
}

.cropper-line.line-w {
    cursor: ew-resize;
    left: -3px;
    top: 0;
    width: 5px
}

.cropper-line.line-s {
    bottom: -3px;
    cursor: ns-resize;
    height: 5px;
    left: 0
}

.cropper-point {
    background-color: #39f;
    height: 5px;
    opacity: .75;
    width: 5px
}

.cropper-point.point-e {
    cursor: ew-resize;
    margin-top: -3px;
    right: -3px;
    top: 50%
}

.cropper-point.point-n {
    cursor: ns-resize;
    left: 50%;
    margin-left: -3px;
    top: -3px
}

.cropper-point.point-w {
    cursor: ew-resize;
    left: -3px;
    margin-top: -3px;
    top: 50%
}

.cropper-point.point-s {
    bottom: -3px;
    cursor: s-resize;
    left: 50%;
    margin-left: -3px
}

.cropper-point.point-ne {
    cursor: nesw-resize;
    right: -3px;
    top: -3px
}

.cropper-point.point-nw {
    cursor: nwse-resize;
    left: -3px;
    top: -3px
}

.cropper-point.point-sw {
    bottom: -3px;
    cursor: nesw-resize;
    left: -3px
}

.cropper-point.point-se {
    bottom: -3px;
    cursor: nwse-resize;
    height: 20px;
    opacity: 1;
    right: -3px;
    width: 20px
}

@media (min-width: 768px) {
    .cropper-point.point-se {
        height:15px;
        width: 15px
    }
}

@media (min-width: 992px) {
    .cropper-point.point-se {
        height:10px;
        width: 10px
    }
}

@media (min-width: 1200px) {
    .cropper-point.point-se {
        height:5px;
        opacity: .75;
        width: 5px
    }
}

.cropper-point.point-se:before {
    background-color: #39f;
    bottom: -50%;
    content: " ";
    display: block;
    height: 200%;
    opacity: 0;
    position: absolute;
    right: -50%;
    width: 200%
}

.cropper-invisible {
    opacity: 0
}

.cropper-bg {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC)
}

.cropper-hide {
    display: block;
    height: 0;
    position: absolute;
    width: 0
}

.cropper-hidden {
    display: none!important
}

.cropper-move {
    cursor: move
}

.cropper-crop {
    cursor: crosshair
}

.cropper-disabled .cropper-drag-box,.cropper-disabled .cropper-face,.cropper-disabled .cropper-line,.cropper-disabled .cropper-point {
    cursor: not-allowed
}

@font-face {
    font-family: LOreal Essentielle;
    src: url(/assets/fonts/loreal-essentielle/LOREAL-Essentielle-Light.ttf) format("truetype");
    font-style: normal;
    font-weight: 300;
    font-display: swap
}

@font-face {
    font-family: LOreal Essentielle;
    src: url(/assets/fonts/loreal-essentielle/LOREAL-Essentielle-LightItalic.ttf) format("truetype");
    font-style: italic;
    font-weight: 300;
    font-display: swap
}

@font-face {
    font-family: LOreal Essentielle;
    src: url(/assets/fonts/loreal-essentielle/LOREAL-Essentielle-Regular.ttf) format("truetype");
    font-style: normal;
    font-weight: 400;
    font-display: swap
}

@font-face {
    font-family: LOreal Essentielle;
    src: url(/assets/fonts/loreal-essentielle/LOREAL-Essentielle-Italic.ttf) format("truetype");
    font-style: italic;
    font-weight: 400;
    font-display: swap
}

@font-face {
    font-family: LOreal Essentielle;
    src: url(/assets/fonts/loreal-essentielle/LOREAL-Essentielle-Bold.ttf) format("truetype");
    font-style: normal;
    font-weight: 700;
    font-display: swap
}

@font-face {
    font-family: LOreal Essentielle;
    src: url(/assets/fonts/loreal-essentielle/LOREAL-Essentielle-BoldItalic.ttf) format("truetype");
    font-style: italic;
    font-weight: 700;
    font-display: swap
}

@font-face {
    font-family: LOreal Essentielle;
    src: url(/assets/fonts/loreal-essentielle/LOREAL-Essentielle-Black.ttf) format("truetype");
    font-style: normal;
    font-weight: 900;
    font-display: swap
}

@font-face {
    font-family: LOreal Essentielle;
    src: url(/assets/fonts/loreal-essentielle/LOREAL-Essentielle-BlackItalic.ttf) format("truetype");
    font-style: italic;
    font-weight: 900;
    font-display: swap
}
.fas{
    font-family: "Font Awesome 5 Free" !important;
}
.registration-wizard,.registration-wizard *,.admin-shell,.admin-shell * {
    font-family: LOreal Essentielle,Arial,sans-serif;
}

.datatable-body {
    height: 100%!important
}

#accordionSidebar,.sidebar {
    height: 100%;
    background: #ffffff;
    color: #000!important
}

.SearchingType1 input {
    width: 100%!important;
    height: 41px!important
}

.SearchingType1 .input-select-div {
    margin: 6px
}

.modal-backdrop {
    z-index: 0!important
}

#accordionSidebar * {
    color: #000!important
}

.ngx-datatable,.ngx-datatable * {
    background: none!important;
    color: #fff!important
}

* {
    font-family: acumin-pro,sans-serif;
    font-weight: 700;
    font-style: normal
}

.text-primary {
    color: #1681c4!important
}

.navbar {
    background: #ffffff75!important;
    color: #fff;
    box-shadow: 0 0 #fff!important;
    border: none
}

#page-top,#content {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top right;
    background-image: linear-gradient(#1c405d,#447292)
}

.sticky-footer {
    background-color: #447292!important;
    color: #fff
}

.card {
    background: none;
    color: #fff;
    border: 0px;
    box-shadow: 0 .5rem 1rem #0000!important
}

.text-primary,.text-gray-600,.text-gray-900 {
    color: #fff!important
}

@media (max-width: 1360px) {
    .woodSign {
        display:none
    }

    .signInForm {
        scale: 1!important
    }

    .signInForm .col-md-9 {
        margin-left: 0!important
    }
}

html,body {
    width: 100%;
    max-width: 100%;
    min-height: 100%
}

body {
    margin: 0;
    overflow-x: clip;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%
}

:root {
    --safe-area-inset-top: env(safe-area-inset-top);
    --safe-area-inset-bottom: env(safe-area-inset-bottom);
    --safe-area-inset-left: env(safe-area-inset-left);
    --safe-area-inset-right: env(safe-area-inset-right)
}

@supports (-webkit-touch-callout: none) {
    .mobile-safe-area {
        padding-bottom: max(20px,var(--safe-area-inset-bottom))
    }
}

@media screen and (max-width: 768px) {
    .invitation-welcome,.welcome-background {
        min-height:100dvh;
        min-height: -webkit-fill-available
    }

    .welcome-brands {
        bottom: max(60px,env(safe-area-inset-bottom,60px))!important
    }

    .container,.container-fluid {
        padding-left: 12px!important;
        padding-right: 12px!important
    }
}

@media screen and (max-width: 480px) {
    .container,.container-fluid {
        padding-left:10px!important;
        padding-right: 10px!important
    }
}

@media screen and (max-width: 768px) and (max-height: 600px) {
    .welcome-brands {
        bottom:80px!important
    }
}

#content .container-fluid {
    margin-top: 0
}

.header-logo {
    width: 50%!important;
    max-height: auto;
    height: auto!important;
    max-height: -moz-fit-content!important;
    max-height: fit-content!important;
    text-align: center;
    align-items: center
}

.logo-right,.logo-left {
    text-align: center
}

*,*:before,*:after {
    box-sizing: border-box
}

app-root,#wrapper,#content-wrapper,#content,#content>.container-fluid,router-outlet+* {
    min-width: 0;
    max-width: 100%
}

#wrapper {
    min-height: 100dvh
}

#content-wrapper {
    flex: 1 1 auto
}

img,picture,svg,video,canvas,iframe {
    max-width: 100%
}

img,video,canvas {
    height: auto
}

button,input,select,textarea {
    max-width: 100%;
    font: inherit
}

button,[role=button],.btn,a {
    touch-action: manipulation
}

:where(a,button,input,select,textarea,[tabindex]):focus-visible {
    outline: 3px solid rgba(255,255,255,.95);
    outline-offset: 2px;
    box-shadow: 0 0 0 5px #1681c48c
}

.row>*,.d-flex>*,.form-row>* {
    min-width: 0
}

p,li,td,th,label,.card,.modal-content,.dropdown-menu {
    overflow-wrap: anywhere
}

.table-responsive {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch
}

.table-responsive>.table {
    margin-bottom: 0
}

.ngx-datatable {
    width: 100%!important;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch
}

.ngx-datatable .datatable-body,.ngx-datatable .datatable-header,.ngx-datatable .datatable-footer {
    min-width: max-content
}

.modal-dialog {
    width: auto;
    max-width: min(calc(100vw - 32px),var(--bs-modal-width, 500px));
    margin-left: auto;
    margin-right: auto
}

.modal-dialog.modal-lg {
    --bs-modal-width: 800px
}

.modal-dialog.modal-xl {
    --bs-modal-width: 1140px
}

.modal-content {
    max-height: calc(100dvh - 32px);
    overflow-y: auto;
    overscroll-behavior: contain
}

.dropdown-menu {
    max-width: calc(100vw - 16px)
}

.card,.card-body,.form-group,.input-group {
    min-width: 0
}

body.cropper-open {
    overflow: hidden
}

.btn {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    border-radius: 10px;
    font-weight: 650;
    line-height: 1.2;
    white-space: normal;
    transition: transform .16s ease,box-shadow .16s ease,opacity .16s ease
}

.btn:not(:disabled):hover {
    transform: translateY(-1px)
}

.btn:disabled,.btn.disabled {
    cursor: not-allowed;
    opacity: .55
}

.btn-sm {
    min-height: 36px
}

.alert {
    border-width: 1px;
    border-radius: 14px;
    box-shadow: 0 8px 24px #10263d0f;
    font-size: .9rem;
    font-weight: 550;
    line-height: 1.5
}

.alert-danger {
    color: #8f2131;
    border-color: #efbcc4;
    background: #fff1f3
}

.alert-warning {
    color: #76500b;
    border-color: #efd597;
    background: #fff8e8
}

.alert-info {
    color: #0d526b;
    border-color: #b7dce9;
    background: #edf9fd
}

.swal2-popup {
    width: min(32rem,calc(100vw - 28px))!important;
    padding: 1.6rem!important;
    border: 1px solid #dfe8ef!important;
    border-radius: 22px!important;
    box-shadow: 0 30px 80px #0b20353d!important;
    font-family: inherit!important
}

.swal2-title {
    padding: 0!important;
    color: #18324a!important;
    font-size: clamp(1.25rem,3vw,1.65rem)!important;
    font-weight: 750!important;
    line-height: 1.25!important
}

.swal2-html-container {
    margin: .8rem 0 0!important;
    color: #5f7183!important;
    font-size: .95rem!important;
    line-height: 1.55!important
}

.swal2-actions {
    margin-top: 1.25rem!important;
    gap: .65rem
}

.swal2-styled {
    min-height: 44px;
    margin: 0!important;
    padding: .65rem 1.2rem!important;
    border-radius: 11px!important;
    font-size: .9rem!important;
    font-weight: 700!important;
    line-height: 1.2!important
}

@media (max-width: 767.98px) {
    #content>.container-fluid {
        padding-inline:12px!important
    }

    .topbar {
        min-height: 4.375rem;
        height: auto;
        padding-inline:8px}

    .topbar #sidebarToggleTop,.topbar .nav-link,.sidebar .nav-item .nav-link,button,.btn,input:not([type=checkbox]):not([type=radio]),select,textarea {
        min-height: 44px
    }

    .modal-dialog {
        max-width: calc(100vw - 20px);
        margin-top: max(10px,env(safe-area-inset-top));
        margin-bottom: max(10px,env(safe-area-inset-bottom))
    }

    .modal-content {
        max-height: calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom))
    }

    .btn-group,.input-group,.form-row {
        max-width: 100%
    }

    .card-body {
        padding-left: clamp(12px,4vw,20px);
        padding-right: clamp(12px,4vw,20px)
    }
}

@media (max-width: 359.98px) {
    #content>.container-fluid,.container,.container-fluid {
        padding-left:8px!important;
        padding-right: 8px!important
    }

    .modal-dialog {
        max-width: calc(100vw - 12px)
    }
}

@media (prefers-reduced-motion: reduce) {
    html:focus-within {
        scroll-behavior: auto
    }

    *,*:before,*:after {
        scroll-behavior: auto!important;
        animation-duration: .01ms!important;
        animation-iteration-count: 1!important;
        transition-duration: .01ms!important
    }
}