/*--------------------------------------------------------------------------*\
    Small svg symbol "i" that allow to display a comment bubble
\*--------------------------------------------------------------------------*/

.comment__icon {
    /*box*/
    display: block;
    width: 100%;
    height: 100%;

    /*transition*/
    -webkit-transition: fill 0.5s;
    transition: fill 0.5s;
}

/*--------------------------------------------------------------------------*\
        Dark
\*--------------------------------------------------------------------------*/

.table__tr-action .comment--dark:hover>.comment__icon,
.comment--dark>.comment__icon{
    /*background*/
    fill: var(--c-secondary-5);
}

.comment--dark:hover>.comment__icon {
    /*background*/
    fill: var(--c-cta-2);
}

/*--------------------------------------------------------------------------*\
        Light
\*--------------------------------------------------------------------------*/

.table__tr-action .comment--light:hover>.comment__icon,
.comment--light>.comment__icon{
    /*background*/
    fill: var(--c-tertiary-2);
}

.comment--light:hover>.comment__icon {
    /*background*/
    fill: var(--c-tertiary-4);
}