/*
 * Theme: PCBayi B2B
 * URL: pcbayi.com
 */

/* 0- Reset */
:root{
    --font-family-main: "Poppins", sans-serif;
    --font-family-tabler: 'tabler-icons';
    --base-font-size-12: 12px;
    --base-font-size-13: 13px;
    --base-font-size-14: 14px;
    --base-font-size-16: 16px;
    --base-font-size-18: 18px;
    --base-font-size-20: 20px;
    --base-font-size-22: 22px;
    --base-font-size-24: 24px;
    --color-main-border: #e4e4e4;
    --color-bg-f2: #f2f2f2;
    --color-bg-fb: #fbfbfb;
    --color-red: #ff0000;
    --color-main: #25d366;
    --color-main-soft: #84c718;
    --color-second: #313131;
    --color-main-hover: #1da24f;
    --color-main-81: #818181;
    --color-main-22: #222222;
    --color-white: #ffffff;
    --color-main-c3: #c3c3c3;
    --css-transition-ease: all .3s ease-in-out;
    --set-margin-bottom: 30px;
    --set-margin-bottom-15: 15px;
    --footer-bg: #2f2f2f;
    --color-main-6e: #6e6e6e;
    --color-warning: #ff9800;
    --color-dark-red: #c52323;
    --color-main-blue: #18264d;
    --box-shadow-global: 0 0 7px 0px rgb(0 0 0 / 15%);
    --box-shadow-global-focus: 0 0 7px 0px rgb(0 35 170 / 35%);
    --tblr-white: #ffffff;
    --tblr-black: #000000;
    --tblr-dark: #1f2937;
    --tblr-blue: #066fd1;
    --tblr-azure: #4299e1;
    --tblr-indigo: #4263eb;
    --tblr-purple: #ae3ec9;
    --tblr-pink: #d6336c;
    --tblr-red: #d63939;
    --tblr-orange: #f76707;
    --tblr-yellow: #f59f00;
    --tblr-lime: #74b816;
    --tblr-green: #2fb344;
    --bs-primary: #18264d;
}

