html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    vertical-align: baseline;
}
html {
    line-height: 1;
    scroll-behavior: smooth;
}
ol,
ul {
    list-style: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
caption,
th,
td {
    text-align: left;
    font-weight: normal;
    vertical-align: middle;
}
q,
blockquote {
    quotes: none;
}
q:before,
q:after,
blockquote:before,
blockquote:after {
    content: "";
    content: none;
}
a img {
    border: none;
}
img {
    max-width: 100%;
    height: auto;
}
a {
    text-decoration: none;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
* {
    outline: 0 !important;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
    display: block;
}
button {
    border: none;
    background: transparent;
}
textarea,
input[type="text"],
input[type="search"],
input[type="button"],
input[type="submit"] {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    border-radius: 0;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
    display: none;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    margin: 0;
}
input[type="number"] {
    -moz-appearance: textfield;
}
input[type="search"]::-ms-clear {
    display: none;
    height: 0;
    width: 0;
}
input[type="search"]::-ms-reveal {
    display: none;
    height: 0;
    width: 0;
}
@font-face {
    font-family: "MuseoSans";
    src: url("../fonts/MuseoSansCyrl-500.eot");
    src:
        local("MuseoSansCyrl-500"),
        url("../fonts/MuseoSansCyrl-500.eot?#iefix") format("embedded-opentype"),
        url("../fonts/MuseoSansCyrl-500.woff") format("woff"),
        url("../fonts/MuseoSansCyrl-500.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: "MuseoSans";
    src: url("../fonts/MuseoSansCyrl-300Italic.eot");
    src:
        local("MuseoSansCyrl-300Italic"),
        url("../fonts/MuseoSansCyrl-300Italic.eot?#iefix")
            format("embedded-opentype"),
        url("../fonts/MuseoSansCyrl-300Italic.woff") format("woff"),
        url("../fonts/MuseoSansCyrl-300Italic.ttf") format("truetype");
    font-weight: 300;
    font-style: italic;
}
@font-face {
    font-family: "MuseoSans";
    src: url("../fonts/MuseoSansCyrl-500Italic.eot");
    src:
        local("MuseoSansCyrl-500Italic"),
        url("../fonts/MuseoSansCyrl-500Italic.eot?#iefix")
            format("embedded-opentype"),
        url("../fonts/MuseoSansCyrl-500Italic.woff") format("woff"),
        url("../fonts/MuseoSansCyrl-500Italic.ttf") format("truetype");
    font-weight: 500;
    font-style: italic;
}
@font-face {
    font-family: "MuseoSans";
    src: url("../fonts/MuseoSansCyrl-900.eot");
    src:
        local("MuseoSansCyrl-900"),
        url("../fonts/MuseoSansCyrl-900.eot?#iefix") format("embedded-opentype"),
        url("../fonts/MuseoSansCyrl-900.woff") format("woff"),
        url("../fonts/MuseoSansCyrl-900.ttf") format("truetype");
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: "MuseoSans";
    src: url("../fonts/MuseoSansCyrl-700.eot");
    src:
        local("MuseoSansCyrl-700"),
        url("../fonts/MuseoSansCyrl-700.eot?#iefix") format("embedded-opentype"),
        url("../fonts/MuseoSansCyrl-700.woff") format("woff"),
        url("../fonts/MuseoSansCyrl-700.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: "MuseoSans";
    src: url("../fonts/MuseoSansCyrl-700Italic.eot");
    src:
        local("MuseoSansCyrl-700Italic"),
        url("../fonts/MuseoSansCyrl-700Italic.eot?#iefix")
            format("embedded-opentype"),
        url("../fonts/MuseoSansCyrl-700Italic.woff") format("woff"),
        url("../fonts/MuseoSansCyrl-700Italic.ttf") format("truetype");
    font-weight: 700;
    font-style: italic;
}
@font-face {
    font-family: "MuseoSans";
    src: url("../fonts/MuseoSansCyrl-300.eot");
    src:
        local("MuseoSansCyrl-300"),
        url("../fonts/MuseoSansCyrl-300.eot?#iefix") format("embedded-opentype"),
        url("../fonts/MuseoSansCyrl-300.woff") format("woff"),
        url("../fonts/MuseoSansCyrl-300.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: "MuseoSans";
    src: url("../fonts/MuseoSansCyrl-100.eot");
    src:
        local("MuseoSansCyrl-100"),
        url("../fonts/MuseoSansCyrl-100.eot?#iefix") format("embedded-opentype"),
        url("../fonts/MuseoSansCyrl-100.woff") format("woff"),
        url("../fonts/MuseoSansCyrl-100.ttf") format("truetype");
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: "MuseoSans";
    src: url("../fonts/MuseoSansCyrl-100Italic.eot");
    src:
        local("MuseoSansCyrl-100Italic"),
        url("../fonts/MuseoSansCyrl-100Italic.eot?#iefix")
            format("embedded-opentype"),
        url("../fonts/MuseoSansCyrl-100Italic.woff") format("woff"),
        url("../fonts/MuseoSansCyrl-100Italic.ttf") format("truetype");
    font-weight: 100;
    font-style: italic;
}
@font-face {
    font-family: "MuseoSans";
    src: url("../fonts/MuseoSansCyrl-900Italic.eot");
    src:
        local("Museo Sans Cyrl 900 Italic"),
        local("MuseoSansCyrl-900Italic"),
        url("../fonts/MuseoSansCyrl-900Italic.eot?#iefix")
            format("embedded-opentype"),
        url("../fonts/MuseoSansCyrl-900Italic.woff") format("woff"),
        url("../fonts/MuseoSansCyrl-900Italic.ttf") format("truetype");
    font-weight: 900;
    font-style: italic;
}
/* ========== Common Styles ========== */

:root {
    --green: #5aac56;
    --yellow: #ffc40c;
    --grey__3: #cccccc;
    --white: #ffffff;
    --grey__2: #989898;
    --grey__1: #656565;
    --black: #323232;
    --black-2: #000000;
    --grey__4: #efefef;
    --red: #d14343;
    --red__2: #e07070;
    --red__3: #eba0a0;
    --red__4: #f5d0d0;
    --red__5: #fdf5f5;
    --blue: #0080ff;
    --light-red-bg: #fcf6f6;
    --grey__5: #f7f7f7;
    --grean__5: #f7fbf7;
    --grean__4: #d6ead5;
    --yellow__4: #fff0c2;
    --yellow__2: #ffd349;
    --yellow__3: #ffe185;
    --yellow__5: #fffcf3;
    --grean__2: #83c180;
    --grean__3: #acd5aa;
    --button-small-button: 0.7778rem;
    --button-big-button: 0.8889rem;
    --h1: 3.3333rem;
    --h2: 2.6667rem;
    --h3: 2rem;
    --h4: 1.3333rem;
    --h5: 1.1667rem;
    --text-t1: 1rem;
    --text-t2: 0.8333rem;
    --caption-1: 0.7222rem;
    --caption-2: 0.6111rem;
    --default-bradius: 1.6667rem;
    --chatHeight: 41.2778rem;
    --chatHeightLg: 51.7222rem;
}

html,
html body {
    font-family: "MuseoSans";
    font-size: 18px;
    font-weight: 300;
    line-height: 1.222em;
    color: var(--grey__1);
    background-color: var(--black);
}
body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    min-height: 100vh;
}
.sitemap-list {
    -webkit-columns: 2;
    -moz-columns: 2;
    columns: 2;
    margin-left: -0.5556rem;
    margin-right: -0.5556rem;
    padding: 0;
}
.sitemap-list li {
    padding-left: 0.5556rem;
    padding-right: 0.5556rem;
    margin-bottom: 1.25rem;
}
.sitemap-list li a {
    color: var(--black);
    font-weight: 400;
    text-decoration: none;
}
.sitemap-list li a:hover {
    text-decoration: underline;
}

/* ========== Font size Styles ========== */

.h-1 {
    font-size: var(--h1) !important;
    line-height: 1.25em;
}
.h-2 {
    font-size: var(--h2) !important;
    line-height: 1.25em;
}
.h-3 {
    font-size: var(--h3) !important;
    line-height: 1.25em;
}
.h-4 {
    font-size: var(--h4) !important;
    line-height: 1.25em;
}
.h-5 {
    font-size: var(--h5) !important;
    line-height: 1.25em;
}
.size-t1 {
    font-size: var(--text-t1) !important;
}
.size-t2 {
    font-size: var(--text-t2) !important;
}

.caption-1 {
    font-size: var(--caption-1) !important;
}

.caption-2 {
    font-size: var(--caption-2) !important;
}

/* Text color classes */
.green {
    color: var(--green) !important;
}
.blue {
    color: var(--blue) !important;
}
.grey-1 {
    color: var(--grey__1) !important;
}
.grey-2 {
    color: var(--grey__2) !important;
}
.grey-3 {
    color: var(--grey__3) !important;
}
.grey-4 {
    color: var(--grey__4) !important;
}
.grey-5 {
    color: var(--grey__5) !important;
}
.white {
    color: var(--white) !important;
}
.black {
    color: var(--black) !important;
}
.black-2 {
    color: var(--black-2) !important;
}
.red {
    color: var(--red) !important;
}
.green-clr {
    color: var(--green) !important;
}
.grean-2 {
    color: var(--grean__2) !important;
}
.grean-3 {
    color: var(--grean__3) !important;
}
.grean-4 {
    color: var(--grean__4) !important;
}
.grean-5 {
    color: var(--grean__5) !important;
}
.yellow {
    color: var(--yellow) !important;
}
.yellow-2 {
    color: var(--yellow__2) !important;
}
.yellow-3 {
    color: var(--yellow__3) !important;
}
.yellow-4 {
    color: var(--yellow__4) !important;
}
.yellow-5 {
    color: var(--yellow__5) !important;
}
/* Background color classes */
.green-bg {
    background-color: var(--green) !important;
}
.grey-1-bg {
    background-color: var(--grey__1) !important;
}
.grey-2-bg {
    background-color: var(--grey__2) !important;
}
.grey-3-bg {
    background-color: var(--grey__3) !important;
}
.grey-4-bg {
    background-color: var(--grey__4) !important;
}
.grey-5-bg {
    background-color: var(--grey__5) !important;
}
.white-bg {
    background-color: var(--white) !important;
}
.black-bg {
    background-color: var(--black) !important;
}
.red-bg {
    background-color: var(--red) !important;
}
.light-red-bg {
    background-color: var(--light-red-bg) !important;
}
.grean-2-bg {
    background-color: var(--grean__2) !important;
}
.grean-3-bg {
    background-color: var(--grean__3) !important;
}
.grean-4-bg {
    background-color: var(--grean__4) !important;
}
.grean-5-bg {
    background-color: var(--grean__5) !important;
}
.yellow-bg {
    background-color: var(--yellow) !important;
}
.yellow-2-bg {
    background-color: var(--yellow__2) !important;
}
.yellow-3-bg {
    background-color: var(--yellow__3) !important;
}
.yellow-4-bg {
    background-color: var(--yellow__4) !important;
}
.yellow-5-bg {
    background-color: var(--yellow__5) !important;
}

/* Border color classes */
.green-border {
    border: 1px solid var(--green) !important;
}
.grey-1-border {
    border: 1px solid var(--grey__1) !important;
}
.grey-2-border {
    border: 1px solid var(--grey__2) !important;
}
.grey-3-border {
    border: 1px solid var(--grey__3) !important;
}
.grey-4-border {
    border: 1px solid var(--grey__4) !important;
}
.grey-5-border {
    border: 1px solid var(--grey__5) !important;
}
.white-border {
    border: 1px solid var(--white) !important;
}
.black-border {
    border: 1px solid var(--black) !important;
}
.red-border {
    border: 1px solid var(--red) !important;
}
.light-red-border {
    border: 1px solid var(--light-red-bg) !important;
}
.grean-2-border {
    border: 1px solid var(--grean__2) !important;
}
.grean-3-border {
    border: 1px solid var(--grean__3) !important;
}
.grean-4-border {
    border: 1px solid var(--grean__4) !important;
}
.grean-5-border {
    border: 1px solid var(--grean__5) !important;
}
.yellow-border {
    border: 1px solid var(--yellow) !important;
}
.yellow-2-border {
    border: 1px solid var(--yellow__2) !important;
}
.yellow-3-border {
    border: 1px solid var(--yellow__3) !important;
}
.yellow-4-border {
    border: 1px solid var(--yellow__4) !important;
}
.yellow-5-border {
    border: 1px solid var(--yellow__5) !important;
}
.z-index-1 {
    position: relative;
    z-index: 1;
}
.fw-100 {
    font-weight: 100 !important;
}
.fw-300 {
    font-weight: 300 !important;
}
.fw-500 {
    font-weight: 500 !important;
}
.fw-700 {
    font-weight: 700 !important;
}
.fw-900 {
    font-weight: 900 !important;
}
.mw-50 {
    max-width: 50%;
}
.min-height-100 {
    min-height: 100%;
}
.row.sm-gap {
    margin-left: -5px;
    margin-right: -5px;
}
.row.sm-gap > [class^="col-"],
.row.sm-gap > [class*="col-"] {
    padding-left: 5px;
    padding-right: 5px;
}
.pre-line {
    white-space: pre-line;
}
.text {
    font-size: var(--text-t1);
    line-height: 1.25rem;
}
.text-right {
    text-align: right;
}
.default-bradius {
    border-radius: 1.6667rem;
}
.link-item {
    color: var(--green);
    text-decoration: none;
}
.link-item:hover {
    color: var(--green);
}
.icon-box {
    width: 1.1111rem;
    height: 1.1111rem;
    padding: 0;
}
.icon-box > * {
    max-width: 100%;
    max-height: 100%;
}
.icon-box-lg {
    width: 1.8333rem;
    height: 1.8333rem;
}
.icon-box.icon-box-end {
    left: initial !important;
    right: 0.8667rem;
}
.section-padding {
    padding: 42px 0 0;
}
.heading {
    line-height: 1em;
    font-weight: 700;
    color: var(--black);
    text-align: center;
    margin-bottom: 2.2222rem;
}
.boxed-paragraph {
    font-weight: 700;
    font-size: var(--text-t1);
    color: var(--black);
    padding: 1.1111rem;
    background: var(--grean__5);
    border-radius: 0.8333rem;
}
.text-left {
    text-align: left !important;
}
html:has(.has-white-bg),
html body:has(.has-white-bg) {
    background-color: #fff !important;
}
.has-bg {
    position: relative;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
    width: calc(100% - 3.6111rem);
    height: calc(100% - 7.7778rem);
    padding: 4rem 1.1111rem 12.7778rem;
    border-radius: 2.2222rem;
    background:
        url(../images/hero/bg-pattern.png) center repeat-y,
        #5aac56;
}
.has-bg ~ .footer {
    position: relative;
    z-index: 5;
    width: calc(100% - 5.2778rem);
    padding-top: 0 !important;
    margin-top: -9.4444rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
.has-bg ~ .footer:after {
    content: "";
    display: block;
    width: 100%;
    height: 1.6667rem;
}
.has-bg.has-bg-dark {
    background-color: #2d2d2d;
}
.has-bg.has-bg-dark ~ .footer .footer-inner {
    background-color: #fff;
}
.has-bg.has-bg-dark ~ .footer .footer__link,
.has-bg.has-bg-dark ~ .footer .footer__copyright {
    color: var(--grey__1) !important;
}
/* ========== Input Styles ========== */
.input-element {
    position: relative;
}
.input-element .input-white {
    background-color: #fff;
}
html .input-element.textarea-sm textarea {
    height: 80px;
}
html .input-element.input-element-default input,
html .input-element.input-element-default textarea {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border: 1px solid var(--grey__4) !important;
}
.input-element .input-element-icon {
    position: absolute;
    left: 0.8667rem;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    z-index: 1;
}
.input-element .input-element-icon > svg {
    max-width: 100%;
    max-height: 100%;
}
.input-element-icon.top-input-icon {
    top: 1.111rem;
    bottom: auto;
}
.input-element-icon.input-element-end-icon {
    left: auto !important;
    right: 0.8667rem;
}
.input-element-icon .input-element-icon {
    position: static !important; /* TODO: BOSS-1304 This is temporary. Also check adminapp/.../Input.tsx */
}
.input-element input,
.input-element textarea {
    width: 100%;
    font-family: inherit;
    font-weight: 300;
    padding: 1.1rem var(--text-t2);
    background: #f7f7f7;
}
.input-element:not(.input-element-flat) input,
.input-element:not(.input-element-flat) textarea {
    -webkit-box-shadow: inset 0px 2px 10px rgba(0, 0, 0, 0.15) !important;
    box-shadow: inset 0px 2px 10px rgba(0, 0, 0, 0.15) !important;
    border-radius: 2.6667rem;
    border: 1px solid white;
}
.input-element input.bg-transparent,
.input-element textarea.bg-transparent {
    -webkit-box-shadow: inset 0px 2px 7px rgba(0, 0, 0, 0.08) !important;
    box-shadow: inset 0px 2px 7px rgba(0, 0, 0, 0.08) !important;
}
.input-element:has(input:not(:-moz-placeholder-shown)) input,
.input-element:has(textarea:not(:-moz-placeholder-shown)) textarea {
    border-color: var(--green);
}
.input-element:has(input:not(:-ms-input-placeholder)) input,
.input-element:has(textarea:not(:-ms-input-placeholder)) textarea {
    border-color: var(--green);
}
.input-element:has(input:not(:-moz-placeholder-shown)) input,
.input-element:has(textarea:not(:-moz-placeholder-shown)) textarea {
    border-color: var(--green);
}
.input-element:has(input:not(:-ms-input-placeholder)) input,
.input-element:has(textarea:not(:-ms-input-placeholder)) textarea {
    border-color: var(--green);
}
.input-element:has(input:not(:placeholder-shown)) input,
.input-element:has(textarea:not(:placeholder-shown)) textarea {
    border-color: var(--green);
}
.input-element:has(input:not(:-moz-placeholder-shown)) .icon-box path,
.input-element:has(textarea:not(:-moz-placeholder-shown)) .icon-box path {
    fill: var(--green);
}
.input-element:has(input:not(:-ms-input-placeholder)) .icon-box path,
.input-element:has(textarea:not(:-ms-input-placeholder)) .icon-box path {
    fill: var(--green);
}
.input-element:has(input:not(:-moz-placeholder-shown)) .icon-box path,
.input-element:has(textarea:not(:-moz-placeholder-shown)) .icon-box path {
    fill: var(--green);
}
.input-element:has(input:not(:-ms-input-placeholder)) .icon-box path,
.input-element:has(textarea:not(:-ms-input-placeholder)) .icon-box path {
    fill: var(--green);
}
.input-element:has(input:not(:placeholder-shown)) .icon-box path,
.input-element:has(textarea:not(:placeholder-shown)) .icon-box path {
    fill: var(--green);
}
.input-element.form-floating:has(.icon-box:not(.icon-box-end)) > label,
.input-element:has(.icon-box:not(.icon-box-end)) input,
.input-element:has(.icon-box:not(.icon-box-end)) textarea {
    padding-left: 2.3222rem !important;
}
.input-element textarea {
    border-radius: 1.1111rem;
    height: 150px !important;
    resize: none;
}
.input-element textarea::-webkit-input-placeholder,
.input-element input::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: var(--grey__3);
}
.input-element textarea::-moz-placeholder,
.input-element input::-moz-placeholder {
    /* Firefox 19+ */
    color: var(--grey__3);
}
.input-element textarea:-ms-input-placeholder,
.input-element input:-ms-input-placeholder {
    /* IE 10+ */
    color: var(--grey__3);
}
.input-element textarea:-moz-placeholder,
.input-element input:-moz-placeholder {
    /* Firefox 18- */
    color: var(--grey__3);
}
/* === Floating input Styles === */
.input-element.form-floating:has(svg) > label {
    line-height: 1.5em;
    color: var(--grey__3);
}
.form-floating:has(svg) > .form-control:not(:-moz-placeholder-shown) ~ label {
    transform: scale(0.65) translateY(0rem) translateX(1.35rem) !important;
}
.form-floating:has(svg) > .form-control:not(:-ms-input-placeholder) ~ label {
    -ms-transform: scale(0.65) translateY(0rem) translateX(1.35rem) !important;
    transform: scale(0.65) translateY(0rem) translateX(1.35rem) !important;
}
.form-floating:has(svg) > .form-control:focus ~ label,
.form-floating:has(svg) > .form-control:not(:placeholder-shown) ~ label,
.form-floating:has(svg) > .form-select ~ label {
    -webkit-transform: scale(0.65) translateY(0rem) translateX(1.35rem) !important;
    -ms-transform: scale(0.65) translateY(0rem) translateX(1.35rem) !important;
    transform: scale(0.65) translateY(0rem) translateX(1.35rem) !important;
}
.input-element.form-floating input:not(:-moz-placeholder-shown) ~ label {
    font-size: var(--caption-2);
    color: var(--green);
    line-height: 2.5em;
}
.input-element.form-floating input:not(:-ms-input-placeholder) ~ label {
    font-size: var(--caption-2);
    color: var(--green);
    line-height: 2.5em;
}
.input-element.form-floating input:focus ~ label,
.input-element.form-floating input:not(:placeholder-shown) ~ label {
    font-size: var(--caption-2);
    color: var(--green);
    line-height: 2.5em;
}
.input-element.form-floating input:not(:-moz-placeholder-shown) {
    box-shadow: none !important;
    background-color: #fff !important;
}
.input-element.form-floating input:not(:-ms-input-placeholder) {
    box-shadow: none !important;
    background-color: #fff !important;
}
.input-element.form-floating input:focus,
.input-element.form-floating input:not(:placeholder-shown) {
    background-color: #fff !important;
}
.input-element.form-floating input:not(:-moz-placeholder-shown) {
    border: 1px solid var(--grey__4);
}
.input-element.form-floating input:not(:-ms-input-placeholder) {
    border: 1px solid var(--grey__4);
}
.input-element.form-floating input:not(:placeholder-shown) {
    border: 1px solid var(--grey__4);
}
.input-element.form-floating input:focus {
    border: 1px solid var(--green);
}
.input-element.form-floating
    input:not(:-moz-placeholder-shown)
    ~ .icon-box
    path {
    fill: var(--green) !important;
}
.input-element.form-floating
    input:not(:-ms-input-placeholder)
    ~ .icon-box
    path {
    fill: var(--green) !important;
}
.input-element.form-floating
    input:not(:-moz-placeholder-shown)
    ~ .icon-box
    path {
    fill: var(--green) !important;
}
.input-element.form-floating
    input:not(:-ms-input-placeholder)
    ~ .icon-box
    path {
    fill: var(--green) !important;
}
.input-element.form-floating input:focus ~ .icon-box path,
.input-element.form-floating input:not(:placeholder-shown) ~ .icon-box path {
    fill: var(--green) !important;
}
.input-element.form-floating input:not(:focus) {
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.input-element.form-floating input {
    -webkit-transition: padding 0.15s linear;
    -o-transition: padding 0.15s linear;
    transition: padding 0.15s linear;
}
.input-element.form-floating
    input:not(:focus):not(:-moz-placeholder-shown)
    ~ label {
    display: none !important;
}
.input-element.form-floating
    input:not(:focus):not(:-ms-input-placeholder)
    ~ label {
    display: none !important;
}
.input-element.form-floating
    input:not(:focus):not(:-moz-placeholder-shown)
    ~ label {
    display: none !important;
}
.input-element.form-floating
    input:not(:focus):not(:-ms-input-placeholder)
    ~ label {
    display: none !important;
}
.input-element.form-floating input:not(:focus):not(:placeholder-shown) ~ label {
    display: none !important;
}
/* ========== Upload input Styles ========== */
.add-input-element {
    position: relative;
    font-size: var(--text-t1);
    color: var(--black);
    font-weight: 700;
}
.add-input-element input {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1;
    font-size: 0;
    cursor: pointer;
}
.add-input-element input[type="file"]::-webkit-file-upload-button {
    visibility: hidden;
    color: transparent;
}
.add-input-element input[type="file"]::file-selector-button {
    visibility: hidden;
    color: transparent;
}
.add-input-element input[type="file"]::-webkit-file-upload-button {
    visibility: hidden;
    color: transparent;
}
/* === upload Picture file Styles === */
.image-upFile {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.image-upFile-image {
    position: relative;
    overflow: hidden;
    width: 3.3333rem;
    height: 3.3333rem;
    border-radius: 6px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}
.image-upFile-image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}
.image-upFile-name {
    width: 7.7222rem;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    font-weight: 700;
    font-size: var(--text-t1);
    color: var(--black);
}
.image-upFile-fileSize {
    font-weight: 300;
    font-size: var(--caption-1);
    color: var(--green);
}
.image-upFile-uploadText {
    font-weight: 700;
    font-size: var(--text-t2);
    color: var(--green);
}
.image-upFile-remove {
    font-weight: 300;
    font-size: var(--caption-1);
    color: var(--red);
}
.image-upFile-remove:hover {
    opacity: 0.8;
}
.image-upFile-remove:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 10px;
    height: 10px;
    margin-left: 5px;
    background-image: url("data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 10 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.01804 9.76509C0.842799 9.76509 0.667555 9.69828 0.533931 9.56465C0.266684 9.29741 0.266684 8.86395 0.533931 8.59643L8.59817 0.532467C8.86542 0.265219 9.29887 0.265219 9.56639 0.532467C9.83364 0.799714 9.83364 1.23317 9.56639 1.50069L1.50188 9.56465C1.36826 9.69828 1.19329 9.76509 1.01804 9.76509Z' fill='%23D14343'/%3E%3Cpath d='M9.08201 9.76536C8.90676 9.76536 8.73152 9.69855 8.5979 9.56493L0.533931 1.50069C0.266684 1.23344 0.266684 0.799988 0.533931 0.532467C0.801179 0.265219 1.23463 0.265219 1.50215 0.532467L9.56639 8.59671C9.83364 8.86395 9.83364 9.29741 9.56639 9.56493C9.4325 9.69855 9.25725 9.76536 9.08201 9.76536Z' fill='%23D14343'/%3E%3C/svg%3E%0A");
}
.image-upFile-input {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1;
    font-size: 0;
    cursor: pointer;
}
input[type="file"].image-upFile-input::-webkit-file-upload-button {
    visibility: hidden;
    color: transparent;
}
input[type="file"].image-upFile-input::file-selector-button {
    visibility: hidden;
    color: transparent;
}
input[type="file"].image-upFile-input::-webkit-file-upload-button {
    visibility: hidden;
    color: transparent;
}
/* ========== Button Styles ========== */
.button-element {
    display: inline-block;
    font-size: var(--button-big-button);
    line-height: 1em;
    font-weight: 700;
    color: var(--black);
    text-align: center;
    padding: 1.1111rem 2.2222rem;
    background: var(--yellow);
    border-radius: 2.7778rem;
    text-decoration: none;
    border: 2px solid var(--yellow);
}
.button-element:hover {
    opacity: 0.85;
}
.button-element.button-outline-green {
    color: var(--green);
    border-color: var(--green) !important;
    background: #fff;
}
.button-element-outline-black {
    color: var(--black);
    border-color: var(--black);
    background: transparent;
}
.button-element-filled-black {
    color: var(--white);
    border-color: var(--black);
    background: var(--black);
}
.button-element-filled-black:hover {
    background-color: #4a4848;
}
.button-element-filled-black:active {
    background: var(--black);
}
.button-element.button-element-filled-green {
    color: #fff;
    background-color: var(--green);
    border-color: var(--green);
}
.button-element.button-element-filled-red {
    color: #fff;
    background-color: var(--red);
    border-color: var(--red);
}
.button-element.button-element-white {
    color: var(--green);
    background-color: #fff;
    border-color: #fff;
}
.button-element[disabled] {
    color: var(--grey__2);
    background-color: var(--grey__4);
    border-color: var(--grey__4) !important;
}
/* ========== icon element Styles ========== */
.icon-element {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 2.2222rem;
    height: 2.2222rem;
    border-radius: 100%;
    background-color: #eee;
}
.icon-element-green {
    background: var(--grean__5);
    border: 2px solid #83c180;
    border-radius: 2.2222rem;
}
/* ========== Tag element Styles ========== */
.tag-element {
    font-weight: 300;
    font-size: var(--text-t2);
    text-align: center;
    color: #ffffff !important;
    padding: 0.5556rem var(--text-t2);
    background: var(--grean__2);
    border-radius: 3.0556rem;
    text-decoration: none;
}
/* ========== Card Styles ========== */
.card-element {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow: hidden;
    padding: 1.2778rem 0px;
    margin-bottom: 1.1111rem;
    background: #ffffff;
    -webkit-box-shadow:
        -3.51562px -3.51562px 3.51562px #ffffff,
        3.51562px 3.51562px 3.51562px #ebebeb;
    box-shadow:
        -3.51562px -3.51562px 3.51562px #ffffff,
        3.51562px 3.51562px 3.51562px #ebebeb;
    border-radius: 1.1667rem;
    text-decoration: none;
}
.card-element__image {
    width: 9.5556rem;
    height: 9.5556rem;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
}
.card-element__image img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
}
.card-element__name {
    font-weight: 700;
    color: var(--black);
    word-break: break-word;
    text-align: center;
    padding-left: 5px;
    padding-right: 5px;
}
.card-element.card-sm {
    min-height: 160px;
}
.card-sm.card-element .card-element__image {
    width: 6.1111rem;
    height: 6.1111rem;
}
.card-sm.card-element .card-element__name {
    font-size: 14px;
}
/* ========== Timer picker Styles ========== */
.time-picker-input__dropdown {
    position: absolute;
    top: 110%;
    left: 0;
    right: 0;
    z-index: 5;
    width: 100%;
    max-height: 15.5556rem;
    visibility: hidden;
    opacity: 0;
    padding: 0.5556rem;
    background: #ffffff;
    -webkit-box-shadow: 0px 14px 34px rgba(0, 0, 0, 0.05);
    box-shadow: 0px 14px 34px rgba(0, 0, 0, 0.05);
    border-radius: 1.1111rem;
    overflow-x: hidden;
    -webkit-transition: all 0.15s ease-in-out;
    -o-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
}
.time-picker-active .time-picker-input__dropdown {
    top: 100%;
    visibility: visible;
    opacity: 1;
}
.time-picker-input__dropdownItem {
    font-weight: 300;
    font-size: var(--text-t1);
    color: var(--black);
    padding: 0.8333rem;
    background: #ffffff;
    border-radius: 0.5556rem;
    cursor: pointer;
}
.time-picker-input__dropdownItem:hover,
.time-picker-input__dropdownItem.selectedTime {
    background-color: var(--grean__5);
}
.time-picker-input.input-element input:not(:-moz-placeholder-shown) {
    border-color: var(--green);
}
.time-picker-input.input-element input:not(:-ms-input-placeholder) {
    border-color: var(--green);
}
.time-picker-input.input-element input:not(:placeholder-shown) {
    border-color: var(--green);
}
/* ========== Dropdown Calendar Styles ========== */
.calendarButton {
    position: relative;
    cursor: pointer;
}
.calendarButton-input {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    font-size: 0;
    border: 0;
    color: transparent;
    background: transparent;
    border-radius: 1.1111rem !important;
    cursor: pointer;
}
/* ========== BS-5 Pagination custom Styles ========== */
.pagination {
    --bs-pagination-color: var(--green) !important;
    --bs-pagination-hover-color: var(--grean__4) !important;
    --bs-pagination-focus-color: var(--grean__4) !important;
    --bs-pagination-active-bg: var(--green) !important;
    --bs-pagination-active-border-color: var(--green) !important;
}
/* ========== BS-5 Dropdown custom Styles ========== */
/* === Dropdown Styles === */
.dropdown-item.active,
.dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: transparent !important;
}
.dropdown-item {
    font-size: var(--text-t2);
}
/* === Tooltips Styles === */
.tooltip .tooltip-inner {
    opacity: 1 !important;
    border-radius: 25px !important;
}
.tooltip .tooltip-arrow:before {
    border-bottom-color: var(--black) !important;
}
.tooltip .tooltip-inner {
    background: var(--black) !important;
}
/* === Slider Styles === */
.swiper-slider {
    position: relative;
}
.swiper {
    position: relative;
    padding-left: 0.15rem !important;
    padding-right: 0.15rem !important;
}
.swiper-slider .swiper-button-prev {
    left: 0;
    -webkit-transform: translateX(-15%);
    -ms-transform: translateX(-15%);
    transform: translateX(-15%);
    -webkit-transition: all 0.15s ease-in-out;
    -o-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
}
.swiper-slider .swiper-button-next {
    right: 0;
    -webkit-transform: translateX(15%);
    -ms-transform: translateX(15%);
    transform: translateX(15%);
    -webkit-transition: all 0.15s ease-in-out;
    -o-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
}

.swiper-slider .swiper-button-prev,
.swiper-slider .swiper-button-next {
    padding: 0.5556rem;
    width: 2.2222rem !important;
    height: 2.2222rem !important;
    opacity: 1 !important;
    background-color: #fff;
    border: 2px solid #cccccc;
    border-radius: 2.2222rem;
}
.swiper-slider .swiper-button-prev:after,
.swiper-slider .swiper-button-next:after {
    display: none !important;
}
.swiper-slider .swiper-button-prev:hover,
.swiper-slider .swiper-button-next:hover {
    border-color: var(--green);
}
.swiper-slider .swiper-button-prev:hover svg path,
.swiper-slider .swiper-button-next:hover svg path {
    fill: var(--green);
}
.swiper-slider .swiper-pagination {
    position: relative;
    margin-top: 1rem;
}
.swiper-slider .swiper-pagination > *.swiper-pagination-bullet-active {
    width: 40px !important;
    height: 8px;
    border-radius: 40px !important;
    background-color: var(--green);
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.swiper-slider .swiper-pagination > * {
    width: 8px;
    height: 8px;
    border-radius: 100%;
    border: 0;
    padding: 0;
    background-color: var(--grean__4);
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    opacity: 1 !important;
}
/* === Tabs Styles === */
.nav.nav-pills {
    padding: 0.2778rem 0.3333rem;
    border-bottom: 1px solid var(--grey__4);
    overflow: hidden;
}
.pill-radius {
    border-radius: 1.1111rem !important;
}
.nav-pills .nav-link.form-button {
    padding: 0.5556rem 1.6333rem;
    font-size: var(--caption-1);
    color: var(--green);
    font-weight: 700;
}
.nav-pills .nav-item .nav-link.form-button {
  border-radius: 0;
}
.nav-pills .nav-link.form-button.active {
    background-color: var(--green);
}
/* === Select Styles === */
.form-select {
    line-height: 1.75;
}
.form-select-t1,
.form-select-t2 {
    padding: 18px 15px;
    background: #ffffff;
    border: 1px solid var(--grey__4);
    border-radius: 2.6667rem !important;
}
.form-select-t2,
.form-select-t3 {
    font-size: 0.8333rem !important;
    font-weight: 300 !important;
    color: #ccc !important;
    -webkit-box-shadow: inset 0px 2px 7px rgba(0, 0, 0, 0.08);
    box-shadow: inset 0px 2px 7px rgba(0, 0, 0, 0.08);
    border-radius: 2.6667rem !important;
    padding: 0.75rem 1rem !important;
}
.form-select-t2.option-is-selected,
.form-select-t3.option-is-selected {
    color: #000 !important;
}
.form-select-t2 option:not(:first-child),
.form-select-t3 option:not(:first-child) {
    color: #000;
}
.form-select-t1 {
    font-size: 0.7778rem !important;
    font-weight: 700 !important;
    color: #000 !important;
    -webkit-box-shadow: inset 0px 2px 10px rgba(0, 0, 0, 0.15);
    box-shadow: inset 0px 2px 10px rgba(0, 0, 0, 0.15);
    background-image: url("data:image/svg+xml,%3Csvg width='15' height='9' viewBox='0 0 15 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.2364 0.852904C14.1891 0.740849 14.0794 0.667969 13.9576 0.667969L0.636281 0.668117C0.514616 0.668117 0.404778 0.740997 0.357325 0.853052C0.310019 0.965107 0.334411 1.09475 0.419266 1.18197L7.0799 8.03257C7.13682 8.09111 7.21517 8.12423 7.29692 8.12423C7.37867 8.12423 7.45702 8.09111 7.51393 8.03257L14.1746 1.18183C14.2594 1.09446 14.2837 0.96496 14.2364 0.852904Z' fill='%235AAC56'/%3E%3C/svg%3E%0A") !important;
}
.form-select-t2 {
    background-image: url("data:image/svg+xml,%3Csvg width='9' height='17' viewBox='0 0 9 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.221922 0.0275001C0.0874556 0.0842667 -7.21021e-07 0.215895 -7.14632e-07 0.36207L0.00017738 16.3476C0.000177387 16.4936 0.0876337 16.6254 0.2221 16.6823C0.356566 16.7391 0.512143 16.7098 0.616807 16.608L8.83752 8.61525C8.90777 8.54695 8.94751 8.45293 8.94751 8.35483C8.94751 8.25673 8.90777 8.16271 8.83752 8.09441L0.616628 0.101652C0.511787 -0.000173591 0.356388 -0.0292664 0.221922 0.0275001Z' fill='%23CCCCCC'/%3E%3C/svg%3E%0A") !important;
    background-size: 17px 17px !important;
}
.form-select-t3 {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.0001 0.601562C5.71305 0.601562 0.600092 5.71452 0.600098 12.0016C0.600101 18.2886 5.71306 23.4016 12.0001 23.4016C18.2871 23.4016 23.4001 18.2886 23.4001 12.0016C23.4001 5.71452 18.2871 0.601562 12.0001 0.601562ZM12.0001 5.92156C12.8422 5.92156 13.5201 6.59948 13.5201 7.44156V10.4816H16.5601C17.4022 10.4816 18.0801 11.1595 18.0801 12.0016C18.0801 12.8436 17.4022 13.5216 16.5601 13.5216H13.5201V16.5616C13.5201 17.4036 12.8422 18.0816 12.0001 18.0816C11.158 18.0816 10.4801 17.4036 10.4801 16.5616V13.5216H7.4401C6.59802 13.5216 5.9201 12.8436 5.9201 12.0016C5.9201 11.1595 6.59802 10.4816 7.4401 10.4816H10.4801V7.44156C10.4801 6.59948 11.158 5.92156 12.0001 5.92156Z' fill='%23CCCCCC'/%3E%3C/svg%3E%0A") !important;
    background-size: 23px 23px !important;
}
.gray-select {
    font-size: var(--text-t1) !important;
    background-color: var(--grey__5) !important;
}
/* === Radio Styles === */
.form-radio-buttons {
    padding: 0.2778rem 0.3333rem;
    border-radius: 2.7778rem;
    background-color: var(--grean__5);
}
.form-radio-buttons .form-radio-button + .btn {
    padding: 0.5556rem 1.6333rem;
    border-radius: 2.4444rem;
    font-size: var(--button-big-button);
    line-height: 1.15em;
    color: var(--green);
    font-weight: 700;
    background-color: var(--grean__5);
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.form-radio-buttons .form-radio-button:checked + .btn {
    color: #fff;
    background-color: var(--green);
}
/* === Radio Styles (1) === */
.form-check.form-switch {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-left: 0;
}
.form-check.form-switch .form-check-input {
    background-color: var(--grean__4) !important;
    border-color: var(--grean__4) !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-3 -3 6 6'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e") !important;
    cursor: pointer;
    -webkit-box-shadow: 0px 0px 0px 3px #f2f2f2 !important;
    box-shadow: 0px 0px 0px 3px #f2f2f2 !important;
}
.form-check.form-switch .form-check-input:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-3 -3 6 6 '%3e%3ccircle r='3' fill='%235aac56'/%3e%3c/svg%3e") !important;
}
.form-check.form-switch .form-check-label {
    font-size: var(--text-t1);
    color: var(--green);
    font-weight: 700;
    margin-left: 0 !important;
}
/* === Radio Styles (2) === */
.form-radio-buttons-t2 {
    padding: 0.2778rem 0;
    /* 0.3333rem */
    border-radius: 2.7778rem;
}
.form-radio-buttons-t2 .form-radio-button + .btn {
    padding: 0.8333rem 1.9444rem;
    background: #ffffff;
    border: 2px solid var(--grey__4);
    border-radius: 2.4444rem;
    font-size: var(--button-big-button);
    line-height: 1.15em;
    color: var(--black);
    font-weight: 700;
    background-color: #fff;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.form-radio-buttons-green .form-radio-button + .btn {
    color: var(--green);
}
.form-radio-buttons-t2 .form-radio-button:checked + .btn {
    color: #fff;
    background-color: var(--green);
    border-color: var(--green);
}
.icon-radio img {
    width: 1.1111rem;
    height: 1.1111rem;
    -o-object-fit: contain;
    object-fit: contain;
}
/* === Radio Styles (3) === */
.form-radio-item {
    display: block;
    max-width: 100%;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
.form-radio-item:first-of-type,
.form-radio-item:not(:last-of-type) {
    border-bottom: 1px solid var(--grey__3);
}
.form-radio-item .btn-check-option {
    position: relative;
    display: block;
    padding: 0.6667rem;
    width: 2.2222rem;
    height: 2.2222rem;
    background: var(--grey__5);
    -webkit-box-shadow: inset 0px 3px 5px rgba(0, 0, 0, 0.15);
    box-shadow: inset 0px 3px 5px rgba(0, 0, 0, 0.15);
    border-radius: 3.1111rem;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}
.form-radio-item label {
    font-weight: 700;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.form-radio-item label:hover {
    background-color: rgba(0, 0, 0, 0.03);
}
.form-radio-item label .btn-check-option:after {
    -webkit-transform: scale(0.5);
    -ms-transform: scale(0.5);
    transform: scale(0.5);
    -webkit-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
}
.form-radio-item input:checked ~ label .btn-check-option:after {
    content: "";
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 80%;
    height: 80%;
    border-radius: 100%;
    background:
        url("data:image/svg+xml,%3Csvg width='12' height='11' viewBox='0 0 12 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.60927 10.4105C4.37427 10.4105 4.15146 10.3046 4.00271 10.1218L0.553647 5.87491C0.281772 5.53991 0.332709 5.04804 0.667709 4.77585C1.00271 4.50397 1.49458 4.55491 1.76677 4.88991L4.58677 8.36241L10.2161 0.89991C10.4761 0.555535 10.9658 0.486785 11.3102 0.746785C11.6546 1.00679 11.7233 1.49647 11.4633 1.84085L5.23302 10.0999C5.08833 10.2918 4.86333 10.4062 4.62333 10.4105C4.61865 10.4105 4.61396 10.4105 4.60927 10.4105Z' fill='black'/%3E%3C/svg%3E%0A")
            center no-repeat,
        var(--yellow);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}
/* === Checkboxes === */
.form-radio-item input[type="checkbox"] ~ label .btn-check-option {
    border-radius: 6px;
}
.form-radio-item
    input[type="checkbox"]:checked
    ~ label
    .btn-check-option:after {
    width: 100%;
    height: 100%;
    border-radius: 6px;
}
/* === Form radio \w icon === */
.gray-small-text {
    display: block;
    font-weight: 300;
    font-size: var(--text-t2);
    color: var(--grey__2);
}
/* === Radio services Styles === */
.form-radio-item.form-serivce-radio {
    border-bottom: 0 !important;
}
.form-radio-item.form-serivce-radio label {
    font-size: var(--h5);
    color: #000;
    padding: 0.5556rem 0.8333rem;
    background: #ffffff;
    border: 1px solid var(--grey__4);
    border-radius: 0.6667rem;
}
.form-radio-item.form-serivce-radio .btn-check-option {
    width: 1.7778rem;
    height: 1.7778rem;
}
.form-radio-item.form-serivce-radio input:checked ~ label {
    background-color: var(--grean__4);
}
.form-radio-item.form-serivce-radio .btn-check-option,
.form-radio-item.form-serivce-radio
    input:checked
    ~ label
    .btn-check-option:after {
    border-radius: 6px;
}
.form-radio-item.form-serivce-radio
    input:checked
    ~ label
    .btn-check-option:after {
    width: 100%;
    height: 100%;
}
.form-serivce-radio__price {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 1em;
    padding: 0.8333rem;
    font-size: var(--text-t1);
    font-weight: 300;
    color: var(--grey__3);
    background: var(--grey__5);
    margin-left: auto;
    margin-right: 1.5rem;
    -webkit-box-shadow: inset 0px 2px 10px rgba(0, 0, 0, 0.12);
    box-shadow: inset 0px 2px 10px rgba(0, 0, 0, 0.12);
    border-radius: 2.7778rem;
}
.form-serivce-radio__price:before {
    content: "";
    width: 1.15rem;
    height: 1.15rem;
    margin-right: 0.3444rem;
    display: inline-block;
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.0002 19.1654C15.0627 19.1654 19.1668 15.0613 19.1668 9.9987C19.1668 4.93609 15.0627 0.832031 10.0002 0.832031C4.93755 0.832031 0.833496 4.93609 0.833496 9.9987C0.833496 15.0613 4.93755 19.1654 10.0002 19.1654ZM10.8335 4.9987C10.8335 4.53846 10.4604 4.16536 10.0002 4.16536C9.53991 4.16536 9.16683 4.53846 9.16683 4.9987V5.48663C7.9908 5.75867 7.0835 6.78055 7.0835 8.04936C7.0835 9.3122 7.99591 10.3668 9.22041 10.6239L10.3807 10.8676C10.9114 10.9791 11.2502 11.4167 11.2502 11.8788C11.2502 12.4195 10.7836 12.9154 10.1357 12.9154H10.0002C9.39508 12.9154 8.91808 12.5203 8.78733 12.0329C8.66816 11.5884 8.2112 11.3246 7.76666 11.4438C7.32213 11.5629 7.05837 12.0199 7.17755 12.4645C7.4378 13.4352 8.20384 14.1857 9.16683 14.4644V14.9987C9.16683 15.4589 9.53991 15.832 10.0002 15.832C10.4604 15.832 10.8335 15.4589 10.8335 14.9987V14.4955C12.0142 14.1974 12.9168 13.1604 12.9168 11.8788C12.9168 10.5834 11.9808 9.50061 10.7232 9.23653L9.56291 8.99286C9.06525 8.88836 8.75016 8.47886 8.75016 8.04936C8.75016 7.54686 9.18441 7.08203 9.7925 7.08203H10.0002C10.6052 7.08203 11.0822 7.4771 11.213 7.9645C11.3322 8.40903 11.7892 8.67278 12.2337 8.55361C12.6782 8.43445 12.9419 7.97743 12.8227 7.5329C12.5625 6.5622 11.7965 5.81173 10.8335 5.53303V4.9987Z' fill='%23CCCCCC'/%3E%3C/svg%3E%0A");
    background-size: contain;
}
.form-radio-item.form-serivce-radio
    input:checked
    ~ label
    .form-serivce-radio__price {
    background: #ffffff;
    color: var(--black);
    -webkit-box-shadow: none;
    box-shadow: none;
}
.form-radio-item.form-serivce-radio
    input:checked
    ~ label
    .form-serivce-radio__price:before {
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.0002 19.1654C15.0627 19.1654 19.1668 15.0613 19.1668 9.9987C19.1668 4.93609 15.0627 0.832031 10.0002 0.832031C4.93755 0.832031 0.833496 4.93609 0.833496 9.9987C0.833496 15.0613 4.93755 19.1654 10.0002 19.1654ZM10.8335 4.9987C10.8335 4.53846 10.4604 4.16536 10.0002 4.16536C9.53991 4.16536 9.16683 4.53846 9.16683 4.9987V5.48663C7.9908 5.75867 7.0835 6.78055 7.0835 8.04936C7.0835 9.3122 7.99591 10.3668 9.22041 10.6239L10.3807 10.8676C10.9114 10.9791 11.2502 11.4167 11.2502 11.8788C11.2502 12.4195 10.7836 12.9154 10.1357 12.9154H10.0002C9.39508 12.9154 8.91808 12.5203 8.78733 12.0329C8.66816 11.5884 8.2112 11.3246 7.76666 11.4438C7.32213 11.5629 7.05837 12.0199 7.17755 12.4645C7.4378 13.4352 8.20384 14.1857 9.16683 14.4644V14.9987C9.16683 15.4589 9.53991 15.832 10.0002 15.832C10.4604 15.832 10.8335 15.4589 10.8335 14.9987V14.4955C12.0142 14.1974 12.9168 13.1604 12.9168 11.8788C12.9168 10.5834 11.9808 9.50061 10.7232 9.23653L9.56291 8.99286C9.06525 8.88836 8.75016 8.47886 8.75016 8.04936C8.75016 7.54686 9.18441 7.08203 9.7925 7.08203H10.0002C10.6052 7.08203 11.0822 7.4771 11.213 7.9645C11.3322 8.40903 11.7892 8.67278 12.2337 8.55361C12.6782 8.43445 12.9419 7.97743 12.8227 7.5329C12.5625 6.5622 11.7965 5.81173 10.8335 5.53303V4.9987Z' fill='%235AAC56'/%3E%3C/svg%3E%0A");
}
/* === Modal Styles === */
.modal-dialog .modal-content {
    border-radius: 1.3889rem;
}
.modal-large.modal .modal-dialog {
    max-width: 49.5778rem !important;
    width: 100%;
}
.modal-ext.modal .modal-dialog {
    max-width: 55.2778rem !important;
    width: 100%;
}
.modal-medium.modal .modal-dialog {
    max-width: 32.2778rem !important;
    width: 100%;
}
.modal-small.modal .modal-dialog {
    max-width: 23.3889rem !important;
    width: 100%;
}
.modal-small.modal .modal-content {
    background-color: var(--grean__5);
    border-radius: 1.1111rem !important;
}
.mw-18 {
    max-width: 18%;
}
.btn-close {
    position: absolute;
    right: 1.3889rem;
    top: 1.3889rem;
    padding: 0 !important;
    opacity: 1 !important;
    background: transparent
        url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23CCCCCC'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e")
        center/1.3em auto no-repeat !important;
}
.modal-title {
    font-weight: 700;
    line-height: 1.25em !important;
    text-align: center;
    color: var(--black);
}
.modal-text {
    font-weight: 300;
    font-size: var(--text-t1);
    color: var(--grey__1);
    text-align: center;
}
.modal-dialog {
    max-width: 35.2778rem !important;
    width: 100% !important;
    margin: 0 auto !important;
}
.modal-header,
.modal-body,
.modal-footer {
    padding: 1.75rem !important;
}
.modal-body {
    padding-bottom: 0.5rem !important;
}
/* === Service Modals Styles === */
.add_service-wrap__Addbtn {
    width: 3.1111rem;
    height: 3.1111rem;
    padding: 0 !important;
}
.added-service-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-weight: 300;
    font-size: var(--text-t1);
    color: var(--green);
    padding: 0.5556rem 0.8333rem;
    border: 1px solid #5aac56;
    border-radius: 2.5rem;
}
.added-service-item__amount {
    font-weight: 700;
}
.added-service-item__removeBtn {
    width: 14px;
    height: 14px;
    background-image: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.02682 14.1496C0.763955 14.1496 0.501089 14.0494 0.300653 13.8489C-0.100218 13.4481 -0.100218 12.7979 0.300653 12.3966L12.397 0.300653C12.7979 -0.100218 13.4481 -0.100218 13.8493 0.300653C14.2502 0.701524 14.2502 1.35171 13.8493 1.75299L1.75258 13.8489C1.55214 14.0494 1.28969 14.1496 1.02682 14.1496Z' fill='%23D14343'/%3E%3Cpath d='M13.1228 14.15C12.8599 14.15 12.597 14.0498 12.3966 13.8493L0.300653 1.75299C-0.100218 1.35212 -0.100218 0.701935 0.300653 0.300653C0.701524 -0.100218 1.35171 -0.100218 1.75299 0.300653L13.8493 12.397C14.2502 12.7979 14.2502 13.4481 13.8493 13.8493C13.6485 14.0498 13.3856 14.15 13.1228 14.15Z' fill='%23D14343'/%3E%3C/svg%3E%0A");
}
.added-service-item__removeBtn:hover {
    opacity: 0.75;
}
.modal-form__closeOffer {
    min-width: 2.7778rem;
    width: 100%;
    padding: 0 !important;
    -ms-flex-negative: 0 !important;
    flex-shrink: 0 !important;
}
/* === Problem Modal Styles === */
.gray-modal {
    background-color: var(--grey__5) !important;
}
.problem-grid {
    display: -ms-grid;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(13.8889rem, 1fr));
    margin-left: -0.8333rem;
    margin-right: -0.8333rem;
}
.problem-grid__column {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-left: 0.8333rem;
    padding-right: 0.8333rem;
}
.problem-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    padding: 1.1111rem 0rem;
    background: #ffffff;
    -webkit-box-shadow:
        -3.51562px -3.51562px 3.51562px #ffffff,
        3.51562px 3.51562px 3.51562px #ebebeb;
    box-shadow:
        -3.51562px -3.51562px 3.51562px #ffffff,
        3.51562px 3.51562px 3.51562px #ebebeb;
    border-radius: 1.1667rem;
    margin-bottom: 1rem;
    cursor: pointer;
    margin-bottom: 1.6666rem;
}
.problem-box:hover {
    opacity: 0.9;
}
.problem-name {
    font-weight: 700;
    font-size: var(--text-t1);
    color: var(--black);
}
.problem-box__image {
    width: 9.5556rem;
    height: 9.5556rem;
}
.problem-box__image img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
}
/* === Request Modal Styles === */
.problem-request-wrapper {
    position: relative;
    padding: 1.1111rem;
    background: var(--grey__5);
    border-radius: 1.1111rem;
}
.problem-request__id {
    font-weight: 300;
    font-size: var(--text-t2);
    color: var(--grey__1);
}
.problem-request__title {
    font-weight: 700;
    font-size: var(--text-t1);
    line-height: 22px;
    color: #000000;
}
.problem-request__time {
    font-weight: 300;
    font-size: var(--caption-1);
    color: var(--grey__2);
}
.problem-request__Icon {
    position: absolute;
    top: -1.9444rem;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 3.8889rem;
    height: 3.8889rem;
    padding: 0.6667rem;
    background: var(--green);
    border-radius: 2.8889rem;
    border: 6px solid #fff;
}
/* === Modal reciept Styles === */
.reciept-box {
    padding: 0.8889rem;
    background: var(--grey__5);
    border-radius: 1.1111rem;
}
.reciept-box__orderID {
    font-weight: 300;
    font-size: var(--text-t2);
    color: var(--grey__1);
}
.reciept-box__heading {
    font-weight: 700;
    font-size: var(--h4);
    color: var(--black);
}
.reciept-box__list {
    border: 0 !important;
}
.reciept-box__list .list-group-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    color: var(--grey__2);
    font-weight: 300;
    padding-left: 0 !important;
    padding-right: 0 !important;
    border-color: var(--grey__2);
    background-color: transparent !important;
}
.reciept-box__list .list-group-item > * {
    font-weight: 700;
}
.reciept-box__total {
    font-size: var(--h4);
    color: var(--black);
    font-weight: 700;
}
/* === Map UI Styles === */
.map-area {
    position: relative;
    border-radius: 40px;
    overflow: hidden;
}
#map {
    height: 318px;
    width: 100%;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.zoomMap {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}
