{{-- upgrade5326 --}}
<div class="accordion-item">
    <h4 class="accordion-header" id="heading-01">
        <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
            data-bs-target="#collapse-01" aria-expanded="false">
            <h2>{{ __('Images Dimensions Settings') }}</h2>
        </button>
    </h4>
    <div id="collapse-01" class="accordion-collapse collapse"
        data-bs-parent="#accordion-example">
        <div class="accordion-body pt-0">
            <form action="{{ route('admin.change.image.settings') }}" method="post"
                enctype="multipart/form-data">
                @csrf
                <div class="row">
                    
                    <!-- Card Cover -->
                    <div class="col-xl-4 mb-2">
                        <h2 class="page-title my-3">
                            {{ __('Card Cover') }}
                        </h2>
                        <div class="mb-3">
                            <label class="form-label">{{ __('Width x Height in PX') }}</label>
                            <div class="d-flex">
                                <input type="number" class="form-control" name="card_cover_width" value="{{ $settings->card_cover_width ?? '' }}" placeholder="{{ __('Width') }}" min="10">
                                <b style="margin: 12px;">X</b>
                                <input type="number" class="form-control" name="card_cover_height" value="{{ $settings->card_cover_height ?? '' }}" placeholder="{{ __('Height') }}" min="10">
                            </div>
                        </div>
                        <div class="mb-3">
                            <div class="form-label switch-text">{{ ($settings->card_cover ?? '') == 'optional' ? 'Optional' : 'Required' }}</div>
                            <label class="form-check form-switch">
                                <input class="form-check-input toggle-switch" type="checkbox" name="card_cover" {{ ($settings->card_cover ?? '') == 'optional' ? '' : 'checked' }}>
                            </label>
                        </div>
                    </div>

                    <!-- Card Logo -->
                    <div class="col-xl-4 mb-2">
                        <h2 class="page-title my-3">
                            {{ __('Card Logo') }}
                        </h2>
                        <div class="mb-3">
                            <label class="form-label">{{ __('Width x Height in PX') }}</label>
                            <div class="d-flex">
                                <input type="number" class="form-control" name="card_logo_width" value="{{ $settings->card_logo_width ?? '' }}" placeholder="{{ __('Width') }}" min="10">
                                <b style="margin: 12px;">X</b>
                                <input type="number" class="form-control" name="card_logo_height" value="{{ $settings->card_logo_height ?? '' }}" placeholder="{{ __('Height') }}" min="10">
                            </div>
                        </div>
                        <div class="mb-3">
                            <div class="form-label switch-text">{{ ($settings->card_logo ?? '') == 'optional' ? 'Optional' : 'Required' }}</div>
                            <label class="form-check form-switch">
                                <input class="form-check-input toggle-switch" type="checkbox" name="card_logo" {{ ($settings->card_logo ?? '') == 'optional' ? '' : 'checked' }}>
                            </label>
                        </div>
                    </div>
                     <!-- Card Product -->
                     <div class="col-xl-4 mb-2">
                        <h2 class="page-title my-3">
                            {{ __('Card Product') }}
                        </h2>
                        <div class="mb-3">
                            <label class="form-label">{{ __('Width x Height in PX') }}</label>
                            <div class="d-flex">
                                <input type="number" class="form-control" name="card_product_width" value="{{ $settings->card_product_width ?? '' }}" placeholder="{{ __('Width') }}" min="10">
                                <b style="margin: 12px;">X</b>
                                <input type="number" class="form-control" name="card_product_height" value="{{ $settings->card_product_height ?? '' }}" placeholder="{{ __('Height') }}" min="10">
                            </div>
                        </div>
                    </div>
                    <div class="clearfix"></div>
                    <!-- Store Banner -->
                    <div class="col-xl-4 mb-2">
                        <h2 class="page-title my-3">
                            {{ __('Store Banner') }}
                        </h2>
                        <div class="mb-3">
                            <label class="form-label">{{ __('Width x Height in PX') }}</label>
                            <div class="d-flex">
                                <input type="number" class="form-control" name="store_banner_width" value="{{ $settings->store_banner_width ?? '' }}" placeholder="{{ __('Width') }}" min="10">
                                <b style="margin: 12px;">X</b>
                                <input type="number" class="form-control" name="store_banner_height" value="{{ $settings->store_banner_height ?? '' }}" placeholder="{{ __('Height') }}" min="10">
                            </div>
                        </div>
                        <div class="mb-3">
                            <div class="form-label switch-text">{{ ($settings->store_banner ?? '') == 'optional' ? 'Optional' : 'Required' }}</div>
                            <label class="form-check form-switch">
                                <input class="form-check-input toggle-switch" type="checkbox" name="store_banner" {{ ($settings->store_banner ?? '') == 'optional' ? '' : 'checked' }}>
                            </label>
                        </div>
                    </div>

                    <!-- Store Logo -->
                    <div class="col-xl-4 mb-2">
                        <h2 class="page-title my-3">
                            {{ __('Store Logo') }}
                        </h2>
                        <div class="mb-3">
                            <label class="form-label">{{ __('Width x Height in PX') }}</label>
                            <div class="d-flex">
                                <input type="number" class="form-control" name="store_logo_width" value="{{ $settings->store_logo_width ?? '' }}" placeholder="{{ __('Width') }}" min="10">
                                <b style="margin: 12px;">X</b>
                                <input type="number" class="form-control" name="store_logo_height" value="{{ $settings->store_logo_height ?? '' }}" placeholder="{{ __('Height') }}" min="10">
                            </div>
                        </div>
                        <div class="mb-3">
                            <div class="form-label switch-text">{{ ($settings->store_logo ?? '') == 'optional' ? 'Optional' : 'Required' }}</div>
                            <label class="form-check form-switch">
                                <input class="form-check-input toggle-switch" type="checkbox" name="store_logo" {{ ($settings->store_logo ?? '') == 'optional' ? '' : 'checked' }}>
                            </label>
                        </div>
                    </div>
                     <!-- Store Product -->
                     <div class="col-xl-4 mb-2">
                        <h2 class="page-title my-3">
                            {{ __('Store Product') }}
                        </h2>
                        <div class="mb-3">
                            <label class="form-label">{{ __('Width x Height in PX') }}</label>
                            <div class="d-flex">
                                <input type="number" class="form-control" name="product_width" value="{{ $settings->product_width ?? '' }}" placeholder="{{ __('Width') }}" min="10">
                                <b style="margin: 12px;">X</b>
                                <input type="number" class="form-control" name="product_height" value="{{ $settings->product_height ?? '' }}" placeholder="{{ __('Height') }}" min="10">
                            </div>
                        </div>
                    </div>
                    <div class="text-end bottom-fix">
                        <div class="d-flex">
                            <button type="submit" class="btn btn-primary btn-md ms-auto">
                                Update
                            </button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>