@extends('admin.panel.layout')

@section('admin_title', $mode === 'edit' ? 'App bearbeiten' : 'App anlegen')

@section('admin_content')
    <div class="admin-header">
        <div>
            <span class="shop-muted-label">Apps</span>
            <h1>{{ $mode === 'edit' ? $app->name : 'Neue App' }}</h1>
        </div>
        <div class="admin-toolbar">
            <a class="shop-button-light" href="{{ route('admin.applinks.index') }}"><i class="fas fa-arrow-left"></i> Zurück</a>
        </div>
    </div>

    @if($errors->any())
        <div class="flash-banner flash-banner-error">Bitte prüfe die Eingaben.</div>
    @endif

    <div class="admin-panel">
        <form method="POST" action="{{ $mode === 'edit' ? route('admin.applinks.update', $app) : route('admin.applinks.store') }}">
            @csrf
            @if($mode === 'edit') @method('PUT') @endif

            <div class="shop-field">
                <label class="shop-label" for="name">Name</label>
                <input class="shop-input" id="name" name="name" value="{{ old('name', $app->name) }}" placeholder="z. B. Convertly" required>
                @error('name')<div class="validation-error">{{ $message }}</div>@enderror
            </div>

            <div class="shop-field">
                <label class="shop-label" for="slug">Slug (URL)</label>
                <input class="shop-input" id="slug" name="slug" value="{{ old('slug', $app->slug) }}" placeholder="convertly">
                <div class="shop-note">Ergibt <code>kotsch.tech/apps/&lt;slug&gt;</code>. Leer lassen → aus dem Namen. Nur Kleinbuchstaben, Zahlen, Bindestrich.</div>
                @error('slug')<div class="validation-error">{{ $message }}</div>@enderror
            </div>

            <div class="shop-field">
                <label class="shop-label" for="accent">Akzentfarbe (optional)</label>
                <input class="shop-input" id="accent" name="accent" value="{{ old('accent', $app->accent) }}" placeholder="#64748B" style="max-width:180px">
                @error('accent')<div class="validation-error">{{ $message }}</div>@enderror
            </div>

            <hr style="border:none;border-top:1px solid var(--ap-line);margin:22px 0">
            <p class="shop-note" style="margin-bottom:14px"><i class="fas fa-circle-info"></i> Leer lassen, solange die App für die Plattform noch nicht im Store ist — dann wird dort Interesse abgefragt und gezählt.</p>

            <div class="shop-field">
                <label class="shop-label" for="ios_url"><i class="fab fa-apple"></i> App-Store-Link (iPhone/iPad/Mac)</label>
                <input class="shop-input" id="ios_url" name="ios_url" value="{{ old('ios_url', $app->ios_url) }}" placeholder="https://apps.apple.com/...">
                @error('ios_url')<div class="validation-error">{{ $message }}</div>@enderror
            </div>

            <div class="shop-field">
                <label class="shop-label" for="android_url"><i class="fab fa-android"></i> Play-Store-Link (Android)</label>
                <input class="shop-input" id="android_url" name="android_url" value="{{ old('android_url', $app->android_url) }}" placeholder="https://play.google.com/store/apps/...">
                @error('android_url')<div class="validation-error">{{ $message }}</div>@enderror
            </div>

            <div class="shop-field">
                <label class="shop-label" for="windows_url"><i class="fab fa-windows"></i> Windows-Link</label>
                <input class="shop-input" id="windows_url" name="windows_url" value="{{ old('windows_url', $app->windows_url) }}" placeholder="https://apps.microsoft.com/...">
                @error('windows_url')<div class="validation-error">{{ $message }}</div>@enderror
            </div>

            <div class="shop-field">
                <label style="display:flex;align-items:center;gap:10px;cursor:pointer;font-weight:700;color:var(--ap-ink)">
                    <input type="checkbox" name="active" value="1" {{ old('active', $app->active) ? 'checked' : '' }} style="width:18px;height:18px">
                    Aktiv (Link erreichbar)
                </label>
            </div>

            <div style="display:flex;gap:12px;margin-top:8px">
                <button class="shop-button" type="submit"><i class="fas fa-check"></i> Speichern</button>
                <a class="shop-button-light" href="{{ route('admin.applinks.index') }}">Abbrechen</a>
            </div>
        </form>
    </div>

    @if($mode === 'edit')
        <div class="admin-panel">
            <h3>Smart-Link &amp; Interesse</h3>
            <p class="shop-copy" style="margin:8px 0 16px">Teilbarer Link:
                <a href="{{ route('applink.show', $app->slug) }}" target="_blank" style="color:var(--ap-brand);font-weight:700">{{ route('applink.show', $app->slug) }}</a>
            </p>
            <div class="admin-card-grid">
                <div class="admin-metric-card"><span><i class="fab fa-apple"></i> Interesse iOS</span><strong>{{ $app->interest_ios }}</strong></div>
                <div class="admin-metric-card"><span><i class="fab fa-android"></i> Interesse Android</span><strong>{{ $app->interest_android }}</strong></div>
                <div class="admin-metric-card"><span><i class="fab fa-windows"></i> Interesse Windows</span><strong>{{ $app->interest_windows }}</strong></div>
            </div>
        </div>
    @endif
@endsection