* {
    padding: 0;
    margin: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

html {
    overflow-x: hidden;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

body {
    line-height: 1;
}

ol,
ul {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

:focus-visible {
    outline: none;
}

/* Predefined CSS */
:root {
    --Themepurple: #3A1363;
    --OutLineBorderColor: #4042E2;
    --Themegreen: #0FB8AE;
    --Themefont: "Montserrat", sans-serif;
    --Commonpadding: 80px 0px;
    --Font14px: clamp(12px, 0.729vw, 16px);
    --Font16px: clamp(12px, 0.833vw, 18px);
    --Font18px: clamp(14px, 0.938vw, 20px);
    --Font20px: clamp(14px, 1.042vw, 22px);
    --Font22px: clamp(16px, 1.146vw, 24px);
    --Font24px: clamp(16px, 1.25vw, 28px);
    --Font26px: clamp(14px, 1.4vw, 53px);
    --Font28px: clamp(18px, 1.46vw, 56px);
    --Font38px: clamp(14px, 1.98vw, 76px);
    --Font40px: clamp(20px, 2.083vw, 42px);
    --Font48px: clamp(20px, 2.5vw, 52px);
    --Font56px: clamp(24px, 2.917vw, 60px);
    --Font70px: clamp(28px, 3.646vw, 75px)
}

/* Default Heading Sizes */

/* Default Font Family */

body {
    font-family: var(--Themefont);
}

/* h1 {} */

h2 {
    font-size: var(--Font48px);
    font-weight: 600;
}

/* h3 {}

h4 {}

h5 {}

h6 {} */

/* Default Container Width */

.container {
    max-width: 90%;
}

/* Header */
header.desktop-menu {
    padding: 20px 0px;
    position: sticky;
    top: 0;
    z-index: 99;
    background-color: #fff;
}

header.desktop-menu nav ul {
    display: flex;
    justify-content: end;
    align-items: center;
    gap: 40px;
}

header.desktop-menu nav ul li {
    position: relative;
}

header.desktop-menu nav ul li span {
    position: absolute;
    top: -15px;
    font-size: clamp(10px, 0.625vw, 14px);
    width: 100px;
    left: 35px;
    background: linear-gradient(90deg, #0FB8AE 0%, #402566 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    /* For some modern browsers */
    color: transparent;
    /* Fallback */
    ;
    height: 100%;
}

header.desktop-menu nav ul li a {
    text-decoration: none;
    color: #000;
    font-family: var(--Themefont);
    font-size: var(--Font18px);
    font-weight: 500;
}

header.desktop-menu .header-logo img {
    width: 176px;
}

/* header.desktop-menu .header-cta-btn {
    margin-left: 40px;
} */

header.desktop-menu .header-cta-btn a {
    padding: 15px 40px;
    background-color: var(--Themepurple);
    border-radius: 1000px;
    color: #fff;
    text-decoration: none;
    border: 1px solid #4042E2;
    font-family: var(--Themefont);
    box-shadow: 0px 0px 16px 8px #45A9BD99;
    font-size: var(--Font24px);
}

header.desktop-menu::before {
    position: absolute;
    content: '';
    height: 3px;
    width: 60%;
    bottom: 0px;
    left: 0;
    background-color: var(--Themegreen);
}

header.desktop-menu::after {
    position: absolute;
    content: '';
    height: 3px;
    width: 40%;
    bottom: 0px;
    right: 0;
    background-color: var(--Themepurple);
}

/* Mobile-Menu */
.brand img {
    width: 100px;
}

/* Homepage banner section */
.home-banner-section {
    position: relative;
    height: 480px;
    display: flex;
    align-items: center;
}

.home-banner-section .bg-image-banner {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}

.home-banner-section .bg-image-banner img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.home-banner-section .container {
    position: relative;
}

.home-banner-section h1 {
    color: #fff;
    font-family: var(--Themefont);
    font-weight: 600;
    font-size: var(--Font56px);
    line-height: 1.6;
}

.home-banner-section h1 span {
    padding: 10px 10px;
    background-color: #522f77ad;
}

.home-banner-form-wrapper {
    box-shadow: 0px 16px 16px 0px #3A136329;
    background-color: #FFFBFB;
    border-radius: 24px;
    padding: 24px;
    width: 40%;
    margin-top: 46px;
}

.home-banner-form-wrapper .nav {
    background-color: #EBEBEB;
    padding: 5px;
    border-radius: 16px;
}

.home-banner-form-wrapper .nav-item {
    width: 50%;
}

.home-banner-form-wrapper .nav-item button {
    text-align: center;
    width: 100%;
    font-family: var(--Themefont);
    font-size: var(--Font20px);
    color: #000;
    padding: 12px 40px;
}

.home-banner-form-wrapper .nav-item button.active {
    border-radius: 16px;
    background: linear-gradient(180deg, #59E4D5 0%, #15868A 100%);
}

.banner-findcare-tab .form-row-banner-tab {
    position: relative;
}

.banner-findcare-tab .form-row-banner-tab label {
    position: absolute;
    left: 20px;
    top: -10px;
    font-family: var(--Themefont);
    font-size: var(--Font16px);
    padding: 5px;
    background-color: #fff;
    color: #00000066;
}

.banner-findcare-tab .form-row-banner-tab input[type="text"] {
    width: 100%;
    height: 48px;
    border: 1px solid #E8E6EA;
    border-radius: 15px;
    background-color: #fff;
    font-family: var(--Themefont);
    padding-left: 35px;
    background-image: url(../images/vector-imagr-location.png);
    background-position: 4%;
    background-repeat: no-repeat;
    background-size: 15px;
}

.banner-findcare-tab .form-row-banner-tab input[type="text"]::placeholder {
    font-weight: 700;
    font-size: var(--Font16px);
    color: #000;
}


.banner-findjob-tab .form-row-banner-tab {
    position: relative;
}

.banner-findjob-tab .form-row-banner-tab label {
    position: absolute;
    left: 20px;
    top: -10px;
    font-family: var(--Themefont);
    font-size: var(--Font16px);
    padding: 5px;
    background-color: #fff;
    color: #00000066;
}

.banner-findjob-tab .form-row-banner-tab input[type="text"] {
    width: 100%;
    height: 48px;
    border: 1px solid #E8E6EA;
    border-radius: 15px;
    background-color: #fff;
    font-family: var(--Themefont);
    padding-left: 35px;
    background-image: url(../images/vector-imagr-location.png);
    background-position: 4%;
    background-repeat: no-repeat;
    background-size: 15px;
}

.banner-findjob-tab .form-row-banner-tab input[type="text"]::placeholder {
    font-weight: 700;
    font-size: var(--Font16px);
    color: #000;
}

.form-row-banner-tab button {

    text-align: center;
    color: #fff;
    width: 100%;
    margin-top: 20px;
    border: 1px solid #4042E2;
    background-color: var(--Themepurple);
    font-family: var(--Themefont);
    border-radius: 1000px;
    font-size: var(--Font24px);
    font-weight: 500;
}

.form-row-banner-tab button a {
    color: #fff;
    text-decoration: none;
    display: block;
    padding: 15px 10px;
}

/* What We do section Start*/

.what-we-do-section-wrapper {
    padding: var(--Commonpadding);
    padding-bottom: 0;
}

.what-we-do-section-wrapper h2 {
    font-family: var(--Themefont);
    color: #000;
    text-align: center;
}

.what-we-do-section-wrapper p {
    font-family: var(--Themefont);
    color: #000;
    text-align: center;
    margin: 20px 0px;
    font-size: var(--Font20px);
    line-height: 1.5;
    font-weight: 400;
}

.what-we-do-section-wrapper .what-we-do-image-column .what-we-do-image-one-col .image-col-what-we-do {
    height: 260px;
    width: 260px;
    border-radius: 50%;
    background-color: #F9F9FA;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.image-col-what-we-do::before {
    position: absolute;
    content: '';
    height: 300px;
    width: 300px;
    right: -25px;
    top: -20px;
    background-image: url(../images/half-circle-image.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right;
    z-index: -1;
    display: none;
}

.image-col-what-we-do::after {
    position: absolute;
    content: '';
    height: 300px;
    width: 230px;
    right: 11px;
    top: 19px;
    background-image: url(../images/shadow-circle.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right;
    z-index: -2;
    filter: blur(7px);
    opacity: 0.6;
    display: none;
}

.what-we-do-section-wrapper .what-we-do-image-column .what-we-do-image-one-col .image-col-what-we-do h4 {
    color: var(--Themepurple);
    font-family: var(--Themefont);
    font-size: var(--Font40px);
    text-align: center;
    padding: 0 10%;
    font-weight: 600;
    line-height: 1.5;
    text-transform: capitalize;
}

.what-we-do-image-column {
    padding: 15% 0px 80px 0px;
    display: flex;
    margin-top: 60px;
    margin-left: -5%;
    background-image: url(../images/map-image.png);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.what-we-do-image-column img {
    width: 380px;
    position: relative;
    top: -50px;
}

.what-we-do-cards-list ul {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-top: -100px;
}

.what-we-do-cards-list ul li .what-we-do-card {
    background-color: #F9F9FA;
    border-radius: 15px;
    display: flex;
    align-items: center;
    padding: 30px 6%;
    position: relative;
}

.what-we-do-cards-list ul li .what-we-do-card::before {
    position: absolute;
    content: '';
    top: 50%;
    right: -8%;
    transform: translateY(-50%);
    height: 80%;
    width: 50%;
    background-color: var(--Themegreen);
    border-radius: 15px;
    z-index: -1;
}

.what-we-do-cards-list ul li .what-we-do-card::after {
    position: absolute;
    content: '';
    top: 10%;
    right: -4%;
    transform: 0;
    height: 100%;
    width: 100%;
    background-image: url(../images/card-shadow.png);
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 15px;
    z-index: -1;
    opacity: 0.6;
    filter: blur(5px);
}

.what-we-do-card-icon-box {
    width: 20%;
}

.what-we-do-card-icon img {
    height: 40px;
    width: 40px;
    object-fit: contain;
    top: unset;
    display: flex;
    justify-content: center;
    align-items: center;
}

.what-we-do-card-icon-box .what-we-do-card-icon {
    width: 60px;
    height: 60px;
    background-color: #0FB8AE;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.24) 6px 6px 7px;
}

.what-we-do-card-text {
    width: 80%;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 10px;
}

.what-we-do-card-text h6 {
    text-align: left;
    font-size: var(--Font20px);
    font-family: var(--Themefont);
    font-weight: 600;
    color: #000;
    line-height: 1.4;
}

.what-we-do-card-text p {
    text-align: left;
    font-size: var(--Font14px);
    margin-top: 10px;
    margin-bottom: 0;
}

.what-we-do-cards-list ul li:nth-child(2) {
    position: relative;
    left: 40px;
}

.what-we-do-cards-list ul li:nth-child(2) .what-we-do-card-icon-box .what-we-do-card-icon {
    background-color: #9C8CA9;
}

.what-we-do-cards-list ul li:nth-child(3) .what-we-do-card-icon-box .what-we-do-card-icon {
    background-color: var(--Themepurple);
}

.what-we-do-cards-list ul li:nth-child(2) .what-we-do-card::before {
    background-color: #9C8CA9;
}

.what-we-do-cards-list ul li:nth-child(3) .what-we-do-card::before {
    background-color: var(--Themepurple);
}

@media screen and (max-width: 767px) {

    .what-we-do-cards-list ul {
        margin-top: 0;
        gap: 20px;
    }

    .what-we-do-cards-list ul li {
        left: 0 !important; /* remove offset of 2nd card */
    }

    .what-we-do-cards-list ul li .what-we-do-card {
        flex-direction: column;
        align-items: center;
        text-align: center;

        min-height: 260px; /* SAME HEIGHT */
        padding: 20px 16px;
    }

    /* Stop background stretch on mobile */
    .what-we-do-cards-list ul li .what-we-do-card::before,
    .what-we-do-cards-list ul li .what-we-do-card::after {
        display: none;
    }

    .what-we-do-card-icon-box {
        margin-bottom: 16px;
    }

    .what-we-do-card-text h6 {
        font-size: 18px;
        line-height: 1.3;
    }

    .what-we-do-card-text p {
        font-size: 14px;
        line-height: 1.5;
    }
}


/* What We do section End*/

/* Become a Care-Giver start */

.become-care-giver-section-wrapper {
    position: relative;
    padding: var(--Commonpadding);
}

.become-care-giver-section-wrapper .section-bg-image {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
}

.become-care-giver-section-wrapper .section-bg-image img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.become-care-giver-section-wrapper .container {
    position: relative;
}

.become-care-giver-section-wrapper h2 {
    text-align: center;
    font-family: var(--Themefont);
    font-weight: 600;
}

.become-care-giver-section-wrapper p {
    text-align: center;
    font-family: var(--Themefont);
    margin-top: 20px;
    font-weight: 400;
    font-size: var(--Font20px);
}

.become-care-giver-section-wrapper .circle-card-wrapper {
    margin-top: 80px;
}

.become-care-giver-section-wrapper .circle-card-wrapper ul {
    display: flex;
    gap: 50px;
    justify-content: center;
}

.become-care-giver-section-wrapper .circle-card-wrapper ul li {
    position: relative;
}

.become-care-giver-section-wrapper .circle-card-wrapper ul li:nth-child(2) .circle-card {
    position: relative;
}

.become-care-giver-section-wrapper .circle-card-wrapper ul li::after {
    position: absolute;
    content: '';
    top: -7%;
    left: 50%;
    height: 200px;
    width: 160px;
    background-image: url(../images/card-skewbg.png);
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 1;
}

.become-care-giver-section-wrapper .circle-card-wrapper ul li:nth-child(1)::after {
    position: absolute;
    content: '';
    top: -7%;
    left: 50%;
    height: 200px;
    width: 160px;
    background-image: url(../images/card-skewbg.png);
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 1;
}

.become-care-giver-section-wrapper .circle-card-wrapper ul li:nth-child(1)::before {
    position: absolute;
    content: '';
    top: 11%;
    left: 15px;
    height: 100%;
    width: 100%;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 1;
    box-shadow: #e3e2e28f 0px 54px 55px, #a49c9c3a 0px -12px 30px, #efeaea 0px 4px 6px, #E3E2E2 0px 12px 13px, #E3E2E2 0px -3px 5px;
    border-radius: 50%;
    background-color: #c4c4c4;
    filter: blur(4px);
    opacity: 0.8;
}

.become-care-giver-section-wrapper .circle-card-wrapper ul li:nth-child(2)::before {
    position: absolute;
    content: '';
    top: 11%;
    left: 15px;
    height: 100%;
    width: 100%;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 1;
    box-shadow: #e3e2e28f 0px 54px 55px, #a49c9c3a 0px -12px 30px, #efeaea 0px 4px 6px, #E3E2E2 0px 12px 13px, #E3E2E2 0px -3px 5px;
    border-radius: 50%;
    background-color: #c4c4c4;
    filter: blur(4px);
    opacity: 0.8;
}

.become-care-giver-section-wrapper .circle-card-wrapper ul li:nth-child(3)::before {
    position: absolute;
    content: '';
    top: 11%;
    left: 15px;
    height: 100%;
    width: 100%;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 1;
    box-shadow: #e3e2e28f 0px 54px 55px, #a49c9c3a 0px -12px 30px, #efeaea 0px 4px 6px, #E3E2E2 0px 12px 13px, #E3E2E2 0px -3px 5px;
    border-radius: 50%;
    background-color: #c4c4c4;
    filter: blur(4px);
    opacity: 0.8;
    display: none;
}

.become-care-giver-section-wrapper .circle-card-wrapper ul li:nth-child(2)::after {
    position: absolute;
    content: '';
    top: 27%;
    left: 50%;
    height: 200px;
    width: 170px;
    background-image: url(../images/card-2skew.png);
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 1;
}

.become-care-giver-section-wrapper .circle-card-wrapper ul li:nth-child(3)::after {
    position: absolute;
    content: '';
    top: 62%;
    left: 50%;
    height: 200px;
    width: 158px;
    background-image: url(../images/card-3skew.png);
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 1;
}

.become-care-giver-section-wrapper .circle-card-wrapper ul li .circle-card {
    width: 300px;
    height: 300px;
    background-color: #F9F9FA;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    gap: 20px;
    position: relative;
    z-index: 9;
}

/* .become-care-giver-section-wrapper .circle-card-wrapper ul li .circle-card::before {
    position: absolute;
    content: '';
    top: 7%;
    left: -2%;
    height: 300px;
    width: 300px;
    border-radius: 50%;
    background-image: url(../images/card-shadow.png);
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 1;
    filter: blur(2px);
    opacity: 0.6;
} */

.become-care-giver-section-wrapper .circle-card-wrapper ul li .circle-card img {
    width: 45px;
    width: 45px;
    object-fit: contain;
}

.become-care-giver-section-wrapper .circle-card-wrapper ul li .circle-card p {
    font-size: var(--Font16px);
    padding: 0 15%;
    line-height: 1.6;
    margin-top: 0;
}

.become-care-giver-section-wrapper .circle-card-wrapper ul li .circle-card h6 {
    font-family: var(--Themefont);
    font-size: var(--Font20px);
    font-weight: 600;
    color: #000;
}

.get-in-touch-info-col {
    margin-top: 30px;
}

/* Become a Care-Giver end */

/* Right At FingerTips Section Start */

.right_at_finger_tips {
    padding: 80px 0px 0px 0px;
}

.right_at_finger_tips h2 {
    font-family: var(--Themefont);
    color: #000;
    font-weight: 700;
    font-size: var(--Font48px);
    line-height: 1.4;
}

.right_at_finger_tips p {
    font-family: var(--Themefont);
    color: #000;
    font-weight: 400;
    font-size: var(--Font20px);
    margin-top: 20px;
}

.right_at_finger_tips ul li {
    display: flex;
    align-items: center;
    margin-top: 20px;
    gap: 20px;
}

.right_at_finger_tips ul li:first-child {
    margin-top: 27px;
}

.right_at_finger_tips ul li .image-pointer-right_at_finger img {
    width: 40px;
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    .right_at_finger_tips ul li .image-pointer-right_at_finger img {
        width: 85px;
    }
}

.right_at_finger_tips ul li .text-pointer-right_at_finger p {
    margin-top: 12px;
    font-weight: 400;
    font-size: var();
}


.right_at_finger_tips ul li .text-pointer-right_at_finger h6 {
    font-weight: 500;
    font-size: var(--Font20px);
    font-family: var(--Themefont);
    color: #000;
}

.right_at_store_buttons_group {
    padding-bottom: 55px;
}

.right_at_store_buttons_group ul {
    display: flex;
    gap: 20px;
}

.right_at_store_buttons_group ul li {
    width: fit-content;
}

.right_at_store_buttons_group ul li img {
    width: 190px;
    height: 65px;
    object-fit: contain;
}

.right_at_store_buttons_group ul li:nth-child(1) {
    width: 170px;
}

.right_at_side_image_col {
    position: relative;
    top: 45px;
}

/* Right At FingerTips Section End */

/* Services Offered Start */

.service-offered-section 
.service-offered-cards-wrapper 
.service-offered-card img {
    width: 100%;
    height: 160px;          
    object-fit: cover;     
}

.service-offered-section {
    padding: 50px 0px;
    background-image: url(../images/bg-blue.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.service-offered-section h2 {
    font-family: var(--Themefont);
    color: #000;
    font-weight: 600;
    font-size: var(--Font48px);
    text-align: center;
    margin-bottom: 30px;

}

.service-offered-section a {
    padding: 15px 40px;
    background-color: var(--Themepurple);
    border-radius: 1000px;
    color: #fff;
    text-decoration: none;
    border: 1px solid #4042E2;
    font-family: var(--Themefont);
    box-shadow: 0px 0px 16px 8px #45A9BD99;
    display: block;
    width: fit-content;
    margin-top: 30px;
    margin-inline: auto;
}

.service-offered-section p {
    font-family: var(--Themefont);
    color: #000;
    font-weight: 400;
    text-align: center;
    font-size: var(--Font20px);
    margin-top: 16px;
}

.service-offered-section .service-offered-cards-wrapper {
    margin-top: 20px;
}

.service-offered-section .service-offered-cards-wrapper ul {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}

.service-offered-section .service-offered-cards-wrapper ul li {
    width: 31.5%;
}

.service-offered-section .service-offered-cards-wrapper ul li .service-offered-card {
    background-color: #fff;
    box-shadow: 0px 16px 16px 0px #00000029;
    border-radius: 24px;
}

.service-offered-section .service-offered-cards-wrapper ul li .service-offered-card img {
    border-radius: 24px 24px 0px 0px;
    height: 128px;
    width: 100%;
}

.service-offered-section .service-offered-cards-wrapper ul li .service-offered-card .service-offered-card-text {
    padding: 20px 10px;
}

.service-offered-section .service-offered-cards-wrapper ul li .service-offered-card .service-offered-card-text p {
    font-size: var(--Font18px);
    margin-bottom: 10px;
    text-align: left;
    line-height: 1.5;
}

.service-offered-section .service-offered-cards-wrapper ul li .service-offered-card .service-offered-card-text h6 {
    font-size: var(--Font24px);
    font-family: var(--Themefont);
    font-weight: 500;
    margin-bottom: 24px;
}

/* Services Offered End */

/* Why Choose Us Start */

.why-choose-us-section {
    padding: var(--Commonpadding);
}

.why-choose-us-section h2 {
    font-family: var(--Themefont);
    color: #000;
    font-weight: 600;
    font-size: var(--Font48px);
    text-align: center;
    margin-bottom: 30px;
}

.why-choose-us-section p {
    font-family: var(--Themefont);
    color: #000;
    font-weight: 400;
    text-align: center;
    font-size: var(--Font20px);
    margin-top: 16px;
}

.why-choose-us-cards-wrapper {
    margin-top: 24px;
}

.why-choose-us-cards-wrapper ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.why-choose-us-cards-wrapper ul li {
    width: 32.5%;
}

.why-choose-us-cards-wrapper ul li .why-choose-us-card {
    box-shadow: 0px 16px 16px 0px #00000029;
    border-radius: 24px;
    background-color: #FFFBFB;
    padding: 40px 10px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;

    height: 100%; /* important */
}


.why-choose-us-cards-wrapper ul li .why-choose-us-card img {
    width: 50px;
    margin: auto;
    display: block;
}

.why-choose-us-cards-wrapper ul li .why-choose-us-card h6 {
    text-align: center;
    margin-top: 20px;
    font-family: var(--Themefont);
    font-weight: 500;
    font-size: var(--Font24px);
    color: #000;
}

.why-choose-us-cards-wrapper ul li .why-choose-us-card p {
    font-size: var(--Font18px);
    font-weight: 400;
    line-height: 1.5;
    padding: 0 5%;
}

@media screen and (max-width: 767px) {
    .why-choose-us-cards-wrapper ul {
        gap: 12px;
    }

    .why-choose-us-cards-wrapper ul li {
        width: 100%;
    }

    .why-choose-us-cards-wrapper ul li .why-choose-us-card {
        min-height: 150px; /* adjust if needed */
        padding: 24px 12px;
    }

    .why-choose-us-cards-wrapper ul li .why-choose-us-card h6 {
        font-size: 18px;
        line-height: 1.4;
    }
}

/* Why Choose Us End */

/* Join Us Section Start */
.join-us-section {
    max-width: 90%;
    margin: auto;
    padding: 0 15px;
    position: relative;
    padding: 70px 0px;
    border-radius: 24px;
}

.section-bg-image {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}

.section-bg-image img {
    height: 100%;
    width: 100%;
    /* object-fit: cover; */
    border-radius: 24px;
}

.join-us-section h2 {
    color: #fff;
    font-family: var(--Themefont);
    font-size: var(--Font48px);
    font-weight: 700;
    line-height: 1.4;
}

.join-us-section .container {
    position: relative;
}

.join-us-section a {
    padding: 15px 40px;
    background-color: var(--Themepurple);
    border-radius: 1000px;
    color: #fff;
    text-decoration: none;
    border: 1px solid #4042E2;
    font-family: var(--Themefont);
    box-shadow: 0px 0px 16px 8px #45A9BD99;
    display: block;
    width: fit-content;
    margin-top: 50px;
}

.join-us-section p {
    color: #fff;
    font-family: var(--Themefont);
    font-size: var();
}

/* Join Us Section End */

/* Meet Our Care Givers Start */
.meet-caregivers-section {
    padding: var(--Commonpadding);
    margin-top: 80px;
    background-color: #ECECEC;
}

.meet-caregivers-section h2 {
    font-family: var(--Themefont);
    color: #000;
    font-weight: 700;
    font-size: var(--Font48px);
    text-align: center;
}

.meet-caregivers-section p {
    font-family: var(--Themefont);
    color: #000;
    font-weight: 400;
    text-align: center;
    font-size: var(--Font20px);
    margin-top: 16px;
}

.meet-caregivers-section .caregivers-cards {
    margin-top: 20px;
}


.meet-caregivers-section .caregivers-cards ul {
    display: flex;
    justify-content: space-between;
}

.meet-caregivers-section .caregivers-cards ul li {
    width: 32%;
}

.meet-caregivers-section .caregivers-cards ul li .caregiver-card img {
    width: 100%;
    height: 280px;
    object-fit: cover;
    border-radius: 20px;
    margin-bottom: 32px;
}

.meet-caregivers-section .caregivers-cards ul li .caregiver-card h6 {
    font-family: var(--Themefont);
    font-size: var(--Font24px);
    font-weight: 500;
}

.meet-caregivers-section .caregivers-cards ul li .caregiver-card p {
    text-align: left;
    font-weight: 400;
    color: #000000;
    margin-top: 20px;
}

.meet-caregivers-section .caregivers-cards ul li .caregiver-card p strong {
    font-weight: 500;
}

.meet-caregivers-section .caregivers-cards ul li .caregiver-card a {
    border: 2px solid #000;
    padding: 16px 20px;
    color: #000;
    text-decoration: none;
    font-family: var(--Themefont);
    display: block;
    margin-top: 35px;
    border-radius: 30px;
    width: fit-content;
    font-weight: 500;
}

/* Meet Our Care Givers End */

/* Our Plans Section Start */
.our-plans-section {
    padding: var(--Commonpadding);
}

.our-plans-section h2 {
    text-align: center;
    font-family: var(--Themefont);
    font-weight: 600;
    color: #000;
}

.our-plans-section p {
    color: #000;
    font-family: var(--Themefont);
    font-size: var(--Font20px);
    text-align: center;
    margin-top: 20px;
}

.our-plans-cards-wrapper {
    margin-top: 20px;
}

.our-plans-cards-wrapper ul {
    display: flex;
    justify-content: space-around;
}

.our-plans-cards-wrapper ul li {
    width: 28%;
}

.card-wrap-plans .plan-card-top-box {
    display: flex;
    justify-content: center;
    gap: 20px;
    align-items: flex-start;
    min-height: 120px;
}

.card-wrap-plans .plan-card-top-box .plan-card-top-left-col {
    min-height: 120px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.card-wrap-plans .plan-card-top-box .plan-card-top-left-col > p {
    min-height: 52px;
}

.card-wrap-plans .plan-card-top-box .plan-card-month-col h3 {
    font-family: var(--Themefont);
    font-size: 65px;
    font-weight: 600;
    color: #000;
    text-align: center;
}

.card-wrap-plans .plan-card-top-box .plan-card-month-col h6 {
    font-family: var(--Themefont);
    text-transform: uppercase;
    font-weight: 600;
    color: #000;
    font-size: var(--Font24px);
}

.card-wrap-plans .plan-card-top-box .plan-card-top-left-col .plan-card-badge {
    padding: 5px;
    border-radius: 100px;
    display: flex;
    align-items: center;
    gap: 5px;
    background-color: #D9D9D933;
    box-shadow: 0px 4px 4px 0px #0000001A;

}

.card-wrap-plans .plan-card-top-box .plan-card-top-left-col .plan-card-badge img {
    width: 20px;
    height: 20px;
    object-fit: contain;
}

.card-wrap-plans .plan-card-top-box .plan-card-top-left-col .plan-card-badge p {
    font-size: var(--Font16px);
    font-weight: 500;
    color: #000;
    margin-top: 0;
}

.card-wrap-plans .plan-card-top-box h4 {
    color: #000;
    font-weight: 600;
    font-family: var(--Themefont);
    font-size: var(--Font24px);
    margin: 10px 0px;
}

.card-wrap-plans .plan-card-top-box p {
    margin-top: 0;
}

.our-plans-cards-wrapper ul li .plan-card-single {
    background: linear-gradient(139.27deg, #402566 1.94%, #804ACC 100.95%);
    border-radius: 24px;
    padding: 24px;
    margin-top: 12px;
}

.our-plans-cards-wrapper ul li .plan-card-single h5 {
    font-family: var(--Themefont);
    font-weight: 600;
    font-size: var(--Font24px);
    color: #fff;
    text-transform: capitalize;
}

.our-plans-cards-wrapper ul li .plan-card-single p {
    text-align: left;
    font-size: var(--Font16px);
    line-height: 1.6;
    color: #fff;
}

.our-plans-cards-wrapper ul li .plan-card-single ul {
    display: flex;
    flex-direction: column;
}

.our-plans-cards-wrapper ul li .plan-card-single ul li {
    width: 100%;
    display: flex;
    gap: 20px;
}

.our-plans-cards-wrapper ul li .plan-card-single ul li img {
    width: 24px;
    object-fit: contain;
}

.our-plans-cards-wrapper ul li .plan-card-single ul li p {
    text-align: left;
    font-size: var(--Font16px);
    line-height: 1.4;
}

.our-plans-cards-wrapper ul li .plan-card-single .buy-plan {
    padding: 15px 20px;
    background-color: #fff;
    color: var(--Themepurple);
    font-family: var(--Themefont);
    font-size: var(--Font24px);
    display: block;
    text-align: center;
    text-decoration: none;
    border-radius: 1000px;
    box-shadow: 0px 4px 4px 0px #0000001A inset;
    margin-top: auto;
    font-weight: 500;
    text-transform: uppercase;
    border: none;
    width: 100%;
    line-height: 1.2;
    transition: all 0.2s ease-in-out;
}

.our-plans-cards-wrapper ul li .plan-card-single button.buy-plan:hover,
.our-plans-cards-wrapper ul li .plan-card-single button.buy-plan:focus {
    background-color: var(--Themepurple);
    color: #fff;
    box-shadow: none;
}
/* FIX: Equal height for all plan cards */
.our-plans-cards-wrapper ul li .plan-card-single {
    min-height: 370px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.our-plans-cards-wrapper ul {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding: 0;
}

.our-plans-cards-wrapper ul li {
    width: calc(25% - 15px); /* 4 cards per row */
    list-style: none;
    display: flex;
}

.our-plans-cards-wrapper ul li .card-wrap-plans {
    width: 100%;
    display: flex;
    flex-direction: column;
}
@media (max-width: 992px) {
    .our-plans-cards-wrapper ul li {
        width: calc(50% - 10px); /* 2 per row */
    }
}

@media (max-width: 576px) {
    .our-plans-cards-wrapper ul li {
        width: 100%; /* 1 per row */
    }
}

/* Our Plans Section End */

/* Faq Section Start */
/*  */
.faq-section-wrapper {
    position: relative;
    padding: var(--Commonpadding);
}


.faq-section-wrapper .section-bg-image img {
    border-radius: 0;
}

.faq-section-wrapper .container {
    position: relative;
}


.faq-section-wrapper .faq-inner-col {
    background-color: #fff;
    padding: 30px;
    border-radius: 20px;
}


.faq-section-wrapper .faq-inner-col h6 {
    font-family: var(--Themefont);
    font-weight: 400;
    font-size: var(--Font20px);
    margin: 20px 0;
    color: #000;
}


.faq-section-wrapper h2 {
    color: #000;
    font-family: var(--Themefont);
    font-size: var(--Font48px);
}


.faq-section-wrapper .accordion-item,
.faq-section-wrapper .accordion-button {
    border: none !important;
}


.faq-section-wrapper .accordion-item {
    position: relative;
}

.faq-section-wrapper .accordion-item::after {
    content: "";
    display: block;
    height: 1px;
    background-color: #000;
}


.faq-section-wrapper .accordion-item:last-child::after {
    display: none;
}


.faq-inner-col .accordion-header button {
    background-color: transparent;
    color: #000;
    font-family: var(--Themefont);
    font-size: var(--Font18px);
    font-weight: 400;
    padding: 24px 0;
    position: relative;
}


.faq-inner-col .accordion-button {
    box-shadow: none;
}

.faq-inner-col .accordion-button:not(.collapsed) {
    padding-bottom: 24px;
}

.faq-inner-col .accordion-body {
    padding: 0;
}


.faq-inner-col .accordion-item p {
    font-family: var(--Themefont);
    font-size: var(--Font18px);
    line-height: 1.6;
}


.faq-inner-col .accordion-button:focus {
    box-shadow: none;
}


.faq-inner-col .accordion-button::after {
    content: "+";
    background-image: none;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 32px;
    color: var(--Themegreen);
}

.faq-inner-col .accordion-button:not(.collapsed)::after {
    content: "-";
    font-size: 36px;
}

@media (max-width: 767px) {

    .faq-section-wrapper .faq-inner-col {
        padding: 20px;
    }

    .faq-section-wrapper h2 {
        line-height: 1.4;
    }

    .faq-section-wrapper .faq-inner-col h6 {
        margin: 12px 0;
        line-height: 1.6;
    }

    .faq-section-wrapper .accordion-item::after {
        background-color: #ccc; 
    }

    .faq-inner-col .accordion-button::after {
        font-size: 26px;
        right: 0;
    }
}

/* Faq Section End */


/* Download App Section Start */

.download-app-section {
    position: relative;
    max-width: 90%;
    margin: 160px auto 80px auto;
    padding: var(--Commonpadding);
}

.download-app-section .bg-image-section {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}

.download-app-section .bg-image-section img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 24px;
}

.download-app-section .container {
    position: relative;
}

.download-app-section h2 {
    font-family: var(--Themefont);
    color: var(--Themepurple);
    font-weight: 600;
}

.download-app-section h6 {
    font-family: var(--Themefont);
    font-weight: 600;
    color: #000;
    font-size: var(--Font24px);
    margin-top: 20px;

}

.download-app-section ul {
    margin-top: 39px;
}

.download-app-section ul li img {
    width: 180px;
}

.download-app-section .download-app-right-col img {
    transform: scale(2.5);
    position: relative;
    top: -44px;
}

/* Download App Section End */

/* Subscribe Section Start */
.join-us-section-second {
    position: relative;
}

.join-us-section-second .bg-image-section {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}

.join-us-section-second .bg-image-section img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 24px;
}

.join-us-section-second .container {
    position: relative;
}

.join-us-section-second h2 {
    font-size: var(--Font40px);
    font-weight: 400;
    line-height: normal;
}

.join-us-section-second p {
    font-size: var(--Font22px);
    font-weight: 400;
    margin: 20px 0px;
}

.join-us-section-second .subscribe-form {
    display: flex;
    gap: 30px;
    margin-top: 26px;
}

.join-us-section-second .subscribe-form input[type="email"] {
    border: 1px solid #d4d4d4;
    border-radius: 100px;
    height: 45px;
    width: 400px;
    padding-left: 15px;
    font-family: var(--Themefont);
    color: #000;
}

.join-us-section-second .subscribe-form input[type="email"]::placeholder {
    color: #000;
    font-size: var(--Font20px);
}

.join-us-section-second .subscribe-form input[type="submit"],
.join-us-section-second .subscribe-form button[type="submit"] {
    padding: 15px 40px;
    background-color: var(--Themepurple);
    border-radius: 1000px;
    color: #fff;
    text-decoration: none;
    border: 1px solid #4042E2;
    font-family: var(--Themefont);
    box-shadow: 0px 0px 16px 8px #45A9BD99;
    display: block;
    width: fit-content;
    margin-top: 0px;
}

/* Subscribe Section End */

/* Footer Start */

footer {
    padding-top: 40px;
    margin-top: 0px;
    position: relative;
}

footer::after {
    position: absolute;
    content: '';
    height: 100%;
    width: 100%;
    right: 0;
    top: 0;
    background: linear-gradient(270deg, #0FB8AE 0%, #3A1363 100%);
    z-index: 1;
}

footer::before {
    position: absolute;
    content: '';
    height: 100%;
    width: 100%;
    right: 0;
    bottom: 0;
    background-image: url(../images/bg-before-logo-icon.png);
    background-position: right 54px;
    background-repeat: no-repeat;
    z-index: 2;
    opacity: 30%;
    background-size: 22%;
}

footer .container {
    position: relative;
    z-index: 3;
}

footer .footer-info-section .footer-logo {
    display: block;
}

footer .footer-info-section .footer-logo img {
    width: 200px;
}

footer .footer-info-section p {
    color: #fff;
    font-family: var(--Themefont);
    font-weight: 400;
    font-size: var(--Font16px);
    line-height: 1.6;
    margin-top: 19px;
    opacity: 70%;
}

footer .footer-links-col h4 {
    color: #fff;
    font-family: var(--Themefont);
    font-weight: 600;
    font-size: var(--Font20px);
}

footer .footer-links-col ul li {
    margin-top: 30px;
}

footer .footer-links-col ul li a {
    text-decoration: none;
    color: #fff;
    font-family: var(--Themefont);
    font-size: var(--Font16px);
    display: flex;
    align-items: center;
    gap: 10px;
}

footer .footer-links-col ul li img {
    width: 27px;
}

footer .download-col-footer h4 {
    color: #fff;
    font-family: var(--Themefont);
    font-weight: 600;
    font-size: var(--Font20px);
}

footer .download-col-footer ul {
    display: flex;
    flex-direction: column;
}

footer .download-col-footer ul li {
    margin-top: 20px;
}

footer .download-col-footer ul li img {
    width: 180px;
    height: 70px;
    object-fit: contain;
}

footer .col-lg-3.last-col-footer {
    max-width: 18%;
}

footer .col-lg-3.first-col-footer {
    width: 32%;
    padding-right: 5%;
}

footer p.copyright-text {
    text-align: center;
    font-family: var(--Themefont);
    font-size: var(--Font18px);
    padding-top: 90px;
    padding-bottom: 10px;
    color: #FFFFFF;
    opacity: 40%;
    font-weight: 400;
}

/* Footer End */

/* Become a care giver Page Start*/

.caregiver-banner-top-headings {
    text-align: center;
    padding: 30px 0px;
    margin-bottom: 40px;
}

.caregiver-banner-top-headings h1 {
    font-family: var(--Themefont);
    color: #000;
    font-weight: 600;
    font-size: var(--Font48px);
}

.caregiver-banner-top-headings p {
    font-family: var(--Themefont);
    color: #000;
    font-weight: 400;
    font-size: var(--Font20px);
    line-height: 1.6;
    margin-top: 20px;
}

.caregiver-banner-left-col ul li {
    display: flex;
}

.caregiver-banner-left-col ul li {
    display: flex;
    gap: 20px;
}

.caregiver-banner-left-col ul li {
    font-family: var(--Themefont);
    margin-bottom: 70px;
}

.caregiver-banner-left-col ul li h6 {
    font-size: var(--Font24px);
    font-weight: 500;
    color: #000;
    margin-bottom: 20px;
}

.caregiver-banner-left-col ul li p {
    font-size: var(--Font18px);
    color: #000;
    line-height: 1.6;
}

.caregiver-banner-right-col ul li {
    display: flex;
    margin-bottom: 10%;
}

.caregiver-banner-right-col ul li {
    display: flex;
    gap: 20px;
    margin-bottom: 10%;
}

.caregiver-banner-right-col ul li {
    font-family: var(--Themefont);
    margin-bottom: 80px;
}

.caregiver-banner-right-col ul li h6 {
    font-size: var(--Font24px);
    font-weight: 500;
    color: #000;
    margin-bottom: 20px;
}

.caregiver-banner-right-col ul li p {
    font-size: var(--Font18px);
    color: #000;
    line-height: 1.6;
}

.caregiver-banner-left-col ul li .caregiver-left-col-point {
    width: 80%;
    text-align: end;
}

.caregiver-banner-left-col ul li .caregiver-left-col-point-image {
    width: 20%;
}

.caregiver-banner-left-col ul li .caregiver-left-col-point-image .image-inner-left-col-caregiver {
    box-shadow: 0px 4px 4px 0px #00000029;
    border-radius: 8px;
    height: 80px;
    width: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
}

.caregiver-banner-left-col ul li .caregiver-left-col-point-image img {
    width: 50px;
    height: 50px;
    object-fit: contain;
}

.caregiver-banner-right-col ul li .caregiver-left-col-point {
    text-align: end;
}

.caregiver-banner-section {
    padding-bottom: 80px;
    padding-top: 40px;
}

.caregiver-banner-section .col-lg-4 {
    display: flex;
    align-items: center;
}

.caregiver-banner-right-col ul li .caregiver-right-col-point {
    width: 80%;
}

.caregiver-banner-right-col ul li .caregiver-right-col-point-image {
    width: 20%;
}

.caregiver-banner-right-col ul li .caregiver-right-col-point-image .image-inner-right-col-caregiver {
    box-shadow: 0px 4px 4px 0px #00000029;
    border-radius: 8px;
    height: 80px;
    width: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.caregiver-banner-right-col ul li .caregiver-right-col-point-image img {
    width: 50px;
    height: 50px;
    object-fit: contain;
}

.caregiver-banner-right-col ul li .caregiver-right-col-point {
    text-align: left;
}

.caregiver-banner-section .col-lg-4 {
    display: flex;
    align-items: center;
}

.caregiver-banner-center-col {
    position: relative;
    width: 100%;
}

.caregiver-banner-center-col img {
    width: 285px;
    height: 427px;
    margin: auto;
    display: block;
    position: relative;
    top: -45px;
}

.caregiver-banner-center-image-col {
    position: relative;
}

.caregiver-banner-center-image-col {
    position: relative;
    z-index: 1;
}

.caregiver-banner-center-image-col {
    position: relative;
    z-index: 1;
}

.caregiver-banner-center-image-col::before,
.caregiver-banner-center-image-col::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    height: 319px;
    width: 319px;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}

/* Inner ring - darker teal */
.caregiver-banner-center-image-col::before {
    background-color: #009688;
    animation: pulse-inner 2.5s infinite;
}

/* Outer ring - lighter teal */
.caregiver-banner-center-image-col::after {
    background-color: #b2dfdb;
    animation: pulse-outer 2.5s infinite;
}

@keyframes pulse-inner {
    0% {
        transform: translate(-50%, -50%);
        opacity: 1;
        box-shadow: 0 0 0 0 rgba(0, 150, 136, 0.7);
    }

    70% {
        transform: translate(-50%, -50%);
        opacity: 1;
        box-shadow: 0 0 0 25px rgba(0, 150, 136, 0.6);
    }

    100% {
        transform: translate(-50%, -50%);
        opacity: 0.9;
        box-shadow: 0 0 0 0 rgba(0, 150, 136, 0.4);
    }
}

@keyframes pulse-outer {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.8;
        box-shadow: 0 0 0 0 rgba(178, 223, 219, 0.6);
    }

    70% {
        transform: translate(-50%, -50%) scale(1.5);
        opacity: 0;
        box-shadow: 0 0 0 35px rgba(178, 223, 219, 0);
    }

    100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0;
        box-shadow: 0 0 0 0 rgba(178, 223, 219, 0);
    }
}

.caregiver-banner-center-col a {
    padding: 15px 40px;
    background-color: var(--Themepurple);
    border-radius: 1000px;
    color: #fff;
    text-decoration: none;
    border: 1px solid #4042E2;
    font-family: var(--Themefont);
    box-shadow: 0px 0px 16px 8px #45A9BD99;
    display: block;
    width: fit-content;
    margin: auto;
    font-size: var(--Font24px);
}



.how-it-works-section {
    padding: var(--Commonpadding);
    background: linear-gradient(270deg, #0FB8AE 0%, #3A1363 100%);
}

.how-it-works-section .how-it-works-container {
    width: 95%;
    margin-left: 15px;
    padding-left: 15px;
    margin-left: auto;
    display: flex;
    align-items: center;
}

.how-it-works-section .how-it-works-container .how-it-works-left-col {
    width: 30%;
}

.how-it-works-section .how-it-works-container .how-it-works-left-col h2 {
    color: #fff;
    font-family: var(--Themefont);
    font-size: var(--Font48px);
    font-weight: 600;
    line-height: 1.7;
}

.how-it-works-section .how-it-works-container .how-it-works-left-col p {
    color: #fff;
    font-family: var(--Themefont);
    line-height: 1.5;
    font-weight: 400;
    font-size: var(--Font20px);
}

.how-it-works-section .how-it-works-container .how-it-works-right-col {
    width: 70%;
}

.how-it-works-slide {
    background-color: #fff;
    border-radius: 24px;
    padding: 8%;
    height: 200px;
}

.how-it-works-slide .slider-slide-image-wrap {
    width: 45px;
    height: 45px;
    border-radius: 8px;
    box-shadow: 0px 4px 4px 0px #00000029;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.how-it-works-slide .slider-slide-image-wrap img {
    width: 30px;
    height: 30px;
    object-fit: contain;
}

.how-it-works-slide h6 {
    font-family: var(--Themefont);
    font-size: var(--Font24px);
    font-weight: 500;
    margin-bottom: 0px;
    line-height: 1.5;
}


.how-it-works-slide p {
    font-family: var(--Themefont);
    font-size: var(--Font18px);
    font-weight: 400;
    line-height: 1.7;
}


.get-in-touch-section {
    position: relative;
    padding: var(--Commonpadding);
    margin-bottom: 80px;
}

.get-in-touch-section .section-bg-image {
    border-radius: 0;
}

.get-in-touch-section .section-bg-image img {
    border-radius: 0;
}

.get-in-touch-section .container {
    position: relative;
}

.get-in-touch-section .col-lg-12 h2 {
    text-align: center;
    font-family: var(--Themefont);
    font-size: var(--Font48px);
    color: #000;
}

.get-in-touch-section .col-lg-12 p {
    text-align: center;
    font-size: var(--Font24px);
    font-family: var(--Themefont);
    color: #000;
    font-weight: 400;
    margin: 20px 0px;
}

.get-in-touch-section .get-in-touch-form-col {
    border-radius: 24px;
    background-color: #fff;
    box-shadow: 0px 16px 16px 0px #00000029;
    padding: 40px;
}

.get-in-touch-section .get-in-touch-form-row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.get-in-touch-section .get-in-touch-input-col {
    width: 47.5%;
    display: flex;
    flex-direction: column;
    position: relative;
}

.get-in-touch-section .get-in-touch-input-col input {
    border: 1px solid #E8E6EA;
    height: 50px;
    border-radius: 15px;
    font-family: var(--Themefont);
    padding-inline: 10px;
    font-size: var(--Font14px);
}

.get-in-touch-section .get-in-touch-input-col select {
    border: 1px solid #E8E6EA;
    height: 50px;
    border-radius: 15px;
    font-family: var(--Themefont);
    font-size: var(--Font16px);
    padding-left: 10px;
}

.get-in-touch-section .get-in-touch-input-col label {
    font-family: var(--Themefont);
    color: #00000066;
    font-size: var(--Font16px);
    position: absolute;
    background-color: #fff;
    padding: 5px;
    left: 15px;
    top: -10px;
}

.get-in-touch-input-col.submit-col {
    margin: 30px auto 0 auto;
}

.get-in-touch-input-col.submit-col input[type="submit"],
.get-in-touch-input-col.submit-col button[type="submit"] {
    padding: 15px 40px;
    background-color: var(--Themepurple);
    border-radius: 1000px;
    color: #fff;
    text-decoration: none;
    border: 1px solid #4042E2;
    font-family: var(--Themefont);
    box-shadow: 0px 0px 16px 8px #45A9BD99;
    font-size: var(--Font24px);
    margin: auto;
    width: fit-content;
}

.get-in-touch-info-col ul li {
    display: flex;
    gap: 15px;
    padding: 10px 0px 10px 20px;
    width: 85%;
}

.get-in-touch-info-col ul li:not(:last-child) {
    border-bottom: 1px solid #0000002e;
}

.get-in-touch-info-col ul li a {
    text-decoration: none;
    color: #000;
}

.get-in-touch-icon img {
    width: 30px;
    height: 30px;
    object-fit: contain;
}

.get-in-touch-text h6 {
    font-family: var(--Themefont);
    font-weight: 600;
    font-size: var(--Font18px);
    color: #000;
}

.get-in-touch-text p {
    font-family: var(--Themefont);
    font-weight: 400;
    font-size: var(--Font18px);
    color: #000;
    padding-right: 30%;
    line-height: 1.6;
    margin-top: 10px;
}

.get-in-touch-text p:has(a) {
    width: 100%;
    padding-right: 0;
    margin-top: 0;
}

.get-in-touch-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Become a care giver Page End*/

/* Contact Page Start */
.contact-banner-section {
    position: relative;
    overflow: hidden;
}

.contact-banner-section .section-bg-image img {
    border-radius: 0;
}

.contact-banner-section .container {
    position: relative;
}

.contact-banner-section .contact-banner-left-col {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    padding: 27% 0px;
}

.contact-banner-section .contact-banner-left-col h1 {
    font-size: var(--Font56px);
    font-family: var(--Themefont);
    color: var(--Themegreen);
    font-weight: 600;
    line-height: 1.6;
}

.contact-banner-section .contact-banner-left-col h1 span {
    padding: 10px;
    background-color: var(--Themepurple);
    color: #fff;
}

.contact-banner-section .contact-banner-left-col p {
    font-size: var(--Font24px);
    font-weight: 600;
    color: #000;
    font-family: var(--Themefont);
    line-height: 1.4;
    margin-top: 20px;
}

.contact-banner-section .contact-banner-right-col {
    height: 100%;
}

.contact-banner-section .contact-page-banner-image {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: end;
    position: relative;
}

.contact-banner-section .contact-page-banner-image img {
    width: 550px;
    position: relative;
    z-index: 2;
}

/* .contact-page-banner-image::before {
    position: absolute;
    content: '';
    height: 560px;
    width: 560px;
    bottom: -114px;
    border-radius: 50%;
    background-image: url(../images/contact-new-image.png) ;
    z-index: 1;
} */


/* Contact Page End */

#header main {
    overflow: hidden;
}

#header a,
#header button {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: none;
    outline: none;
    background: none;
}

#header img,
#header video {
    display: block;
    max-width: 100%;
    height: auto;
    -o-object-fit: cover;
    object-fit: cover;
}

#header img {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: -moz-crisp-edges;
    image-rendering: crisp-edges;
}

@-webkit-keyframes slideLeft {
    0% {
        opacity: 0;
        transform: translateX(100%);
    }

    100% {
        opacity: 1;
        transform: translateX(0%);
    }
}

@keyframes slideLeft {
    0% {
        opacity: 0;
        transform: translateX(100%);
    }

    100% {
        opacity: 1;
        transform: translateX(0%);
    }
}

@-webkit-keyframes slideRight {
    0% {
        opacity: 1;
        transform: translateX(0%);
    }

    100% {
        opacity: 0;
        transform: translateX(100%);
    }
}

@keyframes slideRight {
    0% {
        opacity: 1;
        transform: translateX(0%);
    }

    100% {
        opacity: 0;
        transform: translateX(100%);
    }
}

#header .section {
    margin: 0 auto;
    padding: 6rem 0 2rem;
}

#header .container {
    max-width: 75rem;
    height: auto;
    margin-inline: auto;
    padding-inline: 1.5rem;
}

#header .centered {
    text-align: center;
    vertical-align: middle;
    margin-bottom: 1rem;
}

.header {
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    z-index: 100;
    margin: 0 auto;
    background-color: #fff;
    box-shadow: var(--shadow-medium);
}

.darkmode .header {
    background-color: #fff;
}

#header .navbar {
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 65px;
    margin: 0 auto;
}

.navbar .navbar__left {
    display: flex;
    align-items: center;
    flex: 0 0 17%;
}

.badge.bg-info {
    background-color: var(--Themegreen) !important;
    font-weight: 400;
}

.badge.bg-primary {
    background-color: var(--Themepurple) !important;
    font-weight: 400;
}

.login-with-social ul li:nth-child(2) {
    padding: 0;
}

.login-with-social ul li:nth-child(2)>div {
    padding: 0px 10px;
    border: none !important;
    height: 57px !important;
    display: flex;
    align-items: center;
}

.login-with-social ul li:nth-child(2) div{
    border: none !important;
    padding: 0 !important;
}

.login-with-social ul li:nth-child(2) div:hover{
    background-color: #fff !important;
    background: #fff !important;
    box-shadow: unset !important;
    border: none !important;
}

/* Add these styles to your CSS file */

/* Desktop Search Styles */
.caregiver-job-search {
  position: relative;
}

.search-results-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: white;
  border: 1px solid #ddd;
  border-radius: 4px;
  max-height: 300px;
  overflow-y: auto;
  z-index: 1000;
  box-shadow: 0 2px 10px rgba(0,0,0,0.1);
  margin-top: 5px;
}

.search-result-item {
  padding: 12px 15px;
  border-bottom: 1px solid #eee;
  cursor: pointer;
  transition: background-color 0.2s;
}

.search-result-item:hover {
  background-color: #f5f5f5;
}

.search-result-item:last-child {
  border-bottom: none;
}

.job-main-line {
  font-weight: bold;
  color: #333;
  font-size: 14px;
  margin-bottom: 4px;
}

.job-location {
  font-size: 12px;
  color: #666;
}

.search-result-item.loading,
.search-result-item.no-results {
  text-align: center;
  color: #666;
  font-style: italic;
  padding: 20px;
}

/* Mobile Search Styles */
.mobile-search-container {
  padding: 15px;
  border-bottom: 1px solid #eee;
}

.mobile-search-input {
  position: relative;
}

.mobile-search-input .form-control {
  width: 100%;
  padding: 10px 15px;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-size: 14px;
}

.search-loading {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  color: #666;
}

.mobile-search-results {
  margin-top: 10px;
  max-height: 200px;
  overflow-y: auto;
  border: 1px solid #ddd;
  border-radius: 4px;
  background: white;
}

.mobile-search-results .search-result-item {
  padding: 10px 12px;
}

.mobile-search-results .job-main-line {
  font-size: 13px;
}

.mobile-search-results .job-location {
  font-size: 11px;
}

/* Dark mode support */
.darkmode .search-results-dropdown,
.darkmode .mobile-search-results {
  background: #333;
  border-color: #555;
}

.darkmode .search-result-item {
  border-color: #555;
  color: #fff;
}

.darkmode .search-result-item:hover {
  background-color: #444;
}

.darkmode .job-main-line {
  color: #fff;
}

.darkmode .job-location {
  color: #ccc;
}

.darkmode .search-result-item.loading,
.darkmode .search-result-item.no-results {
  color: #ccc;
}

.mete-item-title{
    text-transform: capitalize;
}

.user-type-popup{
    font-family: var(--Themefont);
}

/* Responsive adjustments */
@media (max-width: 767px) {
  .mobile-search-container {
    padding: 10px 15px;
    position: relative;
    top: -55px;
  }
  
  .mobile-search-input .form-control {
    padding: 8px 12px;
  }
}

@media (max-width: 766px) {
    .navbar .navbar__left {
        flex: 0 0 auto;
    }
}

.navbar .navbar__center {
    display: flex;
}

@media (max-width: 766px) {
    .navbar .navbar__center {
        flex: 0 0 100%;
        order: 3;
        align-items: center;
    }
}

.navbar .navbar__right {
    display: flex;
    flex: 0 0 17%;
    align-items: center;
    justify-content: flex-end;
    -moz-column-gap: 1.5rem;
    column-gap: 1.5rem;
}

@media (max-width: 766px) {
    .navbar .navbar__right {
        flex: 0 0 auto;
        align-items: center;
    }
}

.brand {
    display: flex;
    align-items: center;
    order: 1;
}

.brand svg {
    width: 60px;
    height: 60px;
}

@media (max-width: 991px) {
    .menu {
        position: fixed;
        top: 0;
        left: 0;
        width: 350px;
        max-width: 85%;
        height: 100%;
        z-index: 100;
        overflow: hidden;
        background-color: #fff;
        transform: translate(-100%);
        transition: all 0.4s ease-in-out;
    }

    .menu.is-active {
        transform: translate(0%);
    }

    .darkmode .menu {
        background-color: var(--color2);
    }
}

.menu .menu__header {
    display: none;
    box-shadow: var(--shadow-medium);
}

@media (max-width: 991px) {
    .menu .menu__header {
        position: relative;
        top: 0;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        height: 4rem;
        z-index: 110;
        visibility: hidden;
        background: transparent;
    }

    .menu .menu__header.is-active {
        visibility: visible;
        background-color: #fff;
    }

    .menu .menu__header.is-active>.menu__arrow {
        display: flex;
    }

    .darkmode .menu .menu__header.is-active {
        background-color: var(--color2);
    }
}

@media (max-width: 991px) {
    .menu .menu__header .menu__arrow {
        display: none;
        justify-content: center;
        align-items: center;
        cursor: pointer;
        width: 3rem;
    }

    .menu .menu__header .menu__arrow:hover i {
        color: var(--color);
    }

    .menu .menu__header .menu__arrow>i {
        font-size: 1.5rem;
        color: #000;
        transition: all 0.25s ease;
    }

    .darkmode .menu .menu__header .menu__arrow>i {
        color: #fff;
    }
}

@media (max-width: 991px) {
    .menu .menu__header .menu__title {
        cursor: pointer;
        font-weight: 500;
        text-transform: capitalize;
        color: #000;
        transition: all 0.25s ease;
    }

    .menu .menu__header .menu__title:hover {
        color: var(--color);
    }

    .darkmode .menu .menu__header .menu__title {
        color: #fff;
    }
}

@media (max-width: 991px) {
    .menu .menu__inner {
        height: 100%;
        margin-top: -3rem;
        overflow-y: auto;
        overflow-x: hidden;
        flex-direction: column;
    }
}

.menu .menu__inner .menu__item {
    position: static;
    display: inline-block;
    padding-right: 20px;
    padding: 15px 20px 15px 0;
}

.menu .menu__inner .menu__item:last-child {
    padding-right: 0;
}

.menu .menu__inner .menu__item:hover>.menu__link {
    color: var(--color);
}

.darkmode .menu .menu__inner .menu__item:hover>.menu__link {
    color: var(--color);
}

@media (max-width: 991px) {
    .menu .menu__inner .menu__item {
        display: block;
        padding: 0;
    }
}

@media (min-width: 991px) {
    .menu .menu__inner .menu__item:hover>.menu__link i {
        transform: rotate(-90deg);
    }
}

@media (min-width: 991px) {
    .menu .menu__inner .menu__item.menu__dropdown:hover>.submenu {
        opacity: 1;
        visibility: visible;
        top: 95%;
    }
}

.menu .menu__inner .menu__item .menu__link {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 16px;
    font-weight: 500;
    color: #000;
    text-transform: capitalize;
    transition: all 0.25s ease;
    font-family: var(--Themefont);
    text-decoration: none;
}

@media (max-width: 991px) {
    .menu .menu__inner .menu__item .menu__link {
        justify-content: flex-start;
        padding: 15px 0px 0px 20px;
        gap: 18px;
        font-size: 13px !important;
        position: relative;
        left: 0;
        color: #000;
        -webkit-background-clip: unset;
        background-clip: unset;
        background: none;
        -webkit-text-fill-color: unset;
    }

    .menu .menu__inner .menu__item span.menu__link img {
        width: 20px !important;
        margin-right: 10px !important;
        left: 8px;
        position: relative;
    }

    .menu .menu__inner .menu__item .menu__link img {
        height: 30px !important;
        width: 30px !important;
        object-fit: contain !important;
    }

    .menu .menu__inner .menu__item .menu__link img {
        height: 30px !important;
        width: 30px !important;
        object-fit: contain !important;
    }

    .menu .menu__inner {
        padding-bottom: 45px !important;
    }
}

.menu .menu__inner .menu__item .menu__link>i {
    margin-left: 5px;
    font-size: 1.35rem;
    transform: rotate(90deg);
    transition: 0.35s;
}

.hire-mobile-heading {
    display: none;
}

.caregiver-icon-image .verified {
    position: absolute;
    width: 40px;
    height: 40px;
    top: -19px;
    right: -20px;
}

.profile-details-card .profile-image img:nth-child(1) {
    height: 100px;
    width: 100px;
    object-fit: cover;
    margin: auto;
    display: block;
    border-radius: 50%;
}

@media (max-width: 991px) {
    .menu .menu__inner .menu__item .menu__link>i {
        margin-left: 10px;
        transform: rotate(0deg);
    }

    .form-row-banner-tab button {
        padding: 0 !important;
    }
}

.darkmode .menu .menu__inner .menu__item .menu__link {
    color: #fff;
}

.submenu {
    position: absolute;
    z-index: 100;
    top: 110%;
    left: 50%;
    width: 100%;
    height: auto;
    padding: 20px 15px;
    border-radius: 0.25rem;
    border-top: 2px solid var(--color);
    background-color: #fff;
    box-shadow: var(--shadow-medium);
    opacity: 0;
    visibility: hidden;
    transition: all 0.35s ease-in-out;
    transform: translateX(-50%);
}

.darkmode .submenu {
    border-top: 2px solid var(--color);
    background-color: var(--color2);
}

@media (min-width: 992px) {

    .submenu.megamenu__text,
    .submenu.megamenu__image {
        max-width: 992px;
    }
}

.switch {
    position: relative;
    display: block;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-right: 10px;
}

.switch .switch__light,
.switch .switch__dark {
    position: absolute;
    top: 50%;
    left: 50%;
    transform-origin: center;
    transform: translate(-50%, -50%);
    transition: all 0.3s ease-in;
}

.switch .switch__light {
    font-size: 20px;
    visibility: visible;
    color: #000;
}

.darkmode .switch .switch__light {
    font-size: 0;
    visibility: hidden;
}

.switch .switch__dark {
    font-size: 0;
    visibility: hidden;
    color: #fff;
}

.darkmode .switch .switch__dark {
    font-size: 20px;
    visibility: visible;
}

.overlay {
    position: fixed;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9;
    opacity: 0;
    visibility: hidden;
    background-color: rgba(0, 0, 0, 0.7);
    transition: all 0.45s ease-in-out;
    pointer-events: none;
}

.button-mobile-nav-bar a {
    background-color: var(--Themepurple) !important;
    border-radius: 1000px;
    color: #fff;
    text-decoration: none;
    border: 1px solid #4042E2;
    font-family: var(--Themefont);
    box-shadow: 0px 0px 4px 3px #45A9BD99;
    display: block;
    width: fit-content;
    margin-top: 0px;
    padding: 12px 20px;
    font-size: var(--Font20px);
}

@media (max-width: 991px) {
    .overlay {
        cursor: url("../images/icons8-cross-60.png"), zoom-out;
        pointer-events: visible;
    }

    .overlay.is-active {
        opacity: 1;
        visibility: visible;
    }
}

.burger {
    position: relative;
    display: block;
    cursor: pointer;
    width: 25px;
    height: 15px;
    margin-right: 15px;
    opacity: 0;
    visibility: hidden;
    background: transparent;
}

@media (max-width: 991px) {
    .burger {
        opacity: 1;
        visibility: visible;
    }
}

.burger .burger-line {
    position: absolute;
    display: block;
    left: 0;
    width: 100%;
    height: 2px;
    opacity: 1;
    border-radius: 15px;
    background: #000;
}

.burger .burger-line:nth-child(1) {
    top: 0px;
}

.burger .burger-line:nth-child(2) {
    top: 8px;
    width: 70%;
}

.burger .burger-line:nth-child(3) {
    top: 16px;
}

/* About Page Start */
.mission_and_purpose-section {
    position: relative;
    padding: var(--Commonpadding);
}

.mission_and_purpose-section::before {
    position: absolute;
    content: '';
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background: linear-gradient(270.28deg, rgba(255, 255, 255, 0) 15.14%, #000000 122.79%);
    opacity: 0.6;
    z-index: 1;
}

.mission_and_purpose-section .section-bg-image img {
    border-radius: 0;
}

.mission_and_purpose-section .container {
    position: relative;
    z-index: 2;
}

.mission_and_purpose-section h2 {
    font-family: var(--Themefont);
    font-weight: 600;
    margin-bottom: 20px;
}

.mission_and_purpose-section h6 {
    font-family: var(--Themefont);
    font-weight: 600;
}

.mission_and_purpose-section .our-mission-text-box {
    border-radius: 20px;
    background-color: #ffffffc4;
    padding: 40px 70px;
    text-align: center;
    margin-top: 30px;
}

.mission_and_purpose-section .our-mission-text-box p {
    font-family: var(--Themefont);
    font-size: var(--Font18px);
    line-height: 1.7;
}

.mission_and_purpose-section .our-mission-text-box p:nth-child(2) {
    margin-top: 25px;
}

.parllalx-section {
    background-image: url(../images/parllalx-bg.webp);
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    padding: var(--Commonpadding);
}

.parllalx-section .parllalx-inner-section .parllax-section-icons-group ul {
    display: flex;
    justify-content: space-between;
}

.parllalx-section .parllalx-inner-section .parllax-section-icons-group ul li {
    width: 24%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
}

.parllalx-section .parllalx-inner-section .parllax-section-icons-group ul li>div {
    background-color: #fff;
    border-radius: 16px;
    width: 90px;
    height: 90px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.parllalx-section .parllalx-inner-section .parllax-section-icons-group ul li>div img {
    width: 40px;
    height: 50px;
    object-fit: contain;
}

.parllalx-section .parllalx-inner-section .parllax-section-icons-group ul li h6 {
    color: #fff;
    font-family: var(--Themefont);
    font-weight: 600;
    font-size: var(--Font48px);
}

.parllalx-section .parllalx-inner-section .parllax-section-icons-group ul li p {
    color: #fff;
    font-family: var(--Themefont);
    font-size: var(--Font20px);
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
    line-height: normal;
}

.safety_heading {
    text-align: center;
    margin-bottom: 2rem;
}

.section_same_heading p {
    color: #000;
    font-weight: 400;
    text-align: center;
    font-size: var(--Font20px);
    margin-top: 16px;
    line-height: 1.5;
}

.saftey_trust_section {
    background: linear-gradient(270deg, #E5E7ED 0%, #E3E7ED 17.12%, #DAE7EB 69.73%, #59E4D5 100%);
    padding: 5rem 0px;
    height: 410px;
}

.safety_content {
    padding: 72px 0px;
    font-weight: 400;
    font-size: var(--Font18px);
    line-height: 1.5;
}

.saftey_trust_section {
    margin: 80px 0px 170px;
}

/* About Page End */

.pricing-type-cards-section {
    text-align: center;
    padding: 60px 0px 0px 0px;
}

.pricing-type-cards-section h2 {
    font-family: var(--Themefont);
    font-weight: 600;
    color: #000;
    font-size: var(--Font48px);
}

.pricing-type-cards-section h6 {
    font-family: var(--Themefont);
    color: #000;
    font-weight: 400;
    font-size: var(--Font20px);
    margin: 20px 0px;
}

.pricing-type-cards-section a {
    padding: 15px 40px;
    background-color: var(--Themepurple);
    border-radius: 1000px;
    color: #fff;
    text-decoration: none;
    border: 1px solid #4042E2;
    font-family: var(--Themefont);
    box-shadow: 0px 0px 16px 8px #45A9BD99;
    display: block;
    width: fit-content;
    margin-inline: auto;
    margin-top: 30px;
}

.pricing-type-cards-section ul {
    display: flex;
    justify-content: space-between;
    margin: 30px 0px;
}

.pricing-type-cards-section ul li {
    width: 32%;
}

.pricing-type-cards-section ul li .type-pricing-card {
    background-color: #fff;
    box-shadow: 0px 16px 16px 0px #00000029;
    border-radius: 24px;
    height: 100%;
}

.pricing-type-cards-section ul li .type-pricing-card img {
    height: 202px;
    width: 100%;
    object-fit: cover;
    border-radius: 24px 24px 0px 0px;
}

.pricing-type-cards-section ul li .type-pricing-card h5 {
    font-family: var(--Themefont);
    color: var(--Themepurple);
    font-size: var(--Font24px);
    font-weight: 500;
}

.pricing-type-cards-section ul li .type-pricing-card .textarea-type-pricing {
    padding: 15px 24px;
}

.pricing-type-cards-section ul li .type-pricing-card .textarea-type-pricing p {
    font-family: var(--Themefont);
    font-size: var(--Font18px);
    color: #000;
    margin-top: 15px;
    line-height: 1.6;
}

.pricing-type-cards-section ul li .type-pricing-card .textarea-type-pricing p strong {
    font-weight: 700;
}

.faq-inner-page .faq-inner-col {
    background: #F9F9F9;
    box-shadow: 0px 0px 20px 0px #00000040;
}

.faq-section-wrapper.faq-inner-page .accordion-item {
    background-color: transparent;
}

.faq-inner-heading-area h2 {
    font-family: var(--Themefont);
    font-size: var(--Font48px);
    font-weight: 600;
    color: #000;
    line-height: 1.5;
    margin-bottom: 20px;
}

.faq-inner-heading-area p {
    font-family: var(--Themefont);
    color: #000;
    font-size: var(--Font20px);
    line-height: 1.5;
}

.facility-banner-section {
    position: relative;
}

.facility-banner-section::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: linear-gradient(90deg, #000000 0%, rgba(0, 0, 0, 0) 100%);
    z-index: 1;
}

.facility-banner-section .container {
    position: relative;
    z-index: 1;
}

.facility-banner-section h1 {
    font-size: clamp(25px, 3.438vw, 70px);
    font-weight: 400;
}

.facility-banner-section h1 span {
    font-weight: 700;
    background-color: transparent;
    padding: 0;
}

.facility-banner-section a {
    padding: 15px 40px;
    background-color: var(--Themepurple);
    border-radius: 1000px;
    color: #fff;
    text-decoration: none;
    border: 1px solid #4042E2;
    font-family: var(--Themefont);
    box-shadow: 0px 0px 16px 8px #45A9BD99;
    display: block;
    width: fit-content;
    margin-top: 30px;
    font-size: var(--Font24px);
}

.facility-banner-section h1 {
    padding-right: 0 !important;
}

.faq-filter {
    margin-top: 20px;
}

.faq-filter ul {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.faq-filter ul li {
    width: fit-content;
}

.faq-filter ul li button {
    padding: 12px 20px;
    background-color: transparent;
    border-radius: 20px;
    border: 1px solid #402566;
    color: #676767;
    font-weight: 400;
    font-family: var(--Themefont);
    font-size: var(--Font20px);
}

.faq-filter ul li button.active-faq {
    background-color: #fff;
    box-shadow: 0px 0px 20px 0px #00000040;
    font-size: var(--Font20px);
    font-family: var(--Themefont);
    border-color: #000000;
    color: #000000;
}

.privacy-inner-page {
    padding: 35px 0px;
}

.privacy-inner-page .section-bg-image img {
    object-position: left;
}

.privacy-inner-page p {
    margin: 20px 0px;
    font-family: var(--Themefont);
    font-size: var(--Font24px);
    line-height: 1.8;
}

.privacy-inner-page p:has(br) {
    line-height: 1.8;
}

.privacy-inner-page ul {
    margin: 30px 0px;
}

.privacy-inner-page ul li {
    margin-bottom: 20px;
    font-family: var(--Themefont);
    line-height: normal;
}

.privacy-inner-page h3 {
    font-size: var(--Font28px);
    font-weight: 600;
    font-family: var(--Themefont);
}

.privacy-inner-page a {
    text-decoration: none;
    color: var(--Themepurple);
    font-weight: 600;
}

.privacy-inner-page strong {
    font-weight: 600;
}

footer p.copyright-text {
    line-height: 1.5;
}

/* Plans-Page */
.planspage-heading-row h2 {
    font-size: var(--Font48px);
    font-family: var(--Themefont);
    color: #000;
    line-height: 150%;
}

.planspage-heading-row p {
    font-family: var(--Themefont);
    color: #000;
    font-size: var(--Font20px);
    font-weight: 400;
    line-height: 1.4;
    margin-top: 10px;
}

.tabs-planspage {
    position: relative;
    margin: 30px 0px;
}

.tabs-planspage ul {
    justify-content: center;
    gap: 5%;
    border-bottom: 1px solid #CDCDCD;
    margin-top: 4%;
}

.tabs-planspage ul li .nav-link.active {
    background-color: transparent;
    color: #000;
    font-size: var(--Font18px);
    font-weight: 600;
    border-bottom: 6px solid #7E49C9;
    border-radius: 0;
}

.tabs-planspage ul li .nav-link {
    padding: 0;
    color: #000;
    font-size: var(--Font18px);
    font-family: var(--Themefont);
    padding-bottom: 15px;
    padding-inline: 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.tabs-planspage ul li .nav-link img {
    height: 40px;
    width: 40px;
    object-fit: contain;
    margin-bottom: 10px;
}

.plans-inner-page {
    position: relative;
    padding: 4% 0px 0px 0px !important;
}

.plans-inner-page::before {
    position: absolute;
    content: '';
    top: 5%;
    right: 0;
    background-color: var(--Themepurple);
    filter: blur(100px);
    height: 200px;
    width: 200px;
    z-index: 1;
    opacity: 0.6;
}

.plans-inner-page::after {
    position: absolute;
    content: '';
    top: 35%;
    left: 0;
    background: linear-gradient(180deg, #59E4D5 0%, #15868A 100%);
    filter: blur(100px);
    height: 200px;
    width: 200px;
    z-index: 1;
    opacity: 0.6;
}

.right-circle-green {
    position: absolute;
    top: 10%;
    right: -1%;
    height: 100px;
    width: 100px;
    border-radius: 50%;
    background: linear-gradient(180deg, #59E4D5 0%, #15868A 100%);
}

.left-circle-green {
    position: absolute;
    top: 50%;
    left: 1%;
    height: 80px;
    width: 80px;
    border-radius: 50%;
    background: linear-gradient(180deg, #59E4D5 0%, #15868A 100%);
}

.plan-card-single p {
    margin-top: 10px;
}

.plan-card-single {
    font-family: var(--Themefont);
}

.plan-card-single ul {
    gap: 10px;
    margin-top: 10px;
}

.join-us-section-second h2 {
    color: #fff !important;
}

.card-wrap-plans .plan-card-top-box .plan-card-top-left-col .plan-card-badge {
    font-family: var(--Themefont);
}

.plan-card-top-box {
    font-family: var(--Themefont);
}

.loginscreen-box .form-box-input {
    position: relative;
}

.loginscreen-box .error-text {
    position: relative;
    font-size: 13px;
    top: 5px;
    color: red;
    ;
}

.loginscreen-box .error-text {
    position: relative;
    font-size: 12px;
    top: -15px;
    color: red;
    left: 10px;
}

.step-next-btn .btn[disabled] {
    background: gray !important;
    border-color: gray !important;
    cursor: not-allowed !important;
    pointer-events: unset;
}

#photo.file-input {
    visibility: hidden;
}

.custom-file-label {
    border: 1px solid #E8E6EA;
    border-radius: 16px;
    padding: 1.2rem 2rem;
    box-shadow: none !important;
    outline: 0;
    font-weight: 500;
    font-size: var(--Font20px);
    line-height: 1.5;
    color: black;
    cursor: pointer;
    width: 100%;
}

.login-with-social {
    width: 65%;
    margin: 30px auto 0 auto;
}


.login-with-social h6 {
    text-align: center;
    color: #0000006B;
    margin: 20px 0px;
    font-size: var(--Font16px);
    font-family: var(--Themefont);
    font-weight: 400;
}

.login-with-social ul {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.login-with-social ul li {
    padding: 15px 10px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #E8E6EA;
    border-radius: 15px;
    cursor: pointer;
}

.login-with-social ul li img {
    width: 30px;
    height: 30px;
    margin-right: 10px;
}

.login-with-social ul li h5 {
    color: #000;
    font-size: var(--Font16px);
    font-family: var(--Themefont);
    font-weight: 600;
}

.signup-line {
    margin-top: 30px;
}

.signup-line h4 {
    text-align: center;
    font-weight: 400;
    color: #0000006B;
    font-family: var(--Themefont);
    font-size: var(--Font16px);
}

.signup-line h4 a {
    color: #4F52FF;
    font-weight: 600;
}

.loginscreen-box input.pac-target-input {
    font-family: var(--Themefont)
}

.profile-title img {
    width: 30px !important;
}

.profile-address-rating ul {
    list-style: none !important;
}

.profile-address-rating ul li img {
    width: 20px !important;
}

.profile-details-box .profile-image {
    width: 150px !important;
}

.second-header a {
    text-decoration: none !important;
    color: #000000 !important;
}

.second-header .header-cta-btn a {
    color: #fff !important;
}

.profile-container p img {
    width: 20px;
}

.profile-description ul li img {
    width: 35px;
}

.profile-details-box .profile-card-box .profile-description {
    width: 100%;
}

.add-bookmark img {
    filter: grayscale(1);
}

.add-bookmark.active img {
    filter: unset;
}

.second-header ul li.active .search-icon {
    background: linear-gradient(90deg, #422669 0%, #7E49C9 100%);
}

.second-header ul li.active .search-icon img {
    filter: brightness(0) invert(1);
}

.second-header .notification-icon i {
    color: #6f6f6f;
    font-size: 16px;
    transition: color 0.2s ease;
    line-height: 1;
}

.second-header ul li.active .notification-icon i {
    color: #ffffff;
}

.review-content {
    width: 100%;
}

.review-card img {
    object-fit: cover;
}

.common-article {
    font-family: var(--Themefont);
}

.rating strong {
    font-size: var(--Font70px);
}

.subtitle {
    text-transform: capitalize;
}

.review-footer {
    text-transform: capitalize;
}

.caregiver-inner-bookmark-img {
    position: absolute;
    right: -80%;
    top: -20px;
    width: 30px;
    filter: grayscale(1);
}

.caregiver-inner-bookmark-img.add-bookmark {
    filter: unset;
}

.rating-info {
    line-height: 2.5 !important;
}

.rating span {
    font-size: 2rem !important;
    letter-spacing: 5px;
}

.profile-details-box .profile-details-card:last-child {
    margin-top: -390px !important;
}

.login-cargiver-job-listing .job-card h3 {
    font-weight: 600;
    margin-bottom: 15px;
    margin-top: 0;
}

.job-card ul li {
    display: flex;
    align-items: center;
    margin-bottom: 5px;
}

.job-card ul li img {
    width: 20px;
    margin-right: 6px;
}

.job-card ul li p {
    margin-bottom: 0;
}

.available-jobs-header h2 {
    font-family: var(--Themefont);
    font-size: var(--Font40px);
    margin-bottom: 10px;
}

.available-jobs-header p {
    font-size: var(--Font20px);
}

.available-jobs-container .pagination-container {
    width: 100%;
    font-size: var(--Font14px);
}

.available-jobs-container .pagination-container .text-center {
    font-size: var(--Font14px);
}

.available-jobs-container .pagination-container .page-item.active .page-link {
    background: linear-gradient(90deg, #422669 0%, #7E49C9 100%);
    color: #fff;
}

.available-jobs-container .pagination-container .page-item .page-link {
    color: #422669;
}

/* Notifications.css */
.notification-inner-page {
    max-width: 90%;
    margin: 30px auto;
    padding: 20px;
    background-color: #f8f9fa;
    min-height: 100vh;
    font-family: var(--Themefont);
}

.notification-inner-page__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding-bottom: 15px;
    border-bottom: 2px solid #e9ecef;
}

.notification-inner-page__header h1 {
    color: #2c3e50;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 28px;
}

.notification-inner-page__header h1 i {
    color: #6c757d;
}

.notification-inner-page__header-actions {
    display: flex;
    gap: 10px;
    align-items: center;
}

.notification-inner-page__btn-mark-all,
.notification-inner-page__btn-settings,
.notification-inner-page__btn-load-more {
    background: #007bff;
    color: white;
    border: none;
    padding: 8px 15px;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 14px;
    transition: background-color 0.2s;
}

.notification-inner-page__btn-settings {
    padding: 8px 12px;
}

.notification-inner-page__btn-mark-all:hover,
.notification-inner-page__btn-settings:hover,
.notification-inner-page__btn-load-more:hover {
    background: #0056b3;
}

.notification-inner-page__filter {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    flex-wrap: wrap;
    gap: 15px;
}

.notification-inner-page__filter-tabs {
    display: flex;
    background: white;
    border-radius: 8px;
    padding: 4px;
    border: 1px solid #dee2e6;
}

.notification-inner-page__filter-tab {
    padding: 8px 16px;
    border: none;
    background: transparent;
    cursor: pointer;
    border-radius: 6px;
    font-size: 14px;
    transition: all 0.2s;
}

.notification-inner-page__filter-tab--active {
    background: #007bff;
    color: white;
}

.notification-inner-page__filter-tab:hover:not(.notification-inner-page__filter-tab--active) {
    background: #e9ecef;
}

.notification-inner-page__search-box {
    position: relative;
    min-width: 250px;
}

.notification-inner-page__search-box i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
}

.notification-inner-page__search-box input {
    width: 100%;
    padding: 10px 10px 10px 35px;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 14px;
}

.notification-inner-page__search-box input:focus {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

.notification-inner-page__list {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
}

.notification-inner-page__item {
    display: flex;
    align-items: flex-start;
    padding: 20px;
    border-bottom: 1px solid #e9ecef;
    transition: background-color 0.2s;
    position: relative;
}

.notification-inner-page__item:last-child {
    border-bottom: none;
}

.notification-inner-page__item:hover {
    background-color: #f8f9fa;
}

.notification-inner-page__item--unread {
    background-color: #f0f7ff;
    border-left: 4px solid #007bff;
}

.notification-inner-page__item-icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
    flex-shrink: 0;
}

.notification-inner-page__item--success .notification-inner-page__item-icon {
    background: #d4edda;
    color: #155724;
}

.notification-inner-page__item--info .notification-inner-page__item-icon {
    background: #cce7ff;
    color: #004085;
}

.notification-inner-page__item--warning .notification-inner-page__item-icon {
    background: #fff3cd;
    color: #856404;
}

.notification-inner-page__item--error .notification-inner-page__item-icon {
    background: #f8d7da;
    color: #721c24;
}

.notification-inner-page__item-icon i {
    font-size: 20px;
}

.notification-inner-page__item-content {
    flex: 1;
    min-width: 0;
}

.notification-inner-page__item-title {
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 5px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
}

.notification-inner-page__unread-badge {
    width: 8px;
    height: 8px;
    background: #007bff;
    border-radius: 50%;
    display: inline-block;
}

.notification-inner-page__item-message {
    color: #6c757d;
    margin-bottom: 8px;
    line-height: 1.4;
    font-size: 14px;
}

.notification-inner-page__item-time {
    color: #adb5bd;
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 5px;
}

.notification-inner-page__item-actions {
    display: flex;
    gap: 8px;
    margin-left: 15px;
}

.notification-inner-page__btn-mark-read,
.notification-inner-page__btn-delete {
    background: none;
    border: none;
    cursor: pointer;
    padding: 5px;
    border-radius: 4px;
    color: #6c757d;
    transition: all 0.2s;
}

.notification-inner-page__btn-mark-read:hover {
    color: #28a745;
    background: #f8f9fa;
}

.notification-inner-page__btn-delete:hover {
    color: #dc3545;
    background: #f8f9fa;
}

.notification-inner-page__footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 0;
    color: #6c757d;
    font-size: 14px;
}

.notification-inner-page__stats {
    display: flex;
    align-items: center;
    gap: 8px;
}

.notification-inner-page__btn-load-more {
    background: #6c757d;
}

.notification-inner-page__btn-load-more:hover {
    background: #545b62;
}

.selected-option-info .text-success {
    font-size: var(--Font14px);
}

.background-check-options {
    font-size: var(--Font14px);
}

.background-popup-heading {
    font-size: var(--Font18px);
    font-weight: 600;
}

.note {
    font-size: var(--Font18px);
    font-weight: 600;
}

.option-item {
    transition: none !important;
}

.option-item input {
    appearance: none;
}

.card-wrap-plans.selected {
    background-color: unset;
}

.payment-popup h3 {
    font-family: var(--Themefont);
    font-size: var(--Font22px);
    font-weight: 700;
    color: #3A1363;
}

.selected-plan-details h4 {
    font-family: var(--Themefont);
    color: #000;
    margin-bottom: 0px;
    font-weight: 600;
    font-size: var(--Font24px);
}

.selected-plan-details p {
    margin-top: 20px;
    font-family: var(--Themefont);
    font-size: var(--Font16px);
    line-height: 1.4;
}

.selected-plan-details h6 {
    font-weight: 700;
    font-family: var(--Themefont);
    color: var(--Themepurple);
    margin-top: 20px;
    font-size: var(--Font28px);
}

.selected-plan-details>div {
    font-size: var(--Font20px);
}

.activate-paln-line {
    font-size: var(--Font18px);
    margin-bottom: 20px;
}

.activate-paln-line strong {
    font-weight: 600;
}

.expire-paln-line {
    font-size: var(--Font18px);
}

.expire-paln-line strong {
    font-weight: 600;
}

.plan-status {
    font-size: var(--Font18px);
    margin-bottom: 20px;
}

.plan-status strong {
    font-weight: 600;
}

.existing-plan-details h4 {
    font-size: var(--Font28px);
}

#no-jobs {
    display: none;
}

/* Payment History */

.payment-history-wrap {
    padding: 20px;
    font-family: Arial, sans-serif;
}

.payment-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

.payment-header h2 {
    color: #333;
    margin: 0;
}

.payment-actions {
    display: flex;
    gap: 10px;
}

.btn-primary {
    background-color: #007bff;
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 5px;
    cursor: pointer;
}

.btn-secondary {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 5px;
    cursor: pointer;
}

.payment-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

.transactions-table {
    overflow: hidden;
}

.transactions-table table {
    width: 100%;
    border-collapse: collapse;
}

.transactions-table th,
.transactions-table td {
    padding: 15px;
    text-align: left;
}

.transactions-table th {
    color: #495057;
}

.transactions-table tbody tr:hover {
    background-color: #f8f9fa;
}

.loading,
.error-message {
    text-align: center;
    padding: 40px;
    font-size: 16px;
}

.error-message {
    color: #dc3545;
}

.payment-history-wrap {
    padding: 30px;
    box-shadow: 0px 4px 20px 5px #0000001A;
    border-radius: 30px;
}

.payment-history-wrap h2 {
    font-weight: 500;
    font-family: var(--Themefont);
    font-size: clamp(18px, 1.25vw, 28px);
    color: #000;
}

.payment-history-wrap .payment-summary .summary-card {
    background: linear-gradient(90deg, #422669 0%, #7E49C9 100%);
    color: #fff;
    padding: 20px;
    border-radius: 8px;
    text-align: center;
}

.summary-card h3 {
    margin: 0 0 10px 0;
    color: #fff;
    font-size: clamp(18px, 1.25vw, 28px);
    font-family: var(--Themefont);
}

.summary-card p {
    margin: 0;
    font-size: clamp(18px, 1.25vw, 28px);
    font-family: var(--Themefont);
    font-weight: bold;
    color: #fff;
}

.payment-history-wrap thead {
    border-radius: 10px;
    background-color: #F0F4F7;
}

.payment-history-wrap thead tr th:nth-child(1) {
    border-radius: 10px 0px 0px 10px;
}

.payment-history-wrap thead tr th:last-child {
    border-radius: 0px 10px 10px 0px;
}

.payment-history-wrap thead tr th {
    font-family: var(--Themefont);
    font-size: clamp(10px, 0.938vw, 20px);
    color: #000;
    font-weight: 500;
}

.payment-history-wrap table tbody {
    font-weight: 400;
    font-family: var(--Themefont);
    font-size: clamp(10px, 0.938vw, 20px);
    color: #000000B2;
}

.payment-history-wrap table tbody tr td:nth-child(2) {
    color: var(--Themepurple);
    font-weight: 700;
}

.payment-history-wrap .status {
    padding: 5px 25px;
    border-radius: 15px;
    font-size: 12px;
    font-weight: 600;
}

.payment-history-wrap .status-paid {
    background-color: #DFEFE2;
    color: #32B004;
    border: 1px solid #32B004;

}

.payment-history-wrap .status-pending {
    background-color: #fff3cd;
    color: #856404;
}

.payment-history-wrap .status-failed {
    background-color: #f8d7da;
    color: #721c24;
}

.payment-history-wrap .pagination {
    display: flex;
    justify-content: center;
    padding: 20px;
    gap: 5px;
}

.payment-history-wrap .pagination button {
    padding: 8px 12px;
    border: 1px solid #dee2e6;
    background: white;
    cursor: pointer;
    border-radius: 4px;
}

.payment-history-wrap .pagination button.active {
    background-color: #007bff;
    color: white;
    border-color: #007bff;
}

.transaction-id {
    font-family: monospace;
    font-size: 0.9em;
    cursor: help;
}

/* Ensure table columns have proper spacing */
.transactions-table table {
    table-layout: fixed;
    width: 100%;
}

.transactions-table th:nth-child(1) {
    width: 5%;
}

/* # */
.transactions-table th:nth-child(2) {
    width: 10%;
}

/* Amount */
.transactions-table th:nth-child(3) {
    width: 15%;
}

/* Payment mode */
.transactions-table th:nth-child(4) {
    width: 15%;
}

/* Transaction ID */
.transactions-table th:nth-child(5) {
    width: 20%;
}

/* Plan Type */
.transactions-table th:nth-child(6) {
    width: 20%;
}

/* Date */
.transactions-table th:nth-child(7) {
    width: 15%;
}

/* Status */

.chat-wrapper {
    display: flex;
    /* height: 100vh; */
    background-color: #ffffff;
    font-family: var(--Themefont);
}

.chat-wrapper .messages-sidebar {
    width: 350px;
    border-right: 1px solid #e0e0e0;
    display: flex;
    flex-direction: column;
}

.chat-wrapper .messages-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    border-bottom: 1px solid #e0e0e0;
}

.chat-wrapper .messages-header h2 {
    margin: 0;
    font-size: 24px;
    font-weight: 600;
    color: #000000;
}

.chat-wrapper .search-container {
    padding: 8px;
    display: none;
}

.chat-wrapper .search-icon {
    font-size: 18px;
    color: #666;
}

.chat-wrapper .conversations-list {
    flex: 1;
    overflow-y: auto;
}

.chat-wrapper .conversation-item {
    display: flex;
    align-items: center;
    padding: 15px 20px;
    border-bottom: 1px solid #f0f0f0;
    cursor: pointer;
    transition: background-color 0.2s;
}

.chat-wrapper .conversation-item:hover {
    background-color: #f8f9fa;
}

.chat-wrapper .conversation-item.active {
    background-color: #e3f2fd;
}

.chat-wrapper .avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #ddd;
    margin-right: 15px;
}

.chat-wrapper .conversation-details {
    flex: 1;
}

.chat-wrapper .conversation-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 5px;
}

.chat-wrapper .name {
    font-weight: 600;
    color: #000000;
    font-size: 16px;
}

.chat-wrapper .time {
    font-size: 12px;
    color: #666;
}

.chat-wrapper .last-message {
    font-size: 14px;
    color: #666;
    line-height: 1.4;
}

.chat-wrapper .typing-indicator {
    color: #007bff;
    font-style: italic;
}

.chat-wrapper .main-chat {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.chat-wrapper .chat-header {
    padding: 20px;
    border-bottom: 1px solid #e0e0e0;
    background-color: #ffffff;
}

.chat-wrapper .chat-contact {
    display: flex;
    align-items: center;
}

.chat-wrapper .contact-avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #ddd;
    margin-right: 15px;
}

.chat-wrapper .contact-avatar img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.chat-wrapper .avatar img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.chat-wrapper .contact-name {
    font-weight: 600;
    font-size: 18px;
    color: #000000;
}

.chat-wrapper .chat-messages {
    flex: 1;
    padding: 20px;
    overflow-y: auto;
    background-color: #fff;
}

.chat-wrapper .conversation-item {
    position: relative;
}

.chat-wrapper .conversation-item .unread-badge {
    position: absolute;
    right: 40px;
    top: 46px;
    height: 25px;
    width: 25px;
    border-radius: 50%;
    background: var(--Themepurple);
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    display: none;
}

.chat-wrapper .message {
    margin-bottom: 20px;
    display: flex;
}

.chat-wrapper .message.received {
    justify-content: flex-start;
}

.chat-wrapper .message.sent {
    justify-content: flex-end;
}

.chat-wrapper .message-content {
    max-width: 70%;
    min-width: 150px;
    background-color: #ffffff;
    border-radius: 15px;
    padding: 12px 16px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.chat-wrapper .message-content .message-time {
    font-size: var(--Font14px);
}

.contact-status {
    margin-top: 5px;
    font-size: var(--Font14px);
}

.chat-wrapper .message.sent .message-content {
    background-color: #007bff;
    color: #ffffff;
}

.chat-wrapper .message-text {
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 5px;
}

.chat-wrapper .message-time {
    font-size: 11px;
    color: #666;
    text-align: right;
}

.chat-wrapper .message.sent .message-time {
    color: rgba(255, 255, 255, 0.8);
}

.chat-wrapper .chat-input-container {
    padding: 0px;
    border-top: 1px solid #e0e0e0;
    background-color: #ffffff;
}

.chat-wrapper .input-wrapper {
    margin-bottom: 15px;
    position: relative;
    padding: 20px 20px 0px 20px;
}

.chat-wrapper .input-wrapper .send-btn {
    position: absolute;
    right: 43px;
    top: 19px;
    border: none;
    background: none;
}

.chat-wrapper .input-wrapper .send-btn i {
    color: #007bff;
}

.chat-wrapper .message-input {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid #e0e0e0;
    border-radius: 24px;
    font-size: 14px;
    outline: none;
}

.chat-wrapper .message-input:focus {
    border-color: #007bff;
}

.chat-wrapper .schedule-btn {
    width: 100%;
    padding: 12px;
    background: linear-gradient(90deg, #6D17DE 0%, #6E0A7C 100%);
    box-shadow: 0px 4px 4px 0px #0000001A inset;
    color: #ffffff;
    border: none;
    border-radius: 0px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.2s;
}

.chat-container {
    max-width: 95% !important;
    margin-left: auto !important;
    margin-right: 0;
    padding-right: 0;
    padding-left: 0;
}

.chat-wrapper .interview-btn:hover {
    background-color: #0056b3;
}

.chat-wrapper .message-wrapper.sent-message {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
}

.chat-wrapper .message-wrapper.received-message {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 10px;

}

.chat-wrapper .message-wrapper.received-message .message-content {
    background: #FDF1F3;
}

.chat-wrapper .message-wrapper.sent-message .message-content {
    background: #F3F3F3;
}

/* Scrollbar Styling */
.chat-wrapper .conversations-list::-webkit-scrollbar,
.chat-wrapper .chat-messages::-webkit-scrollbar {
    width: 6px;
}

.chat-wrapper .conversations-list::-webkit-scrollbar-track,
.chat-wrapper .chat-messages::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.chat-wrapper .conversations-list::-webkit-scrollbar-thumb,
.chat-wrapper .chat-messages::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 3px;
}

.chat-wrapper .conversations-list::-webkit-scrollbar-thumb:hover,
.chat-wrapper .chat-messages::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* Responsive design */

.signup2-parent .error-text {
    top: 5px;
}

.signup2-parent .custom-file-upload {
    flex-direction: unset;
}

.card-wrap-plans .plan-card-top-box .plan-card-top-left-col .plan-card-badge {
    font-family: var(--Themefont);
    width: fit-content;
    padding-right: 14px;
}

.loginscreen-box .form-box-input {
    z-index: 9;
}

.api-error-message {
    height: max-content !important;
    right: 0px !important;
}

/* Schedule Meeting Button */
.schedule-meeting-btn {
    padding: 12px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    transition: all 0.3s ease;
    background-color: #007bff;
    color: white;
    width: 100%;
}

.schedule-meeting-btn:hover {
    background-color: #0056b3;
}

/* Meeting Type Selection */
.meeting-type-section {
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid #eee;
}

.meeting-type-section h4 {
    margin-bottom: 15px;
    color: #333;
    font-size: 16px;
    font-weight: 600;
}

.meeting-type-options {
    display: flex;
    gap: 20px;
}

.meeting-type-option {
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 10px 15px;
    border: 2px solid #e9ecef;
    border-radius: 5px;
    transition: all 0.3s ease;
}

.meeting-type-option:hover {
    border-color: #007bff;
    background-color: #f8f9fa;
}

.meeting-type-option input[type="radio"] {
    margin-right: 8px;
}

.meeting-type-label {
    font-weight: 500;
    color: #333;
}

.meeting-type-option input[type="radio"]:checked+.meeting-type-label {
    color: #007bff;
}

/* Rest of the existing CSS remains the same */
.action-buttons {
    display: flex;
    gap: 10px;
    margin-top: 10px;
}

/* Request Popup Styles (existing) */
.request-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    display: flex;
    justify-content: center;
    align-items: center;
}

.request-popup-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

.request-popup-content {
    position: relative;
    background: white;
    border-radius: 10px;
    width: 90%;
    max-width: 600px;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.request-popup-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    border-bottom: 1px solid #eee;
    background-color: #f8f9fa;
    border-radius: 10px 10px 0 0;
}

.request-popup-header h3 {
    margin: 0;
    color: #333;
    font-size: 18px;
}

.request-popup-close {
    background: none;
    border: none;
    font-size: 18px;
    cursor: pointer;
    color: #666;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.request-popup-close:hover {
    background-color: #e9ecef;
    color: #333;
}

.request-popup-body {
    padding: 20px;
}

.request-calendar-section,
.request-time-section {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
}

.request-calendar-section h4,
.request-time-section h4 {
    margin-bottom: 15px;
    color: #333;
    font-size: 16px;
    font-weight: 600;
}

.request-current-month {
    font-weight: bold;
    margin-bottom: 15px;
    text-align: center;
    color: #555;
    font-size: 14px;
    padding: 8px;
    background-color: #f8f9fa;
    border-radius: 5px;
}

.request-calendar-dates {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 5px;
}

.request-date-cell {
    padding: 10px 5px;
    text-align: center;
    border: 1px solid #e9ecef;
    border-radius: 5px;
    cursor: pointer;
    transition: all 0.3s ease;
    background-color: #fff;
}

.request-date-cell:hover {
    background-color: #e7f3ff;
    border-color: #007bff;
}

.request-date-selected {
    background-color: #007bff;
    color: white;
    border-color: #007bff;
}

.request-day-name {
    font-size: 10px;
    color: #666;
    margin-bottom: 2px;
    text-transform: uppercase;
}

.request-date-selected .request-day-name {
    color: white;
}

.request-date-number {
    font-weight: bold;
    font-size: 14px;
}

.request-time-slots {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    max-height: 200px;
    overflow-y: auto;
    padding: 5px;
}

.request-time-slot {
    padding: 8px 5px;
    border: 1px solid #ddd;
    background: white;
    border-radius: 5px;
    cursor: pointer;
    font-size: 12px;
    transition: all 0.3s ease;
}

.request-time-slot:hover {
    background-color: #e7f3ff;
    border-color: #007bff;
}

.request-time-selected {
    background-color: #007bff;
    color: white;
    border-color: #007bff;
}

.request-popup-footer {
    padding: 20px;
    border-top: 1px solid #eee;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    background-color: #f8f9fa;
    border-radius: 0 0 10px 10px;
}

.request-cancel-btn,
.request-confirm-btn {
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-weight: bold;
    transition: all 0.3s ease;
    min-width: 100px;
}

.request-cancel-btn {
    background-color: #6c757d;
    color: white;
}

.request-confirm-btn {
    background-color: #28a745;
    color: white;
}

.request-confirm-btn:disabled {
    background-color: #6c757d;
    cursor: not-allowed;
    opacity: 0.6;
}

.request-cancel-btn:hover {
    background-color: #545b62;
}

.request-confirm-btn:hover:not(:disabled) {
    background-color: #218838;
}

.time-dropdowns {
    display: flex;
    gap: 15px;
    align-items: flex-end;
}

.time-dropdown-group {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.time-dropdown-group label {
    font-size: 12px;
    font-weight: 600;
    color: #333;
    margin-bottom: 5px;
}

.time-dropdown {
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 14px;
    background-color: white;
    cursor: pointer;
    transition: border-color 0.3s ease;
}

.time-dropdown:focus {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

.time-dropdown:hover {
    border-color: #007bff;
}

/* Interview Call Component Styles */
.interview-call-wrapper {
    min-height: 100vh;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--Themefont);
}

.interview-call-wrapper .container {
    max-width: 800px;
    width: 100%;
    margin: 0 auto;
    padding: 20px;
}

.interview-call-wrapper .approval-screen,
.interview-call-wrapper .video-screen,
.interview-call-wrapper .rejected-screen {
    background: white;
    border-radius: 15px;
    padding: 40px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
    text-align: center;
}

.interview-call-wrapper .approval-content h2,
.interview-call-wrapper .video-content h2,
.interview-call-wrapper .rejected-content h2 {
    color: #333;
    margin-bottom: 20px;
    font-size: 28px;
}

.interview-call-wrapper .call-info {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 10px;
    margin: 20px 0;
    text-align: left;
}

.interview-call-wrapper .call-info p {
    margin: 20px 0;
    color: #555;
}

.interview-call-wrapper .approval-buttons {
    display: flex;
    gap: 20px;
    justify-content: center;
    margin-top: 30px;
    margin-bottom: 30px;
}

.interview-call-wrapper .video-controls {
    display: flex;
    gap: 20px;
    justify-content: center;
    margin-top: 20px;
}

.interview-call-wrapper .btn {
    padding: 12px 30px;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    min-width: 150px;
}

.interview-call-wrapper .btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.interview-call-wrapper .btn-approve {
    background: #28a745;
    color: white;
}

.interview-call-wrapper .btn-approve:hover:not(:disabled) {
    background: #218838;
    transform: translateY(-2px);
}

.interview-call-wrapper .btn-disapprove {
    background: #dc3545;
    color: white;
}

.interview-call-wrapper .btn-disapprove:hover:not(:disabled) {
    background: #c82333;
    transform: translateY(-2px);
}

.interview-call-wrapper .btn-join {
    background: #007bff;
    color: white;
}

.interview-call-wrapper .btn-join:hover {
    background: #0056b3;
    transform: translateY(-2px);
}

.interview-call-wrapper .btn-end-call {
    background: #6c757d;
    color: white;
}

.interview-call-wrapper .btn-end-call:hover {
    background: #545b62;
    transform: translateY(-2px);
}

.interview-call-wrapper .btn-back {
    background: #17a2b8;
    color: white;
}

.interview-call-wrapper .btn-back:hover {
    background: #138496;
    transform: translateY(-2px);
}

.interview-call-wrapper .video-placeholder {
    background: #e9ecef;
    border: 2px dashed #adb5bd;
    border-radius: 10px;
    padding: 60px 20px;
    margin: 20px 0;
}

.interview-call-wrapper .video-placeholder p {
    margin: 10px 0;
    color: #6c757d;
}

.interview-call-wrapper .rejected-content p {
    font-size: 18px;
    color: #6c757d;
    margin-bottom: 30px;
}

/* Loading States */
.interview-call-wrapper .loading {
    opacity: 0.7;
    pointer-events: none;
}

.interview-call-wrapper .loading-text {
    color: #6c757d;
    font-style: italic;
}

.video-popup-header {
    display: none !important;
}

.call-info-popup {
    display: none !important;
}

.local-video p,
.remote-video p {
    display: none;
}

/* Add this to your CSS file */
.cookies-popup {
    animation: slideUp 0.3s ease-out;
}

@keyframes slideUp {
    from {
        transform: translateY(100%);
        opacity: 0;
    }

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

.cookies-accept-btn:hover {
    background-color: #0056b3 !important;
}

.cookies-reject-btn:hover {
    background-color: #545b62 !important;
}

.cookies-content {
    font-family: var(--Themefont);
}

.compliance-content {
    font-family: var(--Themefont);
}

.compliance-content p {
    line-height: 1.7 !important;
}

.footer-link-button {
    color: #fff !important;
    opacity: 0.7;
}

/* Responsive design */
@media (max-width: 768px) {


    .cookies-content {
        text-align: center;
    }

    .footer-link-button {
        font-size: 11px !important;
        font-family: var(--Themefont) !important;
        display: block;
    }

    .cookies-popup {
        left: 10px;
        right: 10px;
        bottom: 10px;
        max-width: none;
    }

    .cookies-buttons {
        flex-direction: column;
    }
}

/* Responsive Design */
@media (max-width: 768px) {

    .pip-video {
        padding: 5px 0px 0px 0px !important;
    }

    .pip-video p {
        font-size: 10px;
        padding: 5px !important;
        display: none !important;
    }

    .waiting-message {
        font-size: 10px !important;
        line-height: normal !important;
    }

    .interview-call-wrapper .container {
        padding: 15px;
    }

    .interview-call-wrapper .approval-screen,
    .interview-call-wrapper .video-screen,
    .interview-call-wrapper .rejected-screen {
        padding: 20px;
    }

    .interview-call-wrapper .approval-buttons,
    .interview-call-wrapper .video-controls {
        flex-direction: column;
        gap: 10px;
    }

    .interview-call-wrapper .btn {
        width: 100%;
    }

    .interview-call-wrapper .call-info {
        padding: 15px;
    }

    .interview-call-wrapper .approval-content h2,
    .interview-call-wrapper .video-content h2,
    .interview-call-wrapper .rejected-content h2 {
        font-size: 24px;
    }
}

/* Animation for smooth transitions */
.interview-call-wrapper .approval-screen,
.interview-call-wrapper .video-screen,
.interview-call-wrapper .rejected-screen {
    animation: fadeIn 0.5s ease-in-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

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

/* Success and Error States */
.interview-call-wrapper .status-success {
    color: #28a745;
    font-weight: 600;
}

.interview-call-wrapper .status-error {
    color: #dc3545;
    font-weight: 600;
}

.interview-call-wrapper .status-pending {
    color: #ffc107;
    font-weight: 600;
}

/* Avatar Styles */
.notification-inner-page__item-avatar {
    position: relative;
    width: 50px;
    height: 50px;
    flex-shrink: 0;
    margin-right: 15px;
}

.notification-inner-page__avatar-img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #e9ecef;
}

.notification-inner-page__avatar-fallback {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 18px;
    border: 2px solid #e9ecef;
}

/* Header with time */
.notification-inner-page__item-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}

.notification-inner-page__item-title {
    font-weight: 600;
    font-size: 14px;
    color: #2d3748;
    display: flex;
    align-items: center;
    gap: 8px;
}

.notification-inner-page__item-time-group {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    text-align: right;
}

.notification-inner-page__item-time-ago {
    font-size: 12px;
    color: #718096;
    font-weight: 500;
}

.notification-inner-page__item-exact-time {
    font-size: 11px;
    color: #a0aec0;
    background: #f7fafc;
    padding: 2px 6px;
    border-radius: 10px;
}

/* Message */
.notification-inner-page__item-message {
    color: #4a5568;
    font-size: 13px;
    line-height: 1.4;
    margin-bottom: 10px;
}

/* Footer with sender info and action */
.notification-inner-page__item-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 8px;
}

.notification-inner-page__sender-info {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #718096;
}

.notification-inner-page__sender-info i {
    font-size: 10px;
}

.notification-inner-page__sender-name {
    font-weight: 500;
}

.notification-inner-page__item-action {
    margin-left: auto;
}

.notification-inner-page__action-btn {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border: none;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 5px;
    transition: all 0.2s ease;
}

.notification-inner-page__action-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(102, 126, 234, 0.3);
}

/* Unread badge */
.notification-inner-page__unread-badge {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ff4757;
    display: inline-block;
}

/* Unread count in header */
.notification-inner-page__unread-count {
    background: #ff4757;
    color: white;
    border-radius: 50%;
    padding: 2px 6px;
    font-size: 12px;
    margin-left: 8px;
}

/* Item layout adjustments */
.notification-inner-page__item {
    display: flex;
    align-items: flex-start;
    padding: 15px;
    border-bottom: 1px solid #e9ecef;
    transition: background-color 0.2s ease;
}

.notification-inner-page__item:hover {
    background-color: #f8f9fa;
}

.notification-inner-page__item--unread {
    background-color: #f0f8ff;
    border-left: 3px solid #007bff;
}

.notification-inner-page__item-content {
    flex: 1;
    min-width: 0;
}

.notification-inner-page__item-actions {
    display: flex;
    gap: 5px;
    margin-left: 10px;
}

.gender-card-box ul li img {
    object-fit: contain;
}

.password-guidelines {
    margin-top: 8px;
    margin-bottom: 8px;
    padding: 12px;
    background-color: #f8f9fa;
    border-radius: 4px;
    border-left: 4px solid var(--Themepurple);
}

.guideline-title {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 8px;
    color: #333;
}

.guideline-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.guideline-list li {
    font-size: 12px;
    margin-bottom: 4px;
    padding-left: 0;
}

.requirement-met {
    color: #28a745;
    font-weight: 500;
}

.requirement-not-met {
    color: #6c757d;
}

.error-text {
    color: #dc3545;
    font-size: 12px;
    margin-top: 4px;
}

.password-hide-show {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    color: #6c757d;
}

.password-hide-show:hover {
    color: #333;
}

.popup-review h3 {
    font-size: var(--Font38px);
    font-weight: 600;
    margin-bottom: 10px;
    font-family: var(--Themefont);
}

.popup-review p {
    font-family: var(--Themefont);
    font-size: var(--Font18px);
}

.popup-review {
    font-family: var(--Themefont);
}

.popup-review button {
    font-size: var(--Font18px);
    font-weight: 500;
    border-radius: 50px;
}

.all_reviews_parent .review-card {
    font-family: var(--Themefont);
    font-size: 1.5rem;
}

.all_reviews_parent .review-card h6 {
    text-transform: capitalize;
    font-weight: 600;
    font-size: var(--Font26px);
    margin-bottom: 10px;
}

.all_reviews_parent .review-card img {
    display: none;
}

.all_reviews_parent .rating-badge {
    color: rgb(255, 215, 0);
}

.all_reviews_parent .review-footer {
    margin-top: 20px;
}

.all_reviews_parent .review-content p {
    margin-top: 10px;
}

.chat-wrapper .message-text {
    color: #000;
}

.next-btn .btn {
    flex-direction: row-reverse;
}

.next-btn img {
    transform: rotate(-180deg);
}

.step-indicator {
    display: flex;
    gap: 30px;
}

.step-indicator .step {
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px;
}

.step-indicator .step.active {
    background: linear-gradient(90deg, #422669 0%, #7E49C9 100%);
    color: white;
    font-weight: 500;
    font-size: var(--Font26px);
}

.home-edit-one .hiring-list {
    width: 100%;
}

.home-edit-one .hiring-list.first-row-edit {
    width: 40%;
}

.home-edit-one .gender-card-box {
    width: 100%;
}

.home-edit-one .language-card-box {
    margin-bottom: 30px;
}

.home-edit-one .step-next-btn {
    margin-top: 30px;
}

.home-edit-one .pay-range {
    font-weight: 600;
    display: flex;
    gap: 10px;
    font-size: var(--Font38px);
}

.home-edit-one .confirmation-step {
    text-align: center;
}

.home-edit-one .confirmation-step h4 {
    margin-top: 30px;
}

.desktop-menu.second-header .current-plan {
    font-size: var(--Font16px);
    font-family: var(--Themefont);
}

.desktop-menu.second-header .expired-plan {
    font-size: var(--Font14px);
    font-family: var(--Themefont);
    padding: 8px 5px !important;
}

.header-search input {
    padding: 10px 13px !important;
}

.daytime.which-day li button {
    width: 100%;
    border: 1px solid #E8E6EA !important;
    padding-block: 15px !important;
    border-radius: 15px !important;
    color: #000;
}

.which-day-box .daysname.which-day:nth-child(1) li button {
    width: 100%;
    border: 1px solid #E8E6EA !important;
    padding-block: 15px !important;
    border-radius: 15px !important;
    color: #000;
}

.which-day-box .daysname.which-day:nth-child(1) li button:hover {
    background-color: #efefef !important;
}

.which-day-box li button:hover {
    background-color: #efefef !important;
}

.btn-primary {
    background-color: #3A1363 !important;
    color: #fff !important;
}

/* Responsive design */
@media (max-width: 768px) {


    .current-plan {
        position: relative;
        left: 5px;
        font-size: 10px;
    }

    .notification-inner-page__item-avatar {
        width: 40px;
        height: 40px;
        margin-right: 12px;
    }

    .notification-inner-page__avatar-fallback {
        font-size: 16px;
    }

    .notification-inner-page__item-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }

    .notification-inner-page__item-time-group {
        align-items: flex-start;
        text-align: left;
    }

    .notification-inner-page__item-footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .notification-inner-page__item-action {
        margin-left: 0;
        align-self: flex-end;
    }
}

/* Responsive Design */
@media (max-width: 768px) {

    .login-cargiver-job-listing .view-details-btn {
        width: unset;
        height: unset;
    }

    .request-popup-body {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .meeting-type-options {
        flex-direction: column;
        gap: 10px;
    }

    .request-calendar-dates {
        grid-template-columns: repeat(7, 1fr);
    }

    .request-time-slots {
        grid-template-columns: repeat(2, 1fr);
    }

    .request-popup-footer {
        flex-direction: column;
    }

    .request-cancel-btn,
    .request-confirm-btn {
        width: 100%;
    }
}


@media (max-width: 768px) {

    .login-box {
        width: 100% !important;
    }

    .login-box .loginform {
        width: 100% !important;
    }

    .login-box .login-form {
        width: 90% !important;
        margin: 30px auto 0 auto;
    }

    .login-with-social {
        width: 90% !important;
        margin: 30px auto 0 auto;
    }

    .login-form-heading-wrapper p {
        line-height: 1.6;
        font-size: 12px;
    }

    .transactions-table {
        overflow-x: scroll;
    }

    .transactions-table table {
        width: 610px;
    }

    .payment-history-wrap thead {
        border-radius: 0px;
    }

    .transactions-table td {
        padding: 10px 4px;
        text-align: left;
    }

    .payment-history-wrap .status {
        padding: 5px 9px;
        border-radius: 15px;
        font-size: 8px;
        font-weight: 600;
    }

    .payment-history-wrap {
        padding: 20px 10px;
    }

    .transactions-table th {
        padding: 6px;
    }

    .profile-details-box .profile-details-card:nth-child(odd) {
        flex: 100% !important;
    }

    .profile-details-box .profile-details-card:nth-child(even) {
        flex: 100% !important;
    }

    .profile-details-box .profile-details-card:last-child {
        margin-top: 0 !important;
    }

    .common-card {
        padding: 28px 17px !important;
    }

    .profile-details-box {
        margin: 25px 0px !important;
    }

    .profile-btn .view-details-btn {
        font-size: 14px !important;
    }

    .review-card {
        flex-direction: column;
    }

    .caregiver-inner-bookmark-img {
        right: -40%;
    }

    .profile-experience-rate {
        padding: 10px 0px !important;
    }

    .profile-other-details {
        margin-bottom: 0.9rem !important;
    }

    .filter-box {
        display: none !important;
    }

    .job-main-info {
        flex-direction: column;
    }

    .job-main-btn {
        margin-left: auto;
    }

    .job-section .profile-description ul {
        flex-direction: column !important;
    }

    .meta-item strong {
        font-size: 14px !important;
    }

    .job-detail-content {
        padding: 19px !important;
    }

    .profile-other-details ul {
        font-size: 12px !important;
    }

    .profile-other-details h5 {
        font-size: 13px !important;
    }

    .job-language {
        margin-bottom: 11px !important;
    }

    .hirer-content-card-body {
        flex-direction: column;
    }

    .job-card p {
        font-size: 12px !important;
    }

    .job-card {
        font-size: 14px !important;
    }

    .view-details-btn {
        height: 40px;
        width: 40px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .job-card {
        padding: 15px !important;
        font-size: 12px !important;
    }

    .pagination {
        justify-content: flex-start !important;
    }

    .available-jobs-container .pagination-container {
        overflow-x: scroll !important;
    }

    .inner-hirer-btn {
        justify-content: space-between;
        margin-top: 20px;
    }

    .hirer-content-card-body .hirer-content-box {
        width: 100% !important;
    }


    .caregiver-icon-image {
        width: 100% !important;
        height: 200px;
        margin-bottom: 20px;
    }

    .caregiver-icon-image img {
        height: 100%;
        object-fit: contain;
    }

    .hirer-category-list .nav-link h5 {
        font-size: 10px !important;
    }

    .hirer-category-list li .nav-link svg {
        width: 20px !important;
        height: 20px !important;
    }

    .category-box .container {
        overflow-x: auto;
    }

    .strip-heading span {
        font-size: 10px;
    }

    .category-filter {
        position: fixed;
        height: 100vh;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 999;
        padding: 10px !important;
        overflow-y: auto;
    }

    .recommendation-filter .hiring-list ul li a {
        padding: 10px;
        font-size: 10px;
    }

    .recommendation-filter .hiring-list ul li a img {
        width: 20px;
    }

    .hiring-list.caregiver-covid-flex p {
        font-size: 10px;
    }

    .rating-icon i {
        font-size: 30px !important;
    }

    .hirer-category-list {
        justify-content: unset !important;
        flex-wrap: nowrap;
    }

    .hirer-category-list li .nav-link {
        padding: 10px;
    }

    .notification-inner-page {
        padding: 15px;
    }

    .notification-inner-page__header {
        flex-direction: column;
        gap: 15px;
        align-items: flex-start;
    }

    .notification-inner-page__filter {
        flex-direction: column;
        align-items: stretch;
    }

    .notification-inner-page__filter-tabs {
        justify-content: center;
    }

    .notification-inner-page__item {
        padding: 15px;
    }

    .notification-inner-page__item-actions {
        flex-direction: column;
    }
}

/* InvoiceHistory.css */

/* Card Styling */
.invoice-card {
  border: 1px solid #e0e0e0;
  transition: transform 0.2s, box-shadow 0.2s;
  border-radius: 12px;
  overflow: hidden;
}

.invoice-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1) !important;
}

.invoice-card .card-body {
  padding: 1.25rem;
}

/* Status Badges */
.badge {
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.35em 0.65em;
  border-radius: 20px;
}

.bg-warning {
  background-color: #ffc107 !important;
}

.bg-success {
  background-color: #28a745 !important;
}

.bg-danger {
  background-color: #dc3545 !important;
}

.bg-secondary {
  background-color: #6c757d !important;
}

/* Tab Styling */
.nav-tabs {
  border-bottom: 2px solid #dee2e6;
}

.nav-tabs .nav-link {
  color: #6c757d;
  border: none;
  padding: 0.75rem 1.5rem;
  font-weight: 500;
  transition: all 0.3s;
}

.nav-tabs .nav-link:hover {
  color: #495057;
  background-color: #f8f9fa;
}

.nav-tabs .nav-link.active {
  color: #0d6efd;
  background-color: transparent;
  border-bottom: 3px solid #0d6efd;
}

/* Button Styling */
.btn {
  border-radius: 6px;
  font-weight: 500;
  transition: all 0.3s;
}

.btn-sm {
  padding: 0.375rem 0.75rem;
  font-size: 0.875rem;
}

.btn-outline-secondary {
  border-color: #6c757d;
  color: #6c757d;
}

.btn-outline-secondary:hover {
  background-color: #6c757d;
  border-color: #6c757d;
}

/* Modal Styling */
.modal-content {
  border-radius: 12px;
  border: none;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
}

.modal-header {
  background-color: #f8f9fa;
  border-bottom: 1px solid #dee2e6;
  border-radius: 12px 12px 0 0;
}

.modal-title {
  font-weight: 600;
}

/* Table Styling */
.table {
  margin-bottom: 0;
}

.table-bordered {
  border: 1px solid #dee2e6;
}

.table thead th {
  background-color: #f8f9fa;
  border-bottom: 2px solid #dee2e6;
  font-weight: 600;
  color: #495057;
}

.table tbody td {
  vertical-align: middle;
}

/* Responsive Design */
@media (max-width: 768px) {
  .nav-tabs .nav-link {
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
  }
  
  .invoice-card {
    margin-bottom: 1rem;
  }
  
  .btn-group {
    flex-direction: column;
    gap: 0.5rem;
  }
  
  .modal-dialog {
    margin: 0.5rem;
  }
}

/* Animation for modal */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.modal.fade.show {
  animation: fadeIn 0.3s;
  background-color: rgba(0, 0, 0, 0.5);
}

/* Loading spinner */
.spinner-border {
  width: 1rem;
  height: 1rem;
  border-width: 0.15em;
}

/* Text colors */
.text-primary {
  color: #0d6efd !important;
}

.text-muted {
  color: #6c757d !important;
}

/* Shadow utilities */
.shadow-sm {
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
}

.shadow {
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

/* invoiceeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee */
.invoice-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 20px;
  padding: 20px 0;
}

.invoice-card {
  background: #fff;
  border-radius: 12px;
  padding: 16px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  border: 12px solid #f0f0f0;
  transition: transform 0.2s, box-shadow 0.2s;
}

.invoice-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.12);
}

.invoice-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 12px;
}

.profile-info {
  display: flex;
  align-items: center;
  gap: 12px;
}

.profile-info img {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #f0f0f0;
}

.profile-text h4 {
  margin: 0;
  font-size: 16px;
  color: #333;
  font-weight: 600;
  line-height: 1.2;
}

.profile-text .location {
  margin: 4px 0 0 0;
  font-size: 13px;
  color: #666;
}

.header-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}

.view-btn {
  background: #5e2ca5;
  color: #fff;
  border: none;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  transition: background-color 0.2s;
}

.view-btn:hover {
  background: #4a1e8c;
}

.action-buttons {
  display: flex;
  gap: 6px;
}

.accept-btn, .reject-btn {
  padding: 4px 12px;
  border-radius: 15px;
  border: none;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
}

.accept-btn {
  background: #e8f5e9;
  color: #2e7d32;
  border: 1px solid #c8e6c9;
}

.accept-btn:hover {
  background: #d4edd4;
}

.reject-btn {
  background: #ffebee;
  color: #c62828;
  border: 1px solid #ffcdd2;
}

.reject-btn:hover {
  background: #ffd7d7;
}

.invoice-details {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #f0f0f0;
}

.detail-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
  font-size: 13px;
}



