@extends('layouts.app')
@section('title', 'Pharmacy | Settings')
@section('content')
<div class="mb-4"><h1 class="text-lg font-bold text-gray-900">Pharmacy Settings</h1><p class="text-xs text-gray-400">Configure drug categories, units, dosage forms, frequencies, pricing rules, and dispensing rules</p></div>

<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
    {{-- Drug Categories --}}
    <div class="bg-white rounded-xl border shadow-sm p-5">
        <h3 class="text-sm font-bold text-gray-800 mb-3 flex items-center gap-2">
            <svg class="w-4 h-4 text-cr-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 7h.01M7 3h5c.512 0 1.024.195 1.414.586l7 7a2 2 0 010 2.828l-7 7a2 2 0 01-2.828 0l-7-7A2 2 0 013 12V7a4 4 0 014-4z"/></svg>
            Drug Categories
        </h3>
        <div class="space-y-1 mb-3">
            @foreach($categories ?? ['Analgesics','Antibiotics','Antivirals','Cardiovascular','Dermatological','Gastrointestinal','Vitamins','OTC General'] as $cat)
            <div class="flex items-center justify-between px-3 py-2 bg-gray-50 rounded-lg text-xs"><span>{{ $cat }}</span><button class="text-gray-400 hover:text-red-500">&times;</button></div>
            @endforeach
        </div>
        <div class="flex gap-1"><input type="text" placeholder="New category…" class="form-input text-xs flex-1"><button class="btn-primary text-xs px-3">Add</button></div>
    </div>

    {{-- Units of Measure --}}
    <div class="bg-white rounded-xl border shadow-sm p-5">
        <h3 class="text-sm font-bold text-gray-800 mb-3 flex items-center gap-2">
            <svg class="w-4 h-4 text-cr-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 6l3 1m0 0l-3 9a5.002 5.002 0 006.001 0M6 7l3 9M6 7l6-2m6 2l3-1m-3 1l-3 9a5.002 5.002 0 006.001 0M18 7l3 9m-3-9l-6-2m0-2v2m0 16V5m0 16H9m3 0h3"/></svg>
            Units of Measure
        </h3>
        <div class="space-y-1 mb-3">
            @foreach(['Tablets','Capsules','Bottle','Sachet','Ampoule','Tube','Vial','mL','mg','g'] as $u)
            <div class="flex items-center justify-between px-3 py-2 bg-gray-50 rounded-lg text-xs"><span>{{ $u }}</span><button class="text-gray-400 hover:text-red-500">&times;</button></div>
            @endforeach
        </div>
        <div class="flex gap-1"><input type="text" placeholder="New unit…" class="form-input text-xs flex-1"><button class="btn-primary text-xs px-3">Add</button></div>
    </div>

    {{-- Dosage Forms --}}
    <div class="bg-white rounded-xl border shadow-sm p-5">
        <h3 class="text-sm font-bold text-gray-800 mb-3 flex items-center gap-2">
            <svg class="w-4 h-4 text-cr-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z"/></svg>
            Dosage Forms
        </h3>
        <div class="space-y-1 mb-3">
            @foreach(['Tablet','Capsule','Syrup','Injection','Cream','Ointment','Drops','Inhaler','Suspension','Suppository'] as $f)
            <div class="flex items-center justify-between px-3 py-2 bg-gray-50 rounded-lg text-xs"><span>{{ $f }}</span><button class="text-gray-400 hover:text-red-500">&times;</button></div>
            @endforeach
        </div>
        <div class="flex gap-1"><input type="text" placeholder="New form…" class="form-input text-xs flex-1"><button class="btn-primary text-xs px-3">Add</button></div>
    </div>

    {{-- Frequencies --}}
    <div class="bg-white rounded-xl border shadow-sm p-5">
        <h3 class="text-sm font-bold text-gray-800 mb-3">Frequencies / Schedules</h3>
        <div class="space-y-1 mb-3">
            @foreach(['OD (Once daily)','BD (Twice daily)','TDS (Three times)','QDS (Four times)','STAT (Immediately)','PRN (As needed)','Nocte (At night)','Weekly'] as $freq)
            <div class="flex items-center justify-between px-3 py-2 bg-gray-50 rounded-lg text-xs"><span>{{ $freq }}</span><button class="text-gray-400 hover:text-red-500">&times;</button></div>
            @endforeach
        </div>
        <div class="flex gap-1"><input type="text" placeholder="New frequency…" class="form-input text-xs flex-1"><button class="btn-primary text-xs px-3">Add</button></div>
    </div>

    {{-- Pricing Rules --}}
    <div class="bg-white rounded-xl border shadow-sm p-5">
        <h3 class="text-sm font-bold text-gray-800 mb-3">Pricing Rules</h3>
        <div class="space-y-3 text-xs">
            <div><label class="form-label">Default Markup (%)</label><input type="number" value="30" class="form-input text-xs"></div>
            <div><label class="form-label">Insurance Pricing</label><select class="form-input text-xs"><option>Use selling price</option><option>Use cost + markup</option><option>Use payer-specific price</option></select></div>
            <div><label class="form-label">Allow OTC Discounts</label><select class="form-input text-xs"><option>Yes</option><option>No</option></select></div>
        </div>
    </div>

    {{-- Dispensing Rules --}}
    <div class="bg-white rounded-xl border shadow-sm p-5">
        <h3 class="text-sm font-bold text-gray-800 mb-3">Dispensing Rules</h3>
        <div class="space-y-3 text-xs">
            <div><label class="form-label">Require Payment Before Dispense (OPD)</label><select class="form-input text-xs"><option>Yes</option><option>No</option></select></div>
            <div><label class="form-label">Allow Substitution</label><select class="form-input text-xs"><option>With pharmacist approval</option><option>No</option><option>Always</option></select></div>
            <div><label class="form-label">Allow Partial Dispense</label><select class="form-input text-xs"><option>Yes</option><option>No</option></select></div>
            <div><label class="form-label">Allow Negative Stock</label><select class="form-input text-xs"><option>No</option><option>Yes with override</option></select></div>
            <div><label class="form-label">FEFO Enforcement</label><select class="form-input text-xs"><option>Strict (auto-select)</option><option>Suggested (manual override)</option></select></div>
        </div>
    </div>
</div>

<div class="mt-4 flex justify-end"><button class="btn-primary">Save Settings</button></div>
@endsection