/*
 * Шапка сайта (виджет Listivo lst_menu_v2 в шаблоне Layout): компактная кнопка «Добавить» и одна иконка профиля
 * вместо «Вход / Регистрация» или имени пользователя — освобождает место для пунктов меню.
 * Разметку темы не трогаем, только стили (epil-core, модуль Typography).
 * Ниже 1121 px виджет переключается на мобильное меню (mobile_breakpoint = 1120) — его не меняем.
 */
@media (min-width: 1121px) {
    /*
     * «Добавить» — круглая кнопка только с плюсом. Подпись остаётся в разметке (font-size: 0) — её читают
     * экранные дикторы; скос темы (псевдоэлементы) в круге не нужен.
     */
    html body .listivo-menu-v2__button .listivo-button {
        width: 40px;
        min-width: 40px;
        height: 40px;
        padding: 0;
        border-radius: 50%;
        justify-content: center;
        overflow: hidden;
        transition: transform .15s ease, box-shadow .15s ease;
    }

    html body .listivo-menu-v2__button .listivo-button:hover {
        transform: rotate(90deg);
        box-shadow: 0 6px 16px rgba(55, 75, 92, .25);
    }

    html body .listivo-menu-v2__button .listivo-button::before,
    html body .listivo-menu-v2__button .listivo-button::after {
        display: none;
    }

    html body .listivo-menu-v2__button .listivo-button span {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0;
        font-size: 0;
        line-height: 0;
    }

    html body .listivo-menu-v2__button .listivo-button i,
    html body .listivo-menu-v2__button .listivo-button svg {
        margin: 0;
        color: #fff;
        font-size: 15px;
        line-height: 1;
    }

    /* «Полезное» — пункты выпадающего меню посвободнее */
    html body .listivo-menu-v2__submenu-inner {
        padding: 10px 0;
    }

    html body .listivo-menu-v2__submenu .listivo-menu-v2__item--depth-1 > a {
        height: auto;
        padding: 9px 30px;
        line-height: 1.35;
    }

    /* Аккаунт: только иконка. У вошедшего по наведению — меню кабинета темы, у гостя иконка ведёт на вход */
    html body .listivo-menu-v2__account .listivo-menu-v2__account-link,
    html body .listivo-menu-v2__account .listivo-menu-v2__separator {
        display: none;
    }

    html body .listivo-menu-v2__avatar {
        width: 40px;
        height: 40px;
        min-width: 40px;
    }

    html body .listivo-menu-v2__account {
        margin-right: 16px;
    }

    /* «Подбор студии» (квиз) — аккуратная кнопка-пилюля с рамкой, последним пунктом меню */
    html body .listivo-menu-v2__items > .listivo-menu-v2__item.epil-menu-quiz > a {
        /* Высота пунктов задаётся настройкой виджета (88 px) — кнопке нужна своя */
        height: auto !important;
        align-self: center;
        padding: 7px 14px;
        border: 1.5px solid #d86eec;
        border-radius: 999px;
        color: #b44fc9;
        font-weight: 600;
        line-height: 1.2;
        white-space: nowrap;
        transition: background-color .15s ease;
    }

    html body .listivo-menu-v2__items > .listivo-menu-v2__item.epil-menu-quiz > a:hover {
        background: #fbeefe;
        color: #b44fc9;
    }

    /* Подчёркивание-«капля» и стрелка подменю темы у кнопки не нужны */
    html body .listivo-menu-v2__items > .listivo-menu-v2__item.epil-menu-quiz:before,
    html body .listivo-menu-v2__items > .listivo-menu-v2__item.epil-menu-quiz > a svg {
        display: none;
    }
}

/* 7 пунктов меню + профиль + «Добавить» в контейнер 1200 px: на средних экранах отступы между пунктами меньше */
@media (min-width: 1121px) and (max-width: 1599.98px) {
    html body .listivo-menu-v2__items {
        margin-left: 28px;
    }

    html body .listivo-menu-v2__items > .listivo-menu-v2__item {
        margin-left: 24px;
    }
}

