/**
 * KH Components
 *
 * Shared component styles.
 */

@import url("components/header.css");
@import url("components/slider-navigation.css");
@import url("components/generic-slider.css");
@import url("components/venture-slider.css");
@import url("components/testimonial-slider.css");
@import url("components/visual-moments.css");
@import url("components/insta-slider.css");
@import url("components/marquee.css");
@import url("components/bleed.css");
@import url("components/timeline.css");
@import url("components/recent-work-gallery.css");
@import url("components/menu-modal.css");
@import url("components/contact-modal.css");

:root {
	--kh-container-width: 1600px;

	--kh-outer-width:   1664px;
  --kh-outer-padding: 32px;

	--kh-slider-edge-gap: 32px;

	--kh-nav-size: 50px;
	--kh-nav-size-mobile: 40px;
	--kh-nav-border-radius: 50%;
	--kh-nav-blur: 12px;

  --kh-container-padding-mobile: 16px;
	--kh-container-padding-tablet: 32px;
  --kh-bleed-col-gap: 60px;
  --kh-section-padding-v: 80px;
  --kh-bleed-breakpoint: 1366px;
}

.elementor a {
    text-decoration: none;
}

.text-primary {
    color: var( --e-global-color-primary ) !important;
}

.elementor-widget-n-accordion {
	--n-accordion-title-justify-content: space-between;
	--n-accordion-title-icon-order: 2;
}

.hfe-breadcrumbs a {
	text-decoration: none;
}

/* =========================================
   BOTTOM MOUNTAIN DECORATION
   ========================================= */

.parvat-bg {
    position: relative;
    overflow: hidden;
}

.parvat-bg::before,
.parvat-bg::after {
    content: "";
    position: absolute;
    top: auto;
    bottom: 0;
    z-index: 2;
    pointer-events: none;
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: contain;
}

/* Left mountain */
.parvat-bg::before {
    left: 0;
    width: 338px;
    height: 180px;
    background-image: url("https://demo.kailashhospitalitygroup.com/wp-content/plugins/kh-components/assets/images/kailash-parvat-left.png");
    background-position: bottom left;
}

/* Right mountain */
.parvat-bg::after {
    right: 0;
    width: 268px;
    height: 180px;
    background-image: url("https://demo.kailashhospitalitygroup.com/wp-content/plugins/kh-components/assets/images/kailash-parvat-right.png");
    background-position: bottom right;
}

/* Left mountain */
.parvat-bg-white::before {
    background-image: url("https://demo.kailashhospitalitygroup.com/wp-content/plugins/kh-components/assets/images/kailash-parvat-white-left.png");
}

/* Right mountain */
.parvat-bg-white::after {
    background-image: url("https://demo.kailashhospitalitygroup.com/wp-content/plugins/kh-components/assets/images/kailash-parvat-white-right.png");
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 1024px) {
    .parvat-bg::before,
    .parvat-bg::after {
        width: 170px;
        height: 120px;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 767px) {
    .parvat-bg::before,
    .parvat-bg::after {
        width: 120px;
        height: 85px;
    }
}

.kh-vision-mission {
	position: relative;
}

.kh-vision-mission::before {
	content: "";
	position: absolute;
	top: var(--padding-block-start);
	left: 50%;
	width: 1px;
	height: calc(100% - var(--padding-block-start) - var(--padding-block-end));
	background: #C6A65D; /* Gold */
	transform: translateX(-50%);
}

.kh-vision-mission::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 48px;
	height: 48px;
	transform: translate(-50%,-50%);
	background: url('/wp-content/uploads/custom-upload/star.png') center/32px no-repeat;
	background-color: #F8F5F0;
}

@media (max-width:1024px){

	.kh-vision-mission::before{
		top: 50%;
		left: var(--padding-inline-start);
		width: calc(100% - var(--padding-inline-start) - var(--padding-inline-end));
		height: 1px;

		transform: translateY(-50%);
	}

	.kh-vision-mission::after{
		top: 50%;
		left: 50%;

		transform: translate(-50%, -50%);
	}

}

/* Square gallery */
.sq-gallery .gallery {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 10px !important;
}

.sq-gallery .gallery-item {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

.sq-gallery .gallery-icon {
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
  display: block !important;
}

.sq-gallery .gallery-icon img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

.catering-counter .elementor-counter-number-suffix {
	color: #E54B37;
}

.sweets-counter .elementor-counter-number-suffix {
	color: #C6A96B;
}

.sweets-collections .elementor-widget-image-box {
    padding: 20px;
}

.inhouse-gallery {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    gap: 24px;
}

/* Top row */
.inhouse-gallery > :nth-child(1) {
    grid-column: 1 / 6;
}

.inhouse-gallery > :nth-child(2) {
    grid-column: 6 / 11;
}

/* Center row — 60 / 40 */
.inhouse-gallery > :nth-child(3) {
    grid-column: 1 / 7;
}

.inhouse-gallery > :nth-child(4) {
    grid-column: 7 / 11;
}

/* Bottom row */
.inhouse-gallery > :nth-child(5) {
    grid-column: 1 / 6;
}

.inhouse-gallery > :nth-child(6) {
    grid-column: 6 / 11;
}

/* Images */
.inhouse-gallery .elementor-widget-image,
.inhouse-gallery .elementor-widget-image > .elementor-widget-container {
    height: 100%;
}

.inhouse-gallery .elementor-widget-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center center;
}

