/*------------- #MAIN STYLES --------------*/
/*------------------------------------------------------------------
-------------------------------------------------------------------*/
/*@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200;300;400;500;600;700&display=swap');*/

/*------------- #general --------------*/


body{

    position: relative;
    padding: 0;
    margin: 0;
    font-family: 'Cairo-Static' ,'Cairo', sans-serif;
    direction:rtl;
    text-align: right;
    scroll-behavior: smooth;
    overflow-x: hidden;
    color: #2D2D2D;
    background-color: #fff;

}

body[data-panel="noScroll"] {
    overflow-y: hidden;
}


*{box-sizing: border-box}

:root{


     --clr-1:#0083BE;
     --clr-1-hover:#03608b;
     --clr-2:#DAF3FF;
     --clr-2-hover:#c0d5df;

    --clrBlack:#000000;

     --title-1:40px;
     --title-2:32px;
     --title-3:28px;
     --title-4:24px;
     --title-5:22px;
     --title-6:20px;
     --title-7:18px;
     --title-8:18px;

     --border-r-1:25px;
     --border-r-2:12px;
     --border-r-3:10px;
     --border-r-4:5px;

     --section-padding:2.5rem;


     --box-py-sm:1.5rem;
     --box-py:2rem;
     --box-py-res:2rem;
     --box-py-almt:2.875rem;

     --box-px-sm: 1.5rem;
     --box-px: 2rem;
     --box-px-more:3rem ;

     --nav-h:0px;
     --toolbar-h:0px;

     --border-clr-1:rgba(78, 78, 78, 0.15);


}
a{
    color: #000000
}
a , a:hover{

    text-decoration: none;
    color: inherit;
}

.page-wrapper{

    min-height: calc((var(--vh, 1vh) * 100) - 1px);
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-top: var(--nav-h);
    padding-bottom:var(--toolbar-h);

}

.section-style{

    position: relative;
    padding: var(--section-padding) 0;
}
.bg-section{

    padding: var(--section-padding) 0;
}
.w-bg{

    margin: var(--section-padding) 0;
}

.scroll::-webkit-scrollbar {

   width: 3px;
   height: 3px;


}
.scroll::-webkit-scrollbar-track {

  background-color: rgba(0,0,0,0.1);
  border-radius: 20px;

}
.scroll::-webkit-scrollbar-thumb{

   background-color: rgba(0,0,0,0.15);
   border-radius: 20px;

}


.pb-alt{
    padding-bottom: var(--section-padding);
}
.pt-alt{
    padding-top: var(--section-padding);
}
.mb-alt{
    margin-bottom: var(--section-padding);
}
.mt-alt{
    margin-top: var(--section-padding);
}

/** titles **/

.bold{

    font-weight: bold;
}
.main-title{

    margin-bottom: var(--section-padding);
    text-align: start;
    position: relative;


}
.main-title .title{

    display: inline-block;
    margin-bottom: 0;
    font-size: var(--title-1);
    font-weight: bold;
}

.main-title.gray-clr{

    color: #474747;
}


.main-title.sub-title .title{

    font-size: var(--title-4);

}



