@import"https://fonts.googleapis.com/css?family=Tajawal&display=swap";

:root {
    --blue: #007bff;
    --indigo: #6610f2;
    --purple: #6f42c1;
    --pink: #e83e8c;
    --red: #dc3545;
    --orange: #fd7e14;
    --yellow: #ffc107;
    --green: #28a745;
    --teal: #20c997;
    --cyan: #17a2b8;
    --white: #fff;
    --gray: #6c757d;
    --gray-dark: #343a40;
    --primary: #007bff;
    --secondary: #6c757d;
    --success: #28a745;
    --info: #17a2b8;
    --warning: #ffc107;
    --danger: #dc3545;
    --light: #f8f9fa;
    --dark: #343a40;
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace
}

*,
:after,
:before
 {
    box-sizing: border-box;
    outline: none !important;

}

html {
    font-family: sans-serif;
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -ms-overflow-style: scrollbar;
    -webkit-tap-highlight-color: transparent
}

body {
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", Segoe UI Symbol;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: left;
    background-color: #fff
}

@-webkit-keyframes progress-bar-stripes {
    0% {
        background-position: 1rem 0
    }

    to {
        background-position: 0 0
    }
}

@media print {

    *,
    :after,
    :before {
        text-shadow: none !important;
        box-shadow: none !important
    }

    @page {
        size: a3
    }

    body {
        min-width: 992px !important
    }
}

@charset "UTF-8";

* {
    font-family: Tajawal
}

body {
    letter-spacing: .05rem
}

* {
    margin: 0;
    padding: 0;
    font-size-adjust: auto
}

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

html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%
}

html {
    box-sizing: border-box;
    font-size: 67%
}

body {
    font-size: 1.6rem;
    font-weight: 400;
    letter-spacing: -.03em;
    color: #333
}

@media (min-width: 768px) {
    @-webkit-keyframes slide-in-top {
        0% {
            transform: translateY(-1000px);
            opacity: 0
        }

        to {
            transform: translateY(0);
            opacity: 1
        }
    }
}

html {
    box-sizing: border-box;
    -ms-overflow-style: scrollbar
}

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

html,
body {
    height: 100%
}

body {
    margin: 0
}

:root {
    --light-blue-color: #2ec4b6;
    --light-green-color:  #46b864 ;
    --background-color: #eff0f4;
    --dark-grey-text-color: #011626;
    --grey: #333333
}
.ps {
    overflow: hidden !important;
    overflow-anchor: none;
    -ms-overflow-style: none;
    touch-action: auto;
    -ms-touch-action: auto
}

.ps__rail-x {
    display: none;
    opacity: 0;
    transition: background-color .2s linear, opacity .2s linear;
    -webkit-transition: background-color .2s linear, opacity .2s linear;
    height: 15px;
    bottom: 0px;
    position: absolute
}

.ps__rail-y {
    display: none;
    opacity: 0;
    transition: background-color .2s linear, opacity .2s linear;
    -webkit-transition: background-color .2s linear, opacity .2s linear;
    width: 15px;
    right: 0;
    position: absolute
}

.ps--active-x>.ps__rail-x,
.ps--active-y>.ps__rail-y {
    display: block;
    background-color: transparent
}

.ps:hover>.ps__rail-x,
.ps:hover>.ps__rail-y,
.ps--focus>.ps__rail-x,
.ps--focus>.ps__rail-y,
.ps--scrolling-x>.ps__rail-x,
.ps--scrolling-y>.ps__rail-y {
    opacity: .6
}

.ps .ps__rail-x:hover,
.ps .ps__rail-y:hover,
.ps .ps__rail-x:focus,
.ps .ps__rail-y:focus,
.ps .ps__rail-x.ps--clicking,
.ps .ps__rail-y.ps--clicking {
    background-color: #eee;
    opacity: .9
}

.ps__thumb-x {
    background-color: #aaa;
    border-radius: 6px;
    transition: background-color .2s linear, height .2s ease-in-out;
    -webkit-transition: background-color .2s linear, height .2s ease-in-out;
    height: 6px;
    bottom: 2px;
    position: absolute
}

.ps__thumb-y {
    background-color: #aaa;
    border-radius: 6px;
    transition: background-color .2s linear, width .2s ease-in-out;
    -webkit-transition: background-color .2s linear, width .2s ease-in-out;
    width: 6px;
    right: 2px;
    position: absolute
}

.ps__rail-x:hover>.ps__thumb-x,
.ps__rail-x:focus>.ps__thumb-x,
.ps__rail-x.ps--clicking .ps__thumb-x {
    background-color: #999;
    height: 11px
}

.ps__rail-y:hover>.ps__thumb-y,
.ps__rail-y:focus>.ps__thumb-y,
.ps__rail-y.ps--clicking .ps__thumb-y {
    background-color: #999;
    width: 11px
}

@supports (-ms-overflow-style: none) {
    .ps {
        overflow: auto !important
    }
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    .ps {
        overflow: auto !important
    }
}

.version-overlay {
    position: fixed;
    bottom: -2px;
    left: 10px;
    margin: 0;
    z-index: 10;
    color: #aaa;
    mix-blend-mode: difference
}

#xs[_ngcontent-kfn-c89] {
    width: 30px
}

#sm[_ngcontent-kfn-c89] {
    width: 50px
}

#md[_ngcontent-kfn-c89] {
    width: 70px
}

#lg[_ngcontent-kfn-c89] {
    width: 150px
}

#loaderContainer[_ngcontent-kfn-c89] {
    text-align: center
}

.page-wrapper {
    background-color: #fff
}

.page-height {
    min-height: 660px
}

.page-wrapper {
    background-color: #fff;
    margin-top: 2.8125em
}

@media (max-width: 991px) {
    .page-wrapper--shifted {
        margin-top: 7.75em
    }
}

.page-wrapper-logged-out {
    margin-top: 0
}

.sidenav-container[_ngcontent-kfn-c87] {
    overflow: visible;
    background-color: #fff;
}

.sidenav-container .sidenav {
    width: 90vw
}

.sidenav-container .sidenav__top-section {
    padding-top: 56px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 17px
}

.sidenav-container .sidenav__top-section--shifted {
    padding-top: 96px
}

.sidenav-container .sidenav__top-section,
.sidenav-container .sidenav__middle-section,
.sidenav-container .sidenav__bottom-section {
    padding-left: 23px;
    padding-right: 23px
}

.sidenav-container .sidenav__bottom-section {
    margin-bottom: 70px
}

.sidenav-container .sidenav__logged-out-section {
    border-top: 1px solid #eff0f4;
    border-bottom: 1px solid #eff0f4;
    margin: 0 23px
}

.sidenav-container .sidenav__countries-dropdown-wrapper {
    width: 95%;
    overflow: hidden
}

.sidenav-container .sidenav__taager-logo {
    height: 35px
}

.sidenav-container .sidenav__close-button {
    padding: 6px 9px;
    background: transparent;
    border: none;
    outline: none;
    filter: saturate(0)
}

.sidenav-container .sidenav__close-button__icon {
    width: 15px
}

.sidenav-container .sidenav__separator {
    width: 100%;
    height: 14px;
    background-color: #eff0f4
}

.sidenav-container .sidenav app-taager-sidenav-button+app-taager-sidenav-button {
    display: block;
    border-top: 1px solid #eff0f4
}

.sidenav-container .sidenav__sign-out-button {
    background-color: transparent;
    outline: none;
    border: none;
    color: #ff4966;
    font-size: 16px;
    width: 100%
}

.mat-drawer-transition .mat-drawer-content {
    transition-duration: 400ms;
    transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
    transition-property: transform, margin-left, margin-right
}

.mat-drawer {
    position: relative;
    z-index: 4;
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 3;
    outline: 0;
    box-sizing: border-box;
    overflow-y: auto;
    transform: translate3d(-100%, 0, 0)
}

.cdk-high-contrast-active .mat-drawer,
.cdk-high-contrast-active [dir=rtl] .mat-drawer.mat-drawer-end {
    border-right: solid 1px currentColor
}

.cdk-high-contrast-active [dir=rtl] .mat-drawer,
.cdk-high-contrast-active .mat-drawer.mat-drawer-end {
    border-left: solid 1px currentColor;
    border-right: none
}

.mat-drawer.mat-drawer-side {
    z-index: 2
}

.mat-drawer.mat-drawer-end {
    right: 0;
    transform: translate3d(100%, 0, 0)
}

[dir=rtl] .mat-drawer {
    transform: translate3d(100%, 0, 0)
}

[dir=rtl] .mat-drawer.mat-drawer-end {
    left: 0;
    right: auto;
    transform: translate3d(-100%, 0, 0)
}

.mat-drawer[style*="visibility: hidden"] {
    display: none
}

.mat-drawer-inner-container {
    width: 100%;
    height: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch
}

.mat-sidenav-fixed {
    position: fixed;
    transition: 0.5s;
}

.social-icon img {
    width: 34px;
    height: 34px;
    -o-object-fit: contain;
    object-fit: contain
}

.social-icon:hover {
    cursor: pointer;
    opacity: .7
}

.category[_ngcontent-kfn-c14] img[_ngcontent-kfn-c14] {
    height: 8rem
}

.how-order[_ngcontent-kfn-c14] {
    height: 7.2rem;
    width: 100%
}

.btn-custom[_ngcontent-kfn-c14] {
    outline: none
}

.item-card-img[_ngcontent-kfn-c14] {
    width: 100%
}

[_nghost-kfn-c85] {
    font-size: 12px
}

@media screen and (min-width: 992px) {
    [_nghost-kfn-c85] {
        font-size: calc(12px + 4 * ((100vw - 992px) / 928))
    }
}

@media screen and (min-width: 1920px) {
    [_nghost-kfn-c85] {
        font-size: 16px
    }
}

.logged-out-header-container {
    top: 0;
    z-index: 9999;
    padding: 3.125em 8.75em;
    display: flex;
    justify-content: space-between;
    background-color: #0b1725
}

@media (max-width: 1300px) {
    .logged-out-header-container {
        padding: 3.125em 2.5em 0
    }
}

@media (max-width: 991px) {
    .logged-out-header-container--shifted {
        margin-top: 84px
    }
}

.logged-out-header-container .container-right {
    display: flex;
    align-items: center
}

.logged-out-header-container .container-right .hamburger-menu-button {
    margin-left: 1.4rem;
    cursor: pointer;
    border: none;
    outline: none;
    background: none
}

.logged-out-header-container .container-right .hamburger-menu-button__icon {
    filter: brightness(0) invert(1)
}

.logged-out-header-container .container-right .taager-logo {
    width: 12.8125em
}

.logged-out-header-container .container-right .navigation-link {
    color: #fff;
    font-weight: 700;
    font-size: 1.125em;
    margin-right: 2.7777777778em
}

.logged-out-header-container .container-left button {
    font-size: 1.125em;
    border-radius: 60px;
    outline: none;
    color: #fff;
    cursor: pointer;
    font-weight: 700
}

.logged-out-header-container .container-left .login-btn {
    margin-left: 1.5555555556em;
    padding: 1.0555555556em 2.3888888889em;
    border: .0555555556em solid white;
    background: none
}

.logged-out-header-container .container-left .sing-up-btn {
    border: none;
    background:  #46b864 ;
    padding: 1.0555555556em 3.1111111111em
}

 a:hover {
    text-decoration: none !important;
    color:  #46b864  !important
}

 .sidenav-button {
    display: flex;
    align-items: center;
    height: 52px;
    position: relative
}

 .sidenav-button a:hover {
    text-decoration: none !important
}

 .sidenav-button__icon {
    font-size: 24px;
    margin-left: 9px;
    color: #000
}

 .sidenav-button__text {
    font-size: 16px;
    margin: 0
}

 .sidenav-button__text:hover {
    -webkit-text-decoration: underline #0B1725 !important;
    text-decoration: underline #0B1725 !important
}

 .sidenav-button__chevron-icon {
    position: absolute;
    left: 4px
}

.layout-header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 4px 13px #a6a6a626
}

.layout-header .responsive-text {
    display: block
}

@media (max-width: 767px) {
    .layout-header .responsive-text {
        display: none
    }
}

.layout-header .btn-container {
    display: flex;
    justify-content: center;
    align-items: center
}

.layout-header .btn-container p {
    margin-bottom: 0;
    font-weight: 700;
    color: #707685;
    font-size: 16px
}

@media (max-width: 767px) {
    .layout-header .btn-container p {
        font-size: 14px
    }
}

.layout-header .btn-container .header-btn {
    border: none;
    outline: none;
    background-color: #ecedef;
    font-size: 14px;
    margin: 1.5rem 1.5rem 1.5rem 2.5rem;
    padding: 8px 16px;
    display: flex;
    align-items: center;
    border-radius: 4px;
    cursor: pointer
}

@media (max-width: 767px) {
    .layout-header .btn-container .header-btn {
        margin: 1.5rem .5rem;
        padding: 4px 6px
    }
}

.layout-header .btn-container .header-btn-icon {
    padding-left: 4px
}

.layout-header .btn-container .header-btn-text {
    margin-bottom: 0;
    margin-top: 4px;
    color: #000;
    font-weight: 700
}

.layout-header .taager-logo {
    margin-left: 45px;
    padding: 20px;
    display: flex
}

.layout-header .taager-logo__image-desktop {
    display: block;
    height: 28px
}

@media (max-width: 767px) {
    .layout-header .taager-logo__image-desktop {
        display: none
    }
}

.layout-header .taager-logo__image-mobile {
    display: none
}

@media (max-width: 767px) {
    .layout-header .taager-logo__image-mobile {
        display: block;
        height: 28px
    }
}

@media (max-width: 490px) {
    .layout-header button.header-btn {
        padding: 8px 15px;
        margin: 24px 10px
    }
}

.background {
    width: 100%;
    background-color: #fff;
    margin-top: 3rem
}

.background .login-container {
    margin: auto
}

@media (max-width: 400px) {
    .background .login-container {
        width: 85%
    }
}

.google-btn-container {
    width: 330px
}

.form-group {
    margin-bottom: 20px
}

.input-error {
    font-size: 14px;
    font-weight: 400;
    color: #ce0021
}

.login-header-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 330px
}

@media (max-width: 767px) {
    .login-header-container {
        flex-direction: row
    }
}

.btn-ssi {
    padding: 0 20px;
    border-radius: 6px;
    color: #0b1725;
    background-color: #ecedef;
    margin-top: 3rem
}

.btn-ssi button {
    font-size: 16px;
    font-weight: 600
}

.card-content {
    margin-top: 40px;
    width: 330px;
    margin-bottom: 40px
}

.card-content input {
    padding: 1rem;
    border-color: #d9dbdf;
    height: 55px;
    border-radius: 15px;
}

.card-content .forget-pass-link {
    font-size: 16px;
    color:  #46b864 ;
    margin-top: 1rem;
    text-decoration: underline;
    -webkit-text-decoration-skip-ink: none;
    text-decoration-skip-ink: none
}

.card-content .forget-pass-link:hover {
    cursor: pointer
}

.title {
    font-size: 20px;
    font-weight: 700;
    margin-top: 2rem;
    color: #0f1933
}

@media (max-width: 767px) {
    .title {
        font-size: 16px;
        margin-right: 5px;
        margin-top: 0
    }
}

.login-icon {
    width: 96px;
    height: 96px
}

@media (max-width: 767px) {
    .login-icon {
        width: 66px;
        height: 66px
    }
}

.auth-btn {
    width: 100%;
    height: 47px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    margin-top: 1rem;
    border: 1px solid  #46b864
}

.register-btn {
    background-color:  #46b864 ;
    font-weight: 500;
    font-size: 16px
}

.change-type-btn {
    color:  #46b864 ;
    background-color: #fff;
    font-weight: 500;
    font-size: 16px
}

.btn-register-mob {
    width: 80%;
    margin-right: 10%
}

input {
    border-radius: 9px;
    border: solid 1px #aaa
}

.btns {
    width: 100%;
    display: inline-flex;
    margin-bottom: 2%;
    margin-top: 2%
}

.btns-mob {
    width: 81%;
    display: block;
    margin-bottom: 2%
}

.icon {
    width: 30px;
    height: 40px;
    margin-left: 10px
}

.signUp-container__form {
    width: 25%;
    text-align: center
}

.signUp-container__form__form-field {
    margin-bottom: 20px
}

.signUp-container__form__form-field__password-container {
    position: relative;
    margin-bottom: 10px
}

.signUp-container__form__form-field__password-eye {
    position: absolute;
    top: 15px;
    left: 16px;
    cursor: pointer
}

@media (max-width: 767px) {
    .signUp-container__form__form-field__password-eye {
        left: 3px
    }
}

.signUp-container__form__form-field__validation {
    text-align: right
}

.signUp-container__form__form-field__validation__text {
    margin-right: 10px
}

.meta-phone-number-field {
    display: flex;
    -moz-column-gap: 12px;
    column-gap: 12px;
    background: #FFFFFF;
    border: 1px solid #D9DBDF;
    border-radius: 9px;
    padding: 8px 16px;
    justify-content: center
}

@media (max-width: 767px) {
    .meta-phone-number-field {
        padding: 6px 4px
    }
}

.meta-phone-number-field__code {
    display: flex;
    -moz-column-gap: 8px;
    column-gap: 8px;
    cursor: pointer
}

.meta-phone-number-field__code--disabled {
    pointer-events: none
}

.meta-phone-number-field__code__countries-list-toggler {
    cursor: pointer;
    display: flex;
    align-items: center
}

.meta-phone-number-field__divider {
    border: 1px solid #D9DBDF
}

.meta-phone-number-field__input {
    direction: ltr;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 18px;
    text-align: right;
    color: #a8acb5
}

.meta-phone-number-field__input input {
    outline: none;
    border: none;
    height: 100%;
    width: 100%
}

.meta-phone-number-field__input input::-webkit-input-placeholder {
    color: #707685;
    font-size: 16px
}

.mat-menu__phonenumbers-list {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center
}

.mat-menu__phonenumbers-list__phone-item {
    width: 100%
}

.country-flag-and-code {
    display: flex;
    -moz-column-gap: 10px;
    column-gap: 10px;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: #0f1933;
    padding: 10px 0;
    cursor: pointer
}

.country-flag-and-code.on-overlay:hover {
    background: #a3dcd8
}

.country-flag-and-code__code,
.country-flag-and-code__country-flag {
    display: flex;
    flex: 1
}

.country-flag-and-code__country-flag img {
    width: 22px;
    height: 14px;
    border-radius: 2px
}

.country-flag-and-code__code {
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 18px;
    text-align: right;
    justify-content: flex-start;
    direction: ltr
}


.mat-menu-panel {
    min-width: 112px;
    max-width: 280px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    max-height: calc(100vh - 48px);
    border-radius: 4px;
    outline: 0;
}

.mat-menu-panel.ng-animating {
    pointer-events: none
}

.cdk-high-contrast-active .mat-menu-panel {
    outline: solid 1px
}

.mat-menu-content:not(:empty) {
    padding-top: 8px;
    padding-bottom: 8px
}

.mat-menu-item {
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    outline: none;
    border: none;
    -webkit-tap-highlight-color: transparent;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    line-height: 48px;
    height: 48px;
    padding: 0 16px;
    text-align: left;
    text-decoration: none;
    max-width: 100%;
    position: relative
}

.mat-menu-item::-moz-focus-inner {
    border: 0
}

.mat-menu-item[disabled] {
    cursor: default
}

[dir=rtl] .mat-menu-item {
    text-align: right
}

.mat-menu-item .mat-icon {
    margin-right: 16px;
    vertical-align: middle
}

.mat-menu-item .mat-icon svg {
    vertical-align: top
}

[dir=rtl] .mat-menu-item .mat-icon {
    margin-left: 16px;
    margin-right: 0
}

.mat-menu-item[disabled]::before {
    display: block;
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    bottom: 0;
    right: 0
}

.cdk-high-contrast-active .mat-menu-item {
    margin-top: 1px
}

.cdk-high-contrast-active .mat-menu-item.cdk-program-focused,
.cdk-high-contrast-active .mat-menu-item.cdk-keyboard-focused,
.cdk-high-contrast-active .mat-menu-item-highlighted {
    outline: dotted 1px
}

.mat-menu-item-submenu-trigger {
    padding-right: 32px
}

[dir=rtl] .mat-menu-item-submenu-trigger {
    padding-right: 16px;
    padding-left: 32px
}

.mat-menu-submenu-icon {
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
    width: 5px;
    height: 10px;
    fill: currentColor
}

[dir=rtl] .mat-menu-submenu-icon {
    right: auto;
    left: 16px;
    transform: translateY(-50%) scaleX(-1)
}

.cdk-high-contrast-active .mat-menu-submenu-icon {
    fill: CanvasText
}

button.mat-menu-item {
    width: 100%
}

.mat-menu-item .mat-menu-ripple {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    pointer-events: none
}

.mat-icon {
    -webkit-user-select: none;
    user-select: none;
    background-repeat: no-repeat;
    display: inline-block;
    fill: currentColor;
    height: 24px;
    width: 24px
}

.mat-icon.mat-icon-inline {
    font-size: inherit;
    height: inherit;
    line-height: inherit;
    width: inherit
}

