:root {
    --theme-bg: #ffcf55;
    --theme-light: #fffce6;
    scroll-behavior: smooth;
}

@font-face {
    font-family: lato;
    src: url("./Lato-Regular.ttf");
}

body {
    overflow-x: hidden;
}

body {
    font-family: lato;
    scroll-behavior: smooth;
}

.bg-theme {
    background-color: var(--theme-bg) !important;
}

body::-webkit-scrollbar {
    width: 0.9rem;
    height: 0.9rem;
}

::-webkit-scrollbar {
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 12px;
    background-color: #ededed;
}

::-webkit-scrollbar-thumb {
    border-radius: 12px;
    background-image: linear-gradient(#ffe7a4, #ff9143);
}

.scroll-w-4::-webkit-scrollbar {
    width: 9.5px;
}

.btn-theme-fill,
.btn-theme-outline,
.btn-theme-border,
.btn-theme-border-2,
.btn {
    border-radius: 8px;
    padding: 14px 24px;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 12px;
    overflow: hidden;
}

.btn-theme-fill {
    background-color: var(--theme-bg) !important;
}

.btn-theme-outline {
    border: 1px solid var(--theme-bg);
}

.btn-theme-border {
    background-image: url("../images/btn-border.png");
    background-size: 100% 100%;
}

.btn-theme-border-2 {
    background-image: url("../images/btn-border-2.png");
    background-size: 100% 100%;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px #fff inset !important;
    box-shadow: 0 0 0 30px #fff inset !important;
}

.nav-shadow {
    box-shadow: rgb(0 0 0 / 24%) 0 0px 14px 0px;
    position: sticky;
    top: 0;
    z-index: 200;
    background-color: #fff;
}

.nav-items {
    transition-duration: 0.2s;
    position: relative;
}

.nav-items:hover {
    cursor: pointer;
    color: #000 !important;
}

.nav-items::after {
    opacity: 0;
}

.nav-items:hover::after {
    opacity: 1;
    height: 5px;
}

.nav-active {
    position: relative;
    cursor: pointer;
    color: #000 !important;
}

.nav-active::after,
.nav-items::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    background-color: #333;
    border-radius: 26px;
    transition-duration: 0.2s;
}

.nav-active::after {
    opacity: 1;
    height: 5px;
}

.banner {
    background-size: cover;
    background-position: center;
    background-color: #f9f9fd;
}

.compare_ad {
    cursor: pointer;
}

.banner-14-august {
    background-image: url("../images/14-august-banner.jpg");
}

.banner-1 {
    background-image: url("../images/banner-1.jpg");
}
.banner-2 {
    background-image: url("../images/banner-2.jpg");
}
.banner-3 {
    background-image: url("../images/banner-3.jpg");
}
.banner-4 {
    background-image: url("../images/banner-4.jpg");
}
.banner-5 {
    background-image: url("../images/banner-5.jpg");
}

@media screen and (max-width: 640px) {
    .banner-1 {
        background-image: url("../images/banner-1-resp.jpg");
    }
    .banner-2 {
        background-image: url("../images/banner-2-resp.jpg");
    }
    .banner-3 {
        background-image: url("../images/banner-3-resp.jpg");
    }
    .banner-4 {
        background-image: url("../images/banner-4-resp.jpg");
    }
    .banner-5 {
        background-image: url("../images/banner-5-resp.jpg");
    }
}

.communtiy-1 {
    background-image: url("../images/community.png");
}

.swiper-buttons {
    width: fit-content !important;
}

.swiper-buttons > img {
    height: 40px;
    width: 40px;
}

.swiper-pagination-bullet-active {
    background-color: #333 !important;
}

.categories-card-shadow {
    box-shadow: 0px 1.33px 4px 0px rgb(0 0 0 / 25%);
    cursor: pointer;
    transition-duration: 0.2s;
}

.category-img {
    transition-duration: 0.3s;
    transform: scale(1);
}

.categories-card-shadow:hover .category-img {
    -webkit-animation: wobble-hor-top 0.8s both;
    animation: wobble-hor-top 0.8s both;
}