/*** input-style  **/
.input-focus:focus{

    border-color: #66afe9 !important;
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%) !important;


}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button
{
  -webkit-appearance: none;
  margin: 0;
}
input[type="number"]
{
  -moz-appearance: textfield;
}
.form-group{

    position: relative;
}
.form-group .form-control,
.form-group .form-select{

    border-radius: var(--border-r-2);
    border-color: #E6E9EA;
    font-size: 16px;
    color: #383838;
    box-shadow: none;
    padding: .75rem;
    height: 55px;
    font-weight: 500;
}
.form-group .form-control::placeholder{
    color: #828A89;
    color:#A4ACAD;
}
.form-select{

    padding-left: 2rem !important;
    background-position: left .75rem center;
}
.form-check{

        position: relative;
        padding-left: 0em;
        padding-right: 1.5em;

}
.form-check .form-check-input{

        float: right;
        margin-left: 0em;
        margin-right: -1.5em;
        border-color: #E6E9EA;
        transition: all .3s ease;
        box-shadow: none;
        cursor: pointer;

}
.form-check .form-check-input:active{

    filter: brightness(100%)
}
.form-check .form-check-input:checked{

    background-color: var(--clr-1);
    border-color: var(--clr-1);
}
.form-group .password-field{

    position: relative;

}
.form-group .password-field .form-control{

    padding-left: 45px !important;
}
.form-group .password-field .eye-icon{

    position: absolute;
    left: .75rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    width:30px ;
    height:calc(100% - 2px) ;
    font-size: 30px;
    content: url(../img/eye-1.svg);
    transition: all .15s ease-in-out;
    background-size: cover;
    overflow: hidden;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.form-group .password-field .eye-icon.hide{

    content: url(../img/eye-2.svg);
}


/*** buttons-style  **/

button {
    border: none;
    background-color: transparent;
    outline: none;
    box-shadow: none;
    padding: 0;
}

.loading-overlay{

    position: relative;
    overflow: hidden;
    pointer-events: none;


}
.loading-overlay::before{

  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: #fff;
  opacity: 0.8;
  z-index: 100;

}
.loading-overlay::after{

  content: "";
  position: absolute;
  border: 2px solid transparent;
  border-radius: 32px;
  border-top: 2px solid var(--clr-1) !important;
  border-right: 2px solid rgb(0 131 190 / 40%) !important;
  border-bottom: 2px solid var(--clr-1) !important;
  border-left: 2px solid rgb(0 131 190 / 40%) !important;
  display: block;
  height: 20px;
  top: 50%;
  margin-top: -10px;
  left: 50%;
  margin-left: -10px;
  right: auto;
  width: 20px;
  animation: button-loading-spinner 1s ease infinite;
  z-index: 100;

}
@keyframes button-loading-spinner {
  from {
    transform: rotate(0turn);
  }

  to {
    transform: rotate(1turn);
  }
}

.main-btn{
    background-color: var(--clr-1) ;
    border:1px solid var(--clr-1) ;
    color: #fff ;
}
.main-btn:not(div):hover{
    background-color: var(--clr-1-hover) ;
    border-color: var(--clr-1-hover) ;
    color: #fff ;
}
.secondary-btn{
    background-color: var(--clr-2) ;
    border:1px solid var(--clr-2) ;
    color: var(--clr-1) ;
}
.secondary-btn:not(div):hover{
    background-color: var(--clr-2-hover) ;
    border-color: var(--clr-2-hover) ;
    color: var(--clr-1) ;
}
.sub-btn{
    background-color:#fff ;
    border:1px solid #E7E7E7 ;
    color: #4C4F50 ;
}
.sub-btn:not(div):hover{
    background-color:#eee ;
    color: #4C4F50 ;
}

.duplicated-btn{

    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 500;
    font-size: var(--title-7);
    border-radius: var(--border-r-2);
    padding: 1rem .75rem;
    transition: all .3s ease;
    gap:.5rem;
    max-height: 60px;
    width: 100%;
    box-shadow: none !important;
}


.show-more-wrap{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap:1rem;
}
.show-more-wrap .show-more{

    display:inline-flex;
    align-items: center;
    justify-content: center;
    min-width:300px ;
    margin: 0 auto 0;
    background-color: var(--clr-1);
    border: 1px solid var(--clr-1);
    color: #fff ;
    font-weight: 500;
    font-size: var(--title-7);
    border-radius: var(--border-r-2);
    padding: 1rem;
    transition: all .3s ease;
    text-align: center;
    gap:.75rem;
    max-height: 60px;
}
.show-more-wrap .show-more > span{

    display: block;
    vertical-align: middle;

}
.show-more-wrap .show-more .up-loader-inline{

    display: none;
}
.show-more-wrap .show-more img,
.show-more-wrap .show-more svg,
.show-more-wrap .show-more i{

    display: block;
    width: 18px;
    height: 18px;
    font-size: 18px;
    vertical-align: middle;


}
.show-more-wrap .show-more .up-loader-inline svg{

    fill:#fff;

}
.show-more-wrap .show-more.active{

    background-color: var(--clr-1);
    border-color: var(--clr-1);
    color: #fff;
    opacity: .5;
    pointer-events: none;
}
.show-more-wrap .show-more.show-more-loading.no-more{
    pointer-events: none;
}
.show-more-wrap .show-more.show-more-loading.no-more,
.show-more-wrap .show-more:not(.show-more-loading):hover{

    background-color: var(--clr-1-hover);
    border-color: var(--clr-1-hover);
    color: #fff;

}
@media(hover: hover) and (pointer: fine){

    .show-more-wrap .show-more:hover{

        background-color: var(--clr-1-hover);
        border-color: var(--clr-1-hover);
        color: #fff;

    }

}
.show-more-wrap .show-more.active .up-loader-inline{

    display: block;
}
.show-more-wrap .show-more .fa-spin{

    animation-duration:1s;
}


.hvr-underline-from-right {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  overflow: hidden;
}
.hvr-underline-from-right:before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 100%;
  right: 0;
  bottom: 0;
  background: var(--clr-1);
  height: 3px;
  -webkit-transition-property: left;
  transition-property: left;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-underline-from-right:hover:before, .hvr-underline-from-right:focus:before, .hvr-underline-from-right:active:before {
  left: 0;
}


.hover-btn{

    transition: all .3s ease !important;
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.hover-btn::after{

    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    transition: inherit;
    opacity: 0;
    border-radius: inherit;

}
.hover-btn.dark-hover::after{
    background: linear-gradient(
        to right,
        rgba(0,0,0, 0.23),
        rgba(0,0,0, 0.23)
    );
}
.hover-btn.light-hover::after{
    background: linear-gradient(
        to right,
        rgba(255,255,255, 0.4),
        rgba(255,255,255, 0.4)
    );
}
.hover-btn:hover::after{

    opacity: 1;
}


@media(max-width:575.98px){

    .show-more-wrap .show-more{
        min-width: 200px;
    }
}


/**** slider-swiper ***/

.slider-container {
    position: relative;
}
.swiper{

    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.swiper-button-lock.swiper-button-disabled,
.swiper-button-lock{
    display: none !important;
    opacity: 0;
}

/**** slider-slick ***/
.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}


@font-face
{
    font-family: 'slick';
    font-weight: normal;
    font-style: normal;

    src: url('./fonts/slick.eot');
    src: url('./fonts/slick.eot?#iefix') format('embedded-opentype'), url('./fonts/slick.woff') format('woff'), url('./fonts/slick.ttf') format('truetype'), url('./fonts/slick.svg#slick') format('svg');
}

.slick-prev,
.slick-next
{
    font-size: 0;
    line-height: 0;

    position: absolute;
    top: 50%;

    display: block;

    width: 20px;
    height: 20px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);

    cursor: pointer;

    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
    color: transparent;
    outline: none;
    background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
    opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
    opacity: .25;
}

.slick-prev:before,
.slick-next:before
{
    font-family: 'slick';
    font-size: 20px;
    line-height: 1;

    opacity: .75;
    color: white;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-prev
{
    left: -25px;
}
[dir='rtl'] .slick-prev
{
    right: -25px;
    left: auto;
}
.slick-prev:before
{
    content: '←';
}
[dir='rtl'] .slick-prev:before
{
    content: '→';
}

.slick-next
{
    right: -25px;
}
[dir='rtl'] .slick-next
{
    right: auto;
    left: -25px;
}
.slick-next:before
{
    content: '→';
}
[dir='rtl'] .slick-next:before
{
    content: '←';
}

.slick-dotted.slick-slider
{
    margin-bottom: 30px;
}

.slick-dots
{
    position: absolute;
    bottom: -25px;

    display: block;

    width: 100%;
    padding: 0;
    margin: 0;

    list-style: none;

    text-align: center;
}
.slick-dots li
{
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}
.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
.slick-dots li button:before
{
    font-family: 'slick';
    font-size: 6px;
    line-height: 20px;

    position: absolute;
    top: 0;
    left: 0;

    width: 20px;
    height: 20px;

    content: '•';
    text-align: center;

    opacity: .25;
    color: black;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
    opacity: .75;
    color: black;
}


/**** breadcrumb ***/

.breadcrumb-section+*{
    padding-top: 0;
    margin-top: 0;
}
.breadcrumb-section{


    padding: 1.5rem 0 calc(var(--box-py-almt) - 7px );
}
.breadcrumb-nav{
    position: relative;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 7px;

}
.breadcrumb{

    margin-bottom: 0;
    flex-wrap: nowrap;
    position: relative;
}
.breadcrumb .breadcrumb-item{

    font-size: 14px;
    text-transform: capitalize;
    color: #909090;
    flex-shrink: 0;
    font-weight: 500;
}
.breadcrumb .breadcrumb-item.active{
    color: var(--clr-1);
}
.breadcrumb .breadcrumb-item a{

    transition: all .3s ease
}
.breadcrumb .breadcrumb-item a:hover{

    color: #000;
}
.breadcrumb-item+.breadcrumb-item{

        padding-left: 0rem;
        padding-right: .5rem;
}
.breadcrumb-item+.breadcrumb-item::before{

    float: right;
    padding-left: .5rem;
    padding-right: 0rem;
    color: #909090;

}

.page-wrapper >*:not(.breadcrumb-section):first-child{
    padding-top: calc( var(--box-py-almt));
}
.page-wrapper >*:nth-last-child(2){
    padding-bottom: calc( var(--box-py-almt));
}





/**** tab-content & accordion_body style & side-overlay ****/

.tab-content{

    display: none;
}
.tab-content.active{

    display: block;
}
.panel-item .accordion_body{

    display: none;
}
.panel-item.opened .accordion_body{

    display: block;
}
.side-overlay{

    width: 0;
    height: 0;
    position: fixed;
    left: 0;
    top: 0;
    opacity: 0;
    z-index: -999999;
    transition: opacity 0.3s ease;
    background-color: rgba(0, 0, 0, 0.6);
    cursor: pointer;

}
.panel-responsive-item.active .side-overlay,
.side-overlay.active{

    width: 100%;
    height: 100%;
    opacity: 1;
    z-index: 999;

}


/*------------- #pagination --------------*/

.items-pagination{

    display: flex;
    justify-content: center;
}
.items-pagination .pagination{

    padding: 0;
    margin: 0;
    flex-wrap: wrap;
    justify-content: center;

}
.items-pagination .pagination .page-item:first-child .page-link{

    border-radius: 0px .25rem .25rem 0px !important;
}
.items-pagination .pagination .page-item:last-child .page-link{

    border-radius: .25rem 0px 0px .25rem !important;
}
.items-pagination .pagination .page-item .page-link{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color:#000;
    border-color: #DEDEDE;
    box-shadow: none;
    padding: 6px 14px;
    font-size: 16px;

}
.items-pagination .pagination .page-item.active .page-link{

    background-color: var(--clr-1);
    color: #fff;
}
.items-pagination .pagination .page-item:not(.active) .page-link:hover,
.items-pagination .pagination .page-item:not(.active) .page-link:focus{

    background-color: #f0f0f0;
    border-color: #e0e0e0;
}
.items-pagination .pagination .page-item:not(:first-child) .page-link{

    margin-left: 0;
    margin-right: -1px;
}
.items-pagination .pagination .page-item.disabled .page-link{

    color: #A6ACBE;
    cursor: no-drop;
}


/*------------- #star-rateing --------------*/


.rateit {
    display: flex;
    align-items: center;
    position: relative;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;

}

.rateit .rateit-range {
    position: relative;
    display: inline-flex;
    align-items: center;
    background: url(star.gif);
    height: 16px;
    outline: none;
}
.rateit .rateit-range * {
    display: inline-flex;
    align-items: center;
}
* html .rateit, * html .rateit .rateit-range {
    display: inline;
}
* + html .rateit, * + html .rateit .rateit-range {
    display: inline;
}
.rateit .rateit-hover, .rateit .rateit-selected {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
}
.rateit .rateit-hover-rtl, .rateit .rateit-selected-rtl {
    left: auto;
    right: 0;
}
.rateit .rateit-hover {
    background: url(star.gif) left -32px;
    color: #EAC92C;
}
.rateit .rateit-hover-rtl {
    background-position: right -32px;
}
.rateit .rateit-selected {
    background: url(star.gif) left -16px;
    color: #EAC92C;
}
.rateit .rateit-selected-rtl {
    background-position: right -16px;
}
.rateit .rateit-preset {
    background: url(star.gif) left -48px;
    color: #EAC92C;
}
.rateit .rateit-preset-rtl {
    background: url(star.gif) left -48px;
}
.rateit button.rateit-reset {
    background: url(delete.gif) 0 0;
    width: auto;
    height: auto;
    margin: 0 auto;
    display: -moz-inline-box;
    display: none !important;
    align-items: center;
    float: none !important;
    outline: none;
    border: none;
    padding: 0;
}

.rateit-font {
    font-size: 24px;
    line-height: .8;

}
.rateit-font .rateit-range {
    background: none;
    height: auto;
}
.rateit-font .rateit-empty {
    color:#C5C5C5;
}
.rateit-font .rateit-range > div {
    background: none;
    overflow: hidden;

}
.rateit.rateit-font .rateit-reset {
    background: none;

}
.rateit-font .rateit-reset:before {
    content: "تعديل التقييم";
    font-weight: 500;
    display: inline-flex;
    font-size: 12px;
    position: relative;
}
.rateit-font[dir=rtl] {
    margin-right:0;
    margin-left:4px;
}
.star-rating{
    display: flex;
    align-items: center;

}
.star-rating .rate-info{
    font-size: 16px;
    font-weight: bold;
    margin-inline-start:.25rem;
}

.rateit:not([data-rateit-readonly="true"]),
.rateit-font:not([data-rateit-readonly="true"]) .rateit-range > div{
    cursor: pointer;
}

.rateit.star-sm{
    font-size: 28px;
}
.rateit.star-md{
    font-size: 32px;
}
.rateit.star-xl{
    font-size: 55px;
}

/*------------- #duplicated items --------------*/

.product-added{

    pointer-events: ;
}
.product-actions .btn-cart{
    display: block;
    position: relative;
    padding: .75rem;
    height: 100%;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    transition: all .3s ease;
    background-color: var(--clr-1);
    border-radius: var(--border-r-1);
    overflow: hidden;
    vertical-align: bottom;
}
.product-actions .cart-action{
    height: var(--row-h);
}
.product-actions .btn-cart p{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: inherit;
    gap:10px;
}
.product-actions .btn-cart svg,
.product-actions .btn-cart  i{

     transition:  inherit;

}
.product-actions .btn-cart svg{
     width: 20px;
     height: 20px;
     fill:#fff;
}
.product-actions .btn-cart .added{

    transform: translate(-50% , 100px);
}
.product-actions .btn-cart.active .added{


    transform: translate(-50% , -50%);
}
.product-actions .btn-cart.active .add-to-cart{

    transform: translate(-50% , -100px);

}
.product-actions .btn-cart:active,
.product-actions .btn-cart.active{

    background-color: var(--clr-1-hover);
}

.counter-wrap .count-wrap{
    display: flex;
    align-items: center;

}
.counter-wrap .count-wrap .count-num{
    font-size: 16px;
    padding: 0 ;
    display: inline-block;
    width: auto;
    border: none;
    max-width: 40px;
    text-align: center;
    font-weight: 500;
    color: #000;
    height: auto;
}
.counter-wrap .count-wrap .count-num::placeholder{
    color: #000;
}
.counter-wrap .count-wrap .count-btn{
    --dim:30px;
    --svg-dim:12px;
    width: var(--dim);
    height: var(--dim);
    padding: 0;
    border-radius: 100%;
    background-color: var(--clr-1);
    transition: all .3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;

}
.counter-wrap .count-wrap .count-btn svg{

    width: var(--svg-dim);
    height: var(--svg-dim);
    fill:#fff;
}
.counter-wrap .count-wrap .count-btn.disabled{
    background-color:#F0F0F2 ;

}
.counter-wrap .count-wrap .count-btn.disabled svg{

    fill:#828A89;
}
.counter-wrap .count-wrap .count-btn:not(.disabled):active{

    background-color: var(--clr-1-hover);

}

/*** counter__wrap style 2 ***/
.product-item .counter__wrap{

    display: none;
}
.product-item .count__wrap{

    height: 100%;
}
.count__wrap .msg-error{

    display: none;
    color: rgba(245, 23, 48, 1);
    font-size: 14px;
    margin-top: .625rem;
    font-weight: bold;
    user-select: none;
}
.count__wrap .msg-error.show{

    display: block;
}
.count__wrap{

    display: flex;
    align-items:stretch;
}
.count__wrap .count-btn{

    height: 100%;
    background-color: var(--clr-1);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--title-8);
    font-weight: bold;
    color: #fff;
    transition: all .3s ease;
    border: none;
    max-width: 55px;
    width: 100%;

}
.count__wrap .count-btn:active{

     background-color: var(--clr-1-hover);
}
.count__wrap .count-btn.count-add{

    border-radius: 0 var(--border-r-1) var(--border-r-1) 0;
}
.count__wrap .count-btn.count-sub{


    border-radius: var(--border-r-1) 0 0 var(--border-r-1);
}
.count__wrap .count-btn svg{

    width: 16px;
    height: 16px;
    fill:#fff;

}
.count__wrap .count-btn span{

    display: inline-flex;

}
.count__wrap .count-btn.disabled{

    opacity: .5;
    pointer-events: none;
}
.count__wrap .count-num{

    text-align: center;
    font-weight: bold;
    border-radius: 0;
    border-width: 1px 0 1px 0;
    font-size: var(--title-8);
    padding: .375rem .75rem;
    height: auto;
}
.count__wrap .step-btn  .second-step{

    display: none;
}
.product-item .product-actions.full-style.cart-active .cart-action{

    display: none;
}
.product-item .product-actions.full-style.cart-active .counter__wrap{

    display: block;
    width: 100%;
}
.product-item .product-actions.step2  .count__wrap .step-btn .first-step{

    display: none;
}
.product-item .product-actions.step2  .count__wrap .step-btn .second-step{

    display: block;
}
/*** counter__wrap style 2 ***/


.btn-wishlist{
    --dim:40px;
    --svg-dim:18px;
    width: var(--dim);
    height: var(--dim);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 100%;
    border: 1px solid #E8E8E8;
    background-color: #E8E8E8;
    font-size: 18px;
    transition: all .3s ease;
}
.btn-wishlist svg{
    width: var(--svg-dim);
    height: var(--svg-dim);
    fill:transparent;
    stroke:#0C0507;
    transition: inherit;
}
.btn-wishlist.active svg{
    fill:#FF0505;
    stroke:#FF0505;
}


.coins-val{

    --size:var(--title-6);
    display: inline-flex;
    gap: 0.25rem;
    align-items: center;
    font-size: var(--size);
    color: #FFBF00;
    font-weight: 500;
    background-color: transparent;
}
.coins-val svg{
    width: var(--size);
    height: var(--size);
}


@media(hover:hover) and (pointer:fine){
    .product-actions .btn-cart:hover{
        background-color: var(--clr-1-hover);
    }
    .count-wrap .count-btn:not(.disabled):hover,
    .count__wrap .count-btn:not(.disabled):hover{

        background-color: var(--clr-1-hover);

    }
    .btn-wishlist:hover{
        background-color: #ddd;
        border-color: #ddd;
    }

}
@media(max-width:575.98px){

    .product-actions .btn-cart{
            border-radius: var(--border-r-3);
    }

    .product-item .product-body .product-actions.full-style .count__wrap .count-btn{

        --border-r-1:var(--border-r-2);
        max-width: 35px;
    }
    .product-item .product-body .product-actions.full-style .count__wrap .count-btn svg{
        width:14px ;
        height: 14px;

    }

}



/*------------- #header --------------*/

.header{
    position: relative;
    z-index: 999;
    width: 100%;
    top: 0px;
    left: 0px;
    transition: all .3s ease;
    opacity: 1;

}
.header .top-nav{
    height: 90px;
}

@media(min-width:992px){

    header .mobile-item{

        display: none !important;
    }
}

.nav-content{

    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 100%;
    position: relative;
    align-self: stretch;
    --h:55px;

}
.nav-content .content-pull,
.nav-content .flex-item{

    display: flex;
    align-items: center;
    height: 100%;

}
.nav-content .h-auto{

    height:auto;
}
.nav-content .nav-toggler{

    display: flex;
    cursor: pointer;
}
.nav-content .nav-toggler svg{

    width: 30px;
    height: 30px;
    fill: #414141;
    transition: all .3s ease;
    outline: none !important;
}

.top-nav .nav-content .nav-logo  img{

    max-height:70px ;
}
.top-nav .nav-content .nav-list {

    display: flex;
    align-items: center;
    justify-content: center;
    align-self: stretch;
    padding: 0px;
    margin: 0px;
    list-style-type: none;
    margin: 0 1rem;
}
.top-nav .nav-content .nav-list .list-item{

    padding: 0px 1rem;
    display: inline-flex;
    align-items: center;
    height: 100%;
    position: relative;
}
.top-nav .nav-content .nav-list .list-item .item-link{

    display: inline-flex;
    align-items: center;
    color: #898A8D;
    font-size: var(--title-7);
    transition: all .3s ease;
    padding: 4px 0;
    font-weight: 600;
}
.top-nav .nav-content .nav-list .list-item .item-link::before{

    background: var(--clr-1);
}
.top-nav .nav-content .nav-list .list-item .item-link:not(.active):hover,
.top-nav .nav-content .nav-list .list-item .item-link.active{
    color: var(--clr-1);
}
.top-nav .nav-content .nav-list .list-item .item-link.active::before{

    left: 0;
}

.top-nav .nav-content .nav-additionals{
    display: flex;
    align-items: center;

}
.top-nav .nav-content .nav-additionals >*{
    display: flex;
    align-items: center;
    gap:0 1.5rem;
}

.top-nav .nav-content .nav-additionals .sign-btns{
    gap:0 1rem;
}
.top-nav .nav-content .nav-additionals .sign-btns .sign-btn{

    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid ;
    font-weight: 500;
    font-size: 16px;
    border-radius: var(--border-r-2);
    padding: 0 .75rem;
    transition: all .3s ease;
    text-align: center;
    width: 160px;
    height: var(--h);
}
.top-nav .nav-content .nav-additionals .sign-btns .sign-btn.sign-up{
    color: #fff;
    background-color: var(--clr-1);
    border-color: var(--clr-1);
}
.top-nav .nav-content .nav-additionals .sign-btns .sign-btn.sign-in{
    background-color: #fff;
    border-color: var(--clr-1);
    color: var(--clr-1);
}
.top-nav .nav-content .nav-additionals .sign-btns .sign-btn:hover{
    background-color: var(--clr-1-hover);
    border-color: var(--clr-1-hover);
    color: #fff;
}

.top-nav .nav-content .nav-additionals .user-logined .action-btn{

    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    transition: all .3s ease;
    border-radius: 40px;
    gap:.5rem;
    padding: .75rem 1.25rem;
    height: var(--h);
    background-color:#F3F3F3 ;
    color: #414141;
    font-weight: 600;
    font-size: var(--title-7);
}
.top-nav .nav-content .nav-additionals .user-logined .action-btn:hover{
    background-color: #ddd;
}
.top-nav .nav-content .nav-additionals .user-logined .action-btn svg{
    max-width: 20px;
    max-height: 22px;
    fill: #414141;
    stroke:#414141;
}
.top-nav .nav-content .nav-additionals .user-logined .action-btn span{
    position: relative;
    display: inline-flex;
}
.top-nav .nav-content .nav-additionals .user-logined .action-btn.active .icon::after{
    position: absolute;
    right:-1px;
    top: -1px;
    content: '';
    width: 9px;
    height: 9px;
    background-color:#FF0000 ;
    border-radius: 100%;

}
.top-nav .nav-content .nav-additionals .user-account{
    display: flex;
    align-items: center;
    gap:.5rem;
    font-weight: 600;
}
.top-nav .nav-content .nav-additionals .user-account .user-img{
    height: var(--h);
    height: var(--h);
    flex-shrink: 0;
}
.top-nav .nav-content .nav-additionals .user-account img{
    object-fit: cover;
    border-radius: 100%;
}
.top-nav .nav-content .nav-additionals .user-account img,
.top-nav .nav-content .nav-additionals .user-account svg{
    width: 100%;
    height: 100%;

}
.top-nav .nav-content .nav-additionals .user-account .user-name{
    font-size: var(--title-7);
    margin-bottom: 2px;
}
.top-nav .nav-content .nav-additionals .user-account .user-points{

    font-size: 14px;
    color: #7C7C7C;
    margin-bottom: 0;


}
.top-nav .nav-content .nav-additionals .user-account .user-points span{
    color:#FBBC05 ;
}

.bottom-nav-ul{

    border-top: 1px solid #E3E3E3;
    border-bottom: 1px solid #E3E3E3;
    padding: .75rem  ;
    display: flex;
    align-items: center;
    justify-content: space-around;
    margin: 0;
    list-style-type: none;
    overflow-x: auto;
    overflow-y: hidden;
    gap:1rem;

}
.bottom-nav-ul::-webkit-scrollbar{
    display: none;
}
.bottom-nav-ul.scrolled{
    justify-content: flex-start;
}
.bottom-nav-ul .list-item{
    flex-shrink: 0;
    white-space: nowrap;
}
.bottom-nav-ul .item-link{
    display: inline-flex;
    align-items: center;
    font-size: 16px;
    transition: all .3s ease;
    font-weight: 500;
    color:#898A8D;

}
.bottom-nav-ul .item-link:hover{
    color: var(--clr-1);
}

@media(min-width:992px) and (max-width:1199.98px){

    .top-nav .nav-content{
        --title-7:16px;
    }
    .top-nav .nav-content .nav-list{
        margin: 0 .75rem;
    }
    .top-nav .nav-content .nav-list .list-item{

        padding: 0 .75rem;
    }
    .top-nav .nav-content .nav-additionals >*{
        gap:0 1rem;
    }
    .top-nav .nav-content .nav-additionals .user-logined .action-btn{
        padding: .75rem 1rem;
    }

    .bottom-nav-ul{
        gap:.75rem;
    }
    .bottom-nav-ul .item-link{
        font-size: 15px;
    }

}

@media(max-width:992px){

    :root{
        --nav-h:70px;
    }



    .header{
        position: fixed;
        box-shadow: 0 1px 1px rgb(0 0 0 / 15%);
        height: var(--nav-h);
        background-color: #fff;

    }
    .header .top-nav{
        height: 100%;
    }
    .header .top-nav .nav-content .nav-list,
    .header .bottom-nav{
        display: none;
    }

    .top-nav .nav-content .nav-logo img{
        max-height: var(--h);
    }

    .top-nav .nav-content{
        --h:50px;
    }
    .top-nav .nav-content .content-pull{
        gap:1rem;
    }
    .top-nav .nav-content .nav-additionals >*{
        gap:0 1rem;
    }
    .top-nav .nav-content .nav-additionals .sign-btn{
         --h:45px;
    }
    .top-nav .nav-content .nav-additionals .sign-btns .sign-btn{
        width: 140px;
    }
    .top-nav .nav-content .nav-additionals .user-logined >*:not(.notfy-btn):not(.user-account){
        display: none;
    }
    .top-nav .nav-content .nav-additionals .user-logined .notfy-btn{
        border-radius: var(--border-r-2);
        padding: 0;
        width: var(--h);
    }
    .top-nav .nav-content .nav-additionals .user-logined .notfy-btn .text{
        display: none;
    }

    .top-nav .nav-content .nav-additionals .user-logined .user-account .user-name{
        font-size: calc(var(--title-7) - 2px);
    }
     .top-nav .nav-content .nav-additionals .user-logined .user-account .user-points{
        font-size: calc(var(--title-7) - 4px);
    }


}

@media(max-width:575.98px){

    .header .top-nav .nav-content{
        --h:45px;
    }
    .nav-content .content-pull,
    .top-nav .nav-content .nav-additionals >*{
        gap:0 .75rem;
    }
    .top-nav .nav-content .nav-additionals .sign-btns >*:not(.sign-in){
        display: none;
    }
    .top-nav .nav-content .nav-additionals .sign-btns .sign-btn{
        width: auto;
    }

    .top-nav .nav-content .nav-additionals .user-logined .user-account{
        gap:.5rem;
        display: none;

    }


}

@media(max-width:359.98px){

    .top-nav .nav-content .nav-additionals .sign-btns .sign-btn{
        padding: 0 .5rem;
        font-size: 14px;
    }
}


/*------------- # mobile-menu-wrapper --------------*/

.mobile-menu-wrapper{

    display: none;
    --main-clr:var(--clr-1);
}

.mobile-menu-wrapper .mobile-menu-overlay{

    width: 0;
    height: 0;
    position: fixed;
    left: 0;
    top: 0;
    opacity: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: -999999;
    -webkit-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
}
.mobile-menu-wrapper .mobile-menu-close{

    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 16px;
    left:  -100px;
    z-index: 2201;
    color: #909090;
    font-size: 24px;
    width: 40px;
    height: 40px;
    background-color: #eee;
    transition: all .3s ease;


}
.mobile-menu-wrapper .mobile-menu-close:hover{

    color: var(--main-clr);
}

.mobile-menu-wrapper .mobile-menu-container{

    position: fixed !important;
    top: 0;
    bottom: 0;
    z-index: 99999;
    overflow-y: auto;
    right: -120%;
    width: 420px;
    transition: all 0.3s ease;
    display: block;
    box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
    box-shadow: 1px 0 5px rgb(0 0 0 / 50%);
    background-color: #fff;
    margin-right: 0px !important;
    -webkit-overflow-scrolling: touch;
}

.mobile-menu-wrapper .mobile-menu-container .mobile-search {

    position: relative;
    box-shadow: 0 -1px 9px rgb(0 0 0 / 17%);
}
.mobile-menu-wrapper .mobile-menu-container .mobile-search input{

    padding-top: 0;
    padding-bottom: 0;
    padding-left: 35px;
    padding-right: 1rem;
    height: 70px;
    border: none;
    font-weight: 600;
    font-size: 16px;
    background-color: transparent;
    box-shadow: none;
    vertical-align: middle;
    border-radius: 0;
    color: #909090;
}
.mobile-menu-wrapper .mobile-menu-container .mobile-search input::placeholder{

    color: #909090;
}
.mobile-menu-wrapper .mobile-menu-container .mobile-search button{

    position: absolute;
    left: .75rem;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
    color:#909090 ;
    font-size: 16px;
    border: none;
    outline: none;
    padding: 0;
    display: block;
    background-color: #fff;
    transition: all .3s ease

}
.mobile-menu-wrapper .mobile-menu-container .mobile-search button:hover{

    color: var(--main-clr);
}

.mobile-menu-wrapper .mobile-menu-container .mobile-nav-tabs{

    display: flex;
    align-items: center;
    border-bottom: 1px solid rgba(129,129,129,.2);
    background-color: rgba(0,0,0,.04);
}
.mobile-menu-wrapper .mobile-menu-container .mobile-nav-tabs .mobile-tab{

    position: relative;
    flex: 1 0 50%;
    padding: 18px 1rem;
    max-width: 50%;
    width: 50%;
    color: #909090;
    text-align: center;
    font-weight: bold;
    font-size: 16px;
    cursor: pointer;
    transition: background-color .25s ease,color .25s ease;
    font-size: 18px;

}
.mobile-menu-wrapper .mobile-menu-container .mobile-nav-tabs .mobile-tab::after{

    content: "";
    position: absolute;
    top: 100%;
    right:0;
    margin-top: -1px;
    width: 0;
    height: 2px;
    transition: width .25s ease;
    background-color: var(--main-clr);
}
.mobile-menu-wrapper .mobile-menu-container .mobile-nav-tabs .mobile-tab.active{

    background-color: rgba(0,0,0,.05);

}
.mobile-menu-wrapper .mobile-menu-container .mobile-nav-tabs .mobile-tab:first-of-type::after{

    left: 0;
    right: auto;
}
.mobile-menu-wrapper .mobile-menu-container .mobile-nav-tabs .mobile-tab:last-of-type::after{

    right: 0;
    left: auto;
}
.mobile-menu-wrapper .mobile-menu-container .mobile-nav-tabs .mobile-tab.active::after{

    width: 100%;

}


.mobile-menu-wrapper .mobile-menu-container  .mobile-menu-tab-pane .mobile-menu{

    padding: 0px;
    margin: 0px;
    list-style-type: none;
}
.mobile-menu-wrapper .mobile-menu-container  .mobile-menu-tab-pane .mobile-menu .mobile-menu-item{

   display: block;
   position: relative;
   border-bottom: 1px solid rgba(129,129,129,.2);
    padding: 1rem;
}
.mobile-menu-wrapper .mobile-menu-container  .mobile-menu-tab-pane .mobile-menu .mobile-menu-item .mobile-menu-link{
    position: relative;
    display: inline-flex;
    align-items: center;
    gap:.5rem;
    font-size: 16px;
    transition: all .3s ease;
    font-weight:600;


}
.mobile-menu-wrapper .mobile-menu-container  .mobile-menu-tab-pane .mobile-menu .mobile-menu-item:last-child{

    padding-bottom: 0;
    border-bottom: none;
}
.mobile-menu-wrapper .mobile-menu-container  .mobile-menu-tab-pane .mobile-menu .mobile-menu-item .mobile-menu-link:hover{

    color: var(--main-clr)
}


.mobile-menu-wrapper.active .mobile-menu-overlay{

    width: 100%;
    height: 100%;
    opacity: 1;
    z-index: 1000;
}
.mobile-menu-wrapper.active .mobile-menu-container{

    right: 0;

}
.mobile-menu-wrapper.active .mobile-menu-close {
    display: flex;
    left: 12px;
}


@media(max-width:991.98px){

    .mobile-menu-wrapper{

        display: block;
    }


}

@media(max-width: 575.98px){

    .mobile-menu-wrapper .mobile-menu-container {
       width: calc(80% - 6px);
    }

}


/*------------- #tool-bar --------------*/

.tool-bar {

  position: fixed;
  right: 0;
  bottom: 0px;
  left: 0;
  z-index: 500;
  display: none;
  align-items: center;
  justify-content: space-between;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  padding: 4px;
  height: var(--toolbar-h);
  transition: all .3s ease;
  background-color: #fff;
  box-shadow: 0 0 9px rgba(0, 0, 0, 0.12);
  border-radius: 0;

}
.tool-bar > div {

  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  position: relative;
}
.tool-bar .tool .tool-link {

  display: inline-flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  font-weight: 500;
  height: 50px;
  position: relative;
  padding: 0px 10px 23px;
  transition: all .3s ease;

}
.tool-bar .tool .tool-icon svg {
  width: 22px;
  height: 22px;
  fill: #414141;
  transition: all .3s ease
}
.tool-bar .tool .tool-link span {

  position: absolute;
  bottom: 5px;
  left: 50%;
  transform: translateX(-50%);
  display: block;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-transform: uppercase;
  font-size: 12px;
  line-height: 1;
  color: #414141;
  transition: inherit ;
  font-weight: 500;

}
.tool-bar .tool .tool-link:hover span{

    color: var(--clr-1);

}
.tool-bar .tool .tool-link:hover svg{

    fill:var(--clr-1);
}
.tool-bar .tool .tool-link.active::after {

    position: absolute;
    right: 8px;
    top: 3px;
    content: '';
    width: 9px;
    height: 9px;
    background-color: #FF0000;
    border-radius: 100%;
}


@media(max-width:991.98px){

    :root{

        --toolbar-h:65px;
    }
    .tool-bar{
        display: flex;
    }


}

/*------------- #footer --------------*/

.top-footer{

    background-color: #F3F3F3;
    padding: 1.5rem 0;

}
.top-footer .help-wrapper{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:1rem 1.5rem  ;
    margin-bottom: var(--section-padding);
}
.top-footer .help-wrapper .help-texts .help-title{
    font-size: var(--title-4);
    font-weight: bold;
    margin-bottom: .75rem;
}
.top-footer .help-wrapper .help-texts .help-text{
    font-size: var(--title-7);
    margin-bottom: 0;
    color: #8B8B8B;
}
.top-footer .newsletter-contact{
    flex: 1;
    max-width: 450px;
}
.top-footer .newsletter-contact .form-group{
    --btn-w:100px;
}
.top-footer .newsletter-contact .form-group input{

    border-color: var(--clr-1);
    border-radius: var(--border-r-2);
    background-color: #fff;
    height: 70px;
    padding-left: calc(var(--btn-w) + .75rem + .5rem);
}
.top-footer .newsletter-contact .form-group .submit-btn{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: .75rem;
    font-size: 16px;
    border-radius: var(--border-r-2);
    background-color: var(--clr-1);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: bold;
    width:var(--btn-w);
    height: 50px;
    transition: all .3s ease;

}
.top-footer .newsletter-contact .form-group .submit-btn:hover{
    background-color: var(--clr-1-hover);
}
.top-footer .contact-row .row{
    gap:1.5rem 0;
    align-items: center;
}
.top-footer .contact-row .contact-item{
    display: inline-flex;
    align-items: center;
    gap:.75rem;
    color: #3E4958;
    transition: all .3s ease;


}
.top-footer .contact-row .contact-item .item-icon{
    width: 50px;
    height: 50px;
    border-radius: var(--border-r-3);
    flex-shrink: 0;
    background-color: transparent;
    transition: inherit;
}
.top-footer .contact-row .contact-item .item-icon svg,
.top-footer .contact-row .contact-item .item-icon img{
    width: 100%;
    height: 100%;
    transition: inherit;
}
.top-footer .contact-row .contact-item .item-texts,
.top-footer .contact-row .contact-item .item-texts>*{
    transition: inherit;
}
.top-footer .contact-row .contact-item .item-texts .item-title{
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 0;

}
.top-footer .contact-row .contact-item .item-texts .item-desc{
    margin-bottom: 0;
    font-size: 14px;

}
.top-footer .contact-row .contact-item:hover .item-texts>*{
    color: var(--clr-1);
}

.bottom-footer{

    padding: var(--section-padding) 0 0;
    background-color: var(--clr-1);

}
.bottom-footer .footer-menu{
        margin-bottom: var(--section-padding)
}
.bottom-footer .footer-about{

    margin-inline-end:1rem;
}
.bottom-footer .footer-about .about-logo{
    display: inline-flex;
    align-items: center;
    gap:.25rem;
    font-size: var(--title-4);
    font-weight: bold;
    color: #fff;
    transition: all .3s ease;
    margin-bottom: 0;
}
.bottom-footer .footer-about .about-desc{
    font-size: 16px;
    margin-bottom: 0;
    color: #fff;
    text-align: justify;
    font-weight: 500;
}
.bottom-footer .menu-title{
    font-weight: bold;
    color: #fff;
    font-size: var(--title-6);
    margin-bottom: 1.5rem;
}
.bottom-footer .menu-list{
    padding: 0;
    margin: 0;
    list-style-type: none;
}
.bottom-footer .menu-list .list-item {

    display: block;
    position: relative;
    margin-bottom: .75rem;
}
.bottom-footer .menu-list .list-item:last-child{
    margin-bottom: 0;
}
.bottom-footer .menu-list .list-item .item-link{
    display: inline-flex;
    align-items: center;
    position: relative;
    color: #fff;
    font-size: 16px;
    transition: all .3s ease;
    font-weight: 500;
}
.bottom-footer .menu-list .list-item .item-link::before{

     -webkit-transition-duration: 400ms;
    -o-transition-duration: 400ms;
    transition-duration: 400ms;
    position: absolute;
    top: 50%;
    left: auto;
    right: 0;
    width: 0;
    height: 3px;
    background-color: #fff;
    content: '';
    opacity: 0;

}
.bottom-footer .menu-list .list-item .item-link:hover{
    padding-right: 15px;
}
.bottom-footer .menu-list .list-item .item-link:hover::before{

    width: 10px;
    opacity: 1;
}
.bottom-footer .copy-rights{
    padding: 1rem 0;
    border-top:1px solid rgb(255 255 255 / 50%);
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 0;
    color: #fff;
}


@media(max-width:991.98px){

    .bottom-footer .footer-about{
        margin-inline-end:0rem;
    }
    .bottom-footer .menus-wrap{
        max-width: 100%;
        margin: 0 auto;
    }
    .bottom-footer .menus-wrap .footer-menu{

        padding: 0 1rem 0 0;
        border-right: 1px solid #fff;
        height: calc(100% - var(--section-padding));
    }

    .bottom-footer .copy-rights{
        border-top: 0;
        padding-top: 0;
    }

}
@media(max-width:767.98px){

    .top-footer .help-wrapper{
        flex-direction: column;
        align-items: stretch;
    }
    .top-footer .newsletter-contact{
        max-width: none;
    }


    .bottom-footer .menus-wrap .footer-menu{
        padding: 0;
        margin-bottom: 0;
        border-right: none;
        height: auto;
        padding: 0 0 1.5rem 0;
        border-bottom: 1px solid #fff;
    }
    .bottom-footer .menus-wrap .row > div:not(:last-child) .footer-menu{

        margin-bottom: 1.5rem;
    }
    .bottom-footer .copy-rights{
        padding: 1.5rem 0;
    }



}
@media(max-width:575.98px){

    .top-footer .newsletter-contact .form-group{
        --btn-w:78px;
    }
    .top-footer .newsletter-contact .form-group input{
        padding: .75rem .5rem;
        padding-left: calc(var(--btn-w) + .5rem + .25rem);
        height: 60px;
        font-size: 14px;
    }
    .top-footer .newsletter-contact .form-group .submit-btn{
        left: .5rem;
        height: 43px;
        font-size: 14px;
    }




}
@media(min-width: 1200px){
    .top-footer .row-cols-xl-auto>*{
        flex: 0 1 auto;
    }
}


/*------------- #custom-modal --------------*/

.modal-backdrop.show{

    opacity: .6;
}

.custom-modal .modal-content{

    border-radius: var(--border-r-2);
    border: none;
}

.custom-modal .modal-dialog.modal-lg{
    max-width: 600px;
}

.custom-modal .modal-body{

    padding-top:var(--section-padding) ;
    padding-bottom:var(--section-padding) ;
}

.custom-modal .modal-body.body-py-sm{

    padding-top:2rem ;
    padding-bottom:2rem ;
}

.custom-modal .body-container:not(.full-width){
    max-width:450px ;
    margin: 0 auto;
}
.custom-modal .modal-area{
    --items-alt:2rem;
}
.custom-modal .body-py-sm .modal-area{
    --items-alt:1.5rem;
}
.custom-modal .area-texts{
    text-align: center;
}
.custom-modal .modal-title{
    font-size: var(--title-2);
    font-weight: bold;
    color: #363E5F;
    margin-bottom: 0;
    text-align: center;
}
.custom-modal .modal-text{
    font-size: var(--title-4);
    font-weight: bold;
    text-align: center;
    color: #363E5F;
    margin-bottom: 0;
}
.custom-modal .modal-sub-text{
    font-size: var(--title-6);
    font-weight: 500;
    color:#8E8E8E ;
    margin-bottom: 0;
    text-align: center;

}
.custom-modal .clr-main{
    color: var(--clr-1)
}
.custom-modal .modal-btns{
    display: flex;
    align-items: center;
    justify-content: center;
    gap:1rem;
    flex-direction: column;
    width: 100%;
}
.custom-modal .modal-btns.row-btns{
    flex-direction: row;
    justify-content: space-between;
}
.custom-modal .modal-area >*:not(:last-child){

    margin-bottom: var(--items-alt);
}




@media(min-width:992px){

    .custom-modal .btn__close{

        position: absolute;
        left: calc(-34px / 2);
        top: calc(-34px / 2);
        width: 34px;
        height: 34px;
        background-color:#FCFCFD ;
        border-radius: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        font-size: 18px;
        transition: all .3s ease;
        color: #909090;
        box-shadow: 0 3px 6px rgba(0,0,0,0.16);
        border: none;
        outline: none;
        margin: 0;
        padding: 0;
        z-index: 10;
        vertical-align: middle;
    }
    .custom-modal .btn__close:hover{

        background-color: var(--clr-1);
        color: #fff
    }

}

@media(max-width:991.98px){

    .custom-modal .modal-body:not(.still-sm){

        padding-top: calc( calc(40px / 2) + .25rem + 2rem) !important;
        padding-bottom: 2rem !important;

    }

    .custom-modal .btn__close{

        position: absolute;
        height: 40px;
        left: 0;
        margin-top: .75rem;
        padding: .5rem 1rem 0;
        display: inline-flex;
        justify-content: flex-end;
        font-size: 22px;
        margin-right: auto;
        color:#909090;
        transition: all .3s ease;
        z-index: 10;
    }

    .custom-modal .btn__close:hover{

        color: var(--clr-1);
    }


}



/**join-modal**/

.join-modal .modal-area .area-icon{
    display: flex;
    align-items: center;
    justify-content: center;

}
.join-modal .modal-area .area-icon img{
    max-height: 250px;
}
.join-modal .modal-area .modal-title{
    padding-bottom: .5rem;
}

/**merchant-order-modal**/
.merchant-order-modal .modal-area  .store-info {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    flex-direction: column;
    gap:.75rem;
}
.merchant-order-modal .modal-area  .store-info img{

    width: 100%;
    max-height: 120px;
    object-fit: contain;
}
.merchant-order-modal .modal-area  .store-info span{
    font-size: var(--title-7);
    font-weight: bold;
    display: block;
}

/**add-rate-modal**/
.add-rate-modal .modal-area .rateit.star-xl{
    font-size: 60px;
}
.add-rate-modal .modal-area .star-rating .rate-info{
    font-size: var(--title-8);
    font-weight: bold;
}

/**confirm-delete-modal**/



@media(max-width:575.98px){

    .custom-modal .modal-area{
        --items-alt:1.5rem;
    }
    .custom-modal .modal-btns{
        gap:.75rem;
    }
    .confirm-delete-modal .modal-btns .modal-btn{
        height: 50px;
    }
    .custom-modal .modal-text{
        font-size: var(--title-5)
    }

    .join-modal .modal-area .area-icon img{
        max-height: 200px;
    }

    .add-rate-modal .modal-area .rateit.star-xl{
        font-size: 55px;
    }
}


/*------------- #sign-section --------------*/

.sign-area .sign-box{

    max-width:500px ;
    margin: 0 auto;
    border: 1px solid #DADADA;
    border-radius: var(--border-r-2);
    --item-alt:var(--section-padding);
}
.sign-area .sign-box .box-container{

    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: var(--section-padding) var(--box-px);
}
.sign-area .sign-box .box-title{
    font-weight: bold;
    font-size: var(--title-2);
    margin-bottom: 0;
}
.sign-area .sign-box .box-link-btn{
    font-size: var(--title-4);
}
.sign-area .sign-box .box-text{
    font-size: var(--title-7);
    font-weight: 500;
    margin-bottom: 0;
    color: #353642;
}
.sign-area .sign-box .box-hint{
    font-size: 14px;
    margin-bottom: 0;
    color: #353642;
    font-weight: 400;
    margin-top: .5rem;
}
.sign-area .sign-box .box-text span,
.sign-area .sign-box .box-hint span{
    display: inline-block;
}
.sign-area .sign-box .box-hint .seconds{
    color:#FF4D4D ;
}
.sign-area .sign-box .box-note{
    display: block;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    color: #A1A1A1;
    transition: all .3s ease;
    margin-bottom: 0;
}
.sign-area .sign-box .box-note.w-shift{
    margin-bottom: -1rem;
}
.sign-area .sign-box a:not(.box-btn){
    display: inline-block;
    color: var(--clr-1);
     transition: all .3s ease;
}
.sign-area .sign-box a:not(.box-btn):hover{
    color: var(--clr-1-hover)
}
.sign-area .sign-box .flex-head{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:.75rem;
}
.sign-area .sign-box .main-head{
    display: flex;
    flex-direction: column;

}
.sign-area .sign-box .box-buttons{
    display: flex;
    flex-direction:column;
    gap:1rem;
}
.sign-area .sign-box .box-buttons.sm-gap{
    gap:.75rem;
}
.sign-area .sign-box .password-field .form-control{
    background-color:#F9FAFA ;
    background-color: #fff;
}
.sign-area .sign-box .box-container>*:not(:last-child){
    margin-bottom: var(--item-alt);
}


.welcome-sign-area .sign-box .box-icon{
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.welcome-sign-area .sign-box .box-icon img{

    max-height: 250px;
}
.welcome-sign-area .sign-box .welcome-text{
    font-size: var(--title-4);
    color: var(--clr-1);
    text-align: center;
    margin-bottom: 0;
    font-weight: bold;
}

@media(min-width:576px){

    .signIn-area .sign-box .box-container{
        min-height: 400px;
    }
}
.signIn-area .sign-box .form-group:not(:last-child){
    padding-bottom: 1rem;
}


.signUp-area .sign-box .box-container .flex-head{
    margin-bottom: 1.5rem;
}
.signUp-area .sign-box .form-group:not(:last-child){
    padding-bottom: 1rem;
}
.signUp-area .sign-box .form-group .upload-img{
    display: inline-flex;
    align-items: center;
    position: relative;
    margin-bottom: .5rem;
    --dim:140px;
}
.signUp-area .sign-box .form-group .upload-img img{

    width: var(--dim);
    height: var(--dim);
    border-radius: 100%;
    object-fit: cover;
    display: block;
}
.signUp-area .sign-box .form-group .upload-img .btn-file{
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    border: 3px solid #fff;
    color: #fff;
    background-color: var(--clr-1);
    transition: all .3s ease;
    cursor: pointer;
    position: absolute;
    bottom: 4px;
    right: 4px;
    z-index: 1;
    font-size: 16px;
}
.signUp-area .sign-box .form-group .upload-img .btn-file svg{
    width: 16px;
    height: 16px;
    fill:#fff;
}
.signUp-area .sign-box .form-group .upload-img .btn-file:hover{
    background-color: var(--clr-1-hover);
}

.confirm-sign-area .sign-box .box-title{
    margin-bottom: 1rem;
}
.confirm-sign-area .sign-box .form-group:not(:last-child){
    margin-bottom: var(--item-alt);
}



@media(max-width:575.98px){

    .sign-area .sign-box .box-title{
        font-size: var(--title-3);
    }
    .sign-area .sign-box .box-note.w-shift{
        margin-bottom: -.5rem;
    }

    .welcome-sign-area .sign-box .box-icon img{

        max-height: 200px;
    }

    .signUp-area .sign-box .form-group .upload-img{
        --dim:120px;
    }


}

/*------------- #products --------------*/

.products-wrapper .row{

    gap: 2rem 0 ;
}
.products-wrapper.products-categories .row{
    gap: 1.5rem 0 ;
}
.products-wrapper.products-categories .row-categories{

    --scroll-padding:0px;
}
.products-wrapper.products-categories .row-categories:not(:last-child){

    margin-bottom: calc(var(--section-padding) - var(--scroll-padding));
}
.products-area .categories-wrapper{
    margin-bottom: calc(var(--section-padding));
}

.products-wrapper .flex-head{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:.75rem;
}
.products-wrapper .flex-head >*{

    margin-bottom: 1.5rem;
}
.products-wrapper .flex-head .more-link{
    display: block;
    font-size: var(--title-6);
    color: var(--clr-1);
    transition: all .3s ease;
    flex-shrink: 0;
}
.products-wrapper .flex-head .more-link:hover{
    color: var(--clrBlack);

}
.products-wrapper .flex-head .more-link::before{
    background: var(--clrBlack);
    bottom: -1px;
}


.product-slider-container .slider-arrow{
    --dim:34px;
    width: var(--dim);
    height: var(--dim);
    font-size: 16px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color .3s ease , color .3s ease , border .3s ease;
    position: absolute;
    top: calc((200px / 2) - (var(--dim)/2));
    box-shadow: rgb(0 0 0 / 50%) 0px 0px 3px -1px;
    border: 1px solid rgb(204, 204, 204);
    background: rgb(255, 255, 255);
    color: var(--clr-1);
    z-index: 20;
    cursor: pointer;

}
.product-slider-container .slider-arrow:not(.swiper-button-disabled):active{
    background-color: var(--clr-1);
    border-color: var(--clr-1);
    color: #fff;

}
.product-slider-container .slider-arrow.swiper-button-disabled{
     background-color:#eee ;
     color: #828A89;
     cursor: no-drop;

}
@media(hover:hover) and (pointer:fine){

    .product-slider-container .slider-arrow:not(.swiper-button-disabled):hover{
        background-color: var(--clr-1);
        border-color: var(--clr-1);
        color: #fff;


    }
}
.product-slider-container .slider-arrow.next-btn{
    left: calc((var(--dim)*-1)/2);
}
.product-slider-container .slider-arrow.prev-btn{
    right:  calc((var(--dim)*-1)/2);
}
@media(max-width:1200px){
    .product-slider-container .slider-arrow.next-btn{
        left: -.625rem;
    }
    .product-slider-container .slider-arrow.prev-btn{
        right: -.625rem;
    }

}


.product-item{
    background-color: transparent;
    position: relative;
    height: 100%;
    --img-h:200px;
}
.product-item .product-img{
    display: block;
    position: relative;
    overflow: hidden;
    background-color: #F5F7F9;
    border-radius: var(--border-r-2);
}
.product-item .product-img a{
    display: block;
    border-radius: inherit;
}
.product-item .product-img a span{

    transition: all .3s ease;
    border-radius: inherit;
}
.product-item .product-img img{
    height: var(--img-h);
    border-radius: inherit;
    transition: all .3s ease;
    display: block;
    width: 100%;
    object-fit: cover;
    margin: auto;
    text-align: center;
}
.product-item .product-img .product-code{

    position: absolute;
    bottom: .75rem;
    right: .75rem;
    font-size: 14px;
    color: #FF0000;
    background-color: #fff;
    border-radius: var(--border-r-3);
    padding: .375rem .75rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 1.5rem);
    z-index: 10;

}
.product-item .product-img a .tt-img-roll-over{

    display: none;
}
.product-item .product-img .product-offer{
    position: absolute;
    top: 0;
    left: .75rem;
    content: '';
    z-index: 2;
}
.product-item .product-img .product-offer >*{
    max-height: 35px;
}
@media(min-width:992px){

    .product-item .product-img a .tt-img-roll-over{

        display: block;
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
        z-index: 1;
        width: 100%;
        height: 100%;
    }

    .product-item .product-img:hover .tt-img-roll-over{

        opacity: 1;
    }

}

.product-item .product-body{
    --item-sapce:.75rem;
    display: flex;
    flex-direction: column;
    height: calc(100% - (var(--img-h)) );
}
.product-item .product-body >*{
    padding-top: var(--item-sapce);
}
.product-item .product-body .price-info{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:.5rem;
}
.product-item .product-body .price-info .price-val{

    font-size: var(--title-7);
    color: var(--clr-1);
    flex: 1;
    margin-bottom: 0;
    font-weight: 500;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 1.1;
}
.product-item .product-body .price-info .price-val span{
    font-size: var(--title-6);
}
.product-item .product-body .price-info .price-points{

    display: inline-flex;
    gap:.25rem;
    align-items: center;
    margin-bottom: 0;
    font-size: 16px;
    color: #FFBF00;
    font-weight: 500;
    background-color: transparent;
    border-radius: 100px;
}
.product-item .product-body .price-info .price-points.w__bg{
    background-color: #323232;
    padding: 0 .5rem;
}
.product-item .product-body .price-info .price-points svg{
    width: 16px;
    height:16px ;
}
.product-item .product-body .product-desc{
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: justify;
    padding-bottom: .1rem;

}
.product-item .product-body .product-desc a{
    font-size: 16px;
    color: #000;
    transition: all .3s ease;
    font-weight: 500;

}
.product-item .product-body .product-desc a:hover{
    color: var(--clr-1);
}
.product-item .product-body .product-actions{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap:.75rem;
    position: relative;
    margin-top: auto;
    --row-h:45px;
}
.product-item .product-body .product-actions >*{
    height: var(--row-h);
}
.product-item .product-body .product-actions .cart-action{
    flex: 1;

}
.product-item .product-body .product-actions:not(.full-style) .counter-wrap {
    display: flex;
    align-items: center;
}
.product-item .product-body .product-actions:not(.full-style) .count-wrap .count-btn{
    --dim:32px;
}
.product-item .product-body .product-actions:not(.full-style) .count-wrap .count-num{
    font-weight: 600;
    max-width: 45px;
}
.product-item .product-body .product-actions:not(.full-style) .cart-action{
        max-width: none;
}
/*.product-item .product-body .product-actions:not(.full-style):not(.cart-active) .counter-wrap{*/
/*    display: none;*/
/*}*/



.product-item .btn-wishlist{
    position: absolute;
    top: 1rem;
    left: 1rem;
    --dim:40px;
    --svg-dim:18px;
    border: 1px solid rgba(255, 255, 255, 0.43);
    background-color: rgba(255, 255, 255, 0.43);

}




@media(max-width:575.98px){


    .products-wrapper .row{
        gap:1.5rem 0;
    }

    .product-slider-container .slider-arrow{
        display: none;
        top: calc((150px/ 2) - (var(--dim)/2));
        --dim: 28px;
        font-size: 14px;
    }


    .products-wrapper .scroll-row{

        overflow-x: auto;
        overflow-y: hidden;
        margin: 0 -0.75rem;
        padding-bottom: var(--scroll-padding);
        width: inherit;

    }
    .products-wrapper .scroll-row::-webkit-scrollbar{
        display: none
    }
    .products-wrapper .scroll-row .target-row{

        flex-wrap: nowrap;
        justify-content: flex-start;
        margin: 0;
        transform: none;

    }
    .products-wrapper .scroll-row .product-wrap{

        --item-w:250px;
        padding: 0;
        max-width: var(--item-w);
        flex-shrink: 0;
        margin-inline-start:.75rem;
    }
    .products-wrapper .scroll-row .product-wrap:last-child{
        padding-inline-end: 0.75rem;
        max-width: calc(var(--item-w) + .75rem);
    }


    .products-wrapper .multiple-row .target-row{
        --bs-gutter-x:.75rem;
    }
    .products-wrapper .multiple-row .target-row >*{

        flex: 0 0 auto;
        width: 50%;
    }


    .product-item  {
        --img-h:150px;
    }
    .product-item .product-body{
        --item-sapce:.5rem;
    }
    .product-item .product-body .price-info .price-val span{
        font-size: 16px;
    }
    .product-item .product-body .product-desc a,
    .product-item .product-body .product-actions .btn-cart,
    .product-item .product-body .price-info .price-points,
    .product-item .product-body .price-info .price-val{
        font-size: 14px;
    }
    .product-item .product-body .price-info .price-points svg{
        width: 14px;
        height: 14px;
    }
    .product-item .product-body .price-info .price-points.w__bg{
        padding: 0 .5rem;
    }
    .product-item .product-img .product-code{
        font-size: 12px;
        right: .625rem;
        bottom: .625rem;
        padding:.375rem .5rem;
        border-radius: var(--border-r-3);

    }
    .product-item .product-img .product-offer >*{
        max-height: 30px;
    }
    .product-item .btn-wishlist{
        left: .75rem;
        top: .75rem;
        --dim:36px;
        --svg-dim:16px;
    }

    .product-item .product-body .product-actions{
        --row-h:40px;
        gap:.5rem;
    }
    .product-item .product-body .product-actions:not(.full-style) .count-wrap .count-num{
        max-width: 40px;
    }
    .product-item .product-body .product-actions:not(.full-style) .count-wrap .count-btn{
        --dim:28px;
        --svg-dim:10px;
    }

    .product-item .product-body .product-actions:not(.full-style) .btn-cart p span{
        display: none;
    }
    .product-item .product-body .product-actions:not(.full-style):not(.cart-active) .btn-cart p span{
        display: block;
    }



    .products-wrapper .flex-head .more-link{
        font-size: 18px;
    }
    .products-wrapper .main-title.sub-title .title{
        font-size: var(--title-5);
    }

}

@media(min-width:992px) and (max-width:1023.98px){

    .products-wrapper .row-cols-lg-4>*{

            flex: 0 0 auto;
            width: 33.3333333333%;
    }
}
@media(min-width:480px) and (max-width:575.98px){

    .products-wrapper .scroll-row .product-wrap{
        max-width: 300px;
    }
}



/*------------- #welcome-section --------------*/

.welcome-area .welcome-title{

    font-weight: bold;
    font-size: var(--title-1);
    color: #2D2D2D;
    text-align: center;
    max-width: 1000px;
    margin: 0 auto;
}
.welcome-area .row{
    justify-content: center;
    align-items: center;
}
.welcome-area .links-col{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap:1.5rem;
}
.welcome-area .links-col .link-wrap{
    display: flex;
    justify-content: center;
    text-align: center;
}
.welcome-area .links-col .link-item{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all .3s ease;
}
.welcome-area .links-col .link-item img{
    height: 60px;
    max-height: 60px;
}
.welcome-area .links-col .link-item:hover{
    transform: translateY(-3px);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    filter: blur(0);
    -webkit-filter: blur(0);
    opacity: .7;
}

.welcome-area .welcome-img{
    text-align: center;
}
.welcome-area .welcome-img img{
    max-height: 550px;
    pointer-events: none;
    user-select: none;
}

@media(max-width:1199.98px){

    .welcome-area .welcome-img img{
        max-height: 500px;
    }

}
@media(max-width:991.98px){
    .welcome-area .links-col{
        gap:1rem;
    }
    .welcome-area .welcome-title{
        padding-bottom: .75rem;
    }

}
@media(max-width:767.98px){

    .welcome-area .welcome-title{
        padding-bottom: 1rem;
        font-size: var(--title-2)
    }
    .welcome-area .welcome-img img{
        max-height: 450px;
    }

    .welcome-area .links-col{

        flex-direction: row;
        padding-top: 1.5rem;
    }

     .welcome-area .links-col .link-item img{
        height: auto;
         max-height: 50px;
    }

}
@media(max-width:575.98px){

    .welcome-area .welcome-title{
        font-size: var(--title-3)
    }
    .welcome-area .links-col{
        flex-wrap: wrap;
        gap: .75rem 0;
        margin: 0 -.375rem;
    }
    .welcome-area .links-col >*{

        flex: 0 1 auto;
        width: 50%;
        padding: 0 .375rem;

    }
    .welcome-area .links-col>*:nth-child(odd):not(:last-child){

        justify-content: flex-end;
    }
    .welcome-area .links-col>*:nth-child(even){

        justify-content: flex-start;
    }
}





/*------------- #feedback-box --------------*/

.feedback-box{
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    --item-alt:var(--section-padding);
    --item-alt:2rem;
    max-width: 400px;
    margin: 0 auto;

}
.feedback-box.sm-alt{
    --item-alt:2rem;
}
.feedback-box.no-max{
    max-width: none;
}
.feedback-box.no-max>*:not(.box-icon){
    max-width: 400px;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
}
.feedback-box >*:not(:last-child){

    margin-bottom: var(--item-alt);
}
.feedback-box .box-icon{
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    --icon-h: 250px;
    max-height: var(--icon-h);
}
.feedback-box .box-icon.sm-img{
    --icon-h: 220px;
}
.feedback-box .box-icon.big-img{
    --icon-h: 280px;
}
.feedback-box .box-icon img,
.feedback-box .box-icon svg{
    max-height: var(--icon-h);
}
.feedback-box .box-texts .box-title{
    font-size: var(--title-2);
    color: var(--clr-1);
    font-weight: bold;
    margin-bottom: .75rem;
}
.feedback-box .box-texts .box-title.black-clr{
    color: #000;
}
.feedback-box .box-texts .box-text{
    font-size: var(--title-5);
    color: #8E8E8E;
    margin-bottom: 0;

}
.feedback-box .box-buttons{
    display: flex;
    flex-direction:column;
    gap:1rem;
}
.feedback-box .box-buttons.sm-gap{
    gap:.75rem;
}
.feedback-box .box-btn svg{
    width:18px ;
    height: 18px;

}


.feedback-box.shipping-tender-box .shipping-timer{
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap:.5rem;
    border: 1px solid var(--clr-1);
    font-size: var(--title-2);
    color: var(--clr-1);
    font-weight: bold;
    border-radius: 100px;
    max-width: 250px;
    margin-right: auto;
    margin-left: auto;
    padding: .5rem 1rem;

}
.feedback-box.error-box .box-icon{

    --icon-h: 350px
}

@media(max-width:991.98px){

   .feedback-box.error-box .box-icon{

       --icon-h: 320px
    }

}
@media(max-width:767.98px){

    .feedback-box .box-icon.big-img{
        --icon-h: 250px;
    }
}
@media(max-width:575.98px){

    .feedback-box {
       --title-2:var(--title-3);
    }
    .feedback-box .box-icon,
    .feedback-box .box-icon.sm-img{
        --icon-h:170px ;
    }
    .feedback-box .box-texts .box-text{
        font-size: var(--title-8);
    }
    .feedback-box .box-texts .box-text.no-br br{
        display: none;
    }
    .feedback-box .box-icon.big-img{
        --icon-h: 220px;
    }

    .feedback-box.error-box .box-icon{

        --icon-h: 250px;
    }

    .feedback-box.shipping-tender-box .shipping-timer{
        max-width: 200px;
    }




}


/*------------- #orders-wrapper --------------*/

.orders-wrapper .divider{
    margin: 0 auto;
    width: 2px;
    height: 100%;
    background-color: #E9E9E9;
    border-radius: 10px;
}

.orders-wrapper .actions-btns{
    display: flex;
    align-items: center;
    justify-content: center;
    gap:1rem;

}

.orders-wrapper .actions-btns.w-max .action-btn{
    max-width: 400px;
}


@media(max-width:991.98px){

    .orders-wrapper .divider{
        width: 100%;
        height: 2px;
        margin: var(--section-padding) 0;
    }
    .orders-wrapper .cart-col{

        margin-bottom: calc((var(--section-padding)*2));
        margin-bottom: 0;
    }

    .orders-wrapper .actions-btns .action-btn{
        max-width: 400px;
    }

}
@media(max-width:575.98px){

    .orders-wrapper .actions-btns{
        gap:.75rem;
    }
    .orders-wrapper .actions-btns{
        flex-wrap: wrap;

    }
    .orders-wrapper .actions-btns .action-btn{
        max-width: none !important;
    }
}


/****** cart-col ******/

.cart-col{
    --items-alt:2rem;
}
.cart-col>*:not(:last-child){
    margin-bottom:var(--items-alt)
}
.cart-col .order-notes{
    display: flex;
    align-items: center;
    gap:0 .5rem;
    flex-wrap: wrap;
    font-weight: bold;
    margin-bottom: 1.5rem;
    font-size: var(--title-4);
}

.cart-col .order-points .coins-val{
   --size:var(--title-4);
    font-weight: bold;
}



.cart-col .order-status span{
    color: var(--clr-1);
}


.cart-items .cart-item{

    position: relative;
    margin-bottom: .75rem;

}
.cart-items .cart-item:last-child{
    margin-bottom: 0;
}
.cart-items .cart-item .store-name{
    width: 100%;
    background-color: #EEEEEE;
    border-radius: var(--border-r-3);
    font-size: var(--title-7);
    font-weight: bold;
    padding: .5rem 1rem;
    margin-bottom: .75rem;
}
.cart-items .cart-item .item-wrap{
    display: flex;
    background-color: #F9F9F9;
    border-radius: var(--border-r-2);
    padding: 1rem;
    gap: 0 1.5rem;

}
.cart-items .cart-item .item-wrap .product-img{

    position: relative;
    border-radius: var(--border-r-2);
    width: 130px;
    height: 130px;
    background-color: #F5F7F9;
}
.cart-items .cart-item .item-wrap .product-img a{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: inherit;
}
.cart-items .cart-item .item-wrap .product-img img{

    display: block;
    text-align: center;
    width: 100%;
    max-height:100% ;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
}
.cart-items .cart-item .item-wrap .product-code {
    font-size: 16px;
    color: #FF0000;
    font-weight: 500;
}
.cart-items .cart-item .item-wrap .product-img .product-code {
    position: absolute;
    bottom: 0.5rem;
    right: 0.5rem;
    font-size: 12px;
    background-color: #fff;
    border-radius: var(--border-r-3);
    padding: 0.5rem 0.5rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 1.5rem);
    z-index: 10;
}
.cart-items .cart-item .item-wrap .item-container{
    display: flex;
    flex: 1;
    gap: 0 1.5rem;
}
.cart-items .cart-item .item-wrap .product-info{
    flex: 1;
}
.cart-items.cart-page-items .cart-item .item-wrap .product-info{
    max-width:500px ;

}
.cart-items .cart-item .item-wrap .product-info>*:not(:last-child){
    margin-bottom: 1rem;
}
.cart-items .cart-item .item-wrap .product-info .product-name {

    font-size: var(--title-7);
    font-weight: bold;
    transition: all .3s ease;
}
.cart-items .cart-item .item-wrap .product-info .product-name a{
    transition:inherit;
}
.cart-items .cart-item .item-wrap .product-info .product-name a:hover{
    color: var(--clr-1);
}
.cart-items .cart-item .item-wrap .product-info .product-price{
    display: flex;
    align-items: center;
    gap:1.5rem;
}
.cart-items .cart-item .item-wrap .product-info .product-price >*{
    margin-bottom: 0;
    line-height: 1.1;
}
.cart-items .cart-item .item-wrap .product-info .product-price .price-val{
    font-size: var(--title-7);
    color: var(--clr-1);
    margin-bottom: 0;
    font-weight: 500;

}
.cart-items .cart-item .item-wrap .product-info .product-price .price-val span{
    font-size: var(--title-6);
}

