/* Delivery address + orders + information div */
.user_links_div{
    display: flex;
    gap: 15px;
}

/* Container for user links */
.user_links_section{
    display: flex;
    justify-content: space-between;
    padding: 50px 0px 40px 0px;
    border-bottom: 1px solid var(--grey2);
}

/* Specific link in user profile */
.user_link_btn{
    display: flex;
    gap: 10px;
    align-items: center;
    border-radius: 5px;
    border: 1px solid var(--grey4);
    padding: 10px 20px;
    width: fit-content;
    cursor: pointer;
    transition: color 0.3s, border-color 0.3s;
}

.user_link_btn.active_user_link{
    transition: unset;
}

/* Specific link in user profile (hovered) */
.user_link_btn:hover{
    border: 1px solid var(--purple1);
    color: var(--purple1);
}

/* User link icons */
.user_link_hover, .user_link_active, picture:has(.user_link_hover), picture:has(.user_link_active){
    display: none;
}

/* User link icon (when hovered) */
.user_link_btn:hover .user_link_hover, .user_link_btn:hover picture:has(.user_link_hover){
    display: block;
}

/* User link icon (when hovered) */
.user_link_btn:hover .user_link_default, .user_link_btn:hover picture:has(.user_link_default){
    display: none;
}

/* Button text */
.active_user_link .btn4{
    color: white;
}

/* Active button */
.active_user_link{
    color: white;
    background-color: var(--purple1);
    cursor:auto;
}

/* Active button icon */
.active_user_link .user_link_active, .active_user_link picture:has(.user_link_active){
    display: block;
}

/* Active button default icon */
.active_user_link .user_link_default, .active_user_link picture:has(.user_link_default){
    display: none;
}

/* User delivery address icon */
.user_delivery_address img{
    width: 12px;
    height: 17px;
}

/* User delivery address icon */
.user_my_orders img{
    width: 16px;
    height: 16px;
}

/* User link icon (when hovered) */
.user_link_btn.active_user_link:hover .user_link_hover, .user_link_btn.active_user_link:hover picture:has(.user_link_hover){
    display: none;
}

/* User link icon (when hovered) */
.user_link_btn.active_user_link:hover{
    border: 1px solid var(--grey4);
    color: white;
}

/* Mobile/tablet part of component */
.user_links_section_mobile_tablet{
    display: none;
}

/* Sign out button */
.user_sign_out{
    background-color: inherit;
    font-family: 'poppins';
}

@media screen and (max-width:1250px){

    /* Mobile/tablet version of component */
    .user_links_section_mobile_tablet{
        display: block;
    }

    /* Desktop version of component */
    .user_links_section{
        display: none;
    }

    /* Page title */
    .user_links_section_mobile_tablet .h5{
        border-bottom: 2px solid var(--purple1);
        border-image: linear-gradient(to right, var(--purple1) 50%, transparent 50%) 100% 1;
        padding-bottom: 10px;
        width: fit-content;
        margin-top: 50px;
        font-size: 24px;
        font-weight: 600;
    }
}

@media screen and (max-width:1100px){

    /* Main component container */
    .user_profile_links_container{
        padding: 0px 50px;
    }
}

@media screen and (max-width:767px){

    /* Main component container */
    .user_profile_links_container{
        padding: 0px 15px;
    }

    /* Page title */
    .user_links_section_mobile_tablet .h5{
        margin-top: 30px;
        font-size: 16px;
    }
}