/* ==========================================================================
   ShaadiWear / clothing — Responsive layer
   File: assets/css/responsive-custom.css
   Loads AFTER assets/css/responsive.css. Nothing else needs editing.

   Breakpoints
   -----------
   1400px  wide desktop trim
   1200px  primary nav switches to off-canvas (slides in left ➜ right)
   992px   two-column blocks stack
   768px   phone
   576px   small phone

   The off-canvas panel is #mySidenav (already in header.php). The toggle,
   close button, overlay and submenu carets are injected by menu-toggle.js
   and use their own class names (nav_toggle_btn / nav_close_btn /
   nav_overlay / submenu_toggle) so they cannot collide with the leftover
   .hamburger_menu_icon and nav#site-navigation rules in responsive.css.
   ========================================================================== */


/* --------------------------------------------------------------------------
   0. Base safety — the theme has no normalize / no global image constraint
   -------------------------------------------------------------------------- */

img,
svg,
video,
iframe,
object,
embed {
	max-width: 100%;
}

img {
	height: auto;
}

table {
	max-width: 100%;
}

/* Long words / URLs must not push the layout sideways */
h1, h2, h3, h4, h5, h6, p, li, td, th, dd, dt, figcaption {
	overflow-wrap: break-word;
}


/* --------------------------------------------------------------------------
   1. Container — style.css only defines it above 1024px, so below that it
      has no gutter at all and content touches the viewport edge.
   -------------------------------------------------------------------------- */

@media (max-width: 1023.98px) {

	.container,
	.woocommerce-cart #page {
		width: 100%;
		max-width: 100%;
		margin-right: auto;
		margin-left: auto;
		padding-right: 15px;
		padding-left: 15px;
	}
}


/* --------------------------------------------------------------------------
   2. Desktop only — hide the injected mobile controls
   -------------------------------------------------------------------------- */

@media (min-width: 1200px) {

	.nav_toggle_btn,
	.nav_close_btn,
	.nav_overlay,
	#mySidenav .submenu_toggle {
		display: none !important;
	}
}


/* --------------------------------------------------------------------------
   3. 1400px and down
   -------------------------------------------------------------------------- */

@media (max-width: 1399.98px) {

	/* hero */
	.hero_banner_content {
		padding: 0 100px;
	}

	h1.banner_heading {
		font-size: 56px;
	}

	/* shop events */
	/* banner + content */
	.banner_content_wrapper {
		gap: 40px;
	}

	.feature_image_wrap {
		flex: 1 1 50%;
		width: 50%;
		min-width: 0;
		height: 700px;
	}

	.feature_content_wrapp {
		flex: 1 1 50%;
		width: 50%;
		min-width: 0;
	}

	h1.heading_bac {
		font-size: 56px;
		line-height: 1.1;
	}

	/* content + video */
	.video_cpv {
		height: 640px;
	}

	.right_image_cpv img {
		height: 580px;
		object-fit: cover;
	}

	/* woo archive banner */
	header.woocommerce-products-header {
		padding: 120px 0;
	}

	/* single product gallery */
	body.woocommerce .single_product_custom_wrapper .woocommerce-product-gallery {
		max-height: 820px;
	}

	.woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image {
		min-height: 0;
	}

	body.woocommerce .single_product_custom_wrapper .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image > a img {
		height: 780px !important;
	}

	body.woocommerce .single_product_custom_wrapper ol.flex-control-nav.flex-control-thumbs li {
		width: 130px !important;
		height: 165px;
		max-height: 165px;
	}
}


/* --------------------------------------------------------------------------
   4. 1200px – 1399px — keep the inline menu, just tighten it
   -------------------------------------------------------------------------- */

@media (min-width: 1200px) and (max-width: 1399.98px) {

	header .menu li a {
		padding: 20px 12px;
		font-size: 13px;
	}
}


/* ==========================================================================
   5. 1199px and down — OFF-CANVAS NAVIGATION + tablet layout
   ========================================================================== */