.cart-items .cart-item .item-wrap .product-info .product-price .points-val{

    --size: var(--title-7);

}


.cart-items .cart-item .item-wrap .cart-actions{
    margin-inline-start: auto;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-end;
}
.cart-items .cart-item .item-wrap .cart-actions .del-btn{
    width: 40px;
    height: 40px;
    background-color: #eee;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s ease;
    color: #FF7272;
    font-size: 18px;
}
.cart-items .cart-item .item-wrap .cart-actions .del-btn svg{
    transition: inherit;
    width:18px ;
    height:18px ;
    fill:#FF7272;
}
.cart-items .cart-item .item-wrap .cart-actions .del-btn:hover{
    background-color: #FF7272;
}
.cart-items .cart-item .item-wrap .cart-actions .del-btn:hover svg{
    fill:#fff;
}
.cart-items .cart-item .item-wrap .count-wrap .count-btn{
    --dim:32px;
}
.cart-items .cart-item .item-wrap .count-wrap .count-btn.disabled{
    background-color: #eee;
}
.cart-items .cart-item .item-wrap .count-wrap .count-num{
    font-weight: bold;
    max-width: 52px;
     font-size: var(--title-7);
    background-color: transparent;
}

.cart-orders-items .cart-item  .product-qty{
    display: flex;
    justify-content:flex-end;
    align-items: center;
    gap: 0 .75rem;
    font-size: var(--title-6);
    color: #3E3E68;
    font-weight: bold;
}
.cart-orders-items .cart-item  .product-qty span{
    color: var(--clr-1);
}
.cart-orders-items .cart-item .item-wrap .cart-actions{
    justify-content: flex-end;
}

