/* gtShare - Custom Share Button CSS (v1.7 - Margin fix) */

.share-container {
    position: relative;
    display: inline-block;
}

.share-main-btn {
    display: inline-flex;
    align-items: center;
    /* gap: 8px;  <-- 이 줄을 삭제합니다. */

    padding: 8px 16px;
    background-color: #007bff;
    color: white;
    border: none;
    border-radius: 5px;
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.2s;
}

.share-main-btn:hover {
    background-color: #0056b3;
}

.share-main-btn svg {
    width: 16px;
    height: 16px;
    fill: white;
    margin-right: 8px;
}

.share-options {
    display: none;
    position: absolute;
    left: -33px;
    border: 1px solid #ddd;
    background-color: white;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    z-index: 999999;
    border-radius: 8px;
    overflow: hidden;
    width: max-content;
}

.share-options.popup-above {
    bottom: 100%;
    margin-bottom: 8px;
}

.share-options.popup-below {
    top: 100%;
    margin-top: 8px;
}

.share-options.is-visible {
    display: block;
}

.share-options a {
    display: flex;
    align-items: center;
    padding: 8px 12px;
    color: #333;
    text-decoration: none;
    white-space: nowrap;
    font-size: 14px;
    transition: background-color 0.2s;
}

.share-options a:hover {
    background-color: #f5f5f5;
}

.share-options svg {
    width: 16px;
    height: 16px;
    margin-right: 8px;
    fill: currentColor;
}

/* [추가] 모바일 화면을 위한 미디어 쿼리 */
@media (max-width: 767px) {
    /* 화면 너비가 767px 이하일 때 적용 */

    .share-main-btn .share-btn-text {
        display: none; /* 텍스트 숨기기 */
    }

	.share-main-btn svg {margin-right:0;}

    .share-main-btn {
        padding: 10px;
    }
}