@extends('admin.layouts.app')

@section('title', __('admin.ai.rollback.title') . ' — ' . __('admin.brand.name'))
@section('page_title', __('admin.ai.rollback.title'))

@section('content')
@include('admin.ai._layout')

<div class="ai-page">
    <div class="ai-card">
        <div class="ai-card__head">
            <h3>{{ __('admin.ai.rollback.range_title') }}</h3>
        </div>
        <div style="padding: 22px; max-width: 720px;">
            <p style="font-size: 13.5px; color: #475569; margin: 0 0 18px;">
                {{ __('admin.ai.rollback.range_intro') }}
            </p>

            <form method="POST" action="{{ route('admin.ai.rollback.range.run') }}" style="display: grid; gap: 14px;"
                  onsubmit="return confirm('{{ __('admin.ai.rollback.range_confirm') }}');">
                @csrf

                <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 14px;">
                    <div class="ai-field">
                        <label>{{ __('admin.ai.rollback.from') }}</label>
                        <input type="datetime-local" name="from" required
                               value="{{ old('from', $defaults['from']) }}"
                               style="padding: 8px 12px; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 13.5px;">
                        @error('from')<span class="field-err">{{ $message }}</span>@enderror
                    </div>
                    <div class="ai-field">
                        <label>{{ __('admin.ai.rollback.to') }}</label>
                        <input type="datetime-local" name="to" required
                               value="{{ old('to', $defaults['to']) }}"
                               style="padding: 8px 12px; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 13.5px;">
                        @error('to')<span class="field-err">{{ $message }}</span>@enderror
                    </div>
                </div>

                <div class="ai-field">
                    <label>{{ __('admin.ai.rollback.admin_filter') }}</label>
                    <select name="admin_filter"
                            style="padding: 8px 12px; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 13.5px;">
                        <option value="">{{ __('admin.ai.rollback.any_admin') }}</option>
                        @foreach ($admins as $a)
                            <option value="{{ $a->id }}" @selected(old('admin_filter') == $a->id)>{{ $a->name ?: $a->email }}</option>
                        @endforeach
                    </select>
                </div>

                <div class="ai-field">
                    <label>{{ __('admin.ai.rollback.note') }}</label>
                    <textarea name="note" rows="2" placeholder="{{ __('admin.ai.rollback.note_placeholder') }}"
                              style="padding: 8px 12px; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 13px; font-family: inherit; resize: vertical;">{{ old('note') }}</textarea>
                </div>

                <label style="display: flex; align-items: center; gap: 8px; font-size: 13px;">
                    <input type="checkbox" name="confirm" value="1" required>
                    {{ __('admin.ai.rollback.confirm_box') }}
                </label>

                <div style="display: flex; gap: 12px;">
                    <button type="submit"
                            style="padding: 10px 18px; background: #b91c1c; color: #fff; border: 0; border-radius: 8px; font-size: 13.5px; font-weight: 700; cursor: pointer;">
                        ↩ {{ __('admin.ai.rollback.run') }}
                    </button>
                    <a href="{{ route('admin.ai.activity.index') }}" class="ai-btn-ghost">{{ __('admin.ai.actions.back') }}</a>
                </div>
            </form>
        </div>
    </div>

    <div class="ai-card">
        <div class="ai-card__head"><h3>{{ __('admin.ai.rollback.what_happens') }}</h3></div>
        <div style="padding: 18px 22px; font-size: 13px; color: #475569; line-height: 1.7;">
            <ul style="margin: 0; padding-inline-start: 18px;">
                <li>{{ __('admin.ai.rollback.help.reversible') }}</li>
                <li>{{ __('admin.ai.rollback.help.skipped') }}</li>
                <li>{{ __('admin.ai.rollback.help.stale') }}</li>
                <li>{{ __('admin.ai.rollback.help.gone') }}</li>
                <li>{{ __('admin.ai.rollback.help.audit') }}</li>
            </ul>
        </div>
    </div>
</div>
@endsection