/* ----------------------------------------------------------------
	Canvas: Furniture
-----------------------------------------------------------------*/

:root {
	--cnvs-themecolor: #193532;
	--cnvs-themecolor-rgb: 25, 53, 50;
	--cnvs-themecolor-light: #EBF1F0;

	--cnvs-body-font: Roboto, sans-serif;
	--cnvs-primary-font: Roboto, serif;
}

#header {
	--cnvs-primary-menu-font:            	var(--cnvs-body-font);
	--cnvs-primary-menu-font-weight:     	500;
	--cnvs-primary-menu-font-size:       	0.8rem;
	--cnvs-primary-menu-tt:					uppercase;
	--cnvs-primary-menu-ls:					1px;
}

body:not(.dark),
h1,
h2,
h3,
h4,
h5,
h6,
p,
.fbox-content p {
	color: var(--cnvs-themecolor);
}

.bg-color-light,
.bg-color-light .svg-underline::after {
	background-color: var(--cnvs-themecolor-light) !important;
}

/* Top Search Icon Switch */
.top-search-open #top-search a i:nth-child(1),
body:not(.top-search-open) #top-search a i:nth-child(2) {
	opacity: 0;
}
.top-search-open .top-search-parent .header-misc > #top-cart {
	opacity: 1;
}

.primary-menu-open #primary-menu-trigger svg:nth-child(1),
body:not(.primary-menu-open) #primary-menu-trigger svg:nth-child(2) { display: none; }

/* Top Cart Number Sizes */
.top-cart-number {
	width: .925rem;
	height: .925rem;
	line-height: 1rem;
}

/* Hero Image Background */
.slider-element:not(.bg-color) {
  background-image: linear-gradient(
	to bottom,
	#375754 0%,
	var(--cnvs-themecolor) 90%,
	var(--cnvs-themecolor-light) 90%
  );
}


/* Hero Image position */
.hero-image {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 92%;
	height: auto;
}

/* Hero Image Devices */
.device-lg .hero-image,
.device-md .hero-image {
 	width: 80%;
}

	/* ---- Primary Menu ---- */
	.is-expanded-menu .primary-menu:not(.on-click) .menu-item:not(.mega-menu) .sub-menu-container,
	.is-expanded-menu .primary-menu:not(.on-click) .mega-menu-content {
		margin-top: -10px;
		border-top-width: 1px !important;
	}

	.is-expanded-menu .primary-menu:not(.on-click) .menu-item:hover > .sub-menu-container,
	.is-expanded-menu .primary-menu:not(.on-click) .menu-item:hover > .mega-menu-content {
		margin-top: 0px;
	}

	.is-expanded-menu .sub-menu-container .menu-item > .menu-link {
		padding-left: 18px;
		padding-right: 18px;
		letter-spacing: 0px;
		font-size: 0.875rem;
		text-transform: none;
	}

	.is-expanded-menu .sub-menu-container.mega-menu-column:not(:first-child) {
		border-left: 0;
	}

	.is-expanded-menu .sub-menu-container:not(.mega-menu-column) .menu-item > .menu-link {
		text-transform: none;
		letter-spacing: 0;
		font-weight: 400 !important;
		font-size: 0.875rem;
	}

	.is-expanded-menu .sub-menu-container .menu-item > .menu-link div {
		position: relative;
		display: flex;
		align-items: center;
	}

	.is-expanded-menu .sub-menu-container .menu-link div > .sub-menu-indicator, .is-expanded-menu.side-header .primary-menu:not(.on-click) .menu-link .sub-menu-indicator {
		position: relative;
		top: auto;
		right: auto;
		transform: none;
	}

	.is-expanded-menu .mega-menu-content .sub-menu-container.mega-menu-dropdown {
		top: 100% !important;
		left: 0;
		padding: 0;
	}

	.is-expanded-menu .sub-menu-container .menu-link div > i.icon-caret-down {
		position: relative;
		display: inline-block;
		margin-left: 1px;
		margin-top: -1px;
		transform: rotate(0deg);
	}

	.is-expanded-menu .primary-menu > .menu-container > .menu-item > .menu-link {
		position: relative;
	}

/* Upper 992px Devices */
@media (min-width: 992px) {

	.shop-quick-view-ajax {
	    max-width: 1320px;
	    overflow-y: scroll;
	    height: 100vh;
	}

	.content-sticky {
		position: -webkit-sticky !important;
		position: sticky !important;
		top: 40px;
		height: 100%;
	}
}

