/* Социальные сети в мобильном меню */

/* Контейнер социальных сетей в мобильном меню */
.mobile-nav__social, .mobile-nav__button {
    display: none; /* По умолчанию скрыты */
}

/* Показываем только на мобильных */
@media (max-width: 768px) {
    .mobile-nav__button {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 14px;
    }
    .mobile-nav__button .header__nav-btn::after, .mobile-nav__button .header__nav-btn::before {
        display: none;
        content: none;
    }
    .mobile-nav__button .header__nav-btn {
        background-color: #089C3E;
        color: #ffffff;
        font-size: 14px;
        font-weight: 600;
    }
    .mobile-nav__social {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 20px;
        padding-top: 15px;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
        width: 100%;
        grid-column: 1 / -1; /* Занимает всю ширину, если используется grid */
    }
    .mobile-nav__container {
        background: rgba(0, 0, 0, 0.9);
    }
    /* Ссылки социальных сетей */
    .mobile-nav__social-link {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        background: transparent;
        overflow: hidden;
        isolation: isolate;
        transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease-in-out;
    }

    /* Эффект жидкого стекла - внутренний светлый кант */
    .mobile-nav__social-link::before {
        content: '';
        position: absolute;
        inset: 0;
        z-index: 0;
        border-radius: inherit;
        box-shadow: inset 2px 2px 0px -2px rgba(255, 255, 255, 0.7), 
                    inset 0 0 3px 1px rgba(255, 255, 255, 0.7);
        pointer-events: none;
        transition: opacity 0.2s ease;
    }

    /* Эффект жидкого стекла - backdrop filter */
    .mobile-nav__social-link::after {
        content: '';
        position: absolute;
        z-index: -1;
        inset: 0;
        border-radius: inherit;
        -webkit-filter: url(#btn-glass);
        filter: url(#btn-glass);
        pointer-events: none;
        -webkit-backdrop-filter: blur(0px);
        backdrop-filter: blur(0px);
        transition: opacity 0.2s ease;
    }

    /* Иконки */
    .mobile-nav__social-link svg {
        width: 20px;
        height: 20px;
        fill: #ffffff;
        stroke: none;
        position: relative;
        z-index: 1;
        transform: translateZ(0);
        flex-shrink: 0;
    }
    
    /* VK иконка увеличена в 2 раза */
    .mobile-nav__social-link:nth-child(3) svg {
        transform: scale(2);
    }

    /* Hover эффект */
    .mobile-nav__social-link:hover {
        transform: translateY(-2px);
        background: #089C3E;
    }

    .mobile-nav__social-link:hover::before,
    .mobile-nav__social-link:hover::after {
        opacity: 0;
    }

    .mobile-nav__social-link:active {
        transform: translateY(0);
    }
    
    /* Скрываем социальные сети в шапке на мобильных */
    .header__actions .header__social {
        display: none;
    }
}