[dir=rtl] .mat-icon-rtl-mirror {
    transform: scale(-1, 1)
}

.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-prefix .mat-icon,
.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-suffix .mat-icon {
    display: block
}

.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-prefix .mat-icon-button .mat-icon,
.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-suffix .mat-icon-button .mat-icon {
    margin: auto
}

 .container {
    margin-bottom: 50px
}

 .revert-link {
    font-weight: 500;
    padding: 10px 0
}

@media (max-width: 768px) {
     .revert-link {
        font-size: 14px
    }
}

 .revert-link:hover {
    color:  #46b864 ;
    opacity: .7
}

 .category-section {
    margin-top: 90px
}

 .sub-banner {
    margin-top: 65px
}

@media (max-width: 768px) {
     .sub-banner {
        margin-top: 20px
    }
}

 .category-section-header {
    color: #0b1725;
    font-size: 21px;
    font-weight: 800;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.48;
    letter-spacing: normal;
    text-align: right
}

@media (max-width: 767px) {
     .category-section-header {
        font-size: 16px;
        padding-right: 15px
    }
}

 .view-all {
    color:  #46b864 ;
    font-size: 18px;
    font-weight: 700;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.44;
    letter-spacing: normal;
    margin-top: 3px;
    text-align: left;
    cursor: pointer
}

@media (max-width: 767px) {
     .view-all {
        font-size: 12px;
        padding-left: 15px
    }
}

 app-category-card {
    flex-basis: 16.66666%
}

@media (max-width: 1199px) {
     app-category-card {
        flex-basis: 20%
    }
}

@media (max-width: 991px) {
     app-category-card {
        flex-basis: 14.2857%
    }
}

@media (max-width: 767px) {
     app-category-card {
        flex-basis: 20%
    }
}

@media (max-width: 521px) {
     app-category-card {
        flex-basis: 25%
    }
}

@media (max-width: 426px) {
     app-category-card {
        flex-basis: 33.33333%
    }
}

@media (max-width: 331px) {
     app-category-card {
        flex-basis: 50%
    }
}

.view-all:hover {
    text-decoration: underline
}

 .top-banner {
    margin: 30px 0;
    height: 380px
}

@media (max-width: 1600px) {
     .top-banner {
        height: 350px
    }
}

@media (max-width: 1200px) {
     .top-banner {
        height: 300px
    }
}

@media (max-width: 992px) {
     .top-banner {
        height: 250px
    }
}

@media (max-width: 767px) {
     .top-banner {
        margin: 24px 10px;
        height: 180px
    }
}

 .top-banner carousel {
    z-index: 0
}

 .top-banner .banner-image {
    border-radius: 20px;
    height: 100%
}

@media (max-width: 1600px) {
     .top-banner .banner-image {
        height: 350px
    }
}

@media (max-width: 1200px) {
     .top-banner .banner-image {
        height: 300px
    }
}

@media (max-width: 992px) {
     .top-banner .banner-image {
        height: 250px
    }
}

@media (max-width: 767px) {
     .top-banner .banner-image {
        height: 180px
    }
}

 .top-banner .carousel-control-prev {
    left: -150px
}

@media (max-width: 991px) {
    info-header[_ngcontent-kfn-c84] {
        display: none
    }
}

[_nghost-kfn-c71] {
    font-size: 12px
}

@media screen and (min-width: 992px) {
    [_nghost-kfn-c71] {
        font-size: calc(12px + 4 * ((100vw - 992px) / 928))
    }
}

@media screen and (min-width: 1920px) {
    [_nghost-kfn-c71] {
        font-size: 16px
    }
}

[_nghost-kfn-c71] a[_ngcontent-kfn-c71]:hover {
    text-decoration: none !important
}

[_nghost-kfn-c71] p[_ngcontent-kfn-c71] {
    color: #fff;
    margin: 0
}

[_nghost-kfn-c71] .info-header-wrapper[_ngcontent-kfn-c71] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color:  #46b864 ;
    padding: .75em 8.75em
}

@media (max-width: 1300px) {
    [_nghost-kfn-c71] .info-header-wrapper[_ngcontent-kfn-c71] {
        padding: .75em 2.5em
    }
}

[_nghost-kfn-c71] .info-header-wrapper[_ngcontent-kfn-c71] .mobile-app-banner[_ngcontent-kfn-c71] {
    display: flex;
    align-items: center
}

[_nghost-kfn-c71] .info-header-wrapper[_ngcontent-kfn-c71] .mobile-app-banner__image[_ngcontent-kfn-c71] {
    margin-left: .4375em;
    -webkit-animation: shake .5s;
    animation: shake .5s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    color: #fff;
    font-size: 33px
}

@-webkit-keyframes shake {
    0% {
        transform: rotate(0)
    }

    49% {
        transform: rotate(0)
    }

    51% {
        transform: rotate(-10deg)
    }

    to {
        transform: rotate(-10deg)
    }
}

@keyframes shake {
    0% {
        transform: rotate(0)
    }

    49% {
        transform: rotate(0)
    }

    51% {
        transform: rotate(-10deg)
    }

    to {
        transform: rotate(-10deg)
    }
}

[_nghost-kfn-c71] .info-header-wrapper[_ngcontent-kfn-c71] .mobile-app-banner__announcement-text[_ngcontent-kfn-c71] {
    font-size: 1.125em;
    margin-top: .2222222222em;
    margin-left: .7777777778em
}

[_nghost-kfn-c71] .info-header-wrapper[_ngcontent-kfn-c71] .mobile-app-banner__google-play-button[_ngcontent-kfn-c71] {
    height: 2.5em
}

[_nghost-kfn-c71] .info-header-wrapper[_ngcontent-kfn-c71] .info-links[_ngcontent-kfn-c71] {
    display: flex;
    align-items: center
}

[_nghost-kfn-c71] .info-header-wrapper[_ngcontent-kfn-c71] .info-links__link[_ngcontent-kfn-c71] {
    display: flex;
    align-items: center
}

[_nghost-kfn-c71] .info-header-wrapper[_ngcontent-kfn-c71] .info-links__link[_ngcontent-kfn-c71]:not(:last-child) {
    margin-left: 3.125em
}

[_nghost-kfn-c71] .info-header-wrapper[_ngcontent-kfn-c71] .info-links__link[_ngcontent-kfn-c71]:hover {
    cursor: pointer;
    -webkit-text-decoration-color: #fff;
    text-decoration-color: #fff
}

[_nghost-kfn-c71] .info-header-wrapper[_ngcontent-kfn-c71] .info-links__icon[_ngcontent-kfn-c71] {
    margin-left: .625em;
    font-size: 20px;
    vertical-align: super;
    color: #fff;
    text-decoration: none
}

[_nghost-kfn-c71] .info-header-wrapper[_ngcontent-kfn-c71] .info-links__text[_ngcontent-kfn-c71] {
    font-size: 1em;
    margin-top: .25em
}

[_nghost-kfn-c71] .info-header-wrapper[_ngcontent-kfn-c71] .info-links__text[_ngcontent-kfn-c71]:hover {
    text-decoration: underline !important
}

 .main-header-wrapper {
    top: 0;
    height: 5.125em;
    position: -webkit-sticky;
    position: sticky;
    z-index: 10001;
    background-color: #fff
}

 .main-header-wrapper {
    font-size: 12px
}

@media screen and (min-width: 992px) {
     .main-header-wrapper {
        font-size: calc(12px + 4 * ((100vw - 992px) / 928))
    }
}

@media screen and (min-width: 1920px) {
     .main-header-wrapper {
        font-size: 16px
    }
}

@media (max-width: 375px) {
     .main-header-wrapper {
        padding: 10px
    }
}

.main-header-wrapper .navigation-lower-section {
    display: flex;
    justify-content: space-between;
    position: absolute;
    top: 4.375em;
    left: 0;
    width: 100%;
    padding: 1em 0 0 2em;
    background: #fff;
    transition: top .3s ease;
    min-height: 4.375em;
    box-shadow: 0 5px 5px #00000012
}

@media (max-width: 1300px) {
     .main-header-wrapper .navigation-lower-section {
        padding: .625em 0 0 2em
    }
}

@media (max-width: 991px) {
     .main-header-wrapper .navigation-lower-section {
        display: none
    }
}

 .main-header-wrapper .navigation-lower-section__right-section {
    display: flex
}

 .main-header-wrapper .navigation-lower-section__link {
    display: flex;
    align-items: center
}

 .main-header-wrapper .navigation-lower-section__link:hover {
    cursor: pointer;
    opacity: .5;
    text-decoration: none
}

 .main-header-wrapper .navigation-lower-section__link:not(:last-child) {
    margin-left: 3.125em
}

 .main-header-wrapper .navigation-lower-section__icon {
    margin-left: .625em;
    font-size: 1.625em;
    color:  #46b864
}

 .main-header-wrapper .navigation-lower-section__text {
    margin: .2222222222em 0 0;
    font-size: 1.125em;
    font-weight: 500;
    color: #0b1725
}

 .main-header-wrapper .navigation-lower-section.scrolled {
    top: 0
}

 .main-header-wrapper .navigation-lower-section__no-mega-menu {
    display: flex;
    justify-content: space-between;
    position: absolute;
    top: 4.375em;
    left: 0;
    width: 100%;
    padding: 1em 8.25em;
    background: #fff;
    transition: top .3s ease;
    min-height: 4.375em;
    box-shadow: 0 5px 5px #00000012
}

@media (max-width: 1300px) {
     .main-header-wrapper .navigation-lower-section__no-mega-menu {
        padding: .625em 2.5em
    }
}

@media (max-width: 991px) {
     .main-header-wrapper .navigation-lower-section__no-mega-menu {
        display: none
    }
}

 .main-header-wrapper .navigation-lower-section__no-mega-menu__right-section {
    display: flex
}

 .main-header-wrapper .navigation-lower-section__no-mega-menu__link {
    display: flex;
    align-items: center
}

 .main-header-wrapper .navigation-lower-section__no-mega-menu__link:hover {
    cursor: pointer;
    opacity: .5;
    text-decoration: none
}

 .main-header-wrapper .navigation-lower-section__no-mega-menu__link:not(:last-child) {
    margin-left: 3.125em
}

 .main-header-wrapper .navigation-lower-section__no-mega-menu__icon {
    margin-left: .625em;
    color:  #46b864 ;
    font-size: 1.625em
}

 .main-header-wrapper .navigation-lower-section__no-mega-menu__text {
    margin: .2222222222em 0 0;
    font-size: 1.125em;
    font-weight: 500;
    color: #0b1725
}

 .main-header-wrapper .navigation-lower-section__no-mega-menu.scrolled {
    top: 0
}

 .main-header-wrapper .sticky-header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10002;
    background: #fff;
    padding: .625em 0;
    box-shadow: none;
    transition: box-shadow .3s ease
}

@media (max-width: 991px) {
     .main-header-wrapper .sticky-header--shifted {
        top: 84px
    }
    .carousel-arrow {
        display: none;
    }
}

 .main-header-wrapper .sticky-header--drop-shadow {
    box-shadow: 0 5px 5px #00000012
}

 .main-header-wrapper .mobile-search-bar {
    display: none;
    position: absolute;
    width: 100%;
     top: 62px;
    right: 0;
    padding: .3125em 1.40625em .625em;
    background: #fff;
    z-index: 9999;
    transition: all .3s ease
}

@media (max-width: 375px) {
     .main-header-wrapper .mobile-search-bar {
        padding: 5px 10px 10px
    }
}

@media (max-width: 991px) {
     .main-header-wrapper .mobile-search-bar {
        display: block
    }
}

 .main-header-wrapper .mobile-search-bar.scrolled {
    top: 0
}

 .main-header-wrapper .mobile-search-bar--shifted {
    top: 139px
}

 .main-header-wrapper .mobile-search-bar--shifted.scrolled {
    top: 84px
}

 .sticky-header-wrapper {
    display: flex;
    align-items: center;
    padding: 0 8.75em
}

 .sticky-header-wrapper {
    font-size: 12px
}

@media screen and (min-width: 992px) {
     .sticky-header-wrapper {
        font-size: calc(12px + 4 * ((100vw - 992px) / 928))
    }
}

@media screen and (min-width: 1920px) {
     .sticky-header-wrapper {
        font-size: 16px
    }
}

@media (max-width: 1300px) {
     .sticky-header-wrapper {
        padding: 0 2.5em
    }
}

@media (max-width: 991px) {
     .sticky-header-wrapper {
        padding: 0 1.875em
    }
}

@media (max-width: 375px) {
     .sticky-header-wrapper {
        padding: 0 10px
    }
}

 .sticky-header-wrapper .hamburger-menu-button {
    display: none;
    border: none;
    outline: none;
    background-color: transparent;
    margin-left: 20px
}

 .sticky-header-wrapper .hamburger-menu-button__icon {
    height: 24px
}

@media (max-width: 991px) {
     .sticky-header-wrapper .hamburger-menu-button {
        display: block
    }
}

@media (max-width: 375px) {
     .sticky-header-wrapper .hamburger-menu-button {
        margin-left: 10px
    }
}

 .sticky-header-wrapper .taager-logo {
    margin-left: 2.8125em
}

 .sticky-header-wrapper .taager-logo__image {
    height: 2.1875em
}

@media (max-width: 991px) {
     .sticky-header-wrapper .taager-logo {
        margin-left: auto
    }

     .sticky-header-wrapper .taager-logo__image {
        height: 30px
    }
}

@media (max-width: 325px) {
     .sticky-header-wrapper .taager-logo__image {
        height: 26px
    }
}

 .sticky-header-wrapper .app-products-search-bar {
    margin-left: 3.75em;
    width: 100%
}

@media (max-width: 991px) {

     .sticky-header-wrapper .app-products-search-bar,
     .sticky-header-wrapper .app-account-dropdown {
        display: none
    }
}

 .product-search-form {
    position: relative;
    width: 100%
}

 .product-search-form {
    font-size: 12px
}

@media screen and (min-width: 992px) {
     .product-search-form {
        font-size: calc(12px + 4 * ((100vw - 992px) / 928))
    }
}

@media screen and (min-width: 1920px) {
     .product-search-form {
        font-size: 16px
    }
}

 .product-search-form__input {
    background-color: #eff0f4;
    color: #aaa;
    height: 3.4444444444em;
    border-radius: 10px;
    border: none;
    width: 100%;
    padding: 0 1.3888888889em 0 3.3333333333em;
    font-size: 1.125em
}

 .product-search-form__input:focus {
    outline: none
}

 .product-search-form__input.ng-valid {
    color: #0b1725
}

@media (max-width: 768px) {
     .product-search-form__input {
        height: 45px;
        font-size: 14px
    }
}

 .product-search-form__submit-button {
    background-color:  #46b864 ;
    height: 70%;
    aspect-ratio: 1;
    position: absolute;
    left: 10px;
    top: 15%;
    border: none;
    border-radius: 5px;
    padding: .5555555556em
}

 .product-search-form__submit-button i:hover {
    text-decoration: none
}

 .product-search-form__submit-button:hover {
    cursor: pointer;
    opacity: .7
}

 .product-search-form__submit-button:focus {
    outline: none
}

@media (max-width: 768px) {
     .product-search-form__submit-button {
        padding: 5px
    }
}

 .product-search-form__submit-icon {
    font-size: 26px;
    color: #fff;
    text-decoration: none !important
}

@media (max-width: 1600px) {
     .product-search-form__submit-icon {
        font-size: 22px
    }
}

 .shopping-navigation-wrapper {
    display: flex;
    margin-left: 3.75em
}

 .shopping-navigation-wrapper {
    font-size: 12px
}

@media screen and (min-width: 992px) {
     .shopping-navigation-wrapper {
        font-size: calc(12px + 4 * ((100vw - 992px) / 928))
    }
}

@media screen and (min-width: 1920px) {
     .shopping-navigation-wrapper {
        font-size: 16px
    }
}

@media (max-width: 768px) {
     .shopping-navigation-wrapper {
         margin-left: -14px;
    }
}

@media (max-width: 375px) {
     .shopping-navigation-wrapper {
         margin-left: -20px;
    }
}

 .shopping-navigation-wrapper .shopping-element {
    display: flex;
    align-items: center
}

 .shopping-navigation-wrapper .shopping-element:not(:last-child) {
    margin-left: 3.75em
}

@media (max-width: 768px) {
     .shopping-navigation-wrapper .shopping-element:not(:last-child) {
        margin-left: 25px
    }
}

@media (max-width: 375px) {
     .shopping-navigation-wrapper .shopping-element:not(:last-child) {
        margin-left: 20px
    }
}

 .shopping-navigation-wrapper .shopping-element__link {
    background-color: transparent;
    border: none
}

 .shopping-navigation-wrapper .shopping-element__link:hover {
    cursor: pointer;
    opacity: .5;
    text-decoration: none
}

 .shopping-navigation-wrapper .shopping-element__link:focus {
    outline: none
}

 .shopping-navigation-wrapper .shopping-element__icon {
    vertical-align: bottom;
    text-decoration: none;
    padding-top: 3px;
    font-size: 2em;
    color: #000
}

@media (max-width: 768px) {
     .shopping-navigation-wrapper .shopping-element__icon {
        font-size: 24px
    }
}

@media (max-width: 335px) {
     .shopping-navigation-wrapper .shopping-element__icon {
        font-size: 22px
    }
}

 .shopping-navigation-wrapper .shopping-element__count {
    font-size: 1.3125em;
    font-weight: 700;
    color:  #46b864 ;
    margin: .1904761905em .4285714286em 0 0
}

@media (max-width: 991px) {
     .shopping-navigation-wrapper .shopping-element__count {
        display: none
    }
}

button {
    outline: none;
    cursor: pointer
}

.user-dropdown-btn {
    padding: 8px 16px 0;
    border-radius: 10px;
    display: flex;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    align-items: center;
    background-color: #f8f8fa;
    margin-left: 24px
}

.user-dropdown-btn__icon {
    padding-top: 2px;
    font-size: 24px
}

.user-dropdown-btn__dropdown-icon {
    font-size: 20px
}

.user-dropdown-btn .mat-button-wrapper {
    display: flex;
    align-content: center
}

.user-dropdown-btn .mat-button-wrapper img {
    margin-bottom: 8px
}

.user-dropdown-btn .mat-button-wrapper .user-dropdown-btn__welcome-text {
    margin: 0 6px 0 22px;
    font-size: 18px;
    font-weight: 500;
    color: #0b1725;
    display: flex
}

.user-dropdown-btn .mat-button-wrapper .user-dropdown-btn__welcome-text bdi {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 90px;
    display: block
}

.tab {
    height: 60px
}

.tab__icon {
    margin-left: 10px;
    height: 32px
}

.tab__name {
    font-size: 16px;
    font-weight: 700;
    margin-left: 46px
}

.notifications-menu-container {
    direction: rtl
}

.notifications-menu-container .notifications-btn {
    outline: none;
    padding: 0;
    width: 50px;
    height: 50px;
    min-width: 40px;
    border-radius: 50%;
    margin-right: 23px;
    background: #f8f8fa;
}

@media (max-width: 991px) {
    .notifications-menu-container .notifications-btn {
        background: transparent
    }
}

.notifications-menu-container .notifications-btn__icon {
    height: 25px
}

@media (max-width: 325px) {
    .notifications-menu-container .notifications-btn__icon {
        height: 22px
    }
}

.notifications-menu-container .notifications-btn .notifications-btn__count--appear {
    display: inline-block;
    color: #fff;
    position: absolute;
    text-align: center;
    top: -6px;
    right: -9px;
    width: 24px;
    height: 24px;
    font-size: 12px;
    font-weight: 700;
    line-height: 28px;
    border-radius: 50%;
    background: #ff4966
}

.notifications-menu-container .notifications-btn .notifications-btn__count--disappear {
    display: none
}

.notifications-menu-container .notifications-btn .notifications-btn__icon {
    font-size: 24px
}

.notifications-menu-container .notifications-btn_opened {
    background-color:  #46b864
}

.notifications-menu-container .notifications-btn_opened .notifications-btn__count {
    display: none
}

.notifications-menu-container .notifications-btn_opened .notifications-btn__icon {
    filter: invert(1) brightness(2)
}

.notifications-menu-container .notifications-btn_opened:after {
    content: " ";
    bottom: -12px;
    border-color: transparent transparent  #46b864  transparent;
    border-style: solid;
    border-width: 10px;
    left: 25%;
    position: absolute
}

.mat-menu-panel {
    max-width: -webkit-max-content !important;
    max-width: -moz-max-content !important;
    max-width: max-content !important;
    margin: 10px
}

.mat-menu-content {
    padding-top: 0 !important;
    max-height: 70vh;
    max-width: 500px
}

.mat-menu-content .notifications-menu__header {
    font-size: 18px;
    padding: 18px 0;
    margin-bottom: 12px;
    color: #fff;
    position: -webkit-sticky;
    position: sticky;
    text-align: center;
    background-color:  #46b864
}

@media (max-width: 425px) {
    .mat-menu-content .notifications-menu__header {
        font-size: 16px
    }
}

