
        :root {
            --pk-primary: #ff2775;
            --pk-primary-dark: #e81764;
            --pk-dark: #101624;
            --pk-dark-2: #172033;
            --pk-text: #111827;
            --pk-muted: #6b7280;
            --pk-border: #e8ebf0;
            --pk-bg: #f8f9fc;
            --pk-green: #16a56b;
        }

        * {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            font-family: "Inter", sans-serif;
            color: var(--pk-text);
            background: #fff;
        }
		body {
    padding-top: 74px;

}

        a {
            text-decoration: none;
            color: inherit;
        }

        img {
            max-width: 100%;
            display: block;
        }

        /* =========================
           HEADER
        ========================= */

        .pk-header {
            height: 74px;
            background: var(--pk-dark);
            color: #fff;
            position: relative;
            z-index: 1000;
            border-bottom: 1px solid rgba(255,255,255,.08);
        }
		
		.pk-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 5000;
    background: #101624;
}

        .pk-logo {
            width: 185px;
            height: auto;
        }

        .pk-header-inner {
            height: 74px;
            display: flex;
            align-items: center;
            gap: 28px;
        }

        .pk-location {
            display: flex;
            align-items: center;
            gap: 9px;
            white-space: nowrap;
            color: #fff;
            font-size: 14px;
            cursor: pointer;
        }

        .pk-location i {
            color: #fff;
        }

        .pk-header-search {
            height: 44px;
            border: 1px solid rgba(255,255,255,.2);
            background: rgba(255,255,255,.04);
            border-radius: 30px;
            display: flex;
            align-items: center;
            padding: 0 17px;
            flex: 1;
            max-width: 410px;
        }

        .pk-header-search i {
            color: #aab2c3;
            margin-right: 12px;
        }

        .pk-header-search input {
            width: 100%;
            background: transparent;
            border: 0;
            outline: none;
            color: #fff;
            font-size: 14px;
        }

        .pk-header-search input::placeholder {
            color: #9da5b5;
        }

        .pk-nav {
            display: flex;
            align-items: center;
            gap: 28px;
            margin-left: auto;
        }

        .pk-nav a {
            color: #fff;
            font-size: 14px;
            font-weight: 500;
            opacity: .92;
            position: relative;
            padding: 28px 0;
        }

        .pk-nav a:hover,
        .pk-nav a.active {
            color: #fff;
        }

        .pk-nav a.active::after {
            content: "";
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: var(--pk-primary);
            border-radius: 5px 5px 0 0;
        }

        .pk-post-btn {
            background: linear-gradient(135deg, #ff347e, #f31c6b);
            color: #fff !important;
            border-radius: 9px;
            padding: 12px 19px !important;
            font-weight: 700 !important;
            white-space: nowrap;
        }

        .pk-post-btn:hover {
            color: #fff;
            transform: translateY(-1px);
        }

        .pk-signin {
            border: 1px solid rgba(255,255,255,.2);
            border-radius: 24px;
            padding: 10px 18px !important;
            white-space: nowrap;
        }

        .pk-menu-btn {
            display: none;
            color: #fff;
            font-size: 23px;
            cursor: pointer;
        }


        /* =========================
           HERO
        ========================= */

        .pk-hero {
            min-height: 450px;
            position: relative;
            overflow: visible;
            background:
                radial-gradient(circle at 10% 20%, rgba(255,39,117,.12), transparent 32%),
                linear-gradient(100deg, #fff 0%, #fff 42%, #f5f1ee 100%);
        }

        .pk-hero-container {
            min-height: 500px;
            display: flex;
            align-items: center;
            position: relative;
        }

        .pk-hero-content {
            width: 52%;
            padding: 55px 0 95px;
            position: relative;
            z-index: 3;
        }

        .pk-eyebrow {
            color: var(--pk-primary);
            font-size: 14px;
            font-weight: 600;
            margin-bottom: 14px;
        }

        .pk-hero-title {
            font-size: clamp(42px, 5vw, 68px);
            line-height: 1.04;
            letter-spacing: -2.8px;
            font-weight: 800;
            margin-bottom: 22px;
        }

        .pk-hero-title span {
            color: var(--pk-primary);
        }

        .pk-hero-description {
            color: #596174;
            font-size: 17px;
            line-height: 1.7;
            max-width: 530px;
            margin-bottom: 28px;
        }

        .pk-stats {
            display: flex;
            gap: 38px;
        }

        .pk-stat {
            display: flex;
            align-items: center;
            gap: 11px;
        }

        .pk-stat-icon {
            width: 42px;
            height: 42px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            background: #fff1f6;
            color: var(--pk-primary);
        }

        .pk-stat strong {
            display: block;
            font-size: 17px;
        }

        .pk-stat small {
            color: var(--pk-muted);
            font-size: 12px;
        }

        .pk-hero-image {
            position: absolute;
            right: -7%;
            top: 0;
            width: 56%;
            height: 100%;
            overflow: hidden;
            border-radius: 0 0 0 130px;
        }

        .pk-hero-image::after {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(
                90deg,
                rgba(255,255,255,.98) 0%,
                rgba(255,255,255,.25) 22%,
                rgba(255,255,255,0) 48%
            );
        }

        .pk-hero-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
		
		
		/*slider*/
		
		.pk-hero {
    position: relative;
    overflow: hidden;
}

.pk-hero-slide {
    min-height: 450px;
    position: relative;

    background:
        radial-gradient(
            circle at 10% 20%,
            rgba(255,39,117,.12),
            transparent 30%
        ),
        #fff;
}

.pk-hero-content {
    position: relative;
    z-index: 5;
    width: 52%;
    min-height: 400px;

    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-bottom: 30px;
}

.pk-hero-content h1 {
    font-size: clamp(42px, 5vw, 67px);
    line-height: 1.03;
    letter-spacing: -3px;
    font-weight: 800;
    margin-bottom: 22px;
}

.pk-hero-content h1 span {
    color: #ff2775;
}

.pk-hero-content p {
    max-width: 500px;
    color: #687184;
    line-height: 1.7;
    font-size: 16px;
    margin-bottom: 25px;
}

.pk-hero-photo {
    position: absolute;
    right: 0;
    top: 0;

    /* width: 57%;*/
	 width:100%;
    height: 100%;

    overflow: hidden;
}

.pk-hero-photo::after {
    content: "";

    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            #fff 0%,
            rgba(255,255,255,.35) 17%,
            transparent 45%
        );
}

.pk-hero-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pk-hero-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    width: fit-content;

    background: #ff2775;
    color: #fff;

    padding: 13px 20px;
    border-radius: 9px;

    font-size: 13px;
    font-weight: 700;

    transition: .2s;
}

.pk-hero-btn:hover {
    background: #e81764;
    color: #fff;
    transform: translateY(-2px);
}

.pk-hero .carousel-indicators {
    z-index: 20;
    margin-bottom: 25px;
}

.pk-hero .carousel-indicators button {
    width: 25px;
    height: 3px;
    border: 0;
    border-radius: 5px;
}

@media(max-width:767px) {

    .pk-hero-slide {
        min-height: 350px;
    }

    .pk-hero-content {
        width: 100%;
        min-height: 350px;
        padding: 50px 20px 20px;
    }

    .pk-hero-content h1 {
        font-size: 25px;
        letter-spacing: -2px;
    }

    .pk-hero-photo {
        width: 100%;
        /* height: 270px; */
        top: auto;
        bottom: 0;
    }

    .pk-hero-photo::after {
        background:
            linear-gradient(
                0deg,
                rgba(255,255,255,.95),
                transparent 60%
            );
    }

}
		
		/*slider end*/


        /* =========================
           SEARCH BOX
        ========================= */

        .pk-search-wrap {
            position: relative;
            z-index: 20;
            margin-top: -48px;
			    margin-bottom: 20px;
        }
		
		        .pk-search-wrap-city-page {
            position: relative;
            z-index: 20;
            margin-top: 30px;
			    margin-bottom: 30px;
        }


        .pk-search-box {
            background: #fff;
            border-radius: 18px;
            padding: 13px;
            box-shadow: 0 15px 50px rgba(17,24,39,.25);
            border: 1px solid rgba(0,0,0,.05);
            display: grid;
            grid-template-columns: 1.6fr 1fr 1fr auto;
            gap: 8px;
        }

        .pk-search-field {
            height: 58px;
            display: flex;
            align-items: center;
            padding: 0 17px;
            border-right: 1px solid #edf0f4;
            gap: 12px;
        }

        .pk-search-field i {
            color: #9aa2b1;
            font-size: 17px;
        }

        .pk-search-field input,
        .pk-search-field select {
            border: 0;
            outline: 0;
            width: 100%;
            font-size: 14px;
            color: #374151;
            background: transparent;
        }

        .pk-search-field select {
            cursor: pointer;
        }

        .pk-search-button {
            border: 0;
            background: var(--pk-primary);
            color: #fff;
            border-radius: 12px;
            padding: 0 28px;
            font-weight: 700;
            min-width: 135px;
        }

        .pk-search-button:hover {
            background: var(--pk-primary-dark);
        }


/* =========================================
   PKPL MEGA MENU
========================================= */

.pk-mega-wrapper {
    position: static;
}


/* Categories link */

.pk-mega-link {
    display: flex;
    align-items: center;
    gap: 7px;
}

.pk-mega-link i {
    font-size: 9px;
    transition: transform .25s ease;
}


/* Rotate arrow */

.pk-mega-wrapper:hover .pk-mega-link i {
    transform: rotate(180deg);
}


/* =========================================
   MEGA MENU BOX
========================================= */

.pk-mega-menu {
    position: absolute;

    top: 100%;
    left: 50%;

    width: min(1100px, calc(100vw - 40px));

    transform: translate(-50%, 12px);

    background: #ffffff;

    border-radius: 0 0 16px 16px;

    padding: 28px 30px 0;

    box-shadow:
        0 20px 50px rgba(0, 0, 0, .16);

    border: 1px solid #edf0f4;

    opacity: 0;
    visibility: hidden;

    transition:
        opacity .25s ease,
        transform .25s ease;

    z-index: 9999;
}


/* SHOW MEGA MENU */

.pk-mega-wrapper:hover .pk-mega-menu {

    opacity: 1;
    visibility: visible;

    transform: translate(-50%, 0);

}


/* =========================================
   INNER COLUMNS
========================================= */

.pk-mega-inner {

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 25px;
}


/* =========================================
   COLUMN
========================================= */

.pk-mega-column {

    padding: 5px 10px 20px;

    border-right: 1px solid #edf0f4;
}

.pk-mega-column:last-child {
    border-right: none;
}


/* COLUMN TITLE */

.pk-mega-column h5 {

    display: flex;
    align-items: center;

    gap: 9px;

    margin: 0 0 14px;

    font-size: 14px;

    font-weight: 700;

    color: #171b26;
}


/* TITLE ICON */

.pk-mega-column h5 i {

    width: 32px;
    height: 32px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 9px;

    background: #fff0f5;

    color: #ff2775;

    font-size: 13px;
}


/* =========================================
   MENU ITEMS
========================================= */

.pk-mega-column > a {

    display: flex;

    align-items: center;

    gap: 10px;

    padding: 8px 9px;

    margin-bottom: 2px;

    color: #687184;

    font-size: 12px;

    font-weight: 500;

    border-radius: 7px;

    transition: all .2s ease;

}


/* ITEM ICON */

.pk-mega-column > a i {

    width: 18px;

    color: #9aa2b1;

    font-size: 11px;

    transition: .2s;
}


/* HOVER */

.pk-mega-column > a:hover {

    background: #fff1f6;

    color: #ff2775;

    padding-left: 13px;

}


.pk-mega-column > a:hover i {

    color: #ff2775;

}


/* =========================================
   FOOTER
========================================= */

.pk-mega-bottom {

    border-top: 1px solid #edf0f4;

    margin-top: 5px;

    padding: 15px 5px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    font-size: 11px;

    color: #8b93a1;
}


.pk-mega-bottom a {

    display: flex;

    align-items: center;

    gap: 7px;

    color: #ff2775;

    font-weight: 700;

}


.pk-mega-bottom a:hover {

    color: #e81764;

}


        /* =========================
           CATEGORY SHORTCUTS
        ========================= */

        .pk-category-section {
            padding: 55px 0 25px;
        }

        .pk-category-scroll {
            display: flex;
            justify-content: space-between;
            gap: 20px;
        }

        .pk-category-item {
            text-align: center;
            min-width: 90px;
            cursor: pointer;
            transition: .25s ease;
        }

        .pk-category-icon {
            width: 64px;
            height: 64px;
            border-radius: 50%;
            margin: auto auto 12px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 22px;
            transition: .25s ease;
        }

        .pk-category-item:hover {
            transform: translateY(-4px);
        }

        .pk-category-item:hover .pk-category-icon {
            box-shadow: 0 10px 25px rgba(0,0,0,.1);
        }

        .cat-blue {
            background: #edf6ff;
            color: #1683ff;
        }

        .cat-orange {
            background: #fff3e9;
            color: #ff8b24;
        }

        .cat-purple {
            background: #f4efff;
            color: #7955ef;
        }

        .cat-green {
            background: #eafbf3;
            color: #17b36f;
        }

        .cat-pink {
            background: #fff0f6;
            color: #ff2775;
        }

        .cat-yellow {
            background: #fff8df;
            color: #e4a900;
        }

        .pk-category-item span {
            font-size: 13px;
            color: #343a48;
            white-space: nowrap;
        }


.pk-category-bar {

    position: sticky;

    top: 74px;

    z-index: 4000;

    background: #fff;

    border-bottom: 1px solid #edf0f4;

    box-shadow: 0 4px 15px rgba(0,0,0,.04);

}

.pk-category-swiper {
    padding: 9px 0;
}

.pk-category-swiper .swiper-slide {
    width: auto;
}

.pk-cat-slide {

    display: flex;
    align-items: center;
    gap: 8px;

    background: #fff;

    border: 1px solid #e7eaf0;

    border-radius: 30px;

    padding: 7px 14px 7px 8px;

    color: #374151;

    font-size: 12px;
    font-weight: 600;

    white-space: nowrap;

    transition: .2s;
}

.pk-cat-slide:hover {
    border-color: #ff2775;
    color: #ff2775;
}

.pk-cat-icon {

    width: 30px;
    height: 30px;

    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 12px;
}

        /* =========================
           SECTION COMMON
        ========================= */

        .pk-section {
            padding: 65px 0;
        }

        .pk-section-light {
            background: var(--pk-bg);
        }

        .pk-section-heading {
            margin-bottom: 28px;
        }

        .pk-section-heading h2 {
            font-size: 28px;
            font-weight: 750;
            margin-bottom: 5px;
            letter-spacing: -.8px;
        }

        .pk-section-heading p {
            color: var(--pk-muted);
            font-size: 14px;
            margin: 0;
        }

        .pk-heading-accent {
            color: var(--pk-primary);
        }

        .pk-view-all {
            border: 1px solid var(--pk-border);
            border-radius: 9px;
            padding: 10px 16px;
            background: #fff;
            font-size: 13px;
            font-weight: 600;
        }

        .pk-view-all:hover {
            color: var(--pk-primary);
            border-color: var(--pk-primary);
        }


        /* =========================
           LISTING CARD
        ========================= */
		
		.pk-view-toggle {
    display: flex;
    gap: 5px;
    background: #f1f3f6;
    padding: 4px;
    border-radius: 9px;
}

.pk-view-toggle button {
    border: 0;
    background: transparent;
    padding: 8px 12px;
    border-radius: 7px;
    color: #6b7280;
    font-size: 12px;
    font-weight: 600;
}

.pk-view-toggle button.active {
    background: #fff;
    color: #ff2775;
    box-shadow: 0 2px 7px rgba(0,0,0,.08);
}
		

        .pk-listing-card {
            background: #fff;
            border: 1px solid var(--pk-border);
            border-radius: 15px;
            overflow: hidden;
            transition: .25s ease;
            height: 100%;
        }

        .pk-listing-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 14px 35px rgba(17,24,39,.1);
        }

        .pk-listing-image {
            height: 220px;
            position: relative;
            overflow: hidden;
        }

        .pk-listing-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: .4s ease;
        }

        .pk-listing-card:hover .pk-listing-image img {
            transform: scale(1.05);
        }

        .pk-featured {
            position: absolute;
            top: 13px;
            left: 13px;
            background: var(--pk-primary);
            color: #fff;
            font-size: 11px;
            font-weight: 700;
            padding: 6px 10px;
            border-radius: 7px;
        }

        .pk-favorite {
            position: absolute;
            top: 12px;
            right: 12px;
            width: 36px;
            height: 36px;
            border-radius: 50%;
            border: 0;
            background: rgba(255,255,255,.95);
            display: flex;
            align-items: center;
            justify-content: center;
            color: #6b7280;
        }

        .pk-favorite:hover {
            color: var(--pk-primary);
        }

        .pk-listing-body {
            padding: 16px;
        }

        .pk-listing-price {
            font-size: 19px;
            font-weight: 750;
            margin-bottom: 7px;
        }

        .pk-listing-title {
            font-size: 14px;
            font-weight: 600;
            margin-bottom: 12px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .pk-listing-location {
            color: #7b8494;
            font-size: 12px;
            display: flex;
            gap: 6px;
            align-items: center;
        }

        .pk-listing-location i {
            color: #9aa2af;
        }

        .pk-listing-footer {
            display: flex;
            justify-content: space-between;
            align-items: center;
            border-top: 1px solid #f0f1f3;
            padding-top: 12px;
            margin-top: 13px;
        }

        .pk-seller {
            font-size: 11px;
            color: #6b7280;
        }

        .pk-verified {
            color: var(--pk-green);
            font-size: 11px;
        }


     /* ====== List + Grid========= */
	 
	 /* =========================================
   SECTION COMMON
========================================= */

.pk-listing-section,
.pk-all-listings {
    padding: 25px 0;
}

.pk-all-listings {
    background: #f8f9fb;
}

.pk-section-head,
.pk-listing-toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 30px;
}

.pk-section-label {
    display: block;
    margin-bottom: 8px;

    color: #ff2775;

    font-size: 11px;
    font-weight: 800;

    letter-spacing: 1.5px;
}

.pk-section-head h2,
.pk-listing-toolbar h2 {
    margin: 0;

    font-size: 34px;
    line-height: 1.15;

    font-weight: 800;
    letter-spacing: -1px;

    color: #171b26;
}

.pk-section-head h2 span,
.pk-listing-toolbar h2 span {
    color: #ff2775;
}

.pk-section-head p {
    margin: 10px 0 0;

    color: #7b8494;
    font-size: 13px;
}

.pk-view-all {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    color: #ff2775;

    font-size: 13px;
    font-weight: 700;
}

.pk-view-all:hover {
    color: #e81764;
}


/* =========================================
   FEATURED CARD
========================================= */

.pk-featured-swiper {
   /* overflow: visible; */
}

.pk-featured-swiper .swiper-slide {
    width: 285px;
}

.pk-feature-card {

    overflow: hidden;

    background: #fff;

    border: 1px solid #e9ecf1;

    border-radius: 16px;

    transition: .25s ease;
}

.pk-feature-card:hover {

    transform: translateY(-5px);

    box-shadow:
        0 15px 35px rgba(0,0,0,.09);

}


/* IMAGE */

.pk-card-image {
    position: relative;

    height: 190px;

    overflow: hidden;
}

.pk-card-image img {

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform .4s ease;
}

.pk-feature-card:hover .pk-card-image img {
    transform: scale(1.05);
}


/* FEATURED BADGE */

.pk-feature-badge {

    position: absolute;

    top: 12px;
    left: 12px;

    padding: 5px 9px;

    background: #ff2775;
    color: #fff;

    border-radius: 6px;

    font-size: 9px;
    font-weight: 700;

    text-transform: uppercase;
}


/* HEART */

.pk-favorite,
.pk-heart-btn {

    position: absolute;

    top: 10px;
    right: 10px;

    width: 34px;
    height: 34px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 0;

    border-radius: 50%;

    background: rgba(255,255,255,.95);

    color: #5d6470;

    cursor: pointer;

    transition: .2s;
}

.pk-favorite:hover,
.pk-heart-btn:hover {

    color: #ff2775;

    transform: scale(1.08);
}


/* BODY */

.pk-card-body {
    padding: 17px;
}

.pk-card-category,
.pk-listing-category {

    display: block;

    color: #ff2775;

    font-size: 10px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: .5px;

    margin-bottom: 7px;
}

.pk-card-body h3 {

    margin: 0 0 9px;

    font-size: 15px;

    font-weight: 700;

    color: #171b26;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pk-card-location {

    display: flex;
    align-items: center;
    gap: 6px;

    color: #8a92a0;

    font-size: 11px;
}

.pk-card-location i {
    color: #ff2775;
}

.pk-card-bottom {

    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-top: 14px;

    padding-top: 13px;

    border-top: 1px solid #edf0f4;
}

.pk-card-bottom strong {

    color: #171b26;

    font-size: 16px;
}

.pk-card-bottom small {

    color: #8b93a1;

    font-size: 9px;

    font-weight: 400;
}

.pk-available,
.pk-status {

    color: #15966c;

    background: #eaf9f3;

    padding: 5px 7px;

    border-radius: 5px;

    font-size: 9px;

    font-weight: 700;
}


/* =========================================
   LISTING TOOLBAR
========================================= */

.pk-result-count {

    margin: 7px 0 0;

    color: #8a92a0;

    font-size: 12px;
}

.pk-toolbar-right {

    display: flex;
    align-items: center;
    gap: 12px;
}


/* SORT */

.pk-sort-box {

    display: flex;
    align-items: center;
    gap: 7px;

    height: 42px;

    background: #fff;

    border: 1px solid #e5e8ed;

    border-radius: 9px;

    padding: 0 10px;
}

.pk-sort-box label {

    color: #9299a5;

    font-size: 10px;

    white-space: nowrap;
}

.pk-sort-box select {

    border: 0;

    outline: 0;

    background: transparent;

    color: #333946;

    font-size: 11px;

    font-weight: 600;

    cursor: pointer;
}


/* =========================================
   VIEW TOGGLE
========================================= */

.pk-view-toggle {

    display: flex;

    gap: 3px;

    padding: 4px;

    background: #eef0f4;

    border-radius: 9px;
}

.pk-view-toggle button {

    height: 34px;

    display: flex;
    align-items: center;

    gap: 6px;

    border: 0;

    border-radius: 7px;

    padding: 0 11px;

    background: transparent;

    color: #858d9a;

    font-size: 11px;

    font-weight: 600;

    cursor: pointer;

    transition: .2s;
}

.pk-view-toggle button.active {

    background: #fff;

    color: #ff2775;

    box-shadow:
        0 2px 7px rgba(0,0,0,.07);
}


/* =========================================
   LISTING GRID
========================================= */

.pk-listing-grid {

    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 20px;
}


/* =========================================
   NORMAL LISTING CARD
========================================= */

.pk-listing-card {

    position: relative;

    overflow: hidden;

    background: #fff;

    border: 1px solid #e8ebf0;

    border-radius: 14px;

    transition: .25s ease;
}

.pk-listing-card:hover {

    transform: translateY(-4px);

    box-shadow:
        0 15px 35px rgba(0,0,0,.08);
}


/* IMAGE */

.pk-listing-image {

    position: relative;

    height: 190px;

    overflow: hidden;
}

.pk-listing-image img {

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform .4s ease;
}

.pk-listing-card:hover .pk-listing-image img {
    transform: scale(1.05);
}


/* BADGE */

.pk-listing-badge {

    position: absolute;

    top: 11px;
    left: 11px;

    padding: 5px 8px;

    border-radius: 5px;

    background: #ff2775;

    color: #fff;

    font-size: 9px;

    font-weight: 700;
}


/* HEART */

.pk-heart-btn {

    top: 10px;
    right: 10px;
}


/* CONTENT */

.pk-listing-content {
    padding: 16px;
}

.pk-listing-content h3 {

    margin: 0 0 12px;

    font-size: 15px;

    font-weight: 700;

    color: #171b26;

    line-height: 1.35;

    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;

    overflow: hidden;
}


/* META */

.pk-listing-meta {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 8px;

    color: #8b93a1;

    font-size: 10px;
}

.pk-listing-meta span {

    display: flex;

    align-items: center;

    gap: 5px;
}

.pk-listing-meta i {
    color: #ff2775;
}


/* FOOTER */

.pk-listing-footer {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-top: 15px;

    padding-top: 13px;

    border-top: 1px solid #edf0f4;
}

.pk-price {

    color: #171b26;

    font-size: 17px;

    font-weight: 800;
}

.pk-price small {

    color: #9299a5;

    font-size: 9px;

    font-weight: 400;
}


/* =========================================
   LOAD MORE
========================================= */

