/* Calendly Widget Custom Positioning */
/* Override default Calendly badge positioning to match WhatsApp widget on left side */

.calendly-badge-widget {
    /* Position on left side instead of default right */
    left: 20px !important;
    right: auto !important;
    
    /* Match proper vertical positioning with increased spacing */
    bottom: 120px !important;
    
    /* Ensure proper z-index */
    z-index: 9998 !important; /* One less than WhatsApp widget to avoid conflict */
    
    /* Additional styling to match design */
    transition: all 0.3s ease !important;
}

/* Hover effects to match WhatsApp widget */
.calendly-badge-widget:hover {
    transform: scale(1.05) !important;
}

/* Mobile responsiveness to match WhatsApp widget */
@media (max-width: 768px) {
    .calendly-badge-widget {
        left: 15px !important;
        bottom: 90px !important;
    }
    
    /* Reduce size for mobile */
    .calendly-badge-widget .calendly-badge-content {
        font-size: 12px !important;
        padding: 8px 12px !important;
    }
}

@media (max-width: 480px) {
    .calendly-badge-widget {
        left: 10px !important;
        bottom: 70px !important;
    }
    
    /* Further reduce size for small mobile */
    .calendly-badge-widget .calendly-badge-content {
        font-size: 11px !important;
        padding: 6px 10px !important;
    }
}

@media (max-width: 360px) {
    .calendly-badge-widget {
        left: 8px !important;
        bottom: 50px !important;
    }
    
    /* Even smaller for very small screens */
    .calendly-badge-widget .calendly-badge-content {
        font-size: 10px !important;
        padding: 5px 8px !important;
    }
}

/* Ensure proper spacing between widgets */
.calendly-badge-widget {
    /* Add some margin to avoid overlap with other elements */
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Optional: Add subtle shadow effect to match WhatsApp widget style */
.calendly-badge-widget .calendly-badge-content {
    box-shadow: 0 4px 20px rgba(255, 117, 0, 0.3) !important;
    border-radius: 25px !important;
}

.calendly-badge-widget:hover .calendly-badge-content {
    box-shadow: 0 6px 25px rgba(255, 117, 0, 0.5) !important;
}