/* Upper 1200px Devices */
@media (min-width: 1200px) {
	.slider-element:not(.bg-color) {
	background-image: linear-gradient(
		to bottom,
		#375754 0%,
		var(--cnvs-themecolor) 84%,
		var(--cnvs-themecolor-light) 84%
		);
	}
	.hero-image {
		margin-right: 30px;
		width: 65%;
	}

	.slider-element > .container {
		position: absolute;
		left: 50%;
		top: 0;
		transform: translateX(-50%);
	}
}

.fbox-content p {
	line-height: 1.5 !important;
}


/* -------- svg-underline -------- */
.svg-underline,
.svg-underline span {
	display: inline-block;
	position: relative;
	z-index: 1;
}

.svg-underline.not-animated,
.svg-underline[data-animate]:not(.animated) {
	opacity: 1;
}

.svg-underline::before {
	content: "";
	position: absolute;
	bottom: -15px;
	left: 0;
	right: 0;
	height: 13px;
	background-image: url("../images/underline.svg");
	background-size: 100% 13px;
	background-position: bottom center;
	opacity: 0.7;
}

.svg-underline[data-animate]::after {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 13px;
	background: #FFF;
	right: 0;
	bottom: 0;
	-webkit-transition: width 1s cubic-bezier(0.215, 0.61, 0.355, 1);
	-moz-transition: width 1s cubic-bezier(0.215, 0.61, 0.355, 1);
	-o-transition: width 1s cubic-bezier(0.215, 0.61, 0.355, 1);
	transition: width 1s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.dark .svg-underline::before {
	opacity: 0.7;
	background-image: url("../../demos/furniture/images/underline_dark.svg");
}

.custom-bg,
.custom-bg .svg-underline::after {
	background-color: var(--custom-bg);
}

.svg-underline.svg-underline-animated::after {
	width: 0;
}

.item-categories h5 {
	position: absolute;
	top: auto;
	left: 10px;
	bottom: 0;
	padding: 12px 22px;
}

/* Cart */
#side-panel .side-panel-wrap {
	padding: 0 30px 0 0;
}

/* Cart overlay Background */
.body-overlay {
	background: rgba(25, 53, 50, 0.8);
}

/* Instagram New Color */
.si-instagram.si-colored,
.si-instagram:hover {
	background: #f09433;
	background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
	background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);
	background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f09433', endColorstr='#bc1888',GradientType=1 );
}

/* 4px Gutter bewtween col*/
.gutter-4 {
	--bs-gutter-y: 4px;
	--bs-gutter-x: 4px;
}

/* Section Instagram */
.instagram-image::before {
	opacity: 0;
	content: "";
	background-color: rgba(0,0,0,0.65);
	background-image: url('images/instagram.svg');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 40px 40px;
	position: absolute;
	top: 50%;
	left: 50%;
	text-align: center;
	color: #FFF;
	font-size: 24px;
	width: 100%;
	height: 100%;
	transform: translate(-50%, -50%);
	transition: opacity .4s ease;
}

.instagram-image:hover::before {
	opacity: 1;
}