.pk-load-more {

    display: flex;

    justify-content: center;

    margin-top: 35px;
}

.pk-load-more button {

    display: flex;

    align-items: center;

    gap: 9px;

    padding: 12px 22px;

    border: 1px solid #e2e5ea;

    border-radius: 9px;

    background: #fff;

    color: #454c59;

    font-size: 12px;

    font-weight: 700;

    cursor: pointer;

    transition: .2s;
}

.pk-load-more button:hover {

    border-color: #ff2775;

    color: #ff2775;
}



/* =========================================
   LIST VIEW
========================================= */

.pk-listing-grid.pk-list-view {

    display: flex;

    flex-direction: column;

    gap: 14px;
}


.pk-list-view .pk-listing-card {

    display: grid;

    grid-template-columns: 250px 1fr;

    min-height: 190px;

    transform: none !important;
}


/* IMAGE */

.pk-list-view .pk-listing-image {

    height: 100%;

    min-height: 190px;
}


/* CONTENT */

.pk-list-view .pk-listing-content {

    display: flex;

    flex-direction: column;

    justify-content: center;

    padding: 22px 25px;
}


.pk-list-view .pk-listing-content h3 {

    font-size: 18px;

    margin-bottom: 15px;
}


.pk-list-view .pk-listing-meta {

    justify-content: flex-start;

    gap: 25px;
}


.pk-list-view .pk-listing-footer {

    margin-top: 18px;

    padding-top: 14px;
}


/* =========================================
   LIST VIEW — IMAGE
========================================= */

.pk-list-view .pk-listing-image img {

    transition: transform .4s ease;
}


.pk-list-view .pk-listing-card:hover
.pk-listing-image img {

    transform: scale(1.04);
}


/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 1199px) {

    .pk-listing-grid {

        grid-template-columns:
            repeat(3, minmax(0, 1fr));

    }

}


@media (max-width: 991px) {

    .pk-listing-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

    }

    .pk-section-head h2,
    .pk-listing-toolbar h2 {

        font-size: 29px;

    }

}


@media (max-width: 767px) {

    .pk-listing-section,
    .pk-all-listings {

        padding: 50px 0;

    }


    .pk-section-head,
    .pk-listing-toolbar {

        align-items: flex-start;

        flex-direction: column;

        margin-bottom: 22px;

    }


    .pk-view-all {

        display: none;

    }


    .pk-listing-toolbar {

        gap: 18px;

    }


    .pk-toolbar-right {

        width: 100%;

        justify-content: space-between;

    }


    .pk-sort-box {

        flex: 1;

    }


    .pk-listing-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 10px;

    }


    .pk-listing-image {

        height: 145px;

    }


    .pk-listing-content {

        padding: 12px;

    }


    .pk-listing-content h3 {

        font-size: 13px;

    }


    .pk-listing-meta {

        flex-direction: column;

        align-items: flex-start;

    }


    .pk-listing-footer {

        align-items: flex-start;

        flex-direction: column;

        gap: 8px;

    }


    /* LIST VIEW MOBILE */

    .pk-listing-grid.pk-list-view {

        display: flex;

    }


    .pk-list-view .pk-listing-card {

        grid-template-columns:
            115px 1fr;

        min-height: 145px;

    }


    .pk-list-view .pk-listing-image {

        height: 100%;

        min-height: 145px;

    }


    .pk-list-view .pk-listing-content {

        padding: 12px;

    }


    .pk-list-view .pk-listing-content h3 {

        font-size: 13px;

        margin-bottom: 8px;

    }


    .pk-list-view .pk-listing-meta {

        gap: 4px;

    }


    .pk-list-view .pk-listing-footer {

        margin-top: 8px;

        padding-top: 8px;

        flex-direction: row;

        align-items: center;

    }


    .pk-list-view .pk-price {

        font-size: 14px;

    }


    .pk-list-view .pk-status {

        font-size: 8px;

    }


    .pk-list-view .pk-listing-category {

        font-size: 8px;

    }


    .pk-list-view .pk-listing-meta {

        font-size: 8px;

    }


    .pk-list-view .pk-listing-image .pk-heart-btn {

        width: 28px;

        height: 28px;

    }

}

	 
     /* ====== List + Grid end========= */



        /* =========================
           SERVICE SECTION
        ========================= */

        .pk-service-card {
            min-height: 235px;
            border-radius: 18px;
            overflow: hidden;
            position: relative;
            color: #fff;
            cursor: pointer;
        }

        .pk-service-card img {
            width: 100%;
            height: 100%;
            min-height: 235px;
            object-fit: cover;
            transition: .4s ease;
        }

        .pk-service-card::after {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(
                0deg,
                rgba(0,0,0,.75),
                rgba(0,0,0,.05)
            );
        }

        .pk-service-card:hover img {
            transform: scale(1.06);
        }

        .pk-service-content {
            position: absolute;
            z-index: 2;
            left: 20px;
            right: 20px;
            bottom: 18px;
        }

        .pk-service-content h4 {
            font-size: 20px;
            margin-bottom: 5px;
        }

        .pk-service-content p {
            margin: 0;
            font-size: 12px;
            opacity: .85;
        }


        /* =========================
           WHY PKPL
        ========================= */

        .pk-why {
            background: var(--pk-dark);
            color: #fff;
            border-radius: 28px;
            padding: 55px;
            overflow: hidden;
            position: relative;
        }

        .pk-why::before {
            content: "";
            width: 330px;
            height: 330px;
            border-radius: 50%;
            position: absolute;
            right: -100px;
            top: -130px;
            background: rgba(255,39,117,.12);
        }

        .pk-why-title {
            font-size: 31px;
            font-weight: 750;
            margin-bottom: 10px;
        }

        .pk-why-description {
            color: #aab2c2;
            font-size: 14px;
            line-height: 1.7;
            max-width: 530px;
        }

        .pk-feature {
            display: flex;
            gap: 15px;
            margin-top: 28px;
        }

        .pk-feature-icon {
            flex: 0 0 48px;
            width: 48px;
            height: 48px;
            background: rgba(255,39,117,.13);
            color: #ff5c99;
            border-radius: 12px;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .pk-feature h5 {
            font-size: 15px;
            margin-bottom: 5px;
        }

        .pk-feature p {
            margin: 0;
            color: #9da6b7;
            font-size: 12px;
            line-height: 1.5;
        }


        /* =========================
           CITIES
        ========================= */

        .pk-city-card {
            background: #fff;
            border: 1px solid var(--pk-border);
            border-radius: 14px;
            padding: 18px;
            display: flex;
            align-items: center;
            gap: 13px;
            transition: .2s;
        }

        .pk-city-card:hover {
            border-color: var(--pk-primary);
            transform: translateY(-3px);
        }

        .pk-city-icon {
            width: 44px;
            height: 44px;
            border-radius: 10px;
            background: #fff0f6;
            color: var(--pk-primary);
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .pk-city-card h6 {
            margin: 0 0 4px;
            font-size: 14px;
        }

        .pk-city-card small {
            color: #8a92a0;
        }


        /* =========================
           CTA
        ========================= */

        .pk-cta {
            padding: 70px 0;
        }

        .pk-cta-box {
            background:
                radial-gradient(circle at 90% 20%, rgba(255,255,255,.12), transparent 25%),
                linear-gradient(120deg, #ff2775, #e91b67);
            color: #fff;
            border-radius: 25px;
            padding: 55px 60px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 30px;
        }

        .pk-cta h2 {
            font-size: 32px;
            font-weight: 750;
            margin-bottom: 10px;
        }

        .pk-cta p {
            margin: 0;
            opacity: .88;
            font-size: 14px;
        }

        .pk-cta-button {
            background: #fff;
            color: var(--pk-primary);
            padding: 14px 23px;
            border-radius: 10px;
            font-weight: 700;
            white-space: nowrap;
        }


        /* =========================
           FOOTER
        ========================= */

        .pk-footer {
            background: #0c1220;
            color: #fff;
            padding-top: 60px;
        }

        .pk-footer-logo {
            width: 175px;
            margin-bottom: 18px;
        }

        .pk-footer-description {
            color: #929bab;
            font-size: 13px;
            line-height: 1.7;
            max-width: 300px;
        }

        .pk-footer h5 {
            font-size: 14px;
            margin-bottom: 20px;
        }

        .pk-footer ul {
            padding: 0;
            margin: 0;
            list-style: none;
        }

        .pk-footer li {
            margin-bottom: 11px;
        }

        .pk-footer li a {
            color: #929bab;
            font-size: 12px;
        }

        .pk-footer li a:hover {
            color: var(--pk-primary);
        }

        .pk-social {
            display: flex;
            gap: 8px;
            margin-top: 20px;
        }

        .pk-social a {
            width: 34px;
            height: 34px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            background: #171f31;
            color: #aeb5c3;
        }

        .pk-social a:hover {
            background: var(--pk-primary);
            color: #fff;
        }

        .pk-footer-bottom {
            margin-top: 45px;
            padding: 20px 0;
            border-top: 1px solid rgba(255,255,255,.08);
            color: #7f8797;
            font-size: 11px;
        }


        /* =========================
           BACK TO TOP
        ========================= */

        .pk-back-top {
            position: fixed;
            right: 22px;
            bottom: 22px;
            width: 42px;
            height: 42px;
            border: 0;
            border-radius: 50%;
            background: var(--pk-primary);
            color: #fff;
            display: none;
            align-items: center;
            justify-content: center;
            z-index: 999;
            box-shadow: 0 8px 25px rgba(255,39,117,.3);
        }
		
		
		/* =========================================
   MOBILE HEADER
========================================= */

.pk-mobile-header {
    display: none;
}


/* =========================================
   MOBILE DRAWER
========================================= */

.pk-mobile-drawer {
    position: fixed;

    top: 0;
    right: 0;
    bottom: 0;

    width: min(390px, 88vw);

    background: #fff;

    z-index: 10001;

    transform: translateX(100%);

    transition: transform .35s cubic-bezier(.4, 0, .2, 1);

    box-shadow:
        -10px 0 40px rgba(0,0,0,.16);

    overflow-y: auto;
}


/* OPEN */

.pk-mobile-drawer.pk-drawer-open {
    transform: translateX(0);
}


/* =========================================
   OVERLAY
========================================= */

.pk-menu-overlay {

    position: fixed;

    inset: 0;

    background: rgba(12,17,29,.62);

    backdrop-filter: blur(3px);

    z-index: 10000;

    opacity: 0;

    visibility: hidden;

    transition: .3s ease;
}


.pk-menu-overlay.pk-overlay-show {

    opacity: 1;

    visibility: visible;
}


/* =========================================
   DRAWER HEADER
========================================= */

.pk-drawer-header {

    height: 78px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 0 20px;

    background: #151b29;

    border-bottom: 1px solid rgba(255,255,255,.08);
}


.pk-drawer-logo img {

    width: 145px;

    max-height: 58px;

    object-fit: contain;
}


.pk-drawer-close {

    width: 38px;
    height: 38px;

    display: flex;

    align-items: center;
    justify-content: center;

    border: 0;

    border-radius: 50%;

    background: rgba(255,255,255,.1);

    color: #fff;

    font-size: 18px;

    cursor: pointer;

    transition: .2s;
}


.pk-drawer-close:hover {

    background: #ff2775;

    transform: rotate(90deg);
}


/* =========================================
   DRAWER CONTENT
========================================= */

.pk-drawer-content {

    padding: 18px 16px 25px;
}


/* =========================================
   ACCOUNT
========================================= */

.pk-account-box {

    display: flex;

    align-items: center;

    gap: 12px;

    padding: 14px;

    margin-bottom: 14px;

    border: 1px solid #eceef2;

    border-radius: 13px;

    background: #fff;

    box-shadow:
        0 5px 20px rgba(20,25,35,.05);
}


.pk-account-icon {

    width: 42px;
    height: 42px;

    flex: 0 0 42px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #ffe8f0;

    color: #ff2775;

    font-size: 17px;
}


.pk-account-text {

    min-width: 0;

    flex: 1;
}


.pk-account-text strong {

    display: block;

    color: #171b26;

    font-size: 13px;

    font-weight: 700;
}


.pk-account-text small {

    display: block;

    margin-top: 3px;

    color: #9299a5;

    font-size: 10px;
}


.pk-account-box > i {

    color: #a0a7b3;

    font-size: 11px;
}


/* =========================================
   MENU LINKS
========================================= */

.pk-drawer-menu {

    border-top: 1px solid #edf0f3;
}


.pk-drawer-link {

    width: 100%;

    min-height: 52px;

    display: flex;

    align-items: center;

    gap: 13px;

    padding: 0 7px;

    border: 0;

    border-bottom: 1px solid #edf0f3;

    background: transparent;

    color: #252b36;

    text-decoration: none;

    font-size: 13px;

    font-weight: 600;

    text-align: left;

    cursor: pointer;

    transition: .2s;
}


.pk-drawer-link > i:first-child {

    width: 22px;

    color: #69717e;

    font-size: 15px;

    text-align: center;
}


.pk-drawer-link .pk-link-arrow {

    margin-left: auto;

    width: auto;

    color: #a3aab5;

    font-size: 9px;
}


.pk-drawer-link:hover,
.pk-drawer-link.active {

    color: #ff2775;
}


.pk-drawer-link:hover > i:first-child,
.pk-drawer-link.active > i:first-child {

    color: #ff2775;
}


/* =========================================
   SAVED COUNT
========================================= */

.pk-saved-count {

    margin-left: auto;

    min-width: 23px;
    height: 23px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #ff2775;

    color: #fff;

    font-size: 10px;

    font-weight: 700;
}


.pk-saved-count + .pk-link-arrow {

    margin-left: 2px;
}


/* =========================================
   CATEGORY SUB MENU
========================================= */

.pk-mobile-categories {

    display: none;

    background: #fafbfc;

    border-bottom: 1px solid #edf0f3;
}


.pk-mobile-categories.pk-category-open {

    display: block;
}


/* CATEGORY HEADING */

.pk-category-heading {

    width: 100%;

    min-height: 48px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 0 8px 0 12px;

    border: 0;

    border-bottom: 1px solid #e9ecf0;

    background: transparent;

    color: #252b36;

    font-size: 12px;

    font-weight: 700;

    cursor: pointer;
}


.pk-category-heading span {

    display: flex;

    align-items: center;

    gap: 10px;
}


.pk-category-heading span i {

    width: 20px;

    color: #ff2775;

    text-align: center;
}


.pk-category-heading > i {

    color: #929aa7;

    font-size: 9px;

    transition: .25s;
}


.pk-category-heading.pk-heading-open > i {

    transform: rotate(180deg);

    color: #ff2775;
}


/* CATEGORY ITEMS */

.pk-category-items {

    display: none;

    padding: 4px 0 8px 42px;

    background: #fff;
}


.pk-category-items.pk-items-open {

    display: block;
}


.pk-category-items a {

    display: block;

    padding: 9px 5px;

    color: #6e7683;

    text-decoration: none;

    font-size: 11px;

    border-bottom: 1px solid #f0f1f3;
}


.pk-category-items a:hover {

    color: #ff2775;

}


/* ALL CATEGORIES */

.pk-all-categories {

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 13px 12px;

    color: #ff2775;

    text-decoration: none;

    font-size: 11px;

    font-weight: 700;
}


/* =========================================
   POST AD
========================================= */

.pk-drawer-post {

    height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 9px;

    margin-top: 18px;

    border-radius: 9px;

    background: linear-gradient(
        135deg,
        #ff2775,
        #ed165f
    );

    color: #fff;

    text-decoration: none;

    font-size: 13px;

    font-weight: 700;

    box-shadow:
        0 8px 20px rgba(255,39,117,.22);
}


.pk-drawer-post:hover {

    color: #fff;

    transform: translateY(-1px);
}


/* =========================================
   MOBILE HEADER
========================================= */

@media (max-width: 767px) {

    .pk-mobile-header {

        display: block;

        position: sticky;

        top: 0;

        z-index: 9000;

        background: #151b29;

        box-shadow:
            0 4px 15px rgba(0,0,0,.08);
    }


    .pk-mobile-top {

        height: 64px;

        display: flex;

        align-items: center;

        justify-content: space-between;

        padding: 0 12px;
    }


    /* HAMBURGER */

    .pk-mobile-menu-btn {

        width: 40px;
        height: 40px;

        display: flex;

        flex-direction: column;

        align-items: center;
        justify-content: center;

        gap: 5px;

        border: 0;

        background: transparent;

        cursor: pointer;
    }


    .pk-mobile-menu-btn span {

        display: block;

        width: 22px;
        height: 2px;

        border-radius: 3px;

        background: #fff;
    }


    /* LOGO */

    .pk-mobile-logo {

        display: flex;

        align-items: center;

        justify-content: center;

        flex: 1;
    }


    .pk-mobile-logo img {

        width: 125px;

        max-height: 48px;

        object-fit: contain;
    }


    /* ACTIONS */

    .pk-mobile-actions {

        display: flex;

        align-items: center;

        gap: 7px;
    }


    .pk-mobile-heart,
    .pk-mobile-plus {

        width: 36px;
        height: 36px;

        display: flex;

        align-items: center;
        justify-content: center;

        border-radius: 8px;

        text-decoration: none;
    }


    .pk-mobile-heart {

        color: #fff;

        font-size: 18px;
    }


    .pk-mobile-plus {

        background: #ff2775;

        color: #fff;

        font-size: 16px;
    }


    /* SEARCH */

    .pk-mobile-search {

        height: 44px;

        display: flex;

        align-items: center;

        gap: 9px;

        margin: 0 12px 9px;

        padding: 0 13px;

        border-radius: 9px;

        background: #fff;
    }


    .pk-mobile-search i {

        color: #8b93a0;

        font-size: 13px;
    }


    .pk-mobile-search input {

        width: 100%;

        border: 0;

        outline: 0;

        background: transparent;

        color: #333;

        font-size: 12px;
    }


    .pk-mobile-search input::placeholder {

        color: #a1a7b1;
    }


    /* LOCATION */

    .pk-mobile-location {

        min-height: 40px;

        display: flex;

        align-items: center;

        justify-content: space-between;

        padding: 0 15px;

        background: #fff;

        color: #353b46;

        text-decoration: none;

        font-size: 11px;

        font-weight: 600;
    }


    .pk-mobile-location div {

        display: flex;

        align-items: center;

        gap: 7px;
    }


    .pk-mobile-location div i {

        color: #ff2775;
    }


    .pk-mobile-location > i {

        color: #8d95a1;

        font-size: 9px;
    }


    /* DESKTOP HEADER HIDE */

    .pk-header {

        display: none;
    }

}


/* =========================================
   MOBILE BOTTOM NAVIGATION
========================================= */

.pk-bottom-nav {

    display: none;

}


/* =========================================
   MOBILE ONLY
========================================= */

@media (max-width: 767px) {

    .pk-bottom-nav {

        position: fixed;

        left: 0;
        right: 0;
        bottom: 0;

        height: 68px;

        display: flex;

        align-items: flex-end;

        justify-content: space-around;

        background: rgba(255,255,255,.97);

        border-top: 1px solid #e8ebef;

        box-shadow:
            0 -5px 25px rgba(20,25,35,.10);

        z-index: 9999;

        padding:
            5px 5px
            env(safe-area-inset-bottom);

        backdrop-filter: blur(12px);

    }


    /* =====================================
       NORMAL ITEMS
    ===================================== */

    .pk-bottom-item {

        position: relative;

        width: 20%;

        height: 58px;

        display: flex;

        flex-direction: column;

        align-items: center;

        justify-content: center;

        gap: 4px;

        border: 0;

        background: transparent;

        color: #7d8591;

        text-decoration: none;

        font-size: 10px;

        font-weight: 600;

        cursor: pointer;

        -webkit-tap-highlight-color: transparent;

    }


    .pk-bottom-item i {

        font-size: 18px;

        line-height: 20px;

    }


    .pk-bottom-item span {

        line-height: 14px;

    }


    /* =====================================
       ACTIVE
    ===================================== */

    .pk-bottom-item.active {

        color: #ff2775;

    }


    .pk-bottom-item.active i {

        transform: translateY(-1px);

    }


    /* =====================================
       POST AD CENTER BUTTON
    ===================================== */

    .pk-bottom-post {

        position: relative;

        width: 20%;

        height: 68px;

        margin-top: -18px;

        display: flex;

        flex-direction: column;

        align-items: center;

        justify-content: center;

        gap: 4px;

        color: #ff2775;

        text-decoration: none;

        font-size: 10px;

        font-weight: 700;

        -webkit-tap-highlight-color: transparent;

    }


    .pk-post-icon {

        width: 48px;
        height: 48px;

        display: flex;

        align-items: center;
        justify-content: center;

        border-radius: 50%;

        background: linear-gradient(
            135deg,
            #ff2775,
            #e9145d
        );

        color: #fff;

        border: 4px solid #fff;

        box-shadow:
            0 5px 18px rgba(255,39,117,.30);

        font-size: 19px;

        transition: .2s;

    }


    .pk-bottom-post:active
    .pk-post-icon {

        transform: scale(.92);

    }


    /* =====================================
       SAVED BADGE
    ===================================== */

    .pk-bottom-icon-wrap {

        position: relative;

        display: flex;

        align-items: center;

        justify-content: center;

        height: 20px;

    }


    .pk-bottom-icon-wrap > i {

        font-size: 18px;

    }


    .pk-bottom-badge {

        position: absolute;

        top: -7px;

        right: -12px;

        min-width: 15px;

        height: 15px;

        display: flex;

        align-items: center;

        justify-content: center;

        padding: 0 3px;

        border-radius: 10px;

        background: #ff2775;

        color: #fff;

        border: 2px solid #fff;

        font-size: 7px;

        line-height: 1;

    }


    /* =====================================
       BODY SPACE
       Content bottom nav ke neeche na aaye
    ===================================== */

    body {

        padding-bottom: 70px;

    }

}


        /* =========================
           RESPONSIVE
        ========================= */

        @media (max-width: 1199px) {

            .pk-header-inner {
                gap: 18px;
            }

            .pk-nav {
                gap: 17px;
            }

            .pk-header-search {
                max-width: 300px;
            }

            .pk-hero-title {
                font-size: 52px;
            }

        }


        @media (max-width: 991px) {

            .pk-header {
                height: 68px;
            }

            .pk-header-inner {
                height: 68px;
            }

            .pk-logo {
                width: 155px;
            }

            .pk-location,
            .pk-header-search,
            .pk-nav {
                display: none;
            }

            .pk-menu-btn {
                display: block;
                margin-left: auto;
            }

            .pk-hero {
                min-height: auto;
            }

            .pk-hero-container {
                min-height: auto;
                display: block;
            }

            .pk-hero-content {
                width: 100%;
                padding: 65px 0 220px;
            }

            .pk-hero-image {
                width: 100%;
                height: 330px;
                right: 0;
                top: auto;
                bottom: 0;
                border-radius: 0;
            }

            .pk-hero-image::after {
                background: linear-gradient(
                    0deg,
                    rgba(255,255,255,.85),
                    transparent 55%
                );
            }

            .pk-search-wrap {
                margin-top: 0;
                padding-top: 25px;
            }

            .pk-search-box {
                grid-template-columns: 1fr 1fr;
            }

            .pk-search-button {
                height: 55px;
            }

            .pk-category-scroll {
                overflow-x: auto;
                justify-content: flex-start;
                padding-bottom: 10px;
            }

            .pk-category-item {
                flex: 0 0 90px;
            }

        }


        @media (max-width: 767px) {

            .pk-hero-title {
                font-size: 42px;
                letter-spacing: -1.8px;
            }

            .pk-hero-description {
                font-size: 15px;
            }

            .pk-stats {
                gap: 18px;
                flex-wrap: wrap;
            }

            .pk-search-box {
                grid-template-columns: 1fr;
                padding: 10px;
            }

            .pk-search-field {
                border-right: 0;
                border-bottom: 1px solid #edf0f4;
            }

            .pk-search-button {
                height: 54px;
            }

            .pk-section {
                padding: 45px 0;
            }

            .pk-listing-image {
                height: 190px;
            }

            .pk-why {
                padding: 35px 25px;
                border-radius: 20px;
            }

            .pk-cta-box {
                padding: 38px 25px;
                display: block;
            }

            .pk-cta h2 {
                font-size: 27px;
            }

            .pk-cta-button {
                display: inline-block;
                margin-top: 25px;
            }

        }


        @media (max-width: 575px) {
		
		.pk-category-bar { position: sticky; top: 156px;}
		body {padding-top: 0px;}

            .pk-hero-content {
                padding-top: 45px;
                padding-bottom: 10px;
            }

            .pk-hero-title {
                font-size: 36px;
            }

            .pk-hero-image {
                height: 280px;
            }

            .pk-stats {
                gap: 12px;
            }

            .pk-stat {
                min-width: 135px;
            }

            .pk-section-heading h2 {
                font-size: 24px;
            }

            .pk-listing-image {
                height: 165px;
            }

            .pk-listing-body {
                padding: 12px;
            }

            .pk-listing-price {
                font-size: 16px;
            }

            .pk-listing-title {
                font-size: 12px;
            }

            .pk-why-title {
                font-size: 25px;
            }

        }


/* =========================================
   PKPL FORGOT PASSWORD
========================================= */

.pk-forgot-page {
    min-height: 100vh;
    background: #fff;
    color: #202124;
}


/* =========================================
   LEFT VISUAL
========================================= */

.pk-forgot-visual {
    position: relative;
    min-height: 100vh;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 15% 15%,
            rgba(211, 42, 108, .24),
            transparent 31%
        ),
        radial-gradient(
            circle at 85% 78%,
            rgba(124, 49, 161, .22),
            transparent 35%
        ),
        linear-gradient(
            145deg,
            #17131a,
            #21151e 50%,
            #151219
        );

    color: #fff;
}


.pk-forgot-visual::before {
    content: "";

    position: absolute;

    width: 650px;
    height: 650px;

    border-radius: 50%;

    border: 1px solid rgba(255,255,255,.06);

    right: -320px;
    top: -190px;
}


.pk-forgot-visual::after {
    content: "";

    position: absolute;

    width: 470px;
    height: 470px;

    border-radius: 50%;

    border: 1px solid rgba(255,255,255,.05);

    left: -240px;
    bottom: -230px;
}


.pk-forgot-visual-inner {
    position: relative;

    z-index: 3;

    max-width: 590px;

    min-height: 100vh;

    margin: auto;

    padding: 42px 48px 35px;

    display: flex;

    flex-direction: column;
}


/* =========================================
   LOGO
========================================= */

.pk-forgot-logo {
    display: inline-flex;

    align-items: center;

    gap: 10px;

    color: inherit;

    text-decoration: none;

    font-size: 21px;

    font-weight: 800;
}


.pk-forgot-logo strong {
    color: #ff5c96;
}


.pk-forgot-logo-icon {
    width: 40px;
    height: 40px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 11px;

    background: #d32a6c;

    color: #fff;

    box-shadow:
        0 8px 25px rgba(211,42,108,.35);
}


/* =========================================
   GLOW
========================================= */

.pk-forgot-glow {
    position: absolute;

    border-radius: 50%;

    filter: blur(70px);

    pointer-events: none;
}


.pk-forgot-glow-one {
    width: 200px;
    height: 200px;

    background: rgba(211,42,108,.17);

    right: 10%;
    top: 27%;
}


.pk-forgot-glow-two {
    width: 150px;
    height: 150px;

    background: rgba(126,49,170,.15);

    left: 7%;
    bottom: 15%;
}


/* =========================================
   HERO
========================================= */

.pk-forgot-hero {
    margin-top: auto;

    margin-bottom: auto;
}


.pk-forgot-badge {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    padding: 8px 13px;

    border-radius: 50px;

    border: 1px solid rgba(255,255,255,.12);

    background: rgba(255,255,255,.04);

    color: #ddd;

    font-size: 10px;

    font-weight: 600;
}


.pk-forgot-badge i {
    color: #ff5c96;
}


.pk-forgot-hero h1 {
    margin: 25px 0 22px;

    font-size: clamp(48px, 5vw, 70px);

    line-height: .96;

    letter-spacing: -3px;

    font-weight: 850;
}


.pk-forgot-hero h1 span {
    color: #ff5c96;
}


.pk-forgot-hero > p {
    max-width: 480px;

    color: #aaa;

    font-size: 14px;

    line-height: 1.8;
}


/* =========================================
   SECURITY POINTS
========================================= */

.pk-forgot-points {
    display: flex;

    flex-direction: column;

    gap: 16px;

    margin-top: 35px;
}


.pk-forgot-point {
    display: flex;

    align-items: center;

    gap: 12px;
}


.pk-forgot-point > span {
    width: 40px;
    height: 40px;

    flex: 0 0 40px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 11px;

    background: rgba(255,255,255,.06);

    color: #ff5c96;
}


.pk-forgot-point strong {
    display: block;

    font-size: 12px;
}


.pk-forgot-point small {
    display: block;

    color: #777;

    font-size: 10px;

    margin-top: 3px;
}


/* =========================================
   QUOTE
========================================= */

.pk-forgot-quote {
    display: flex;

    align-items: center;

    gap: 10px;

    color: #777;

    font-size: 10px;
}


.pk-forgot-quote i {
    color: #ff5c96;
}


/* =========================================
   FORM PANEL
========================================= */

.pk-forgot-form-panel {
    min-height: 100vh;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #fff;
}


.pk-forgot-form-wrap {
    width: 100%;

    max-width: 470px;

    padding: 45px 30px;
}


/* =========================================
   MOBILE LOGO
========================================= */

.pk-forgot-mobile-logo {
    display: none;
}


/* =========================================
   STEP
========================================= */

.pk-forgot-step {
    display: none;

    animation: pkForgotFade .3s ease;
}


.pk-forgot-step-active {
    display: block;
}


@keyframes pkForgotFade {

    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}


/* =========================================
   ICON
========================================= */

.pk-forgot-icon-box {
    width: 56px;
    height: 56px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 16px;

    background: #fff0f6;

    color: #d32a6c;

    font-size: 19px;

    margin-bottom: 22px;
}


.pk-forgot-icon-otp {
    background: #f7f0ff;

    color: #7d35a5;
}


.pk-forgot-icon-success {
    background: #effaf5;

    color: #269a68;
}


/* =========================================
   HEADING
========================================= */

.pk-forgot-heading > span {
    color: #d32a6c;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 1.5px;
}


.pk-forgot-heading h2 {
    margin: 8px 0 7px;

    font-size: 30px;

    line-height: 1.15;

    letter-spacing: -1px;

    font-weight: 800;
}


.pk-forgot-heading p {
    margin: 0;

    color: #888;

    font-size: 13px;

    line-height: 1.7;
}


/* =========================================
   FIELD
========================================= */

.pk-forgot-field {
    margin-top: 25px;
}


.pk-forgot-field label {
    display: block;

    margin-bottom: 7px;

    font-size: 12px;

    font-weight: 700;
}


/* =========================================
   INPUT
========================================= */

.pk-forgot-input {
    height: 48px;

    width: 100%;

    display: flex;

    align-items: center;

    padding: 0 13px;

    border: 1px solid #dddfe3;

    border-radius: 10px;

    background: #fff;

    transition: .2s;
}


.pk-forgot-input:focus-within {
    border-color: #d32a6c;

    box-shadow:
        0 0 0 3px rgba(211,42,108,.08);
}


.pk-forgot-input > i {
    width: 24px;

    color: #999;

    font-size: 13px;
}


.pk-forgot-input input {
    flex: 1;

    min-width: 0;

    width: 100%;

    height: 100%;

    border: 0;

    outline: 0;

    font-size: 13px;
}


.pk-forgot-input input::placeholder {
    color: #aaa;
}


/* COUNTRY */

.pk-forgot-country {
    font-size: 12px;

    font-weight: 650;

    color: #555;
}


.pk-forgot-country-line {
    width: 1px;

    height: 20px;

    background: #ddd;

    margin: 0 10px;
}


/* =========================================
   ERROR
========================================= */

.pk-forgot-error {
    display: block;

    color: #d32a6c;

    font-size: 9px;

    margin-top: 6px;
}


/* =========================================
   SUBMIT
========================================= */

.pk-forgot-submit {
    width: 100%;

    min-height: 49px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

    margin-top: 23px;

    border: 0;

    border-radius: 10px;

    background:
        linear-gradient(
            135deg,
            #d32a6c,
            #bd205f
        );

    color: #fff;

    font-size: 13px;

    font-weight: 700;

    cursor: pointer;

    box-shadow:
        0 10px 25px rgba(211,42,108,.20);

    transition: .25s;
}


.pk-forgot-submit:hover {
    transform: translateY(-2px);

    box-shadow:
        0 14px 30px rgba(211,42,108,.28);
}


.pk-forgot-submit i {
    transition: .2s;
}


.pk-forgot-submit:hover i {
    transform: translateX(4px);
}


/* =========================================
   BACK LOGIN
========================================= */

.pk-forgot-back-login {
    display: flex;

    align-items: center;

    justify-content: center;

    gap: 7px;

    margin-top: 22px;

    color: #777;

    font-size: 11px;

    text-decoration: none;
}


.pk-forgot-back-login:hover {
    color: #d32a6c;
}


/* =========================================
   OTP MOBILE
========================================= */

.pk-forgot-otp-number {
    margin-top: 20px;

    padding: 11px 13px;

    border-radius: 8px;

    background: #fafafa;

    color: #777;

    font-size: 11px;
}


.pk-forgot-otp-number strong {
    color: #333;
}


.pk-forgot-otp-number button {
    float: right;

    border: 0;

    background: transparent;

    color: #d32a6c;

    font-size: 10px;

    font-weight: 700;

    cursor: pointer;
}


/* =========================================
   OTP BOX
========================================= */

.pk-forgot-otp-box {
    display: grid;

    grid-template-columns:
        repeat(6, 1fr);

    gap: 8px;

    margin-top: 20px;
}


.pk-forgot-otp-box input {
    width: 100%;

    height: 52px;

    text-align: center;

    font-size: 19px;

    font-weight: 700;

    border: 1px solid #dddfe3;

    border-radius: 9px;

    outline: 0;
}


.pk-forgot-otp-box input:focus {
    border-color: #d32a6c;

    box-shadow:
        0 0 0 3px rgba(211,42,108,.08);
}


/* =========================================
   RESEND
========================================= */

.pk-forgot-resend {
    text-align: center;

    margin-top: 20px;

    color: #999;

    font-size: 10px;
}


.pk-forgot-resend button {
    border: 0;

    background: transparent;

    color: #d32a6c;

    font-weight: 700;

    cursor: pointer;

    font-size: 10px;

    padding: 0 3px;
}


.pk-forgot-resend span {
    color: #777;

    margin-left: 3px;
}


/* =========================================
   PASSWORD EYE
========================================= */

.pk-forgot-eye {
    border: 0;

    background: transparent;

    color: #999;

    padding: 5px;

    cursor: pointer;
}


/* =========================================
   PASSWORD RULES
========================================= */

.pk-forgot-rules {
    display: flex;

    flex-wrap: wrap;

    gap: 8px 14px;

    margin-top: 9px;
}


.pk-forgot-rules span {
    color: #999;

    font-size: 9px;
}


.pk-forgot-rules span.valid {
    color: #269a68;
}


/* =========================================
   SUCCESS
========================================= */

.pk-forgot-success-icon {
    width: 72px;
    height: 72px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #effaf5;

    color: #269a68;

    font-size: 27px;

    margin-bottom: 25px;

    box-shadow:
        0 0 0 10px #f7fcf9;
}


.pk-forgot-success-heading h2 {
    font-size: 32px;
}


.pk-forgot-security {
    text-align: center;

    margin-top: 20px;

    color: #999;

    font-size: 9px;

    line-height: 1.6;
}


.pk-forgot-security i {
    color: #269a68;

    margin-right: 4px;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 991.98px) {

    .pk-forgot-visual {
        display: none;
    }


    .pk-forgot-form-panel {
        min-height: 100vh;

        align-items: flex-start;
    }


    .pk-forgot-form-wrap {
        max-width: 550px;

        margin: auto;

        padding: 25px 22px 40px;
    }


    .pk-forgot-mobile-logo {
        display: block;

        margin-bottom: 38px;
    }


    .pk-forgot-mobile-logo .pk-forgot-logo {
        color: #202124;
    }

}


@media (max-width: 575.98px) {

    .pk-forgot-form-wrap {
        padding: 20px 16px 35px;
    }


    .pk-forgot-mobile-logo {
        margin-bottom: 30px;
    }


    .pk-forgot-heading h2 {
        font-size: 26px;
    }


    .pk-forgot-otp-box {
        gap: 5px;
    }


    .pk-forgot-otp-box input {
        height: 48px;

        font-size: 17px;
    }

}


/* =========================================================
   PKPL PROFILE PAGE
========================================================= */

.pk-profile-page {
    background: #f7f8fa;
    color: #20242d;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.pk-profile-breadcrumb {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 52px;
    font-size: 11px;
    color: #9299a5;
}

.pk-profile-breadcrumb a {
    color: #69717d;
    text-decoration: none;
}

.pk-profile-breadcrumb a:hover {
    color: #ff2775;
}

.pk-profile-breadcrumb i {
    font-size: 8px;
    color: #b3bac4;
}


/* =========================================================
   HERO
========================================================= */

.pk-profile-hero {
    padding: 10px 0 30px;
}


/* =========================================================
   GALLERY
========================================================= */

.pk-profile-gallery {
    background: #fff;
    padding: 8px;
    border: 1px solid #e8ebef;
    border-radius: 16px;
}

.pk-profile-main-image {
    position: relative;
    height: 455px;
    overflow: hidden;
    border-radius: 11px;
    background: #eef0f3;
}

.pk-profile-main-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}


.pk-profile-status {
    position: absolute;
    top: 15px;
    left: 15px;

    display: inline-flex;
    align-items: center;
    gap: 7px;

    padding: 7px 11px;

    background: rgba(255,255,255,.94);
    border-radius: 20px;

    color: #168447;

    font-size: 10px;
    font-weight: 700;

    box-shadow: 0 4px 15px rgba(0,0,0,.08);
}

.pk-profile-status span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #18a65b;
}


