
<?php $__env->startSection('contacto','active'); ?>
<?php $__env->startSection('content'); ?>

<style>
    .header{
        /* background-color: #F5F5F5; */
        background: rgba(231, 242, 248, 0.3);
    }

    .titulo{
        /*
        font-family: 'Montserrat', sans-serif;
        font-weight: 500;
        font-size: 30px;
        line-height: 126.19%;
        letter-spacing: 0.02em;
        color: #333;
        */
        
        font-family: 'Montserrat';
        font-weight: 600;
        font-size: 35px;
        line-height: 43px;
        color: #174CA0;
        /* text-transform: uppercase; */
    }
    .breadcrumb li a{
        font-family: 'Montserrat', sans-serif;
        font-weight: 300;
        font-size: 13px;
        color: #000;
        line-height: 15.41px;
        text-decoration: none !important;
    }

    .breadcrumb li.active a{
        font-weight: 400 !important;
    }

    textarea{
        resize: none !important;
    }

    ul{
        list-style: none !important;
        list-style-position: outside;
    }

    label{
        font-family: 'Montserrat', sans-serif;
        font-size: 16px;
        font-weight: 400;
        color: #131313 !important;
        line-height: 19px;
    }

    .card{
        border: none !important;
    }
    .sidebar .card-text{
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 161%;
        color: #545454;
    }
    div.d-flex p, div.d-flex a{
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 22px;
        color: #8C8C8C;
        margin-left: 10px;
        text-decoration: none !important;
    }
    .contacto_img{
        margin-right: 5px;
        margin-left: 5px;
    }

    button.enviar{
        background: #F38130 !important;
        border: 1px solid #F38130 !important;
        color: #FFF !important;
        border-radius: 0px !important;
        padding: 10px 32px !important;

       font-family: 'Inter';
       font-style: normal;
       font-weight: 600;
       font-size: 16px;
       line-height: 19px;
       letter-spacing: 0.03em;
       text-transform: capitalize;
       color: #FFFFFF;
       
        transition: 0.4s ease all;
    }

    button.enviar:hover{
        background-color: #FFF  !important;
        color: #F38130 !important;
    }
    
    input, textarea{
        border: 1px solid #838383 !important;
    }
    
    .custom-file-button input[type=file]::-webkit-file-upload-button {
        display: none;
    }
    .custom-file-button input[type=file]::file-selector-button {
        display: none;
    }
    .custom-file-button:hover label {
        cursor: pointer;
    }
    
    .custom-file-button label{
        background-color: rgba(231, 242, 248, 0.3) !important;
        font-family: 'Ubuntu';
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 18px;
        letter-spacing: 0.08em;
        color: #174CA0 !important;
        text-transform: uppercase;
        border-top:1px solid #838383;
        border-left:1px solid #838383;
        border-bottom:1px solid #838383;
    }
    
    label.form-label{
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 30px;
        color: #333333;
    }
    
    input[type=file]{
        border-left: none !important;
    }
    
    input[type=text], input[type=email], textarea{
        border: 1px solid rgba(79, 79, 79, 0.3) !important;
        border-radius: 0px !important;
    }
    
    .form-check-label{
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 19px;
        color: #333333;
    }
    
    .sidebar .fa-envelope, .sidebar .fa-phone-alt, .sidebar .fa-map-marker-alt, .sidebar .fa-whatsapp{
        color: #F38130 !important;
    }
    
    /*.form-check-input{*/
    /*    background: #C4C4C4 !important;*/
    /*    border-radius: 1px !important;*/
    /*}*/
    
    /*.form-check-input:checked[type=checkbox]{*/
    /*    background: #C4C4C4 !important;*/
    /*    border-radius: 1px !important;*/
    /*}*/
    
    .form-check-input:checked{
        background: #C4C4C4;
        border-radius: 0px !important;
    }
    
    .form-check-input{
        border-radius: 0px !important;
    }
    
    .sidebar .card-title{
        font-family: 'Inter';
        font-style: normal;
        font-weight: 600;
        font-size: 32px;
        line-height: 39px;
        color: #333333;
    }
    
    div.d-flex .encabezado{
        margin-left: 0 !important;
        font-weight: 500 !important;
    }

    @media  screen and (min-width: 992px){
        .enviarMje{
            margin-top: 30px;
        }
    }
    @media  screen and (min-width: 992px){
        .menu > .container-fluid{
            align-items: flex-end !important;
        }
    }
