@extends('admin.layouts.app')

@section('title', 'নতুন বিক্রয়')

@section('content')
<div class="container-fluid">
    <div class="mx-auto" style="max-width: 1180px;">
        <h1 class="fw-bold mb-4" style="font-size: 48px; line-height: 1.05; color: #0f172a;">নতুন বিক্রয় (Barcode + Search)</h1>

        <div class="card border-0 shadow-sm rounded-4 mb-3">
            <div class="card-body p-4">
                <div class="row g-3">
                    <div class="col-md-6">
                        <label class="form-label fw-semibold">Barcode স্ক্যান / টাইপ করে Enter</label>
                        <input type="text" class="form-control form-control-lg rounded-3" placeholder="স্ক্যানার দিয়ে স্ক্যান করুন বা টাইপ করে Enter">
                    </div>
                    <div class="col-md-6">
                        <label class="form-label fw-semibold">প্রোডাক্ট সার্চ</label>
                        <input type="text" class="form-control form-control-lg rounded-3" placeholder="নাম/কোড/বারকোড লিখুন...">
                    </div>
                </div>
            </div>
        </div>

        <div class="card border-0 shadow-sm rounded-0 bg-transparent mb-3">
            <div class="card-body p-0">
                <div class="table-responsive">
                    <table class="table table-bordered align-middle mb-0 bg-white">
                        <thead>
                            <tr>
                                <th>কোড</th>
                                <th>নাম</th>
                                <th>সাইজ</th>
                                <th>কালার</th>
                                <th>স্টক</th>
                                <th>Qty</th>
                                <th>Selling</th>
                                <th>Original</th>
                                <th>Discount</th>
                                <th>Total</th>
                                <th>Due</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td colspan="12" style="padding:14px 10px; font-size:18px;">পণ্য যোগ করুন...</td>
                            </tr>
                            <tr>
                                <td colspan="8"></td>
                                <td class="text-end fw-bold" style="font-size:26px;">Grand Total</td>
                                <td class="fw-bold" style="font-size:26px;">0.00</td>
                                <td class="fw-bold" style="font-size:26px;">0.00</td>
                                <td></td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

        <div class="card border-0 shadow-sm rounded-4">
            <div class="card-body p-4">
                <div class="row g-3">
                    <div class="col-md-6">
                        <label class="form-label fw-semibold">কাস্টমার নাম</label>
                        <input type="text" class="form-control form-control-lg rounded-3">
                    </div>
                    <div class="col-md-6">
                        <label class="form-label fw-semibold">মোবাইল</label>
                        <input type="text" class="form-control form-control-lg rounded-3">
                    </div>
                    <div class="col-12">
                        <label class="form-label fw-semibold">ঠিকানা</label>
                        <input type="text" class="form-control form-control-lg rounded-3">
                    </div>
                </div>

                <div class="d-flex flex-wrap gap-2 mt-3">
                    <button class="btn btn-dark rounded-3 px-4 fw-semibold">সংরক্ষণ ও প্রিন্ট</button>
                    <a href="{{ route('admin.sales.index') }}" class="btn btn-light border rounded-3 px-4 fw-semibold">সব বিক্রয়</a>
                </div>
            </div>
        </div>
    </div>
</div>
<style>
.table thead th{font-size:16px;font-weight:700;text-align:center;background:#fff;padding:12px 10px;white-space:nowrap;}
.table tbody td{padding:10px 8px;vertical-align:middle;font-size:16px;color:#0f172a;}
</style>
@endsection