/* Desktop */
@media (min-width: 1200px) {
    .inhouse-gallery .elementor-widget-image,
    .inhouse-gallery .elementor-widget-image > .elementor-widget-container,
    .inhouse-gallery .elementor-widget-image img {
        height: 400px;
    }
}

/* Tablet */
@media (max-width: 1199px) {
    .inhouse-gallery {
        width: 100%;
    }
}

/* Tablet gap */
@media (min-width: 768px) and (max-width: 1024px) {
    .inhouse-gallery {
        gap: 20px;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .inhouse-gallery {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .inhouse-gallery > :nth-child(1),
    .inhouse-gallery > :nth-child(2),
    .inhouse-gallery > :nth-child(3),
    .inhouse-gallery > :nth-child(4),
    .inhouse-gallery > :nth-child(5),
    .inhouse-gallery > :nth-child(6) {
        grid-column: 1;
    }
}

/* =========================================
   GALLERY
   ========================================= */

.unique-sweets-gallery {
    position: relative;
    padding-top: 16px;
    padding-bottom: 16px;
}

.unique-sweets-row {
    display: flex;
    flex-direction: row;
    gap: 20px;
    width: 100%;
    position: relative;
}

.unique-sweets-card {
    width: calc(50% - 10px);
    position: relative;
}


/* =========================================
   IMAGE BOX
   ========================================= */

.unique-sweets-card .elementor-image-box-wrapper {
    position: relative;
    overflow: hidden;
}

.unique-sweets-card .elementor-image-box-img {
    display: block;
    width: 100%;
    margin: 0 !important;
}

.unique-sweets-card .elementor-image-box-img img {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}


/* =========================================
   GLASS CAPTION
   ========================================= */

.unique-sweets-card .elementor-image-box-content {
    width: calc(100% - 2px);
    position: absolute;
    left: 1px;
    right: 1px;
    bottom: 1px;
    z-index: 2;
    margin: 0;
    padding: 14px 12px;
    background: rgba(255, 255, 255, 0.28);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-radius: 0 0 6px 6px;
}

.unique-sweets-card .elementor-image-box-title {
    margin: 0;
    color: #fff;
    text-align: center;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 400;
}


/* =========================================
   SECOND ROW OFFSET
   ========================================= */

.unique-sweets-gallery .row-bottom {
    margin-top: 20px;
}

.unique-sweets-gallery .row-top .unique-sweets-card:last-child,
.unique-sweets-gallery .row-bottom .unique-sweets-card:last-child {
    transform: translateY(47px);
}


/* =========================================
   DECORATIVE TOP-LEFT
   ========================================= */

.unique-sweets-gallery::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: calc(50% - 10px);
    height: 1px;
    background: #c8a96a;
    z-index: 5;
    pointer-events: none;
}

.unique-sweets-gallery .row-top::before {
    content: "";
    position: absolute;
    top: 0;
    left: -16px;
    width: 1px;
    height: 100%;
    background: #c8a96a;
    z-index: 5;
    pointer-events: none;
}


/* =========================================
   DECORATIVE BOTTOM-RIGHT
   ========================================= */

.unique-sweets-gallery::after {
    content: "";
    position: absolute;
    bottom: -47px;
    right: 0;
    width: calc(50% - 10px);
    height: 1px;
    background: #c8a96a;
    z-index: 5;
    pointer-events: none;
}

.unique-sweets-gallery .row-bottom::after {
    content: "";
    position: absolute;
    bottom: -47px;
    right: -16px;
    width: 1px;
    height: 100%;
    background: #c8a96a;
    z-index: 5;
    pointer-events: none;
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 767px) {

    .unique-sweets-gallery {
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .unique-sweets-row {
        gap: 15px;
    }

    .unique-sweets-card {
        width: calc(50% - 7.5px);
    }

    .unique-sweets-gallery .row-bottom {
        margin-top: 15px;
    }

    .unique-sweets-gallery .row-bottom .unique-sweets-card:last-child {
        transform: translateY(30px);
    }

    .unique-sweets-card .elementor-image-box-title {
        font-size: 15px;
    }

    .unique-sweets-card .elementor-image-box-content {
        padding: 10px 8px;
    }
}
