@extends('admin.layout')
@section('title', 'Send Bulk Email')
@section('content')

<div style="display:grid;grid-template-columns:1fr 1fr;gap:18px">
    <div class="stat-card">
        <h3 style="font-size:14px;font-weight:600;margin-bottom:16px">Compose Email</h3>
        <form method="POST" action="{{ route('admin.email.send') }}" style="display:flex;flex-direction:column;gap:12px">
            @csrf
            <div>
                <label class="stat-card-label" style="margin-bottom:4px">Recipients</label>
                <div style="display:flex;flex-direction:column;gap:6px;padding:4px 0">
                    <label style="display:flex;align-items:center;gap:7px;cursor:pointer;font-size:12px;color:var(--text-primary)"><input type="checkbox" name="all_active" style="width:15px;height:15px;accent-color:var(--brand)" onchange="uncheckOthers(this)"> All Active Users</label>
                    <label style="display:flex;align-items:center;gap:7px;cursor:pointer;font-size:12px;color:var(--text-primary)"><input type="checkbox" name="trial_users" style="width:15px;height:15px;accent-color:var(--brand)" onchange="uncheckOthers(this)"> Trial Users</label>
                    <label style="display:flex;align-items:center;gap:7px;cursor:pointer;font-size:12px;color:var(--text-primary)"><input type="checkbox" name="expiring_soon" style="width:15px;height:15px;accent-color:var(--brand)" onchange="uncheckOthers(this)"> Expiring Within 7 Days</label>
                </div>
            </div>
            <div><label class="stat-card-label" style="margin-bottom:3px">Subject</label><input type="text" name="subject" class="input" required placeholder="Email subject..."></div>
            <div><label class="stat-card-label" style="margin-bottom:3px">Message</label><textarea name="message" class="input" rows="5" required placeholder="Your message... Use {name} for recipient name"></textarea></div>
            <button type="submit" class="btn btn-primary">Send Email</button>
        </form>
    </div>
    <div class="stat-card">
        <h3 style="font-size:14px;font-weight:600;margin-bottom:16px">Active Tenants ({{ $tenants->count() }})</h3>
        <div style="max-height:400px;overflow-y:auto">
            @foreach($tenants as $t)
            <div style="display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--border)">
                <div>
                    <div style="font-weight:600;font-size:12px">{{ $t->name }}</div>
                    <div style="font-size:10px;color:var(--text-muted)">{{ $t->users->first()->email ?? '—' }}</div>
                </div>
                <span class="badge badge-{{ $t->subscription_status === 'active' ? 'success' : 'info' }}">{{ ucfirst($t->subscription_status) }}</span>
            </div>
            @endforeach
        </div>
    </div>
</div>

<script>function uncheckOthers(el){document.querySelectorAll('input[type=checkbox]').forEach(c=>{if(c!==el)c.checked=false;});}</script>
@endsection