.share-square-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background-color: #f4f6f8 !important;
    color: var(--primary-color) !important;
    border: 1px solid #dce1e7 !important;
    border-radius: 4px;
    text-decoration: none;
    font-size: 13px;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.share-square-btn i,
.share-square-btn svg {
    color: var(--primary-color) !important;
    fill: var(--primary-color) !important;
    transition: color 0.2s ease, fill 0.2s ease;
}

.share-square-btn:hover {
    background-color: var(--primary-color) !important;
    color: #ffffff !important;
    border-color: var(--primary-color) !important;
}
.share-square-btn:hover i,
.share-square-btn:hover svg {
    color: #ffffff !important;
    fill: #ffffff !important;
}

.custom-wa-btn {
    background-color: #f4f6f8 !important;
    color: var(--primary-color) !important;
    border: 1px solid #dce1e7 !important;
    transition: all 0.2s ease-in-out !important;
}
.custom-wa-btn i {
    color: var(--primary-color) !important;
    transition: color 0.2s ease-in-out !important;
}
.custom-wa-btn:hover {
    background-color: var(--primary-color) !important;
    color: #ffffff !important;
    border-color: var(--primary-color) !important;
}
.custom-wa-btn:hover i {
    color: #ffffff !important;
}