{% extends "portal/_layout.html" %}
{% block title %}{{ t('Supplier registration') }}{% endblock %}
{% block content %}
<div class="portal-wide">
<h1>{{ t('Supplier registration') }}</h1>
<p class="muted">{{ t('Register your company as a supplier of') }} {{ nm(co) }}. {{ t('After our review you will receive an email to activate your supplier portal account.') }}</p>
{% if info %}<div class="flash info">{{ icon('alert') }}<span><b>{{ t('We need more information') }}:</b> {{ info }}</span></div>{% endif %}
<form method="post" enctype="multipart/form-data">
  <input type="hidden" name="csrf" value="{{ csrf_token() }}">
  <div style="position:absolute;left:-9999px" aria-hidden="true"><label>Website<input name="website2" tabindex="-1" autocomplete="off"></label></div>
  <div class="card"><h3>{{ t('Company') }}</h3><div class="grid">
    <div class="field wide"><label>{{ t('Company name (English)') }} *</label><input name="company_en" value="{{ reg.company_en or '' }}" required></div>
    <div class="field wide"><label>{{ t('Company name (Arabic)') }}</label><input name="company_ar" dir="rtl" value="{{ reg.company_ar or '' }}"></div>
    <div class="field"><label>{{ t('Commercial registration no.') }} *</label><input name="cr_no" value="{{ reg.cr_no or '' }}" required></div>
    <div class="field"><label>{{ t('VAT registration no.') }} *</label><input name="vat_no" value="{{ reg.vat_no or '' }}" inputmode="numeric" required placeholder="3xxxxxxxxxxxxx3"></div>
    <div class="field"><label>{{ t('What do you supply?') }}</label><input name="category" list="cats" value="{{ reg.category or '' }}" placeholder="{{ t('e.g. Industrial supplies') }}"><datalist id="cats">{% for c in categories %}<option value="{{ c }}">{% endfor %}</datalist></div>
    <div class="field"><label>{{ t('Website') }}</label><input name="website" value="{{ reg.website or '' }}"></div>
    <div class="field wide"><label>{{ t('Address') }}</label><input name="address" value="{{ reg.address or '' }}"></div>
    <div class="field"><label>{{ t('City') }}</label><input name="city" value="{{ reg.city or '' }}"></div>
    <div class="field"><label>{{ t('Country') }}</label><input name="country" value="{{ reg.country or 'Saudi Arabia' }}"></div>
  </div></div>
  <div class="card"><h3>{{ t('Contact') }}</h3><div class="grid">
    <div class="field"><label>{{ t('Contact person') }} *</label><input name="contact_person" value="{{ reg.contact_person or '' }}" required></div>
    <div class="field"><label>{{ t('Email') }} *</label><input type="email" name="email" value="{{ reg.email or '' }}" required><div class="help">{{ t('Your portal sign-in and our emails go to this address.') }}</div></div>
    <div class="field"><label>{{ t('Phone') }} *</label><input name="phone" value="{{ reg.phone or '' }}" required></div>
  </div></div>
  <div class="card"><h3>{{ t('Bank account for payments') }}</h3><div class="grid">
    <div class="field"><label>{{ t('Bank name') }} *</label><input name="bank_name" value="{{ reg.bank_name or '' }}" required></div>
    <div class="field"><label>{{ t('Account name') }} *</label><input name="account_name" value="{{ reg.account_name or '' }}" required><div class="help">{{ t('Must match the company name on the bank letter.') }}</div></div>
    <div class="field wide"><label>IBAN *</label><input name="iban" value="{{ reg.iban or '' }}" required placeholder="SA00 0000 0000 0000 0000 0000" style="font-family:monospace"></div>
    <div class="field"><label>SWIFT / BIC</label><input name="swift" value="{{ reg.swift or '' }}"></div>
    <div class="field"><label>{{ t('Currency') }}</label><input name="currency" value="{{ reg.currency or '' }}" placeholder="SAR"></div>
  </div></div>
  <div class="card"><h3>{{ t('Documents') }}</h3>
    <p class="muted" style="margin-top:0">{{ t('Required') }}: {% for d in required %}<b>{{ t(d) }}</b>{{ ', ' if not loop.last }}{% endfor %}. {{ t('PDF, PNG or JPG, up to 10 MB each.') }}</p>
    {% if docs %}<p>{{ t('Already received') }}: {% for d in docs %}<span class="tag">{{ t(d.doc_type) }}</span> {% endfor %}</p>{% endif %}
    <table class="portal-docs"><thead><tr><th>{{ t('Document') }}</th><th>{{ t('Number') }}</th><th>{{ t('Expiry date') }}</th><th>{{ t('File') }}</th></tr></thead><tbody>
    {% for i in range(1, 7) %}{% set dflt = required[i - 1] if i <= required|length and not docs else 'Other' %}
      <tr><td><select name="doc_type_{{ i }}">{% for d in doc_types %}<option value="{{ d }}" {{ 'selected' if d == dflt }}>{{ t(d) }}</option>{% endfor %}</select></td>
        <td><input name="number_{{ i }}"></td><td><input type="date" name="expiry_{{ i }}"></td>
        <td><input type="file" name="file_{{ i }}" accept=".pdf,.png,.jpg,.jpeg"></td></tr>
    {% endfor %}</tbody></table>
  </div>
  <div class="card">
    <div class="field wide"><label>{{ t('Anything else we should know?') }}</label><textarea name="notes" rows="2">{{ reg.notes or '' }}</textarea></div>
    <div class="field check" style="margin-top:12px"><input type="checkbox" id="decl" name="declaration" value="1" required><label for="decl">{{ t('I confirm that the information and documents are correct and that I am authorised to register this company.') }}</label></div>
  </div>
  <div class="form-actions"><button class="btn">{{ t('Submit registration') if not token else t('Resubmit registration') }}</button></div>
</form>
</div>
{% endblock %}