{% extends "../../layouts/master.njk" %}
{% import "../../macro/field.njk" as field %}

{% block csslib %}
	{# <link href='/cms-static/admin/assets/plugins/custom/fullcalendar/fullcalendar.bundle.css' rel='stylesheet' type='text/css'/> #}
	{# //- link(href='/cms-static/admin/assets/plugins/custom/datatables/datatables.bundle.css' rel='stylesheet' type='text/css') #}
	<link rel="stylesheet" href="/cms-static/admin/article-editor/css/article-editor.min.css"/>
	<link href='/cms-static/admin/assets/plugins/global/plugins.bundle.css' rel='stylesheet' type='text/css'/>
	<link href='/cms-static/admin/assets/css/style.bundle.css' rel='stylesheet' type='text/css'/>

	<style>
		a.image-preview-remove-btn {
			display: inline-block;
			cursor: pointer;
		}
		a.image-preview-remove-btn i {
			pointer-events: none;
		}
		.inline-row {
			display: flex;
			flex-wrap: wrap;
			box-sizing: border-box;
			gap: 10px;
			align-items: center;
			justify-content: space-around;
		}
		.inline-row div {}
		.inline-row .repeater-delete-btn {
			flex: inherit !important;
		}
	</style>

{% endblock %}

{% block jslib %}
	{# // CKEditor #}
	<script src="https://cdn.ckeditor.com/ckeditor5/41.2.0/classic/ckeditor.js"></script>

	<script src='/cms-static/admin/assets/js/scripts.bundle.js'></script>

	{# // Form Submission Script #}
	<script src='/cms-static/common/js/form-data-json.min.js'></script>
	<script src='/cms-static/common/js/es-form.js'></script>

	<script src="/cms-static/admin/article-editor/article-editor.min.js"></script>
	<script src="/cms-static/admin/article-editor/plugins/textdirection/textdirection.min.js"></script>
	{# Custom js for cms add page #}
	<script src='/cms-static/common/js/cms-content-add.js'></script>
{% endblock %}

{% block customScript %}
	<script>
		ArticleEditor('.article_editor_field', {
			css: '/cms-static/admin/article-editor/css/',
			image: {
				upload: '/admin/upload-article-image'
			},
			plugins: ['textdirection'],
			textdirection: {
				context: true
			}
		})
	</script>
{% endblock %}

{% block content %}
	{% block title %}
		<title>Add {{ pluralToSingular(reqContentType.title) }} - {{browserTitle | upper()}} CMS</title>
	{% endblock %}
	
	<div class="d-flex flex-column flex-column-fluid">
		<div class="app-toolbar py-3 py-lg-6" id="beaver_app_toolbar">
			<div class="app-container container-xxl d-flex flex-stack" id="beaver_app_toolbar_container">
				<div class="page-title d-flex flex-column justify-content-center flex-wrap me-3">
					<h1 class="page-heading d-flex text-dark fw-bold fs-3 flex-column justify-content-center my-0">Add {{ pluralToSingular(reqContentType.title) }}</h1>
					<ul class="breadcrumb breadcrumb-separatorless fw-semibold fs-7 my-0 pt-1">
						<li class="breadcrumb-item text-muted">
							<a class="text-muted" >Content</a>
						</li>
						<li class="breadcrumb-item">
							<span class="bullet bg-gray-400 w-5px h-2px"></span>
						</li>
						<li class="breadcrumb-item text-muted">
							<a class="text-muted text-hover-primary" href="/admin/cms/{{ reqContentType.slug }}">{{ reqContentType.title }}</a>
						</li>
						<li class="breadcrumb-item">
							<span class="bullet bg-gray-400 w-5px h-2px"></span></li>
						<li class="breadcrumb-item text-muted">Add New</li>
					</ul>
				</div>
			</div>
		</div>

		<div id="beaver_app_content" class="app-content flex-column-fluid">
			<div class="app-container container-xxl" id="beaver_app_content_container">
				<form class="form es-form d-flex flex-column flex-lg-row" id="beaver_subscriptions_create_new" action="/admin/cms/{{reqContentType.slug}}/save" data-redirect-url="/admin/cms/{{reqContentType.slug}}" enctype="multipart/form-data" method="post">
					<div class="d-flex flex-column flex-row-fluid gap-7 gap-lg-10">
						<div class="card card-flush py-4">
							<div class="card-header">
								<div class="card-title">
									<h2 class="fw-bold">{{ pluralToSingular(reqContentType.title) }}</h2>
								</div>
								<div class="card-toolbar">
									<button class="btn btn-sm btn-success form-submit-btn" type="submit">
										<span class="label">Save</span>
										<span class="preloader d-none">Saving...</span>
									</button>
								</div>
							</div>
							<div class="card-body pt-0">
								<ul class="nav nav-tabs nav-line-tabs mb-5 fs-6" id="cms-editor-tab-nav">
									{% if has_bilingual_field_groups %}
										{% for brandLanguage in authUser.brand.languages %}
											<li class="nav-item">
												<a class="nav-link {{'active' if loop.index == 1 }}" data-bs-toggle="tab" href="#beaver_tab_pane_{{ brandLanguage.prefix }}">
													{{ brandLanguage.name }}
													<span class="fa-solid fa-circle-exclamation d-none tab-invalid-icon"></span>
												</a>
											</li>
										{% endfor %}
									{% endif %}
									{% if has_common_field_groups %}

										<li class="nav-item">
											<a class="nav-link" data-bs-toggle="tab" href="#beaver_tab_pane_common">
												General
												<span class="fa-solid fa-circle-exclamation d-none tab-invalid-icon"></span>
											</a>
										</li>
									{% endif %}
									{% if reqContentType.has_meta %}

										<li class="nav-item">
											<a class="nav-link" data-bs-toggle="tab" href="#beaver_tab_pane_meta">
												Meta
												<span class="fa-solid fa-circle-exclamation d-none tab-invalid-icon"></span>
											</a>
										</li>
									{% endif %}
								</ul>
								<div class="tab-content tab-content-fields" id="myTabContent">

									<!--Custom fields with localisation starting-->
									{% if has_bilingual_field_groups %}
										{% for brandLanguage in authUser.brand.languages %}
											<div class="tab-pane fade {{ 'active show' if loop.index == 1 }}" role="tabpanel" dir="{{brandLanguage.dir}}" id="beaver_tab_pane_{{ brandLanguage.prefix }}">
												{# //- BEGIN::Fields with localisation #}
												{% for cfg in reqContentType.field_groups %}
													{% if cfg.localisation %}
														<h4 class="badge bg-slate-600 text-white mb-4">{{ cfg.row_label | upper() }}</h4>
														<div class="non-repeat-field-group-section p-4 rounded-lg mb-4">
															{% if cfg.repeater_group == true %}
																<div>
																	<div class="group_repeater" id="beaver_docs_repeater_{{brandLanguage.prefix}}_{{cfg._id}}_{{loop.index}}">

																		{# Hidden Div Start #}
																		<div class="form-repeater-group-item form-repeater-group-{{cfg._id}}-{{brandLanguage.prefix}} {{ 'inline-row' if cfg.inline_fields }} d-none" id="form_repeater_child_{{brandLanguage.prefix}}_{{cfg._id}}-0">
																			{% for cf in cfg.fields %}
																				<div class="d-flex flex-column my-3 fv-row fv-plugins-icon-container">
																					<label class="d-flex align-items-center fs-6 fw-semibold mb-2">
																						<span class={{"required" if cf.validation.required else ""}}>{{cf.field_label}} ({{brandLanguage.prefix}})</span>
																					</label>
																					{% if cf.field_type === 'text' or cf.field_type === 'email' or cf.field_type === 'number' %}
																						<input disabled class="form-control  beaver-cms-form-field" type="{{ cf.field_type }}" placeholder="Enter {{ cf.field_label }}" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}[]]]">
																					{% elif cf.field_type === 'richtext' %}
																						<textarea disabled class="content_wysiwyg beaver-cms-form-field" data-lang="{{brandLanguage.prefix}}" data-dir="{{brandLanguage.dir}}" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}[]]]" id="wysiwyg-cf-{{ brandLanguage.prefix }}-{{ cfg.row_name }}-{{ cf.field_name }}-{{ mathRandom() }}"></textarea>
																					{% elif cf.field_type === 'textarea' %}
																						<textarea disabled class="form-control  beaver-cms-form-field" data-lang="{{brandLanguage.prefix}}" data-dir="{{brandLanguage.dir}}" rows="6" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}[]]]" placeholder="" spellcheck="false"></textarea>
																					{% elif cf.field_type === 'article_editor' %}
																						<textarea class="form-control  article_editor_field beaver-cms-form-field" data-lang="{{brandLanguage.prefix}}" data-dir="{{brandLanguage.dir}}" rows="30" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}[]]]" placeholder="" spellcheck="false"></textarea>
																					{% elif cf.field_type === 'media' %}
																						<span class='media-uploader-field'>
																							<span class="media_preview">
																								<span class="preview-holder"></span>
																								<a class="btn btn-danger btn-icon image-preview-remove-btn d-none my-1">
																									<i class="fa fa-trash" tabindex="-1"></i>
																								</a>
																							</span>
																							<input disabled type="hidden" class="media_url_field beaver-cms-form-field" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}[url][]]]">
																							<input disabled type="hidden" class="media_title_field beaver-cms-form-field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[title][]]]">
																							<input disabled type="hidden" class="media_alt_text_field beaver-cms-form-field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[alt_text][]]]">
																							<input disabled type="hidden" class="media_file_type_field beaver-cms-form-field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[file_type][]]]">
																							<input disabled type="hidden" class="media_link_url_field beaver-cms-form-field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[link_url][]]]">
																							<input disabled type="hidden" class="media_open_link_in_new_tab_field beaver-cms-form-field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[open_link_in_new_tab][]]]">
																							<input disabled type="hidden" class="media_local_drive_field beaver-cms-form-field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[local_drive][]]]">
																							<a class="btn btn-success media-uploader-modal-btn" id="beaver-media-field-{{loop.index}}-{{range(100,10000)|random}}" data-bs-toggle='modal' data-bs-target='#beaver_modal_media_list'>Attach Media</a>
																						</span>
																					{% elif cf.field_type == "date" %}
																						<div class="beaver_daterangepicker">
																							<input disabled type="text" class="form-control  beaver-cms-form-field" data-hastime="false" data-daterange="false" id="beaver_daterangepicker_{{brandLanguage.prefix}}-{{ cfg.row_name }}-{{ cf.field_name }}-{{loop.index}}" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[]]]" placeholder="{{cf.placeholder}}">
																						</div>
																					{% elif cf.field_type == "dropdown" %}
																						{% if cf.multi_select %}
																							<select disabled class="form-select beaver-cms-form-field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[]]][]" {% if cf.multi_select %} data-control="select2" data-close-on-select="false" data-placeholder="Select {{ cf.field_label }}" multiple="multiple" {% endif %}>
																								<option value=''>- Select {{cf.field_label}} -</option>
																								{% for dropdown in cf.options[brandLanguage.prefix] %}
																									<option value="{{dropdown.value}}">{{dropdown.label}}</option>
																								{% endfor %}
																							</select>
																						{% else %}
																							<select disabled class="form-select beaver-cms-form-field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[]]]">
																								<option value=''>- Select {{cf.field_label}} -</option>
																								{% for dropdown in cf.options[brandLanguage.prefix] %}
																									<option value="{{dropdown.value}}">{{dropdown.label}}</option>
																								{% endfor %}
																							</select>
																						{% endif %}
																					{% endif %}
																					{% include './partials/_cms-field-info.njk' %}
																					<div class="fv-plugins-message-container invalid-feedback" id="field-error-{{ brandLanguage.prefix }}_{{ cfg.row_name }}_{{ cf.field_name }}{{ '_0_url' if cf.field_type == 'media' }}"></div>
																				</div>
																			{% endfor %}
																			<div class="repeater-delete-btn text-center my-3">
																				<a class="btn btn-sm btn-light-danger mt-5" onClick="deleteChild(event)" child-id="form-repeater-child-{{brandLanguage.prefix}}_{{cfg._id}}-{{loop.index}}" target-id="beaver_docs_repeater_{{brandLanguage.prefix}}_{{cfg._id}}_{{loop.index}}">
																					<i class="la la-trash-o"></i>Delete</a>
																			</div>
																		</div>
																		{# Hidden Div End #}

																		<div class="form-repeater-group-item form-repeater-group-{{cfg._id}}-{{brandLanguage.prefix}} {{ 'inline-row' if cfg.inline_fields }}" id="form_repeater_child_{{brandLanguage.prefix}}_{{cfg._id}}-{{loop.index}}">
																			{% for cf in cfg.fields %}
																				<div class="d-flex flex-column my-3 fv-row fv-plugins-icon-container">
																					<label class="d-flex align-items-center fs-6 fw-semibold mb-2">
																						<span class={{"required" if cf.validation.required else ""}}>{{cf.field_label}} ({{brandLanguage.prefix}})</span>
																					</label>
																					{% if cf.field_type == 'text' or cf.field_type == 'email' or cf.field_type == 'number' or cf.field_type == 'time' or cf.field_type == 'color' or cf.field_type == 'url' %}
																						<input class="form-control " type="{{ cf.field_type }}" placeholder="Enter {{ cf.field_label }}" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}[]]]">
																					{% elif cf.field_type === 'richtext' %}
																						<textarea class="content_wysiwyg beaver-cms-form-field" data-lang="{{brandLanguage.prefix}}" data-dir="{{brandLanguage.dir}}" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}[]]]" id="wysiwyg-cf-{{ brandLanguage.prefix }}-{{ cfg.row_name }}-{{ cf.field_name }}-{{ mathRandom() }}"></textarea>
																					{% elif cf.field_type === 'textarea' %}
																						<textarea class="form-control " data-lang="{{brandLanguage.prefix}}" data-dir="{{brandLanguage.dir}}" rows="6" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}[]]]" placeholder="" spellcheck="false"></textarea>
																					{% elif cf.field_type === 'article_editor' %}
																						<textarea class="form-control  article_editor_field" data-lang="{{brandLanguage.prefix}}" data-dir="{{brandLanguage.dir}}" rows="30" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}[]]]" placeholder="" spellcheck="false"></textarea>
																					{% elif cf.field_type === 'media' %}
																						<span class='media-uploader-field'>
																							<span class="media_preview">
																								<span class="preview-holder"></span>
																								<a class="btn btn-danger btn-icon image-preview-remove-btn d-none my-1">
																									<i class="fa fa-trash" tabindex="-1"></i>
																								</a>
																							</span>
																							<input type="hidden" class="media_url_field" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}[url][]]]">
																							<input type="hidden" class="media_title_field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[title][]]]">
																							<input type="hidden" class="media_alt_text_field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[alt_text][]]]">
																							<input type="hidden" class="media_file_type_field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[file_type][]]]">
																							<input type="hidden" class="media_link_url_field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[link_url][]]]">
																							<input type="hidden" class="media_open_link_in_new_tab_field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[open_link_in_new_tab][]]]">
																							<input type="hidden" class="media_local_drive_field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[local_drive][]]]">
																							<a class="btn btn-success media-uploader-modal-btn" id="beaver-media-field-{{loop.index}}-{{range(100,10000)|random}}" data-bs-toggle='modal' data-bs-target='#beaver_modal_media_list'>Attach Media</a>
																						</span>
																					{% elif cf.field_type == "date" %}
																						<div class="beaver_daterangepicker">
																							<input type="text" class="form-control " data-hastime="false" data-daterange="false" id="beaver_daterangepicker_{{brandLanguage.prefix}}-{{ cfg.row_name }}-{{ cf.field_name }}-{{loop.index}}" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[]]]" placeholder="{{cf.placeholder}}">
																						</div>
																					{% elif cf.field_type == "dropdown" %}
																						{% if cf.multi_select %}
																							<select class="form-select" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[]]][]" data-control="select2" data-close-on-select="false" data-placeholder="Select {{ cf.field_label }}" multiple="multiple">
																								<option value=''>- Select {{cf.field_label}} -</option>
																								{% for dropdown in cf.options[brandLanguage.prefix] %}
																									<option value="{{dropdown.value}}">{{dropdown.label}}</option>
																								{% endfor %}
																							</select>
																						{% else %}
																							<select class="form-select" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[]]]">
																								<option value=''>- Select {{cf.field_label}} -</option>
																								{% for dropdown in cf.options[brandLanguage.prefix] %}
																									<option value="{{dropdown.value}}">{{dropdown.label}}</option>
																								{% endfor %}
																							</select>
																						{% endif %}
																					{% endif %}
																					{% include './partials/_cms-field-info.njk' %}
																					<div class="fv-plugins-message-container invalid-feedback" id="field-error-{{ brandLanguage.prefix }}_{{ cfg.row_name }}_{{ cf.field_name }}{{ '_0_url' if cf.field_type == 'media' }}"></div>
																				</div>
																			{% endfor %}
																			<div class="repeater-delete-btn text-center my-3">
																				<a class="btn btn-sm btn-light-danger mt-5" onClick="deleteChild(event)" child-id="form-repeater-child-{{brandLanguage.prefix}}_{{cfg._id}}-{{loop.index}}" target-id="beaver_docs_repeater_{{brandLanguage.prefix}}_{{cfg._id}}_{{loop.index}}">
																					<i class="la la-trash-o"></i>Delete</a>
																			</div>
																		</div>
																	</div>

																	<div class="form-group my-3 text-center">
																		<a class="btn btn-light-primary" onClick="cloneChild(event)" target-lang="{{cfg._id}}" target-lang-prefix="{{brandLanguage.prefix}}" target-id="beaver_docs_repeater_{{brandLanguage.prefix}}_{{cfg._id}}_{{loop.index}}" data-repeater-create="">
																			<i class="la la-plus"></i>Add</a>
																	</div>
																</div>
															{% else %}
																<div class="{{ 'inline-row' if cfg.inline_fields }}">
																	{% for cf in cfg.fields %}
																		<div class="d-flex flex-column my-3 fv-row fv-plugins-icon-container">
																			{# // begin::Label #}
																			<label class="d-flex align-items-center fs-6 fw-semibold mb-2">
																				<span class={{"required" if cf.validation.required else ""}}>{{ cf.field_label }} ({{ brandLanguage.prefix }})</span>
																				{# <i class="fas fa-exclamation-circle ms-2 fs-7" data-bs-toggle="tooltip" aria-label="Specify a target name for future usage and reference" data-beaver-initialized="1"></i> #}
																			</label>

																			{# // end::Label #}
																			{% if cf.field_type == 'text' or cf.field_type == 'email' or cf.field_type == 'number' or cf.field_type == 'time' or cf.field_type == 'color' or cf.field_type == 'url' %}
																				<input class="{% if cf.field_type != 'color' %} form-control {% endif %}" type="{{ cf.field_type }}" placeholder="Enter {{ cf.field_label }}" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}]]">
																			{% elif cf.field_type == 'richtext' %}
																				<textarea class="content_wysiwyg beaver-cms-form-field" data-lang="{{brandLanguage.prefix}}" data-dir="{{brandLanguage.dir}}" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}]]" id="wysiwyg-cf-{{ brandLanguage.prefix }}-{{ cfg.row_name }}-{{ cf.field_name }}-{{ mathRandom() }}"></textarea>
																			{% elif cf.field_type == 'textarea' %}
																				<textarea class="form-control" data-lang="{{brandLanguage.prefix}}" data-dir="{{brandLanguage.dir}}" rows="6" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}]]" placeholder="" spellcheck="false"></textarea>
																			{% elif cf.field_type == 'article_editor' %}
																				<textarea class="form-control  article_editor_field" data-lang="{{brandLanguage.prefix}}" data-dir="{{brandLanguage.dir}}" rows="30" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}]]" placeholder="" spellcheck="false"></textarea>
																			{% elif cf.field_type === 'media' %}
																				<span class='media-uploader-field'>
																					<span class="media_preview">
																						<span class="preview-holder"></span>
																						<a class="btn btn-danger btn-icon image-preview-remove-btn d-none my-1">
																							<i class="fa fa-trash" tabindex="-1"></i>
																						</a>
																					</span>
																					<input type="hidden" class="media_url_field" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}[url]]]">
																					<input type="hidden" class="media_title_field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[title]]]">
																					<input type="hidden" class="media_alt_text_field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[alt_text]]]">
																					<input type="hidden" class="media_file_type_field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[file_type]]]">
																					<input type="hidden" class="media_link_url_field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[link_url]]]">
																					<input type="hidden" class="media_open_link_in_new_tab_field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[open_link_in_new_tab]]]">
																					<input type="hidden" class="media_local_drive_field" name="{{brandLanguage.prefix}}[{{cfg.row_name}}[{{cf.field_name}}[local_drive]]]">
																					<a class="btn btn-success media-uploader-modal-btn" id="beaver-media-field-{{ loop.index }}-{{ range(100,10000)|random }}" data-bs-toggle='modal' data-bs-target='#beaver_modal_media_list'>Attach Media</a>
																				</span>
																			{% elif cf.field_type === 'date' %}
																				<div class="beaver_daterangepicker">
																					{# <input class="form-control " type="{{ cf.field_type }}" placeholder="Enter {{ cf.field_label }}" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}]]"> #}
																					<input class="form-control " id="beaver_daterangepicker_{{ brandLanguage.prefix }}-{{ cfg.row_name }}-{{ cf.field_name }}-{{ loop.index }}" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}]]" placeholder="{{ cf.placeholder }}">
																				</div>
																			{% elif cf.field_type === 'dropdown' %}
																				{% if cf.multi_select %}
																					<select class="form-select" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}]][]" {% if cf.multi_select %} data-control="select2" data-close-on-select="false" data-placeholder="Select {{ cf.field_label }}" multiple="multiple" {% endif %}>
																						<option value='' >- Select {{cf.field_label}} -</option>
																						{% for dropdown in cf.options[brandLanguage.prefix] %}
																							<option value="{{ dropdown.value }}">{{ dropdown.label }}</option>
																						{% endfor %}
																					</select>
																				{% else %}
																					<select class="form-select" name="{{ brandLanguage.prefix }}[{{ cfg.row_name }}[{{ cf.field_name }}]]">
																						<option value=''>- Select {{cf.field_label}} -</option>
																						{% for dropdown in cf.options[brandLanguage.prefix] %}
																							<option value="{{ dropdown.value }}">{{ dropdown.label }}</option>
																						{% endfor %}
																					</select>
																				{% endif %}
																			{% endif %}
																			{% include './partials/_cms-field-info.njk' %}
																			<div class="fv-plugins-message-container invalid-feedback" id="field-error-{{ brandLanguage.prefix }}_{{ cfg.row_name }}_{{ cf.field_name }}{{ '_url' if cf.field_type == 'media' }}"></div>
																		</div>
																	{% endfor %}
																</div>
															{% endif %}
														</div>
													{% endif %}
												{% endfor %}
											</div>
										{% endfor %}
									{% endif %}

									{% if has_common_field_groups %}
										<div class="tab-pane fade" role="tabpanel" id="beaver_tab_pane_common">
											{% for cfg in reqContentType.field_groups %}
												{% if cfg.localisation == false %}
													<h4 class="badge bg-slate-600 text-white mb-4">{{cfg.row_label | upper()}}</h4>
													<div class="non-repeat-field-group-section">
														{% if cfg.repeater_group == true %}
															<div class="group_repeater" id="beaver_docs_repeater_{{cfg._id}}_{{loop.index}}">

																{# Hidden Div start #}
																<div class="form-group form-repeater-group-item form-repeater-group-{{cfg._id}}-en {{ 'inline-row' if cfg.inline_fields }} d-none" id="form_repeater_child_{{cfg._id}}-0">
																	{% for cf in cfg.fields %}
																		<div class="d-flex flex-column my-3 fv-row fv-plugins-icon-container">
																			<label class="d-flex align-items-center fs-6 fw-semibold mb-2">
																				<span class={{"required" if cf.validation.required else ""}}>{{cf.field_label}}</span>
																				{# <i class="fas fa-exclamation-circle ms-2 fs-7" data-bs-toggle="tooltip" aria-label="Specify a target name for future usage and reference" data-beaver-initialized="1"></i> #}
																			</label>
																			{% if cf.field_type == 'text' or cf.field_type == 'email' or cf.field_type == 'number' or cf.field_type == 'time' or cf.field_type == 'color' or cf.field_type == 'url' %}
																				<input disabled class="{% if cf.field_type != 'color' %} form-control  {% endif %} beaver-cms-form-field" type="{{ cf.field_type }}" placeholder="Enter {{ cf.field_label }}" name="common[{{ cfg.row_name }}[{{ cf.field_name }}[]]]">
																			{% elif cf.field_type == 'richtext' %}
																				<textarea disabled class="content_wysiwyg beaver-cms-form-field" name="common[{{ cfg.row_name }}[{{ cf.field_name }}[]]]" id="wysiwyg-cf-{{ mathRandom() }}"></textarea>
																			{% elif cf.field_type == 'textarea' %}
																				<textarea disabled class="form-control  beaver-cms-form-field" rows="6" name="common[{{ cfg.row_name }}[{{ cf.field_name }}[]]]" placeholder="" spellcheck="false"></textarea>
																			{% elif cf.field_type == 'article_editor' %}
																				<textarea disabled class="form-control  beaver-cms-form-field article_editor_field" rows="30" name="common[{{ cfg.row_name }}[{{ cf.field_name }}[]]]" placeholder="" spellcheck="false"></textarea>
																			{% elif cf.field_type === 'media' %}
																				<span class='media-uploader-field'>
																					<span class="media_preview">
																						<span class="preview-holder"></span>
																						<a class="btn btn-danger btn-icon image-preview-remove-btn d-none my-1">
																							<i class="fa fa-trash" tabindex="-1"></i>
																						</a>
																					</span>
																					<input disabled type="hidden" class="media_url_field beaver-cms-form-field" name="common[{{ cfg.row_name }}[{{ cf.field_name }}[url][]]]">
																					<input disabled type="hidden" class="media_title_field beaver-cms-form-field" name="common[{{cfg.row_name}}[{{cf.field_name}}[title][]]]">
																					<input disabled type="hidden" class="media_alt_text_field beaver-cms-form-field" name="common[{{cfg.row_name}}[{{cf.field_name}}[alt_text][]]]">
																					<input disabled type="hidden" class="media_file_type_field beaver-cms-form-field" name="common[{{cfg.row_name}}[{{cf.field_name}}[file_type][]]]">
																					<input disabled type="hidden" class="media_link_url_field beaver-cms-form-field" name="common[{{cfg.row_name}}[{{cf.field_name}}[link_url][]]]">
																					<input disabled type="hidden" class="media_open_link_in_new_tab_field beaver-cms-form-field" name="common[{{cfg.row_name}}[{{cf.field_name}}[open_link_in_new_tab][]]]">
																					<input disabled type="hidden" class="media_local_drive_field beaver-cms-form-field" name="common[{{cfg.row_name}}[{{cf.field_name}}[local_drive][]]]">
																					<a class="btn btn-success media-uploader-modal-btn" id="beaver-media-field-{{ loop.index }}-{{ range(100,10000)|random }}" data-bs-toggle='modal' data-bs-target='#beaver_modal_media_list'>Attach Media</a>
																				</span>
																			{% elif cf.field_type === 'date' %}
																				<div class="beaver_daterangepicker">
																					<input disabled class="form-control  beaver-cms-form-field" id="beaver_daterangepicker_{{ cfg.row_name }}_{{ cf.field_name }}_{{ loop.index }}" name="common[{{ cfg.row_name }}[{{ cf.field_name }}[]]]" placeholder="{{ cf.placeholder }}">
																				</div>
																			{% elif cf.field_type === 'dropdown' %}
																				{% if cf.multi_select %}
																					<select disabled class="form-select beaver-cms-form-field" name="common[{{cfg.row_name}}[{{cf.field_name}}[]]][]" {% if cf.multi_select %} data-control="select2" data-close-on-select="false" data-placeholder="Select {{ cf.field_label }}" multiple="multiple" {% endif %}>
																						<option value=''>- Select {{cf.field_label}} -</option>
																						{% for dropdown in cf.options.en %}
																							<option value="{{dropdown.value}}">{{dropdown.label}}</option>
																						{% endfor %}
																					</select>
																				{% else %}
																					<select disabled class="form-select beaver-cms-form-field" name="common[{{cfg.row_name}}[{{cf.field_name}}[]]]">
																						<option value=''>- Select {{cf.field_label}} -</option>
																						{% for dropdown in cf.options.en %}
																							<option value="{{dropdown.value}}">{{dropdown.label}}</option>
																						{% endfor %}
																					</select>
																				{% endif %}
																			{% endif %}
																			{% include './partials/_cms-field-info.njk' %}
																			<div class="fv-plugins-message-container invalid-feedback" id="field-error-common_{{cfg.row_name}}_{{cf.field_name}}{{ '_0_url' if cf.field_type == 'media' }}"></div>
																		</div>
																	{% endfor %}
																	<div class="repeater-delete-btn text-center">
																		<a class="btn btn-sm btn-light-danger mt-3 mt-md-8" onClick="deleteChild(event)" child-id="form-repeater-child-{{ cfg._id }}-{{ loop.index }}" target-id="{{ targetId }}">
																			<i class="la la-trash-o"></i>
																				Delete
																			</a>
																	</div>
																</div>
																{# Hidden Div End #}

																<div class="form-group form-repeater-group-item form-repeater-group-{{cfg._id}}-en {{ 'inline-row' if cfg.inline_fields }}" id="form_repeater_child_{{cfg._id}}-{{loop.index}}">
																	{% for cf in cfg.fields %}
																		<div class="d-flex flex-column my-3 fv-row fv-plugins-icon-container">
																			<label class="d-flex align-items-center fs-6 fw-semibold mb-2">
																				<span class={{"required" if cf.validation.required else ""}}>{{cf.field_label}}</span>
																				{# <i class="fas fa-exclamation-circle ms-2 fs-7" data-bs-toggle="tooltip" aria-label="Specify a target name for future usage and reference" data-beaver-initialized="1"></i> #}
																			</label>
																			{% if cf.field_type == 'text' or cf.field_type == 'email' or cf.field_type == 'number' or cf.field_type == 'time' or cf.field_type == 'color' or cf.field_type == 'url' %}
																				<input class="{% if cf.field_type != 'color' %} form-control  {% endif %}" type="{{ cf.field_type }}" placeholder="Enter {{ cf.field_label }}" name="common[{{ cfg.row_name }}[{{ cf.field_name }}[]]]">
																			{% elif cf.field_type == 'richtext' %}
																				<textarea class="content_wysiwyg beaver-cms-form-field" name="common[{{ cfg.row_name }}[{{ cf.field_name }}[]]]" id="wysiwyg-cf-{{ mathRandom() }}"></textarea>
																			{% elif cf.field_type == 'textarea' %}
																				<textarea class="form-control " rows="6" name="common[{{ cfg.row_name }}[{{ cf.field_name }}[]]]" placeholder="" spellcheck="false"></textarea>
																			{% elif cf.field_type == 'article_editor' %}
																				<textarea class="form-control  article_editor_field" rows="30" name="common[{{ cfg.row_name }}[{{ cf.field_name }}[]]]" placeholder="" spellcheck="false"></textarea>
																			{% elif cf.field_type === 'media' %}
																				<span class='media-uploader-field'>
																					<span class="media_preview">
																						<span class="preview-holder"></span>
																						<a class="btn btn-danger btn-icon image-preview-remove-btn d-none my-1">
																							<i class="fa fa-trash" tabindex="-1"></i>
																						</a>
																					</span>
																					<input type="hidden" class="media_url_field" name="common[{{ cfg.row_name }}[{{ cf.field_name }}[url][]]]">
																					<input type="hidden" class="media_title_field" name="common[{{cfg.row_name}}[{{cf.field_name}}[title][]]]">
																					<input type="hidden" class="media_alt_text_field" name="common[{{cfg.row_name}}[{{cf.field_name}}[alt_text][]]]">
																					<input type="hidden" class="media_file_type_field" name="common[{{cfg.row_name}}[{{cf.field_name}}[file_type][]]]">
																					<input type="hidden" class="media_link_url_field" name="common[{{cfg.row_name}}[{{cf.field_name}}[link_url][]]]">
																					<input type="hidden" class="media_open_link_in_new_tab_field" name="common[{{cfg.row_name}}[{{cf.field_name}}[open_link_in_new_tab][]]]">
																					<input type="hidden" class="media_local_drive_field" name="common[{{cfg.row_name}}[{{cf.field_name}}[local_drive][]]]">
																					<a class="btn btn-success media-uploader-modal-btn" id="beaver-media-field-{{ loop.index }}-{{ range(100,10000)|random }}" data-bs-toggle='modal' data-bs-target='#beaver_modal_media_list'>Attach Media</a>
																				</span>
																			{% elif cf.field_type === 'date' %}
																				<div class="beaver_daterangepicker">
																					<input class="form-control " id="beaver_daterangepicker_{{ cfg.row_name }}_{{ cf.field_name }}_{{ loop.index }}" name="common[{{ cfg.row_name }}[{{ cf.field_name }}[]]]" placeholder="{{ cf.placeholder }}">
																				</div>
																			{% elif cf.field_type === 'dropdown' %}
																				{% if cf.multi_select %}
																					<select class="form-select" name="common[{{cfg.row_name}}[{{cf.field_name}}[]]][]" {% if cf.multi_select %} data-control="select2" data-close-on-select="false" data-placeholder="Select {{ cf.field_label }}" multiple="multiple" {% endif %}>
																						<option value=''>- Select {{cf.field_label}} -</option>
																						{% for dropdown in cf.options.en %}
																							<option value="{{dropdown.value}}">{{dropdown.label}}</option>
																						{% endfor %}
																					</select>
																				{% else %}
																					<select class="form-select beaver-cms-form-field" name="common[{{cfg.row_name}}[{{cf.field_name}}[]]]">
																						<option value=''>- Select {{cf.field_label}} -</option>
																						{% for dropdown in cf.options.en %}
																							<option value="{{dropdown.value}}">{{dropdown.label}}</option>
																						{% endfor %}
																					</select>
																				{% endif %}
																			{% endif %}
																			{% include './partials/_cms-field-info.njk' %}
																			<div class="fv-plugins-message-container invalid-feedback" id="field-error-common_{{cfg.row_name}}_{{cf.field_name}}{{ '_0_url' if cf.field_type == 'media' }}"></div>
																		</div>
																	{% endfor %}
																	<div class="repeater-delete-btn text-center">
																		<a class="btn btn-sm btn-light-danger mt-3 mt-md-8" onClick="deleteChild(event)" child-id="form-repeater-child-{{ cfg._id }}-{{ loop.index }}" target-id="{{ targetId }}">
																			<i class="la la-trash-o"></i>
																				Delete
																			</a>
																	</div>
																</div>
															</div>
															<div class="form-group my-3 text-center">
																<a class="btn btn-light-primary" onClick="cloneChild(event)" target-lang="{{cfg._id}}" target-lang-prefix="en" target-id="beaver_docs_repeater_{{cfg._id}}_{{loop.index}}">
																	<i class="la la-plus"></i>Add</a>
															</div>
														{% else %}
															{# Non repeating fields #}
															<div class="{{ 'inline-row' if cfg.inline_fields }}">
																{% for cf in cfg.fields %}
																	<div class="d-flex flex-column my-3 fv-row fv-plugins-icon-container">
																		<label class="d-flex align-items-center fs-6 fw-semibold mb-2">
																			<span class={{"required" if cf.validation.required else ""}}>{{ cf.field_label }}</span>
																			{# <i class="fas fa-exclamation-circle ms-2 fs-7" data-bs-toggle="tooltip" aria-label="Specify a target name for future usage and reference" data-beaver-initialized="1"></i> #}
																		</label>
																		{% if cf.field_type === 'text' or cf.field_type === 'email' or cf.field_type === 'number' %}
																			<input type="{{ cf.field_type }}" class="form-control " placeholder="Enter {{ cf.field_label }}" name="common[{{ cfg.row_name }}[{{ cf.field_name }}]]">
																		{% elif cf.field_type === 'richtext' %}
																			<textarea class="content_wysiwyg beaver-cms-form-field" name="common[{{ cfg.row_name }}[{{ cf.field_name }}]]" id="wysiwyg-cf-{{ mathRandom() }}"></textarea>
																		{% elif cf.field_type === 'textarea' %}
																			<textarea class="form-control " rows="6" name="common[{{ cfg.row_name }}[{{ cf.field_name }}]]" placeholder="" spellcheck="false"></textarea>
																		{% elif cf.field_type === 'article_editor' %}
																			<textarea class="form-control  article_editor_field" rows="30" name="common[{{ cfg.row_name }}[{{ cf.field_name }}]]" placeholder="" spellcheck="false"></textarea>
																		{% elif cf.field_type == "media" %}
																			<span class='media-uploader-field'>
																				<span class="media_preview">
																					<span class="preview-holder"></span>
																					<a class="btn btn-danger btn-icon image-preview-remove-btn d-none my-1">
																						<i class="fa fa-trash" tabindex="-1"></i>
																					</a>
																				</span>
																				<input type="hidden" class="media_url_field" name="common[{{ cfg.row_name }}[{{ cf.field_name }}[url]]]">
																				<input type="hidden" class="media_title_field" name="common[{{cfg.row_name}}[{{cf.field_name}}[title]]]">
																				<input type="hidden" class="media_alt_text_field" name="common[{{cfg.row_name}}[{{cf.field_name}}[alt_text]]]">
																				<input type="hidden" class="media_file_type_field" name="common[{{cfg.row_name}}[{{cf.field_name}}[file_type]]]">
																				<input type="hidden" class="media_link_url_field" name="common[{{cfg.row_name}}[{{cf.field_name}}[link_url]]]">
																				<input type="hidden" class="media_open_link_in_new_tab_field" name="common[{{cfg.row_name}}[{{cf.field_name}}[open_link_in_new_tab]]]">
																				<input type="hidden" class="media_local_drive_field" name="common[{{cfg.row_name}}[{{cf.field_name}}[local_drive]]]">
																				<a class="btn btn-success media-uploader-modal-btn" id="beaver-media-field-{{ loop.index }}-{{ range(100,10000)|random }}" data-bs-toggle='modal' data-bs-target='#beaver_modal_media_list'>Attach Media</a>
																			</span>

																		{% elif cf.field_type === "date" %}
																			<div class="beaver_daterangepicker">
																				<input type="text" class="form-control " id="beaver_daterangepicker_{{ cfg.row_name }}_{{ cf.field_name }}_{{ loop.index }}" name="common[{{ cfg.row_name }}[{{ cf.field_name }}]]" placeholder="{{ cf.placeholder }}">
																			</div>
																		{% elif cf.field_type === 'radio' %}
																			<div class="row row-cols-1 row-cols-md-3 row-cols-lg-1 row-cols-xl-3 g-9" data-beaver-buttons="true" data-beaver-buttons-target="[data-beaver-button='true']">
																				{% for option in cf.options[brandLanguage.prefix] %}
																					<div class="col d-flex text-start p-6">
																						<span class="form-check form-check-custom form-check-solid form-check-sm align-items-start" data-beaver-button="true">
																							<input class="form-check-input" type="radio" name="common[{{ cfg.row_name }}[{{ cf.field_name }}]]" id="{{ option.value }}-{{ loop.index }}" value="{{ option.value }}" {% if loop.index == 1 %}checked{% endif %}>
																						</span>
																						<span class="ms-5">
																							<label class="form-label" for="{{ option.value }}-{{ loop.index }}">{{ option.label }}</label>
																						</span>
																					</div>
																				{% endfor %}
																			</div>
																		{% elif cf.field_type == 'dropdown' %}
																			{% if cf.multi_select %}
																				<select class="form-select" name="common[{{cfg.row_name}}[{{cf.field_name}}[]]]" {% if cf.multi_select %} data-control="select2" data-close-on-select="false" data-placeholder="Select {{ cf.field_label }}" multiple="multiple" {% endif %}>
																					<option value=''>- Select {{cf.field_label}} -</option>
																					{% for dropdown in cf.options.en %}
																						<option value="{{dropdown.value}}">{{dropdown.label}}</option>
																					{% endfor %}
																				</select>
																			{% else %}
																				<select class="form-select" name="common[{{cfg.row_name}}[{{cf.field_name}}]]">
																					<option value=''>- Select {{cf.field_label}} -</option>
																					{% for dropdown in cf.options.en %}
																						<option value="{{dropdown.value}}">{{dropdown.label}}</option>
																					{% endfor %}
																				</select>
																			{% endif %}
																		{% endif %}
																		{% include './partials/_cms-field-info.njk' %}
																		<div class="fv-plugins-message-container invalid-feedback" id="field-error-common_{{cfg.row_name}}_{{cf.field_name}}{{ '_url' if cf.field_type == 'media' }}"></div>
																	</div>
																{% endfor %}
															</div>
														{% endif %}
													</div>
												{% endif %}
											{% endfor %}
										</div>
									{% endif %}

									{% if reqContentType.has_meta %}
										<div class="tab-pane fade" role="tabpanel" id="beaver_tab_pane_meta">
											<ul class="nav nav-tabs nav-line-tabs mb-5 fs-6">
												{% for brandLanguage in authUser.brand.languages %}
													<li class="nav-item">
														<a class="nav-link {{'active' if loop.index == 1 }}" data-bs-toggle="tab" href="#meta_tab_{{ brandLanguage.prefix }}">{{ brandLanguage.name }}</a>
													</li>
												{% endfor %}
											</ul>
											<div class="tab-content" id="meta-lang-tabs">
												{% for brandLanguage in authUser.brand.languages %}
													<div class="tab-pane fade {{'show active' if loop.index == 1 }}" id="meta_tab_{{ brandLanguage.prefix }}" role="tabpanel">
														<div class="row mt-5 pt-5">
															<div class="col-12 mt-5">
																{% for meta_section in metaFields %}
																	<h3 class="badge badge-light-success">{{ meta_section.name }}</h3>
																	{% for meta_field in meta_section.fields %}
																		<div class="row mb-6">
																			<label class="col-lg-4 col-form-label fw-semibold fs-6">{{ meta_field.label }}</label>
																			<div class="col-lg-8 pt-2">
																				{% if meta_field.type == 'textarea' %}
																					<textarea class="form-control" name="meta[{{ brandLanguage.prefix }}][{{ meta_section.slug }}][{{ meta_field.name }}]" placeholder="{{ meta_field.label }}"></textarea>
																				{% elif meta_field.type == 'media' %}
																					<span class='media-uploader-field'>
																						<span class="media_preview">
																							<span class="preview-holder"></span>
																							<a class="btn btn-danger btn-icon image-preview-remove-btn d-none my-1">
																								<i class="fa fa-trash" tabindex="-1"></i>
																							</a>
																						</span>
																						<input type="hidden" class="media_url_field" name="meta[{{ brandLanguage.prefix }}][{{ meta_section.slug }}][{{ meta_field.name }}][url]">
																						<input type="hidden" class="media_title_field" name="meta[{{ brandLanguage.prefix }}][{{ meta_section.slug }}][{{ meta_field.name }}][title]">
																						<input type="hidden" class="media_alt_text_field" name="meta[{{ brandLanguage.prefix }}][{{ meta_section.slug }}][{{ meta_field.name }}][alt_text]">
																						<input type="hidden" class="media_file_type_field" name="meta[{{ brandLanguage.prefix }}][{{ meta_section.slug }}][{{ meta_field.name }}][file_type]">
																						<input type="hidden" class="media_link_url_field" name="meta[{{ brandLanguage.prefix }}][{{ meta_section.slug }}][{{ meta_field.name }}][link_url]">
																						<input type="hidden" class="media_open_link_in_new_tab_field" name="meta[{{ brandLanguage.prefix }}][{{ meta_section.slug }}][{{ meta_field.name }}][open_link_in_new_tab]">
																						<input type="hidden" class="media_local_drive_field" name="meta[{{ brandLanguage.prefix }}][{{ meta_section.slug }}][{{ meta_field.name }}][local_drive]">
																						<a class="btn btn-success media-uploader-modal-btn" id="beaver-media-field-{{loop.index}}-{{range(100,10000)|random}}" data-bs-toggle='modal' data-bs-target='#beaver_modal_media_list'>Attach Media</a>
																					</span>
																				{% else %}
																					<input type="text" class="form-control" name="meta[{{ brandLanguage.prefix }}][{{ meta_section.slug }}][{{ meta_field.name }}]" placeholder="{{ meta_field.label }}">
																				{% endif %}
																			</div>
																		</div>
																	{% endfor %}
																{% endfor %}
															</div>
														</div>
													</div>
												{% endfor %}
											</div>
										</div>
									{% endif %}

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

					<div class="d-flex flex-column gap-7 gap-lg-10 w-100 w-lg-300px mb-7 ms-lg-10">
						{# {% if reqContentType.has_slug %} #}
							{% include './partials/_content-slug-field.njk' %}
						{# {% endif %} #}

						{% include './partials/_publish.njk' %}

						{% if reqContentType.allowed_type and reqContentType.allowed_type.length %}
							{% include './partials/_attach-content-type.njk' %}
						{% endif %}

						{# {% include './partials/_add-to-home.njk' %} #}

						{% if reqContentType.has_form %}
							{% include "./partials/_attach-form.njk" %}
						{% endif %}

						{% if hasEcommerce and products and products.length %}
							{% include "./partials/_attach-product.njk" %}
						{% endif %}

						{% if reqContentType.single_type == false %}
							{% include './partials/_position.njk' %}
						{% endif %}
					</div>

					{% include './partials/_modal-attach-content.njk' %}

				</form>
			</div>
		</div>
	</div>
{% endblock %}