.cart-bonus-items .cart-item:not(:last-child){
    margin-bottom: 1.5rem;
}
.cart-bonus-items .cart-item .item-wrap{
    border: 1px solid #eee;
}
.cart-bonus-items .cart-item .product-points{

    --size:var(--title-6);
    background-color: #fff ;
    padding: .5rem 1rem;
    border-radius: var(--border-r-3);
    font-weight: bold;
    gap:.5rem .25rem;
}
.cart-bonus-items .cart-item .product_actions{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:1rem;
    --row-h: 45px;
}
.cart-bonus-items .cart-item .product_actions .cart-action {
    flex: 1;
    max-width: 170px;
}

.cart-summary .summary-desc{
    font-size: var(--title-6);
    color: var(--clr-1);
    font-weight: bold;
    max-width: none;
    margin-bottom:var(--items-alt);
}
.cart-summary .summary-table-wrap .table{

    margin-bottom: 0;
    position: relative;
    min-width: 500px;
}
.cart-summary .summary-table-wrap .table th{
    white-space: nowrap;
    padding: 0 .75rem;
}
.cart-summary .summary-table-wrap .table td{
    padding: .5rem .75rem;
}
.cart-summary .summary-table-wrap .table th,
.cart-summary .summary-table-wrap .table td{

    font-size: var(--title-7);
    vertical-align: middle;

}
.cart-summary .summary-table-wrap .table thead th:first-child,
.cart-summary .summary-table-wrap .table tbody td:first-child{

    padding-inline-start:0;
}
.cart-summary .summary-table-wrap .table thead th:last-child,
.cart-summary .summary-table-wrap .table tbody td:last-child{

    padding-inline-end:0;
}
.cart-summary .summary-table-wrap .table thead th:last-child,
.cart-summary .summary-table-wrap .table tbody td:last-child,
.cart-summary .summary-table-wrap .table tbody td:last-child .table-td{

    text-align: end;
    justify-content: flex-end;
}