.detail-row span:last-child {
  color: #333;
  font-weight: 500;
}

.price-row span:last-child {
  color: #5e2ca5;
  font-weight: 600;
  font-size: 15px;
}

.payment-complete-btn {
  width: 100%;
  margin-top: 12px;
  padding: 8px;
  border-radius: 8px;
  border: none;
  background: #1fae37;
  color: #fff;
  font-weight: 500;
  font-size: 13px;
  cursor: pointer;
  transition: background-color 0.2s;
}

.payment-complete-btn:hover {
  background: #18942c;
}

/* Status badges */
.status-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 500;
  margin-top: 8px;
}

.status-accepted {
  background: #e8f5e9;
  color: #2e7d32;
}

.status-rejected {
  background: #ffebee;
  color: #c62828;
}

.status-pending {
  /* background: #fff3e0; */
  color: #ef6c00;
}



/* view Invoice Modal csssss */


 .invoice-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1050;
    padding: 20px;
  }

  /* Modal Container */
  .invoice-modal {
    background: white;
    border-radius: 12px;
    width: 100%;
    max-width: 450px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
    overflow: hidden;
    animation: modalFadeIn 0.3s ease-out;
  }

  @keyframes modalFadeIn {
    from {
      opacity: 0;
      transform: translateY(-20px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  /* Header */
  .invoice-modal-header {
    padding: 20px 24px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    position: relative;
  }

  .invoice-title-section {
    flex: 1;
  }

  .invoice-main-title {
    margin: 0;
    font-size: 14px;
    font-weight: 500;
    opacity: 0.9;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
  }

  .invoice-subtitle {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }

  .hirer-name {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
  }

  .invoice-date {
    font-size: 12px;
    opacity: 0.8;
  }

  .close-modal-btn {
    background: rgba(255, 255, 255, 0.2);
    border: none;
    color: white;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.2s;
  }

  .close-modal-btn:hover {
    background: rgba(255, 255, 255, 0.3);
  }

  /* Divider */
  .divider {
    height: 1px;
    background: linear-gradient(90deg, 
      transparent 0%, 
      rgba(255, 255, 255, 0.3) 20%, 
      rgba(255, 255, 255, 0.3) 80%, 
      transparent 100%
    );
  }

  /* Body */
  .invoice-modal-body {
    padding: 24px;
  }

  /* Job Category Section */
  .job-category-section {
    margin-bottom: 24px;
  }

  .job-category-title {
    margin: 0 0 8px 0;
    font-size: 22px;
    font-weight: 600;
    color: #2c3e50;
    line-height: 1.3;
  }

  .location-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #f8f9fa;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 14px;
    color: #666;
    border: 1px solid #e9ecef;
  }

  /* Posted By Section */
  .posted-by-section {
    margin-bottom: 24px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e9ecef;
  }

  .section-title {
    font-size: 12px;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 12px;
    font-weight: 500;
  }

  .hirer-info {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .hirer-avatar {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    overflow: hidden;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .hirer-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .avatar-placeholder {
    color: white;
    font-size: 20px;
    font-weight: 600;
  }

  .hirer-details {
    flex: 1;
  }

  .hirer-display-name {
    margin: 0 0 4px 0;
    font-size: 18px;
    font-weight: 600;
    color: #2c3e50;
  }

  .posted-time {
    font-size: 13px;
    color: #666;
    font-weight: 500;
  }

  /* Rate Section */
  .rate-section {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e9ecef;
  }

  .rate-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
  }

  .rate-title {
    font-size: 14px;
    font-weight: 500;
    color: #666;
  }

  .duration {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    color: #666;
    background: #f8f9fa;
    padding: 4px 8px;
    border-radius: 6px;
  }

  .rate-amount {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 22px;
    font-weight: 600;
    color: #2c3e50;
  }

  .currency-icon {
    font-size: 20px;
  }

  /* Final Amount Section */
  .final-amount-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    padding: 16px;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 10px;
    border: 1px solid #dee2e6;
  }

  .final-amount-label {
    font-size: 14px;
    color: #666;
    font-weight: 500;
  }

  .final-amount-value {
    font-size: 24px;
    font-weight: 700;
    color: #dc143c;
  }

  /* Invoice Details Footer */
  .invoice-details-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 16px;
    border-top: 1px solid #e9ecef;
    margin-bottom: 20px;
  }
     .accept-btn {
          background-color: #4caf50;
          color: white;
          border: none;
          padding: 8px 16px;
          border-radius: 6px;
          cursor: pointer;
        }
        .reject-btn {
          background-color: #f44336;
          color: white;
          border: none;
          padding: 8px 16px;
          border-radius: 6px;
          cursor: pointer;
        }

  .invoice-number,
  .payment-status {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 13px;
  }

  .invoice-number span,
  .payment-status span {
    color: #666;
    font-size: 12px;
  }

  .invoice-number strong {
    color: #2c3e50;
    font-weight: 600;
  }

  .payment-status strong {
    font-weight: 600;
  }

  .status-paid {
    color: #28a745;
  }

  .status-pending {
    color: #ffc107;
  }

  /* Payment Complete Button */
  .payment-complete-btn {
    width: 17%;
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    color: white;
    border: none;
    padding: 14px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(40, 167, 69, 0.2);
  }
.payment-btn-wrapper {
  display: flex;
  justify-content: center;
}
jsx
Copy code


  .payment-complete-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(40, 167, 69, 0.3);
  }

  .payment-complete-btn:active {
    transform: translateY(0);
  }

  /* Responsive Design */
  @media (max-width: 480px) {
    .invoice-modal {
      max-width: 100%;
      margin: 10px;
    }

    .invoice-modal-header {
      padding: 16px 20px;
    }

    .invoice-modal-body {
      padding: 20px;
    }

    .hirer-name {
      font-size: 18px;
    }

    .job-category-title {
      font-size: 20px;
    }

    .rate-amount {
      font-size: 20px;
    }

    .final-amount-value {
      font-size: 22px;
    }
  }
.ampm-select {
  border: 1px solid #ced4da; /* gray border */
  border-radius: 6px;

  outline: none;
}

.ampm-select:disabled {
  background-color: #f8f9fa;
  cursor: not-allowed;
}