.map-area__toolbar {
    display: none;
    position: absolute;
    right: 1.9444rem;
    top: 1.9444rem;
    z-index: 999;
}
.map-area__zoom {
    z-index: 1;
    padding: 0.5556rem;
    background: #ffffff;
    -webkit-box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.15);
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.15);
    border-radius: 3.8889rem;
}
.map-area__geoButton {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.2698rem;
    width: 4.4444rem;
    height: 4.4444rem;
    background: #ffffff;
    border: 2.85714px solid #5aac56;
    -webkit-box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.15);
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.15);
    border-radius: 4.4444rem;
    cursor: pointer;
}
.map-area__address {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: 1.1111rem;
    z-index: 999;
    max-width: 24.4444rem;
    width: 100%;
    padding: 0.5rem;
    background: #ffffff;
    -webkit-box-shadow: 0px 12px 19px rgba(0, 0, 0, 0.09);
    box-shadow: 0px 12px 19px rgba(0, 0, 0, 0.09);
    border-radius: 4.4444rem;
}
.map-area__address input {
    background: #ffffff;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border: 1px solid var(--grey__4);
}
.map-area__zoom .zoom:last-child:before {
    content: "";
    display: block;
    width: 3.3333rem;
    height: 2px;
    margin: 0 0 1.1111rem;
    background-color: var(--grey__3);
}
.zoom {
    position: relative;
    width: 3.3333rem;
    height: 3.3333rem;
    text-align: center;
    cursor: pointer;
}
.zoom:hover,
.map-area__geoButton:hover > * {
    opacity: 0.8;
}
.map-area__geoButton:active svg,
.zoom:active svg {
    -webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
}
.zoom > * {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}
.map-area.map-area-full {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0 !important;
    right: 0 !important;
    bottom: 0;
    width: 100%;
    height: 100%;
    overflow: initial !important;
}
.map-area.map-area-full .mapbox {
    position: fixed !important;
    left: 0;
    right: 0;
    top: 0;
    max-width: 100vw !important;
    width: 100% !important;
    height: 100vh !important;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}