/* Footer */
.widget_links li {
	font-size: 0.725rem;
	padding: 8px 0;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.widget.subscribe-widget input {
	padding-top: 8px;
	padding-bottom: 8px;
	background-color: #F5F5F5;
}

.widget.subscribe-widget input::-moz-placeholder {
	font-size: 13px;
	color: #AAA;
}
.widget.subscribe-widget input:-ms-input-placeholder {
	font-size: 13px;
	color: #AAA;
}
.widget.subscribe-widget input::-webkit-input-placeholder {
	font-size: 13px;
	color: #AAA;
}

/* Toggle */
.single-product .qv-toogle a {
	font-size: 1.15rem;
	transition: font-weight .2s;
}

.single-product .qv-toogle a:not(.collapsed) {
	font-weight: 500;
}

.single-product .qv-toogle p {
	font-size: 0.925rem;
}

.single-product .qv-toogle a.collapsed i:nth-child(2),
.single-product .qv-toogle a:not(.collapsed) i:nth-child(1) {
	display: none;
}

.quantity .plus,
.quantity .minus,
.quantity .qty {
	width: 46px;
	height: 46px;
	line-height: 46px;
	background-color: var(--cnvs-themecolor-light);
	color: var(--cnvs-themecolor);
	font-weight: 500;
}

.dark .quantity .plus,
.dark .quantity .minus,
.dark .quantity .qty {
	background-color: transparent !important;
	border: 1px solid #AAA;
	color: #FFF;
}

.dark .quantity .qty {
	margin: 0 -1px;
}

.quantity .qty:out-of-range {
	border-color: red !important;
	z-index: 1;
	color: red;
}

.quantity .qty + .plus ~ .stock-in,
.quantity .qty + .plus ~ .stock-out {
	display: none;
	position: absolute;
	left: 0;
	bottom: -42px;
	font-size: 0.925rem;
	opacity: .9;
	text-transform: uppercase;
	letter-spacing: 1px;
	word-wrap: break-word;
	min-width: 500px;
}

.quantity .qty:in-range + .plus ~ .stock-in,
.quantity .qty:out-of-range + .plus ~ .stock-out {
	display: block;
}

.quantity .qty:out-of-range + .plus ~ .stock-out {
	opacity: .6;
}

@media (max-width: 767.98px) {
	.bg-overlay .bg-overlay-content,
	.bg-overlay .bg-overlay-content:not(.animated),
	.bg-overlay .bg-overlay-content.animated {
		opacity: 1 !important;
		-webkit-animation-name: fadeIn !important;
    	animation-name: fadeIn !important;
	}
}

/* Ajax Modal - Quick View */
.mfp-wrap > .mfp-close {
	display: none;
}

.single-product .mfp-close {
	background-image: url('images/cross.svg');
	background-size: 24px 24px;
	background-position: center center;
	background-repeat: no-repeat;
	opacity: 0.9;
}

.is-expanded-menu .mega-menu-column .sub-menu-indicator {
	display: none !important;
}

.is-expanded-menu .mega-menu:not(.mega-menu-small) .mega-menu-column {
	padding: 0;
}

/* Sort Dropdown */
.sortbuttons .button {
	min-width: 170px;
	background-color: #F5F5F5;
}

.sortbuttons > .button.show {
	background-color: var(--cnvs-themecolor);
	color:#FFF;
}

.sortbuttons .dropdown-menu {
	margin-top: -3px !important;
	width: 100%;
}

.sortbuttons .dropdown-menu .dropdown-item {
	padding: 0.5rem 1.25rem;
    border-bottom: 1px solid #EEE;
    font-size: .925rem;
}

.sortbuttons .dropdown-toggle::after {
	content: "\e7a7";
	font-family: "font-icons";
	border: 0;
	vertical-align: middle;
	margin: 0 0 0 6px;
}

/* Pagination */
.page-item.active .page-link,
.page-link:hover,
.page-link:focus {
	border-color: var(--cnvs-themecolor) !important;
}



/* HomePage 2 */

.slider-element .card {
	background-color: rgba(255, 255, 255, 0.35);
	border-color: rgba(255, 255, 255, 0.1);
}

@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {
	.slider-element .card {
		background-color: rgba(255, 255, 255, 0.15);
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);
	}
}

.slider-element .card .card-body i {
	transform: translateX(-4px);
	transition: transform .3s ease;
}

.slider-element .card:hover .card-body i {
	transform: translateX(0px) scale(1.1);
}

.slider-arrow-left,
.slider-arrow-right,
.slider-arrow-left:hover,
.slider-arrow-right:hover {
	background-color: transparent !important;
	transform: translateX(0) translateY(-50%) scale(.93);
	transition: transform .3s ease;
	will-change: transform;
}

.slider-arrow-left {
	transform: translateX(6px) translateY(-50%);
}

.slider-arrow-right {
	transform: translateX(-6px) translateY(-50%);
}

.widget .iconlist i {
	display: inline-block;
}



/**custom */

#logo img  {
  width: 300px;
}


.ss-mini-cart{
  position: fixed;
  inset: 0;
  background: rgba(25, 53, 50, 0.8);
  z-index: 9999;
  padding: 20px;
}

.ss-mini-cart-inner{
  background: #fff;
  max-width: 420px;
  margin-left: auto;
  height: 100%;
  padding: 20px;
  overflow: auto;
  border-radius: 8px;
}


/* ===== Canvas submenu fix (WordPress) ===== */

/* Canvas hides submenu by default (display:none). We enable it on hover/focus. */
.primary-menu:not(.on-click) .menu-item:hover > .sub-menu-container,
.primary-menu:not(.on-click) .menu-item:focus-within > .sub-menu-container {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  z-index: 399 !important;
  pointer-events: auto !important;
}

