/**
                            * Button Fix CSS - Version 1.1.0
                            *
                            * This CSS ensures the buttons in the registration form are always visible
                            * and properly styled, regardless of JavaScript issues.
                            *
                            * - Improved z-index handling
                            * - Added stronger visibility enforcement
                            * - Fixed potential overflow issues
                            * - Enhanced button styling
                            */

                            /* Navigation container */
                            .wizard-navigation {
                                display: flex !important;
                                flex-direction: row !important;
                                flex-wrap: wrap !important;
                                justify-content: space-between !important;
                                gap: 15px !important;
                                margin-top: 30px !important;
                                padding: 15px 5px !important;
                                width: 100% !important;
                                opacity: 1 !important;
                                visibility: visible !important;
                                position: relative !important;
                                z-index: 9999 !important;
                                border-top: 1px solid rgba(0,0,0,0.1) !important;
                            }

                            /* All navigation buttons */
                            .wizard-navigation button {
                                display: flex !important;
                                align-items: center !important;
                                justify-content: center !important;
                                padding: 12px 24px !important;
                                min-height: 48px !important;
                                min-width: 120px !important;
                                border-radius: 8px !important;
                                border: none !important;
                                font-size: 16px !important;
                                font-weight: 600 !important;
                                cursor: pointer !important;
                                transition: all 0.2s ease !important;
                                text-align: center !important;
                                opacity: 1 !important;
                                visibility: visible !important;
                            }

                            /* Next button */
                            #next-step-btn {
                                background-color: #7367f0 !important;
                                color: white !important;
                                margin-left: auto !important; /* Push to right in RTL */
                                display: flex !important;
                                opacity: 1 !important;
                                visibility: visible !important;
                                z-index: 10000 !important;
                                position: relative !important;
                                box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15) !important;
                            }

                            /* Previous button */
                            #prev-step-btn {
                                background-color: #6c757d !important;
                                color: white !important;
                                z-index: 10000 !important;
                                position: relative !important;
                                box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15) !important;
                            }

                            /* Submit button */
                            #submit-registration-btn {
                                background-color: #28c76f !important;
                                color: white !important;
                                margin-left: auto !important; /* Push to right in RTL */
                                z-index: 10000 !important;
                                position: relative !important;
                                box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15) !important;
                            }

                            /* Button hover states */
                            .wizard-navigation button:hover {
                                transform: translateY(-2px) !important;
                                box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) !important;
                            }

                            /* Ensure mobile responsiveness */
                            @media (max-width: 767px) {
                                .wizard-navigation {
                                    flex-direction: column !important;
                                    gap: 10px !important;
                                }
                                
                                .wizard-navigation button {
                                    width: 100% !important;
                                }
                            }

                            /* Fix for hidden wizard step issues */
                            .wizard-step[style*="display: none"] input[required],
                            .wizard-step[style*="display: none"] select[required],
                            .wizard-step[style*="display: none"] textarea[required] {
                                /* Temporarily remove required attribute from hidden fields to avoid validation errors */
                                /* Note: This is a CSS way to address the issue, but JS will handle it more reliably */
                                pointer-events: none;
                            }

                            /* Special card selection highlight */
                            .immigration-type-card.selected {
                                border-color: #7367f0 !important;
                                background-color: rgba(115, 103, 240, 0.05) !important;
                                transform: translateY(-5px) !important;
                                box-shadow: 0 8px 15px rgba(115, 103, 240, 0.2) !important;
                            }