.map-area.map-area-full .map-area__toolbar {
    position: relative;
    right: initial;
    top: initial;
}
@media (max-width: 767px) {
    .map-area__address {
        position: relative;
        max-width: 100%;
        margin-top: 30px;
        padding-left: 0;
        padding-right: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
}
/* === Offer message Styles === */
.offer-msg {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1.6667rem;
    background: #fff0c2;
    border-radius: 1.1111rem;
    color: var(--black);
}
.offer-msg-sm {
    font-size: var(--caption-1);
    line-height: 1.35em;
}
.offer-msg .offer-msg-timer {
    font-size: var(--h5);
}
/* ========== Footer Styles ========== */
.footer {
    position: relative;
    z-index: 5;
}
.footer-inner {
    padding: 1.6667rem 0;
    border-radius: var(--default-bradius);
    background-color: var(--black);
}
.footer__logo {
    display: block;
    max-width: 10rem;
}
.footer__copyright {
    font-weight: 300;
    font-size: var(--caption-1);
    color: var(--grey__3);
}
.footer__link {
    color: var(--grey__3) !important;
    font-size: var(--caption-1);
    margin-bottom: 5px;
    text-decoration: none !important;
}
.footer__app-link {
    display: inline-block;
    max-width: 11.3889rem;
}
/* ========== Header Styles ========== */
.header {
    position: relative;
    z-index: 10;
    padding: 1.1111rem 0;
}
.header-white {
    background-color: #fff;
}
.header-white .header__navbar.navbar {
    padding-left: 0.9rem;
    padding-right: 0.9rem;
}
.header__logo {
    display: block;
    max-width: 10rem;
}
.header__navbar .nav-link {
    color: var(--black) !important;
    font-weight: 700;
    padding-left: 0.8333rem !important;
    padding-right: 0.8333rem !important;
}
.header__navbar .nav-link:hover,
.header__navbar .nav-link.active {
    color: var(--green) !important;
}
/* ========== User header profile ========== */
.header__profile {
    -webkit-box-flex: 0.9;
    -ms-flex-positive: 0.9;
    flex-grow: 0.9;
}
.header__profile-image {
    position: relative;
    overflow: hidden;
    width: 3.5556rem;
    height: 3.5556rem;
    border-radius: 100%;
}
.header__profile-image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}
.header__profile-toolbar-user-name-rating {
    font-size: var(--h5);
    font-weight: 700;
}
.header__profile-toolbar-user-name {
    width: 6.9444rem;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}