/* Canvas also hides submenu children; show them */
.primary-menu:not(.on-click) .menu-item:hover > .sub-menu-container > *,
.primary-menu:not(.on-click) .menu-item:focus-within > .sub-menu-container > * {
  display: block !important;
}

.top-search-form input {
    z-index: 1000;
  }
  #top-search {display: none;}

/* mobile: keep default hidden until JS opens */
@media (max-width: 991px) {
  .primary-menu .sub-menu-container {
    display: none !important;
    position: relative !important;
    visibility: visible !important;
    opacity: 1 !important;
    box-shadow: none !important;
    border: 0 !important;
    margin-top: 0 !important;
  }
}


/* =========================================================
   MOBILE HEADER FIX (Canvas + WP)
   - Put hamburger + icons on RIGHT on mobile
   - Make menu collapsible on click
========================================================= */

@media (max-width: 991px) {

  /* Make header row behave correctly */
  #header .header-row{
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: 12px;
  }

  /* Keep logo on left */
  #header #logo{
    order: 1 !important;
    margin-right: auto !important;
  }

  /* Move icons to right */
  #header .header-misc{
    order: 2 !important;
    margin-left: auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px;
  }

  /* Force hamburger to the RIGHT (Canvas often sets left:absolute) */
  #header .primary-menu-trigger{
    order: 3 !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    margin-left: 0 !important;
    transform: none !important;
  }

  /* Nav should go FULL WIDTH under header and be hidden until opened */
  #header .primary-menu{
    order: 10 !important;
    width: 100% !important;
    flex: 0 0 100% !important;
    display: none !important;
    padding-top: 12px;
  }

  /* When opened (we will toggle body class), show menu */
  body.primary-menu-open #header .primary-menu{
    display: block !important;
  }

  /* Make mobile menu list vertical */
  #header .primary-menu .menu-container{
    display: block !important;
    width: 100% !important;
  }
  #header .primary-menu .menu-container > .menu-item{
    display: block !important;
    width: 100% !important;
  }
  #header .primary-menu .menu-link{
    display: flex !important;
    justify-content: space-between !important;
    padding: 12px 0 !important;
  }

  /* Submenu on mobile: keep hidden until clicked */
  #header .primary-menu .sub-menu-container{
    display: none !important;
    padding-left: 14px;
    padding-bottom: 10px;
  }
}

/* =========================================
   MOBILE MENU ICON TOGGLE (Hamburger <-> X)
========================================= */
.primary-menu-trigger svg { display: none; }

/* Default: show hamburger (first svg) */
.primary-menu-trigger svg:first-child { display: inline-block; }

/* When menu open: show close (second svg) */
body.primary-menu-open .primary-menu-trigger svg:first-child { display: none; }
body.primary-menu-open .primary-menu-trigger svg:last-child { display: inline-block; }

/* =========================================
   MOBILE MENU LAYOUT: open under header
========================================= */
@media (max-width: 991px) {

  /* Allow wrapping so menu can drop below row */
  #header .header-row{
    flex-wrap: wrap !important;
  }

  /* Force the primary menu to be normal flow (NOT absolute/right side) */
  #header .primary-menu{
    position: static !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    transform: none !important;

    width: 100% !important;
    flex: 0 0 100% !important;
    order: 10 !important;

    display: none !important; /* hidden by default */
    padding-top: 12px !important;
  }

  /* Show when toggled */
  body.primary-menu-open #header .primary-menu{
    display: block !important;
  }

  /* Make menu vertical */
  #header .primary-menu .menu-container{
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #header .primary-menu .menu-container > .menu-item{
    display: block !important;
    width: 100% !important;
    border-top: 1px solid rgba(0,0,0,.08);
    padding: 0 !important;
    margin: 0 !important;
  }

  #header .primary-menu .menu-link{
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 14px 0 !important;
    width: 100% !important;
  }

  /* Submenu hidden until tapped (your JS already toggles it) */
  #header .primary-menu .sub-menu-container{
    position: static !important;
    display: none !important;
    padding: 0 0 10px 14px !important;
    margin: 0 !important;
    box-shadow: none !important;
    border: 0 !important;
    background: transparent !important;
  }

  /* When submenu opened by JS */
  #header .primary-menu .menu-item-hover > .sub-menu-container{
    display: block !important;
  }
}

