@extends('layouts.admin.app')

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

    {{-- HEADER --}}
    <div class="d-flex justify-content-between align-items-center mb-4 flex-wrap gap-2">
        <div>
            <h4 class="fw-bold text-gradient mb-1">
                <i class="fas fa-spray-can-sparkles me-2"></i> Editar Produto
            </h4>
            <small class="text-muted">Atualize os dados do produto</small>
        </div>

        <a href="{{ route('dashboard.admin.produtos.show',$produto) }}"
           class="btn btn-outline-light">
            <i class="fas fa-arrow-left me-1"></i> Voltar
        </a>
    </div>

    {{-- CARD --}}
    <div class="card glass-card border-0 shadow-lg rounded-4">
        <div class="card-body p-4">

            <form method="POST"
                  action="{{ route('dashboard.admin.produtos.update',$produto) }}"
                  enctype="multipart/form-data">
                @csrf
                @method('PUT')

                <div class="row g-4">

                    {{-- CATEGORIA --}}
                    <div class="col-md-6">
                        <label class="form-label text-light">Categoria</label>
                        <select name="category_id" class="form-select modern-input" required>
                            @foreach($categories as $cat)
                                <option value="{{ $cat->id }}"
                                    @selected($produto->category_id == $cat->id)>
                                    {{ $cat->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                    {{-- NOME --}}
                    <div class="col-md-6">
                        <label class="form-label text-light">Nome do Produto</label>
                        <input name="name" class="form-control modern-input"
                               value="{{ old('name',$produto->name) }}" required>
                    </div>

                    {{-- MARCA --}}
                    <div class="col-md-6">
                        <label class="form-label text-light">Marca</label>
                        <input name="brand" class="form-control modern-input"
                               value="{{ old('brand',$produto->brand) }}">
                    </div>

                    {{-- PREÇO --}}
                    <div class="col-md-6">
                        <label class="form-label text-light">Preço</label>
                        <input name="price" type="number" step="0.01"
                               class="form-control modern-input"
                               value="{{ old('price',$produto->price) }}" required>
                        <small class="text-muted">IVA calculado automaticamente pelo sistema</small>
                    </div>

                    {{-- PREÇO COM IVA (READONLY) --}}
                    <div class="col-md-6">
                        <label class="form-label text-light">Preço com IVA</label>
                        <input class="form-control modern-input bg-dark"
                               value="{{ number_format($produto->price_with_iva,2,',','.') }}"
                               readonly>
                    </div>

                    {{-- PROMO --}}
                    <div class="col-md-6">
                        <label class="form-label text-light">Preço Promocional</label>
                        <input name="promo_price" type="number" step="0.01"
                               class="form-control modern-input"
                               value="{{ old('promo_price',$produto->promo_price) }}">
                    </div>

                    <div class="col-md-4">
                        <label class="form-label text-light">Início Promoção</label>
                        <input name="promo_start" type="date"
                               class="form-control modern-input"
                               value="{{ old('promo_start',$produto->promo_start) }}">
                    </div>

                    <div class="col-md-4">
                        <label class="form-label text-light">Fim Promoção</label>
                        <input name="promo_end" type="date"
                               class="form-control modern-input"
                               value="{{ old('promo_end',$produto->promo_end) }}">
                    </div>

                    {{-- FLAGS --}}
                    <div class="col-12 d-flex gap-4">

                        <div class="form-check form-switch">
                            <input class="form-check-input" type="checkbox"
                                   name="is_available"
                                   @checked($produto->is_available)>
                            <label class="form-check-label text-light">Disponível</label>
                        </div>

                        <div class="form-check form-switch">
                            <input class="form-check-input" type="checkbox"
                                   name="is_featured"
                                   @checked($produto->is_featured)>
                            <label class="form-check-label text-light">Destaque</label>
                        </div>

                    </div>

                    {{-- DESCRIÇÃO (substitui specifications) --}}
                    <div class="col-12">
                        <label class="form-label text-light">Descrição do Produto</label>
                        <textarea name="description" rows="5"
                                  class="form-control modern-input">{{ old('description',$produto->description) }}</textarea>
                    </div>

                    {{-- IMAGENS --}}
                    <div class="col-12">
                        <label class="form-label text-light">Adicionar Novas Imagens</label>
                        <input type="file" name="images[]" multiple class="form-control modern-input">
                    </div>

                </div>

                {{-- BOTÕES --}}
                <div class="mt-4 d-flex justify-content-end gap-2">

                    <a href="{{ route('dashboard.admin.produtos.show',$produto) }}"
                       class="btn btn-outline-light">
                        Cancelar
                    </a>

                    <button class="btn btn-gradient px-4">
                        <i class="fas fa-save me-1"></i> Atualizar Produto
                    </button>

                </div>

            </form>

        </div>
    </div>

</div>

{{-- STYLE PREMIUM PERFUMARIA --}}
<style>

body {
    background: #020617;
}

/* TITULO GRADIENTE */
.text-gradient {
    background: linear-gradient(90deg, #f97316, #fb923c);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* GLASS CARD */
.glass-card {
    background: rgba(15, 23, 42, 0.75);
    backdrop-filter: blur(12px);
    border-radius: 18px;
}

/* INPUTS */
.modern-input {
    background: #0f172a;
    border: 1px solid #1e293b;
    color: #fff;
    border-radius: 12px;
    padding: 12px;
    transition: .3s;
}

.modern-input:focus {
    border-color: #fb923c;
    box-shadow: 0 0 0 .2rem rgba(251,146,60,.25);
    background: #0f172a;
    color: #fff;
}

/* SWITCH */
.form-check-input:checked {
    background-color: #fb923c;
    border-color: #fb923c;
}

/* BOTÃO */
.btn-gradient {
    background: linear-gradient(135deg, #fb923c, #f97316);
    border: none;
    color: #fff;
    border-radius: 12px;
    transition: .3s;
}

.btn-gradient:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(249,115,22,.3);
}

/* RESPONSIVO */
@media(max-width:768px){
    .glass-card {
        padding: 10px;
    }
}

</style>

@endsection