.pk-profile-verified {
    position: absolute;
    left: 15px;
    bottom: 15px;

    display: flex;
    align-items: center;
    gap: 5px;

    padding: 6px 10px;

    background: #151b29;
    color: #fff;

    border-radius: 6px;

    font-size: 9px;
    font-weight: 600;
}

.pk-profile-verified i {
    color: #ff2775;
}


.pk-profile-share {
    position: absolute;
    top: 15px;
    right: 15px;

    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 0;
    border-radius: 50%;

    background: rgba(255,255,255,.94);
    color: #333;

    cursor: pointer;
}

.pk-profile-share:hover {
    color: #ff2775;
}


.pk-profile-image-count {
    position: absolute;
    right: 15px;
    bottom: 15px;

    padding: 7px 10px;

    background: rgba(21,27,41,.82);
    color: #fff;

    border-radius: 6px;

    font-size: 9px;
}


.pk-profile-thumbnails {
    display: flex;
    gap: 8px;
    padding: 9px 0 0;
}


.pk-profile-thumb {
    position: relative;

    width: 74px;
    height: 60px;

    padding: 0;

    border: 2px solid transparent;
    border-radius: 7px;

    overflow: hidden;

    background: #eee;

    cursor: pointer;
}


.pk-profile-thumb.active {
    border-color: #ff2775;
}


.pk-profile-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


.pk-more-thumb span {
    position: absolute;
    inset: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    background: rgba(21,27,41,.62);
    color: #fff;

    font-size: 12px;
    font-weight: 700;
}


/* =========================================================
   PROFILE INFO
========================================================= */

.pk-profile-info {
    height: 100%;

    padding: 24px;

    background: #fff;

    border: 1px solid #e8ebef;
    border-radius: 16px;
}


.pk-profile-category {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    color: #ff2775;

    font-size: 11px;
    font-weight: 700;

    margin-bottom: 8px;
}


.pk-profile-title {
    margin: 0;

    color: #171b25;

    font-size: 30px;
    line-height: 1.2;

    font-weight: 750;
}


.pk-profile-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;

    margin-top: 12px;

    color: #7b838f;

    font-size: 11px;
}

.pk-profile-meta span {
    display: flex;
    align-items: center;
    gap: 5px;
}

.pk-profile-meta i {
    color: #ff2775;
}


.pk-profile-rating {
    display: flex;
    align-items: center;
    gap: 7px;

    margin-top: 17px;
}

.pk-rating-number {
    font-size: 14px;
    font-weight: 700;
}

.pk-rating-stars {
    color: #ffb21c;
    font-size: 12px;
}

.pk-profile-rating a {
    color: #717985;
    text-decoration: underline;
    font-size: 10px;
}


/* PRICE */

.pk-profile-price-box {
    display: flex;
    align-items: baseline;
    gap: 4px;

    margin-top: 22px;
    padding-bottom: 18px;

    border-bottom: 1px solid #edf0f3;
}

.pk-profile-price-box span {
    color: #8a929d;
    font-size: 10px;
}

.pk-profile-price-box strong {
    color: #171b25;
    font-size: 27px;
    font-weight: 800;
}

.pk-profile-price-box small {
    color: #777f8b;
    font-size: 10px;
}


/* QUICK INFO */

.pk-profile-quick-info {
    display: grid;
    grid-template-columns: 1fr 1fr;

    gap: 10px;

    padding: 17px 0;
}

.pk-profile-quick-info > div {
    display: flex;
    align-items: center;
    gap: 9px;

    padding: 10px;

    background: #fafbfc;

    border-radius: 9px;
}

.pk-profile-quick-info > div > i {
    color: #ff2775;
    font-size: 16px;
}

.pk-profile-quick-info span {
    display: flex;
    flex-direction: column;
}

.pk-profile-quick-info strong {
    font-size: 10px;
}

.pk-profile-quick-info small {
    margin-top: 2px;
    color: #9199a5;
    font-size: 8px;
}


/* ACTIONS */

.pk-profile-actions {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 8px;
}

.pk-profile-actions a,
.pk-profile-actions button {
    height: 43px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    border-radius: 8px;

    font-size: 11px;
    font-weight: 700;

    text-decoration: none;

    cursor: pointer;
}


.pk-profile-call {
    background: #151b29;
    color: #fff;
    border: 1px solid #151b29;
}

.pk-profile-call:hover {
    color: #fff;
}


.pk-profile-chat {
    background: #fff;
    color: #ff2775;
    border: 1px solid #ff2775;
}


.pk-profile-save {
    background: #fff;
    color: #555e6b;
    border: 1px solid #dfe3e8;
}


.pk-profile-save.saved {
    color: #ff2775;
    border-color: #ff2775;
}


/* BOOK */

.pk-profile-book-btn {
    width: 100%;
    height: 51px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;

    margin-top: 13px;

    border: 0;
    border-radius: 9px;

    background: linear-gradient(
        135deg,
        #ff2775,
        #ed165f
    );

    color: #fff;

    font-size: 12px;
    font-weight: 800;

    box-shadow: 0 9px 20px rgba(255,39,117,.20);

    cursor: pointer;
}

.pk-profile-book-btn i:last-child {
    margin-left: auto;
    margin-right: 14px;
}


/* SAFETY */

.pk-profile-safety {
    display: flex;
    gap: 8px;

    margin-top: 14px;

    color: #8a929d;

    font-size: 9px;
    line-height: 1.5;
}

.pk-profile-safety i {
    color: #19a55b;
    font-size: 13px;
}


/* =========================================================
   CONTENT
========================================================= */

.pk-profile-content {
    padding: 15px 0 50px;
}


.pk-profile-card {
    margin-bottom: 18px;
    padding: 24px;

    background: #fff;

    border: 1px solid #e7eaee;
    border-radius: 14px;
}


.pk-profile-section-title {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    margin-bottom: 20px;
}


.pk-profile-section-title span {
    display: block;

    margin-bottom: 4px;

    color: #ff2775;

    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
}


.pk-profile-section-title h2 {
    margin: 0;

    color: #191e28;

    font-size: 21px;
    font-weight: 750;
}


.pk-profile-section-title > a {
    color: #ff2775;
    text-decoration: none;

    font-size: 10px;
    font-weight: 700;
}


/* DESCRIPTION */

.pk-profile-description {
    margin: 0 0 12px;

    color: #69727e;

    font-size: 12px;
    line-height: 1.8;
}

.pk-profile-description:last-child {
    margin-bottom: 0;
}


/* SERVICES */

.pk-profile-services {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.pk-profile-services span {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    padding: 9px 12px;

    border: 1px solid #e6e9ed;
    border-radius: 7px;

    color: #555e6b;

    font-size: 10px;
    font-weight: 600;
}

.pk-profile-services i {
    color: #ff2775;
}


/* GALLERY GRID */

.pk-profile-gallery-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 9px;
}

.pk-gallery-item {
    height: 130px;

    overflow: hidden;

    border-radius: 8px;
}

.pk-gallery-item img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition: .35s;
}

.pk-gallery-item:hover img {
    transform: scale(1.06);
}


/* HOURS */

.pk-profile-hours > div {
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 12px 0;

    border-bottom: 1px solid #edf0f3;

    font-size: 11px;
}

.pk-profile-hours > div:last-child {
    border-bottom: 0;
}

.pk-profile-hours span {
    color: #777f8b;
}

.pk-profile-hours strong {
    color: #252a34;
}


/* LOCATION */

.pk-profile-location {
    display: flex;
    align-items: center;
    gap: 12px;

    margin-bottom: 15px;
}

.pk-location-icon {
    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #ffe8f0;
    color: #ff2775;
}

.pk-profile-location div:last-child {
    display: flex;
    flex-direction: column;
}

.pk-profile-location strong {
    font-size: 12px;
}

.pk-profile-location span {
    margin-top: 3px;
    color: #8a929d;
    font-size: 10px;
}


.pk-map-placeholder {
    min-height: 180px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 8px;

    border-radius: 10px;

    background:
        linear-gradient(
            45deg,
            #f1f3f5 25%,
            #fafbfc 25%,
            #fafbfc 50%,
            #f1f3f5 50%,
            #f1f3f5 75%,
            #fafbfc 75%
        );

    background-size: 25px 25px;

    color: #9098a4;

    font-size: 10px;
}

.pk-map-placeholder i {
    color: #ff2775;
    font-size: 25px;
}

.pk-map-placeholder a {
    color: #ff2775;
    font-weight: 700;
    text-decoration: none;
}


/* =========================================================
   REVIEWS
========================================================= */

.pk-review-summary {
    display: flex;
    gap: 40px;

    padding-bottom: 20px;

    border-bottom: 1px solid #edf0f3;
}

.pk-review-score {
    display: flex;
    gap: 12px;
    align-items: center;
}

.pk-review-score > strong {
    font-size: 38px;
}

.pk-review-score > div {
    display: flex;
    flex-direction: column;
}

.pk-review-stars {
    color: #ffb21c;
    font-size: 13px;
}

.pk-review-score small {
    margin-top: 3px;
    color: #8b939e;
    font-size: 9px;
}


.pk-review-bars {
    width: 200px;
}

.pk-review-bars > div {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 3px 0;
}

.pk-review-bars > div > span {
    width: 8px;
    font-size: 8px;
}

.pk-review-bars > div > div {
    flex: 1;
    height: 5px;
    overflow: hidden;
    border-radius: 5px;
    background: #eceff2;
}

.pk-review-bars b {
    display: block;
    height: 100%;
    background: #ffb21c;
}


.pk-single-review {
    display: flex;
    gap: 12px;

    padding: 18px 0;

    border-bottom: 1px solid #edf0f3;
}

.pk-review-avatar {
    width: 36px;
    height: 36px;

    flex: 0 0 36px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #151b29;
    color: #fff;

    font-size: 11px;
    font-weight: 700;
}

.pk-review-top {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pk-review-top strong {
    font-size: 11px;
}

.pk-review-top span {
    color: #ffad13;
    font-size: 9px;
}

.pk-single-review small {
    color: #a0a7b1;
    font-size: 8px;
}

.pk-single-review p {
    margin: 7px 0 0;
    color: #6f7884;
    font-size: 10px;
    line-height: 1.6;
}


/* =========================================================
   SIDEBAR
========================================================= */

.pk-profile-side-card {
    margin-bottom: 15px;
    padding: 20px;

    background: #fff;

    border: 1px solid #e7eaee;
    border-radius: 14px;
}


.pk-side-label {
    color: #ff2775;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
}

.pk-profile-side-card h3 {
    margin: 7px 0;

    font-size: 17px;
    font-weight: 750;
}

.pk-profile-side-card > p {
    margin: 0 0 15px;

    color: #858d98;

    font-size: 10px;
    line-height: 1.6;
}


.pk-side-book {
    width: 100%;
    height: 43px;

    border: 0;
    border-radius: 8px;

    background: #ff2775;
    color: #fff;

    font-size: 10px;
    font-weight: 800;
}


.pk-side-call {
    height: 40px;

    margin-top: 8px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;

    border: 1px solid #dfe3e8;
    border-radius: 8px;

    color: #303640;
    text-decoration: none;

    font-size: 10px;
    font-weight: 700;
}


.pk-side-info > div {
    display: flex;
    gap: 10px;

    padding: 11px 0;

    border-bottom: 1px solid #edf0f3;
}

.pk-side-info > div:last-child {
    border-bottom: 0;
}

.pk-side-info > div > i {
    width: 22px;
    color: #ff2775;
}

.pk-side-info span {
    display: flex;
    flex-direction: column;

    font-size: 10px;
    font-weight: 600;
}

.pk-side-info small {
    margin-bottom: 2px;

    color: #979fa9;

    font-size: 8px;
    font-weight: 400;
}


/* SAFETY */

.pk-safety-card {
    display: flex;
    gap: 11px;

    padding: 16px;

    border-radius: 12px;

    background: #eefaf4;
}

.pk-safety-card > i {
    color: #18a45b;
    font-size: 20px;
}

.pk-safety-card strong {
    font-size: 11px;
}

.pk-safety-card p {
    margin: 4px 0 0;

    color: #718077;

    font-size: 9px;
    line-height: 1.5;
}


/* =========================================================
   SIMILAR
========================================================= */

.pk-similar-section {
    padding: 15px 0 60px;

    background: #fff;
}


.pk-similar-card {
    display: block;

    overflow: hidden;

    background: #fff;

    border: 1px solid #e6e9ed;
    border-radius: 12px;

    color: inherit;
    text-decoration: none;

    transition: .25s;
}

.pk-similar-card:hover {
    color: inherit;
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(20,25,35,.08);
}


.pk-similar-image {
    position: relative;
    height: 170px;

    overflow: hidden;

    background: #eee;
}

.pk-similar-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: .35s;
}

