/* Подвал сайта (views/layouts/_footer.php), 19.09.2026.
   main.css и critical-home-page.css тоже задают .footer__* (старая сетка) —
   здесь селекторы начинаются с .footer, чтобы перебить их специфичностью,
   а не порядком подключения. */

.footer .footer__grid {
    display: grid;
    grid-template-columns: minmax(200px, 1.25fr) 1fr 1fr .9fr minmax(280px, 1.5fr);
    gap: 32px;
    padding: 48px 0 40px;
}

/* ---------- Логотип и контакты ---------- */
.footer .footer__about {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    min-width: 0;
}

.footer .footer__logo { display: block; margin-bottom: 12px; }
.footer .footer__logo img { display: block; width: 84px; height: 84px; }

.footer .footer__phone {
    color: var(--color-dark);
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
    text-decoration: none;
    white-space: nowrap;
}

.footer .footer__phone:hover { color: var(--color-primary); }

.footer .footer__hours,
.footer .footer__pickup {
    margin: 0;
    color: #55536b;
    font-size: 13px;
    line-height: 1.5;
}

.footer .footer__pickup { margin-top: 4px; }
.footer .footer__pickup span { color: var(--color-dark); font-weight: 600; }

.footer .footer__social {
    display: flex;
    justify-content: flex-start;
    gap: 12px;
    margin: 4px 0 0;
    padding: 0;
    list-style: none;
}

/* ---------- Колонки ссылок ---------- */
.footer .footer__col { min-width: 0; }

.footer .footer__heading {
    margin: 0 0 14px;
    color: var(--color-dark);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
}

/* На широком экране заголовок колонки — просто текст. */
.footer .footer__toggle {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: default;
    pointer-events: none;
}

.footer .footer__list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer .footer__list a {
    color: var(--color-dark);
    font-size: 14px;
    line-height: 1.45;
    text-decoration: none;
    transition: color .2s ease;
}

.footer .footer__list a:hover,
.footer .footer__list a:focus-visible { color: var(--color-primary); }

/* ---------- Подписка: компактнее прежней ---------- */
.footer .footer__sub { width: auto; min-width: 0; max-width: none; }

.footer .footer__sub-text {
    margin: 0 0 12px;
    color: #55536b;
    font-size: 14px;
    line-height: 1.45;
}

.footer .footer__subscribe { gap: 8px; }
.footer .footer__subscribe .form-group { flex: 1 1 auto; min-width: 0; height: 44px; }
.footer .footer__subscribe .form-group input { height: 44px; }
.footer .footer__subscribe .btn { height: 44px; padding: 0 16px; font-size: 14px; }

.footer .footer__consents { gap: 6px; margin-top: 10px; }
.footer .footer__consent { color: #6d6b80; font-size: 11px; line-height: 1.45; }

/* ---------- Нижняя строка ---------- */
.footer .footer__bottom {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px 32px;
    padding: 20px 0 24px;
}

.footer .footer__legal {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.footer .footer__copy {
    order: 0;
    margin: 0;
    color: #55536b;
    font-size: 13px;
    line-height: 1.5;
    text-align: left;
}

.footer .footer__copy span::before { content: " · "; }

.footer .footer__links {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    order: 0;
    gap: 4px 20px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer .footer__links a { font-size: 13px; }

.footer .footer__marks {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 20px;
}

.footer .footer__marks-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer .footer__mark {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 0 8px;
    border-radius: 6px;
    background: #fff;
}

.footer .footer__mark picture { display: contents; }
.footer .footer__mark img { display: block; width: auto; height: 16px; }
.footer .footer__mark--sbp img { height: 22px; }
.footer .footer__mark--sberpay img { height: 18px; }
.footer .footer__mark--tpay img { height: 18px; }
.footer .footer__mark-caption { margin-left: 4px; font-size: 13px; font-weight: 700; line-height: 1; color: #1f1f1f; white-space: nowrap; }
.footer .footer__mark--yoomoney .footer__mark-caption { color: #6433ff; }
.footer .footer__mark--cdek img { height: 14px; }
.footer .footer__mark--post { padding: 0 4px; }
.footer .footer__mark--post img { height: 26px; }

/* ---------- Планшет ---------- */
@media (max-width: 1100px) {
    .footer .footer__grid {
        grid-template-columns: 1.2fr 1fr 1fr .9fr;
        gap: 32px 24px;
    }
    .footer .footer__sub { grid-column: 1 / -1; max-width: 560px; }
}

/* ---------- Телефон ---------- */
@media (max-width: 767px) {
    .footer .footer__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
        padding: 32px 0 8px;
    }

    .footer .footer__about { align-items: flex-start; padding-bottom: 20px; }
    .footer .footer__logo img { width: 64px; height: 64px; }

    .footer .footer__col { border-top: 1px solid rgba(44, 41, 72, .12); }
    .footer .footer__col .footer__heading { margin: 0; }

    /* Сворачивание включает web/js/footer.js (класс is-collapsible):
       без JS колонки остаются открытыми. */
    .footer.is-collapsible .footer__toggle {
        position: relative;
        padding: 14px 32px 14px 0;
        cursor: pointer;
        pointer-events: auto;
    }

    .footer.is-collapsible .footer__toggle::after {
        content: "";
        position: absolute;
        right: 4px;
        top: 50%;
        width: 8px;
        height: 8px;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        transform: translateY(-70%) rotate(45deg);
        transition: transform .2s ease;
    }

    .footer.is-collapsible .footer__toggle[aria-expanded="true"]::after { transform: translateY(-30%) rotate(-135deg); }
    .footer.is-collapsible [data-footer-col] .footer__list[hidden] { display: none; }

    .footer:not(.is-collapsible) .footer__col .footer__heading { margin: 16px 0 10px; }
    .footer .footer__list { gap: 10px; padding-bottom: 16px; }
    .footer .footer__list a { font-size: 15px; }

    .footer .footer__sub { grid-column: auto; padding: 20px 0 8px; border-top: 1px solid rgba(44, 41, 72, .12); }
    .footer .footer__subscribe { flex-direction: row; }
    .footer .footer__subscribe > * { width: auto; }
    .footer .footer__subscribe .btn { flex: 0 0 auto; }

    .footer .footer__bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .footer .footer__links { flex-direction: row; align-items: center; gap: 6px 16px; }
    .footer .footer__copy { text-align: left; }
}

/* До 768px внизу экрана закреплена панель «Главная / Каталог / Корзина»
   (.header__user-mobile в header-mobile.css, ~80px). Без запаса она закрывала
   копирайт и «Настройки cookies». */
@media (max-width: 768px) {
    .footer .footer__bottom { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
}