@import url('https://fonts.googleapis.com/css2?family=Poppins:@0,300;0,400;0,600;0,700;&family=STIX+Two+Text');
a, a:active, a:focus, a:hover, button, button:hover, button:focus, button:active{ text-decoration: none!important; outline: none!important; }
.form-control.no-resize{ resize: none; }
.cursor-pointer{ cursor: pointer; }
.dropdown-toggle::after{ content: "\ea5f"; font-family: var(--font-family-tabler); border: 0; }
html, body { min-height: 100%; height: 100%; width: 100%; }
body{ font-family: var(--font-family-main); font-size: var(--base-font-size-14); min-height: 100%}
.modal.no-footer .modal-footer{ display: none; }
.modal.no-footer .modal-header{ background-color: var(--color-second); }
.modal.no-footer .modal-header .modal-title{ color: var(--color-white); }
.modal.no-footer .modal-header .btn-close{ background-color: var(--color-white); opacity: 1; }
.tooltip-el{ text-align: center; position: relative; display: inline-block; font-weight: 600; width: 10px; color: var(--color-main)}
.btn-primary-main{ background-color: var(--color-main); border-color: var(--color-main); color: var(--color-white)}
.btn-primary-main:hover,
.btn-primary-main:active,
.btn-primary-main:first-child:active,
.btn-primary-main:focus,
.btn-primary-main.show,
.btn-primary-main.active{ color: var(--color-white); background-color: var(--color-main-hover); border-color: var(--color-main-hover)}
.form-control::placeholder{ color: var(--color-main-81) }
.overlay-div{ display: none; }
.mobile-overlay .overlay-div,
.show-overlay .overlay-div{ display: block; width: 100%; height: 100%; background: rgba(0,0,0,.55); z-index: 15; position: fixed; top: 0; left: 0; }
a.full-anchor{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; display: block; }
body.mm-opened,
body.show-overlay{ width: 100%; height: 100%; overflow: hidden; }
body.show-overlay .quick-links{ z-index: 2; }
.visible-container{ position: relative; width: 1px; height: 1px; display: inline-block; overflow: hidden; opacity: 0;}
.visible-container .visible-item{ position: absolute; top: 0; lefT: 0; width: 1px; height: 1px;}
a div.pending-el{ display: none; }
a.pending-btn span.btn-def-el{ display: none; }
a.pending-btn div.pending-el{ display: inline-block; }
.loading-div{ display: none; position: fixed; top: 0; left: 0; z-index: -1; width: 100%; height: 100%; }
.loading-show-el .loading-div{ display: block; z-index: 999; }
.loading-show-el .loading-div .loading-el{ height: 100%; display: flex; justify-content: center; align-items: center;}
.loading-show-el .loading-div .loading-el .inner-el{ display: flex; flex-direction: column; text-align: center; align-items: center; justify-content: center; color: #f2f2f2; background: rgb(0 0 0 / 50%); padding: 10px; border-radius: 100%;  }
.loading-show-el .loading-div .loading-el .inner-el .text{ font-size: var(--base-font-size-20); font-weight: 600; margin-top: 15px;}
body.loading-show-el{ overflow: hidden; }
.telInput{ max-width: 100px;  }
.telInput+.select2-container--default .select2-selection--single .select2-selection__rendered{ line-height: 36px; }
.telInput+.select2-container--default .select2-selection--single .select2-selection__arrow{ height: 34px; }
.telInput+.select2-container .select2-selection--single .select2-selection__rendered{ height: 38px; }
.telInput+.select2-container .select2-selection--single{ height: 38px; border: var(--bs-border-width) solid var(--bs-border-color); border-radius: var(--bs-border-radius) 0 0 var(--bs-border-radius); margin-left: 1px; }

/* 1- Header */
.head-side{ }
.head-side.zIndex{ z-index: 17; position: relative; background-color: var(--color-white) }
body.is-sticky{ margin-top: 193px; }
.head-side.is-sticky {animation: slideDown 0.35s ease-out; position: fixed; top: 0; left: 0; background-color: var(--color-white); z-index: 99; box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 40%); }
.head-side .top-bar{ background: var(--color-white); border-bottom: 1px solid var(--color-main-border) }
.head-side .top-bar .list-group .list-group-item{ padding: 7px 0; background: none; border: none;}
.head-side .top-bar .list-group .list-group-item+.list-group-item label.no-click.has-border{ position: relative; }
.head-side .top-bar .list-group .list-group-item+.list-group-item a:not(.not-main){ position: relative; }
.head-side .top-bar .list-group .list-group-item+.list-group-item a:before{ content: ""; top: 5px; left: 0; display: block; width: 1px; height: 16px; background-color: var(--color-main-border); position: absolute; }
.head-side .top-bar .list-group .list-group-item+.list-group-item label.no-click.has-border:before{ content: ""; top: 5px; left: 0; display: block; width: 1px; height: 16px; background-color: var(--color-main-border); position: absolute; }
.head-side .top-bar .list-group .list-group-item+.list-group-item .mega-inner a:before{ display: none }
.head-side .top-bar .list-group .list-group-item+.list-group-item .mega-inner ul a{ border-left: 0}
.head-side .top-bar .list-group .list-group-item+.list-group-item .mega-inner ul+ul{ position: relative}
.head-side .top-bar .list-group .list-group-item+.list-group-item .mega-inner ul+ul:after{content: ""; position: absolute; left: 0; top: 15%; width: 1px; height: 70%; background: var(--color-main-border); }
.head-side .top-bar .list-group .list-group-item label.no-click,
.head-side .top-bar .list-group .list-group-item a{ transition: var(--css-transition-ease); color: var(--color-second); display: inline-flex; align-items: center; padding: 3px 15px; background: none; border: none;}
.head-side .top-bar .list-group .list-group-item a:hover{ color: var(--color-main-hover);}
.head-side .top-bar .list-group .list-group-item i{ color: var(--color-main); font-size: var(--base-font-size-14); margin-right: 5px; padding-bottom: 3px  }
.head-side .top-bar .list-group .list-group-item label.no-click i{ margin-right: 2px; padding-bottom: 3px  }
.head-side .top-bar .list-group .list-group-item span{  }
.head-side .top-bar .list-group .list-group-item+.list-group-item label.no-click{ padding-right: 7px; }
.head-side .top-bar .list-group .list-group-item+.list-group-item label+label{ padding-left: 0; }
.dropdown.hoverable .dropdown-menu { animation: 0.3s slideUp; }
/*.dropdown.hoverable:hover>.dropdown-menu { display: block; }*/
.dropdown.hoverable>.dropdown-menu.show-el { display: block; }
.dropdown.hoverable>.dropdown-toggle:active { pointer-events: none; }
.head-side .mega-drdown.dropdown-menu{ padding: 15px; background: none; border: none; right: 0; }
.head-side .sub-header-container .mega-drdown.dropdown-menu{ padding: 15px 0; }
.head-side .mega-drdown.dropdown-menu .mega-inner{ position: relative; border-radius: 5px; background: var(--color-white); border-top: 3px solid var(--color-main); display: flex; box-shadow: var(--box-shadow-global)}
.head-side .mega-drdown.dropdown-menu .mega-inner:after{ content: ""; width: 10px; height: 10px; position: absolute; top: -7px; right: 1em; z-index: -1; transform: rotate(45deg); background: var(--color-main); }
.head-side .mega-drdown.dropdown-menu .mega-inner ul { padding: 15px 10px;}
.head-side .mega-drdown.dropdown-menu .mega-inner ul li{ font-size: var(--base-font-size-14); list-style: none; }
.head-side .mega-drdown.dropdown-menu .mega-inner ul li a .defaultCurrency{ margin-left: 10px; background: var(--color-main-blue); color: var(--color-white); border-radius: 5px; font-size: 10px; padding: 2px 5px; text-transform: uppercase; font-weight: 600; }
.head-side .mega-drdown.dropdown-menu .mega-inner ul li.title{ font-weight: 600 }
.head-side .mega-drdown.dropdown-menu .mega-inner .title-wrapper{ font-size: var(--base-font-size-14); min-width: 450px; padding: 15px 20px; width: 100%; height: auto; border-bottom: 1px solid var(--color-main-border); }
.head-side .mega-drdown.dropdown-menu .mega-inner .bottom-side .right-side i{ min-width: var(--base-font-size-14);}
.head-side .mega-drdown.dropdown-menu .mega-inner .bottom-side{ font-size: var(--base-font-size-14);}
.top-bar .mega-drdown.dropdown-menu .mega-inner .bottom-side .col{ padding: 15px; text-align: left;}
.top-bar .mega-drdown.dropdown-menu .mega-inner .bottom-side .sub-container,
.top-bar .mega-drdown.dropdown-menu .mega-inner .bottom-side .up-container{ width: 100%; height: 50%; padding: 15px; flex-direction: column; align-items: flex-start; gap: 8px; position: relative; }
.top-bar .mega-drdown.dropdown-menu .mega-inner .bottom-side .not-main{ padding: 0}
.top-bar .mega-drdown.dropdown-menu .mega-inner .bottom-side .title{ color: var(--color-main); font-weight: 600;}
.top-bar .mega-drdown.dropdown-menu .mega-inner .bottom-side .mail-info{ color: #2a2e37; }
.top-bar .mega-drdown.dropdown-menu .mega-inner .bottom-side .sub-container{ border-top: 1px solid var(--color-main-border); }
.top-bar .mega-drdown.dropdown-menu .mega-inner .bottom-side .left-side{ border-right: 1px solid var(--color-main-border); }
.top-bar .mega-drdown.dropdown-menu .mega-inner .bottom-side,
.top-bar .mega-drdown.dropdown-menu .mega-inner .bottom-side span,
.top-bar .mega-drdown.dropdown-menu .mega-inner .bottom-side a,
.top-bar .mega-drdown.dropdown-menu .mega-inner .bottom-side ul li a{ font-size: 14px; }
.top-bar .mega-drdown.dropdown-menu .mega-inner .bottom-button-wrapper a{ border-top: 1px solid var(--color-main-border); border-radius: 0 0 5px 5px; padding: 1em; background: var(--color-bg-f2); }
.head-side .mega-drdown.dropdown-menu .mega-inner.cat-list{}
.head-side .mega-drdown.dropdown-menu .mega-inner.cat-list ul{ margin-bottom: 0; width: 100%; padding: 10px 0;}
.head-side .mega-drdown.dropdown-menu .mega-inner.cat-list ul li{ padding: 0 10px; width: 100%}
.head-side .mega-drdown.dropdown-menu .mega-inner.cat-list ul li a{ position: relative; padding: 5px 10px; width: 100%}
.head-side .mega-drdown.dropdown-menu .mega-inner.cat-list ul li.has-child>a:after{ color: var(--color-main); font-size: var(--base-font-size-16); content: '\ea61'; position: absolute; font-family: var(--font-family-tabler); top: 0; right: 0; width: 20px; height: 100%; display: flex; justify-content: center; align-items: center; }
.head-side .mega-drdown.dropdown-menu .mega-inner.cat-list ul li a i{ min-width: 20px; display: inline-block; }
.main-header{ }
.main-header .logo-side{ width: 100%; max-width: 270px; }
.main-header .logo-side a.main-logo{ display: block; position: relative; padding: 15px 0;}
.main-header .search-side{ width: 100%; padding: 0 calc(var(--bs-gutter-x) * .5); display: flex; align-items: center; }
.show-overlay .main-header .search-side.z-index-overlay{ z-index: 16; }
.main-header .search-side .input-group-wrapper{ position: relative; padding: 0 calc(var(--bs-gutter-x) * .5); }
.main-header .search-side .form-control{ border-right: 0; border-color: var(--color-main-border); padding-left: 20px; font-size: var(--base-font-size-14); height: 52px; background: var(--color-bg-f2); }
.main-header .search-side .form-control:focus{ box-shadow: none; }
.main-header .search-side .cats-btn{ background-color: var(--color-bg-f2); border-color: var(--color-main-border); border-left: 0; }
.main-header .search-side .cats-btn:after{ display: none; }
.main-header .search-side .cats-btn span{ color: var(--color-second); position: relative; padding: 5px 30px 5px 10px; background: rgba(0, 0, 0, .05); border-radius: var(--bs-border-radius); }
.main-header .search-side .cats-btn span:after{ content: "\ea5f"; top: 5px; right: 10px; position: absolute; font-family: var(--font-family-tabler); }
.main-header .search-side .search-btn{ padding: 0 5px 0 0; border-left: 0; border-color: var(--color-main-border); background-color: var(--color-bg-f2); }
.main-header .search-side .search-btn i{ font-size: 20px; border-radius: var(--bs-border-radius); width: 42px; height: 42px; display: inline-flex; justify-content: center; align-items: center; color: var(--color-white); background-color: var(--color-main); }
.main-header .header-buttons-side{ width: 100%; max-width: 155px; display: flex; align-items: center; }
.main-header .header-buttons-side a{ color: var(--color-second); position: relative; display: inline-flex; }
.main-header .header-buttons-side a .badge{ background-color: var(--color-main); color: var(--color-white); position: absolute; right: -5px; top: 0; }
.main-header .header-buttons-side a+a{ margin-left: 15px; }
.main-header .header-buttons-side i{ font-size: 32px; position: relative; }
.main-header .search-result-wrapper{ position: absolute; top: 100%; left: 0; width: 100%; padding: calc(var(--bs-gutter-x) * .5); z-index: 5; display: none; }
.main-header .search-result-wrapper .result-content{ width: 100%; height: auto; min-height: 120px; position: relative; border-radius: 5px; background: var(--color-white); border-top: 3px solid var(--color-main); display: block; box-shadow: var(--box-shadow-global);  padding: var(--set-margin-bottom-15); }
.main-header .search-result-wrapper .result-content:after{ content: ""; width: 10px; height: 10px; position: absolute; top: -7px; left: 1em; z-index: -1; transform: rotate(45deg); background: var(--color-main); }
.search-result-wrapper .result-content .title-content{ margin-bottom: var(--set-margin-bottom-15); font-weight: 600; color: var(--color-main); font-size: var(--base-font-size-16) }
.search-result-wrapper .result-content .title-content i{ display: none; }
.search-result-wrapper .result-content .res-products,
.search-result-wrapper .result-content .res-cats-wrapper{ max-height: 50vh; overflow-y: auto; width: 100%;  }
.search-result-wrapper .result-content .result-cat-list{ padding: 0;  list-style: none; }
.search-result-wrapper .result-content .result-cat-list .cat-item{  }
.search-result-wrapper .result-content .result-cat-list .cat-item a{ display: inline-block; color: var(--color-main-81); font-size: var(--base-font-size-14); padding: 2px 0; }
.search-result-wrapper .result-content .result-cat-list .cat-item.title-item a{ color: var(--color-second); font-weight: 600; margin-bottom: 5px; }
.search-result-wrapper .res-product-el{ position: relative; width: 100%; padding: 5px; border-radius: var(--bs-border-radius); background-color: var(--color-bg-f2)}
.search-result-wrapper .res-product-el:nth-child(even){ background-color: var(--color-white) }
.search-result-wrapper .res-product-el .image-side{ border-radius: var(--bs-border-radius); position: relative; width: 60px; max-width: 60px; height: 60px; max-height: 60px; text-align: center; }
.search-result-wrapper .res-product-el .col{ padding: 0;  }
.search-result-wrapper .res-product-el .buttons-side{ max-width: 146px;}
.search-result-wrapper .res-product-el .product-side{ padding: 0 var(--set-margin-bottom-15)}
.search-result-wrapper .res-product-el .buttons-side .input-group{ max-width: 146px; text-align: right;}
.search-result-wrapper .res-product-el .buttons-side .input-group .form-control{ padding: 5px; height: 30px; width: 40px; max-width: 40px; text-align: center }
.search-result-wrapper .res-product-el .buttons-side .input-group .btn{ height: 30px; width: 36px; }
.search-result-wrapper .res-product-el .buttons-side .input-group .btn-cart{ background-color: var(--color-second); border-color: var(--color-second) }
.res-product-el .product-side .pr-name{ margin-bottom: 5px; font-weight: 600; font-size: var(--base-font-size-12); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.res-product-el .product-side .pr-stock{ font-size: var(--base-font-size-12); }
.res-product-el .product-side .pr-stock label{ color: var(--color-main); font-weight: 600; }
.res-product-el .product-side .pr-stock span{ color: var(--color-main-81)}
.res-product-el a.full-anchor{ z-index: 9; }
.res-product-el .input-group{ z-index: 10; }
.not-found-warning{ display: flex;}
.not-found-warning i{ font-size: var(--base-font-size-20); margin-right: 10px;}
.sub-header{}
.sub-header .sub-header-container{ padding: 5px; display: flex; align-items: center; border: 1px solid var(--color-main-border); border-radius: var(--bs-border-radius); position: relative; }
.sub-header .sub-header-container .categories-btn-wrapper{ width: 100%; max-width: 260px; }
.sub-header .sub-header-container .mega-drdown{ width: 100%; }
.sub-header .sub-header-container .btn.btn-main-menu{ font-weight: 600; padding-left: 25px; padding-right: 25px; display: flex; justify-content: space-between; width: 100%; }
.sub-header .sub-header-container .btn.btn-main-menu i{ position: relative; top: 4px;}
.sub-header .sub-header-container .btn.btn-main-menu:after{ display: none;}
.sub-header .sub-header-container .second-nav{ justify-content: space-between; display: flex; width: 100%; padding: 0 0 0 calc(var(--bs-gutter-x) * .5); }
.sub-header .sub-header-container .second-nav ul.list-inline{ margin-bottom: 0; }
.sub-header .sub-header-container .second-nav ul.list-inline li{ display: inline-flex; }
.sub-header .sub-header-container .second-nav ul.list-inline li a{ align-items: center; padding: 10px 15px; color: var(--color-second); font-weight:600; }
.sub-header .second-nav ul.list-inline li a.campaign-products{ position: relative; font-weight: 600; border-radius: var(--bs-border-radius); background-color: var(--bs-primary); color: var(--color-white) }
.sub-header .second-nav ul.list-inline li a.campaign-products .badge{ background-color: var(--color-dark-red); position: absolute; top: -4px; right: -10px; font-size: var(--base-font-size-12); border-radius: 50px; box-shadow: 0 0 15px -4px rgb(0 0 0 / 50%)}
.sub-header .sub-header-container .second-nav ul.list-inline li .mega-drdown{ left: 0; top: 100%; width: 100%;}
.sub-header .mega-inner .category-sub-menu{ display: none; }
.sub-header-container .second-nav-sub-menu{ animation: 0.3s slideUp; padding: 15px; display: none; z-index: 10; position: absolute; top: 100%; left: 0; width: 100%; background-color: var(--color-white); min-height: 300px; border-radius: var(--bs-border-radius); box-shadow: var(--box-shadow-global); border-top: 3px solid var(--color-main); max-height: 70vh; overflow-y: auto; }
.sub-header-container .second-nav-sub-menu.show-it{ display: block; }
.sub-header-container .mega-menu-manufacturers .mega-mm-inner{ display: flex; flex-wrap: wrap; align-items: flex-start; align-content: center; gap: 15px; }
.sub-header-container .mega-menu-manufacturers ul{ margin-bottom: 0; display: flex; padding: 0; flex-direction: column; width: 6.55%; }
.sub-header-container .mega-menu-manufacturers ul li{ list-style: none; }
.sub-header-container .mega-menu-manufacturers ul li.list-head{ font-size: var(--base-font-size-16); border-bottom: 2px solid var(--color-main-border); color: var(--color-main); font-weight: 600; margin-bottom: 5px; padding: 2px 0; }
.sub-header-container .mega-menu-manufacturers ul li a{ font-size: var(--base-font-size-13); transition: all .3s ease; padding: 3px 0; color: var(--color-second); }
.sub-header-container .mega-menu-manufacturers ul li a:hover,
.sub-header-container .mega-menu-manufacturers ul li a:active,
.sub-header-container .mega-menu-manufacturers ul li a.active,
.sub-header-container .mega-menu-manufacturers ul li a:focus{ color: var(--color-main) }
.sub-header .cat-list .has-child{ position: relative; }
.sub-header .cat-list .has-child .dr-menu{ display: none; border-radius: var(--bs-border-radius); box-shadow: var(--box-shadow-global); border-top: 3px solid var(--color-main); }
.sub-header .cat-list .has-child .dr-menu.show-el{ display: block; position: absolute; top: 0; left: 100%; width: 250px; height: auto; min-height: 100px; background-color: var(--color-white); z-index: 5; }
.sub-header .cat-list .has-child .dr-menu li a{ display: block; color: var(--color-second); padding: 4px 10px!important; }
.sub-header .cat-list .has-child a:hover{ background-color: var(--color-bg-f2); color: var(--color-main)!important; }

.sub-header-container .mega-menu-campaign .mega-mm-inner{ display: flex; flex-wrap: wrap; align-items: flex-start; align-content: center; gap: 15px; }
.mega-menu-campaign .slick-pr-item{ float: left; position: relative; padding: 0 5px; width: 16.66666% }
.mega-menu-campaign .slick-pr-item .item-inner{ position: relative; border-radius: var(--bs-border-radius); border: 1px solid var(--color-main-border); padding: 10px;  }
.mega-menu-campaign .slick-pr-item .item-inner .promo-badge{ position: absolute; top: 10px; left: 10px; background-color: var(--bs-success); color: var(--color-white); padding: 2px 10px; font-size: var(--base-font-size-14); z-index: 2; border-radius: var(--bs-border-radius);  }
.mega-menu-campaign .slick-pr-item .item-inner .pr-img{ margin-bottom: 10px; background-size: contain; background-position: center center; background-repeat: no-repeat; width: 100%; position: relative; display: block; height: 180px; border-radius: var(--bs-border-radius); }
.mega-menu-campaign .slick-pr-item .item-inner .pr-name{ overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: var(--base-font-size-12); font-weight: 600; width: 100%; margin-bottom: 10px; }
.mega-menu-campaign .slick-pr-item .item-inner .actions-div{ font-size: var(--base-font-size-12); font-weight: 600; width: 100%; display: flex; justify-content: space-between; align-items: end; }
.mega-menu-campaign .slick-pr-item .item-inner .actions-div .btn-cart{ position: relative; z-index: 3; width: 24px; height: 24px; display: inline-flex; justify-content: center; align-items: center; font-size: 14px;  background-color: rgba(from var(--color-main) r g b / 0.2); border-color: var(--color-main); color: var(--color-main)}
.mega-menu-campaign .slick-pr-item .item-inner .actions-div .btn-cart:hover,
.mega-menu-campaign .slick-pr-item .item-inner .actions-div .btn-cart:active,
.mega-menu-campaign .slick-pr-item .item-inner .actions-div .btn-cart.active,
.mega-menu-campaign .slick-pr-item .item-inner .actions-div .btn-cart:focus{ background-color: var(--color-main); color: vaR(--color-white); }
.mega-menu-campaign .slick-pr-item .item-inner .actions-div .price-side{ margin-bottom: -4px; }
.mega-menu-campaign .slick-pr-item .item-inner .actions-div .price-side span{ display: block; }
.mega-menu-campaign .slick-pr-item .item-inner .actions-div .price-side span.discount{ font-size: var(--base-font-size-12); color: var(--color-main-81); text-decoration: line-through; font-weight: normal; }
.mega-menu-campaign .slick-pr-item .item-inner .actions-div .price-side span.price{ font-size: var(--base-font-size-14); color: var(--color-main); }
.mega-menu-campaign .slick-pr-item .pr-act-list{ animation: 0.5s slideLeft; z-index: 2; display: none; position: absolute; right: 10px; top: 10px; width: 34px; }
.mega-menu-campaign .slick-pr-item .pr-act-list .act-btn{ font-size: 18px; width: 34px; height: 34px; margin-bottom: 3px; display: flex; justify-content: center; align-items: center; border-radius: 50%; background: var(--color-bg-f2); color: var(--color-second); }
.mega-menu-campaign .slick-pr-item .pr-act-list .act-btn:hover,
.mega-menu-campaign .slick-pr-item .pr-act-list .act-btn:active,
.mega-menu-campaign .slick-pr-item .pr-act-list .act-btn.active,
.mega-menu-campaign .slick-pr-item .pr-act-list .act-btn:focus{ color: var(--color-white); background: var(--color-main); }
.mega-menu-campaign .slick-pr-item:hover .pr-act-list{ display: block; }
.mega-menu-campaign .slick-pr-item a.full-anchor{ z-index: 1;}
.mega-menu-campaign .text-side{ padding: 0 5px; margin-bottom: 10px; }
.mega-menu-campaign .promo-title{ padding: 10px 0; font-size: vaR(--base-font-size-16); position: relative; font-weight: 600; color: var(--color-second); border-bottom: 1px solid var(--color-main-border); }
.mega-menu-campaign .promo-title:after{ position: absolute; content: ""; bottom: 0; left: 0; width: 45px; border-bottom: 2px solid var(--color-main); }
.mega-menu-campaign .show-more-div{ padding: 0 5px; width: 100%; margin-top: 15px; }
.mega-menu-campaign .show-more-div .promo-text{ font-size: 20px; /*font-weight: 600;*/ }
.mega-menu-campaign .show-more-div .inner-div{ background-color: var(--color-bg-f2); border-radius: var(--bs-border-radius); padding: 15px; display: flex; justify-content: space-between; align-items: center; width: 100%; }
.mega-menu-campaign .show-more-div .btn-load-more{ border-color: var(--color-warning); color: var(--color-white); background-color: var(--color-warning); font-weight: 600; }


.sidebar-cart-div{ position: fixed; top: 0; bottom: 0; height: 100%; width: 400px; background-color: var(--color-white); opacity: 0; visibility: hidden; z-index: 0; transition: .2s ease-in-out; right: -200px; }
.sidebar-cart-div.active{ z-index: 200; opacity: 1; visibility: visible; transform: translate(-200px) }
.sidebar-cart-div .cart-inner{ display: block; width: 100%; height: 100%; }
.sidebar-cart-div .cart-inner .cart-header{ padding: var(--set-margin-bottom-15); background: var(--color-bg-f2); width: 100%; height: 80px; display: flex; justify-content: space-between; align-items: center;  }
.sidebar-cart-div .cart-inner .cart-header .cart-text{ position: relative;  }
.sidebar-cart-div .cart-inner .cart-header .cart-text i{ font-size: 36px; }
.sidebar-cart-div .cart-inner .cart-header .cart-text .badge{ position: absolute; top: 0; right: -10px; background-color: var(--bs-danger); }
.sidebar-cart-div .cart-inner .cart-header .cart-buttons{}
.sidebar-cart-div .cart-inner .cart-header .cart-buttons .btn-save-cart{ transition: all .3s ease; font-weight: 600; font-size: var(--base-font-size-14); color: var(--color-main); background-color: rgba(from var(--color-main) r g b / 0.2); border: 2px solid var(--color-main); }
.sidebar-cart-div .cart-inner .cart-header .cart-buttons .btn-save-cart:hover,
.sidebar-cart-div .cart-inner .cart-header .cart-buttons .btn-save-cart:active,
.sidebar-cart-div .cart-inner .cart-header .cart-buttons .btn-save-cart.active,
.sidebar-cart-div .cart-inner .cart-header .cart-buttons .btn-save-cart:focus{ background-color: var(--color-main); color: var(--color-white); }

.sidebar-cart-div .cart-inner .cart-header .cart-buttons .btn-close-cart{ transition: all .3s ease; display: inline-flex; justify-content: center; align-items: center; padding: 0; width: 37px; height: 37px;  font-size: 24px; border-color: var(--color-second); color: var(--color-white); background-color: var(--color-second); }
.sidebar-cart-div .cart-inner .cart-header .cart-buttons .btn-close-cart:hover,
.sidebar-cart-div .cart-inner .cart-header .cart-buttons .btn-close-cart:active,
.sidebar-cart-div .cart-inner .cart-header .cart-buttons .btn-close-cart.active,
.sidebar-cart-div .cart-inner .cart-header .cart-buttons .btn-close-cart:focus{ background-color: var(--bs-danger); color: var(--color-white); border-color: var(--bs-danger) }

.sidebar-cart-div .cart-inner .cart-content{ padding: var(--set-margin-bottom-15); width: 100%; display: block; height: calc(100% - 204px); overflow-x: auto; }
.sidebar-cart-div .cart-content .cart-item-div{ margin-bottom: 7px; position: relative; width: 100%; background-color: var(--color-bg-f2); border: 2px solid var(--color-main-border); border-radius: var(--bs-border-radius) }
.sidebar-cart-div .cart-content .cart-item-div .item-inner{ align-items: center; display: flex; justify-content: space-between; }
.sidebar-cart-div .cart-content .cart-item-div .promo-badge{ position: absolute; top: 10px; left: 10px; background-color: var(--bs-success); color: var(--color-white); padding: 0 5px; font-size: var(--base-font-size-12); z-index: 2; border-radius: var(--bs-border-radius);  }
.sidebar-cart-div .cart-content .cart-item-div .img-side{ padding: 5px; flex: 0 0 80px; border-radius: var(--bs-border-radius);  }
.sidebar-cart-div .cart-content .cart-item-div .text-side{ padding: 5px; width: calc(100% - 80px);}
.sidebar-cart-div .cart-content .cart-item-div .pr-img{ background-size: cover; background-position: center center; background-repeat: no-repeat; width: 100%; position: relative; display: block; height: 60px; border-radius: var(--bs-border-radius); }
.sidebar-cart-div .cart-content .cart-item-div .pr-name{ margin-bottom: 5px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: var(--base-font-size-12); font-weight: 600; width: 100%; }
.sidebar-cart-div .cart-content .cart-item-div .actions-div{ font-size: var(--base-font-size-12); font-weight: 600; width: 100%; display: flex; justify-content: space-between; align-items: end; }
.sidebar-cart-div .cart-content .cart-item-div .actions-div .form-control{ width: 40px; height: 24px; font-size: var(--base-font-size-14); text-align: center; }
.sidebar-cart-div .cart-content .cart-item-div .actions-div .btn-sm{ position: relative; z-index: 2; width: 28px; height: 24px; display: inline-flex; justify-content: center; align-items: center; font-size: 14px;  background-color: var(--color-main); border-color: var(--color-main); color: var(--color-white)}
.sidebar-cart-div .cart-content .cart-item-div .actions-div .btn-cart{ position: relative; z-index: 2; width: 24px; height: 24px; display: inline-flex; justify-content: center; align-items: center; font-size: 14px;  background-color: var(--color-second); border-color: var(--color-second); color: var(--color-white)}
.sidebar-cart-div .cart-content .cart-item-div .actions-div .btn-cart:hover,
.sidebar-cart-div .cart-content .cart-item-div .actions-div .btn-cart:active,
.sidebar-cart-div .cart-content .cart-item-div .actions-div .btn-cart.active,
.sidebar-cart-div .cart-content .cart-item-div .actions-div .btn-cart:focus{ background-color: var(--color-main); color: vaR(--color-white); }
.sidebar-cart-div .cart-content .cart-item-div .actions-div .price-side{ margin-bottom: -4px; }
.sidebar-cart-div .cart-content .cart-item-div .actions-div .price-side span{ }
.sidebar-cart-div .cart-content .cart-item-div .actions-div .price-side span.discount{ font-size: var(--base-font-size-12); color: var(--color-main-81); text-decoration: line-through; font-weight: normal; }
.sidebar-cart-div .cart-content .cart-item-div .actions-div .price-side span.price{ font-size: var(--base-font-size-14); color: var(--color-main); }
.sidebar-cart-div .cart-content .cart-item-div .btn-delete-item{ transition: all .3s ease; display: none; position: absolute; top: -7px; right: -7px; width: 20px; height: 20px; border-radius: 50%; color: var(--color-white); background-color: var(--bs-danger); font-size: 12px; justify-content: center; align-items: center; }
.sidebar-cart-div .cart-content .cart-item-div:hover .btn-delete-item{ display: flex; }

.sidebar-cart-div .cart-inner .cart-footer{ padding: var(--set-margin-bottom-15); width: 100%; height: 124px; background-color: var(--color-bg-f2); display: block; position: relative; }
.sidebar-cart-div .cart-inner .cart-footer .sub-total{ border: 2px solid var(--color-main-border); font-weight: 600; padding: 10px 15px; display: flex; justify-content: space-between; align-items: center; border-radius: var(--bs-border-radius); background-color: var(--color-white); width: 100%; }
.sidebar-cart-div .cart-inner .cart-footer .sub-total .text-side{ width: 50%; border-right: 2px solid var(--color-main-border); color: var(--color-main-6e)}
.sidebar-cart-div .cart-inner .cart-footer .sub-total .price-side{ color: var(--color-main)}
.sidebar-cart-div .cart-inner .cart-footer .sub-buttons{ padding: 10px 0 0; display: flex; justify-content: space-between; align-items: center; width: 100%; }
.sidebar-cart-div .cart-footer .btn{ font-size: var(--base-font-size-14); transition: all .3s ease; font-weight: 600; width: calc(50% - 5px); }
.sidebar-cart-div .cart-footer .btn.btn-give-offer{ border: 2px solid var(--color-warning); color: var(--color-warning); background-color:  rgba(from var(--color-warning) r g b / 0.2); }
.sidebar-cart-div .cart-footer .btn.btn-give-offer:hover,
.sidebar-cart-div .cart-footer .btn.btn-give-offer:active,
.sidebar-cart-div .cart-footer .btn.btn-give-offer.active,
.sidebar-cart-div .cart-footer .btn.btn-give-offer:focus{ color: var(--color-white); background-color: var(--color-warning); }
.sidebar-cart-div .cart-footer .btn.btn-checkout{ border: 2px solid var(--color-main); color: var(--color-white); background-color: var(--color-main) }

.quick-links{ top: 50%; transform: translateY(-50%); right: 8px; position: fixed; z-index: 3; width: 40px; height: auto; }
.quick-links .quick-1500{ display: none; }
.quick-links .links-inner{ padding: 15px 0; border-radius: 18px; box-shadow: var(--box-shadow-global); background-color: var(--color-white) }
.quick-links .links-inner .quick-item{ position: relative; }
.quick-links .links-inner .quick-item + .quick-item{ margin-top: 5px; }
.quick-links .quick-1500 i,
.quick-links .links-inner .quick-item i{ color: var(--color-second); position: relative; background-color: var(--color-white); z-index: 11; width: 100%; height: 36px; display: flex; justify-content: center; align-items: center; font-size: 26px; }
.quick-links .links-inner .hidden-menu{ box-shadow: var(--box-shadow-global); z-index: 10; border-radius: 15px 0 0 15px; position: absolute; right: 100%; padding: 8px 15px; font-weight: 600; top: 0; background-color: var(--color-white);  animation: 0.5s slideLeft;  display: none; }
.quick-links .links-inner .hidden-menu span{ white-space: nowrap; }
.quick-links .quick-1500 a,
.quick-links .links-inner .quick-item a{ z-index: 12; color: var(--color-second);  }
.quick-links .links-inner .quick-item.active .hidden-menu{ display: block; }


.breadcrumb-item a{ color: var(--color-second) }
.breadcrumb-item a:active,
.breadcrumb-item a:focus,
.breadcrumb-item a:hover{ color: var(--color-main) }
.breadcrumb-item+.breadcrumb-item::before{ content: '\ea61'; font-family: var(--font-family-tabler)}

.footer{ background-image: url('../images/footer-bg.png'); background-repeat: no-repeat; background-position: center center; background-size: contain; padding-top: 5em; padding-bottom: 5em; background-color: var(--footer-bg); color: var(--color-white); }
.footer .img-link{ display: block; margin-bottom: 15px; }
.footer .img-link img{ max-width: 205px;}
.footer .footer-social .inner{ padding: 0; max-width: 205px; display: flex; justify-content: space-between; }
.footer .footer-social .inner a.social-item{ font-size: 20px; color: var(--color-white); padding: 15px calc(var(--bs-gutter-x) * .5); }
.footer .footer-social .inner a.social-item:hover,
.footer .footer-social .inner a.social-item:active,
.footer .footer-social .inner a.social-item:focus{ color: var(--color-main)}
.footer .footer-list .list-header{ font-weight: 600; font-size: var(--base-font-size-16); margin-bottom: var(--set-margin-bottom-15) }
.footer .footer-list .list-item{ list-style: none; padding: 10px 0; font-size: var(--base-font-size-14)  }
.footer .footer-list .list-item a{ color: var(--color-main-c3)}
.footer .footer-list .list-item a i{ min-width: 18px; display: inline-block; }
.footer .footer-list .list-item a:hover,
.footer .footer-list .list-item a:active,
.footer .footer-list .list-item a:focus{ color: var(--color-white)}
.footer .footer-list .list-item a:hover i,
.footer .footer-list .list-item a:active i,
.footer .footer-list .list-item a:focus i{ color: var(--color-main)}
.footer-sub-links{ background-color: var(--color-main-22); padding: 3em 0;  }
.footer-sub-links .list-header{ color: var(--color-white); font-weight: 600; font-size: var(--base-font-size-16); margin-bottom: 10px; }
.footer-sub-links .list-item{ list-style: none; padding: 10px 0; font-size: var(--base-font-size-14)  }
.footer-sub-links .list-item a{ color: var(--color-main-c3)}
.footer-sub-links .list-item a:hover,
.footer-sub-links .list-item a:active,
.footer-sub-links .list-item a:focus{ color: var(--color-white)}
.footer-sub-links .list-item a i{ min-width: 18px; display: inline-block; }
.footer-end .copyright-text{ color: var(--color-main-81); margin: 0; padding: calc(var(--bs-gutter-x) * .5) 0; }
.footer-end .payment-types-list{ display: flex; height: 100%; justify-content: end; align-items: center; }
.footer-end .payment-types-list .payment-type-item{ margin-left: 25px; position: relative; width: 47px; height: auto; }
.footer-end .payment-types-list .payment-type-item img{ width: 100%; height: auto; }

/* 2- Single Page Content */
.single-page-content{ /*margin-top: var(--set-margin-bottom);*/ margin-bottom: 20px;}
.single-page-content .left-side{ width: 270px;}
.single-page-content .left-side .sidebar{ border-radius: var(--bs-border-radius); border: 1px solid var(--bs-border-color); }
.single-page-content .left-side .sidebar li{ padding: 0 15px;}
.single-page-content .left-side .sidebar li:first-child{ padding-top: 15px;}
.single-page-content .left-side .sidebar li:last-child{ padding-bottom: 15px;}
.single-page-content .left-side .sidebar li a{ color: var(--color-second); position: relative; display: flex; align-items: center; padding: 10px; font-size: var(--base-font-size-16) }
.single-page-content .left-side .sidebar li a:hover,
.single-page-content .left-side .sidebar li a:active,
.single-page-content .left-side .sidebar li a.active,
.single-page-content .left-side .sidebar li a:focus{ color: var(--color-main)}
.single-page-content .left-side .sidebar li a i{ position: relative; top:-2px; font-size: 20px; margin-right: 10px; }
.single-page-content .right-side{ margin-left: 30px; width: calc(100% - 300px); overflow: hidden; }
.single-page-content .left-side .sidebar li a.active:before{ content: ""; position: absolute; top: calc(50% - 11px); left: -5px; width: 7px; height: 16px; border-radius: 0 50% 50% 0; background: var(--color-main); }
.single-page-content .right-side .content-wrapper{ width: 100%; /*padding: 3em; border: 1px solid var(--color-main-border);*/ border-radius: var(--bs-border-radius);}
.single-page-content .right-side .title-wrapper{ border-radius: var(--bs-border-radius); padding: 15px; display: flex; justify-content: space-between; align-items: center; background-color: var(--color-bg-f2); }
.single-page-content .right-side .title-wrapper h5{ font-weight: 600; }
.single-page-content .right-side .title-wrapper p{ color: var(--color-main-81); margin-bottom: 0; }
.single-page-content .right-side .col-lg-6>label{ font-weight: 600; }
.pagination .page-item a{ color: var(--color-second); background-color: var(--color-bg-f2); }
.pagination .page-item:active a,
.pagination .page-item:focus a,
.pagination .page-item.active a,
.pagination .page-item:hover a{ border-color: var(--color-main); background-color: var(--color-main); color: var(--color-white)}
.table td.td-fit,
.table th.td-fit { white-space: nowrap; width: 1%; }
.table.table-center th,
.table.table-center td { vertical-align: middle }
.divider-title{ font-weight: 600; margin: 20px 0 15px;}
.el-md{ margin-bottom: 10px; }
.el-md .form-switch { }
.el-md .form-switch .form-check-input { margin-top: 0;  height: 1.5rem; width: calc(2rem + 0.75rem); border-radius: 3rem;}
.el-md .form-switch label{ font-weight: 600; height: 24px; padding-left: 5px; display: inline-flex; justify-content: center; align-items: center; }
.el-md .form-check-input:checked{ background-color: var(--color-main); border-color: var(--color-main) }


.btn-compare-products-wrapper{ position: fixed; z-index: 9; bottom: 30px; left: 30px; display: block; }
.btn-compare-products-wrapper .btn{ transition: all .3s ease; border-color: var(--color-main); background-color: var(--color-main); color: var(--color-white); font-weight: 600; }
.products-compare-wrapper{ display: none; transition: all .3s ease; box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 40%); position: fixed; width: 100%; height: 250px; background-color: var(--color-bg-f2); bottom: 0; left: 0; z-index: 10;  }
.products-compare-wrapper.show-it{ animation: 0.3s slideUp; display: block; }
.products-compare-wrapper h5{ font-weight: 600; }
.products-compare-wrapper .compare-list{  margin-bottom: 15px; background-color: var(--color-white); border-radius: var(--bs-border-radius); width: 100%; height: auto; display: flex; flex-wrap: nowrap; }
.products-compare-wrapper .compare-list .compare-item{ flex: 0 0 auto; width: 25%; }
.products-compare-wrapper .compare-list .compare-item+.compare-item .inner-el{ border-left: 2px solid var(--color-bg-f2); }
.products-compare-wrapper .compare-list .compare-item .inner-el{ width: 100%; height: 120px; display: flex; justify-content: space-between; align-items: center; }
.products-compare-wrapper .compare-list .compare-item .inner-el.no-item{ text-align: center; justify-content: center }
.products-compare-wrapper .compare-list .compare-item .inner-el.no-item span{ max-width: 60%; color: var(--color-main-6e) }
.products-compare-wrapper .compare-list .compare-item .inner-el .pr-image{ flex: 0 0 auto; width: 95px; height: 95px; background-origin: content-box; padding: 5px;  background-size: contain; background-position: center center; background-repeat: no-repeat;}
.products-compare-wrapper .compare-list .compare-item .inner-el .pr-text{ flex: 0 0 auto; width: calc(100% - 155px) }
.products-compare-wrapper .compare-list .compare-item .inner-el .pr-text .pr-name{ width: 100%; font-size: var(--base-font-size-14); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.products-compare-wrapper .compare-list .compare-item .inner-el .pr-text .pr-name a{ color: var(--color-main-6e)}
.products-compare-wrapper .compare-list .compare-item .inner-el .pr-text .pr-price{ font-weight: 600; color: var(--color-main) }
.products-compare-wrapper .compare-list .compare-item .inner-el .pr-btn{ flex: 0 0 auto; width: 60px; text-align: right; padding-right: 10px; }
.products-compare-wrapper .compare-list .compare-item .inner-el .pr-btn a{ transition: all .3s ease; border-radius: 50%; width: 30px; height: 30px; display: inline-flex; justify-content: center; align-items: center; background-color: var(--color-red); color: var(--color-white); }
.products-compare-wrapper .compare-list .compare-item .inner-el .pr-btn a:hover,
.products-compare-wrapper .compare-list .compare-item .inner-el .pr-btn a:active,
.products-compare-wrapper .compare-list .compare-item .inner-el .pr-btn a.active,
.products-compare-wrapper .compare-list .compare-item .inner-el .pr-btn a:focus{ background-color: var(--color-second) }

.products-compare-wrapper .actions-side{ display: flex; justify-content: end; align-items: center; }
.products-compare-wrapper .actions-side .btn{ transition: all .3s ease; margin-left: 7px; font-size: var(--base-font-size-13); font-weight: 600; }
.products-compare-wrapper .actions-side .btn-hide{ background-color: var(--color-main-border); border-color: var(--color-main-border); color: vaR(--color-second); }
.products-compare-wrapper .actions-side .btn-hide:active,
.products-compare-wrapper .actions-side .btn-hide.active,
.products-compare-wrapper .actions-side .btn-hide:focus,
.products-compare-wrapper .actions-side .btn-hide:hover{ background-color: var(--color-second); border-color: var(--color-second); color: vaR(--color-white); }
.products-compare-wrapper .actions-side .btn-compare-them{ background-color: var(--color-main-blue); border-color: var(--color-main-blue); color: vaR(--color-white); }
.products-compare-wrapper .actions-side .btn-compare-them:hover,
.products-compare-wrapper .actions-side .btn-compare-them:active,
.products-compare-wrapper .actions-side .btn-compare-them.active,
.products-compare-wrapper .actions-side .btn-compare-them:focus{ background-color: var(--color-main); border-color: var(--color-main); color: vaR(--color-white); }
#changeCurrency .modal-body{}
#changeCurrency .modal-body .currency-modal-list{ display: flex; justify-content: space-between; align-items: center; }
#changeCurrency .modal-body .currency-modal-list .currency-el-content{ position: relative;  width: 30%;  }
#changeCurrency .modal-body .currency-modal-list .currency-el-content .placeholder{ position: relative; border-radius: var(--bs-border-radius); height: 80px; }
#changeCurrency .modal-body .currency-modal-list .currency-el-content a{ position: relative; display: flex; background-color: var(--color-bg-f2);  border-radius: var(--bs-border-radius); justify-content: center; font-weight: 600; color: var(--color-second); align-items: center; width: 100%;  height: 80px; font-size: var(--base-font-size-24) }
#changeCurrency .modal-body .currency-modal-list .currency-el-content a:hover{ background-color: var(--color-second); color: var(--color-white) }


@keyframes slideLeft {
    from {
        transform: translateX(10%);
    }

    to {
        transform: translateX(0);
    }
}

@keyframes slideUp {
    from {
        transform: translateY(10%);
    }

    to {
        transform: translateY(0);
    }
}

@keyframes slideDown {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: translateY(0);
    }
}


.scroll-bar::-webkit-scrollbar {
    width: 7px;
}

.scroll-bar::-webkit-scrollbar-thumb {
    border: 2px solid rgba(0, 0, 0, 0);
    background-clip: padding-box;
    border-radius: 7px;
    background-color: rgba(0, 0, 0, 0.1);
}

.scroll-bar::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.04);
    border-radius: 8px;
}

