@font-face {
    font-family: Abi;
    font-display: swap;
    src: url("/theme/font/Abi/Abi-Regular.ttf") format("truetype"),
         urL("/theme/font/Abi/Abi-Regular.woff") format("woff"),
         url("/theme/font/Abi/Abi-Regular.woff2") format("woff2");
}

@font-face {
    font-family: Plasma;
    font-display: swap;
    src: url("/theme/font/Plasma/PlasmaCircleDots-Bold.ttf") format("truetype"),
    urL("/theme/font/Plasma/PlasmaCircleDots-Bold.woff") format("woff"),
    url("/theme/font/Plasma/PlasmaCircleDots-Bold.woff2") format("woff2");
}

html, body{
    height: 100%;
}

*{
    direction: rtl;
    text-align: right;
    font-family: Abi;
}

.plasma{
    font-family: Plasma !important;
}

body{
    margin: 0;
}

ul{
    padding: 0;
    margin: 0;
}

li{
    list-style: none;
}

a{
    text-decoration: none;
}

input[type=checkbox]{
    appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 4px;
    background: #eee;
}

input[type=checkbox]:checked{
    background: #2AA27A;
}

p.error-message{
    color: #f00;
    font-size: 16px;
    font-weight: 700;
    margin: 1rem auto;
}

.pagination span.deactivate{
    background: #C6CACF;
}

.pagination span.deactivate svg path{
    stroke: #fff;
}

.pagination span.active{
    border: 1px solid #1E6EE7;
    color: #1E6EE7;
}

.bottom-navigation .active p{
    color: #1E6EE7;
    position: relative;
    z-index: 2;
}

.bottom-navigation svg{
    position: relative;
    z-index: 2;
}

.bottom-navigation .active svg path{
    fill: #1E6EE7;
}

.bottom-navigation .active{
    position: relative;
}

.bottom-navigation .active::before{
    content: "";
    position: absolute;
    top: -1.7rem;
    background: #fff;
    border-radius: 100%;
    width: 59px;
    height: 58px;
    z-index: 2;
}

.bottom-navigation .active::after{
    content: "";
    position: absolute;
    top: -1.8rem;
    background: #1E6EE7;
    border-radius:100%;
    width: 58px;
    height: 56px;
    z-index: 1;
}

.search_result .tooltip{
    opacity: 0;
}

.search_result .product_name:hover .tooltip{
    opacity: 1 !important;
}