/* İkon fontunda dairesel karşılığı bulunmayan hesaplar mevcut gliflerini kullanır. */
.icon-youtube-circle::before,
.icon-instagram-circle::before {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 1.5em;
    height: 1.5em;
    border: 0.075em solid currentColor;
    border-radius: 50%;
    font-size: 0.667em;
}

.icon-youtube-circle::before {
    content: "\e825";
}

.icon-instagram-circle::before {
    content: "\e815";
}

/* TikTok ikon fontunda yok; logo maske olarak çizilir, rengi currentColor'dan alır.
   Fonta icon-tiktok eklenirse bu blok silinmeli. */
.icon-tiktok::before,
.icon-tiktok-circle::before {
    content: "";
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: -0.125em;
    background-color: currentColor;
    -webkit-mask: var(--tiktok-mask) center / contain no-repeat;
    mask: var(--tiktok-mask) center / contain no-repeat;
}

.icon-tiktok::before {
    --tiktok-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M448 209.9a210.1 210.1 0 0 1-122.8-39.3V349.4A162.6 162.6 0 1 1 185 188.3v89.9a74.6 74.6 0 1 0 52.2 71.2V0h88a121.2 121.2 0 0 0 1.9 22.2A122.2 122.2 0 0 0 381 102.4a121.4 121.4 0 0 0 67 20.1z'/%3E%3C/svg%3E");
}

.icon-tiktok-circle::before {
    --tiktok-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36'%3E%3Ccircle cx='18' cy='18' r='17.1' fill='none' stroke='%23000' stroke-width='1.8'/%3E%3Csvg x='11' y='10.5' width='14' height='15' viewBox='0 0 448 512'%3E%3Cpath d='M448 209.9a210.1 210.1 0 0 1-122.8-39.3V349.4A162.6 162.6 0 1 1 185 188.3v89.9a74.6 74.6 0 1 0 52.2 71.2V0h88a121.2 121.2 0 0 0 1.9 22.2A122.2 122.2 0 0 0 381 102.4a121.4 121.4 0 0 0 67 20.1z'/%3E%3C/svg%3E%3C/svg%3E");
}