{% embed "overall_header.html" %}
	{% block header_content %}
		<h1 class="text-slate-50 md:text-2xl text-xl titlespace">{{ lang('ACP_CAT_CONTACTADMIN') }}</h1>
	{% endblock %}
{% endembed %}

<form method="post" id="postform" name="postform" action="{{ S_CONTACT_ACTION }}"{{ S_FORM_ENCTYPE }}>

  {% if S_ERROR %}
	<div class="text-sm text-red-700 bg-red-50 border border-red-300 rounded-lg p-4 dark:text-red-400 dark:bg-red-800/10 dark:border-red-500" role="alert">
		<div class="flex">
			<div class="leading-[0] mt-0.5"><i class="iconify" data-mode="style" data-icon="ph:x-circle" data-width="18" data-height="18" aria-hidden="true"></i></div>
			<div class="ms-4">{{ S_ERROR }}</div>
		</div>
	</div>
	{% endif %}

  {% if CONTACT_INFO %}
	<div class="card mb-4 mt-2">
		<div class="p-4 text-sm">{{ CONTACT_INFO }}</div>
	</div>
	{% endif %}

  <div class="card mt-2">
		<div class="card-title"><h2>{{ lang('ACP_CAT_CONTACTADMIN') }}</h2></div>
		<div class="px-4">
			<div class="divide-y">
		    {% if not S_USER_LOGGED_IN %}
				<dl class="py-4 md:grid md:grid-cols-3 md:gap-5 items-center">
					<dt class="text-sm"><label for="username" class="font-medium leading-6">{{ lang('CONTACT_YOUR_NAME') ~ lang('COLON') }}</label><br><span class="text-secondary">{{ lang('CONTACT_YOUR_NAME_EXPLAIN') }}</span></dt>
					<dd class="text-sm md:col-span-2 max-md:mt-2">
						<input class="inputbox" type="text" name="username" id="username" value="{{ USERNAME }}" size="30">
					</dd>
				</dl>
        <dl class="py-4 md:grid md:grid-cols-3 md:gap-5 items-center">
					<dt class="text-sm"><label for="email" class="font-medium leading-6">{{ lang('CONTACT_YOUR_EMAIL') ~ lang('COLON') }}</label><br><span class="text-secondary">{{ lang('CONTACT_YOUR_EMAIL_EXPLAIN') }}</span></dt>
					<dd class="text-sm md:col-span-2 max-md:mt-2">
						<input class="inputbox" type="text" name="email" id="email" value="{{ EMAIL }}" size="30">
					</dd>
				</dl>
        <dl class="py-4 md:grid md:grid-cols-3 md:gap-5 items-center">
					<dt class="text-sm font-medium leading-6"><label for="email_confirm">{{ lang('CONTACT_YOUR_EMAIL_CONFIRM') ~ lang('COLON') }}</label></dt>
					<dd class="text-sm md:col-span-2 max-md:mt-2">
						<input class="inputbox" type="text" name="email_confirm" id="email_confirm" value="{{ EMAIL_CONFIRM }}" size="30">
					</dd>
				</dl>
		    {% endif %}
		    {% if CONTACT_REASONS %}
        <dl class="py-4 md:grid md:grid-cols-3 md:gap-5 items-center">
					<dt class="text-sm font-medium leading-6"><label for="contact_reason">{{ lang('CONTACT_REASON') ~ lang('COLON') }}</label></dt>
					<dd class="text-sm md:col-span-2 max-md:mt-2">
						<select class="inputbox" name="contact_reason" id="contact_reason">{{ CONTACT_REASONS }}</select>
					</dd>
				</dl>
		    {% else %}
        <dl class="py-4 md:grid md:grid-cols-3 md:gap-5 items-center">
					<dt class="text-sm font-medium leading-6"><label for="contact_subject">{{ lang('SUBJECT') ~ lang('COLON') }}</label></dt>
					<dd class="text-sm md:col-span-2 max-md:mt-2">
						<input class="inputbox" type="text" name="contact_subject" id="contact_subject" value="{{ CONTACT_SUBJECT }}" size="45" maxlength="64">
					</dd>
				</dl>
		    {% endif %}
        <dl class="py-4 md:grid md:grid-cols-3 md:gap-5">
					<dt class="text-sm font-medium leading-6"><label for="message">{{ lang('MESSAGE_BODY') ~ lang('COLON') }}</label></dt>
					<dd class="text-sm md:col-span-2 max-md:mt-2">
						<textarea class="inputbox" name="message" id="message" rows="15" cols="76">{{ CONTACT_MESSAGE }}</textarea>
					</dd>
				</dl>
      </div>
    </div>
  </div>

  {% if S_CONTACT_GDPR %}
  <div class="card p-6 mt-4">
		<h2 class="message-title text-sm mb-2">{{ lang('CONTACT_PRIVACYPOLICY') ~ lang('COLON') }}</h2>
		<div class="flex gap-2">
			<input id="gdpr" class="checkbox-primary" type="checkbox" name="gdpr" value="1" {S_CHECKED_PERMANENT}>
			<div class="text-sm text-secondary">{{ lang('CONTACT_PRIVACYPOLICY_EXPLAIN', PRIVACY_POLICY_URL) }}</div>
		</div>
	</div>
  {% endif %}

  {% if CONTACT_ADMIN_CAPTCHA_TEMPLATE %}
  <div class="card p-6 mt-4 captcha-panel">
  	{% DEFINE CAPTCHA_TAB_INDEX = 8 %}
  	{% INCLUDE ''~ CONTACT_ADMIN_CAPTCHA_TEMPLATE ~'' %}
  </div>
  {% endif %}

  {% if S_ATTACH_BOX %}
  <div class="card p-6 mt-4 captcha-panel">
  	<p class="text-sm text-secondary">{{ lang('ADD_ATTACHMENT_EXPLAIN') }}</p>
    
    <fieldset class="fields2 mt-2 space-y-4" id="attach-panel-basic">
    	<dl>
    		<dt><label class="text-sm font-medium leading-6" for="fileupload">{{ lang('FILENAME') ~ lang('COLON') }}</label></dt>
    		<dd class="text-sm mt-2">
    			<input type="file" name="fileupload" id="fileupload" class="inputbox" />
    		</dd>
    	</dl>
    	<dl>
    		<dt><label class="text-sm font-medium leading-6" for="filecomment">{{ lang('FILE_COMMENT') ~ lang('COLON') }}</label></dt>
    		<dd class="text-sm mt-2">
          <textarea name="filecomment" id="filecomment" rows="1" cols="40" class="inputbox">{{ FILE_COMMENT }}</textarea>
        </dd>
    	</dl>
  	</fieldset>
  </div>
  {% endif %}

  <div class="card my-4 text-center">
  	{{ S_HIDDEN_FIELDS }}
		<button type="submit" name="submit" id="submit" class="btn-primary ripple mx-auto" value="{{ lang('SUBMIT') }}">{{ lang('SUBMIT') }}</button>
		{{ S_FORM_TOKEN }}
	</div>

</form>

{% INCLUDE 'overall_footer.html' %}