.header__profile-toolbar-user-rating {
    color: var(--yellow);
}
.header__profile-avStatus {
    font-size: var(--h5);
}
.header__profile-avStatus .form-check-input {
    position: relative;
    display: block;
    margin-top: 0;
    margin-left: 0.6rem !important;
}
.header__profile-balance-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    color: var(--black);
    padding: 0.3333rem 1.1111rem;
    background: var(--yellow);
    border-radius: 0.5556rem;
}
.header__profile-balance-name {
    line-height: 1em;
    font-size: var(--caption-1);
}
.header__profile-balance {
    line-height: 1em;
    font-size: var(--h4);
    font-weight: 700;
}
/* ========== Geo Location Styles ========== */
.header__locaction-selector-label {
    color: var(--grey__2);
    font-size: var(--text-t2);
    opacity: 0.7;
}
.header__locaction-selector-dropdown-choosen {
    font-size: var(--text-t1);
    font-weight: 700;
    color: var(--black);
}
.header__locaction-selector-dropdown-choosen:after {
    display: none !important;
}
.header__locaction-selector-dropdown-choosen > * {
    position: relative;
    display: inline-block;
}
.header__locaction-selector-dropdown-choosen > *:after {
    content: "";
    width: 0;
    height: 0;
    display: inline-block;
    vertical-align: middle;
    margin-left: 0.4444rem;
    border-left: 0.4444rem solid transparent;
    border-right: 0.4444rem solid transparent;
    border-top: 0.4444rem solid var(--green);
}
/* ========== Search Styles ========== */
.header__search-form {
    position: relative;
    max-width: 30.5556rem;
    width: 100%;
}
.header__search-form-boxed {
    max-width: 23.0556rem;
}
.header__search-form input,
.header__search-form > *,
.header__search-form > * > * {
    height: 100%;
}
.header__search-form-settings-btn {
    position: absolute;
    right: 0.6667rem;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
}
@media (min-width: 900px) {
    .header:not(.user-header) .header__search-form {
        max-width: 30.5556rem;
    }
}
@media (max-width: 899px) {
    .header:not(.user-header) .header__search-form {
        max-width: 25.5556rem;
    }
}
/* ========== Hero Styles ========== */
.hero-section__intro {
    position: relative;
    overflow: hidden;
    border-radius: 2.2222rem;
    background:
        url(../images/hero/bg-pattern.png) center repeat-y,
        #5aac56;
}
.hero-section__intro-title {
    font-weight: 700;
    color: #ffffff;
}
.hero-section__image {
    width: 37.5rem;
    height: 34rem;
    margin-left: -15%;
}
.hero-section__image img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: bottom center;
    object-position: bottom center;
}
@media (min-width: 1400px) {
    .hero-section .hero-section__container {
        padding-right: 3rem;
        padding-left: 3rem;
    }
}
/* ========== Hero search Styles ========== */
.hero-section__search-form {
    position: relative;
    max-width: 21.3333rem;
    width: 100%;
}
.hero-section__search-form input,
.hero-section__search-form > *,
.hero-section__search-form > * > * {
    height: 100%;
}
.hero-section__search-form input {
    padding-top: 1.35rem;
    padding-bottom: 1.35rem;
}
.hero-section__search-form-settings-btn {
    position: absolute;
    right: 0.6667rem;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
}
.hero-section__search-form-settings-btn svg path {
    fill: var(--grey__3);
}
/* ========== Popular categories Styles ========== */
.popular-categories__grid-row {
    display: -ms-grid;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(12.4444rem, 1fr));
    margin-left: -0.5556rem;
    margin-right: -0.5556rem;
}
.popular-categories__grid-row-column {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-left: 0.5556rem;
    padding-right: 0.5556rem;
}
/* ========== Offer banner Styles ========== */
.offer-section__banner {
    position: relative;
    background-color: #eee;
    padding-left: 5.5556rem;
    border-radius: 2.2222rem;
}
.offer-slider .swiper-slide {
    max-width: 66.6667rem;
}
.offer-section__banner.banner-yellow {
    background-color: var(--yellow);
}
.offer-section__banner.banner-green {
    background-color: var(--green);
}
.offer-section__banner.banner-dark {
    background-color: var(--black);
}
.offer-section__banner-title {
    color: var(--black);
    font-weight: 700;
}
.offer-section__banner-text {
    font-weight: 300;
    font-size: var(--text-t1);
    color: var(--grey__1);
}
.offer-section__banner-content {
    max-width: 27.7778rem;
}
.offer-section__banner-image {
    position: relative;
    width: 35.8333rem;
    height: 28.8889rem;
}
.offer-section__banner-button {
    max-width: 13.6111rem;
    width: 100%;
    font-size: 1.8333rem;
}
.banner-image-bg {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 2.2222rem;
}
.offer-section__banner-image img,
.offer-section__banner-image .banner-image-bg img {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}
.offer-section__banner-image img {
    width: 105%;
    height: 105%;
    top: initial;
    z-index: 2;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: bottom center;
    object-position: bottom center;
}
.offer-section__banner-image .banner-image-bg img {
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}
/* ========== Sign-in box Styles ========== */
.signup-section__box {
    max-width: 32.5rem;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
    padding: 2.7778rem 4.4444rem;
    background: #ffffff;
    border-radius: 1.6667rem;
}
.signup-section__box-heading {
    font-weight: 700;
    text-align: center;
    color: var(--black);
}
.signup-section__box-text {
    font-size: var(--text-t1);
    color: var(--grey__1);
    line-height: 1.55rem;
    text-align: center;
}
.signup-section__signup-form {
    max-width: 15.7556rem;
}
.signup-section__signup-form__sm-auth-wrap {
    margin-top: 1.1111rem;
    margin-bottom: 1.1111rem;
}
.signup-section__signup-form__sm-auth {
    font-weight: 300;
    font-size: var(--text-t1);
}
.signup-section__signup-form__sm-auth-item {
    display: block;
    width: 2.6667rem;
    height: 2.6667rem;
    border-radius: 100%;
}
.signup-section__signup-form__sms-input {
    width: 3.1111rem;
    height: 3.1111rem;
}
.users-sms-number {
    color: var(--green);
}
/* ========== Profile sidebar Styles ========== */
.profile-sidebar {
    background-color: var(--green);
    padding: 1.6667rem 1.1111rem;
    border-radius: 1.1111rem;
}
.profile-sidebar__nav {
    font-size: var(--text-t1);
    font-weight: 700;
    color: #ffffff;
}
.profile-sidebar__nav .nav-link {
    position: relative;
    padding: 1.1111rem;
    color: #ffffff !important;
}
.profile-sidebar__nav .nav-item:not(:last-child) .nav-link {
    border-bottom: 1px solid var(--grean__2);
}
.profile-sidebar__nav .nav-link svg {
    width: 1.3333rem;
    height: 1.1111rem;
}
.profile-sidebar__nav .nav-link.active {
    color: var(--black) !important;
    border-radius: 0.8333rem;
    border-color: transparent;
}
.profile-sidebar__nav .nav-link:hover {
    opacity: 0.9;
}
.profile-sidebar__nav .nav-link.active {
    background-color: var(--yellow);
}
.profile-sidebar__nav .nav-link.active svg path {
    fill: var(--black);
}
.profile-sidebar__nav .logout {
    color: var(--yellow__3) !important;
}
.profile-sidebar__avatar {
    position: relative;
    width: 8.5556rem;
    height: 8.5556rem;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1.7111rem;
    overflow: hidden;
    border-radius: 100%;
}
.profile-sidebar__avatar img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}
.profile-sidebar__user-name-rating {
    color: white;
    font-size: var(--h5);
    font-weight: 700;
}
.profile-sidebar__user-name {
    width: 6.9444rem;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}
.profile-sidebar__user-rating {
    color: var(--yellow);
}
.profile-sidebar__avStatus {
    font-size: var(--h5);
}
.profile-sidebar__avStatus .form-check-input {
    position: relative;
    display: block;
    margin-top: 0;
    margin-left: 0.6rem !important;
}
/* ========== Profile feature box's Styles ========== */
.profile-feature-box {
    position: relative;
    background-color: #eee;
    border-radius: 1.6667rem;
}
.profile-feature-box--yellow {
    background-color: var(--yellow__3);
}
.profile-feature-box--green {
    background-color: var(--grean__2);
}
.profile-feature-box__content {
    padding: 1.1111rem;
}
.profile-feature-box__title {
    font-size: var(--h4);
    font-weight: 700;
    color: var(--black);
}
.profile-feature-box__text {
    font-size: var(--text-t1);
    line-height: 1.55rem;
    color: var(--grey__1);
}
.profile-feature-box__image {
    width: 10rem;
    height: auto;
    margin-top: -1.4rem;
    margin-right: 0.45rem;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}
.profile-feature-box__image img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: bottom;
    object-position: bottom;
}
/* ========== Profile setting button Styles ========== */
.setting__button {
    padding: 1.1111rem;
    background: var(--grean__5);
    border-color: var(--grean__5);
    -webkit-box-shadow:
        -2px -2px 2px #ffffff,
        2px 2px 2px #ebebeb;
    box-shadow:
        -2px -2px 2px #ffffff,
        2px 2px 2px #ebebeb;
    border-radius: 0.8333rem;
}
.setting__button-icon {
    width: 2.1111rem;
    height: 2.1111rem;
}
.setting__button-icon img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
}
.setting__button-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: 700;
    font-size: var(--h5);
    color: var(--black-2);
}
.setting__button-text {
    font-weight: 300;
    font-size: var(--text-t2);
    color: var(--grey__1);
}
.setting-button-active {
    background-color: var(--grean__3);
    border-right: 3px solid var(--green);
}
/* ========== Profile stat box's Styles ========== */
.profile__stat-box {
    padding: 0.8333rem 0.5556rem;
    border-radius: 0.6667rem;
    background-color: var(--grey__4);
}
.stat-box-green {
    background-color: var(--grean__4);
}
.stat-box-yellow {
    background-color: var(--yellow__4);
}
.profile__stat-box-numbers {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: var(--h4);
    color: var(--black);
    font-weight: 700;
}
.profile__stat-box-name {
    font-size: var(--text-t2);
    color: var(--black);
    text-align: center;
}
/* ========== categories Styles ========== */
.categories__grid-row {
    display: -ms-grid;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    margin-left: -0.5556rem;
    margin-right: -0.5556rem;
}
.categories__grid-row-column {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-left: 0.5556rem;
    padding-right: 0.5556rem;
    height: auto;
}
.category__card-element-radio {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    cursor: pointer;
}
.category__card-element-check {
    position: absolute;
    right: 10px;
    top: 10px;
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    font-size: calc(0.6111rem + 2px);
    font-weight: 700;
    color: var(--black);
    border-radius: 100%;
    background-color: var(--yellow);
}
.category__card-element-check {
    -webkit-transition: all 0.075s linear;
    -o-transition: all 0.075s linear;
    transition: all 0.075s linear;
    background-position: center;
    background-repeat: no-repeat;
}
.category__card-element-check:empty {
    width: 30px !important;
    height: 30px !important;
    border-width: 3px !important;
}
.category__card-element input {
    display: none;
    visibility: hidden;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
}
.category__card-element label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}
.category__card-element input:checked ~ label {
    background-color: var(--grean__4);
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.category__card-element input:not(:checked) ~ label .card-element-check:empty {
    visibility: hidden;
}
.category__card-element input:checked ~ label .card-element-check {
    width: 2.2222rem;
    height: 2.2222rem;
    color: transparent;
    background-image: url("data:image/svg+xml,%3Csvg width='8' height='8' viewBox='0 0 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.11104 7.14173C2.96082 7.14173 2.81838 7.074 2.72329 6.95714L0.518443 4.24228C0.344644 4.02813 0.377206 3.71369 0.591359 3.53969C0.805511 3.3659 1.11995 3.39846 1.29395 3.61261L3.09666 5.83244L6.69529 1.06196C6.8615 0.841817 7.17454 0.797868 7.39468 0.964076C7.61483 1.13028 7.65878 1.44332 7.49257 1.66347L3.50978 6.94316C3.41729 7.06581 3.27345 7.13893 3.12003 7.14173C3.11704 7.14173 3.11404 7.14173 3.11104 7.14173Z' fill='%23323232'/%3E%3C/svg%3E%0A");
    border: 5px solid #fff;
    -webkit-box-shadow: 0px 1.91778px 3.1963px rgba(0, 0, 0, 0.15);
    box-shadow: 0px 1.91778px 3.1963px rgba(0, 0, 0, 0.15);
}

/* ========== order Styles ========== */
.order-item {
    position: relative;
    padding: 0.8333rem;
    border-radius: 0.6667rem;
    background: #ffffff;
    border: 1px solid var(--grey__4);
}
.order-item__info {
    max-width: 14rem;
}
.order-item__avatar {
    position: relative;
    overflow: hidden;
    width: 5.2222rem;
    height: 5.2222rem;
    border-radius: 100%;
}
.order-item__title {
    font-weight: 700 !important;
    color: var(--black);
    font-size: var(--text-t1);
}
.order-item__tag-item {
    display: inline-block;
    font-weight: 300;
    font-size: var(--caption-1);
    line-height: 1.25em;
    color: var(--green);
    text-align: center;
    padding: 0.2778rem 0.4444rem;
    background: #ffffff;
    border: 0.5px solid #5aac56;
    border-radius: 3.0556rem;
}
.order-item__name {
    font-size: var(--text-t1);
    color: var(--grey__1);
}
.order-item__rating {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: var(--text-t1);
    font-weight: 700;
    color: var(--yellow);
}
.order-item__rating svg {
    width: 1.3333rem;
    height: 1.3333rem;
}

.order-item__appointment-icon {
    display: block;
    width: 26px;
    height: 26px;
}
.appointment-info__item:first-child {
    font-weight: 700;
    font-size: var(--text-t2);
    color: var(--black);
}
.appointment-info__item:not(:first-child) {
    font-size: var(--caption-1);
    color: var(--grey__2);
}
.orderInfoEdit__button {
    width: 2.2222rem;
    height: 2.2222rem;
    padding: 0 !important;
}
.order-item__address {
    line-height: 1.25rem;
}
.order-item__messageId {
    font-weight: 300;
    font-size: var(--text-t2);
    line-height: 1em;
    color: var(--grey__1);
}
.order-item__orderTime {
    font-weight: 300;
    font-size: var(--caption-1);
    color: var(--grey__2);
    text-align: right;
}
.order-item__status {
    width: 11.1111rem;
}
.order-item__status-count {
    width: 25px;
    height: 25px;
    line-height: 25px;
    font-size: var(--caption-1);
    text-align: center;
    font-weight: 700;
    color: var(--black);
    border-radius: 100%;
    background-color: var(--yellow);
}
.order-item__status-count .order-item {
    position: absolute;
    right: 0.8333rem;
    top: 0.8333rem;
}
.order-item__status-type {
    padding: 4px 5px;
    font-size: var(--caption-1);
    background: var(--green);
    border-radius: 1.1111rem;
    color: #fff;
    font-weight: 700;
    text-align: center;
}
.order-item__price {
    font-weight: 700;
    font-size: var(--h3);
    line-height: 1em;
    color: var(--green);
    text-align: right;
}
.order-item__calendarBlock-date {
    font-style: normal;
    font-weight: 700;
    font-size: var(--h4);
    color: var(--black);
}
/* ========== Progress bar Styles ========== */
.sidebar__progress-bar {
    padding: 0.5556rem;
    background: #ffffff;
    -webkit-box-shadow: inset 0px 4px 14px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0px 4px 14px rgba(0, 0, 0, 0.1);
    border-radius: 1.6667rem;
}
.sidebar__progress-bar-step {
    width: 25%;
    height: 0.8333rem;
    background-color: var(--yellow);
    -webkit-box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.1);
    border-radius: 1.6667rem;
}
.step-active {
    background-color: var(--yellow);
}
.step-active ~ .sidebar__progress-bar-step {
    background-color: #ffffff;
}
.sidebar__progress-bar-step:not(:last-child) {
    margin-right: 0.5556rem;
}
.sidebar__progress-barSteps {
    font-size: var(--caption-1);
    font-weight: 700;
    color: #fff;
}
/* ========== Profile verification icon Styles ========== */
.profile-verification-sidebar {
    padding: 1.1111rem;
    background: var(--green);
    -webkit-box-shadow: 0px 12px 19px rgba(0, 0, 0, 0.09);
    box-shadow: 0px 12px 19px rgba(0, 0, 0, 0.09);
    border-radius: 1.1111rem;
}
.profile-verification__icon {
    position: relative;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 6.6667rem;
    height: 6.6667rem;
    background: var(--yellow);
    -webkit-box-shadow: inset 0px 4px 34px rgba(0, 0, 0, 0.45);
    box-shadow: inset 0px 4px 34px rgba(0, 0, 0, 0.45);
    border-radius: 13.8889rem;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 16px;
}
.profile-verification__icon img {
    width: 70%;
    height: 70%;
    -o-object-fit: contain;
    object-fit: contain;
}
.profile-verification-sidebar__stepList {
    font-weight: 700;
    font-size: var(--text-t2);
    color: #fff;
    list-style: decimal;
}
.stepListItem-active {
    color: var(--yellow);
}
.stepListItem-active ~ .profile-verification-sidebar__stepListItem {
    color: var(--grean__2);
}
.profile-verification-sidebar__stepListItem {
    margin-bottom: 0.2556rem;
}

/* ========== Profile verification managment ========== */
.verifcation-manage-status {
    padding: 0.2778rem 0.3333rem;
    background: #ffffff;
    border-radius: 2.7778rem;
}
.verifcation-manage-status .button-element {
    background-color: transparent;
    border: 0;
}
.vm-status-button__accept {
    color: var(--green);
}
.vm-status-button__accept:hover {
    color: white;
    background-color: var(--green);
}
.vm-status-button__reject:hover {
    color: white;
    background-color: var(--black);
}

.verification_image {
    position: relative;
    overflow: hidden;
    border-radius: 1.1111rem;
    height: 10.6667rem;
}

.verification_image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}

