/* Стили для кнопки "Поделиться темой" */

/* Убедимся, что кнопка находится поверх всех элементов модального окна */
.share-topic-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(0, 255, 0, 0.3);
    color: #00ff00;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    backdrop-filter: blur(5px);
    z-index: 1000001; /* Выше всех модальных окон */
    pointer-events: auto; /* Важно для кликабельности */
}

/* Скрываем кнопку в галерее навсегда (маленькие карточки) */
.gallery__container .share-topic-btn {
    display: none !important;
}

/* Убираем показ кнопок шаринга в галерее даже с helper-классом */
.show-share-buttons .gallery__container .share-topic-btn {
    display: none !important;
}

/* Скрываем кнопки поделиться в обычных карточках галереи (не развернутых) */
.gallery__container .topic-card:not(.selected) .share-topic-btn {
    display: none !important;
}

/* Показываем кнопку поделиться только в развернутых карточках (модальных окнах) */
.selected-card-overlay .topic-card-enlarged .share-topic-btn,
.selected-card-container .topic-card-enlarged .share-topic-btn {
    display: flex !important;
    z-index: 1000003 !important; /* Выше всех модальных окон и кнопки звука */
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
}

.share-topic-btn:hover {
    background: rgba(0, 255, 0, 0.2);
    border-color: #00ff00;
    transform: scale(1.1);
    box-shadow: 0 0 15px rgba(0, 255, 0, 0.5);
}

.share-topic-btn ion-icon {
    font-size: 20px;
}

/* Стили для кнопки в детальном списке тем */
.topic-item {
    position: relative; /* Необходимо для позиционирования кнопки */
}

.topic-item .share-topic-btn {
    top: 40%; /* Поднимаем кнопку, чтобы не перекрывать прогресс-бар */
    right: 20px; /* Двигаем левее от края */
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
}

.topic-item .share-topic-btn ion-icon {
    font-size: 22px;
}
