@extends('layouts.app')

@section('title', 'Ayuda de Ship Market')
@section('full_width', '1')
@section('hide_navbar', '1')

@section('content')
    <div class="ship-market-page" data-csrf-token="{{ csrf_token() }}">
        <nav class="ship-market-nav" aria-label="Navegacion de Ship Market">
            <a href="{{ route('ship-market.index') }}" class="ship-market-nav__link">Ship Market</a>
            <a href="{{ route('ship-market.help') }}" class="ship-market-nav__link ship-market-nav__link--active" aria-current="page">Ayuda de Ship Market</a>
        </nav>

        <header class="ship-market-topbar">
            <a href="{{ route('ship-market.index') }}" class="ship-market-brand">
                <img src="{{ asset('imgs/avante-logo.png') }}" alt="Avante">
                <div>
                    <strong>Ship Market</strong>
                    <span>Centro de ayuda</span>
                </div>
            </a>

            <div class="ship-market-topbar__actions">
                @unless (auth()->user()?->isSolicitante())
                    <a href="{{ route('dashboard') }}" class="btn btn-outline-secondary">Volver al dashboard</a>
                @endunless
                <a href="{{ route('ship-market.index') }}" class="btn btn-brand">Ir a Ship Market</a>
            </div>
        </header>

        <section class="ship-market-help ship-market-help--page">
            <div class="ship-market-help__copy">
                <div class="ship-market-kicker">Ayuda de Ship Market</div>
                <h2>Como usar Ship Market</h2>
                <p>Use los filtros para encontrar bienes por codigo, descripcion o tipo. Cada bloque del catalogo agrupa los bienes por tipo de item y muestra la disponibilidad directamente en el thumbnail.</p>
                <p>Cuando agregue un bien, este pasara al carrito y podra ajustar sus cantidades desde el modal. El panel lateral del carrito resume los articulos seleccionados y prepara las acciones siguientes del flujo.</p>
                <p>Si necesita reiniciar la busqueda, use el boton Limpiar. Para volver al catalogo principal, seleccione Ship Market en la barra superior.</p>
            </div>
        </section>
    </div>
@endsection

@push('styles')
    <link rel="stylesheet" href="{{ asset('css/ship-market.css') }}">
@endpush

@push('scripts')
    <script src="{{ asset('js/ship-market.js') }}"></script>
@endpush
