:root {
	--wd-text-font: "Poppins", Arial, Helvetica, sans-serif;
	--wd-text-font-weight: 400;
	--wd-text-color: rgb(53,53,53);
	--wd-text-font-size: 17px;
	--wd-title-font: "Poppins", Arial, Helvetica, sans-serif;
	--wd-title-font-weight: 600;
	--wd-title-color: #242424;
	--wd-entities-title-font: "Poppins", Arial, Helvetica, sans-serif;
	--wd-entities-title-font-weight: 600;
	--wd-entities-title-color: #333333;
	--wd-entities-title-color-hover: rgb(142, 142, 142);
	--wd-alternative-font: "Lato", Arial, Helvetica, sans-serif;
	--wd-widget-title-font: "Poppins", Arial, Helvetica, sans-serif;
	--wd-widget-title-font-weight: 600;
	--wd-widget-title-transform: uppercase;
	--wd-widget-title-color: #333;
	--wd-widget-title-font-size: 16px;
	--wd-header-el-font: "Lato", Arial, Helvetica, sans-serif;
	--wd-header-el-font-weight: 700;
	--wd-header-el-transform: uppercase;
	--wd-header-el-font-size: 13px;
	--wd-otl-style: dotted;
	--wd-otl-width: 2px;
	--wd-primary-color: rgb(38,71,156);
	--wd-alternative-color: rgb(255,0,31);
	--btn-default-bgcolor: rgb(38,71,156);
	--btn-default-bgcolor-hover: rgb(255,0,31);
	--btn-accented-bgcolor: rgb(38,71,156);
	--btn-accented-bgcolor-hover: rgb(255,0,31);
	--wd-form-brd-width: 1px;
	--notices-success-bg: #459647;
	--notices-success-color: #fff;
	--notices-warning-bg: #E0B252;
	--notices-warning-color: #fff;
	--wd-link-color: rgb(38,71,156);
	--wd-link-color-hover: rgb(255,0,31);
}
.wd-age-verify-wrap {
	--wd-popup-width: 500px;
}
.wd-popup.wd-promo-popup {
	background-color: rgba(255,255,255,0);
	background-image: none;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.wd-promo-popup-wrap {
	--wd-popup-width: 950px;
	--wd-popup-padding: 0px;
}
:is(.woodmart-woocommerce-layered-nav, .wd-product-category-filter) .wd-scroll-content {
	max-height: 223px;
}
.wd-page-title .wd-page-title-bg img {
	object-fit: cover;
	object-position: center center;
}
.wd-footer {
	background-color: rgb(41,55,87);
	background-image: none;
}
:is(.page, .search-no-results, .error404) :is(.wd-page-content, .whb-header) {
	background-color: rgb(255,255,255);
	background-image: none;
}
.woodmart-archive-shop:not(.single-product) :is(.wd-page-content, .whb-header) {
	background-color: rgb(255,255,255);
	background-image: none;
}
.single-product :is(.wd-page-content, .whb-header) {
	background-color: rgb(255,255,255);
	background-image: none;
}
.woodmart-archive-blog :is(.wd-page-content, .whb-header) {
	background-color: rgb(255,255,255);
	background-image: none;
}
.single-post :is(.wd-page-content, .whb-header) {
	background-color: rgb(255,255,255);
	background-image: none;
}
.woodmart-archive-portfolio :is(.wd-page-content, .whb-header) {
	background-color: rgb(255,255,255);
	background-image: none;
}
.single-portfolio :is(.wd-page-content, .whb-header) {
	background-color: rgb(255,255,255);
	background-image: none;
}
.mfp-wrap.wd-popup-quick-view-wrap {
	--wd-popup-width: 920px;
}

@media (max-width: 1024px) {
	:root {
		--wd-text-font-size: 17px;
	}

}

@media (max-width: 768.98px) {
	:root {
		--wd-text-font-size: 16px;
	}

}
:root{
--wd-container-w: 1222px;
--wd-form-brd-radius: 35px;
--btn-default-color: #fff;
--btn-default-color-hover: #fff;
--btn-accented-color: #fff;
--btn-accented-color-hover: #fff;
--btn-default-brd-radius: 5px;
--btn-default-box-shadow: none;
--btn-default-box-shadow-hover: none;
--btn-accented-brd-radius: 5px;
--btn-accented-box-shadow: none;
--btn-accented-box-shadow-hover: none;
--wd-brd-radius: 8px;
}

@media (min-width: 1222px) {
section.elementor-section.wd-section-stretch > .elementor-container {
margin-left: auto;
margin-right: auto;
}
}


.wd-page-title {
background-color: rgb(255,132,181);
}

@font-face {
	font-family: "hkgroteskpro";
	src: url("//hsemeipack.co.id/wp-content/uploads/2021/09/hkgroteskpro-regular.woff2") format("woff2"), 
url("//hsemeipack.co.id/wp-content/uploads/2021/09/hkgroteskpro-regular.woff") format("woff");
	font-weight: 400;
	font-display:swap;
	font-style: normal;
}

@font-face {
	font-family: "hkgroteskpro";
	src: url("//hsemeipack.co.id/wp-content/uploads/2021/09/hkgroteskpro-semibold.woff2") format("woff2"), 
url("//hsemeipack.co.id/wp-content/uploads/2021/09/hkgroteskpro-semibold.woff") format("woff");
	font-weight: 600;
	font-display:swap;
	font-style: normal;
}

	.pum-overlay.pum-active,
	.pum-overlay.pum-active .popmake.active {
    		display: block !important;
	}

.wd-entities-title.post-title {
  min-height: 100px !important;
  max-height: 100px !important;
  overflow: hidden !important;
  white-space: normal !important;
}

/* Default: Hide both banners */
.CTAARTIKELMOBILE, .CTAARTIKELDESKTOP {
    display: none !important;
}

/* Mobile View: Show only the mobile banner */
@media (max-width: 768px) {
    .CTAARTIKELMOBILE {
        display: block !important;
        animation: bounce 1.5s ease-in-out infinite;
    }
    .CTAARTIKELDESKTOP {
        display: none !important;
    }
}

/* Desktop View: Show only the desktop banner */
@media (min-width: 769px) {
    .CTAARTIKELDESKTOP {
        display: block !important;
        animation: bounce 1.5s ease-in-out infinite;
    }
    .CTAARTIKELMOBILE {
        display: none !important;
    }
}

/* Keyframes for bounce animation */
@keyframes bounce {
    0%, 100% {
        transform: translateY(0); /* Default position */
    }
    50% {
        transform: translateY(-10px); /* Move up */
    }
}

.custom_color {
    color: #26479C !important;
}

.highlight-text {
    color: #26479C;
}

/* Layout Woocommerce */

/* ===========================
   GRID WITHOUT DESCRIPTION
   desktop = 6, tablet = 4, mobile = 2
   =========================== */
.hsm-attr-grid {
    display: grid !important;
    grid-template-columns: repeat(6, 1fr) !important;
    gap: 25px !important;
    margin-top: 25px !important;
}

@media (max-width: 1024px) {
    .hsm-attr-grid {
        grid-template-columns: repeat(4, 1fr) !important;
    }
}

@media (max-width: 767px) {
    .hsm-attr-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* ===========================
   GRID WITH DESCRIPTION
   desktop = 3, tablet = 2, mobile = 1
   =========================== */
.hsm-attr-grid-desc {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 30px !important;
    margin-top: 30px !important;
}

@media (max-width: 1024px) {
    .hsm-attr-grid-desc {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 767px) {
    .hsm-attr-grid-desc {
        grid-template-columns: repeat(1, 1fr) !important;
    }
}

/* CARD STYLE */
.hsm-attr-card {
    background: #F8F8FF !important;
    border-radius: 12px !important;
    padding: 20px !important;
    text-align: center !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
    transition: all .25s ease !important;
}

.hsm-attr-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 6px 16px rgba(0,0,0,0.12) !important;
}

/* IMAGE */
.hsm-attr-img img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    margin-bottom: 15px !important;
	  border-radius: 12px !important;
}

/* TITLE */
.hsm-attr-title {
    font-size: 16px !important;
    font-weight: 600 !Important;
		line-height:21px !important;
    color: #111 !important;
    margin-bottom: 10px !important;
}

/* TITLE SIZE ONLY FOR ATTRIBUTES WITH DESCRIPTION */
.hsm-attr-grid-desc .hsm-attr-title {
    font-size: 20px !important; /* bigger title */
    font-weight: 600 !important;
		line-height: 25px !important;
}

/* DESCRIPTION */
.hsm-attr-desc {
    font-size: 14px !important;
    color: #444 !important;
    line-height: 1.5 !important;
    margin-top: 8px !important;
}



/* ============================================================
   HPI – Premium Gray Product Cards (Shop Archive)
   ============================================================ */

/* Product card background */
.products .wd-product .product-wrapper {
    background-color: #f7f7f7; /* premium light gray */
    border-radius: 12px;
    padding: 15px;
    transition: background-color .25s ease, box-shadow .25s ease;
}

/* Product card hover */
.products .wd-product:hover .product-wrapper {
    background-color: #ebebeb; /* slightly darker gray when hovering */
    box-shadow: 0 6px 18px rgba(0,0,0,0.08);
}

/* Fix original (strikethrough) price visibility on gray */
.products .wd-product .price del {
    color: #555 !important; /* darker gray for contrast */
    opacity: 1 !important;
}

/* Optional: change sale price color slightly to match premium tone */
.products .wd-product .price ins {
    color: #111 !important;
}

/* Optional: product title color adjustment */
.products .wd-product .wd-entities-title a {
    color: #222;
}

/* Optional: Sale badge contrast improvement */
.products .wd-product .product-labels .onsale {
    background-color: #e53935;
    color: #fff;
}


/* Hide tab navigation (all devices) */
.wd-nav-tabs-wrapper {
    display: none !important;
}

/* Hide accordion title on mobile only */
@media (max-width: 768px) {
    #tab-item-title-wd_custom_tab {
        display: none !important;
    }
}