.pk-similar-card:hover .pk-similar-image img {
    transform: scale(1.04);
}


.pk-similar-image > span {
    position: absolute;
    top: 9px;
    left: 9px;

    padding: 5px 7px;

    border-radius: 5px;

    background: #fff;
    color: #18874c;

    font-size: 8px;
    font-weight: 700;
}


.pk-similar-image button {
    position: absolute;
    top: 8px;
    right: 8px;

    width: 30px;
    height: 30px;

    border: 0;
    border-radius: 50%;

    background: rgba(255,255,255,.95);

    color: #555e69;
}


.pk-similar-content {
    padding: 12px;
}

.pk-similar-content h3 {
    margin: 0 0 5px;

    color: #20252f;

    font-size: 12px;
    font-weight: 750;
}

.pk-similar-content > span {
    display: block;

    color: #858d98;

    font-size: 9px;
}

.pk-similar-content > span i {
    color: #ff2775;
}

.pk-similar-content > div {
    display: flex;
    align-items: baseline;

    margin-top: 10px;
}

.pk-similar-content strong {
    font-size: 12px;
}

.pk-similar-content small {
    color: #9299a4;
    font-size: 8px;
}

.pk-similar-content b {
    margin-left: auto;

    color: #e8a000;

    font-size: 9px;
}


/* =========================================================
   MOBILE STICKY BOOKING
========================================================= */

.pk-profile-mobile-booking {
    display: none;
}


/* =========================================================
   MOBILE PROFILE
========================================================= */

@media (max-width: 767px) {

    .pk-profile-page {
        padding-bottom: 72px;
    }


    .pk-profile-breadcrumb {
        min-height: 42px;

        padding: 0 4px;

        overflow: hidden;
        white-space: nowrap;

        font-size: 9px;
    }


    .pk-profile-hero {
        padding-top: 0;
    }


    /* IMAGE */

    .pk-profile-gallery {
        padding: 5px;
        border-radius: 11px;
    }

    .pk-profile-main-image {
        height: 285px;
        border-radius: 8px;
    }


    .pk-profile-thumbnails {
        overflow-x: auto;
        scrollbar-width: none;
    }

    .pk-profile-thumbnails::-webkit-scrollbar {
        display: none;
    }

    .pk-profile-thumb {
        flex: 0 0 61px;
        height: 51px;
    }


    /* INFO */

    .pk-profile-info {
        padding: 18px;
        border-radius: 12px;
    }


    .pk-profile-title {
        font-size: 23px;
    }


    .pk-profile-meta {
        font-size: 10px;
    }


    .pk-profile-price-box {
        margin-top: 17px;
    }

    .pk-profile-price-box strong {
        font-size: 24px;
    }


    .pk-profile-quick-info {
        gap: 7px;
    }


    .pk-profile-quick-info > div {
        padding: 8px;
    }


    /* CONTENT */

    .pk-profile-content {
        padding-top: 0;
    }


    .pk-profile-card {
        margin-bottom: 10px;
        padding: 18px;

        border-radius: 11px;
    }


    .pk-profile-section-title h2 {
        font-size: 18px;
    }


    .pk-profile-description {
        font-size: 11px;
        line-height: 1.7;
    }


    /* SERVICES */

    .pk-profile-services {
        gap: 6px;
    }

    .pk-profile-services span {
        padding: 8px 9px;
        font-size: 9px;
    }


    /* GALLERY */

    .pk-profile-gallery-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 6px;
    }

    .pk-gallery-item {
        height: 125px;
    }


    /* REVIEWS */

    .pk-review-summary {
        display: block;
    }

    .pk-review-bars {
        width: 100%;
        margin-top: 15px;
    }


    /* SIMILAR */

    .pk-similar-section {
        padding-bottom: 25px;
    }


    .pk-similar-image {
        height: 135px;
    }


    .pk-similar-content {
        padding: 9px;
    }


    .pk-similar-content h3 {
        font-size: 10px;
    }


    .pk-similar-content > span {
        font-size: 8px;
    }


    /* HIDE SIDEBAR */

    .pk-profile-sidebar {
        display: none;
    }


    /* MOBILE BOOKING BAR */

    .pk-profile-mobile-booking {
        position: fixed;

        left: 0;
        right: 0;
        bottom: 0;

        height: 64px;

        display: flex;
        align-items: center;
        gap: 7px;

        padding: 8px 10px;

        background: rgba(255,255,255,.97);

        border-top: 1px solid #e6e9ed;

        box-shadow:
            0 -5px 25px rgba(20,25,35,.12);

        z-index: 9998;

        backdrop-filter: blur(12px);
    }


    .pk-profile-mobile-booking a,
    .pk-profile-mobile-booking button {

        height: 45px;

        display: flex;
        align-items: center;
        justify-content: center;

        gap: 6px;

        border-radius: 8px;

        font-size: 10px;
        font-weight: 750;

        text-decoration: none;
    }


    .pk-mobile-chat {
        width: 28%;

        background: #fff;

        border: 1px solid #ff2775;

        color: #ff2775;
    }


    .pk-mobile-call {
        width: 24%;

        background: #151b29;

        border: 1px solid #151b29;

        color: #fff;
    }


    .pk-mobile-book {
        flex: 1;

        border: 0;

        background: linear-gradient(
            135deg,
            #ff2775,
            #ed165f
        );

        color: #fff;

        cursor: pointer;
    }

}


/* =========================================================
   BOOKING MODAL
========================================================= */

.pk-booking-modal {
    overflow: hidden;
    border: 0;
    border-radius: 15px;
}


.pk-booking-modal .modal-header {
    padding: 20px;
    border-bottom: 1px solid #edf0f3;
}


.pk-booking-modal .modal-header span {
    display: block;

    margin-bottom: 4px;

    color: #ff2775;

    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
}


.pk-booking-modal .modal-title {
    margin: 0;

    font-size: 20px;
    font-weight: 750;
}


.pk-booking-modal .modal-body {
    padding: 20px;
}


.pk-booking-profile {
    display: flex;
    align-items: center;
    gap: 11px;

    margin-bottom: 18px;

    padding: 10px;

    background: #f8f9fa;

    border-radius: 9px;
}


.pk-booking-profile img {
    width: 45px;
    height: 45px;

    border-radius: 7px;

    object-fit: cover;
}


.pk-booking-profile div {
    display: flex;
    flex-direction: column;
}


.pk-booking-profile strong {
    font-size: 12px;
}


.pk-booking-profile span {
    margin-top: 3px;

    color: #858d98;

    font-size: 9px;
}


.pk-booking-modal label {
    display: block;

    margin-bottom: 5px;

    color: #414852;

    font-size: 10px;
    font-weight: 650;
}


.pk-booking-modal .form-control,
.pk-booking-modal .form-select {
    min-height: 42px;

    border-color: #e1e5e9;

    border-radius: 7px;

    font-size: 11px;

    box-shadow: none;
}


.pk-booking-modal .form-control:focus,
.pk-booking-modal .form-select:focus {
    border-color: #ff2775;

    box-shadow:
        0 0 0 3px rgba(255,39,117,.08);
}


.pk-booking-modal .modal-footer {
    padding: 15px 20px;

    border-top: 1px solid #edf0f3;
}


.pk-send-booking {
    min-height: 40px;

    padding: 0 16px;

    border: 0;

    border-radius: 7px;

    background: #ff2775;

    color: #fff;

    font-size: 10px;
    font-weight: 700;
}



/* =========================================
   PKPL POST AD PAGE
========================================= */

.pk-ad-page {
    background: #f6f7f9;
    min-height: 100vh;
    color: #202124;
}


/* TOP BAR */

.pk-ad-topbar {
    background: #fff;
    border-bottom: 1px solid #e8e9ec;
    padding: 15px 0;
    position: sticky;
    top: 0;
    z-index: 100;
}

.pk-ad-back,
.pk-ad-help {
    color: #555;
    text-decoration: none;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.pk-ad-back:hover,
.pk-ad-help:hover {
    color: #d32a6c;
}

.pk-ad-page-title {
    font-size: 18px;
    font-weight: 700;
}

.pk-ad-page-title i {
    color: #d32a6c;
    margin-right: 7px;
}


/* HEADING */

.pk-ad-heading {
    margin-bottom: 28px;
}

.pk-ad-heading h1 {
    font-size: 30px;
    font-weight: 750;
    margin: 0 0 6px;
}

.pk-ad-heading p {
    margin: 0;
    color: #777;
}


/* PROGRESS */

.pk-ad-progress-wrap {
    position: relative;
    margin-bottom: 35px;
}

.pk-ad-progress-line {
    height: 3px;
    background: #e6e7ea;
    position: absolute;
    top: 24px;
    left: 8%;
    right: 8%;
    z-index: 0;
}

.pk-ad-progress-line span {
    display: block;
    height: 100%;
    width: 0;
    background: #d32a6c;
    transition: .3s ease;
}

.pk-ad-steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    position: relative;
    z-index: 1;
}

.pk-ad-step {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    color: #999;
}

.pk-ad-step-icon {
    width: 48px;
    height: 48px;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    transition: .3s;
}

.pk-ad-step strong,
.pk-ad-step small {
    display: block;
}

.pk-ad-step strong {
    font-size: 13px;
}

.pk-ad-step small {
    font-size: 11px;
    margin-top: 2px;
}

.pk-ad-step.active {
    color: #d32a6c;
}

.pk-ad-step.active .pk-ad-step-icon {
    color: #fff;
    background: #d32a6c;
    border-color: #d32a6c;
    box-shadow: 0 5px 18px rgba(211, 42, 108, .2);
}


/* FORM CARD */

.pk-ad-form-card {
    background: #fff;
    border: 1px solid #e7e8eb;
    border-radius: 16px;
    padding: 28px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, .035);
}

.pk-ad-form-step {
    display: none;
}

.pk-ad-form-step.active {
    display: block;
}


/* SECTION TITLE */

.pk-ad-section-title {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 28px;
}

.pk-ad-section-icon {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    background: #fff0f5;
    color: #d32a6c;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pk-ad-section-title h2 {
    font-size: 20px;
    margin: 0 0 4px;
    font-weight: 700;
}

.pk-ad-section-title p {
    margin: 0;
    color: #888;
    font-size: 13px;
}


/* LABEL */

.pk-ad-label {
    display: block;
    font-size: 13px;
    font-weight: 650;
    margin-bottom: 8px;
}

.pk-ad-label span {
    color: #d32a6c;
}


/* INPUT */

.pk-ad-input,
.pk-ad-textarea,
.pk-ad-select select {
    width: 100%;
    border: 1px solid #dddfe3;
    background: #fff;
    border-radius: 9px;
    padding: 12px 14px;
    font-size: 14px;
    outline: none;
    transition: .2s;
}

.pk-ad-input:focus,
.pk-ad-textarea:focus,
.pk-ad-select select:focus {
    border-color: #d32a6c;
    box-shadow: 0 0 0 3px rgba(211, 42, 108, .08);
}

.pk-ad-textarea {
    resize: vertical;
}

.pk-ad-select {
    position: relative;
}

.pk-ad-select select {
    appearance: none;
    padding-right: 40px;
}

.pk-ad-select i {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    font-size: 11px;
    color: #777;
}

.pk-ad-hint {
    color: #999;
    font-size: 11px;
    margin-top: 5px;
}


/* LISTING TYPE */

.pk-ad-type-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.pk-ad-type-option {
    cursor: pointer;
}

.pk-ad-type-option input {
    display: none;
}

.pk-ad-type-option span {
    display: block;
    border: 1px solid #e0e1e4;
    border-radius: 10px;
    padding: 18px 12px;
    text-align: center;
    transition: .2s;
}

.pk-ad-type-option i {
    display: block;
    font-size: 20px;
    color: #777;
    margin-bottom: 8px;
}

.pk-ad-type-option strong,
.pk-ad-type-option small {
    display: block;
}

.pk-ad-type-option strong {
    font-size: 13px;
}

.pk-ad-type-option small {
    font-size: 11px;
    color: #999;
    margin-top: 3px;
}

.pk-ad-type-option input:checked + span {
    border-color: #d32a6c;
    background: #fff7fa;
}

.pk-ad-type-option input:checked + span i {
    color: #d32a6c;
}


/* PRICE */

.pk-ad-price-input {
    display: flex;
    border: 1px solid #dddfe3;
    border-radius: 9px;
    overflow: hidden;
}

.pk-ad-price-input span {
    padding: 12px 14px;
    background: #f7f7f8;
    border-right: 1px solid #dddfe3;
}

.pk-ad-price-input input {
    border: 0;
    outline: none;
    width: 100%;
    padding: 12px;
}


/* CHAR COUNT */

.pk-ad-char-count {
    text-align: right;
    font-size: 11px;
    color: #999;
    margin-top: 5px;
}


/* FEATURES */

.pk-ad-features-box {
    margin-top: 24px;
    padding: 18px;
    background: #fafafa;
    border: 1px solid #eee;
    border-radius: 10px;
}

.pk-ad-feature-heading {
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 13px;
}

.pk-ad-feature-heading i {
    color: #d32a6c;
    margin-right: 6px;
}


/* UPLOAD */

.pk-ad-upload-box {
    position: relative;
    border: 2px dashed #d9dadd;
    border-radius: 14px;
    text-align: center;
    padding: 42px 20px;
    background: #fcfcfd;
    transition: .2s;
}

.pk-ad-upload-box:hover {
    border-color: #d32a6c;
    background: #fff9fb;
}

.pk-ad-upload-box input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.pk-ad-upload-icon {
    width: 60px;
    height: 60px;
    margin: auto;
    background: #fff0f5;
    color: #d32a6c;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 23px;
}

.pk-ad-upload-box h3 {
    font-size: 16px;
    margin: 15px 0 5px;
}

.pk-ad-upload-box p {
    margin: 0;
    color: #888;
    font-size: 13px;
}

.pk-ad-upload-box p strong {
    color: #d32a6c;
}

.pk-ad-upload-box small {
    display: block;
    color: #aaa;
    font-size: 11px;
    margin-top: 8px;
}


/* IMAGE PREVIEW */

.pk-ad-image-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 10px;
    margin-top: 18px;
}

.pk-ad-image-item {
    position: relative;
    height: 105px;
    border-radius: 9px;
    overflow: hidden;
    border: 1px solid #ddd;
}

.pk-ad-image-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pk-ad-image-remove {
    position: absolute;
    right: 5px;
    top: 5px;
    width: 25px;
    height: 25px;
    border: 0;
    border-radius: 50%;
    background: rgba(0,0,0,.65);
    color: #fff;
    font-size: 11px;
}

.pk-ad-photo-tip {
    margin-top: 18px;
    display: flex;
    gap: 10px;
    padding: 13px;
    border-radius: 9px;
    background: #fffaf0;
}

.pk-ad-photo-tip > i {
    color: #e5a000;
}

.pk-ad-photo-tip p {
    margin: 3px 0 0;
    color: #777;
    font-size: 12px;
}


/* CONTACT DIVIDER */

.pk-ad-contact-divider {
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
    margin-top: 10px;
    font-weight: 700;
    font-size: 14px;
}


/* WHATSAPP */

.pk-ad-whatsapp {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 13px;
}

.pk-ad-whatsapp i {
    color: #25d366;
    font-size: 18px;
}


/* PRIVACY */

.pk-ad-publish-box {
    display: flex;
    gap: 12px;
    margin-top: 24px;
    background: #f7fbff;
    padding: 15px;
    border-radius: 10px;
}

.pk-ad-publish-icon {
    color: #2384d8;
    font-size: 20px;
}

.pk-ad-publish-box p {
    margin: 3px 0 0;
    font-size: 12px;
    color: #777;
}


/* BUTTONS */

.pk-ad-form-actions {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-top: 30px;
    padding-top: 22px;
    border-top: 1px solid #eee;
}

.pk-ad-btn {
    border: 0;
    border-radius: 9px;
    padding: 12px 20px;
    font-size: 13px;
    font-weight: 650;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.pk-ad-btn-primary {
    background: #d32a6c;
    color: #fff;
}

.pk-ad-btn-primary:hover {
    background: #b9215b;
}

.pk-ad-btn-light {
    background: #f2f3f5;
    color: #555;
}

.pk-ad-publish-btn {
    min-width: 150px;
    justify-content: center;
}


/* PREVIEW */

.pk-ad-preview-sticky {
    position: sticky;
    top: 90px;
}

.pk-ad-preview-card {
    background: #fff;
    border: 1px solid #e7e8eb;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 5px 25px rgba(0,0,0,.04);
}

.pk-ad-preview-header {
    padding: 14px 16px;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #eee;
    font-size: 13px;
    font-weight: 700;
}

.pk-ad-preview-header i {
    color: #d32a6c;
    margin-right: 5px;
}

.pk-ad-preview-header small {
    color: #25a36f;
    font-size: 10px;
}


.pk-ad-preview-image {
    height: 210px;
    position: relative;
    background: #f0f1f3;
}

.pk-ad-preview-placeholder {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: #aaa;
    gap: 6px;
}

.pk-ad-preview-placeholder i {
    font-size: 38px;
}

.pk-ad-preview-placeholder span {
    font-size: 12px;
}

.pk-ad-preview-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    background: #d32a6c;
    color: #fff;
    padding: 5px 8px;
    border-radius: 5px;
    font-size: 9px;
    font-weight: 700;
}


.pk-ad-preview-content {
    padding: 17px;
}

.pk-ad-preview-category {
    color: #d32a6c;
    font-size: 11px;
    font-weight: 650;
    margin-bottom: 5px;
}

.pk-ad-preview-content h3 {
    font-size: 17px;
    margin: 0 0 7px;
    font-weight: 700;
}

.pk-ad-preview-price {
    font-size: 18px;
    font-weight: 750;
}

.pk-ad-preview-location {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #777;
    font-size: 12px;
    margin-top: 8px;
}

.pk-ad-preview-location i {
    color: #d32a6c;
}

.pk-ad-preview-divider {
    height: 1px;
    background: #eee;
    margin: 15px 0;
}

.pk-ad-preview-user {
    display: flex;
    align-items: center;
    gap: 9px;
}

.pk-ad-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #f2f3f5;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #999;
}

.pk-ad-preview-user strong,
.pk-ad-preview-user small {
    display: block;
}

.pk-ad-preview-user strong {
    font-size: 12px;
}

.pk-ad-preview-user small {
    font-size: 10px;
    color: #999;
}

.pk-ad-preview-user > i {
    margin-left: auto;
    color: #bbb;
    font-size: 11px;
}

.pk-ad-preview-btn {
    width: 100%;
    margin-top: 16px;
    padding: 11px;
    border: 0;
    background: #f9e8ef;
    color: #d32a6c;
    border-radius: 8px;
    font-weight: 700;
    font-size: 12px;
}


/* INFO */

.pk-ad-preview-info {
    margin-top: 13px;
    padding: 13px;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 10px;
    display: flex;
    gap: 8px;
}

.pk-ad-preview-info i {
    color: #777;
}

.pk-ad-preview-info p {
    margin: 0;
    color: #777;
    font-size: 11px;
}


/* MOBILE */

@media (max-width: 991.98px) {

    .pk-ad-preview-sticky {
        position: static;
    }

}


@media (max-width: 767.98px) {

    .pk-ad-topbar {
        padding: 12px 0;
    }

    .pk-ad-help span,
    .pk-ad-back span {
        display: none;
    }

    .pk-ad-page-title {
        font-size: 16px;
    }

    .pk-ad-heading h1 {
        font-size: 24px;
    }

    .pk-ad-progress-line {
        display: none;
    }

    .pk-ad-steps {
        grid-template-columns: repeat(4, 1fr);
        gap: 4px;
    }

    .pk-ad-step {
        flex-direction: column;
        gap: 5px;
        text-align: center;
    }

    .pk-ad-step-icon {
        width: 38px;
        height: 38px;
        font-size: 13px;
    }

    .pk-ad-step strong {
        font-size: 10px;
    }

    .pk-ad-step small {
        display: none;
    }

    .pk-ad-form-card {
        padding: 18px;
        border-radius: 12px;
    }

    .pk-ad-section-title {
        align-items: flex-start;
    }

    .pk-ad-section-title h2 {
        font-size: 17px;
    }

    .pk-ad-section-icon {
        width: 40px;
        height: 40px;
        flex-basis: 40px;
    }

    .pk-ad-type-grid {
        grid-template-columns: 1fr;
    }

    .pk-ad-type-option span {
        display: flex;
        align-items: center;
        text-align: left;
        gap: 12px;
        padding: 13px;
    }

    .pk-ad-type-option i {
        margin: 0;
        width: 30px;
        text-align: center;
    }

    .pk-ad-type-option small {
        margin-top: 2px;
    }

    .pk-ad-image-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .pk-ad-image-item {
        height: 85px;
    }

    .pk-ad-form-actions {
        position: sticky;
        bottom: 0;
        background: #fff;
        margin-left: -18px;
        margin-right: -18px;
        margin-bottom: -18px;
        padding: 14px 18px;
        z-index: 10;
    }

    .pk-ad-btn {
        flex: 1;
        justify-content: center;
    }

}


@media (max-width: 480px) {

    .pk-ad-page-title i {
        display: none;
    }

    .pk-ad-heading {
        margin-bottom: 20px;
    }

    .pk-ad-image-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .pk-ad-upload-box {
        padding: 30px 15px;
    }

}

/* =========================================
   PKPL REGISTER PAGE
========================================= */

.pk-reg-page {
    min-height: 100vh;
    background: #fff;
    color: #202124;
}


/* =========================================
   BRAND PANEL
========================================= */

.pk-reg-brand-panel {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
    background:
        radial-gradient(circle at 20% 20%,
        rgba(211, 42, 108, .18),
        transparent 35%),
        radial-gradient(circle at 80% 75%,
        rgba(117, 47, 148, .18),
        transparent 35%),
        #17141a;
    color: #fff;
}


.pk-reg-brand-panel::before {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 50%;
    right: -170px;
    top: 12%;
}


.pk-reg-brand-panel::after {
    content: "";
    position: absolute;
    width: 600px;
    height: 600px;
    border: 1px solid rgba(255,255,255,.04);
    border-radius: 50%;
    left: -300px;
    bottom: -250px;
}


.pk-reg-brand-content {
    position: relative;
    z-index: 2;
    max-width: 570px;
    margin: auto;
    min-height: 100vh;
    padding: 45px 45px 30px;
    display: flex;
    flex-direction: column;
}


/* LOGO */

.pk-reg-logo {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: inherit;
    text-decoration: none;
    font-size: 21px;
    font-weight: 800;
    letter-spacing: -.3px;
}

.pk-reg-logo strong {
    color: #ff5c96;
}


.pk-reg-logo-icon {
    width: 39px;
    height: 39px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    background: #d32a6c;
    color: #fff;
    font-size: 17px;
}


/* BRAND TEXT */

.pk-reg-brand-text {
    margin-top: auto;
    margin-bottom: 55px;
}


.pk-reg-brand-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 50px;
    color: #ddd;
    background: rgba(255,255,255,.04);
    font-size: 11px;
}


.pk-reg-brand-badge i {
    color: #ff5c96;
}


.pk-reg-brand-text h1 {
    font-size: clamp(48px, 5vw, 72px);
    line-height: .96;
    letter-spacing: -3px;
    font-weight: 800;
    margin: 25px 0 22px;
}


.pk-reg-brand-text h1 span {
    color: #ff5c96;
}


