.bo_round{width:40px; height:40px; background:none; border:0px; border-radius:40px;}
.bo_round svg{ stroke:var(--gray); stroke-width:1px; }
.text-bo i{padding:5px;}
.text-bo:hover i{color:var(--mycolor);}
.b_title{font-size:16px;}
.nav-wrapper nav li.has-dropdown > a:hover h2, 
.nav-wrapper nav li.has-dropdown > a:hover h3, 
.nav-wrapper nav li a:hover h2, .nav-wrapper nav li a:hover h4{color:#fff;}

.radius6{ border-radius:6px!important; }
.radius10{ border-radius:10px!important; }

.rating_ro{padding-bottom:12px; margin-bottom:15px; line-height:1; border-bottom:solid 1px #f2f2f2;}
.bra_na{ color:#999!important; font-size:12px;  line-height:17px; }
.star_rat i{color:#ffbf00; font-size:15px;}
.compare{font-weight:500;  display:flex; align-items:center; color:var(--dark); width: fit-content;}
.compare svg{width:25px; height:25px; stroke:var(--mycolor); margin-right:5px;}
.compare:hover{color:var(--mycolor);}

.colorav{list-style:none; padding:0; margin:15px 0; display:flex; flex-wrap:nowrap;}
.colorav li{margin:0 10px 0 0;}
.colorav li span{width:15px; height:15px; border-radius:15px; display:block; cursor:pointer;}
.colorav li.redc span{background:#db2920;}
.colorav li.yelc span{background:#edcb26;} .colorav li.darc span{background:#818181;} .colorav li.lihc span{background:#d3d3d3;}

.mes_row, .size_row{margin-left:15px;}
.size_row .nice-select, .mes_row .nice-select{margin-bottom:0!important; min-width:90px; line-height:40px!important; height:40px!important; border:solid 1px #f3f3f3!important;}
.shari_row{margin-top:0px;}
.border_10{border-radius:10px;}
.reg_bo{display:flex; align-items:center; line-height:18px; color:var(--secondary);} .reg_bo svg{margin-right:5px; stroke:var(--gray); width:40px; height:40px;}
.reg_bo span{display:block; color:var(--dark); font-weight:500;} .free_shi{margin-left:10px;}

.buytitle{ position: relative; width:100%; text-align:center; margin-bottom:30px; }
.buytitle .bytxt{ position: relative; display: inline-block; padding: 0px 20px; font-size: 18px; line-height:18px; font-weight: 500; background:#fff; z-index:98; bottom:-15px; }
.buytitle .byline{ width:100%; height:1px; background:#ccc; z-index:999; }
.buybulk{ display:flex; flex-wrap:wrap; padding:0px; }
.buy_bo{ display: inline-block; width:calc(100%/3 - 10px); height:auto; margin:5px; padding:10px; border: solid 1px #f3f3f3; box-shadow: 1px 2px 1px rgba(0, 0, 0, 0.1); line-height:initial; cursor:pointer; color:var(--dark);}
.buy_buy{margin-bottom:5px; font-size:15px; font-weight: 500;}
.buy_bo .incgst{ font-size:12px; font-weight: 400; color:#171717; }
.buy_bo .price{color:var(--mycolor); font-weight:500;}
.incgst{font-size:11px; color:#171717;}
.line_bo{height:1px; background:#f2f2f2; width:100%;}
.list .buy_bo{ display:block; width:calc(100% - 10px); margin:10px 5px; line-height:20px!important; }

.brkqty{ width:100px; display:flex; justify-content:center; align-items:center; background:var(--mycolor); }
.brkqty span{ font-size:30px; line-height:30px; color:#fff; } .brkqty font{ font-size:22px; line-height:22px; color:#fff; margin-left:5px; }
.brkcon{ width:calc(100% - 100px); padding:8px; overflow:hidden; }
.brkcon .savelabel{ background:#E6F4EA; font-size:13px; line-height:14px; color:#1B5E20; padding: 2px 5px; border-radius: 5px; }

.fixed_add{position:fixed; bottom:30px; background:#fff; width:calc(94% + 10px); border-radius:10px; padding:10px; box-shadow:1px 2px 25px rgba(0, 0, 0, 0.3); z-index:9;}
.fixed_add h5{font-size:16px; color:var(--gray); font-weight:500;}
.btn_cart{ background: var(--mycolor); color: #fff; height: 45px; width: auto; padding: 0 32px; line-height: 42px; text-align: center; text-transform: capitalize; margin-right: 5px; border-radius: 30px;  display: inline-block; font-weight: 500; display:inline-flex; align-items:center; } 
.btn_cart:hover{background: #333!important; }
.btn_cart svg, .add-to-cart .btn svg{stroke:#fff; width:30px; height:30px; margin-right:5px;}
.fix_imgrow img{margin-right:20px;}
.incl_swi .switch{width:30px!important; height:16px;} 
.incl_swi .slider:before{width:12px; height:12px;}
.card{ border:solid 1px #f2f2f2!important; }
.card:hover{ border:solid 1px var(--mycolor)!important; }
.protop_div{ position:absolute; z-index:1; width:calc(100% - 25px); top:30px; }
.multi_row{ grid-gap:8px; }
.multi_row .buy_bo{ margin:0; min-height:70px; display:flex; }
.multi_row .buy_bo.active{ border-right: 3px solid #1B5E20; }
.multi_row .buy_bo .price{font-size:15px;  }
.multi_row .incgst,.multi_row .incgst .psymbol{font-size:13px;}
.multi_row .buy_bo .buy_buy{font-size:14px; margin-bottom:10px;}
.multi_row .pack-siz, .multi_row .buy_bo{width:calc(100%/4 - 12px); padding:10px; border: solid 1px #f3f3f3; }
.multi_row .pack-siz.w33, .multi_row .buy_bo.w33{ width:calc(100%/3 - 7px); }
.multi_row .pack-siz.w50, .multi_row .buy_bo.w50{ width:calc(100%/2 - 7px); }
.multi_row .pack-siz.w100, .multi_row .buy_bo.w100{ width:100%!important; max-width:inherit!important; }
.multi_row .pack-siz:hover{border:2px solid var(--mycolor);}
.buy_bo:hover{ border:2px solid var(--mycolor); background:#fff; }
.sam_row .product-img{width:50px; margin-right:10px;}
.sam_row .product-content{flex:1;}
.list-column{flex-direction:column; max-width:200px;}
.pro_smrow{display:flex; flex-wrap:wrap; grid-gap:10px;}

.row-six .product_col{ display:flex; flex-wrap:wrap; width:calc(100%/5 - 9px); }
.product_col{ background: #fff; margin-top: 0; border: solid 1px #e1e3e4; border-radius: 8px; padding: 10px; height:auto; } 
.product_col:hover, .product_col.active { border:2px  solid var(--mycolor); } 
.product_col .product-img{ width:100%; height:150px; overflow:hidden; }
.product_col .product-img a{ display:block; height: 100%; text-align: center; }
.product_col .product-img img{ width:auto; height:100%; margin:auto; }
.product_col .name_tit{ font-size:14px; font-weight:500; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; word-break: break-all;} 
.product_col .product-content{ width:100%; margin-top:10px; }
.product_col .product-price{ width:100%; margin:10px 0!important; display:flex; justify-content:space-between; } 
.product_col .product-price .acart{ padding:4px 4px; }
.product_col .product-price .acart .svg_blue{ width: 25px!important; height: 25px!important; stroke:var(--mycolor)!important; stroke-width: 1.5px!important; }
.product_col .product-price .acart:hover .svg_blue{ stroke:#fff!important; }
.product_col .product-content .button-head{ display:flex; flex-direction:column; justify-content:space-between; align-items:start; }
.product_col .product-action-2{ width: 100%; } .product_col .button-head{align-items:center;}
.pack-siz .quantity2{max-width:150px;} 
.pack-siz .quantity2 .input-group{ width: fit-content;}
.pack-siz .adv_price{white-space: nowrap; color:var(--mycolor);}
.tabs_pview{padding:0 20px;}  .tabs_pview li{flex:1; text-align:center;}
.tabs_pview li a{padding:20px!important;} .tabs_pview li a.active{color:var(--dark)!important;}
.specialbg{ background: url(../images/special-offers-bg.png)  no-repeat; background-size: 100%; padding: 30px 0;}

.multiuom{ width:100%; display:flex; align-items:center; padding: 10px; border: 1px solid #ccc; margin-bottom: 10px; border-radius: 6px; }
.multiuom:last-child{ margin-bottom:0px; }
.multiuom .imgdiv{ width:50px; margin-right:10px; }
.multiuom .imgdiv img{ width:100%; height:auto; }
.multiuom .mobdiv{ width:calc(100% - 60px); display:flex; align-items:center; }
.multiuom .condiv{ width:50%; }
.multiuom .pridiv{ width:20%; text-align:right; }
.multiuom .btndiv{ width:30%; display:flex; justify-content:end; }

.uomtype{ min-width:100px; text-align:center; padding:10px 10px; border: 1px solid #ccc; display: flex; justify-content: center; align-items: center; cursor:pointer; }
.uomtype p{ font-size:16px; line-height:20px; font-weight:400; }
.uomtype.active { border: 1px solid var(--mycolor); }
.uomtype.active p{ font-weight:500; }

.uomtypebtn .acart, .uomtypebtn .acart2, .uomtypebtn .acart3{ width:100%; }

.subscribe_div{position:relative; border-radius:10px; margin:0 auto; background:#fff; padding:30px 30px 30px 70px; -webkit-box-shadow: 0px 0px 27px -15px rgba(0,0,0,0.17); -moz-box-shadow: 0px 0px 27px -15px rgba(0,0,0,0.17); box-shadow: 0px 0px 27px -15px rgba(0,0,0,0.17);} 
.sub_circle{position:absolute; top:40px; left:-40px; width:80px; height:80px; border-radius:80px; background: var(--mycolor); box-shadow:1px 4px 10px rgba(0, 0, 0, 0.2); }
.sub_circle svg{stroke:#fff; fill:none; width:50px; height:50px; }

.titul02{grid-gap: 18px;}
.titul02 li{width:calc(100%/2 - 9px); margin:0;}
.titul02 li a{background:#fff; padding:18px; text-align:left; -webkit-box-shadow: 0px 0px 27px -15px rgba(0, 0, 0, 0.17); -moz-box-shadow: 0px 0px 27px -15px rgba(0, 0, 0, 0.17); box-shadow: 0px 0px 27px -15px rgba(0, 0, 0, 0.17);}
.alert.mob-note{ display:none!important; }
.mob-note div,.desk-note div{ width:calc(100% - 25px); text-overflow: ellipsis; overflow: hidden; }

#saveLater .subtitle{ color: #6b7280; font-size: 16px; margin-bottom: 24px; line-height: 1.5; }
#saveLater .save-options { display: flex; flex-direction: column; gap: 12px; }
#saveLater .save-option { border: 2px solid #e5e7eb; border-radius: 8px; padding: 20px; cursor: pointer; transition: all 0.2s; position: relative; background: white; }
#saveLater .option-header { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
#saveLater .radio-button { width: 20px; height: 20px; border: 2px solid #d1d5db; border-radius: 50%; position: relative; flex-shrink: 0; transition: all 0.2s; }
#saveLater .option-title { font-size: 18px; font-weight: 600; color: #111827; margin: 0; }
#saveLater .option-description { color: #6b7280; font-size: 14px; line-height: 1.4; margin-left: 32px; }
#saveLater .save-option.selected { border-color: #10b981; background: #f0fdf4; }
#saveLater .save-option.selected .radio-button { border-color: #10b981; }
#saveLater .save-option.selected .radio-button::after { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 10px; height: 10px; background: #10b981; border-radius: 50%; }

#saveLater .schedule-input { margin-top: 16px; margin-left: 32px; display: none; }
#saveLater .save-option.selected.schedule .schedule-input { display: block; }
#saveLater .schedule-input label { display: block; font-size: 14px; font-weight: 500; color: #374151; margin-bottom: 8px; }
#saveLater .schedule-input input { width: 100%; padding: 12px; border: 1px solid #d1d5db; border-radius: 6px; font-size: 14px; transition: border-color 0.2s; }

#switchAccount #saveLater .save-option{ display:flex; align-items:center; }
.usericon{ width:30px; height:30px; display:flex; justify-content:center; align-items:center; }
.userimg{ width:60px; height:60px; overflow:hidden; display:flex; justify-content:center; align-items:center; }
.userimg span{ padding:12px; font-size:20px; color:var(--myfont); background:var(--mycolor); border-radius:30px; }
.userimg img{ width:auto; max-width:100%; height:50px; border-radius:6px; }
.usercont{ width:calc(100% - 60px); padding-left:10px; }

.proid .psymbol{ font-size: 14px; font-weight: 400; line-height: 14px; }
.emptyres{ width:100%; max-width:750px; margin:0px auto; }
.emptyres ul{ list-style:disc!important; margin-left:20px; }
.emptyres ul li{ list-style:disc!important; padding:5px 5px; }

.emptyres .newul2, .newul2{ margin:0px; padding:0px; list-style:none!important; }
.emptyres .newul2 li, .newul2 li{ width:100%; margin:0px; padding:10px 0px; text-align:left; list-style:none!important; }
.emptyres .newul2 li:before, .newul2 li:before{ content:"\e64c"; font-family:'themify'; color:var(--mycolor); background:var(--mycolor10); padding:5px; border-radius:15px; margin:0px 10px 0px 0px; }

.pro-thumb{ display: flex; flex-wrap: wrap; max-width:100%; overflow:auto; margin-top:10px; }
.pro-thumb .carousel-indicators{ top:0px; margin:0px; }

.spl-key-point{ position: relative; margin-top:40px; padding: 25px 0px; border-radius: 10px; }
.spl-key-point h4{ display: inline-block; position: absolute; top: -15px; border-radius: 4px; padding: 5px 10px 5px 0px; font-size: 18px; line-height: 22px; font-weight: 500; margin: 0px; }
.spl-key-point ul{ margin:0px; padding:0px; list-style:none!important; }
.spl-key-point ul li{ display:flex; gap:10px; list-style:disc!important; padding:9px 0px; }
.spl-key-point ul li font:before{ content:"\e64c"; font-family:'themify'; color:var(--mycolor); background:var(--mycolor10); padding:5px; border-radius:15px; margin:0px 10px 0px 0px; }
.spl-key-point ul li span{ color: #212529; font-size:14px; font-weight: 400; line-height:24px; }

.spl-key-point.enhance { padding: 25px 20px; background: var(--mycolor10);  }
.spl-key-point.enhance h4{ padding: 5px 10px 5px 10px; color: #fff; background: var(--mycolor); }

.btn .carticon{ fill:none!important; stroke:#fff!important; stroke-width:1.5px; }

.offerdiv{ display:flex; flex-wrap: wrap; }
.offerdiv a{ width:calc(100%/2 - 10px); padding:5px!important; margin:5px!important; }
.offerdiv a:hover{ background:var(--mycolor); }
.offerdiv a img{ width:100%; height:auto; border-radius:6px; }

.offertxt a { display: block; position: relative; padding: 0.7em; color: var(--dark); text-decoration: none; margin: 5px 10px; border-radius: 10px; transition: color 0.15s, background-color 0.15s; font-size: 16px; }
.offertxt a img { width: 30px; margin-right: 10px; float:left; }

.pdf-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 0px 0px; }
.pdf-card { background: #f8fafc; border-radius: 12px; padding: 16px 16px; display: flex; justify-content: space-between; align-items: center; border: 1px solid #e2e8f0; transition: 0.2s; }
.pdf-card:hover { background: #f1f5f9; border-color: #94a3b8; }
.pdf-card .left { display: flex; align-items: center; gap: 12px; cursor:pointer; }
.pdf-card .pdf-icon{ width: 38px; height: 38px; }
.pdf-card .title{ font-size: 15px; font-weight: 600; color: #1e293b; }
.pdf-card .size{ font-size: 12px; color: #64748b; }
.pdf-card .download-btn{ font-size: 24px; color: #0ea5e9; text-decoration: none; font-weight: bold; }
.pdf-card .download-btn:hover { color: #0284c7; }

/* Responsive for Mobile */
@media (max-width: 768px) {
  .pdf-grid{ grid-template-columns: 1fr; }

  #saveLater .subtitle { font-size: 14px; }
  .usercont .fs-20{ font-size:16px!important; }
  .usercont .fs-14{ font-size:14px!important; }
  .usercont .option-title{ font-size:14px!important; }
  .usercont .option-description{ font-size:12px!important; }
  .addrtype,.sellabel{ font-size:12px; line-height:16px; padding: 3px 8px; }
}

.cban{ font-size:12px; cursor:pointer; display:none; }
.cban.active{ display:inline; }

.drinput,.drinput:focus{ background:none!important; color:#a6abab!important; }

.w3-sidebar-off{max-width:100%; width:50%;}
.rating-box .stars { display: flex; align-items: center; gap: 20px;}
.stars i { font-size:28px; color: #b5b8b1; transition: all 0.2s; cursor: pointer;}
.stars i.active { color: #ffb851; transform: scale(1.2);}
input::placeholder { opacity: 0.5; }

.loader { position: absolute; top: 0; bottom: 0; left: 0; right: 0; }
.jimu-primary-loading:before, .jimu-primary-loading:after { position: absolute; top: 0; content: '';}
.jimu-primary-loading:before { left: -19.992px;}
.jimu-primary-loading:after { left: 19.992px; -webkit-animation-delay: 0.32s !important; animation-delay: 0.32s !important;}
.jimu-primary-loading:before,
.jimu-primary-loading:after,
.jimu-primary-loading { background: #076fe5; -webkit-animation: loading-keys-app-loading 0.8s infinite ease-in-out; animation: loading-keys-app-loading 0.8s infinite ease-in-out; width: 13.6px; height: 32px;}

.jimu-primary-loading { text-indent: -9999em; margin: auto; position: absolute; right: calc(50% - 6.8px); top: calc(50% - 16px); -webkit-animation-delay: 0.16s !important;animation-delay: 0.16s !important; }

@-webkit-keyframes loading-keys-app-loading{
  0%, 80%, 100% { opacity: .75; box-shadow: 0 0 var(--mycolor); height: 32px; }
  40% { opacity: 1; box-shadow: 0 -8px var(--mycolor); height: 40px; }
}

@keyframes loading-keys-app-loading {
  0%, 80%, 100% { opacity: .75; box-shadow: 0 0 var(--mycolor); height: 32px; }
  40% { opacity: 1; box-shadow: 0 -8px var(--mycolor); height: 40px;}
}

.acc_h3:hover, .acc_h3.ac_bott { color:var(--mycolor); }



@media only screen and (max-width: 940px) {
  .desk_none .buy_bo{ width:100%; }
}
@media only screen and (min-width: 768px) and (max-width: 1200px)  {
  .row-six .product_col{width:calc(100%/3 - 8px); }
  .multi_row .pack-siz {width: calc(100% / 3 - 12px); }
  .alert.desk-note{ display:none!important; }
  .alert.mob-note{ display:flex !important; }
}
@media only screen and (max-width: 768px) {
  .row-six .product_col{width:calc(100%/2 - 7px); }
  .multi_row .pack-siz, .multi_row .buy_bo{width: calc(100%/2 - 12px); }
  .cardcust .borbot{ border-bottom: solid 1px #e1e3e4; padding:15px; margin-bottom: 0rem !important; }
  .cardcust{ margin:0px; }
  .alert.desk-note{ display:none!important; }
  .alert.mob-note{ display:flex !important; }
}
@media only screen and (max-width: 575px) {

  .titul02 li{width:100%; }
  .multi_row .buy_bo{width:100%;}
  .multi_row .pack-siz {width:100%; min-width: 100%;}
  .row-six .product_col { min-width: 100%; display: flex; }
  .product_col { border:1px solid #e1e3e4; border-radius:5px; padding:10px; }
  .product-img { width: 50px; margin: 0 10px 0 0; }
  .product_col .product-content { margin-top: 0; flex: 1; }
  .mbsm-3{ margin-bottom: 1rem !important;}
  .mbsm-4{margin-bottom: 1.5rem !important;}

  .multiuom{ width:100%; display:flex; flex-wrap:wrap; align-items:start; }
  .multiuom .mobdiv{ flex-wrap: wrap; }
  .multiuom .condiv{ width:100%; margin-bottom:0px; }
  .multiuom .condiv .pack_img{ margin:0px; margin-right:10px; }
  .multiuom .pridiv{ width:40%; text-align:left; }
  .multiuom .pridiv .product-price{ font-size: 18px; font-weight: 600; color:var(--mycolor); }
  .multiuom .btndiv{ width:60%; }
  .multiuom .condiv .acart{ line-height: 16px; padding: 5px 10px; }
}
@media only screen and (max-width: 480px) {
  .fl_pr_img{ display:none; }
}
@media only screen and (max-width: 400px) {
  .multiuom .mobdiv{ display:flex; flex-direction: column; align-items:start; }
  .multiuom .pridiv{ width:100%; text-align:left; display:flex; align-items: flex-end; gap:10px; margin-bottom:10px; }
  .multiuom .pridiv .proid{ margin-bottom:5px; }
  .multiuom .btndiv{ width:100%; display:flex; justify-content:start; }
  .multiuom .btndiv .acart, .multiuom .btndiv .quantity2{ width:100%; }
}


@-webkit-keyframes pulse-ring{
  0% { transform: scale(0.33); }
  80%, 100% { opacity: 0; }
}

@keyframes pulse-ring {
  0% { transform: scale(0.33); }
  80%, 100% { opacity: 0; }
}

@-webkit-keyframes pulse-dot {
  0% { transform: scale(0.8); }
  50% { transform: scale(1); }
  100% { transform: scale(0.8); }
}
@keyframes pulse-dot {
  0% { transform: scale(0.8); }
  50% { transform: scale(1); }
  100% { transform: scale(0.8); }
}

.def_tool{ margin:0px; padding:0px; }
.def_tool .def_t{position:absolute; z-index:1;}
.def_one{ background:inherit!important; }
.d_poi{ position: absolute; background: #fff; padding: 0; color: #fff; border-radius: 50%; width:5px; height:5px; line-height: 25px; left: 0px; top: 13px; transform: translateX(-50%) translateY(-50%); }
.d_poi:before { content: ""; position: relative; display: block; width: 400%; height: 400%; box-sizing: border-box; margin-left: -160%; margin-top: -145%; border-radius: 45px; background-color: rgba(0, 0, 0, 0.7); -webkit-animation: pulse-ring 1.25s cubic-bezier(0.215, 0.61, 0.355, 1) infinite; animation: pulse-ring 1.25s cubic-bezier(0.215, 0.61, 0.355, 1) infinite; }
.d_poi:after { content: ""; position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; border-radius: 15px; box-shadow: 0 0 8px rgba(0, 0, 0, 0.3); -webkit-animation: pulse-dot 1.25s cubic-bezier(0.455, 0.03, 0.515, 0.955) -0.4s infinite; animation: pulse-dot 1.25s cubic-bezier(0.455, 0.03, 0.515, 0.955) -0.4s infinite;}
.def_te{ background:#fff; border-radius:5px; padding:3px 5px; font-size:12px; cursor: pointer; margin-left: 13px; }
.def_te:before { border: 7px solid transparent; content: ' '; display: block; position: absolute; z-index: 2; border-right-color: #fff; left: 0px; top: 6px; }

.product-popup.botview{ bottom:22px; }
.product-popup.rightview{ right:0px; }

.color1 .d_poi, .color1 .def_te{ background:#FFC0CB!important; }
.color2 .d_poi, .color2 .def_te{ background:#F08080!important; }
.color3 .d_poi, .color3 .def_te{ background:#FFE4E1!important; }
.color4 .d_poi, .color4 .def_te{ background:#FFDAB9!important; }
.color5 .d_poi, .color5 .def_te{ background:#FFF0F5!important; }
.color6 .d_poi, .color6 .def_te{ background:#AFEEEE!important; }
.color7 .d_poi, .color7 .def_te{ background:#B0E0E6!important; }
.color8 .d_poi, .color8 .def_te{ background:#FAFAD2!important; }
.color9 .d_poi, .color9 .def_te{ background:#98FB98!important; }
.color10 .d_poi, .color10 .def_te{ background:#DCDCDC!important; }
.color11 .d_poi, .color11 .def_te{ background:#C0C0C0!important; }
.color12 .d_poi, .color12 .def_te{ background:#87CEEB!important; }
.color13 .d_poi, .color13 .def_te{ background:#1E90FF!important; }
.color14 .d_poi, .color14 .def_te{ background:#FA8072!important; }

.color1 .def_te:before { border-right-color: #FFC0CB!important; }
.color2 .def_te:before { border-right-color: #F08080!important; }
.color3 .def_te:before { border-right-color: #FFE4E1!important; }
.color4 .def_te:before { border-right-color: #FFDAB9!important; }
.color5 .def_te:before { border-right-color: #FFF0F5!important; }
.color6 .def_te:before { border-right-color: #AFEEEE!important; }
.color7 .def_te:before { border-right-color: #B0E0E6!important; }
.color8 .def_te:before { border-right-color: #FAFAD2!important; }
.color9 .def_te:before { border-right-color: #98FB98!important; }
.color10 .def_te:before { border-right-color: #DCDCDC!important; }
.color11 .def_te:before { border-right-color: #C0C0C0!important; }
.color12 .def_te:before { border-right-color: #87CEEB!important; }
.color13 .def_te:before { border-right-color: #1E90FF!important; }
.color14 .def_te:before { border-right-color: #FA8072!important; }

.inv_tab{background:#fff; margin:0 0 15px 0; border: solid 1px transparent; border-radius:5px; box-shadow:1px 1px 3px 1px rgba(0, 0, 0, 0.1);}
.inv_tab:hover{border: solid 1px var(--mycolor);}
.inv_title{display:flex; align-items:center; justify-content:space-between; padding:8px;  border-bottom:solid 1px #f3f3f3;}
.inv_body{}
.inv_body2{display:none;} .inv_tab.active .inv_body2{display:block;}
.inv_title h4{padding:0; margin:0; font-size:18px;}
.inv_lab{display:block;} .inv_out{font-size:18px; font-weight:600;}
.inv_left{border-right:solid 1px #f3f3f3;}
.inv_left, .inv_right{padding:8px; flex:1;}
.inv_footer{background:#fbfbfb; border-radius:0 0 5px 5px; display:flex; justify-content: space-between; border-top:solid 1px #f3f3f3;}
.inv_fdiv{ padding:8px; display: flex; justify-content: space-between;}
.inv_fdiv .container-checkbox{font-size:14px; margin:0; display:inline-flex; align-items:center; padding-left:0!important;}
.inv_fot_ce{border-left:solid 1px #f3f3f3; border-right:solid 1px #f3f3f3; align-items: center;}
.inv_fdiv .container-checkbox .checkmark{position:relative!important;}
.inv_tab.active .viewdetail i{    transform: rotate(180deg);}
.pricerow2{display: flex; column-gap: 10px;}
.pricerow2 .payimg{padding:5px; border:solid 1px #f2f2f2; margin-right:0; max-width:80px;}

.dash_page{ display:flex; column-gap:24px; }
.left_das{ width:250px; background:var(--light); border-radius:6px; padding:0px; } 
.right_das{ width:calc(100% - 274px); }
.left_das ul li{margin:10px 0;}
.left_das ul li a { color:var(--gray); border-radius: 10px; cursor: pointer; padding: 0.7em !important; display: flex; align-items: center; font-size: 16px; font-weight:400; margin: 0; line-height: initial; }
.left_das ul li a svg{width:25px; height:25px; margin-right:15px;}
.left_das ul li a:hover{ background: var(--mycolor); color: #fff !important; }
.left_das ul li a.active{ color: var(--mycolor); }
.left_das ul li a .svg_ico2{ stroke: var(--gray); }
.left_das ul li a:hover .svg_ico2{ stroke: #fff !important; }
.left_das ul li a.active .svg_ico2{ stroke: var(--mycolor); }

.grp-boxes {display:flex; flex-wrap:wrap; grid-gap:30px;}
.das_box, .not_box{border:solid 1px #ddd; background:#fff; border-radius:10px; padding:30px; flex: 0 0 calc(33.333% - 20px); }
.das_box a{ -webkit-transition: all 0.0s ease; -moz-transition: all 0.0s ease; transition: all 0.0s ease; display: block; }
.das_box h5, .not_box h5{font-weight:500; margin:15px 0 10px 0;}
.das_box:hover{background:var(--mycolor); border:solid 1px var(--mycolor); color:#fff;}
.das_box:hover svg{stroke:#fff;}
.svg-15{width:15px!important; height:15px!important;}
.svg-20{width:20px!important; height:20px!important;}
.svg-25{width:25px!important; height:25px!important;}
.svg-30{width:30px!important; height:30px!important;}
.svg-60{width:60px!important; height:60px!important;}
.mt-30{margin-top:30px;}
.not_box:hover{background:inherit; color:initial!important;}  
.footer { margin-top: 0!important; }
.tab-content .card.shop-list, .mylist, .mystock_bo, .catalogue-list { border-radius: 10px; }
.mystock_bo{  border: solid 1px #dee2e6 ; background: #fff; border-radius: 10px; padding: 10px;}
.w_scr{min-height:150px;}

.card.shop-list:hover{ border:1px solid #f2f2f2!important; }
.card.shop-list .quote_head{ border-radius:10px 10px 0 0;}
.row_bor .row-product:last-child{ border-radius:0 0 10px 10px; }
.row_bor .row-product:first-child{ border-radius:10px 10px 0 0; }
.quote_mob .row-product .proid{ font-size:10px!important; }
.catalogue-list{ border: solid 1px #dee2e6 ;}
.input-group.inpu-new{ border-radius:6px; }
.input-group.inpu-new:hover, .form-control:hover{ border:1px solid var(--mycolor)!important;}
.input-group.inpu-new:hover .form-control{ border:0px!important; }
.input-group-append .btn{ border-top-right-radius:6px!important;  border-bottom-right-radius: 6px!important; }
.inpu-new .form-control{ background:#fff; border-radius:6px 0 0 6px!important;}
.cal_group{ position:relative; } .cal_group .svg_ico{ position:absolute; top:5px; right:5px; }
.input-group > .form-control:not(:first-child){ border-top-left-radius: 6px; border-bottom-left-radius: 6px; }

.partscroll{ width:515px; margin: 0px auto; overflow: hidden; }
.pleft{ position:relative; display: block; width:30px; left:0px; align-content:center; }
.pright{ position:relative; display: block; width:30px; right:0px; align-content:center; }
.pleft span,.pright span{ background:none; color:var(--mycolor); }
.partscroll .single-product{ margin:25px 8px; }

.partdesc{ font-size:14px; color:#424646; margin:10px 0px; }
.partanchor{ width:100%; margin:10px 0px; overflow:hidden; text-align:center; }
.partanchor a{ font-size:14px; color:var(--mycolor); }
.partanchor a svg{ stroke:var(--mycolor); }
.modal-dialog.modal-sm{ max-width:600px!important; }

label{ margin-bottom:10px; line-height:1;}
.page-item:first-child .page-link{border-top-left-radius:30px!important; border-bottom-left-radius: 30px!important;}
.page-item:last-child .page-link{border-top-right-radius: 30px!important; border-bottom-right-radius: 30px!important;}
.myorder_lis .product-image { position: relative; flex-basis: 100px; flex-basis: 100px; flex-grow: 0; flex-shrink: 0; }

.suggmsg{ display:flex; align-items:center; }
.suggmsg .suggimg{ width:90px; } .suggmsg .suggimg img{ width:100%; }
.suggmsg .suggcont{ width:calc(100% - 140px); margin:0px 5px; }
.suggmsg .suggsvg{ width:40px; text-align:right; }
.suggmsg .suggsvg .svg_ico{ width:40px; height:40px; stroke:#28a745; }

.suggbtn{ display:flex; justify-content:space-between; }


.mandash_page{ display:flex; column-gap:24px; }
.manleft_das{ width:250px; border-radius:6px; padding:0px; background:#fff; border-right:1px solid #e2e8f0; } 
.manright_das{ width:calc(100% - 274px); }

.welcome-section{ border:1px solid #0ea5e9; border-radius: 12px; padding:20px; margin-bottom:25px; background:linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%); }
.welcome-title{ color: #0369a1; font-size: 18px; font-weight: 600; }
.welcome-msg{ display:flex; justify-content:space-between; align-items:center; gap:20px; background:#fff; padding:8px 15px; border-radius:6px; }
.welcome-msg .main-txt{ white-space: nowrap; }
.welcome-msg .nice-select.form-control:hover{ border:0px!important; }
.welcome-msg .nice-select .svg_ico2.drop{ width:15px; height:15px; fill:var(--mycolor)!important; }

.sitedrop li{ display:flex; align-items:center; padding:8px 10px!important; }
.sitedrop li span{ width: calc(100% - 250px); font-size:15px; line-height:20px; padding:5px 5px 5px 10px; color:#666; display: -webkit-box !important; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
.sitedrop li font{ display:inline-block; width:100px; text-align:center; font-size:13px; line-height:16px; padding:5px 7px 5px 5px; color:var(--mycolor); }
.sitedrop li a{ display:inline-block; width:150px; text-align:center; font-size:13px; line-height:16px; padding:5px 5px 5px 7px; color:var(--mycolor); border-left:1px solid #eee; }
.sitedrop li:hover span, .sitedrop li:hover font, .sitedrop li:hover a{ color:#fff; }
.sitedrop li.active span, .sitedrop li.active font, .sitedrop li.active a{ color:#fff; }
.sitedrop li font:hover,.sitedrop li a:hover{ font-weight:500; text-decoration:underline; }
.sitedrop li:hover .svg_ico2, .sitedrop li.active .svg_ico2{ stroke:#fff; }
.sitedrop li.active{ background:var(--mycolor); color:#fff; }

.nav-section { margin-bottom: 25px; }
.nav-section h3 { color: #64748b; font-size: 14.5px; font-weight: 500; text-transform: uppercase; letter-spacing:0.72px; margin-bottom:16px; padding-left:8px; }
.nav-menu a { display: flex; align-items: center; gap:12px; padding:12px; color: #475569; text-decoration: none; border-radius: 8px; transition: all 0.2s; font-weight: 400; }
.nav-menu a:hover{ color:var(--mycolor); }
.nav-menu a.active { background:var(--mycolor); color:#fff; font-weight: 500; }
.nav-menu a svg{ width:25px; height:25px; stroke: var(--gray); margin-right:0px; }
.nav-menu a.active .svg_ico2{ stroke:#fff; }

.stats-grid{ display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap:24px; margin-bottom:30px; }
.stat-card{ background:white; border-radius: 16px; padding:32px; text-align:center; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); border:1px solid #f1f5f9; transition: all 0.3s ease; position: relative; overflow: hidden; }
.stat-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, var(--mycolor) 0%, var(--mycolor) 100%); }
.stat-card .svg_ico2{ display:none; }
.stat-card:hover .svg_ico2{ display:block; }
.stat-number{ font-size:48px; line-height: 48px; font-weight: 800; color:var(--mycolor); margin-bottom:8px; display: block; }
.stat-label { color: #64748b; font-weight: 450; font-size:14.5px; display: flex; justify-content: center; gap:5px; }

.orderlabel{ display:inline-block; padding:10px 15px; font-size:18px; line-height:20px; color:#333; background:#f9f9f9; margin:5px; border-radius:5px; }
.orderlabel span{ color:var(--mycolor); margin-left:5px; font-size: 20px; font-weight: 400; line-height: 20px; }
.orderlabel.active{ display:inline-block; padding:10px 15px; font-size:16px; font-weight: 400; line-height:20px; color:#fff; background:var(--mycolor); margin:5px; border-radius:5px; }
.orderlabel.active span{ color:#fff; margin-left:5px; font-size: 18px; font-weight: 400; line-height: 20px; border-radius:100%; }

.orders-section { width:100%; background: white; border-radius: 16px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); border: 1px solid #f1f5f9; overflow: hidden; }
.orders-header { padding:24px 32px; border-bottom: 1px solid #f1f5f9; display: flex; justify-content: space-between; align-items: center; }
.orders-header .orders-title { font-size: 20px; font-weight: 600; color: #1e293b; }
.orders-header .orders-cust{ color:var(--mycolor); font-weight: 500; }
.orders-section .row_bor .row-product{ border: solid 1px rgba(0, 0, 0, 0.08); margin-bottom: -1px; border-left: 0px; border-right: 0px; padding:10px 25px; }

.payacc{ display:flex; width: 100%; padding: 20px 16px; font-size: 18px; line-height: 22px; overflow:hidden; border:1px solid #e5e7eb; border-radius:10px; background:#f8f9fa; cursor:pointer; }
.payacc.active{ background:var(--mycolor10); border:1px solid var(--mycolor); }
.payacc .svg-div{ padding:6px; margin-right:10px; }

.paytype{ display: flex; align-items: center; width:100%; float:left; padding:15px 20px; border:1px solid #e5e7eb; cursor:pointer; background:#fff; border-radius:8px; }
.paytype.active{ border:2px solid var(--mycolor); }
.payimg{ margin-right:10px; }
.paycon{ display: flex; justify-content: space-between; width: calc(100% - 30px); }
.paycon .svg_current{ width:22px; height:22px; }
.picon{ width:30px; text-align:right; }
.picon i{ font-size:20px; }
.paytitle{ position: relative; font-size: 15px; font-weight: 600; padding: 10px 15px; line-height: 24px; text-transform: uppercase; color: #333; padding-bottom: 5px; margin-bottom:10px; }

.emptyres h1{ font-size:32px; line-height:36px; font-weight:600; }
.emptyres h1{ font-size:20px; line-height:30px; font-weight:500; }
.emptyres p{ font-size:15px; line-height:20px; font-weight:400; }

.search-empty-icon{ width:100%; overflow:hidden; }
.search-empty-icon .svg_ico{ width:75px; height:75px; padding:15px; border-radius:100%; background:var(--mycolor10); }
.back-home .svg_ico{ width:40px; height:40px; stroke-width:1.5px; }
.back-home h4{ color:#fff; font-size:16px; line-height:20px; }
.back-home p{ color:#fff; font-size:13px; line-height:18px; }
.popular{ width:100%; overflow:hidden; }
.popular h3{ color:var(--mycolor); font-size:26px; line-height:32px; border-left:4px solid var(--mycolor); padding-left:15px; text-align:left; }
.pop-grid{ display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:15px; }
.pop-grid a{ padding:12px; border:1px solid #e5e7eb; border-radius:10px; }
.pop-grid a img{ width:40px; height:40px; margin:auto; margin-bottom:10px; }
.pop-grid a h4{ font-size:16px; line-height:20px; }
.pop-grid a span{ display:block; text-align:center; }

.trending{ width:100%; padding: 20px; overflow:hidden; border-radius:10px; }
.trending h3{ color:#fff; font-size:26px; line-height:32px; text-align:left; margin-bottom: 20px; }
.trending-pro{ width:100%; overflow:hidden; display:flex; flex-direction:column; gap:15px; }
.trending a{ width:100%; padding:12px; border:1px solid #e5e7eb; border-radius:10px; background:#ffffff10; text-align:left; }
.trending a .offer{ display:inline-block; background:#facc15; color:var(--mycolor); border-radius:10px; font-size: 12px; padding: 4px 10px; line-height: 14px; }
.trending a h4{ color:#fff; font-size:16px; line-height:20px; margin:12px 0px 10px 0px; }
.trending a p{ color:#fff; font-size:14px; line-height:18px; }
.trending a .svg_ico{ width:20px; height:20px; stroke-width:1px; }

.contact-empty{ width:100%; padding: 20px; overflow:hidden; border-radius:10px; border:1px solid #e5e7eb; }
.contact-empty h3{ color:#111827; font-size:26px; line-height:32px; text-align:center; margin-bottom: 15px; }
.contact-empty p{ color:#4b5563; font-size:14px; line-height:18px; margin:15px 0px; }

@media (max-width: 998px){
  .das_box, .not_box{ flex: 0 calc(50% - 20px); }
}

@media (max-width: 768px){
  .das_box, .not_box{ flex: 0 100%; }
  .manleft_das{display:none;} .manright_das,.right_das{ width:100%; }

  .manright_das .nice-select{ position:inherit!important; }
  .nice-select .sitedrop{ left:inherit!important; right:0; }
  .sitedrop li span { width: calc(100% - 200px); }
  .sitedrop li font { width: 75px; }
  .sitedrop li a { width: 100px; }
}

@media (max-width: 575px){
  .suggmsg .suggimg{ width:60px; }
  .suggmsg .suggcont{ width:calc(100% - 110px); }
  .def_tool{ display:none; }

  .stat-number{ font-size:22px; line-height: 28px; font-weight: 700; }

  .emptyres h1,.emptyres h2{ font-size:16px; line-height:20px; font-weight:600; }
  .emptyres p{ font-size:15px; line-height:20px; font-weight:400; }
  .popular h3, .trending h3, .contact-empty h3{ font-size:16px; line-height:22px; }
  .pop-grid a h4, .trending a h4{ font-size:14px; line-height:20px; font-weight:500; }
}

@media (max-width: 400px){
  .suggbtn{ display:flex; flex-direction: column; }
  .suggbtn .product-action{ margin-top:10px; }
  .suggbtn .product-price{ margin-left:inherit; }
}



input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; height: 20px; text-align:center; width: 20px; cursor:pointer;   border-radius:20px; padding:2px; line-height:20px; text-align:center;
background: url("data:image/svg+xml;charset=UTF-8,%3csvg viewPort='0 0 12 12' version='1.1' xmlns='http://www.w3.org/2000/svg'%3e%3cline x1='1' y1='11' x2='11' y2='1' stroke='black' stroke-width='2'/%3e%3cline x1='1' y1='1' x2='11' y2='11' stroke='black' stroke-width='2'/%3e%3c/svg%3e") 6px 5px, #fff; 
}
.debugger { position: absolute; left: 50%; top: 0; }
.menublk{ position:relative; width:375px; margin:0 12px; top:10px; border-radius:10px; }
.menublk h2{ margin-bottom:0px; }
.nav-wrapper { position: fixed; top:0; left:0; z-index:9999; border-top:solid 1px #f7f7f7; width: 400px; height: 100vh; background:#fff; transition: transform 0.3s; transform: translateX(-100%); -webkit-box-shadow:  0px 8px 5px 4px rgb(0 0 0 / 5%); box-shadow: 0px 5px 5px 4px rgb(0 0 0 / 5%); }
.nav-wrapper.seclevel{ width: 800px; }
.nav-wrapper .secondlevel{ width:400px; margin-left:400px; border-left:1px solid #eee; }

.nav-wrapper.show-menu { transform: none; }
.nav-wrapper.show-menu .tomenu{ background: rgb(255 255 255 / 88%); width: 100%; height: 100%; position: fixed; top: 0; filter:blur(4px); -o-filter:blur(4px); -ms-filter:blur(4px); -moz-filter:blur(4px); -webkit-filter:blur(4px); }


.nav-wrapper .cattitle{ display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid #eee; }
.nav-wrapper .cattitle font{ font-size:20px; font-weight:500; margin:12px 10px 12px 20px; text-overflow: ellipsis; text-transform: capitalize; }
.js-nav-toggle span { position: relative; background-color: #345; height: 2px; display: block; width: 22px; margin: 0px auto; transition: all 0.4s; transition-delay: 0.3s; }
.js-nav-toggle span:before, .js-nav-toggle span:after { content: ""; position: absolute; display: block; width: 20px; height: 0; left: 1px; top: 50%; margin-top: -7px; transition: all 0.3s 0.3s; }
.js-nav-toggle span:before { box-shadow: 0 14px 0 1px #345; } 
.js-nav-toggle span:after { box-shadow: 0 0 0 1px #345; } 
.showbo { display:flex; justify-content: center; align-items:center; position: absolute; top:2px; right:5px; width: 43px; height: 43px; background:none; margin:0; padding: 0; color: var(--mycolor);  z-index: 9999; } 
.showbo:hover{ background:#e4e2e2!important; border-radius:40px;  }

.compdiv{ display:flex; flex-direction:column; justify-content:space-between; align-items:center; padding:10px 0px; border-bottom: 1px solid #eee; background:var(--mycolor); }
.compcon{ width:100%; display:flex; justify-content:space-between; align-items:center; }
.compcon img{ width:150px; margin-left:10px; }
.complink{ width:100%; display:flex; align-items:center; padding:5px 0px 5px 10px; gap:10px; }
.nav-wrapper nav .complink a{ margin:0px; padding:5px 10px; color:#fff; font-size:13px; line-height:16px; background:none; }
.nav-wrapper nav .complink a:hover{ background:none; }

.logo .js-nav-toggle{ margin:-30px 0px 0px 0px; }
.logo .js-nav-toggle:hover{ background:none; }

.show-menu .js-nav-toggle span { background-color: transparent; }
.show-menu .js-nav-toggle span:before { transform: rotate(-45deg); } 
.show-menu .js-nav-toggle span:after { transform: rotate(45deg); } 
.show-menu .js-nav-toggle span:before, .show-menu .js-nav-toggle span:after { margin-top: 0; box-shadow: 0 0 0 1px #424646; }
.show-menu .compcon .js-nav-toggle span:before, .show-menu .compcon .js-nav-toggle span:after{ box-shadow:0 0 0 1px #ffffff; }

.nav-wrapper nav { position: absolute; left: 0; top: 51px; height: calc(100% - 55px); width: 100%; overflow-x: hidden; overflow-y: auto; background-color: #fff; }
.nav-wrapper nav .nav-toggle { position:relative; top: auto; left: 0; width:100%; max-width:347px; padding: 1.8em 0.6em; background-color:#fff;  color: #424646; z-index: 100; cursor: pointer; transition: backgroun-color 0.2s; }
.nav-wrapper nav .nav-toggle:hover { background-color: #f7f7f7; } .nav-wrapper nav .nav-toggle.back-visible .nav-back { opacity: 1; }
.nav-wrapper nav .nav-toggle.back-visible .nav-title { width: calc(100% - 20px); white-space: nowrap;   overflow: hidden; font-size:16px; font-weight:700;   text-overflow: ellipsis; text-transform: capitalize; }
.nav-wrapper nav .nav-title { padding-left: 0.7em; transition: transform 0.3s; } 
.nav-wrapper nav .nav-back { display: inline-block; position: relative; width: 25px; height: 25px; vertical-align: middle; z-index: 1; opacity: 0; transition: opacity 0.2s; }
.nav-wrapper nav .menublk .nav-back .svg_ico{ stroke:var(--mycolor); }
.nav-wrapper nav a { display: block; position: relative; padding: 0.7em; color: var(--dark); text-decoration: none; margin:5px 0px; border-radius:10px; transition: color 0.15s, background-color 0.15s; font-size:16px; }
.nav-wrapper nav a:hover, .nav-wrapper nav .nav-dropdown-active > a,  .nav-wrapper nav .nav-dropdown-active .active { color: #fff; background-color: var(--mycolor); }
.nav-wrapper nav ul { list-style: none; padding:0px; transition: transform 0.3s; background-color: #fff; position: absolute; left: 0; top: 0; height: auto;  width: 100%; }
.nav-wrapper nav ul ul { display: none; left: calc(100% - 20px); }
.nav-wrapper nav li.has-dropdown > a { padding-right: 2.5em; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-weight:400; }
.nav-wrapper nav li.has-dropdown > a span{max-width: calc(100% - 30px);     overflow: hidden;     text-overflow: ellipsis;} 
.nav-wrapper nav li.has-dropdown > a:after { content: ""; position: absolute; top: 50%; right: 1em; width: 9px; height: 9px; border: 1px solid currentcolor; border-left-color: transparent; border-top-color: transparent; transform: translateY(-90%) rotateZ(-45deg); transition: transform 0.3s; transform-origin: 100%; }
.nav-wrapper nav li.has-dropdown.nomore > a:after{ display: none;}
.nav-wrapper nav li.nav-dropdown-open > ul { display: block; }
.has-dropdown img, .singlecat img{width:30px; margin-right: 10px; padding:2px;} 
.singlecat img{ width:30px; margin-right: 10px; }
.has_eli{ display: flex; align-items: center; font-weight:400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.navigation .logo{ position:fixed; z-index:999; top:0; max-width:347px; width:100%; }

.catmenu{ position:inherit!important; top:74px!important; width:calc(100% - 30px)!important; margin:0px 15px 15px 15px!important; }
.catmenu li a.active{ border:1px solid var(--mycolor); }

li.newliv{ margin:5px; }
li.newliv a{ width:calc(100% - 20px); background:#fff; color:var(--dark); line-height:20px; display:flex; align-items:center; flex-direction:row; }
li.newliv a span.mb-2{ margin:0!important; }
li.newliv a .svg_ico{ stroke:var(--dark)!important; width:20px!important; height:20px!important; margin: -4px 15px 0px 0px;}
li.newliv a:hover{background:var(--mycolor)!important; color:#fff;}
li.newliv a:hover .svg_ico{stroke:#fff!important;}

.all_acces .svg_ico{cursor: pointer; margin-right:0!important;}
.all_acces h4{color:var(--gray);}
.all_acces .total-count{font-size:12px;}

.radius-30{border-radius:10px;}
.left100{ transform: translateX(-107%); }
.left200{ transform: translateX(-215%); }
.nav-dropdown-active ul{ margin-left:40px; }
.halfheight{ min-height:490px!important; }
.autoheight{ min-height:auto!important; }
.menuside{ height:calc(100% - 60px); }

.hybrid-left{ width:30%; margin:0px; overflow:hidden; border:1px solid #00000014; box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; border-radius:10px; }
.hybmenu{ position:inherit; width:calc(100% - 20px); margin:0px 10px; max-height:305px; overflow: auto; }
.hybmenu::-webkit-scrollbar { display: none; }
.hybmenu li a h2{ margin-bottom:0px; }
.hybmenu li a{ display: block; position: relative; padding:12px; color: var(--dark); text-decoration: none; margin:0px; border-radius: 10px; transition: color 0.15s, background-color 0.15s; font-size: 16px; }
.hybmenu li:hover h2{ font-weight:600!important; }
.hybmenu li a.active{ border:1px solid var(--mycolor); }
.hybmenu li.has-dropdown > a { padding-right:40px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-weight: 400; }
.hybmenu li.has-dropdown > a:after { content: ""; opacity:0; position: absolute; top: 50%; right: 1em; width: 9px; height: 9px; border: 1px solid currentcolor; border-left-color: transparent; border-top-color: transparent; transform: translateY(-90%) rotateZ(-45deg); transition: transform 0.3s; transform-origin:100%; }
.hybmenu li.has-dropdown:hover > a:after{ opacity:1; }
.hybmenu li.has-dropdown img{ width:25px; margin-right:10px; padding: 2px; }

.hybrid-right{ width:70%; margin:0px; padding-left:20px; overflow:hidden; }
.hybrid-right .single-slider{ padding-bottom:0px!important; border-radius:10px; overflow:hidden; box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; }

.c_det { display:flex; flex-wrap: wrap; width:100%; margin-left: 10px; }
.c_det .product-content{width:calc(100% - 100px); line-height: 20px;}
.c_det .pro_exgst{ width:95px; display:flex; flex-direction:column; align-items:flex-end; }
.c_det .pro_exgst font.fs-16{ display:block; width:100%; font-weight:400; font-size:16px!important; line-height: 20px; }
.c_det .pro_exgst font.fs-14{ display:block; width:100%; font-weight:400; font-size:12px!important; line-height: 16px; }
.c_det .qtytax{ width:100%; display:flex; align-items:end; margin-top:10px; }
.c_img { width: 60px; text-align: center; display:flex; flex-direction:column; justify-content:space-between; }
.c_img img { width: 100%; height: auto;}
.c_img .cd-qty { color: var(--mycolor); margin-top: 5px; display: block; line-height:1; }
.c_img small { font-size: 11px; line-height:16px; display: block; }
.c_img svg{ width:22px; height:22px; margin-top:5px; }
.cprodiv{ display:flex; gap:2px; }
.cprodiv .cimg{ width:30px; height:30px; padding:2px; border:1px solid #ccc; border-radius:6px; cursor:pointer; }
.cprodiv .cimg img{ width:30px; height:24px; border-radius:6px; }
.covimg{ position: relative; width: 30px; height: 30px; border: 1px solid #ccc; border-radius: 6px; cursor:pointer; }
.covimg span{ display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; position: absolute; overflow: hidden; top: 0; left: 0; background-color: rgba(23, 24, 24, 0.51); z-index: 999; border-radius: 6px; color: #fff; font-size: 14px; }

.cartnpro{ width:100%; margin:0px; }
.cartnpro span{ font-size:13px; line-height:18px; color:#ccc; }
.cartnpro font{ font-size:13px; line-height:18px; color:#ccc; }
.compmenu{ display:none; }
.comp_parent{ display:block; } .comp_child{ display:block; }
.compmenu.comp_parent{ display:none!important; }

.compdiv.comp_child{ display:none; }
.compdiv.comp_parent{ display:none; }

.estimateblk{ display:flex; flex-wrap: wrap; gap:10px; }
.estimateblk .form-group{ width:calc(100%/2 - 5px); margin-bottom:0px; }

.calculator-main { display:flex; align-items:center; padding:30px 30px; gap:40px; }
.calculator-content { width:100%; display:flex; align-items:center; gap:20px; }
.calculator-info { width:270px; }
.calculator-title { font-size: 20px; font-weight: 700; color: #1e293b; margin-bottom: 4px; display: flex; align-items: center; gap: 10px; } 
.shipping-icon { width: 24px; height: 24px; fill: #059669;\n        }\n\n        .calculator-subtitle { font-size: 14px; color: #64748b; font-weight: 500; }
.calculator-form { width:calc(100% - 290px); }
.form-row{ width:100%; margin:0px; display: flex; flex-wrap: inherit; align-items: center; gap:10px; background:#fff; border:2px solid #e2e8f0; border-radius:10px; padding:6px; transition: all 0.2s ease; }
.form-input { width:calc(100% - 180px); color: #1e293b; padding: 14px 18px!important; font-size: 16px; border: none!important; background: transparent; }
.form-input:focus { outline: none; }
.form-input::placeholder { color: #94a3b8; font-weight: 400; }
.calculate-btn { width:180px; background: linear-gradient(135deg, var(--mycolor), var(--mycolor)); color:#fff; border: none; padding: 14px 32px; border-radius: 8px; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.2s ease; display: flex; justify-content: center; align-items: center; gap: 8px; white-space: nowrap; flex-shrink: 0; }
.calculate-btn:hover { background: linear-gradient(135deg, var(--mycolor), var(--mycolor)); transform: translateY(-1px); box-shadow: 0 6px 20px rgba(5, 150, 105, 0.3); }
.calculate-btn:active { transform: translateY(0); }
.result-display { width:15%; text-align: right; } 
.result-section { width:100%; transition: all 0.3s ease; /*transform: translateX(20px);*/ } 
.result-label { font-size: 13px; color: #64748b; font-weight: 500; margin-bottom: 4px; }
.result-price { font-size: 28px; font-weight: 800; color: #059669; margin-bottom: 2px; line-height: 1; }
.result-details { font-size: 12px; color: #64748b; } 

.disclaimer-bar { background: linear-gradient(135deg, #fef3c7, #fef7cd); border-top: 1px solid #fde68a; padding: 16px 40px; display: flex; align-items: center; gap: 12px; border-radius:0px 0px 10px 10px; }
.warning-icon { width: 16px; height: 16px; fill: #d97706; flex-shrink: 0; }
.disclaimer-content { flex: 1; }
.disclaimer-title { font-size: 13px; font-weight: 600; color: #92400e; margin-bottom: 2px; }
.disclaimer-text { font-size: 12px; color: #78716c; line-height: 1.4; text-align:justify; }

.welcome-banner { background: linear-gradient(135deg, var(--mycolor) 0%, var(--seccolor) 100%); border-radius: 12px; padding: 32px 36px; margin-bottom: 24px; box-shadow: 0 4px 16px rgba(30, 91, 168, 0.2); }
.welcome-content { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.welcome-greeting h1 { font-size: 28px; font-weight: 700; color: #fff; margin-bottom: 6px; line-height: 1.2; }
.welcome-greeting .user-name { color: #ffd54f; font-weight: 800; }
.welcome-subtitle { font-size: 14px; color: rgba(255, 255, 255, 0.85); font-weight: 400; }
.welcome-actions { text-align: right; }
.last-login { display: inline-block; background: rgba(255, 255, 255, 0.15); padding: 8px 16px; border-radius: 20px; font-size: 12px; color: rgba(255, 255, 255, 0.9); font-weight: 500; }

@media screen and (min-device-width: 1224px) and (max-device-width: 1740px) {
    .openshop .header{width:calc(100% - 300px)!important; transition: transform 0.3s; margin-left:294px;}
}

@media screen and (max-width: 1000px) { 
    .form-input { width:calc(100% - 145px); padding:14px 10px!important; }
    .calculate-btn { width:145px; padding: 14px 15px; }
}

@media screen and (max-width: 991px) { 
    .nav-wrapper nav{ height: calc(100% - 0px); }
}

@media screen and (max-width: 900px) { 
    .hybrid-left{ display:none; width:100%; }
    .hybrid-right{ width:100%; padding-left:0px; }
}

@media screen and (max-width: 850px) { 
    .calculator-main{ gap:10px; }
    .calculator-content{ width:75%; flex-direction: column; }
    .result-display { width:25%; }
    .calculator-info, .calculator-form{ width:100%; }
}

@media screen and (max-width: 768px) {
    .compmenu{ display:block; } .comp_child{ display:none; } 
    .nav-wrapper nav.topcomp_child{ top:0px; }
    .compdiv.comp_child{ display:flex; }
    .cattitle.comp_child{ display:none; }
    .mobcart .c_det{ justify-content:space-between; }

    .orderlabel,.orderlabel.active{ display: flex; align-items:center; color:#333; font-size: 12px; line-height: 20px; font-weight: 500; padding: 5px 10px; margin:0px; border-radius: 8px; border: 1px solid #e1e3e4; background:#fff; }
    .orderlabel span,.orderlabel.active span{ color:var(--mycolor); font-size: 12px; line-height: 20px; font-weight: 500; }
}

@media only screen and (max-width: 600px) {
  .nav-wrapper nav a{ font-size:14px; padding:8px; }

  .welcome-banner { background:linear-gradient(135deg, var(--mycolor) 0%, var(--seccolor) 100%); border-radius: 12px; padding: 32px 36px; margin-bottom: 24px; box-shadow:0 4px 16px rgba(30, 91, 168, 0.2); }
  .welcome-content { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 10px; }
  .welcome-greeting{ text-align:center; }
  .welcome-greeting h1 { font-size: 18px; font-weight: 700; color: #fff; margin-bottom: 6px; line-height: 1.2; }
  .welcome-greeting .user-name { color: #ffd54f; font-weight: 800; }
  .welcome-subtitle { font-size: 14px; color:rgba(255, 255, 255, 0.85); font-weight: 400; }
  .welcome-actions { text-align: right; }
  .last-login { display: inline-block; background:none; padding: 8px 16px; border-radius: 20px; font-size: 12px; color:rgba(255, 255, 255, 0.85); font-weight: 500; }

  .orders-header{ flex-direction:column; }
  .contact-us .title h4{ font-size:14px; }

  .p_title a { font-weight: 500; font-size: 14px; }
  .mylist .product-action-2 .quantity2 { margin-right: 0 !important; width: 100%; max-width: 130px; }
}

@media screen and (max-width: 500px){
    .calculator-main{ flex-direction: column; }
    .calculator-content{ width:100%; flex-direction: column; }
    .result-display { width:100%; text-align:left; }

    .form-row{ flex-wrap: wrap; border:0px; }
    .form-row .form-input{ width:100%; border:1px solid #e2e8f0!important; border-radius:10px; }
    .calculate-btn{ width:100%; padding: 16px 15px; }
}

@media screen and (max-width: 450px) {
    .c_det .product-content{ width:100%; }
    .c_det .pro_exgst{ width:100px; align-items:flex-start; margin: 10px 0px 0px 0px; }
    .c_det .pro_exgst font{ display:block; width:100%; margin-right:5px; }
    .c_det .qtytax{ width:calc(100% - 100px); flex-direction:column; justify-content:center; align-items: end; margin-top:10px; }
    .c_det .qtytax .quantity2{ margin-right:0px; }
    .smallmob{ display:none; }

    #mainacc #faq .card .card-body{ padding:15px; }
    .w3-sidebar, .nav-wrapper{ width:100%; max-width:100%; }    
    .nav-wrapper{ height:calc(100% - 5px); top:0px!important; }
    .navigation .logo{ max-width:95%; }
}

@media screen and (max-width: 400px){
    .calculator-main{ padding:15px; }
    .disclaimer-bar{ padding: 16px 20px; }
    .warning-icon { width: 20px; height: 20px; }
}


/* ---- Cart table ---- */
.moremob{ display:block; }
.deskcart{ display:block; }.mobcart{ display:none; }

.shopping-tab{padding:30px; background:#fff;     border: 1px solid #eee;} 
.cart-table .product-image { float: left; width: 12%; position:relative; }
.cart-table .product-details { float: left; width: calc(37% - 25px); margin-right:15px; }
.cart-table .invoice { float: left; width: calc(25% - 10px); }
.cart-table .product-price { float: left; width: 12%; margin:0; font-weight: 400; }
.cart-table .product-quantity { float: left; width: 18%; }
.cart-table .product-removal { float: left; width: 9%; }
.cart-table .product-line-price { width: calc(12% - 15px); float: left; text-align: right; font-weight: 500;  }

 
.cart-table .group:before, .cart-table .shopping-tab:before, .cart-table .column-labels:before, .cart-table .product:before, .cart-table .totals-item:before,
.cart-table .group:after, .cart-table .shopping-tab:after, .cart-table .column-labels:after, .cart-table .product:after, .cart-table .totals-item:after { content: ''; display: table; }
.cart-table .group:after, .cart-table .shopping-tab:after, .cart-table .column-labels:after, .cart-table .product:after, .cart-table .totals-item:after { clear: both; }
.cart-table .group, .cart-table .shopping-tab, .cart-table .column-labels, .cart-table .product, .cart-table .totals-item { zoom: 1; }
.cart-table .psymbol{ font-size:14px; } 
.cart-table .column-labels{border-bottom: 1px solid #eee; margin-bottom: 10px;} 
.cart-table .column-labels label { font-weight:500; color:var(--gray); }
 
.cart-table .product { position:relative; margin-bottom:5px; padding:10px; border-bottom: 1px solid #eee; }
.onspecial2.product .product-image { margin-left: -3px; }
.cart-table .product .product-image { text-align: center; }
.cart-table .product .product-image a{display: block;}
.cart-table .product .product-image img { width: 90%; }
.cart-table .product .product-details .product-title { margin-right: 20px; font-size: 14px; font-weight: 500; margin: 0; }
.cart-table .product .product-details .product-description { margin: 5px 20px 5px 0; line-height: 1.4em; }
.cart-table .product .product-quantity input { width: 40px; }
.cart-table .product .remove-product { border: 0; padding: 4px 8px; background-color: #c66; color: #fff; font-size: 12px; border-radius: 3px; }
.cart-table .product .remove-product:hover { background-color: #a44; }
.remove-pro { width: 20px; height: 20px; line-height: 18px; cursor:pointer; float: right; margin-top: 15px; } 
.remove-pro i{ color: var(--gray); padding: 3px; font-size: 16px; } .remove-pro:hover i{color:var(--red);}
.remove svg,.remove-pro svg{ width:22px; height:22px; }

.cart-table .totals .ponum{ width:60%; float:left; }
.cart-table .totals .carttotal{ width:40%; float:right; }
.cart-table .totals .totals-item { float: right; clear: both; width: 100%; }
.cart-table .totals .totals-item label { float: left; clear: both; text-align: right; }
.cart-table .totals .totals-item .totals-value { float: right; text-align: right; }
  
.sug_pro{ display: flex; flex-wrap: wrap; align-items: center;  border-bottom: none!important; background: #fffbf0; margin:0 -15px; padding: 10px 0!important;}
.sug_pro .product-image a img{width:60%!important; margin-right: -15px;}
.sug_pro .remove-pro{right:10px!important;}
.sug_pro .remove-pro i{font-size:12px;}
.sug_pro .product-image a:before{    position: absolute; height: 45px; width: 1px; z-index: 1; content: ""; background:var(--mycolor); margin-top: -25px; left: 16px;}
.sug_pro .product-image a:after{ content: ""; background: var(--mycolor); position: absolute; height: 1px; width: 13px; bottom: 0; left: 16px; top: 20px;}
.sug_pro .product-price{font-weight:400!important;}
.product-image p{font-size:11px; margin-top:5px; line-height: initial;}

.viewOrder .sharico a{ width:auto; }
.order-table .column-labels{ padding:9px; border: 1px solid #eee; border-bottom: 1px solid #eee; }
.order-table .column-labels label{ font-weight:500; color:var(--gray); margin-bottom:0px; }
.order-table .column-labels,.order-table .product{ display: flex; align-items: center; margin-bottom:0px!important; }
.order-table .product-image { float: left; width: 12%; position:relative; }
.order-table .product-details { float: left; width: calc(50% - 25px); margin-right:15px; font-weight:400; }
.order-table .product-price { float: left; width: 15%; margin:0px!important; text-align: right; vertical-align:middle; }
.order-table .psymbol { font-size: 14px; }
.order-table .product-quantity { float: left; width: 10%; text-align: right; vertical-align:middle; }
.order-table .product-removal { float: left; width: 10%; text-align: right; vertical-align:middle; }
.order-table .product-line-price { float: left; width:15%; text-align: right; font-weight:500; justify-content: flex-end; gap:5px; }
.order-table .invoice { float: left; width: calc(25% - 10px); }

.order-table .product{ position:relative; margin-bottom:5px; padding:10px; border: 1px solid #eee; border-top:1px solid #fff; }
.order-table .product:hover{ border: 1px solid var(--mycolor); box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.3); background: rgba(0, 0, 0, 0.03); }

.odrtotal{ min-width:250px; float:right; }
.odrtotal p{ display:block; padding:7px 10px; overflow:hidden; }
.odrtotal span{ display:block; width:40%; float:left; text-align:right; font-size:14px; color:#424646; font-weight:400; }
.odrtotal font{ display:block; width:60%; float:right; text-align:right; font-size:14px; color:#424646; font-weight:400; }
.odrtotal .total span,.odrtotal .total font{ font-size:16px; color:#424646; font-weight:500; }
.odrtotal .psymbol { font-size: 16px; }

.widget{ width:100%; margin:0px; border:1px solid #d8d8d8; border-radius: 5px; overflow:hidden; }
.widget .widget-title{ margin: 0px; padding: 8px 0px 8px 10px; font-size: 16px; line-height: 20px; color: #424646; text-align: justify; background: #f5f5f5; }
.widget .ptitle{ padding: 7px 10px; color: #424646; font-size: 15px; font-weight: 400; border-top: 1px solid #d8d8d8; }
.widget .ptag{ padding: 7px 10px; color: #424646; font-size: 14px; font-weight: 400; border-top: 1px solid #d8d8d8; }

.order-view{ display:flex; flex-wrap:wrap; width:100%; }
.order-left{ width:30%; overflow:hidden; }
.order-detail{ width:100%; border:1px solid #d6d8db; background:#fafafa; padding:15px; margin-bottom:20px; border-radius:6px; }
.order-detail h4{ font-size:16px; line-height:26px; font-weight:500; margin: 0px 0px 10px 0px; }
.order-detail p{ display: flex; font-size:14px; line-height:24px; font-weight:400; margin:0px; margin-bottom: 10px; }
.order-detail p span{ display: block; width:50%; font-size:14px; line-height:24px; font-weight:400; }
.order-detail p font{ display: block; width:50%; font-size:15px; line-height:24px; font-weight:500; text-align:right; }

.order-header{ width:100%; overflow:hidden; }
.order-header .underline{ position:relative; display:inline-block; font-size: 20px; line-height:40px; font-weight: 700; color:var(--mycolor); margin-bottom: 15px; }
.order-header .underline:before { position: absolute; content: ""; height: 2px; width:100%; background: var(--mycolor); left: 0; bottom: 0; }

.apptab{  position: relative; margin-top:15px; display:flex;} 
.apptab li{display: flex; text-align: center;  width: calc(100%/4 - 10px); margin-right:5px; border: solid 1px transparent;}
.apptab li:last-child{margin-right:0;}
.apptab li a{ display:block; width:100%; background:#fff; border: solid 1px #f7f7f7; height:auto; box-shadow:0px 2px 1px rgb(0 0 0 / 8%); padding:10px; border-radius: 4px}
.apptab li a p{font-size:12px; color: var(--gray); line-height: 14px;}
.app_inf{ /*position: absolute;*/ border-radius: 0 0 4px 4px; left:0; width:100%; margin:-1px 0 25px 0; background:#fff; padding:15px; text-align:left;}
.apptab li img{width:30px; height:auto; display:block; margin:0 auto;}
.apptab li.active .app_inf{display:block;}
.apptab li.active a{padding-bottom:20px; position:relative; z-index:1; border-bottom: 1px solid #fff!important; border-radius:4px 4px 0 0; box-shadow:none;}
.app_inf h5{font-size:14px; margin-bottom:10px;}
.app_hr{margin:5px 0; display:block; font-weight:500;}
.gre_bor .app_hr{color:#1bc71b;} .org_bor .app_hr{color:#ffb224;} .blu_bor .app_hr{color:#247cff;} .red_bor .app_hr{color:#ff4224;}
.active.gre_bor a, .active.gre_bor .app_inf, .gre_bor:hover a, .app_inf.gre_bor{border:solid 1px #1bc71b;}
.active.org_bor a, .active.org_bor .app_inf, .org_bor:hover a, .app_inf.org_bor{border:solid 1px #ffb224;}
.active.blu_bor a, .active.blu_bor .app_inf, .blu_bor:hover a, .app_inf.blu_bor{border:solid 1px #247cff;}
.active.red_bor a, .active.red_bor .app_inf, .red_bor:hover a, .app_inf.red_bor{border:solid 1px #ff4224;}

.gre_bor.active, .org_bor.active, .blu_bor.active, .red_bor.active {border: none;}
.app_inf p{margin-bottom:10px;}

@media screen and (max-width: 991px){
  #viewOrder .modal-dialog{ width:100%; max-width:98%; }
}

@media screen and (max-width: 768px){
  .viewOrder .deskcart{ display:none; } .viewOrder .mobcart{ display:block; }

  .order-table .column-labels{ display: none; } 
  .order-table .product{ flex-direction:column; }
  .order-table .product-details{ width:100%; margin-right: 0px; }
  .order-table .product-image{ width:60px; min-height:initial; flex-basis: 60px; }
  .order-table .product-cont{ width:calc(100% - 50px); }
  .order-table .price-details{ width:calc(100% - 60px); margin-left:60px; margin-top: 8px; }

  .order-table .product-price { width: 30%; text-align: right; vertical-align:middle; }
  .order-table .product-removal { width: 30%; text-align: right; vertical-align:middle; }
  .order-table .product-line-price{ width: 40%; text-align: right; vertical-align:middle; padding-right:10px; }
}

@media screen and (max-width: 700px){
  .deskcart{ display:none; } .mobcart{ display:block; }
  .card.deskcart{ display:none; }

  .cart-table .totals .carttotal{width:100%;}
  .cart-table .product .product-image img{width:50px; margin: 0 10px 0 0;}
  .cart-table .shopping-tab { margin: 0; padding-top: 20px; border-top: 1px solid #eee; }
  .cart-table .column-labels { display: none; }
  .cart-table .product-image { float: left; width: auto; }
  .cart-table .product-image img { margin: 0 0 10px 10px; }
  .cart-table .product-details { float: none; margin-bottom: 10px; width:100%; }
  .cart-table .product-price { clear: both; width: auto; margin-top:6px; }
  .cart-table .product-quantity { width: auto; margin:0 10px; }
  .cart-table .product-quantity:before { content: 'x'; }
  .cart-table .product-removal { width: auto; margin-top:6px; }
  .cart-table .product-line-price { float: right; width: 100%; max-width:120px; font-weight: 700; display: flex; justify-content: space-between; align-items: center; }
  .remove-pro{ margin-top:0px; }
}
 
@media screen and (max-width: 450px) {

  .cart-table .product-removal { float: right; }
  .cart-table .product-line-price { float: right; clear: left; width: 100%; max-width:initial; margin-top: 10px; justify-content: flex-end; gap: 15px; }
  .cart-table .product .product-line-price:before { content: 'Item Total:'; }
  .cart-table .totals .totals-item label { width: 60%; }
  .cart-table .totals .totals-item .totals-value { width: 40%; }
  .moremob{ display:none!important; }

  .viewOrder .modal-header{ flex-direction:column; }
  .viewOrder .modal-header .close{ margin-top: -20px!important; }
  .order-table .price-details{ width:100%; margin-left:0px; margin-top: 8px; }
  .order-table .product-price { width: 50%; text-align: right; vertical-align:middle; }
  .order-table .product-removal { display:none; }
  .order-table .product-line-price{ width: 50%; text-align: right; vertical-align:middle; padding-right:10px; }
}







/* New Design */
.receipt-card { background: white; border: 2px solid #f0f0f0; border-radius: 16px; margin-bottom: 16px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.05); transition: all 0.3s ease; }
.receipt-card:last-child, .receipt-card .receipt-card:last-child{ margin-bottom:0px; }
.receipt-card:hover { border-color:var(--mycolor); box-shadow: 0 8px 24px rgba(46, 125, 50, 0.1); }
.receipt-header { background: #f8f9fa; padding: 16px 20px; display: flex; justify-content: space-between; align-items: center; cursor: pointer; border-bottom: 1px solid #e9ecef; }
.receipt-header.expanded { background:var(--mycolor10); border-bottom-color:var(--mycolor); }
.receipt-basic-info { display: flex; align-items: center; gap: 16px; flex: 1; }
.receipt-meta { display: flex; flex-direction: column; gap: 4px; }
.customer-info { font-weight: 600; color: #333; font-size: 14px; }
.date-time { color: #666; font-size: 12px; }
.receipt-summary { display: flex; align-items: center; gap: 20px; }
.order-number { background: var(--mycolor10); color: var(--mycolor); padding: 4px 12px; border-radius: 20px; font-size: 12px; font-weight: 600; }
.order-total { font-size: 16px; font-weight: 700; color: var(--mycolor); }
.expand-icon { color: #666; transition: transform 0.3s ease; }      
.receipt-header.expanded .expand-icon { transform: rotate(180deg); }
.receipt-details { display: none; background: white; }
.receipt-details.expanded { display: block; }
.receipt-card .action-buttons { padding: 16px 20px; background: #f8f9fa; display: flex; gap: 8px; flex-wrap: wrap; justify-content:flex-start; border-bottom: 1px solid #e9ecef; }
.receipt-card .action-btn { background: #2E7D32; color: white; border: none; padding: 8px 16px; border-radius: 20px; font-size: 12px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; display: flex; flex-direction: row; align-items: center; gap: 6px; min-width: 70px; justify-content: center; }
.receipt-card .action-btn:hover { background: #1B5E20; transform: translateY(-1px); box-shadow: 0 4px 12px rgba(46, 125, 50, 0.3); }
.action-btn .svg_ico{ stroke:#fff; }
.action-btn.email { background: #1976d2; }
.action-btn.email:hover { background: #1565c0; }
.action-btn.sms { background: #f57c00; }
.action-btn.sms:hover { background: #ef6c00; }
.action-btn.copy { background: #7b1fa2; }
.action-btn.copy:hover { background: #6a1b9a; }
.action-btn.download { background: #388e3c; }
.action-btn.download:hover { background: #2e7d32; }
.action-btn.view { background: #455a64; }
.action-btn.view:hover { background: #37474f; }
.action-btn.delete { background: #dd1e00; }
.action-btn.delete:hover { background: #b01801; }
.items-section { padding: 20px; max-height:450px; overflow:auto; }
.items-list { margin-bottom: 16px; }
.item-row { display: flex; align-items: center; padding: 12px 0; border-bottom: 1px solid #f0f0f0; gap: 12px; }
.item-row:last-child { border-bottom: none; }
.item-image { width: 32px; height: 32px; background: #f0f0f0; border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 14px; }
.item-image img{ width:100%; height:100%; }
.item-details { flex: 1; }
.item-name { font-weight: 600; color: #333; font-size: 13px; margin-bottom: 2px; }
.item-code { color: #666; font-size: 11px; font-family: monospace; }
.item-price { font-weight: 600; color:var(--mycolor); font-size: 14px; }
.quantity-info { color: #666; font-size: 11px; text-align: right; min-width: 80px; }

.order-totals { background: #f8f9fa; padding: 16px 20px; border-radius: 8px; margin-top: 16px; }
.total-row { display: flex; gap:10px; margin-bottom: 8px; font-size: 13px; }
.total-row:last-child { margin-bottom: 0; font-weight: 700; font-size: 14px; color:var(--mycolor); padding-top: 8px; border-top: 2px solid var(--mycolor); }
.total-label { color: #666; }
.total-value { color: #333; font-weight: 600; }
.total-row:last-child .total-label,.total-row:last-child .total-value{ color:var(--mycolor); }


/* Quotes Acceptance Design */
.quote-acc{ width:100%; overflow:hidden; border:1px solid #e5e7eb; border-radius:10px; }
.quote-head{ display:flex; justify-content: space-between; align-items: flex-start; width:100%; padding:20px 20px; overflow:hidden; }
.quote-head h3{ color:#212529; font-size:30px; line-height:36px; font-weight:600; }
.quote-head span{ display:inline-block; color:var(--mycolor); font-size:13px; line-height: 16px; padding:4px 10px; background:#f1f5f9; }
.quote-head font{ display:inline-block; color:#ccc; font-size:13px; line-height: 16px; }
.quote-bline{ width:100%; height:4px; background:var(--mycolor); }

.quote-body{ width:100%; padding:20px 20px; overflow:hidden; }
.quote-info{ display:flex; width:100%; padding:20px 20px; overflow:hidden; background:#fff; border-radius:10px; }
.quote-info > svg{ border: 1px solid #ccc; padding: 2px; border-radius: 6px; }
.quote-cont .title{ color:#1e293b; font-size:14px; line-height: 18px; font-weight:400; }
.quote-cont ul li{ color:#1e293b; font-size:14px; line-height: 18px; font-weight:400; padding:4px 0px; }
.quote-cont ul li h4{ color:#1e293b; font-size:18px; line-height: 22px; font-weight:600; }

.quote-pro{ display:flex; background:#f8fafc; border:solid 1px #f2f2f2; padding:15px; margin-bottom:10px; }
.quote-pro:hover{ border:solid 1px var(--mycolor); box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.3); background: rgba(0, 0, 0, 0.03); }
.quote-pro:last-child{ margin-bottom:0px; }
.quote-pro-con{ width:100%; display:flex; justify-content:space-between; }
.quote-pro-img{ width:100px; text-align:center; }
.quote-pro-img img{ height:80px; }

.qty-div{ width:100px; display:flex; flex-direction:column; justify-content:center; align-items:center; }
.qty-div font{ display:inline-block; min-width:35px; text-align:center; padding:5px; color:#fff; font-size:14px; border-radius:5px; background:var(--mycolor); }
.price-div{ width:120px; display: flex; flex-direction:column; justify-content:space-around; }
.price-div .price-row{ display:flex; justify-content:space-between; color:#64748b; font-size:14px; line-height:16px; font-weight:400; }

.payimg{ border:solid 1px #f2f2f2; padding:8px 10px; font-size:14px; line-height:16px; border-radius: 5px; }
.quote-foot{ width:100%; padding:20px 20px; overflow:hidden; background:#1e293b; }
.quote-foot .foot-p{ color:#fff; font-size:14px; line-height:18px; }

.balance-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; margin-bottom: 30px;}
.balance-card { background: white; border-radius: 12px; padding: 24px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); border: 1px solid #e2e8f0; transition: all 0.2s;}
.balance-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.1); transform: translateY(-2px); }
.balance-card-header { display: flex; align-items: center; gap: 12px; }
.balance-icon { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; border-radius: 10px; font-size: 24px;}
.balance-icon.outstanding { background: #fee2e2; color: #dc2626;}
.balance-icon.credits { background: #dbeafe; color: #2563eb;}
.balance-icon.net { background: #f3e8ff; color: #9333ea;}
.balance-card-content h3 { font-size: 13px; font-weight: 500; color: #64748b; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 4px;}
.balance-amount { font-size: 32px; font-weight: 700; color: #1a202c; line-height: 1;}
.balance-amount.negative { color: #dc2626;}
.balance-amount.positive { color: #059669; }

.credit-blocks { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin-top: 24px; padding-top: 24px; border-top: 1px solid #e2e8f0; }
.credit-block { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; padding: 20px; border-radius: 10px; box-shadow: 0 4px 6px rgba(102, 126, 234, 0.2); }
.credit-block h4 { font-size: 13px; font-weight: 500; opacity: 0.9; margin-bottom: 8px; }
.credit-block .amount { font-size: 28px; font-weight: 700; }
.credit-block .date { font-size: 12px; opacity: 0.8; margin-top: 8px; }

@media screen and (max-width: 700px){
  .quote-head{ display:flex; flex-direction: column; justify-content:space-between; gap:10px; }
  .receipt-meta .order-number{ background: none; padding: 7px 0px; font-size: 15px; line-height:15px; color:#333; }
  .cart-table .column-labels{ margin-bottom:0px; }
  .cart-table .product{ padding:5px; }
}

@media screen and (max-width: 600px){
  .quote-pro-con{ display:flex; flex-direction: column; justify-content:space-between; gap:10px; }
  .qty-div{ width:50px; }
  .quote-pro-img { width: 70px; }
  .quote-pro-img img{ height:60px; }
  .order-totals { padding: 10px 10px; border-radius: 8px; margin-top: 16px; }
}

