@if (@isset($widgetContent))
    <div class="sortable-item accordion-item allowPrimary" data-code="{{ $widgetContent->ui_card_number }}">
        <div class="accordion-header">
            <div class="section-name"> {{ $widgetContent->widget?->widget_name }}
                <div class="collapsed d-flex">
                    <div class="form-check form-switch me-2">
                        <input class="form-check-input status-change"
                            data-action="{{ route('admin.pages.widget.status.change', $widgetContent->id) }}"
                            {{ $widgetContent->status == 1 ? 'checked' : '' }} type="checkbox" role="switch"
                            id="{{ $widgetContent->id }}">
                        <label class="form-check-label" for="{{ $widgetContent->id }}"> </label>
                    </div>

                    <div class="collapsed-action-btn edit-action action-icon me-2">
                        <i class="bi bi-pencil-square"></i>
                    </div>
                    <div class="action-icon delete-action" data-id="{{ $widgetContent->id }}">
                        <i class="bi bi-trash"></i>
                    </div>

                </div>
            </div>
        </div>
        <div class="accordion-collapse collapse">
            <div class="accordion-body">

                @php
                    $widgetContents = $widgetContent->getTranslation('widget_content', $lang);
                @endphp
                <form enctype="multipart/form-data" class="form" data-action="{{ route('admin.pages.widget.save') }}"
                    method="POST">
                    @csrf

                    <input type="hidden" name="ui_card_number" value="{{ $widgetContent->ui_card_number }}">
                    <input type="hidden" name="page_id" value="{{ $widgetContent->page_id }}">
                    <input type="hidden" name="widget_slug" class="widget-slug"
                        value="{{ $widgetContent->widget_slug }}">

                    <div class="row">
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label>{{ translate('Main Title') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('Contact Us') }}" name="content[0][main_title]"
                                    value="{{ isset($widgetContents['main_title']) ? $widgetContents['main_title'] : '' }}">
                            </div>
                        </div>
                        <div class="card-header mb-4 mt-4">{{ translate('Left Side') }}</div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label>{{ translate('Contact Form Title') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('leave your Message:') }}"
                                    name="content[0][contact_f_title]"
                                    value="{{ isset($widgetContents['contact_f_title']) ? $widgetContents['contact_f_title'] : '' }}">
                            </div>
                        </div>
                        <div class="card-header mb-4 mt-4">{{ translate('Right Side') }}</div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label>{{ translate('Address Title') }}</label>
                                <input type="text" class="username-input" placeholder="{{ translate('Address') }}"
                                    name="content[0][addr_title]"
                                    value="{{ isset($widgetContents['addr_title]"']) ? $widgetContents['addr_title]"'] : '' }}">
                            </div>
                        </div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label>{{ translate('Office Location') }}</label>
                                <textarea name="content[0][office_location]">{{ $widgetContents['office_location'] ?? '' }}</textarea>
                            </div>
                        </div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label> {{ translate('Phone Number One') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('1-877-987-6401') }}" name="content[0][phone_one]"
                                    value="{{ isset($widgetContents['phone_one']) ? $widgetContents['phone_one'] : '' }}">
                            </div>
                        </div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label> {{ translate('Phone Number Two') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('1-687-678-5555') }}" name="content[0][phone_two]"
                                    value="{{ isset($widgetContents['phone_two']) ? $widgetContents['phone_two'] : '' }}">
                            </div>
                        </div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label> {{ translate('Email One') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('info@gmail.com') }}" name="content[0][email_one]"
                                    value="{{ isset($widgetContents['email_one']) ? $widgetContents['email_one'] : '' }}">
                            </div>
                        </div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label> {{ translate('Email Two') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('info@email.com') }}" name="content[0][email_two]"
                                    value="{{ isset($widgetContents['email_two']) ? $widgetContents['email_two'] : '' }}">
                            </div>
                        </div>
                        <div class="col-sm-12 mb-2">
                            <div class="form-inner">
                                <label> {{ translate('Support Title') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('Support Time') }}" name="content[0][support_title]"
                                    value="{{ isset($widgetContents['support_title']) ? $widgetContents['support_title'] : '' }}">

                            </div>
                        </div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label> {{ translate('Support Time') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('9.00 Am - 19.00 Pm') }}"
                                    name="content[0][support_time]"
                                    value="{{ isset($widgetContents['support_time']) ? $widgetContents['support_time'] : '' }}">
                            </div>
                        </div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label> {{ translate('Note') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('Your Note') }}" name="content[0][note_text]"
                                    value="{{ isset($widgetContents['note_text']) ? $widgetContents['note_text'] : '' }}">
                            </div>
                        </div>
                        <div class="col-sm-12 mt-4">
                            <div class="row">
                                <div class="col-sm-3">
                                    <label><b>{{ translate('Allow Social Option') }}?</b></label>
                                </div>
                                <div class="col-sm-9 form-inner mb-2">
                                    <div class="form-inner mb-2">
                                        <div class="form-check form-switch candidate-option justify-content-start">
                                            <input type="hidden" name="content[0][is_footer_social]" value="off">
                                            <input class="form-check-input" name="content[0][is_footer_social]"
                                                type="checkbox" id="is_footer_social" value="on"
                                                {{ !isset($widgetContents['is_footer_social']) || $widgetContents['is_footer_social'] == 'on' ? 'checked' : '' }}>
                                            <label class="form-check-label ml-1" for="is_footer_social"></label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="button-area text-end">
                        <button type="submit"
                            class="eg-btn btn--green medium-btn shadow">{{ translate('Update') }}</button>
                    </div>
                </form>
            </div>
        </div>

    </div>