.cart-summary .summary-table-wrap .table tbody tr:nth-last-child(2) td{
    padding-bottom: 1rem;
}
.cart-summary .summary-table-wrap .table tbody .table-td{
    display: flex;
    align-items: center;
    gap:.25rem;
    margin-bottom: 0;
    max-width: ;
    font-weight: 500;
    color: var(--clr-1);
}
.cart-summary .summary-table-wrap .table tbody .store-td{

    color: #828A89;
}
.cart-summary .summary-table-wrap .table tbody .points-td .coins-val{
   --size:var(--title-7);

}




.cart-summary .summary-table-wrap .table tbody .tr-total{

    border-top: 2px dashed rgba(184, 186, 191, 0.33);
}
.cart-summary .summary-table-wrap .table tbody .tr-total td{
    padding-bottom: .25rem;
}
.cart-summary .summary-table-wrap .table tbody .tr-total .store-td{
    color: #000;
}
.cart-summary .summary-table-wrap .table tbody .tr-total .table-td{
    font-size: var(--title-6);
    font-weight: bold;
}
.cart-summary .summary-table-wrap .table tbody .tr-total .price-td{
    font-size: var(--title-7);
}
.cart-summary .summary-table-wrap .table tbody .tr-total .price-td span{
    font-size: var(--title-6);
}
.cart-summary .summary-table-wrap .table tbody .tr-total .points-td .coins-val{
    --size: var(--title-6);
    font-weight: bold;
}
.cart-summary .summary-table-wrap .table tbody .points-val{
    display: inline-flex;
    align-items: center;
    gap:.25rem;
    font-weight: 500;
}

.bonus-col .cart-summary .summary-table-wrap .table{
    min-width: inherit;
}
.bonus-col .cart-summary .summary-table-wrap .table tbody td .td-wrap{
    display: flex;
    align-items: center;
    gap:.75rem;
}
.bonus-col .cart-summary .summary-table-wrap .table tbody td:last-child .td-wrap{
    justify-content: flex-end;
}
.bonus-col .cart-summary .summary-table-wrap .table tbody td .txt{
    font-size: 16px;
    color: #888888;
    font-weight: 500;
}
.bonus-col .cart-summary .summary-table-wrap .table tbody .table-td{
    gap:.75rem;
}


@media(max-width:991.98px){


}
@media(max-width:767.98px){

    .cart-items .cart-item .item-wrap,
    .cart-items .cart-item .item-wrap .item-container{
        gap: 0 1rem;
    }

    .cart-summary .summary-desc{
        max-width: none;
    }
    .cart-summary .summary-desc br{
        display: none;
    }

}
@media(max-width:575.98px){

    .cart-col{
        --items-alt:1.5rem;
    }
    .cart-col .order-notes{
        font-size: var(--title-5);
    }
    .cart-col .order-points .coins-val{
        --size:var(--title-5);
    }

    .cart-items .cart-item .item-wrap{
        flex-direction: column;
        gap: 1rem 0 ;
    }
    .cart-items .cart-item .item-wrap .item-container{
        flex-direction: column;
        gap:1rem 0 ;
    }
    .cart-items .cart-item .item-wrap .product-img{
        margin: 0 auto;
        width: 160px;
        height: 160px;
    }
    .cart-items .cart-item .item-wrap .cart-actions{
        margin: 0;
        flex-direction: row-reverse;
        align-items: center;
        gap:1rem;
        flex-wrap: wrap;
    }
    .cart-items .cart-item .item-wrap .cart-actions .del-btn{
        width: 38px;
        height: 38px;
    }
    .cart-items .cart-item .item-wrap .cart-actions .del-btn svg{
        width: 16px;
        height: 16px;
    }

    .cart-orders-items .cart-item .product-qty{
        justify-content: flex-start;
        font-weight: 600;
    }
    .cart-bonus-items .cart-item .product_actions{
        gap:.75rem;
    }

    .cart-summary .summary-table-wrap .table tbody .points-td svg{
        width: 16px;
        height: 16px;
    }


    .cart-items .cart-item .item-wrap .count-wrap .count-num{
        max-width: 50px;
    }


}


@media(min-width:992px) and (max-width:1199.98px){

    .orders-wrapper .row{


    }

    .orders-wrapper .row .col__lg{

        flex: 1 0 0%;
    }
    .orders-wrapper .row .col__sm{

        flex: 0 0 auto;
        width: 42%;
    }
    .orders-wrapper .row .col__divider{
        flex: 0 0 auto;
        width: 2%;
    }

    .cart-items .cart-item .item-wrap,
    .cart-items .cart-item .item-wrap .item-container{

        gap:0 1rem;
    }
    .cart-summary .summary-table-wrap .table{
        min-width: inherit;
    }

    .cart-summary .summary-table-wrap .table td{
         white-space: nowrap;
    }

}
@media(min-width:1200px){

    .orders-wrapper .row{


    }

    .orders-wrapper .row .col__lg{

        flex: 1 0 0%;
        width: auto;
    }
    .orders-wrapper .row .col__sm{

        flex: 0 0 auto;
        width: 42%;
    }
    .orders-wrapper .row .col__divider{
        flex: 0 0 auto;
        width: 3%;
    }

}
@media(min-width:992px){

      .orders-wrapper .sticky-col{
          position: sticky;
          position: -webkit-sticky;
          top: 0;
    }

}


/****** orders-col ******/

.orders-col{
    --items-alt:2rem;
}
.orders-col>*:not(:last-child){
    margin-bottom:var(--items-alt)
}

.orders-items .order-box{

    background-color: #F9F9F9;
    border-radius: var(--border-r-2);
    margin-bottom: 1.5rem;
    border: 1px solid #eee;
}
.orders-items .row{
    gap:1.5rem 0;
}
.orders-items .order-box:last-child{
    margin-bottom: 0;
}
.orders-items .order-box.active{
    border-color:#0083BE ;
    background-color:#F9FDFF ;
}
.orders-items .order-box .box-item{
    padding: 1rem;
    border-bottom: 2px dashed rgba(184, 186, 191, 0.33);
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}
.orders-items .order-box .box-item:last-child{
    border-bottom: none;
}

.orders-items .order-box .box-head{
    gap: .25rem 1rem;
    flex-wrap: wrap;
}
.orders-items .order-box .box-head>*{
    font-size: var(--title-6);
}
.orders-items .order-box .box-head .head-title{

    font-weight: bold;
    margin-bottom: 0;
    flex-shrink: 0;
}
.orders-items .order-box .box-head .head-title.done{
    color: #44EA62;
}
.orders-items .order-box .box-head .head-title.fail{
    color: #FF7272;
}
.orders-items .order-box .box-head .head-title.returns{
    color: #FFBF00;
}
.orders-items .order-box .box-head .head-link{
    display: inline-flex;
    color: var(--clr-1);
    font-weight: 500;
    transition: all .3s ease;
    border-bottom: 1px solid var(--clr-1);
}
.orders-items .order-box .box-head .head-link:hover{
     color: var(--clrBlack);
     border-color: var(--clrBlack);
}

.orders-items .order-box .box-body .row{
    flex: 1;
    gap:1rem 0;
}
.orders-items .order-box .box-body .info-item{
    display: flex;
    align-items: baseline;
    justify-content: flex-start;
    gap: .25rem 1rem;
    flex-wrap: wrap;
}
.orders-items .order-box .box-body .info-item >*{
    font-size: var(--title-7);
    font-weight: 500;
    margin-bottom: 0;
}
.orders-items .order-box .box-body .info-item .item-title{
    flex-shrink: 0;
}
.orders-items .order-box .box-body .info-item .item-val{
    color: var(--clr-1);

}

.orders-items .order-box .box-footer{
    gap:1rem 0;
    flex-direction: column;
    align-items: flex-start;
}
.orders-items .order-box .box-footer .footer-row{
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: var(--title-7);
    gap: .25rem 1rem;
    flex-wrap: wrap;
    width: 100%;
}
.orders-items .order-box .box-footer .footer-row.texts-row >*{
    margin-bottom: 0;
    font-weight: 500;
}
.orders-items .order-box .box-footer .footer-title{

    color: #3E4958;
    flex-shrink: 0;

}
.orders-items .order-box .box-footer .footer-val{
    color: var(--clr-1);
    word-break: break-word;
     margin-bottom: 0;
    font-weight: 500;
    /*
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    */
}
.orders-items .order-box .box-footer .contact-link{
    color: #828A89;
    display: flex;
    align-items: center;
    transition: all .3s ease;
    gap:.25rem;
    margin-inline-start: auto;
}
.orders-items .order-box .box-footer .contact-link svg{
    fill:var(--clr-1);
    width: var(--title-4);
    height: var(--title-4);
    transition: inherit;
}
.orders-items .order-box .box-footer .contact-link:hover{
   color: var(--clrBlack);
}
.orders-items .order-box .box-footer .contact-link:hover svg{
    fill: var(--clrBlack);
}
.orders-items .order-box .box-footer .box-rate{
    display: flex;
    align-items: center;
    gap:.25rem;
}
.orders-items .order-box .box-footer .box-rate .rate-link{
    font-size: 16px;
    color: var(--clr-1);
    border-bottom: 1px solid;
    display: inline-flex;
    align-items: center;
    font-weight: 500;
    transition: all .3s ease
}
.orders-items .order-box .box-footer .box-rate .rate-link:hover{
    color: var(--clrBlack);
}
.orders-items .order-box .box-footer .box-rate .rate-link.edit-rate{
    font-size: calc(var(--title-7) - 2px)
}
.orders-items .order-box .box-footer .box-rate .rate-link.rate-add{
    font-size: var(--title-7);
}

@media(max-width:575.98px){

    .orders-col{
        --items-alt:1.5rem;
    }



    .orders-items .order-box .box-body .info-item{
        justify-content: space-between;
        gap:0 .75rem;
        flex-wrap: nowrap;
    }
    .orders-items .order-box .box-body .info-item .item-val{
        text-align: end;
    }
    .orders-items .order-box .box-head .head-link{
        font-size: var(--title-7)
    }

    .orders-items .order-box .box-footer .box-rate .rateit.star-md{
        font-size: 30px;
    }
}

/*------------- #order-options-section --------------*/




.order-options-box{
    --items-alt:2rem;
}
.order-options-box form{
    width: 100%;
    margin-bottom: 0;
}
.order-options-box .box-title{
    font-size: var(--title-2);
    font-weight: bold;
    margin-bottom: var(--section-padding);

}
.order-options-box .options-container{
    max-width: inherit;
    --items-alt:2rem;
}
.order-options-box .options-container>*:not(:last-child){
    margin-bottom:var(--items-alt)
}
.order-options-box .options-items >*:not(:last-child){
    margin-bottom: 1rem;
}
.order-options-box .options-items .option-title{
    font-weight: bold;
    font-size: var(--title-6);
    color:#474747 ;
    padding-bottom: 0;
}
.order-options-box .options-items .option-item{
    position: relative;
    cursor: pointer;
    width: 100%;
    --input-dim:22px;
}
.order-options-box .options-items .option-item .form-check{
    padding: 0;
    margin: 0;
    position: relative;
}
.order-options-box .options-items .option-item .form-check label{

    background-color: #fff;
    border: 1px solid rgba(0, 131, 190, 0.2);
    border-radius: var(--border-r-2);
    width: 100%;
    display: flex;
    align-items: center;
    gap:.5rem;
    padding: 1.25rem 1rem;
    font-size: var(--title-7);
    font-weight: bold;
    color: #474747;
    transition: all .3s ease;
    cursor: pointer;
    padding-left: calc(var(--input-dim) + 1rem + .5rem);
    min-height: 70px;

}
.order-options-box .options-items .option-item .form-check label span{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
}
.order-options-box .options-items .option-item .form-check label img{
    max-height: 35px;
}
.order-options-box .options-items .option-item .form-check label.active{
    background-color:#DBF4FF ;
    border-color: var(--clr-1);
    color: var(--clr-1);
    pointer-events: none;

}
.order-options-box .options-items .option-item .form-check .form-check-input{

    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: .75rem;
    border-color: #ACACAC;
    width: var(--input-dim);
    height: var(--input-dim);
    float: none;
    margin: 0;
    padding: 0;
}
.order-options-box .options-items .option-item .form-check .form-check-input:checked{
    border-color: var(--clr-1);
}
.order-options-box .actions-btns{
    display: flex;
    align-items: center;
    justify-content: center;
    gap:1rem;
}
.order-options-box .box-img{
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    --img-h:300px;
}
.order-options-box .box-img img{
    max-height: var(--img-h);
    max-width: 420px;

}

@media(max-width:991.98px){
    .order-options-box .actions-btns .action-btn{
        max-width: 400px;
    }
    .order-options-box .box-img{
        --img-h:250px;
        margin-bottom: var(--section-padding);

    }
}
@media(max-width:767.98px){

    .order-options-box .box-img{
        --img-h:200px;
        margin-bottom: var(--items-alt);
    }
}
@media(max-width:575.98px){

    .order-options-box{
        --items-alt:1.5rem;
    }
    .order-options-box .options-items .option-item{
        --input-dim:20px;
    }
    .order-options-box .options-items .option-title{
        padding-bottom: 0;
    }
    .order-options-box .options-items .option-item .form-check label{

        padding: 1.25rem .75rem;
        padding-left: calc(var(--input-dim) + .75rem + .5rem);

    }
    .order-options-box .actions-btns{
        gap:.75rem;
    }
    .order-options-box .actions-btns .action-btn{
        max-width: none;
    }
    .order-options-box .box-img{
        --img-h:150px;

    }
}



/*------------- #search-section --------------*/

.search-area .search-box{
    max-width: none;
}
.search-area .search-box form{

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    --item-alt: 2rem;

}
.search-area .search-box form >*:not(:last-child){
    margin-bottom: var(--item-alt)
}
.search-area .search-box .search-group{
    width: 100%;
    max-width: 700px;
    margin: 0 auto;
}
.search-area .search-box .search-group input{
    --px:1rem;
    height: 80px;
    font-size: var(--title-6);
    padding-right:calc(var(--px) + var(--title-6) + .5rem ) ;
    padding-left: calc(var(--px) + var(--title-6) + .5rem );
    color:#828A89 ;

}
.search-area .search-box .search-group input::placeholder{
    color:#828A89 ;
}
.search-area .search-box .search-group .float-btn{
    position: absolute;

    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    font-size: var(--title-7);
    color: #828A89;
    transition: all .3s ease
}
.search-area .search-box .search-group .search-icon{
    right: 1rem;
    pointer-events: none;
}
.search-area .search-box .search-group .more-btn{
    left: 1rem;
    cursor: pointer;
}
.search-area .search-box .search-group .more-btn:hover{
    color: var(--clr-1);
}
.search-area .search-box .box-btn{
    max-width: 300px;
}