/* =========================================
   Dropdown arrow for items with submenu
========================================= */

/* Make room for arrow */
.primary-menu .menu-item-has-children > a.menu-link {
  position: relative;
  padding-right: 22px; /* space for arrow */
}

/* Desktop arrow */
.primary-menu .menu-item-has-children > a.menu-link::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  width: 8px;
  height: 8px;
  transform: translateY(-50%) rotate(45deg);
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  opacity: .7;
}

/* When submenu open on mobile (we add .menu-item-hover), rotate arrow up */
@media (max-width: 991px) {
  .primary-menu .menu-item-has-children.menu-item-hover > a.menu-link::after {
    transform: translateY(-50%) rotate(-135deg);
    opacity: 1;
  }
}


/* Footer widget lists spacing like Canvas */
#footer .widget ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

#footer .widget ul li {
  padding: 10px 0;
  border-top: 1px solid rgba(0,0,0,.07);
}

#footer .widget ul li:first-child {
  border-top: 0;
  padding-top: 0;
}

#footer .widget a {
  text-decoration: none;
}

/* ================================
   FOOTER - Canvas-like Lists
================================ */

#footer {
  --cnvs-footer-top-border: 5px solid rgba(var(--cnvs-contrast-rgb),.15);
  --cnvs-copyrights-link-color: var(--cnvs-contrast-500);
  position: relative;
  background-color: var(--cnvs-footer-bg) !important;
  border-top: var(--cnvs-footer-top-border) !important;
}

/* Remove default bullets */
#footer .widget ul,
#footer .widget ol{
  list-style: none;
  padding-left: 0;
  margin: 0;
}

/* Make WP menu widget links look like Canvas rows */
#footer .widget_nav_menu ul li{
  padding: 12px 0;
  border-top: 1px solid rgba(0,0,0,.07);
}

#footer .widget_nav_menu ul li:first-child{
  border-top: 0;
  padding-top: 0;
}

#footer .widget_nav_menu ul li a{
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}

/* Canvas bullet/icon on left for footer menus (Important Links + Furniture Packages) */
#footer .widget_nav_menu ul li a::before{
  content: "▢";
  font-size: 12px;
  line-height: 1;
  opacity: .75;
}

/* Social list: if you use iconlist markup, keep it clean */
#footer .iconlist li{
  padding: 10px 0;
  border-top: 1px solid rgba(0,0,0,.07);
}
#footer .iconlist li:first-child{
  border-top: 0;
  padding-top: 0;
}

#footer .iconlist a{
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}

/* Ensure icons show nicely */
#footer .iconlist i{
  width: 18px;
  text-align: center;
}


/* ==========================
   Page header + breadcrumb
========================== */
.ss-page-header{
  padding: 70px 0 30px;
}

.ss-page-header h1,
.ss-page-header .woocommerce-products-header__title{
  margin: 0 0 8px;
}

.ss-breadcrumb{
  padding: 12px 0 0;
  opacity: .8;
  font-size: 14px;
}

.ss-breadcrumb a{
  text-decoration: none;
}

.ss-breadcrumb .delimiter{
  padding: 0 8px;
  opacity: .6;
}

/* Right side dropdown style */
.woocommerce-ordering select,
.ss-page-header select.form-select{
  padding: 10px 14px;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 6px;
  background: #fff;
}
.woocommerce-ordering{
  margin: 0;
}

.woocommerce-ordering { width: 100%; }
.woocommerce-ordering select { width: 100%; }


