/* ==========================================================
   TTC - ZALO / FLATSOME FOLLOW ICONS
   ========================================================== */


/* Anchor Zalo */

.social-icons.follow-icons .ttc-zalo-follow {
    display: inline-flex !important;

    align-items: center;
    justify-content: center;

    vertical-align: middle;

    text-decoration: none !important;
}


/* ==========================================================
   ZALO MARK
   ========================================================== */

.social-icons.follow-icons .ttc-zalo-icon {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;

    padding: 0 3px;

    color: currentColor;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 9px;
    font-weight: 800;
    line-height: 1;

    letter-spacing: -0.7px;

    text-transform: none;

    transition:
        transform .25s ease,
        color .25s ease;
}


/* ==========================================================
   OUTLINE
   ========================================================== */

.social-icons.follow-icons
.ttc-zalo-follow.is-outline {
    border-color: currentColor;
}


/* ==========================================================
   FILL
   ========================================================== */

.social-icons.follow-icons
.ttc-zalo-follow.is-fill {
    display: inline-flex !important;
}


/* ==========================================================
   HOVER
   ========================================================== */

.social-icons.follow-icons
.ttc-zalo-follow:hover {
    color: #142b49 !important;

    background-color:
        var(--primary-color) !important;

    border-color:
        var(--primary-color) !important;
}


.social-icons.follow-icons
.ttc-zalo-follow:hover
.ttc-zalo-icon {
    transform: scale(1.06);
}


/* ==========================================================
   SMALL
   ========================================================== */

.social-icons.follow-icons
.ttc-zalo-follow.is-small
.ttc-zalo-icon,

.social-icons.follow-icons.small
.ttc-zalo-follow
.ttc-zalo-icon {
    font-size: 7px;
}


/* ==========================================================
   FOOTER TTC
   ========================================================== */

.footer-wrapper
.social-icons.follow-icons
.ttc-zalo-follow {
    transition:
        background-color .25s ease,
        border-color .25s ease,
        transform .25s ease;
}


.footer-wrapper
.social-icons.follow-icons
.ttc-zalo-follow:hover {
    transform: translateY(-2px);
}


/* ==========================================================
   ACCESSIBILITY
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

    .social-icons.follow-icons
    .ttc-zalo-follow,

    .social-icons.follow-icons
    .ttc-zalo-icon {
        transition: none !important;
        transform: none !important;
    }
}