@extends('web.layouts.app')

@section('title', __('عناوين الشحن'))
@section('page_heading', __('عناوين الشحن'))

@section('content')
<div class="content">
    <div class="user-info-page">
        <div class="container">
            <div class="row">
                {{-- Sidebar --}}
                @include('web.layouts.inc.user_sidebar')

                <div class="col-lg-9">
                    <div class="user-info-content">
                        <div class="section-header">
                            <div class="section-header-info">
                                <h3>عناوين الشحن</h3>
                                <p>قم بتغير وتعديل عناوين شحنك بسهولة</p>
                            </div>
                        </div>

                        <div class="user-info-content-inputs">
                            <div class="row">
                                {{-- عرض العناوين --}}
                                @foreach($addresses as $address)
                                    <div class="col-lg-6">
                                        <div class="address-card">
                                            <div class="address-details">
                                                @if($address->is_default)
                                                    <div class="cat cat-main">الأساسى</div>
                                                @else
                                                    <div class="cat">{{ $address->type == 'home' ? 'المنزل' : 'العمل' }}</div>
                                                @endif
                                                <h3 class="title">{{ $address->city }} - {{ $address->governorate->name }}</h3>
                                                <p class="phone">{{ $address->phone_1 }}</p>
                                                <span class="details">{{ $address->address }}</span>
                                                <div class="address-actions">
                                                    <a href="{{ route('addresses.edit', $address->id) }}" class="edit-btn">تعديل</a>
                                                    <form action="{{ route('addresses.destroy', $address->id) }}" method="POST" style="display: inline-block;">
                                                        @csrf
                                                        @method('DELETE')
                                                        <button type="submit" class="del-btn" >حذف</button>
                                                    </form>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                @endforeach

                                {{-- إضافة عنوان جديد --}}
                                <div class="col-lg-6">
                                    <a href="{{ route('addresses.add') }}" class="add-new-card">
                                        <div class="add-new-container">
                                            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
                                                <path d="M11 11V5H13V11H19V13H13V19H11V13H5V11H11Z"></path>
                                            </svg>
                                            <h3>أضف عنوان جديد</h3>
                                        </div>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@endsection