/*
Theme Name:     Bear Creek Felting
Description:    Bear Creek Felting- A Divi Child Theme modified by Ultimate WP Help
Author:         help
Template:       Divi

(optional values you can add: Theme URI, Author URI, Version, License, License URI, Tags, Text Domain)
*/
/* CSS to open the second toggle of the product pages
/* Force the second accordion ("About the Product") open on product pages */
/* Open the second accordion item ("About the Product") on product pages */
.single-product .et_pb_accordion .et_pb_accordion_item_1_tb_body .et_pb_toggle_content {
    display: block !important;
    height: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
}
/* Make the second accordion item look open (white background) */
.single-product .et_pb_accordion .et_pb_accordion_item_1_tb_body {
    background-color: #ffffff !important;
}

/* Optional: if your theme applies gray via the title element */
.single-product .et_pb_accordion .et_pb_accordion_item_1_tb_body .et_pb_toggle_title {
    background-color: #ffffff !important;
}


/* Woocommerce members product detail badge page */
.members-badge-container  {
	display: none;
	top: 12px;
	left: 6%;
	position: absolute;
	z-index: 1;
}

/* Woocommerce members product badge in the shop page */
.members1 {
	background: #fff000;
	color: #000;
	font-family: 'Alegreya Sans SC', Helvetica, Arial, Lucida, sans-serif !important;
	font-weight: 600;
	text-transform: uppercase;
	padding: 2px 20px;
    font-size: 12px;
	font-weight: 600;
    margin-top: 0;
	float: right;
	border-radius: 25px;
}

/* Display custom product badges for the shop page with checking a checkbox */
.custom-badge-1 {
    font-size: 16px;
	color: #c94024;
	font-weight: 600;
	background: #ffffff;
	border: 2px solid #ffffff;
	text-align: center;
	display: inline;
	position: absolute;
	top: 12px;
	left: 15%;
	border-radius: 25px;
	padding: 2px 20px;
	width: 160px;
}

/* For mobile*/
@media screen and (max-width: 600px) {
.custom-badge-1 {
    font-size: 10px;
	color: #c94024;
	font-weight: 600;
	background: #ffffff;
	border: 1px solid #ffffff;
	text-align: center;
	display: inline;
	position: absolute;
	top: 45%;
	left: 12%;
	border-radius: 25px;
	padding: 2px 4px;
	width: 113px;
}
}

/* For tablet portrait mode*/
@media (min-width: 768px) and (max-width: 1024px) {
.custom-badge-1 {
    font-size: 12px;
	color: #c94024;
	font-weight: 600;
	background: #ffffff;
	border: 1px solid #ffffff;
	text-align: center;
	display: inline;
	position: absolute;
	top: 45%;
	left: 14%;
	border-radius: 25px;
	padding: 2px 4px;
	width: 120px;
}
}

.entry-summary .price {
	margin-top: 1em;
}

/*To switch the text and image on mobile*/
@media screen and (max-width: 600px) {
	.mobile-switch{
		flex-direction: column-reverse;
		display:flex;
	}
}


/*Pinterest icon position on Shop pages*/
.pinterest-for-woocommerce-image-wrapper {
	left: 38% !important;
	top: 1px;
	visibility: visible !important;
	z-index: 50 !important;
	
}
/*To have the Pinterest button show up on product page*/
.single-product .pinterest-for-woocommerce-image-wrapper {
  opacity: 1 !important;
  visibility: visible !important;
}

/* WooCommerce Best Seller Ribbon Styles */
.custom-ribbon {
    position: absolute;
	font-family: 'Alegreya Sans SC', Helvetica, Arial, Lucida, sans-serif !important;
     top: 65px;
     left: -20px;
     width: 120px;
     height: 25px;
     background: #c94024;
     color: #fff;
     font-weight: bold;
     font-size: 13px;
     line-height: 25px;
     text-align: center;
     transform: rotate(-45deg);
     transform-origin: 0 0;
     z-index: 10;
     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
 }

/* Ensure parent containers have relative positioning and clip overflow */
.woocommerce ul.products li.product,
.wc-block-product,
.wc-block-grid__product,
.et_pb_shop_grid_item,
.et_shop_product,
li.product,
.product {
    position: relative !important;
    overflow: hidden !important;
}

/* skip product categories */
li.product-category .custom-ribbon {
    display: none;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .custom-ribbon {
        font-size: 12px;
        padding: 3px 4px;
        min-width: 50px;
    }
}