@else
    <div class="sortable-item accordion-item allowPrimary" data-code="{{ $randomId }}">
        <div class="accordion-header">
            <div class="section-name"> {{ $widgetName }}
                <div class="collapsed d-flex">
                    <div class="form-check form-switch me-2">
                        <input class="form-check-input status-change"
                            data-action="{{ route('admin.pages.widget.status.change', $randomId) }}" checked
                            type="checkbox" role="switch" id="{{ $randomId }}">
                        <label class="form-check-label" for="{{ $randomId }}"> </label>
                    </div>
                    <div class="collapsed-action-btn edit-action action-icon me-2">
                        <i class="bi bi-pencil-square"></i>
                    </div>
                    <div class="action-icon delete-action" data-id="{{ $randomId }}">
                        <i class="bi bi-trash"></i>
                    </div>

                </div>
            </div>
        </div>
        <div class="accordion-collapse collapse show">
            <div class="accordion-body">
                <form enctype="multipart/form-data" class="form" method="POST"
                    data-action="{{ route('admin.pages.widget.save') }}">
                    @csrf

                    <input type="hidden" name="ui_card_number" value="{{ $randomId }}">
                    <input type="hidden" name="page_id" value="{{ $pageId }}">
                    <input type="hidden" name="widget_slug" class="widget-slug" value="{{ $slug }}">

                    <div class="row">
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label>{{ translate('Main Title') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('Contact Us') }}" name="content[0][main_title]"
                                    value="{{ isset($widgetContents['main_title']) ? $widgetContents['main_title'] : '' }}">
                            </div>
                        </div>
                        <div class="card-header mb-4 mt-4">{{ translate('Left Side') }}</div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label>{{ translate('Contact Form Title') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('leave your Message:') }}"
                                    name="content[0][contact_f_title]"
                                    value="{{ isset($widgetContents['contact_f_title']) ? $widgetContents['contact_f_title'] : '' }}">
                            </div>
                        </div>
                        <div class="card-header mb-4 mt-4">{{ translate('Right Side') }}</div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label>{{ translate('Address Title') }}</label>
                                <input type="text" class="username-input" placeholder="{{ translate('Address') }}"
                                    name="content[0][addr_title]"
                                    value="{{ isset($widgetContents['addr_title]"']) ? $widgetContents['addr_title]"'] : '' }}">
                            </div>
                        </div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label>{{ translate('Office Location') }}</label>
                                <textarea name="content[0][office_location]">{{ $widgetContents['office_location'] ?? '' }}</textarea>
                            </div>
                        </div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label> {{ translate('Phone Number One') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('1-877-987-6401') }}" name="content[0][phone_one]"
                                    value="{{ isset($widgetContents['phone_one']) ? $widgetContents['phone_one'] : '' }}">
                            </div>
                        </div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label> {{ translate('Phone Number Two') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('1-687-678-5555') }}" name="content[0][phone_two]"
                                    value="{{ isset($widgetContents['phone_two']) ? $widgetContents['phone_two'] : '' }}">
                            </div>
                        </div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label> {{ translate('Email One') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('info@gmail.com') }}" name="content[0][email_one]"
                                    value="{{ isset($widgetContents['email_one']) ? $widgetContents['email_one'] : '' }}">
                            </div>
                        </div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label> {{ translate('Email Two') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('info@email.com') }}" name="content[0][email_two]"
                                    value="{{ isset($widgetContents['email_two']) ? $widgetContents['email_two'] : '' }}">
                            </div>
                        </div>
                        <div class="col-sm-12 mb-2">
                            <div class="form-inner">
                                <label> {{ translate('Support Title') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('Support Time') }}" name="content[0][support_title]"
                                    value="{{ isset($widgetContents['support_title']) ? $widgetContents['support_title'] : '' }}">

                            </div>
                        </div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label> {{ translate('Support Time') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('9.00 Am - 19.00 Pm') }}"
                                    name="content[0][support_time]"
                                    value="{{ isset($widgetContents['support_time']) ? $widgetContents['support_time'] : '' }}">
                            </div>
                        </div>
                        <div class="col-sm-6 mb-2">
                            <div class="form-inner">
                                <label> {{ translate('Note') }}</label>

                                <input type="text" class="username-input"
                                    placeholder="{{ translate('Your Note') }}" name="content[0][note_text]"
                                    value="{{ isset($widgetContents['note_text']) ? $widgetContents['note_text'] : '' }}">
                            </div>
                        </div>
                        <div class="col-sm-12 mt-4">
                            <div class="row">
                                <div class="col-sm-3">
                                    <label><b>{{ translate('Allow Social Option') }}?</b></label>
                                </div>
                                <div class="col-sm-9 form-inner mb-2">
                                    <div class="form-inner mb-2">
                                        <div class="form-check form-switch candidate-option justify-content-start">
                                            <input type="hidden" name="content[0][is_footer_social]" value="off">
                                            <input class="form-check-input" name="content[0][is_footer_social]"
                                                type="checkbox" id="is_footer_social" value="on"
                                                {{ !isset($widgetContents['is_footer_social']) || $widgetContents['is_footer_social'] == 'on' ? 'checked' : '' }}>
                                            <label class="form-check-label ml-1" for="is_footer_social"></label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="button-area text-end">
                        <button type="submit"
                            class="eg-btn btn--green medium-btn shadow">{{ translate('Save') }}</button>
                    </div>
                </form>
            </div>
        </div>

    </div>
@endif