</style>

<!--<div class="header">-->
<!--    <div class="container" class="mb-5">-->
        <!--
<!--        <nav class="breadcrumb-menu pb-3" style="--bs-breadcrumb-divider: '|';" aria-label="breadcrumb" style="color: #2B2E39;">-->
<!--            <ol class="breadcrumb">-->
<!--                <li class="breadcrumb-item"><a href="#">Inicio</a></li>-->
<!--                <li class="breadcrumb-item active" aria-current="page"><a href="#">Contacto</a></li>-->
<!--            </ol>-->
<!--        </nav>-->
<!--        -->
        <!--<h1 class="titulo py-4">Contacto</h1>-->
<!--    </div>-->
<!--</div>-->

<div class="container-fluid p-3">
    <div class="row">
        <div class="col-12" style="padding:0;">
            <iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d6562.961920222733!2d-58.5079659!3d-34.6678089!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x95bcc91dea5f5f55%3A0x91e8c8bae6f0a09f!2sPila%207308%2C%20C1440%20CABA!5e0!3m2!1ses!2sar!4v1666193118074!5m2!1ses!2sar" width="100%" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
        </div>
    </div>
</div>

<div class="container contacto">
    <div class="row py-4">
        <?php if(session()->has('success')): ?>
            <div class="col-12">
                <div class="alert alert-success">
                    <?php echo e(session()->get('success')); ?>

                </div>
            </div>
        <?php endif; ?>
        <div class="sidebar col-md-4 col-sm-12">
            <div class="row">
                <div class="col-12">
                    <div class="card">
                        <div class="card-body pt-0 ps-0">
                            <h5 class="card-title mb-3">Grupo Helmont</h5>
                            <p class="card-text">Para mayor informaci&oacute;n, no dude en contactarse mediante el siguiente formulario, o a trav&eacute;s de nuestras v&iacute;as de comunicaci&oacute;n.</p>
                        </div>
                    </div>
                    <div class="d-flex align-items-center mb-3">
                        <i class="fas fa-map-marker-alt fa-lg" aria-hidden="true"></i>
                        <p class="mb-0"><?= $contacto->direccion ?></p>
                    </div>
                    <?php if($contacto->telefono1){ ?>
                        <div class="d-flex align-items-center mb-3">
                            <i class="fas fa-phone-alt" aria-hidden="true"></i>
                            <a href="<?php echo 'tel:' . $contacto->telefono1 ?>"><?= $contacto->telefono1 ?></a>
                        </div>
                    <?php } ?>
                    <?php if($contacto->telefono2){ ?>
                        <div class="d-flex align-items-center mb-3">
                            <i class="fas fa-phone-alt" aria-hidden="true"></i>
                            <a href="<?php echo 'tel:' . $contacto->telefono2 ?>"><?= $contacto->telefono2 ?></a>
                        </div>
                    <?php } ?>
                    <?php if($contacto->whatsapp){ ?>
                        <div class="d-flex align-items-center mb-3">
                            <i class="fab fa-whatsapp fa-lg"></i>
                            <a href="<?= 'https://wa.me/' . $contacto->whatsapp ?>" target="_blank"><?= $contacto->whatsapp ?></a>
                        </div>
                    <?php } ?>
                    <div class="d-flex align-items-center mb-3">
                        <i class="fas fa-envelope fa-lg" aria-hidden="true"></i>
                        <a href="<?php echo 'mailto:' . $contacto->email ?>"><?= $contacto->email ?></a>
                    </div>
                    <div class="d-flex">
                        <p class="encabezado mb-1">Departamento de ventas</p>
                    </div>
                    <div class="d-flex align-items-center mb-3">
                        <i class="fas fa-envelope fa-lg" aria-hidden="true"></i>
                        <a href="<?php echo 'mailto:' . $contacto->ventas ?>"><?= $contacto->ventas ?></a>
                    </div>
                    <div class="d-flex">
                        <p class="encabezado mb-1">Departamento de administraci&oacute;n</p>
                    </div>
                    <div class="d-flex align-items-center">
                        <i class="fas fa-envelope fa-lg" aria-hidden="true"></i>
                        <a href="<?php echo 'mailto:' . $contacto->administracion ?>"><?= $contacto->administracion ?></a>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="col-lg-8 col-md-8 col-sm-12">
            <form class="formContacto row" method="POST" action="<?= route('formContacto') ?>">
                <?php echo csrf_field(); ?>
                <div class="mb-3 col-md-6">
                    <label for="inputNombre" class="form-label">Nombre y apellido*</label>
                    <input type="text" class="form-control" id="inputNombre" name="nombre" required>
                </div>
                <div class="mb-3 col-md-6">
                    <label for="inputEmail" class="form-label">E-mail*</label>
                    <input type="email" class="form-control" id="inputEmail" name="email" required>
                </div>
                <div class="mb-3 col-md-6">
                    <label for="inputTelefono" class="form-label">Tel&eacute;fono</label>
                    <input type="text" class="form-control" id="inputTelefono" name="telefono">
                </div>
                <div class="mb-3 col-md-6">
                    <label for="inputEmpresa" class="form-label">Empresa</label>
                    <input type="text" class="form-control" id="inputEmpresa" name="empresa">
                </div>
                <div class="mb-3 col-12">
                    <label for="exampleFormControlTextarea1" class="form-label">Mensaje*</label>
                    <textarea class="form-control" id="textareaMensaje" rows="3" name="mensaje" required></textarea>
                </div>
                <!--<div class="col-md-6 col-sm-12 mb-3">-->
                <!--    <div class="form-check">-->
                <!--        <input class="form-check-input" type="checkbox">-->
                <!--        <label class="form-check-label" for="flexCheckDefault">Acepto t&eacute;rminos y condiciones</label>-->
                <!--    </div>-->
                <!--</div>-->
                
                <!--<div class="col-md-6 col-sm-12 pe-md-5">-->
                <!--    <label for="inputGroupFile" class="form-label">Archivo</label>-->
                <!--    <div class="input-group custom-file-button">-->
                <!--        <label class="input-group-text" for="inputGroupFile">Adjuntar</label>-->
                <!--        <input type="file" class="form-control" id="inputGroupFile" name="archivo">-->
                <!--    </div>-->
                <!--</div>-->
                <div class="col-md-12 col-sm-12">
                    <div class="d-md-flex justify-content-between align-items-center">
                        <div>
                            <div class="form-check">
                                <input class="form-check-input" type="checkbox" id="flexCheckDefault">
                                <label class="form-check-label" for="flexCheckDefault">Acepto t&eacute;rminos y condiciones</label>
                            </div>
                        </div>
                        <div>
                            <button type="submit" class="btn btn-primary w-100 enviar" disabled="disabled">Enviar mensaje</button>
                        </div>
                    </div>
                </div>
                <!--<div class="col-md-6 col-sm-12">-->
                <!--    <div class="d-grid gap-2 d-md-flex justify-content-md-end align-items-end h-100">-->
                <!--        <button type="submit" class="btn btn-primary w-100 enviar">Enviar mensaje</button>-->
                <!--    </div>-->
                <!--</div>-->
            </form>
        </div>
    </div>
</div>

<script type="text/javascript" src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
    $(document).ready(function(){
        $('.enviarMje').click(function(){
            var nombre = $('#nombre').val();
            var email = $('#email').val();
            var telefono = $('#telefono').val();
            var empresa = $('#empresa').val();
            var mensaje = $('#mensaje').val();
            if(nombre == '' || email == '' || mensaje == ''){
                alert('Debe completar todos los campos');
            } else {
                $('.formContacto').submit();
            }
        });
        $('input[type="checkbox"]').change(function(){
            if($(this).is(':checked')){
                $('.enviar').prop('disabled', false);
            } else{
                $('.enviar').prop('disabled', true);
            }
        });
    });
</script>

<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.plantilla', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/d11osolecom/public_html/grupohelmont/resources/views/front/contacto.blade.php ENDPATH**/ ?>