/* Мобильное меню: котик сверху, мышка снизу на папирусе (template.php: .mobile-menu__cat, .mobile-menu__mouse),
   «Каталог» в панели каталога — шрифтом бывшего заголовка «Все продукты», фирменным зелёным.
   Крестик, «Назад» и пункты не перекрываются, клики проходят сквозь картинки */
.mobile-menu__cat,
.mobile-menu__mouse {
    position: absolute;
    z-index: 3;
    pointer-events: none;
}

.mobile-menu__cat img,
.mobile-menu__mouse img {
    display: block;
    width: 100%;
    height: auto;
}

.mobile-menu-panel[data-panel-id="catalog_root"] .mobile-menu__section-link {
    color: #005C67;
    font-family: "PT Astra Serif", serif;
    font-size: 40px;
    font-style: italic;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
}

.mobile-menu-panel[data-panel-id="catalog_root"] .mobile-menu__section-link:hover {
    color: #F6881B;
}

.mobile-menu__cat {
    top: 50px;
    right: 20px;
    width: 215px;
}

/* главная панель: пункты начинаются под котиком */
.mobile-menu .mobile-menu-panel.is-root .mobile-menu__content {
    top: 215px;
}

/* мышка — слева внизу, под списком: список заканчивается выше */
.mobile-menu__mouse {
    left: 20px;
    bottom: 50px;
    width: 110px;
}

.mobile-menu .mobile-menu__content {
    bottom: 200px;
}

@media (min-width: 581px) {
    .mobile-menu__cat {
        width: 270px;
    }

    .mobile-menu .mobile-menu-panel.is-root .mobile-menu__content {
        top: 250px;
    }
}

@media (max-width: 360px) {
    .mobile-menu__cat {
        top: 40px;
        right: 14px;
        width: 180px;
    }

    .mobile-menu-panel[data-panel-id="catalog_root"] .mobile-menu__section-link {
        font-size: 36px;
    }

    .mobile-menu .mobile-menu-panel.is-root .mobile-menu__content {
        top: 180px;
    }

    .mobile-menu__mouse {
        left: 16px;
        bottom: 40px;
        width: 96px;
    }

    .mobile-menu .mobile-menu__content {
        bottom: 175px;
    }
}

/* низкий экран (телефон боком) — мышку не показываем, список как раньше */
@media (max-height: 680px) {
    .mobile-menu__mouse {
        display: none;
    }

    .mobile-menu .mobile-menu__content {
        bottom: 40px;
    }
}

@media (max-height: 680px) and (max-width: 360px) {
    .mobile-menu .mobile-menu__content {
        bottom: 30px;
    }
}