.mat-menu-content .notifications-menu__no-notifications {
    margin: 20px 60px;
    text-align: center
}

.ng-cloak,
.x-ng-cloak {
    display: none !important
}

.mat-button .mat-button-focus-overlay,
.mat-icon-button .mat-button-focus-overlay {
    opacity: 0
}

.mat-button:hover:not(.mat-button-disabled) .mat-button-focus-overlay,
.mat-stroked-button:hover:not(.mat-button-disabled) .mat-button-focus-overlay {
    opacity: .04
}

@media(hover: none) {

    .mat-button:hover:not(.mat-button-disabled) .mat-button-focus-overlay,
    .mat-stroked-button:hover:not(.mat-button-disabled) .mat-button-focus-overlay {
        opacity: 0
    }
}

.mat-button,
.mat-icon-button,
.mat-stroked-button,
.mat-flat-button {
    box-sizing: border-box;
    position: relative;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    outline: none;
    border: none;
    -webkit-tap-highlight-color: transparent;
    display: inline-block;
    white-space: nowrap;
    text-decoration: none;
    vertical-align: baseline;
    text-align: center;
    margin: 0;
    min-width: 64px;
    line-height: 36px;
    padding: 5px 16px;
    border-radius: 4px;
    overflow: visible
}

.mat-button::-moz-focus-inner,
.mat-icon-button::-moz-focus-inner,
.mat-stroked-button::-moz-focus-inner,
.mat-flat-button::-moz-focus-inner {
    border: 0
}

.mat-button.mat-button-disabled,
.mat-icon-button.mat-button-disabled,
.mat-stroked-button.mat-button-disabled,
.mat-flat-button.mat-button-disabled {
    cursor: default
}

.mat-button.cdk-keyboard-focused .mat-button-focus-overlay,
.mat-button.cdk-program-focused .mat-button-focus-overlay,
.mat-icon-button.cdk-keyboard-focused .mat-button-focus-overlay,
.mat-icon-button.cdk-program-focused .mat-button-focus-overlay,
.mat-stroked-button.cdk-keyboard-focused .mat-button-focus-overlay,
.mat-stroked-button.cdk-program-focused .mat-button-focus-overlay,
.mat-flat-button.cdk-keyboard-focused .mat-button-focus-overlay,
.mat-flat-button.cdk-program-focused .mat-button-focus-overlay {
    opacity: .12
}

.mat-button::-moz-focus-inner,
.mat-icon-button::-moz-focus-inner,
.mat-stroked-button::-moz-focus-inner,
.mat-flat-button::-moz-focus-inner {
    border: 0
}

.mat-raised-button {
    box-sizing: border-box;
    position: relative;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    outline: none;
    border: none;
    -webkit-tap-highlight-color: transparent;
    display: inline-block;
    white-space: nowrap;
    text-decoration: none;
    vertical-align: baseline;
    text-align: center;
    margin: 0;
    min-width: 64px;
    line-height: 36px;
    padding: 0 16px;
    border-radius: 4px;
    overflow: visible;
    transform: translate3d(0, 0, 0);
    transition: background 400ms cubic-bezier(0.25, 0.8, 0.25, 1), box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1)
}

.mat-raised-button::-moz-focus-inner {
    border: 0
}

.mat-raised-button.mat-button-disabled {
    cursor: default
}

.mat-raised-button.cdk-keyboard-focused .mat-button-focus-overlay,
.mat-raised-button.cdk-program-focused .mat-button-focus-overlay {
    opacity: .12
}

.mat-raised-button::-moz-focus-inner {
    border: 0
}

._mat-animation-noopable.mat-raised-button {
    transition: none;
    animation: none
}

.mat-stroked-button {
    border: 1px solid currentColor;
    padding: 0 15px;
    line-height: 34px
}

.mat-stroked-button .mat-button-ripple.mat-ripple,
.mat-stroked-button .mat-button-focus-overlay {
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px
}

.mat-fab {
    box-sizing: border-box;
    position: relative;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    outline: none;
    border: none;
    -webkit-tap-highlight-color: transparent;
    display: inline-block;
    white-space: nowrap;
    text-decoration: none;
    vertical-align: baseline;
    text-align: center;
    margin: 0;
    min-width: 64px;
    line-height: 36px;
    padding: 0 16px;
    border-radius: 4px;
    overflow: visible;
    transform: translate3d(0, 0, 0);
    transition: background 400ms cubic-bezier(0.25, 0.8, 0.25, 1), box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
    min-width: 0;
    border-radius: 50%;
    width: 56px;
    height: 56px;
    padding: 0;
    flex-shrink: 0
}

.mat-fab::-moz-focus-inner {
    border: 0
}

.mat-fab.mat-button-disabled {
    cursor: default
}

.mat-fab.cdk-keyboard-focused .mat-button-focus-overlay,
.mat-fab.cdk-program-focused .mat-button-focus-overlay {
    opacity: .12
}

.mat-fab::-moz-focus-inner {
    border: 0
}

._mat-animation-noopable.mat-fab {
    transition: none;
    animation: none
}

.mat-fab .mat-button-wrapper {
    padding: 16px 0;
    display: inline-block;
    line-height: 24px
}

.mat-mini-fab {
    box-sizing: border-box;
    position: relative;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    outline: none;
    border: none;
    -webkit-tap-highlight-color: transparent;
    display: inline-block;
    white-space: nowrap;
    text-decoration: none;
    vertical-align: baseline;
    text-align: center;
    margin: 0;
    min-width: 64px;
    line-height: 36px;
    padding: 0 16px;
    border-radius: 4px;
    overflow: visible;
    transform: translate3d(0, 0, 0);
    transition: background 400ms cubic-bezier(0.25, 0.8, 0.25, 1), box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
    min-width: 0;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    padding: 0;
    flex-shrink: 0
}

.mat-mini-fab::-moz-focus-inner {
    border: 0
}

.mat-mini-fab.mat-button-disabled {
    cursor: default
}

.mat-mini-fab.cdk-keyboard-focused .mat-button-focus-overlay,
.mat-mini-fab.cdk-program-focused .mat-button-focus-overlay {
    opacity: .12
}

.mat-mini-fab::-moz-focus-inner {
    border: 0
}

._mat-animation-noopable.mat-mini-fab {
    transition: none;
    animation: none
}

.mat-mini-fab .mat-button-wrapper {
    padding: 8px 0;
    display: inline-block;
    line-height: 24px
}

.mat-icon-button {
    padding: 0;
    min-width: 0;
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    line-height: 40px;
    border-radius: 50%
}

.mat-icon-button i,
.mat-icon-button .mat-icon {
    line-height: 24px
}

.mat-button-ripple.mat-ripple,
.mat-button-focus-overlay {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    pointer-events: none;
    border-radius: inherit
}

.mat-button-ripple.mat-ripple:not(:empty) {
    transform: translateZ(0)
}

.mat-button-focus-overlay {
    opacity: 0;
    transition: opacity 200ms cubic-bezier(0.35, 0, 0.25, 1), background-color 200ms cubic-bezier(0.35, 0, 0.25, 1)
}

._mat-animation-noopable .mat-button-focus-overlay {
    transition: none
}

.mat-button-ripple-round {
    border-radius: 50%;
    z-index: 1
}

.mat-button .mat-button-wrapper>*,
.mat-flat-button .mat-button-wrapper>*,
.mat-stroked-button .mat-button-wrapper>*,
.mat-raised-button .mat-button-wrapper>*,
.mat-icon-button .mat-button-wrapper>*,
.mat-fab .mat-button-wrapper>*,
.mat-mini-fab .mat-button-wrapper>* {
    vertical-align: middle
}

.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-prefix .mat-icon-button,
.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-suffix .mat-icon-button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: inherit;
    width: 2.5em;
    height: 2.5em
}

.cdk-high-contrast-active .mat-button,
.cdk-high-contrast-active .mat-flat-button,
.cdk-high-contrast-active .mat-raised-button,
.cdk-high-contrast-active .mat-icon-button,
.cdk-high-contrast-active .mat-fab,
.cdk-high-contrast-active .mat-mini-fab {
    outline: solid 1px
}

.cdk-high-contrast-active .mat-button-base.cdk-keyboard-focused,
.cdk-high-contrast-active .mat-button-base.cdk-program-focused {
    outline: solid 3px
}

.megaMenuButton {
    outline: none;
    border: none;
    color: #fff;
    cursor: pointer;
    background:  #46b864 ;
    font-weight: 700;
    height: 90%;
    margin-top: 2%;
    width: 12.5em;
    font-size: 1.125em;
    margin-left: 3.125em
}

.megaMenuButton__icon {
    height: 1.5em;
    margin-left: .25em
}

.megaMenuButton__chevron {
    float: left;
    margin: .5em;
    height: .5em;
    filter: brightness(0) invert(1)
}

.mega-menu-backdrop+* .mat-menu-content {
    padding-bottom: 0 !important;
    max-width: unset
}

.mega-menu-backdrop+* .mat-menu-panel {
    margin: 0;
    border-radius: 0
}

.mega-menu-container[_ngcontent-kfn-c81] {
    display: flex;
    flex-direction: row
}

.category-list[_ngcontent-kfn-c79] {
    max-height: 66vh;
    overflow-y: auto
}

.category-list[_ngcontent-kfn-c79] .category-list-item[_ngcontent-kfn-c79] {
    display: block;
    width: 300px
}

.products-carousel {
    width: 100%
}

@media (max-width: 767px) {
    .products-carousel {
        padding: 0
    }
}

.products-carousel .category-header-container {
    margin-bottom: 10px;
    margin-top: 30px
}

@media (max-width: 991px) {
    .products-carousel .category-header-container {
        margin-bottom: 10px;
        margin-top: 20px
    }
}

.products-carousel .category-section-header {
    color: #0b1725;
    font-size: 21px;
    font-weight: 800;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.48;
    letter-spacing: normal;
    text-align: right
}

@media (max-width: 767px) {
    .products-carousel .category-section-header {
        font-size: 16px;
        padding-right: 15px
    }
}

.products-carousel .view-all {
    color:  #46b864 ;
    font-size: 18px;
    font-weight: 700;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.44;
    letter-spacing: normal;
    margin-top: 3px;
    text-align: left;
    cursor: pointer
}

@media (max-width: 767px) {
    .products-carousel .view-all {
        font-size: 12px;
        padding-left: 15px
    }
}

.products-carousel .view-all:hover {
    text-decoration: underline
}

.products-carousel carousel {
    height: 460px !important
}

@media (max-width: 991px) {
    .products-carousel carousel {
        height: 410px !important
    }
}

@media (max-width: 767px) {
    .products-carousel carousel {
        height: 320px !important
    }
}

[_nghost-kfn-c78] {
    font-size: 12px
}

@media screen and (min-width: 991px) {
    [_nghost-kfn-c78] {
        font-size: calc(12px + 4 * ((100vw - 991px) / 929))
    }
}

@media screen and (min-width: 1920px) {
    [_nghost-kfn-c78] {
        font-size: 16px
    }
}

[_nghost-kfn-c78] .category-list-item[_ngcontent-kfn-c78] {
    width: 100%;
    background-color: #fff;
    border: none;
    outline: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .625em .875em;
    height: 7vh;
    cursor: pointer;
    border: 1px solid #ddd;
    border-top: none
}

[_nghost-kfn-c78] .category-list-item[_ngcontent-kfn-c78]:hover {
    text-decoration: none
}

[_nghost-kfn-c78] .category-list-item__category[_ngcontent-kfn-c78] {
    display: flex
}

[_nghost-kfn-c78] .category-list-item__category-icon[_ngcontent-kfn-c78] {
    width: 2em;
    height: 2em;
    margin-left: 1em
}

[_nghost-kfn-c78] .category-list-item__category-name[_ngcontent-kfn-c78] {
    margin-bottom: 0;
    font-weight: 700;
    padding-top: .25em
}

[_nghost-kfn-c78] .category-list-item__left-chevron[_ngcontent-kfn-c78],
[_nghost-kfn-c78] .category-list-item__category-icon[_ngcontent-kfn-c78] {
    filter: brightness(0)
}

[_nghost-kfn-c78] .category-list-item--selected[_ngcontent-kfn-c78] .category-list-item__category-name[_ngcontent-kfn-c78],
[_nghost-kfn-c78] .category-list-item--hovered[_ngcontent-kfn-c78] .category-list-item__category-name[_ngcontent-kfn-c78] {
    color:  #46b864
}

[_nghost-kfn-c78] .category-list-item--selected[_ngcontent-kfn-c78] .category-list-item__left-chevron[_ngcontent-kfn-c78],
[_nghost-kfn-c78] .category-list-item--hovered[_ngcontent-kfn-c78] .category-list-item__left-chevron[_ngcontent-kfn-c78] {
    filter: none
}

[_nghost-kfn-c78] .category-list-item--selected[_ngcontent-kfn-c78] .category-list-item__category-icon[_ngcontent-kfn-c78],
[_nghost-kfn-c78] .category-list-item--hovered[_ngcontent-kfn-c78] .category-list-item__category-icon[_ngcontent-kfn-c78] {
    filter: invert(59%) sepia(60%) saturate(489%) hue-rotate(126deg) brightness(90%) contrast(90%)
}

[_nghost-kfn-c78] .category-list-item--hovered[_ngcontent-kfn-c78] {
    border-left-color: transparent
}

{
    position: relative;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-user-select: none;
    user-select: none;
    z-index: 10000;
    transform-origin: top left;
    box-sizing: border-box
}

.carousel-container {
    overflow: hidden;
    width: 100%;
    height: 100%;
    cursor: grab
}

.carousel-container.carousel-moving {
    cursor: grabbing
}

.carousel-counter {
    text-align: right;
    position: absolute;
    z-index: 30;
    transition: opacity .2s;
    top: 8px;
    right: 24px;
    border-radius: 13px;
    background-color: rgba(23, 37, 68, .3);
    font-size: 11px;
    color: #fff;
    padding: 5px 7px;
    line-height: normal
}

.carousel-cells {
    transition: transform .2s;
    width: 100%;
    height: 100%;
    display: block;
    will-change: transform
}

.carousel-cells .carousel-cell.swiper-prev-image {
    transform: translate3d(-100%, 0, 0)
}

.carousel-cells .carousel-cell.swiper-next-image {
    transform: translate3d(100%, 0, 0)
}

.carousel-cells .carousel-cell {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden
}

.carousel-cells .carousel-cell img,
.carousel-cells .carousel-cell video {
    width: 100%;
    height: 100%;
    position: relative;
    object-fit: contain
}

.carousel-cells .carousel-cell img.swiper-hide {
    display: none
}

.carousel-cells .carousel-cell .carousel-play {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 1
}

.carousel-arrow {
    width: 40px;
    height: 40px;
    background-color: #fff;
    background-repeat: no-repeat;
    background-size: 31px;
    background-position: 50%;
    border-radius: 100px;
    position: absolute;
    top: 50%;
    margin-top: -20px;
    z-index: 10;
    cursor: pointer;
    box-shadow: 0 0 5px rgba(0, 0, 0, .15)
}

.carousel-arrow-prev {
    left: 10px;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjI0Ij48cGF0aCBkPSJNMTUuNDEgMTYuNTlMMTAuODMgMTJsNC41OC00LjU5TDE0IDZsLTYgNiA2IDYgMS40MS0xLjQxeiIvPjxwYXRoIGQ9Ik0wIDBoMjR2MjRIMFYweiIgZmlsbD0ibm9uZSIvPjwvc3ZnPg==)
}

.carousel-arrow-next {
    right: 10px;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjI0Ij48cGF0aCBkPSJNOC41OSAxNi41OUwxMy4xNyAxMiA4LjU5IDcuNDEgMTAgNmw2IDYtNiA2LTEuNDEtMS40MXoiLz48cGF0aCBkPSJNMCAwaDI0djI0SDBWMHoiIGZpbGw9Im5vbmUiLz48L3N2Zz4=)
}

.carousel-arrows-outside .carousel-arrow-prev {
    left: -60px
}

.carousel-arrows-outside .carousel-arrow-next {
    right: -60px
}

.carousel-dark-arrows .carousel-arrow {
    filter: invert(1)
}

.carousel-arrow-disabled {
    cursor: default;
    opacity: .5
}

.carousel-dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    text-align: center
}

.carousel-dots .carousel-dot {
    display: inline-block;
    border: 2px solid #fff;
    border-radius: 100px;
    margin: 4px;
    width: 8px;
    height: 8px
}

.carousel-dots .carousel-dot-active {
    background-color: #fff
}

.mat-menu-item[_ngcontent-kfn-c75] {
    outline: none;
    display: flex;
    width: 100%;
    cursor: default;
    height: -webkit-max-content;
    height: -moz-max-content;
    height: max-content
}

.mat-menu-item[_ngcontent-kfn-c75] .notification_icon[_ngcontent-kfn-c75] {
    display: flex;
    padding: 1.5em;
    height: 80%;
    margin: auto 0 auto .625em;
    border-radius: .5625em;
    background: rgba(41, 182, 171, .14)
}

.mat-menu-item[_ngcontent-kfn-c75] .notification_icon[_ngcontent-kfn-c75] .fa-bell[_ngcontent-kfn-c75] {
    margin: auto;
    font-size: 24px;
    color:  #46b864
}

.mat-menu-item[_ngcontent-kfn-c75] p[_ngcontent-kfn-c75],
.mat-menu-item[_ngcontent-kfn-c75] a[_ngcontent-kfn-c75] {
    margin: 0;
    font-size: 16px;
    line-height: 21px;
    direction: ltr;
    word-break: break-word;
    overflow-wrap: break-word;
    white-space: break-spaces
}

@media (max-width: 425px) {

    .mat-menu-item[_ngcontent-kfn-c75] p[_ngcontent-kfn-c75],
    .mat-menu-item[_ngcontent-kfn-c75] a[_ngcontent-kfn-c75] {
        font-size: 13px
    }
}

.mat-menu-item[_ngcontent-kfn-c75] .notification_text[_ngcontent-kfn-c75] {
    width: inherit
}

.mat-menu-item[_ngcontent-kfn-c75] .notification_text[_ngcontent-kfn-c75] .notification-message[_ngcontent-kfn-c75] {
    margin-top: .875em
}

.mat-menu-item[_ngcontent-kfn-c75] .notification_text[_ngcontent-kfn-c75] .notifiction-info-container[_ngcontent-kfn-c75] {
    display: flex;
    margin-top: .375em
}

.mat-menu-item[_ngcontent-kfn-c75] .notification_text[_ngcontent-kfn-c75] .notifiction-info-container[_ngcontent-kfn-c75] .show-more-link[_ngcontent-kfn-c75] {
    color:  #46b864 ;
    text-decoration: underline;
    line-height: normal;
    line-height: initial;
    cursor: pointer
}

.mat-menu-item[_ngcontent-kfn-c75] .notification_text[_ngcontent-kfn-c75] .notifiction-info-container[_ngcontent-kfn-c75] .notification-date[_ngcontent-kfn-c75] {
    color: #aaa;
    line-height: normal;
    line-height: initial
}

.mat-menu-item[_ngcontent-kfn-c75] .unread-notification[_ngcontent-kfn-c75] {
    width: .625em;
    height: .625em;
    border-radius: 50%;
    margin: .875em .625em 0 .1875em;
    background: #ffae0c
}

hr[_ngcontent-kfn-c75] {
    padding: 0;
    margin: .625em;
    opacity: .29;
    color: #ddd
}

 .card-container {
    border: solid 1px #ddd;
    border-radius: 5px;
    direction: ltr;
    margin: 10px auto;
    padding: 10px;
    position: relative;
    width: 250px;
    height: 450px
}

 .card-container .has-variants-text {
    text-align: right;
    margin: 0 10px;
    font-size: 16px;
    height: 2rem;
    font-weight: 500;
    color: #8062d1
}

@media (max-width: 991px) {
     .card-container {
        width: 210px;
        height: 400px
    }
}

@media (max-width: 767px) {
     .card-container {
        padding: 8px;
        width: 158px;
        height: 310px !important
    }
}

 .card-container .product-qty-icon {
    position: absolute;
    right: -1px;
    top: -14px;
    z-index: 1
}

 .card-container .product-qty-icon img {
    z-index: 9
}

@media (max-width: 991px) {
     .card-container .product-qty-icon {
        top: -12px
    }

     .card-container .product-qty-icon img {
        height: 35px
    }
}

@media (max-width: 767px) {
     .card-container .product-qty-icon {
        top: -9px
    }

     .card-container .product-qty-icon img {
        height: 24px
    }
}

 .card-container .availability-text {
    margin: 0;
    text-align: center;
    position: absolute;
    top: 7px;
    font-size: 20px;
    right: 20px;
    color: #fff;
    z-index: 10
}

@media (max-width: 991px) {
     .card-container .availability-text {
        font-size: 16px;
        right: 15px
    }
}

@media (max-width: 768px) {
     .card-container .availability-text {
        font-size: 11px;
        right: 10px;
        top: 5px
    }
}

 .card-container .card-img {
    border: solid 1px #ddd;
    border-radius: 5px;
    height: 228px;
    margin: 0 0 15px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center
}

 .card-container .card-img img {
    z-index: 0;
    -o-object-fit: contain;
    object-fit: contain
}