@media (max-width: 1199.98px) {

	/* ---------- stacking context -------------------------------------------
	   style.css gives header z-index:99 while .product_tax_wrapper
	   .filter-content uses 99999, so the header has to out-rank it or a
	   YITH filter dropdown can paint over the open panel.
	   ---------------------------------------------------------------------- */
	header.site-header {
		z-index: 999999;
	}

	/* ---------- top bar ---------------------------------------------------- */
	.inner_content_bar {
		padding: 8px 15px;
		line-height: 1.5;
		text-align: center;
	}

	/* ---------- logo row -------------------------------------------------- */
	.main-header {
		padding: 12px 0 14px;
	}

	.logo_bar {
		position: relative;
		display: flex;
		align-items: center;
		min-height: 46px;
	}

	.site-branding {
		flex: 1 1 auto;
		margin-bottom: 0;
		padding: 0 52px;
	}

	.site-branding img,
	.site-branding .custom-logo {
		width: auto;
		max-width: 170px;
		height: auto;
		object-fit: contain;
	}

	/* ---------- hamburger ------------------------------------------------- */
	.nav_toggle_btn {
		position: absolute;
		top: 50%;
		left: 0;
		z-index: 2;
		display: flex;
		flex-direction: column;
		justify-content: center;
		gap: 6px;
		width: 42px;
		height: 42px;
		padding: 11px 6px;
		border: 0;
		background: transparent;
		cursor: pointer;
		transform: translateY(-50%);
		-webkit-appearance: none;
		appearance: none;
	}

	.nav_toggle_btn span {
		display: block;
		width: 100%;
		height: 2px;
		border-radius: 2px;
		background-color: var(--Deep_Maroon);
		transition: transform .3s ease, opacity .2s ease;
	}

	.nav_toggle_btn.is_active span:nth-child(1) {
		transform: translateY(8px) rotate(45deg);
	}

	.nav_toggle_btn.is_active span:nth-child(2) {
		opacity: 0;
	}

	.nav_toggle_btn.is_active span:nth-child(3) {
		transform: translateY(-8px) rotate(-45deg);
	}

	.nav_toggle_btn:focus-visible,
	.nav_close_btn:focus-visible,
	#mySidenav .submenu_toggle:focus-visible {
		outline: 2px solid var(--gold);
		outline-offset: 2px;
	}

	/* ---------- the panel (slides in from the left) ----------------------- */
	#mySidenav.sidenav {
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		z-index: 10;
		display: block;
		width: 320px;
		max-width: 86vw;
		height: 100%;
		padding: 74px 0 40px;
		border-right: 1px solid #D4C4B0;
		background-color: var(--Ivory);
		box-shadow: 0 0 40px rgba(0, 0, 0, .14);
		overflow-x: hidden;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		visibility: hidden;
		transform: translateX(-100%);
		transition: transform .35s ease, visibility 0s linear .35s;
	}

	#mySidenav.sidenav.nav_open {
		visibility: visible;
		transform: translateX(0);
		transition: transform .35s ease, visibility 0s linear 0s;
	}

	#mySidenav > div {
		width: 100%;
	}

	/* ---------- overlay --------------------------------------------------- */
	.nav_overlay {
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 9998;
		background-color: rgba(26, 20, 16, .45);
		opacity: 0;
		visibility: hidden;
		cursor: pointer;
		transition: opacity .3s ease, visibility 0s linear .3s;
	}

	.nav_overlay.is_visible {
		opacity: 1;
		visibility: visible;
		transition: opacity .3s ease, visibility 0s linear 0s;
	}

	body.nav_open_body {
		overflow: hidden;
	}

	/* ---------- close button --------------------------------------------- */
	.nav_close_btn {
		position: absolute;
		top: 18px;
		right: 16px;
		width: 38px;
		height: 38px;
		padding: 0;
		border: 0;
		background: transparent;
		color: var(--Deep_Maroon);
		line-height: 0;
		cursor: pointer;
	}

	.nav_close_btn svg {
		display: block;
		width: 18px;
		height: 18px;
		margin: 0 auto;
	}

	/* ---------- menu inside the panel ------------------------------------ */
	#mySidenav .menu {
		display: block;
		width: 100%;
		list-style: none;
	}

	#mySidenav .menu li {
		position: relative;
		width: 100%;
	}

	#mySidenav .menu > li {
		border-bottom: 1px solid rgba(212, 196, 176, .6);
	}

	#mySidenav .menu li a {
		display: block;
		width: 100%;
		padding: 14px 52px 14px 24px;
		font-size: 14px;
		line-height: 20px;
		letter-spacing: 1px;
		text-transform: uppercase;
		background-color: transparent;
		color: var(--taupe) !important;
		transition: color .2s linear;
	}

	#mySidenav .menu li a:hover,
	#mySidenav .menu li a:focus {
		background-color: rgba(212, 196, 176, .25);
		color: var(--Deep_Maroon) !important;
		letter-spacing: 1px;
	}

	/* Neutralises the leftover aqua "current item" rule in responsive.css */
	header .current-menu-item a {
		background-color: transparent;
		letter-spacing: 1px;
	}

	#mySidenav .current-menu-item > a,
	#mySidenav .current_page_item > a {
		color: var(--Deep_Maroon) !important;
		font-weight: 500;
	}

	/* ---------- sub-menus become an accordion ---------------------------- */
	#mySidenav .sub-menu {
		position: static;
		z-index: auto;
		display: none;
		width: 100%;
		min-width: 0;
		padding: 4px 0;
		background-color: rgba(212, 196, 176, .18);
		list-style: none;
		opacity: 1;
		visibility: visible;
		transition: none;
	}

	#mySidenav .menu-item-has-children.submenu_open > .sub-menu {
		display: block;
	}

	#mySidenav .sub-menu a {
		width: 100%;
		padding: 12px 52px 12px 40px;
		font-size: 13px;
		letter-spacing: .5px;
		text-transform: none;
	}

	#mySidenav .submenu_toggle {
		position: absolute;
		top: 0;
		right: 0;
		width: 52px;
		height: 48px;
		padding: 0;
		border: 0;
		border-left: 1px solid rgba(212, 196, 176, .6);
		background: transparent;
		color: var(--taupe);
		line-height: 0;
		cursor: pointer;
	}

	#mySidenav .sub-menu .submenu_toggle {
		height: 44px;
	}

	#mySidenav .submenu_toggle svg {
		display: block;
		width: 11px;
		height: 11px;
		margin: 0 auto;
		fill: currentColor;
		transition: transform .25s ease;
	}

	#mySidenav .submenu_open > .submenu_toggle svg {
		transform: rotate(180deg);
	}

	#mySidenav .submenu_open > .submenu_toggle {
		color: var(--Deep_Maroon);
	}

	/* ---------- hero ------------------------------------------------------ */
	.banner-slider {
		height: 78vh;
		min-height: 480px;
	}

	.hero_banner_content {
		padding: 0 40px;
	}

	h1.banner_heading {
		font-size: 44px;
	}

	.banner_description {
		font-size: 15px;
	}

	/* ---------- shop events ---------------------------------------------- */
	.shop_events {
		padding: 60px 0;
	}

	h1.s_event_heading {
		margin-bottom: 30px;
	}



	img.s_event_img {
		object-fit: cover;
	}

	.shop_event_item {
		margin: 0 8px;
	}

	.shop_event_slider .slick-list {
		margin: 0 -8px;
	}

	h2.s_event_name {
		font-size: 22px;
	}

	/* ---------- banner + content ----------------------------------------- */
	.banner_and_content {
		padding: 60px 0;
	}

	.feature_image_wrap {
		height: 520px;
	}

	h1.heading_bac {
		font-size: 42px;
		margin-bottom: 20px;
	}

	/* ---------- icons list ----------------------------------------------- */
	.icons_list {
		padding: 60px 0;
	}

	.features_icons_list {
		flex-wrap: wrap;
		justify-content: center;
		gap: 34px 30px;
		max-width: 100%;
	}

	.features_icons_list .feature-box {
		width: calc(33.333% - 20px);
	}

	/* no hover on touch — reveal the description */
	.features_icons_list .feature-box span {
		opacity: 1;
	}

	/* ---------- featured video reels ------------------------------------- */
	.featured-videos {
		padding: 60px 0;
	}

	.video-controls button {
		width: 64px;
		height: 64px;
	}

	.video-controls button svg {
		width: 34px;
		height: 34px;
	}

	/* ---------- common banner -------------------------------------------- */
	.feature_commoon_banner {
		padding: 110px 0;
	}

	.feature_commob_banner_heading h1 {
		font-size: 48px;
	}

	/* ---------- content + video ------------------------------------------ */
	.content_plus_video {
		padding: 50px 0;
	}

	.content_video_wrappper {
		gap: 40px;
	}

	.video_cpv {
		max-width: 100%;
		height: 520px;
	}

	.right_image_cpv img {
		height: 460px;
	}

	/* ---------- footer --------------------------------------------------- */
	footer {
		padding: 42px 0 32px;
	}

	/* ---------- woo archive ---------------------------------------------- */
	header.woocommerce-products-header {
		padding: 90px 0;
	}

	.woocommerce-products-header h1.page-title {
		font-size: 40px;
	}

	.product_tax_wrapper {
		padding: 50px 0;
	}

	body ul.products.columns-4 .product,
	body section.related.products .products.columns-4 .product {
		width: calc(33.333% - 7px);
	}

	.filter_cat_wraper_custom {
		flex-wrap: wrap;
		gap: 15px;
	}

	/* ---------- single product ------------------------------------------- */
	.single_product_galler_section_wrapper {
		gap: 20px;
	}

	body.woocommerce .single_product_custom_wrapper .woocommerce-product-gallery {
		max-height: 680px;
	}

	body.woocommerce .single_product_custom_wrapper .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image > a img {
		height: 640px !important;
	}

	body.woocommerce .single_product_custom_wrapper ol.flex-control-nav.flex-control-thumbs li {
		width: 105px !important;
		height: 130px;
		max-height: 130px;
	}

	/* ---------- FAQ accordion -------------------------------------------- */
	section.faq_section_category_woo {
		padding: 25px 0 60px;
	}
}