/* ========== Profile verification form Styles ========== */
.profile-verification__stepsWrapper {
    max-width: 22.2222rem;
}
.progress-bar.proggres-bar-lightGreen {
    font-weight: 700;
    background-color: #45c265;
    border-radius: 2.7778rem;
}
.profile-verification__progress .progress {
    background: var(--grey__4);
    border-radius: 2.2222rem;
}
.profile-verification__progress {
    padding: 0.5556rem;
    background: #ffffff;
    -webkit-box-shadow: inset 0px 2px 4px rgba(0, 0, 0, 0.15);
    box-shadow: inset 0px 2px 4px rgba(0, 0, 0, 0.15);
    border-radius: 2.7778rem;
}
.profile-verification__userPhoto {
    position: relative;
    width: 6.6667rem;
    height: 6.6667rem;
    border-radius: 6px;
}
.profile-verification__userPhoto-remove {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 4px;
    z-index: 1;
    margin-left: auto;
    margin-right: auto;
    width: 1.3333rem;
    height: 1.3333rem;
    background:
        url("data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 10 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.0178 9.76509C0.842555 9.76509 0.667311 9.69828 0.533687 9.56465C0.26644 9.29741 0.26644 8.86395 0.533687 8.59643L8.59793 0.532467C8.86517 0.265219 9.29863 0.265219 9.56615 0.532467C9.8334 0.799714 9.8334 1.23317 9.56615 1.50069L1.50164 9.56465C1.36801 9.69828 1.19304 9.76509 1.0178 9.76509Z' fill='white'/%3E%3Cpath d='M9.08176 9.76536C8.90652 9.76536 8.73128 9.69855 8.59765 9.56493L0.533687 1.50069C0.26644 1.23344 0.26644 0.799988 0.533687 0.532467C0.800935 0.265219 1.23439 0.265219 1.50191 0.532467L9.56615 8.59671C9.8334 8.86395 9.8334 9.29741 9.56615 9.56493C9.43225 9.69855 9.25701 9.76536 9.08176 9.76536Z' fill='white'/%3E%3C/svg%3E")
            center no-repeat,
        var(--red);
    border-radius: 3.1111rem;
    -webkit-transition: -webkit-transform 0.1s linear;
    transition: -webkit-transform 0.1s linear;
    -o-transition: transform 0.1s linear;
    transition: transform 0.1s linear;
    transition:
        transform 0.1s linear,
        -webkit-transform 0.1s linear;
}
.profile-verification__userPhoto-remove:hover {
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}
.profile-verification__userPhoto img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}
.profile-verification__userPhoto input {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1;
    font-size: 0;
    cursor: pointer;
}
.profile-verification__userPhoto
    input[type="file"]::-webkit-file-upload-button {
    visibility: hidden;
    color: transparent;
}
.profile-verification__userPhoto
    input[type="file"]::-webkit-file-upload-button {
    visibility: hidden;
    color: transparent;
}
.profile-verification__userPhoto input[type="file"]::file-selector-button {
    visibility: hidden;
    color: transparent;
}
.profile-verification__userPhoto
    input[type="file"]::-webkit-file-upload-button {
    visibility: hidden;
    color: transparent;
}
/* ========== Profile balance Styles ========== */
.profile-balance__header {
    padding: 1.1111rem;
    background: var(--green);
    border-radius: 1.1111rem;
}
.profile-balance__header-amountBox {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    line-height: 2rem;
    padding: 1.3333rem 0.7778rem;
    background: var(--yellow);
    color: var(--black);
    border-radius: 1.1111rem;
}
.profile-balance__header-amountBox img {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 85px;
    height: 130%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: left bottom;
    object-position: left bottom;
}
.profile-balance__header-amountBalance {
    font-weight: 700;
    font-size: 1.9722rem;
    color: var(--black);
}
.profile-balance__header-button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    padding: 0.6667rem 1.1111rem;
    border: 2px solid #ffffff;
    border-radius: 0.8889rem;
    font-size: 12px;
    line-height: 1em;
    font-weight: 700;
    color: #fff;
}
/* ========== Notifcations Styles ========== */
.alert-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.alert-item {
    padding: 1.1111rem;
    background: #ffffff;
    border: 1px solid var(--grey__4);
    border-radius: 0.6667rem;
}
.alert-item__icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0.4444rem;
    width: 2.7778rem;
    height: 2.7778rem;
    background: var(--green);
    border-radius: 2.8889rem;
}
.alert-item__info {
    font-weight: 300;
    font-size: var(--text-t2);
    color: var(--grey__1);
}
.alert-item__name {
    font-weight: 700;
    font-size: var(--text-t1);
    color: var(--black);
}
.alert-item__timeDate {
    font-weight: 300;
    font-size: var(--caption-1);
    color: var(--grey__2);
}
.alert-item__amount {
    font-weight: 700;
    font-size: var(--text-t1);
    color: var(--green);
    text-align: right;
}
.alert-item:not(.alert-new):hover,
.alert-selected:not(.alert-new) {
    background-color: var(--grean__4);
}
.alert-new {
    background-color: var(--yellow__4);
}
.alert-item__ntfAmount {
    width: 1.6667rem;
    height: 1.6667rem;
    line-height: 1.6667rem;
    font-weight: 700;
    font-size: var(--caption-1);
    background: var(--yellow);
    color: var(--black);
    text-align: center;
    border-radius: 1.1111rem;
}
.alert-item__ntfBadge {
    font-weight: 700;
    font-size: var(--caption-1);
    text-align: center;
    color: #ffffff;
    padding: 0.2222rem 0.5333rem;
    background: var(--green);
    border-radius: 1.1111rem;
}
.c-pointer {
    cursor: pointer;
}
/* ========== Profile analytics Styles ========== */
.profile-analytics__date {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.date-seperator {
    width: 20px;
    height: 1px;
    margin-left: 10px;
    margin-right: 10px;
    background: #cccccc;
}
.profile-analytics__statBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: var(--text-t1);
    color: var(--black);
    line-height: 2em;
    padding: 0.8333rem 0.7778rem;
    background: var(--grean__3);
    border-radius: 0.8333rem;
}
.profile-analytics__statBox-amount {
    font-size: var(--h3);
    font-weight: 700;
}
/* ========== Date picker Styles ========== */
.air-datepicker-global-container {
    z-index: 9999 !important;
}
.air-datepicker {
    font-family: inherit !important;
    overflow: hidden !important;
    background: #ffffff !important;
    font-weight: 700 !important;
    -webkit-box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.05) !important;
    box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.05) !important;
    border-radius: 1.6667rem !important;
    min-width: 250px !important;
    padding: 0.5rem !important;
}
.air-datepicker-nav--title {
    font-size: 1rem;
}
.air-datepicker-nav--title,
.air-datepicker-nav--title i {
    color: var(--black) !important;
}
.air-datepicker-cell.-current-,
.air-datepicker-body--day-name {
    color: var(--green) !important;
}
.air-datepicker-body--cells {
    grid-auto-rows: 37px !important;
}
.air-datepicker-cell.-month-.-current-,
.air-datepicker-cell.-day-.-selected- {
    color: white !important;
    background-color: var(--green) !important;
}
.air-datepicker-nav {
    border-bottom: 0 !important;
}
.air-datepicker-nav--action {
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 65% !important;
}
.air-datepicker-nav--action[data-action="prev"] {
    background-image: url("data:image/svg+xml,%3Csvg width='26' height='20' viewBox='0 0 26 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.4127 11.6724H3.45731C2.53253 11.6724 1.7832 10.9231 1.7832 9.99833C1.7832 9.07355 2.53253 8.32422 3.45731 8.32422H23.4127C24.3374 8.32422 25.0868 9.07355 25.0868 9.99833C25.0868 10.9231 24.3374 11.6724 23.4127 11.6724Z' fill='%235AAC56'/%3E%3Cpath d='M11.124 19.5915C10.7169 19.5915 10.3084 19.4436 9.9863 19.1449L1.44835 11.2264C1.10416 10.907 0.909292 10.4576 0.91264 9.98753C0.915988 9.51811 1.11621 9.07079 1.4651 8.75606L10.2374 0.837532C10.9238 0.218112 11.9825 0.272353 12.6019 0.958737C13.2213 1.64512 13.1671 2.70383 12.4807 3.32325L5.06643 10.0157L12.2631 16.69C12.9408 17.3188 12.9809 18.3782 12.3522 19.0558C12.022 19.4114 11.574 19.5915 11.124 19.5915Z' fill='%235AAC56'/%3E%3C/svg%3E%0A") !important;
}
.air-datepicker-nav--action[data-action="next"] {
    background-image: url("data:image/svg+xml,%3Csvg width='26' height='20' viewBox='0 0 26 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M22.5421 11.6724H2.5867C1.66193 11.6724 0.912598 10.9231 0.912598 9.99833C0.912598 9.07355 1.66193 8.32422 2.5867 8.32422H22.5421C23.4668 8.32422 24.2162 9.07355 24.2162 9.99833C24.2162 10.9231 23.4668 11.6724 22.5421 11.6724Z' fill='%235AAC56'/%3E%3Cpath d='M14.8755 19.5915C14.4262 19.5915 13.9775 19.4114 13.6474 19.0558C13.0186 18.3782 13.0588 17.3188 13.7364 16.69L20.9331 10.0157L13.5188 3.32325C12.8324 2.70383 12.7782 1.64512 13.3976 0.958737C14.017 0.272353 15.0757 0.218112 15.7621 0.837532L24.5344 8.75606C24.8833 9.07079 25.0835 9.51744 25.0869 9.98753C25.0902 10.4576 24.896 10.907 24.5512 11.2264L16.0132 19.1449C15.6911 19.4436 15.2826 19.5915 14.8755 19.5915Z' fill='%235AAC56'/%3E%3C/svg%3E%0A") !important;
}
.air-datepicker-nav--action svg {
    display: none;
}
.default-calendar .air-datepicker {
    max-width: 100%;
    width: 100%;
    padding-top: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    background: transparent !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border: 0 !important;
}
.day-with-dots {
    position: relative;
}
.date-dots {
    position: absolute;
    top: calc(100% - 10px);
    width: 100%;
    font-weight: 700;
    font-size: 1.2rem;
    text-align: center;
    color: var(--green);
}
.-selected- .date-dots {
    color: white;
}

/* ========== Expenses Chart Styles ========== */
.donutChart {
    position: relative;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden;
    width: 100%;
    height: 14.7778rem;
}
.donutChart__legend {
    padding-left: 1em;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}
.donutChart canvas {
    max-width: 14.7778rem;
    width: 100%;
    height: 100% !important;
}
/* ========== Score line chart Styles ========== */
.scoreLineChart canvas {
    width: 100% !important;
    height: 380px !important;
}
/* ========== Score rating Styles ========== */
.scoreChart-wrapper {
    padding: 0.8333rem;
    background: var(--grean__5);
    border-radius: 1.6667rem;
}
.scoreChart-wrapper__rating-content {
    font-size: var(--text-t1);
    color: var(--black);
}
.scoreChart-wrapper__rating-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0.8333rem;
    width: 3.8889rem;
    height: 3.8889rem;
    background: var(--green);
    border-radius: 2.7778rem;
}
/* ========== Profile region Styles ========== */
.region-block {
    padding: 1.1111rem;
    background: #ffffff;
    border: 1px solid var(--grey__4);
    border-radius: 1.1111rem;
}
.region-block__name {
    font-weight: 700;
    font-size: var(--text-t2);
    color: var(--black);
}
/* ========== Order history Styles ========== */
.profile-history-order {
    padding: 1.1111rem;
    background: #ffffff;
    border-radius: 1.1111rem;
    -webkit-box-shadow:
        -3.51562px -3.51562px 3.51562px #ffffff,
        3.51562px 3.51562px 3.51562px #ebebeb;
    box-shadow:
        -3.51562px -3.51562px 3.51562px #ffffff,
        3.51562px 3.51562px 3.51562px #ebebeb;
}
.order-item__gray {
    background-color: var(--grey__5);
}
.profile-history-order__date {
    font-size: var(--text-t1);
    font-weight: 700;
    color: var(--black);
}
/* ========== Chat Styles ========== */
/* === Chat header Styles === */
.chat-wrapper__header {
    padding: 0.5556rem 0.8333rem;
    background: var(--green);
    border-bottom: 2px solid #5aac56;
    border-radius: 1.1111rem 1.1111rem 0rem 0rem;
}
.chat-wrapper__statusPanel-button svg {
    width: 1.3333rem;
    height: 1.3333rem;
}
.chat-wrapper__statusPanel-button.dropend .dropdown-menu {
    min-width: 6.3333rem;
    padding-top: 0;
    padding-bottom: 0;
    overflow: hidden;
    border-radius: 0.5556rem;
}
.chat-wrapper__statusPanel-button.dropend .dropdown-menu > * > * {
    font-size: var(--text-t1);
}
.chat-wrapper__statusPanel-button.dropend
    .dropdown-menu
    > *:not(:last-child)
    .dropdown-item {
    border-bottom: 1px solid var(--grey__4) !important;
}
.chat-wrapper__statusPanel-button.dropend .dropdown-menu > * .dropdown-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0.6rem 1rem;
}
.chat-wrapper__statusPanel-button.dropend
    .dropdown-menu
    > *
    .dropdown-item:active {
    background-color: transparent !important;
}
.dropdown-item-pause {
    color: var(--yellow) !important;
}
.dropdown-item-reject {
    color: var(--red) !important;
}
.chat-wrapper__status-btn {
    font-weight: 700;
    color: var(--black);
    font-size: var(--button-big-button);
    padding: 0.5556rem;
    background: var(--yellow);
    border-radius: 2.7778rem;
}
.chat-wrapper__addnew-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 2.2222rem;
    height: 2.2222rem;
    background-color: var(--grean__2);
    border-radius: 100%;
}
.chat-wrapper-chatHistory__search-form-input.input-element {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.chat-wrapper-chatHistory__search-form-input:not(.--chat-toggled)
    input::-webkit-input-placeholder {
    color: transparent;
}
.chat-wrapper-chatHistory__search-form-input:not(.--chat-toggled)
    input::-moz-placeholder {
    color: transparent;
}
.chat-wrapper-chatHistory__search-form-input:not(.--chat-toggled)
    input:-ms-input-placeholder {
    color: transparent;
}
.chat-wrapper-chatHistory__search-form-input:not(.--chat-toggled)
    input:-moz-placeholder {
    color: transparent;
}
.chat-wrapper-chatHistory__search-form-input.input-element input {
    color: transparent;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}
.chat-wrapper-chatHistory__search-form-input.input-element.--chat-toggled {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-transition: all 0.15s ease-in-out;
    -o-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
}
.chat-wrapper-chatHistory__search-form-input.input-element.--chat-toggled
    input {
    color: var(--black);
}
.chat-wrapper-chatHistory__search-form-input.input-element:not(.--chat-toggled)
    input {
    width: 2.2222rem;
    padding-left: 0 !important;
}
.chat-wrapper-chatHistory__search-form-input.input-element:not(.--chat-toggled)
    .input-element-icon {
    left: 0.6111rem;
}
.chat-wrapper__convoUser-avatar {
    position: relative;
    overflow: hidden;
    width: 2.7778rem;
    height: 2.7778rem;
    background-color: var(--yellow);
    border-radius: 100%;
}
.chat-wrapper__convoUser-name {
    font-weight: 700;
    font-size: var(--text-t2);
    line-height: 22px;
    color: #ffffff;
}
.chat-wrapper__convoUserInfo {
    font-weight: 300;
    font-size: var(--text-t2);
    color: #fff;
}
.chat-wrapper__convoUserInfo > * > * {
    display: inline-block;
    vertical-align: top;
}
.chat-wrapper__convoUserInfo > * {
    display: inline-block;
    vertical-align: baseline;
}
.user-convoRating-points {
    font-weight: 700;
    color: var(--yellow);
}
/* === Chat input Styles === */
.chat-wrapper__inputPanel {
    position: sticky;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0.8333rem;
    background: #ffffff;
    -webkit-box-shadow: 0rem -0.3333rem 0.7778rem rgba(0, 0, 0, 0.05);
    box-shadow: 0rem -0.3333rem 0.7778rem rgba(0, 0, 0, 0.05);
    border-radius: 0rem 0rem 1.1111rem 1.1111rem;
}
.chat-wrapper__inputPanel-emojisBtn {
    position: absolute;
    top: 0;
    left: 1.1111rem;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    width: 1.6667rem;
    height: 1.6667rem;
}

.chat-wrapper__inputPanel .input-element input {
    padding-left: calc(3.5rem + 5px) !important;
    padding-right: 5.5rem;
}
.chat-wrapper__inputPanel-toolbar {
    position: absolute;
    right: 10px;
    top: 0;
    bottom: 0;
}
/* === Chat order item Styles === */
.chat-wrapper__messages {
    height: var(--chatHeight);
    overflow-y: auto;
    padding: 1.1111rem 1.1111rem 3.25rem;
    border-radius: 0 0 1.1111rem 1.1111rem;
    background-color: #fff;
    border-left: 1px solid var(--grey__4);
    border-right: 1px solid var(--grey__4);
}
.chat-wrapper__messages-date {
    font-weight: 300;
    font-size: var(--text-t2);
    color: var(--grey__2);
    text-align: center;
}
.chat-wrapper__messages-order {
    position: relative;
    padding: 0.8333rem;
    background: var(--grey__5);
    border-radius: 1.1111rem;
    margin-top: 2rem;
}
.chat-wrapper__messages-orderIcon {
    position: absolute;
    top: -1.9444rem;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 3.8889rem;
    height: 3.8889rem;
    padding: 0.6667rem;
    background: var(--green);
    border-radius: 2.8889rem;
    border: 6px solid #fff;
}
.chat-wrapper__messages-order-price.order-item__price {
    font-size: var(--h4);
}
.chat-wrapper__messages-order-time {
    font-size: var(--caption-1);
}
.chat-wrapper__messages-order-accept {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}
/* === Workman list item Styles === */
.workman-list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.workman-list-item__avatar {
    position: relative;
    overflow: hidden;
    width: 2.9444rem;
    height: 2.9444rem;
    border-radius: 2.6667rem;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}
.workman-list-item.workman-list-item--mod:not(:last-child) {
    padding-bottom: .5rem;
    margin-bottom: .5rem;
    border-bottom: 1px solid var(--grey__4);
}
/* === Ticket Note list item Styles === */
.ticket-note-list-item {
  display: -webkit-box;
  display: -ms-grid;
  display: grid;
  grid-template-columns: 2.333rem 1fr;
  gap: 0.556rem;
  padding: 0.556rem;
  background-color: var(--white);
  border-radius: 0.556rem;
}
.ticket-note-list-item:not(:last-child) {
  padding-bottom: .5rem;
  margin-bottom: .5rem;
}
.ticket-note-list-item__avatar {
  position: relative;
  overflow: hidden;
  width: 2.333rem;
  height: 2.333rem;
  border-radius: 100%;
  flex-shrink: 0;
}
.ticket-note-list-item__header {
  display: -webkit-box;
  display: -ms-grid;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.556rem;
}
.ticket-note-list-item__delete-btn {
  width: fit-content;
  height: fit-content;
}
.ticket-note-list-item__message {
 grid-column: span 2;
  margin: 0;
}
/* === User order mini box Styles === */
.user-order-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.user-order-item__avatar {
    position: relative;
    overflow: hidden;
    width: 2.9444rem;
    height: 2.9444rem;
    border-radius: 2.6667rem;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}
.--item__avatar-lg {
    width: 4.0556rem;
    height: 4.0556rem;
}
.user-order-item__date,
.user-order-item__orderId {
    font-weight: 300;
    font-size: 0.6111rem;
    text-align: left;
    margin-bottom: 0.1rem;
}
.user-order-item__name {
    font-weight: 700;
    font-size: 0.8889rem;
    color: var(--black);
    text-align: left;
    margin-bottom: 0.1rem;
}
.user-order-item__bottom {
    font-weight: 300;
    font-size: 0.7222rem;
    text-align: left;
}
.user-order-points {
    font-weight: 700;
    color: var(--yellow);
}
.user-order-edit__button {
    width: 2.2222rem;
    height: 2.2222rem;
    padding: 0 !important;
}
/* === File uploader Styles === */
.file-element {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}
.file-element__icon {
    position: relative;
    width: 2.2222rem;
    height: 2.2222rem;
    background:
        url("data:image/svg+xml,%3Csvg width='12' height='14' viewBox='0 0 12 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 3V0.315L11.73 3.5H9.5C9.36739 3.5 9.24021 3.44732 9.14645 3.35355C9.05268 3.25979 9 3.13261 9 3ZM9.5 4.5C9.10218 4.5 8.72064 4.34196 8.43934 4.06066C8.15804 3.77936 8 3.39782 8 3V0H1.5C1.10218 0 0.720644 0.158035 0.43934 0.43934C0.158035 0.720644 0 1.10218 0 1.5V12.5C0 12.8978 0.158035 13.2794 0.43934 13.5607C0.720644 13.842 1.10218 14 1.5 14H10.5C10.8978 14 11.2794 13.842 11.5607 13.5607C11.842 13.2794 12 12.8978 12 12.5V4.5H9.5Z' fill='white'/%3E%3C/svg%3E%0A")
            center no-repeat,
        var(--green);
    border-radius: 1.1111rem;
}
.file-element__infoName {
    width: 7.7222rem;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    font-weight: 700;
    font-size: var(--text-t2);
    color: var(--black);
}
.file-element__infoFileSize {
    font-weight: 300;
    font-size: var(--caption-1);
    color: var(--green);
}
.file-element__infoInput {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1;
    font-size: 0;
    opacity: 0;
    cursor: pointer;
    border: 0;
    background: transparent;
}
.file-element__infoRemove {
    font-weight: 300;
    font-size: var(--caption-1);
    color: var(--red);
}
.file-element__infoRemove:hover {
    opacity: 0.8;
}
.file-element__infoRemove:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 10px;
    height: 10px;
    margin-left: 5px;
    background-image: url("data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 10 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.01804 9.76509C0.842799 9.76509 0.667555 9.69828 0.533931 9.56465C0.266684 9.29741 0.266684 8.86395 0.533931 8.59643L8.59817 0.532467C8.86542 0.265219 9.29887 0.265219 9.56639 0.532467C9.83364 0.799714 9.83364 1.23317 9.56639 1.50069L1.50188 9.56465C1.36826 9.69828 1.19329 9.76509 1.01804 9.76509Z' fill='%23D14343'/%3E%3Cpath d='M9.08201 9.76536C8.90676 9.76536 8.73152 9.69855 8.5979 9.56493L0.533931 1.50069C0.266684 1.23344 0.266684 0.799988 0.533931 0.532467C0.801179 0.265219 1.23463 0.265219 1.50215 0.532467L9.56639 8.59671C9.83364 8.86395 9.83364 9.29741 9.56639 9.56493C9.4325 9.69855 9.25725 9.76536 9.08201 9.76536Z' fill='%23D14343'/%3E%3C/svg%3E%0A");
}
/* === File uploaded element Styles === */
.file-inputImage {
    position: relative;
    display: inline-block;
    width: 3.5556rem;
    height: 3.5556rem;
}
.file-inputImage img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.file-inputImage-remove {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 8px;
    z-index: 1;
    margin-left: auto;
    margin-right: auto;
    width: 1.3333rem;
    height: 1.3333rem;
    background:
        url("data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 10 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.0178 9.76509C0.842555 9.76509 0.667311 9.69828 0.533687 9.56465C0.26644 9.29741 0.26644 8.86395 0.533687 8.59643L8.59793 0.532467C8.86517 0.265219 9.29863 0.265219 9.56615 0.532467C9.8334 0.799714 9.8334 1.23317 9.56615 1.50069L1.50164 9.56465C1.36801 9.69828 1.19304 9.76509 1.0178 9.76509Z' fill='white'%3E%3C/path%3E%3Cpath d='M9.08176 9.76536C8.90652 9.76536 8.73128 9.69855 8.59765 9.56493L0.533687 1.50069C0.26644 1.23344 0.26644 0.799988 0.533687 0.532467C0.800935 0.265219 1.23439 0.265219 1.50191 0.532467L9.56615 8.59671C9.8334 8.86395 9.8334 9.29741 9.56615 9.56493C9.43225 9.69855 9.25701 9.76536 9.08176 9.76536Z' fill='white'%3E%3C/path%3E%3C/svg%3E")
            center no-repeat,
        var(--red);
    border-radius: 3.1111rem;
    -webkit-transition: -webkit-transform 0.1s linear;
    transition: -webkit-transform 0.1s linear;
    -o-transition: transform 0.1s linear;
    transition: transform 0.1s linear;
    transition:
        transform 0.1s linear,
        -webkit-transform 0.1s linear;
}
/* === Chat default message Styles === */
.chat-wrapper__messages-message {
    display: inline-block;
    padding: 0.8333rem;
    background: var(--grey__5);
    border-radius: 0.8333rem;
    color: var(--text-t1);
    font-weight: 300;
    min-width: 18.6667rem;
    margin-right: auto;
}
.chat-wrapper__messages-msgResponse {
    background-color: var(--grean__5);
    margin-right: 0;
    margin-left: auto;
}
.chat-wrapper__messages-msgDate {
    font-weight: 300;
    font-size: 0.6111rem;
    line-height: 1em;
    color: var(--grey__2);
    text-align: right;
    margin-top: -14px;
}
.chat-wrapper__messages-msgDate.msg-sent:after {
    content: "";
    width: 12px;
    height: 6px;
    display: inline-block;
    vertical-align: middle;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='7' viewBox='0 0 12 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.24674 0.674594C8.01395 0.439206 7.63465 0.436236 7.39822 0.667978L2.96322 5.05125L1.03528 3.05536C0.805336 2.8157 0.424656 2.80783 0.185022 3.03778C-0.0546382 3.26772 -0.0625045 3.6484 0.16744 3.88804C0.168482 3.88911 0.169498 3.89017 0.17054 3.89124L2.52125 6.32733C2.63375 6.4421 2.7875 6.50708 2.94821 6.50774H2.95483C3.11249 6.50724 3.26367 6.44483 3.37578 6.33395L8.24132 1.52311C8.47639 1.28999 8.47879 0.910712 8.24674 0.674594Z' fill='%235AAC56'/%3E%3Cpath d='M6.1293 6.32835C6.24151 6.44283 6.39477 6.50776 6.55507 6.50875H6.56168C6.71935 6.50826 6.87053 6.44585 6.98263 6.33497L11.8482 1.52412C12.0687 1.27579 12.0462 0.895709 11.7979 0.675168C11.5728 0.475229 11.2345 0.472599 11.0063 0.668995L6.57309 5.05227L6.41493 4.88809C6.18501 4.64843 5.80433 4.64054 5.56467 4.87049C5.32501 5.10041 5.31712 5.48109 5.54707 5.72075C5.54811 5.72184 5.54915 5.72291 5.55019 5.72398L6.1293 6.32835Z' fill='%235AAC56'/%3E%3C/svg%3E%0A");
}
/* === Chat message file Styles === */
.chat-wrapper__messages-upFile {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.chat-wrapper__messages-upFile:hover {
    opacity: 0.9;
}
.chat-wrapper__messages-upFile-image {
    position: relative;
    overflow: hidden;
    width: 2.2222rem;
    height: 2.2222rem;
    border-radius: 6px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}
.chat-wrapper__messages-upFile-image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}
.chat-wrapper__messages-upFile-name {
    width: 7.7222rem;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    font-weight: 700;
    font-size: var(--text-t1);
    color: var(--black);
}
.chat-wrapper__messages-upFile-fileSize {
    font-weight: 300;
    font-size: var(--text-t2);
    color: var(--green);
}
.chat-wrapper__messages-upFile-uploadText {
    font-weight: 700;
    font-size: var(--text-t2);
    color: var(--green);
}
.chat-wrapper__messages-upFile-input {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1;
    font-size: 0;
    cursor: pointer;
}
input[type="file"].chat-wrapper__messages-upFile-input::-webkit-file-upload-button {
    visibility: hidden;
    color: transparent;
}
input[type="file"].chat-wrapper__messages-upFile-input::file-selector-button {
    visibility: hidden;
    color: transparent;
}
input[type="file"].chat-wrapper__messages-upFile-input::-webkit-file-upload-button {
    visibility: hidden;
    color: transparent;
}
/* === Chat request item Styles === */
.chat-wrapper__messages-request {
    position: relative;
    padding: 0.8333rem;
    background: var(--grean__4);
    border-radius: 1.1111rem;
}
.chat-wrapper__messages-request-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 1.7778rem;
    height: 1.7778rem;
    background: var(--green);
    border-radius: 2.8889rem;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}
