/* webfonts */

@font-face {
    font-family: "OpenSans";
    src: url("../fonts/OpenSans-Regular.woff2") format("woff2"),
        url("../fonts/OpenSans-Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "OpenSans";
    src: url("../fonts/OpenSans-Medium.woff2") format("woff2"),
        url("../fonts/OpenSans-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "OpenSans";
    src: url("../fonts/OpenSans-Light.woff2") format("woff2"),
        url("../fonts/OpenSans-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "OpenSans";
    src: url("../fonts/OpenSans-Bold.woff2") format("woff2"),
        url("../fonts/OpenSans-Bold.woff") format("woff");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "OpenSans";
    src: url("../fonts/OpenSans-ExtraBold.woff2") format("woff2"),
        url("../fonts/OpenSans-ExtraBold.woff") format("woff");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "OpenSans";
    src: url("../fonts/OpenSans-SemiBold.woff2") format("woff2"),
        url("../fonts/OpenSans-SemiBold.woff") format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

/* webfonts end */

:root {
    --primary-color: linear-gradient(90deg, #9333ea 0%, #db2777 100%);
    --secondary-color: #222227;
    --white: #fff;
    --black: #000;
    --gray-balck: #222227;
    --border-color: #e8e8e8;
    --text-color: #5c5c5c;
    --heading-color: #272643;
    --border-color: #ebebed;
    --gray-color: #727272;
    --sec-black: #101012;
}

html {
    margin: 0;
}

body {
    font-family: "OpenSans";
    overflow-x: hidden;
    color: var(--secondary-color);
}
main {
    position: relative;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    white-space: normal;
    word-break: break-word;
    font-family: "OpenSans";
    font-weight: 700;
    line-height: 1.1;
    color: var(--heading-color);
}

h1 {
    font-size: 80px;
}
h2 {
    font-size: 35px;
}

h3 {
    font-size: 22px;
}

h4 {
    font-size: 16px;
}

a,
p,
button,
span {
    white-space: normal;
    word-break: break-word;
}

a {
    text-decoration: none !important;
    display: inline-block;
    color: var(--secondary-color);
}
a:hover {
    color: unset;
}
a:focus-visible {
    outline: transparent;
}
.page-link:focus {
    box-shadow: none;
}
.file > input[type="file"] {
    display: none;
}
p {
    font-size: 16px;
    margin: 0;
}
/* header {
    position: sticky;
    top: 0;
    z-index: 999;
} */

ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

button:focus {
    box-shadow: none !important;
    outline: transparent;
}
.btn-check:focus + .btn,
.btn:focus {
    outline: 0;
    box-shadow: unset;
}
.form-control:focus,
input {
    outline: 0;
}

.formfield {
    position: relative;
    width: 100%;
    
}

img {
    max-width: 100%;
}
.form-control {
    min-height: 58px;
    background-color: #2f2f35;
    border: 1px solid transparent;
    padding: 14px 25px;
    border-radius: 5px;
    font-size: 14px;
    color: var(--white);
    appearance: none;
    resize: none;
    &:focus {
        background-color: #2f2f35;
        color: var(--white);
    }
    &::placeholder {
        color: var(--white);
    }
}

.form-control:disabled, .form-control[readonly] {
    color: #ffffff !important;
    background-color: #2f2f35;
    opacity: 0.5;
    cursor: not-allowed;
}

.form-group {
    margin: 0 0 15px;
}
.form-icon {
    position: absolute;
    right: 23px;
    top: 17px;
    display: flex;
    width: 25px;
    height: 25px;
    align-items: center;
    justify-content: center;
}

.underline-text {
    text-decoration: underline !important;
    font-weight: 400;
    color: var(--white);
    &:hover {
        color: #fff;
    }
}
.button {
    min-height: 60px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border: 0px solid transparent;
    border-radius: 5px;
    transition: all 0.3s ease;
    font-size: 18px;
    line-height: 25px;
    font-weight: 700;
    padding: 0px 30px;
    max-width: fit-content;
    width: 100%;
    &:hover {
        scale: 0.9;
    }
}
.button span {
    display: flex;
}
.primary-btn {
    background: var(--primary-color);
    color: #ffff;
    &:hover {
        color: #fff;
    }
}
.full-btn {
    width: 100%;
    max-width: 100%;
}
.light-btn {
    background-color: var(--secondary-color);
    color: var(--primary-color);
    &:hover {
        border-color: var(--primary-color);
    }
}
.container {
    max-width: 1640px;
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
}
.form-control:focus {
    border-color: unset;
    outline: 0;
    box-shadow: unset;
}

/* Custom scrollbar styles */
::-webkit-scrollbar {
    width: 8px; /* Width of the scrollbar */
    border-left: 1px solid #fff;
}

/* Scrollbar track */
::-webkit-scrollbar-track {
    background: #1e1e2f; /* Matches the page background */
    width: 4px;
}

/* Scrollbar thumb */
::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #ff007c, #8000ff); /* Gradient color */
    border-radius: 10px; /* Rounded corners */
}

/* Scrollbar thumb on hover */
::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(
        180deg,
        #ff4da6,
        #a64dff
    ); /* Brighter gradient on hover */
}
/* ===================== navbar CSS ==========================  */
nav.navbar.navbar-expand-lg.navbar-light.bg-light {
    padding: 20px 0;
    background-color: var(--black);
}
.nav-dropdown .dropdown .dropdown-toggle {
    background: linear-gradient(90deg, #9333ea 0%, #db2777 100%);
    min-height: 55px;
    padding: 7px 20px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.nav-dropdown .dropdown .dropdown-toggle::after {
    display: none;
}
.nav-dropdown-profile {
    width: 40px;
    height: 40px;
    min-width: 40px;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid #fff;
}
.nav-dropdown-profile img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.nav-dropdown .dropdown .dropdown-toggle p {
    color: #fff;
    font-size: 18px;
    line-height: 25px;
    display: inline-block;
    max-width: 6em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.nav-dropdown .dropdown .dropdown-menu {
    width: 100%;
    background: linear-gradient(180deg, #d7277d 0%, #9e31d8 100%);
    padding: 1px;
    border-radius: 12px;
    min-width: 218px;
}
.nav-dropdown .dropdown .dropdown-menu ul {
    background-color: #222227;
    border-radius: 12px;
    padding: 25px 0;
}
.nav-dropdown .dropdown-item {
    display: flex;
    gap: 15px;
    align-items: center;
}
.nav-dropdown .dropdown .dropdown-menu ul li + li {
    margin-top: 15px;
}
.nav-dropdown .dropdown-item p {
    color: #fff;
    text-transform: capitalize;
}
.nav-dropdown hr {
    background-color: #f2f2f2;
    margin: 20px 25px;
}

.navbar-right .dropdown-menu {
    margin-top: 22px;
}

.dropdown-menu-right {
    left: auto !important;
    right: 0;
}
.nav-logout-btn {
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(90deg, #9333ea 0%, #db2777 100%);
    min-height: 37px;
    padding: 5px 10px;
    min-width: 90px;
    margin: 0 auto;
    display: block;
    text-align: center;
}
.nav-dropdown .dropdown-item:focus,
.nav-dropdown .dropdown-item:hover {
    color: #1e2125;
    background-color: unset;
    background: linear-gradient(90deg, #9333ea 0%, #db2777 100%);
}
.navbar-right {
    display: flex;
    align-items: center;
    gap: 23px;
}
.notify-dropdown .dropdown-toggle::after {
    display: none;
}

/* ===================== navbar CSS ==========================  */

.flex-end-div {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 20px;
}
.flex-center-div {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
}

.register-card > p {
    color: #fff;
    text-align: center;
    margin: 0 0 25px;
    opacity: 0.7;
}
.form-control.is-invalid,
.was-validated .form-control:invalid {
    background-image: unset !important;
}
.form-check .form-check-input {
    pointer-events: all !important;
}
.db-profile-info {
    width: 100%;
}
.db-profile-info .bio-profile-head {
    display: flex;
    justify-content: space-between;
}
.db-profile-info .bio-icon-name {
    display: flex;
    align-items: flex-start;
    gap: 15px;
}
.db-profile-info
    .bio-profile-head
    .linear-gredient-btn
    .linear-gredient-inner
    p {
    font-size: 18px;
}
.bio-content-para {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: calc(100% - 15px);
}
.pro-slider .swiper-wrapper {
    height: fit-content;
}
.pro-slider .swiper-wrapper img, .pro-slider .swiper-wrapper video {
    height: 637px;
}


/* datePicker */

.ui-datepicker {
    background: #fff;
    border: 1px solid #ccc;
    padding: 10px;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.ui-datepicker-header {
    background: #f0f0f0;
    border: none;
    font-weight: bold;
}
.ui-datepicker-calendar td a {
    text-align: center;
    padding: 5px;
    color: #333;
}

/* end datepicker css */

.veriff-description {
    display: none;
}
.veriff-submit {
    min-height: 60px;
    font-size: 18px !important;
    font-weight: 500;
    background: linear-gradient(180deg, #d7277d 0%, #9e31d8 100%);
}
.account-setting-inner {
    display: flex;
    align-items: center;
    gap: 30px;
}
.account-setting-wrapper.with-verification .client-profile-footer {
    padding: 0;
}
.account-setting-wrapper.with-verification {
    justify-content: space-between;
    align-items: flex-start;
}
.cms-card p span {
    color: #fff !important;
}

.index-veriff-btn .veriff-submit {
    font-size: 14px !important;
    min-height: 40px;
    justify-content: flex-end;
}
.index-veriff-btn {
    display: flex;
    gap: 15px;
    align-items: center;
}
.profile-banner video,
.profile-banner img {
    width: 100%;
    height: 75vh;
    object-fit: cover;
}
.bio-profile-box-verify {
    position: relative;
    width: fit-content;
}
img.verify-badge {
    max-width: 40px;
    position: absolute;
    bottom: 5px;
    right: 8px;
}
.hero-verify-badge {
    max-width: 13px;
}
.hero-content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}
.hero-content h3 {
    margin: 0 !important;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 4.2em;
    line-height: 1.5;
    text-align: left;
}

.theme-toggle input[type="checkbox"] {
    height: 0;
    width: 0;
    display: none;
}
.theme-toggle label {
    cursor: pointer;
    text-indent: -9999px;
    width: 44px;
    height: 24px;
    background: grey;
    display: block;
    border-radius: 100px;
    position: relative;
}
.theme-toggle label:after {
    content: "";
    position: absolute;
    top: 2px;
    left: 3px;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 90px;
    transition: 0.3s;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.12817 3.87264C7.58839 3.33286 6.82634 2.98359 6.0008 2.98359C5.17525 2.98359 4.41321 3.31698 3.87343 3.87264C3.33364 4.41242 2.98438 5.17446 2.98438 6.00001C2.98438 6.82556 3.33364 7.5876 3.87343 8.12738C4.41321 8.66716 5.17525 9.01643 6.0008 9.01643C6.82634 9.01643 7.58839 8.68304 8.12817 8.12738C8.66795 7.5876 9.01722 6.82556 9.01722 6.00001C9.01722 5.17446 8.68382 4.41242 8.12817 3.87264ZM7.55663 7.55585C7.15974 7.95275 6.60408 8.19088 6.0008 8.19088C5.39751 8.19088 4.84186 7.95275 4.44496 7.55585C4.04806 7.15895 3.80992 6.60329 3.80992 6.00001C3.80992 5.39673 4.04806 4.84107 4.44496 4.44417C4.84186 4.04727 5.39751 3.80914 6.0008 3.80914C6.60408 3.80914 7.15974 4.04727 7.55663 4.44417C7.95353 4.84107 8.19167 5.39673 8.19167 6.00001C8.19167 6.60329 7.95353 7.15895 7.55663 7.55585Z' fill='url(%23paint0_linear_2041_773)'/%3E%3Cpath d='M11.5874 5.58731H10.3649C10.1427 5.58731 9.95215 5.77782 9.95215 6.00008C9.95215 6.22234 10.1427 6.41285 10.3649 6.41285H11.5874C11.8096 6.41285 12.0001 6.22234 12.0001 6.00008C12.0001 5.77782 11.8096 5.58731 11.5874 5.58731Z' fill='url(%23paint1_linear_2041_773)'/%3E%3Cpath d='M5.99969 9.95313C5.77742 9.95313 5.58691 10.1436 5.58691 10.3659V11.5884C5.58691 11.8106 5.77742 12.0011 5.99969 12.0011C6.22195 12.0011 6.41246 11.8106 6.41246 11.5884V10.3659C6.41246 10.1436 6.22195 9.95313 5.99969 9.95313Z' fill='url(%23paint2_linear_2041_773)'/%3E%3Cpath d='M10.2405 9.66737L9.36736 8.79419C9.22448 8.63544 8.95459 8.63544 8.79583 8.79419C8.63707 8.95295 8.63707 9.20697 8.79583 9.36573L9.669 10.2389C9.82776 10.3977 10.0818 10.3977 10.2405 10.2389C10.3993 10.0801 10.3993 9.82613 10.2405 9.66737Z' fill='url(%23paint3_linear_2041_773)'/%3E%3Cpath d='M5.99969 -0.000980377C5.77742 -0.000980377 5.58691 0.18953 5.58691 0.411793V1.63424C5.58691 1.8565 5.77742 2.04701 5.99969 2.04701C6.22195 2.04701 6.41246 1.8565 6.41246 1.63424V0.411793C6.41246 0.18953 6.22195 -0.000980377 5.99969 -0.000980377Z' fill='url(%23paint4_linear_2041_773)'/%3E%3Cpath d='M10.2542 1.76121C10.0954 1.60245 9.84143 1.60245 9.68267 1.76121L8.8095 2.63439C8.65074 2.79315 8.65074 3.04716 8.8095 3.20592C8.95238 3.36468 9.22227 3.36468 9.38103 3.20592L10.2542 2.33274C10.413 2.17399 10.413 1.91997 10.2542 1.76121Z' fill='url(%23paint5_linear_2041_773)'/%3E%3Cpath d='M1.63424 5.58725H0.411797C0.189534 5.58725 -0.000976562 5.77776 -0.000976562 6.00002C-0.000976562 6.22228 0.173658 6.41279 0.411797 6.41279H1.63424C1.8565 6.41279 2.04701 6.22228 2.04701 6.00002C2.04701 5.77776 1.8565 5.58725 1.63424 5.58725Z' fill='url(%23paint6_linear_2041_773)'/%3E%3Cpath d='M3.18878 8.79417C3.04589 8.63541 2.776 8.63541 2.61724 8.79417L1.74407 9.66735C1.58531 9.8261 1.58531 10.0801 1.74407 10.2389C1.90283 10.3976 2.15684 10.3976 2.3156 10.2389L3.18878 9.3657C3.34754 9.20694 3.34754 8.95293 3.18878 8.79417Z' fill='url(%23paint7_linear_2041_773)'/%3E%3Cpath d='M3.18878 2.63431L2.3156 1.76114C2.15684 1.60238 1.90283 1.60238 1.74407 1.76114C1.58531 1.9199 1.58531 2.17391 1.74407 2.33267L2.61724 3.20584C2.776 3.3646 3.03002 3.3646 3.18878 3.20584C3.34754 3.04708 3.34754 2.79307 3.18878 2.63431Z' fill='url(%23paint8_linear_2041_773)'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_2041_773' x1='6.0008' y1='2.98359' x2='6.0008' y2='9.01643' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D7277D'/%3E%3Cstop offset='1' stop-color='%239E31D8'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_2041_773' x1='10.9761' y1='5.58731' x2='10.9761' y2='6.41285' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D7277D'/%3E%3Cstop offset='1' stop-color='%239E31D8'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint2_linear_2041_773' x1='5.99969' y1='9.95313' x2='5.99969' y2='12.0011' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D7277D'/%3E%3Cstop offset='1' stop-color='%239E31D8'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint3_linear_2041_773' x1='9.51818' y1='8.67513' x2='9.51818' y2='10.358' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D7277D'/%3E%3Cstop offset='1' stop-color='%239E31D8'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint4_linear_2041_773' x1='5.99969' y1='-0.000980377' x2='5.99969' y2='2.04701' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D7277D'/%3E%3Cstop offset='1' stop-color='%239E31D8'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint5_linear_2041_773' x1='9.53185' y1='1.64214' x2='9.53185' y2='3.32499' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D7277D'/%3E%3Cstop offset='1' stop-color='%239E31D8'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint6_linear_2041_773' x1='1.02302' y1='5.58725' x2='1.02302' y2='6.41279' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D7277D'/%3E%3Cstop offset='1' stop-color='%239E31D8'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint7_linear_2041_773' x1='2.46642' y1='8.6751' x2='2.46642' y2='10.3579' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D7277D'/%3E%3Cstop offset='1' stop-color='%239E31D8'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint8_linear_2041_773' x1='2.46642' y1='1.64207' x2='2.46642' y2='3.32491' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D7277D'/%3E%3Cstop offset='1' stop-color='%239E31D8'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
}
.theme-toggle input:checked + label {
    background: linear-gradient(90deg, #9333ea 0%, #db2777 100%);
}
.theme-toggle input:checked + label:after {
    left: calc(100% - 2px);
    transform: translateX(-100%);
}
.theme-toggle label:active:after {
    width: 20px;
}

/* ========================== notification sidebar ====================== */

.notify-sidebar {
    width: 531px;
    background-color: var(--gray-balck);
}
.notify-sidebar .btn-close {
    opacity: 1;
    filter: invert(1) brightness(5);
}
.notify-sidebar .offcanvas-header h5 {
    font-size: 20px;
    line-height: 22px;
    color: var(--white);
    display: flex;
    align-items: center;
    gap: 10px;
}
.notify-sidebar .offcanvas-header {
    padding: 25px 16px;
    border-bottom: 1px solid #f2f2f21c;
}
.notify-sidebar .offcanvas-body {
    padding: 10px 30px 30px;
    overflow-y: auto;
}
.notify-list-link {
    display: flex;
    width: 100%;
    gap: 14px;
    align-items: center;
    padding: 24px 0;
    border-bottom: 1px solid #f2f2f21f;
}

.notify-content h4 {
    font-size: 18px;
    line-height: 20px;
    color: var(--white);
    font-weight: 600;
    margin: 0 0 15px;
}
.notify-details {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.notify-details-left span {
    color: #fff;
    background: linear-gradient(90deg, #9333ea 0%, #db2777 100%);
    width: 40px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    font-size: 18px;
}
.notify-details-left {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #b0b0b0;
    font-size: 15px;
    line-height: 16px;
    text-transform: capitalize;
}
.notify-details > p {
    font-size: 15px;
    line-height: 16px;
    color: #b0b0b0;
}
.offcanvas-footer {
    padding: 0 30px 0;
}
.notify-footer {
    display: flex;
    justify-content: center;
    align-items: center;
    border-top: 1px solid #f2f2f21f;
    padding: 30px 0;
}
.notify-footer a {
    color: var(--white);
}
.notify-btn {
    position: relative;
}
span.notify-num {
    width: 15px;
    height: 15px;
    position: absolute;
    background: linear-gradient(180deg, #d7277d 0%, #9e31d8 100%);
    display: flex;
    font-size: 10px;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    color: #fff;
    top: -2px;
    left: -3px;
}
span.notify-num:empty {
    display: none;
}

/* ========================== notification sidebar ====================== */

.form-group:has(input#phone_number:valid) label, .form-group:has(input#phone_number:placeholder-shown) label {
    opacity: .65;
    transform: scale(.85) translateY(-.9rem) translateX(.15rem);
}

.account-setting-wrapper.with-verification .account-setting-inner{
    width: 100%;
}
.swiper-slide.hero-slider-card a > img {
    border-radius: 20px 20px 0px 0px;
    aspect-ratio: 1/1.36;
    object-fit: cover;
}
.top-search-card .top-search-content p{
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow : hidden;
    max-width: 23em;
    line-height: 1.5;
}
.top-search-card{
    height: 100%;
}
form.veriff-container {
    margin: 0;
}
span.active-deactive-txt {
    font-size: 12px;
}
span#upload-media-error {
    text-align: center;
}
.swiper-wrapper.limitedCard .swiper-slide.hero-slider-card.swiper-slide-active {
    scale: 1;
    transform: translateY(0px);
}
.swiper-wrapper.limitedCard{
    justify-content: center;
}
.hero-slide:has(.swiper-wrapper.limitedCard) .swiper-button-prev.swiper-button-disabled,
.hero-slide:has(.swiper-wrapper.limitedCard) .swiper-button-next.swiper-button-disabled {
    opacity: 0 !important;
}
input:-webkit-autofill{
    -webkit-background-clip: #2f2f35;
    -webkit-text-fill-color: #ffffff;
    transition: background-color 5000s ease-in-out 0s;
    /* box-shadow: inset 0 0 20px 20px #2f2f35; */
    box-shadow: inset 0 0 24px 27px #2f2f35;
}
input:-webkit-autofill{
    -webkit-text-fill-color: rgb(255, 255, 255) !important;
}
input:-webkit-autofill:focus{
    border: 1px solid #fff;
}


/* ============================ register modal =============================== */

.register-modal .modal-body {
    background-color: var(--gray-balck);
    padding: 35px 40px;
}
.modal-content {
    border-radius: 20px;
    background-color: var(--gray-balck);
    overflow: hidden;
}

span.modal-icon {
    display: flex;
    justify-content: center;
}
.register-modal-footer {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 10px;
}
.register-modal-footer .button{
    min-width: 150px;
}
.register-modal .payment-modal-box p {
    max-width: 420px;
    margin: 0 auto 15px;
}

.register-modal .modal-body {
    padding: 50px 40px;
}


/* ============================ register modal =============================== */


.add-content-more-details .custom.theme-toggle {
    margin-right: 10px;
}
p.no-data {
    color: #fff;
    text-align: center;
    font-size: 22px;
}


.check-field-inner:has(.is-invalid) .invalid-feedback {
    display: block;
}

.age-rule-box h3 {
    color: #fff;
    margin: 0 0 15px;
    text-align: center;
    font-size: 20px;
    line-height: 24px;
}
.age-rule-box ul li {
    color: #fff;
    font-size: 16px;
}
.age-rule-box ul li + li{
    margin-top: 15px;
}
.age-rule-box ul{
    margin: 0 0 15px;
}
.age-rule-box p {
    color: #fff;
}


/* ========================= pagiation CSS ===================== */

.pagination-outer {
    padding: 35px 0;
}
.pagination {
    display: flex;
    justify-content: center;
    gap: 15px;
    align-items: center;
}
.pagination .page-link {
    width: 52px;
    height: 52px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #222227;
    border: 1px solid transparent;
    border-radius: 50px !important;
    color: #fff;
    font-size: 15px;
    font-weight: 800;
}
.pagination .page-item.active {
    padding: 2px;
    border-radius: 50px;
    background: linear-gradient(180deg, #D7277D 0%, #9E31D8 100%);
}
.pagination .page-item.active a.page-link{
    background-color: #101012;
    border-color: transparent;
}
.pagination .page-item:not(:first-child) .page-link {
    margin-left: 0;
}
.pagination .page-item {
    padding: 2px;
    border-radius: 50px;
    background: transparent;
}
.page-link.pagination-next,.page-link.pagination-prev {
    background: linear-gradient(180deg, #D7277D 0%, #9E31D8 100%);
}
.page-link.disable.pagination-prev,.page-link.disable.pagination-next {
    border: 1px solid #fff;
    background: #101012;
}
.page-link.disable.pagination-prev i,.page-link.disable.pagination-next i{
    background: linear-gradient(90deg, #9333EA 0%, #DB2777 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* ========================= pagiation CSS ===================== */

.register-tabs-box .acc-setting-profile-box {
    margin: 0 auto;
}
.also-like-slider .swiper-wrapper{
    height: auto;
}
.also-like-slider .swiper-wrapper .swiper-slide{
    height: auto;
}
.container:has(.also-like-slider-box){
    overflow: hidden;
}
.also-like-slider .top-search-card .top-search-content .top-search-loc p{
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 23em;
    line-height: 1.5;
}
.also-like-slider {
    position: relative;
}
.like-button-next,.like-button-prev{
    width: 52px;
    height: 52px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(180deg, #d7277d 0%, #9e31d8 100%);
    position: absolute;
    top: -68px;
    right: 0;
    z-index: 1;
    right: 35px;
}
.like-button-prev{
    right: 100px;
}
.like-button-prev svg{
    transform: rotate(180deg);
}
.like-button-next.swiper-button-disabled,.like-button-prev.swiper-button-disabled {
    background: #101012;
    border: 1px solid #fff;
    display: none;
}
.like-button-next.swiper-button-disabled svg path,.like-button-prev.swiper-button-disabled svg path{
    fill: #9e31d8;
}
.format-validation{
    position: absolute;
    width: 431px;
    word-break: break-all;
    left: -142px;
    text-align: center;
    font-size: 14px;
    color: #dc3545;
}
.account-setting-profile:has(.format-validation){
    margin-bottom: 50px !important;
}
.db-change-pass-box .form-group 



.register-card span#profilePic-error {
    display: block;
    text-align: center;
}



.form-floating > textarea.form-control:not(:-moz-placeholder-shown) ~ label {
    opacity: 1;
    background-color: #fff;
    height: auto;
    padding: 0px;
    padding: 0px 0px 0px 10px;
    width: 100%;
    transition: all 0.3s ease;
    transform: scale(0.982) translateY(0.045rem) translateX(0.1rem);
  }
  .form-floating > textarea.form-control:focus ~ label, .form-floating > textarea.form-control:not(:placeholder-shown) ~ label {
    opacity: 1;
    background-color: #2f2f35;
    height: auto;
    padding: 2px 0px 0px 10px;
    width: 100%;
    transform: scale(0.982) translateY(0.045rem) translateX(0.1rem);
}
  .form-floating > textarea.form-control:-webkit-autofill ~ label {
    opacity: 1;
    background-color: #fff;
    height: auto;
    padding: 0px;
    padding: 0px 0px 0px 10px;
    width: 100%;
    transform: scale(0.982) translateY(0.045rem) translateX(0.1rem);
  }
  .iti__country-list {
    width: 200px;
    background-color: #2f2f35 !important;
    border: 1px solid #222227 !important;
}
.iti__country-name {
    color: #fff !important;
}
.iti__dial-code {
    color: #d3d3d3 !important;
}
.iti__selected-flag {
    padding: 26px 6px 0 8px !important;
    height: auto !important; 
}
.formfield:has(.iti__flag-container) input{
    padding-top: 30px;
}
.hasDatepicker,select{
    cursor: pointer;
}
.ui-datepicker {
    background: #222227!important;
    color: #ffffff;
}
.ui-state-default, .ui-widget-content .ui-state-default {
    border: 0 !important;
    background: #222227 !important;
    font-weight: normal;
    color: #ffffff !important;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 35px;
    height: 35px;
    border-radius: 50px;
}
table.ui-datepicker-calendar tr th span {
    color: #fff;
}
.ui-widget-header {
    border: 0 !important;
    background: #222227 !important;
    color: #ffffff !important;
    font-weight: bold !important;
}
.ui-datepicker .ui-datepicker-prev {
    left: auto !important;
    right: 23px !important;
}
.ui-datepicker .ui-datepicker-title {
    margin: 1px 6.3em 0 0 !important;
}
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {
    width: 45%;
    background-color: #222227;
    color: #fff;
    border: 0;
}
.ui-datepicker .ui-datepicker-buttonpane button {
    padding: 5px;
    overflow: visible;
    background: linear-gradient(90deg, #9333EA 0%, #DB2777 100%) !important;
    width: 78px;
    height: 37px;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 600;
}
a.ui-state-default.ui-state-active {
    background: linear-gradient(180deg, #D7277D 0%, #9E31D8 100%) !important;
    border: 2px solid #37373E !important;
}
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span{
    filter: brightness(5);
}
.ui-datepicker .ui-datepicker-prev.ui-state-hover  span, .ui-datepicker .ui-datepicker-next.ui-state-hover span{
    filter: unset;
}
.ui-widget.ui-widget-content {
    border: 1px solid #2f2f35 !important;
}
.ui-widget-content {
    border: 1px solid #2f2f35 !important;
}

/* loader */
/* @keyframes rotate {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
 
.loader-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgb(255 255 255 / 28%);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 100000;
    backdrop-filter: blur(2px);
}
.loader {
    width: 50px;
    aspect-ratio: 1;
    display: grid !important;
    border: 4px solid #0000;
    border-radius: 50%;
    border-right-color: var(--primary-color);
    animation: l15 1s infinite ;
}
.loader::before, .loader::after {
    content: "";
    grid-area: 1 / 1;
    margin: 2px;
    border: inherit;
    border-radius: 50%;
    animation: l15 2s infinite;
}
@keyframes l15 {
    100% {
        transform: rotate(1turn);
    }
} */
/* end */

.custom-label-field:has(.focused) .cutsom-label {
    transform: translateY(-27px);
    z-index: 1;
}
.profile-complete-modal .rule-head {
    font-size: 36px;
    line-height: 1;
    text-transform: capitalize;
}
.profile-complete-modal .modal-dialog {
    max-width: 559px;
}
.profile-complete-modal .modal-body {
    padding: 33px;
    padding-top: 50px;
}
.profile-complete-modal .rule-text {
    color: #fff;
    text-align: center;
    opacity: 0.7;
    max-width: 358px;
    margin: 0 auto;
    margin-bottom: 30px;
    font-size: 18px;
}
.profile-complete-modal .age-rule-box>img {
    max-width: 155px;
    margin-bottom: 20px;
}
.profile-complete-modal .btn-close {
    filter: invert(1) brightness(1);
    opacity: 1;
    position: absolute;
    right: 32px;
    top: 32px;
}
.form-floating.jugard:has(select) label{
    transform: unset !important;
    opacity: 1 !important;
}
/* .form-floating.jugard:has(select) label{
    transform: scale(.85) translateY(-.5rem) translateX(.15rem) !important;
} */

.account-setting-profile span#profilePic-error {
    position: absolute;
    white-space: nowrap;
}
.flex-space-div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 15px; 
    padding-top: 15px;
    border-top: 1px solid #575a65;
}
.footer-right-area {
    display: flex;
    align-items: center;
    gap: 32px;
}
.pro-bio-new-wrap .bio-content-box {
    display: flex;
    gap: 32px;
    flex-direction: column;
}
.pro-bio-wrapper.pro-bio-new-wrap {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}
.pro-button-next.swiper-button-disabled,.pro-button-prev.swiper-button-disabled {
    opacity: 0.2;
}

.db-account-seeting .bio-content-listing {
    max-height: 320px;
    overflow: auto;
}

.footer-right-area .primary-btn{
    min-width: 195px;
}

.simple-cancel-btn{
    font-size: 18px;
    font-weight: 700;
}

.small-btn{
    min-height: 55px;
}

.goog-te-gadget-simple {
    background-color: #ffffff00 !important;
    border: 0 !important;
}   
.goog-te-gadget-simple > img{
    display: none;
}
.goog-te-gadget-simple a > span{
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    line-height: 25px;
    border-left: 0 !important;
}
.goog-te-gadget-simple a > span:last-child,.goog-te-gadget-simple a span:nth-child(2){
    display: none;
}
.goog-te-gadget-simple a {
    
    position: relative;
    padding-right: 20px;
}
.goog-te-gadget-simple a::after{
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background-image: url("data:image/svg+xml,%3Csvg width='13' height='8' viewBox='0 0 13 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.49998 8C6.26699 8 6.03403 7.90396 5.8564 7.71229L0.266684 1.67776C-0.0888948 1.29388 -0.0888948 0.671503 0.266684 0.287787C0.62212 -0.095929 1.19852 -0.095929 1.55412 0.287787L6.49998 5.62748L11.4459 0.287973C11.8014 -0.0957425 12.3778 -0.0957425 12.7332 0.287973C13.0889 0.67169 13.0889 1.29407 12.7332 1.67794L7.14355 7.71248C6.96584 7.90418 6.73288 8 6.49998 8Z' fill='white'/%3E%3C/svg%3E%0A");
    background-position: 0 0;
    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
    background-position: center;
}

.content-maanage-box.only6-content-mange {
    min-height: 85vh;
}


.lang-dropdown .dropdown-toggle {
    color: #fff;
}
.lang-dropdown .dropdown-toggle::after {
    display: none;
}   
.lang-dropdown .dropdown-menu {
    margin-top: 10px;
    padding-inline: 12px;
    color: #fff;
    border: 2px solid transparent;
    background: linear-gradient(180deg, #222227 0%, #222227 100%) , linear-gradient(180deg, #D7277D 0%, #9E31D8 100%);
    background-origin: border-box;
    background-clip: padding-box, border-box;
    border-radius: 12px;
    width: 200px;

}
.lang-select .lang-option:hover{
    background: linear-gradient(180deg, #D7277D 0%, #9E31D8 100%);
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.lang-dropdown .dropdown-menu::before {
    content: "";
    position: absolute;
    top: -20px;
    left: auto;
    /* transform: rotate(45deg); */
    width: 20px;
    height: 20px;
    background: #d6277d;
    border-radius: 0%;
    right: 10px;
    clip-path: polygon(49% 46%, 0 100%, 100% 100%);
}

.profile-upload .invalid-feedback {
    position: absolute;
    left: -117px;
    bottom: -30px;
    white-space: nowrap;
}
.hover-underline:hover{
    text-decoration: underline !important;
}
.lang-option > img {
    max-width: 20px;
}
.lang-option {
    cursor: pointer;
}

.information-icon{
    color: white !important;
}

.cms-card p {
    color: white !important;  /* Set text color to white */
}


   /* The Modal (background) */
    #imageModal.modal {
        display: none;
        /* Hidden by default */
        position: fixed;
        z-index: 999;
        padding-top: 60px;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        overflow: auto;
        background-color: rgb(0, 0, 0);
        /* Fallback color */
        background-color: rgba(0, 0, 0, 0.9);
        /* Black with opacity */
    }

    /* Modal Content (Image) */
   #imageModal .modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    overflow: unset;
}

    /* The Close Button */

    #imageModal .product-popup-box button{
         box-sizing: content-box;
    width: 1.5em;
     min-width: 1.5em;
    height: 1.5em;
    padding: .25em .25em;
    color: #000;
    border: 0;
    border-radius: .25rem;
    background: linear-gradient(180deg, #d7277d 0%, #9e31d8 100%);
    border-radius: 100%;
    color: #fff;
    position: absolute;
    }

    #imageModal .btn-close-outer {
    position: absolute;
    right: -10px;
    top: -10px;
}

#imageModal .btn-close-outer span{
    filter: invert(1);
        opacity: 1 !important;

}

    #imageModal .close:hover,
    #imageModal .close:focus {
        color: #bbb;
        text-decoration: none;
        cursor: pointer;
    }

   .product-popup-box {
    text-align: center;
    height: 500px !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-popup-box img,
.product-popup-box video{
   object-fit: contain;
   width: 100%;
   height: 100% !important;
}

button#nextBtn {
    right: 20px;
}

button#prevBtn {
    left: 20px;
}

.image-preview-modal .modal-content {
    width: 100% !important;
    max-width: 95vw !important;
    height: 95vh !important;
}
.image-preview-modal {

    padding-top: 25px !important;
}
.image-preview-modal .modal-body {
    height: 100% !important;
}
.image-preview-modal .product-popup-box {
    height: 100% !important;
}

.image-preview-modal .product-popup-box button{
    z-index: 999;
}
#imageModal .product-popup-box button{
    width: 52px;
    height: 52px;
}
#imageModal .product-popup-box button.btn-close-outer{
    width: 40px;
    height: 40px;
    right: 0;
    top: 0;
}
.content-card-box {
    max-height: 472px;
    overflow: auto;
    overflow-x: hidden;
    min-height: 472px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.content-card-box::-webkit-scrollbar{
    width: 2px;
}

.verif-information-btn{
    position: relative;
}
.information-icon{
    position: absolute;
    right: 0;
    top: 12px;
    right: 13px;
    cursor: pointer;
}
.verification-steps{
    color: #fff;
}
@media screen and (max-height:575px){
    .product-popup-box {
    height: 300px;
}
}
#veriff-root .veriff-submit:hover{
    scale: 1;
}

.info-verif .button {
    min-height: auto;
    padding: 8px 20px;
    font-size: 14px;
}

.status-message p, .modal-title {
    color: #fff !important;
    text-align: center;
    width: 100%;
}
.massagetherapist.content-card-box {
    max-height: 668px;
}