<div class="row">
    <div class="col-12">
        <app-header></app-header>

        <div
            class="content"
            id="backgroundStyle"
        >
            <form autocomplete="off"
            [formGroup]="agenteForm"
            (ngSubmit)="guardar()" >
                <div class="row">
                    <div class="col-6">
                      <mat-form-field appearance="fill">
                        <mat-label>Nombre</mat-label>
                        <input matInput formControlName="nombre" required />
                        <mat-error
                            *ngIf="agenteForm.controls['nombre'].invalid"
                            >{{ getErrorNombre() }}</mat-error
                        >
                      </mat-form-field>
                    </div>
                </div>
                <div class="row">
                    <div class="col-12">
                      <mat-form-field appearance="fill">
                        <mat-label>Detalles</mat-label>
                        <input matInput formControlName="detalles" required />
                        <mat-error
                            *ngIf="agenteForm.controls['detalles'].invalid"
                            >{{ getErrorDetalles() }}</mat-error
                        >
                    </mat-form-field>
                    </div>
                </div>
                <div
                id="backgroundStyle"
            >
                <div class="d-flex justify-content-end">
                    <button type="submit" class="btn btn-primary">
                        {{ tipoBoton }}
                    </button>
                </div>
            </div>
            </form>
        </div>
       
    </div>
</div>