.pk-reg-brand-text p {
    max-width: 470px;
    color: #aaa;
    font-size: 15px;
    line-height: 1.7;
}


/* BENEFITS */

.pk-reg-benefits {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 50px;
}


.pk-reg-benefit {
    display: flex;
    align-items: center;
    gap: 13px;
}


.pk-reg-benefit-icon {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 10px;
    background: rgba(255,255,255,.06);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ff5c96;
}


.pk-reg-benefit strong,
.pk-reg-benefit small {
    display: block;
}


.pk-reg-benefit strong {
    font-size: 13px;
}


.pk-reg-benefit small {
    color: #888;
    font-size: 11px;
    margin-top: 3px;
}


/* FOOTER */

.pk-reg-brand-footer {
    color: #666;
    font-size: 10px;
}


/* =========================================
   FORM PANEL
========================================= */

.pk-reg-form-panel {
    min-height: 100vh;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}


.pk-reg-form-wrap {
    width: 100%;
    max-width: 510px;
    padding: 45px 30px;
}


.pk-reg-mobile-logo {
    display: none;
}


/* HEADING */

.pk-reg-form-heading {
    margin-bottom: 24px;
}


.pk-reg-small-title {
    color: #d32a6c;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.5px;
}


.pk-reg-form-heading h2 {
    font-size: 30px;
    font-weight: 800;
    letter-spacing: -.8px;
    margin: 7px 0 6px;
}


.pk-reg-form-heading p {
    color: #888;
    margin: 0;
    font-size: 13px;
}


/* GOOGLE */

.pk-reg-google-btn {
    width: 100%;
    border: 1px solid #dedfe2;
    background: #fff;
    border-radius: 9px;
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 13px;
    font-weight: 650;
    color: #333;
    cursor: pointer;
    transition: .2s;
}


.pk-reg-google-btn:hover {
    border-color: #bbb;
    background: #fafafa;
}


.pk-reg-google-icon {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 15px;
    color: #4285f4;
}


/* DIVIDER */

.pk-reg-divider {
    position: relative;
    text-align: center;
    margin: 22px 0;
}


.pk-reg-divider::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    background: #eee;
}


.pk-reg-divider span {
    position: relative;
    background: #fff;
    padding: 0 12px;
    color: #aaa;
    font-size: 10px;
}


/* FIELD */

.pk-reg-field {
    margin-bottom: 17px;
}


.pk-reg-field > label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 7px;
}


.pk-reg-field > label > span:first-of-type {
    color: #d32a6c;
}


.pk-reg-optional {
    color: #aaa !important;
    font-size: 10px;
    font-weight: 500;
    margin-left: 5px;
}


/* INPUT */

.pk-reg-input-wrap {
    height: 46px;
    width: 100%;
    display: flex;
    align-items: center;
    border: 1px solid #dddfe3;
    border-radius: 9px;
    padding: 0 13px;
    transition: .2s;
    background: #fff;
}


.pk-reg-input-wrap:focus-within {
    border-color: #d32a6c;
    box-shadow: 0 0 0 3px rgba(211,42,108,.08);
}


.pk-reg-input-wrap > i {
    width: 23px;
    color: #999;
    font-size: 14px;
}


.pk-reg-input-wrap input {
    flex: 1;
    width: 100%;
    min-width: 0;
    height: 100%;
    border: 0;
    outline: 0;
    font-size: 13px;
    color: #222;
}


.pk-reg-input-wrap input::placeholder {
    color: #aaa;
}


/* MOBILE INPUT */

.pk-reg-country {
    color: #555;
    font-size: 13px;
    font-weight: 600;
}


.pk-reg-country-divider {
    height: 20px;
    width: 1px;
    background: #ddd;
    margin: 0 10px;
}


.pk-reg-mobile-input > i {
    margin-left: 8px;
}


/* HINT */

.pk-reg-field-hint {
    display: block;
    color: #999;
    font-size: 10px;
    margin-top: 5px;
}


/* ERROR */

.pk-reg-error {
    display: block;
    color: #d32a6c;
    font-size: 10px;
    margin-top: 5px;
}


/* PASSWORD TOGGLE */

.pk-reg-password-toggle {
    border: 0;
    background: transparent;
    color: #999;
    cursor: pointer;
    padding: 5px;
}


/* PURPOSE */

.pk-reg-purpose-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}


.pk-reg-purpose {
    cursor: pointer;
}


.pk-reg-purpose input {
    display: none;
}


.pk-reg-purpose span {
    display: block;
    border: 1px solid #e0e1e4;
    border-radius: 9px;
    padding: 12px;
    transition: .2s;
}


.pk-reg-purpose span > i {
    color: #999;
    margin-right: 7px;
}


.pk-reg-purpose strong {
    font-size: 11px;
}


.pk-reg-purpose small {
    display: block;
    color: #999;
    font-size: 9px;
    margin-top: 4px;
    padding-left: 24px;
}


.pk-reg-purpose input:checked + span {
    border-color: #d32a6c;
    background: #fff7fa;
}


.pk-reg-purpose input:checked + span > i {
    color: #d32a6c;
}


/* PASSWORD STRENGTH */

.pk-reg-password-strength {
    margin-top: 8px;
}


.pk-reg-strength-bars {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
}


.pk-reg-strength-bars span {
    height: 3px;
    background: #e6e7e9;
    border-radius: 5px;
}


.pk-reg-strength-bars span.active {
    background: #d32a6c;
}


.pk-reg-strength-text {
    margin-top: 5px;
    color: #999;
    font-size: 9px;
}


/* PASSWORD RULES */

.pk-reg-password-rules {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 15px;
    margin-top: 8px;
}


.pk-reg-password-rules span {
    font-size: 9px;
    color: #999;
}


.pk-reg-password-rules i {
    margin-right: 3px;
}


.pk-reg-password-rules span.valid {
    color: #269a68;
}


.pk-reg-password-rules span.valid i::before {
    content: "\f058";
}


/* TERMS */

.pk-reg-terms {
    margin: 18px 0;
}


.pk-reg-terms label {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    cursor: pointer;
    font-size: 10px;
    line-height: 1.6;
    color: #777;
}


.pk-reg-terms input {
    margin-top: 3px;
    accent-color: #d32a6c;
}


.pk-reg-terms a {
    color: #d32a6c;
    text-decoration: none;
    font-weight: 600;
}


/* SUBMIT */

.pk-reg-submit-btn {
    width: 100%;
    min-height: 48px;
    border: 0;
    border-radius: 9px;
    background: #d32a6c;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: .2s;
}


.pk-reg-submit-btn:hover {
    background: #b9215b;
}


.pk-reg-submit-btn i {
    transition: .2s;
}


.pk-reg-submit-btn:hover i {
    transform: translateX(4px);
}


/* LOGIN */

.pk-reg-login-link {
    text-align: center;
    margin-top: 22px;
    color: #888;
    font-size: 11px;
}


.pk-reg-login-link a {
    color: #d32a6c;
    font-weight: 700;
    text-decoration: none;
    margin-left: 4px;
}


.pk-reg-login-link i {
    font-size: 9px;
    margin-left: 3px;
}


/* SECURITY */

.pk-reg-security {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: #aaa;
    font-size: 9px;
    margin-top: 22px;
}


.pk-reg-security i {
    color: #269a68;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 991.98px) {

    .pk-reg-brand-panel {
        display: none;
    }

    .pk-reg-form-panel {
        min-height: 100vh;
        align-items: flex-start;
    }

    .pk-reg-form-wrap {
        max-width: 550px;
        padding: 28px 22px 40px;
        margin: auto;
    }

    .pk-reg-mobile-logo {
        display: block;
        margin-bottom: 35px;
    }

    .pk-reg-mobile-logo .pk-reg-logo {
        color: #202124;
    }

}


@media (max-width: 575.98px) {

    .pk-reg-form-wrap {
        padding: 22px 16px 35px;
    }

    .pk-reg-mobile-logo {
        margin-bottom: 28px;
    }

    .pk-reg-form-heading h2 {
        font-size: 25px;
    }

    .pk-reg-purpose-grid {
        grid-template-columns: 1fr;
    }

    .pk-reg-purpose span {
        display: flex;
        align-items: center;
    }

    .pk-reg-purpose small {
        padding-left: 0;
        margin-left: auto;
        margin-top: 0;
    }

}





/* =========================================
   PKPL BOOKING PAGE
========================================= */

.pk-booking-page {
    min-height: 100vh;

    background: #f7f7f9;

    color: #202124;

    padding: 40px 0 70px;
}


/* =========================================
   TOP
========================================= */

.pk-booking-top {
    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    gap: 20px;

    margin-bottom: 30px;
}


.pk-booking-back {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    color: #777;

    font-size: 11px;

    text-decoration: none;

    margin-bottom: 16px;
}


.pk-booking-back:hover {
    color: #d32a6c;
}


.pk-booking-title > span {
    color: #d32a6c;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 1.5px;
}


.pk-booking-title h1 {
    margin: 7px 0 5px;

    font-size: 32px;

    letter-spacing: -1.2px;

    font-weight: 800;
}


.pk-booking-title p {
    margin: 0;

    color: #888;

    font-size: 12px;
}


/* =========================================
   SECURE
========================================= */

.pk-booking-secure {
    display: flex;

    align-items: center;

    gap: 10px;

    padding: 11px 14px;

    border: 1px solid #e5e5e8;

    border-radius: 10px;

    background: #fff;
}


.pk-booking-secure > i {
    color: #269a68;

    font-size: 18px;
}


.pk-booking-secure strong {
    display: block;

    font-size: 10px;
}


.pk-booking-secure small {
    display: block;

    margin-top: 2px;

    color: #999;

    font-size: 8px;
}


/* =========================================
   STEPS
========================================= */

.pk-booking-steps {
    display: flex;

    align-items: center;

    margin-bottom: 28px;

    padding: 18px 22px;

    border: 1px solid #e8e8eb;

    border-radius: 12px;

    background: #fff;
}


.pk-booking-step {
    display: flex;

    align-items: center;

    gap: 9px;

    min-width: 145px;
}


.pk-booking-step > span {
    width: 31px;
    height: 31px;

    display: flex;

    align-items: center;
    justify-content: center;

    flex: 0 0 31px;

    border-radius: 50%;

    border: 1px solid #ddd;

    color: #aaa;

    font-size: 11px;

    font-weight: 700;
}


.pk-booking-step.done > span {
    background: #269a68;

    border-color: #269a68;

    color: #fff;
}


.pk-booking-step.active > span {
    background: #d32a6c;

    border-color: #d32a6c;

    color: #fff;
}


.pk-booking-step strong {
    display: block;

    font-size: 10px;
}


.pk-booking-step small {
    display: block;

    margin-top: 2px;

    color: #aaa;

    font-size: 8px;
}


.pk-booking-step-line {
    height: 1px;

    flex: 1;

    background: #e4e4e6;

    margin: 0 15px;
}


.pk-booking-step-line.active {
    background: #d32a6c;
}


/* =========================================
   CARD
========================================= */

.pk-booking-card {
    padding: 22px;

    margin-bottom: 18px;

    border: 1px solid #e7e7ea;

    border-radius: 13px;

    background: #fff;
}


/* =========================================
   CARD HEADING
========================================= */

.pk-booking-card-heading {
    display: flex;

    align-items: flex-start;

    justify-content: space-between;

    gap: 15px;

    margin-bottom: 20px;
}


.pk-booking-label {
    color: #d32a6c;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.3px;
}


.pk-booking-card-heading h2 {
    margin: 6px 0 0;

    font-size: 19px;

    letter-spacing: -.4px;

    font-weight: 750;
}


.pk-booking-verified {
    display: inline-flex;

    align-items: center;

    gap: 5px;

    padding: 6px 9px;

    border-radius: 50px;

    background: #effaf5;

    color: #269a68;

    font-size: 8px;

    font-weight: 700;

    white-space: nowrap;
}


/* =========================================
   SERVICE
========================================= */

.pk-booking-service {
    display: flex;

    gap: 16px;

    padding: 13px;

    border: 1px solid #eeeeef;

    border-radius: 10px;

    background: #fafafa;
}


.pk-booking-service-image {
    width: 125px;
    height: 95px;

    flex: 0 0 125px;

    overflow: hidden;

    border-radius: 8px;
}


.pk-booking-service-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}


.pk-booking-rating {
    display: flex;

    align-items: center;

    gap: 7px;

    margin-bottom: 6px;
}


.pk-booking-rating span {
    color: #e39a00;

    font-size: 10px;

    font-weight: 700;
}


.pk-booking-rating small {
    color: #999;

    font-size: 9px;
}


.pk-booking-service-info h3 {
    margin: 0 0 6px;

    font-size: 14px;

    font-weight: 750;
}


.pk-booking-service-info p {
    margin: 0 0 8px;

    color: #888;

    font-size: 10px;
}


.pk-booking-service-info p i {
    color: #d32a6c;

    margin-right: 4px;
}


.pk-booking-service-info a {
    color: #d32a6c;

    font-size: 9px;

    font-weight: 700;

    text-decoration: none;
}


/* =========================================
   SECTION TITLE
========================================= */

.pk-booking-section-title {
    display: flex;

    align-items: center;

    gap: 11px;

    margin-bottom: 19px;
}


.pk-booking-section-icon {
    width: 38px;
    height: 38px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 9px;

    background: #fff0f6;

    color: #d32a6c;

    font-size: 13px;
}


.pk-booking-section-title h3 {
    margin: 0;

    font-size: 14px;

    font-weight: 750;
}


.pk-booking-section-title p {
    margin: 3px 0 0;

    color: #999;

    font-size: 9px;
}


/* =========================================
   DETAIL BOX
========================================= */

.pk-booking-detail-box {
    position: relative;

    padding: 14px;

    border: 1px solid #ededee;

    border-radius: 9px;

    background: #fff;
}


.pk-booking-detail-box > span {
    display: block;

    color: #999;

    font-size: 8px;

    font-weight: 700;

    letter-spacing: .5px;

    margin-bottom: 7px;
}


.pk-booking-detail-box > span i {
    color: #d32a6c;

    margin-right: 4px;
}


.pk-booking-detail-box strong {
    display: block;

    font-size: 12px;
}


.pk-booking-detail-box small {
    display: block;

    margin-top: 3px;

    color: #999;

    font-size: 9px;
}


.pk-booking-change-btn {
    position: absolute;

    right: 13px;

    bottom: 13px;

    border: 0;

    background: transparent;

    color: #d32a6c;

    font-size: 9px;

    font-weight: 700;

    cursor: pointer;
}


/* =========================================
   CONTACT
========================================= */

.pk-booking-contact {
    padding: 12px 14px;

    border: 1px solid #ededee;

    border-radius: 9px;
}


.pk-booking-contact span {
    display: block;

    color: #999;

    font-size: 8px;

    margin-bottom: 5px;
}


.pk-booking-contact strong {
    display: block;

    font-size: 11px;
}


.pk-booking-edit {
    margin-top: 14px;

    border: 0;

    background: transparent;

    color: #d32a6c;

    font-size: 9px;

    font-weight: 700;

    cursor: pointer;
}


.pk-booking-edit i {
    margin-right: 4px;
}


/* =========================================
   TEXTAREA
========================================= */

.pk-booking-textarea {
    width: 100%;

    min-height: 95px;

    resize: vertical;

    padding: 13px;

    border: 1px solid #e1e1e3;

    border-radius: 9px;

    outline: 0;

    font-size: 11px;
}


.pk-booking-textarea:focus {
    border-color: #d32a6c;

    box-shadow:
        0 0 0 3px rgba(211,42,108,.07);
}


.pk-booking-textarea::placeholder {
    color: #aaa;
}


.pk-booking-text-count {
    text-align: right;

    margin-top: 5px;

    color: #aaa;

    font-size: 8px;
}


/* =========================================
   POLICY
========================================= */

.pk-booking-policy {
    display: flex;

    gap: 11px;

    padding: 16px;

    margin-bottom: 20px;

    border: 1px solid #dcefe6;

    border-radius: 10px;

    background: #f5fbf8;
}


.pk-booking-policy-icon {
    width: 34px;
    height: 34px;

    flex: 0 0 34px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 8px;

    background: #e2f5eb;

    color: #269a68;

    font-size: 12px;
}


.pk-booking-policy strong {
    display: block;

    color: #267a57;

    font-size: 10px;
}


.pk-booking-policy p {
    margin: 3px 0 4px;

    color: #777;

    font-size: 9px;

    line-height: 1.5;
}


.pk-booking-policy a {
    color: #267a57;

    font-size: 9px;

    font-weight: 700;

    text-decoration: none;
}


/* =========================================
   SUMMARY
========================================= */

.pk-booking-summary {
    position: sticky;

    top: 20px;

    padding: 21px;

    border: 1px solid #e3e3e6;

    border-radius: 14px;

    background: #fff;

    box-shadow:
        0 10px 35px rgba(0,0,0,.045);
}


.pk-booking-summary-header {
    display: flex;

    align-items: center;

    justify-content: space-between;

    color: #d32a6c;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 1px;
}


.pk-booking-summary-header i {
    font-size: 14px;
}


/* =========================================
   SUMMARY SERVICE
========================================= */

.pk-booking-summary-service {
    display: flex;

    align-items: center;

    gap: 10px;

    margin-top: 18px;
}


.pk-booking-summary-thumb {
    width: 48px;
    height: 42px;

    flex: 0 0 48px;

    overflow: hidden;

    border-radius: 7px;
}


.pk-booking-summary-thumb img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}


.pk-booking-summary-service strong {
    display: block;

    font-size: 10px;

    line-height: 1.4;
}


.pk-booking-summary-service small {
    display: block;

    margin-top: 3px;

    color: #999;

    font-size: 8px;
}


/* =========================================
   DIVIDER
========================================= */

.pk-booking-summary-divider {
    height: 1px;

    margin: 17px 0;

    background: #eee;
}


/* =========================================
   PRICE
========================================= */

.pk-booking-price-row {
    display: flex;

    justify-content: space-between;

    gap: 15px;

    margin-bottom: 12px;

    color: #777;

    font-size: 10px;
}


.pk-booking-price-row strong {
    color: #333;

    font-size: 10px;
}


.pk-booking-price-row.discount {
    color: #269a68;
}


.pk-booking-price-row.discount strong {
    color: #269a68;
}


/* =========================================
   TOTAL
========================================= */

.pk-booking-total {
    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 10px;
}


.pk-booking-total span {
    display: block;

    font-size: 12px;

    font-weight: 750;
}


.pk-booking-total small {
    display: block;

    margin-top: 3px;

    color: #999;

    font-size: 7px;
}


.pk-booking-total > strong {
    color: #d32a6c;

    font-size: 21px;

    letter-spacing: -.5px;
}


/* =========================================
   COUPON
========================================= */

.pk-booking-coupon {
    display: flex;

    gap: 7px;

    margin-top: 18px;
}


.pk-booking-coupon > div {
    flex: 1;

    display: flex;

    align-items: center;

    gap: 7px;

    padding: 0 10px;

    height: 38px;

    border: 1px dashed #ddd;

    border-radius: 8px;

    background: #fafafa;
}


.pk-booking-coupon i {
    color: #d32a6c;

    font-size: 11px;
}


.pk-booking-coupon input {
    width: 100%;

    min-width: 0;

    border: 0;

    outline: 0;

    background: transparent;

    font-size: 9px;
}


.pk-booking-coupon button {
    padding: 0 13px;

    border: 1px solid #d32a6c;

    border-radius: 8px;

    background: #fff;

    color: #d32a6c;

    font-size: 9px;

    font-weight: 700;

    cursor: pointer;
}


/* =========================================
   PAYMENT BUTTON
========================================= */

.pk-booking-payment-btn {
    width: 100%;

    min-height: 48px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 0 15px;

    margin-top: 16px;

    border: 0;

    border-radius: 9px;

    background:
        linear-gradient(
            135deg,
            #d32a6c,
            #bd205f
        );

    color: #fff;

    font-size: 11px;

    font-weight: 750;

    cursor: pointer;

    box-shadow:
        0 9px 22px rgba(211,42,108,.22);

    transition: .2s;
}


.pk-booking-payment-btn:hover {
    transform: translateY(-2px);

    box-shadow:
        0 13px 28px rgba(211,42,108,.28);
}


.pk-booking-payment-safe {
    display: flex;

    align-items: center;

    justify-content: center;

    gap: 5px;

    margin-top: 11px;

    color: #999;

    font-size: 8px;
}


.pk-booking-payment-safe i {
    color: #269a68;
}


/* =========================================
   TERMS
========================================= */

.pk-booking-terms {
    margin: 15px 0 0;

    color: #aaa;

    text-align: center;

    font-size: 7px;

    line-height: 1.6;
}


.pk-booking-terms a {
    color: #777;

    font-weight: 600;
}


/* =========================================
   PROVIDER
========================================= */

.pk-booking-provider {
    display: flex;

    align-items: center;

    gap: 10px;

    margin-top: 14px;

    padding: 13px;

    border: 1px solid #e7e7e9;

    border-radius: 11px;

    background: #fff;
}


.pk-booking-provider-avatar {
    width: 40px;
    height: 40px;

    flex: 0 0 40px;

    overflow: hidden;

    border-radius: 50%;
}


.pk-booking-provider-avatar img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}


.pk-booking-provider > div:nth-child(2) {
    flex: 1;
}


.pk-booking-provider span {
    display: block;

    color: #aaa;

    font-size: 7px;

    font-weight: 700;

    letter-spacing: .5px;
}


.pk-booking-provider strong {
    display: block;

    margin-top: 3px;

    font-size: 10px;
}


.pk-booking-provider small {
    display: block;

    margin-top: 2px;

    color: #269a68;

    font-size: 7px;
}


.pk-booking-provider button {
    width: 31px;
    height: 31px;

    border: 1px solid #eee;

    border-radius: 8px;

    background: #fff;

    color: #d32a6c;

    cursor: pointer;
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 991.98px) {

    .pk-booking-page {
        padding: 25px 0 50px;
    }


    .pk-booking-summary {
        position: static;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 575.98px) {

    .pk-booking-page {
        padding: 20px 0 45px;
    }


    .pk-booking-top {
        align-items: flex-start;

        flex-direction: column;

        margin-bottom: 20px;
    }


    .pk-booking-title h1 {
        font-size: 26px;
    }


    .pk-booking-title p {
        line-height: 1.6;
    }


    .pk-booking-secure {
        width: 100%;
    }


    /* STEPS */

    .pk-booking-steps {
        padding: 14px 10px;

        overflow-x: auto;
    }


    .pk-booking-step {
        min-width: auto;

        flex: 0 0 auto;
    }


    .pk-booking-step > div {
        display: none;
    }


    .pk-booking-step-line {
        min-width: 25px;

        margin: 0 8px;
    }


    /* CARD */

    .pk-booking-card {
        padding: 16px;

        border-radius: 11px;
    }


    .pk-booking-card-heading h2 {
        font-size: 16px;
    }


    /* SERVICE */

    .pk-booking-service {
        padding: 9px;

        gap: 10px;
    }


    .pk-booking-service-image {
        width: 90px;
        height: 80px;

        flex-basis: 90px;
    }


    .pk-booking-service-info h3 {
        font-size: 11px;
    }


    .pk-booking-service-info p {
        font-size: 8px;
    }


    /* SUMMARY */

    .pk-booking-summary {
        padding: 17px;
    }


    .pk-booking-total > strong {
        font-size: 19px;
    }

}





/* =========================================
   PKPL LOGIN PAGE
========================================= */

.pk-login-page {
    min-height: 100vh;
    background: #fff;
    color: #202124;
}


/* =========================================
   LEFT VISUAL
========================================= */

.pk-login-visual {
    position: relative;
    min-height: 100vh;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 15% 15%,
            rgba(211, 42, 108, .25),
            transparent 30%
        ),
        radial-gradient(
            circle at 85% 80%,
            rgba(125, 52, 160, .25),
            transparent 35%
        ),
        linear-gradient(
            145deg,
            #17131a 0%,
            #21151e 50%,
            #151219 100%
        );

    color: #fff;
}


.pk-login-visual::before {
    content: "";
    position: absolute;

    width: 650px;
    height: 650px;

    border-radius: 50%;

    border: 1px solid rgba(255,255,255,.06);

    right: -310px;
    top: -180px;
}


.pk-login-visual::after {
    content: "";

    position: absolute;

    width: 480px;
    height: 480px;

    border-radius: 50%;

    border: 1px solid rgba(255,255,255,.05);

    left: -250px;
    bottom: -250px;
}


/* =========================================
   INNER
========================================= */

.pk-login-visual-inner {
    position: relative;
    z-index: 3;

    max-width: 590px;

    min-height: 100vh;

    margin: auto;

    padding: 42px 48px 35px;

    display: flex;
    flex-direction: column;
}


