@extends('site.layouts.app')

@section('content')

<div class="page-wrapper content-wrapper page-perfil">
    <section class="content">
        <div class="container">
            <x-aside.sailor-authenticated />

            <div class="perfil">
                <div class="perfil__photo">
                    <img src="{{ asset($sailor->photo) }}" alt="{{ $sailor->name }}">

                    <div>
                        <h3>{{ $sailor->name }}</h3>

                        <p>{{ ($sailor->id_cb) ? "ID $sailor->id_cb" : '' }}</p>
                    </div>
                </div>

                <div class="perfil__dates">
                    <!-- TODOS OS INPUTS DA PÁGINA ESTÃO COM DISABLED -->
                    <!-- SE NECESSÁRIO PODE REMOVER AS DIVS FIELD DE DENTRO DO FORM -->
                    <form action="">
                        <div class="field">
                            <label for="name">Nome<span>*</span></label>
                            <input value="{{ $sailor->name }}" disabled type="text" name="name" id="name">
                        </div>

                        <div class="columns">
                            <div class="field">
                                <label for="cpf">CPF<span>*</span></label>
                                <input value="{{ $sailor->cpf }}" disabled type="text" name="cpf" id="cpf">
                            </div>
                            <div class="field">
                                <label for="email">E-mail<span>*</span></label>
                                <input value="{{ $sailor->email }}" disabled type="email" name="email" id="email">
                            </div>
                        </div>

                        <div class="columns">
                            <div class="field">
                                <label for="phone">Telefone / Contato<span>*</span></label>
                                <input value="{{ $sailor->phone }}" disabled type="text" name="phone" id="phone">
                            </div>
                            <div class="field">
                                <label for="club">Clube<span>*</span></label>
                                <input value="{{ $sailor->club }}" disabled type="text" name="club" id="club">
                            </div>
                        </div>

                        <div class="columns">
                            <div class="field">
                                <label for="city">Cidade<span>*</span></label>
                                <input value="{{ $sailor->city }}" disabled type="text" name="city" id="city">
                            </div>
                            <div class="field">
                                <label for="state">Estado<span>*</span></label>
                                <input value="{{ $sailor->state }}" disabled type="text" name="state" id="state">
                            </div>
                        </div>

                        <div class="columns">
                            <div class="field">
                                <label for="id-ws">ID (World Sailing)<span>*</span></label>
                                <input value="{{ $sailor->id_ws ?? '' }}" disabled type="text" name="id-ws" id="id-ws">
                            </div>
                            <div class="field">
                                <label for="id-cb">ID (CB Vela)<span>*</span></label>
                                <input value="{{ $sailor->id_cb ?? '' }}" disabled type="text" name="id-cb" id="id-cb">
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </section>
</div>

@endsection