/* ===========================================
   TABLET
=========================================== */

@media (max-width:992px){

.header{

    height:auto;

    padding:15px;

    flex-wrap:wrap;

    gap:15px;

}

.logo{

    height:80px;

}

.phones{

    display:none;

}

.search-box{

    width:95%;

    margin-top:170px;

}

.slide{

    height:320px;

}

.slide-content{

    padding:25px;

}

.slide-content h2{

    font-size:26px;

}

.products-box{

    grid-template-columns:repeat(2,1fr);

}

.product-card img{

    height:210px;

}

.banner{

    width:98%;

}

.footer-container{

    grid-template-columns:repeat(2,1fr);

}

}

/* ===========================================
   MOBILE
=========================================== */

@media (max-width:768px){

.header{

    display:grid;

    grid-template-columns:1fr auto auto auto;

    align-items:center;

    gap:10px;

    padding:10px;

}

.logo{

    height:55px;

}

.right-section{

    gap:10px;

}

.left-section{

    gap:10px;

}

.user-btn{

    width:45px;

    height:45px;

    padding:0;

    justify-content:center;

}

.user-btn span{

    display:none;

}

.cart-btn{

    width:45px;

    height:45px;

}

.menu-toggle{

    width:45px;

    height:45px;

}

.search-box{

    width:96%;

    margin-top:120px;

}

.search-box input{

    height:50px;

    font-size:14px;

}

.search-box button{

    width:50px;

    height:50px;

}

.slide{

    height:230px;

}

.slide-content h2{

    font-size:20px;

}

.slide-content p{

    font-size:13px;

}

.slider-btn{

    display:none;

}

.products-box{

    grid-template-columns:repeat(2,1fr);

    gap:15px;

}

.product-card img{

    height:170px;

}

.product-buttons{

    flex-direction:column;

}

.footer-container{

    grid-template-columns:1fr;

    text-align:center;

}

.footer-box h3::after{

    right:50%;

    transform:translateX(50%);

}

}
/* ===========================================
   SMALL MOBILE
=========================================== */

@media (max-width:480px){

html,
body{

    overflow-x:hidden;

}

.header{

    padding:8px;

    grid-template-columns:1fr auto auto auto;

}

.logo{

    height:45px;

}

.cart-btn,
.menu-toggle,
.user-btn{

    width:42px;

    height:42px;

    font-size:18px;

}

.user-btn span{

    display:none;

}

.search-box{

    width:97%;

    margin-top:100px;

    gap:8px;

}

.search-box input{

    height:46px;

    padding:0 15px;

    font-size:13px;

}

.search-box button{

    width:46px;

    height:46px;

    font-size:18px;

}

#searchResult{

    top:52px;

    border-radius:14px;

}

.search-item{

    padding:10px;

}

.search-item img{

    width:42px;

    height:42px;

}

.search-title{

    font-size:13px;

}

.search-price{

    font-size:13px;

}

.slide{

    height:170px;

}

.slide-content{

    padding:15px;

}

.slide-content h2{

    font-size:18px;

}

.slide-content p{

    font-size:12px;

}

.products-box{

    grid-template-columns:1fr;

    gap:15px;

}

.product-card{

    border-radius:16px;

}

.product-card img{

    height:180px;

}

.product-title{

    font-size:15px;

}

.new-price{

    font-size:20px;

}

.product-buttons{

    flex-direction:column;

}

.product-buttons a{

    width:100%;

}

.banner{

    width:98%;

    border-radius:12px;

}

.banner img{

    border-radius:12px;

}

.footer{

    margin-top:50px;

}

.footer-container{

    padding:30px 15px;

}

.footer-box h3{

    font-size:18px;

}

.footer-box p,
.footer-box a{

    font-size:14px;

}

.copyright{

    font-size:12px;

}

.menu{

    width:260px;

}

.menu-item{

    font-size:14px;

    padding:12px;

}

.submenu a{

    font-size:13px;

}

}

/* جلوگیری از اسکرول افقی */

*{

    max-width:100%;

}

img{

    display:block;

}