<!-- page-header start-->
<div class="page-header d-xl-flex d-block">
    @if(title){
        <div class="page-leftheader">
            <h4 class="page-title"><span class="font-weight-normal text-muted ms-2">{{title | translate}}</span></h4>
        </div>
    }
    <div class="page-rightheader ms-md-auto mt-md-1">
        <div class="d-flex align-items-end flex-wrap my-auto end-content breadcrumb-end">
            <div class="d-flex breadcrumb-res">
                <div class="header-datepicker me-3">
                    <div class="input-group">
                        <div class="input-group-text">
                                <i class="feather feather-calendar"></i>
                        </div><span class="form-control input-small pb-0 pt-1" >{{today | custtimezone : data?.setting?.original?.date_format ?? "dd-M-y" : undefined : timezone}}</span>
                    </div>
                </div>
                <div class="header-datepicker picker2 me-3">
                    <div class="input-group">
                        <div class="input-group-text">
                                <i class="feather feather-clock"></i>
                        </div><!-- input-group-text -->
                        <span id="tpBasic"  class="form-control input-small pb-0 pt-1">{{today | custtimezone : undefined : data?.setting?.original?.time_format ?? "h:mm a" : timezone}}</span>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- page-header end -->