<div class="accordion accordion-bordered mt-3" id="accordionOtDates">
    <div class="card accordion-item active">
        <h2 class="accordion-header">
            <button type="button" class="accordion-button" data-bs-toggle="collapse" data-bs-target="#accordionOtDatesTip" aria-expanded="false" aria-controls="accordionOtDatesTip">

                <h4> <i class="tf-icon ti-calendar ti-xs ti">Fechas</i> </h4>
            </button>
        </h2>

        <div id="accordionOtDatesTip" class="accordion-collapse collapse show" data-bs-parent="#accordionOtDates">
            <div class="accordion-body mt-2">
                <div class="row">
                    <!-- Date 1-->
                    <div class="col-xs-12 col-md-4 col-lg-4 mb-2">
                        <label for="ot-tiempo-procesamiento" class="form-label"><?= @lang("Produccion.tiempo_procesamiento") ?></label>
                        <input type="text" class="form-control" name="tiempo_procesamiento" placeholder="HH:MM" id="ot-tiempo-procesamiento" data-input disabled>
                    </div>
                    <!-- Date 2-->

                    <div class="col-xs-12 col-md-4 col-lg-4 mb-2">
                        <label for="ot-fecha-entrega" class="form-label"><?= @lang("Produccion.fecha_impresion") ?></label>
                        <input type="text" class="form-control ot-date" placeholder="DD/MM/YYYY" name="fecha_impresion_at" id="ot-fecha-impresion" data-input>

                    </div>
                    <!-- Date 2-->

                    <div class="col-xs-12 col-md-4 col-lg-4 mb-2">
                        <label for="ot-fecha-entrega" class="form-label"><?= @lang("Produccion.fecha_encuadernado") ?></label>
                        <input type="date" class="form-control ot-date" placeholder="DD/MM/YYYY" name="fecha_encuadernado_at" id="ot-fecha-encuadernado" data-input />
                    </div>
                    <!-- Date 4-->

                    <div class="col-xs-12 col-md-4 col-lg-4 mb-2">
                        <label for="ot-fecha-entrega" class="form-label"><?= @lang("Produccion.fecha_entrega_externo") ?></label>
                        <input type="date" class="form-control ot-date" placeholder="DD/MM/YYYY" name="fecha_entrega_externo" id="ot-fecha-entrega-externo" data-input />
                    </div>
                    <!-- Date 5-->
                    <div class="col-xs-12 col-md-4 col-lg-4 mb-2">
                        <div class="row d-flex flex-column">
                            <label for="ot-fecha-entrega" class="form-label"><?= @lang("Produccion.fecha_entrega_real") ?></label>
                            <input type="date" class="form-control ot-date" placeholder="DD/MM/YYYY" name="fecha_entrega_real_at" id="ot-fecha-entrega-real" data-input />
                            <label class="switch switch-danger switch-md mt-1">
                                <input type="checkbox" class="switch-input ot-preview" name="fecha_entrega_warning" />
                                <span class="switch-toggle-slider">
                                    <span class="switch-on">
                                        <i class="ti ti-alert-triangle"></i>
                                    </span>
                                    <span class="switch-off">
                                        <i class="ti ti-x"></i>
                                    </span>
                                </span>
                                <span class="switch-label">Inaplazable</span>
                            </label>
                            <label class="switch switch-md mt-1">
                                <input type="checkbox" class="switch-input ot-preview" name="fecha_entrega_warning_revised" />
                                <span class="switch-toggle-slider">
                                    <span class="switch-on">
                                        <i class="ti ti-check"></i>
                                    </span>
                                    <span class="switch-off">
                                        <i class="ti ti-x"></i>
                                    </span>
                                </span>
                                <span class="switch-label">Revisada</span>
                            </label>
                        </div>

                    </div>
                    <!-- Date 6-->

                    <div class="col-xs-12 col-md-4 col-lg-4 mb-2">
                        <label for="ot-fecha-entrega" class="form-label"><?= @lang("Produccion.fecha_entrega_estimada") ?></label>
                        <input type="date" class="form-control ot-date" placeholder="DD/MM/YYYY" name="fecha_entrega_estimada_at" id="ot-fecha-entrega-estimada" data-input disabled />
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>