/* =========================================
   LOGO
========================================= */

.pk-login-logo {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    color: inherit;

    text-decoration: none;

    font-size: 21px;
    font-weight: 800;
}


.pk-login-logo strong {
    color: #ff5c96;
}


.pk-login-logo-icon {
    width: 40px;
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 11px;

    background: #d32a6c;

    color: #fff;

    box-shadow:
        0 8px 25px rgba(211,42,108,.35);
}


/* =========================================
   GLOW
========================================= */

.pk-login-glow {
    position: absolute;

    border-radius: 50%;

    filter: blur(70px);

    pointer-events: none;
}


.pk-login-glow-1 {
    width: 190px;
    height: 190px;

    background: rgba(211,42,108,.18);

    right: 8%;
    top: 27%;
}


.pk-login-glow-2 {
    width: 150px;
    height: 150px;

    background: rgba(130,50,180,.16);

    left: 5%;
    bottom: 15%;
}


/* =========================================
   HERO
========================================= */

.pk-login-hero {
    margin-top: auto;
    margin-bottom: auto;
}


.pk-login-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    padding: 8px 13px;

    border: 1px solid rgba(255,255,255,.12);

    border-radius: 50px;

    background: rgba(255,255,255,.04);

    color: #ddd;

    font-size: 10px;
    font-weight: 600;

    backdrop-filter: blur(8px);
}


.pk-login-badge i {
    color: #ff5c96;
}


.pk-login-hero h1 {
    margin: 25px 0 22px;

    font-size: clamp(48px, 5vw, 70px);

    line-height: .96;

    letter-spacing: -3px;

    font-weight: 850;
}


.pk-login-hero h1 span {
    color: #ff5c96;
}


.pk-login-hero p {
    max-width: 480px;

    margin: 0;

    color: #aaa;

    font-size: 14px;

    line-height: 1.8;
}


/* =========================================
   STATS
========================================= */

.pk-login-stats {
    display: flex;

    gap: 45px;

    margin-top: 38px;
}


.pk-login-stats div {
    position: relative;
}


.pk-login-stats div:not(:last-child)::after {
    content: "";

    position: absolute;

    width: 1px;
    height: 30px;

    background: rgba(255,255,255,.12);

    right: -23px;
    top: 8px;
}


.pk-login-stats strong {
    display: block;

    font-size: 19px;

    color: #fff;
}


.pk-login-stats small {
    display: block;

    color: #777;

    font-size: 10px;

    margin-top: 2px;
}


/* =========================================
   QUOTE
========================================= */

.pk-login-quote {
    display: flex;

    align-items: center;

    gap: 12px;
}


.pk-login-quote-icon {
    width: 38px;
    height: 38px;

    border-radius: 10px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: rgba(211,42,108,.12);

    color: #ff5c96;

    font-size: 12px;
}


.pk-login-quote p {
    margin: 0;

    font-size: 11px;

    font-weight: 700;
}


.pk-login-quote small {
    color: #777;

    font-size: 9px;
}


/* =========================================
   FORM PANEL
========================================= */

.pk-login-form-panel {
    min-height: 100vh;

    display: flex;

    align-items: center;
    justify-content: center;

    background: #fff;
}


.pk-login-form-wrap {
    width: 100%;

    max-width: 470px;

    padding: 45px 30px;
}


/* =========================================
   MOBILE LOGO
========================================= */

.pk-login-mobile-logo {
    display: none;
}


/* =========================================
   HEADING
========================================= */

.pk-login-heading {
    margin-bottom: 25px;
}


.pk-login-small-title {
    color: #d32a6c;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 1.6px;
}


.pk-login-heading h2 {
    margin: 8px 0 6px;

    font-size: 31px;

    letter-spacing: -1px;

    font-weight: 800;
}


.pk-login-heading p {
    margin: 0;

    color: #888;

    font-size: 13px;
}


/* =========================================
   GOOGLE
========================================= */

.pk-login-google-btn {
    width: 100%;

    min-height: 47px;

    display: flex;

    align-items: center;
    justify-content: center;

    gap: 10px;

    border: 1px solid #dedfe3;

    border-radius: 10px;

    background: #fff;

    color: #333;

    font-size: 12px;

    font-weight: 650;

    cursor: pointer;

    transition: .2s;
}


.pk-login-google-btn:hover {
    background: #fafafa;

    border-color: #bbb;

    transform: translateY(-1px);
}


.pk-login-google {
    width: 22px;
    height: 22px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    color: #4285f4;

    font-weight: 800;

    font-size: 15px;
}


/* =========================================
   DIVIDER
========================================= */

.pk-login-divider {
    position: relative;

    text-align: center;

    margin: 22px 0;
}


.pk-login-divider::before {
    content: "";

    position: absolute;

    left: 0;
    right: 0;

    top: 50%;

    height: 1px;

    background: #eee;
}


.pk-login-divider span {
    position: relative;

    padding: 0 12px;

    background: #fff;

    color: #aaa;

    font-size: 9px;
}


/* =========================================
   FIELD
========================================= */

.pk-login-field {
    margin-bottom: 18px;
}


.pk-login-field label {
    display: block;

    margin-bottom: 7px;

    font-size: 12px;

    font-weight: 700;
}


.pk-login-label-row {
    display: flex;

    justify-content: space-between;

    align-items: center;
}


.pk-login-label-row a {
    color: #d32a6c;

    text-decoration: none;

    font-size: 10px;

    font-weight: 650;
}


/* =========================================
   INPUT
========================================= */

.pk-login-input {
    height: 47px;

    width: 100%;

    display: flex;

    align-items: center;

    padding: 0 13px;

    border: 1px solid #dddfe3;

    border-radius: 10px;

    background: #fff;

    transition: .2s;
}


.pk-login-input:focus-within {
    border-color: #d32a6c;

    box-shadow:
        0 0 0 3px rgba(211,42,108,.08);
}


.pk-login-input > i {
    width: 24px;

    color: #999;

    font-size: 13px;
}


.pk-login-input input {
    flex: 1;

    min-width: 0;

    width: 100%;
    height: 100%;

    border: 0;
    outline: 0;

    font-size: 13px;

    color: #222;
}


.pk-login-input input::placeholder {
    color: #aaa;
}


/* COUNTRY */

.pk-login-country {
    font-size: 12px;

    font-weight: 650;

    color: #555;
}


.pk-login-country-line {
    width: 1px;
    height: 20px;

    background: #ddd;

    margin: 0 10px;
}


/* EYE */

.pk-login-eye {
    border: 0;

    background: transparent;

    color: #999;

    padding: 5px;

    cursor: pointer;
}


/* ERROR */

.pk-login-error {
    display: block;

    color: #d32a6c;

    font-size: 9px;

    margin-top: 5px;
}


/* =========================================
   OPTIONS
========================================= */

.pk-login-options {
    margin: 4px 0 18px;
}


.pk-login-options label {
    display: flex;

    align-items: center;

    gap: 7px;

    cursor: pointer;

    color: #777;

    font-size: 10px;
}


.pk-login-options input {
    accent-color: #d32a6c;
}


/* =========================================
   LOGIN BUTTON
========================================= */

.pk-login-submit {
    width: 100%;

    min-height: 49px;

    display: flex;

    align-items: center;
    justify-content: center;

    gap: 10px;

    border: 0;

    border-radius: 10px;

    background:
        linear-gradient(
            135deg,
            #d32a6c,
            #bd205f
        );

    color: #fff;

    font-size: 13px;

    font-weight: 700;

    cursor: pointer;

    box-shadow:
        0 10px 25px rgba(211,42,108,.22);

    transition: .25s;
}


.pk-login-submit:hover {
    transform: translateY(-2px);

    box-shadow:
        0 14px 30px rgba(211,42,108,.28);
}


.pk-login-submit i {
    transition: .2s;
}


.pk-login-submit:hover i {
    transform: translateX(4px);
}


/* =========================================
   OTP BUTTON
========================================= */

.pk-login-otp-btn {
    width: 100%;

    margin-top: 12px;

    min-height: 43px;

    border: 1px solid #f0d3df;

    border-radius: 9px;

    background: #fff8fb;

    color: #d32a6c;

    font-size: 11px;

    font-weight: 650;

    cursor: pointer;

    transition: .2s;
}


.pk-login-otp-btn:hover {
    background: #fff0f6;

    border-color: #e8b9cc;
}


.pk-login-otp-btn i {
    margin-right: 6px;
}


/* =========================================
   REGISTER
========================================= */

.pk-login-register {
    text-align: center;

    margin-top: 24px;

    color: #888;

    font-size: 11px;
}


.pk-login-register a {
    color: #d32a6c;

    font-weight: 700;

    text-decoration: none;

    margin-left: 4px;
}


.pk-login-register a i {
    font-size: 9px;

    margin-left: 2px;
}


/* =========================================
   SECURITY
========================================= */

.pk-login-security {
    display: flex;

    align-items: center;

    justify-content: center;

    gap: 6px;

    margin-top: 23px;

    color: #aaa;

    font-size: 9px;
}


.pk-login-security i {
    color: #269a68;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 991.98px) {

    .pk-login-visual {
        display: none;
    }


    .pk-login-form-panel {
        min-height: 100vh;

        align-items: flex-start;
    }


    .pk-login-form-wrap {
        max-width: 550px;

        margin: auto;

        padding: 25px 22px 40px;
    }


    .pk-login-mobile-logo {
        display: block;

        margin-bottom: 38px;
    }


    .pk-login-mobile-logo .pk-login-logo {
        color: #202124;
    }

}


@media (max-width: 575.98px) {

    .pk-login-form-wrap {
        padding: 20px 16px 35px;
    }


    .pk-login-mobile-logo {
        margin-bottom: 30px;
    }


    .pk-login-heading h2 {
        font-size: 26px;
    }


    .pk-login-heading p {
        font-size: 12px;
    }

}



/* =========================================
   OTP MOBILE / VERIFY PANELS
========================================= */

.pk-otp-mobile-panel,
.pk-otp-verify-panel {
    display: none;
}

.pk-otp-mobile-panel.active,
.pk-otp-verify-panel.active {
    display: block;
    animation: pkOtpFade .3s ease;
}


@keyframes pkOtpFade {

    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}


/* =========================================
   OTP BACK BUTTON
========================================= */

.pk-otp-back {

    display: inline-flex;
    align-items: center;
    gap: 7px;

    padding: 0;
    margin-bottom: 30px;

    border: 0;
    background: transparent;

    color: #888;

    font-size: 11px;
    font-weight: 600;

    cursor: pointer;

    transition: .2s;

}

.pk-otp-back:hover {
    color: #d32a6c;
}

.pk-otp-back i {
    font-size: 10px;
    transition: .2s;
}

.pk-otp-back:hover i {
    transform: translateX(-3px);
}


/* =========================================
   OTP ICON
========================================= */

.pk-otp-icon {

    width: 58px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 22px;

    border-radius: 16px;

    background: rgba(211,42,108,.09);

    color: #d32a6c;

    font-size: 21px;

    box-shadow:
        0 8px 25px rgba(211,42,108,.08);

}


/* =========================================
   OTP HEADING
========================================= */

.pk-otp-heading {
    margin-bottom: 25px;
}

.pk-otp-heading h2 {

    margin: 8px 0 7px;

    font-size: 31px;

    letter-spacing: -1px;

    font-weight: 800;

}

.pk-otp-heading p {

    max-width: 380px;

    margin: 0;

    color: #888;

    font-size: 13px;

    line-height: 1.6;

}


/* =========================================
   OTP MOBILE NUMBER DISPLAY
========================================= */

.pk-otp-number {

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 13px 15px;

    margin-bottom: 22px;

    border: 1px solid #eee;

    border-radius: 10px;

    background: #fafafa;

}

.pk-otp-number span {

    color: #333;

    font-size: 12px;

    font-weight: 700;

}

.pk-otp-number button {

    border: 0;

    background: transparent;

    color: #d32a6c;

    font-size: 10px;

    font-weight: 700;

    cursor: pointer;

}


/* =========================================
   OTP INPUT
========================================= */

.pk-otp-field {
    margin-bottom: 17px;
}

.pk-otp-field label {

    display: block;

    margin-bottom: 9px;

    font-size: 12px;

    font-weight: 700;

}

.pk-otp-inputs {

    display: grid;

    grid-template-columns:
        repeat(6, 1fr);

    gap: 9px;

}

.pk-otp-inputs input {

    width: 100%;
    height: 52px;

    border: 1px solid #dddfe3;

    border-radius: 10px;

    outline: 0;

    background: #fff;

    text-align: center;

    color: #222;

    font-size: 18px;

    font-weight: 700;

    transition: .2s;

}

.pk-otp-inputs input:focus {

    border-color: #d32a6c;

    box-shadow:
        0 0 0 3px rgba(211,42,108,.08);

}


/* =========================================
   RESEND
========================================= */

.pk-otp-resend {

    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 10px;

    margin: 15px 0 20px;

    color: #999;

    font-size: 10px;

}

.pk-otp-resend button {

    padding: 0;

    border: 0;

    background: transparent;

    color: #bbb;

    font-size: 10px;

    font-weight: 650;

}

.pk-otp-resend button:not(:disabled) {

    color: #d32a6c;

    cursor: pointer;

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 575.98px) {

    .pk-otp-heading h2 {
        font-size: 26px;
    }

    .pk-otp-heading p {
        font-size: 12px;
    }

    .pk-otp-inputs {
        gap: 6px;
    }

    .pk-otp-inputs input {

        height: 48px;

        border-radius: 8px;

        font-size: 16px;

    }

}



/* =========================================
   PKPL PAYMENT PAGE
========================================= */

.pk-payment-page {

    min-height: 100vh;

    padding: 20px 15px 40px;

    background: #f7f7f9;

    color: #202124;

}


.pk-payment-wrap {

    width: 100%;

    max-width: 520px;

    margin: auto;

}


/* =========================================
   HEADER
========================================= */

.pk-payment-header {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 18px;

}

.pk-payment-back {

    display: inline-flex;

    align-items: center;

    gap: 7px;

    color: #777;

    font-size: 11px;

    font-weight: 600;

    text-decoration: none;

}

.pk-payment-back i {

    font-size: 10px;

}

.pk-payment-secure-title {

    display: flex;

    align-items: center;

    gap: 6px;

    color: #269a68;

    font-size: 10px;

    font-weight: 700;

    text-transform: uppercase;

}

.pk-payment-secure-title i {

    font-size: 10px;

}


/* =========================================
   PAYABLE AMOUNT
========================================= */

.pk-payable-box {

    padding: 25px 20px;

    margin-bottom: 15px;

    border-radius: 16px;

    text-align: center;

    background:
        linear-gradient(
            135deg,
            #21151e,
            #17131a
        );

    color: #fff;

    box-shadow:
        0 12px 30px rgba(20,15,20,.12);

}

.pk-payable-box span {

    display: block;

    margin-bottom: 6px;

    color: #aaa;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 1.5px;

}

.pk-payable-box strong {

    display: block;

    font-size: 31px;

    line-height: 1;

    letter-spacing: -.8px;

    font-weight: 850;

}


/* =========================================
   COMMON CARD
========================================= */

.pk-payment-card {

    padding: 20px;

    margin-bottom: 15px;

    border: 1px solid #e9e9ed;

    border-radius: 14px;

    background: #fff;

}


/* =========================================
   CARD HEADING
========================================= */

.pk-payment-card-heading {

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding-bottom: 16px;

    margin-bottom: 16px;

    border-bottom: 1px solid #eee;

}

.pk-payment-card-heading span,
.pk-payment-method-title > span {

    display: block;

    margin-bottom: 4px;

    color: #aaa;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.3px;

}

.pk-payment-card-heading h3,
.pk-payment-method-title h3 {

    margin: 0;

    font-size: 16px;

    font-weight: 800;

}

.pk-payment-card-heading > i {

    width: 35px;

    height: 35px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 9px;

    background: #fff1f6;

    color: #d32a6c;

    font-size: 12px;

}


/* =========================================
   SERVICE
========================================= */

.pk-payment-service {

    display: flex;

    align-items: center;

    gap: 12px;

    margin-bottom: 20px;

}

.pk-payment-service-icon {

    width: 45px;

    height: 45px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 11px;

    background: #fff1f6;

    color: #d32a6c;

}

.pk-payment-service strong {

    display: block;

    margin-bottom: 3px;

    font-size: 13px;

}

.pk-payment-service span {

    display: block;

    color: #777;

    font-size: 10px;

}

.pk-payment-service small {

    display: block;

    margin-top: 3px;

    color: #aaa;

    font-size: 9px;

}


/* =========================================
   AMOUNT
========================================= */

.pk-amount-section {

    padding-top: 17px;

    border-top: 1px dashed #ddd;

}

.pk-amount-title {

    margin-bottom: 13px;

    color: #999;

    font-size: 9px;

    font-weight: 700;

    text-transform: uppercase;

}

.pk-amount-row {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 11px;

}

.pk-amount-row span {

    color: #777;

    font-size: 10px;

}

.pk-amount-row strong {

    color: #333;

    font-size: 11px;

}

.pk-amount-total {

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding-top: 14px;

    margin-top: 13px;

    border-top: 1px solid #eee;

}

.pk-amount-total span {

    font-size: 11px;

    font-weight: 700;

}

.pk-amount-total strong {

    color: #d32a6c;

    font-size: 18px;

    font-weight: 850;

}


/* =========================================
   PAYMENT METHODS
========================================= */

.pk-payment-methods {

    margin-bottom: 15px;

    border: 1px solid #e9e9ed;

    border-radius: 14px;

    overflow: hidden;

    background: #fff;

}

.pk-payment-method-title {

    padding: 20px;

    border-bottom: 1px solid #eee;

}


/* =========================================
   PAYMENT OPTION
========================================= */

.pk-payment-option {

    border-bottom: 1px solid #eee;

}

.pk-payment-option:last-child {

    border-bottom: 0;

}


/* HEADER */

.pk-payment-option-head {

    width: 100%;

    min-height: 68px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 15px;

    padding: 13px 18px;

    border: 0;

    background: #fff;

    text-align: left;

    cursor: pointer;

}

.pk-payment-option-head:hover {

    background: #fcfcfd;

}


/* LEFT */

.pk-payment-option-left {

    display: flex;

    align-items: center;

    gap: 12px;

}


/* RADIO */

.pk-radio {

    width: 19px;

    height: 19px;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    border: 1.5px solid #d5d5da;

    border-radius: 50%;

    color: #fff;

    font-size: 8px;

}

.pk-payment-option.active
.pk-radio {

    border-color: #d32a6c;

    background: #d32a6c;

}


/* TEXT */

.pk-payment-option-left strong {

    display: block;

    margin-bottom: 3px;

    color: #333;

    font-size: 12px;

}

.pk-payment-option-left small {

    display: block;

    color: #aaa;

    font-size: 9px;

}


/* ARROW */

.pk-option-arrow {

    color: #aaa;

    font-size: 9px;

    transition: .25s;

}

.pk-payment-option.active
.pk-option-arrow {

    transform: rotate(180deg);

    color: #d32a6c;

}


/* =========================================
   ACCORDION CONTENT
========================================= */

.pk-payment-option-content {

    display: none;

    padding: 0 18px 18px;

}

.pk-payment-option.active
.pk-payment-option-content {

    display: block;

    animation: pkPaymentOpen .25s ease;

}

@keyframes pkPaymentOpen {

    from {

        opacity: 0;

        transform: translateY(-5px);

    }

    to {

        opacity: 1;

        transform: translateY(0);

    }

}


/* =========================================
   UPI APPS
========================================= */

.pk-upi-apps {

    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 8px;

    margin-bottom: 16px;

}

.pk-upi-app {

    min-height: 68px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: 7px;

    border: 1px solid #e5e5e8;

    border-radius: 10px;

    background: #fff;

    cursor: pointer;

    transition: .2s;

}

.pk-upi-app:hover {

    border-color: #d32a6c;

    background: #fff8fb;

}

.pk-upi-app > span:last-child {

    color: #555;

    font-size: 9px;

    font-weight: 650;

}

.pk-upi-icon {

    width: 25px;

    height: 25px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 7px;

    font-size: 12px;

    font-weight: 800;

}

.pk-upi-icon.gpay {

    color: #4285f4;

    background: #f0f5ff;

}

.pk-upi-icon.phonepe {

    color: #6739b7;

    background: #f4efff;

}

.pk-upi-icon.paytm {

    color: #0095d9;

    background: #eefaff;

}


/* =========================================
   UPI INPUT
========================================= */

.pk-upi-input-wrap label,
.pk-card-input label {

    display: block;

    margin-bottom: 6px;

    color: #777;

    font-size: 9px;

    font-weight: 700;

}

.pk-upi-input {

    display: flex;

    height: 43px;

    border: 1px solid #dddfe3;

    border-radius: 9px;

    overflow: hidden;

}

.pk-upi-input input {

    flex: 1;

    min-width: 0;

    border: 0;

    outline: 0;

    padding: 0 12px;

    font-size: 11px;

}

.pk-upi-input button {

    padding: 0 14px;

    border: 0;

    background: #fff1f6;

    color: #d32a6c;

    font-size: 10px;

    font-weight: 700;

}


/* =========================================
   CARD INPUT
========================================= */

.pk-card-input {

    margin-bottom: 12px;

}

.pk-card-input input {

    width: 100%;

    height: 43px;

    padding: 0 12px;

    border: 1px solid #dddfe3;

    border-radius: 9px;

    outline: 0;

    font-size: 11px;

}

.pk-card-input input:focus,
.pk-bank-select:focus {

    border-color: #d32a6c;

    box-shadow:
        0 0 0 3px rgba(211,42,108,.07);

}

.pk-card-row {

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 10px;

}


/* =========================================
   BANK
========================================= */

.pk-bank-select {

    width: 100%;

    height: 44px;

    padding: 0 12px;

    border: 1px solid #dddfe3;

    border-radius: 9px;

    outline: 0;

    background: #fff;

    color: #555;

    font-size: 11px;

}


/* =========================================
   WALLET
========================================= */

.pk-wallet-list {

    display: grid;

    gap: 8px;

}

.pk-wallet-list button {

    width: 100%;

    padding: 12px;

    border: 1px solid #e5e5e8;

    border-radius: 9px;

    background: #fff;

    color: #555;

    text-align: left;

    font-size: 10px;

    font-weight: 650;

}


/* =========================================
   SECURITY
========================================= */

.pk-payment-security {

    display: flex;

    align-items: center;

    gap: 11px;

    padding: 13px;

    margin-bottom: 13px;

    border-radius: 11px;

    background: #f4faf7;

}

.pk-security-icon {

    width: 34px;

    height: 34px;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    border-radius: 9px;

    background: #fff;

    color: #269a68;

    font-size: 12px;

}

.pk-payment-security strong {

    display: block;

    margin-bottom: 2px;

    color: #333;

    font-size: 10px;

}

.pk-payment-security span {

    display: block;

    color: #999;

    font-size: 8px;

}


/* =========================================
   PAY BUTTON
========================================= */

.pk-pay-button {

    width: 100%;

    height: 52px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 9px;

    border: 0;

    border-radius: 11px;

    background:
        linear-gradient(
            135deg,
            #d32a6c,
            #bd205f
        );

    color: #fff;

    font-size: 13px;

    font-weight: 750;

    box-shadow:
        0 10px 25px rgba(211,42,108,.23);

    cursor: pointer;

    transition: .25s;

}

.pk-pay-button:hover {

    transform: translateY(-2px);

    box-shadow:
        0 14px 30px rgba(211,42,108,.3);

}

.pk-pay-button i {

    font-size: 10px;

}


/* =========================================
   FOOTER
========================================= */

.pk-payment-footer {

    margin: 12px 0 0;

    color: #aaa;

    text-align: center;

    font-size: 8px;

    line-height: 1.5;

}

.pk-payment-footer a {

    color: #888;

    text-decoration: underline;

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 575.98px) {

    .pk-payment-page {

        padding: 15px 12px 30px;

    }

    .pk-payable-box {

        padding: 23px 15px;

    }

    .pk-payable-box strong {

        font-size: 29px;

    }

    .pk-payment-card {

        padding: 17px;

    }

    .pk-payment-option-head {

        padding: 12px 15px;

    }

    .pk-payment-option-content {

        padding: 0 15px 16px;

    }

    .pk-upi-apps {

        gap: 6px;

    }

    .pk-upi-app {

        min-height: 63px;

    }

}



/* =========================================
   PKPL ACCOUNT DASHBOARD
========================================= */

.pk-account-page {
    min-height: 100vh;
    background: #f7f7f9;
    padding: 35px 0 70px;
    color: #202124;
}


/* =========================================
   HEADER
========================================= */

.pk-account-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 28px;
}