@media(max-width:575.98px){

    .search-area .search-box{
       /* --title-6:var(--title-7); */
    }
    .search-area .search-box .search-group input{
        --px:.75rem;
        height: 70px;
    }
    .search-area .search-box .box-btn{
        max-width: 200px;
    }
}

/*------------- #terms-section --------------*/

.terms-area .terms-texts p{

    text-align: justify;
    margin-bottom: .75rem;
    font-weight: 500;
    line-height: 1.8;
    font-size: var(--title-7);
}
.terms-area .terms-texts p:last-child{
    margin-bottom: 0;
}


/*------------- #notifications-section --------------*/

.notifications-items .notify-box {
    position: relative;
    background-color: #ffff;
    border: 1px solid #DEDEDE;
    border-radius: var(--border-r-2);
    margin-bottom: 1.5rem;
    --del-dim:40px;
}
.notifications-items .notify-box:last-child{
    margin-bottom: 0;
}
.notifications-items .notify-box .box-item{
    padding: 1rem;
}
.notifications-items .notify-box .box-head{
    border-bottom: 2px dashed rgba(184, 186, 191, 0.33);
    color: var(--clr-1);
    font-weight: bold;
    font-size: var(--title-6);

}
.notifications-items .notify-box .box-body{
    display: flex;
    gap:0 1rem ;
}
.notifications-items .notify-box .box-body .box-img{
    display: flex;
    align-items: center;
    justify-content: center;
    align-items: center;
    border-radius: var(--border-r-2);
    background-color: #eee;
    width: 80px;
    height:80px ;
    flex-shrink: 0;
}
.notifications-items .notify-box .box-body .box-img img,
.notifications-items .notify-box .box-body .box-img svg{
    width: 100%;
    height: 100%;

}
.notifications-items .notify-box .box-body .box-img img{
    object-fit: cover;
    border-radius: inherit;
}
.notifications-items .notify-box .box-body .box-content{
    display: flex;
    align-items: flex-end;
    gap:.5rem 1rem ;
    flex-direction: column;

}
.notifications-items .notify-box .box-body .box-text{
    font-size: var(--title-7);
    font-weight: 500;
    margin-bottom: 0;
    flex: 1;
    height: 100%;
    text-align: justify;
}
.notifications-items .notify-box .box-body .del-btn{
    width: var(--del-dim);
    height: var(--del-dim);
    background-color: #F0F0F2;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s ease;
    color: #FF7272;
    font-size: 18px;
}
.notifications-items .notify-box .box-body .del-btn svg{
        transition: inherit;
    width: 18px;
    height: 18px;
    fill: #FF7272;
}
.notifications-items .notify-box .box-body .del-btn:hover{
    background-color:#FF7272 ;
}
.notifications-items .notify-box .box-body .del-btn:hover svg{
    fill:#fff;
}

@media(max-width:575.98px){


    .notifications-items .notify-box{
        padding-bottom: calc((var(--del-dim)/2));
        margin-bottom: calc(1rem + (var(--del-dim)/2));
    }
    .notifications-items .notify-box:last-child{
        margin-bottom: calc((var(--del-dim)/2));
    }
    .notifications-items .notify-box .box-body .del-btn{
        z-index: 10;
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        margin-bottom: calc((var(--del-dim)/2)*-1);
    }
    .notifications-items .notify-box .box-body .box-img{
        width: 60px;
        height: 60px;
    }
    .notifications-items .notify-box .box-body{
         gap:0 .75rem ;
    }

}

/*------------- #about-section --------------*/

.about-area .about-box {
    --items-alt:2rem;
}
.about-area .about-box .about-banner{

    border-radius: var(--border-r-2);
    background-color: var(--clr-1);
    padding:1.5rem 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap:.75rem;
    min-height:180px ;
    margin-bottom: var(--items-alt);
}
.about-area .about-box .about-banner img{
    height: 75px;
    max-height: 80px;
}
.about-area .about-box .about-banner span{
    color: #fff;
    font-size: var(--title-8);
    font-weight: 500;
}
.about-area .about-box .box-title{
    font-size: var(--title-2);
    font-weight: bold;
    margin-bottom: 1.5rem;
}
.about-area .about-box .box-text{
    font-size: var(--title-7);
    text-align: justify;
    font-weight: 500;
    margin-bottom: 0;

}
@media(max-width:575.98px){
    .about-area .about-box {
        --items-alt:1.5rem;
    }
    .about-area .about-box .box-title{
        margin-bottom: 1rem;
    }
    .about-area .about-box .about-banner{
        min-height: inherit
    }

}

/*------------- #contact-section --------------*/
.contact-area .contact-box{

    max-width:700px ;
    margin: 0 auto;
    --items-alt:2rem;
}
.contact-area .contact-box .contact-info{
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;

}
.contact-area .contact-box .contact-info .contact-logo{
    background-color: var(--clr-1);
    border-radius: 40px;
    width: 180px;
    height: 180px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    gap:.75rem;
    padding: .75rem;
}
.contact-area .contact-box .contact-info .contact-logo img{
    height: 75px;
    max-height: 80px;

}
.contact-area .contact-box .contact-info .contact-logo span{
    color: #fff;
    font-weight: 500;
    font-size: 16px;
}
.contact-area .contact-box .contact-info .info-text{
    font-size: var(--title-4);
    font-weight: bold;
    margin-bottom: 0;
    margin-top: .75rem;
}


.contact-area .contact-box .contact-items .row{
    gap:1.5rem 0;
}
.contact-area .contact-box .contact-items .contact-item{
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    color: #3E4958;
    transition: all .3s ease;
}

.contact-area .contact-box .contact-items .contact-item .item-icon{
    width: 70px;
    height: 70px;
    border-radius: var(--border-r-3);
    flex-shrink: 0;
    background-color: transparent;
    transition: inherit;
}
.contact-area .contact-box .contact-items .contact-item .item-icon svg,
.contact-area .contact-box .contact-items .contact-item .item-icon img{
    width: 100%;
    height: 100%;
    transition: inherit;
}
.contact-area .contact-box .contact-items .contact-item .item-texts,
.contact-area .contact-box .contact-items .contact-item .item-texts>*{
    transition: inherit;
}
.contact-area .contact-box .contact-items .contact-item .item-texts .item-title{
    font-size: var(--title-8);
    font-weight: bold;
    margin-bottom: 0;

}
.contact-area .contact-box .contact-items .contact-item .item-texts .item-desc{
    margin-bottom: 0;
    font-size: 16px;

}
.contact-area .contact-box .contact-items .contact-item:hover .item-texts>*{
    color: var(--clr-1);
}

@media(max-width:767.98px){

    .contact-area .contact-box .contact-info{
        margin-bottom: var(--items-alt);
    }
}

@media(max-width:575.98px){
    .contact-area .contact-box{
        --items-alt:1.5rem;
    }

    .contact-area .contact-box .contact-items .contact-item .item-icon{
        width: 60px;
        height: 60px;
    }
}

/*------------- #user-dashboard-section --------------*/

/**** dashboard-home ****/
.user-dashboard-area .dashboard-home{
    --items-alt:var(--section-padding);
}
.user-dashboard-area .dashboard-home>*:not(:last-child){
    margin-bottom: var(--items-alt)
}
.user-dashboard-area .dashboard-home .user-about{
    display: flex;
    align-items: flex-start;
    gap:1rem 1.5rem;
}
.user-dashboard-area .dashboard-home .user-about .user-img{
    flex-shrink: 0;
    position: relative;
    --dim:140px;
}
.user-dashboard-area .dashboard-home .user-about .user-img img{
    width:var(--dim) ;
    height: var(--dim) ;
    display: block;
    border-radius: 100%;
    object-fit: cover;
}
.user-dashboard-area .dashboard-home .user-about .user-info{
    flex: 1;
    width: 100%;
}
.user-dashboard-area .dashboard-home .user-about .user-info .user-name{
    font-size: var(--title-2);
    font-weight: bold;
    margin-bottom: 0;

}
.user-dashboard-area .dashboard-home .user-about .user-info .user-id{
    font-size: var(--title-8);
    color: #7D848D;
    margin-top: .5rem;
    margin-bottom: 1rem;
}
.user-dashboard-area .dashboard-home .user-about .user-info .info-row{
    display: inline-flex;
    border: 1px solid #E8E8E8;
    box-shadow: 0px 6px 16px rgba(189, 198, 211, 0.12);
    border-radius: var(--border-r-2);
}
.user-dashboard-area .dashboard-home .user-about .user-info .info-row .info-item{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    flex: 1;
    padding: .75rem 1rem;
    border-left: 1px solid #E8E8E8;
}
.user-dashboard-area .dashboard-home .user-about .user-info .info-row .info-item:last-child{
    border: none;
}
.user-dashboard-area .dashboard-home .user-about .user-info .info-row .info-item .item-title{
    font-size: var(--title-8);
    margin-bottom: .375rem;
    font-weight: 500;
}
.user-dashboard-area .dashboard-home .user-about .user-info .info-row .info-item .item-val{
    font-size: var(--title-8);
    color: var(--clr-1);
    font-weight: 500;
    margin-bottom: 0;
    display: inline-flex;
    align-items: center;
    font-weight: bold;
}
.user-dashboard-area .dashboard-home .user-about .user-info .info-row .info-item .points-val{
    color: #FFBF00;
    gap:.25rem;


}
.user-dashboard-area .dashboard-home .user-about .user-info .info-row .info-item .points-val svg{
    width: 18px;
    height: 18px;
}
.user-dashboard-area .dashboard-home .dashboard-list .row {
    gap: 1.5rem 0;
}
.user-dashboard-area .dashboard-home .dashboard-list .list-item{
    display: inline-flex;
    align-items: center;
    gap:.625rem;
    font-size: var(--title-4);
    font-weight: 500;
    transition: all .3s ease;
}
.user-dashboard-area .dashboard-home .dashboard-list .list-item:hover{
    color: var(--clr-1);
}
.user-dashboard-area .dashboard-home .dashboard-list .list-item .item-icon{
    --dim:55px;
    width: var(--dim);
    height:var(--dim) ;
    flex-shrink: 0;
}
.user-dashboard-area .dashboard-home .dashboard-list .list-item .item-icon img,
.user-dashboard-area .dashboard-home .dashboard-list .list-item .item-icon svg{
    width: 100%;
    height: 100%;
}
@media(max-width:767.98px){

    .user-dashboard-area .dashboard-home .user-about{
        gap:1rem;
    }
    .user-dashboard-area .dashboard-home .dashboard-list .list-item{
        font-size:var(--title-5)
    }
}
@media(max-width:575.98px){

    .user-dashboard-area .dashboard-home{
        --items-alt:1.5rem;
    }
    .user-dashboard-area .dashboard-home .user-about{
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap:.75rem;
    }
    .user-dashboard-area .dashboard-home .user-about .user-info .info-row{
        display: flex;

    }
    .user-dashboard-area .dashboard-home .user-about .user-info .info-row .info-item{
        padding: .75rem .5rem;
    }
    .user-dashboard-area .dashboard-home .user-about .user-img{
        --dim:120px;
    }
    .user-dashboard-area .dashboard-home .dashboard-list .list-item .item-icon{
        --dim:50px;
    }
    .user-dashboard-area .dashboard-home .user-about .user-info .user-id{
        margin-bottom: .75rem;
        margin-top: .25rem;
    }
    .user-dashboard-area .dashboard-home .dashboard-list .row .row-col:nth-last-child(3){
        order: 10;
    }
    .user-dashboard-area .dashboard-home .dashboard-list .row .row-col:last-child{
        order: 11;
    }

}


/**** user-data-box ****/
.user-dashboard-area .user-data-box{
    border: none;

}
.user-dashboard-area .user-data-box .box-container{
    --item-alt:2rem;
    padding: 0;
}
.user-dashboard-area .user-data-box .form-group .upload-img{
    justify-content: center;
    --dim:170px;
    margin-bottom: calc(var(--item-alt) - 1rem);
    padding-bottom: .25rem;
}
.user-dashboard-area .user-data-box .box-buttons{
    flex-direction: row;
    padding-top: calc(var(--item-alt) - 1rem)
}
@media(max-width:575.98px){

    .user-dashboard-area .user-data-box .box-container{
        --item-alt:1.5rem;
    }
    .user-dashboard-area .user-data-box .form-group .upload-img{
        --dim:140px;
    }
    .user-dashboard-area .user-data-box .box-buttons{
       gap:.75rem;
    }
}


/**** invite-box ****/
.user-dashboard-area .invite-box{
    --item-alt:2rem;
}
.user-dashboard-area .invite-box .box-texts{
    text-align: start;
}
.user-dashboard-area .invite-box .box-texts>:not(:last-child){
    margin-bottom: 1rem;
}
.user-dashboard-area .invite-box .points-val{
    display: flex;
    align-items: center;
    gap:.75rem;
}
.user-dashboard-area .invite-box .points-val svg{
    width: 80px;
    height: 80px;
}
.user-dashboard-area .invite-box .points-val p{
    font-weight: 500;
    font-size: var(--title-8);
    margin-bottom: 0;
}
.user-dashboard-area .invite-box .points-val span{
    display: block;
    font-size: var(--title-2);
    color: #FFBF00;
    text-align: center;
    font-weight: bold;
    line-height: 1.2;
}
.user-dashboard-area .invite-box .invite-link .form-label{
    font-size: var(--title-8);
    font-weight: 500;
    margin-bottom: .5rem;
}
.user-dashboard-area .invite-box .invite-link .copied__viewbox{


    border-radius: var(--border-r-2);
    position: relative;
    overflow: hidden;
    --h:60px;
    transition: all .3s ease;
}
.user-dashboard-area .invite-box .invite-link .copied__viewbox>*{
    text-align: center;
    border-radius: inherit;
    font-size: var(--title-7);
    transition:inherit;
    font-weight: 500;
    display: block;
    height: var(--h);
    line-height: var(--h);

}
.user-dashboard-area .invite-box .invite-link .copied__viewbox .copied__item{
    border: 1px solid #ced4da ;
    background-color: #fff;
    padding: 0 .75rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--clr-1);
    cursor: pointer;
    direction: ltr;
}
.user-dashboard-area .invite-box .invite-link .copied__viewbox .confirm__copied{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #58C27D;
    border: 1px solid #58C27D ;
    color: #fff;
    opacity: 0;
    z-index: -1;
}
.user-dashboard-area .invite-box .invite-link .copied__viewbox .confirm__copied.active{

    opacity: 1;
    z-index: 10;
}
@media(max-width:575.98px){
    .user-dashboard-area .invite-box{
        --item-alt:1.5rem;
    }

     .user-dashboard-area .invite-box .points-val svg {

        width: 60px;
        height: 60px;
    }
}


/**** qr-box ****/

/**** survey-box ****/
.survey-area .survey-items{
    --items-alt:var(--section-padding);
}
.survey-area .survey-items .survey-item:not(:last-child){

    margin-bottom: var(--items-alt)
}
.survey-area .survey-item .item-title{
    font-weight: bold;
    font-size: var(--title-4);
    margin-bottom: 2rem;
}
.survey-area .survey-item .choices-items>*:not(:last-child){
    margin-bottom: 1rem;
}
.survey-area .survey-item .choices-items .choose-title{

    font-weight: bold;
    font-size: var(--title-8);
    color: #474747;

}
.survey-area .survey-item .choose-item {
    position: relative;
    cursor: pointer;
    width: 100%;
    --input-dim:22px;
    max-width: 850px;
}
.survey-area .survey-item .choose-item .form-check{
     padding: 0;
    margin: 0;
    position: relative;

}
.survey-area .survey-item .choose-item .form-check label{
    background-color: #fff;
    border: 1px solid #EBEBEB;
    border-radius: var(--border-r-2);
    width: 100%;
    display: flex;
    align-items: center;
    padding: 1.25rem 1rem;
    font-size: var(--title-7);
    font-weight: 500;
    color: #828A89;
    transition: all .3s ease;
    cursor: pointer;
    padding-left: calc(var(--input-dim) + 1rem + .75rem);
    min-height: 70px;
     text-align: justify;
}
.survey-area .survey-item .choose-item .form-check label.active{
    border-color: var(--clr-1);
    pointer-events: none;
}
.survey-area .survey-item .choose-item .form-check label p{
    margin-bottom: 0;
    display: inline ;
}
.survey-area .survey-item .choose-item .form-check label .survey-conetnt{
    display: flex;
    align-items: baseline;
    gap:0 .625rem;
}
.survey-area .survey-item .choose-item .form-check label .survey-val{
    font-weight: bold;
    display: inline-flex;
    align-items: center;
    position: relative;
    color: var(--clr , #828A89);
    gap:0 .25rem;
    /*padding-inline-end:calc(.625rem - 2px); */

}
.survey-area .survey-item .choose-item .form-check label .survey-val::after{
    display: block;
    content: '';
    position: relative;
    width: 16px;
    height:16px ;
    background-color: var(--clr);
    -webkit-clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);

}
.survey-area .survey-item .choose-item .form-check label .survey-val.excellent{
    --clr:#44EA62;

}
.survey-area .survey-item .choose-item .form-check label .survey-val.good{
    --clr:#4744EA;
}
.survey-area .survey-item .choose-item .form-check label .survey-val.bad{
    --clr:#CB0049;

}
.survey-area .survey-item .choose-item .form-check .form-check-input{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: .75rem;
    border-color: #ACACAC;
    width: var(--input-dim);
    height: var(--input-dim);
    float: none;
    margin: 0;
    padding: 0;
}
.survey-area .survey-item .choose-item .form-check .form-check-input:checked{
    border-color: var(--clr-1);
}
@media(max-width:991.98px){

    .survey-area .survey-item .choose-item{
        max-width: none;
    }
}
@media(max-width:575.98px){

    .survey-area .survey-item .item-title{
        margin-bottom: 1.5rem;
    }

    .survey-area .survey-item .choose-item{
        --input-dim:20px;
    }
    .survey-area .survey-item .choose-item .form-check label{
        padding: 1.25rem 0.75rem;
        padding-left: calc(var(--input-dim) + 0.75rem + 0.5rem);
    }
    .survey-area .survey-item .choose-item .form-check label .survey-conetnt{
        gap:0 .5rem;
    }

    /*
    .survey-area .survey-item .choose-item .form-check label .survey-val{
        padding-inline-end:calc(.5rem - 2px);
    }*/
    .survey-area .survey-item .choose-item .form-check label .survey-val::after{
        width: 14px;
        height: 14px;
    }

    /****remove input****/
    .survey-area .survey-item .choose-item .form-check label{
        padding: 1.25rem 0.75rem;
    }
    .survey-area .survey-item .choose-item .form-check .form-check-input{
        width: 0;
        height: 0;
        opacity: 0;

    }

}

