@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

/* Main */
:root {
    --main-green: #0a59cc;
    --sub-green: #2579f2;
}

body{
    font-size:14px;
    font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-weight: 400;
    overflow-x: hidden !important;
    color: #000;
    background: #F3F4F6;
}

.hidden,.hidden-seoh{display: none;}

[class^="col-"] {
    padding: 0 10px;
}

.mw,.wrap-content,.wrap-main{max-width: 1230px;padding: 0 15px;width: 100%;margin: 0 auto;}
.wrap-main{margin-bottom: 20px;}
a,a:hover{color: inherit;text-decoration: none;}
p{padding: 0;margin: 0;}
ul{list-style: none;padding: 0;margin: 0;}

/* custom css */
.df{display: flex;}
.fwrap{flex-flow: wrap;}
.fcol{flex-flow: column;}
.aic{align-items: center;}
.jcc{justify-content: center;}
.jcsb{justify-content: space-between;}

.g7{gap: 7px;}
.g10{gap: 10.5px;}
.g16{gap: 16px;}
.g20{gap: 20px;}

.py{padding: 20px 0 35px;}
.px10{padding: 0 10px;}
.p10{padding: 10.5px;}

.my30{margin: 30px 0;}
.mb10{margin-bottom: 10px;}

.clamp_2{display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}

