/* assets/css/cmm-style.css */

/* === Off-canvas base === */
#cmm-offcanvas {
  position: absolute;
  /* top: 0; left: 0; */
  width: 100%;
  /* max-width: 320px; */
  height: 100%; background: #BFD0EA;
  transform: translateX(-100%);
  transition: transform 0.3s ease;
  z-index: 10000; overflow: hidden;
}
#cmm-offcanvas.show {
  transform: translateX(0);
}

/* === Panel Background === */

.cmm-panel.cmm-panel-main.active{
    background-color: #BFD0EA;
}
.cmm-panel.cmm-panel-sub.active{
    background-color: #FEFCF7;
}

/* === Panel structure === */
.cmm-panel {
  position: absolute; top:0; left:0;
  width:100%; height:100%;
  background: #BFD0EA; padding:1em; box-sizing:border-box;
  overflow-y:auto;
  /* This will now only apply to main panel */
  transform: translateX(100%);
  transition: transform 0.4s ease;
  z-index:1;
}
/* Main panel in place */
.cmm-panel.active {
  transform: translateX(0);
  z-index:999;
}

/* Animate backward */
.cmm-panel.slide-out {
  transform: translateX(100%);
}

/* Header, Close */
.cmm-header { padding: .5em 1em; background: #f5f5f5; text-align: right; }
.cmm-close { background: none; border: none; font-size: 1.5em; cursor: pointer; }

/* Back Button */
.cmm-back {
  display: inline-flex; align-items: center;
  margin-bottom: 1em; background: none; border: none;
  cursor: pointer;
}
.cmm-back.hidden { display: none; }
.cmm-back span { margin-right: .5em; }

/* First modal: hide children */
.cmm-panel-main ul.sub-menu { display: none; }

/* Sub-panel: immediate children visible */
.cmm-panel-sub .cmm-submenu > ul.sub-menu { display: block; }

/* Hide nested grandchildren by default */
/* .cmm-panel-sub ul.sub-menu ul.sub-menu { display: none; } */

/* Toggle expand */
/* .cmm-inline-open > ul.sub-menu {
  display: block;
  animation: fadeIn 0.3s ease;
} */


/* Smooth accordion transition for nested sub-menus */
.cmm-panel-sub ul.sub-menu ul.sub-menu {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

/* When open, allow enough height for content */
.cmm-panel-sub li.cmm-inline-open > ul.sub-menu {
  max-height: 500px; /* adjust if your content taller */
}



/* Lists */
.cmm-menu, .cmm-menu-bottom, .cmm-submenu ul {
  list-style: none; margin: 0; padding: 0;
}
.cmm-menu li, .cmm-menu-bottom li, .cmm-submenu li {
  margin-bottom: .5em;
}
.cmm-menu a, .cmm-menu-bottom a, .cmm-submenu a {
  text-decoration: none; color: #333;
  display: flex; justify-content: space-between; align-items: center;
}
.cmm-expand {
  background: none; border: none;
  font-size: 1.2em; cursor: pointer;
}

/* Banner and footer */
.cmm-banner img {
  max-width: 100%; margin-top: 1em;
}
.cmm-footer {
  position: absolute; bottom: 0; left: 0;
  width: 100%; padding: 1em; background: #726a6a;
  box-sizing: border-box;
}

/* Animation */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}


/* Sub-panel: immediate children visible */
.cmm-panel-sub .cmm-submenu > ul.sub-menu {
  display: block;
}

/* Hide deeper nested submenus by default */
.cmm-panel-sub ul.sub-menu ul.sub-menu {
  display: none;
}

/* ---- NEW: Inline‐expand override for grandchildren ---- */
.cmm-panel-sub li.cmm-inline-open > ul.sub-menu {
  display: block !important;
  animation: fadeIn 0.3s ease;
}

/* === New: Ensure slide-in/out is only horizontal, no z-index flicker === */
.cmm-panel {
  /* keep your existing position/transform/transition */
  z-index: 1;          /* ensure default behind active panels */
}
.cmm-panel.active {
  z-index: 2;          /* bring the active panel forward */
}
.cmm-panel.slide-out {
  z-index: 2;          /* keep sliding panel on top while animating out */
}


/* Bottom menu in the main panel */
.cmm-menu-bottom-wrapper {
  margin-top: 2em;
  border-top: 1px solid #ddd;
  padding-top: 1em;
}

.cmm-menu-bottom {
  list-style: none;
  margin: 0;
  padding: 0;
}

.cmm-menu-bottom li {
  margin-bottom: 0.5em;
}

.cmm-menu-bottom a {
  color: #555;
  text-decoration: none;
}

/* mobile footer widget */

.cmm-widget-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1em 0;
}

