/*
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.   ***************/


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


/*----------------------------------- MOBILE ONLY CSS ---------------------------------*/
@media only screen and (max-width: 849px){
	.hidemob {display:none!important;}
}	
/*----------------------------------- DESKTOP ONLY CSS ---------------------------------*/
@media only screen and (min-width: 850px) {
	.hidedesk {display:none!important;}
}
/*----------------------------------- GENERAL ------------------------------------------*/
.page-wrapper {padding-bottom: 0px; padding-top: 0px;}
.zerodiv {margin:0!important; padding:0!important;}

.greenback {background-color: #34BEB1;transition: background-color 0.3s ease;}
.greenback:hover {background-color: #2ea89e; /* slightly darker */}

.blueback {background-color: #549FD6;transition: background-color 0.3s ease;}
.blueback:hover {background-color: #3e85be; /* slightly darker */}

.yellowback {background-color: #FBC117;transition: background-color 0.3s ease;}
.yellowback:hover {background-color: #e0a915; /* slightly darker */}

.redback {background-color: #EA7273;transition: background-color 0.3s ease;}
.redback:hover {background-color: #d65f60; /* slightly darker */}


/* Define h50 and h25 */
/*.h100 {height: 300px!important;}*/
/*.h50 {height: 150px!important;}*/
/*.h25 {height: 75px!important;}*/
.h100 {height: 400px!important;}
.h50 {height: 200px!important;}
.h25 {height: 100px!important;}

.blockdiv .vc_column-inner {padding-top:0!important;}
.blockdiv .wpb_content_element { margin-bottom: 0!important;}
/*----------------------------------- TYPOGRAPHY ---------------------------------------*/

body {line-height:1.5;}

.whitetxt, .whitetxt p, .whitetxt strong, .whitetxt H1, .whitetxt H2, .whitetxt H3, .whitetxt H4, .whitetxt H5, .whitetxt H6, .whitetxt a {color: #ffffff !important;}

/***** TABLES *****/

td {border:none;}
table {width: auto;}
table .fas, table .fal, table .far {color:#00a19a; width:30px!important;}
#footer table .fas, #footer table .fal, #footer table .far, #footer table .fa  {color:#fff;}
/*----------------------------------- HEADER -------------------------------------------*/
.menubtn a {padding: 1px 8px !important;}
.bluebtn         {border:3px solid #549FD6;} /* Afrikaans */
.bluebtn.active  {background-color: #549FD6;} /* Slightly darker Afrikaans blue */
.greenbtn        {border: 3px solid #34BEB1;} /* English */
.greenbtn.active {background-color: #34BEB1;} /* Slightly darker English green */
.whitetxt a.afrlink strong {color:#549FD6 !important;}
.whitetxt a.englink strong {color:#34BEB1 !important;}
/*----------------------------------- FOOTER -------------------------------------------*/
footer#footer {background-color: #013755;color:#ffffff; }

/*----------------------------------- WOOCOMMERCE --------------------------------------*/
.products .product_cat-afrikaans:after, 
.products .product_cat-english:after,
.products .product_cat-native:after {
position: absolute;
    top: 10px;
    right: 10px;
    width: 3em;
    height: 2em;
    border-radius: 12px;
    font-weight: 400;
    padding-top: 0px;
    color: #ffffff;
    border: 5px solid #ffffff;
    text-align: center;
    vertical-align: middle;
}

.products .product_cat-english:after   {background-color: #34BEB1; content: "Eng"!important;}
.products .product_cat-afrikaans:after {background-color: #549FD6; content: "Afr"!important;}
.products .product_cat-native:after    {background-color: #3a6aef; content: "Nat"!important;}

.salediv .has-shadow .box:not(.box-overlay):not(.box-shade) {
    background-color: #549fd6!important;
}

/* Smaller, softer field descriptions in checkout */
.woocommerce .woocommerce-input-wrapper .description {
    font-size: 0.6em;
    color: #666;
    margin-top: 0px;
    line-height: 1;
}
input#billing_phone, input#billing_birthday {margin-bottom: 0px;}


/* Ensure product images fit within their containers */
.product-small .box-image img,
.product .box-image img,
.woocommerce-product-gallery__image img,
.related-products-wrapper .product-small img {
    width: 100%;
    height: auto;
    max-height: 100%;
    object-fit: contain;
    display: block;
    margin: 0 auto;
}

/* Prevent overflow of image containers */
.product-small .box-image,
.product .box-image {
    overflow: hidden;
    position: relative;
}

/* Adjust image container to maintain aspect ratio */
.product-small .box-image {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Responsive adjustments for mobile */
@media only screen and (max-width: 849px) {
    .product-small .box-image img {
        max-width: 100%;
        max-height: 100%;
    }
}

/* Single product page gallery images */
.woocommerce-product-gallery__image img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

/* ---------Animation---------------------*/
/* Define the pulse animation */
@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

/* Apply animation to active buttons */
.bluebtn.active,
.greenbtn.active {
    animation: pulse 1.5s infinite ease-in-out;
}



/* Style for Add to Cart button */
.button.is-outline, input[type=button].is-outline, input[type=reset].is-outline, input[type=submit].is-outline,
a.primary.is-small.mb-0.button.product_type_simple.add_to_cart_button.ajax_add_to_cart.is-outline {
	border-width:3px!important;
    padding: 3px 30px;
}

.box a {font-weight: 600; font-size: 110%;}
.price {padding-top:10px;}
span.amount {color: #549FD6; font-weight: 700; font-size:120%!important;}
span.woocommerce-Price-currencySymbol {color: #FBC117; vertical-align: super;font-size: 75%;}


