<kt-portlet>
	<kt-portlet-header [title]="titulo" [class]="'kt-portlet__head--lg'">
		<div ktPortletTools>
			<button class="btn btn-primary kt-margin-r-10" (click)="irAnterior()" [disabled]="isLoading">
				<i class="la la-angle-left"></i>
				<span class="kt-hidden-mobile ml-2">Anterior</span>
			</button>
			<button class="btn btn-primary kt-margin-r-10" (click)="irHoy()" [disabled]="isLoading">
				<i class="la la-minus"></i>
				<span class="kt-hidden-mobile ml-2">Hoy</span>
			</button>
			<button class="btn btn-primary kt-margin-r-10" (click)="irSiguiente()" [disabled]="isLoading">
				<span class="kt-hidden-mobile mr-2">Siguiente</span>
				<i class="la la-angle-right"></i>
			</button>
		</div>
	</kt-portlet-header>

	<kt-portlet-body>

		<div class="div-info-date mb-3">
			<div class="div-info-span">
				<span>{{ viewDate | date:'dd MMMM yyyy':'':'es-MX' | uppercase }}</span>
			</div>
		</div>

		<kt-agenda-medica [serviciosRaw]="serviciosRaw" [isLoading]="isLoading"></kt-agenda-medica>

	</kt-portlet-body>
</kt-portlet>
