/* Product Icons */

i.pi {
    display: inline-block;
}


i.pi::after {
    content: '';
    display: inline-block;
    height: 1.5em;
    width: 1.5em;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
}

i.pi.pi-fw::after {
    width: 3em;
}

/**************/
/* THEME ICONs */
/**************/

.pi-account::after {
background-image: url('../../imgs/icons/menu/account-icon-deactive.svg');
}

.active .pi-account::after {
background-image: url('../../imgs/icons/menu/account-icon-active.svg');
}

.pi-aiadvisor::after {
background-image: url('../../imgs/icons/menu/aiadvisor-icon-deactive.svg');
}

.active .pi-aiadvisor::after {
background-image: url('../../imgs/icons/menu/aiadvisor-icon-active.svg');
}

.pi-support::after {
background-image: url('../../imgs/icons/menu/support-icon-deactive.svg');
}

.active .pi-support::after {
background-image: url('../../imgs/icons/menu/support-icon-active.svg');
}

.pi-comparison::after {
background-image: url('../../imgs/icons/menu/comparison-icon-deactive.svg');
}

.active .pi-comparison::after {
background-image: url('../../imgs/icons/menu/comparison-icon-active.svg');
}

.pi-dashboard::after {
background-image: url('../../imgs/icons/menu/dashboard-icon-deactive.svg');
}

.active .pi-dashboard::after {
background-image: url('../../imgs/icons/menu/dashboard-icon-active.svg');
}

.pi-details::after {
background-image: url('../../imgs/icons/menu/details-icon-deactive.svg');
}

.active .pi-details::after {
background-image: url('../../imgs/icons/menu/details-icon-active.svg');
}

.pi-feedback::after {
background-image: url('../../imgs/icons/menu/feedback-icon-deactive.svg');
}

.active .pi-feedback::after {
background-image: url('../../imgs/icons/menu/feedback-icon-active.svg');
}

.pi-overview::after {
background-image: url('../../imgs/icons/menu/overview-icon-deactive.svg');
}

.active .pi-overview::after {
background-image: url('../../imgs/icons/menu/overview-icon-active.svg');
}

.pi-realtime::after {
background-image: url('../../imgs/icons/menu/realtime-icon-deactive.svg');
}

.active .pi-realtime::after {
background-image: url('../../imgs/icons/menu/realtime-icon-active.svg');
}

.pi-analytics::after {
background-image: url('../../imgs/icons/menu/analytics-icon-deactive.svg');
}

.active .pi-analytics::after {
background-image: url('../../imgs/icons/menu/analytics-icon-active.svg');
}

.pi-setting::after {
background-image: url('../../imgs/icons/menu/setting-icon-deactive.svg');
}

.active .pi-setting::after {
background-image: url('../../imgs/icons/menu/setting-icon-active.svg');
}

/**********************************************************/
/* #TODO TEMPORARY  ICONS to be replaced with custom ones */
/**********************************************************/


.pi-classes::after {
background-image: url('../../imgs/icons/menu/support-icon-deactive.svg');
}

.active .pi-classes::after {
background-image: url('../../imgs/icons/menu/support-icon-active.svg');
}

.pi-channels::after {
background-image: url('../../imgs/icons/menu/feedback-icon-deactive.svg');
}

.active .pi-channels::after {
background-image: url('../../imgs/icons/menu/feedback-icon-active.svg');
}


/*****************/
/* EXTRA  ICONS  */
/*****************/

.pi-logout::after {
    filter: invert(100%);
background-image: url('../../imgs/icons/menu/logout-icon.svg');
}

/*
.active .pi-setting::after {
background-image: url('../../imgs/icons/menu/logout-icon.svg');
}
*/