@media (max-width: 991px) {
     .card-container .card-img {
        height: 188px
    }
}

@media (max-width: 767px) {
     .card-container .card-img {
        height: 140px
    }
}

 .card-container .product-title {
    margin: 4px 10px 10px;
    color: #0b1725;
    direction: rtl;
    font-size: 16px;
    font-stretch: normal;
    font-style: normal;
    font-weight: 700;
    letter-spacing: normal;
    line-height: 1.44;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

@media (max-width: 991px) {
     .card-container .product-title {
        font-size: 14px;
        margin: 5px 0
    }
}

@media (max-width: 767px) {
     .card-container .product-title {
        font-size: 13px;
        margin: 5px 0
    }
}

 .card-container .product-price {
    color: #0b1725;
    font-size: 26px;
    font-weight: 700;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.48;
    letter-spacing: normal;
    text-align: right
}

@media (max-width: 991px) {
     .card-container .product-price {
        font-size: 22px
    }
}

@media (max-width: 767px) {
     .card-container .product-price {
        font-size: 16px;
        padding-left: 0
    }
}

 .card-container .product-price-text {
    color: #0b1725;
    font-size: 14px;
    font-weight: 400;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.48;
    letter-spacing: normal;
    text-align: center;
    margin-right: 10px
}

@media (max-width: 991px) {
     .card-container .product-price-text {
        font-size: 12px;
        margin-right: 4px
    }
}

@media (max-width: 767px) {
     .card-container .product-price-text {
        font-size: 10px;
        margin-left: 15px;
        margin-right: 2px
    }
}

 .card-container .product-profit {
    font-size: 20px;
    font-weight: 800;
    color:  #46b864 ;
    text-align: right
}

@media (max-width: 991px) {
     .card-container .product-profit {
        font-size: 16px
    }
}

@media (max-width: 767px) {
     .card-container .product-profit {
        font-size: 13px;
        padding: 0
    }
}

 .card-container .product-profit span {
    color: #0b1725;
    font-size: 16px;
    font-weight: 400;
    font-stretch: normal;
    font-style: normal;
    line-height: 2.22;
    letter-spacing: normal;
    text-align: right
}

@media (max-width: 991px) {
     .card-container .product-profit span {
        font-size: 14px
    }
}

@media (max-width: 767px) {
     .card-container .product-profit span {
        font-size: 10px
    }
}

 .card-container .add-to-cart-btn {
    background-color:  #46b864 ;
    border-radius: 30px;
    border-color: transparent;
    height: 45px;
    margin: 12px 0;
    padding: 8px 15px;
    width: 170px
}

@media (max-width: 991px) {
     .card-container .add-to-cart-btn {
        width: 140px;
        padding: 0 10px;
        margin: 5px 0
    }
}

@media (max-width: 767px) {
     .card-container .add-to-cart-btn {
        width: 115px;
        height: 28px;
        padding: 0 5px;
        margin: 6px 0 0
    }
}

 .card-container .add-to-cart-btn__icon {
    color: #fff;
    font-size: 20px
}

@media (max-width: 991px) {
     .card-container .add-to-cart-btn__icon {
        font-size: 15px
    }
}

@media (max-width: 575px) {
     .card-container .add-to-cart-btn__icon {
         font-size: 16px;
         margin-right: 15px;
    }
}

 .card-container .add-to-cart-btn span {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: center;
    width: 122px
}

@media (max-width: 991px) {
     .card-container .add-to-cart-btn span {
        font-size: 13px;
        font-weight: 500;
        margin: 0
    }

}

@media (max-width: 767px) {
     .card-container .add-to-cart-btn span {
        font-size: 12px
    }
}

@media (max-width: 575px) {
     .card-container .add-to-cart-btn span {
        font-size: 11px
    }
}

 .card-container .add-to-cart-btn:disabled {
    opacity: .7 !important
}

 .card-container .favorite-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    padding: 0 5px;
    font-size: 28px;
    cursor: pointer
}

@media (max-width: 991px) {
     .card-container .favorite-btn__icon {
        font-sizet: 20px
    }
}

@media (max-width: 767px) {
     .card-container .favorite-btn__icon {
        font-size: 22px
    }
}

 .card-container .favorite-btn__cataloged {
    color: #ff4966
}

 .card-container .favorite-btn__not-cataloged {
    color: #aaa
}

 .card-container .favorite-btn:focus {
    outline: none
}

 .card-container .product-profit {
    position: relative;
    display: inline-block
}

 .card-container .product-profit .tooltip-text {
    background-color:  #46b864 ;
    border-radius: 10px;
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    height: 58px;
    line-height: 1.39;
    letter-spacing: normal;
    left: -20px;
    padding: 11px 23px 11px 21px;
    position: absolute;
    text-align: right;
    top: 40px;
    visibility: hidden;
    width: 220px;
    z-index: 1
}

@media (max-width: 991px) {
     .card-container .product-profit .tooltip-text {
        width: 200px;
        font-size: 12px
    }
}

@media (max-width: 767px) {
     .card-container .product-profit .tooltip-text {
        padding: 5px;
        font-size: 12px;
        height: 41px;
        left: -20px;
        width: 150px;
        top: 25px
    }
}

 .card-container .product-profit:hover .tooltip-text {
    visibility: visible
}

 .card-container .product-profit .tooltip-text:after {
    content: " ";
    bottom: 100%;
    border-color: transparent transparent  #46b864  transparent;
    border-style: solid;
    border-width: 8px;
    left: 20%;
    margin-left: -8px;
    position: absolute
}

 .card-actions {
    margin-top: 2rem
}

 p+.card-actions {
    margin-top: 0
}
@-webkit-keyframes launcherOnOpen {
    0% {
        -webkit-transform: translateY(0px) rotate(0deg);
        transform: translateY(0px) rotate(0deg);
    }
    30% {
        -webkit-transform: translateY(-5px) rotate(2deg);
        transform: translateY(-5px) rotate(2deg);
    }
    60% {
        -webkit-transform: translateY(0px) rotate(0deg);
        transform: translateY(0px) rotate(0deg);
    }
    90% {
        -webkit-transform: translateY(-1px) rotate(0deg);
        transform: translateY(-1px) rotate(0deg);
    }
    100% {
        -webkit-transform: translateY(-0px) rotate(0deg);
        transform: translateY(-0px) rotate(0deg);
    }
}
@keyframes launcherOnOpen {
    0% {
        -webkit-transform: translateY(0px) rotate(0deg);
        transform: translateY(0px) rotate(0deg);
    }
    30% {
        -webkit-transform: translateY(-5px) rotate(2deg);
        transform: translateY(-5px) rotate(2deg);
    }
    60% {
        -webkit-transform: translateY(0px) rotate(0deg);
        transform: translateY(0px) rotate(0deg);
    }
    90% {
        -webkit-transform: translateY(-1px) rotate(0deg);
        transform: translateY(-1px) rotate(0deg);
    }
    100% {
        -webkit-transform: translateY(-0px) rotate(0deg);
        transform: translateY(-0px) rotate(0deg);
    }
}
@keyframes webSDKOnLoad {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@-webkit-keyframes webSDKOnLoad {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
.swiper-wrapper {
    width: 99% !important;
}
.swiper-pagination-bullet {
    background-color:  #46b864 !important;
    border-radius: 30px!important;
    margin: 0 5px!important;
    height: 10px!important;
    width: 20px!important;
    border: none!important;
}
.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
    bottom: 0px;

}
.card-container .add-to-cart-btn {
    background-color:  #46b864 ;
    border-radius: 30px;
    border-color: transparent;
    height: 45px;
    margin: 12px 0;
    width: 168px;
    text-align: right;
    font-size: 21px;
}
.product-list .swiper-slide {
    margin-left: 10px !important;
    width: 248px !important;
}
.product-list .carousel-arrow-prev {
    display: block;
    left: 3px !important;
    width: 44px !important;
    opacity: 0.8;
    height: 44px !important;
}
.product-list .carousel-arrow-next {
    display: block;
    right: 3px !important;
    width: 44px !important;
    opacity: 0.8;
    height: 44px !important;
}
.mat-button-base:hover {
    text-decoration: none;
}
.category-list{
    max-height:66vh;
    overflow-y:auto
}
.category-list .category-list-item{
    display:block;
    width:300px;
    overflow: hidden;
    display: flex;
    height: 45px;
}
.category-list .category-list-item:hover {
    border-left: none;
}
.mega-menu-container{
    display:flex;
    flex-direction:row
}
.megaMenuButton{
    outline:none;
    border:none;
    color:#fff;
    cursor:pointer;
    background: #46b864 ;
    font-weight:700;
    height:90%;
    margin-top:2%;
    width:12.5em;
    font-size:1.125em;
    margin-left:3.125em
}
.megaMenuButton__icon{
    height:1.5em;
    margin-left:.25em
}
.megaMenuButton__chevron{
    float:left;
    margin:.5em;
    height:.5em;
    filter:brightness(0) invert(1)
}
.mega-menu-backdrop+* .mat-menu-content{
    padding-bottom:0!important;
    max-width:unset
}
.mega-menu-backdrop+* .mat-menu-panel{
    margin:0;
    border-radius:0
}
.mat-menu-item{
    outline:none;
    display:flex;
    width:100%;
    cursor:default;
    height:-webkit-max-content;
    height:-moz-max-content;
    height:max-content
}
.mat-menu-item .notification_icon{
    display:flex;
    padding:1.5em;
    height:80%;
    margin:auto 0 auto .625em;
    border-radius:.5625em;
    background:rgba(41,182,171,.14)
}
.mat-menu-item .notification_icon .fa-bell{
    margin:auto;
    font-size:24px;
    color: #46b864
}
.mat-menu-item p, .mat-menu-item a{
    margin:0;
    font-size:16px;
    line-height:21px;
    direction:ltr;
    word-break:break-word;
    overflow-wrap:break-word;
    white-space:break-spaces
}
@media (max-width: 425px){
    .mat-menu-item p, .mat-menu-item a{
        font-size:13px
    }
}
.mat-menu-item .notification_text{
    width:inherit
}
.mat-menu-item .notification_text .notification-message{
    margin-top:.875em
}
.mat-menu-item .notification_text .notifiction-info-container{
    display:flex;
    margin-top:.375em
}
.mat-menu-item .notification_text .notifiction-info-container .show-more-link{
    color: #46b864 ;
    text-decoration:underline;
    line-height:normal;
    line-height:initial;
    cursor:pointer
}
.mat-menu-item .notification_text .notifiction-info-container .notification-date{
    color:#aaa;
    line-height:normal;
    line-height:initial
}
.mat-menu-item .unread-notification{
    width:.625em;
    height:.625em;
    border-radius:50%;
    margin:.875em .625em 0 .1875em;
    background:#ffae0c
}
hr{
    padding:0;
    margin:.625em;
    opacity:.29;
    color:#ddd
}
{
    font-size:12px
}
@media screen and (min-width: 991px){
    {
        font-size:calc(12px + 4 * ((100vw - 991px) / 929))
    }
}
@media screen and (min-width: 1920px){
    {
        font-size:16px
    }
}
 .category-list-item{
    width:100%;
    background-color:#fff;
    border:none;
    outline:none;
    display:flex;
    justify-content:space-between;
    align-items:center;

    cursor:pointer;
    border:1px solid #ddd;
    border-top:none
}
 .category-list-item:hover{
    text-decoration:none
}
 .category-list-item__category{
    display:flex
}
 .category-list-item__category-icon{
    width:2em;
    height:2em;
    margin-left:1em
}
 .category-list-item__category-name{
    margin-bottom:0;
    font-weight:700;
    padding-top:.25em
}
 .category-list-item__left-chevron,  .category-list-item__category-icon{
    filter:brightness(0);
     padding-left: 10px;
}
 .category-list-item--selected .category-list-item__category-name,  .category-list-item--hovered .category-list-item__category-name{
    color: #46b864
}
 .category-list-item--selected .category-list-item__left-chevron,  .category-list-item--hovered .category-list-item__left-chevron{
    filter:none;

}
 .category-list-item--selected .category-list-item__category-icon,  .category-list-item--hovered .category-list-item__category-icon{
    filter:invert(59%) sepia(60%) saturate(489%) hue-rotate(126deg) brightness(90%) contrast(90%)
}
 .category-list-item--hovered{
    border-left-color:transparent
}


.sub-categories-list-container{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    max-height:70vh;
    min-width:320px
}
.sub-categories-list-container .show-all-button{
    padding:14px;
    color: #46b864 ;
    font-weight:700;
    font-size:20px
}
.sub-categories-list-container .sub-categories-list{
    display:grid;
    overflow-y:auto;
    grid-template-rows:auto auto;
    border-top:1px solid #eff0f4;
    grid-template-columns:repeat(2,auto);
    grid-gap:20px 80px;
    min-width:25vw;
    margin:0 .5em
}
.sub-categories-list-container .sub-categories-list .level-two-subcategory{
    padding:15px
}
.sub-categories-list-container .sub-categories-list .level-two-subcategory__name{
    display:block;
    text-align:right;
    margin-bottom:7px;
    color:#0b1725;
    font-weight:800;
    font-size:17px
}
.sub-categories-list-container .sub-categories-list .level-two-subcategory__icon{
    filter:brightness(0)
}
.sub-categories-list-container .sub-categories-list .level-three-subcategory__name{
    color:#aaa;
    text-align:right;
    margin-bottom:5px;
    display:block;
    font-size:16px
}

.cdk-overlay-container {
    height: auto;
    z-index: 9;
    display: none;
}

.cdk-overlay-connected-position-bounding-box {
    top: 120px !important;
    right: 0px;
    height: 450.312px;
    width: 1349px;
    align-items: flex-start;
    z-index: 999999;
    justify-content: flex-start;
}
.cdk-overlay-container {
    position: static;
}
.megaMenuButton {
    cursor: pointer;
}
.megaMenuButton:focus {
    outline: none;
}
.cdk-overlay-backdrop {
    top: auto;
}
.sub-categories{
    display: none;
}
.category-list-item--hovered {
    border-left: none;
}
.app-category-list-item {
    border: none;
}
.sticky-header.affix {
    position: fixed;
    z-index: 10001;
    box-shadow: 0 5px 5px #00000012;
}
.breadcrumbs-container{
    font-size:16px;
    font-weight:500;
    color:#0b1725
}
.breadcrumbs-container i{
    font-size:14px;
    padding-bottom:4px
}
.breadcrumbs-container .breadcrumb-category{
    cursor:pointer;
    color:#0b1725;
    padding:.25em .5em
}
.breadcrumbs-container .last-category{
    color:#aaa;
    pointer-events:none
}
.breadcrumbs-container .breadcrumb-category:hover{
    opacity:.7
}
 #category-products{
    text-align:right;
    padding-top:1px
}
 #category-products .mini-products-header{
    margin:40px 0 15px;
    font-size:21px;
    font-weight:800;
    font-stretch:normal;
    font-style:normal;
    line-height:1.48;
    letter-spacing:normal;
    text-align:right;
    color: #46b864
}
 #category-products .page-title{
    font-size:22px;
    font-weight:800;
    color:#0b1725;
    margin-top:10px
}
 #category-products .category-heading{
    height:20px;
    font-size:16px;
    font-weight:800;
    font-stretch:normal;
    font-style:normal;
    line-height:1.48;
    letter-spacing:normal;
    text-align:right;
    color:#0b1725;
}
@media (max-width: 991px){
     #category-products .category-heading{
        margin-top:5px
    }
}
 #category-products .category-heading span{
    height:25px;
    margin:0 4px 0 0;
    font-size:16px;
    font-weight:500;
    font-stretch:normal;
    font-style:normal;
    line-height:1.39;
    letter-spacing:normal;
    text-align:right;
    color:#aaa
}
 #category-products .items-text{
    margin:24px 10px 11px;
    font-size:14px;
    font-weight:500;
    font-stretch:normal;
    font-style:normal;
    line-height:1.39;
    letter-spacing:normal;
    text-align:right;
    color:#aaa
}
@media (max-width: 991px){
     #category-products .items-text{
        font-size:14px
    }
}
@media (max-width: 575px){
     #category-products .items-text{
        font-size:12px
    }
}
 #category-products .selected-items-per-page{
    font-size:14px;
    font-weight:500
}
@media (max-width: 575px){
     #category-products .selected-items-per-page{
        font-size:12px
    }
}
 #category-products .selected-sorting{
    font-size:14px;
    font-weight:500
}
@media (max-width: 575px){
     #category-products .selected-sorting{
        font-size:12px
    }
}
 #category-products .dropdown-toggle,  #category-products .open.show .dropdown-toggle{
    display:flex;
    align-items:center;
    justify-content:space-around;
    font-size:14px;
    font-weight:500;
    color:#0b1725;
    outline:none;
    width:150px;
    height:45px;
    padding:12px 0 10px;
    border-radius:10px;
    border:solid 1px #ddd;
    background-color:var(--white);
    margin-top:12px
}
 #category-products .dropdown-toggle i,  #category-products .open.show .dropdown-toggle i{
    font-size:14px
}
 #category-products .dropdown-toggle:after{
    content:none
}
 #category-products .dropdown-toggle:focus{
    box-shadow:unset!important;
    outline:none
}
 #category-products .dropdown-toggle:active{
    border:2px solid #ddd!important;
    background-color:transparent!important;
    color:#0b1725!important
}
 #category-products .open.show .dropdown-toggle{
    border-radius:4px 4px 0 0
}
 #category-products .dropdown-menu{
    min-width:unset;
    width:150px;
    border-top:none;
    margin-top:0;
    border-radius:0 0 4px 4px;
    text-align:right
}
 #category-products .dropdown-menu .dropdown-item{
    cursor:pointer;
    font-size:14px;
    outline:none
}
 #category-products .dropdown-menu .dropdown-item:active{
    color:#0b1725;
    text-decoration:none;
    background-color:transparent
}
 #category-products .pagination-wrapper{
    direction:ltr
}
 #category-products .pagination .pagination-prev .page-link,  #category-products .pagination .pagination-next .page-link{
    height:100%;
    border:none
}
 #category-products .pagination .pagination-prev .page-link{
    background:transparent url(../images/prev.svg) no-repeat center;
    margin-right:30px
}
 #category-products .pagination .pagination-next .page-link{
    background:transparent url(../images/next.svg) no-repeat center;
    margin-left:30px
}
 #category-products .pagination .page-link{
    color:#aaa;
    border:solid 1px #ddd;
    border-radius:10px;
    height:47px;
    width:47px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-right:19px
}
@media (max-width: 968px){
     #category-products .pagination .page-link{
        margin-right:10px;
        height:35px;
        width:35px
    }
}
 #category-products .pagination .page-link:focus{
    box-shadow:none
}
 #category-products .pagination .page-item.active .page-link{
    color:var(--white);
    background-color: #46b864 ;
    border:solid 1px var(--light-blue-color);
    border-radius:10px
}
 #category-products .pagination .pagination-page{
    background-color:#fff;
    padding:1px
}
 #category-products .pagination .pagination-page:nth-child(2){
    border-radius:8px 0 0 8px
}
 #category-products .pagination .pagination-page:nth-last-child(2){
    border-radius:0 8px 8px 0
}
@media (max-width: 375px){
     #category-products .pagination .pagination-prev .page-link{
        margin-right:10px
    }
     #category-products .pagination .pagination-next .page-link{
        margin-left:10px
    }
}
 #category-products .collapse-wrap{
    padding:19px;
    background-color:#f8f8fa
}
 #category-products .collapse-wrap .category-list{
    margin-top:0;
    padding:5px;
    border-radius:0 0 .8rem .8rem
}
 #category-products .collapse-wrap .category-list div{
    width:200px;
    transform:translate(-15px)
}
 #category-products .collapse-wrap .collapse-category{
    width:100%;
    height:45px;
    border:1px solid #ddd;
    border-radius:10px;
    background-color:#fff;
    color:#0b1725;
    font-size:16px;
    outline:none;
    white-space:wrap;
    position:relative
}
 #category-products .collapse-wrap .collapse-category.opened{
    border-radius:.25rem .25rem 0 0
}
 #category-products .collapse-wrap .collapse-category:focus,  #category-products .collapse-wrap .collapse-category:active{
    outline:none;
    background-color:#fff;
    color:#0b1725;
    box-shadow:none
}
 app-product-card{
    flex-basis:33.3333333%
}
@media (max-width: 1199px){
     app-product-card{
        flex-basis:50%
    }
}
 .category-el{
    height:40px;
    align-items:center;
    width:-webkit-fit-content;
    width:-moz-fit-content;
    width:fit-content;
    margin:0 auto;
    text-decoration:none
}
 .category-el mat-icon{
    height:35px
}
@media (max-width: 575px){
     .category-el mat-icon{
        height:30px
    }
}
 .category-el mat-icon svg g path,  .category-el mat-icon svg g rect{
    fill:#0b1725
}
 .category-el p{
    margin:0 10px;
    font-size:16px
}
@media (max-width: 575px){
     .category-el p{
        font-size:14px
    }
}
 .selected p{
    color: #46b864
}
 .selected mat-icon svg g path{
    fill: #46b864
}
 .loading-container{
    height:70vh
}
mat-chip-list .mat-chip-list-wrapper{
    background:#f8f8fa;
    margin-top:1rem;
    padding:12px;
    border-radius:20px
}
@media (max-width: 575px){
    mat-chip-list .mat-chip-list-wrapper{
        background:#fff;
        margin-top:0rem
    }
}
mat-chip-list .mat-chip.mat-standard-chip{
    background-color:#fff;
    border:1px solid #ddd;
    border-radius:4px
}
mat-chip-list .mat-chip.mat-standard-chip.mat-chip-selected.mat-primary{
    color:#fff;
    background-color: #46b864
}
@media (max-width: 991px){
    .row{
        margin-top:.5rem
    }
}


 a:hover{
    opacity:.7;
    text-decoration:none
}
 .categories-sidebar-container .categories-sidebar{
    padding:20px 0;
    border-radius:10px;
    border:solid 1px #ddd
}
 .categories-sidebar-container .categories-sidebar .sidebar-title{
    font-size:22px;
    font-weight:800;
    color:#0b1725;
    padding-right:20px;
    margin-bottom:20px
}
 .categories-sidebar-container .categories-sidebar .level-container{
    display:flex;
    align-items:center;
    padding:10px 20px 10px 0
}
 .categories-sidebar-container .categories-sidebar .level-container--selected{
    background-color:#f6fcfb
}
 .categories-sidebar-container .categories-sidebar .level-container--selected .custom-chevron{
    color: #46b864
}
 .categories-sidebar-container .categories-sidebar .level-container--selected .level-button{
    color: #46b864
}
 .categories-sidebar-container .categories-sidebar .level-button{
    border:none;
    background:transparent;
    font-size:18px;
    cursor:pointer;
    color:#0b1725
}
 .categories-sidebar-container .categories-sidebar .level-button:focus{
    outline:none
}
 .categories-sidebar-container .categories-sidebar .level-three-text{
    color:#aaa;
    margin:10px 20px;
    font-size:16px;
    cursor:pointer
}
 .categories-sidebar-container .categories-sidebar .level-three-text--selected{
    color: #46b864
}
 .categories-sidebar-container .categories-sidebar .custom-chevron{
    font-size:14px;
    margin-left:7px;
    color:#000
}

 .mini-card-container{
    margin:32px auto;
    position:relative;
    cursor:pointer;
    text-decoration:none
}
@media (max-width: 900px){
     .mini-card-container{
        padding:20px 16px 15px;
        width:275px
    }
}
@media (max-width: 767px){
     .mini-card-container{
        height:250px;
        padding:8px;
        width:158px
    }
}
 .mini-card-container .product-qty-icon{
    position:absolute;
    right:-1px;
    top:-14px
}
@media (max-width: 767px){
     .mini-card-container .product-qty-icon{
        top:-10px
    }
     .mini-card-container .product-qty-icon img{
        width:120px
    }
}
 .mini-card-container .card-img{
    height:80px;
    width:80px;
    margin:0 0 15px;
    border-radius:10px;
    border:solid 1px #ddd
}
@media (max-width: 900px){
     .mini-card-container .card-img{
        height:220px
    }
}
@media (max-width: 767px){
     .mini-card-container .card-img{
        height:121px
    }
}
 .mini-card-container .product-title{
    margin:0 16px 6px 0;
    font-size:14px;
    font-weight:700;
    font-stretch:normal;
    font-style:normal;
    line-height:1.44;
    letter-spacing:normal;
    text-align:right;
    color:#0b1725
}
@media (max-width: 767px){
     .mini-card-container .product-title{
        font-size:13px;
        margin:5px 0
    }
}
 .mini-card-container .product-category{
    color:#aaa;
    margin:0 0 4px 40px;
    font-size:14px;
    font-weight:400;
    font-stretch:normal;
    font-style:normal;
    line-height:1.36;
    letter-spacing:normal;
    text-align:right
}
@media (max-width: 767px){
     .mini-card-container .product-category{
        font-size:10px
    }
}
 .mini-card-container .product-price{
    margin:0 15px;
    font-size:20px;
    font-weight:700;
    font-stretch:normal;
    font-style:normal;
    line-height:1.5;
    letter-spacing:normal;
    text-align:right;
    color:#0b1725
}
@media (max-width: 900px){
     .mini-card-container .product-price{
        font-size:22px
    }
}
@media (max-width: 767px){
     .mini-card-container .product-price{
        font-size:16px;
        padding-left:0
    }
}
 .mini-card-container .product-price span{
    margin:11px 4px 9px 0;
    font-size:14px;
    font-weight:400;
    font-stretch:normal;
    font-style:normal;
    line-height:1.36;
    letter-spacing:normal;
    text-align:center;
    color:#0b1725
}
@media (max-width: 767px){
     .mini-card-container .product-price span{
        font-size:10px
    }
}
 .mini-card-container .product-profit{
    font-size:18px;
    font-weight:800;
    color: #46b864
}
@media (max-width: 900px){
     .mini-card-container .product-profit{
        font-size:20px
    }
}
@media (max-width: 767px){
     .mini-card-container .product-profit{
        font-size:13px
    }
}
 .mini-card-container .product-profit span{
    margin:51px 16px 5px 5px;
    font-size:16px;
    font-weight:400;
    font-stretch:normal;
    font-style:normal;
    line-height:1.94;
    letter-spacing:normal;
    text-align:right;
    color:#0b1725
}
@media (max-width: 767px){
     .mini-card-container .product-profit span{
        font-size:10px
    }
}
 .mini-card-container .add-to-cart-btn{
    background-color: #46b864 ;
    border-radius:30px;
    height:53px;
    margin:18px 36px 0;
    padding:14px 38px;
    width:234px
}
@media (max-width: 900px){
     .mini-card-container .add-to-cart-btn{
        margin:10px 0
    }
}
@media (max-width: 767px){
     .mini-card-container .add-to-cart-btn{
        width:135px;
        height:28px;
        margin:6px 0 0;
        padding:0 15px 5px
    }
}
 .mini-card-container .add-to-cart-btn span{
    color:#fff;
    font-size:18px;
    font-weight:700;
    font-stretch:normal;
    font-style:normal;
    height:26px;
    line-height:1.44;
    letter-spacing:normal;
    margin:0 10px 0 0;
    text-align:center;
    width:122px
}
@media (max-width: 767px){
     .mini-card-container .add-to-cart-btn span{
        font-size:12px
    }
}
 .mini-card-container .add-to-cart-btn img{
    width:26px
}
@media (max-width: 767px){
     .mini-card-container .add-to-cart-btn img{
        width:15px
    }
}
 .mini-card-container .product-profit{
    position:relative;
    display:inline-block
}
 .mini-card-container .product-profit .tooltip-text{
    background-color: #46b864 ;
    border-radius:10px;
    color:#fff;
    font-size:18px;
    font-weight:500;
    font-stretch:normal;
    font-style:normal;
    height:73px;
    line-height:1.39;
    letter-spacing:normal;
    left:20px;
    padding:11px 23px 11px 21px;
    position:absolute;
    text-align:right;
    top:50px;
    visibility:hidden;
    width:300px;
    z-index:1
}
 .mini-card-container .product-profit:hover .tooltip-text{
    visibility:visible
}
 .mini-card-container .product-profit .tooltip-text:after{
    content:" ";
    bottom:100%;
    border-color:transparent transparent  #46b864  transparent;
    border-style:solid;
    border-width:8px;
    left:20%;
    margin-left:-8px;
    position:absolute
}
/* .mini-card-container:hover{*/
/*    opacity:.7*/
/*}*/

