<section <?php if(empty($_GET['context']) || $_GET['context'] !== 'edit') echo get_block_wrapper_attributes( array('class' => "bg-blue-500", ) ); else echo 'data-wp-block-props="true"'; ?>>
    <div class="mx-auto max-w-screen-xl px-4 py-16">
        <div class="grid grid-cols-1 gap-x-16 gap-y-8 lg:grid-cols-5">
            <div class="bg-white col-span-5 gap-8 lg:p-28 md:grid-cols-2 md:p-12 px-4 py-8 rounded-lg shadow-lg">
                <div class="mb-4 space-y-2 md:mb-14">
                    <p class="font-bold"><?php _e( 'LEON PHARMACY', 'leonpharmacy' ); ?></p>
                    <h3 class="font-bold text-2xl"><?php _e( 'Contact Us', 'leonpharmacy' ); ?></h3>
                    <p><?php _e( 'Get in touch with us.', 'leonpharmacy' ); ?></p>
                </div>
                <div class="bg-white col-span-5 gap-8 grid md:grid-cols-2 lg:p-0">
                    <?php $mailer = new PG_Simple_Form_Mailer(); ?>
                    <?php $mailer->process( array(
                            'form_id' => 'contact_form_mailer_id',
                            'send_to_email' => true,
                            'save_to_post_type' => true,
                            'email' => 'info@leonpharmacy.com',
                            'post_type' => 'contact_message',
                            'title' => 'New Message',
                            'intro' => 'New Message Received'
                    ) ); ?>
                    <?php if( !$mailer->processed || $mailer->error) : ?>
                        <form action="<?php echo '#contact_form_mailer_id'; ?>" class="flex-1 space-y-4" id="contact_form_mailer_id" method="post" onsubmit="event.stopImmediatePropagation();event.stopPropagation();">
                            <div>
                                <label class="sr-only" for="name">
                                    <?php _e( 'Name', 'leonpharmacy' ); ?>
                                </label>
                                <input required class="border-black p-3 text-sm w-full" placeholder="Name" type="text" id="name" name="contact_form_mailer_id_1" value="<?php echo ( isset( $_POST['contact_form_mailer_id_1'] ) ? $_POST['contact_form_mailer_id_1'] : '' ); ?>"/>
                            </div>
                            <div>
                                <label class="sr-only" for="email">
                                    <?php _e( 'Email', 'leonpharmacy' ); ?>
                                </label>
                                <input required class="border-black p-3 text-sm w-full" placeholder="Email address" type="email" id="email" name="contact_form_mailer_id_2" value="<?php echo ( isset( $_POST['contact_form_mailer_id_2'] ) ? $_POST['contact_form_mailer_id_2'] : '' ); ?>"/>
                            </div>
                            <div>
                                <label class="sr-only" for="message">
                                    <?php _e( 'Message', 'leonpharmacy' ); ?>
                                </label>
                                <textarea required class="border-black p-3 text-sm w-full" placeholder="Message" rows="8" id="message" name="contact_form_mailer_id_3"><?php echo ( isset( $_POST['contact_form_mailer_id_3'] ) ? $_POST['contact_form_mailer_id_3'] : '' ); ?></textarea>
                            </div>
                            <div class="mt-auto">
                                <button href="#" class="capitalize duration-700 px-5 py-2 text-white hover:text-black w-full inline-flex items-center justify-center font-normal transition-colors hover:bg-gray-200 ease-in-out bg-blue-500 mt-4 text-center" type="submit">
                                    <?php _e( 'Send Message', 'leonpharmacy' ); ?>
                                </button>
                            </div>
                            <input type="hidden" name="contact_form_mailer_id" value="1"/>
                        </form>
                    <?php endif; ?>
                    <?php if( $mailer->processed ) : ?>
                        <?php if( $mailer->error ) : ?>
                            <div class="bg-red-500 m-auto shadow text-white w-full sm:rounded-lg" style="display:block;">
                                <div class="px-4 py-5 text-center sm:p-6">
                                    <h3 class="font-semibold leading-6"><?php _e( 'Message Unsuccessful', 'leonpharmacy' ); ?></h3>
                                    <div class="mt-2">
                                        <p><?php _e( 'There was an error sending your message.', 'leonpharmacy' ); ?></p>
                                    </div>
                                </div>
                            </div>
                        <?php else : ?>
                            <div class="bg-green-400 m-auto shadow w-full sm:rounded-lg" style="display:block;">
                                <div class="px-4 py-5 text-center sm:p-6">
                                    <h3 class="font-semibold leading-6 text-gray-900"><?php _e( 'Message Successful', 'leonpharmacy' ); ?></h3>
                                    <div class="mt-2 text-black">
                                        <p><?php _e( 'Your message was successfully sent.', 'leonpharmacy' ); ?></p>
                                    </div>
                                </div>
                            </div>
                        <?php endif; ?>
                    <?php endif; ?>
                    <div class="not-prose py-2 space-y-2">
                        <div class="flex space-x-4">
                            <img src="<?php echo get_template_directory_uri(); ?>/assets/images/extras/email-icon-fill.svg"/><a href="mailto:info@leonpharmacy.ca?subject=Message%20To%20Leon%20Pharmacy"><p><?php _e( 'info@leonpharmacy.ca', 'leonpharmacy' ); ?></p></a>
                        </div>
                        <div class="flex space-x-4">
                            <img src="<?php echo get_template_directory_uri(); ?>/assets/images/extras/phone-icon.svg"/><a href="tel:905-845-2811"><p><?php _e( '(905) 845-2811', 'leonpharmacy' ); ?></p></a>
                        </div>
                        <div class="flex space-x-4">
                            <img src="<?php echo get_template_directory_uri(); ?>/assets/images/extras/pin-icon.svg"/><a href="https://goo.gl/maps/SVnnmjbXN8K2" target="_blank"><p><?php _e( '340 Kerr Street, Oakville, Ontario, L6K 3B8 Canada', 'leonpharmacy' ); ?></p></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>