@component('mail::message')
<style type="text/css">
	.header a {
		font-size: 36px !important;
		color: #345f81 !important;
		text-transform: uppercase !important;
		font-weight: 800 !important;
	}
</style>
@if($status == 1)
<div style="border-bottom: 1px solid #ddd; font-size: 20px;padding-bottom: 10px;color: #345f81;font-weight: 600;">
	Holiday Request has been approved!
</div>

<div style="margin: 1rem 0 2rem;color:#fff;background-color: #ff9800;padding: 10px;">
	Congrats! Your all set. May your holidays be full of warmth and cheer.
</div>
@elseif($status == 2)
<div style="border-bottom: 1px solid #ddd; font-size: 20px;padding-bottom: 10px;color: #345f81;font-weight: 600;">
	Holiday Request has been rejected!
</div>

<div style="margin: 1rem 0 2rem;color:#fff;background-color: #ff9800;padding: 10px;">
	Please contact HR department for clarifications regarding this matter.
</div>
@else
<div style="border-bottom: 1px solid #ddd; font-size: 20px;padding-bottom: 10px;color: #345f81;font-weight: 600;">
	Your holiday request status has been set back to pending!
</div>

<div style="margin: 1rem 0 2rem;color:#fff;background-color: #ff9800;padding: 10px;">
	If you wish to know the current status of this request, please contact HR department.
</div>
@endif

<div style="padding-bottom: 2rem;border-bottom: 1px solid #ddd; margin-bottom: 15px;">
	<p style="color:#000;margin-bottom: 5px;"><b>Details:</p>
	<p style="color:#000;margin-bottom: 5px;"><b>Start date:</b> {{ $startDate }}</p>
	<p style="color:#000;margin-bottom: 5px;"><b>End date:</b> {{ $endDate }}</p>
	<p style="color:#000;margin-bottom: 5px;"><b>Reason:</p>
	<p style="color:#000;margin-bottom: 5px;"><b>{{ $reason }}</p>
</div>

<div style="margin-bottom: 2rem;color: #000;font-size: 14px;">
	For urgent concerns, please contact HR department.
</div>

<div style="color:#000;">
	Best Regards,<br>
	{{ config('app.name') }} Team
</div>
@endcomponent