/* Define the default colors based on the theme */
.whatsapp-link, .whatsapp-text {
    --primary-color: #075e54; /* Light theme color */
    color: var(--primary-color);
}

/* Ensure visited links stay the same color */
.whatsapp:visited, .whatsapp-link:visited, .whatsapp-text:visited {
    color: var(--primary-color);
}

.whatsapp-icon {
    color: var(--primary-color);
    margin-right: 8px;
}

.whatsapp-text {
    color: var(--primary-color);
    text-decoration: none; /* Ensure no underlining */
}

/* Dark mode adjustments */
@media (prefers-color-scheme: dark) {
    .whatsapp-link,
    .whatsapp-icon,
    .whatsapp-text,
    .whatsapp-btn {
        --primary-color: #99e6b5; /* Dark theme color */
        color: var(--primary-color);
    }

    .whatsapp-btn {
        border: 1px solid var(--primary-color); /* Dark mode border color */
    }
}

/* Light mode adjustments */
@media (prefers-color-scheme: light) {
    .whatsapp-link,
    .whatsapp-icon,
    .whatsapp-text,
    .whatsapp-btn {
        --primary-color: #075e54; /* Light theme color */
        color: var(--primary-color);
    }

    .whatsapp-btn {
        border: 1px solid var(--primary-color); /* Light mode border color */
    }
}

@media (max-width: 420px) {
    .whatsapp-btn {
        width: 100%;
    	margin-top: 10px;
        text-align: center;
    }
}

.whatsapp-btn {
    padding: 12px 15px;
    background-color: rgba(0, 0, 0, 0); /* Transparent background */
}