@extends('layouts.admin')

@section('title', ($target->exists ? 'Редагувати' : 'Створити').' норму')
@section('page_title', ($target->exists ? 'Редагувати' : 'Створити').' норму')

@push('head')
    <style>
        .mt-card {
            border-radius: 14px;
            border: 1px solid rgba(148,163,184,.35);
            background: radial-gradient(circle at top left, #e0f2fe 0, #ffffff 40%, #f8fafc 100%);
            box-shadow: 0 10px 30px rgba(15,23,42,.08);
        }
        .mt-section-title {
            font-size: .85rem;
            text-transform: uppercase;
            letter-spacing: .1em;
            color: #64748b;
            font-weight: 600;
        }
        .mt-hint {
            font-size: .8rem;
            color: #94a3b8;
        }
        .row-gap-16 > [class^="col-"],
        .row-gap-16 > [class*=" col-"] {
            margin-bottom: 16px;
        }
        .mt-section-header {
            display: flex;
            align-items: center;
            margin-bottom: .35rem;
        }
        .mt-section-header i {
            font-size: .9rem;
            margin-right: .4rem;
            color: #3b82f6;
        }
        .mt-divider-label {
            font-size: .75rem;
            text-transform: uppercase;
            letter-spacing: .16em;
            color: #9ca3af;
            display: inline-block;
            padding: 0 .6rem;
            background: #f9fafb;
            border-radius: 999px;
        }
        .mt-divider {
            display: flex;
            align-items: center;
            margin: 1.25rem 0 .9rem;
        }
        .mt-divider::before,
        .mt-divider::after {
            content: "";
            flex: 1;
            height: 1px;
            background: rgba(148,163,184,.45);
        }
        .mt-divider span {
            margin: 0 .75rem;
        }
    </style>
@endpush

@section('content')
    <form action="{{ $action }}" method="POST" class="mt-card p-3 p-md-4">
        @csrf
        @if($method === 'PUT') @method('PUT') @endif

        {{-- Верхній блок: кабінет + місяць --}}
        <div class="mt-section-header mb-1">
            <i class="fas fa-sliders-h"></i>
            <div class="mt-section-title">Базові параметри</div>
        </div>
        <div class="mt-hint mb-3">
            Вкажи, для якого місяця та кабінету діють ці норми. Якщо обрати "Глобальна норма" – вона буде застосована
            до всіх кабінетів, де немає своїх індивідуальних значень.
        </div>

        <div class="form-row row-gap-16">
            <div class="form-group col-md-5">
                <label>Кабінет (необовʼязково)</label>
                <select name="cabinet_id" class="form-control">
                    <option value="-1"
                        {{ (string)old('cabinet_id', $target->cabinet_id ?? '-1') === '-1' ? 'selected' : '' }}>
                        Глобальна норма (для всіх)
                    </option>
                    @foreach($cabinets as $c)
                        <option value="{{ $c->id }}"
                            {{ (string)old('cabinet_id', $target->cabinet_id ?? '-1') === (string)$c->id ? 'selected' : '' }}>
                            {{ $c->slug }} — {{ $c->name }}
                        </option>
                    @endforeach
                </select>
                @error('cabinet_id')
                <div class="text-danger small">{{ $message }}</div>
                @enderror
            </div>

            <div class="form-group col-md-3">
                <label>Місяць</label>
                <input
                    type="month"
                    name="month"
                    value="{{ old('month', optional($target->month)->format('Y-m')) }}"
                    class="form-control"
                    required
                >
                @error('month')
                <div class="text-danger small">{{ $message }}</div>
                @enderror
            </div>
        </div>

        {{-- Розділювач --}}
        <div class="mt-divider">
            <span class="mt-divider-label">Норми по статистиці</span>
        </div>

        {{-- Блок: таргети по статистиці кабінету --}}
        <div class="mt-hint mb-2">
            Ці значення будуть використовуватися у звітах по статистиці (New / Young / Old та витрати).
        </div>

        <div class="form-row row-gap-16">
            <div class="form-group col-md-2">
                <label>New</label>
                <input
                    type="number"
                    step="0.01"
                    min="0"
                    name="new_connection_target"
                    value="{{ old('new_connection_target', $target->new_connection_target ?? 0) }}"
                    class="form-control"
                    required
                >
                @error('new_connection_target')
                <div class="text-danger small">{{ $message }}</div>
                @enderror
            </div>

            <div class="form-group col-md-2">
                <label>Young</label>
                <input
                    type="number"
                    step="0.01"
                    min="0"
                    name="young_connection_target"
                    value="{{ old('young_connection_target', $target->young_connection_target ?? 0) }}"
                    class="form-control"
                    required
                >
                @error('young_connection_target')
                <div class="text-danger small">{{ $message }}</div>
                @enderror
            </div>

            <div class="form-group col-md-2">
                <label>Old</label>
                <input
                    type="number"
                    step="0.01"
                    min="0"
                    name="old_connection_target"
                    value="{{ old('old_connection_target', $target->old_connection_target ?? 0) }}"
                    class="form-control"
                    required
                >
                @error('old_connection_target')
                <div class="text-danger small">{{ $message }}</div>
                @enderror
            </div>

            <div class="form-group col-md-3">
                <label>Spend Young</label>
                <input
                    type="number"
                    step="0.01"
                    min="0"
                    name="spend_young_target"
                    value="{{ old('spend_young_target', $target->spend_young_target ?? 0) }}"
                    class="form-control"
                    required
                >
                @error('spend_young_target')
                <div class="text-danger small">{{ $message }}</div>
                @enderror
            </div>

            <div class="form-group col-md-3">
                <label>Spend Old</label>
                <input
                    type="number"
                    step="0.01"
                    min="0"
                    name="spend_old_target"
                    value="{{ old('spend_old_target', $target->spend_old_target ?? 0) }}"
                    class="form-control"
                    required
                >
                @error('spend_old_target')
                <div class="text-danger small">{{ $message }}</div>
                @enderror
            </div>
        </div>

        {{-- Розділювач --}}
        <div class="mt-divider">
            <span class="mt-divider-label">Норми по змінах (баланс)</span>
        </div>

        {{-- Блок: норми по змінах (баланс) --}}
        <div class="mt-hint mb-2">
            Ці суми використовуватимуться в адмін-графіках змін для аналізу виконання плану по кожній зміні.
            Можна міняти щомісяця. Типові значення: денна ~110$, вечірня ~160$, нічна ~160$.
        </div>

        <div class="form-row row-gap-16">
            <div class="form-group col-md-4">
                <label>Денна зміна, $</label>
                <input
                    type="number"
                    step="0.01"
                    min="0"
                    name="day_shift_target"
                    value="{{ old('day_shift_target', $target->day_shift_target ?? 0) }}"
                    placeholder="Напр., 110"
                    class="form-control"
                    required
                >
                @error('day_shift_target')
                <div class="text-danger small">{{ $message }}</div>
                @enderror
            </div>

            <div class="form-group col-md-4">
                <label>Вечірня зміна, $</label>
                <input
                    type="number"
                    step="0.01"
                    min="0"
                    name="evening_shift_target"
                    value="{{ old('evening_shift_target', $target->evening_shift_target ?? 0) }}"
                    placeholder="Напр., 160"
                    class="form-control"
                    required
                >
                @error('evening_shift_target')
                <div class="text-danger small">{{ $message }}</div>
                @enderror
            </div>

            <div class="form-group col-md-4">
                <label>Нічна зміна, $</label>
                <input
                    type="number"
                    step="0.01"
                    min="0"
                    name="night_shift_target"
                    value="{{ old('night_shift_target', $target->night_shift_target ?? 0) }}"
                    placeholder="Напр., 160"
                    class="form-control"
                    required
                >
                @error('night_shift_target')
                <div class="text-danger small">{{ $message }}</div>
                @enderror
            </div>
        </div>

        <div class="mt-3 d-flex flex-column flex-md-row justify-content-between align-items-md-center">
            <div class="mt-hint mb-2 mb-md-0">
                Після збереження ці норми будуть використовуватись у графіках та рейтингах для оцінки виконання плану.
            </div>
            <div>
                <button class="btn btn-primary">Зберегти</button>
                <a href="{{ route('admin.monthly-targets.index') }}" class="btn btn-outline-secondary ml-1">Скасувати</a>
            </div>
        </div>
    </form>
@endsection