/* ============================================================
   社媒分享 (Social Share) - WPBakery 自定义元素
   依赖: Font Awesome 6 (The7 主题内置)
   ============================================================ */

/* ── 容器 ── */
.cwc-social-share-wrap {
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
}

/* ── 水平排列 ── */
.cwc-social-share--horizontal {
    flex-direction: row;
}

/* ── 垂直排列 ── */
.cwc-social-share--vertical {
    flex-direction: column;
}

/* ── 单个图标项 ── */
.cwc-social-item {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.3s ease;
    box-sizing: border-box;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.cwc-social-item:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.13);
}

/* ── 图标（FA6） ── */
.cwc-social-item i {
    display: inline-block;
    line-height: 1;
    transition: all 0.3s ease;
}

/* ── 提示气泡（电话 + 微信） ── */
.cwc-social-tooltip {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    background: #333;
    color: #fff;
    white-space: nowrap;
    padding: 6px 14px;
    border-radius: 4px;
    font-size: 13px;
    line-height: 1.4;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.25s ease, transform 0.25s ease;
    z-index: 999;
    text-align: center;
}

/* 默认在图标上方 */
.cwc-social-tooltip--top {
    bottom: calc(100% + 10px);
    transform: translateX(-50%) translateY(6px);
}

/* 在图标下方 */
.cwc-social-tooltip--bottom {
    top: calc(100% + 10px);
    transform: translateX(-50%) translateY(-6px);
}

.cwc-social-item:hover .cwc-social-tooltip {
    opacity: 1;
    pointer-events: auto;
}

.cwc-social-item:hover .cwc-social-tooltip--top {
    transform: translateX(-50%) translateY(0);
}

.cwc-social-item:hover .cwc-social-tooltip--bottom {
    transform: translateX(-50%) translateY(0);
}

/* ── 微信二维码气泡 ── */
.cwc-social-qr-popup {
    position: absolute;
    left: 50%;
    transform: translateX(-50%) translateY(6px);
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.18);
    padding: 12px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease, transform 0.25s ease;
    z-index: 999;
    text-align: center;
}

.cwc-social-qr-popup--top {
    bottom: calc(100% + 12px);
    transform: translateX(-50%) translateY(6px);
}

.cwc-social-qr-popup--bottom {
    top: calc(100% + 12px);
    transform: translateX(-50%) translateY(-6px);
}

.cwc-social-item:hover .cwc-social-qr-popup {
    opacity: 1;
    pointer-events: auto;
}

.cwc-social-item:hover .cwc-social-qr-popup--top {
    transform: translateX(-50%) translateY(0);
}

.cwc-social-item:hover .cwc-social-qr-popup--bottom {
    transform: translateX(-50%) translateY(0);
}

.cwc-social-qr-popup img {
    display: block;
    height: auto;
    border-radius: 10px;
}

.cwc-social-qr-label {
    margin-top: 6px;
    font-size: 12px;
    color: #666;
    line-height: 1.3;
}

/* ── 响应式 ── */
@media (max-width: 767px) {
    .cwc-social-share--horizontal.cwc-social-share--mobile-stack {
        flex-direction: column;
        align-items: center !important;
    }
}