/* ==========================================================================
   6. 991px and down — two-column blocks stack
   ========================================================================== */

@media (max-width: 991.98px) {

	/* hero */
	.banner-slider {
		height: 70vh;
		min-height: 420px;
	}

	.hero_banner_content {
		padding: 0 24px;
	}

	h1.banner_heading {
		font-size: 34px;
	}

	a.primary_btn.hero_btn {
		padding: 10px 20px;
		font-size: 15px;
	}

	/* shop events */
	.sevent_content {
		height: 460px;
	}

	/* banner + content */
	.banner_content_wrapper {
		flex-direction: column;
		gap: 30px;
	}

	.feature_image_wrap,
	.feature_content_wrapp {
		flex: 0 0 auto;
		width: 100%;
	}

	.feature_image_wrap {
		height: 420px;
	}

	h1.heading_bac {
		font-size: 34px;
	}

	.feature_list_wrapper {
		flex-wrap: wrap;
		justify-content: flex-start;
		gap: 26px 24px;
	}

	.feature_list_item {
		width: calc(33.333% - 16px);
	}

	/* icons list */
	.features_icons_list .feature-box {
		width: calc(50% - 15px);
	}

	/* content + video */
	.content_video_wrappper {
		flex-direction: column;
		gap: 30px;
	}

	.left_content,
	.right_content {
		width: 100%;
	}

	.video_cpv {
		height: 460px;
		margin: 0 auto;
	}

	.right_image_cpv img {
		height: 380px;
	}

	/* common banner */
	.feature_commoon_banner {
		padding: 80px 0;
	}

	.feature_commob_banner_heading h1 {
		font-size: 36px;
	}

	/* footer */
	.footer_widget_item {
		width: calc(50% - 5px);
	}

	.footer_bar .menu {
		flex-wrap: wrap;
		justify-content: center;
	}

	.footer_bar_content {
		text-align: center;
	}

	/* woo archive */
	header.woocommerce-products-header {
		padding: 70px 0;
	}

	.woocommerce-products-header h1.page-title {
		font-size: 32px;
	}

	.product_castegory_main_banner_wrao {
		text-align: center;
	}

	.social_links_cat_wrap {
		flex-wrap: wrap;
		justify-content: center;
		gap: 12px 20px;
	}

	body ul.products.columns-4 .product,
	body section.related.products .products.columns-4 .product {
		width: calc(50% - 5px);
	}

	/* single product — gallery over summary */
	.single_product_galler_section_wrapper {
		flex-direction: column;
	}

	body.woocommerce .single_product_custom_wrapper .woocommerce-product-gallery {
		width: 100% !important;
		max-height: 520px;
	}

	body.woocommerce .single_product_galler_section_wrapper .summary.entry-summary {
		width: 100%;
	}

	body.woocommerce .single_product_custom_wrapper .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image > a img {
		height: 460px !important;
	}

	body.woocommerce .single_product_custom_wrapper ol.flex-control-nav.flex-control-thumbs li {
		width: 88px !important;
		height: 92px;
		max-height: 92px;
	}

	/* FAQ */
	.acc_cat_heading {
		padding: 12px 16px;
		font-size: 17px;
	}

	.acc_tax_content {
		padding: 15px 16px;
	}

	.collection-section {
		padding: 26px;
	}
}