.cfff{color: #fff;}
.csub{color: var(--sub-green);}

.w50{width: 50%;}
.w100{width: 100%;}
.h100{height: 100%;}

.bora{border-radius: .375rem;}

.text_center{text-align: center;}
/* custom css */

/* general */
.title_index{font-size: 21px;font-weight: 600;line-height: 28px;}
.title_index.cap{text-transform: capitalize;}
.sub_title_index{font-size: 14px;font-weight: 400;line-height: 21px;margin-top: 3.5px;color: #374151;}

/* header */
.title-main{font-size: 24px;font-weight: 500;margin: 15px 0;}
.header_top{background: var(--main-green);padding: 10.5px 0;}
.header_top_right .item i{font-size: 17.5px;color: #fff;}
.header_top_right .item{color: #fff;}
.header_bottom{background: var(--sub-green);}
.header_bottom .main_header{height: 70px;padding-top: 10px;}
.main_header > div{padding: 10.5px;}
.search_bar{max-width: 415px;width: 100%;}
.search_bar input{padding: 0 14px;border-top-left-radius: .375rem;border-bottom-left-radius: .375rem; outline: none;border: none;height: 42px;}
.search_bar p{color: #fff;padding: 0 14px;background: var(--main-green);border-top-right-radius: .375rem;border-bottom-right-radius: .375rem;height: 42px;}
.search_bar p i{font-size: 17.5px;}
.search_bar p:hover{filter: brightness(1.1);}
.user .user_icon{display: flex;width: 42px;justify-content: center;border-radius: 50%;border: 1px solid #fff;height: 42px;align-items: center;}
.user:hover a{color: #fff;text-decoration: underline;}
.user i{font-size: 17.5px;}
.main_header .cart a{height: 42px;border: 1px solid #fff;border-radius: .375rem;padding: 0 14px;color: #fff;background: rgba(59,130,246,.5);}
.main_header .cart a i{font-size: 17.5px;}
.main_header .cart a:hover{filter: brightness(1.1);}
.main_header .cart a span{padding: 0 3.5px;background: #fff;color: #000;border-radius: .25rem;font-weight: 600;}
.header_utils{padding: 17.5px 0;}
.header_utils i{font-size: 17.5px;color: #fff;}
.header_utils a:hover p{color: #fff;text-decoration: underline;}

/* menu */
.menu_wrapper{background: #fff;padding: 7px 0;}
.pro_list_menu{position: relative;}
.menu_lvl1{display: none;max-width: 224px;width: auto;position: absolute;top: 100%;padding: 7px;background: #fff;}
.menu_title{height: 38.5px;display: flex;align-items: center;gap: 10.5px;}
.menu_title i{font-size: 17.5px;}
.menu_title {font-weight: 600;}
.pro_list_menu.inpage:hover .menu_lvl1{display: block;z-index: 2;}
.nav_lvl1{max-width: 217px;width: 100%;text-wrap: nowrap;padding: 0 7px;height: 30px;}

/* slider */
.slider_wrapper{margin: -.75rem;max-width: 1221px;}
.wrap_static_menu{width: 21%;}
.menu_lvl1.static{display: block; position: unset;border: 1px solid rgba(156,163,175,.25);}
.menu_lvl1.static .nav_lvl1 a{font-size: 15.75px;}
.slider_wrapper .slide_left{width: 54%;}

/* index  */
a.explore{background: var(--main-green);padding: 0 14px;color: #fff;}
a.explore:hover{filter: brightness(1.1);}

.product_index_wrapper{margin: -.75rem;margin-top: 13.5px;display: grid;grid-template-columns: repeat(6, 1fr);width: 1221px;gap: 10px;}
.hot_pro_items{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.product_item{transition: all 0.3s ease-in-out;background: transparent;border-radius: 7px;}
.product_item:hover{transform: translateY(-10px);box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;}
.product_item img{border-radius: 7px;}
.product_item.span-1-5{grid-column:span 3}
.product_item.span-1{grid-column:span 2}
.product_item .name{font-size: 14px;font-weight: 500;line-height: 21px;margin-top: 10.5px;transition: all .2s ease-in-out;}
.product_item .name:hover{color: var(--sub-green);}
.price .price_new{font-size: 14px;font-weight: 600;line-height: 21px;padding: 3.5px;color: var(--sub-green);}
.price .price_old{font-size: 14px;font-weight: 400;line-height: 21px;text-decoration: line-through;padding: 3.5px;color: #9ca3af;}
.price .discount{font-size: 12.25px;font-weight: bold;background: #dc3545;color: #fff;padding: 3.5px;border-radius: .25rem;margin-left: 3.5px;}
.scale_img{overflow: hidden;border-radius: 7px;transition: transform .3s ease-in-out;}
.scale_img:hover img{transform: scale(1.1);overflow: hidden;width: 100%;transition: transform .3s ease-in-out;}
.see_more_ajax span{padding: 5px 10px;background: var(--sub-green);color: #fff;border-radius: 7px;font-size: 13.5px;margin-top: 10px;cursor: pointer;transition: all .3s ease-in-out;}
.see_more_ajax span:hover{filter: brightness(1.1);}

.product_list_ajax .col_left{width: 25%;}
.product_list_ajax .col_right{width: 75%;}
.product_list_wrapper{margin: 20px 0;}
.product_index_wrapper.list{width: 100%;margin: 0;}

.list_name_container{padding: 15px;position: sticky;top: 0;}
.list_name{font-weight: 500;transition: all .3s ease-in-out;cursor: pointer;padding: 5px 15px;}
.list_name:hover,.list_name.active{color: var(--sub-green);background: #fff;border-radius: 7px;}


/* user_section */
.user_section{background: #000;padding: 24px;margin: 20px 0;}
.user_left .title_index{color: #fff;}
.user_right a{color: #fff;text-transform: uppercase;}
.login{border-right: 1px solid #fff;}
.signup{border-left: 1px solid #fff;}
.login a{background: var(--sub-green);padding: 5px 10px;border-radius: 7px;font-weight: 500;}
.login a:hover{filter: brightness(1.1);}


/* pagination-ajax */
.pagination-ajax{display: flex;align-items: center;justify-content: center;gap: 5px;margin-top: 10px;}
.pagination-ajax a{background: #fff;border: 1px solid #fff;padding: 5px 10px;border-radius: 7px;cursor: pointer;}
.pagination-ajax a.current{border-color: var(--sub-green);color: var(--sub-green);transform: translateY(-5px);}

/* footer */
.footer{padding: 21px 0;border-top: 2px solid var(--sub-green);}
.scrollToTop{position: fixed;right: 15px;bottom: 15px;}


/* products inpage */
.products_inpage{display: grid;grid-template-columns: repeat(auto-fill, minmax(165px, 1fr));gap: 10px;margin: 21px 0;}
/* product detail */
.pro_detail{margin: 30px 0 60px 0;box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;padding: 15px 0;border-radius: 7px;}
.pro_detail_left img{border-radius: 7px;padding: 0 !important;}
.gallery_product{position: relative;}
.gallery_product .control-carousel{position: absolute;top: 50%;z-index: 2;transform: translateY(-50%);}
.gallery_product .control-carousel i{font-size: 24px;font-weight: 500;color: #fff;padding: 5px;background: #ffffff4b;border-radius: 7px;transition: all .3s ease-in-out;}
.gallery_product .control-carousel:hover i{color: var(--main-green);background: transparent;}
.control-carousel.next-thumb-pro{right: 0;}

.pro_detail_right > div{color: #374151;}
.pro_detail_right span{font-weight: 500;}
.pro_detail_name{font-size: 24px;font-weight: 600;color: #000;}
.price .new{font-size: 26px;font-weight: 500;}
.price .old{color: #9ca3af;text-decoration: line-through;font-size: 15px;}
.price .old .percent{padding: 5px;background: #dc3545;color: #fff;border-radius: 7px;text-decoration: none;font-size: 12px;}

.addcart{padding: 5px 15px;border-radius: 7px;background: var(--sub-green);border: 1px solid var(--sub-green);cursor: pointer;transition: all .3s ease-in-out;}
.addcart:hover{filter: brightness(1.2);}
.addcart.buynow{background:transparent;}

.pro_detail_conent{margin-top: 30px;}