/* 在线客服样式 */
.online-service {
    position: fixed;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9999;
}

.service-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 70px;
    padding: 8px 4px;
    background: #0066cc; /* 可根据需求调整背景色 */
    border-radius: 4px;
    text-decoration: none;
    transition: opacity 0.3s;
}

.service-link:hover {
    opacity: 0.9;
}

.service-icon {
    width: 20px;
    height: 20px;
    margin-bottom: 4px;
    background: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white"><path d="M19.71 15.38c-1.1-2.94-3.9-5.18-7.21-5.18s-6.11 2.24-7.21 5.18c-.36.95-.59 1.95-.59 3.02V20c0 .55.45 1 1 1h14c.55 0 1-.45 1-1v-1.6c0-1.07-.23-2.07-.59-3.02zM12 13c2.21 0 4 1.79 4 4s-1.79 4-4 4-4-1.79-4-4 1.79-4 4-4z"/></svg>') no-repeat center;
    background-size: contain;
}

.service-text {
    font-size: 16px;
    color: #fff;
    line-height: 1.2;
    text-align: center;
    word-break: break-all;
}

/* 移动端适配 */
@media (max-width: 768px) {
    .online-service {
        right: 10px;
    }
    .service-link {
        width: 36px;
        height: 64px;
    }
    .service-text {
        font-size: 14px;
    }
}