/* ==========================================================================
   7. 767px and down — phone
   ========================================================================== */

@media (max-width: 767.98px) {

	/* hero — keep an explicit height, slick sizes .slick-list off the parent */
	.banner-slider {
		height: 520px;
		min-height: 0;
	}

	.hero_banner_content {
		padding: 0 20px;
	}

	h1.banner_heading {
		font-size: 28px;
	}

	.banner_description {
		font-size: 14px;
		text-align: left;
	}

	.banner-section ul.slick-dots {
		bottom: 14px;
	}

	.banner-section ul.slick-dots li {
		width: 22px;
	}

	/* shop events */
	.shop_events {
		padding: 45px 0;
	}

	h1.s_event_heading {
		margin-bottom: 22px;
	}

	

	h2.s_event_name {
		font-size: 18px;
	}

	.shop_event_item {
		margin: 0 5px;
	}

	.shop_event_slider .slick-list {
		margin: 0 -5px;
	}

	/* banner + content */
	.banner_and_content {
		padding: 45px 0;
	}

	.feature_image_wrap {
		height: 300px;
	}

	h1.heading_bac {
		font-size: 26px;
		margin-bottom: 16px;
	}

	.heading_bac * {
		margin-bottom: 16px;
	}

	.feature_list_wrapper {
		gap: 22px 20px;
	}

	.feature_list_item {
		width: calc(50% - 10px);
		gap: 12px;
	}

	/* icons list */
	.icons_list {
		padding: 45px 0;
	}

	.features_icons_list {
		gap: 26px 20px;
	}

	.features_icons_list .feature-box {
		width: calc(50% - 10px);
	}

	.features_icons_list .feature-icon {
		width: 64px;
		height: 64px;
	}

	.features_icons_list .feature-icon svg {
		width: 32px;
		height: 24px;
	}

	.features_icons_list .feature-box p {
		font-size: 16px;
	}

	/* featured video reels */
	.featured-videos {
		padding: 45px 0;
	}

	.video-controls button {
		width: 54px;
		height: 54px;
	}

	.video-controls button svg {
		width: 28px;
		height: 28px;
	}

	/* common banner */
	.feature_commoon_banner {
		padding: 55px 0;
	}

	.feature_commob_banner_heading h1 {
		font-size: 26px;
	}

	/* content + video */
	.content_plus_video {
		padding: 40px 0;
	}

	.video_cpv {
		height: 360px;
	}

	.right_image_cpv img {
		height: 260px;
	}

	.content_vide_section p {
		font-size: 14px;
		line-height: 24px;
	}

	/* footer */
	footer {
		padding: 36px 0 26px;
	}

	.footer_wrapper {
		gap: 26px;
	}

	.footer_widget_item {
		width: 100%;
	}

	footer .widget-title,
	footer .wp-block-heading {
		margin-bottom: 12px;
	}

	.footer_logo img {
		max-width: 170px;
	}

	section.footer_bar {
		padding: 12px 0;
	}

	.footer_bar .menu {
		gap: 8px 14px;
	}

	/* buttons */
	.primary_btn {
		min-width: 0;
		font-size: 16px;
		letter-spacing: 1px;
	}

	/* woo archive */
	header.woocommerce-products-header {
		padding: 55px 0;
	}

	.woocommerce-products-header h1.page-title {
		font-size: 26px;
	}

	.product_castegory_main_banner_wrao a {
		font-size: 16px;
	}

	.product_tax_wrapper {
		padding: 35px 0;
	}

	body ul.products.columns-4 .product,
	body section.related.products .products.columns-4 .product {
		width: calc(50% - 5px);
		border-radius: 16px;
	}

	body ul.products.columns-4 .product img {
		border-radius: 16px;
	}

	.woocommerce-loop-item {
		padding: 14px 10px;
	}

	h2.woocommerce-loop-product__title {
		font-size: 14px;
	}

	body .woocommerce-loop-item .add_to_cart_button,
	body .woocommerce-loop-item .product_type_variable,
	body .woocommerce-loop-item .add_to_cart_button:hover,
	body .woocommerce-loop-item .product_type_variable:hover {
		padding: 9px 18px;
		font-size: 13px;
	}

	/* filter bar */
	.filter_cat_wraper_custom {
		flex-direction: column;
		align-items: stretch;
		gap: 12px;
	}

	.filter_cat_wraper_custom p.woocommerce-result-count {
		text-align: center;
	}

	.product_tax_wrapper .filters-container form {
		flex-wrap: wrap;
		justify-content: center;
		gap: 12px 20px;
		padding: 12px 18px;
		border-radius: 20px;
	}

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

	/* dropdown was translateX(-50%) — that pushes it off a phone screen */
	.product_tax_wrapper .filter-content {
		left: 0;
		width: min(280px, calc(100vw - 40px));
		transform: none;
	}

	/* single product */
	.single_product_custom_wrapper {
		padding: 15px 0;
	}

	.single_product_galler_section_wrapper {
		gap: 18px;
	}

	.single_product_custom_wrapper h1.product_title.entry-title {
		font-size: 17px;
	}

	body.woocommerce .single_product_custom_wrapper .woocommerce-product-gallery {
		max-height: 400px;
	}

	body.woocommerce .single_product_custom_wrapper .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image > a img {
		height: 340px !important;
	}

	body.woocommerce .single_product_custom_wrapper ol.flex-control-nav.flex-control-thumbs li {
		width: 68px !important;
		height: 70px;
		max-height: 70px;
	}

	.single_product_custom_wrapper button.slick-arrow {
		width: 28px;
		height: 28px;
		top: calc(100% - 28px);
	}

	.single_product_custom_wrapper .slick-next {
		left: calc(50%);
	}

	.single_product_custom_wrapper .slick-prev {
		left: calc(50% - 28px);
	}

	a.primary_btn.whatsapp_btn {
		font-size: 15px;
	}

	.single_product_post_link_button a {
		padding: 13px 15px;
		font-size: 14px;
	}

	section.related.products h2 {
		font-size: 24px;
	}

	/* FAQ */
	section.faq_section_category_woo {
		padding: 20px 0 45px;
	}

	h2.faq_haading {
		margin-bottom: 24px;
	}

	.acc_tax_wrapper {
		padding: 6px;
	}

	.acc_cat_heading {
		padding: 12px;
		font-size: 16px;
	}

	.acc_tax_content {
		padding: 12px;
	}

	.collection-section {
		margin: 24px auto;
		padding: 22px 18px;
	}
}


