// Some icons that we wanted to complete the font-awesome library have been
// imported into Odoo UI Icons (oi-*), but we keep some old fa variant classes
// to maintain compatibility.
%additional-fa-classes {
    font-family: 'odoo_ui_icons' !important;
}
.fa.fa-tiktok {
    @extend %additional-fa-classes;

    &::before {
        content: '\e81b';
    }
}
// Don't write `.fa.fa-twitter` or this will be considered like a new icon in
// the media dialog. The css here is just about overriding the existing twitter
// icon and should not be considered as a new icon, otherwise those icons will
// be shown twice in the media dialog. Grep: `iconsParser` and `fontIcons`.
.fa-twitter.fa {
    @extend %additional-fa-classes;

    &::before {
        content: '\e81a';
    }
}
.fa-twitter-square.fa {
    @extend %additional-fa-classes;

    &::before {
        content: '\e848';
    }
}
.fa.fa-discord {
    @extend %additional-fa-classes;

    &::before {
        content: '\e811';
    }
}
.fa.fa-google-play {
    @extend %additional-fa-classes;

    &::before {
        content: "\e81d";
    }
}
.fa.fa-strava {
    @extend %additional-fa-classes;

    &::before {
        content: "\e80f";
    }
}
.fa.fa-bluesky {
    @extend %additional-fa-classes;

    &::before {
        content: "\e81c";
    }
}
.fa.fa-kickstarter {
    @extend %additional-fa-classes;

    &::before {
        content: "\e819";
    }
}
.fa.fa-threads {
    @extend %additional-fa-classes;

    &::before {
        content: "\e818";
    }
}

// This is rtl language specific fix
// It will override the font awesome symbols and flip them 180 degree
.o_rtl {
    .fa {
        &.fa-align-right,
        &.fa-align-left,
        &.fa-chevron-right,
        &.fa-chevron-left,
        &.fa-arrow-right,
        &.fa-arrow-left,
        &.fa-hand-o-right,
        &.fa-hand-o-left,
        &.fa-arrow-circle-right,
        &.fa-arrow-circle-left,
        &.fa-caret-right,
        &.fa-caret-left,
        &.fa-rotate-right,
        &.fa-rotate-left,
        &.fa-angle-double-right,
        &.fa-angle-double-left,
        &.fa-angle-right,
        &.fa-angle-left,
        &.fa-quote-right,
        &.fa-quote-left,
        &.fa-chevron-circle-right,
        &.fa-chevron-circle-left,
        &.fa-long-arrow-right,
        &.fa-long-arrow-left,
        &.fa-toggle-right,
        &.fa-toggle-left,
        &.fa-caret-square-o-right,
        &.fa-arrow-circle-o-left,
        &.fa-arrow-circle-o-right,
        &.fa-caret-square-o-left {
            transform: rotate(180deg);
        }
    }
}