.cmm-footer-logo img {
  max-height: 40px;
}

.cmm-footer-social a {
  margin-left: 10px;
  text-decoration: none;
  font-size: 14px;
  color: #333;
}

/* Disable page scrolling when mobile menu is open */
body.cmm-menu-open {
  overflow: hidden;
}


/* Second modal banner styling */
.cmm-banner {
  margin-top: 1.5em;
  text-align: center;
}
.cmm-banner img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto 0.5em;
}
.cmm-banner p {
  font-size: 1em;
  margin: 0.5em 0 0;
}
.cmm-banner a {
  color: inherit;
  text-decoration: none;
}



/* Header - Mobile view */
@media (max-width: 1024px){
	.white-bg-btn-container .wp-block-button__link.wp-element-button{
		margin:0px !important;
	}
	.white-bg-btn-container,.white-bg-btn-container .wp-block-button, .white-bg-btn-container a.wp-block-button__link.wp-element-button{	
		width: 100% !important;	
	}
	.cmm-panel.cmm-panel-main.active  {
		background-color: #BFD0EA;
		padding: 0px;
		color : #111 !important;
	}
	.column-main-container .wp-block-columns .Content-container.second-column, .column-main-container .wp-block-columns .Content-container.first-column{
		padding: 0px !important;
	}
	.cmm-panel.cmm-panel-sub.active{
		padding: 0px !important;
	}
	.cmm-panel button.cmm-back ,.cmm-panel ul.menu-main-mega-menu,.cmm-panel nav.cmm-menu-bottom-wrapper {
		padding: 30px 15px;
	}
	.cmm-panel .cmm-footer {
		position: fixed !important;
		bottom: 0px;
		left: 0;
		width: 100%;
		padding: 0px 15px;
		border-top: 0.8px solid #111111;
		background: unset ;
	}
	.cmm-panel .cmm-footer .cmm-widget-footer {
		align-items: flex-start;
	}
	.cmm-footer-social {
		line-height:100%;
	}
	.cmm-panel .cmm-footer .cmm-widget-footer.widget_cmm_widget{
		padding: 0px !important;
	}
	.cmm-panel .cmm-footer .cmm-widget-footer{
		width: 100%;
	}
	.cmm-menu-bottom-wrapper {
		position: absolute;
		bottom: 73px;
		width: 100%;
		margin-top: 0px;
		padding: 0px !important;
		background: #bfd0ea;
		z-index: 150;
	}
	ul.cmm-menu {
		display: flex;
		flex-direction: column;
		padding: 15px;
		gap: 12px;
		list-style: none; /* Optional: Removes default bullets */
		margin: 0;
	}
	nav.cmm-submenu ul.sub-menu, .cmm-panel-sub ul.sub-menu ul.sub-menu{
		padding: 15px;
	}
	ul.cmm-menu li {
		padding: 0px !important;
		margin: 0px !important;
		font-size: 24px;
		text-transform: uppercase;
		font-weight:400;
	}
	ul.cmm-menu-bottom li  {
		padding: 15px;
		margin: 0px;
		border-top: 0.8px solid #111;
	}
	ul.cmm-menu-bottom li a , .cmm-submenu a {
		color: #111;
		font-family:"Gerstner Programm FSL" !important;
		font-weight: 400;
		font-size: 14px;
		line-height: 100%;
		text-transform: uppercase;
		text-decoration: none;
	}
	.cmm-footer-social a {
		margin-left: 10px;
		text-decoration: none;
		font-size: 14px;
		color: #111111;
		font-weight: 400;
		text-transform: uppercase;
	}

	ul li.menu-item.has-children .sub-menu li
	{
		padding-bottom: 12px;
	}
	.cmm-submenu li{ margin: 0px !important;	}
	.cmm-banner  { padding: 15px;     position: fixed;	width: 100%;	bottom: 94px;}
	.cmm-banner img{
		height: 200px; object-fit: cover; width: 100% !important;
	}
}

