/*
Theme Name: Ave Child
Theme URI: http://ave.liquid-themes.com/
Author: Liquid Themes
Author URI: https://themeforest.net/user/liquidthemes
Template:  ave
Description: Smart, Powerful and Unlimited Customizable WordPress Theme.
Version: 1.0
License: GNU General Public License
License URI: license.txt
Text Domain: ave
Tags: responsive, retina, rtl-language-support, blog, portfolio, custom-colors, live-editor
*/
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
a:focus{
	outline: none !important;
}
.is-stuck .navbar-brand {  padding-top: 10px !important;   padding-bottom: 10px !important;}
.orng-color{color:#fa7514;}
p{margin-bottom:10px !important}
.cstm-head{  margin: 0;   font-size: 50px;}
.iconbox-side .iconbox-icon-wrap {   margin-right: 10px;}
.iconbox .btn {   margin-top: 10px;}
.wht-color{color:#fff;}
.box-shadow-home{ -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);}
.box-shadow-home .fancy-title{margin-bottom:0}
.liquid-counter {font-family: "Bebas Neue", sans-serif;}
.border-right {border-right:1px solid #ccc;}
.home-srvs .wpb_wrapper {    transition: transform .5s;    -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); overflow:hidden;   border-radius: 10px;}
.home-srvs .iconbox  h3{padding-left: 25px;}
.home-srvs .wpb_wrapper:hover {   transform: scale(1.03);}
.liquid-counter{margin-bottom:0; color:#fa7514;}
/* .oem-procs p{   background: #fa7514;  display: inline-block;   padding: 5px 15px;   border-radius: 10px;   color: #fff;
    font-weight: bold; text-transform: uppercase;     margin-bottom: 0 !important;   letter-spacing: 1px;} */
.oem-procs h3{font-size:26px;}
.oem-procs p {position: relative; display: inline-flex;  padding: 5px 15px; margin-bottom: 0 !important; background: linear-gradient(180deg, #ff6a00 0%, #e04800 100%);  color: #ffffff;  border-radius: 8px 0 0 8px;  }

.oem-procs p::after { content: ""; position: absolute;  top: 50%;  right: -12px;  width: 24px;  height: 25px;  background: linear-gradient(135deg, #ff6a00 0%, #e04800 100%);
  transform: translateY(-50%) rotate(45deg);
  border-top-right-radius: 5px; /* Creates the rounded tip */
  z-index: 1;
}
.custm-procs {margin-bottom: 0px !important}
.fancy-title-underlined {   padding-bottom: 0;}
.oem-procs {margin-bottom: 10px;}
.lqd-contact-form select, .lqd-contact-form input, .lqd-contact-form textarea, .lqd-contact-form .ui-selectmenu-button {margin-bottom: 0px;}
.main-header { border-bottom: 1px solid #eee;}
    .admin-bar .is-stuck {     border-bottom: 1px solid #eee; }
.woocommerce-variation-add-to-cart, .woocommerce-variation-availability, .woocommerce-variation-price {display:none !important}
.pe-show-enq-modal, .contact-send {background: #222 !important; text-transform: uppercase!important; font-size: 16px!important; letter-spacing: 1px; padding: 10px 20px!important; border-radius: 10px!important;}
.ui-dialog .ui-dialog-titlebar {background:#222 !important; }
.lqd-contact-form label {text-align:left;}
.main-nav a:hover{color:rgb(237, 86, 9) !important}
.price {display: none !important}
table th, table td {   padding: 0.4em 0em;}
.woocommerce div.product .product_title {font-size: 27px; font-weight: 400;}
.titlebar-inner {  padding-top: 30px;   padding-bottom: 00px;  }
.woocommerce .ld-sp {    margin-bottom: 0;  border: 1px solid #eee;   padding: 15px;}
.main-footer .fancy-title { margin-bottom: 20px;  position: relative;}
.main-footer .iconbox {margin-bottom:15px !important}
.main-footer {margin-top:3%;}

.product_meta.product-meta::before {    content: "We are a professional helmet manufacturer mainly providing OEM customization and bulk‑wholesale service. We also accept small retail orders for personal use. Final product price and shipping cost depend on your order quantity and destination country. Please submit the quotation form to get our offer.";
    display: block; font-size: 14px; font-weight:400; margin-bottom: 10px;}
.retail-pg input, .retail-pg textarea, .retail-pg select {margin-bottom:15px;}
.retail-pg label{width:100%}

.gt_switcher_wrapper {background: #fff;    border: 1px solid #eee !important;    padding: 5px;}

/*************************************************Media CSS*************************************************/

@media only screen and (min-width:320px) and (max-width:767px){
	
	.main-header .navbar-brand {   padding: 5px 0;}
	.navbar-brand img {   width: 150px;}
	.cstm-head {  font-size: 28px;}
	.home-iocns .vc_column_container>.vc_column-inner { padding-left: 7px!important; padding-right: 7px !important;}
	.border-right{border:none !important}
	
	
	/* 1. Transform the thumbnail container into a horizontal scrollable flexbox */
ol.flex-control-nav.flex-control-thumbs {
    display: flex !important;
    flex-wrap: nowrap !important; /* Prevents images from dropping to a new line */
    overflow-x: auto !important;  /* Enables horizontal scrolling */
    overflow-y: hidden !important;
    padding: 10px 30px !important; /* 30px adds space on the sides for the arrows */
    margin: 0 !important;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch; /* Enables smooth swiping on mobile */
    -ms-overflow-style: none !important;  /* Hides scrollbar in IE and Edge */
    scrollbar-width: none !important;  /* Hides scrollbar in Firefox */
}

/* Hide the scrollbar for Chrome, Safari, and Opera */
ol.flex-control-nav.flex-control-thumbs::-webkit-scrollbar {
    display: none !important;
}

/* 2. Style the individual thumbnail list items */
ol.flex-control-nav.flex-control-thumbs li {
    flex: 0 0 auto !important; /* Prevents the thumbnails from shrinking */
    width: 100px !important;   /* Matches your image width */
    margin-right: 12px !important; /* Adds space between thumbnails */
    float: none !important;    /* Overrides default theme floats */
    clear: none !important;
}

/* 3. Style the Left and Right Arrow Buttons */
.ave-thumb-prev, 
.ave-thumb-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    background: #ffffff !important;
    color: #333333 !important;
    border: 1px solid #dddddd !important;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 5px rgba(0,0,0,0.15);
    font-size: 14px;
    transition: all 0.3s ease;
}

/* Position them on the edges */
.ave-thumb-prev { left: -10px; }
.ave-thumb-next { right: -10px; }

/* Hover effect for arrows */
.ave-thumb-prev:hover, 
.ave-thumb-next:hover {
    background: #f5f5f5 !important;
    border-color: #bbbbbb !important;
}
	
}