@extends('layouts.admin.app')

@section('content')
<div class="container-fluid py-4">

{{-- HEADER --}}
<div class="d-flex flex-wrap justify-content-between align-items-center mb-4 gap-3">
    <div>
        <h4 class="fw-bold mb-1">
            <i class="fas fa-tags text-primary"></i> Gestão de Promoções
        </h4>
        <small class="text-muted">
            Configure preços promocionais e períodos de validade
        </small>
    </div>

    {{-- SEARCH --}}
    <form method="GET" class="d-flex gap-2 promo-search">
        <input type="text"
               name="search"
               value="{{ request('search') }}"
               class="form-control"
               placeholder="Pesquisar produto...">

        <button class="btn btn-primary">
            <i class="fas fa-search"></i>
        </button>
    </form>
</div>

{{-- CARD CONTAINER --}}
<div class="promo-card">

    <div class="table-responsive">
        <table class="table align-middle promo-table">

            <thead>
                <tr>
                    <th>Produto</th>
                    <th>Preço</th>
                    <th>Promo</th>
                    <th>Período</th>
                    <th width="300">Ações</th>
                </tr>
            </thead>

            <tbody>
            @forelse($products as $p)

                @php
                    $now = now();
                    $activePromo = $p->promo_price
                        && $p->promo_start
                        && $p->promo_end
                        && $now->between($p->promo_start, $p->promo_end);
                @endphp

                <tr class="promo-row {{ $activePromo ? 'active-promo' : '' }}">

                    {{-- PRODUTO --}}
                    <td>
                        <div class="fw-semibold text-dark">
                            {{ $p->name }}
                        </div>
                        <small class="text-muted">
                            {{ $p->category->name ?? '-' }}
                        </small>
                    </td>

                    {{-- PREÇO NORMAL (SEM IVA) --}}
                    <td>
                        <span class="price-normal">
                            {{ number_format($p->price,2,',','.') }} Kz
                        </span>
                    </td>

                    {{-- PREÇO PROMO --}}
                    <td>
                        @if($p->promo_price)
                            <span class="badge promo-badge">
                                {{ number_format($p->promo_price,2,',','.') }} Kz
                            </span>

                            @if($activePromo)
                                <div class="small text-success fw-semibold mt-1">
                                    Ativo
                                </div>
                            @endif
                        @else
                            <span class="text-muted">—</span>
                        @endif
                    </td>

                    {{-- PERÍODO --}}
                    <td>
                        @if($p->promo_start && $p->promo_end)
                            <div class="promo-dates">
                                <span>
                                    {{ \Carbon\Carbon::parse($p->promo_start)->format('d/m/Y') }}
                                </span>
                                <small>até</small>
                                <span>
                                    {{ \Carbon\Carbon::parse($p->promo_end)->format('d/m/Y') }}
                                </span>
                            </div>
                        @else
                            <span class="text-muted">—</span>
                        @endif
                    </td>

                    {{-- AÇÕES --}}
                    <td>

                        <form method="POST"
                              action="{{ route('dashboard.admin.promocoes.update',$p->id) }}"
                              class="promo-form">
                            @csrf
                            @method('PUT')

                            <div class="row g-2">

                                <div class="col-12 col-md-4">
                                    <input type="number"
                                           step="0.01"
                                           name="promo_price"
                                           value="{{ $p->promo_price }}"
                                           class="form-control form-control-sm"
                                           placeholder="Preço promo">
                                </div>

                                <div class="col-6 col-md-3">
                                    <input type="date"
                                           name="promo_start"
                                           value="{{ $p->promo_start }}"
                                           class="form-control form-control-sm">
                                </div>

                                <div class="col-6 col-md-3">
                                    <input type="date"
                                           name="promo_end"
                                           value="{{ $p->promo_end }}"
                                           class="form-control form-control-sm">
                                </div>

                                <div class="col-12 col-md-2">
                                    <button class="btn btn-primary btn-sm w-100">
                                        <i class="fas fa-save"></i>
                                    </button>
                                </div>

                            </div>
                        </form>

                        @if($p->promo_price)
                            <form method="POST"
                                  action="{{ route('dashboard.admin.promocoes.destroy',$p->id) }}"
                                  class="mt-2">
                                @csrf
                                @method('DELETE')

                                <button class="btn btn-outline-danger btn-sm w-100">
                                    <i class="fas fa-trash"></i> Remover
                                </button>
                            </form>
                        @endif

                    </td>

                </tr>

            @empty
                <tr>
                    <td colspan="5" class="text-center py-5 text-muted">
                        Nenhum produto encontrado
                    </td>
                </tr>
            @endforelse
            </tbody>

        </table>
    </div>

    {{-- PAGINAÇÃO --}}
    <div class="p-3">
        {{ $products->withQueryString()->links() }}
    </div>

</div>

</div>

{{-- ================= STYLE ================= --}}
<style>

/* SEARCH */
.promo-search input{
    border-radius:10px;
}
.promo-search button{
    border-radius:10px;
}

/* CARD */
.promo-card{
    background:#fff;
    border-radius:16px;
    box-shadow:0 10px 30px rgba(0,0,0,.05);
    overflow:hidden;
}

/* TABLE */
.promo-table thead{
    background:#f8fafc;
}
.promo-table th{
    font-size:13px;
    text-transform:uppercase;
    color:#64748b;
}

/* ROW */
.promo-row{
    transition:.25s ease;
}
.promo-row:hover{
    background:#f9fafb;
}

/* ACTIVE PROMO */
.active-promo{
    background:linear-gradient(90deg, rgba(34,197,94,0.05), transparent);
}

/* PRICE */
.price-normal{
    font-weight:600;
    color:#1e293b;
}

/* PROMO BADGE */
.promo-badge{
    background:#22c55e;
    color:#fff;
    font-size:12px;
    padding:6px 10px;
    border-radius:20px;
}

/* DATES */
.promo-dates{
    display:flex;
    flex-direction:column;
    font-size:12px;
    color:#475569;
}

/* FORM */
.promo-form input{
    border-radius:8px;
}

/* RESPONSIVO */
@media(max-width:768px){

    .promo-table{
        font-size:13px;
    }

    .promo-form .row{
        flex-direction:column;
    }

}

</style>

@endsection