@extends('portal.layouts.app')

@section('content')
    <div class="portal-actions" style="margin-top: 0; margin-bottom: 18px;">
        <a class="portal-button portal-button--ghost" href="{{ route('portal.requests') }}">{{ trans('portal.submit.back_to_requests') }}</a>
    </div>

    <div class="portal-card">
        <h2 class="portal-card__title">{{ trans('portal.submit.complaint.form_title') }}</h2>

        @if ($errors->any())
            <div class="portal-alert">
                <ul style="margin: 0; padding-left: 18px;">
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        @endif

        <form method="POST" action="{{ route('portal.submit.store', 'complaint') }}" enctype="multipart/form-data" style="margin-top: 18px;">
            @csrf

            <div class="portal-field">
                <label for="subject">{{ trans('portal.submit.complaint.subject') }} <span style="color:var(--portal-danger)">*</span></label>
                <input type="text" id="subject" name="subject" value="{{ old('subject') }}" maxlength="255" required>
                @error('subject')<div class="portal-field__error">{{ $message }}</div>@enderror
            </div>

            <div class="portal-field" style="margin-top: 14px;">
                <label for="complaint_details">{{ trans('portal.submit.complaint.details') }} <span style="color:var(--portal-danger)">*</span></label>
                <textarea id="complaint_details" name="complaint_details" rows="6" maxlength="3000" required
                    style="width:100%;border:1px solid var(--portal-border);border-radius:14px;padding:11px 14px;font:inherit;resize:vertical;">{{ old('complaint_details') }}</textarea>
                @error('complaint_details')<div class="portal-field__error">{{ $message }}</div>@enderror
            </div>

            <div class="portal-field" style="margin-top: 14px;">
                <label style="display:flex;align-items:center;gap:10px;cursor:pointer;">
                    <input type="checkbox" name="is_confidential" value="1" @checked(old('is_confidential'))>
                    <span>{{ trans('portal.submit.complaint.is_confidential') }}</span>
                </label>
                <div class="portal-subtle">{{ trans('portal.submit.complaint.confidential_hint') }}</div>
            </div>

            <div class="portal-field" style="margin-top: 14px;">
                <label for="attachments">{{ trans('portal.submit.attachments') }}</label>
                <input type="file" id="attachments" name="attachments[]" multiple accept=".pdf,.jpg,.jpeg,.png,.doc,.docx"
                    style="width:100%;border:1px solid var(--portal-border);border-radius:14px;padding:11px 14px;background:#f8fbfd;">
                <div class="portal-subtle">{{ trans('portal.submit.attachments_hint') }}</div>
            </div>

            <div class="portal-actions" style="margin-top: 22px;">
                <button type="submit" class="portal-button">{{ trans('portal.submit.submit_button') }}</button>
                <a class="portal-button portal-button--ghost" href="{{ route('portal.requests') }}">{{ trans('portal.submit.cancel_button') }}</a>
            </div>
        </form>
    </div>
@endsection