.empty-image {
    width: 150px;
    text-align: center;
    display: block;
    margin: auto;
    opacity: 0.5;
}
 .nonexistent-product {
    width: 100%;
    height: 60vh
}

 .nonexistent-product p {
    font-size: 24px;
    font-weight: 600;
    letter-spacing: normal;
    color: #0b1725
}

 .nonexistent-product .back-to-main-button {
    font-size: 20px;
    padding: 10px;
    height: 60px;
    color: var(--white);
    background-color:  #46b864 ;
    border-radius: 30px;
    width: 250px;
    border: none
}

 #product-details {
    text-align: right;
    padding-top: 1px
}

 #product-details hr {
    padding: 0;
    margin: 0;
    opacity: 1;
    border-top: #eff0f4 1px solid
}

 #product-details .page-navigation,
 #product-details a {
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.38;
    letter-spacing: normal;
    text-align: right;
    color: #0b1725;
    flex-wrap: wrap
}

 #product-details .page-navigation i,
 #product-details a i {
    font-size: 11px
}

 #product-details .page-navigation .nav-link,
 #product-details a .nav-link {
    padding: 0
}

 #product-details .page-navigation .current-page,
 #product-details a .current-page {
    font-weight: 400;
    color: #aaa;
    overflow: hidden;
    text-overflow: ellipsis
}

 #product-details .best-seller {
    height: 580px
}

@media (max-width: 991px) {
     #product-details .best-seller {
        height: 520px
    }
}

@media (max-width: 767px) {
     #product-details .best-seller {
        height: 420px
    }
}

@media (max-width: 475px) {
     #product-details .best-seller {
        height: 465px
    }
}

 #product-details .best-seller .best-seller-title {
    color: #0b1725;
    font-size: 21px;
    font-weight: 800;
    line-height: 1.48;
    margin: 15px 10px 10px 0
}

@media (max-width: 991px) {
     #product-details .best-seller .best-seller-title {
        font-size: 16px
    }
}

 #product-details .best-seller .best-seller-category-bar {
    margin-right: 10px;
    position: relative;
    z-index: 2;
    width: 80%
}

 #product-details .best-seller .best-seller-category-bar .best-seller-category-button {
    border: 0px;
    padding: 5px 10px;
    margin-left: 10px;
    background-color: transparent;
    color: #0b1725;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.44
}

@media (max-width: 991px) {
     #product-details .best-seller .best-seller-category-bar .best-seller-category-button {
        font-size: 14px
    }
}

@media (max-width: 767px) {
     #product-details .best-seller .best-seller-category-bar .best-seller-category-button {
        font-size: 12px;
        padding: 5px;
        margin-left: 5px
    }
}

 #product-details .best-seller .best-seller-category-bar .best-seller-category-button:focus {
    outline: none
}

 #product-details .best-seller .best-seller-category-bar .best-seller-category-selected {
    border-bottom: 4px solid  #46b864
}

 #product-details .best-seller .best-seller-carousel {
    position: relative;
    top: -65px;
    z-index: 1
}

@media (max-width: 991px) {
     #product-details .best-seller .best-seller-carousel {
        top: -55px
    }
}

@media (max-width: 767px) {
     #product-details .best-seller .best-seller-carousel {
        top: -47px
    }
}

@media (max-width: 475px) {
     #product-details .best-seller .best-seller-carousel {
        top: -10px
    }
}

 #product-details .best-seller-loader {
    margin-top: -100px
}

@media (max-width: 991px) {
     #product-details .best-seller-loader {
        margin-top: -60px
    }
}

 .order-now {
    margin-top: 56px
}
 .product-preview-container {
    display: flex;
    padding-top: 40px;
    justify-content: center;
    align-items: flex-start;
    background-color: #fff
}

@media screen and (min-width: 320px) and (max-width: 991px) {
     .product-preview-container {
        display: block
    }
}

 .product-preview-container .left-column {
    display: flex;
    height: 370px;
    margin-top: 10px;
    margin-right: 30px;
    flex-direction: column;
    justify-content: space-around
}

@media screen and (max-width: 475px) {
     .product-preview-container .left-column {
        margin-top: 20px;
        margin-right: 0
    }
}

 .product-preview-container .left-column taager-product-basic-info {
    flex-grow: 1
}

 .product-preview-container .left-column taager-product-actions {
    flex-grow: 3
}

 .product-additional-info-container {
    width: 100%;
    background-color: #fff
}
.product-gallery {
    width: 540px;
    background-color: #fff
}

@media screen and (min-width: 769px) and (max-width: 1250px) {
    .product-gallery {
        width: 475px
    }
}

@media screen and (max-width: 768px) {
    .product-gallery {
        width: 100%;
        padding: 0 20px
    }
}

.product-gallery button {
    font-family: Tajawal
}

.product-gallery .clickable:hover {
    opacity: .7;
    cursor: pointer
}

.product-gallery .main-img-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid #eff0f4;
    border-radius: 10px;
    height: 370px;
    width: 100%;
    margin-bottom: 15px;
    position: relative
}

.product-gallery .main-img-container .chevron-button {
    width: 40px;
    background-color: transparent;
    border: none;
    color:  #46b864 ;
    position: absolute;
    margin: auto 0;
    z-index: 2
}

.product-gallery .main-img-container .chevron-button img {
    height: 30px
}

.product-gallery .main-img-container .chevron-button:focus {
    outline: none
}

.product-gallery .main-img-container .chevron-button:disabled {
    cursor: default;
    opacity: .5
}

.product-gallery .main-img-container .chevron-right {
    right: 30px
}

.product-gallery .main-img-container .chevron-left {
    left: 30px
}

.product-gallery .main-img-container .main-media {
    position: absolute;
    width: 100%;
    height: 100%
}

.product-gallery .main-img-container .main-media .main-image {
    width: 100%;
    height: 100%;
    padding: 20px;
    object-fit: contain
}

.product-gallery .additional-images-carousel {
    width: 100%;
    position: relative;
    margin-bottom: 15px
}

.product-gallery .additional-images-carousel .additional-images-container {
    display: flex;
    align-items: center;
    width: 100%;
    height: 80px;
    overflow: hidden;
    gap: 15px;
    overflow-x: auto;
}

.product-gallery .additional-images-carousel .additional-images-container .image-select-button+.image-select-button {
    margin-left: 10px
}

.product-gallery .additional-images-carousel .additional-images-container .image-select-button {
    flex-shrink: 0;
    width: 100px;
    height: 80px;
    border: none;
    background-color: transparent;
    transition: transform .2s;
    transition-timing-function: ease
}

.product-gallery .additional-images-carousel .additional-images-container .image-select-button .image-thumbnail {
    height: 100%;
    width: 100%;
    border: 1px solid #eff0f4;
    border-radius: 10%;
    object-fit: contain;
    padding: 5px
}

.product-gallery .additional-images-carousel .additional-images-container .image-select-button:focus {
    outline: none
}

.selected-image {
    border: 2px solid  #46b864  !important
}

.product-gallery .additional-images-carousel .thumbnail-arrow {
    border: none;
    height: 30px;
    position: absolute;
    background-color: transparent
}

@media screen and (max-width: 425px) {
    .product-gallery .additional-images-carousel .thumbnail-arrow {
        height: 20px
    }
}

.product-gallery .additional-images-carousel .thumbnail-arrow img {
    width: 100%;
    height: 100%;
    object-fit: contain
}

.product-gallery .additional-images-carousel .thumbnail-arrow:disabled {
    cursor: default;
    opacity: .3
}

.product-gallery .additional-images-carousel .thumbnail-arrow:focus {
    outline: none
}

.product-gallery .additional-images-carousel .thumbnail-arrow-left {
    left: 5px
}

.product-gallery .additional-images-carousel .thumbnail-arrow-right {
    right: 5px
}

.download-button {
    padding: 10px;
    width: 100%;
    border-radius: 20px;
    border: none;
    background-color:  #46b864 ;
    color: #fff;
    font-size: 14px;
    font-weight: 500
}

.download-button .fa-download {
    margin-left: 3px
}

.download-button .icon-style {
    margin-left: 3px;
    width: 20px;
    height: 20px
}

.download-button:focus {
    outline: none
}
 .basic-info {
    width: 540px
}

@media screen and (min-width: 769px) and (max-width: 1250px) {
     .basic-info {
        width: 475px
    }
}

@media screen and (max-width: 768px) {
     .basic-info {
        width: 100%
    }
}

 .basic-info p,
 .basic-info span {
    margin: 0;
    font-family: Tajawal;
    text-align: right
}

 .basic-info .category-name {
    font-size: 14px;
    font-weight: 500;
    color: #aaa
}

 .basic-info .product-name {
    font-size: 20px;
    font-weight: 700;
    color: #0b1725
}

 .basic-info .product-id {
    font-size: 14px;
    font-weight: 500;
    color: #aaa
}

 .basic-info .product-id span {
    font-size: 16px;
    color: #0b1725
}

 .basic-info .profit-info-section {
    display: flex;
    align-items: center
}

 .basic-info .profit-info-section .product-price {
    margin-left: 7px;
    font-size: 20px;
    font-weight: 700;
    color: #ffae0c
}

 .basic-info .profit-info-section .currency {
    font-size: 14px;
    font-weight: 400;
    color: #0b1725;
    margin-left: 10px
}

 .basic-info .profit-info-section .profit-text {
    margin-left: 5px;
    font-size: 13px;
    font-weight: 500;
    color: #aaa
}

 .basic-info .profit-info-section .product-profit {
    margin-left: 7px;
    font-size: 20px;
    font-weight: 700;
    color:  #46b864
}
 .product-actions {
    width: 540px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-around
}

@media screen and (min-width: 769px) and (max-width: 1250px) {
     .product-actions {
        width: 475px
    }
}

@media screen and (max-width: 768px) {
     .product-actions {
        width: 100%
    }
}

 .product-actions p,
 .product-actions span,
 .product-actions button {
    margin: 0;
    font-family: Tajawal;
    text-align: right
}

 .product-actions .clickable:hover {
    cursor: pointer;
    opacity: .7
}

 .product-actions .clickable:focus {
    outline: none
}

 .product-actions .clickable:disabled {
    cursor: default;
    opacity: 1
}

 .product-actions .color-variants {
    display: flex;
    align-items: center
}

 .product-actions .color-variants p {
    font-size: 14px;
    font-weight: 500;
    color: #aaa;
    margin-left: 10px;
    flex-shrink: 0
}

 .product-actions .color-variants .color-variant-button {
    width: 30px;
    height: 30px;
    padding: 4px;
    border-radius: 50%;
    margin-right: 5px;
    border: 1px solid #eff0f4;
    flex-shrink: 0
}

 .product-actions .color-variants .color-variant-button .color-tooltip {
    visibility: hidden;
    position: absolute;
    background-color: #fff;
    border: 1px solid  #46b864 ;
    color: #0b1725;
    padding: 4px;
    border-radius: 6px;
    margin: -37px -6px 0 0;
    font-size: 14px
}

 .product-actions .color-variants .color-variant-button .color-variant-background {
    width: 100%;
    height: 100%;
    border-radius: 50%
}

 .product-actions .color-variants .color-variant-button:hover {
    opacity: 1
}

 .product-actions .color-variants .color-variant-button:hover .color-variant-background {
    opacity: .7
}

 .product-actions .color-variants .color-variant-button:hover .color-tooltip {
    visibility: visible;
    opacity: 1
}

 .product-actions .color-variants .selected-color-variant {
    border-color:  #46b864
}

 .product-actions .size-variants {
    display: flex;
    align-items: center
}

 .product-actions .size-variants p {
    font-size: 14px;
    font-weight: 500;
    color: #aaa;
    margin-left: 10px;
    flex-shrink: 0
}

 .product-actions .size-variants .size-variant-button {
    min-width: 30px;
    height: 34px;
    padding: 4px;
    border-radius: 5px;
    margin-left: 5px;
    border: none;
    text-align: center
}

 .product-actions .size-variants .selected-size-variant {
    border: 1px solid  #46b864
}

 .product-actions .product-availability {
    font-size: 14px;
    font-weight: 500;
    color: #aaa;
    margin-bottom: 5px
}
 .product-actions .product-unavailability {
    font-size: 14px;
    font-weight: 500;
    color: firebrick;
    margin-bottom: 5px
}

 .product-actions .product-availability .product-availability-text {
    margin-right: 12px;
    font-size: 16px;
    font-weight: 500
}

 .product-actions .product-ordering-actions {
    display: flex;
    align-items: center
}

 .product-actions .product-ordering-actions .number-of-items-container {
    width: 120px;
    height: 42px;
    display: flex;
    margin-left: 10px;
    border-radius: 10px;
    align-items: center;
    justify-content: space-around;
    border: 1px solid #ddd
}

 .product-actions .product-ordering-actions .number-of-items-container .items-count-change-button {
    margin: 0;
    border: none;
    padding: 0 3px;
    font-size: 22px;
    font-weight: 800;
    color:  #46b864 ;
    background-color: transparent
}

 .product-actions .product-ordering-actions .number-of-items-container .number-of-items {
    font-size: 18px;
    margin-top: 5px;
    font-weight: 800;
    color: #0b1725
}

@media screen and (max-width: 395px) {
     .product-actions .product-ordering-actions .number-of-items-container {
        width: 80%;
        margin-left: 0;
        margin-top: 10px
    }
}

 .product-actions .product-ordering-actions .action-button {
    margin: 0;
    border: 0;
    height: 40px;
    padding: 0 40px;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    border-radius: 20px
}