@-webkit-keyframes wobble-hor-top {
    0%,
    100% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
    }

    15% {
        -webkit-transform: translateX(-20px) rotate(6deg);
        transform: translateX(-20px) rotate(6deg);
    }

    30% {
        -webkit-transform: translateX(15px) rotate(-6deg);
        transform: translateX(15px) rotate(-6deg);
    }

    45% {
        -webkit-transform: translateX(-15px) rotate(3.6deg);
        transform: translateX(-15px) rotate(3.6deg);
    }

    60% {
        -webkit-transform: translateX(9px) rotate(-2.4deg);
        transform: translateX(9px) rotate(-2.4deg);
    }

    75% {
        -webkit-transform: translateX(-6px) rotate(1.2deg);
        transform: translateX(-6px) rotate(1.2deg);
    }
}

@keyframes wobble-hor-top {
    0%,
    100% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
    }

    15% {
        -webkit-transform: translateX(-30px) rotate(6deg);
        transform: translateX(-30px) rotate(6deg);
    }

    30% {
        -webkit-transform: translateX(15px) rotate(-6deg);
        transform: translateX(15px) rotate(-6deg);
    }

    45% {
        -webkit-transform: translateX(-15px) rotate(3.6deg);
        transform: translateX(-15px) rotate(3.6deg);
    }

    60% {
        -webkit-transform: translateX(9px) rotate(-2.4deg);
        transform: translateX(9px) rotate(-2.4deg);
    }

    75% {
        -webkit-transform: translateX(-6px) rotate(1.2deg);
        transform: translateX(-6px) rotate(1.2deg);
    }
}

.category-after::after {
    content: "";
    height: 100px;
    width: 100%;
    background-color: #e8e8e8;
    border-radius: 50%;
    position: absolute;
    top: 65%;
    left: 0;
    z-index: 1;
    transition-duration: 0.2s;
}

.categories-card-shadow:hover .hover-white,
.categories-card-shadow-active .hover-white {
    color: #fff !important;
}

.categories-card-shadow:hover,
.categories-card-shadow-active {
    background-color: #ffea9c !important;
}

.categories-card-shadow:hover.category-after::after,
.categories-card-shadow-active.category-after::after {
    background-color: #000 !important;
}

.next-cat {
    right: -50px !important;
    position: absolute;
    top: 50%;
    transform: translate(100%, -50%);
}

.prev-cat {
    left: -50px !important;
    position: absolute;
    top: 50%;
    transform: translate(-100%, -50%);
}

.category-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(4, 1fr);
    grid-gap: 18px;
}

.category-grid-1 {
    grid-area: 1 / 1 / 3 / 4;
}

.category-grid-2 {
    grid-area: 1 / 4 / 3 / 6;
}

.category-grid-3 {
    grid-area: 3 / 1 / 5 / 3;
}

.category-grid-4 {
    grid-area: 3 / 3 / 5 / 6;
}

.line-through {
    text-decoration: line-through;
}

.heart-like {
    transition-duration: 0.3s;
    font-size: 18px;
}

.heart-like-i {
    color: red !important;
    animation: heartsss 0.2s linear;
}

