<div class="channel-row" style="background:#fff; border:1px solid #e2e8f0; border-radius:12px; padding:20px; position:relative; display:flex; flex-direction:column; gap:16px;">
    <input type="hidden" name="channels[<?php echo $index; ?>][id]" value="<?php echo h($channel['id'] ?? ''); ?>">
    
    <button type="button" onclick="this.closest('.channel-row').remove()" title="Remover Canal" style="position:absolute; top:12px; right:12px; background:transparent; border:none; padding:8px; border-radius:8px; cursor:pointer; color:#94a3b8; transition:all 0.2s;" onmouseover="this.style.background='#fee2e2'; this.style.color='#ef4444';" onmouseout="this.style.background='transparent'; this.style.color='#94a3b8';">
        <svg width="20" height="20" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"></path></svg>
    </button>

    <div style="display:grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap:16px; padding-right:24px;">
        <div>
            <label style="display:block; font-weight:600; font-size:0.85rem; color:#475569; margin-bottom:6px;">Protocolo</label>
            <select name="channels[<?php echo $index; ?>][type]" style="width:100%; border:1px solid #cbd5e1; border-radius:8px; padding:10px 14px; font-size:0.95rem; background:#f8fafc;">
                <option value="email" <?php echo (($channel['type'] ?? '') === 'email') ? 'selected' : ''; ?>>E-mail Dirigido</option>
                <option value="webhook" <?php echo (($channel['type'] ?? '') === 'webhook') ? 'selected' : ''; ?>>Webhook Endereço (API)</option>
                <option value="sms" <?php echo (($channel['type'] ?? '') === 'sms') ? 'selected' : ''; ?>>Notificação SMS</option>
                <option value="whatsapp" <?php echo (($channel['type'] ?? '') === 'whatsapp') ? 'selected' : ''; ?>>WhatsApp (Gateway Global)</option>
            </select>
        </div>
        <div style="grid-column: span 2;">
            <label style="display:block; font-weight:600; font-size:0.85rem; color:#475569; margin-bottom:6px;">Destino / Endpoint (Hook)</label>
            <input type="text" name="channels[<?php echo $index; ?>][target]" value="<?php echo h($channel['target'] ?? ''); ?>" placeholder="Ex: adelson@exemplo.com ou https://n8n.meusite.com/webhook" style="width:100%; border:1px solid #cbd5e1; border-radius:8px; padding:10px 14px; font-size:0.95rem;">
        </div>
    </div>

    <div style="display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap:16px; background:#f8fafc; padding:16px; border-radius:10px; border:1px solid #e2e8f0;">
        <div>
            <label style="display:block; font-weight:600; font-size:0.85rem; color:#475569; margin-bottom:6px;">Gatilho (Min. Falhas)</label>
            <input type="number" name="channels[<?php echo $index; ?>][min_failures]" min="1" value="<?php echo h($channel['min_failures'] ?? 1); ?>" style="width:100%; border:1px solid #cbd5e1; border-radius:8px; padding:8px 12px; font-size:0.9rem;">
        </div>
        <div>
            <label style="display:block; font-weight:600; font-size:0.85rem; color:#475569; margin-bottom:6px;">Cooldown Reenvio (min)</label>
            <input type="number" name="channels[<?php echo $index; ?>][cooldown_minutes]" min="0" value="<?php echo h($channel['cooldown_minutes'] ?? 0); ?>" style="width:100%; border:1px solid #cbd5e1; border-radius:8px; padding:8px 12px; font-size:0.9rem;">
        </div>
        <div>
            <label style="display:block; font-weight:600; font-size:0.85rem; color:#475569; margin-bottom:6px;">Silenciar Início (HH:MM)</label>
            <input type="time" name="channels[<?php echo $index; ?>][silence_start]" value="<?php echo h(substr((string)($channel['silence_start'] ?? ''), 0, 5)); ?>" style="width:100%; border:1px solid #cbd5e1; border-radius:8px; padding:8px 12px; font-size:0.9rem;">
        </div>
        <div>
            <label style="display:block; font-weight:600; font-size:0.85rem; color:#475569; margin-bottom:6px;">Silenciar Fim (HH:MM)</label>
            <input type="time" name="channels[<?php echo $index; ?>][silence_end]" value="<?php echo h(substr((string)($channel['silence_end'] ?? ''), 0, 5)); ?>" style="width:100%; border:1px solid #cbd5e1; border-radius:8px; padding:8px 12px; font-size:0.9rem;">
        </div>
    </div>

    <div style="display:flex; align-items:center; gap:8px;">
        <label style="display:flex; align-items:center; gap:8px; cursor:pointer;">
            <input type="checkbox" name="channels[<?php echo $index; ?>][active]" <?php echo (($channel['active'] ?? 1) ? 'checked' : ''); ?> style="width:18px; height:18px; accent-color:#3b82f6; margin:0;">
            <span style="font-weight:600; color:#0f172a; font-size:0.9rem;">Ativar Regra de Canal</span>
        </label>
    </div>
</div>
