@extends('layouts.merchant')

@section('title', 'Новая выгрузка')

@php($input = 'w-full rounded-[var(--radius-md)] border-[1.5px] border-[#E1E4EA] bg-white px-4 py-2.5 text-sm outline-none focus:border-[var(--color-primary)]')
@php($lbl = 'mb-1.5 block text-sm font-semibold text-[var(--color-ink)]')

@section('content')
<div class="max-w-xl">
    <h1 class="text-2xl font-extrabold tracking-tight text-[var(--color-ink)]">Новая выгрузка</h1>
    @include('seller.feeds.partials.source-tabs', ['active' => 'yml'])

    @if ($errors->any())
        <div class="mt-4 rounded-[var(--radius-md)] bg-[#FDECEE] px-4 py-3 text-sm font-semibold text-[var(--color-sale)]">
            @foreach ($errors->all() as $e) <div>{{ $e }}</div> @endforeach
        </div>
    @endif

    <form method="POST" action="{{ route('merchant.feeds.store') }}"
          class="mt-6 space-y-4 rounded-[var(--radius-lg)] bg-white p-6 shadow-[var(--shadow-card)]">
        @csrf
        <label class="block"><span class="{{ $lbl }}">Название источника</span>
            <input name="name" value="{{ old('name') }}" placeholder="Например: сайт, оптовый склад" class="{{ $input }}">
            <span class="mt-1 block text-xs text-[var(--color-muted)]">
                Нужно только вам — различать выгрузки в списке. Оставьте пустым, и мы подставим адрес сайта.
            </span>
        </label>

        {{-- Не <label> целиком: внутри есть ссылка на инструкции, а клик по ней
             не должен читаться как клик по подписи поля. --}}
        <div>
            <div class="mb-1.5 flex flex-wrap items-baseline justify-between gap-x-4 gap-y-1">
                <label for="feed-url" class="text-sm font-semibold text-[var(--color-ink)]">Ссылка на YML</label>
                <a href="{{ route('integrations.index') }}" target="_blank" rel="noopener"
                   class="inline-flex items-center gap-1 text-xs font-semibold text-[var(--color-primary)] hover:underline">
                    Где взять файл? <i data-lucide="external-link" class="h-3.5 w-3.5"></i>
                </a>
            </div>
            <input id="feed-url" name="url" value="{{ old('url') }}" placeholder="https://..." class="{{ $input }}">
            <span class="mt-1 block text-xs text-[var(--color-muted)]">
                Фид загружается по ссылке и обновляется автоматически.
                Не знаете, где взять ссылку — посмотрите
                <a href="{{ route('integrations.index') }}" target="_blank" rel="noopener"
                   class="font-semibold text-[var(--color-primary)] hover:underline">инструкции для 1С, Битрикс, МойСклад и других систем</a>.
            </span>
        </div>

        <label class="block"><span class="{{ $lbl }}">Как часто обновлять</span>
            <select name="update_interval_minutes" class="{{ $input }}">
                <option value="1440" @selected(old('update_interval_minutes', 1440) == 1440)>1 раз в день</option>
                <option value="720" @selected(old('update_interval_minutes') == 720)>2 раза в день</option>
            </select>
            <span class="mt-1 block text-xs text-[var(--color-muted)]">Не нужно обновлять — выключите фид на его странице, тогда товары деактивируются.</span>
        </label>

        <label class="flex items-start gap-2.5">
            <input type="checkbox" name="show_source_url" value="1" @checked(old('show_source_url')) class="mt-0.5 h-4 w-4 rounded border-[#E1E4EA]">
            <span class="text-sm text-[var(--color-ink)]">Показывать в карточке товара кнопку «Смотреть на сайте продавца» (ведёт на вашу страницу товара).</span>
        </label>

        {{-- Warehouse address (mandatory) — used to estimate delivery time to the buyer's city. --}}
        <div class="border-t border-[var(--color-line)] pt-4">
            <x-address-picker prefix="address" label="Адрес склада (откуда доставка)"
                :formatted="old('address_formatted')" :lat="old('address_lat')" :lng="old('address_lng')" />
        </div>

        <button type="submit" class="rounded-[var(--radius-md)] bg-[var(--color-primary)] px-6 py-3 text-[15px] font-bold text-white shadow-[var(--shadow-primary)] hover:bg-[var(--color-primary-dark)]">Сохранить</button>
    </form>
</div>
@endsection