@extends('layouts.app')

@section('title', 'Settings · Pharmacy health')

@section('content')
<div class="container-fluid">
    @include('settings._tabs')

    <div class="row g-4">
        <div class="col-xl-8">
            <form method="POST" action="{{ route('settings.pharmacy-health.update') }}" class="settings-card">
                @csrf
                <div class="settings-card-head">
                    <h6><i class="bi bi-heart-pulse me-2 text-primary"></i>Pharmacy health</h6>
                    <p class="text-muted small mb-0">Count what is on the shelf and compare it with the system. You get a health score for the
                        pharmacy, and any missing stock is recorded in Loss Prevention.</p>
                </div>
                <div class="settings-card-body">
                    @unless(plan_allows('pharmacy_health'))
                        <div class="alert alert-light border d-flex flex-wrap justify-content-between align-items-center gap-2">
                            <span><span class="badge me-1" style="background:#ede9fe;color:#6d28d9;">Pro</span> Pharmacy health is part of the Pro plan. You can set it up now; it works once you upgrade.</span>
                            <a href="{{ route('billing.index', ['tab' => 'plans']) }}" class="btn btn-sm btn-primary">See plans</a>
                        </div>
                    @endunless
                    <input type="hidden" name="pharmacy_health_enabled" value="0">
                    <div class="ph-switch {{ $enabled ? 'is-on' : '' }}">
                        <div class="form-check form-switch m-0">
                            <input class="form-check-input" type="checkbox" role="switch" id="phEnabled" name="pharmacy_health_enabled" value="1" @checked($enabled)>
                            <label class="form-check-label fw-semibold" for="phEnabled">Pharmacy health is {{ $enabled ? 'ON' : 'OFF' }}</label>
                        </div>
                        <div class="small text-muted mt-1">When on, <strong>Pharmacy health</strong> appears in the sidebar for owners and admins.</div>
                    </div>

                    <button class="btn btn-primary mt-4">Save</button>
                </div>
            </form>
        </div>
        <div class="col-xl-4">
            <div class="settings-card">
                <div class="settings-card-head"><h6><i class="bi bi-list-check me-2 text-primary"></i>How a count works</h6></div>
                <div class="settings-card-body small">
                    <ol class="ps-3 mb-0">
                        <li class="mb-1"><strong>Start a count</strong>: a surprise check of a few products (weighted to expensive, fast-selling or previously short ones), a category, or everything.</li>
                        <li class="mb-1"><strong>Count the shelf</strong> and type what you see. The system figure is hidden, so nobody can copy it.</li>
                        <li class="mb-1"><strong>Finish</strong>: each product shows matches, short or more. Shortages are valued at cost.</li>
                        <li><strong>Follow up</strong>: missing stock is recorded in Loss Prevention as the pharmacy's overall result.</li>
                    </ol>
                </div>
            </div>
        </div>
    </div>
</div>

<style>
    .ph-switch { padding: .9rem 1rem; border: 1px solid #e5e7eb; border-radius: 12px; }
    .ph-switch.is-on, .ph-switch:has(input:checked) { border-color: var(--theme-primary); background: #f0fdf4; }
</style>
@endsection