/* ============================================================
   yeti-footer.css — Футер Йети
   wp-content/themes/bono_child/css/yeti-footer.css

   Подключить в functions.php:
   add_action('wp_enqueue_scripts', function() {
       wp_enqueue_style('yeti-footer',
           get_stylesheet_directory_uri().'/css/yeti-footer.css',
           [], null
       );
   });
   ============================================================ */

/* ── Убрать серый фон Bono, ставим тёмный ───────────────────── */
.site-footer,
.site-footer--style-gray {
    background: #202020 !important;
    color: #fff !important;
    padding: 0 !important;
}

/* ── Полоса сверху зелёная ───────────────────────────────────── */
.site-footer-container {
    border-top: 3px solid #85ad37 !important;
}

/* ── Внутренний контейнер ────────────────────────────────────── */
.site-footer-inner {
    padding: 40px 24px 32px !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* ── Сетка виджетов — 4 колонки ─────────────────────────────── */
.footer-widgets.footer-widgets-4 {
    display: grid !important;
    grid-template-columns: 2fr 1.2fr 1fr 1fr !important;
    gap: 40px !important;
    align-items: start !important;
}

/* ── Виджет 1: Лого + описание + кнопки ─────────────────────── */
.footer-widget.my-widget-1 {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
}

/* Лого — оригинальный цвет, без инверсии, покрупнее */
.footer-widget.my-widget-1 .wp-block-image img,
.footer-widget.my-widget-1 img.wp-image-8779 {
    max-width: 280px !important;
    width: 280px !important;
    height: auto !important;
    filter: none !important;
}

/* Описание */
.footer-widget.my-widget-1 .wp-block-paragraph {
    font-size: 13px !important;
    color: #999 !important;
    line-height: 1.6 !important;
    text-align: left !important;
    margin: 0 !important;
}

/* Кнопки — вертикально в колонку */
.footer-widget.my-widget-1 .wp-block-buttons {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
}

.footer-widget.my-widget-1 .wp-block-button {
    width: 100% !important;
    margin: 0 !important;
}

.footer-widget.my-widget-1 .wp-block-button__link {
    display: block !important;
    width: 100% !important;
    padding: 9px 16px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    border-radius: 7px !important;
    text-align: center !important;
    text-decoration: none !important;
    transition: background .15s, color .15s !important;
}

/* Первая кнопка — зелёная */
.footer-widget.my-widget-1 .wp-block-button:nth-child(1) .wp-block-button__link {
    background: #85ad37 !important;
    color: #fff !important;
    border: none !important;
    box-shadow: none !important;
}

.footer-widget.my-widget-1 .wp-block-button:nth-child(1) .wp-block-button__link:hover {
    background: #6e9228 !important;
}

/* Остальные кнопки — прозрачные с рамкой */
.footer-widget.my-widget-1 .wp-block-button:nth-child(2) .wp-block-button__link,
.footer-widget.my-widget-1 .wp-block-button:nth-child(3) .wp-block-button__link {
    background: transparent !important;
    color: #ccc !important;
    border: 1px solid #3a3a3a !important;
    box-shadow: none !important;
}

.footer-widget.my-widget-1 .wp-block-button:nth-child(2) .wp-block-button__link:hover,
.footer-widget.my-widget-1 .wp-block-button:nth-child(3) .wp-block-button__link:hover {
    border-color: #85ad37 !important;
    color: #85ad37 !important;
}

/* ── Виджет 2: Контакты + соцсети ───────────────────────────── */
.footer-widget.my-widget-2 {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

/* Заголовок «Адрес и контакты» */
.footer-widget.my-widget-2 .wp-block-paragraph strong {
    display: block !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .8px !important;
    text-transform: uppercase !important;
    color: #85ad37 !important;
    margin-bottom: 10px !important;
    margin-top: 0 !important;
    line-height: 1 !important;
}

.footer-widget.my-widget-2 .wp-block-paragraph {
    font-size: 13px !important;
    color: #999 !important;
    line-height: 1.9 !important;
    text-align: left !important;
    margin: 0 !important;
}

.footer-widget.my-widget-2 .wp-block-paragraph a {
    color: #fff !important;
    text-decoration: none !important;
    transition: color .15s !important;
}

.footer-widget.my-widget-2 .wp-block-paragraph a:hover {
    color: #85ad37 !important;
}

/* Социальные кнопки — зелёный стиль */
.footer-widget.my-widget-2 .social-buttons {
    display: flex !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}

.footer-widget.my-widget-2 .social-button {
    width: 36px !important;
    height: 36px !important;
    border-radius: 7px !important;
    border: 1.5px solid #85ad37 !important;
    background: transparent !important;
    transition: background .18s !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.footer-widget.my-widget-2 .social-button:hover {
    background: #85ad37 !important;
    border-color: #85ad37 !important;
}

/* Иконки внутри кнопок тоже меняют цвет */
.footer-widget.my-widget-2 .social-button:before {
    color: #85ad37 !important;
    transition: color .18s !important;
}

.footer-widget.my-widget-2 .social-button:hover:before {
    color: #fff !important;
}

/* ── Виджет 3: Меню навигации ────────────────────────────────── */
.footer-widget.my-widget-3 {
    display: flex !important;
    flex-direction: column !important;
}

/* Псевдозаголовок через ::before */
.footer-widget.my-widget-3::before {
    content: 'Навигация' !important;
    display: block !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .8px !important;
    text-transform: uppercase !important;
    color: #85ad37 !important;
    margin-bottom: 14px !important;
    margin-top: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
}

.footer-widget.my-widget-3 .menu {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.footer-widget.my-widget-3 .menu > li {
    margin-bottom: 8px !important;
}

.footer-widget.my-widget-3 .menu > li > a {
    font-size: 13px !important;
    color: #999 !important;
    text-decoration: none !important;
    transition: color .15s !important;
}

.footer-widget.my-widget-3 .menu > li > a:hover {
    color: #85ad37 !important;
}

/* Подменю */
.footer-widget.my-widget-3 .sub-menu {
    list-style: none !important;
    padding: 4px 0 4px 10px !important;
    margin: 4px 0 0 !important;
    border-left: 2px solid #2a2a2a !important;
}

.footer-widget.my-widget-3 .sub-menu li {
    margin-bottom: 5px !important;
}

.footer-widget.my-widget-3 .sub-menu li a {
    font-size: 12px !important;
    color: #666 !important;
    text-decoration: none !important;
    transition: color .15s !important;
}

.footer-widget.my-widget-3 .sub-menu li a:hover {
    color: #85ad37 !important;
}

/* Убрать псевдоэлементы Bono у пунктов меню */
.footer-widget.my-widget-3 .menu li a:before {
    display: none !important;
}

/* ── Виджет 4: QR-код ────────────────────────────────────────── */
.footer-widget.my-widget-4 {
    display: flex !important;
    flex-direction: column !important;
}

.footer-widget.my-widget-4::before {
    content: 'Telegram-канал' !important;
    display: block !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .8px !important;
    text-transform: uppercase !important;
    color: #85ad37 !important;
    margin-bottom: 10px !important;
    margin-top: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
}

.footer-widget.my-widget-4::after {
    content: 'Подпишитесь — будьте в курсе акций и новостей' !important;
    display: block !important;
    font-size: 11px !important;
    color: #666 !important;
    line-height: 1.5 !important;
    margin-top: 8px !important;
}

.footer-widget.my-widget-4 .wp-block-image,
.footer-widget.my-widget-4 figure,
.footer-widget.my-widget-4 figure.aligncenter {
    display: block !important;
    width: 140px !important;
    max-width: 140px !important;
    margin: 0 !important;
}

.footer-widget.my-widget-4 .wp-block-image img,
.footer-widget.my-widget-4 .wp-block-image img.wp-image-8781 {
    width: 140px !important;
    height: 140px !important;
    max-width: 140px !important;
    min-width: 140px !important;
    object-fit: cover !important;
    border-radius: 8px !important;
    border: 1px solid #2a2a2a !important;
    display: block !important;
}

.footer-widget.my-widget-4 figure {
    margin: 0 !important;
}

/* ── Разделитель и правовые ссылки (.site-footer-conf) ────────── */
.site-footer-conf {
    border-top: 1px solid #2a2a2a !important;
    padding: 16px 24px !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    display: flex !important;
    gap: 20px !important;
    flex-wrap: wrap !important;
}

.site-footer-conf a {
    font-size: 11px !important;
    color: #888 !important;
    text-decoration: none !important;
    transition: color .15s !important;
}

.site-footer-conf a:hover {
    color: #85ad37 !important;
}

/* ── Нижняя полоса (.footer-bottom) ─────────────────────────── */
.footer-bottom {
    background: #161616 !important;
    border-top: 1px solid #2a2a2a !important;
}

.footer-bottom-block {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 14px 24px !important;
}

.footer-info {
    font-size: 11px !important;
    color: #444 !important;
    line-height: 1.6 !important;
    display: block !important;
}

/* ── Адаптив ─────────────────────────────────────────────────── */
@media (max-width: 1024px) {
    .footer-widgets.footer-widgets-4 {
        grid-template-columns: 1fr 1fr !important;
        gap: 32px !important;
    }
}

@media (max-width: 600px) {
    .footer-widgets.footer-widgets-4 {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }

    .site-footer-inner {
        padding: 28px 16px 24px !important;
    }

    .site-footer-conf {
        padding: 14px 16px !important;
        gap: 12px !important;
    }

    .footer-bottom-block {
        padding: 12px 16px !important;
    }

    .footer-widget.my-widget-1 .wp-block-buttons {
        flex-direction: row !important;
        flex-wrap: wrap !important;
    }

    .footer-widget.my-widget-1 .wp-block-button {
        width: auto !important;
        flex: 1 1 auto !important;
    }
}


/* ── Финальный выравнивающий override ───────────────────────── */

/* Все виджеты начинаются с одной высоты */
.footer-widgets.footer-widgets-4 {
    align-items: start !important;
}

/* Заголовки всех виджетов — одинаковая высота строки */
.footer-widget.my-widget-2 .wp-block-paragraph strong,
.footer-widget.my-widget-3::before,
.footer-widget.my-widget-4::before {
    height: 14px !important;
    line-height: 14px !important;
    display: flex !important;
    align-items: center !important;
}

/* WP image wrapper не ограничивает QR */
#block-16 .wp-block-image,
#block-16 figure {
    max-width: 140px !important;
    width: 140px !important;
    margin: 0 !important;
}

#block-16 img {
    width: 140px !important;
    height: 140px !important;
    max-width: 140px !important;
    object-fit: cover !important;
}

/* Убрать WP custom CSS который ограничивает изображение */
.wp-image-8781 {
    max-width: 140px !important;
}


/* ── Перебить стили Bono из style.min.css ───────────────────── */

/* #block-14 имеет display:flex align-items:center — сбрасываем */
#block-14 {
    display: block !important;
    align-items: unset !important;
}

/* .footer-widget .widget margin: 1rem 0 от Bono */
.footer-widget .widget,
.footer-widgets .widget {
    margin: 0 !important;
}

/* Все виджеты внутри footer-widget — убрать отступы */
.footer-widget > div,
.footer-widget > .widget {
    margin: 0 !important;
    padding: 0 !important;
}

/* Выровнять заголовки точно по одной линии */
.footer-widget.my-widget-2 .wp-block-paragraph strong,
.footer-widget.my-widget-3::before,
.footer-widget.my-widget-4::before {
    display: block !important;
    height: auto !important;
    line-height: 1 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}


/* ── Соцкнопки — финальный override ────────────────────────── */

/* Убрать box-shadow от Bono на всех соцкнопках */
.footer-widget .social-button--vkontakte:hover,
.footer-widget .social-button--telegram:hover,
.footer-widget .social-button--youtube:hover,
.footer-widget .social-button:hover {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

/* Иконки зелёные в нормальном состоянии */
.footer-widget .social-button--vkontakte::before,
.footer-widget .social-button--telegram::before,
.footer-widget .social-button--youtube::before,
.footer-widget .social-button::before {
    color: #85ad37 !important;
    transition: color .18s !important;
}

/* Иконки белые при наведении */
.footer-widget .social-button--vkontakte:hover::before,
.footer-widget .social-button--telegram:hover::before,
.footer-widget .social-button--youtube:hover::before,
.footer-widget .social-button:hover::before {
    color: #fff !important;
}


/* ── Соцкнопки — иконка через filter если ::before не работает ── */

/* Вариант 1: filter на сам span */
.footer-widget .social-button {
    filter: brightness(0) saturate(100%) invert(55%) sepia(60%) saturate(400%) hue-rotate(50deg) brightness(95%) !important;
    transition: filter .18s !important;
}

.footer-widget .social-button:hover {
    filter: brightness(0) invert(1) !important;
    background: #85ad37 !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}


/* ── Соцкнопки hover — зелёный фон + белая иконка ────────────── */
.footer-widget .social-button:hover {
    background: #85ad37 !important;
    border-color: #85ad37 !important;
    filter: brightness(0) invert(1) !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}


/* ── Правильный hover: зелёный фон, иконка через ::before ─────── */
/* filter на весь span красит и фон тоже — используем другое */
.footer-widget .social-button:hover {
    background: #85ad37 !important;
    border-color: #85ad37 !important;
    /* Убираем filter со span на hover */
    filter: none !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

/* Иконка на hover — белая через invert только на ::before */
.footer-widget .social-button:hover::before {
    filter: brightness(0) invert(1) !important;
}