/**** favorite-area ****/

.user-dashboard-area .favorite-area .top-head{

    margin-bottom: var(--section-padding);
}
.user-dashboard-area .favorite-area .top-head .main-title{
    margin-bottom: 1.5rem;
}
.user-dashboard-area .favorite-area .top-head .favorite-tabs-btns{
    display: flex;
    align-items: center;
    gap:.75rem 1rem;
}
.user-dashboard-area .favorite-area .top-head .favorite-tabs-btns .btn-item{
    display: block;
    font-size: var(--title-6);
    color: #8B8B8B;
    border-radius: var(--border-r-2);
    transition: all .3s ease;
    padding: .75rem 1rem;
    border:1px solid #E7E7E7 ;
    font-weight: 500;
    width: 100%;
    max-width: 200px;
}
.user-dashboard-area .favorite-area .top-head .favorite-tabs-btns .btn-item.active{
    background-color: var(--clr-1);
    border-color: var(--clr-1);
    color: #fff;
}
.user-dashboard-area .favorite-area .top-head .favorite-tabs-btns .btn-item:not(.active):hover{
    background-color: #eee;
}

@media(max-width:575.98px){
    .user-dashboard-area .favorite-area .top-head .main-title{
        margin-bottom: 1.25rem;
    }
    .user-dashboard-area .favorite-area .top-head .favorite-tabs-btns{
        gap:.75rem;
    }
}

/*------------- #stores --------------*/

.stores-area .store-item{
    display: inline-flex;
    align-items:center;
    gap:.75rem ;
    max-width: 100%;
    height: 100%;
    overflow: hidden;
    --dim:53px;

}
.stores-area .store-item >*{
    transition: inherit;
}
.stores-area .store-item .store-img{
    flex-shrink: 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--dim);
    height: var(--dim);
}
.stores-area .store-item .store-img img,
.stores-area .store-item .store-img svg{
    width: 100%;
    max-height:100% ;
    object-fit: contain;
}
.stores-area .store-item .store-info{
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:.75rem ;
    max-width: 100%;

}
.stores-area .store-item .store-texts {
    overflow: hidden;
    transition: all .3s ease;
}
.stores-area .store-item .store-texts>*{
    transition: inherit;
}
.stores-area .store-item .store-name{
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;


}
.stores-area .store-item .store-num{
    font-size: 14px;
    color: #828A89;
    margin-top: .375rem;
    display: block;
    font-weight: 500;
}
.stores-area .store-item:hover .store-name{
    color: var(--clr-1);
}


.stores-area .stores-boxes .row{
    gap:1.5rem 0;
}
.stores-area .stores-boxes .store-box{
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    transition: all .3s ease;
    border-radius: var(--border-r-4);
    border: 1px solid #E9E9E9;
    padding: 1rem;
}
.stores-area .stores-boxes .store-box .store-item{
    flex: 1;
}
.stores-area .stores-boxes .store-box .store-item .store-name{
    display: block;

}
.stores-area .stores-boxes .store-box .store-rate{
    display: flex;
    align-items: center;
    gap:2px;
}
.stores-area .stores-boxes .store-box .store-rate span{
    display: inline-block;
    color: #CBCBCB;
    font-size: var(--title-8);
}
.stores-area .stores-boxes .store-box .store-rate span.fill{
    color: #EAC92C;
}
.stores-area .stores-boxes .store-box .store-rate .rateit {
    font-size: 26px;
}
.stores-area .stores-boxes .store-box .rate-text{
    font-size: 14px;
    display: block;
    color:#474747 ;
    margin-bottom: .2rem;
    font-weight: 500;
}
.stores-area .stores-boxes .store-box .favourite-action{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}





.all-stores-area .stores-boxes .store-box:hover{
    border-color: var(--clr-1);
}
.all-stores-area .stores-boxes .store-box:hover .store-item .store-name{
    color: var(--clr-1);
}

.favorite-stores-area .stores-boxes .store-box{
    gap:.75rem;
}
.favorite-stores-area .stores-boxes .store-box .store-item{
    flex: initial;
}
.favorite-stores-area .stores-boxes .store-box .favourite-action{
    margin-inline-start: auto;
}


.top-stores-area .divider{
    width: 100%;
    background-color: #DFDFDF;
    height: 1px;
    border-radius: 5px;
}
.top-stores-area .target-row{
    gap:1.5rem 0;
    align-items: initial;

}
.top-stores-area .scroll-boxes .store-wrap{
    display: flex;
}
.top-stores-area .main-title .title{
    font-size: var(--title-3);
}
.top-stores-area .show-more-wrap{
    margin-top: var(--section-padding)
}
@media(min-width:768px) and (max-width:1199.98px){
    .top-stores-area .scroll-boxes .store-wrap{
        display: flex;
        justify-content: center;
        text-align: center;
    }
    .top-stores-area .scroll-boxes .store-item{
        flex-direction: column;
        justify-content: center;
    }

}
@media(min-width:768px) and (max-width:991.98px){

    .top-stores-area .scroll-boxes .target-row .store-wrap:nth-child(6),
    .top-stores-area .scroll-boxes .target-row .store-wrap:nth-child(12){
        display: none;
    }
}


@media(max-width:1199.98px){

    .stores-area .stores-boxes .store-box{
        padding-right: .75rem;
        padding-left: .75rem;
    }


}
@media(max-width:991.98px){

    .top-stores-area .scroll-boxes .target-row{
        gap:1rem 0;
    }

}
@media(max-width:767.98px){


    .top-stores-area  .scroll-boxes{
        display: block;
        overflow-x: auto;
        overflow-y: hidden;
        margin: 0 -.75rem;
        width: inherit;
        padding: .75rem 0 ;
        border-bottom: 1px solid #DFDFDF;
        border-top: 1px solid #DFDFDF;
    }
    .top-stores-area  .scroll-boxes .target-row{
        flex-wrap: nowrap;
        justify-content: flex-start;
        margin: 0;
        transform: none;
        gap:0 ;
    }
    .top-stores-area  .scroll-boxes .store-wrap{

        padding: 0;
        width: auto;
        flex: inherit;
        flex-shrink: 0;
        max-width: 500px;
        padding: 0 .75rem;

    }
    .top-stores-area  .scroll-boxes .store-wrap:not(:last-child){
        border-left: 1px solid #DFDFDF;

    }
    .top-stores-area .scroll-boxes .store-item .store-name{
        display: block;
        white-space: nowrap;
    }

    .top-stores-area .show-more-wrap{
        margin-top: 1.5rem;
    }

}
@media(max-width:575.98px){


    .stores-area .stores-boxes .row{
        gap:1rem 0;
    }

    .stores-area .stores-boxes .store-box .btn-wishlist{
       --dim:36px;
       --svg-dim:16px;

    }



}
@media(max-width:575.98px) , (min-width:768px) and (max-width:1199.98px){

    .all-stores-area .stores-boxes .store-box{
        padding: .75rem;
    }
    .all-stores-area .stores-boxes .store-box .store-item{
        align-items: flex-start;

    }
    .all-stores-area .stores-boxes .store-box .store-item .store-info{
        flex-direction: column;
        align-items: flex-start;
        gap:.5rem;
    }
    .all-stores-area .stores-boxes .store-box .rate-text{
        font-size: 12px;
        margin-bottom: 0;
    }




}

/*------------- #store-section --------------*/

.store-area>*:not(:last-child){
    --item-alt:var(--section-padding);
    margin-bottom: 1.5rem;
}
.store-area .store-info {
    display: flex;
    align-items: flex-start;
    gap:0 1rem
}
.store-area .store-info .store-details{
   width: 100%;
    --items-alt:.75rem;
}
.store-area .store-info .store-details >*:not(:last-child){
    margin-bottom: var(--items-alt);
}
.store-area .store-info .store-img{
    --dim:100px;
    width: var(--dim);
    height:var(--dim) ;
    flex-shrink: 0;
    position: relative;
}
.store-area .store-info .store-img img{
    width: 100%;
    max-height: 100%;/*
    border-radius: 100%;
    object-fit: cover;*/
}
.store-area .store-info .store-name {
    font-size: var(--title-4);
    font-weight: bold;
    display: flex;
    align-items: center;
    gap:.25rem;
}
.store-area .store-info .store-name svg{
    width: 20px;
    height:20px ;

}
.store-area .store-info .store-num{
    font-size: var(--title-4);
    font-weight: 500;
    color: var(--clr-1);
}
.store-area .store-info .store-flex{
    display: flex;
    align-items: center;
    gap:.75rem 2rem;
}
.store-area .store-info .store-flex .store-users{
    display: inline-flex;
    align-items: center;
    color: var(--clr-1);
    font-weight: 500;
    font-size: var(--title-8);
    gap:.25rem;
}
.store-area .store-info .store-flex .store-users svg{
    width: 24px;
    height: 24px;
}
.store-area .store-info .store-flex .rate-wrap{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap:.25rem .5rem;
}
.store-area .store-info .store-flex .rate-wrap .rate-btn{
    font-size: 14px;
    color: var(--clr-1);
    display: inline-flex;
    align-items: center;
    transition: all .3s ease;
    border-bottom: 1px solid ;
    font-weight: 500;
}
.store-area .store-info .store-flex .rate-wrap .rate-btn:hover{
    color: var(--clrBlack)
}
.store-area .store-info .store-flex .rate-wrap .rateit {
    font-size: 34px;
}

.store-area .store-info .store-actions{
    display: flex;
    align-items: center;
    flex-direction: row;
    gap:.75rem ;
    padding-top: .75rem;
}
.store-area .store-info .store-actions .actions-btns{
    display: flex;
    align-items: flex-start;
    flex-direction: row;
    gap:  .75rem ;
}
.store-area .store-info .store-actions .actions-btns .action-btn{
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 100%;

    font-size: 18px;
    transition: all .3s ease;

}
.store-area .store-info .store-actions .actions-btns .action-btn svg{
    width: 20px;
    height: 20px;
    transition: inherit;

}


.store-area .store-info .store-actions .actions-btns .action-btn.share-btn{
    background-color: var(--clr-1);
    border: 1px solid var(--clr-1);

}
.store-area .store-info .store-actions .actions-btns .action-btn.share-btn:hover{
    background-color: var(--clr-1-hover);
    border-color: var(--clr-1-hover);
}

.store-area .store-info .store-actions  .action-lg-btn{
    display: inline-flex;
    max-width: 250px;

}
.store-area .store-info .store-actions  .action-lg-btn svg{
    width: 24px;
    height: 24px;
}




.store-area .store-more .store-loaction{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #F5F5F5;
    box-shadow: 0px 6px 16px rgba(189, 198, 211, 0.12);
    border-radius: var(--border-r-2);
    padding: 1rem 0;
    gap:.75rem .25rem;
    margin-bottom: 1rem;
}
.store-area .store-more .store-loaction .loaction-text{
    display: inline-flex;
    align-items: center;
    gap:.25rem;
    color: var(--clr-1);
    font-weight: 500;
    font-size: 16px;
    margin-bottom: 0;
    text-align: justify;
    padding: 0 .75rem;
}
.store-area .store-more .store-loaction .loaction-text svg{
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}
.store-area .store-more .store-loaction  .contact-btns{
    display: flex;
    align-items: center;
    height: 100%;

}
.store-area .store-more .store-loaction  .contact-btns .contact-btn{
    display: inline-block;
    font-size: 18px;
    transition: all .3s ease;
    padding-inline-end:.75rem;
    margin-inline-end:.75rem;
    border-left: 1px solid #E9E9E9;
}
.store-area .store-more .store-loaction  .contact-btns .contact-btn:last-child{
    border: none;
    margin-inline-end:0;
}
.store-area .store-more .store-loaction  .contact-btns .contact-btn svg{
    transition: inherit;
    width: 24px;
    height: 24px;

}
.store-area .store-more .store-loaction  .contact-btns .contact-btn svg:hover{
    opacity: .8;
    transform: translateY(-1px);
}
.store-area .store-more .store-map iframe{
    width: 100%;
    border-radius: var(--border-r-2);
    height: 200px;
}

@media(max-width:991.98px){

    .store-area>*:not(:last-child){
         margin-bottom: var(--item-alt);
    }
    .store-area .store-info{
        flex-direction: column;
        justify-content: center;
        text-align: center;
        align-items: center;
        gap:1rem;
        border-radius: var(--border-r-2);
        margin-bottom: var(--item-alt);
        /*
        border: 1px solid #eee;
        padding: 1.5rem 1rem;
        */
    }
    .store-area .store-info .store-img{
        --dim:120px;
    }
    .store-area .store-more .store-loaction{
        margin-bottom: 1.5rem;
    }
    .store-area .store-info .store-details{
        --items-alt:1rem;
    }
    .store-area .store-info .store-details>*:not(.store-num){
        justify-content: center;
    }
    .store-area .store-info .store-actions{
        gap:1rem;
        padding-top: .5rem;
    }
    .store-area .store-info .store-actions .actions-btns{
        flex-direction: row;
        gap:.75rem;
    }


    .store-area .store-more .store-map iframe{
        height: 300px;
    }
}
@media(max-width:575.98px){

    .store-area .store-more .store-loaction{
        flex-direction: column;
    }
    .store-area .store-more .store-loaction .contact-btns .contact-btn svg{
        width: 28px;
        height: 28px;
    }
    .store-area .store-info .store-actions{
        gap:.75rem;
    }
    .store-area .store-info .store-actions  .action-lg-btn{
        padding: .75rem;
    }

    .store-area .store-info .store-flex{
        gap:.75rem 1.5rem;
    }
}
@media(min-width:1200px){
    .store-about-wrapper .row >div:first-child{
            flex: 0 0 auto;
            width: 40%;
    }
    .store-about-wrapper .row >div:last-child{
        width: auto;
        flex: 1 0 0%;
    }
}
@media(min-width:992px) and (max-width:1199.98px){

    .store-area .store-info .store-actions .actions-btns{
        flex-direction: column;
    }
}

/***categories-slider***/

.categories-wrapper .flex-head{
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap:1rem;
    margin-bottom: 1.5rem;

}
.categories-wrapper .flex-head>*{
    margin-bottom: 0;
}

.categories-wrapper .slider-arrows{
    display: flex;
    align-items: center;
    gap:.75rem;
}
.categories-wrapper .slider-arrows .slider-arrow{
    --dim:32px;
    width: var(--dim);
    height: var(--dim);
    font-size: 16px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color .3s ease , color .3s ease , border .3s ease;
    box-shadow: rgb(0 0 0 / 50%) 0px 0px 3px -1px;
    border: 1px solid rgb(204, 204, 204);
    background: rgb(255, 255, 255);
    color: var(--clr-1);
    cursor: pointer;

}
.categories-wrapper .slider-arrows .slider-arrow:not(.swiper-button-disabled):active{
    background-color: var(--clr-1);
    border-color: var(--clr-1);
    color: #fff;

}
.categories-wrapper .slider-arrows .slider-arrow.swiper-button-disabled{
     background-color:#eee ;
     color: #828A89;
     cursor: no-drop;

}
@media(hover:hover) and (pointer:fine){

    .categories-wrapper .slider-arrows .slider-arrow:not(.swiper-button-disabled):hover{
        background-color: var(--clr-1);
        border-color: var(--clr-1);
        color: #fff;


    }
}

.categories-wrapper .category-item{

    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    flex-direction: column;
    transition: all .3s ease;
    position: relative;
    border-radius: var(--border-r-2);
    padding: 0 0 .25rem 0;
    border: 1px solid transparent;
    width: 100%;
}
.categories-wrapper .category-item .item-icon{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height:65px ;
    background-color: var(--clr-1);
    border-radius: var(--border-r-3);
    transition: inherit;

}
.categories-wrapper .category-item .item-icon svg{
    fill:#fff;
}
.categories-wrapper .category-item .item-icon img,
.categories-wrapper .category-item .item-icon svg{
    max-height: 35px;
}
.categories-wrapper .category-item .item-text{
    margin-top: .25rem;
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #474747;
    transition: inherit;
}
.categories-wrapper .category-item.active{
    border-color: var(--clr-1-hover);
    background-color: #F8F8F8;
}
.categories-wrapper .category-item.active .item-icon{
    background-color: var(--clr-1-hover)
}

.categories-wrapper .category-item:not(.active):hover .item-text{
    color:var(--clrBlack) ;
}
.categories-wrapper .category-item:not(.active):hover .item-icon{
    background-color: var(--clr-1-hover)
}

@media(max-width:575.98px){

    .categories-wrapper .categories-slider-container .category-item .item-icon{
        height: 60px;
    }
    .categories-wrapper .categories-slider-container .category-item .item-icon img,
    .categories-wrapper .categories-slider-container .category-item .item-icon svg{
        max-height: 30px;
    }


    .categories-wrapper .slider-arrows{
        display: none;
    }
    .categories-wrapper .scroll-row{
        overflow-x: auto;
        overflow-y: hidden;
        margin: 0 -0.75rem;
        padding-bottom: 0.1rem;
        width: inherit;

    }
    .categories-wrapper .scroll-row::-webkit-scrollbar{
        display: none
    }
    .categories-wrapper .scroll-row .target-row{

        flex-wrap: nowrap;
        justify-content: flex-start;
        margin: 0;
        transform: none;

    }
    .categories-wrapper .scroll-row .swiper-slide{
        --item-w:80px;
        max-width: var(--item-w);
        flex-shrink: 0;
        margin-inline-start:.75rem;

    }
    .categories-wrapper .scroll-row .swiper-slide:last-child{
        padding-inline-end: 0.75rem;
        max-width: calc(var(--item-w) + .75rem);
    }


}


/*------------- #categories-welcome-section --------------*/

.categories-welcome-area{
    --items-alt:var(--section-padding);
}
.categories-welcome-area>*:not(:last-child){
    margin-bottom:var(--items-alt)
}
.category-banner{

    display: flex;
    align-items: center;
    justify-content: flex-end;
    align-items: center;
    padding:1.5rem 1rem;
    background-color: rgb(0 131 190 / 60%);
    background-blend-mode: multiply;
    mix-blend-mode: normal;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center right;
    min-height: 160px;

}
.category-banner .banner-text{

    font-size: calc(var(--title-1) + 5px);
    color: #fff;
    font-weight: bold;
    margin-bottom: 0;
}
@media(max-width:991.98px){
    .category-banner .banner-text{
        font-size: 40px;
    }
}
@media(max-width:575.98px){

}