@media screen and (max-width: 767px) {
     .product-actions .product-ordering-actions .action-button {
        padding: 0 10px
    }
}

 .product-actions .product-ordering-actions .action-button+.action-button {
    margin-right: 10px
}

 .product-actions .product-ordering-actions .add-to-cart-button {
    background-color:  #46b864
}

 .product-actions .product-ordering-actions .add-to-cart-button .add-to-cart-icon {
    margin-left: 5px;
    height: 15px
}

 .product-actions .product-ordering-actions .order-now-button {
    background-color: #0b1725
}

@media screen and (max-width: 395px) {
     .product-actions .product-ordering-actions {
        flex-direction: column
    }

     .product-actions .product-ordering-actions .action-button {
        width: 100%;
        text-align: center;
        margin-top: 10px
    }

     .product-actions .product-ordering-actions .action-button+.action-button {
        margin-right: 0
    }
}

 .product-actions hr {
    margin: 5px 0;
    padding: 0;
    opacity: 1;
    border-top: 1px solid #eff0f4
}

 .product-actions .favorite-and-share-section {
    display: flex;
    justify-content: space-between
}

@media screen and (max-width: 475px) {
     .product-actions .favorite-and-share-section {
        flex-direction: column
    }
}

 .product-actions .favorite-and-share-section .add-to-catalog-button {
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #0b1725;
    background-color: transparent
}

 .product-actions .favorite-and-share-section .add-to-catalog-button .icon-style {
    margin-left: 3px;
    width: 25px;
    height: 25px
}

@media screen and (max-width: 475px) {
     .product-actions .favorite-and-share-section .add-to-catalog-button {
        padding: 15px 0
    }
}

 .product-actions .favorite-and-share-section .social-sharing-buttons {
    display: flex;
    align-items: center
}

 .product-actions .favorite-and-share-section .social-sharing-buttons .share-text {
    font-size: 12px;
    font-weight: 500;
    color: #aaa
}

 .product-actions .favorite-and-share-section .social-sharing-buttons .share-button {
    height: 40px;
    padding: 0 20px;
    font-size: 14px;
    border: none;
    border-radius: 10px;
    margin-right: 10px;
    display: flex;
    align-items: center
}

 .product-actions .favorite-and-share-section .social-sharing-buttons .share-button span {
    margin-right: 5px
}

 .product-actions .favorite-and-share-section .social-sharing-buttons .share-button:hover {
    text-decoration: none
}

 .product-actions .favorite-and-share-section .social-sharing-buttons .facebook-button {
    color: #298cb6;
    background-color: #eef6f9;
    margin-right: 7px
}

 .product-actions .favorite-and-share-section .social-sharing-buttons .whatsapp-button {
    color: #3ba34e;
    background-color: #eff8f1
}
.product-preview-container {
    display: flex;
    padding-top: 40px;
    justify-content: center;
    align-items: flex-start;
    background-color: #fff
}

@media screen and (min-width: 320px) and (max-width: 991px) {
    .product-preview-container {
        display: block
    }
}

.product-preview-container .left-column {
    display: flex;
    height: 370px;
    margin-top: 10px;
    margin-right: 30px;
    flex-direction: column;
    justify-content: space-around
}

@media screen and (max-width: 475px) {
    .product-preview-container .left-column {
        margin-top: 20px;
        margin-right: 0
    }
}

.product-preview-container .left-column taager-product-basic-info {
    flex-grow: 1
}

.product-preview-container .left-column taager-product-actions {
    flex-grow: 3
}

.product-additional-info-container {
    width: 100%;
    background-color: #fff
}
 .additionalInfoContainer {
    direction: rtl;
    text-align: right;
    width: 100%;
    padding: 30px 0
}

 .additionalInfoContainer p,
 .additionalInfoContainer button,
 .additionalInfoContainer li {
    font-family: Tajawal
}

 .additionalInfoContainer .tabGroup__additionalInfo {
    height: 50px;
    background-color: #eff0f4;
    border-radius: 8px;
    margin-bottom: 10px;
    padding: 0 10px;
    display: flex
}

 .additionalInfoContainer .tabGroup__additionalInfo .tabItem {
    background: none;
    border: none;
    height: 96%;
    padding: 0 10px;
    cursor: pointer;
    font-size: 17px;
    outline: none
}

@media screen and (max-width: 530px) {
     .additionalInfoContainer .tabGroup__additionalInfo .tabItem {
        font-size: 14px;
        padding: 0 5px
    }
}

 .additionalInfoContainer .tabGroup__additionalInfo .tabItem:hover {
    opacity: .7
}

 .additionalInfoContainer .tabGroup__additionalInfo .tabItem--selected {
    border-bottom: 4px solid  #46b864 ;
    border-radius: 4px
}

 .additionalInfoContainer .displayedAdditionalInfoContainer {
    font-size: .9rem;
    padding: 20px 40px;
    border: 1px solid #ddd;
    border-radius: 10px
}

 .additionalInfoContainer .displayedAdditionalInfoContainer .specs--bold {
    list-style-type: none;
    font-weight: 700;
    margin-right: -10px
}

 .additionalInfoContainer .displayedAdditionalInfoContainer li {
    padding: 5px 0;
    font-size: 14px
}

 .additionalInfoContainer .displayedAdditionalInfoContainer .list-syle-type-none {
    list-style-type: none
}

 .additionalInfoContainer .displayedAdditionalInfoContainer .videos-carousel {
    display: flex;
    position: relative;
    justify-content: center;
    height: 100%;
    width: 100%;
    margin: 0 auto
}

 .additionalInfoContainer .displayedAdditionalInfoContainer .videos-carousel .thumbnail-arrow {
    position: absolute;
    top: 45%;
    border: none;
    background-color: #fff;
    width: 5rem;
    height: 5rem;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 0 3px #d3d3d3;
    outline: none;
    z-index: 1
}

 .additionalInfoContainer .displayedAdditionalInfoContainer .videos-carousel .thumbnail-arrow img {
    width: 50%;
    height: 50%
}

 .additionalInfoContainer .displayedAdditionalInfoContainer .videos-carousel .thumbnail-arrow:disabled {
    opacity: .5
}

 .additionalInfoContainer .displayedAdditionalInfoContainer .videos-carousel .thumbnail-arrow-left {
    left: -25px
}

 .additionalInfoContainer .displayedAdditionalInfoContainer .videos-carousel .thumbnail-arrow-right {
    right: -25px
}

@media screen and (max-width: 425px) {
     .additionalInfoContainer .displayedAdditionalInfoContainer .videos-carousel .thumbnail-arrow {
        width: 3rem;
        height: 3rem;
        top: 40%
    }

     .additionalInfoContainer .displayedAdditionalInfoContainer .videos-carousel .thumbnail-arrow-left {
        left: -15px
    }

     .additionalInfoContainer .displayedAdditionalInfoContainer .videos-carousel .thumbnail-arrow-right {
        right: -15px
    }
}

 .additionalInfoContainer .displayedAdditionalInfoContainer .videos-carousel .video-container {
    width: 100%;
    height: 100%;
    position: absolute
}

 .additionalInfoContainer .displayedAdditionalInfoContainer .videos-carousel .video-container iframe {
    width: 100%;
    height: 100%
}

 .additionalInfoContainer .displayedAdditionalInfoContainer .videos-carousel .video-container video {
    width: 100%;
    height: 100%
}

 .additionalInfoContainer .displayedAdditionalInfoContainer .videos-carousel .display-none {
    display: none
}

.product-page {
    display: flex;
}

.img-display {
    flex-grow: 1;
    max-width: 372px;
}

.thumb {
    opacity: .7;
    margin: 0 .25rem .25rem 0;
    width: 120px;
    transition: opacity .25s ease-out;
}

.thumb:hover,
.thumb.active {
    opacity: 1;
}

.zoom {
    display: inline-block;
}
.displayedAdditionalInfoContainer {
    display: none;
}
.toast {
    opacity: 1 !important;
}
loader {
    height: 60vh;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center
}

input {
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

button {
    box-shadow: unset !important
}

.container {
    padding-top: 40px
}

.row {
    margin-top: 20px
}

.main-content {
    padding: 0 30px
}

.title {
    font-size: 30px;
    font-weight: 700;
    margin-top: 50px
}

.cart-title {
    font-size: 21px;
    font-weight: 800;
    color: #0b1725;
    margin-bottom: 0;
    text-align: start
}

@media (max-width: 767px) {
    .cart-title {
        padding-bottom: 15px
    }
}

.cart-title .cart-count {
    color:  #46b864 ;
    margin-right: 3.5px
}

.top-actions {
    display: flex;
    padding: 20px;
    border-bottom: 1px solid #eff0f4;
    font-size: 16px;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap
}

.top-actions .selected-products-count {
    font-size: 18px;
    color: #aaa
}

.top-actions .top-actions-2 {
    width: 100%;
    max-width: 220px;
    display: flex;
    justify-content: space-between
}

@media (max-width: 767px) {
    .top-actions .top-actions-2 {
        padding-bottom: 15px
    }
}

.top-actions .top-actions-2 .check-select-all {
    color:  #46b864 ;
    font-weight: 500;
    font-size: 16px
}

.top-actions .top-actions-2 .select-all {
    margin-left: 40px
}

.top-actions .top-actions-2 .delete-selected {
    cursor: pointer;
    color: #ff4966;
    font-size: 16px;
    font-weight: 500
}

.table-element {
    padding: 30px 0 20px;
    border-top: 1px solid #ddd;
    justify-content: center
}

.table-element .product-disabled-message {
    display: none
}

.table-element.disabled {
    position: relative
}

.table-element.disabled .product-disabled-message {
    display: block;
    position: absolute;
    opacity: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 1000;
    width: 100%
}

.table-element.disabled .product-disabled-message p {
    font-size: 22px;
    font-weight: 700
}

.table-element.disabled .product-disabled-message .btn.discard {
    border: 1px solid black;
    color: #ff4966
}

.table-element.disabled .product-info,
.table-element.disabled .price-info {
    opacity: .2
}

@media (max-width: 767px) {
    .table-element {
        padding: 20px 0 0
    }
}

.table-element:first-child {
    border-top: none
}

.right-side {
    background: var(--white);
    border-radius: 10px;
    margin-bottom: 30px;
    height: 50%;
    border: 1px solid #ddd
}

.table-row td {
    font-size: 18px;
    font-weight: 700;
    color: #0b1725;
    border-bottom: solid 1px #eff0f4;
    text-align: right
}

.left-side {
    padding: 0 20px 20px
}

@media (max-width: 991px) {
    .left-side {
        padding: 30px 15px 30px 0
    }
}

@media (max-width: 767px) {
    .left-side {
        padding: 30px
    }
}

.left-side .left-card {
    border-radius: 20px;
    padding: 15px 25px 25px 15px;
    background-color:  #46b864 ;
    margin-bottom: 20px;
    width: 100%
}

.left-side .left-card .card-title {
    font-size: 24px;
    font-weight: 800;
    text-align: center;
    padding: 0;
    color: #fff
}

@media (max-width: 1199px) {
    .left-side .left-card .card-title {
        font-size: 19px
    }
}

.left-side .left-card .sub-card-title {
    font-size: 16px;
    padding: 0;
    margin-top: -5px;
    margin-bottom: 0;
    text-align: right;
    color: #fff
}

.left-side .error-message {
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    color: #ff4966
}

.left-side .line-num-header th {
    font-size: 18px;
    font-weight: 700;
    color: #aaa;
    border: none;
    text-align: right
}

.left-side .error-mesg-box {
    width: 537px;
    padding: 30px;
    border-bottom: 1px solid #eff0f4;
    margin-bottom: 10px;
    font-size: 16px;
    background-color: #fff;
    border-radius: 20px;
    box-shadow: 0 3px 20px #aaaaaa82
}

.left-side .error-mesg-box .line-num {
    width: 48%;
    font-size: 18px;
    font-weight: 700;
    text-align: center
}

.left-side .error-mesg-box .err-header {
    font-size: 12px;
    font-weight: 700;
    color: #aaa
}

.left-side .error-mesg-box .err-code {
    width: 48%;
    font-size: 18px;
    font-weight: 700;
    text-align: left
}

.left-side .left-buttons {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
    padding: .5px;
    width: 100%
}

.left-side .left-buttons .button-left {
    width: 48%;
    border-radius: 30px;
    text-align: center;
    background-color:  #46b864 ;
    font-size: 16px;
    color: #fff;
    padding: 20px 27.9px 20px 23px;
    white-space: normal;
    vertical-align: middle
}

.left-side .left-buttons .button-left .button-icon {
    width: 21px;
    height: 20px;
    padding-top: 5px;
    margin: 0 0 0 3px
}

@media (max-width: 1199px) {
    .left-side .left-buttons .button-left {
        padding: 10px;
        font-size: 14px;
        border-radius: 20px;
        font-weight: 500
    }
}

.left-side .left-buttons #file-upload {
    opacity: 0;
    position: absolute;
    z-index: -1
}

.left-side .left-buttons .button-right {
    width: 48%;
    border-radius: 30px;
    text-align: center;
    background-color: #0b1725;
    font-size: 16px;
    color: #fff;
    padding: 20px 27.9px 20px 23px;
    white-space: normal;
    margin-bottom: 0;
    display: flex;
    align-items: center
}

.left-side .left-buttons .button-right .button-icon {
    width: 21px;
    height: 20px;
    margin: 0 0 0 8px
}

@media (max-width: 1199px) {
    .left-side .left-buttons .button-right {
        padding: 10px;
        font-size: 14px;
        border-radius: 20px;
        font-weight: 500
    }
}

.left-side .left-buttons .button-right--disabled {
    pointer-events: none;
    opacity: .65
}

.left-side .left-wrapper {
    background-color: var(--white);
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    margin-bottom: 20px;
    border: 1px solid #ddd;
    padding-bottom: 10px
}

.left-side .left-wrapper .checkout-btn {
    font-size: 20px;
    width: 90%;
    height: 60px;
    border-radius: 30px;
    color: var(--white);
    background-color:  #46b864
}

.left-side .left-wrapper .checkout-btn:disabled {
    background-color: #aaa
}

.left-side .left-wrapper .your-cart {
    width: 100%;
    margin-bottom: 25px;
    height: 100%;
    padding: 25px 20px;
    background-color:  #46b864 ;
    border-radius: 20px 20px 0 0
}

@media (max-width: 991px) {
    .left-side .left-wrapper .your-cart {
        border-radius: 15px 15px 0 0;
        padding: 15px 20px
    }
}

.left-side .left-wrapper .your-cart .your-text {
    width: 100%;
    height: 31px;
    font-size: 21px;
    font-weight: 700;
    text-align: center;
    color: #fff;
    margin: 0
}

@media (max-width: 991px) {
    .left-side .left-wrapper .your-cart .your-text {
        font-size: 18px
    }
}

@media (max-width: 767px) and (min-width: 401px) {
    .left-side .left-wrapper .your-cart .your-text {
        font-size: 21px
    }
}

.left-side .left-wrapper .cart-text {
    color: #0b1725;
    font-size: 18px;
    display: flex;
    justify-content: space-between;
    width: 90%;
    text-align: right
}

@media (max-width: 991px) and (min-width: 768px) {
    .left-side .left-wrapper .cart-text {
        font-size: 16px
    }
}

@media (max-width: 400px) {
    .left-side .left-wrapper .cart-text {
        font-size: 16px
    }
}

.left-side .left-wrapper .cart-text .price,
.left-side .left-wrapper .cart-text .profit {
    font-size: 20px;
    font-weight: 700
}

@media (max-width: 991px) and (min-width: 768px) {

    .left-side .left-wrapper .cart-text .price,
    .left-side .left-wrapper .cart-text .profit {
        font-size: 18px
    }
}

@media (max-width: 400px) {

    .left-side .left-wrapper .cart-text .price,
    .left-side .left-wrapper .cart-text .profit {
        font-size: 18px
    }
}

.left-side .left-wrapper .profit-text {
    color:  #46b864
}

.left-side .left-wrapper .total-cost {
    font-size: 22px;
    font-weight: 700;
    border-top: 1px solid #ddd;
    text-align: right;
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
    padding: 15px 10px 0;
    width: 100%
}

@media (max-width: 991px) {
    .left-side .left-wrapper .total-cost {
        font-size: 20px
    }
}

.error-icon {
    width: 21px;
    height: 20px;
    margin: -5px 0 0 3px
}

.table-header {
    background: #fff;
    height: 50px;
    direction: ltr;
    border-radius: 4px
}

.table-header .table-header-names {
    display: flex;
    font-size: 16px;
    font-weight: 700;
    text-align: center;
    border-bottom: solid 1px #eff0f4
}

.table-header .price-head,
.table-header .quantity-head {
    width: 130px;
    font-size: 18px;
    font-weight: 500;
    color: #aaa
}

.table-header .price-head-two {
    position: absolute;
    width: 650px;
    font-size: 18px;
    font-weight: 500;
    color: #aaa
}

.table-header .product-head {
    position: absolute;
    width: 100%;
    justify-self: flex-start;
    font-size: 18px;
    font-weight: 500;
    color: #aaa;
    text-align: right
}

.table-content .price-info {
    display: flex;
    justify-content: space-around;
    align-items: center
}

.table-content .price-info .profit-sub {
    display: flex;
    flex-direction: column;
    align-items: space-between
}

.table-content .price-info .profit-btn {
    border-radius: 30px;
    background-color:  #46b864 ;
    width: 145px;
    height: 40px;
    position: absolute;
    bottom: -18px;
    left: 60px;
    font-size: 15px;
    font-weight: 700;
    text-align: center;
    color: #fff;
    padding-top: 5px
}

.table-content .price-info .plus-btn,
.table-content .price-info .minus-btn {
    font-size: 27px;
    color:  #46b864
}

.table-content .price-info .input-val2 {
    font-size: 20px;
    font-weight: 700;
    text-align: center
}

@media (max-width: 767px) {
    .table-content .price-info .input-val2 {
        font-size: 16px
    }
}

.table-content .price-info .input-val,
.table-content .price-info .price,
.table-content .price-info .profit {
    font-size: 20px;
    font-weight: 700;
    text-align: center
}

@media (max-width: 767px) {

    .table-content .price-info .input-val,
    .table-content .price-info .price,
    .table-content .price-info .profit {
        font-size: 16px
    }
}

.table-content .price-info .profit {
    color:  #46b864
}

.table-content .price-info .mob-actions {
    margin-bottom: 0;
    margin-top: 20px
}

.table-content .product-info {
    display: flex
}

@media (max-width: 767px) {
    .table-content .product-info {
        max-width: 380px;
        justify-content: space-around !important
    }
}

.table-content .product-info .discard {
    text-align: right;
    color: #ff4966
}

.table-content .product-info .checkbox-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center
}

.table-content .product-info .x-mark-icon {
    width: 16.2px;
    height: 16.2px;
    margin: auto
}

.table-content .product-info .product-name {
    margin-right: 10px;
    max-width: 220px
}

.table-content .product-info .product-name * {
    margin: 0;
    padding: 0
}

.table-content .product-info .product-name .name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    outline: none;
    cursor: pointer;
    color: #0b1725;
    font-size: 18px;
    font-weight: 800
}

.table-content .product-info .product-name .name:hover {
    color:  #46b864
}

.table-content .product-info .product-name .product-variants {
    font-size: 14px
}

.table-content .product-info .product-name .product-variants {
    display: flex
}

.table-content .product-info .product-name .product-variants .color-variant,
.table-content .product-info .product-name .product-variants .size-variant {
    margin-left: 10px;
    display: flex;
    align-items: center
}

.table-content .product-info .product-name .product-variants .color-variant .color-ball,
.table-content .product-info .product-name .product-variants .size-variant .color-ball {
    display: inline-block;
    border-radius: 50%;
    width: 10px;
    height: 10px;
    margin-bottom: 4px
}

.table-content .product-info .image-wrap {
    cursor: pointer;
    border: 1px solid #eff0f4;
    width: 70px;
    height: 70px;
    overflow: hidden;
    display: flex;
    justify-content: center
}

.table-content .product-info .image-wrap .product-image {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain
}

.table-content .product-info .image-wrap:focus {
    outline: none
}

.table-content .checkout {
    display: flex;
    padding: 15px;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #ddd;
    z-index: 9999
}

.table-content .checkout .checkout-btn {
    font-size: 16px;
    width: 100%;
    max-width: 170px;
    height: 45px;
    color: var(--white);
    background-color:  #46b864
}

.table-content .checkout .checkout-btn:disabled {
    background-color: #aaa
}

.table-content .checkout .checkout-wrap p.profit-value {
    width: 150px;
    margin-right: 5px
}

.table-content .checkout .checkout-wrap .profit-value {
    font-size: 20px;
    color:  #46b864 ;
    margin-bottom: 0
}

.table-content .checkout .checkout-wrap .profit-value span {
    font-size: 17px
}

.table-content .checkout .checkout-wrap p.total-cost {
    width: 150px;
    margin-right: 5px
}

.table-content .checkout .checkout-wrap .total-cost {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 0
}

.table-content .checkout .checkout-wrap .total-cost span {
    font-size: 19px;
    font-weight: 500
}

.table-content .row {
    margin-top: 0
}

.input {
    width: 50px
}