.request-item__messageId {
    font-weight: 300;
    font-size: var(--caption-1);
    line-height: 1em;
    color: var(--grey__1);
}
.request-item__title {
    font-weight: 700;
    color: var(--green);
    font-size: var(--text-t1);
}
.chat-wrapper__messages-request-message {
    font-weight: 300;
    font-size: var(--text-t1);
    color: var(--black);
}
.chat-wrapper__messages-msg-time {
    color: var(--grey__2);
    font-size: var(--caption-1);
}
/* === Chat request item (2) Styles === */
.chat-wrapper__messages-request.requestDetailed {
    background: var(--grey__5);
    margin-top: 2rem;
}
.chat-wrapper__messages-request.requestDetailed .request-item__messageId {
    font-size: var(--text-t2);
}
/* ========== Chat sidebar Styles ========== */
.chat-wrapper__sidebar-inner {
    overflow-y: auto;
}
.Heightlg {
    height: var(--chatHeightLg);
}
/* === Chat sidebar item Styles === */
.chat-wrapper__sidebar-convoItem {
    width: 100%;
    padding: 0.5556rem;
    background: #ffffff;
    border-radius: 0.6667rem;
}
.chat-wrapper__sidebar-convoItem:hover,
.convoItem-selected {
    padding: 0.5556rem;
    background: var(--grean__4);
    border-right: 3px solid var(--green);
    border-radius: 0.6667rem;
}
.chat-wrapper__sidebar-convoAvatar {
    position: relative;
    overflow: hidden;
    width: 4.0556rem;
    height: 4.0556rem;
    border-radius: 100%;
    background-color: var(--yellow);
    border-radius: 2.6667rem;
}
.chat-wrapper__sidebar-convoAvatar img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}
.chat-wrapper__sidebar-convoTop,
.chat-wrapper__sidebar-convoBottom {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.chat-wrapper__sidebar-convoTopDetails {
    font-weight: 300;
    font-size: var(--caption-1);
    color: var(--grey__1);
    text-align: left;
}
.chat-wrapper__sidebar-convoStatus {
    padding: 0.2222rem 0.3333rem;
    background: var(--green);
    border-radius: 1.1111rem;
    font-weight: 700;
    font-size: var(--caption-2);
    line-height: 1.25em;
    text-align: center;
    color: #ffffff;
}
.chat-wrapper__sidebar-convoName {
    font-weight: 700;
    font-size: var(--text-t1);
    color: var(--black);
    text-align: left;
}
.chat-wrapper__sidebar-convoBottomDetails {
    font-weight: 300;
    font-size: var(--text-t2);
    color: var(--grey__1);
}
.chat-wrapper__sidebar-convoBottomDetails > * > * {
    display: inline-block;
    vertical-align: top;
}
.chat-wrapper__sidebar-convoBottomDetails > * {
    display: inline-block;
    vertical-align: baseline;
}
.convoRating-points {
    font-weight: 700;
    color: var(--yellow);
}
.chat-wrapper__sidebar-convoPriceAmount {
    font-weight: 700;
    font-size: var(--h4);
    line-height: 1em;
    color: var(--green);
    text-align: right;
}
.favActive svg path,
.chat-wrapper__sidebar-convoFav:hover svg path {
    fill: var(--yellow);
}

/* ========== Chat user Styles ========== */

.chat-wrapper__messages-avatar {
    position: relative;
    overflow: hidden;
    width: 2.2222rem;
    height: 2.2222rem;
    border-radius: 100%;
}

.chat-wrapper__messages-avatar img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

/* ========== Successful message Styles ========== */
.successful-message__box {
    max-width: 20.9444rem;
}
.successful-message__boxImage {
    position: relative;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 15.5556rem;
    height: 15.5556rem;
    background: #ffffff;
    -webkit-box-shadow: inset 0px 4px 34px rgba(0, 0, 0, 0.45);
    box-shadow: inset 0px 4px 34px rgba(0, 0, 0, 0.45);
    border-radius: 13.8889rem;
    margin-bottom: 1.4444rem;
    padding: 1.6111rem;
}
.yellow-circle {
    background-color: var(--yellow);
}
/* ========== map Styles ========== */
.map-settings {
    position: relative;
    z-index: 5;
    max-width: 24.4444rem;
    padding: 1.1111rem;
    background: #ffffff;
    -webkit-box-shadow: 0px 12px 19px rgba(0, 0, 0, 0.09);
    box-shadow: 0px 12px 19px rgba(0, 0, 0, 0.09);
    border-radius: 1.1111rem;
}
/* ========== FAQ Styles ========== */
.faqList-group__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    font-size: var(--text-t1);
    color: var(--black);
    font-weight: 700;
    text-align: left;
    padding: 0.8333rem;
    background: #ffffff;
    -webkit-box-shadow:
        -2px -2px 2px #ffffff,
        2px 2px 2px #ebebeb;
    box-shadow:
        -2px -2px 2px #ffffff,
        2px 2px 2px #ebebeb;
    border-radius: 0.8333rem;
}
.faqList-group__item span {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
.faqList-group__item:after {
    content: "";
    display: block;
    width: 1.6667rem;
    height: 1.6667rem;
    margin-left: 1rem;
    border-radius: 100%;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    background:
        url("data:image/svg+xml,%3Csvg width='12' height='10' viewBox='0 0 12 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.4531 5.78125H1.14062C0.709062 5.78125 0.359375 5.43156 0.359375 5C0.359375 4.56844 0.709062 4.21875 1.14062 4.21875H10.4531C10.8847 4.21875 11.2344 4.56844 11.2344 5C11.2344 5.43156 10.8847 5.78125 10.4531 5.78125Z' fill='white'/%3E%3Cpath d='M6.87531 9.47658C6.66562 9.47658 6.45625 9.39252 6.30219 9.22658C6.00875 8.91033 6.0275 8.41595 6.34375 8.12252L9.70219 5.00783L6.24219 1.8847C5.92187 1.59564 5.89656 1.10158 6.18562 0.781265C6.47469 0.460952 6.96875 0.43564 7.28906 0.724702L11.3828 4.42002C11.5456 4.56689 11.6391 4.77533 11.6406 4.9947C11.6422 5.21408 11.5516 5.42376 11.3906 5.57283L7.40625 9.26814C7.25594 9.40751 7.06531 9.47658 6.87531 9.47658Z' fill='white'/%3E%3C/svg%3E%0A")
            center no-repeat,
        var(--green);
}
.faq-content-box {
    position: relative;
    max-width: 36.8889rem;
    font-size: var(--text-t1);
    line-height: 1.25em;
    padding: 1.1111rem;
    padding-right: 8.1667rem;
    background: #ffffff;
    border-radius: 1.1111rem;
}
.faq-content-box__image {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 9.5rem;
    height: 120%;
    border-radius: 0.5556rem;
}
.faq-content-box__image img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center bottom;
    object-position: center bottom;
}
.faq-content-box:nth-child(even) {
    padding-left: 10.5667rem;
    padding-right: 1.1111rem;
}
.faq-content-box:nth-child(even) .faq-content-box__image {
    width: 8.1667rem;
    right: 0;
    left: 0;
}

/* ========== User page Styles ========== */
.userPage-content-wrapper {
    padding: 1.6667rem;
    background: #ffffff;
    border-radius: 1.6667rem;
}
/* === User page Sidebar Styles === */
.userPage__avatar {
    position: relative;
    overflow: hidden;
    width: 3.5556rem;
    height: 3.5556rem;
    background-color: var(--yellow);
    border-radius: 7.1111rem;
}
.userPage__avatar img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.userPage__name {
    font-weight: 700;
    font-size: 1.3333rem;
    text-align: center;
    color: #ffffff;
    text-align: center;
}
.userPage__rating {
    font-weight: 700;
    font-size: var(--text-t1);
    color: var(--yellow);
    text-align: center;
}
.userPage__statBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    padding: 0.444rem;
    border-radius: 0.6667rem;
    border: 1px solid var(--grey__3);
}
.userPage__statBox-numbers {
    font-size: var(--h4);
    font-weight: 700;
    color: var(--black);
}
.userPage__statBox-name {
    font-weight: 300;
    line-height: 1em;
    font-size: var(--text-t2);
    color: var(--black);
}
/* ========== User Services Styles ========== */
.serviceBox {
    padding: 0.8333rem;
    background: #ffffff;
    border: 1px solid #efefef;
    border-radius: 0.6667rem;
}
.serviceBox__tag {
    display: inline-block;
    font-weight: 700;
    font-size: var(--caption-2);
    text-align: center;
    padding: 0.3333rem 0.4444rem;
    border-radius: 1.1111rem;
    color: var(--grey__1);
    background-color: var(--grean__5);
}
.serviceBox__name {
    font-weight: 700;
    line-height: 1em;
    font-size: var(--text-t2);
    color: var(--black);
}
.serviceBox__price {
    font-weight: 700;
    font-size: var(--text-t2);
    color: var(--green);
}
/* ========== User reviews Styles ========== */
.reviewBox {
    padding: 0.8333rem;
    background: #ffffff;
    border: 1px solid #efefef;
    border-radius: 1.1111rem;
}
.reviewBox__name-rating {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-weight: 700;
    font-size: var(--text-t1);
    color: var(--black);
}
.reviewRating {
    color: var(--yellow);
}
.reviewBox__text {
    color: var(--text-t1);
    color: var(--black);
}
.reviewBox__textResponse {
    padding: 0.8333rem;
    background: var(--yellow__4);
    border-radius: 1.1111rem;
    color: var(--black);
}
.reviewBox__customerName {
    font-weight: 700;
    font-size: var(--text-t1);
    color: var(--black);
}

@media (max-width: 1440px) {
    .reviewBox {
        font-size: 16px;
    }
}

/* ========== Gallery image Styles ========== */

.gallery_image {
    position: relative;
    overflow: hidden;
    display: block;
    padding-top: 75%;
    border-radius: 1.1111rem;
}
.gallery_image img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none;
}
/* ========== Rating Styles ========== */
.ratingWrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    padding-top: 1rem;
}
.ratingWrap .rateBtn {
    display: block;
    width: 2rem;
    height: 2rem;
    line-height: 1em;
    margin-left: 0.65rem;
    margin-right: 0.65rem;
    background: url("data:image/svg+xml,%3Csvg width='36' height='36' viewBox='0 0 36 36' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg filter='url(%23filter0_i_2272_4870)'%3E%3Cpath d='M15.6114 2.22953C16.3374 -0.119665 19.6626 -0.119664 20.3886 2.22953L22.7671 9.92657C23.0908 10.9741 24.0592 11.6885 25.1556 11.6885H33.1093C35.5006 11.6885 36.5272 14.7234 34.6269 16.1751L27.98 21.2529C27.1474 21.8889 26.7998 22.9766 27.1091 23.9776L29.5965 32.0271C30.3151 34.3526 27.6245 36.2294 25.6903 34.7518L19.5177 30.0363C18.6217 29.3518 17.3783 29.3518 16.4823 30.0363L10.3097 34.7518C8.37549 36.2294 5.68487 34.3526 6.4035 32.0271L8.89091 23.9776C9.20023 22.9766 8.85257 21.8889 8.02 21.2529L1.37308 16.1751C-0.527204 14.7234 0.499402 11.6885 2.89074 11.6885H10.8444C11.9408 11.6885 12.9092 10.9741 13.2329 9.92657L15.6114 2.22953Z' fill='%23CCCCCC'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_i_2272_4870' x='0.385742' y='0.467773' width='35.2285' height='39.8086' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset dy='5'/%3E%3CfeGaussianBlur stdDeviation='2.5'/%3E%3CfeComposite in2='hardAlpha' operator='arithmetic' k2='-1' k3='1'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0'/%3E%3CfeBlend mode='normal' in2='shape' result='effect1_innerShadow_2272_4870'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E%0A")
        center no-repeat;
    background-size: contain !important;
    cursor: pointer;
}
.ratingWrap .rateBtn:nth-child(3n) {
    -webkit-transform: scale(1.5);
    -ms-transform: scale(1.5);
    transform: scale(1.5);
}
.ratingWrap input:checked ~ .rateBtn {
    background:
        url("data:image/svg+xml,%3Csvg width='36' height='36' viewBox='0 0 36 36' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg filter='url(%23filter0_i_2272_5809)'%3E%3Cpath d='M15.6114 2.22953C16.3374 -0.119665 19.6626 -0.119664 20.3886 2.22953L22.7671 9.92657C23.0908 10.9741 24.0592 11.6885 25.1556 11.6885H33.1093C35.5006 11.6885 36.5272 14.7234 34.6269 16.1751L27.98 21.2529C27.1474 21.8889 26.7998 22.9766 27.1091 23.9776L29.5965 32.0271C30.3151 34.3526 27.6245 36.2294 25.6903 34.7518L19.5177 30.0363C18.6217 29.3518 17.3783 29.3518 16.4823 30.0363L10.3097 34.7518C8.37549 36.2294 5.68487 34.3526 6.4035 32.0271L8.89091 23.9776C9.20023 22.9766 8.85257 21.8889 8.02 21.2529L1.37308 16.1751C-0.527204 14.7234 0.499402 11.6885 2.89074 11.6885H10.8444C11.9408 11.6885 12.9092 10.9741 13.2329 9.92657L15.6114 2.22953Z' fill='%23FFC40C'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_i_2272_5809' x='0.385742' y='0.467773' width='40.2285' height='39.8086' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset dx='5' dy='5'/%3E%3CfeGaussianBlur stdDeviation='4.375'/%3E%3CfeComposite in2='hardAlpha' operator='arithmetic' k2='-1' k3='1'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.6 0'/%3E%3CfeBlend mode='normal' in2='shape' result='effect1_innerShadow_2272_5809'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E%0A")
            center,
        no-repeat;
}
.ratingWrap input[type="radio"] {
    position: absolute;
    opacity: 0;
    z-index: -999;
}
/* ========== Order settings Styles ========== */
.orderSetting-sidebar {
    padding: 1.1111rem;
    background: #ffffff;
    -webkit-box-shadow: 0px 12px 19px rgba(0, 0, 0, 0.09);
    box-shadow: 0px 12px 19px rgba(0, 0, 0, 0.09);
    border-radius: 1.1111rem;
}
.orderSetting__search-form-settings-btn {
    position: absolute;
    right: 0.6667rem;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
}
.orderSetting__search-form-input input {
    min-height: 70px;
}
/* order confirmation */
.order-confirmation-section {
    padding-bottom: 9rem !important;
}
.order-confirmation-wrap {
    max-width: 32.5rem;
    width: 100%;
}
.order-confirmation-card {
    position: relative;
    padding: 0.8333rem;
    background: #ffffff;
    border-radius: 1.1111rem;
}
.order-confirmation-card__icon {
    position: absolute;
    top: -1.9444rem;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 4.4444rem;
    height: 4.4444rem;
    padding: 0.6667rem;
    background: #fff;
    border-radius: 4.4444rem;
    border: 0.5556rem solid var(--green);
}
/* ========== Help Styles ========== */
.help-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background-color: var(--grey__1);
    padding: 1.6667rem 1.6667rem 0.8333rem;
    border-radius: 1.1111rem;
}
.help-box__name {
    font-size: var(--h4);
    color: var(--black);
    font-weight: 700;
}
.help-box__text {
    color: var(--grey__1);
    font-size: var(--text-t1);
    font-weight: 300;
    white-space: pre-line;
}
/* ========== Settings Styles ========== */
.settings-wrapper {
    padding: 1.6667rem 2.7778rem;
    background: #ffffff;
    border-radius: 1.6667rem;
}
.setting__avatar {
    position: relative;
    width: 8.8889rem;
    height: 8.8889rem;
    border-radius: 100%;
    background-color: #d6ead5;
}
.setting__avatar img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}
.user-setting__button {
    background-color: var(--grean__5);
}
.user-setting__button.setting-button-active {
    background-color: var(--grean__4);
}
.setting__avatar-change {
    position: relative;
    overflow: hidden;
    width: 2.2222rem;
    height: 2.2222rem;
    background: var(--green);
    border-radius: 3.1111rem;
    position: absolute;
    right: 0;
    bottom: 0;
}
.setting__avatar-change input[type="file"] {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}
.setting__avatar-change input[type="file"]::-webkit-file-upload-button {
    visibility: hidden;
    color: transparent;
}
.setting__avatar-change input[type="file"]::file-selector-button {
    visibility: hidden;
    color: transparent;
}
.setting__avatar-change input[type="file"]::-webkit-file-upload-button {
    visibility: hidden;
    color: transparent;
}

