/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

div.col-inner .brand-name.category, div.col-inner p.name.product-title, div.col-inner p.product-info {
    margin-bottom:10px;
}

/* Badge Styles */

.badge-inner {
    z-index: 100;
    background: #ffffff !important;
    border: 1px solid black;
    color: #000000 !important; 
    font-size:.625rem; 
    text-transform:uppercase; 
    line-height:1.125rem !important;
    text-align: center;
}

.badge-inner.on-sale {
background-color: var(--fs-color-secondary) !important;
color: white !important; 
line: height 0.85em;
padding:2px;
border:1px solid var(--fs-color-secondary) !important;
}

.badge-container {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 5px; /* Adjust the gap between badges as needed */
    top: 0px; /* Remove the top positioning */
    left: initial; /* Remove the left positioning */
    margin:8px 0px 0px 8px; 
}

.badge-container .badge.callout {
    position: relative;
}

.badge {
    height: inherit !important; 
}

.badge + .badge {
    width:2.8em !important;
}

.badge {
    margin-bottom:4px; 
}


@media (max-width: 769px) {

    .badge-container {
        width:100%;
    }

    .badge-container .badge:first-child {
        /* styles for the first badge */
        position:absolute;
        right:1em; 
    
    }
    
    .badge-container .badge:nth-child(2) {
        /* styles for the second badge */
        position:absolute;
        left:0em;
    }    

    .box-text-products .badge.callout {
        margin:1em auto;
    }

}


/* Desktop: Ensure labels display as intended without altering the existing display */
@media (min-width: 769px) {
    .box-text-products .product-label {
        display: inline-block;
    }
}

/* Filter Customization */ 

.wcf-widget-toggle {
    padding-bottom:8px; 
}

[data-baseweb="slider"] {
    
}

/* Quick fix */

woocommerce-product-attributes-item {;}

.woocommerce-product-attributes {display:none;}


/* Disable cursor pointer if checkout and cart buttons are disabled */
.wc-proceed-to-checkout a.checkout-button[disabled],
.woocommerce-checkout-review-order #place_order[disabled] {
	pointer-events: none;
}

/* Style the WooCommerce error message on the cart and checkout pages */
.woocommerce-checkout .woocommerce-error.message-wrapper,
.woocommerce-cart .woocommerce-error.message-wrapper {
	padding: 20px 10px;
	background-color: #fff1f1;
	margin: 10px 0;
	border-radius: 4px;
}

.woocommerce-cart .woocommerce-error.message-wrapper .message-container,
.woocommerce-checkout .woocommerce-error.message-wrapper .message-container {
	font-size: 1.1em;
}

@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}


/* OOS Related Products */ 

.oos-related-products .badge-container, .oos-related-products p.brand-name {
    display: none;
}

.oos-related-products span.price {
    font-size:21px !important;
}

.oos-related-products .title-wrapper {
    font-size:19px !important;
}

.out-of-stock-message {
    padding:1em 0em;
}

.out-of-stock-message a {
    text-decoration: underline;
}

/* Moved from Custom CSS in Flatsome

.term-description p a,
.term-description p strong a {
    text-decoration: underline;
    color: inherit; /* Keeps the link color the same as the surrounding text */
}

.term-description p a:hover,
.term-description p strong a:hover {
    text-decoration: none; /* Removes underline on hover */
    filter: brightness(130%); /* Makes the text 30% lighter on hover */
}

/* Hide the built in category filter */

.category-filtering {
    display:none;!
}

/* CSS fixes */

.message-container a.showlogin, .message-container a.showcoupon {
    text-decoration: underline;
}

.message-container a.showlogin:hover, .message-container a.showcoupon:hover {
    text-decoration: none;
}

.ditty-item__content p {
    margin-top: revert;
    margin-bottom: revert;
    text-align: center;
}

div.box-text-products div.add-to-cart-button .primary, input[type=submit], div.box-text-products div.add-to-cart-button input[type=submit].button {
    background-color: #2C4816;
}

div.box-text-products div.add-to-cart-button .primary:hover, input[type=submit], div.box-text-products div.add-to-cart-button input[type=submit].button:hover {
    background-color: #3B6420;
}

/* Category description read more */ 

.category-description,
.page-description {
    max-height: 100px; /* adjust as needed */
    overflow: hidden;
    transition: max-height 0.5s ease;
}

.category-description.expanded,
.page-description.expanded {
    max-height: none;
}

.category-description br,
.page-description br {
    margin-bottom:1em;
    display:block;
    content: "";
}

.category-description.expanded br,
.page-description.expanded br {
    margin-bottom:1em;
    display:block;
    content: "";
}

.category-description a {
    text-decoration: underline;
}

.category-description a:hover {
    text-decoration: none;
}

/* Adjust Catalogue Image Sizing on Desktop and Mobile */

.box-image img {
    width:80% !important;
    height:auto !important;  
    margin-top:2em;
}

/* Adjust the color of the Sale badge */

.badge-inner.on-sale {
    background-color: #E53935 !important;
    border: 1px solid #E53935 !important;
}

/* Adjust the color of the page numbers (active) */

.woocommerce-pagination .page-numbers li .page-numbers.current {
    background-color: #3E5337;
    border:color: #3E5337;
}

/* Age Verification Popup */ 

.popup-background {
    margin-top: 20vh;
}

.popup-background img {
    width: 250px; 
    margin-bottom: 20px;
}

@media (max-width: 728px) {
    .popup-background {
        margin-top: 2vh;
        margin-bottom:12vh;
    }

    .popup-background img {
        width: 125px;
    }
}