@extends('layouts.shop')

@section('meta_title', __('Главная'))
@section('meta_description', __('Интернет-магазин комплектующих для ПК: процессоры, материнские платы, видеокарты, ноутбуки и периферия.'))
@section('meta_keywords', __('интернет-магазин пк, комплектующие, процессоры, видеокарты, ноутбуки'))
@section('meta_canonical', route('home'))

@section('content')
    <section class="pc-home-sliders">
        @include('partials.home-slider', [
            'slides' => $leftSlides,
            'sliderClass' => 'is-main',
            'fallbackTitle' => __('Собирайте ПК быстрее'),
            'fallbackText' => __('Процессоры, материнские платы, видеокарты, ноутбуки и периферия в одном каталоге.'),
            'fallbackUrl' => route('catalog.index'),
            'fallbackButton' => __('Перейти в каталог'),
        ])
        @include('partials.home-slider', [
            'slides' => $rightSlides,
            'sliderClass' => 'is-side',
            'fallbackTitle' => __('Доставка и оплата'),
            'fallbackText' => __('Узнайте сроки доставки и способы оплаты заказа.'),
            'fallbackUrl' => route('pages.shipping-payment'),
            'fallbackButton' => __('Подробнее'),
        ])
    </section>

    <section class="pc-section">
        <div class="pc-section-title">
            <h2>{{ __('Категории') }}</h2>
        </div>
        <div class="pc-grid pc-grid-4 pc-category-grid">
            @foreach ($categories as $category)
                <a class="pc-card pc-category-card pc-category-link" href="{{ route('catalog.category', $category) }}">
                    <div class="pc-category-image" role="img" aria-label="{{ __($category->name) }}"></div>
                    <h3 class="pc-category-title">{{ __($category->name) }}</h3>
                </a>
            @endforeach
        </div>
    </section>

    @include('partials.product-carousel', [
        'title' => __('Популярные товары'),
        'products' => $featured,
        'emptyText' => __('Пока нет популярных товаров.'),
    ])

    @include('partials.product-carousel', [
        'title' => __('Новые товары'),
        'products' => $newProducts,
        'emptyText' => __('Пока нет новых товаров.'),
    ])

    <section class="pc-grid pc-grid-3">
        <a class="pc-card pc-category-link" href="{{ route('pages.shipping-payment') }}">
            <div class="pc-card-meta">{{ __('Сервис') }}</div>
            <h3>{{ __('Доставка и оплата') }}</h3>
            <p>{{ __('Условия доставки, способы оплаты и сроки отправки.') }}</p>
        </a>
        <a class="pc-card pc-category-link" href="{{ route('pages.about') }}">
            <div class="pc-card-meta">{{ __('Компания') }}</div>
            <h3>{{ __('О нас') }}</h3>
            <p>{{ __('Чем занимаемся и как помогаем выбрать комплектующие.') }}</p>
        </a>
        <a class="pc-card pc-category-link" href="{{ route('pages.contacts') }}">
            <div class="pc-card-meta">{{ __('Поддержка') }}</div>
            <h3>{{ __('Контакты') }}</h3>
            <p>{{ __('Свяжитесь с нами для консультации по вашей сборке.') }}</p>
        </a>
    </section>
@endsection