/* ========== Buttons Styles ========== */

.button-element {
    opacity: 1 !important;
}

.button-outline-green:hover {
    color: var(--grean__2);
    border-color: var(--grean__2);
    background-color: #fff;
}

.button-outline-green:active {
    color: var(--grean__2);
    border-color: var(--grean__4);
    background-color: var(--grean__4);
}

.button-element[disabled],
.button-element-gray {
    color: var(--grey__3);
    background-color: #fff;
    border-color: var(--grey__3);
}

.button-element[disabled] path,
.button-element-gray svg path {
    fill: #cccccc;
}

.button-element-small {
    padding: 5px 10px;
    font-size: 0.875rem;
}

.button-element-yellow:hover {
    border-color: var(--yellow__2);
    background-color: var(--yellow__2);
}

.button-element-yellow:active {
    border-color: var(--yellow__3);
    background-color: var(--yellow__3);
}

.button-element-filled-green:hover {
    color: #fff;
    border-color: var(--grean__2);
    background-color: var(--grean__2);
}

.button-element-filled-green:active {
    color: #fff;
    border-color: var(--grean__3);
    background-color: var(--grean__3);
}

.button-element-outline-black:hover {
    background-color: var(--grey__3);
    border-color: var(--black);
}

.button-element-outline-black:active {
    background-color: var(--grey__2);
    border-color: var(--black);
}

/* ========== Card Styles ========== */

.card-element:hover {
    background-color: var(--grean__5);
}

/* === Radio Styles === */

/* === Radio Styles (1) === */

.form-switch.form-label-end .form-check-input {
    margin-left: 0 !important;
    margin-right: 0.6rem !important;
}

.form-check.form-switch .form-check-input:not(:checked) {
    background-color: var(--grey__4) !important;
}

.form-switch:not(.form-label-end) .form-check-input {
    position: relative;
    display: block;
    margin-top: 0;
    margin-left: 0.6rem !important;
}

.form-switch.form-label-end .form-check-input {
    margin-top: 0;
    margin-left: 0.6rem !important;
}

/* === Radio Styles (2) === */

.form-radio-buttons-t2 .form-radio-button:checked + .btn {
    background-color: var(--green) !important;
}

.form-radio-buttons-t2 .form-radio-button:not(:checked) + .btn:hover {
    color: var(--green);
    background-color: var(--grean__4);
}

.btn-check:disabled + .btn,
.btn-check[disabled] + .btn {
    opacity: 1 !important;
}

input.form-radio-button[disabled] + label {
    color: #cccccc !important;
}

/* === Radio Styles (3) === */

.form-radio-item.form-serivce-radio .btn {
    text-align: left !important;
}