@keyframes heartsss {
    0% {
        transform: scale(2);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.range-slider {
    width: 100%;
}

.range-slider__range {
    -webkit-appearance: none;
    width: calc(100% - (73px));
    height: 10px;
    border-radius: 5px;
    background: #000000;
    outline: none;
    padding: 0;
    margin: 0;
}

.range-slider__range::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #ffcf55;
    cursor: pointer;
    -webkit-transition: background 0.15s ease-in-out;
    transition: background 0.15s ease-in-out;
}

.range-slider__range::-moz-range-thumb {
    width: 20px;
    height: 20px;
    border: 0;
    border-radius: 50%;
    background: #ffcf55;
    cursor: pointer;
    -moz-transition: background 0.15s ease-in-out;
    transition: background 0.15s ease-in-out;
}

.range-slider__range::-moz-range-thumb:hover {
    background: #1abc9c;
}

.range-slider__range:active::-moz-range-thumb {
    background: #1abc9c;
}

.range-slider__range:focus::-webkit-slider-thumb {
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px #ffcf55;
}

.range-slider__value {
    display: inline-block;
    position: relative;
    width: 60px;
    color: #fff;
    line-height: 20px;
    text-align: center;
    border-radius: 3px;
    background: #2c3e50;
    padding: 5px 10px;
    margin-left: 8px;
}

.range-slider__value:after {
    position: absolute;
    top: 8px;
    left: -7px;
    width: 0;
    height: 0;
    border-top: 7px solid transparent;
    border-right: 7px solid #2c3e50;
    border-bottom: 7px solid transparent;
    content: "";
}

::-moz-range-track {
    background: #d7dcdf;
    border: 0;
}

input::-moz-focus-inner,
input::-moz-focus-outer {
    border: 0;
}

.shadow-featured {
    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px,
        rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
}

.hover-featured {
    border: 2px solid transparent;
    transition-duration: 0.3s;
}

.hover-featured-active {
    border: 2px solid #5d5d5d;
    background-color: #f9f9fd;
}

body:has(.hover-featured-active) .Payment {
    display: block !important;
}

.payment-toggle-active {
    border: 2px solid #ababad;
}

.slider-sm-slides {
    cursor: pointer;
}

.bg-p-50 {
    background-position: 50%;
}

.after-triangle::after {
    content: "";
    position: absolute;
    height: 100%;
    bottom: 0;
    top: 0;
    border-left: 24px solid #2c2121bf;
    border-right: 3rem solid transparent;
    border-bottom: 3rem solid transparent;
    left: 100%;
}

.after-and-before-img::after,
.after-and-before-img::before {
    content: "";
    background-color: #eff2fb;
}

.circle-after-img::after {
    content: "";
    height: 100%;
    width: 250px;
    position: absolute;
    right: 0;
    background-position: left;
    background-size: cover;
}

.categories-ellipsis {
    width: 10ch;
    margin: auto;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.swiper-button-next,
.swiper-rtl .swiper-button-prev {
    right: 30px !important;
}

.swiper-button-prev,
.swiper-rtl .swiper-button-next {
    left: 30px !important;
}

.swiper-slide-thumb-active {
    filter: brightness(0.5);
}

.line-clamp-4,
.line-clamp-1,
.line-clamp-3 {
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-4 {
    -webkit-line-clamp: 4;
}

.line-clamp-1 {
    -webkit-line-clamp: 1;
}

.line-clamp-3 {
    -webkit-line-clamp: 3;
}

.shadow-chat-head {
    box-shadow: 2px -2px 18px 1px rgb(0 0 0 / 54%);
}

.dashboard-tab {
    transition-duration: 0.2s;
    border-radius: 7px;
    color: #5d5d5d;
}

.dashboard-tab svg,
.dashboard-tab path,
.dashboard-tab rect {
    fill: #5d5d5d;
}

.dashboard-tab-active rect,
.dashboard-tab-active path,
.dashboard-tab-active svg {
    fill: #fff;
}

.dashboard-tab:hover {
    background-color: rgb(235, 235, 235);
}

.dashboard-tab,
.dashboard-tab-active {
    cursor: pointer;
}

.dashboard-tab-active {
    background-color: #000 !important;
    color: #fff !important;
}

.shadow-dashboard-chat {
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.appointment-tab {
    color: #666666;
    cursor: pointer;
    white-space: nowrap;
}

.appointment-tab-active {
    color: #000;
    position: relative;
}

.appointment-tab-active::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background-color: var(--theme-bg);
    border-radius: 12px;
}

.my-ads-grid-cols {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

[aria-current="page"] > span {
    background-color: var(--theme-bg);
    color: #000;
}

.custom-tab {
    cursor: pointer;
}

.radio-select-active {
    border: 1px solid #31d9d9;
}

.dropdown-body {
    display: none;
    z-index: 201;
}

.dropdown-opener:hover > .dropdown-body {
    display: block;
}

.range-slider-js[type="range"][multiple] {
    display: block;
    height: 2em;
    margin: 0;
    pointer-events: none;
}

.range-slider-js[type="range"][multiple]
    + .range-slider-js[type="range"][multiple] {
    margin-top: -2em;
}

.range-slider-js[type="range"]::-webkit-slider-thumb {
    pointer-events: all;
}

.range-slider-js[type="range"]::-moz-range-thumb {
    pointer-events: all;
}

.range-slider-js[type="range"]::-ms-thumb {
    pointer-events: all;
}

.multi-slider {
    display: inline-block;
    min-width: 120px;
    color: rgba(0, 0, 0, 0.87);
    font-size: 14px;
    line-height: 20px;
    width: 100%;
}

.multi-slider > .range-slider-js {
    display: block;
    -webkit-appearance: none;
    margin: 0;
    width: 100%;
    height: 36px;
    background-color: transparent;
    cursor: pointer;
}

.multi-slider > .range-slider-js:focus {
    outline: none;
}

.multi-slider > .range-slider-js:disabled {
    cursor: default;
}

/* Webkit */
.multi-slider > .range-slider-js::-webkit-slider-runnable-track {
    margin: 17px 0;
    border-radius: 1px;
    width: 100%;
    height: 3px;
    /* background-color: var(--pure-material-primary24a, rgba(33, 150, 243, 0.24)); */
    background-color: #31d9d9;
}

.multi-slider > .range-slider-js:disabled::-webkit-slider-runnable-track {
    background-color: #31d9d9;
}

.multi-slider > .range-slider-js::-webkit-slider-thumb {
    appearance: none;
    -webkit-appearance: none;
    border: none;
    border-radius: 50%;
    height: 3px;
    width: 3px;
    background-color: rgb(49, 217, 217);
    transform: scale(6, 6);
    transition: box-shadow 0.2s;
}

.multi-slider > .range-slider-js:hover::-webkit-slider-thumb,
.multi-slider > .range-slider-js:focus::-webkit-slider-thumb {
    box-shadow: 0 0 0 2px rgba(49, 217, 217, 0.3);
}

.multi-slider > .range-slider-js:active::-webkit-slider-thumb {
    box-shadow: 0 0 0 2px rgba(49, 217, 217, 0.3);
}

.multi-slider > .range-slider-js:disabled::-webkit-slider-thumb {
    background-color: #31d9d9;
    box-shadow: 0 0 0 1px rgba(49, 217, 217, 0.3);
    transform: scale(4, 4);
}

/* Moz */
.multi-slider > .range-slider-js::-moz-range-track {
    margin: 17px 0;
    border-radius: 1px;
    width: 100%;
    height: 3px;
    background-color: rgba(49, 217, 217, 0.3);
}

.multi-slider > .range-slider-js:disabled::-moz-range-track {
    background-color: rgba(49, 217, 217, 0.3);
}

.multi-slider > .range-slider-js::-moz-range-progress {
    border-radius: 1px;
    height: 3px;
    background-color: #31d9d9;
}

.multi-slider > .range-slider-js:disabled::-moz-range-progress {
    background-color: #31d9d9;
}

.multi-slider > .range-slider-js::-moz-range-thumb {
    appearance: none;
    -moz-appearance: none;
    border: none;
    border-radius: 50%;
    height: 3px;
    width: 3px;
    background-color: #31d9d9;
    transform: scale(6, 6);
    transition: box-shadow 0.2s;
}

.multi-slider > .range-slider-js:hover::-moz-range-thumb,
.multi-slider > .range-slider-js:focus::-moz-range-thumb {
    box-shadow: 0 0 0 2px rgba(49, 217, 217, 0.3);
}

.multi-slider > .range-slider-js:active::-moz-range-thumb {
    box-shadow: 0 0 0 2px rgba(49, 217, 217, 0.3);
}

.multi-slider > .range-slider-js:disabled::-moz-range-thumb {
    background-color: #31d9d9;
    box-shadow: 0 0 0 1px rgba(49, 217, 217, 0.3);
    transform: scale(4, 4);
}

.multi-slider > .range-slider-js::-moz-focus-outer {
    border: none;
}

/* MS */
.multi-slider > .range-slider-js::-ms-track {
    box-sizing: border-box;
    margin: 17px 0;
    border: none;
    border-radius: 1px;
    padding: 0 17px;
    width: 100%;
    height: 3px;
    background-color: transparent;
}

.multi-slider > .range-slider-js::-ms-fill-lower {
    border-radius: 1px;
    height: 3px;
    background-color: rgba(49, 217, 217, 0.3);
}

.multi-slider > .range-slider-js:disabled::-ms-fill-lower {
    background-color: rgba(49, 217, 217, 0.3);
}

.multi-slider > .range-slider-js::-ms-fill-upper {
    border-radius: 1px;
    height: 3px;
    background-color: rgba(49, 217, 217, 0.3);
}

.multi-slider > .range-slider-js:disabled::-ms-fill-upper {
    background-color: rgba(49, 217, 217, 0.3);
}

.multi-slider > .range-slider-js::-ms-thumb {
    appearance: none;
    margin: 0 17px;
    border: none;
    border-radius: 50%;
    height: 3px;
    width: 3px;
    background-color: rgba(49, 217, 217, 0.3);
    transform: scale(6, 6);
    transition: box-shadow 0.2s;
}

.multi-slider > .range-slider-js:hover::-ms-thumb,
.multi-slider > .range-slider-js:focus::-ms-thumb {
    box-shadow: 0 0 0 2px rgba(49, 217, 217, 0.3);
}

.multi-slider > .range-slider-js:active::-ms-thumb {
    box-shadow: 0 0 0 2px rgba(49, 217, 217, 0.3);
}

.multi-slider > .range-slider-js:disabled::-ms-thumb {
    background-color: rgba(49, 217, 217, 0.3);
    box-shadow: 0 0 0 1px rgba(49, 217, 217, 0.3);
    transform: scale(4, 4);
}

.mobile-nav-items {
    transition-duration: 0.3s;
    cursor: pointer;
    border-left: 5px solid;
    border-left-color: transparent;
}

.mobile-nav-items:hover,
.mobile-nav-items-active {
    background-color: #f5f5f5;
    border-left-color: #333;
}

.collapse-body {
    transition: transform 0.26s ease;
    transform-origin: top;
}

.accordion-button:not(.collapsed) {
    color: #000 !important;
    font-weight: 600;
}

.accordion-button:not(.collapsed):after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 01.708 0L8 10.293l5.646-5.647a.5.5 0 01.708.708l-6 6a.5.5 0 01-.708 0l-6-6a.5.5 0 010-.708z'/%3E%3C/svg%3E") !important;
}

.input-color-container {
    position: relative;
    overflow: hidden;
    width: 40px;
    height: 40px;
    border: solid 2px #ddd;
    border-radius: 40px;
}

.input-color {
    position: absolute;
    right: -8px;
    top: -8px;
    width: 56px;
    height: 56px;
    border: none;
}

.color-selected::after {
    content: "\f00c";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    height: 50%;
    width: 50%;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.541);
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    font-size: 10px;
}

.product-detail-img::before {
    content: "";
    height: 100%;
    width: 100%;
    left: 0;
    border-radius: 12px;
    top: 0;
    position: absolute;
    background-size: cover;
    background-repeat: no-repeat;
    filter: blur(15px);
}

.box-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    padding: 2.188rem 0;
    width: 100%;
}

.box-item {
    position: relative;
    -webkit-backface-visibility: hidden;
    max-width: 100%;
    width: 100%;
}

.flip-box {
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    perspective: 1000px;
    -webkit-perspective: 1000px;
}

.flip-box-front,
.flip-box-back {
    background-size: cover;
    background-position: center;
    border-radius: 25px;
    min-height: 11rem;
    -ms-transition: transform 0.5s cubic-bezier(0.4, 0.2, 0.2, 1);
    transition: transform 0.5s cubic-bezier(0.4, 0.2, 0.2, 1);
    -webkit-transition: transform 0.5s cubic-bezier(0.4, 0.2, 0.2, 1);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.flip-box-front {
    -ms-transform: rotateY(0deg);
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
    -webkit-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.flip-box:hover .flip-box-front {
    -ms-transform: rotateY(-180deg);
    -webkit-transform: rotateY(-180deg);
    transform: rotateY(-180deg);
    -webkit-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.flip-box-back {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;

    -ms-transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
    -webkit-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.flip-box:hover .flip-box-back {
    -ms-transform: rotateY(0deg);
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
    -webkit-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.flip-box .inner {
    position: absolute;
    left: 0;
    width: 100%;
    padding: 0 20px;
    outline: 1px solid transparent;
    -webkit-perspective: inherit;
    perspective: inherit;
    z-index: 2;
    transform: translateY(-50%) translateZ(60px) scale(0.94);
    -webkit-transform: translateY(-50%) translateZ(60px) scale(0.94);
    -ms-transform: translateY(-50%) translateZ(60px) scale(0.94);
    top: 53%;
}

.flip-box p {
    font-size: 20px;
    line-height: 1.5em;
}

.flip-box-img {
    margin-top: 25px;
}

.prev-cat > svg,
.next-cat > svg {
    cursor: pointer;
}

.prev-cat:hover > svg,
.next-cat:hover > svg {
    fill: #000;
}

.prev-cat:hover > svg > path,
.next-cat:hover > svg > path {
    fill: white;
}

.swiper-button-prev:hover > svg,
.swiper-button-next:hover > svg {
    border: 2px solid #000;
}

.swiper-button-prev > svg,
.swiper-button-next > svg {
    border: 2px solid transparent;
    border-radius: 50%;
}

.swiper-button-prev:hover > svg > circle,
.swiper-button-next:hover > svg > circle {
    fill: transparent;
}

.swiper-button-prev:hover > svg > path,
.swiper-button-next:hover > svg > path {
    fill: #000;
}

.bounce-in-top {
    -webkit-animation: bounce-in-top 1.1s both;
    animation: bounce-in-top 1.1s both;
}

/* ----------------------------------------------
 * Generated by Animista on 2022-7-26 16:37:35
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info.
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation bounce-in-top
 * ----------------------------------------
 */
@-webkit-keyframes bounce-in-top {
    0% {
        -webkit-transform: translateY(-500px);
        transform: translateY(-500px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }

    38% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        opacity: 1;
    }

    55% {
        -webkit-transform: translateY(-65px);
        transform: translateY(-65px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    72% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    81% {
        -webkit-transform: translateY(-28px);
        transform: translateY(-28px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    90% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    95% {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}

@keyframes bounce-in-top {
    0% {
        -webkit-transform: translateY(-500px);
        transform: translateY(-500px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }

    38% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        opacity: 1;
    }

    55% {
        -webkit-transform: translateY(-65px);
        transform: translateY(-65px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    72% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    81% {
        -webkit-transform: translateY(-28px);
        transform: translateY(-28px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    90% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    95% {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}

.fade-out-top {
    -webkit-animation: fade-out-top 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94)
        both;
    animation: fade-out-top 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}

/* ----------------------------------------------
 * Generated by Animista on 2022-7-26 16:38:7
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info.
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation fade-out-top
 * ----------------------------------------
 */
@-webkit-keyframes fade-out-top {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
        opacity: 0;
    }
}

@keyframes fade-out-top {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
        opacity: 0;
    }
}

.fade:not(.show) {
    display: none;
}

.featured-doctor {
    position: relative;
    border: 4px solid #ffcf55;
    width: fit-content;
    margin: auto;
    border-radius: 50%;
}

.featured-doctor::after {
    content: "\f005";
    position: absolute;
    top: 0;
    right: 0;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    color: white;
    background-color: #ffcf55;
    border-radius: 50%;
    height: 30px;
    width: 30px;
    font-size: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.meetvet-banner-1 {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
        url("../images/meet-vet-banner-3.jpg");
}

.meetvet-banner-2 {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
        url("../images/meet-vet-banner-2.jpg");
}

.meetvet-banner-3 {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
        url("../images/meet-vet-banner-1.jpg");
}

.join-vet-banner {
    transition-duration: 0.3s;
    cursor: pointer;
}

.join-vet-banner:hover,
.join-vet-banner-active {
    border-color: #31d9d9;
    backdrop-filter: blur(16px);
    background-color: #435259;
}

.hover-delete {
    position: relative;
}

.hover-delete:hover::after {
    display: flex;
}

.hover-delete::after {
    content: "\f00d";
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;
    position: absolute;
    top: 50%;
    right: 50%;
    font-size: 20px;
    cursor: pointer;
    height: 30px;
    width: 30px;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    background-color: white;
    color: red;
    display: none;
    transform: translate(50%, -50%);
}

.swiper-button-disabled {
    opacity: 0.5;
    cursor: default;
}

.swiper-button-disabled:hover > svg > circle,
.swiper-button-disabled:hover > svg > circle {
    fill: none;
}

.swiper-button-disabled:hover > svg > path,
.swiper-button-disabled:hover > svg > path {
    fill: #000;
}

.preloader {
    position: fixed;
    inset: 0;
    z-index: 100000000;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: white;
    text-align: center;
}

.preloader h3 {
    font-size: 1.6rem;
    background: linear-gradient(
        to right,
        rgb(0, 0, 0) 20%,
        rgb(255, 255, 255) 40%,
        #000 60%,
        #fff 80%
    );
    background-size: 200% auto;
    color: #000;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-animation: shine 1s linear infinite;
    animation: shine 1s linear infinite;
    font-weight: 800;
}

@-webkit-keyframes shine {
    to {
        background-position: 200% center;
    }
}

@keyframes shine {
    to {
        background-position: 200% center;
    }
}

.preloader img {
    height: 150px;
}

.ck-editor__editable_inline {
    min-height: 15rem;
}

.ck.ck-editor__main > .ck-editor__editable {
    background-color: #f9f9fd !important;
}

.clinic-name-after {
    position: relative;
}

.clinic-name-after::after {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.4;
    background-color: #000;
}

.reset-filters-btn {
    cursor: pointer;
}

.visibility-hidden {
    visibility: hidden;
}

.card-hover {
    transition-duration: 0.2s;
}

.card-hover:hover {
    transform: scale(1.05);
}

.cat-slider-slide {
    height: 7.938rem;
    width: 7.938rem;
    margin: auto;
}

.category-img {
    height: 3rem;
    width: 3rem;
}

.categories-swipper-parent {
    margin: auto;
}

.bounce-top {
    transition-duration: 0.3s;
    border: 2px solid transparent;
}

.bounce-top:hover {
    background-color: white;
    border: 2px solid #000;
    color: #000;
}

.compared {
    fill: #8e8e8e;
}

/*
option:disabled {
    color:#5d5d5d;
  } */

.select_doctor {
    cursor: pointer;
}

.selected_doctor {
    border: 1px solid rgb(52, 180, 52);
    background-color: #f5fff5 !important;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
}

/* Firefox */
input[type="number"] {
    -moz-appearance: textfield !important;
}

.about-us-list-style-img {
    list-style-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10.061' height='7.5908' viewBox='0 0 10.061 7.5908'%3E%3Cpolygon points='3.53 7.591 0 4.061 1.061 3 3.53 5.47 9 0 10.061 1.061 3.53 7.591' fill='cornflowerblue'/%3E%3C/svg%3E");
    list-style-position: inside;
}

.contact-us-bottom-line {
    position: relative;
    width: fit-content;
    margin: auto;
}

.contact-us-bottom-line::after {
    content: "";
    position: absolute;
    height: 3px;
    width: 40%;
    background-color: #000000;
    border-radius: 52px;
    top: calc(100% + 4px);
    left: 50%;
    transform: translateX(-50%);
}

.form-check-input:checked {
    background-color: #31d8d8 !important;
    border-color: #31d8d8 !important;
}

.tox-notifications-container {
    display: none;
}

i.fas.fa-heart {
    font-size: 1.3rem;
}

.capabilities_added {
    position: relative;
}

.flag-text {
    margin-left: 10px;
}

.select2-search__field,
.select2-selection__rendered {
    outline: none;
}

.iti.iti--allow-dropdown {
    width: 100%;
}

.swiper-pagination-bullet {
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}
.swiper-pagination-bullet-active {
    width: 2rem !important;
    border-radius: 3rem !important;
}

.left_arrow_before {
    position: relative;
    width: fit-content;
    margin: auto;
}

.left_arrow_before::before {
    content: "";
    cursor: pointer;
    position: absolute;
    left: -20px;
    transform: translateX(-50%) translateY(-80%);
    height: 24px;
    width: 24px;
    top: 50%;
    background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.875 19.2996L4.27502 12.6996C4.17502 12.5996 4.10402 12.4912 4.06202 12.3746C4.02002 12.2579 3.99935 12.1329 4.00002 11.9996C4.00002 11.8662 4.02102 11.7412 4.06302 11.6246C4.10502 11.5079 4.17568 11.3996 4.27502 11.2996L10.875 4.69957C11.0583 4.51624 11.2877 4.42057 11.563 4.41257C11.8383 4.40457 12.0757 4.50024 12.275 4.69957C12.475 4.88291 12.5793 5.11224 12.588 5.38757C12.5967 5.66291 12.5007 5.90024 12.3 6.09957L7.40002 10.9996H18.575C18.8583 10.9996 19.096 11.0956 19.288 11.2876C19.48 11.4796 19.5757 11.7169 19.575 11.9996C19.575 12.2829 19.4793 12.5206 19.288 12.7126C19.0967 12.9046 18.859 13.0002 18.575 12.9996H7.40002L12.3 17.8996C12.4833 18.0829 12.5793 18.3162 12.588 18.5996C12.5967 18.8829 12.5007 19.1162 12.3 19.2996C12.1167 19.4996 11.8833 19.5996 11.6 19.5996C11.3167 19.5996 11.075 19.4996 10.875 19.2996Z" fill="%23000"/></svg>');
    background-position: center;
}

body:has(.Allergy__yes input:not(:checked)) .Allergy_inppp {
    display: none !important;
}

body:has(.Treatment__yes input:not(:checked)) .Treatment_inppp {
    display: none !important;
}

.dropdown-body-css {
    background-color: white;
    position: absolute;
    left: 0;
    top: 100%;
    border-radius: 0.5rem /* 8px */;
    --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color),
        0 1px 2px -1px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
        var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    width: max-content;
    padding-top: 0.5rem /* 8px */;
    padding-bottom: 0.5rem /* 8px */;
}
.dropdown-opener-css {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding-top: 0.25rem /* 4px */;
    padding-bottom: 0.25rem /* 4px */;
    padding-left: 0.75rem /* 12px */;
    padding-right: 0.75rem /* 12px */;
    position: relative;
    transition-property: color, background-color, border-color,
        text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
    color: rgb(80 80 80);
}

.dropdown-opener-css:hover {
    color: black;
    background-color: #ecebeb;
}

.dropdown-body-child-css {
    background-color: white;
    position: absolute;
    left: 100%;
    top: 0;
    max-height: 10rem;
    overflow-x: auto;
    border-radius: 0.5rem /* 8px */;
    --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color),
        0 1px 2px -1px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
        var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    width: max-content;
    padding-top: 0.5rem /* 8px */;
    padding-bottom: 0.5rem /* 8px */;
}

.current_country__.loading{
    height: 3ch;
    width: 12ch;
    border-radius:0.3rem;
    animation-duration: 2.2s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: shimmer;
    animation-timing-function: linear;
    background: #ddd;
    background: linear-gradient(to right, #F6F6F6 8%, #F0F0F0 18%, #F6F6F6 33%);
    background-size: 1200px 100%;
}

@keyframes shimmer {
    0% {
        background-position: -1200px 0;
    }
    100% {
        background-position: 1200px 0;
    }
}
.select2-container--open{
    z-index: 1211;
}