{{--MODAL ADD HOURS--}}
<div class="modal" id="addHours" tabindex="-1" role="dialog" aria-labelledby="Ajouter du temps">
	<div class="modal-dialog modal-large" role="document">
		<div class="modal-content">
			<div class="m-title">{{ucfirst(trans('app.add_time_tool'))}}</div>
			<div class="m-lib">
				<span id="task_name"></span>{{trans('app.space_separator')}}<span id="task_date"></span>
			</div>

			<form  id="wday_create" action="{{route('wday.create')}}" method="post" class="needs-validation hide-submit m-form"
			      novalidate>
				{{method_field('post')}}
				{{csrf_field()}}

				<input type="hidden" name="task_id" id="task_id" value="">
				<input type="hidden" name="phase_id" id="phase_id" value="">
				<input type="hidden" name="activity_id" id="activity_id" value="">
				<input type="hidden" name="start_p" id="start_p">

				<div class="fx-r fx-wr-y jy-c w-100 pad-h-right-mini m-inside-sub-title bg-clair-moyen">
					<div class="fx-c fx-wr-n jy-b it-c bold">
						{{ Form::label("wd_date", trans('app.realization_upper'), ["class"=>"sty-libelle bold font-12pxw-95 pad-h-right-small"]) }}
					</div>
				</div>

				<div class="fx-r fx-wr-y jy-c it-c pad-h-medium w-100">
					<span id="date_selector" class="fx-r fx-wr-n jy-fs pad-h-small">
					</span>
					<div class="fx-c fx-wr-y jy-b pos-rel-3 w-100"> 
						<div id="date_big" class="fx-r fx-wr-y jy-c h-0 show-warning-small pos-rel-m1 pad-h-large pad-v-bottom-medium">{{ucfirst(trans('app.date_too_big'))}}</div>
						<div id="date_small" class="fx-r fx-wr-y jy-c h-0 show-warning-small pos-rel-m1 pad-h-large pad-v-bottom-medium">{{ucfirst(trans('app.date_too_small'))}}</div>
						<div id="invalid_date" class="fx-r fx-wr-y jy-c h-0 show-warning-small pos-rel-m1 pad-h-large pad-v-bottom-medium">{{ucfirst(trans('app.invalid_date'))}}</div>
						<div id="date_no_sync" class="fx-r fx-wr-y jy-c h-0 show-warning-small pos-rel-m1 pad-h-large pad-v-bottom-medium">{{ucfirst(trans('app.date_no_sync'))}}</div>
					</div>					
				</div>

				<div class="config-separator ln-b-solid-small w-100"></div>
				<div class="fx-r fx-wr-y jy-c w-100 pad-h-right-mini m-inside-sub-title bg-clair-moyen">
					<div class="fx-c fx-wr-n jy-b it-c bold">
						{{strtoupper(trans('app.details_upper'))}}
					</div>
				</div>
				<div class="fx-r fx-wr-y jy-e pad-h-medium w-100">
					<div class="fx-c fx-wr-n it-c fx-shrink-1 fx-basis-50 pad-all-small">
						<div class="form-label">{{ucfirst(trans('app.activity'))}}</div>
						<div class=" text-center wrap-no no-bold" id="task_activity_name"></div>
					</div>

					<div class="fx-c fx-wr-n it-c fx-shrink-1 fx-basis-50 pad-all-small">
						<div class="form-label">{{ucfirst(trans('app.manager'))}}</div>
						<div class=" text-center wrap-no no-bold" id="task_activity_cpi_name"></div>
					</div>
				</div>

				<div class="fx-r fx-wr-y jy-e pad-h-medium w-100">
					<div class="fx-c fx-wr-n it-c fx-shrink-1 fx-basis-50 pad-all-small">
						<div class="form-label">{{ucfirst(trans('app.attached_phase'))}}</div>
						<div class=" text-center wrap-no no-bold" id="task_phase_name"></div>
					</div>
					<div class="fx-c fx-wr-n it-c fx-shrink-1 fx-basis-50 pad-all-small">
						<div class="form-label">{{ucfirst(trans('app.task_type'))}}</div>
						<div class=" text-center wrap-no no-bold" id="task_type"></div>
					</div>
				</div>

				<div class="config-separator ln-b-solid-small w-100"></div>
				<div class="fx-r fx-wr-y jy-e pad-h-medium w-100 bg-clair-fort" id="is_description">
					<div class="fx-c fx-wr-n it-c fx-shrink-1 fx-basis-33 pad-all-small">
							<div class="form-label">{{ucfirst(trans('app.task_description'))}}</div>
							<div class=" text-center wrap-yes no-bold sty-description" id="task_description"></div>
					</div>
				</div>

				<div class="fx-r fx-wr-y jy-c w-100 pad-h-right-mini m-inside-sub-title bg-clair-moyen">
					<div class="fx-c fx-wr-n jy-b it-c bold">
						{{strtoupper(trans('app.add'))}}{{ucfirst(trans('app.slash_separator'))}}{{strtoupper(trans('app.remove'))}}
					</div>
				</div>

				<div class="fx-r fx-wr-y pad-h-medium pad-v-small jy-c it-c w-100">

					<div class="fx-c fx-wr-n jy-c it-c">
						<div class="fx-r fx-wr-y jy-e pad-h-medium pad-v-small" id="hoursBtns">
							<div class="fx-r fx-wr-y jy-e pad-v-small pad-h-only-small">
								<button type="button" value="0.0625" tabindex="10"
								        class="m-btn-hours m-btn-hours-add"
								        data-toggle="tooltip"
								        data-placement="bottom"
								        title="30 min (0,0625 {{trans('app.day')}})">+0,5 {{trans('app.hour_short')}}
								</button>
							</div>
							<div class="fx-r fx-wr-y jy-e pad-v-small pad-h-only-small">
								<button type="button" value="0.125" tabindex="11"
								        class="m-btn-hours m-btn-hours-add"
								        data-toggle="tooltip"
								        data-placement="bottom"
								        title="1 {{trans('app.hour_short')}} (0,125 {{trans('app.day')}})">+1 {{trans('app.hour_short')}}
								</button>
							</div>
							<div class="fx-r fx-wr-y jy-e pad-v-small pad-h-only-small">
								<button type="button" value="0.25" tabindex="12"
								        class="m-btn-hours m-btn-hours-add"
								        data-toggle="tooltip"
								        data-placement="bottom"
								        title="2 {{trans('app.hour_short')}} (0,25 {{trans('app.day')}})">+2 {{trans('app.hour_short')}}
								</button>
							</div>
							<div class="fx-r fx-wr-y jy-e pad-v-small pad-h-only-small">
								<button type="button" value="0.5" tabindex="13"
								        class="m-btn-hours m-btn-hours-add"
								        data-toggle="tooltip"
								        data-placement="bottom"
								        title="4 {{trans('app.hour_short')}} (0,5 {{trans('app.day')}})">+4 {{trans('app.hour_short')}}
								</button>
							</div>
							<div class="fx-r fx-wr-y jy-e pad-v-small pad-h-only-small">
								<button type="button" value="1" tabindex="14"
								        class="m-btn-hours m-btn-hours-add"
								        data-toggle="tooltip"
								        data-placement="bottom"
								        title="8 {{trans('app.hour_short')}} (1 {{trans('app.day')}})">+8 {{trans('app.hour_short')}}
								</button>
							</div>
						</div>
					</div>
				</div>

				<div class="fx-r fx-wr-y pad-h-medium pad-v-small jy-c it-c  w-100">
					
					<div class="fx-c fx-wr-n jy-c it-c">
						<div class="fx-r fx-wr-y jy-e pad-v-small pad-h-only-small" id="hoursBtns">
							<div class="fx-r fx-wr-y jy-e pad-v-small pad-h-only-small">
								<button type="button" value="-0.0625" tabindex="20"
								        class="m-btn-hours m-btn-hours-doff"
								        data-toggle="tooltip"
								        data-placement="bottom"
								        title="-30 min (-0,0625 {{trans('app.day')}})">-0,5 {{trans('app.hour_short')}}
								</button>
							</div>
							<div class="fx-r fx-wr-y jy-e pad-v-small pad-h-only-small">
								<button type="button" value="-0.125" tabindex="21"
								        class="m-btn-hours m-btn-hours-doff"
								        data-toggle="tooltip"
								        data-placement="bottom"
								        title="-1 {{trans('app.hour_short')}} (-0,125 {{trans('app.day')}})">-1 {{trans('app.hour_short')}}
								</button>
							</div>
							<div class="fx-r fx-wr-y jy-e pad-v-small pad-h-only-small">
								<button type="button" value="-0.25" tabindex="22"
								        class="m-btn-hours m-btn-hours-doff"
								        data-toggle="tooltip"
								        data-placement="bottom"
								        title="-2 {{trans('app.hour_short')}} (-0,25 {{trans('app.day')}})">-2 {{trans('app.hour_short')}}
								</button>
							</div>
							<div class="fx-r fx-wr-y jy-e pad-v-small pad-h-only-small">
								<button type="button" value="-0.5" tabindex="23"
								        class="m-btn-hours m-btn-hours-doff"
								        data-toggle="tooltip"
								        data-placement="bottom"
								        title="-4 {{trans('app.hour_short')}} (-0,5 {{trans('app.day')}})">-4 {{trans('app.hour_short')}}
								</button>
							</div>
							<div class="fx-r fx-wr-y jy-e pad-v-small pad-h-only-small">
								<button type="button" value="-1" tabindex="24"
								        class="m-btn-hours m-btn-hours-doff"
								        data-toggle="tooltip"
								        data-placement="bottom"
								        title="-8 {{trans('app.hour_short')}} (-1 {{trans('app.day')}})">-8 {{trans('app.hour_short')}}
								</button>
							</div>
						</div>
					</div>
				</div>

				<div class="fx-r fx-wr-y jy-c it-c pad-h-medium pad-v-top-small w-100">
					<div class="fx-r pad-h-small pad-v-top-small it-c" id="hoursBtns">
						<input type="number" id="wd_days" name="wd_days"
						       class="form-control readonly-input font-18px border-no text-right" count="0" value="0"
						       step="any" ex_value="0" required='required'
						       disabled>
						<label for="wd_days" class="readonly-label pad-h-right-medium"><span class="bold">{{ucfirst(trans('app.days'))}}</span></label>
					</div>
					<div class="fx-r pad-h-small pad-v-top-small it-c" id="hoursBtns">
						<input type="number" id="hours" name="hours"
						       class="form-control readonly-input font-18px border-no text-right opa-5 italic" count="0" value="0"
						       step="any" ex_value="0" required='required'
						       disabled>
						<label for="hours" class="readonly-label pad-h-right-medium opa-5">{{ucfirst(trans('app.hours'))}}</label>
					</div>
					<div class="fx-r pad-h-small pad-v-top-small it-c" id="delhoursBtn">
						<button type="button" value="0" class="m-btn-hours-reset" tabindex="30"
						        data-toggle="tooltip"
						        data-placement="bottom"
						        title="{{ucfirst(trans('app.initialize'))}}"><i class="fas fa-sync-alt"></i></button>
					</div>
				</div>

				<div class="fx-r fx-wr-y jy-e it-c w-100" id="is_history">

					<div class="config-separator ln-b-solid-small w-100"></div>
					<div class="fx-r fx-wr-y jy-c w-100 pad-h-right-mini m-inside-sub-title bg-clair-moyen marg-v-bottom-none">
						<div class="fx-c fx-wr-n jy-b it-c bold">
							{{strtoupper(trans('app.tsk_history_hours'))}}
						</div>
					</div>

					<div class="table-responsive h-max-rem-10">
						<table class="table sortable table-history @if (session()->get('display_tables') == config('constants.display_tables_striped'))
												table-striped
											@endif">
							<thead>
							<tr>
								<th class="font-10px text-right tiny-cell">{{ucfirst(trans('app.realized'))}}</th>
								<th data-defaultsort="asc" class="font-10px text-center tiny-cell">{{ucfirst(trans('app.date'))}}</th>
								<th class="font-10px">{{ucfirst(trans('app.description'))}}</th>
								<th class="font-10px text-center tiny-cell">TRI</th>
							</tr>
							</thead>
							<tbody id="wdays_table">
							</tbody>
						</table>
					</div>
				</div>

				<div class="config-separator ln-b-solid-small w-100"></div>
				<div class="fx-r fx-wr-y jy-c w-100 pad-h-right-mini m-inside-sub-title bg-clair-moyen">
					<div class="fx-c fx-wr-n jy-b it-c bold">
						{{strtoupper(trans('app.description'))}}
					</div>
				</div>

				<div class="fx-r fx-wr-y jy-e pad-h-medium pad-v-top-small pad-v-bottom-medium w-100">
					<textarea class="form-control m-area-input" name="wd_description"
							id="wd_description" value="" rows="3" tabindex="40"></textarea>
				</div>

				<div class="sty-ids" id="task_id"></div>
				<div class="m-bottom">
					<button class="m-btn-h" tabindex="110"
					        data-dismiss="modal"
					        data-toggle="tooltip"
					        data-placement="bottom"
					        title="{{ucfirst(trans('app.back'))}}">
						<i class="far fa-times-circle"></i>
					</button>
					<button  class="m-btn-h" tabindex="100"
					        data-toggle="tooltip"
					        data-placement="bottom"
					        title="{{ucfirst(trans('app.ok'))}}">
						<i class="far fa-check-circle"></i>
					</button>
				</div>

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