/* Contact Form 7 Custom CSS Fixes */

/* Remove default CF7 paragraph margins and line breaks */
.wpcf7-form p {
    margin: 0 !important;
    padding: 0 !important;
}

/* Hide the unwanted line breaks that CF7 adds */
.wpcf7-form br {
    display: none !important;
}

/* Center validation messages */
.wpcf7-response-output {
    text-align: center !important;
    margin: 1rem 0 !important;
}

/* Center individual field validation messages */
.wpcf7-not-valid-tip {
    text-align: center !important;
    display: block !important;
    margin-top: 0.5rem !important;
    color: #ef4444 !important;
    font-size: 0.875rem !important;
}

/* Submit button loading state */
.wpcf7-form.submitting .wpcf7-submit {
    position: relative !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
}

.wpcf7-submit:hover{
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    background-color: #3DABB8 !important;
}

/* Loading spinner in center of submit button */
.wpcf7-form.submitting .wpcf7-submit::after {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 20px !important;
    height: 20px !important;
    border: 2px solid transparent !important;
    border-top: 2px solid currentColor !important;
    border-radius: 50% !important;
    animation: spin 1s linear infinite !important;
}

.wpcf7-spinner{
    left: 0;
    right: 0;
    position: absolute;
    margin: 0 auto;
    top: 50%;
}

/* Disable all form fields during submission */
.wpcf7-form.submitting input,
.wpcf7-form.submitting textarea,
.wpcf7-form.submitting select {
    pointer-events: none !important;
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}

/* Spinner animation */
@keyframes spin {
    0% { transform: translate(-50%, -50%) rotate(0deg); }
    100% { transform: translate(-50%, -50%) rotate(360deg); }
}

/* Fix focus states that might be broken by CF7 classes */
.wpcf7-form input:focus,
.wpcf7-form textarea:focus,
.wpcf7-form select:focus {
    outline: none !important;
    ring: 2px !important;
    ring-color: var(--pedicare-color, #3b82f6) !important;
}

/* Ensure proper spacing in grid layout */
.wpcf7-form .grid > div {
    display: flex !important;
    flex-direction: column !important;
}

/* Style the form wrapper to match your design */
.wpcf7-form .wpcf7-form-control-wrap {
    display: block !important;
    width: 100% !important;
}

/* Remove CF7 default validation styling that might conflict */
.wpcf7-form .wpcf7-not-valid {
    border-color: #ef4444 !important;
}

.wpcf7-form .wpcf7-validates-as-required.wpcf7-not-valid {
    border-color: #ef4444 !important;
}


/* Add this external css customizer not from this plugin  */
.menu-item-pedicare a {
    color: #fff !important;
    --tw-bg-opacity: 1;
    background-color: rgb(61 171 184 / var(--tw-bg-opacity, 1));
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    border-radius: 9999px;
    margin-top: -8px;
}

.menu-item-pedicare:hover a {
    color: #000 !important;
}

@media (max-width: 990px) {

    .menu-item-pedicare a {
        margin: 0;
        padding: 0;
        text-align: center;
    }

}