/* Variation tabs */
.ss-pack-tabs-nav{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.ss-pack-tab{
  border:1px solid rgba(255,255,255,.35);
  background:transparent;
  color:#fff;
  padding:10px 14px;
  border-radius:6px;
  font-size:14px;
  cursor:pointer;
  transition: all .15s ease-in-out;
}

.ss-pack-tab.is-active{
  background:#fff;
  color:#173B37;
  border-color:#fff;
}

.single_variation_wrap .woocommerce-variation-price,
.single_variation_wrap .woocommerce-variation-availability{
  color:#fff;
}

/* ==========================
   Single Product Dark Theme
========================== */
.woocommerce div.product,
.woocommerce div.product .product_title,
.woocommerce div.product p,
.woocommerce div.product .price,
.woocommerce div.product .woocommerce-product-details__short-description{
  color: #fff;
}

.woocommerce div.product .price{
  opacity: .95;
}

/* Make Woo tabs readable on dark bg */
.woocommerce div.product .woocommerce-tabs{
  margin-top: 30px;
  background: transparent;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  color: #fff;
  opacity: .85;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{
  opacity: 1;
}
.woocommerce div.product .woocommerce-tabs .panel{
  color: #fff;
}

/* Our variation tabs */
.ss-pack-tabs-nav{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.ss-pack-tab{
  border:1px solid rgba(255,255,255,.35);
  background:transparent;
  color:#fff;
  padding:10px 14px;
  border-radius:6px;
  font-size:14px;
  cursor:pointer;
}
.ss-pack-tab.is-active{
  background:#fff;
  color:#173B37;
  border-color:#fff;
}

/* Hide ONLY the first attribute dropdown when tabs exist */
.ss-hidden-first-variation tr:first-child{
  display:none;
}

/* Make Add to cart / qty clean on dark */
.woocommerce div.product form.cart .quantity input{
  height: 42px;
}
.woocommerce div.product form.cart .single_add_to_cart_button{
  height: 42px;
}

/* Variation description block (white card like screenshot) */
.ss-variation-details{
  background:#fff;
  color:#173B37;
  padding:18px;
  border-radius:10px;
}

/* ==========================
   Single Product - Clean Layout
========================== */

/* Keep product summary clean */
.woocommerce div.product div.summary {
  color: #fff;
}

/* Tabs row */
.ss-pack-tabs {
  margin-top: 18px;
}
.ss-pack-tabs-nav {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.ss-pack-tab {
  border: 1px solid rgba(255,255,255,.35);
  background: transparent;
  color: #fff;
  padding: 10px 14px;
  border-radius: 6px;
  font-size: 14px;
  cursor: pointer;
  transition: all .15s ease-in-out;
}
.ss-pack-tab.is-active {
  background: #fff;
  color: #173B37;
  border-color: #fff;
}

/* ✅ White card under tabs */
.ss-pack-card {
  background: #fff;
  border-radius: 14px;
  padding: 18px;
  margin-top: 16px;
  max-height: 520px;           /* controls huge height */
  overflow: auto;              /* scroll long contents */
  box-shadow: 0 10px 25px rgba(0,0,0,.10);
}

/* Details inside card */
.ss-variation-details {
  color: #173B37;
  line-height: 1.6;
  font-size: 14px;
}
.ss-variation-details h1,
.ss-variation-details h2,
.ss-variation-details h3,
.ss-variation-details h4,
.ss-variation-details h5 {
  color: #173B37;
  margin: 0 0 10px;
}

/* ✅ Move Add-to-cart + price directly under card */
.woocommerce div.product form.variations_form .single_variation_wrap {
  margin-top: 14px;
}
.woocommerce div.product form.variations_form .woocommerce-variation-price,
.woocommerce div.product form.variations_form .woocommerce-variation-availability {
  color: #fff;
}

/* Make qty + button aligned */
.woocommerce div.product form.cart .variations_button {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 12px;
}
.woocommerce div.product form.cart .quantity input.qty {
  height: 42px;
  width: 80px;
}
.woocommerce div.product form.cart button.single_add_to_cart_button {
  height: 42px;
  padding: 0 18px;
}

/* Hide first attribute dropdown row (since tabs control it) */
.ss-hidden-first-variation tr:first-child { display:none; }

/* Woo tabs below should not blend into dark bg */
.woocommerce div.product .woocommerce-tabs {
  margin-top: 40px;
}

.ss-variation-details strong,
.ss-variation-details b {
  display: block;
  margin-top: 14px;
  font-size: 15px;
}
.ss-variation-details ul {
  padding-left: 18px;
  margin: 8px 0 0;
}

.ss-variation-details p { color: #000;}

.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product p.price, .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product span.price {

	color:#fff;
	font-size: 1.50em;
 }

 
[type="button"]:focus, [type="button"]:hover, [type="submit"]:focus, [type="submit"]:hover, button:focus, button:hover {
  background-color: #c36;
  color: #fff;
  text-decoration: none;
}

.posted_in a {
  color: #fff;
  font-weight: 600;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
  background: #fff;
  color: #000;
  z-index: 2;
  border-bottom-color: #fff;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  color: #000000;
  opacity: .85;
}
.woocommerce-Tabs-panel h2, .related h2 {color: #fff;}


/**** **/