@font-face {
    font-family: "Vazir";
    src: url("../assets/fonts/Vazir.ttf") format("truetype");
}

body{
    font-family: "Vazir" !important;
    background-color: #f7f6f6 !important;
}

#loading-ico{
    top: 0 !important;
    position: fixed !important;
    z-index: 1100 !important;
    width: 100% !important;
    height: 100% !important;
    /* display: flex !important; */
    flex-direction: column !important;
    align-items: center;
    background-color: white !important;
    opacity: 70% !important;
    direction: rtl !important;
}

header{background-color: unset in !important;}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,p{line-height:1.8 !important;}

.navbar{
    background-color: #F7F6F6 !important;
    box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.2) !important;
}
.bg-lprimary{background-color: #2db6fa !important;}
.bg-lsuccess{background-color: #08da4e !important;}
.bg-lwarning{background-color: #f68c09 !important;}
.bg-veryLighteBlue{background-color: #eaeaff !important;}
.bg-veryLighteGreen{background-color: #daffda !important;}

.text-lprimary{color: #2db6fa !important;}
.text-lsuccess{color: #08da4e !important;}
.text-lwarning{color: #f68c09 !important;}
.text-purple{color:#C743EE !important;}
.text-darkpurple{color:#430755 !important;}

.btn-purple{background-color:#C743EE !important;}
.btn-darkpurple{background-color:#430755 !important;}

/* remove dropdowns after */
.dropdown-toggle::after{display: none !important;}

/* moment alerts */
.momentAlertBox{
     padding:10px !important;
     position:fixed;
     top:0;
     left:0;
     right:0;
     z-index:2000;
}
/* alerts */
.alertBox{
     padding:10px !important;
     position:fixed;
     top:0;
     left:0;
     right:0;
     z-index:1030;
}

/* header */
header{
    direction: rtl;
    /*box-shadow:0px 5px 10px 0px rgba(0,0,0,0.2);*/
    height:60px;
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:1029;
}


/* header btn */
.btn-custom-hover:hover {
    color: black !important;
    background-color: #753a87 !important;
}
.btn-custom-hover:active {
    color: white !important;
    background-color: #430755 !important;
}

/* comments */
.comments p{margin: 0;}

/* faqs */
.faqs a{
    text-decoration: none;
    border-radius: 3rem 3rem 0 0 !important;
}

.accordion-button:not(.collapsed){
    color: inherit;
    cursor: pointer;
}
.accordion-button:not(.collapsed)::after{
    color: inherit;
    cursor: pointer;
}

.accordion-button:not(.collapsed){
    background-color: white;
    border-radius: 1rem 1rem 0 0;
}

/* Footer */
.footer td i{
    color: #d80df0;
    margin-top: 0.4rem;
    margin-left: 0.5rem;
}
.footer td a{
    text-decoration: none;
    color: white;
}
.footer hr{
    border-bottom:3px solid #0dcaf0;
    margin:0px;
    margin-bottom:10px;
}
.ulli i{margin:0 !important;}

/* Input Range */
.range-slider .flat{
    --thumb-size: 25px;
    --track-height: calc(var(--thumb-size) / 3);
    --progress-shadow: none;
    --progress-flll-shadow: none;
    --thumb-shadow: 0 0 0 7px var(--primary-color) inset, 0 0 0 99px white inset;
    --thumb-shadow-hover: 0 0 0 9px var(--primary-color) inset, 0 0 0 99px white inset;
    --thumb-shadow-active: 0 0 0 13px var(--primary-color) inset;
}
.range-slider {
    --primary-color: #791b96;
    --value-offset-y: var(--ticks-gap);
    --value-active-color: white;
    --value-background: transparent;
    --value-background-hover: var(--primary-color);
    --value-font: 700 12px/1 Arial;
    --fill-color: var(--primary-color);
    --progress-background: #eee;
    --progress-radius: 20px;
    --track-height: calc(var(--thumb-size) / 2);
    --min-max-font: 12px Arial;
    --min-max-opacity: 0.5;
    --min-max-x-offset: 10%;
    --thumb-size: 22px;
    --thumb-color: white;
    --thumb-shadow: 0 0 3px rgba(0, 0, 0, 0.4), 0 0 1px rgba(0, 0, 0, 0.5) inset, 0 0 0 99px var(--thumb-color) inset;
    --thumb-shadow-active: 0 0 0 calc(var(--thumb-size) / 4) inset var(--thumb-color), 0 0 0 99px var(--primary-color) inset, 0 0 3px rgba(0, 0, 0, 0.4);
    --thumb-shadow-hover: var(--thumb-shadow);
    --ticks-thickness: 1px;
    --ticks-height: 5px;
    --ticks-gap: var(--ticks-height, 0);
    --ticks-color: silver;
    --step: 1;
    --ticks-count: Calc(var(--max) - var(--min)) / var(--step);
    --maxTicksAllowed: 30;
    --too-many-ticks: Min(1, Max(var(--ticks-count) - var(--maxTicksAllowed), 0));
    --x-step: Max(var(--step),var(--too-many-ticks) * (var(--max) - var(--min)));
    --tickInterval: 100/ ((var(--max) - var(--min)) / var(--step)) * var(--tickEvery, 1);
    --tickIntervalPerc: calc((100% - var(--thumb-size)) / ((var(--max) - var(--min)) / var(--x-step)) * var(--tickEvery, 1));
    --value-a: Clamp(var(--min), var(--value, 0), var(--max));
    --value-b: var(--value, 0);
    --text-value-a: var(--text-value, "");
    --completed-a: calc((var(--value-a) - var(--min)) / (var(--max) - var(--min)) * 100);
    --completed-b: calc((var(--value-b) - var(--min)) / (var(--max) - var(--min)) * 100);
    --ca: Min(var(--completed-a), var(--completed-b));
    --cb: Max(var(--completed-a), var(--completed-b));
    --thumbs-too-close: Clamp( -1, 1000 * (Min(1, Max(var(--cb) - var(--ca) - 5, -1))+0.001), 1);
    --thumb-close-to-min: Min(1, Max(var(--ca) - 2, 0));
    --thumb-close-to-max: Min(1, Max(98 - var(--cb), 0));
    display: inline-block;
    height: max(var(--track-height), var(--thumb-size));
    background: linear-gradient(to right, var(--ticks-color) var(--ticks-thickness), transparent 1px) repeat-x;
    background-size: var(--tickIntervalPerc) var(--ticks-height);
    background-position-x: calc(var(--thumb-size) / 2 - var(--ticks-thickness) / 2);
    background-position-y: var(--flip-y, bottom);
    padding-bottom: var(--flip-y, var(--ticks-gap));
    padding-top: calc(var(--flip-y) * var(--ticks-gap));
    position: relative;
    z-index: 1;
}
.range-slider[data-ticks-position=top] {--flip-y: 1;}
.range-slider::before, .range-slider::after {
    --offset: calc(var(--thumb-size) / 2);
    content: counter(x);
    display: var(--show-min-max, block);
    font: var(--min-max-font);
    position: absolute;
    bottom: var(--flip-y, -2.5ch);
    top: calc(-2.5ch * var(--flip-y));
    opacity: clamp(0, var(--at-edge), var(--min-max-opacity));
    transform: translateX(calc(var(--min-max-x-offset) * var(--before, -1) * -1)) scale(var(--at-edge));
    pointer-events: none;
}
.range-slider::before {
    --before: 1;
    --at-edge: var(--thumb-close-to-min);
    counter-reset: x var(--min);
    left: var(--offset);
}
.range-slider::after {
    --at-edge: var(--thumb-close-to-max);
    counter-reset: x var(--max);
    right: var(--offset);
}
.range-slider__values {
    position: relative;
    top: 50%;
    line-height: 0;
    text-align: justify;
    width: 100%;
    pointer-events: none;
    margin: 0 auto;
    z-index: 5;
}
.range-slider__values::after {
    content: "";
    width: 100%;
    display: inline-block;
    height: 0;
    background: red;
}
.range-slider__progress {
    --start-end: calc(var(--thumb-size) / 2);
    --clip-end: calc(100% - (var(--cb)) * 1%);
    --clip-start: calc(var(--ca) * 1%);
    --clip: inset(-20px var(--clip-end) -20px var(--clip-start));
    position: absolute;
    left: var(--start-end);
    right: var(--start-end);
    top: calc(var(--ticks-gap) * var(--flip-y, 0) + var(--thumb-size) / 2 - var(--track-height) / 2);
    height: calc(var(--track-height));
    background: var(--progress-background, #eee);
    pointer-events: none;
    z-index: -1;
    border-radius: var(--progress-radius);
}
.range-slider__progress::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    clip-path: var(--clip);
    top: 0;
    bottom: 0;
    background: var(--fill-color, black);
    box-shadow: var(--progress-flll-shadow);
    z-index: 1;
    border-radius: inherit;
}
.range-slider__progress::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    box-shadow: var(--progress-shadow);
    pointer-events: none;
    border-radius: inherit;
}
.range-slider > input {
    -webkit-appearance: none;
    width: 100%;
    height: var(--thumb-size);
    margin: 0;
    position: absolute;
    left: 0;
    top: calc(50% - max(var(--track-height), var(--thumb-size)) / 2 + var(--ticks-gap) / 2 * var(--flip-y, -1));
    cursor: -webkit-grab;
    cursor: grab;
    outline: none;
    background: none;
}
.range-slider > input:not(:only-of-type) {pointer-events: none;}
.range-slider > input::-webkit-slider-thumb {
    appearance: none;
    height: var(--thumb-size);
    width: var(--thumb-size);
    transform: var(--thumb-transform);
    border-radius: var(--thumb-radius, 50%);
    background: var(--thumb-color);
    box-shadow: var(--thumb-shadow);
    border: none;
    pointer-events: auto;
    transition: 0.1s;
}
.range-slider > input::-moz-range-thumb {
    appearance: none;
    height: var(--thumb-size);
    width: var(--thumb-size);
    transform: var(--thumb-transform);
    border-radius: var(--thumb-radius, 50%);
    background: var(--thumb-color);
    box-shadow: var(--thumb-shadow);
    border: none;
    pointer-events: auto;
    transition: 0.1s;
}
.range-slider > input::-ms-thumb {
    appearance: none;
    height: var(--thumb-size);
    width: var(--thumb-size);
    transform: var(--thumb-transform);
    border-radius: var(--thumb-radius, 50%);
    background: var(--thumb-color);
    box-shadow: var(--thumb-shadow);
    border: none;
    pointer-events: auto;
    transition: 0.1s;
}
.range-slider > input:hover {--thumb-shadow: var(--thumb-shadow-hover);}
.range-slider > input:hover + output {
    --value-background: var(--value-background-hover);
    --y-offset: -5px;
    color: var(--value-active-color);
    box-shadow: 0 0 0 3px var(--value-background);
}
.range-slider > input:active {
    --thumb-shadow: var(--thumb-shadow-active);
    cursor: grabbing;
    z-index: 2;
}
.range-slider > input:active + output {transition: 0s;}
.range-slider > input:nth-of-type(1) {--is-left-most: Clamp(0, (var(--value-a) - var(--value-b)) * 99999, 1);}
.range-slider > input:nth-of-type(1) + output {
    --value: var(--value-a);
    --x-offset: calc(var(--completed-a) * -1%);
}
.range-slider > input:nth-of-type(1) + output:not(:only-of-type) {--flip: calc(var(--thumbs-too-close) * -1);}
.range-slider > input:nth-of-type(1) + output::after {content: var(--prefix, "") var(--text-value-a) var(--suffix, "");}
.range-slider > input:nth-of-type(2) {--is-left-most: Clamp(0, (var(--value-b) - var(--value-a)) * 99999, 1);}
.range-slider > input:nth-of-type(2) + output {--value: var(--value-b);}
.range-slider > input:only-of-type ~ .range-slider__progress {--clip-start: 0;}
.range-slider > input + output {
    --flip: -1;
    --x-offset: calc(var(--completed-b) * -1%);
    --pos: calc(((var(--value) - var(--min)) / (var(--max) - var(--min))) * 100%);
    pointer-events: none;
    position: absolute;
    z-index: 5;
    background: var(--value-background);
    border-radius: 10px;
    padding: 2px 4px;
    left: var(--pos);
    transform: translate(var(--x-offset), calc(150% * var(--flip) - (var(--y-offset, 0px) + var(--value-offset-y)) * var(--flip)));
    transition: all 0.12s ease-out, left 0s;
}
.range-slider > input + output::after {
    content: var(--prefix, "") var(--text-value-b) var(--suffix, "");
    font: var(--value-font);
}
.range-slider, label[dir=rtl] .range-slider {
    width: clamp(300px, 50vw, 800px);
    min-width: 200px;
}
/* custom range */
.rangeP{
    margin-bottom:40px;
    margin-top:30px;
    font-weight: bold;
    font-size: 20px;
}

/* Mini Category */
.index-mini-cat{ margin:15px 0px;}
.index-mini-cat div{
    background: linear-gradient(#c13584,#e1306c,#fd1d1d,#f56040,#f77737);
    border-radius: 50%;
    padding: 3px;
}
.index-mini-cat div a{
    display: block;
    position: relative;
    width: 100% !important;
    height: 100% !important;
    padding: 3px;
    background-color: white;
    border-radius: 50%;
}
.index-mini-cat div a img{
    max-width: 100% !important;
    max-height: 100% !important;
    border-radius: 50% !important;
}
.index-mini-cat p{
    text-align: center;
    margin: 0;
    font-weight: bold;
    font-size: 17px;
    color: #0f0f68;
}

/* product card */
.product-card{
    display: flex !important;
    min-height: 300px;
    flex-direction: column !important;
    position: relative !important;
    align-items: center !important;
    justify-content: space-between;
    background-color:white !important;
    box-shadow:0px 0px 10px 0 black !important;
    border-radius:15px !important;
    margin:0px 5px 25px 5px !important;
}
.swiper-slide .product-card{
    margin-bottom: 0px !important;
}
.product-card .product-badge-danger, .product-card .product-badge-purple{
    position:absolute !important;
    text-align:center !important;
    padding-top: 1px !important;
    color: white;
    border-radius: 5px;
}
.product-card .product-badge-danger{
    top: 0;
    left: -4px;
}
.product-card .product-badge-purple{
    top: 0;
    right: -4px;
}
.product-card > .product-badge-purple > span{
    background-color: #be29eb;
    border-radius: 0px 15px 0px 15px;
    padding: 0px 5px;
}
.product-card > .product-badge-danger > span{
    background-color: orangered;
    border-radius: 15px 0px 15px 0px;
    padding: 0px 5px;
}
.product-card  .product-name{
    font-size:15px !important;
    font-weight: bold !important;
    text-align: center;
    margin-bottom:5px !important;
    line-height:1.4 !important;
    height:60px !important;
    overflow-y: hidden;
    padding: 0px 5px;
}
.product-card .imagecolor{
    width: 100%;
    text-align: center;
    height: 185px;
    display:flex;
    justify-content: space-between;
    align-items: center;
    padding: 28px 5px 15px 5px;
}
.swiper-slide .product-card .imagecolor{
    justify-content: center;
}
.product-card > .imagecolor > a{
    position: relative;
    top: 0px;
    left: 0px;
    width: 90% !important;
    height: 100% !important;
}
.product-card > .imagecolor > a > img{
    max-width: 100% ;
    max-height: 100%;
}
.product-card > .imagecolor > .color{
    display: flex !important;
    flex-direction: column !important;
    position: absolute !important;
    left: 0px !important;
}
.product-card > .imagecolor > .color > a{
    margin: 3px 0px;
}
.product-card .product-p-price{
    margin:5px 0px 0px 0px;
    font-size:16px;
    color:#BF29EC;
    display: flex;
    align-items: end;
}
.product-card .product-p-price span{
    font-weight:bold;
}
.product-card .product-p-price .bdg{
    font-weight: bold !important;
    font-size: 13px !important;
    background-color:red !important;
    color:white !important;
    border-radius:50% !important;
    padding: 6px 2px 4px 2px !important;
    margin-right: 5px !important;
    text-decoration: none !important;
    display: block;
    min-width: 32px;
    text-align: center;
}

.product-card .product-p-discount{
    direction: rtl !important;
    color:red;
    font-weight: bold;
    margin: -7px 0px 0px 0px;;
    min-height: 20px;
    text-align: center;
    font-size: 12px;
    line-height: 20px !important;
    padding-bottom: 10px;
}
.product-card .slider-dis{
    box-shadow: 0px 3px 10px 2px rgba(0,0,0,0.1) !important;
}

.product-card > .product-discount{
    direction: ltr !important;
    color:gray;
    margin: 0px;
    min-height: 30px;
    text-align: center;
}
.product-card > .product-discount > .bdg{
    font-weight:bold;
    font-size:10px;
    background-color:red;
    color:white;
    border-radius:50%;
    padding: 6px 5px 4px 5px;
    margin-right: 10px;
}
.product-card > .product-price{
    margin:0px 0px 0px 0px;
    font-size:15px;
    color:#BF29EC;
}
.product-card > .product-price > span{
    font-weight:bold;
    font-size: 20px;
}
.product-mini-details{
    position: relative !important;
    align-items: center !important;
    background-color:white !important;
    box-shadow:0px 0px 10px 0 rgba(0,0,0,0.3) !important;
    border-radius:20px !important;
    margin:20px 0px !important;
}

/* slider products card */
.slider-pc{
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
    align-items: center !important;
    height:370px;
    width: 225px;
    justify-content: space-between;
    background-color:white !important;
    box-shadow:0px 0px 10px 0 rgba(0,0,0,0.3) !important;
    border-radius:20px 20px 10px 10px !important;
    margin:20px auto 20px auto !important;
}

.slider-pc .product-badge{
    position:absolute !important;
    text-align:center !important;
    padding-top: 2px !important;
}
.slider-pc .product-badge > span{
    /* background-color: #be29eb; */
    padding: 1px 10px !important;
    border-radius: 0 0 10px 10px !important;
    font-weight: bold !important;
}

.slider-pc .slider-p-badge{
    position:absolute !important;
    text-align:center !important;
    padding-top: 1px !important;
    font-size: 14px !important;
}
.slider-pc .slider-p-badge > span{
    background-color: #be29eb !important;
    width: fit-content !important;
    padding: 1px 10px !important;
    border-radius: 0 0 10px 10px !important;
}
.slider-pc .slider-p-name{
    font-size:16px !important;
    font-weight: bold !important;
    text-align: center;
    margin-top:35px !important;
    margin-bottom:10px !important;
    line-height:1.4 !important;
    min-height:45px !important;
    padding: 0px 15px !important;
    display: flex;
    align-items: center;
}
.slider-pc a img{
    width:auto !important;
    height:140px !important;
    border-radius: 5px;
}
.slider-pc .slider-p-colors{
    margin-top:5px;
    min-height:15px;
}
.slider-icons{
    display: flex !important;
    justify-content: center !important;
    background-color: unset !important;
    width:100% !important;
    height:42px !important;
    margin:3px 0px 0px 0px !important;
    padding:0px !important;
}
.slider-icons-div{
    background-color:#faeaff !important;
    display: flex !important;
    justify-content: center !important;
    width:100% !important;
    margin:0px !important;
    padding:3px 0px 4px 0px !important;
}
.slider-icons span{
    line-height:33px !important;
    padding:0px 10px !important;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.slider-icons span img{
    max-width:20px !important;
    max-height:20px !important
}
.slider-icons span p{
    font-size:9px !important;
    font-weight:unset !important;
    margin:3px 0 0 0 !important;
}
.slider-icons i{
    border-left:1px solid gray !important;
    margin:6px 0px !important;
}
.slider-pc .slider-p-discount{
    direction: rtl !important;
    color:red;
    font-weight: bold;
    margin: -7px 0px 0px 0px;;
    min-height: 30px;
    text-align: center;
    font-size: 12px;
    line-height: 33px !important;
}
.slider-pc .slider-p-discount .bdg{
    font-weight: bold !important;
    font-size: 13px !important;
    background-color:red !important;
    color:white !important;
    border-radius:50% !important;
    padding: 6px 2px 4px 2px !important;
    margin-right: 5px !important;
    text-decoration: none !important;
}
.slider-pc .slider-p-price{
    margin:5px 0px 0px 0px;
    font-size:16px;
    color:#BF29EC;
}
.slider-pc .slider-p-price > span{
    font-weight:bold;
}
.product-mini-details{
    position: relative !important;
    align-items: center !important;
    background-color:white !important;
    box-shadow:0px 0px 10px 0 rgba(0,0,0,0.3) !important;
    border-radius:20px !important;
    margin:20px 0px !important;
}
.slider-dis{
    display: flex !important;
    justify-content: space-around;
    align-items: center;
    --bs-gutter-x: 0px;
    width: 100%;
    min-height:40px;
    text-align: center;
    border-radius: 0px 0px 10px 10px !important;
    overflow: hidden;
}
.p1tt{
    background-color:#98ff98;
    height:40px;
    display: flex;
    justify-content:space-evenly;
    align-items: center;
    font-weight: bold;
}
.p1tt .span1{
    color:red !important;
    font-size:13px !important;
    padding-right:5px !important;
}
.p1tt .span2{
    color:darkblue !important;
    line-height:17px !important;
}
.p2tt{
    background-color:#f87878;
    background-color:#98ff98;
    height:40px;
    font-size: 10px;
    font-weight: bold;
    text-align: center;
    align-items: end;
}
.ttt{
    margin-left: 3px;
    margin-right: 3px;
}
.p1ttt{
    color: white;
    font-size: 12px !important;
    background-color: red;
    border-radius: 50%;
    padding: 2px 3px 0px 3px;
}

/* slider products card */
.slider-pc2{
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
    align-items: center !important;
    height: 360px;
    width: 170px;
    justify-content: space-between;
    background-color: white !important;
    box-shadow: 0px 0px 10px 0 rgb(0 0 0 / 30%) !important;
    border-radius: 35px !important;
    margin: 20px auto 20px auto !important;
}
.slider-pc2 > .slider-p-badge2{
    position:absolute !important;
    text-align:center !important;
    padding-top: 1px !important;
    font-size: 14px !important;
}
.slider-pc2 > .slider-p-badge2 > span{
    background-color: #be29eb !important;
    width: fit-content !important;
    padding: 1px 10px !important;
    border-radius: 0 0 10px 10px !important;
}
.slider-pc2 > .slider-p-name2{
    font-size:16px !important;
    font-weight: bold !important;
    text-align: center;
    margin-top:30px !important;
    margin-bottom:5px !important;
    line-height:1.05 !important;
    min-height:30px !important;
    padding: 0px 15px !important;
}
.slider-pc2 > a > img{
    width:auto !important;
    height:150px !important;
    border-radius: 5px;
}
.slider-pc2 .slider-p-colors2{
    margin-top:5px;
    min-height:15px;
}
.slider-icons2{
    display: flex !important;
    justify-content: center !important;
    background-color:#faeaff !important;
    width:100% !important;
    height:40px !important;
    margin:0px !important;
    padding:4px 0px !important;
}
.slider-icons2 > span{
    line-height:33px !important;
    padding:0px 10px !important;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.slider-icons2 > span > img{
    max-width:20px !important;
    max-height:20px !important
}
.slider-icons2 > span > p{
    font-size:9px !important;
    font-weight:unset !important;
    margin:3px 0 0 0 !important;
}
.slider-icons2 > i{
    border-left:1px solid gray !important;
    margin:6px 0px !important;
}
.slider-pc2 > .slider-p-discount2{
    direction: ltr !important;
    color:gray;
    margin: 5px 0px 0px 0px;;
    min-height: 30px;
    text-align: center;
    font-size: 12px;
}
.slider-pc2 > .slider-p-discount2 > .bdg{
    font-weight: bold !important;
    font-size: 13px !important;
    background-color:red !important;
    color:white !important;
    border-radius:50% !important;
    padding: 6px 2px 4px 2px !important;
    margin-right: 5px !important;
    text-decoration: none !important;
}
.slider-pc2 > .slider-p-price2{
    margin:-12px 0px 5px 0px;
    font-size:16px;
    color:#BF29EC;
}
.slider-pc2 > .slider-p-price2 > span{
    font-weight:bold;
}
.product-mini-details2{
    position: relative !important;
    align-items: center !important;
    background-color:white !important;
    box-shadow:0px 0px 10px 0 rgba(0,0,0,0.3) !important;
    border-radius:50px !important;
    margin:20px 0px !important;
}

/* use in register.php */
.regLog form, .regLog .fildsBox{
    box-shadow: 0px 0px 30px 0px rgb(0 0 0 / 40%);
    border-radius: 20px;
    margin: 5px 20px;
    padding: 20px 30px;
    direction: rtl;
}
.regLog label{
    font-weight: bold;
}
.regLog legend{
    text-align: center;
    font-weight: bold;
    font-size: 35px;
    margin: 0;
}

/* phones.php */
#setedColor{
    background-color: #b63bc8;
    color: white;
    border: 0;
}
.fsshadow{
    border-radius: 10px;
    box-shadow: 0px 0px 10px 0px rgb(0,0,0,0.6);
    padding: 5px 10px;
}
.fsshadow label{
    padding: 7px 15px;
    line-height: 15px;
    background-color: #b842df;
    border-radius: 4px;
    margin-left: 5px;
    color: white;
}
.fpshadow{
    border-radius:10px;
    box-shadow:0px 0px 10px 0px rgba(0,0,0,0.6);
    padding:4px 5px;
}
.fpshadow > input{
    display: none !important;
}
.fpshadow > label > span{
    padding:5px;
    background-color:inherit;
    border:0;
}
.fbshadow{
    border-radius:10px;
    box-shadow:0px 0px 10px 0px rgba(0,0,0,0.6);
    padding:2px 2px;
    height: 100%;
}
.ftshadow{
    border-radius:10px;
    box-shadow:0px 0px 10px 0px rgba(0,0,0,0.6);
    padding:10px 5px;
}
.ftshadow input:checked{
    background-color: #bb3dbb;
}

/* phone.php */
#setSrc{
    box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.8);
    border-radius: 5px;
}
.setSrc{
    max-width:45px;
    max-height:60px;
    margin-left:4px;
    margin-right:4px;
    cursor:pointer;
}
.scrollC::-webkit-scrollbar {
    width: auto;
    background-color: #F5F5F5;
    height: 5px;
}
.scrollC::-webkit-scrollbar-thumb {
    background-color: #aa0ed1;
    border-radius: 10px;
}
.scrollC::-webkit-scrollbar-track {
    background-color: #efc4f0;
    border-radius: 10px;
}

/* select2-selection--single */
.select2-selection--single{
    height: 37px !important;
    padding-top: 5px;
    text-align: center;
}

/* Count Down styles */
.countdown div {
    text-align: center;
    border: 2px solid rgba(255, 255, 255, 0.8);
    border-radius: 8px;
    margin: 3px 10px 0px 10px;
    width: 60px;
    padding: 10px 0px;
}
.countdown .countdownp{
    text-align: center;
    margin:0;
    font-size:18px;
    font-weight:bold;
    padding:0 20px 0 0;
    color:darkgreen;
}
.countdown div .cddp1{
    line-height:25px !important;
    margin: 0px;
    color: purple;
    font-size: 22px;
}
.countdown div .cddp2{
    line-height:20px !important;
    margin: 0px;
    color: darkgreen;
}
@media (max-width: 575px) {
    .countdown div {
        width: 50px;
    }
    .countdownp{
        font-size: 17px;
    }
}
/* Statistics */
.Statistics{
    margin-bottom: 30px;
    box-shadow: 0 0 5px 1px rgb(0 0 0 / 80%);
    padding: 10px;
    border-radius: 10px;
    background-color: #e3dfeb;
}
.StatisticsLegend{
    margin: 0px 0px 10px 0px;
    padding: 0;
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    /* text-shadow: -5px 9px 5px rgb(0 0 0 / 35%); */
}
.StatisticsNaming{
    position: relative;
    margin: 5px 0px;
    border: 1px solid black;
    box-shadow: 0 0 4px 2px rgb(0 200 100 / 80%);
    border-radius: 5px;
    font-size: 15px;
    font-weight: bold;
    padding: 4px 10px 4px 0px;
    background-color: #e2e1e1;
}
.StatisticsCounting{
    position: absolute;
    left: -13px;
    top: 2px;
    margin: 0 15px;
    padding: 2px 10px;
    color: white;
    border-radius: 7px;
}
.today{background-color: #00b12340;}
.lastDay{background-color: #e7017840;}
.lastWeak{background-color: #00afaf50;}
.lastMonth{background-color: #0126e740;}
.allInfo{background-color: #e4a30040;}
.today .StatisticsCounting{background-color: #00b123;}
.lastDay .StatisticsCounting{background-color: #e70178;}
.lastWeak .StatisticsCounting{background-color: #00afaf;}
.lastMonth .StatisticsCounting{background-color: #0126e7;}
.allInfo .StatisticsCounting{background-color: #e4a300;}

/* Product Detiales */
.prInfoBox{
    max-height:500px !important;
    overflow-y:scroll;
}
.prInfoBox::-webkit-scrollbar {
    width: auto;
    background-color: #F5F5F5;
    width: 6px;
}
.prInfoBox::-webkit-scrollbar-thumb {
    background-color: #aa0ed1;
    border-radius: 10px;
}
.prInfoBox::-webkit-scrollbar-track {
    background-color: #efc4f0;
    border-radius: 10px;
}

/* Comparison boxes */
.compPrD{
    position:relative;
    margin:0px auto;
    box-shadow:0px 0px 10px 0px;
    padding:10px 10px 10px 10px;
    border-radius:10px;
    text-align: center;
    justify-content: center;
}
.compPrD button{
    width:35px;
    position:absolute;
    top:0px;
    left:10px;
    font-size:35px;
}
.compPrD img{
    width:200px;
    height:200px;
    margin-top:30px;
    border-radius:10px;
    padding:0;
}
.tbodyD tr td , .tbodyD tr th{
    border-radius:10px;
    border:0;
    text-align:justify;
    padding: 20px;
}
.tbodyD tr td p{
    margin: 0;
    display: flex;
    justify-content: center;
}

/* map and our description on */
.miniABox{
    border-radius: 10px;
    box-shadow: 0 0 12px 3px #02ca53;;
    text-align: center;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 10px 5px;
}
.miniATitle{
    margin-bottom: 15px !important;
    font-weight: bold;
    font-size: 20px;
    color: #b600b6;
}
.miniADesc{
    font-weight: bold;
    font-size: 17px;
    color: #0070ca;
}

/* swiper */
.swiper-pagination{bottom:-8px !important;}

/* bdg */
.bdg-red{
    font-weight: bold;
    font-size: 9px;
    border: 1px solid red;
    padding: 0px 3px 1px 3px;
    margin: 0px 5px 0px 0px;
    border-radius: 7px;
    color: white !important;
    background-color: red;
}

/* comment box */
.com{
    margin: 25px 10px;
    padding: 10px 20px;
    box-shadow: 0 0 3px 0px rgb(0 0 0 / 60%);
    border-radius: 10px;
    background-color: white;
}
.com-fd{
    display: flex;
    justify-content: space-between;
    margin: 5px 0px;
}
.com-fd-name{
    font-weight: bold;
    font-size: 19px;
    color: #850085;
}
.com-fd-date{
    font-weight: bold;
    font-size: 12px;
    color: #686868;
}
.com-text{
    margin: 0;
    text-align: justify;
    line-height: 26px !important;
    font-size: 16px;
    color: #908e8e;
    padding: 0px 25px;
}

label{font-weight: bold;}

.rembtn, .addbtn{
    cursor:pointer;
    font-size:30px;
    height:fit-content;
}

.btnsbox{
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    position: absolute !important;
    left: 30px !important;
    /* top: 1px !important; */
}

/* New Products */
.values-box, .main-info-box{margin: 10px;}
.values-property, .main-info-property{
    font-size: 18px;
    font-weight: bold;
    color: blue;
    border: 1px solid #e2e2e2;
    padding: 3px 8px;
    border-radius: 6px;
    height: fit-content;
}
.values-description, .main-info-description{
    font-size: 15px;
    color: gray;
    border: 1px solid #e2e2e2;
    padding: 5.7px 8px;
    border-radius: 6px;
    height: fit-content;
}
.main-info-property{color:purple;}

.StatisticsNaming-danger{
    position: relative;
    margin: 5px 0px;
    border: 1px solid #5c5c5c;
    box-shadow: 0 0 4px 2px rgb(200 0 0 / 50%);
    border-radius: 5px;
    font-size: 15px;
    font-weight: bold;
    padding: 4px 10px 4px 0px;
    background-color: #f0efef;
}
.StatisticsNaming-success{
    position: relative;
    margin: 5px 0px;
    border: 1px solid #5c5c5c;
    box-shadow: 0 0 4px 2px rgba(7, 200, 0, 0.5);
    border-radius: 5px;
    font-size: 15px;
    font-weight: bold;
    padding: 4px 10px 4px 0px;
    background-color: #f0efef;
}

/* HR Title */
.hrtitle{
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    padding: 40px 0px 20px 0px !important;
}
.hrtitle span{
    margin: 0px 20px !important;
    font-size: 20px !important;
    font-weight: bold !important;
    /* border: 1px solid #0007806e; */
    border-radius: 50%;
    padding: 15px;
    box-shadow: 0px 0px 10px 5px #ff000070;
}
.hrtitle hr{
    border-top: 3px solid green !important;
    width: 100% !important;
    flex: 1 0 0%;
    margin: 0 !important;
    opacity: .5 !important;
}

