/* Иконки Telegram и «скопировать ссылку».
   Иконка ВКонтакте берется из общего спрайта (styles.css), а этих двух там нет,
   поэтому рисуем их здесь — так не нужно пересобирать styles.min.css.

   ВАЖНО про селекторы: базовое правило .social-buttons__item:after (спрайт)
   лежит в styles.min.css, который подключается ПОЗЖЕ этого файла. При равной
   специфичности побеждал бы спрайт, поэтому селекторы намеренно на класс длиннее. */

.social-buttons .social-buttons__item_tg:after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23229ED9'%3E%3Cpath d='M9.78 18.65l.28-4.23 7.68-6.92c.34-.31-.07-.46-.52-.19L7.74 13.3 3.64 12c-.88-.25-.89-.86.2-1.3l15.97-6.16c.73-.33 1.43.18 1.15 1.3l-2.72 12.81c-.19.91-.74 1.13-1.5.71L12.6 16.3l-1.99 1.93c-.23.23-.42.42-.83.42z'/%3E%3C/svg%3E");
    background-position: center;
    background-size: 22px 22px;
}

.social-buttons .social-buttons__item_copy {
    padding: 0;
    background: none;
    font: inherit;
}

.social-buttons .social-buttons__item_copy:after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2362646A'%3E%3Cpath d='M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z'/%3E%3C/svg%3E");
    background-position: center;
    background-size: 22px 22px;
}

/* состояние «скопировано» — галочка на пару секунд */
.social-buttons .social-buttons__item_copy.social-buttons__item_copied:after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232E9E4F'%3E%3Cpath d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E");
    background-size: 20px 20px;
}

.social-buttons .social-buttons__item_copy.social-buttons__item_copied {
    border-color: #2e9e4f;
}

/* Отступы между кнопками.
   В styles.css есть правило .blog-article__social-buttons .social-buttons__item_vk
   { margin-right: 0 } — оно осталось с тех пор, когда ВКонтакте был ПОСЛЕДНИМ
   в ряду (facebook, twitter, linkedin, vk). Теперь ВК первый, и из-за этого
   правила он слипался с Telegram. Задаем отступы по позиции, а не по соцсети;
   селектор на класс длиннее, чтобы перебить старое правило. */
.social-buttons .social-buttons__items .social-buttons__item {
    margin-right: 9px;
}

.social-buttons .social-buttons__items .social-buttons__item:last-child {
    margin-right: 0;
}