.border-mask{-webkit-mask-image:linear-gradient(90deg,#0000,#000 10% 80%,#0000);mask-image:linear-gradient(90deg,#0000,#000 10% 80%,#0000)}
.gotop{z-index:2;opacity:0;cursor:pointer;background:#fafafa;border-radius:50%;justify-content:center;align-items:center;width:50px;height:50px;transition:all .4s;display:flex;position:fixed;bottom:40px;right:40px;transform:translateY(200px)scale(0);box-shadow:0 5px 15px #00000059}.gotop.showGoTop:hover{opacity:1;transform:translateY(0)scale(1.1)!important}.gotop i{font-size:1.5rem}.gotop.showGoTop{opacity:.7;transform:translateY(0)scale(1)}
.top-header{background-color:var(--first-color-primary);flex-direction:row;justify-content:space-between;align-items:center;padding:20px 2vw;display:flex}.top-header .left,.top-header .middle,.top-header .right{font-family:var(--first-family);flex-direction:row;gap:15px;display:flex}.top-header .left i,.top-header .middle i,.top-header .right i{color:var(--fourth-color-primary)}.top-header .left a,.top-header .middle a,.top-header .right a{color:var(--fourth-color-primary);cursor:pointer;justify-content:center;align-items:center;gap:5px;transition:all .5s;display:flex}.top-header .left a:hover,.top-header .middle a:hover,.top-header .right a:hover{color:var(--background-color-secondary);scale:1.02}.top-header .left .location label{cursor:pointer;justify-content:center;align-items:center;gap:2px;transition:all .5s;display:flex}.top-header .right{gap:20px}.top-header .right .socials{cursor:default;flex-direction:row;gap:10px;display:flex}.top-header .right .socials i{cursor:pointer;font-size:1.2rem;transition:all .5s}.top-header .right .socials i:hover{color:var(--first-color-secondary);scale:1.1}@media screen and (max-width:900px){.top-header .left .mail{display:none}}@media screen and (max-width:680px){.top-header .left .phone,.top-header .right .contact-us{display:none}}@media screen and (max-width:360px){.top-header .left{display:none}.top-header .right{flex:1;justify-content:space-between}}
nav{flex-direction:row;justify-content:space-between;align-items:center;padding:10px max(3vw,10px);display:flex}nav .left{cursor:pointer;justify-content:center;align-items:center;display:flex}nav .middle{border:1px var(--fifth-color-secondary) solid;flex-direction:row;flex:1;margin:0 max(5vw,30px);display:flex}nav .middle input[type=text]{height:50px;font-family:var(--third-family);border:0;border:1px var(--fifth-color-secondary) solid;flex:1;padding:0 10px}nav .middle input[type=text]:focus{outline:none}nav .middle .select-category{border:1px var(--fifth-color-secondary) solid;font-family:var(--fourth-family);color:var(--fourth-color-primary);cursor:pointer;flex-direction:row;align-items:center;gap:7px;padding:0 14px;font-weight:300;display:flex}nav .middle button{border:1px var(--fifth-color-secondary) solid;aspect-ratio:1;height:50px;color:var(--fourth-color-primary);cursor:pointer;background-color:#0000}nav .right{flex-direction:row;align-items:center;display:flex}nav .right .login{font-family:var(--fourth-family);cursor:pointer;border-radius:10px;flex-direction:row;align-items:center;gap:8px;height:40px;padding:0 8px;transition:all .5s;display:flex}nav .right .login i{color:var(--first-color-secondary)}nav .right .login:hover{background-color:#f1f1f1;scale:1.05}nav .right .cart{border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;transition:all .5s;display:flex;position:relative}nav .right .cart:hover{background-color:#f1f1f1;scale:1.1}nav .right .cart span{cursor:pointer;color:var(--fourth-color-primary)}nav .right .cart .total-number{font-family:var(--fourth-family);width:22px;height:22px;color:var(--background-color-primary);background-color:var(--second-color-primary);border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;top:-5px;right:-8px}.hamburger{background-color:var(--first-color-secondary);cursor:pointer;width:40px;height:4px;display:none;position:relative}.hamburger:after,.hamburger:before{content:"";background-color:var(--first-color-secondary);cursor:pointer;width:40px;height:4px;position:absolute}.hamburger:after{bottom:-10px}.hamburger:before{top:-10px}@media screen and (max-width:1180px){nav .menu{display:none}}@media screen and (max-width:950px){nav .right{gap:5px}nav .left img{width:180px}.hamburger-menu{display:flex!important}}@media screen and (max-width:460px){nav .left img{width:120px}nav .right .login span{display:none}nav .right .login i{font-size:1.3rem}nav .right .login{border-radius:50%}}
.cart-items-scrollbar{scrollbar-width:thin}
.menu .link{padding-bottom:5px;overflow-x:hidden}.menu .link.active{color:var(--color-neutral-900,#171717)}.menu .link a{transition:all .5s;position:relative}.menu .link.en a:after{right:100%}.menu .link.ar a:after{left:100%}.menu .link a:after{content:"";background:var(--first-color-primary);width:100%;height:2px;transition:all .5s;position:absolute;bottom:-5px}.menu .link.active.ar a:after,.menu .link.ar a:hover:after{left:0%}.menu .link.active.en a:after,.menu .link.en a:hover:after{right:0%}
