mobile-menu{
    position: fixed;
    min-height: 100vh;
    width:100%;
    z-index: 10;
    background-color: rgb(var(--color-background));
    display: grid;
    grid: auto / auto-flow 100%;
    --mobile-menu-border-color:0,0,0;
    --horizontal-padding:5vw;
    overflow: hidden;
}
mobile-menu .mobile-menu-first{
    display: flex;
    flex-direction: column;
    height: 80vh;
    justify-content: space-between;
}
mobile-menu .mobile-menu-social{
    border-top:1px solid rgba(var(--mobile-menu-border-color),0.1);
    border-bottom:1px solid rgba(var(--mobile-menu-border-color),0.1);
    padding:30px var(--horizontal-padding);
}

mobile-menu .mobile-menu-social-media-content{
    display: flex;
    flex-wrap: wrap;
    column-gap:13vw;
    row-gap: 20px;
}

mobile-menu .mobile-menu-social-media-content svg{

}

mobile-menu .mobile-menu-accout{
    padding:30px var(--horizontal-padding);
}
mobile-menu .mobile-menu-accout .header-nav-drawer__login{
    display: flex;
    align-items: center;
    gap: 2.67vw;
}

mobile-menu .mobile-link-1{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top:20px;
    padding-bottom:20px;
    padding-left: var(--horizontal-padding);
    padding-right: var(--horizontal-padding);
    border-bottom:1px solid rgba(var(--mobile-menu-border-color),0.1);
}
mobile-menu .open-icon{
    display: flex;
}
mobile-menu .open-icon svg{
    height: 16px;
}
mobile-menu .mobile-menu-second{
    height:90%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-top:40px;
    padding-left:var(--horizontal-padding);
    padding-right: var(--horizontal-padding);
}
mobile-menu .mobile-menu-back{
    margin-bottom:30px;
}
mobile-menu .mobile-menu-back-button{
    background-color: #F1E4D3;
    padding: 10px 20px;
    display: flex;
    gap:10px;
    align-items: center;
    border:0;
}

mobile-menu .mobile-link-3-ul{
    margin-top:30px;
    display: grid;
    gap:20px;
}
mobile-menu .mobile-menu-promp{
    overflow: auto;
    scrollbar-width: none;
}
mobile-menu .mobile-menu-promp-grid{
    display: grid;
    grid: auto / auto-flow 40%;
}

mobile-menu .mobile-link-2{
    display: none;
    flex-wrap: wrap;
    gap:50px;
}
mobile-menu .mobile-link-2.active{
    display: flex;
}

mobile-menu .mobile-link-2-body{
    
}
mobile-menu .header-nav-drawer__icon{
    display: flex;
    align-items: center;
}
mobile-menu .header-nav-drawer__icon svg path{
    fill:#333333;
}