/* Native CSS icons — replaces Font Awesome CDN */

.fa {
    display: inline-block;
    font-style: normal;
    line-height: 1;
    vertical-align: -0.125em;
}

.fa::before {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: no-repeat center / contain;
    mask: no-repeat center / contain;
}

.fa-spin::before {
    animation: ui-icon-spin 0.8s linear infinite;
}

@keyframes ui-icon-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.fa-bars::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3 6h18v2H3V6zm0 5h18v2H3v-2zm0 5h18v2H3v-2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3 6h18v2H3V6zm0 5h18v2H3v-2zm0 5h18v2H3v-2z'/%3E%3C/svg%3E");
}

.fa-sign-in::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M10 17l5-5-5-5v3H3v4h7v3zm9-12h-8v2h6v12h-6v2h8a2 2 0 002-2V7a2 2 0 00-2-2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M10 17l5-5-5-5v3H3v4h7v3zm9-12h-8v2h6v12h-6v2h8a2 2 0 002-2V7a2 2 0 00-2-2z'/%3E%3C/svg%3E");
}

.fa-sign-out::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M14 7l5 5-5 5v-3H7v-4h7V7zM5 5h6V3H5a2 2 0 00-2 2v14a2 2 0 002 2h6v-2H5V5z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M14 7l5 5-5 5v-3H7v-4h7V7zM5 5h6V3H5a2 2 0 00-2 2v14a2 2 0 002 2h6v-2H5V5z'/%3E%3C/svg%3E");
}

.fa-user::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 12a4 4 0 100-8 4 4 0 000 8zm0 2c-3.3 0-6 1.8-6 4v2h12v-2c0-2.2-2.7-4-6-4z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 12a4 4 0 100-8 4 4 0 000 8zm0 2c-3.3 0-6 1.8-6 4v2h12v-2c0-2.2-2.7-4-6-4z'/%3E%3C/svg%3E");
}

.fa-user-plus::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M15 12a4 4 0 100-8 4 4 0 000 8zM3 20v-1c0-2.8 3.6-4 6-4 1.1 0 2.2.2 3.2.6A5.5 5.5 0 0012 12a5.5 5.5 0 00-5.5 5.5c.4 1 .6 2.1.6 3.2 0 2.4-1.2 6-4 6H3zm13-7v-2h-2V9h-2v2H9v2h2v2h2v-2h2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M15 12a4 4 0 100-8 4 4 0 000 8zM3 20v-1c0-2.8 3.6-4 6-4 1.1 0 2.2.2 3.2.6A5.5 5.5 0 0012 12a5.5 5.5 0 00-5.5 5.5c.4 1 .6 2.1.6 3.2 0 2.4-1.2 6-4 6H3zm13-7v-2h-2V9h-2v2H9v2h2v2h2v-2h2z'/%3E%3C/svg%3E");
}

.fa-key::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 14a5 5 0 110-10 5 5 0 010 10zm8-2l4 4-2 2-4-4 1-1 1 1z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 14a5 5 0 110-10 5 5 0 010 10zm8-2l4 4-2 2-4-4 1-1 1 1z'/%3E%3C/svg%3E");
}

.fa-unlock-alt::before,
.fa-unlock::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M17 9h-1V7a4 4 0 10-8 0v2H7a2 2 0 00-2 2v8a2 2 0 002 2h10a2 2 0 002-2v-8a2 2 0 00-2-2zm-6 0V7a2 2 0 114 0v2h-4z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M17 9h-1V7a4 4 0 10-8 0v2H7a2 2 0 00-2 2v8a2 2 0 002 2h10a2 2 0 002-2v-8a2 2 0 00-2-2zm-6 0V7a2 2 0 114 0v2h-4z'/%3E%3C/svg%3E");
}

.fa-lock::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M17 10h-1V7a4 4 0 10-8 0v3H7a2 2 0 00-2 2v7a2 2 0 002 2h10a2 2 0 002-2v-7a2 2 0 00-2-2zm-6 0V7a2 2 0 114 0v3h-4z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M17 10h-1V7a4 4 0 10-8 0v3H7a2 2 0 00-2 2v7a2 2 0 002 2h10a2 2 0 002-2v-7a2 2 0 00-2-2zm-6 0V7a2 2 0 114 0v3h-4z'/%3E%3C/svg%3E");
}

.fa-list-alt::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 7h14v2H7V7zm0 4h14v2H7v-2zm0 4h14v2H7v-2zM3 7h2v2H3V7zm0 4h2v2H3v-2zm0 4h2v2H3v-2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 7h14v2H7V7zm0 4h14v2H7v-2zm0 4h14v2H7v-2zM3 7h2v2H3V7zm0 4h2v2H3v-2zm0 4h2v2H3v-2z'/%3E%3C/svg%3E");
}