.pk-account-user {
    display: flex;
    align-items: center;
    gap: 14px;
}

.pk-account-avatar {
    width: 62px;
    height: 62px;
    position: relative;
    flex: 0 0 62px;
}

.pk-account-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 3px solid #fff;
    box-shadow: 0 4px 15px rgba(0,0,0,.08);
}

.pk-online-dot {
    position: absolute;
    right: 1px;
    bottom: 3px;

    width: 13px;
    height: 13px;

    border: 2px solid #fff;
    border-radius: 50%;
    background: #2caf72;
}

.pk-account-welcome {
    color: #d32a6c;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1.4px;
}

.pk-account-user h1 {
    margin: 5px 0 3px;
    font-size: 25px;
    font-weight: 800;
    letter-spacing: -.8px;
}

.pk-account-user p {
    margin: 0;
    color: #999;
    font-size: 10px;
}

.pk-account-header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pk-account-notification {
    position: relative;

    width: 40px;
    height: 40px;

    border: 1px solid #e6e6e9;
    border-radius: 9px;

    background: #fff;
    color: #555;

    cursor: pointer;
}

.pk-account-notification span {
    position: absolute;
    top: -5px;
    right: -5px;

    min-width: 16px;
    height: 16px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 2px solid #fff;
    border-radius: 50%;

    background: #d32a6c;
    color: #fff;

    font-size: 7px;
    font-weight: 700;
}

.pk-account-post-btn {
    height: 40px;

    display: inline-flex;
    align-items: center;
    gap: 7px;

    padding: 0 15px;

    border-radius: 9px;

    background: #d32a6c;
    color: #fff;

    font-size: 10px;
    font-weight: 700;

    text-decoration: none;

    box-shadow: 0 7px 18px rgba(211,42,108,.18);
}


/* =========================================
   SIDEBAR
========================================= */

.pk-account-sidebar {
    position: sticky;
    top: 20px;

    overflow: hidden;

    border: 1px solid #e7e7ea;
    border-radius: 13px;

    background: #fff;
}

.pk-account-side-profile {
    padding: 23px 15px 19px;

    text-align: center;

    border-bottom: 1px solid #eee;
}

.pk-side-avatar {
    width: 54px;
    height: 54px;

    margin: 0 auto 9px;

    overflow: hidden;

    border-radius: 50%;
}

.pk-side-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pk-account-side-profile strong {
    display: block;
    font-size: 11px;
}

.pk-account-side-profile span {
    display: block;

    margin-top: 4px;

    color: #269a68;

    font-size: 7px;
    font-weight: 700;
}

.pk-account-side-profile span i {
    margin-right: 3px;
}


/* =========================================
   MENU
========================================= */

.pk-account-menu {
    padding: 10px;
}

.pk-account-menu a {
    position: relative;

    min-height: 42px;

    display: flex;
    align-items: center;
    gap: 11px;

    padding: 0 11px;

    border-radius: 8px;

    color: #666;

    font-size: 10px;
    font-weight: 600;

    text-decoration: none;

    transition: .2s;
}

.pk-account-menu a:hover {
    background: #fff3f7;
    color: #d32a6c;
}

.pk-account-menu a.active {
    background: #fff0f5;
    color: #d32a6c;
    font-weight: 750;
}

.pk-account-menu a i {
    width: 17px;
    text-align: center;
    font-size: 12px;
}

.pk-account-menu a b {
    min-width: 20px;
    height: 19px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-left: auto;

    border-radius: 50px;

    background: #f1f1f3;

    color: #888;

    font-size: 7px;
}

.pk-account-menu a b.pink {
    background: #fff0f5;
    color: #d32a6c;
}

.pk-account-menu a b.message {
    background: #d32a6c;
    color: #fff;
}

.pk-account-menu-divider {
    height: 1px;
    margin: 9px 5px;

    background: #eee;
}

.pk-account-menu a.logout {
    margin-top: 5px;
    color: #c34c69;
}


/* =========================================
   STATS
========================================= */

.pk-dashboard-stats {
    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 12px;

    margin-bottom: 18px;
}

.pk-stat-card {
    display: flex;
    align-items: center;
    gap: 11px;

    padding: 15px;

    border: 1px solid #e7e7ea;
    border-radius: 11px;

    background: #fff;
}

.pk-stat-icon {
    width: 38px;
    height: 38px;

    flex: 0 0 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 9px;

    font-size: 13px;
}

.pk-stat-icon.ads {
    background: #fff0f5;
    color: #d32a6c;
}

.pk-stat-icon.booking {
    background: #edf7ff;
    color: #3185bb;
}

.pk-stat-icon.saved {
    background: #fff5ec;
    color: #d88939;
}

.pk-stat-icon.message {
    background: #effaf5;
    color: #269a68;
}

.pk-stat-card span {
    display: block;

    color: #aaa;

    font-size: 7px;
    font-weight: 800;

    letter-spacing: .7px;
}

.pk-stat-card strong {
    display: block;

    margin-top: 2px;

    font-size: 19px;
    line-height: 1;
}

.pk-stat-card small {
    display: block;

    margin-top: 4px;

    color: #aaa;

    font-size: 7px;
}

.pk-stat-card small b {
    color: #269a68;
}


/* =========================================
   DASHBOARD CARD
========================================= */

.pk-dashboard-card {
    margin-bottom: 18px;

    padding: 20px;

    border: 1px solid #e7e7ea;
    border-radius: 13px;

    background: #fff;
}

.pk-dashboard-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 15px;

    margin-bottom: 17px;
}

.pk-dashboard-card-head > div > span {
    color: #d32a6c;

    font-size: 7px;
    font-weight: 800;

    letter-spacing: 1.2px;
}

.pk-dashboard-card-head h2 {
    margin: 5px 0 0;

    font-size: 15px;
    font-weight: 750;
}

.pk-dashboard-card-head > a {
    color: #d32a6c;

    font-size: 8px;
    font-weight: 700;

    text-decoration: none;
}

.pk-dashboard-card-head > a i {
    margin-left: 3px;
}


/* =========================================
   UPCOMING BOOKING
========================================= */

.pk-upcoming-booking {
    display: flex;
    align-items: center;
    gap: 14px;

    padding: 11px;

    border: 1px solid #eee;

    border-radius: 10px;

    background: #fafafa;
}

.pk-upcoming-image {
    width: 105px;
    height: 85px;

    flex: 0 0 105px;

    overflow: hidden;

    border-radius: 8px;
}

.pk-upcoming-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pk-upcoming-info {
    flex: 1;
}

.pk-booking-status {
    display: inline-block;

    padding: 4px 7px;

    border-radius: 50px;

    background: #e9f8f1;

    color: #269a68;

    font-size: 7px;
    font-weight: 800;
}

.pk-upcoming-info h3 {
    margin: 7px 0 4px;

    font-size: 12px;
    font-weight: 750;
}

.pk-upcoming-info p {
    margin: 0;

    color: #999;

    font-size: 8px;
}

.pk-upcoming-info p i {
    color: #d32a6c;
    margin-right: 3px;
}

.pk-upcoming-meta {
    display: flex;
    gap: 12px;

    margin-top: 8px;
}

.pk-upcoming-meta span {
    color: #777;

    font-size: 8px;
}

.pk-upcoming-meta i {
    color: #d32a6c;
    margin-right: 3px;
}

.pk-upcoming-price {
    min-width: 105px;

    text-align: right;
}

.pk-upcoming-price span {
    display: block;

    color: #aaa;

    font-size: 7px;
    font-weight: 700;
}

.pk-upcoming-price strong {
    display: block;

    margin: 3px 0 6px;

    color: #d32a6c;

    font-size: 17px;
}

.pk-upcoming-price a {
    color: #d32a6c;

    font-size: 8px;
    font-weight: 700;

    text-decoration: none;
}


/* =========================================
   ADS
========================================= */

.pk-dashboard-ad {
    display: flex;
    align-items: center;
    gap: 12px;

    padding: 10px 0;

    border-bottom: 1px solid #eee;
}

.pk-dashboard-ad:last-child {
    border-bottom: 0;
}

.pk-dashboard-ad-image {
    width: 65px;
    height: 55px;

    flex: 0 0 65px;

    overflow: hidden;

    border-radius: 7px;
}

.pk-dashboard-ad-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pk-dashboard-ad-info {
    flex: 1;
}

.pk-dashboard-ad-info h3 {
    margin: 0 0 3px;

    font-size: 10px;
    font-weight: 700;
}

.pk-dashboard-ad-info p {
    margin: 0 0 5px;

    color: #999;

    font-size: 7px;
}

.pk-dashboard-ad-info span {
    display: inline-block;

    padding: 3px 6px;

    border-radius: 50px;

    font-size: 6px;
    font-weight: 700;
}

.pk-dashboard-ad-info span.active {
    background: #eaf8f1;
    color: #269a68;
}

.pk-dashboard-ad-info span.pending {
    background: #fff5e8;
    color: #cf841d;
}

.pk-dashboard-ad-price {
    min-width: 85px;
}

.pk-dashboard-ad-price strong {
    font-size: 10px;
}

.pk-dashboard-ad-price small {
    color: #aaa;
    font-size: 7px;
}

.pk-dashboard-ad-actions {
    display: flex;
    gap: 5px;
}

.pk-dashboard-ad-actions button {
    width: 29px;
    height: 29px;

    border: 1px solid #eee;
    border-radius: 7px;

    background: #fff;

    color: #777;

    font-size: 9px;

    cursor: pointer;
}

.pk-dashboard-ad-actions button:hover {
    border-color: #d32a6c;
    color: #d32a6c;
}


/* =========================================
   SMALL CARDS
========================================= */

.pk-small-card {
    height: 100%;
}

.pk-mini-list {
    display: flex;
    flex-direction: column;
}

.pk-mini-item {
    display: flex;
    align-items: center;
    gap: 9px;

    padding: 9px 0;

    border-bottom: 1px solid #eee;
}

.pk-mini-item:last-child {
    border-bottom: 0;
}

.pk-mini-image {
    width: 42px;
    height: 38px;

    flex: 0 0 42px;

    overflow: hidden;

    border-radius: 6px;
}

.pk-mini-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pk-mini-item > div:nth-child(2) {
    flex: 1;
}

.pk-mini-item strong {
    display: block;

    font-size: 9px;
}

.pk-mini-item small {
    display: block;

    margin-top: 3px;

    color: #999;

    font-size: 7px;
}

.pk-mini-item button {
    border: 0;

    background: transparent;

    color: #d32a6c;

    cursor: pointer;
}


/* =========================================
   MESSAGES
========================================= */

.pk-message-item {
    display: flex;
    align-items: center;
    gap: 9px;

    padding: 9px 0;

    border-bottom: 1px solid #eee;
}

.pk-message-item:last-child {
    border-bottom: 0;
}

.pk-message-avatar {
    width: 37px;
    height: 37px;

    flex: 0 0 37px;

    overflow: hidden;

    border-radius: 50%;
}

.pk-message-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pk-message-item > div:nth-child(2) {
    flex: 1;
}

.pk-message-item strong {
    display: block;

    font-size: 9px;
}