/* ==========================================================================
   8. 575px and down — small phone
   ========================================================================== */

@media (max-width: 575.98px) {
	.feature_image_wrap img {
		object-fit: contain;
	}
	.banner-slider {
		height: 460px;
	}
	.shop_event_slider .slick-active.slick-center img {
		object-fit: contain;
	}

	h1.banner_heading {
		font-size: 24px;
	}

	.site-branding img,
	.site-branding .custom-logo {
		max-width: 140px;
	}

	h2.s_event_name {
		font-size: 16px;
	}

	.feature_image_wrap {
		height: 250px;
	}

	.features_icons_list .feature-box {
		width: 100%;
	}

	.video_cpv {
		height: 300px;
	}

	.right_image_cpv img {
		height: 220px;
	}

	body ul.products.columns-4 .product,
	body section.related.products .products.columns-4 .product {
		width: 100%;
	}

	body.woocommerce .single_product_custom_wrapper ol.flex-control-nav.flex-control-thumbs li {
		width: 58px !important;
		height: 60px;
		max-height: 60px;
	}
}


/* --------------------------------------------------------------------------
   9. Reduced motion
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {

	#mySidenav.sidenav,
	.nav_overlay,
	.nav_toggle_btn span,
	#mySidenav .submenu_toggle svg {
		transition-duration: .01ms;
	}

	.image_feature img {
		animation: none;
	}
}


/* --------------------------------------------------------------------------
   10. Optional: the theme ships no .screen-reader-text rule, so screen-reader
       only headings (index.php page title) render as visible text. Delete
       this block if you'd rather handle it elsewhere.
   -------------------------------------------------------------------------- */

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	overflow: hidden;
	white-space: nowrap;
	word-wrap: normal !important;
}
#mySidenav .menu li a {
	position: relative;
}

#mySidenav .menu-item-has-children > a::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 26px;
	width: 7px;
	height: 7px;
	margin-top: -5px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg);
	transition: transform .25s ease;
}

#mySidenav .submenu_open > a::after {
	margin-top: -2px;
	transform: rotate(-135deg);
}