/* Header - search */
.header-search-form{	padding: unset !important;	}
.header-search-form button.search-submit {
	background: unset !important;
	padding: 0px !important;
}
.header-search-form form{	padding: 15px 0px !important;	}
.header-search-form.active input#woocommerce-product-search-field-search-form-1{
	font-size: 14px;
	line-height: 14px;
	font-weight: 400;
	letter-spacing: 0;
	color: #11111166;

}
.header-search-form.active input#woocommerce-product-search-field-search-form-1:focus{	outline: none !important;	    box-shadow: none;
}
.header-search-form.active .search-submit .ws-svg-icon svg {
	display: none; /* Hide the original search icon */
}

.header-search-form.active .search-submit .ws-svg-icon::before {
	content: "";
	display: inline-block;
	width: 24px;
	height: 24px;
	background-image: url('https://qo78rm5cp4-staging.wpdns.site/wp-content/uploads/2025/05/right.svg');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.botiga-ajax-search__wrapper{
	top: calc(100% + 0px);
	background: #FEFCF7;
}
.botiga-ajax-search__wrapper h2.botiga-ajax-search__heading-title {
	display: none;
}

@media (max-width:600px)
{
	.mobile-header a.header-search.header-item {
		position:relative;
		top:-1;
	}
}

/*show search icon all the time*/
#masthead .header-search .icon-search, #masthead-mobile .header-search .icon-search{
	display: inline-block !important;
}
/*hide close-search icon all the time*/
#masthead .header-search .icon-cancel, #masthead-mobile .header-search .icon-cancel{
	display: none !important;
}
@media (max-width:1024px)
{
	.is-mega-menu-column ul.sub-menu.botiga-dropdown-ul li{
		display:none !important;
	}
	#cmm-offcanvas {
		overflow: hidden !important;
		position: fixed;
		width: 100%;

	}
	.cmm-panel button.cmm-expand {
		visibility:hidden !important; 
	}

	li.is-mega-menu .is-mega-menu-column.active-mega ul.sub-menu.botiga-dropdown-ul li{
		display:block !important;
	}
	.mobile-header-item #primary-menu > li > a.botiga-dropdown-link 
	{
		font-size:24px;	
		padding:12px 0px;
	}	
	.mobile-menu-visible .botiga-offcanvas-menu {
		padding:30px 15px !important; 
	}
	.mobile-header-item .is-mega-menu-column h4 {
		margin:0px;

	}
	.mobile-header-item  #primary-menu .botiga-mega-menu-column h4 {
		margin-bottom:0px;
	}
	/* 	.is-mega-menu:not(.is-mega-menu-vertical) .botiga-mega-menu-column>.sub-menu.botiga-dropdown-ul {
	display:none !important;
} */
	.mobile-header-item .is-mega-menu-column h4 {
		font-size:24px;
		padding:12px 0px;
	}
	.mobile-header-item .botiga-dropdown .botiga-dropdown-ul .botiga-dropdown-ul .botiga-dropdown-link {
		padding:0px 0px 6px 0px;
		text-transform:uppercase;
	}
	.mobile-menu-visible .botiga-offcanvas-menu .botiga-dropdown .sub-menu {
		padding-left:0px;
	}
	.mobile-header-item .is-mega-menu:not(.is-mega-menu-vertical) .botiga-mega-menu-column {
		margin-left:0px;
	}
	.mobile-header-item .is-mega-menu-column.activated .sub-menu.botiga-dropdown-ul {
		display:block !important;
	}
	.clicked-for-activation {
		display:none !important;
	}

	.botiga-offcanvas-menu .botiga-dropdown .botiga-dropdown-ul .botiga-dropdown-li {
		padding-top: 0px !important;
	}

	.menu-bottom-header ul li {
		list-style-type:none;
		width:100%;
		padding-bottom:0px;
		border-bottom: 0.8px solid #111111;
	}
	.menu-bottom-header ul li:first-child {
		border-top: 0.8px solid #111111;
	}
	.menu-bottom-header ul {
		padding-left:0px; 
	}
	.menu-bottom-header ul li a {
		font-family: Gerstner Programm FSL;
		font-weight: 400;
		font-size: 14px;
		line-height:14px;
		text-transform: uppercase;
		padding:15px 0px;
		display:block;
		width:100%;
	}
	.botiga-offcanvas-menu.toggled .col:nth-child(1)
	{
		display:none;
	}
}

.close-main-menuz li > a.botiga-dropdown-link {
	display:none; 
}
.close-main-menu li > a.botiga-dropdown-link {
	display:none; 
}

