.customer-user-icon {
    display: inline-block;
    margin-left: 10px;
    vertical-align: middle;
}

.customer-user-icon a {
    font-size: 18px;
    color: #333;
    text-decoration: none;
    display: flex;
    align-items: center;
}

.customer-user-icon svg {
    width: 24px;
    height: 24px;
    fill: #333;
}

.customer-user-icon a:hover svg {
    fill: #007bff;
}

/* Hide default chevron */
.customer-welcome .action.switch:after {
    display: none;
}

/* Add SVG user icon */
.customer-welcome .action.switch {
    position: relative;
    padding-left: 30px; /* Space for the icon */
}

/* Insert SVG icon before the welcome message */
.customer-welcome .action.switch::after, .customer-welcome .action.switch::before {
    content: ""!important;
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%231e3a5f"><path fill-rule="evenodd" clip-rule="evenodd" d="M12 2C9.243 2 7 4.243 7 7C7 9.757 9.243 12 12 12C14.757 12 17 9.757 17 7C17 4.243 14.757 2 12 2ZM5 21C5 17.141 8.141 14 12 14C15.859 14 19 17.141 19 21H5Z"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    background-color:#ffffff;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    color:#ffb200;
}

/* Adjust hover effect */
.customer-welcome .action.switch:hover::after, .customer-welcome .action.switch:hover::before {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23ffb200"><path fill-rule="evenodd" clip-rule="evenodd" d="M12 2C9.243 2 7 4.243 7 7C7 9.757 9.243 12 12 12C14.757 12 17 9.757 17 7C17 4.243 14.757 2 12 2ZM5 21C5 17.141 8.141 14 12 14C15.859 14 19 17.141 19 21H5Z"/></svg>');
}