@extends('layouts.web')
@section('main')
<div class="breadcrumb-area breadcrumb-img bg-img" data-bg="{{ asset('images/cabeceras/'.$cabecera->imagen) }}">
    <div class="container">
        <div class="row">
            <div class="col-12">
                <div class="breadcrumb-wrap">
                    <nav aria-label="breadcrumb">
                        <h3 class="breadcrumb-title">SUCURSALES</h3>
                        <ul class="breadcrumb justify-content-center">
                            <li class="breadcrumb-item"><a href="index.html"><i class="fa fa-home"></i></a></li>
                            <li class="breadcrumb-item active" aria-current="page">Sucursales</li>
                        </ul>
                    </nav>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="blog-main-wrapper section-padding">
    <div class="container">
        <div class="row">
            <div class="col-lg-12 order-1 order-lg-2">
                <div class="blog-item-wrapper">
                    <!-- blog item wrapper end -->
                    <div class="row mbn-30">
                        @foreach ($sucursales as $item)
                        <div class="col-12">
                            <div class="blog-post-item blog-list-item mb-30">
                                <div class="blog-thumb">
                                    <img src="{{ asset('images/sucursales/'.$item->imagen) }}" alt="{{ $item->nombre }}">
                                </div>
                                <div class="blog-content">
                                    <h6 class="blog-title"> {{ $item->nombre }} </h6>
                                    <div class="blog-desc">Dirección:{!! str_replace("\n", '<p>', $item->contenido) !!}</div>
                                    <div class="blog-desc">Contacto:{{ $item->contacto }}</div>
                                    <div class="blog-desc">Teléfono:{{ $item->telefono }}</div>
                                    <a class="btn read-more" href="{{ $item->facebook }}" target="_blank"><i class="fa fa-facebook"></i></a>
                                    <a class="btn read-more" href="{{ $item->mapa }}" target="_blank"><i class="fa fa-map-marker"></i></a>
                                    <a class="btn read-more" href="mailto:{{ $item->correo }}" target="_blank"><i class="fa fa-envelope"></i></a>
                                </div>
                            </div>
                        </div>    
                        @endforeach
                    </div>
                    <div class="paginatoin-area shadow-bg text-center">                       
                        {{ $sucursales->links('vendor.pagination.bootstrap-4') }}
                    </div>
                    <!-- end pagination area -->
                </div>
            </div>
        </div>
    </div>
</div>
@endsection