/*
 Theme Name:   Woodmart Child
 Description:  Woodmart Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/

body {
  --btn-accented-bgcolor: var(--e-global-color-primary);
  --btn-accented-bgcolor-hover: var(--e-global-color-secondary)
}
.pad-lg {padding-block: clamp(40px, 7.3vw, 100px);}
.pad-lg-start {padding-block-start: clamp(40px, 7.3vw, 100px);}
.pad-lg-end {padding-block-end: clamp(40px, 7.3vw, 100px);}
.pad-md {padding-block: clamp(30px, 5.8vw, 80px);}
.pad-md-start {padding-block-start: clamp(30px, 5.8vw, 80px);}
.pad-md-end {padding-block-end: clamp(30px, 5.8vw, 80px);}
.pad-sm {padding-block: clamp(20px, 3.75vw, 60px);}
.pad-sm-start {padding-block-start: clamp(20px, 3.75vw, 60px);}
.pad-sm-end {padding-block-end: clamp(20px, 3.75vw, 60px);}
.pad-inline {padding-inline: clamp(25px,6.25vw,100px)}
.page-title.page-title {margin-block: 0px;}
.whb-header.whb-header.whb-header {margin-bottom: 0px;}
p:last-of-type {margin-bottom: 0px;}
.widgets {
  display: flex;
  align-items: center;
  gap: clamp(20px,2.2vw,30px);
  justify-content: space-between;
}
.wd-logo img {
  width: clamp(180px, 20vw,400px)
}
.gt_selected  {
  width: 50px !important;
  height: 35px !important;
  overflow: hidden;
  background: transparent !important;  
}
.gt_switcher .gt_option {
  position: absolute !important;
}
.gt_switcher {
  width: auto !important;
  position: relative;
  overflow: visible !important;;
}
.gt_selected a {
  width: 30px !important;
  display: flex !important;
  flex-direction: column;
  gap: 200px;
  border: none !important;
}
.gt_selected a::after {
  right: 0px !important;
  filter: invert(1);
}
.gt_switcher a {
  font-size: 12px !important;
}
.gt_selected a img {
  width: 30px !important;
  height: 30px !important;
  object-fit: cover;
  border-radius: 50%;
  border: 1px solid #fff !important;
}
.gt_switcher .gt_selected a:hover {
  background: transparent !important;
}
.gt_switcher .gt_option {
  right: 0;
}
.grid-extended {
  --inner-width: 1530px;
  --left: 0.4;
  --right: 0.6;
  display: grid;
  grid-template-rows: 1fr;
  grid-template-columns: minmax(clamp(20px,6.25vw,100px),1fr) 
    minmax(0,calc(var(--inner-width)*var(--left))) 
    minmax(0,calc(var(--inner-width)*var(--right))) 
    minmax(clamp(20px,6.25vw,100px),1fr);
}
.grid-extended.left {
  --left: 0.6;
  --right: 0.4;
}
.grid-extended .content {
  grid-column: 2 / 3;
}
.grid-extended .image {
  grid-column: 3 / -1;
}

.grid-extended.left .content {
  grid-column: 3 / 4;
}
.grid-extended.left .image {
  grid-column: 1 / 3;
}
.has-de-left::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: clamp(20px,5vw,80px);
  display: block;
  background: url(https://stagingwebsite4u.com/sg/jianbang/wp-content/uploads/2025/09/left-de.png) center right no-repeat;
  background-size: contain;  
}
.has-de-left {
  padding-inline-start: clamp(20px,5vw,80px);
	height: 100%;
}
.hidden-fields-container, .screen-reader-response {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}
.wpcf7-form-control-wrap {
	display: block;
}
input[type="email"], input[type="date"], input[type="search"], input[type="number"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], textarea, select { 
  padding-block: 12px;
  height: auto;
}
input[type="submit"] {
  min-width: 150px;
  background: transparent;
  border: 1px solid #fff !important;
  color: #fff;
  padding-block: 15px;
}
.grid-banner {
	--inner-width: 1570px;
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: minmax(clamp(20px,6.25vw,100px),1fr) minmax(0,calc(var(--inner-width))) minmax(clamp(20px,6.25vw,100px),1fr);
	column-gap: 0px;
}
.grid-banner .background {
    grid-column: 1 / -2;
    grid-row: 1 / 2;
}
.grid-banner .content {
	grid-column: 2 / -2;
	grid-row: 1 / 2;
}
.grid-banner.inner-pages::before {
  height: clamp(30px,4vw,65px)
}
.grid-banner.inner-pages .has-de-right::after {
  width: clamp(30px,3.75vw,60px);
}
.has-de-right {
  position: relative;
}
.has-de-right::after {
  position: absolute;
  content: '';
  width: clamp(20px,5vw,80px);
  height: 100%;
  display: block;
  background: url(https://stagingwebsite4u.com/sg/jianbang/wp-content/uploads/2025/09/left-de.png) center right no-repeat;
    background-size: auto;
  background-size: contain;
  left: 100%;
  scale: -1;
}
.grid-banner {
  position: relative;
}
.grid-banner::before {
  content: '';
  position: absolute;
  width: 100%;
  height: clamp(30px,5.3vw,85px);
  background: #fff;
  bottom: 0px;
  left: 0;
  top: auto;
	grid-column: 3 / -1;
}
.elementor-widget-text-editor.elementor-widget-text-editor.elementor-widget-text-editor {display: block;}
.elementor-template-full-width.elementor-template-full-width .row > [data-elementor-type] {margin-bottom: 0px;}
.has-bar::before {
  position: absolute;
  content: '';
  width: clamp(20px,2.2vw,30px);
  height: 58%;
  top: 50%;
  transform: translateY(-50%);
  right: 100%;
  background: var(--e-global-color-secondary);
}
.has-bar.right::before {
  right: auto;
  left: 100%;
}
.masonry-container {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: clamp(20px,2.2vw,30px);
  height: auto !important;
}
.portfolio-entry {
  position: relative !important;
  max-width: 100% !important;
  padding: 0 !important;
  inset: auto !important;
  margin: 0 !important;
  transform: none !important;
  aspect-ratio: 1.2 / 1 !important;
}
.portfolio-entry :not(.wd-portfolio-btns, .portfolio-info, .portfolio-info *, .wd-portfolio-btns *) {
	display: flex !important;
	justify-content: center;
	height: 100%;
	width: 100%;
	object-fit: cover;
}
.wd-nav-portfolio {padding: 10px clamp(10px,1.56vw,25px);
  border: 1px solid var(--e-global-color-primary);
	margin-bottom: clamp(20px, 2.5vw, 40px);
}

.portfolio-entry.portfolio-entry .portfolio-thumbnail::after {
	background-color: #14327a99;
	outline: 1px solid #fff;
	outline-offset: -25px;
}
.portfolio-entry.portfolio-entry .social-icons-wrapper {
  display: none;
}
.portfolio-entry .portfolio-thumbnail {
	pointer-events: none;
}
.anchor-offset {
  scroll-margin: 100px;
}
select.wpcf7-form-control.wpcf7-form-control option {
	background-color: #444;
}
.shop-content-area {
  margin-block: clamp(40px, 7.3vw, 100px);
}
.products.elements-grid {
  align-items: stretch !important;
}
.product-grid-item .product-wrapper {height: 100%;}
.product-grid-item .wd-entities-title {flex-grow: 1;}
.single_add_to_cart_button.single_add_to_cart_button, 
.comment-form .submit.submit, 
.wc-block-components-button.wc-block-components-button:not(.is-link) {
  background: var(--e-global-color-primary);
	color: #fff;
}
.single_add_to_cart_button.single_add_to_cart_button:hover, 
.comment-form .submit.submit:hover,
.wc-block-components-button.wc-block-components-button:not(.is-link):hover {
  background: var(--e-global-color-secondary);
  border-color: var(--e-global-color-secondary);
	color: #fff;
}
.wd-header-cart.wd-design-5 .wd-cart-number.wd-cart-number {background-color: var(--e-global-color-secondary);}
.joinchat__button.joinchat__button.joinchat__button {bottom: 60px;right: 0px;}
@media screen and (min-width: 1024px) {
	.card, .card * {transition: all 0.8s ease-in-out;overflow: hidden;}
	.card.shrinked {
	  --flex-basis: 15%;
	  align-items: center;
	}
	.card:not(.shrinked) {
	  --flex-basis: 85%;
	}
	.card .details {overflow: hidden; max-height:200px;}
	.card.shrinked .details {
	  display: none;
	}
	.card.shrinked .title {
	  writing-mode: sideways-lr;
	}
	.hover-expand.hover-expand:hover .card.card {
	  --flex-basis: 85%;
	  align-items: start
	}
	.hover-expand.hover-expand:hover .card.card:not(:hover) {
	  --flex-basis: 15%;
	  align-items: center;
	}
	.hover-expand.hover-expand:hover .card.card:not(:hover) .details {
	  display: none;
	}
	.hover-expand.hover-expand:hover .card.card:not(:hover) .title {
	  writing-mode: sideways-lr;
	}
	.hover-expand.hover-expand:hover .card.card:hover .title {
	  writing-mode: lr;
	}
	.hover-expand.hover-expand:hover .card.card:hover .details {
	  display: block;
	}
	.hover-expand.hover-expand:hover .card:not(:last-of-type):not(:hover) ~ .card:last-of-type {
	  --flex-basis: 85%;
	  align-items: start
	}
	.hover-expand.hover-expand:hover .card:not(:last-of-type):not(:hover) ~ .card:last-of-type .title {
	  writing-mode: lr;
	}
	.hover-expand.hover-expand:hover .card:not(:last-of-type):not(:hover) ~ .card:last-of-type .details {
	  display: block;
	}
	.hover-expand.hover-expand .details {
	  transition: all 0.8s ease-in-out;
	  min-width: 990px;
	}
	.hover-expand.hover-expand:hover .card:not(:last-of-type):hover ~ .card:last-of-type {
	  --flex-basis: 15%;
	  align-items: center;
	}
	.hover-expand.hover-expand:hover .card:not(:last-of-type):hover ~ .card:last-of-type .title {
	  writing-mode: sideways-lr;
	}
	.hover-expand.hover-expand:hover .card:not(:last-of-type):hover ~ .card:last-of-type .details {
	  display: none;
	}
	#menu-main-header-menu {margin-right: 20px;}
}
@media screen and (max-width:767px) {
	.grid-extended {
	  grid-template-rows: auto auto;
	  column-gap: 0;
	}
	.grid-extended .content, .grid-extended.left .content {
	  grid-row: 2 / 3;
	  grid-column: 2 / -2;
	}
	.grid-extended .image, .grid-extended.left .image {
	  grid-row: 1 / 2;
	  grid-column: 1 / -1;
	}

	.grid-extended.left .content {
	  grid-column: 3 / 4;
	}
	.grid-extended.left .image {
	  grid-column: 1 / 3;
	}
	.wd-header-html:has(.widgets) {
		width: 100%;
	}
}
@media (max-width: 1024px) {
  .portfolio-filter.wd-nav-wrapper.wd-mb-action-swipe .wd-nav.wd-nav {
    flex-wrap: wrap;
  }
	.portfolio-filter.wd-nav-wrapper.wd-mb-action-swipe {
		-webkit-mask-image: none;
    	mask-image: none;
	}
}