@php
use Illuminate\Support\Facades\Crypt;
@endphp
<!-- LAYOUT -->
<!-- TITLE -->
<div class="rpanel-title sticky-top">
    <i class="fa fa-pencil"></i> Aparência: PRAZO
</div>
<!-- /TITLE -->
<!-- CONTENT -->
<div class="r-panel-body">
    <div id="appearanceTimeAction">
        <blockquote>

            <h4 class="card-title">Título:</h4>

            <div class="row m-b-5 font-13">
                <div class="col-sm-6">
                    Cor de fundo total
                </div>
                <div class="col-sm-5">
                    <input type="text" class="colorpicker form-control form-control-sm"
                           id="timeBackgroundColor" name="timeBackgroundColor"
                           value="{{strtolower($record_appearance->timeBackgroundColor)}}"/>
                </div>
            </div>
            <div class="row m-b-5 font-13">
                <div class="col-sm-6">
                    Cor de fundo
                </div>
                <div class="col-sm-5">
                    <input type="text" class="colorpicker form-control form-control-sm"
                           id="timeTitleBackgroundColor" name="timeTitleBackgroundColor"
                           value="{{strtolower($record_appearance->timeTitleBackgroundColor)}}"/>
                </div>
            </div>
            <div class="row m-b-5 font-13">
                <div class="col-sm-6">
                    Cor de texto
                </div>
                <div class="col-sm-5">
                    <input type="text" class="colorpicker form-control form-control-sm"
                           id="timeTitleColor" name="timeTitleColor"
                           value="{{strtolower($record_appearance->timeTitleColor)}}"/>
                </div>
            </div>
        </blockquote>
        <blockquote>

            <h4 class="card-title">Título Secundário:</h4>

            <div class="row m-b-5 font-13">
                <div class="col-sm-6">
                    Validade da proposta
                </div>
                <div class="col-sm-5">
                    <input type="text" class="colorpicker form-control form-control-sm"
                           id="timeTitleValidColor" name="timeTitleValidColor"
                           value="{{strtolower($record_appearance->timeTitleValidColor)}}"/>
                </div>
            </div>
            <div class="row m-b-5 font-13">
                <div class="col-sm-6">
                    Prazo de entrega
                </div>
                <div class="col-sm-5">
                    <input type="text" class="colorpicker form-control form-control-sm"
                           id="timeTitleDeliveryColor" name="timeTitleDeliveryColor"
                           value="{{strtolower($record_appearance->timeTitleDeliveryColor)}}"/>
                </div>
            </div>

        </blockquote>



        <blockquote>
            <div class="row m-b-10 font-13">
                <div class="col-sm-5">
                    <h4 class="card-title ">CSS</h4>
                    <h6 class="card-subtitle text-muted m-b-10">Personalize seu css</h6>
                </div>
            </div>
            <div class="row m-b-10 font-13">

                <div class="col-sm-12">
                <textarea class=" form-control form-control-sm" style="height: 120px !important"
                          id="timeCssCustom" name="timeCssCustom"
                >{{$record_appearance->timeCssCustom}}</textarea>
                </div>
            </div>
        </blockquote>

        <hr>
        <div class="row">
            <div class="col-6">

            </div>
            <div class="col-6 text-right">

                <input type="hidden" name="idAppearanceTime" id="idAppearanceTime" class="appeance-add"
                       value="{{isset($record_appearance->idAppearanceTime)?Crypt::encrypt($record_appearance->idAppearanceTime):null}}">
                <input type="hidden" name="idAppearance" id="idAppearance" class="appeance-add"
                       value="{{isset($id_appearance)?$id_appearance:Crypt::encrypt(null)}}">

                <div class="btn-group m-b-1 m-r-1" role="group" aria-label="Button group with nested dropdown">
                    <!-- EDIT -->
                    <button class="btn btn-secondary font-18 btn-sm right-side-close"
                            id="btnModalSave"
                            data-target="sidebar-right"

                            >
                        <i class="ti-save"></i> Salvar
                    </button>
                    <!-- DELETE -->
                    <button class="right-side-close btn btn-sm btn-secondary font-18"
                            data-target="sidebar-right">
                        <i class="fa fa-times"></i> fechar
                    </button>
                </div>

            </div>
        </div>
    </div>
</div>
<!-- /CONTENT -->
<!-- /LAYOUT -->

<script src="{{ asset('template/plugins/ozi-sidebar-right/sidebar-right.js') }}" type="text/javascript"></script>

<!-- Color Picker Plugin JavaScript -->
<script src="{{ asset('template/plugins/jquery-asColorPicker-master/libs/jquery-asColor.js') }}"></script>
<script src="{{ asset('template/plugins/jquery-asColorPicker-master/libs/jquery-asGradient.js') }}"></script>
<script src="{{ asset('template/plugins/jquery-asColorPicker-master/dist/jquery-asColorPicker.min.js') }}"></script>


<script>

    // Colorpicker
    $(".colorpicker").asColorPicker();

    $('#btnModalSave').click(function () {
        oziLoadData(data = {
            consoleError: 'on',
            ldDestinyId: 'appearanceTime',
            ldCatchGroupId: ['appearanceTimeAction'],
            ldCatchItenName: ['_token'],
            ldUrl: '{{asset("/proposal-appearance-time/edit")}}',
        });


    });

</script>
<script>
    //---| MODAL
    //TRAZ PARA FRENTE O MODAL
    $('.myfile-images-edit').click(function () {
        $('.modal').css('z-index', '1211');
        $('.modal-backdrop-sec').css('display', 'block');
    });
</script>