@php($routePrefix = $routePrefix ?? 'configuration.branding')
@php($defaultColors = \App\Helpers\Helper::branding())
<div class="col-12">
    <div class="project-box">
        <div class="row">
            <div class="col-md-12">
                {!! html()->form('POST', route($routePrefix.'.site-colors.save'))->open() !!}
                @php(
                    $fields = collect([
                        ['label'=>'Header','name'=>'header_color','value'=>($data[0]->header_color ??  $defaultColors['header_color'] ?? '#FFFFFF')],
                        ['label'=>'Footer','name'=>'footer_color','value'=>($data[0]->footer_color ??  $defaultColors['footer_color'] ?? '#F2F2F5')],
                        ['label'=>'Menu','name'=>'menu_color','value'=>($data[0]->menu_color ??  $defaultColors['menu_color'] ?? '#FFFFFF')],
                        ['label'=>'Menu Active','name'=>'menu_active_color','value'=>($data[0]->menu_active_color ??  $defaultColors['menu_active_color'] ?? '')],
                        ['label'=>'Background','name'=>'background_color','value'=>($data[0]->background_color ??  $defaultColors['background_color'] ?? '#F7F7FA')],
                        ['label'=>'Primary Button','name'=>'primary_button_color','value'=>($data[0]->primary_button_color ??  $defaultColors['primary_button_color'] ?? '#16C4C0')],
                        ['label'=>'Primary Button Hover','name'=>'primary_button_hover_color','value'=>($data[0]->primary_button_hover_color ?? $defaultColors['primary_button_hover_color'] ?? '#9D9DFC')],
                        ['label'=>'Secondary Button','name'=>'secondary_button_color','value'=>($data[0]->secondary_button_color ?? $defaultColors['secondary_button_color'] ?? '#5D5D5D')],
                        ['label'=>'Secondary Button Hover','name'=>'secondary_button_hover_color','value'=>($data[0]->secondary_button_hover_color ?? $defaultColors['secondary_button_hover_color'] ?? '#9D9DFC')],
                        ['label'=>'Nav Active','name'=>'nav_active_color','value'=>($data[0]->nav_active_color ?? $defaultColors['nav_active_color'] ?? '#ACF5F2')],
                        ['label'=>'Table Header','name'=>'table_header_color','value'=>($data[0]->table_header_color ?? $defaultColors['table_header_color'] ?? '#E8E8E8')],
                        ['label'=>'Chat Header','name'=>'chat_panel_header_color','value'=>($data[0]->chat_panel_header_color ?? $defaultColors['chat_panel_header_color'] ?? '#EEF6F6')],
                        ['label'=>'Chat Body','name'=>'chat_panel_body_color','value'=>($data[0]->chat_panel_body_color ?? $defaultColors['chat_panel_body_color'] ?? '#FFFFFF')],
                        ['label'=>'Chat Footer','name'=>'chat_panel_footer_color','value'=>($data[0]->chat_panel_footer_color ?? $defaultColors['chat_panel_footer_color'] ?? '#EEF6F6')],
                    ]))

                @foreach ($fields->chunk(4) as $row)
                    <div class="row mb-3">
                        @foreach ($row as $field)
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>{{ $field['label'] }}</label>
                                    <input
                                        type="color"
                                        name="{{ $field['name'] }}"
                                        value="{{ $field['value'] }}"
                                        class="form-control form-control-color site-color-picker"
                                        data-field="{{ $field['name'] }}"
                                        inputmode="text"
                                        pattern="#?[0-9a-fA-F]{6}">
                                </div>
                            </div>
                        @endforeach
                    </div>
                @endforeach

                <button type="submit" class="{{ \Config::get('view.buttons.primary') }} mt-3" id="site-colors-save-btn" title="Change the color from color picker to save" data-toggle="tooltip">
                    <i class="{{ \Config::get('settings.icon_save', 'mdi mdi-content-save') }}"></i> Save
                </button>
                {!! html()->form()->close() !!}
            </div>
        </div>
    </div>
</div>
@push('page_script')
<script src="{{ asset('assets/js/site-css.js') }}"></script>
@endpush