@extends('frontend.main_master')
@section('body-class', 'panel-page panel-scrollable')
@section('title', t('my-basket') . ' - ' . t('site-title'))

@push('styles')
    <link rel="stylesheet" href="{{ asset('frontend/css/profile.css') }}">
    <style>
        @if (Route::is('cart.checkout'))
            /* Sadece gerçek ödeme ekranında (cart.checkout) hiçbir header render edilmiyor
               (bkz. main_master.blade.php $hideShellForPayments) — bu yüzden padding-top'u
               burada kapatıyoruz. Sepet özeti sayfasında (cart.show) panel-header hâlâ
               render ediliyor, o yüzden bu override oraya sızmamalı (aksi halde başlık
               fixed panel-header'ın altına gizlenir). */
            body.panel-page {
                padding-top: 0 !important;
            }

            .cart-wrap {
                min-height: calc(100vh - 46px);
            }
        @endif

        .btn-checkout:hover {
            box-shadow: 0 6px 20px rgba(47, 143, 122, .35);
            transform: translateY(-1px);
        }
    </style>
@endpush

@section('content')
    <div class="cart-wrap bg-light overflow-auto">
        <div class="container py-4" style="max-width:1060px">

            {{-- Toasts --}}
            <div class="toast-container position-fixed top-0 end-0 p-3" style="z-index: 1080;">
                @if (session('success'))
                    <div class="toast astro-toast astro-toast--success border-0 show" role="alert" data-bs-autohide="true"
                        data-bs-delay="4000">
                        <div class="astro-toast__inner">
                            <div class="astro-toast__icon"><i class="fa-solid fa-check"></i></div>
                            <div class="astro-toast__content">
                                <span class="astro-toast__title">{{ t('success') }}</span>
                                <span class="astro-toast__body">{{ session('success') }}</span>
                            </div>
                            <button type="button" class="astro-toast__close" data-bs-dismiss="toast"><i
                                    class="fa-solid fa-xmark"></i></button>
                        </div>
                        <div class="astro-toast__progress astro-toast__progress--run" style="animation-duration:4000ms">
                        </div>
                    </div>
                @endif
                @if (session('error'))
                    <div class="toast astro-toast astro-toast--error border-0 show" role="alert" data-bs-autohide="true"
                        data-bs-delay="5000">
                        <div class="astro-toast__inner">
                            <div class="astro-toast__icon"><i class="fa-solid fa-circle-xmark"></i></div>
                            <div class="astro-toast__content">
                                <span class="astro-toast__title">{{ t('error') }}</span>
                                <span class="astro-toast__body">{{ session('error') }}</span>
                            </div>
                            <button type="button" class="astro-toast__close" data-bs-dismiss="toast"><i
                                    class="fa-solid fa-xmark"></i></button>
                        </div>
                        <div class="astro-toast__progress astro-toast__progress--run" style="animation-duration:5000ms">
                        </div>
                    </div>
                @endif
            </div>

            {{-- Header --}}
            <div class="d-flex align-items-center justify-content-between mb-4">
                <div class="d-flex align-items-baseline gap-2">
                    <h1 class="h4 fw-bold mb-0">{{ t('your-basket') }}</h1>
                    @if (!empty($cart['items']))
                        <span class="text-muted small">({{ count($cart['items']) }} {{ t('product') }})</span>
                    @endif
                </div>
                <a href="{{ route('subscription.checkout') }}"
                    class="btn btn-sm btn-secondary rounded-pill px-3 d-inline-flex align-items-center gap-1"
                    style="font-size:.72rem">
                    <i class="fa-solid fa-layer-group" style="font-size:.6rem"></i> {{ t('view-plans') }}
                </a>
            </div>

            {{-- Main Grid --}}
            <div class="row g-4 align-items-stretch">

                {{-- LEFT: Items --}}
                <div class="col-lg-7 d-flex flex-column">

                    @if (empty($cart['items']))
                        <div class="card border-0 shadow-sm rounded-3 text-center py-5 px-3">
                            <div class="mx-auto mb-3 rounded-circle bg-light d-flex align-items-center justify-content-center"
                                style="width:60px;height:60px">
                                <i class="fa-solid fa-bag-shopping text-muted fs-4"></i>
                            </div>
                            <h6 class="fw-bold mb-1">{{ t('empty-cart') }}</h6>
                            <p class="text-muted small mb-3">{{ t('empty-cart-content') }}</p>
                            <div class="d-flex gap-2 justify-content-center">
                                <a href="{{ route('subscription.checkout') }}"
                                    class="btn btn-sm rounded-pill px-3 text-white"
                                    style="background:var(--astro-main-green); font-size:.78rem">
                                    <i class="fa-solid fa-crown me-1"></i>{{ t('subscriptions') }}
                                </a>
                                <a href="{{ route('package.checkout') }}"
                                    class="btn btn-sm btn-outline-secondary rounded-pill px-3" style="font-size:.78rem">
                                    <i class="fa-solid fa-gem me-1"></i>{{ t('packages') }}
                                </a>
                            </div>
                        </div>
                    @else
                        <div class="d-flex flex-column flex-grow-1">
                            {{-- Cart Items --}}
                            <div class="card border-0 shadow-sm rounded-3 mb-3 flex-grow-1">
                                <div class="card-body p-0">
                                    @foreach ($cart['items'] as $idx => $item)
                                        @php
                                            $type = $item['type'] ?? '';
                                            $iconBg = 'background:#6366f1';
                                            $iconSymbol = 'fa-solid fa-box';
                                            if ($type === 'subscription') {
                                                $iconBg = 'background:var(--astro-main-green)';
                                                $iconSymbol = 'fa-solid fa-crown';
                                            } elseif ($type === 'package') {
                                                $iconBg = 'background:#f59e0b';
                                                $iconSymbol = 'fa-solid fa-gem';
                                            } elseif (str_contains($type, 'chat')) {
                                                $iconSymbol = 'fa-solid fa-comments';
                                            } elseif (str_contains($type, 'report')) {
                                                $iconSymbol = 'fa-solid fa-file-lines';
                                            } elseif (str_contains($type, 'comment')) {
                                                $iconSymbol = 'fa-solid fa-star';
                                            }
                                        @endphp
                                        <div class="px-4 py-3 {{ $idx > 0 ? 'border-top' : '' }}">
                                            <div class="d-flex align-items-center gap-3">
                                                <div class="d-flex align-items-center justify-content-center rounded-2 text-white flex-shrink-0"
                                                    style="width:46px;height:46px;font-size:.95rem;{{ $iconBg }}"><i
                                                        class="{{ $iconSymbol }}"></i></div>
                                                <div class="flex-grow-1" style="min-width:0">
                                                    <div class="d-flex align-items-center gap-2 flex-wrap" style="margin-top: 10px; margin-bottom: 15px;">
                                                        <span class="fw-bold text-dark" style="font-size:.9rem">{{ $item['label'] }}</span>
                                                    </div>
                                                    <div class="text-muted d-flex align-items-center gap-2 flex-wrap"
                                                        style="font-size:.78rem">
                                                        {{ number_format($item['unit_price'], 0, ',', '.') }}
                                                        {{ t('currency') }}
                                                        @if (($item['type'] ?? '') === 'subscription')
                                                            &times; {{ $item['quantity'] }}
                                                        @else
                                                            &times;
                                                            {{-- Miktar arttır/azalt (paket ve diğer ürünler) --}}
                                                            <div class="d-inline-flex align-items-center border rounded-pill"
                                                                style="background:#f8f9fa">
                                                                <form action="{{ route('cart.update-quantity') }}"
                                                                    method="POST" class="d-inline">
                                                                    @csrf
                                                                    <input type="hidden" name="key"
                                                                        value="{{ $item['key'] }}">
                                                                    <input type="hidden" name="quantity"
                                                                        value="{{ max(0, $item['quantity'] - 1) }}">
                                                                    <button type="submit"
                                                                        class="btn btn-link p-1 text-decoration-none text-dark"
                                                                        style="font-size:.9rem;min-width:28px"
                                                                        title="{{ t('decrease') ?? 'Azalt' }}">
                                                                        <i class="fa-solid fa-minus"
                                                                            style="font-size:.6rem"></i>
                                                                    </button>
                                                                </form>
                                                                <span class="px-2 fw-semibold"
                                                                    style="min-width:1.5rem;text-align:center">{{ $item['quantity'] }}</span>
                                                                <form action="{{ route('cart.update-quantity') }}"
                                                                    method="POST" class="d-inline">
                                                                    @csrf
                                                                    <input type="hidden" name="key"
                                                                        value="{{ $item['key'] }}">
                                                                    <input type="hidden" name="quantity"
                                                                        value="{{ $item['quantity'] + 1 }}">
                                                                    <button type="submit"
                                                                        class="btn btn-link p-1 text-decoration-none text-dark"
                                                                        style="font-size:.9rem;min-width:28px"
                                                                        title="{{ t('increase') ?? 'Aumentar' }}">
                                                                        <i class="fa-solid fa-plus"
                                                                            style="font-size:.6rem"></i>
                                                                    </button>
                                                                </form>
                                                            </div>
                                                        @endif
                                                    </div>
                                                </div>
                                                <div class="fw-bold text-dark" style="font-size:1.05rem">
                                                    {{ number_format($item['line_total'], 0, ',', '.') }}
                                                    {{ t('currency') }}</div>
                                                <form action="{{ route('cart.remove') }}" method="POST"
                                                    onsubmit="return confirm('{{ t('confirm-remove') }}')">
                                                    @csrf
                                                    <input type="hidden" name="key" value="{{ $item['key'] }}">
                                                    <button type="submit"
                                                        class="btn btn-sm btn-outline-danger rounded-pill px-2 py-1 d-inline-flex align-items-center gap-1"
                                                        style="font-size:.74rem">
                                                        <i class="fa-regular fa-trash-can" style="font-size:.65rem"></i>
                                                        {{ t('remove') }}
                                                    </button>
                                                </form>
                                            </div>

                                            @if (!empty($item['meta']['features']))
                                                @php $meta = $item['meta']; @endphp
                                                <div class="ms-5 ps-3 border-top"
                                                    style="margin-top: 20px; padding-top: 20px; border-color:#f0f0f0 !important">
                                                    <div class="row g-1">
                                                        @foreach ($meta['features'] as $feat)
                                                            <div class="col-12 d-flex align-items-center gap-2"
                                                                style="font-size:.78rem">
                                                                <i class="fa-solid fa-circle-check text-success"
                                                                    style="font-size:.65rem"></i>
                                                                <span class="text-secondary">{{ $feat }}</span>
                                                            </div>
                                                        @endforeach
                                                        @if (!empty($meta['package_name']) && $item['type'] === 'subscription')
                                                            <div class="col-12 d-flex align-items-center gap-2"
                                                                style="font-size:.78rem">
                                                                <i class="fa-solid fa-gift"
                                                                    style="font-size:.65rem;color:var(--astro-main-green)"></i>
                                                                <span
                                                                    class="fw-semibold text-dark">{{ $meta['package_name'] }}
                                                                    &mdash;
                                                                    {{ number_format($meta['package_word_limit']) }}
                                                                    {{ t('token') }}</span>
                                                            </div>
                                                        @endif
                                                    </div>
                                                    <div class="d-flex align-items-center gap-2 mt-2">
                                                        @if (!empty($meta['has_discount']) && !empty($meta['price_normal']))
                                                            <span class="text-decoration-line-through text-muted"
                                                                style="font-size:.72rem">{{ number_format($meta['price_normal'], 0, ',', '.') }}
                                                                {{ t('currency') }}</span>
                                                        @endif
                                                        @if (!empty($meta['is_subscriber_price']))
                                                            <span class="badge bg-success-subtle text-success"
                                                                style="font-size: .68rem;">{{ t('subscriber-price') }}</span>
                                                        @endif
                                                        @if (!empty($meta['monthly_eq']))
                                                            <span class="badge rounded-pill text-white"
                                                                style="font-size:.66rem;background:var(--astro-main-green)">{{ t('monthly') }}
                                                                {{ number_format($meta['monthly_eq'], 0, ',', '.') }}
                                                                ~{{ t('currency') }}</span>
                                                        @endif
                                                    </div>
                                                </div>
                                            @endif
                                        </div>
                                    @endforeach
                                </div>
                            </div>

                            {{-- Billing Info --}}
                            <div class="card border-0 shadow-sm rounded-3">
                                <div class="card-body d-flex align-items-center gap-3 py-3 px-4">
                                    <div class="rounded-circle d-flex align-items-center justify-content-center flex-shrink-0"
                                        style="width:36px;height:36px;background:rgba(47,143,122,.08)">
                                        <i class="fa-solid fa-file-invoice"
                                            style="font-size:.75rem;color:var(--astro-main-green)"></i>
                                    </div>
                                    <div class="flex-grow-1" style="min-width:0">
                                        @if ($hasBillingInfo)
                                            <div class="d-flex align-items-center justify-content-between">
                                                <span class="fw-bold"
                                                    style="font-size:.82rem">{{ t('billing-info') }}</span>
                                            </div>
                                            <div class="text-muted" style="font-size:.74rem;line-height:1.6">
                                                <div>
                                                    <span class="fw-semibold text-dark">{{ t('billing-type') }}:</span>
                                                    <span>
                                                        {{ ($billingInfo->invoice_type ?? 'individual') === 'corporate' ? t('corporate') : t('individual') }}
                                                    </span>
                                                </div>
                                                <div>
                                                    <span class="fw-semibold text-dark">{{ t('billing-company-name') }}:</span>
                                                    <span>{{ $billingInfo->company_name ?? '-' }}</span>
                                                </div>
                                                <div>
                                                    <span class="fw-semibold text-dark">{{ t('identity-number') }}:</span>
                                                    <span>{{ $billingInfo->tax_id ?? '-' }}</span>
                                                </div>
                                                @if (!empty($billingInfo->tax_office))
                                                    <div>
                                                        <span class="fw-semibold text-dark">{{ t('tax-office') }}:</span>
                                                        <span>{{ $billingInfo->tax_office }}</span>
                                                    </div>
                                                @endif
                                                @if (!empty($billingInfo->billing_address))
                                                    <div>
                                                        <span class="fw-semibold text-dark">{{ t('billing-address') }}:</span>
                                                        <span>{{ $billingInfo->billing_address }}</span>
                                                    </div>
                                                @endif
                                                @if ($billingInfo->city || $billingInfo->district)
                                                    <div>
                                                        <span class="fw-semibold text-dark">
                                                            {{ t('city') }} / {{ t('district') }}:
                                                        </span>
                                                        <span>
                                                            {{ $billingInfo->city ?? '' }}{{ $billingInfo->district ? ' / ' . $billingInfo->district : '' }}
                                                        </span>
                                                    </div>
                                                @endif
                                            </div>
                                        @else
                                            <div class="d-flex align-items-center justify-content-between">
                                                <span class="fw-bold"
                                                    style="font-size:.82rem">{{ t('billing-info') }}</span>
                                                <a href="{{ route('profile.show', ['tab' => 'billing']) }}"
                                                    class="btn btn-sm text-white rounded-pill px-3 d-inline-flex align-items-center gap-1"
                                                    style="font-size:.72rem;background:var(--astro-main-green)">
                                                    <i class="fa-solid fa-plus" style="font-size:.6rem"></i>
                                                    {{ t('add') }}
                                                </a>
                                            </div>
                                            <div class="text-muted" style="font-size:.74rem">
                                                {{ t('billing-info-required') }}
                                            </div>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endif
                </div>

                {{-- RIGHT: Summary --}}
                <div class="col-lg-5 d-flex flex-column">
                    <div class="card border-0 shadow-sm rounded-3 d-flex flex-column flex-grow-1">
                        <div class="card-body p-4 d-flex flex-column">
                            <h5 class="fw-bold mb-3">{{ t('order-summary') }}</h5>

                            @if (!empty($cart['items']))
                                <div class="mb-3 pb-3 border-bottom" style="border-color:#f0f0f0 !important">
                                    <div class="text-muted small fw-semibold mb-2" style="font-size:.76rem; text-transform:uppercase; letter-spacing:.05em;">
                                        {{ t('purchased-items') ?? 'Productos Comprados' }}
                                    </div>
                                    @foreach ($cart['items'] as $summaryItem)
                                        <div class="d-flex justify-content-between align-items-start gap-2 mb-2" style="font-size:.85rem">
                                            <div class="d-flex flex-column">
                                                <span class="fw-semibold text-dark">{{ $summaryItem['label'] }}</span>
                                                @if (($summaryItem['quantity'] ?? 1) > 1)
                                                    <span class="text-muted" style="font-size:.74rem">
                                                        {{ $summaryItem['quantity'] }} &times; {{ number_format($summaryItem['unit_price'], 0, ',', '.') }} {{ t('currency') }}
                                                    </span>
                                                @endif
                                            </div>
                                            <span class="fw-semibold text-dark flex-shrink-0">
                                                {{ number_format($summaryItem['line_total'], 0, ',', '.') }} {{ t('currency') }}
                                            </span>
                                        </div>
                                    @endforeach
                                </div>
                            @endif

                            @php
                                $currentLocale = strtolower((string) env('APP_LOCALE', app()->getLocale() ?? 'es'));
                                $isEn = str_starts_with($currentLocale, 'en');
                                $isTr = str_starts_with($currentLocale, 'tr');
                                $subtotal = $cart['subtotal'] ?? ($cart['total'] ?? 0);
                                $discount = $cart['discount'] ?? 0;
                                $total = $cart['total'] ?? 0;
                                $appliedCoupon = $cart['coupon'] ?? null;
                                $bonusMonths = $appliedCoupon['bonus_subscription_months'] ?? 0;
                                $bonusDurationText = $isEn ? 'months of gifted subscription duration' : ($isTr ? 'ay hediye abonelik süresi' : 'meses de suscripción de regalo');
                                $bonusNoteText = $isEn
                                    ? 'Valid for orders containing subscription items; only subscription duration is extended.'
                                    : ($isTr ? 'Abonelik içeren siparişlerde geçerlidir, sadece abonelik süresi uzar.' : 'Válido para pedidos con suscripción; solo se amplía la duración de la suscripción.');
                            @endphp

                            <div class="d-flex justify-content-between mb-2" style="font-size:.88rem">
                                <span class="text-muted">{{ t('subtotal') }}</span>
                                <span
                                    class="fw-semibold">{{ number_format($subtotal, 0, ',', '.') }}{{ t('currency') }}</span>
                            </div>
                            @if ($discount > 0 && $appliedCoupon)
                                <div class="d-flex justify-content-between mb-2" style="font-size:.88rem">
                                    <span class="text-muted">{{ t('coupon') }} ({{ $appliedCoupon['code'] }})</span>
                                    <span class="fw-semibold text-success">-{{ number_format($discount, 0, ',', '.') }}
                                        {{ t('currency') }}
                                    </span>
                                </div>
                            @endif
                            <div class="d-flex justify-content-between mb-2" style="font-size:.88rem">
                                <span class="text-muted">{{ t('vat') }}</span>
                                <span class="fw-semibold"
                                    style="color:var(--astro-main-green)">{{ t('including') }}</span>
                            </div>

                            @if ($appliedCoupon && $bonusMonths > 0)
                                <div class="mb-2" style="font-size:.8rem">
                                    <span class="badge rounded-pill text-white me-1"
                                          style="background:var(--astro-main-green)">
                                        +{{ $bonusMonths }} {{ $bonusDurationText }}
                                    </span>
                                    <span class="text-muted">
                                        {{ $bonusNoteText }}
                                    </span>
                                </div>
                            @endif

                            <hr class="my-2">

                            {{-- Coupon --}}
                            <div class="mb-2">
                                <label class="form-label fw-bold mb-2"
                                    style="font-size:.82rem">{{ t('coupon-code') }}</label>
                                @if ($appliedCoupon)
                                    <div class="d-flex align-items-center justify-content-between rounded-2 px-2 py-2"
                                        style="background:rgba(47,143,122,.06);border:1px solid rgba(47,143,122,.15)">
                                        <span class="fw-semibold d-flex flex-column" style="font-size:.74rem;color:var(--astro-main-green)">
                                            <span>
                                                <i class="fa-solid fa-tag me-1"></i>{{ $appliedCoupon['code'] }} &mdash;
                                                {{ number_format($appliedCoupon['amount'], 0, ',', '.') }}
                                                @php
                                                    $couponType = $appliedCoupon['discount_type'] ?? 'amount';
                                                @endphp
                                                @if ($couponType === 'percent')
                                                    %
                                                @else
                                                    {{ t('currency') }}
                                                @endif
                                            </span>
                                            @if ($bonusMonths > 0)
                                                <span class="text-success mt-1" style="font-size:.7rem">
                                                    +{{ $bonusMonths }} {{ $bonusDurationText }}
                                                </span>
                                            @endif
                                        </span>
                                        <form action="{{ route('cart.remove-coupon') }}" method="POST"
                                            class="d-inline">
                                            @csrf
                                            <button type="submit"
                                                class="btn btn-outline-danger btn-sm rounded-pill py-0 px-2"
                                                style="font-size:.64rem">{{ t('remove') }}</button>
                                        </form>
                                    </div>
                                @else
                                    <form action="{{ route('cart.apply-coupon') }}" method="POST">
                                        @csrf
                                        <div class="input-group input-group-sm">
                                            <input type="text" name="code" class="form-control coupon-input"
                                                placeholder="{{ t('coupon-code') }}" value="{{ old('code') }}"
                                                style="text-transform:uppercase;font-size:.78rem">
                                            <button type="submit" class="btn text-white fw-bold"
                                                style="background:var(--astro-main-green);font-size:.76rem">{{ t('apply') }}</button>
                                        </div>
                                    </form>
                                @endif
                            </div>

                            <hr class="my-2">

                            {{-- Total --}}
                            <div class="d-flex justify-content-between align-items-baseline mb-1">
                                <span class="fw-bold" style="font-size:1rem">{{ t('total') }}</span>
                                <span class="fw-bold"
                                    style="font-size:1.6rem;letter-spacing:-.02em">{{ number_format($total, 0, ',', '.') }}
                                    {{ t('currency') }}</span>
                            </div>
                            <p class="text-muted mb-3" style="font-size:.72rem">{{ t('including-vat') }}</p>

                            {{-- Checkout --}}
                            <div class="mt-auto pt-2">
                                @if (!empty($cart['items']))
                                    @if ($hasBillingInfo)
                                        @if (!empty($hasStoreItem) && $addresses->isEmpty())
                                            <div class="alert alert-warning py-2 px-3 text-center mb-3 rounded-3" style="font-size:.78rem">
                                                <i class="fa-solid fa-location-dot me-1"></i>
                                                Mağaza ürünü sipariş edebilmek için önce bir kargo adresi eklemelisiniz.
                                                <a href="{{ route('addresses.index') }}" class="fw-semibold d-block mt-1">Adres Ekle</a>
                                            </div>
                                        @endif
                                        <form action="{{ route('cart.checkout') }}" method="POST">
                                            @csrf
                                            @if (!empty($hasStoreItem) && $addresses->isNotEmpty())
                                                <div class="mb-3 p-2 rounded-3" style="background:rgba(47,143,122,.06);border:1px solid rgba(47,143,122,.18)">
                                                    <label for="address_id" class="form-label small fw-semibold mb-1">
                                                        <i class="fa-solid fa-truck me-1"></i> Kargo Adresi
                                                    </label>
                                                    <select name="address_id" id="address_id" class="form-select form-select-sm" required>
                                                        @foreach ($addresses as $address)
                                                            <option value="{{ $address->id }}" @selected($address->is_default)>
                                                                {{ $address->label ? $address->label . ' — ' : '' }}{{ $address->recipient_name }}, {{ $address->district }}/{{ $address->city }}
                                                            </option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                            @endif
                                            <div class="mb-3 p-2 rounded-3"
                                                style="background:rgba(47,143,122,.06);border:1px solid rgba(47,143,122,.18)">
                                                <div class="form-check">
                                                    <input class="form-check-input" type="checkbox" value="1"
                                                        name="distance_sales_accepted" id="distance_sales_accepted"
                                                        required>
                                                    <label class="form-check-label small text-dark"
                                                        for="distance_sales_accepted">
                                                        <a href="{{ route('legal.distance-sales') }}" target="_blank"
                                                            class="text-decoration-none fw-semibold"
                                                            style="color:var(--astro-main-green)">
                                                            {{ t('distance-sales-contract') }}
                                                        </a>
                                                        <span class="text-muted">&</span>
                                                        <a href="{{ route('legal.terms') }}" target="_blank"
                                                            class="text-decoration-none fw-semibold"
                                                            style="color:var(--astro-main-green)">
                                                            {{ t('terms-of-service') }}
                                                        </a>
                                                        {{ t('i-read-and-accept') }}
                                                    </label>
                                                </div>
                                            </div>
                                            <button type="submit"
                                                class="btn btn-checkout btn-lg w-100 text-white fw-bold rounded-3 d-flex align-items-center justify-content-center gap-2"
                                                style="font-size:.95rem;padding:.85rem;background:linear-gradient(135deg,var(--astro-main-green),var(--astro-deep-teal));border:none">
                                                {{ t('proceed-to-payment') }} <i class="fa-solid fa-arrow-right"
                                                    style="font-size:.65rem"></i>
                                            </button>
                                        </form>
                                    @else
                                        <div class="alert alert-warning py-2 px-3 text-center mb-0 rounded-3"
                                            style="font-size:.78rem">
                                            <i class="fa-solid fa-triangle-exclamation me-1"></i>
                                            {{ t('payment-info-required') }}
                                            <a href="{{ route('profile.show', ['tab' => 'billing']) }}"
                                                class="btn btn-sm btn-warning rounded-pill px-3 mt-2 d-block mx-auto"
                                                style="font-size:.74rem;max-width:200px">
                                                <i class="fa-solid fa-plus me-1"></i> {{ t('add-payment-info') }}
                                            </a>
                                        </div>
                                    @endif
                                @endif

                                <div class="text-center mt-3 pt-1">
                                    <div class="d-flex align-items-center justify-content-center gap-2 text-muted mb-1"
                                        style="font-size:.7rem">
                                        <i class="fa-solid fa-lock" style="color:var(--astro-main-green);font-size:.65rem"></i>
                                        <span class="text-uppercase fw-semibold" style="letter-spacing:.06em;color:#374151">
                                            {{ t('secure-payment') }}
                                        </span>
                                        <span class="opacity-50">&bull;</span>
                                        <i class="fa-solid fa-shield-halved" style="color:var(--astro-main-green);font-size:.65rem"></i>
                                        <span class="fw-semibold" style="color:#374151">
                                            {{ t('buyer-protection') }}
                                        </span>
                                    </div>
                                    <div class="text-muted" style="font-size:.68rem;line-height:1.4;opacity:.9">
                                        {{ t('buyer-protection-content') }}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>

        </div>
    </div>

    <script>
        document.addEventListener('DOMContentLoaded', function() {
            document.querySelectorAll('.toast.show').forEach(function(el) {
                new bootstrap.Toast(el).show();
            });
        });
    </script>
@endsection