/*------------- #ads-section --------------*/
.ads-area .row{
    gap:1.5rem 0;
}
.ads-area  .ads-note{
    font-size: var(--title-6);
    font-weight: 500;
    margin-bottom: 0;
    color: #9B9B9B;
    text-align: center;
}
.ads-area .ads-item{
    display: flex;
    align-items: center;
    justify-content: center;
    text-align:center;
    transition: all .3 ease;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-color: var(--clr-1);
    background-blend-mode: normal;
    border-radius: var(--border-r-2);
    height: 225px;
    max-height: 100%;
}

@media(max-width:575.98px){

    .ads-area .ads-item{
        height: 200px;
    }
}


/*------------- #product-description-section  --------------*/
.product-description-area{
    --item-alt:2rem;
}
.product-description-area .product-description-details{
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    height: 100%;
    position: relative;

    margin-inline-start:.75rem;
}
.product-description-area .product-description-details >*:not(:last-child){
    margin-bottom:var(--item-alt);
}
.product-description-details .product-name{
    font-size: var(--title-3);
    font-weight: bold;
    margin-bottom: 0;
    max-width: 650px;
}
.product-description-details .product-desc{
    font-weight: 500;
    max-width: 700px;
}
.product-description-details .product-desc span{
    font-size: 16px;
    color: #474747;
    margin-bottom: 0;
}
.product-description-details .product-desc p{
    font-size: var(--title-8);
    color: #8E8E8E;
    margin-bottom: 0;
    text-align: justify;
}
.product-description-details .product-info{
    display: flex;
    align-items: center;
    gap:.75rem 3rem;
    flex-wrap: wrap;
}
.product-description-details .product-info .product-code{
    font-size: 16px;
    color: #FF0000;
    background-color: #fff;
    border: 1px solid #F3F3F3;
    border-radius: var(--border-r-3);
    padding: 0.375rem 0.75rem;
    font-weight: 500;

}
.product-description-details .product-info .price-info{
    display: flex;
    align-items: center;
    gap:0 1.5rem;
}
.product-description-details .product-info .price-info .price-val{
    color: var(--clr-1);
    font-size: var(--title-4);
    font-weight: 500;
    margin-bottom: 0;
}

.product-description-details .product-info .price-info .coins-val{
    --size: var(--title-8);
    margin-bottom: 0;

}

.product-description-details .product-options .option-row{
    display: flex;
    gap:.75rem 1rem;
    flex-wrap: wrap;
    padding-bottom: 1rem;
}
.product-description-details .product-options .option-row:last-child{
    padding-bottom: 0 !important;
}
.product-description-details .product-options .option-row .option-item{

    padding: 1rem 1.5rem;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;
    gap:.25rem 0;
    background-color: #FFFFFF;
    border: 1.5px solid #E4E6E8 ;
    border-radius: var(--border-r-2);
    transition: all .3s ease;
    position: relative;
}
.product-description-details .product-options .option-row .option-item.active{
    border-color: var(--clr-1);
}
.product-description-details .product-options .option-row .option-item>*{
    margin-bottom: 0;
}
.product-description-details .product-options .option-row .option-item .item-title{
    font-size: 16px;
    font-weight: 500;
}
.product-description-details .product-options .option-row .option-item .item-val{
    font-weight: bold;
    font-size: var(--title-8);
}
.product-description-details .product-options .option-row .option-item .color{
    width: 25px;
    height: 25px;
    border-radius: 100%;
    display: block;
}
.product-description-details .product-actions{
    --row-h:60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:1rem 1.5rem;
    max-width: 600px;

}
.product-description-details .product-actions .cart-action{
    flex: 1;
}
.product-description-details .product-actions .btn-cart{
    border-radius: var(--border-r-2);
    font-size: var(--title-7);
    max-width: 500px;
}
.product-description-details .product-actions:not(.cart-active) .counter-wrap{
    display: none;
}
.product-description-details .product-actions .count-wrap .count-btn{
    --dim:35px;

}
.product-description-details .product-actions .count-wrap .count-num{
    max-width: 65px;
    font-size: var(--title-8);
    font-weight: bold;
}

.product-description-area .product-rate-wrapper{
    margin-top: 2rem;
}
.product-description-area .product-rate-wrapper .rate-row{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap:1.5rem;
    margin-bottom: 1.5rem;

}
.product-description-area .product-rate-wrapper .rate-row .rate-info{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap:1rem .5rem;
}
.product-description-area .product-rate-wrapper .rate-row .current-rate .rate-val{
    font-size: var(--title-2);
    font-weight: bold;
    margin-bottom: .25rem;
    line-height: 1;
}

.product-description-area .product-rate-wrapper .rate-row .total-rate {


    font-size: 16px;
    color: #828A89;
    margin-bottom: 0;
}
.product-description-area .product-rate-wrapper .rate-row .add-rate {
    text-align: center;
    gap:1rem .5rem;
}

.product-description-area .product-rate-wrapper .rate-row .add-rate .rate-text{
    font-size: 14px;
    color: #828A89;
    margin-bottom: 0;
}
.product-description-area .product-rate-wrapper .submit-btn.disabled{
    background-color:#C4C4C4 ;
    pointer-events: none;
    border-color: #C4C4C4;
}

@media(max-width:1199.98px){

    .product-description-area .product-description-details{

        margin-inline-start:.5rem;
    }
}
@media(max-width:991.98px){

    .product-description-area .product-description-details{

        margin-inline-start:0;
    }
    .product-description-details .product-desc{
        max-width: none;
    }

    .product-description-area .product-rate-wrapper{
        margin-top: calc( var(--box-py-almt))
    }

    .product-description-details .product-actions .btn-cart{
        max-width: none;
    }


}
@media(max-width:767.98px){

    .product-description-details .product-actions{
        max-width: none;
    }
}
@media(max-width:575.98px){

    .product-description-area{
        --item-alt:1.5rem;
    }
    .product-description-details .product-actions{
        --row-h:58px;
        gap:.75rem;
    }
    .product-description-details .product-actions .count-wrap .count-num{
        max-width: 52px;
    }

    .product-description-details .product-options .option-row{
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        margin: 0 -.75rem;

    }
    .product-description-details .product-options .option-row::-webkit-scrollbar{
        display: none;
    }
    .product-description-details .product-options .option-row .option-item{
        flex-shrink: 0;
        padding: 1rem 1.25rem;
    }
    .product-description-details .product-options .option-row .option-item:first-child{

        margin-inline-start:.75rem;
    }
    .product-description-details .product-options .option-row .option-item:last-child{
       margin-inline-end:.75rem;

    }

    .product-description-area .product-rate-wrapper{
        margin-top: 2.5rem;
    }
    .product-description-area .product-rate-wrapper .rate-row{
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .product-description-area .product-rate-wrapper .rate-row .current-rate .star-rating{
        justify-content: center;
    }

    .product-description-details .product-actions .count-wrap .count-btn{
        --dim:32px;
    }

}

/**** product-description-slider-container ***/

.product-description-area .product-description-img-container{


     border-radius: var(--border-r-2);
     margin-bottom: var(--item-alt);

}
.product-description-area .fullscreen-btn{

    position: absolute;
    bottom: 20px;
    right: 15px;
    background-color: #F0F2F7;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: var(--clr-1);
    transition: all .3s ease;
    cursor: pointer;
    border: 1px solid transparent;
}
.product-description-area .fullscreen-btn:hover{

    background-color: var(--clr-1);
       color: #fff
}
.product-description-area .guide-message{

    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(49,51,61,.6);
    border-radius: 2em;
    padding: 0 1.1em;
    height: 35px;
    color: #eee;
    font-size: 10px;
    text-align: center;
    transition: all .3s ease;
    text-transform: capitalize;
    opacity: 1;
    z-index: 10;
    transition: all .3s ease;
    cursor: no-drop;
    user-select: none;
}
.product-description-area .guide-message i{

    margin-left: 5px;
}
.product-description-area .btn-wishlist{

    position: absolute;
    top: 1rem;
    left: 1rem;
    --dim:45px;
    --svg-dim:20px;
    border: 1px solid rgba(255, 255, 255, 0.43);
    background-color: rgba(255, 255, 255, 0.43);

}





/* slick **/
.product-description-area  .product-description-slider  a{

    display: block;
}
.product-description-area .product-description-img-container .product-gallery{

    position: relative;
    margin-bottom: 1.25rem;
    border-radius: var(--border-r-2);
    padding: 0;
    background-color: transparent;
    border: none;
}


.product-description-area  .product-description-slider .slick-slide .product-full-img{

    --h: 430px;
    background-color:#E5ECFB ;
    border-radius: var(--border-r-2);
    height: var(--h);


}
.product-description-area  .product-description-slider .slick-slide .product-full-img a{

    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    cursor: zoom-in;
    padding: 3rem ;
}
.product-description-area  .product-description-slider .slick-slide .product-full-img img{

    display: block;
    transition: all .3s ease;
    text-align: center;
    box-shadow: none;
    border: none;
    object-fit: contain;
    border-radius: inherit;
    margin: 0 auto;
    max-height: 100%;

}

.product-description-area  .product-description-slider.slider-nav .slick-list{

    margin: 0 -8px;
}
.product-description-area  .product-description-slider.slider-nav .slick-slide {

    margin: 0 8px;

}
.product-description-area  .product-description-slider .product-img-thumbnail{

    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-color: #E5ECFB;
    border-radius: var(--border-r-2);
    transition: all .3s ease;

    height:100px ;
}
.product-description-area  .product-description-slider-container:not(.float-thumbnail) .product-img-thumbnail{
    padding:1rem;
}
.product-description-area  .product-description-slider .product-img-thumbnail img{

    display: block;
    max-height: 100%;
    object-fit: contain;
    transition:inherit;
    opacity: 1;
    cursor: pointer;
    margin: auto;
    text-align: center;
    border-radius: inherit;

}
.product-description-area  .product-description-slider.slider-nav .slick-slide.is-active img{

      opacity: 1;
}
.product-description-area  .product-description-slider.slider-nav .slick-slide.is-active .product-img-thumbnail::after {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 3px solid var(--clr-1);
    border-radius: inherit;
    transition: inherit;
}

.product-description-area .product-description-slider .slick-arrow{
    --dim:32px;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    font-size: 16px;
    width: var(--dim);
    height: var(--dim);
    background-color: var(--clr-1);
    color: #fff;
    transition: all .3s ease;
    z-index: 10;
}
.product-description-area .product-description-slider .slick-arrow:not(.slick-disabled):active{

    background-color: var(--clr-1-hover);
    color: #fff
}
.product-description-area .product-description-slider .slick-arrow.slick-disabled{

    opacity: 0;
    pointer-events: none;

}
.product-description-area .product-description-slider.slider-nav .slick-arrow.next-arrow{

    left: -12px;
}
.product-description-area .product-description-slider.slider-nav .slick-arrow.prev-arrow{

    right: -12px;
}
@media(hover:hover) and (pointer:fine){

    .product-description-area .product-description-slider .slick-arrow:not(.slick-disabled):hover{

        background-color: var(--clr-1-hover);
        color: #fff
    }
}

.product-description-area .float-thumbnail{
    background-color: #E5ECFB;
    padding-bottom: 1.25rem;
}
.product-description-area .float-thumbnail  .product-gallery{
    margin-bottom: 0 !important;
}
.product-description-area .float-thumbnail  .slick-slide .product-full-img{

   --h:400px;
}
.product-description-area .float-thumbnail  .slider-nav {
   max-width: 80%;
   margin: 0 auto;
}
.product-description-area .float-thumbnail  .product-img-thumbnail{
    background-color: #fff;
    padding: .75rem;
}
.product-description-area  .float-thumbnail .guide-message{

}
.product-description-area .float-thumbnail  .product-description-slider.slider-nav .slick-arrow.slick-disabled{

    pointer-events: all;
    cursor: no-drop;
    opacity: .3;
}


@media(min-width:992px){

    .product-description-area .float-thumbnail  .slider-nav {
        max-width: 75%;
    }

}
@media(min-width:768px){

    .product-description-area .float-thumbnail  .slider-nav {
        max-width: 70%;
    }

}
@media(min-width:576px){

    .product-description-area .float-thumbnail  .product-description-slider.slider-nav .slick-arrow{
        opacity: 1;
        --dim:35px;
        font-size: 18px;
    }
    .product-description-area .float-thumbnail  .product-description-slider.slider-nav .slick-arrow.next-arrow{

        left: calc((var(--dim) + .625rem)* -1);
    }
    .product-description-area .float-thumbnail  .product-description-slider.slider-nav .slick-arrow.prev-arrow{

       right: calc((var(--dim) + .625rem)* -1);
    }


}


.sl-overlay{

    background-color: rgba(0,0,0,.75);

}
.sl-wrapper .sl-image{

    cursor: zoom-in;


}
.sl-wrapper .sl-image img{

    background-color: #fff;

}
.sl-wrapper .sl-close,
.sl-wrapper .sl-counter,
.sl-wrapper .sl-navigation button{

    color: #fff;
    transition: all .3s ease
}
.sl-wrapper .sl-navigation button{

    font-size: 3rem !important;
}
.sl-wrapper .sl-image .sl-caption{

    font-size: 12px;
    text-align: center;
    background-color: rgba(0,0,0,0.6);
    padding: 10px;

}
.xzoom-preview{

    background-color: #fff;
    border-color: #333
}

.lightbox-item{

    outline: none;
    border: none;
    box-shadow:none;
}
a[data-fancybox] img {
  cursor: zoom-in;
}
.fancybox-zoomIn {
  animation: 0.25s ease both fancybox-zoomIn;
}
.fancybox-zoomOut {
  animation: 0.15s ease both fancybox-zoomOut;
}
@keyframes fancybox-zoomIn {
  from {
    opacity: 0;
    transform: scale(0.75);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes fancybox-zoomOut {
  to {
    opacity: 0;
    transform: scale(1.25);
  }
}


@media(max-width:1199.98px){


}
@media(max-width:991.98px){

    .xzoom-source{

        display: none !important;
    }

    .product-description-area  .product-description-slider .slick-slide .product-full-img{
        --h: 400px;
    }
    .product-description-area .product-description-slider.slider-nav .slick-arrow.next-arrow{

        left: -10px;
    }
    .product-description-area .product-description-slider.slider-nav .slick-arrow.prev-arrow{

        right: -10px;
    }


    .product-description-area  .product-description-slider .slick-slide .product-full-img a{
        padding: 2rem;
    }
    .product-description-area  .product-description-slider .slick-slide .product-full-img img{
        max-width: 500px;
    }
    .product-description-area  .product-description-slider-container:not(.float-thumbnail) .product-img-thumbnail img{
        max-width: 80%;
    }
    .product-description-area .float-thumbnail .product-description-slider .product-img-thumbnail{
        padding: 1rem;
    }


}
@media(max-width:767.98px){

    .product-description-area .product-description-slider.slider-nav .slick-arrow{

        --dim:28px;

    }
    .product-description-area .product-description-slider.slider-nav .slick-list{

        margin: 0  -.375rem;
    }
    .product-description-area .product-description-slider.slider-nav .slick-slide{

        margin: 0 .375rem;
    }

    .product-description-area .product-description-slider-container:not(.float-thumbnail)  .product-img-thumbnail img{
        max-width: 85%;
    }

}
@media(max-width:575.98px){


    .product-description-area .product-description-img-container .product-gallery{
        margin-bottom: 1rem;
    }
    .product-description-area .product-description-slider .slick-slide .product-full-img{

        --h: 300px;
    }
    .product-description-area  .product-description-slider .slick-slide .product-full-img a{
        padding: 1.5rem;
    }
    .product-description-area  .product-description-slider .slick-slide .product-full-img img{

        max-width: 100%;
        max-height: 100%;

    }


    .product-description-area .float-thumbnail  .slider-nav{
        max-width: calc(100% - 1.5rem);
    }
    .product-description-area .product-description-slider-container:not(.float-thumbnail)  .product-img-thumbnail{
        padding: 1rem;
    }
    .product-description-area .product-description-slider .product-img-thumbnail img{
        max-width: 100%;
    }


    .product-description-area .float-thumbnail .product-description-slider.slider-nav .slick-arrow.slick-disabled{

        opacity: 0;
        z-index: -1;

    }

}

/* slick **/


/*------------- #chat-section --------------*/




/*------------- #responsive --------------*/


@media(max-width:1199.98px){



}

@media(max-width:991.98px){


}

@media(max-width:767.98px){




}

@media(max-width:575.98px){

    :root{

          --title-1:32px;
          --title-2:28px;
          --title-3:24px;
          --title-4:22px;
          --title-5:20px;
          --title-6:18px;
          --title-7:16px;

          --border-r-1:15px;
          --border-r-2:10px;
          --border-r-3:8px;

          --section-padding:2rem;
          --box-py-almt:2.5rem;

          --box-py-res:1.5rem;
          --box-px-sm: 1rem;
          --box-px: 1rem;
          --box-px-more:1rem ;
    }



}


/*------------- #custom-grid --------------*/


@media(min-width:992px){
    .custom-container{

        max-width: 1400px;
         --bs-gutter-x: 1rem;
    }

}
@media(min-width:1200px){
    .custom-container{

         --bs-gutter-x: 1.5rem;
    }

}

.gx-75 {
    --bs-gutter-x: .75rem;
}

@media (min-width:480px) and (max-width:599.98px){

    .row-cols-xs-gutter{

        --bs-gutter-x:.75rem;
    }
     .row-cols-xs-2>* {

        flex: 0 0 auto;
        width: 50%;


    }

}

@media(max-width:991.98px){

    .gx-lg-75{

        --bs-gutter-x: .75rem;
    }

    .custom-container{

        max-width: 720px;

    }
    .custom-container:not(.custom-st){
        max-width: none;
    }

}

@media(max-width:767.98px){

    .gx-md-75{

        --bs-gutter-x: .75rem;
    }
}

@media(max-width:575.98px){

    .gx-sm-75{

        --bs-gutter-x: .75rem;
    }
}

.no-scrollbar::-webkit-scrollbar{
    display: none !important;
}




/******************************************/
:is(
    .custom-modal .modal-btns .modal-btn ,
    .sign-area .sign-box .box-btn,
    .feedback-box .box-btn,
    .orders-wrapper .actions-btns .action-btn,
    .order-options-box .actions-btns .action-btn,
    .store-area .store-info .store-actions  .action-lg-btn,
    .product-description-area .product-rate-wrapper  .submit-btn
){

    position: relative;

}