.show-on-1200{ display: none!important; }
.sticky-sub-bar,
.mobile-menu-slide-btn,
.mobile-menu-wrapper{ display: none; }


.table thead th{ color: #6b7280; background: var(--color-bg-f2); font-size: var(--base-font-size-13); font-weight: normal; text-transform: uppercase; line-height: 1rem; padding-top: .5rem; padding-bottom: .5rem; white-space: nowrap;}
.table.no-border tr td{ border: none; height: 40px; vertical-align: middle; }
.table.no-border tr td .text-side{ display: flex; justify-content: space-between; align-items: center; font-weight: 600; }
.table.mb-0>tbody>tr:nth-of-type(even)>*{ background-color: var(--color-bg-f2); }

.uc-modal .modal-header{ display: none; }
.uc-modal-content{}
.uc-modal-content .uc-inner{ max-width: 700px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; }
.uc-modal-content .uc-inner .text-side{ flex: 0 0 50%; }
.uc-modal-content .uc-inner .image-side{ flex: 0 0 50%; }
.uc-modal-content .uc-inner .image-side img{ position: relative; width: 100%; }
.uc-modal-content .uc-inner .text-side .title-text{ display: flex; justify-content: space-between; padding: 12px 0; font-size: var(--base-font-size-24); position: relative; font-weight: 600; color: var(--color-second); margin-bottom: 30px;}
.uc-modal-content .uc-inner .text-side .title-text:after{ position: absolute; content: ""; bottom: 0; left: 0; width: 45px; border-bottom: 2px solid var(--color-main); }
.uc-modal-content .uc-inner .text-side .description-text{ font-size: var(--base-font-size-16); color: var(--color-main-81); margin: 5px 0;}
.uc-modal-content .uc-inner .text-side .btn{ margin-top: 30px;}

.no-item-content .no-item-inner{ max-width: 100%; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; }
.no-item-content .no-item-inner .text-side{ flex: 0 0 40%; }
.no-item-content .no-item-inner .image-side{ flex: 0 0 60%; text-align: center; }
.no-item-content .no-item-inner .image-side img{ position: relative; width: 100%; max-width: 600px; }
.no-item-content .no-item-inner .text-side .title-text{ display: flex; justify-content: space-between; padding: 12px 0; font-size: var(--base-font-size-24); position: relative; font-weight: 600; color: var(--color-second); margin-bottom: 30px;}
.no-item-content .no-item-inner .text-side .title-text:after{ position: absolute; content: ""; bottom: 0; left: 0; width: 45px; border-bottom: 2px solid var(--color-main); }
.no-item-content .no-item-inner .text-side .description-text{ font-size: var(--base-font-size-16); color: var(--color-main-81); margin: 5px 0;}
.no-item-content .no-item-inner .text-side .btn{ margin-top: 30px;}

.progress-wrap{ text-align: center; margin-bottom: 15px; }
.progress-wrap label{ font-size: var(--base-font-size-12); color: var(--color-main-81); }
.progress-wrap .progress{ margin-top: 10px; height: 10px; }
.progress-wrap .progress .progress-bar{ background-color: #656565; }

.wz-overlay{ display: none;}
body.wizard-init .wz-overlay { display: block; position: fixed; inset: 0; background: rgba(0, 0, 0, 0.6); z-index: 9990; }
.highlight-outline { background-color: rgba(255,255,255,1); position: fixed; border: 3px solid var(--color-bg-f2); border-radius: 8px; box-shadow: 0 0 20px var(--color-bg-f2); z-index: 9991; pointer-events: none;}
.highlight-box { position: fixed; background: white; border-radius: 8px; box-shadow: 0 0 10px rgba(0,0,0,0.5); padding: 15px; max-width: 350px; z-index: 9992; color: black;}
.wizard-controls { margin-top: 10px; text-align: right; }
.wizard-controls button { margin-left: 5px; }

/* step wizard */
.wizard-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; display: none;}
.wizard-overlay.active { display: block; }
.wizard-overlay .spotlight { position: absolute; background: rgba(255, 255, 255, 0.1); border: 3px solid #667eea; border-radius: 10px; box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.8); transition: all 0.5s ease; z-index: 1001; }
.wizard-overlay .wizard-tooltip { position: absolute; background: white; padding: 20px; border-radius: 15px; box-shadow: 0 10px 30px rgba(0,0,0,0.3); max-width: 350px; z-index: 1002; opacity: 0; transform: translateY(10px); transition: all 0.3s ease; }
.wizard-overlay .wizard-tooltip.show { opacity: 1; transform: translateY(0); }
.wizard-overlay .tooltip-title { font-size: 18px; font-weight: bold; color: #333; margin-bottom: 10px; }
.wizard-overlay .tooltip-description { color: #666; line-height: 1.6; margin-bottom: 20px; }
.wizard-overlay .tooltip-actions { display: flex; justify-content: space-between; align-items: center; }
.wizard-overlay .wizard-progress { display: flex; gap: 5px; }
.wizard-overlay .progress-dot { width: 8px; height: 8px; border-radius: 50%; background: #e0e0e0; transition: background 0.3s ease; }
.wizard-overlay .progress-dot.active { background: #667eea; }
.wizard-overlay .wizard-nav { display: flex; gap: 10px; }
.wizard-overlay .wizard-btn { padding: 8px 20px; border: none; border-radius: 20px; cursor: pointer; font-size: 14px; transition: all 0.3s ease; }
.wizard-overlay .wizard-btn-primary { background: #667eea; color: white; }
.wizard-overlay .wizard-btn-primary:hover { background: #5a6fd8; }
.wizard-overlay .wizard-btn-secondary { background: #f8f9fa; color: #666; }
.wizard-overlay .wizard-btn-secondary:hover { background: #e9ecef; }
.wizard-overlay .wizard-btn:disabled { opacity: 0.5; cursor: not-allowed; }
@keyframes pulseWizard {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

.highlight-pulse {
    animation: pulseWizard 2s infinite;
}

/* Media Queries */
@media screen and (min-width: 1920px) {
    .container-fluid { max-width: 1770px; --bs-gutter-x: 30px; }
}
@media screen and (min-width: 2200px) {
    .container-fluid { max-width: 1920px;  }
}
@media screen and (max-width: 1920px) {
    .container-fluid { max-width:100%; --bs-gutter-x: 8% }
}

@media screen and (max-width: 1500px) {
    .container-fluid { --bs-gutter-x: 3.6% }
    .top-links.right-side{ max-width: 55%; flex: 1 0 auto; }
    .quick-links .quick-1500{ display: block; }
    .quick-links .quick-item{ display: none; }
    .quick-links.open-all{ }
    .quick-links .ti-adjustments-down{ display: flex!important; }
    .quick-links .ti-adjustments-up{ display: none!important; }
    .quick-links.open-all .ti-adjustments-down{ display: none!important; }
    .quick-links.open-all .ti-adjustments-up{ display: flex!important; }
    .quick-links.open-all .quick-item{ display: block; }
    /*.quick-links.open-all .links-inner .quick-item .hidden-menu{ right: auto; left: auto; position: relative; display: block; }*/
    /*.quick-links.open-all .links-inner .quick-item a{ display: flex; }*/
    /*.quick-links.open-all .links-inner .quick-item a i{ flex: 1 0 0; width: auto; min-width: 36px; justify-content: end;}*/
    /*.quick-links.open-all .links-inner .quick-item a .hidden-menu{ flex: 1 0 0; width: auto; box-shadow: none; min-width: 150px}*/
}

@media screen and (min-width: 990px) {
    .footer .footer-cols{ width: 21%; max-width: 21% }
    .footer .footer-cols:first-child{ width: 37%; max-width: 37%;  }
    .uc-modal .modal-dialog{ max-width: 900px; }
}

@media screen and (max-width: 1200px) {
    .head-side{ transition: transform 0.3s ease; }
    /*.head-side.mobile-sticky{  position: sticky; top: 0; z-index: 999; transform: translateY(0);}*/
    .head-side.mobile-sticky {animation: slideDown 0.35s ease-out; position: fixed; top: 0; left: 0; background-color: var(--color-white); z-index: 99; box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 40%); }
    .head-side.mobile-sticky .top-bar{ display: none!important;}
    .top-bar .top-links{ flex: 1 0 100%; }
    .top-bar .top-links .list-group{ justify-content: space-between!important;}
    .sub-header-container .mega-menu-manufacturers ul{ width: 10%}
    .hide-on-1200{ display: none!important; }
    .show-on-1200{ display: block!important; }
    .main-navbar{ flex-direction: column }
    .main-header .logo-side{ align-items: center; width: 100%; max-width: 100%; display: flex; justify-content: space-between; }
    .main-header .logo-side a.main-logo{ padding: 8px 0; }
    .main-header .logo-side a.main-logo img{ max-width: 120px;}
    .main-header .logo-side .dropdown-toggle{ cursor: pointer; display: block; padding: 5px 0 5px 5px; }
    .main-header .logo-side .dropdown-toggle::after{ display: none; }
    .main-header .logo-side .mega-drdown.dropdown-menu{ width: 360px; padding: 0; }
    .main-header .logo-side .mega-drdown.dropdown-menu .mega-inner:after{ right: 10px;}
    .main-header .logo-side .mega-drdown.dropdown-menu ul{ display: flex; flex-wrap: wrap; width: 100%; margin-bottom: 0; }
    .main-header .logo-side .mega-drdown.dropdown-menu ul li{ flex: 1 0 auto; width: 50%; padding: 5px;}
    .main-header .logo-side .mega-drdown.dropdown-menu ul li a{ flex-direction: column; position: relative; padding: 4px 0;  color: var(--color-second); height: 100px; background-color: var(--color-bg-f2); border: 1px solid var(--color-main-border); border-radius: var(--bs-border-radius); display: flex; justify-content: center; align-items: center;  }
    .main-header .logo-side .mega-drdown.dropdown-menu ul li a:hover,
    .main-header .logo-side .mega-drdown.dropdown-menu ul li a:active,
    .main-header .logo-side .mega-drdown.dropdown-menu ul li a.active{ background-color: var(--color-bg-f2) }
    .main-header .logo-side .mega-drdown.dropdown-menu ul li a i{ color: var(--color-main); font-size: var(--base-font-size-22); position: relative; top: 0; margin-bottom: 5px; }
    .head-side .top-bar .list-group .list-group-item+.list-group-item label.no-click.has-border:before{ display: none; }
    .head-side .top-bar .left-side .list-group:nth-child(1) .list-group-item a{ padding-left: 0; }
    .head-side .top-bar .list-group .list-group-item+.list-group-item label.no-click{ padding-right: 0;}
    .main-header .search-side{ margin-bottom: 10px; }
    .main-header .search-side,
    .main-header .search-side .input-group-wrapper{ padding: 0; }
    .mobile-menu-wrapper.show-it{ overflow: hidden; top: 0; left: 0; display: flex; justify-content: center; align-items: center; background: rgba(0,0,0,0.55); position: fixed; z-index: 100; width: 100%; height: 100%; }
    .mobile-menu-wrapper .inner-div{ overflow: hidden; border-radius: var(--bs-border-radius); background: var(--color-bg-f2); width: 100%; height: auto; max-width: 480px; max-height: 80%; }
    .mobile-menu-wrapper .dr-menu{ display: none; }
    .mobile-menu-wrapper .mobile-menu-top{ position: relative; padding: 15px; width: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; }
    .mobile-menu-wrapper .mobile-menu-top .main-logo img{ position: relative; display: block; max-width: 120px; }
    .mobile-menu-wrapper .exit-button{ position: absolute; top: 0; right: 0; width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; }
    .mobile-menu-wrapper .exit-button i{ color: var(--color-main); font-size: var(--base-font-size-24)}
    .mobile-menu-wrapper .menu-list-content{ padding: 0; list-style: none; position: relative; height: calc(100% - 92px);  overflow: hidden; }
    .mobile-menu-wrapper .menu-list-content ul{ overflow-y: auto; list-style: none; height: 100%; margin-bottom: 0; width: 100%; padding: 10px 0;}
    .mobile-menu-wrapper .menu-list-content ul li{ padding: 0 10px; width: 100%}
    .mobile-menu-wrapper .menu-list-content ul li a{ color: var(--color-second); display: block; position: relative; padding: 7px 10px; width: 100%}
    .mobile-menu-wrapper .menu-list-content ul li.static-links a{ font-weight: 600; }
    .mobile-menu-wrapper .menu-list-content ul li.has-child>a:after{ color: var(--color-main); font-size: var(--base-font-size-16); content: '\ea61'; position: absolute; font-family: var(--font-family-tabler); top: 0; right: 0; width: 20px; height: 100%; display: flex; justify-content: center; align-items: center; }
    .mobile-menu-wrapper .menu-list-content ul li+li a{ border-top: 1px solid var(--color-main-border); }
    .mobile-menu-wrapper .menu-list-content ul li a i{ min-width: 20px; display: inline-block; }
    .mobile-menu-wrapper .dr-menu.show-el{ overflow-y: auto; position: absolute; display: block; z-index: 2; width: 100%; height: 100%; background: var(--color-bg-f2); top: 0; left: 0; }
    .mobile-menu-wrapper .dr-menu.show-el.opened{ overflow: hidden;}
    .mobile-menu-wrapper .menu-list-content span.placeholder{ min-height: 24px; margin-bottom: 7px;}
    .mobile-menu-wrapper .dr-menu .menu-link-element{ display: flex; justify-content: space-between; align-items: center; }
    .mobile-menu-wrapper .dr-menu .menu-link-element a{ border-top: 0; display: inline-block; width: auto; color: var(--color-main); font-weight: 600; padding: 7px 0; }
    .mobile-menu-wrapper .dr-menu .menu-link-element a:after{ display: none!important;}
    .main-header .mobile-buttons-side{ width: 100%; min-width: 155px; display: flex; align-items: center; justify-content: space-between; }
    .main-header .mobile-menu-button,
    .main-header .mobile-buttons-side a{ color: var(--color-second); position: relative; display: inline-flex; }
    .main-header .mobile-buttons-side a .badge{ background-color: var(--color-main); color: var(--color-white); position: absolute; right: -5px; top: 0; }
    .main-header .mobile-buttons-side a+a{ margin-left: 15px; }
    .main-header .mobile-menu-button i,
    .main-header .mobile-buttons-side i{ font-size: 32px; position: relative; }
    .container-fluid .row{ --bs-gutter-x: 3.6%; }
    .mobile-overlay{ height: 100%; overflow: hidden; }
    .mobile-overlay .overlay-div{ z-index: 10;}
    .mobile-overlay .head-side{ z-index: 16; background-color: var(--color-white)}
    .single-page-content .right-side{ margin-left: 20px; width: calc(100% - 90px);}
    .single-page-content .left-side{ width: 70px; }
    .single-page-content .left-side .sidebar{ background-color: var(--color-white) }
    .single-page-content .left-side .sidebar li a span{ display: none;}
    .head-side.mobile-sticky .main-header .logo-side .mega-drdown.dropdown-menu{ transform: none!important; position: fixed!important; top: 55px!important; }
}

@media screen and (max-width: 990px) {
    .products-compare-wrapper.show-it{ display: none; }
    .single-page-content .right-side .title-wrapper{ flex-direction: column; justify-content: start; align-items: start; }
    .single-page-content .right-side .title-wrapper .btn-side{ margin-top: 10px; }
    .single-page-content .right-side .title-wrapper .btn-side .btn{ font-size: var(--base-font-size-14); margin-bottom: 5px;}
}

@media screen and (max-width: 780px){
    .uc-modal-content .uc-inner{ flex-direction: column; text-align: center; }
    .uc-modal-content .uc-inner .text-side .title-text{ justify-content: center; font-size: var(--base-font-size-24); margin-bottom: 15px;}
    .uc-modal-content .uc-inner .text-side .title-text:after{ left: calc(50% - 23px)}
    .uc-modal-content .uc-inner .text-side .description-text{ font-size: var(--base-font-size-14); }
    .uc-modal-content .uc-inner .text-side .btn{ margin-top: 15px;}
}

@media screen and (max-width: 660px) {
    body{ overflow-x: hidden; }
    .mobile-menu-wrapper .inner-div{ border-radius: 0; width: 100%; height: 100%; max-width: 100%; max-height: 100%;}
}


@media screen and (max-width: 577px) {
    .footer-sub-links{ padding: 3em 0 1em }
    .footer-sub-links .col-sm-4.col-xs-6{ width: 50%; max-width: 50%; margin-bottom: 20px;}
    .result-content .res-cats-wrapper{ display: none; }
    .search-result-wrapper .result-content .title-content{ cursor: pointer;  }
    .search-result-wrapper .result-content .title-content i{ display: inline-block; }
    .search-result-wrapper .res-product-el>.d-flex{ align-items: center;}
    .search-result-wrapper .res-product-el .d-flex.text-side{ flex-wrap: wrap; flex-direction: column; }
    .search-result-wrapper .res-product-el .product-side,
    .search-result-wrapper .res-product-el .buttons-side{ max-width: 100%; padding: 0 10px 5px ;}
    .single-page-content .left-side{ width: 270px; transition: all .5s ease; position: fixed; left: -270px; top: 145px; z-index: 17; }
    .single-page-content .right-side{ margin-left: 0; width: 100%; }
    .single-page-content .left-side .sidebar{ position: relative;  }
    .mobile-menu-slide-btn{ display: block; position: absolute; top: 0; left: 100%; width: 40px; height: 40px;}
    .mobile-menu-slide-btn a{ font-size: var(--base-font-size-24); display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; border-radius: 0 var(--bs-border-radius) var(--bs-border-radius) 0; background-color: var(--color-main); color: var(--color-white); }
    .single-page-content .left-side.mms-opened{ transform: translateX(278px); }
    .single-page-content .left-side .sidebar{ padding-top: 10px; }
    .single-page-content .left-side .sidebar li a{ padding: 5px 10px; }
    .single-page-content .left-side .sidebar li a span{ display: inline-block;}
    .main-header .logo-side .mega-drdown.dropdown-menu{ width: 100vw!important; padding: 0 5px; }
}


@media (max-width: 480px) {
    body{ height: auto; padding-bottom: calc(90px + env(safe-area-inset-bottom));}
    .main-header .mobile-buttons-side{ min-width: auto; width: auto;}
    .main-header .mobile-buttons-side .h-480,
    .quick-links{ display: none;}
    .sticky-sub-bar{ z-index: 99; position: fixed; display: flex; align-items: center; bottom: 0; lefT: 0; width: 100%; height: calc(60px + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom); border-top: 5px solid var(--color-main); box-shadow: 0 0 20px 0 rgb(0 0 0 / 40%); background: var(--color-bg-f2); }
    .sticky-sub-bar .sticky-links{ padding: 0 5px; position: relative; width: 100%; display: flex; justify-content: space-between; align-items: center;}
    .sticky-links .link-el{}
    .sticky-links .link-el .inner{ position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; }
    .sticky-links .link-el .inner .icon-side{ position: relative;}
    .sticky-links .link-el .inner i{ min-height: 28px; color: var(--color-main); font-size: var(--base-font-size-24); }
    .sticky-links .link-el .inner span:not(.badge){ color: var(--color-second); font-size: var(--base-font-size-12); }
    .sticky-links .link-el .inner span.badge{ color: var(--color-white); position: absolute; top: 0; right: -10px; background-color: var(--bs-danger); }
    .footer-end .copyright-text{ text-align: center; }
    .footer-end .payment-types-list{ justify-content: space-between; }
    .footer-end .payment-types-list .payment-type-item{ margin-left: 0;}
    .btn{ font-size: var(--base-font-size-14); }
}

@media screen and (max-width: 370px) {
    .sticky-links .link-el .inner span:not(.badge){ display: none }
}