/**
 * Плавна поява підкреслення для футер-посилань (.under-lineeeee).
 *
 * Bricks вмикає підкреслення миттєво через text-decoration: underline на :hover,
 * а цю властивість не можна анімувати. Тому глушимо рідне підкреслення й малюємо
 * власну лінію градієнтом, яка плавно з'являється зліва направо.
 * Колір лінії = currentColor, товщина 1px — вигляд самого підкреслення не змінюється,
 * додається лише плавність появи.
 *
 * Розмітка Bricks (елемент social-icons з класом .under-lineeeee):
 *   <li class="no-link"><span>…</span></li>      — текст без посилання
 *   <li class="has-link"><a>…</a></li>           — текст-посилання
 */

/* прибрати миттєве рідне підкреслення Bricks (ID-селектор → потрібен !important) */
.under-lineeeee li.no-link:hover,
.under-lineeeee li.has-link a:hover {
	text-decoration: none !important;
}

/* базовий стан анімованої лінії — схована (ширина 0) */
.under-lineeeee li.no-link > span,
.under-lineeeee li.has-link > a {
	background-image: linear-gradient( currentColor, currentColor );
	background-position: 0 100%;
	background-repeat: no-repeat;
	background-size: 0% 1px;
	transition: background-size 0.3s ease;
}

/* поява лінії на ховері */
.under-lineeeee li.no-link:hover > span,
.under-lineeeee li.has-link > a:hover {
	background-size: 100% 1px;
}