#empty-cart {
    text-align: center;
    padding: 1.6rem;
    margin-top: 20px;
    height: 60vh;
    width: 100%;
}

#empty-cart p {
    margin: 20px 0;
    font-size: 28px;
    font-weight: 600;
    color: #0b1725;
    letter-spacing: normal
}

.orderBtn {
    font-size: 2rem
}

.error-wrap {
    display: flex;
    flex-direction: column
}

.error-wrap .value-message {
    color: #ff4966;
    font-size: 12px;
    margin-bottom: -18px
}

.product-image {
    width: 50px
}

.product-name {
    text-align: right
}

.product-name .name {
    font-size: 18px;
    color: #0b1725
}

.shopping-button {
    font-size: 20px;
    width: 50%;
    height: 60px;
    color: var(--white);
    background-color:  #46b864 ;
    border-radius: 30px;
    max-width: 200px
}

.request-button {
    text-align: center;
    margin-bottom: 10px
}

.splitter {
    border-left: 1px solid;
    margin: 0 15px
}

.input-val2,
.input-val {
    border: 1px solid #ddd;
    border-radius: 6px;
    width: 130px;
    height: 45px
}

.input-val2:focus {
    border-color:  #46b864
}

.input-val:focus {
    border-color:  #46b864
}

.sticky {
    position: -webkit-sticky;
    position: sticky;
    bottom: 0;
    background: var(--white)
}

mat-checkbox .mat-checkbox-layout {
    display: flex;
    flex-direction: row-reverse;
    margin: 0
}

@media (max-width: 767px) {
    .top-actions {
        padding: 15px 15px 0
    }

    .top-actions .check-select-all {
        margin-left: 0
    }

    .main-content {
        padding: 0 15px
    }

    .table-content .product-info {
        justify-content: flex-start
    }

    .table-content .product-info .image-wrap {
        min-width: 50px;
        margin-left: 0;
        margin-right: 0;
        width: 50px;
        height: 50px
    }

    .table-content .product-info .product-name {
        margin-left: 0;
        margin-right: 0
    }

    .table-content .product-info .product-name .name {
        font-size: 16px;
        margin-bottom: 0
    }

    .table-content .price-info {
        flex-direction: column;
        align-items: center
    }

    .table-content .price-info .info-wrap-mob {
        display: flex;
        flex-direction: row-reverse;
        width: 220px;
        justify-content: space-between;
        margin-top: 20px;
        align-items: center
    }

    .table-content .price-info .info-wrap-mob .profit {
        width: 100px
    }

    .input-val2 {
        width: 120px;
        height: 40px;
        margin-bottom: 30px
    }

    .input-val {
        width: 120px;
        height: 40px
    }

    .divider {
        margin-top: 15px
    }

    .main-content {
        margin-top: 16px
    }
}

@media (max-width: 1199px) {
    .input-val {
        width: 100px
    }

    .input-val2 {
        width: 50px
    }

    .table-header .price-head,
    .table-header .quantity-head {
        width: 100px
    }

    .table-content .product-info .product-name {
        max-width: 165px
    }
}

.enable-zero-profit.shopping-button {
    margin-right: 450px;
    font-size: 18px;
    width: 30%;
    height: 60px;
    color: var(--white);
    padding: 15px;
    justify-content: space-between;
    align-items: center;
    background-color:  #46b864
}

.shopping-button:hover {
    font-size: 18px;
    width: 30%;
    height: 60px;
    padding: 15px;
    justify-content: space-between;
    align-items: center;
    background-color:  #46b864 ;
    color: #000 !important;
}

.cart-step-container {
    display: flex;
    justify-content: center;
    margin-bottom: 16px
}

.cart-step {
    display: flex;
    align-items: center;
    justify-content: center
}

.cart-step-phase {
    display: block;
    padding-right: 14.32px;
    font-size: 21px;
    font-weight: 700;
    line-height: 25.2px;
    margin-bottom: 0;
    color: #aaa
}

.cart-step-phase--active {
    color:  #46b864
}

@media (max-width: 767px) {
    .cart-step-phase {
        display: none;
        padding-right: 1px;
        font-size: 15px
    }
}



.cart-arrow {
    padding-left: 55.64px;
    padding-right: 40px
}

@media (max-width: 767px) {
    .cart-arrow {
        padding-left: 25px;
        padding-right: 20px
    }
}

.container__service-unaivalibility-message {
    color: #ff4966;
    text-align: right
}



a.mat-raised-button {
    line-height: 60px;
}
.totalPrice label{
    padding:1.6rem
}
.headers{
    margin-bottom:26px;
    font-size:21px;
    font-weight:800;
    color:#0b1725
}
.delivery{
    font-size:16px;
    line-height:18px;
    margin-top:-20px;
    text-align:right
}
.orderBtn{
    font-size:2rem
}
.form-wrapper{
    margin:30px
}
label{
    margin-bottom:0;
    line-height:21px
}
.row{
    margin-top:0
}
.col{
    padding:0 8px
}
.title{
    display:flex;
    font-size:30px;
    font-weight:700;
    margin-top:50px;
    margin-bottom:30px
}
.arrow-back{
    display:flex;
    justify-content:center;
    width:30px;
    height:30px;
    cursor:pointer
}
.arrow-back img{
    height:100%;
    width:auto
}
.right-side{
    background:var(--white);
    border-radius:4px;
    text-align:right;
    padding:30px;
    font-size:18px;
    line-height:18px;
    margin-bottom:30px
}
.right-side .phone-text{
    margin-top:20px;
    font-size:18px;
    font-weight:500;
    color:#0b1725
}
.right-side .phone-text .phone-sub-text{
    font-size:16px;
    font-weight:500;
    color: #46b864
}
.right-side .phone-2{
    font-size:16px;
    font-weight:500;
    color:#aaa
}
.right-side .province{
    text-align:right
}
.right-side .select-2{
    height:45px;
    border-radius:10px;
    border:solid 1px #ddd;
    background-color:#fff
}
.right-side .textarea{
    resize:none;
    height:100px
}
.product-image{
    display:flex;
    justify-content:right;
    width:89px;
    height:83px;
    border-radius:20px;
    border:solid 1px #ddd;
    background-color:#fff;
    padding:2px 1px 3px
}
.table-element{
    margin-bottom:20px
}
.table-element .product-info{
    display:flex;
    flex-direction:row;
    justify-content:flex-start;
    text-align:right;
    align-items:center
}
.table-element .product-info .image-wrap{
    display:flex;
    justify-content:flex-start
}
.table-element .product-info .product-name{
    margin-right:10px;
    padding-left:10px;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    overflow:hidden
}
.table-element .product-info .product-name p{
    margin-bottom:0
}
.table-element .product-info .product-name .name{
    color:#0b1725;
    font-size:18px;
    font-weight:800;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis
}
.table-element .product-info .product-name .count-name{
    font-size:16px;
    font-weight:500;
    color:#aaa
}
.table-element .product-info .product-name .count-name .count{
    font-size:16px;
    font-weight:500;
    color:#0b1725
}
.table-element .product-info .product-variants{
    display:flex;
    flex-wrap:wrap;
    font-size:14px
}
.table-element .product-info .product-variants .color-variant-label, .table-element .product-info .product-variants .size-variant-label{
    color:#aaa;
    font-weight:500
}
.table-element .product-info .product-variants .color-variant, .table-element .product-info .product-variants .size-variant{
    margin-left:10px;
    display:flex;
    align-items:center
}
.table-element .product-info .product-variants .color-variant .color-ball, .table-element .product-info .product-variants .size-variant .color-ball{
    display:inline-block;
    border-radius:50%;
    width:10px;
    height:10px;
    margin-bottom:4px
}

.left-side{
    padding-right:20px
}
.left-side .left-wrapper{
    background:var(--white);
   border-radius:20px;
    /* padding:20px*/
}
.left-side .left-wrapper .left-header{
    width:100%;
    margin-bottom:25px;
    height:70px;
    padding:20px 19px;
    background-color: #46b864
}
.left-side .left-wrapper .left-header .left-header-text{
    position:center;
    width:100%;
    height:31px;
    font-size:21px;
    font-weight:700;
    text-align:center;
    color:#fff
}
.left-side .left-wrapper .order-btn{
    font-size:20px;
    width:100%;
    height:60px;
    border-radius:30px;
    color:var(--white);
    margin-top:41.7px;
    background-color: #46b864
}
.left-side .left-wrapper .order-btn:disabled{
    background-color:#ddd
}
.left-side .place-order{
    font-size:20px;
    width:100%;
    height:60px;
    color:var(--white);
    background-color: #46b864 ;
    box-shadow:none;
    margin-top:30px
}
.left-side .total-cost{
    font-size:25px;
    font-weight:700;
    padding-top:30px;
    margin-top:30px;
    border-top:1px solid #0b1725;
    text-align:right;
    display:flex;
    justify-content:space-between
}
.left-side .profit-text{
    color: #46b864 ;
    margin-bottom:30px
}
.left-side .cart-text{
    font-size:20px;
    font-weight:700;
    display:flex;
    justify-content:space-between
}
.left-side .cart-text .delivery{
    font-size:16px;
    line-height:18px;
    margin-bottom:40px;
    text-align:right
}
.left-side .cart-text .profit-text{
    color: #46b864
}
.left-side .cart-text .price, .left-side .cart-text .profit{
    font-size:20px;
    font-weight:700
}
.left-side .cart-text .products{
    text-align:right
}
.input-error{
    margin-bottom:0;
    border-color:#ff4966
}
@media (max-width: 768px){
    .title{
        margin-top:20px;
        margin-bottom:16px;
        justify-content:center
    }
    .right-side{
        margin-bottom:0
    }
    .left-side{
        padding-right:0;
        margin:10px 0
    }
    .left-side .total-cost{
        font-size:20px
    }
    .left-side .cart-text{
        font-size:18px
    }
    .left-side .place-order{
        height:50px
    }
    .left-side .cart-text .products .products-length{
        font-size:16px
    }
    .arrow-back{
        height:25px
    }
}
.enable-zero-profit{
    margin-top:31px;
    width:100%;
    height:44px;
    padding:10px;
    font-size:16px;
    color:#0b1725;
    line-height:28px
}
.enable-zero-profit:hover{
    color:#fff!important;
    background-color: #46b864
}
.bonus{
    color:#ff4966;
    margin-top:-40px;
    margin-bottom:40px
}