@media (min-width: 1121px) and (max-width: 1299.98px) {
    html body .listivo-menu-v2__items > .listivo-menu-v2__item {
        margin-left: 16px;
    }

    html body .listivo-menu-v2__items > .listivo-menu-v2__item > a {
        font-size: 14px;
    }
}

/*
 * «Полезное»: иконки слева от пунктов (десктоп и мобильное меню). Пункт узнаём по адресу ссылки — слаги страниц
 * одинаковы на всех окружениях, ID пунктов меню — нет. Иконки — линейные SVG фирменного цвета в лавандовом круге.
 */
/* Тема ставит space-between (стрелка подменю справа) — текст держим рядом с иконкой, стрелку уводим вправо */
html body .listivo-menu-v2__submenu .listivo-menu-v2__item--depth-1 > a,
html body .listivo-menu-mobile-v2__submenu .listivo-menu-mobile-v2__item--depth-1 > a {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

html body .listivo-menu-v2__submenu .listivo-menu-v2__item--depth-1 > a > svg,
html body .listivo-menu-mobile-v2__submenu .listivo-menu-mobile-v2__item--depth-1 > a > svg {
    margin-left: auto;
}

html body .listivo-menu-v2__item--depth-1 > a::before,
html body .listivo-menu-mobile-v2__item--depth-1 > a::before {
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    margin-right: 12px;
    border-radius: 50%;
    background: #fbeefe no-repeat center / 17px 17px;
    transition: background-color .15s ease;
}

html body .listivo-menu-v2__item--depth-1 > a:hover::before {
    background-color: #f6dcfb;
}

/* Ремонт оборудования — гаечный ключ */
html body .listivo-menu-v2__item--depth-1 > a[href*="/remont-kosmetologicheskogo-oborudovaniya"]::before,
html body .listivo-menu-mobile-v2__item--depth-1 > a[href*="/remont-kosmetologicheskogo-oborudovaniya"]::before {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b44fc9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4 4 0 0 0-5.4 5.1L3.5 17.2a1.8 1.8 0 0 0 2.5 2.5l5.8-5.8a4 4 0 0 0 5.1-5.4l-2.6 2.6-2.4-.6-.6-2.4z'/%3E%3C/svg%3E");
}

/* Александритовые лазеры — кристалл александрита */
html body .listivo-menu-v2__item--depth-1 > a[href*="/aleksandritovye-lazery"]::before,
html body .listivo-menu-mobile-v2__item--depth-1 > a[href*="/aleksandritovye-lazery"]::before {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b44fc9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h12l3 6-9 12L3 9z'/%3E%3Cpath d='M3 9h18M9 3l3 6 3-6M12 21 9 9M12 21l3-12'/%3E%3C/svg%3E");
}

/* Диодные лазеры — разряд */
html body .listivo-menu-v2__item--depth-1 > a[href*="/diodnye-lazery"]::before,
html body .listivo-menu-mobile-v2__item--depth-1 > a[href*="/diodnye-lazery"]::before {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b44fc9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2 4 14h7l-1 8 9-12h-7z'/%3E%3C/svg%3E");
}

/* Неодимовые лазеры — прицел луча */
html body .listivo-menu-v2__item--depth-1 > a[href*="/neodimovye-lazery"]::before,
html body .listivo-menu-mobile-v2__item--depth-1 > a[href*="/neodimovye-lazery"]::before {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b44fc9' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='7'/%3E%3Ccircle cx='12' cy='12' r='2.5'/%3E%3Cpath d='M12 1.5v3M12 19.5v3M1.5 12h3M19.5 12h3'/%3E%3C/svg%3E");
}

/* Контакты — конверт */
html body .listivo-menu-v2__item--depth-1 > a[href*="/contact/"]::before,
html body .listivo-menu-mobile-v2__item--depth-1 > a[href*="/contact/"]::before {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b44fc9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3.5 7 8.5 6 8.5-6'/%3E%3C/svg%3E");
}