.fa-check::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E");
}

.fa-check-circle::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 100 20 10 10 0 000-20zm-1 14.2-3.5-3.5 1.4-1.4 2.1 2.1 4.9-4.9 1.4 1.4-6.3 6.3z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 100 20 10 10 0 000-20zm-1 14.2-3.5-3.5 1.4-1.4 2.1 2.1 4.9-4.9 1.4 1.4-6.3 6.3z'/%3E%3C/svg%3E");
}

.fa-info-circle::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 100 20 10 10 0 000-20zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 100 20 10 10 0 000-20zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z'/%3E%3C/svg%3E");
}

.fa-shopping-cart::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 18a2 2 0 100 4 2 2 0 000-4zm10 0a2 2 0 100 4 2 2 0 000-4zM7.2 14h9.9l2.8-10H6.3L5 2H2v2h2l3.6 12z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 18a2 2 0 100 4 2 2 0 000-4zm10 0a2 2 0 100 4 2 2 0 000-4zM7.2 14h9.9l2.8-10H6.3L5 2H2v2h2l3.6 12z'/%3E%3C/svg%3E");
}

.fa-credit-card::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h16a2 2 0 012 2v12a2 2 0 01-2 2H4a2 2 0 01-2-2V6a2 2 0 012-2zm0 6h16V8H4v2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h16a2 2 0 012 2v12a2 2 0 01-2 2H4a2 2 0 01-2-2V6a2 2 0 012-2zm0 6h16V8H4v2z'/%3E%3C/svg%3E");
}

.fa-diamond::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2l8 6-8 14L4 8l8-6zm0 3.8L7.6 8h8.8L12 5.8z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2l8 6-8 14L4 8l8-6zm0 3.8L7.6 8h8.8L12 5.8z'/%3E%3C/svg%3E");
}

.fa-id-badge::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 3h10a2 2 0 012 2v14a2 2 0 01-2 2H7a2 2 0 01-2-2V5a2 2 0 012-2zm0 4v10h10V7H7zm2 2h6v2H9V9zm0 4h4v2H9v-2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 3h10a2 2 0 012 2v14a2 2 0 01-2 2H7a2 2 0 01-2-2V5a2 2 0 012-2zm0 4v10h10V7H7zm2 2h6v2H9V9zm0 4h4v2H9v-2z'/%3E%3C/svg%3E");
}

.fa-angle-left::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M15.4 7.4 14 6l-6 6 6 6 1.4-1.4-4.6-4.6z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M15.4 7.4 14 6l-6 6 6 6 1.4-1.4-4.6-4.6z'/%3E%3C/svg%3E");
}

.fa-wechat::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 3C5.1 3 2 5.7 2 9c0 1.9 1 3.6 2.6 4.7L4 17l3.4-1.7c.8.2 1.6.3 2.5.3 3.9 0 7-2.7 7-6.1C17 5.7 13.5 3 9 3zm8 4c2.8 0 5 2 5 4.5 0 2.3-2 4.2-4.6 4.2-.7 0-1.4-.1-2-.3L13 16l.8-2.3C15.1 12.8 17 11 17 9.5 17 7.9 15.3 7 13 7z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 3C5.1 3 2 5.7 2 9c0 1.9 1 3.6 2.6 4.7L4 17l3.4-1.7c.8.2 1.6.3 2.5.3 3.9 0 7-2.7 7-6.1C17 5.7 13.5 3 9 3zm8 4c2.8 0 5 2 5 4.5 0 2.3-2 4.2-4.6 4.2-.7 0-1.4-.1-2-.3L13 16l.8-2.3C15.1 12.8 17 11 17 9.5 17 7.9 15.3 7 13 7z'/%3E%3C/svg%3E");
}

.fa-refresh::before,
.fa-spinner::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M17.7 6.3A7.9 7.9 0 0012 4a8 8 0 108 8h-2a6 6 0 11-1.8-4.2l-2.2 2.2V8h5.7L17.7 6.3z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M17.7 6.3A7.9 7.9 0 0012 4a8 8 0 108 8h-2a6 6 0 11-1.8-4.2l-2.2 2.2V8h5.7L17.7 6.3z'/%3E%3C/svg%3E");
}

.ui-sidebar-extra a .fa,
.ui-sidebar-profile-menu a .fa,
.ui-sidebar-logout .fa {
    width: 14px;
    margin-right: 2px;
}

.ui-auth-icon .fa,
.vip-pay-success__icon .fa {
    font-size: 28px;
}

.vip-pay-success__tip .fa {
    margin-right: 6px;
}