<div class="form pm-page">
	<div class="form__header">
		<h1 class="form__title">Personal messages</h1>
		<a href="/" class="form__btn icon-at-left"><span class="far fa-home"></span>Home</a>
	</div>
	<ul class="form__row form__row--without-label pm__links">
		<li>[inbox]Inbox[/inbox]</li>
		<li>[outbox]Sent[/outbox]</li>
		<li>[new_pm]Compose[/new_pm]</li>
	</ul>
	<div class="pm__status">
		<div>Your message folders are filled to:</div>
		{pm-progress-bar}
		{proc-pm-limit}% of your limit ({pm-limit} messages)
	</div>
	[pmlist]
	<div class="form__header"><h2 class="form__title">Message list</h2></div>	 
	<div class="table-responsive">{pmlist}</div>
	[/pmlist]
	[readpm]
	<div class="form__header"><h2 class="form__title">Your messages</h2></div>	
	<div class="pm-item d-flex">
		<div class="pm-item__img img-fit-cover"><img src="{foto}" alt="{login}"/></div>
		<div class="pm-item__description stretch-free-width">
			<div class="pm-item__meta d-flex jc-flex-start">
				<span>{author}</span><span>{group-name}</span><span>{date}</span>
			</div>
			<div class="pm-item__text clearfix">{text}</div>
			<div class="pm-item__meta d-flex jc-flex-start">
				<span>[reply]Reply[/reply]</span><span>[ignore]Ignore[/ignore]</span><span>[complaint]Report[/complaint]</span><span>[del]Delete[/del]</span>
			</div>
		</div>
	</div>
	[/readpm]
	[newpm]
	<div class="form__header"><h2 class="form__title">New message</h2></div>
	<div class="form__row">
		<div class="form__caption">
			<label class="form__label form__label--important">To:</label>
		</div>
		<div class="form__content">
			<input class="form__input" type="text" name="name" placeholder="Recipient" value="{author}" required />
		</div>
	</div>
	<div class="form__row">
		<div class="form__caption">
			<label class="form__label">Subject:</label>
		</div>
		<div class="form__content">
			<input class="form__input" type="text" name="subj" placeholder="Subject" value="{subj}" />
		</div>
	</div>
	<div class="form__row">
		<div class="form__caption form__caption--above">
			<label class="form__label form__label--important">Message:</label>
		</div>
		<div class="form__content">{editor}</div>
	</div>
	<div class="form__row form__row--without-label">
		<div class="form__content checkbox">
			<label for="outboxcopy">
				<input type="checkbox" id="outboxcopy" name="outboxcopy" value="1" checked /> 
				Save a copy in “Sent”
			</label>
		</div>
	</div>
	[question]
	<div class="form__row form__row--protect">
		<div class="form__caption">
			<label class="form__label form__label--important" for="question_answer">{question}</label>
		</div>
		<div class="form__content">
			<input class="form__input" type="text" name="question_answer" id="question_answer" placeholder="Enter the answer" required />
		</div>
	</div>
	[/question]
	[sec_code]
	<div class="form__row form__row--protect">
		<div class="form__caption">
			<label class="form__label form__label--important" for="sec_code">Enter the code from the image:</label>
		</div>
		<div class="form__content form__content--sec-code">
			<input class="form__input" type="text" name="sec_code" id="sec_code" placeholder="Enter the code" maxlength="45" required />
			{sec_code}
		</div>
	</div>
	[/sec_code]
	[recaptcha]
	<div class="form__row form__row--protect">
		<div class="form__caption">
			<label class="form__label form__label--important" for="">Spam protection</label>
		</div>
		<div class="form__content form__content--sec-code">
			{recaptcha}
		</div>
	</div>
	[/recaptcha]
	<div class="form__row form__row--without-label">
		<button class="form__btn form__btn--primary" type="submit" name="add">Send</button>
		<button class="form__btn form__btn--secondary" type="button" onclick="dlePMPreview()">Preview</button>
	</div>
	[/newpm]
</div>	
	