/* custom header override css */
body .cmm-back {
	padding-bottom:unset;
	margin-bottom:unset;
}
.cmm-panel button.cmm-back {
	padding:25px 0px 11px 20px; 
}
.cmm-back span {
	font-size:20px; 
}
body.theme-botiga .header-transparent-wrapper {
	margin-bottom:unset !important;
}

.cmm-back span {
	display: inline-block; 
	line-height: 20px; 
}

/* 
Updated css for the bottom menus */

body .cmm-panel.slide-out {
	transform: translateX(-100%);
}
body li.menu-item.has-children > a {
	font-weight: 400;
	font-size: 24px ;
	line-height: 100%;
	text-transform: uppercase;
	font-family: "Quadrant Text" !important;
}

/* Ensure <a> is a flex container */
body li.menu-item.has-children > a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-bottom:12px;
	text-decoration: none;
	height: auto;
	line-height: 1.2;
}

/* Fix for span inside */
body li.menu-item.has-children > a .cmm-item-title {
	margin: 0;
	padding: 0;
	line-height: 100%;
}

/* Reset and shrink the button */
body li.menu-item.has-children > a .cmm-expand {
	all: unset; /* removes all default styles */
	font-size: 24px;
	line-height: 100%;
	cursor: pointer;

	display: flex;
	align-items: center;
}

li.menu-item.has-children.cmm-inline-open ul{
	padding:0px;
}
li.menu-item.has-children.cmm-inline-open ul li:not(:last-child) {
	padding-bottom:6px; 
}
li.menu-item.has-children.cmm-inline-open ul li:last-child {
	padding-bottom:0px;
	margin-bottom:25px !important;
}
li.menu-item.has-children.cmm-inline-open ul li a span{
	font-family: Gerstner Programm FSL !important;
}

.cmm-panel-sub .cmm-banner a p {
	font-weight: 400;
	font-size: 14px;
	line-height: 100%;
	text-align: center;
}

@media (max-width:1024px)
{
	.mobile-header {
		padding-top:20px;
		padding-bottom:20px;
	}
	body.single-product .mobile-header .container {
		padding:0px 15px 0px 15px !important;
	}

	body.single-product .mobile-header .col-md-4 {
		padding-bottom:0px; 
		padding-left:0px;
		padding-right:0px;
	}
	.custom-logo-link img {
		max-width:128px;
	}
	.single-product .mobile-header .container .row {
		align-items:center;
	}
	.mobile-header .container .row .col-md-4 {
		display:flex;
		align-items:center;
	}
}
@media (max-width:1024px) and (min-width:601px)
{
	.mobile-header .container .row .col-md-4:nth-child(2)
	{
		justify-content:center; 
	}
}
body .site-header {
	border-bottom: 0.8px solid #111111;
}
.mobile-header .container .row .col-md-4 {
	padding-bottom:unset; 
}
@media (max-width:767px)
{
	body .mobile-header {
		padding-top: 20px;
		padding-bottom: 20px;
	}   
	.cart-count .count-number {
		color:#111111;
	}
	.mobile-header a.header-search.header-item {
		margin-right:10px; 
	}
	.menu-toggle i {
		width:20px;
		height:20px;
	}
	.mobile-header .header-item .ws-svg-icon img {
		width:20px;
		height:20px;
	}
	.mobile-header .menu-toggle i {
		width:20px !important;
		height:20px !important;
	}
	body .site-header .ws-svg-icon {
		width:20px !important;
		height:20px !important;
	}
	.header-search .icon-cancel svg {
		width:20px !important;
		height:20px !important;
	}
	.mobile-header .icon-cancel path {
		-webkit-transform: scale(0.50) ;
		transform: scale(0.50);
	}
	.header-search .icon-cancel.active {
		position:relative;
		top:3px;
		left:2px;
	}

}
body #masthead-mobile svg:not(.stroke-based) {
	fill: #111111;
} 

body.woocommerce-checkout .site-header .site-branding {
	position:relative !important; 
	left: unset !important;
	top: unset !important;
	transform: unset !important;
}
body.woocommerce-checkout #masthead .main-navigation {
	display:block;
}
body.woocommerce-checkout .header-item {
	display:block;
}
body.woocommerce-checkout .header-wishlist-icon 
{
	display:inline-flex !important 
}
body.woocommerce-checkout .menu-item-299572.botiga-mega-menu:hover:before {
	display:none;
}
body.woocommerce-checkout .menu-item-299573.botiga-mega-menu:hover:before {
	display:none;
}