.form-control2 {
    display: block;
    width: 100%;
    padding: .375rem .75rem;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.app-account-dropdown {
    position: relative;
}
.box-app-account {
    align-items: flex-end;
    justify-content: flex-start;
    right: 0 !important;
    left: 0 !important;
    top: 44px !important;
    width: auto !important;
    height: auto !important;
    display: none;
}
.box-app-account a {
    display: flex;
    align-items: center;
    cursor: pointer;
}
.box-app-account a:hover {
    color: #000;
}
.user-dropdown-btn:focus {
    outline: none;
}



{
    font-size:12px
}
@media screen and (min-width: 991px){
    {
        font-size:calc(12px + 4 * ((100vw - 991px) / 929))
    }
}
@media screen and (min-width: 1920px){
    {
        font-size:16px
    }
}
 .shared-layout-container{
    display:flex;
    justify-content:center
}
 .shared-layout-container .sidebar{
    display:flex;
    flex-shrink:0;
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content;
    flex-direction:column;
    width:16.875em;
    border-radius:1.25em;
    border:1px solid #ddd;
    margin:4.375em 8.75em 0 2.5em
}
@media (max-width: 1300px){
     .shared-layout-container .sidebar{
        margin:4.375em 2.5em 0
    }
}
@media (max-width: 991px){
     .shared-layout-container .sidebar{
        display:none
    }
}
 .shared-layout-container .sidebar__button{
    border:none;
    display:flex;
    align-items:center;
    margin:.9375em;
    background-color:transparent
}
 .shared-layout-container .sidebar__button:focus{
    outline:none
}
 .shared-layout-container .sidebar__button:hover{
    cursor:pointer;
    opacity:.7
}
 .shared-layout-container .sidebar__button:disabled{
    opacity:1;
    cursor:default
}
 .shared-layout-container .sidebar__button-text{
    margin:0;
    font-weight:700;
    color:#aaa;
    font-size:1.3125em
}
 .shared-layout-container .sidebar__button-text--tab-selected{
    color: #46b864
}
 .shared-layout-container .sidebar__button-icon{
    width:3.5625em;
    height:3.5625em;
    padding:.25em;
    margin-left:1.375em
}
 .shared-layout-container .page-container{
    width:98.125em;
    overflow-x:hidden;
    margin:4.375em 2.5em 0 8.75em
}
@media (max-width: 1300px){
     .shared-layout-container .page-container{
        margin:4.375em 2.5em
    }
}
@media (max-width: 991px){
     .shared-layout-container .page-container{
        margin:0 1.40625em
    }
}
.mat-tab-header{
    display:flex;
    overflow:hidden;
    position:relative;
    flex-shrink:0
}
.mat-tab-header-pagination{
    -webkit-user-select:none;
    user-select:none;
    position:relative;
    display:none;
    justify-content:center;
    align-items:center;
    min-width:32px;
    cursor:pointer;
    z-index:2;
    -webkit-tap-highlight-color:transparent;
    touch-action:none;
    box-sizing:content-box;
    background:none;
    border:none;
    outline:0;
    padding:0
}
.mat-tab-header-pagination::-moz-focus-inner{
    border:0
}
.mat-tab-header-pagination-controls-enabled .mat-tab-header-pagination{
    display:flex
}
.mat-tab-header-pagination-before,.mat-tab-header-rtl .mat-tab-header-pagination-after{
    padding-left:4px
}
.mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-rtl .mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{
    transform:rotate(-135deg)
}
.mat-tab-header-rtl .mat-tab-header-pagination-before,.mat-tab-header-pagination-after{
    padding-right:4px
}
.mat-tab-header-rtl .mat-tab-header-pagination-before .mat-tab-header-pagination-chevron,.mat-tab-header-pagination-after .mat-tab-header-pagination-chevron{
    transform:rotate(45deg)
}
.mat-tab-header-pagination-chevron{
    border-style:solid;
    border-width:2px 2px 0 0;
    height:8px;
    width:8px
}
.mat-tab-header-pagination-disabled{
    box-shadow:none;
    cursor:default
}
.mat-tab-list{
    flex-grow:1;
    position:relative;
    transition:transform 500ms cubic-bezier(0.35, 0, 0.25, 1)
}
.mat-ink-bar{
    position:absolute;
    bottom:0;
    height:2px;
    transition:500ms cubic-bezier(0.35, 0, 0.25, 1)
}
._mat-animation-noopable.mat-ink-bar{
    transition:none;
    animation:none
}
.mat-tab-group-inverted-header .mat-ink-bar{
    bottom:auto;
    top:0
}
.cdk-high-contrast-active .mat-ink-bar{
    outline:solid 2px;
    height:0
}
.mat-tab-labels{
    display:flex
}
[mat-align-tabs=center]>.mat-tab-header .mat-tab-labels{
    justify-content:center
}
[mat-align-tabs=end]>.mat-tab-header .mat-tab-labels{
    justify-content:flex-end
}
.mat-tab-label-container{
    display:flex;
    flex-grow:1;
    overflow:hidden;
    z-index:1
}
._mat-animation-noopable.mat-tab-list{
    transition:none;
    animation:none
}
.mat-tab-label{
    height:48px;
    padding:0 24px;
    cursor:pointer;
    box-sizing:border-box;
    opacity:.6;
    min-width:160px;
    text-align:center;
    display:inline-flex;
    justify-content:center;
    align-items:center;
    white-space:nowrap;
    position:relative
}
.mat-tab-label:focus{
    outline:none
}
.mat-tab-label:focus:not(.mat-tab-disabled){
    opacity:1
}
.cdk-high-contrast-active .mat-tab-label:focus{
    outline:dotted 2px;
    outline-offset:-2px
}
.mat-tab-label.mat-tab-disabled{
    cursor:default
}
.cdk-high-contrast-active .mat-tab-label.mat-tab-disabled{
    opacity:.5
}
.mat-tab-label .mat-tab-label-content{
    display:inline-flex;
    justify-content:center;
    align-items:center;
    white-space:nowrap
}
.cdk-high-contrast-active .mat-tab-label{
    opacity:1
}
@media(max-width: 599px){
    .mat-tab-label{
        min-width:72px
    }
}
.profile-card{
    width:100%;
    background-color:#fff;
    display:flex;
    flex-direction:column;
    padding:.9375em 1.25em;
    position:relative;
    bottom:20px;
    border-radius:.375em;
    border:.0625em solid #ddd
}
.profile-card{
    font-size:12px
}
@media screen and (min-width: 768px){
    .profile-card{
        font-size:calc(12px + 6 * ((100vw - 768px) / 1152))
    }
}
@media screen and (min-width: 1920px){
    .profile-card{
        font-size:18px
    }
}
.profile-card__multitenancy-tooltip{
    background-color:#f5f5f5;
    padding:.3125em .625em;
    border-radius:5px;
    display:flex;
    width:-webkit-fit-content;
    width:-moz-fit-content;
    width:fit-content;
    align-items:center;
    margin-bottom:.9375em
}
.profile-card__multitenancy-tooltip-text{
    font-size:1.125em;
    color:#aaa;
    margin:.2222222222em 0 0;
    text-align:start
}
.profile-card__multitenancy-tooltip-icon{
    margin-left:.5em
}
.profile-card .profile-picture-loyalty-program-wrapper{
    display:flex;
    justify-content:space-between
}
.profile-card__profile-picture{
    width:3.25em;
    height:3.25em;
    background-color:#0b1725;
    border-radius:10px
}
.profile-card__loyalty-status{
    font-size:1.125em;
    padding:0 1.6666666667em;
    height:2.1666666667em;
    border-radius:10px;
    font-weight:700;
    text-align:center;
    color:#fff;
    display:flex;
    justify-content:center;
    align-items:center;
    margin:0
}
.profile-card__loyalty-status--silver{
    background-color:#aaa
}
.profile-card__loyalty-status--gold{
    background-color:#e4b779
}
.profile-card__loyalty-status--platinum{
    background-color:#8c9fb7
}
.profile-card__loyalty-status--blue{
    background-color:#298cb6
}
.profile-card__user-name{
    text-align:start;
    font-weight:700;
    color:#0b1725;
    margin:.5555555556em 0 0;
    font-size:1.125em
}
.profile-card__referral-code-wrapper{
    display:flex;
    align-items:center;
    margin-top:.625em
}
.profile-card__referral-code{
    font-size:1.125em;
    color:#aaa;
    margin:0;
    text-align:start
}
.profile-card__referral-code-icon{
    font-size:1.125em;
    color:#aaa;
    margin-right:.1666666667em
}

.app-account-shared-layout {
    font-size: calc(12px + 4 * ((100vw - 991px) / 929));
}
.mat-tab-group{
    display:flex;
    flex-direction:column;
    max-width:100%
}
.mat-tab-group.mat-tab-group-inverted-header{
    flex-direction:column-reverse
}
.mat-tab-label{
    height:48px;
    padding:0 24px;
    cursor:pointer;
    box-sizing:border-box;
    opacity:.6;
    min-width:160px;
    text-align:center;
    display:inline-flex;
    justify-content:center;
    align-items:center;
    white-space:nowrap;
    position:relative
}
.mat-tab-label:focus{
    outline:none
}
.mat-tab-label:focus:not(.mat-tab-disabled){
    opacity:1
}
.cdk-high-contrast-active .mat-tab-label:focus{
    outline:dotted 2px;
    outline-offset:-2px
}
.mat-tab-label.mat-tab-disabled{
    cursor:default
}
.cdk-high-contrast-active .mat-tab-label.mat-tab-disabled{
    opacity:.5
}
.mat-tab-label .mat-tab-label-content{
    display:inline-flex;
    justify-content:center;
    align-items:center;
    white-space:nowrap
}
.cdk-high-contrast-active .mat-tab-label{
    opacity:1
}
@media(max-width: 599px){
    .mat-tab-label{
        padding:0 12px
    }
}
@media(max-width: 959px){
    .mat-tab-label{
        padding:0 12px
    }
}
.mat-tab-group[mat-stretch-tabs]>.mat-tab-header .mat-tab-label{
    flex-basis:0;
    flex-grow:1
}
.mat-tab-body-wrapper{
    position:relative;
    overflow:hidden;
    display:flex;
    transition:height 500ms cubic-bezier(0.35, 0, 0.25, 1)
}
._mat-animation-noopable.mat-tab-body-wrapper{
    transition:none;
    animation:none
}
.mat-tab-body{
    top:0;
    left:0;
    right:0;
    bottom:0;
    position:absolute;
    display:block;
    overflow:hidden;
    outline:0;
    flex-basis:100%
}
.mat-tab-body.mat-tab-body-active{
    position:relative;
    overflow-x:hidden;
    overflow-y:auto;
    z-index:1;
    flex-grow:1
}
.mat-tab-group.mat-tab-group-dynamic-height .mat-tab-body.mat-tab-body-active{
    overflow-y:hidden
}

.mat-tab-body-content{
    height:100%;
    overflow:auto
}
.mat-tab-group-dynamic-height .mat-tab-body-content{
    overflow:hidden
}
.mat-tab-body-content[style*="visibility: hidden"]{
    display:none
}
.form-group__default-label{
    opacity:.7;
    font-size:16px;
    font-weight:600;
    text-align:center;
    color:#0b1725;
    direction:rtl;
    text-align:right;
    width:100%;
    margin-right:20px;
    margin-top:20px;
    margin-bottom:5px
}
.btn-submit{
    width:179px;
    height:38px;
    border-radius:4px;
    border:solid 1.2px  #46b864 ;
    background-color: #46b864 ;
    font-size:14px;
    font-weight:700;
    color:#fff;
    margin:20px auto
}
.btn-submit--enabled:hover{
    cursor:pointer;
    opacity:.7
}
.btn-submit--disabled{
    cursor:not-allowed;
    opacity:.7
}
.horizontal-form-group{
    display:flex
}
@media (max-width: 767px){
    .horizontal-form-group{
        display:block
    }
}
.form-group{
    margin-right:10px;
    width:100%
}
@media (max-width: 767px){
    .form-group{
        margin-right:10px;
        width:90%
    }
}
.form-control--default-input{
    border-radius:3px;
    border:solid 1px #aaa;
    width:100%;
    margin-right:10px;
    height:35px
}
.confirm-input{
    border-radius:3px;
    border:solid 1px #aaa;
    width:100%;
    margin-right:10px;
    padding:0 5px;
    height:35px
}
.confirm-input:focus{
    border-color: #46b864 ;
    outline:none
}
.block-element{
    display:block!important
}
.referred-account{
    direction:rtl;
    border-radius:.375em;
    border:.0625em solid #ddd;
    display:flex;
    flex-direction:column
}
@media (max-width: 767px){
    .referred-account{
        margin-top:20px
    }
}
.referred-account__main-header-with-button{
    display:flex;
    justify-content:space-between;
    border-bottom:solid 1px #ddd
}
.referred-account__main-header-with-button__main-header{
    display:flex;
    width:100%;
    height:25%;
    min-height:4.375em;
    border-radius:.375em;
    margin-left:.625em;
    border-bottom:solid .0625em #ddd
}
.referred-account__main-header-with-button__main-header__main-header-text-instructions{
    display:flex;
    flex-direction:column;
    align-self:center;
    text-align:start
}
.referred-account__main-header-with-button__main-header__main-header-text-instructions__sub-header{
    opacity:.5;
    font-size:1.3rem;
    text-align:right;
    color:#0b1725;
    padding-top:.3125em
}
.referred-account__main-data__referrals-main{
    display:flex;
    width:100%
}
.referred-account__main-data__referrals-main__subdiv{
    width:45%;
    height:200px;
    background-color:#f5f5f5;
    margin:20px auto
}
.referred-account__main-data__referrals-main__subdiv__mini-title{
    font-size:20px;
    margin-top:10px;
    text-align:right;
    margin-right:20px;
    color:#696969
}
.referred-account__main-data__referrals-main__subdiv__referrals-title{
    font-size:30px;
    text-align:center;
    margin-top:20px
}
.btn-referrals{
    width:6.25em;
    border-radius:.25em;
    font-size:.875em;
    font-weight:700;
    text-align:center;
    color:#fff;
    background-color:#0b1725;
    margin:auto 1.25em;
    display:block
}
@media (max-width: 767px){
    .btn-referrals{
        display:none
    }
}
.btn-referrals-mobile{
    display:none
}
@media (max-width: 767px){
    .btn-referrals-mobile{
        display:block;
        width:40%;
        height:30px;
        border-radius:4px;
        font-size:14px;
        font-weight:700;
        text-align:center;
        color:#fff;
        margin-left:30%;
        margin-right:30%;
        margin-top:10px;
        background-color:#0b1725
    }
}
.container-div{
    overflow-x:hidden;
    font-size:16px
}
.container-div .title{
    font-size:2em;
    font-weight:800;
    text-align:start;
    color:#000
}
.container-div .order-tabs-container{
    display:flex;
    justify-content:flex-start;
    margin:2em 0
}
.container-div .order-tabs-container .tab{
    outline:none;
    border:none;
    background:none;
    color:#aaa;
    font-size:1em;
    font-weight:700;
    margin-left:2.5em
}
@media (max-width: 767px){
    .container-div .order-tabs-container .tab{
        font-size:.875em;
        margin-left:.625em
    }
}
.container-div .order-tabs-container .selected-tab{
    color: #46b864 ;
    border-bottom:.125em solid
}
.container-div .main{
    direction:rtl;
    width:100%;
    min-height:56.25em;
    margin-top:2.25em
}
@media (max-width: 767px){
    .container-div .main{
        display:block;
        min-height:62.5em
    }
}
.container-div .bottom-container{
    direction:rtl;
    border-radius:.375em;
    border:.0625em solid #ddd;
    display:flex;
    flex-direction:column
}
@media (max-width: 767px){
    .container-div .bottom-container{
        margin-top:20px
    }
}
.container-div .main-header{
    display:flex;
    width:100%;
    height:25%;
    min-height:4.375em;
    border-radius:.375em;
    margin-left:.625em;
    border-bottom:solid .0625em #ddd;
    align-items: center;
    gap: 15px;
}
.container-div .main-header-text-conatiner{
    display:flex;
    flex-direction:column;
    align-self:center;
    text-align:start
}
.container-div .main-header-text-conatiner .sub-header{
    opacity:.5;
    font-size:1.3rem;
    text-align:right;
    color:#0b1725;
    padding-top:.3125em
}
.container-div label{
    opacity:.7;
    font-size:16px;
    font-weight:600;
    text-align:center;
    color:#0b1725;
    direction:rtl;
    text-align:right;
    width:100%;
    margin-right:20px;
    margin-top:20px;
    margin-bottom:5px
}
.container-div .upload-title{
    font-size:14px;
    font-weight:700;
    text-align:center;
    color:#0b1725
}
.container-div .upload-text{
    font-size:16px;
    color:#0b1725;
    padding:0
}
@media (max-width: 767px){
    .container-div .upload-text{
        padding:0 .75em
    }
}
.container-div .profile-picture{
    width:28px;
    height:28px;
    background-color:#0b1725;
    float:right;
    border-radius:10px
}
.container-div .icon-1{
    width:30px;
    height:30px
}
.container-div input{
    border-radius:3px;
    border:solid 1px #aaa;
    width:100%;
    margin-right:10px;
    height:35px
}
.container-div .confirm-input{
    border-radius:3px;
    border:solid 1px #aaa;
    width:100%;
    margin-right:10px;
    padding:0 5px;
    height:35px
}
.container-div .confirm-input:focus{
    border-color: #46b864 ;
    outline:none
}
.container-div .form-group{
    margin-right:10px;
    width:100%
}
@media (max-width: 767px){
    .container-div .form-group{
        margin-right:10px;
        width:90%
    }
}
.container-div .horizontal-form-group{
    display:flex
}
@media (max-width: 767px){
    .container-div .horizontal-form-group{
        display:block
    }
}
.container-div .upload-picture{
    width:40%;
    border-radius:35.5px;
    background-color:#eff0f4;
    direction:rtl;
    display:inline-flex;
    justify-content:space-between;
    align-items:center;
    padding:9px 10px;
    display:flex;
    margin:auto 24px 0
}
@media (max-width: 767px){
    .container-div .upload-picture{
        display:none
    }
}
.container-div .upload-picture-mobile{
    border-radius:35.5px;
    background-color:#eff0f4;
    justify-content:space-between;
    align-items:center;
    display:none;
    margin:20px auto;
    padding:11px 20px
}
@media (max-width: 767px){
    .container-div .upload-picture-mobile{
        display:flex
    }
}
.container-div .btn-submit{
    width:179px;
    height:38px;
    border-radius:4px;
    border:solid 1.2px  #46b864 ;
    background-color: #46b864 ;
    font-size:14px;
    font-weight:700;
    color:#fff;
    margin:20px auto
}
.container-div .btn-submit:hover{
    cursor:pointer;
    opacity:.7
}
.container-div .main-header-with-button{
    display:flex;
    justify-content:space-between;
    border-bottom:solid 1px #ddd
}
.container-div .btn-referrals{
    width:6.25em;
    border-radius:.25em;
    font-size:.875em;
    font-weight:700;
    text-align:center;
    color:#fff;
    background-color:#0b1725;
    margin:auto 1.25em;
    display:block
}
@media (max-width: 767px){
    .container-div .btn-referrals{
        display:none
    }
}
.container-div .btn-referrals-mobile{
    display:none
}
@media (max-width: 767px){
    .container-div .btn-referrals-mobile{
        display:block;
        width:40%;
        height:30px;
        border-radius:4px;
        font-size:14px;
        font-weight:700;
        text-align:center;
        color:#fff;
        margin-left:30%;
        margin-right:30%;
        margin-top:10px;
        background-color:#0b1725
    }
}
.container-div .referrals-main{
    display:flex;
    width:100%
}
.container-div .referrals-main .subdiv{
    width:45%;
    height:200px;
    background-color:#f5f5f5;
    margin:20px auto
}
.container-div .referrals-main .subdiv .mini-title{
    font-size:20px;
    margin-top:10px;
    text-align:right;
    margin-right:20px;
    color:#696969
}
.container-div .referrals-main .subdiv .referrals-title{
    font-size:30px;
    text-align:center;
    margin-top:20px
}
.profile-card{
    width:100%;
    background-color:#fff;
    display:flex;
    flex-direction:column;
    padding:.9375em 1.25em;
    position:relative;
    bottom:20px;
    border-radius:.375em;
    border:.0625em solid #ddd
}
.profile-card{
    font-size:12px
}
@media screen and (min-width: 768px){
    .profile-card{
        font-size:calc(12px + 6 * ((100vw - 768px) / 1152))
    }
}
@media screen and (min-width: 1920px){
    .profile-card{
        font-size:18px
    }
}
.profile-card__multitenancy-tooltip{
    background-color:#f5f5f5;
    padding:.3125em .625em;
    border-radius:5px;
    display:flex;
    width:-webkit-fit-content;
    width:-moz-fit-content;
    width:fit-content;
    align-items:center;
    margin-bottom:.9375em
}
.profile-card__multitenancy-tooltip-text{
    font-size:1.125em;
    color:#aaa;
    margin:.2222222222em 0 0;
    text-align:start
}
.profile-card__multitenancy-tooltip-icon{
    margin-left:.5em
}
.profile-card .profile-picture-loyalty-program-wrapper{
    display:flex;
    justify-content:space-between
}
.profile-card__profile-picture{
    width:3.25em;
    height:3.25em;
    background-color:#0b1725;
    border-radius:10px
}
.profile-card__loyalty-status{
    font-size:1.125em;
    padding:0 1.6666666667em;
    height:2.1666666667em;
    border-radius:10px;
    font-weight:700;
    text-align:center;
    color:#fff;
    display:flex;
    justify-content:center;
    align-items:center;
    margin:0
}
.profile-card__loyalty-status--silver{
    background-color:#aaa
}
.profile-card__loyalty-status--gold{
    background-color:#e4b779
}
.profile-card__loyalty-status--platinum{
    background-color:#8c9fb7
}
.profile-card__loyalty-status--blue{
    background-color:#298cb6
}
.profile-card__user-name{
    text-align:start;
    font-weight:700;
    color:#0b1725;
    margin:.5555555556em 0 0;
    font-size:1.125em
}
.profile-card__referral-code-wrapper{
    display:flex;
    align-items:center;
    margin-top:.625em
}
.profile-card__referral-code{
    font-size:1.125em;
    color:#aaa;
    margin:0;
    text-align:start
}
.profile-card__referral-code-icon{
    font-size:1.125em;
    color:#aaa;
    margin-right:.1666666667em
}

.mat-tab-body {
    display: none;
}
.form-group__default-label{
    opacity:.7;
    font-size:16px;
    font-weight:600;
    text-align:center;
    color:#0b1725;
    direction:rtl;
    text-align:right;
    width:100%;
    margin-right:20px;
    margin-top:20px;
    margin-bottom:5px
}
.btn-submit{
    width:179px;
    height:38px;
    border-radius:4px;
    border:solid 1.2px  #46b864 ;
    background-color: #46b864 ;
    font-size:14px;
    font-weight:700;
    color:#fff;
    margin:20px auto
}
.btn-submit--enabled:hover{
    cursor:pointer;
    opacity:.7
}
.btn-submit--disabled{
    cursor:not-allowed;
    opacity:.7
}
.horizontal-form-group{
    display:flex
}
@media (max-width: 767px){
    .horizontal-form-group{
        display:block
    }
}
.form-group{
    margin-right:10px;
    width:100%
}
@media (max-width: 767px){
    .form-group{
        margin-right:10px;
        width:90%
    }
}
.form-control--default-input{
    border-radius:3px;
    border:solid 1px #aaa;
    width:100%;
    margin-right:10px;
    height:35px
}
.confirm-input{
    border-radius:3px;
    border:solid 1px #aaa;
    width:100%;
    margin-right:10px;
    padding:0 5px;
    height:35px
}
.confirm-input:focus{
    border-color: #46b864 ;
    outline:none
}
.block-element{
    display:block!important
}
.change-password{
    direction:rtl;
    border-radius:.375em;
    border:.0625em solid #ddd;
    display:flex;
    flex-direction:column;
    margin-top: 25px;
    margin-bottom: 25px;
}
@media (max-width: 767px){
    .change-password{
        margin-top:20px
    }
}
.change-password__main-header{
    display:flex;
    width:100%;
    height:25%;
    min-height:4.375em;
    border-radius:.375em;
    margin-left:.625em;
    border-bottom:solid .0625em #ddd
}
.change-password__main-header__main-header-instructions{
    display:flex;
    flex-direction:column;
    align-self:center;
    text-align:start
}
.change-password__main-header__main-header-instructions__sub-header{
    opacity:.5;
    font-size:1.3rem;
    text-align:right;
    color:#0b1725;
    padding-top:.3125em
}

.order-filters {
    margin-bottom: 30px;
    margin-top: -27px;
    padding: 15px;
    border-radius: 15px;
    background: #EFF0F4;
}
.table-database thead th {
    background:  #46b864 ;
    color: #fff;
    text-align: center;
    padding: 16px !important;
}
.table-database thead th:first-child {
    border-radius: 0px 10px 0px 0px;
}
.table-database thead th:last-child {
    border-radius: 10px 0px 0px 0px;
}
.table-database tbody {
    text-align: center;
}
.table-database thead th , table.dataTable.no-footer {
    border-bottom: none !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    box-shadow: none;
    background:  #46b864 ;
    color: #fff !important;
    border: 1px solid rgba(0,0,0,0.1);
}
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    background: white;
}
.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_processing, .dataTables_wrapper .dataTables_paginate {
    color:  #46b864 ;
}
.bg-table {
    padding: 2px 10px;
    border-radius: 5px;
    color: #fff;
}
.bg-table.bg-wait {
    background: #00c4ff73;
}
.bg-table.bg-done {
    background: #4a7673;
}
.bg-table.bg-delivered {
    background:  #46b864 ;
}
.bg-table.bg-close {
    background: #ff123d;
}
.mat-drawer-opened {
    right: 0vh !important;
}
@media only screen and (max-width: 900px) {
    .banner-image {
        width: 100% !important;
        object-fit: cover !important;
    }
    .swiper-slide-prev {
        width: 100% !important;
    }
    .card-container .card-img img {
        object-fit: cover;
    }
    .card-container .add-to-cart-btn {
        height: 40px !important;
    }
    .product-image {
        border-radius: 0;
    }
}
.box-products {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 11px;
    width: 100%;
}
.box-product {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 150px;
    background: #b8e9e654;
    height: 118px;
    border-radius: 15px;
    border: 1px solid rgb(0 0 0 / 8%);
    box-shadow: 0px 0px 10px rgb(19 20 20 / 6%);
    color: #141414;
    font-weight: bold;
}
.signUp-container{
    display:flex;
    flex-direction:column;
    width:100%;
    align-items:center;
    justify-content:center
}
.signUp-container__header{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    margin-bottom:20px
}
@media (max-width: 767px){
    .signUp-container__header{
        flex-direction:row
    }
}
.signUp-container__header__text{
    font-size:20px;
    font-weight:700;
    color:#0f1933
}
@media (max-width: 767px){
    .signUp-container__header__text{
        font-size:16px
    }
}
.signUp-container__header__img{
    width:96px;
    height:96px;
    margin-bottom:10px
}
@media (max-width: 767px){
    .signUp-container__header__img{
        width:66px;
        height:66px
    }
}
.signUp-container__form{
    width:330px;
    text-align:center
}
.signUp-container__form__form-field{
    margin-bottom:20px
}
.signUp-container__form__form-field__danger{
    margin-left:5px
}
.signUp-container__form__form-field__error-container{
    text-align:right;
    margin-top:10px
}
.signUp-container__form__form-field__error-text{
    color:#ce0021
}
.signUp-container__form__form-field__password-container{
    position:relative;
    margin-bottom:10px
}
.signUp-container__form__form-field__password-eye{
    position:absolute;
    top:16px;
    left:16px;
    cursor:pointer
}
@media (max-width: 767px){
    .signUp-container__form__form-field__password-eye{
        left:3px
    }
}
.signUp-container__form__form-field__validation{
    text-align:right
}
.signUp-container__form__form-field__validation__text{
    margin-right:10px;
    color:#707685
}
.signUp-container__form__form-field__validation__text-error{
    margin-right:10px;
    color:#ce0021
}
.signUp-container__form__form-field__validation__text-success{
    margin-right:10px;
    color:#36a64a
}
.signUp-container__form__continue-button{
    width:100%;
    height:50px;
    color:#fff;
    background-color: #46b864 ;
    border:none;
    border-radius:9px;
    font-size:18px;
    font-weight:700;
    cursor:pointer
}
.signUp-container__form__continue-button:focus{
    outline:none
}
.signUp-container__form__continue-button:disabled{
    opacity:.3;
    cursor:not-allowed
}
.ng-invalid{
    border:1px solid #ce0021 !important;
}
input{
    border-radius:9px;
    border:solid 1px #D9DBDF;
    height:56px
}

.forgotpassword{
    display:flex;
    flex-direction:column;
    align-items:center;
    width:100%;
    margin-top:3rem
}
.forgotpassword-container{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:9px;
    width:100%
}
.forgotpassword-container form{
    display:flex;
    flex-direction:column;
    gap:9px
}
.forgotpassword-container .forgotpassword-header{
    width:100%;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:6px;
    align-items:center
}
@media (max-width: 767px){
    .forgotpassword-container .forgotpassword-header{
        flex-direction:row
    }
}
.forgotpassword-container .forgotpassword-header img{
    width:96px;
    height:96px
}
@media (max-width: 767px){
    .forgotpassword-container .forgotpassword-header img{
        width:66px;
        height:66px
    }
}
.forgotpassword-container .forgotpassword-header__heading{
    font-size:20px;
    font-weight:700;
    color:#0f1933
}
@media (max-width: 767px){
    .forgotpassword-container .forgotpassword-header__heading{
        font-size:16px
    }
}
.forgotpassword-container .forgotpassword-header__subheading{
    text-align:center
}
.forgotpassword-container .forgotpassword-actionbox{
    width:350px;
    display:flex;
    flex-direction:column;
    gap:6px;
    padding:12px;
    border-radius:10px;
    border:solid 1px #ddd;
    cursor:pointer
}
.forgotpassword-container .forgotpassword-actionbox__focused{
    border:1px solid  #46b864
}
.forgotpassword-container .forgotpassword-actionbox-button{
    display:flex;
    flex-direction:row;
    align-items:center
}
.forgotpassword-container .forgotpassword-actionbox-button__text{
    font-weight:700;
    margin-bottom:0;
    margin-right:12px;
    -webkit-user-select:none;
    -moz-user-select:none;
    user-select:none;
    font-size:20px
}
@media (max-width: 767px){
    .forgotpassword-container .forgotpassword-actionbox-button__text{
        font-size:16px
    }
}
.forgotpassword-container .forgotpassword-actionbox__input{
    border-radius:9px;
    outline:solid 1px #ddd;
    height:56px;
    padding-right:16px;
    border: 1px solid #d9dbdf;
}
.forgotpassword-container .forgotpassword-actionbox__input:focus{
    outline:solid 1px #ddd;

}
.forgotpassword-container__submit-button{
    width:350px;
    height:50px;
    color:#fff;
    background-color: #46b864;
    border:none;
    border-radius:9px;
    font-size:18px;
    font-weight:700;
    margin-top:20px;
    cursor:pointer
}
.forgotpassword-container__submit-button:focus{
    outline:none
}
.forgotpassword-container__submit-button:disabled{
    opacity:.3;
    cursor:not-allowed
}
.mat-radio-button.mat-accent .mat-radio-inner-circle, .mat-radio-ripple .mat-ripple-element:not(.mat-radio-persistent-ripple), .mat-radio-button.mat-accent.mat-radio-checked .mat-radio-persistent-ripple{
    background-color: #46b864 !important
}
.mat-radio-button{
    margin-right:auto
}
.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle{
    border-color: #46b864 !important
}