/* ======================================================
RELATED PRODUCTS – CUSTOM CARD DESIGN
====================================================== */

/* Section title */
.related-products .slider-title span,
.related-products .wd-el-title span{
    font-family:"Noto Sans", sans-serif !important;
    font-size:25px !important;
    font-weight:600 !important;
}

/* Remove default WooCommerce card */
.related-products .wd-product-wrapper{
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    padding:0 !important;
}

/* Product card */
.related-products .wd-product{
    position:relative;
    overflow:hidden;
    border-radius:16px;
    aspect-ratio:1 / 1;
}

/* Remove spacing */
.related-products .wd-product-thumb{
    margin:0 !important;
}

/* Image fill */
.related-products .wd-product-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* Hide buttons */
.related-products .wd-buttons{
    display:none !important;
}

/* Floating glass overlay */
.related-products .product-element-bottom{
    position:absolute;
    left:10px;
    right:10px;
    bottom:10px;
    z-index:3;

    padding:15px 17px;

    border-radius:12px;

    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);

    /* slightly darker glass base */
    background:rgba(0,0,0,0.18);

    /* stronger bottom gradient for readability */
    background:linear-gradient(
        to top,
        rgba(0,0,0,0.55),
        rgba(0,0,0,0.30),
        rgba(0,0,0,0.08)
    );

    border:none;
}

/* Title container */
.related-products .wd-entities-title{
    margin:0;
}

/* Product title */
.related-products .wd-entities-title a{
    font-family:"Noto Sans", sans-serif;
    font-size:15px !important;
    line-height:20px !important;
    font-weight:500;
    color:#fff !important;

    /* readability improvement */
    text-shadow:0 1px 3px rgba(0,0,0,0.6);
}

/* Category */
.related-products .wd-product-cats{
    margin-top:3px;
}

.related-products .wd-product-cats a{
    font-family:"Noto Sans", sans-serif;
    font-size:13px;
    font-weight:600;
    color:#fff !important;
    opacity:0.95;

    text-shadow:0 1px 2px rgba(0,0,0,0.6);
}

/* Ensure carousel items stretch */
.related-products .wd-carousel-item{
    height:100%;
}

/* Mobile: show 1 product per slide */
@media (max-width:767px){

.related-products .wd-carousel{
    --wd-col-sm:1 !important;
}

}