<div class="{{cssClass}}">
	<header class="sheet-header">
		<img
			class="profile-img"
			src="{{item.img}}"
			data-edit="img"
			title="{{item.name}}"
		/>
		<div class="header-fields">
			<h1 class="charname"><input
					name="name"
					type="text"
					value="{{item.name}}"
					placeholder="Name"
				/></h1>
			<div class="flexrow">
				<select
					name="system.skill"
					class="skill-select"
				>
					{{#each @root.config.skillCategories as |skillCategory sckey|}}
				<optgroup label="{{ smarttlk 'SKILLS_CATEGORIES' sckey 'name' }}">
					{{#each (sortedSkills @root.config.skills) as |skill key|}}
						{{#ife skill.category sckey}}
							<option
								value="{{key}}"
								{{#ife key @root.item.system.skill}}
								selected
								{{/ife}}
							>{{ smarttlk 'SKILLS' key 'name' }}</option>
						{{/ife}}
					{{/each}}
				</optgroup>
			{{/each}}
				</select>
				<select
					name="system.level"
					class="skill-select"
					title="{{ localize 'VERMINE.level' }}"
				>
					{{selectOptions @root.config.SkillLevels selected=item.system.level localize=true}}
				</select>
			</div>

		</div>
	</header>
</div>