.pk-message-item small {
    display: block;

    overflow: hidden;

    margin-top: 3px;

    color: #999;

    font-size: 7px;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.pk-message-item > span {
    align-self: flex-start;

    color: #aaa;

    font-size: 7px;
}


/* =========================================
   PROFILE COMPLETION
========================================= */

.pk-profile-completion {
    display: flex;
    align-items: center;
    gap: 13px;

    padding: 16px;

    border: 1px solid #f0d8e2;

    border-radius: 11px;

    background:
        linear-gradient(
            100deg,
            #fff6f9,
            #fff
        );
}

.pk-completion-icon {
    width: 40px;
    height: 40px;

    flex: 0 0 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 9px;

    background: #fff0f5;

    color: #d32a6c;
}

.pk-completion-content {
    flex: 1;
}

.pk-completion-title {
    display: flex;
    justify-content: space-between;

    margin-bottom: 7px;
}

.pk-completion-title strong {
    font-size: 10px;
}

.pk-completion-title span {
    color: #d32a6c;

    font-size: 9px;
    font-weight: 800;
}

.pk-progress {
    height: 5px;

    overflow: hidden;

    border-radius: 50px;

    background: #eee;
}

.pk-progress span {
    display: block;

    height: 100%;

    border-radius: inherit;

    background: #d32a6c;
}

.pk-completion-content p {
    margin: 6px 0 0;

    color: #999;

    font-size: 7px;
}

.pk-profile-completion > a {
    color: #d32a6c;

    font-size: 8px;
    font-weight: 700;

    text-decoration: none;
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 991.98px) {

    .pk-account-sidebar {
        position: static;
        margin-bottom: 0;
    }

    .pk-dashboard-stats {
        grid-template-columns: repeat(2, 1fr);
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 575.98px) {

    .pk-account-page {
        padding: 20px 0 85px;
    }

    .pk-account-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .pk-account-user h1 {
        font-size: 21px;
    }

    .pk-account-user p {
        line-height: 1.5;
    }

    .pk-account-header-actions {
        width: 100%;
    }

    .pk-account-post-btn {
        flex: 1;
        justify-content: center;
    }


    /* SIDEBAR */

    .pk-account-sidebar {
        border-radius: 11px;
    }

    .pk-account-side-profile {
        display: flex;
        align-items: center;
        text-align: left;
        gap: 10px;
        padding: 13px;
    }

    .pk-side-avatar {
        width: 42px;
        height: 42px;
        margin: 0;
    }

    .pk-account-side-profile > div {
        flex: 1;
    }


    .pk-account-menu {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 3px;
    }

    .pk-account-menu-divider {
        display: none;
    }

    .pk-account-menu a {
        min-height: 38px;
        padding: 0 8px;
    }


    /* STATS */

    .pk-dashboard-stats {
        gap: 8px;
    }

    .pk-stat-card {
        padding: 11px;
    }

    .pk-stat-icon {
        width: 32px;
        height: 32px;
        flex-basis: 32px;
        font-size: 11px;
    }

    .pk-stat-card strong {
        font-size: 16px;
    }


    /* CARDS */

    .pk-dashboard-card {
        padding: 15px;
        border-radius: 11px;
    }


    /* BOOKING */

    .pk-upcoming-booking {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .pk-upcoming-info {
        min-width: calc(100% - 120px);
    }

    .pk-upcoming-price {
        width: 100%;
        padding-top: 8px;

        display: flex;
        align-items: center;
        justify-content: space-between;

        border-top: 1px solid #eee;
    }


    /* ADS */

    .pk-dashboard-ad-price {
        display: none;
    }

    .pk-dashboard-ad-image {
        width: 55px;
        height: 48px;
        flex-basis: 55px;
    }


    /* PROFILE */

    .pk-profile-completion {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .pk-profile-completion > a {
        width: 100%;
        margin-left: 53px;
    }

}




/* =========================================
   PKPL MY BOOKINGS
========================================= */

.pk-bookings-page {

    min-height: 100vh;

    padding: 45px 0 70px;

    background: #f7f7f9;

    color: #202124;

}


/* =========================================
   HEADER
========================================= */

.pk-bookings-header {

    margin-bottom: 30px;

}

.pk-bookings-eyebrow {

    display: block;

    margin-bottom: 6px;

    color: #d32a6c;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 1.6px;

}

.pk-bookings-header h1 {

    margin: 0 0 7px;

    font-size: 34px;

    font-weight: 850;

    letter-spacing: -1.2px;

}

.pk-bookings-header p {

    margin: 0;

    color: #888;

    font-size: 12px;

}


/* =========================================
   TABS
========================================= */

.pk-booking-tabs {

    display: flex;

    align-items: center;

    gap: 6px;

    padding: 5px;

    margin-bottom: 30px;

    width: fit-content;

    border: 1px solid #e8e8ed;

    border-radius: 11px;

    background: #fff;

}

.pk-booking-tab {

    display: flex;

    align-items: center;

    gap: 7px;

    padding: 10px 17px;

    border: 0;

    border-radius: 7px;

    background: transparent;

    color: #888;

    font-size: 10px;

    font-weight: 700;

    cursor: pointer;

    transition: .2s;

}

.pk-booking-tab:hover {

    color: #333;

}

.pk-booking-tab span {

    min-width: 17px;

    height: 17px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    border-radius: 20px;

    background: #f1f1f4;

    color: #888;

    font-size: 8px;

}

.pk-booking-tab.active {

    background: #d32a6c;

    color: #fff;

    box-shadow:
        0 5px 15px rgba(211,42,108,.18);

}

.pk-booking-tab.active span {

    background: rgba(255,255,255,.18);

    color: #fff;

}


/* =========================================
   TAB CONTENT
========================================= */

.pk-booking-tab-content {

    display: none;

}

.pk-booking-tab-content.active {

    display: block;

    animation: pkBookingFade .25s ease;

}

@keyframes pkBookingFade {

    from {

        opacity: 0;

        transform: translateY(6px);

    }

    to {

        opacity: 1;

        transform: translateY(0);

    }

}


/* =========================================
   SECTION TITLE
========================================= */

.pk-booking-section-title {

    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    margin-bottom: 15px;

}

.pk-booking-section-title span:first-child {

    display: block;

    margin-bottom: 4px;

    color: #aaa;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.3px;

}

.pk-booking-section-title h2 {

    margin: 0;

    font-size: 18px;

    font-weight: 800;

}

.pk-booking-count {

    color: #999;

    font-size: 10px;

}


/* =========================================
   BOOKING CARD
========================================= */

.pk-my-booking-card {

    padding: 23px;

    border: 1px solid #e8e8ed;

    border-radius: 15px;

    background: #fff;

    box-shadow:
        0 6px 25px rgba(20,20,30,.04);

}


/* =========================================
   TOP
========================================= */

.pk-my-booking-top {

    display: flex;

    align-items: flex-start;

    justify-content: space-between;

    gap: 20px;

}

.pk-my-booking-service {

    display: flex;

    align-items: center;

    gap: 14px;

}

.pk-my-booking-icon {

    width: 53px;
    height: 53px;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    border-radius: 13px;

    background: #fff1f6;

    color: #d32a6c;

    font-size: 18px;

}

.pk-booking-type {

    display: block;

    margin-bottom: 4px;

    color: #aaa;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.1px;

}

.pk-my-booking-service h3 {

    margin: 0 0 5px;

    color: #292929;

    font-size: 17px;

    font-weight: 800;

}

.pk-my-booking-service p {

    display: flex;

    align-items: center;

    gap: 6px;

    margin: 0;

    color: #999;

    font-size: 9px;

}

.pk-my-booking-service p i {

    color: #f5a623;

}

.pk-my-booking-service p span {

    color: #ccc;

}


/* =========================================
   STATUS
========================================= */

.pk-booking-status {

    display: inline-flex;

    align-items: center;

    gap: 6px;

    padding: 7px 10px;

    border-radius: 20px;

    font-size: 9px;

    font-weight: 700;

}

.pk-booking-status.confirmed {

    background: #edf9f3;

    color: #269a68;

}

.pk-booking-status i {

    font-size: 6px;

}


/* =========================================
   DIVIDER
========================================= */

.pk-booking-divider {

    height: 1px;

    margin: 21px 0;

    background: #eee;

}


/* =========================================
   DETAILS GRID
========================================= */

.pk-my-booking-details {

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 15px;

}

.pk-booking-detail {

    display: flex;

    align-items: center;

    gap: 9px;

}

.pk-booking-detail-icon {

    width: 32px;
    height: 32px;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    border-radius: 8px;

    background: #f8f8fa;

    color: #888;

    font-size: 10px;

}

.pk-booking-detail span {

    display: block;

    margin-bottom: 3px;

    color: #aaa;

    font-size: 7px;

    font-weight: 700;

    letter-spacing: .5px;

}

.pk-booking-detail strong {

    display: block;

    color: #444;

    font-size: 10px;

    font-weight: 700;

}


/* =========================================
   BOTTOM
========================================= */

.pk-my-booking-bottom {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 15px;

    padding-top: 18px;

    margin-top: 20px;

    border-top: 1px solid #eee;

}

.pk-booking-id {

    color: #aaa;

    font-size: 8px;

}

.pk-booking-id strong {

    margin-left: 5px;

    color: #777;

    font-size: 9px;

}

.pk-view-booking {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    min-height: 36px;

    padding: 0 15px;

    border: 1px solid #e5e5e9;

    border-radius: 8px;

    background: #fff;

    color: #555;

    font-size: 9px;

    font-weight: 700;

    text-decoration: none;

    transition: .2s;

}

.pk-view-booking:hover {

    border-color: #d32a6c;

    background: #fff5f8;

    color: #d32a6c;

}

.pk-view-booking i {

    font-size: 8px;

    transition: .2s;

}

.pk-view-booking:hover i {

    transform: translateX(3px);

}


/* =========================================
   EMPTY STATE
========================================= */

.pk-empty-bookings {

    padding: 65px 20px;

    border: 1px solid #e8e8ed;

    border-radius: 15px;

    background: #fff;

    text-align: center;

}

.pk-empty-icon {

    width: 55px;
    height: 55px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin: 0 auto 15px;

    border-radius: 14px;

    background: #fff1f6;

    color: #d32a6c;

    font-size: 20px;

}

.pk-empty-bookings h3 {

    margin: 0 0 6px;

    font-size: 15px;

    font-weight: 800;

}

.pk-empty-bookings p {

    margin: 0;

    color: #999;

    font-size: 10px;

}


/* =========================================
   TABLET
========================================= */

@media (max-width: 991.98px) {

    .pk-my-booking-details {

        grid-template-columns:
            repeat(2, 1fr);

        gap: 18px;

    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 575.98px) {

    .pk-bookings-page {

        padding: 25px 0 45px;

    }

    .pk-bookings-header {

        margin-bottom: 20px;

    }

    .pk-bookings-header h1 {

        font-size: 27px;

    }

    .pk-bookings-header p {

        font-size: 10px;

    }

    .pk-booking-tabs {

        width: 100%;

        margin-bottom: 24px;

    }

    .pk-booking-tab {

        flex: 1;

        justify-content: center;

        padding: 10px 7px;

        font-size: 9px;

    }

    .pk-my-booking-card {

        padding: 17px;

        border-radius: 13px;

    }

    .pk-my-booking-top {

        display: block;

    }

    .pk-booking-status {

        margin-top: 15px;

    }

    .pk-my-booking-details {

        grid-template-columns: 1fr 1fr;

        gap: 18px 10px;

    }

    .pk-booking-detail {

        align-items: flex-start;

    }

    .pk-booking-detail strong {

        font-size: 9px;

    }

    .pk-booking-section-title {

        align-items: center;

    }

    .pk-my-booking-bottom {

        align-items: flex-start;

    }

    .pk-booking-id {

        line-height: 1.6;

    }

    .pk-booking-id strong {

        display: block;

        margin-left: 0;

    }

}


/* =========================================
   PKPL ACCOUNT DASHBOARD
========================================= */

.pk-account-page {

    min-height: 100vh;

    padding: 45px 0 70px;

    background: #f7f7f9;

    color: #202124;

}


/* =========================================
   HEADER
========================================= */

.pk-account-page-header {

    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    gap: 25px;

    margin-bottom: 28px;

}

.pk-account-overline {

    display: block;

    margin-bottom: 6px;

    color: #d32a6c;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 1.6px;

}

.pk-account-page-header h1 {

    margin: 0 0 6px;

    font-size: 34px;

    line-height: 1;

    font-weight: 850;

    letter-spacing: -1.3px;

}

.pk-account-page-header p {

    margin: 0;

    color: #8d8d94;

    font-size: 11px;

}


/* POST BUTTON */

.pk-account-post-btn {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    min-height: 40px;

    padding: 0 17px;

    border-radius: 8px;

    background: #d32a6c;

    color: #fff;

    font-size: 10px;

    font-weight: 700;

    text-decoration: none;

    box-shadow:
        0 7px 18px rgba(211,42,108,.20);

    transition: .2s;

}

.pk-account-post-btn:hover {

    background: #b9215b;

    color: #fff;

    transform: translateY(-1px);

}


/* =========================================
   PROFILE CARD
========================================= */

.pk-account-profile-card {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 25px;

    padding: 24px;

    margin-bottom: 18px;

    border: 1px solid #e8e8ed;

    border-radius: 15px;

    background: #fff;

    box-shadow:
        0 6px 25px rgba(25,25,35,.035);

}

.pk-account-profile-main {

    display: flex;

    align-items: center;

    gap: 17px;

}


/* AVATAR */

.pk-account-avatar-wrap {

    position: relative;

    flex-shrink: 0;

}

.pk-account-avatar {

    width: 70px;

    height: 70px;

    display: flex;

    align-items: center;

    justify-content: center;

    border: 3px solid #fff;

    border-radius: 50%;

    background:
        linear-gradient(
            135deg,
            #ededf0,
            #d8d8dc
        );

    color: #929297;

    font-size: 25px;

    box-shadow:
        0 4px 16px rgba(0,0,0,.10);

}

.pk-account-avatar-check {

    position: absolute;

    right: 0;

    bottom: 1px;

    width: 21px;

    height: 21px;

    display: flex;

    align-items: center;

    justify-content: center;

    border: 3px solid #fff;

    border-radius: 50%;

    background: #269a68;

    color: #fff;

    font-size: 7px;

}


/* PROFILE INFO */

.pk-account-name-row {

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 8px;

    margin-bottom: 7px;

}

.pk-account-name-row h2 {

    margin: 0;

    font-size: 20px;

    font-weight: 800;

    letter-spacing: -.3px;

}

.pk-account-verified {

    display: inline-flex;

    align-items: center;

    gap: 4px;

    padding: 4px 7px;

    border-radius: 20px;

    background: #edf9f3;

    color: #269a68;

    font-size: 7px;

    font-weight: 800;

}

.pk-account-mobile,
.pk-account-member {

    display: inline-flex;

    align-items: center;

    gap: 6px;

    margin: 0 12px 0 0;

    color: #888;

    font-size: 9px;

}

.pk-account-mobile i,
.pk-account-member i {

    color: #aaa;

    font-size: 8px;

}


/* EDIT */

.pk-account-edit-btn {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 7px;

    min-height: 36px;

    padding: 0 13px;

    border: 1px solid #e3e3e7;

    border-radius: 8px;

    color: #555;

    font-size: 9px;

    font-weight: 700;

    text-decoration: none;

    transition: .2s;

}

.pk-account-edit-btn:hover {

    border-color: #d32a6c;

    background: #fff6f9;

    color: #d32a6c;

}


/* =========================================
   QUICK STATS
========================================= */

.pk-account-stats {

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 12px;

    margin-bottom: 30px;

}

.pk-account-stat {

    position: relative;

    display: flex;

    align-items: center;

    gap: 11px;

    min-height: 78px;

    padding: 14px;

    border: 1px solid #e8e8ed;

    border-radius: 12px;

    background: #fff;

    text-decoration: none;

    box-shadow:
        0 4px 18px rgba(20,20,30,.025);

    transition: .2s;

}

.pk-account-stat:hover {

    border-color: #dddde3;

    transform: translateY(-2px);

    box-shadow:
        0 8px 25px rgba(20,20,30,.06);

}

.pk-account-stat-icon {

    width: 37px;

    height: 37px;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    border-radius: 9px;

    font-size: 12px;

}

.pk-account-stat-icon.pink {

    background: #fff0f5;

    color: #d32a6c;

}

.pk-account-stat-icon.blue {

    background: #edf4ff;

    color: #3e79d5;

}

.pk-account-stat-icon.purple {

    background: #f3efff;

    color: #7651c7;

}

.pk-account-stat-icon.green {

    background: #edf9f3;

    color: #269a68;

}

.pk-account-stat strong {

    display: block;

    margin-bottom: 2px;

    color: #292929;

    font-size: 17px;

    line-height: 1;

    font-weight: 800;

}

.pk-account-stat span {

    display: block;

    color: #999;

    font-size: 8px;

    font-weight: 600;

}

.pk-account-stat-arrow {

    position: absolute;

    top: 13px;

    right: 13px;

    color: #ccc;

    font-size: 7px;

}


/* =========================================
   MENU SECTION
========================================= */

.pk-account-menu-section {

    margin-bottom: 27px;

}

.pk-account-menu-heading {

    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    margin-bottom: 10px;

}

.pk-account-menu-heading span,
.pk-account-side-heading span {

    display: block;

    margin-bottom: 3px;

    color: #aaa;

    font-size: 7px;

    font-weight: 800;

    letter-spacing: 1.3px;

}

.pk-account-menu-heading h3,
.pk-account-side-heading h3 {

    margin: 0;

    font-size: 16px;

    font-weight: 800;

}

.pk-account-menu-heading > a {

    display: inline-flex;

    align-items: center;

    gap: 6px;

    color: #d32a6c;

    font-size: 8px;

    font-weight: 700;

    text-decoration: none;

}


/* =========================================
   MENU CARD
========================================= */

.pk-account-menu-card {

    overflow: hidden;

    border: 1px solid #e8e8ed;

    border-radius: 13px;

    background: #fff;

    box-shadow:
        0 5px 20px rgba(20,20,30,.025);

}

.pk-account-menu-item {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 15px;

    min-height: 67px;

    padding: 10px 15px;

    border-bottom: 1px solid #eeeeF1;

    color: #333;

    text-decoration: none;

    transition: .2s;

}

.pk-account-menu-item:last-child {

    border-bottom: 0;

}

.pk-account-menu-item:hover {

    background: #fcf9fb;

}

.pk-account-menu-item-left {

    display: flex;

    align-items: center;

    gap: 11px;

    min-width: 0;

}

.pk-account-menu-icon {

    width: 36px;

    height: 36px;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    border-radius: 9px;

    font-size: 11px;

}

.pk-account-menu-icon.pink {

    background: #fff0f5;

    color: #d32a6c;

}

.pk-account-menu-icon.blue {

    background: #edf4ff;

    color: #3975d0;

}

.pk-account-menu-icon.purple {

    background: #f3efff;

    color: #7550c5;

}

.pk-account-menu-icon.green {

    background: #edf9f3;

    color: #269a68;

}

.pk-account-menu-icon.orange {

    background: #fff5e8;

    color: #d88920;

}

.pk-account-menu-icon.post {

    background: #d32a6c;

    color: #fff;

}

.pk-account-menu-text strong {

    display: block;

    margin-bottom: 3px;

    color: #333;

    font-size: 10px;

    font-weight: 750;

}

.pk-account-menu-text span {

    display: block;

    color: #a0a0a5;

    font-size: 8px;

}

.pk-account-menu-right {

    display: flex;

    align-items: center;

    gap: 10px;

    flex-shrink: 0;

}

.pk-account-menu-right > i {

    color: #c2c2c6;

    font-size: 8px;

    transition: .2s;

}

.pk-account-menu-item:hover
.pk-account-menu-right > i {

    color: #d32a6c;

    transform: translateX(3px);

}

.pk-account-number {

    min-width: 22px;

    height: 20px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    border-radius: 6px;

    background: #f4f4f6;

    color: #888;

    font-size: 7px;

    font-weight: 800;

}

.pk-account-number.unread {

    background: #fff0f5;

    color: #d32a6c;

}


/* =========================================
   POST AD
========================================= */

.pk-post-ad-row {

    background:
        linear-gradient(
            90deg,
            #fff8fb,
            #fff
        );

}


/* =========================================
   SIDEBAR
========================================= */

.pk-account-side-section {

    margin-bottom: 22px;

}

.pk-account-side-heading {

    margin-bottom: 10px;

}

.pk-account-side-card {

    overflow: hidden;

    border: 1px solid #e8e8ed;

    border-radius: 13px;

    background: #fff;

}

.pk-account-side-item {

    min-height: 55px;

    display: flex;

    align-items: center;

    gap: 10px;

    padding: 8px 12px;

    border-bottom: 1px solid #eee;

    color: #444;

    text-decoration: none;

    transition: .2s;

}

.pk-account-side-item:last-child {

    border-bottom: 0;

}

.pk-account-side-item:hover {

    background: #fcf9fb;

    color: #d32a6c;

}

.pk-account-side-icon {

    width: 31px;

    height: 31px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 8px;

    background: #f5f5f7;

    color: #777;

    font-size: 10px;

}

.pk-account-side-item:hover
.pk-account-side-icon {

    background: #fff0f5;

    color: #d32a6c;

}

.pk-account-side-item span {

    flex: 1;

    font-size: 9px;

    font-weight: 700;

}

.pk-account-side-item > i {

    color: #c1c1c5;

    font-size: 7px;

}


/* =========================================
   SECURITY CARD
========================================= */

.pk-account-security {

    display: flex;

    align-items: center;

    gap: 10px;

    padding: 13px;

    margin-bottom: 12px;

    border: 1px solid #dff0e7;

    border-radius: 11px;

    background: #f5fbf8;

}

.pk-account-security-icon {

    width: 33px;

    height: 33px;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    border-radius: 8px;

    background: #e2f5eb;

    color: #269a68;

    font-size: 11px;

}

.pk-account-security strong {

    display: block;

    margin-bottom: 2px;

    color: #35765a;

    font-size: 9px;

}

.pk-account-security p {

    margin: 0;

    color: #7b9a8a;

    font-size: 7px;

    line-height: 1.4;

}

.pk-account-security > i {

    margin-left: auto;

    color: #269a68;

    font-size: 9px;

}


/* =========================================
   LOGOUT
========================================= */

.pk-account-logout {

    min-height: 48px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 7px 12px;

    border: 1px solid #f1dce4;

    border-radius: 10px;

    background: #fff;

    color: #d32a6c;

    text-decoration: none;

    transition: .2s;

}

.pk-account-logout:hover {

    background: #fff5f8;

    border-color: #eac3d1;

    color: #c32461;

}

.pk-account-logout span {

    display: flex;

    align-items: center;

    gap: 8px;

    font-size: 9px;

    font-weight: 750;

}

.pk-account-logout span i {

    width: 28px;

    height: 28px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 7px;

    background: #fff0f5;

    font-size: 9px;

}

.pk-account-logout > i {

    color: #d49aaa;

    font-size: 7px;

}


/* =========================================
   TABLET
========================================= */

@media (max-width: 991.98px) {

    .pk-account-stats {

        grid-template-columns:
            repeat(2, 1fr);

    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 575.98px) {

    .pk-account-page {

        padding: 25px 0 45px;

    }

    .pk-account-page-header {

        display: block;

        margin-bottom: 20px;

    }

    .pk-account-page-header h1 {

        font-size: 28px;

    }

    .pk-account-page-header p {

        font-size: 9px;

    }

    .pk-account-post-btn {

        margin-top: 15px;

    }

    .pk-account-profile-card {

        display: block;

        padding: 18px;

        border-radius: 13px;

    }

    .pk-account-profile-main {

        gap: 12px;

    }

    .pk-account-avatar {

        width: 58px;

        height: 58px;

        font-size: 20px;

    }

    .pk-account-name-row {

        gap: 5px;

    }

    .pk-account-name-row h2 {

        font-size: 16px;

    }

    .pk-account-mobile,
    .pk-account-member {

        font-size: 8px;

    }

    .pk-account-profile-actions {

        margin-top: 16px;

    }

    .pk-account-edit-btn {

        width: 100%;

    }

    .pk-account-stats {

        grid-template-columns:
            repeat(2, 1fr);

        gap: 8px;

        margin-bottom: 25px;

    }

    .pk-account-stat {

        min-height: 68px;

        padding: 10px;

    }

    .pk-account-stat-icon {

        width: 32px;

        height: 32px;

        font-size: 10px;

    }

    .pk-account-stat strong {

        font-size: 15px;

    }

    .pk-account-stat span {

        font-size: 7px;

    }

    .pk-account-menu-item {

        min-height: 62px;

        padding: 9px 11px;

    }

    .pk-account-menu-icon {

        width: 34px;

        height: 34px;

    }

    .pk-account-menu-text strong {

        font-size: 9px;

    }

    .pk-account-menu-text span {

        font-size: 7px;

    }

    .pk-account-number {

        display: none;

    }

    .pk-account-security {

        margin-top: 5px;

    }

}



/* =========================================
   PKPL SELLER MY ADS
========================================= */

.pk-seller-ads-page {

    min-height: 100vh;

    padding: 42px 0 70px;

    background: #f7f7f9;

    color: #202124;

}


/* =========================================
   HEADER
========================================= */

.pk-seller-ads-header {

    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    gap: 20px;

    margin-bottom: 28px;

}

.pk-seller-ads-overline {

    display: block;

    margin-bottom: 6px;

    color: #d32a6c;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.7px;

}

.pk-seller-ads-header h1 {

    margin: 0 0 6px;

    font-size: 34px;

    line-height: 1;

    font-weight: 850;

    letter-spacing: -1.3px;

}

.pk-seller-ads-header p {

    margin: 0;

    color: #8e8e94;

    font-size: 11px;

}

.pk-seller-post-btn {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 7px;

    min-height: 40px;

    padding: 0 17px;

    border-radius: 8px;

    background: #d32a6c;

    color: #fff;

    font-size: 9px;

    font-weight: 750;

    text-decoration: none;

    box-shadow:
        0 7px 18px rgba(211,42,108,.2);

    transition: .2s;

}

.pk-seller-post-btn:hover {

    background: #b9215b;

    color: #fff;

    transform: translateY(-1px);

}


/* =========================================
   SUMMARY
========================================= */

.pk-seller-summary {

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 12px;

    margin-bottom: 25px;

}

.pk-seller-summary-item {

    display: flex;

    align-items: center;

    gap: 11px;

    min-height: 74px;

    padding: 13px;

    border: 1px solid #e8e8ed;

    border-radius: 12px;

    background: #fff;

    box-shadow:
        0 4px 18px rgba(20,20,30,.025);

}

.pk-seller-summary-icon {

    width: 37px;

    height: 37px;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    border-radius: 9px;

    font-size: 11px;

}

.pk-seller-summary-icon.pink {

    background: #fff0f5;

    color: #d32a6c;

}

.pk-seller-summary-icon.green {

    background: #edf9f3;

    color: #269a68;

}

.pk-seller-summary-icon.orange {

    background: #fff5e8;

    color: #d88920;

}

.pk-seller-summary-icon.gray {

    background: #f0f0f2;

    color: #777;

}

.pk-seller-summary-item strong {

    display: block;

    margin-bottom: 3px;

    color: #292929;

    font-size: 17px;

    line-height: 1;

    font-weight: 800;

}

.pk-seller-summary-item span {

    color: #999;

    font-size: 8px;

    font-weight: 600;

}


/* =========================================
   TOOLBAR
========================================= */

.pk-seller-toolbar {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 12px;

    padding: 12px;

    margin-bottom: 13px;

    border: 1px solid #e8e8ed;

    border-radius: 12px;

    background: #fff;

}

.pk-seller-search {

    position: relative;

    width: 300px;

}

.pk-seller-search > i {

    position: absolute;

    top: 50%;

    left: 12px;

    color: #aaa;

    font-size: 9px;

    transform: translateY(-50%);

}

.pk-seller-search input {

    width: 100%;

    height: 36px;

    padding: 0 12px 0 31px;

    border: 1px solid #e9e9ed;

    border-radius: 7px;

    outline: none;

    background: #fafafd;

    color: #444;

    font-size: 9px;

}

.pk-seller-search input:focus {

    border-color: #dba0b7;

    background: #fff;

}

.pk-seller-toolbar-right {

    display: flex;

    align-items: center;

    gap: 8px;

}

.pk-seller-select {

    height: 36px;

    padding: 0 28px 0 10px;

    border: 1px solid #e9e9ed;

    border-radius: 7px;

    outline: none;

    background: #fafafd;

    color: #666;

    font-size: 8px;

}

.pk-seller-filter-btn {

    height: 36px;

    display: inline-flex;

    align-items: center;

    gap: 6px;

    padding: 0 11px;

    border: 1px solid #e5e5e9;

    border-radius: 7px;

    background: #fff;

    color: #666;

    font-size: 8px;

    font-weight: 700;

}


/* =========================================
   TABS
========================================= */

.pk-seller-tabs {

    display: flex;

    align-items: center;

    gap: 4px;

    width: fit-content;

    padding: 4px;

    margin-bottom: 15px;

    border: 1px solid #e8e8ed;

    border-radius: 9px;

    background: #fff;

}

.pk-seller-tab {

    display: flex;

    align-items: center;

    gap: 7px;

    min-height: 32px;

    padding: 0 13px;

    border: 0;

    border-radius: 6px;

    background: transparent;

    color: #888;

    font-size: 8px;

    font-weight: 750;

    cursor: pointer;

}

.pk-seller-tab span {

    min-width: 18px;

    height: 17px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    border-radius: 5px;

    background: #f1f1f4;

    color: #888;

    font-size: 7px;

}

.pk-seller-tab.active {

    background: #d32a6c;

    color: #fff;

    box-shadow:
        0 4px 12px rgba(211,42,108,.16);

}

.pk-seller-tab.active span {

    background: rgba(255,255,255,.2);

    color: #fff;

}


/* =========================================
   TAB CONTENT
========================================= */

.pk-seller-tab-content {

    display: none;

}

.pk-seller-tab-content.active {

    display: block;

    animation: pkSellerFade .25s ease;

}

@keyframes pkSellerFade {

    from {

        opacity: 0;

        transform: translateY(5px);

    }

    to {

        opacity: 1;

        transform: translateY(0);

    }

}


/* =========================================
   AD CARD
========================================= */

.pk-seller-ad-card {

    display: flex;

    min-height: 230px;

    margin-bottom: 13px;

    overflow: hidden;

    border: 1px solid #e6e6eb;

    border-radius: 14px;

    background: #fff;

    box-shadow:
        0 5px 22px rgba(20,20,30,.035);

    transition: .2s;

}

.pk-seller-ad-card:hover {

    border-color: #dddde3;

    box-shadow:
        0 9px 28px rgba(20,20,30,.06);

}


/* =========================================
   IMAGE
========================================= */

.pk-seller-ad-image {

    position: relative;

    width: 235px;

    flex-shrink: 0;

    overflow: hidden;

    background: #eee;

}

.pk-seller-ad-image img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

    transition: .4s;

}

.pk-seller-ad-card:hover
.pk-seller-ad-image img {

    transform: scale(1.04);

}

.pk-seller-featured-badge {

    position: absolute;

    top: 12px;

    left: 12px;

    display: inline-flex;

    align-items: center;

    gap: 5px;

    padding: 6px 8px;

    border-radius: 6px;

    background: rgba(30,30,35,.85);

    color: #fff;

    font-size: 7px;

    font-weight: 750;

    backdrop-filter: blur(5px);

}

.pk-seller-featured-badge i {

    color: #f6b52c;

}


/* =========================================
   CONTENT
========================================= */

.pk-seller-ad-content {

    flex: 1;

    min-width: 0;

    padding: 20px;

}

.pk-seller-ad-top {

    display: flex;

    align-items: flex-start;

    justify-content: space-between;

    gap: 15px;

}

.pk-seller-ad-category {

    display: block;

    margin-bottom: 5px;

    color: #d32a6c;

    font-size: 7px;

    font-weight: 800;

    letter-spacing: 1.1px;

}

.pk-seller-ad-top h2 {

    margin: 0 0 5px;

    color: #292929;

    font-size: 18px;

    font-weight: 800;

}

.pk-seller-ad-location {

    display: flex;

    align-items: center;

    gap: 5px;

    margin: 0;

    color: #999;

    font-size: 8px;

}

.pk-seller-ad-location i {

    color: #aaa;

    font-size: 8px;

}


/* STATUS */

.pk-seller-status {

    display: inline-flex;

    align-items: center;

    gap: 5px;

    flex-shrink: 0;

    padding: 6px 9px;

    border-radius: 20px;

    font-size: 7px;

    font-weight: 750;

}

.pk-seller-status.active {

    background: #edf9f3;

    color: #269a68;

}

.pk-seller-status i {

    font-size: 5px;

}


/* =========================================
   PRICE
========================================= */

.pk-seller-price {

    margin-top: 13px;

    color: #252525;

    font-size: 18px;

    font-weight: 850;

}

.pk-seller-price span {

    color: #999;

    font-size: 8px;

    font-weight: 500;

}


/* =========================================
   AD STATS
========================================= */

.pk-seller-ad-stats {

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 8px;

    padding: 13px 0;

    margin-top: 12px;

    border-top: 1px solid #eee;

    border-bottom: 1px solid #eee;

}

.pk-seller-ad-stats > div {

    display: flex;

    align-items: center;

    gap: 7px;

}

.pk-seller-ad-stats > div > i {

    width: 27px;

    height: 27px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 7px;

    background: #f6f6f8;

    color: #999;

    font-size: 9px;

}

.pk-seller-ad-stats strong {

    display: block;

    color: #444;

    font-size: 10px;

    font-weight: 800;

}

.pk-seller-ad-stats span {

    display: block;

    color: #aaa;

    font-size: 6px;

}

.pk-seller-ad-stats
.pk-seller-ad-stats > div:last-child > i {

    background: #edf9f3;

    color: #269a68;

}


/* =========================================
   ACTIONS
========================================= */

.pk-seller-ad-actions {

    display: flex;

    align-items: center;

    gap: 7px;

    margin-top: 13px;

}

.pk-seller-edit-btn,
.pk-seller-promote-btn,
.pk-seller-more-btn {

    height: 32px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 6px;

    padding: 0 11px;

    border-radius: 7px;

    font-size: 7px;

    font-weight: 750;

    text-decoration: none;

    transition: .2s;

}

.pk-seller-edit-btn {

    border: 1px solid #e4e4e8;

    background: #fff;

    color: #555;

}

.pk-seller-edit-btn:hover {

    border-color: #d32a6c;

    color: #d32a6c;

    background: #fff7fa;

}

.pk-seller-promote-btn {

    border: 1px solid #d32a6c;

    background: #d32a6c;

    color: #fff;

}

.pk-seller-promote-btn:hover {

    background: #b9215b;

    color: #fff;

}

.pk-seller-more-btn {

    border: 1px solid #e4e4e8;

    background: #fff;

    color: #666;

}

.pk-seller-more-btn:hover {

    background: #f7f7f9;

}

.pk-seller-more-btn i {

    font-size: 6px;

}


/* =========================================
   EMPTY
========================================= */

.pk-seller-empty {

    padding: 70px 20px;

    border: 1px solid #e8e8ed;

    border-radius: 14px;

    background: #fff;

    text-align: center;

}

.pk-seller-empty-icon {

    width: 55px;

    height: 55px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin: 0 auto 14px;

    border-radius: 13px;

    background: #fff0f5;

    color: #d32a6c;

    font-size: 18px;

}

.pk-seller-empty h3 {

    margin: 0 0 5px;

    font-size: 15px;

    font-weight: 800;

}

.pk-seller-empty p {

    margin: 0;

    color: #999;

    font-size: 9px;

}


/* =========================================
   TABLET
========================================= */

@media (max-width: 991.98px) {

    .pk-seller-summary {

        grid-template-columns:
            repeat(2, 1fr);

    }

    .pk-seller-ad-image {

        width: 190px;

    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 575.98px) {

    .pk-seller-ads-page {

        padding: 25px 0 45px;

    }

    .pk-seller-ads-header {

        display: block;

        margin-bottom: 20px;

    }

    .pk-seller-ads-header h1 {

        font-size: 28px;

    }

    .pk-seller-ads-header p {

        font-size: 9px;

    }

    .pk-seller-post-btn {

        margin-top: 14px;

    }

    .pk-seller-summary {

        grid-template-columns:
            repeat(2, 1fr);

        gap: 8px;

        margin-bottom: 15px;

    }

    .pk-seller-summary-item {

        min-height: 65px;

        padding: 10px;

    }

    .pk-seller-summary-icon {

        width: 32px;

        height: 32px;

        font-size: 10px;

    }

    .pk-seller-summary-item strong {

        font-size: 15px;

    }

    .pk-seller-summary-item span {

        font-size: 7px;

    }


    /* TOOLBAR */

    .pk-seller-toolbar {

        display: block;

        padding: 9px;

    }

    .pk-seller-search {

        width: 100%;

        margin-bottom: 8px;

    }

    .pk-seller-toolbar-right {

        width: 100%;

    }

    .pk-seller-select {

        flex: 1;

    }


    /* TABS */

    .pk-seller-tabs {

        width: 100%;

        margin-top: 12px;

    }

    .pk-seller-tab {

        flex: 1;

        justify-content: center;

        padding: 0 5px;

        font-size: 7px;

    }


    /* CARD */

    .pk-seller-ad-card {

        display: block;

    }

    .pk-seller-ad-image {

        width: 100%;

        height: 185px;

    }

    .pk-seller-ad-content {

        padding: 15px;

    }

    .pk-seller-ad-top h2 {

        font-size: 16px;

    }

    .pk-seller-price {

        font-size: 17px;

    }


    /* STATS */

    .pk-seller-ad-stats {

        grid-template-columns:
            repeat(2, 1fr);

        gap: 12px;

    }

    .pk-seller-ad-stats > div {

        gap: 6px;

    }


    /* ACTIONS */

    .pk-seller-ad-actions {

        width: 100%;

    }

    .pk-seller-edit-btn,
    .pk-seller-promote-btn {

        flex: 1;

    }

    .pk-seller-more-btn {

        width: 40px;

        padding: 0;

        font-size: 0;

    }

    .pk-seller-more-btn i {

        font-size: 8px;

    }

}