.form-radio-item.focused-radio input:checked ~ label .btn-check-option:after,
.form-radio-item input:not(:checked) ~ label:hover .btn-check-option:after {
    content: "";
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 80%;
    height: 80%;
    border-radius: 100%;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.form-radio-item.focused-radio
    input[type="radio"]:checked
    ~ label
    .btn-check-option:after,
.form-radio-item
    input[type="radio"]:not(:checked)
    ~ label:hover
    .btn-check-option:after {
    background:
        url("data:image/svg+xml,%3Csvg width='12' height='10' viewBox='0 0 12 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.60927 9.91063C4.37427 9.91063 4.15146 9.80469 4.00271 9.62188L0.553647 5.375C0.281772 5.04 0.332709 4.54813 0.667709 4.27594C1.00271 4.00406 1.49458 4.055 1.76677 4.39L4.58677 7.8625L10.2161 0.400002C10.4761 0.0556267 10.9658 -0.0131233 11.3102 0.246877C11.6546 0.506877 11.7233 0.996564 11.4633 1.34094L5.23302 9.6C5.08833 9.79188 4.86333 9.90625 4.62333 9.91063C4.61865 9.91063 4.61396 9.91063 4.60927 9.91063Z' fill='%23FFC40C'/%3E%3C/svg%3E%0A")
            center no-repeat,
        var(--yellow__4);
}

.form-radio-item.focused-radio
    input[type="checkbox"]:checked
    ~ label
    .btn-check-option:after,
.form-radio-item
    input[type="checkbox"]:not(:checked)
    ~ label:hover
    .btn-check-option:after {
    width: 100%;
    height: 100%;
    border-radius: 6px;
    background:
        url("data:image/svg+xml,%3Csvg width='12' height='10' viewBox='0 0 12 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.60927 9.91063C4.37427 9.91063 4.15146 9.80469 4.00271 9.62188L0.553647 5.375C0.281772 5.04 0.332709 4.54813 0.667709 4.27594C1.00271 4.00406 1.49458 4.055 1.76677 4.39L4.58677 7.8625L10.2161 0.400002C10.4761 0.0556267 10.9658 -0.0131233 11.3102 0.246877C11.6546 0.506877 11.7233 0.996564 11.4633 1.34094L5.23302 9.6C5.08833 9.79188 4.86333 9.90625 4.62333 9.91063C4.61865 9.91063 4.61396 9.91063 4.60927 9.91063Z' fill='%23FFD349'/%3E%3C/svg%3E%0A")
            center no-repeat,
        var(--yellow__4);
}

/* ========== Mobile date picker Styles ========== */

.dateBtn-pick-container {
    position: relative;
    width: 100%;
    overflow-x: auto;
    white-space: nowrap;
}

.dateBtn-pick-container::-webkit-scrollbar {
    display: none;
}

.dateBtn-pick-container {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

.form-radio-date-buttons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.dateBtnTxt {
    font-weight: 700;
    font-size: var(--subheadline);
    color: var(--black);
}

.dateBtnItem {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    max-width: 3rem;
    width: 100%;
    padding: 0.5rem 0.25rem 0.25rem;
    background-color: #ffffff;
    border: 1px solid var(--grey__5);
    border-radius: 2.5rem;
    font-size: var(--caption-1);
    font-weight: 700;
    color: var(--black);
    margin-right: 0.25rem;
}

.dateBtnItem-number {
    position: relative;
    overflow: hidden;
    text-align: center;
    padding: 0.75rem;
    width: 2.5rem;
    height: 2.5rem;
    font-size: var(--text-t1);
    color: var(--black);
    background: var(--grey__5);
    border-radius: 3.125rem;
    margin-top: 0.25rem;
}

.form-radio-date-buttons .btn-check:checked + .dateBtnItem {
    color: white;
    background-color: var(--green);
}

.dateBtnItem:hover {
    color: var(--green);
    background-color: var(--grean__4);
}

.dateBtnItem:hover .dateBtnItem-number {
    color: var(--green);
    background-color: #fff;
}

/* ========== calenadar Styles ========== */

.air-datepicker-cell > span {
    display: block;
    width: 1.875rem;
    height: 1.875rem;
    line-height: 1.875rem;
    text-align: center;
    border-radius: 100% !important;
}

.air-datepicker-cell.-day-.-current- > span {
    background-color: var(--grean__5);
}

.air-datepicker-cell.-day-.-selected- > span {
    color: var(--black) !important;
    background-color: var(--yellow) !important;
}

.air-datepicker-cell.-day-:not(.-selected-):hover > span {
    color: var(--yellow) !important;
    background-color: var(--yellow__4) !important;
}

.air-datepicker-cell.-day-.-weekend-:not(.-current-):not(.-selected-):not(
        :hover
    )
    > span {
    color: var(--grey__3) !important;
    background-color: #fff !important;
}

/* ========== Chat sidebar Styles ========== */

/* === Chat sidebar item Styles === */

.chat-wrapper__sidebar-convoItem {
    border-left: 0.125rem solid white;
    border-top: 0.125rem solid white;
    border-bottom: 0.125rem solid white;
}

.chat-wrapper__sidebar-convoItem.convoItem-selected {
    border-color: var(--grean__4);
}

.chat-wrapper__sidebar-convoItem:hover {
    background: transparent !important;
    border-color: var(--green);
}

/* === Chat status message Styles === */

.chat-wrapper__messages-fluid {
    position: relative;
    padding: 0.8333rem;
    background: var(--grean__4);
    border-radius: 1.25rem;
}

.chat-wrapper__messages-fluid-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 2rem;
    height: 2rem;
    background: var(--green);
    border-radius: 2.8889rem;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.fluid-item__label {
    font-weight: 300;
    font-size: var(--caption-1);
    line-height: 1em;
    color: var(--grey__1);
}

.fluid-item__title {
    font-weight: 700;
    color: var(--green);
    font-size: var(--text-t1);
}

.chat-wrapper__messages-fluid-message {
    font-weight: 300;
    font-size: var(--text-t1);
    color: var(--black);
}

.chat-wrapper__messages-msg-time {
    color: var(--grey__2);
}

/* === Chat default message Styles === */

.chat-wrapper__messages-image {
    display: block;
    max-width: 22.5rem;
    width: 100%;
    height: 13.75rem;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.chat-wrapper__messages-image img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}

.chat-wrapper__messages-upFile-info {
    line-height: 1em;
}

.chat-wrapper__messages-msgDate:after {
    content: "";
    width: 7px;
    height: 6px;
    margin-left: 3px;
    display: inline-block;
    vertical-align: middle;
    background-image: url("data:image/svg+xml,%3Csvg width='17' height='14' viewBox='0 0 17 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.4935 1.3454C16.0279 0.874627 15.2693 0.868688 14.7964 1.33217L5.92643 10.0987L2.07056 6.10694C1.61067 5.62762 0.849313 5.61188 0.370044 6.07177C-0.109276 6.53166 -0.125009 7.29302 0.334881 7.77229C0.336964 7.77443 0.338996 7.77656 0.34108 7.7787L5.0425 12.6509C5.26749 12.8804 5.57501 13.0104 5.89643 13.0117H5.90966C6.22499 13.0107 6.52734 12.8859 6.75156 12.6641L16.4826 3.04243C16.9528 2.57619 16.9576 1.81764 16.4935 1.3454Z' fill='%23989898'/%3E%3C/svg%3E%0A");
    background-size: contain;
    background-position: center;
}

.chat-wrapper__messages-msgDate.msg-delivered:after {
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='6' viewBox='0 0 12 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.24674 0.172641C8.01395 -0.0627476 7.63465 -0.0657169 7.39822 0.166025L2.96322 4.5493L1.03528 2.55341C0.805336 2.31375 0.424656 2.30588 0.185022 2.53583C-0.0546382 2.76577 -0.0625045 3.14645 0.16744 3.38609C0.168482 3.38715 0.169498 3.38822 0.17054 3.38929L2.52125 5.82538C2.63375 5.94014 2.7875 6.00513 2.94821 6.00578H2.95483C3.11249 6.00529 3.26367 5.94288 3.37578 5.832L8.24132 1.02115C8.47639 0.788032 8.47879 0.408759 8.24674 0.172641Z' fill='%23989898'/%3E%3Cpath d='M6.12954 5.82542C6.24175 5.9399 6.39502 6.00483 6.55531 6.00582H6.56193C6.71959 6.00533 6.87077 5.94292 6.98288 5.83204L11.8484 1.02119C12.069 0.77286 12.0465 0.39278 11.7981 0.172238C11.573 -0.0277003 11.2347 -0.030331 11.0065 0.166065L6.57334 4.54934L6.41518 4.38517C6.18526 4.1455 5.80458 4.13761 5.56492 4.36756C5.32526 4.59748 5.31737 4.97816 5.54731 5.21782C5.54835 5.21891 5.54939 5.21998 5.55044 5.22105L6.12954 5.82542Z' fill='%23989898'/%3E%3C/svg%3E%0A");
}

.chat-wrapper__messages-File-icon {
    position: relative;
    width: 2.2222rem;
    height: 2.2222rem;
    background:
        url("data:image/svg+xml,%3Csvg width='12' height='14' viewBox='0 0 12 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 3V0.315L11.73 3.5H9.5C9.36739 3.5 9.24021 3.44732 9.14645 3.35355C9.05268 3.25979 9 3.13261 9 3ZM9.5 4.5C9.10218 4.5 8.72064 4.34196 8.43934 4.06066C8.15804 3.77936 8 3.39782 8 3V0H1.5C1.10218 0 0.720644 0.158035 0.43934 0.43934C0.158035 0.720644 0 1.10218 0 1.5V12.5C0 12.8978 0.158035 13.2794 0.43934 13.5607C0.720644 13.842 1.10218 14 1.5 14H10.5C10.8978 14 11.2794 13.842 11.5607 13.5607C11.842 13.2794 12 12.8978 12 12.5V4.5H9.5Z' fill='white'/%3E%3C/svg%3E%0A")
            center no-repeat,
        var(--green);
    border-radius: 1.1111rem;
}

.messages-quote {
    font-size: var(--text-t2);
    padding: 0.25rem 0.5rem;
    background: #f7fbf7;
    border-left: 0.1875rem solid var(--green);
    border-radius: 0.25rem;
}

.messages-quote__name {
    display: block;
    color: var(--green);
}

/* ========== FAQ Styles ========== */

.faqList-group__item {
    border: 2px solid #fff;
}

.Faqlist-item-selected {
    background-color: var(--grean__4);
    border-color: var(--grean__4);
}

.faqList-group__item:hover {
    border-color: var(--green);
}

/* ========== order Styles ========== */

.order-item:hover {
    background-color: var(--grean__5);
}

/* ========== Review box Styles ========== */

.testimonial-box {
    position: relative;
    padding: 0.8333rem;
    background: var(--grean__4);
    border-radius: 1.25rem;
}

/* ========== Profile sidebar Styles ========== */

.profile-sidebar__nav .nav-link {
    border-radius: 0.8333rem;
}

.profile-sidebar__nav .nav-link:not(.active):hover {
    background-color: var(--grean__2);
}

/* ========== Input Styles ========== */

.input-element input:not(:-moz-placeholder-shown),
.input-element textarea:not(:-moz-placeholder-shown) {
    background-color: #fff;
}

.input-element input:not(:-ms-input-placeholder),
.input-element textarea:not(:-ms-input-placeholder) {
    background-color: #fff;
}

.input-element input:not(:placeholder-shown),
.input-element textarea:not(:placeholder-shown) {
    background-color: #fff;
}

.input-element-invalid input,
.input-element-invalid textarea {
    background-color: #fff;
    border-color: var(--red);
}

.input-element-invalid .icon-box path,
.input-element-invalid .icon-box path {
    fill: var(--red);
}

.input-element-invalid + .input-element-tooltip {
    display: block;
    font-weight: 300;
    font-size: var(--caption-2);
    color: #d14343;
}

.input-element.input-element-disabled input:disabled,
.input-element.input-element-disabled textarea:disabled {
    color: var(--grey__2);
    -webkit-box-shadow: inset 0px 2px 10px rgba(0, 0, 0, 0.15) !important;
    box-shadow: inset 0px 2px 10px rgba(0, 0, 0, 0.15) !important;
    background-color: var(--grey__4) !important;
    border-color: var(--grey__4) !important;
}

.input-element.input-element-disabled:has(input:disabled) .icon-box path,
.input-element.input-element-disabled:has(textarea:disabled) .icon-box path {
    fill: #989898 !important;
}

/* === Floating input Styles === */

.form-floating > label {
    color: var(--grey__3);
}

/* ========== Responsive ========== */

@media (max-width: 1440px) {
    :root {
        --h1: 2rem;
        --h2: 1.5rem;
        --h3: 1.25rem;
        --h4: 1.125rem;
        --h5: 1rem;
        --headline: 1rem;
        --subheadline: 0.875rem;
        /* --button-small-button: 1rem;
    --button-big-button: 0.6889rem; */
        --text-t1: 0.9375rem;
        --text-t2: 0.75rem;
        --caption-1: 0.685rem;
        --caption-2: 0.55rem;
        --caption-3: 0.425rem;
        --default-bradius: 1.6667rem;
    }
}

/* ========== Scrollbar Styles ========== */
/* Works on Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--green) var(--grey__4);
}

/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {
    width: 8px;
}

*::-webkit-scrollbar-track {
    background: var(--grey__4);
}

*::-webkit-scrollbar-thumb {
    background-color: var(--green);
    border-radius: 20px;
}

/* ========== Colors Styles ========== */

.bb-grey {
    border-bottom: 1px solid var(--grey__4);
}

/* ========== Crm common ========== */

.sticky-wrap {
    position: sticky;
    z-index: 999;
    top: 20px;
}

.rounded-left {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.rounded-right {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.sm-icon-element {
    position: relative;
    overflow: hidden;
    width: 2.2778rem;
    height: 2.2778rem;
}

.md-icon-element {
    position: relative;
    overflow: hidden;
    width: 3.0556rem;
    height: 3.0556rem;
}

.md-icon-element img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: top center;
    object-position: top center;
}

/* ========== Main wrapper Styles ========== */

.main-wrapper {
    padding-left: 5.1667rem;
}

@media (max-width: 991px) {
    .main-wrapper {
        padding-left: 0;
    }
}

/* ========== Grid columns ========== */

[class^="grid-column-"],
[class*="grid-column-"] {
    display: -ms-grid;
    display: grid;
    min-height: 0;
    gap: 30px;
}

.grid-column-1 {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    grid-auto-rows: -webkit-max-content;
    grid-auto-rows: max-content;
}

.grid-column-3 {
    -ms-grid-columns: (1fr) [3];
    grid-template-columns: repeat(3, 1fr);
}

.grid-column-4 {
    -ms-grid-columns: (1fr) [4];
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: -webkit-max-content;
    grid-auto-rows: max-content;
}

.grid-column-8_4 {
    -ms-grid-columns: 8fr 4fr;
    grid-template-columns: 8fr 4fr;
}

.grid-column-4_8 {
    -ms-grid-columns: 4fr 8fr;
    grid-template-columns: 4fr 8fr;
}

.grid-column-4_5_3 {
    -ms-grid-columns: 4fr 5fr 3fr;
    grid-template-columns: 4fr 5fr 3fr;
}

.grid-column-4_3_5 {
    -ms-grid-columns: 4fr 3fr 5fr;
    grid-template-columns: 4fr 3fr 5fr;
}

.grid-column-5_4_3 {
    -ms-grid-columns: 4fr 5fr 3fr;
    grid-template-columns: 4fr 5fr 3fr;
}

@media (max-width: 1440px) {
    .grid-column-4 {
        -ms-grid-columns: (1fr) [3];
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 1199px) {
    [class^="grid-column-"],
    [class*="grid-column-"] {
        max-height: calc(100vh + 600px);
    }
    .grid-column-3 {
        -ms-grid-columns: (1fr) [2];
        grid-template-columns: repeat(2, 1fr);
    }
    .grid-column-4 {
        -ms-grid-columns: (1fr) [3];
        grid-template-columns: repeat(3, 1fr);
    }
    .grid-column-4_8 {
        -ms-grid-columns: 5fr 7fr;
        grid-template-columns: 5fr 7fr;
    }
    .grid-column-5_4_3,
    .grid-column-4_5_3,
    .grid-column-4_3_5 {
        -ms-grid-columns: 1fr 1fr;
        grid-template-columns: 1fr 1fr;
    }
    .grid-column-2 {
        -ms-grid-column-span: 2;
        grid-column: span 2;
    }
}

@media (max-width: 991px) {
    .grid-column-4 {
        -ms-grid-columns: (1fr) [2];
        grid-template-columns: repeat(2, 1fr);
    }

    [class^="grid-column-"] > *,
    [class*="grid-column-"] > * {
        -ms-grid-column-span: 2;
        grid-column: span 2;
    }
}

/* ========== main layout Styles ========== */

.main-container {
    padding: 1rem 1.6667rem;
    border-radius: 2.2222rem 0rem 0rem 1.6667rem;
    background-color: #fff;
}

@media (max-width: 1440px) {
    .main-container {
        padding: 1rem 0;
    }
}

@media (min-width: 1200px) {
    .main-container {
        min-height: 100vh;
    }
}

@media (min-width: 1200px) and (max-height: 599px) {
    .main-container {
        min-height: calc(100vh + 400px);
    }
}

@media (max-width: 1199px) {
    html,
    body {
        background-color: #fff !important;
    }
}

@media (max-width: 991px) {
    .main-container {
        border-radius: 0;
    }
}

/* ========== Crm navbar Styles ========== */

.aside-navbar {
    position: fixed;
    top: 0;
    left: 0;
    padding: 1rem 0.9rem;
    height: 100vh;
    background-color: var(--black);
}

.aside-navbar-nav .nav-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 10px;
    font-size: 0;
    width: 2.7778rem;
    height: 2.7778rem;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 8px;
}

.aside-navbar-nav .nav-item:not(:last-child) {
    margin-bottom: 0.8333rem;
}

.aside-navbar-nav .navbar-nav {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.aside-navbar-nav .nav-link:hover {
    background-color: var(--grean__4);
}

.aside-navbar-nav .active.nav-link {
    background-color: var(--green);
}

.aside-navbar-nav .nav-link:hover svg > * {
    fill: var(--grean__2);
}

.aside-navbar-nav .active.nav-link svg > * {
    fill: white;
}

.menu__button:not(.menu-button-active) svg > path:last-child {
    display: none;
}

@media (max-width: 991px) {
    .aside-navbar {
        position: fixed;
        left: 0;
        z-index: 9999;
        width: 100px;
        height: 100%;
        padding-top: 0.3rem;
        padding-bottom: 0.3rem;
        background: var(--black);
        -webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        transform: translateX(-100%);
        -webkit-transition: -webkit-transform 0.3s ease-in-out;
        transition: -webkit-transform 0.3s ease-in-out;
        -o-transition: transform 0.3s ease-in-out;
        transition: transform 0.3s ease-in-out;
        transition:
            transform 0.3s ease-in-out,
            -webkit-transform 0.3s ease-in-out;
    }

    .toolbar-btn {
        -webkit-transition: -webkit-transform 0.3s linear;
        transition: -webkit-transform 0.3s linear;
        -o-transition: transform 0.3s linear;
        transition: transform 0.3s linear;
        transition:
            transform 0.3s linear,
            -webkit-transform 0.3s linear;
    }

    .menu-button-active {
        -webkit-transform: rotateY(180deg);
        transform: rotateY(180deg);
    }

    .toolbar-btn:not(.menu-button-active) {
        -webkit-transform: rotateY(0deg);
        transform: rotateY(0deg);
    }

    .menu-button-active svg > path:first-child {
        display: none !important;
    }

    .menu-button-active svg path {
        fill: var(--green);
    }

    .aside-navbar.aside-navbar-active {
        -webkit-transform: translateX(0%);
        -ms-transform: translateX(0%);
        transform: translateX(0%);
    }

    .aside-navbar-nav .nav-link {
        width: 2.4rem;
        height: 2.4rem;
    }

    .aside-navbar-nav .nav-item:not(:last-child) {
        margin-bottom: 0.5rem;
    }
}

/* ========== box container Styles ========== */

.box-container {
    background: white;
    border: 1px solid var(--grey__4);
    border-radius: 1.1111rem;
    padding: 1.1111rem;
}

.box-container__header {
    position: sticky;
    top: 0;
    z-index: 99;
}

.box-container-sm {
    padding: 0.5556rem;
    background: #ffffff;
    border-radius: 0.6667rem;
}

.box-container__icon {
    width: 2.1111rem;
    height: 1.8333rem;
}

.box-container__icon img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}

.box-container__title {
    color: #000;
    line-height: 1em;
    margin-right: 0.5rem;
}

.toggled-container-area {
    width: 100%;
    max-height: 0;
    overflow: hidden;
    -webkit-transition: max-height 0.4s ease;
    -o-transition: max-height 0.4s ease;
    transition: max-height 0.4s ease;
}

.toggle-boxcontainer-btn {
    -webkit-transition: transform 0.4s ease;
    -o-transition: transform 0.4s ease;
    -webkit-transition: -webkit-transform 0.4s ease;
    transition: -webkit-transform 0.4s ease;
    transition: transform 0.4s ease;
    transition:
        transform 0.4s ease,
        -webkit-transform 0.4s ease;
}

.toggled-container-area--hidden .toggle-boxcontainer-btn {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

@media (max-width: 1440px) {
    .box-container {
        padding: 0.83rem;
    }
}

/* ========== Green dropdown Styles ========== */

.dropdown-toggle.pill-dropdown {
    padding: 0.2222rem 0.4444rem;
    font-weight: 300;
    line-height: 1.2em;
    border-radius: 2rem;
}

.dropdown-toggle.pill-dropdown {
    padding: 0.2222rem 0.4444rem;
    font-weight: 300;
    line-height: 1.2em;
    border-radius: 2rem;
}

/* ========== Dropdown Styles ========== */

.dropdown-menu {
    max-height: 300px;
    overflow-y: auto;
}

.dropdown-menu button {
    width: 100%;
    text-align: left;
    padding: 0.3rem 0.5rem;
}

.dropdown-menu button:hover {
    background-color: #eee;
}

.dropdown-toggle::after {
    vertical-align: middle !important;
}

/* ========== top user toolbar Styles ========== */

@media (max-width: 991px) {
    .btn-group .toolbar-btn svg {
        width: 28px;
        height: 28px;
    }

    .crm-top-toolbar__user-toolbar {
        max-width: 100%;
        width: 100%;
    }
}

/* ========== Search Styles ========== */

.crm-top-toolbar__search-input,
.crm-top-toolbar__search-input input {
    border-radius: 2.6667rem;
}

.crm-top-toolbar__search .btn-filter-group > .btn-group {
    border-right: 1px solid #d9d9d9;
}

@media (max-width: 991px) {
    .crm-top-toolbar__search {
        max-width: 100%;
        width: 100%;
    }
}

@media (min-width: 576px) {
    .crm-top-toolbar__search-input input {
        background: transparent !important;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        border: 0;
    }
    .crm-top-toolbar__search {
        padding: 0rem 0.8333rem;
        background: #ffffff;
        -webkit-box-shadow: inset 0px 2px 10px rgba(0, 0, 0, 0.15);
        box-shadow: inset 0px 2px 10px rgba(0, 0, 0, 0.15);
        border-radius: 2.6667rem;
    }
}

@media (max-width: 575px) {
    .crm-top-toolbar__search-input input {
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        border-bottom-left-radius: 1.5rem;
        border-bottom-right-radius: 1.5rem;
    }
    .crm-top-toolbar__filter .btn-filter-group .dropdown-toggle {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }
    .crm-top-toolbar__filter .btn-filter-group .dropdown-menu {
        max-width: 100%;
        width: 100%;
    }
    .crm-top-toolbar__filter .btn-filter-group .btn-group {
        border-right: 0;
    }
    .crm-top-toolbar__filter .btn-filter-group > *,
    .crm-top-toolbar__filter {
        max-width: 100%;
        width: 100%;
    }
}

/* ========== Filter Styles ========== */

.filter-button {
    font-family: inherit;
    font-weight: 300;
    padding: 1.1rem var(--text-t2);
    background: #fff;
    -webkit-box-shadow: inset 0px 2px 10px rgba(0, 0, 0, 0.15) !important;
    box-shadow: inset 0px 2px 10px rgba(0, 0, 0, 0.15) !important;
    border-radius: 2.6667rem;
    border: 1px solid white;
}

/* ========== user toolbar Styles ========== */

.crm-top-toolbar__user-profile-img {
    position: relative;
    overflow: hidden;
    width: 2.7778rem;
    height: 2.7778rem;
    border-radius: 100%;
}

.crm-top-toolbar__user-profile-img img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

/* ========== Hello box Styles ========== */

.crm-hello-box__name {
    font-size: var(--h2);
    line-height: 1em;
}

.crm-hello-box {
    position: relative;
    background: var(--grean__4);
    padding: 1.4444rem;
    padding-right: 25rem;
    border-radius: 1.1111rem;
}

.crm-hello-box__date {
    padding: 0.5556rem;
    color: #fff;
    font-weight: 700;
    background: var(--grean__2);
    border-radius: 4px;
}

.crm-hello-box__image {
    position: absolute;
    right: 7%;
    bottom: 0;
    height: calc(100% + 20px);
}

.crm-hello-box__text {
    word-break: break-word;
}

.crm-hello-box__image img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center bottom;
    object-position: center bottom;
}

@media (max-width: 1440px) {
    .crm-hello-box__name {
        font-size: 1.9rem;
    }
    .crm-hello-box__image {
        width: 50%;
        height: 100%;
        right: 0;
    }
    .crm-hello-box {
        padding-right: 19rem;
    }
}

@media (max-width: 1199px) {
    .crm-hello-box__image {
        width: 33%;
    }
}

@media (max-width: 991px) {
    .crm-hello-box__date {
        font-size: 0.9rem;
    }
    .crm-hello-box {
        padding-right: 20rem;
    }
}

@media (max-width: 767px) {
    .crm-hello-box {
        padding-right: 12rem;
    }
    .crm-hello-box__name {
        font-size: var(--h2);
    }
    .crm-hello-box__image {
        width: 30%;
        height: 100%;
        right: 0;
    }
    .crm-hello-box__image img {
        -o-object-position: bottom;
        object-position: bottom;
    }
}

@media (max-width: 576px) {
    .crm-hello-box {
        padding: 1rem;
        padding-right: 5rem;
    }
}

/* ========== user profile Box Styles ========== */

.crm-user-profile-info {
    padding: 1rem;
    border-radius: 1.1111rem;
    background-color: var(--grey__5);
}

.crm-user-profile-info__avatar {
    position: relative;
    overflow: hidden;
    width: 4.4444rem;
    height: 4.4444rem;
    border-radius: 100%;
}

.crm-user-profile-info__statBox {
    width: 100%;
    background: #ffffff;
    border: 1px solid #efefef;
    border-radius: 0.5556rem;
    text-align: center;
    line-height: 1.25em;
    margin-bottom: 0.5rem;
}

@media (max-width: 991px) {
    .crm-user-profile-info__statBox {
        line-height: 1em;
    }
    .crm-user-profile-info__statBox > *:first-child {
        margin-bottom: 5px;
    }
    .crm-user-profile-info__statBox > * {
        font-size: 0.8rem !important;
    }
}

@media (max-width: 576px) {
    .crm-user-profile-info__avatar {
        width: 3.8rem;
        height: 3.8rem;
    }
}

/* ========== crm order item Styles ========== */

.user-order-item__date {
    font-size: var(--caption-2);
}

.user-order-item.user-order-item--mod:not(:last-child) {
    padding-bottom: .5rem;
    margin-bottom: .5rem;
    border-bottom: 1px solid var(--grey__4);
}

/* ========== crm appeal item Styles ========== */

.user-appeal-item:not(:last-child) {
    padding-bottom: .5rem;
    margin-bottom: .5rem;
    border-bottom: 1px solid var(--grey__4);
}

/* ========== toggle order Styles ========== */

.order-item__avatar {
    width: 4.4444rem;
    height: 4.4444rem;
}

.order-item__viewMore {
    display: none;
    font-size: 0;
}

@media (min-width: 1200px) {
    .order-item__user-details {
        display: -ms-grid;
        display: grid;
        -ms-grid-columns: 1fr 2fr 0.1fr;
        grid-template-columns: 1fr 2fr 0.1fr;
    }
}

@media (max-width: 1440px) {
    .order-item__avatar {
        width: 3.3333rem;
        height: 3.3333rem;
    }
}

@media (max-width: 1199px) {
    .order-item {
        padding: 0.5rem;
    }
    .order-item__user-details-hidden {
        width: 100%;
        max-height: 0;
        overflow: hidden;
        -webkit-transition: max-height 0.4s ease;
        -o-transition: max-height 0.4s ease;
        transition: max-height 0.4s ease;
    }
    .order-item__viewMore {
        display: block;
        width: 100%;
        text-align: center;
        color: var(--green);
        font-weight: 700;
        font-size: var(--text-t2);
        padding-top: 0.5rem;
        margin-top: 0.5rem;
        border-top: 1px solid var(--grey__4);
        cursor: pointer;
    }

    .order-item__status-count,
    .order-item__main-details {
        -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
        order: -1;
    }
}

/* ========== Advanced filters Styles ========== */

@media (max-width: 991px) {
    .advanced-search-sidebar {
        position: fixed;
        right: 0;
        top: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        border-radius: 0;
        z-index: 999999;
        overflow-y: auto;
        -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transform: translateY(100%);
        -webkit-transition: -webkit-transform 0.25s ease-in-out;
        transition: -webkit-transform 0.25s ease-in-out;
        -o-transition: transform 0.25s ease-in-out;
        transition: transform 0.25s ease-in-out;
        transition:
            transform 0.25s ease-in-out,
            -webkit-transform 0.25s ease-in-out;
    }

    .advanced-search-sidebar.search-sidebar-active {
        -webkit-transform: translateY(0%);
        -ms-transform: translateY(0%);
        transform: translateY(0%);
    }

    .close-search-panel {
        position: fixed;
        right: 8px;
        top: 8px;
        z-index: 9999999;
    }

    .close-search-panel > * {
        width: 35px;
        height: 35px;
    }

    .advanced-search-sidebar .box-container-sticky {
        position: relative;
        top: 0;
    }

    .btn-order-filters-group {
        width: 100%;
    }
}

/* ========== Order details Styles ========== */

/* === Order details (timer) Styles === */

.order-timer__dates {
    color: #414141;
}

.order-timer__timeProgress-wrap {
    padding: 0.2778rem;
    background: #f7f7f7;
    border-radius: 5rem;
    margin: 10px 0;
}

.order-timer__timeProgress {
    background: #efefef;
    -webkit-box-shadow: inset 0px 4px 6px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0px 4px 6px rgba(0, 0, 0, 0.05);
    border-radius: 40px;
}

.order-timer__timeProgress > * {
    display: block;
    width: 0%;
    height: 10px;
    background: var(--green);
    border-radius: 2.2222rem;
    -webkit-transition: width 0.3s linear;
    -o-transition: width 0.3s linear;
    transition: width 0.3s linear;
}

.timeRemaining {
    color: #808080;
}

/* === Order details (timeline) Styles === */

.order-timeline__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 0.5556rem;
}

.order-timeline__item-icon {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 1.7778rem;
    height: 1.7778rem;
    border-radius: 100%;
    background-color: var(--green);
}

.order-timeline__item:not(:last-of-type) .order-timeline__item-icon:after {
    content: "";
    position: absolute;
    top: 100%;
    width: 2px;
    height: 0.5556rem;
    background-color: var(--green);
}

.tl-step-active .order-timeline__item-icon,
.tl-step-active ~ .order-timeline__item .order-timeline__item-icon,
.tl-step-active .order-timeline__item-icon:after,
.tl-step-active ~ .order-timeline__item .order-timeline__item-icon:after {
  background-color: var(--grey__3) !important;
}

/* ========== assign item Styles ========== */

.crm-asssign-item {
    border-bottom: 1px solid var(--grey__4);
}

.crm-asssign-item:hover {
    background-color: var(--grean__5);
    border-color: var(--green);
}

.crm-asssign-item__avatar {
    position: relative;
    overflow: hidden;
    width: 2.8889rem;
    height: 2.8889rem;
    border-radius: 100%;
}

.crm-asssign-item__avatar img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}

/* ========== Crm request Styles ========== */

.crm-request-item--mod {
    border: 2px solid var(--grey__5);
    border-radius: 0.75rem;
    cursor: pointer;
}

.crm-request-item--mod:hover,
.crm-request-item__selected {
    border-color: var(--green);
}

/* ========== Notes Styles ========== */

.crm-note-item {
    border-radius: 0.75rem;
}

.crm-notes-profile__avatar {
    position: relative;
    overflow: hidden;
    width: 2.3333rem;
    height: 2.3333rem;
}

/* ========== Range slider Styles ========== */

.slider-container {
    position: relative;
    width: 100%;
    margin-bottom: 15px;
}

.labels {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: var(--text-t2);
    margin-bottom: 5px;
}

.slider-wrapper {
    position: relative;
    height: 10px;
    background: #efefef;
    -webkit-box-shadow: inset 0px 4px 6px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0px 4px 6px rgba(0, 0, 0, 0.05);
    border-radius: 40px;
}

.progress-trail {
    position: absolute;
    height: 10px;
    background: #4caf50;
    border-radius: 5px;
    width: 0%;
}

.range-slider {
    width: 100%;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: transparent;
    z-index: 2;
    -webkit-box-shadow: 0 0 0 5px var(--grey__5);
    box-shadow: 0 0 0 5px var(--grey__5);
    border-radius: 40px;
}

.range-slider::-webkit-slider-runnable-track {
    height: 10px;
    background: transparent;
}

.range-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 1.1111rem;
    height: 1.1111rem;
    background: white;
    border: 5px solid #4caf50;
    border-radius: 50%;
    cursor: pointer;
    position: relative;
    margin-top: -4px;
    -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.12);
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.12);
}

.value-indicator {
    position: absolute;
    top: 100%;
    padding: 4px 10px;
    border-radius: 5px;
    font-size: var(--text-t2);
    color: var(--grey__3);
    -webkit-transform: translateX(calc(-25% - 5px));
    -ms-transform: translateX(calc(-25% - 5px));
    transform: translateX(calc(-25% - 5px));
    white-space: nowrap;
    background-color: #fff;
}

/* ========== Content format Styles ========== */

.content-format strong,
.content-format b {
    font-weight: 700;
}

.content-format h1,
.content-format h2,
.content-format h3,
.content-format h4,
.content-format h5 {
    font-weight: 400;
    color: var(--fill-color-3-dark-grey);
}

.content-format ol,
.content-format ul {
    padding-left: 20px;
}

.content-format ol {
    list-style: decimal;
}

.content-format ul {
    list-style: disc;
    padding-left: 15px;
}

.content-format ul li::marker {
    font-size: 10px;
}

.content-format {
    font-size: var(--default-text);
    line-height: 1.4em;
}

.content-format h1 {
    font-size: var(--h1);
}

.content-format h2 {
    font-size: var(--h2);
}

.content-format h3 {
    font-size: var(--h3);
}

.content-format h4 {
    font-size: var(--h4);
}

.content-format h5 {
    font-size: var(--h5);
}

.content-format > * {
    display: block;
    margin-bottom: 0.5rem;
}

.content-format > *:last-child {
    margin-bottom: 0px;
}

.content-format ul li::marker {
    font-size: 10px;
}

.content-format i {
    display: block;
    font-size: var(--default-text);
    font-style: italic;
}

.content-format blockquote {
    display: inline-block;
    white-space: pre-line;
    padding: 1.25rem;
    background-color: #ddeaff;
    border-radius: 1rem;
}

.content-format blockquote * {
    margin: 0;
}

/* ========== Account box Styles ========== */

.account-box {
    width: 100%;
    padding: 1rem;
    background-color: var(--grey__4);
    border-radius: 0.938rem;
}

.account-box__icon {
    width: 2.1111rem;
    height: 2.1111rem;
}

.account-box__icon img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}

/* ========== Progress bar Styles ========== */

.account__progress-bar {
    width: 270px;
}

.account__progress-bar-step {
    width: 25%;
    height: 0.4444rem;
    background: #ffffff;
    -webkit-box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);
    border-radius: 1.6667rem;
}

.account__progress-bar-step:not(:last-child) {
    margin-right: 0.5556rem;
}