// app/Professor/Estagios/index.tsx
import { Ionicons } from '@expo/vector-icons';
import { useRouter } from 'expo-router';
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import {
  ActivityIndicator,
  Animated,
  Modal,
  ScrollView,
  StatusBar,
  StyleSheet,
  Switch,
  Text,
  TextInput,
  TouchableOpacity, // 🟢 NOVO: Importado para os botões de regras
  View
} from 'react-native';
import { SafeAreaView, useSafeAreaInsets } from 'react-native-safe-area-context';
import { supabase } from '../../../lib/supabase';
import { useTheme } from '../../../themecontext';

// --- Interfaces ---
interface Aluno { id: string; nome: string; turma_curso: string; ano: number; n_escola?: string; }
interface Empresa { id: string; nome: string; morada: string; tutor_nome: string; tutor_telefone: string; curso: string; }
interface Estagio {
  id: string;
  aluno_id: string;
  empresa_id: string;
  data_inicio: string;
  data_fim: string;
  horas_diarias?: string;
  horas_totais?: number;
  permite_sabados?: boolean;  // 🟢 NOVO
  permite_domingos?: boolean; // 🟢 NOVO
  permite_feriados?: boolean; // 🟢 NOVO
  alunos: { nome: string; turma_curso: string; ano: number };
  empresas: { id: string; nome: string; morada: string; tutor_nome: string; tutor_telefone: string; curso: string };
}

// Configuração PT-PT para Feriados e afins
const getFeriadosMap = (ano: number) => ({
  [`${ano}-01-01`]: "Ano Novo", [`${ano}-04-25`]: "Dia da Liberdade",
  [`${ano}-05-01`]: "Dia do Trabalhador", [`${ano}-06-10`]: "Dia de Portugal",
  [`${ano}-06-24`]: "São João (Vila do Conde)", [`${ano}-08-15`]: "Assunção de Nª Senhora",
  [`${ano}-10-05`]: "Implantação da República", [`${ano}-11-01`]: "Todos os Santos",
  [`${ano}-12-01`]: "Restauração da Independência", [`${ano}-12-08`]: "Imaculada Conceição",
  [`${ano}-12-25`]: "Natal"
});

export default function Estagios() {
  const router = useRouter();
  const { isDarkMode } = useTheme();
  const insets = useSafeAreaInsets();
  
  const azulEPVC = '#2390a6';
  const laranjaEPVC = '#E38E00';
  const erroCor = '#EF4444';
  const sucessoCor = '#10B981';

  const cores = useMemo(() => ({
    fundo: isDarkMode ? '#0A0A0A' : '#F4F7FA',
    card: isDarkMode ? '#161618' : '#FFFFFF',
    texto: isDarkMode ? '#F8FAFC' : '#1E293B',
    secundario: isDarkMode ? '#94A3B8' : '#64748B',
    azul: azulEPVC,
    laranja: laranjaEPVC,
    azulSuave: isDarkMode ? 'rgba(35, 144, 166, 0.15)' : '#E0F2F4',
    vermelhoSuave: isDarkMode ? 'rgba(239, 68, 68, 0.15)' : '#FEE2E2',
    laranjaSuave: isDarkMode ? 'rgba(227, 142, 0, 0.15)' : '#FEF3E6',
    verde: sucessoCor,
    vermelho: erroCor,
    borda: isDarkMode ? '#2D2D2D' : '#E2E8F0',
    inputFundo: isDarkMode ? '#252525' : '#FBFDFF',
    overlay: 'rgba(0, 0, 0, 0.6)',
  }), [isDarkMode]);

  // Estados
  const [estagios, setEstagios] = useState<Estagio[]>([]);
  const [alunos, setAlunos] = useState<Aluno[]>([]);
  const [empresas, setEmpresas] = useState<Empresa[]>([]);
  const [loading, setLoading] = useState(true);
  const [modalVisible, setModalVisible] = useState(false);
  const [deleteModalVisible, setDeleteModalVisible] = useState(false);
  
  // TOAST ANIMADO
  const [toast, setToast] = useState<{ visible: boolean; message: string; type: 'error' | 'success' | 'info' }>({ visible: false, message: '', type: 'info' });
  const slideAnim = useRef(new Animated.Value(-100)).current;

  // ESTADO DO ALERTA CUSTOMIZADO
  const [customAlert, setCustomAlert] = useState({ visible: false, title: '', msg: '', tipo: 'warning' as 'warning' | 'error' });

  const [estagioParaApagar, setEstagioParaApagar] = useState<{id: string, nome: string} | null>(null);
  const [passo, setPasso] = useState(1);
  const [alunoSelecionado, setAlunoSelecionado] = useState<Aluno | null>(null);
  const [empresaSelecionada, setEmpresaSelecionada] = useState<Empresa | null>(null);
  const [editandoEstagio, setEditandoEstagio] = useState<Estagio | null>(null);
  
  // Datas e Horas Totais
  const [dataInicio, setDataInicio] = useState('');
  const [dataFim, setDataFim] = useState('');
  const [horasTotaisEstagio, setHorasTotaisEstagio] = useState('');
  const [searchMain, setSearchMain] = useState('');
  
  // Estados de Pesquisa do Modal
  const [pesquisaAluno, setPesquisaAluno] = useState('');
  const [pesquisaEmpresa, setPesquisaEmpresa] = useState('');

  // Horários Diários
  const [hManhaIni, setHManhaIni] = useState('');
  const [hManhaFim, setHManhaFim] = useState('');
  const [hTardeIni, setHTardeIni] = useState('');
  const [hTardeFim, setHTardeFim] = useState('');

  // 🟢 NOVO: Estados para as Regras de Assiduidade
  const [permiteSabados, setPermiteSabados] = useState(false);
  const [permiteDomingos, setPermiteDomingos] = useState(false);
  const [permiteFeriados, setPermiteFeriados] = useState(false);

  const showToast = useCallback((message: string, type: 'error' | 'success' | 'info' = 'info') => {
    setToast({ visible: true, message, type });
    Animated.timing(slideAnim, { toValue: insets.top + 10, duration: 300, useNativeDriver: true }).start(() => {
      setTimeout(() => {
        Animated.timing(slideAnim, { toValue: -100, duration: 300, useNativeDriver: true })
          .start(() => setToast({ visible: false, message: '', type: 'info' }));
      }, 3500);
    });
  }, [insets.top, slideAnim]);

  const showCustomAlert = (title: string, msg: string, tipo: 'warning' | 'error' = 'warning') => {
    setCustomAlert({ visible: true, title, msg, tipo });
  };

  useEffect(() => { fetchDados(); }, []);

  const fetchDados = async () => {
    try {
      setLoading(true);
      const [resEstagios, resAlunos, resEmpresas] = await Promise.all([
        supabase.from('estagios').select('*, alunos(nome, turma_curso, ano), empresas(*)'),
        supabase.from('alunos').select('id, nome, turma_curso, ano, n_escola').order('nome'),
        supabase.from('empresas').select('*').order('nome')
      ]);
      if (resEstagios.data) setEstagios(resEstagios.data);
      if (resAlunos.data) setAlunos(resAlunos.data);
      if (resEmpresas.data) setEmpresas(resEmpresas.data);
    } catch (e) { 
      console.error(e); 
      showToast("Erro ao carregar os dados", "error");
    } finally { 
      setLoading(false); 
    }
  };

  const carregarHorariosEdicao = async (estagioId: string) => {
    const { data } = await supabase.from('horarios_estagio').select('*').eq('estagio_id', estagioId);
    if (data) {
      setHManhaIni(''); setHManhaFim(''); setHTardeIni(''); setHTardeFim('');
      data.forEach(h => {
        if (h.periodo === 'Manhã') {
          setHManhaIni(h.hora_inicio?.slice(0, 5) || '');
          setHManhaFim(h.hora_fim?.slice(0, 5) || '');
        } else if (h.periodo === 'Tarde') {
          setHTardeIni(h.hora_inicio?.slice(0, 5) || '');
          setHTardeFim(h.hora_fim?.slice(0, 5) || '');
        }
      });
    }
  };

  // --- FUNÇÕES DE MÁSCARA ---
  const mascararData = (text: string) => {
    const num = text.replace(/\D/g, '');
    if (num.length > 6) return `${num.slice(0, 4)}-${num.slice(4, 6)}-${num.slice(6, 8)}`;
    if (num.length > 4) return `${num.slice(0, 4)}-${num.slice(4, 6)}`;
    return num;
  };

  const aplicarMascaraHora = (value: string) => {
    const cleaned = value.replace(/\D/g, ''); 
    if (cleaned.length >= 3) {
      return `${cleaned.slice(0, 2)}:${cleaned.slice(2, 4)}`;
    }
    return cleaned;
  };

  // --- FUNÇÃO PARA HORÁRIOS RÁPIDOS ---
  const preencherHorario = (tipo: 'laboral' | 'manha' | 'tarde' | 'limpar') => {
    if (tipo === 'laboral') {
      setHManhaIni('09:00'); setHManhaFim('13:00'); setHTardeIni('14:00'); setHTardeFim('18:00');
    } else if (tipo === 'manha') {
      setHManhaIni('09:00'); setHManhaFim('13:00'); setHTardeIni(''); setHTardeFim('');
    } else if (tipo === 'tarde') {
      setHManhaIni(''); setHManhaFim(''); setHTardeIni('14:00'); setHTardeFim('18:00');
    } else {
      setHManhaIni(''); setHManhaFim(''); setHTardeIni(''); setHTardeFim('');
    }
  };

  const totalHorasDiarias = useMemo(() => {
    const calcularMinutos = (ini: string, fim: string) => {
      if (!ini || !fim || !ini.includes(':') || !fim.includes(':')) return 0;
      const [hI, mI] = ini.split(':').map(Number);
      const [hF, mF] = fim.split(':').map(Number);
      const totalI = (hI || 0) * 60 + (mI || 0);
      const totalF = (hF || 0) * 60 + (mF || 0);
      return totalF > totalI ? totalF - totalI : 0;
    };
    const totalMinutos = calcularMinutos(hManhaIni, hManhaFim) + calcularMinutos(hTardeIni, hTardeFim);
    const h = Math.floor(totalMinutos / 60);
    const m = totalMinutos % 60;
    return m > 0 ? `${h}h${m}m` : `${h}h`;
  }, [hManhaIni, hManhaFim, hTardeIni, hTardeFim]);

  const formatarHoraPostgres = (time: string) => {
    if (!time || !time.includes(':')) return null;
    const [h, m] = time.split(':');
    return `${h.padStart(2, '0')}:${m.padStart(2, '0')}`;
  };

  // 🟢 NOVO: A magia agora respeita as regras de assiduidade!
  const calcularMagia = (tipo: 'dataFim' | 'horasTotais') => {
    if (!dataInicio || dataInicio.length < 10) return showCustomAlert("Atenção", "Preenche a Data de Início completa primeiro!");
    if (!hManhaIni && !hTardeIni) return showCustomAlert("Atenção", "Preenche primeiro o horário diário (Manhã e/ou Tarde)!");

    const matchH = totalHorasDiarias.match(/(\d+)h/);
    const matchM = totalHorasDiarias.match(/(\d+)m/);
    const horasD = (matchH ? parseInt(matchH[1]) : 0) + (matchM ? parseInt(matchM[1]) / 60 : 0);

    if (horasD <= 0) return showCustomAlert("Atenção", "O horário diário tem de ser superior a zero.", 'error');

    if (tipo === 'dataFim') {
      const totais = parseInt(horasTotaisEstagio);
      if (!totais || totais <= 0) return showCustomAlert("Atenção", "Preenche as Horas Totais primeiro!");
      
      let diasNecessarios = Math.ceil(totais / horasD);
      let currentDate = new Date(dataInicio);
      let diasContados = 0;
      
      while (diasContados < diasNecessarios) {
        const day = currentDate.getDay();
        const dateStr = currentDate.toISOString().split('T')[0];
        const feriadosMapAno = getFeriadosMap(currentDate.getFullYear());
        
        let diaValidoParaContar = true;
        
        if (day === 6 && !permiteSabados) diaValidoParaContar = false;
        if (day === 0 && !permiteDomingos) diaValidoParaContar = false;
        if (feriadosMapAno[dateStr] && !permiteFeriados) diaValidoParaContar = false;
        
        if (diaValidoParaContar) {
          diasContados++;
        }
        if (diasContados < diasNecessarios) {
          currentDate.setDate(currentDate.getDate() + 1);
        }
      }
      setDataFim(currentDate.toISOString().split('T')[0]);

    } else if (tipo === 'horasTotais') {
      if (!dataFim || dataFim.length < 10) return showCustomAlert("Atenção", "Preenche a Data Fim completa primeiro!");
      
      let currentDate = new Date(dataInicio);
      const endDate = new Date(dataFim);
      let diasUteis = 0;
      
      if (currentDate > endDate) return showCustomAlert("Atenção", "A Data de Início não pode ser depois da Data Fim!", 'error');

      while (currentDate <= endDate) {
        const day = currentDate.getDay();
        const dateStr = currentDate.toISOString().split('T')[0];
        const feriadosMapAno = getFeriadosMap(currentDate.getFullYear());
        
        let diaValidoParaContar = true;
        
        if (day === 6 && !permiteSabados) diaValidoParaContar = false;
        if (day === 0 && !permiteDomingos) diaValidoParaContar = false;
        if (feriadosMapAno[dateStr] && !permiteFeriados) diaValidoParaContar = false;
        
        if (diaValidoParaContar) {
          diasUteis++;
        }
        currentDate.setDate(currentDate.getDate() + 1);
      }
      
      const calculoFinal = Math.round(diasUteis * horasD);
      setHorasTotaisEstagio(calculoFinal.toString());
    }
  };

  const salvarEstagio = async () => {
    const matchH = totalHorasDiarias.match(/(\d+)h/);
    const matchM = totalHorasDiarias.match(/(\d+)m/);
    const horasD = (matchH ? parseInt(matchH[1]) : 0) + (matchM ? parseInt(matchM[1]) / 60 : 0);

    if (horasD <= 0) {
      return showCustomAlert("Erro de Horário", "O aluno tem de ter um horário válido (maior que 0 horas).", 'error');
    }

    if (horasD > 8) {
      return showCustomAlert(
        "Limite Legal Excedido", 
        "Por lei, um aluno em Formação em Contexto de Trabalho (FCT) não pode exceder as 8 horas diárias.",
        'error'
      );
    }

    if (dataFim && dataInicio > dataFim) {
      return showCustomAlert("Datas Inválidas", "A data de fim do estágio não pode ser anterior à data de início.", 'error');
    }

    const totais = parseInt(horasTotaisEstagio);
    if (!totais || totais <= 0) {
      return showCustomAlert("Horas Totais", "Indica o número total de horas que o aluno tem de cumprir (Ex: 400).", 'warning');
    }

    setLoading(true);
    try {
      const { data: { user } } = await supabase.auth.getUser();
      
      if (empresaSelecionada) {
        await supabase.from('empresas').update({
          tutor_nome: empresaSelecionada.tutor_nome,
          tutor_telefone: empresaSelecionada.tutor_telefone
        }).eq('id', empresaSelecionada.id);
      }

      // 🟢 NOVO: Payload atualizado com as permissões
      const payload = {
        aluno_id: alunoSelecionado?.id,
        empresa_id: empresaSelecionada?.id,
        professor_id: user?.id,
        data_inicio: dataInicio || new Date().toISOString().split('T')[0],
        data_fim: dataFim || null,
        horas_diarias: totalHorasDiarias,
        horas_totais: totais,
        estado: 'Ativo',
        permite_sabados: permiteSabados,
        permite_domingos: permiteDomingos,
        permite_feriados: permiteFeriados
      };

      const { data: estData, error: errE } = editandoEstagio 
        ? await supabase.from('estagios').update(payload).eq('id', editandoEstagio.id).select().single()
        : await supabase.from('estagios').insert([payload]).select().single();

      if (errE) throw errE;
      const currentId = editandoEstagio?.id || estData.id;

      await supabase.from('horarios_estagio').delete().eq('estagio_id', currentId);
      const novosHorarios = [];
      if (hManhaIni && hManhaFim) {
        novosHorarios.push({ estagio_id: currentId, periodo: 'Manhã', hora_inicio: formatarHoraPostgres(hManhaIni), hora_fim: formatarHoraPostgres(hManhaFim) });
      }
      if (hTardeIni && hTardeFim) {
        novosHorarios.push({ estagio_id: currentId, periodo: 'Tarde', hora_inicio: formatarHoraPostgres(hTardeIni), hora_fim: formatarHoraPostgres(hTardeFim) });
      }
      if (novosHorarios.length > 0) await supabase.from('horarios_estagio').insert(novosHorarios);

      handleFecharModal();
      fetchDados();
      showToast("Plano de estágio guardado com sucesso!", "success");
    } catch (error: any) { 
      showCustomAlert("Erro ao Guardar", error.message, 'error'); 
    } finally { 
      setLoading(false); 
    }
  };

  const confirmarEliminacao = async () => {
    if (!estagioParaApagar) return;
    setLoading(true);
    const { error } = await supabase.from('estagios').delete().eq('id', estagioParaApagar.id);
    if (!error) { 
      setDeleteModalVisible(false); 
      fetchDados(); 
      showToast("Estágio apagado com sucesso.", "success");
    } else {
      showToast("Erro ao apagar o estágio.", "error");
    }
    setLoading(false);
  };

  const handleFecharModal = () => {
    setModalVisible(false); setEditandoEstagio(null); setAlunoSelecionado(null); setEmpresaSelecionada(null);
    setDataInicio(''); setDataFim(''); setHorasTotaisEstagio(''); setHManhaIni(''); setHManhaFim(''); setHTardeIni(''); setHTardeFim('');
    setPesquisaAluno(''); setPesquisaEmpresa('');
    // 🟢 Resetar os switches
    setPermiteSabados(false); setPermiteDomingos(false); setPermiteFeriados(false);
    setPasso(1);
  };

  // --- FILTROS ---
  const estagiosFiltrados = useMemo(() => {
    const groups: Record<string, Estagio[]> = {};
    estagios.filter(e => e.alunos?.nome?.toLowerCase().includes(searchMain.toLowerCase())).forEach(e => {
      const chave = e.alunos ? `${e.alunos.ano}º ${e.alunos.turma_curso}` : 'Geral';
      if (!groups[chave]) groups[chave] = [];
      groups[chave].push(e);
    });
    return Object.keys(groups).map(titulo => ({ titulo, dados: groups[titulo] })).sort((a, b) => b.titulo.localeCompare(a.titulo));
  }, [estagios, searchMain]);

  // Filtros em tempo real para os modais
  const alunosParaMostrar = useMemo(() => {
    return alunos.filter(a => a.nome.toLowerCase().includes(pesquisaAluno.toLowerCase()) || (a.n_escola && a.n_escola.includes(pesquisaAluno)));
  }, [alunos, pesquisaAluno]);

  const empresasParaMostrar = useMemo(() => {
    return empresas.filter(e => e.nome.toLowerCase().includes(pesquisaEmpresa.toLowerCase()));
  }, [empresas, pesquisaEmpresa]);

  return (
    <View style={{ flex: 1, backgroundColor: cores.fundo }}>
      <StatusBar barStyle={isDarkMode ? "light-content" : "dark-content"} translucent backgroundColor="transparent" />
      
      {/* 🟢 TOAST ANIMADO NO TOPO */}
      <Animated.View style={[
        styles.toastContainer, 
        { transform: [{ translateY: slideAnim }] },
        toast.type === 'error' ? { backgroundColor: cores.vermelho } : 
        toast.type === 'success' ? { backgroundColor: cores.verde } : 
        { backgroundColor: cores.azul }
      ]}>
        <Ionicons 
          name={toast.type === 'error' ? "warning" : toast.type === 'success' ? "checkmark-circle" : "information-circle"} 
          size={24} 
          color="#FFF" 
        />
        <Text style={styles.toastText}>{toast.message}</Text>
      </Animated.View>

      <SafeAreaView style={{ flex: 1 }} edges={['top', 'left', 'right']}>
        
        {/* HEADER MODERNO */}
        <View style={styles.header}>
          <TouchableOpacity style={[styles.btnAction, { borderColor: cores.borda, backgroundColor: cores.card }]} onPress={() => router.back()}>
            <Ionicons name="chevron-back" size={24} color={cores.azul}/>
          </TouchableOpacity>
          <View style={{alignItems: 'center'}}>
            <Text style={[styles.headerTitle, { color: cores.texto }]}>Plano de Estágios</Text>
            <Text style={[styles.headerSubtitle, { color: cores.laranja }]}>{estagios.length} Alunos Colocados</Text>
          </View>
          <TouchableOpacity style={[styles.btnAction, { borderColor: cores.borda, backgroundColor: cores.card }]} onPress={fetchDados}>
            <Ionicons name="reload-outline" size={20} color={cores.azul}/>
          </TouchableOpacity>
        </View>

        <ScrollView contentContainerStyle={[styles.scroll, { paddingBottom: 120 }]} showsVerticalScrollIndicator={false}>
          {/* SEARCH BAR MODERNA */}
          <View style={styles.searchSection}>
            <View style={[styles.searchBar, { backgroundColor: cores.card, borderColor: cores.borda }]}>
              <Ionicons name="search-outline" size={20} color={cores.secundario} style={{ marginRight: 10 }} />
              <TextInput 
                placeholder="Pesquisar por aluno ou turma..." 
                placeholderTextColor={cores.secundario} 
                style={[styles.searchInput, { color: cores.texto }]} 
                onChangeText={setSearchMain} 
              />
            </View>
          </View>

          {loading ? (
             <ActivityIndicator size="large" color={cores.azul} style={{marginTop: 50}} />
          ) : estagiosFiltrados.map(grupo => (
            <View key={grupo.titulo} style={{ marginBottom: 25 }}>
              <View style={styles.sectionHeader}>
                <View style={[styles.sectionDot, { backgroundColor: cores.laranja }]} />
                <Text style={[styles.sectionTitle, { color: cores.texto }]}>{grupo.titulo}</Text>
                <View style={[styles.sectionLine, { backgroundColor: cores.borda }]} />
              </View>
              
              {grupo.dados.map(e => (
                <TouchableOpacity 
                    key={e.id}
                    activeOpacity={0.8}
                    style={[styles.estagioCard, { backgroundColor: cores.card, borderColor: cores.borda }]}
                    onPress={() => {
                        setEditandoEstagio(e);
                        setAlunoSelecionado(alunos.find(a => a.id === e.aluno_id) || null);
                        setEmpresaSelecionada(empresas.find(emp => emp.id === e.empresa_id) || null);
                        setDataInicio(e.data_inicio || ''); 
                        setDataFim(e.data_fim || '');
                        setHorasTotaisEstagio(e.horas_totais?.toString() || '');
                        
                        // 🟢 NOVO: Preencher as permissões no formulário se estivermos a editar
                        setPermiteSabados(e.permite_sabados || false);
                        setPermiteDomingos(e.permite_domingos || false);
                        setPermiteFeriados(e.permite_feriados || false);

                        carregarHorariosEdicao(e.id);
                        setPasso(2); setModalVisible(true);
                    }}
                    onLongPress={() => { 
                        setEstagioParaApagar({ id: e.id, nome: e.alunos?.nome }); 
                        setDeleteModalVisible(true); 
                    }}
                >
                    <View style={styles.cardHeader}>
                        <View style={[styles.avatar, { backgroundColor: cores.azulSuave }]}>
                            <Text style={[styles.avatarText, { color: cores.azul }]}>{e.alunos?.nome.charAt(0).toUpperCase()}</Text>
                        </View>
                        <View style={{flex:1}}>
                            <Text style={[styles.alunoNome, { color: cores.texto }]} numberOfLines={1}>{e.alunos?.nome}</Text>
                            <View style={styles.empresaRow}>
                                <Ionicons name="business-outline" size={13} color={cores.laranja} />
                                <Text style={[styles.empresaText, { color: cores.secundario }]} numberOfLines={1}>{e.empresas?.nome}</Text>
                            </View>
                        </View>
                        <View style={{ alignItems: 'flex-end' }}>
                          <View style={[styles.timeBadge, { backgroundColor: cores.fundo, borderColor: cores.borda, marginBottom: 4 }]}>
                              <Ionicons name="time-outline" size={12} color={cores.azul} />
                              <Text style={[styles.timeText, { color: cores.texto }]}>{e.horas_diarias}</Text>
                          </View>
                          <Text style={{ fontSize: 10, color: cores.secundario, fontWeight: '700' }}>{e.horas_totais || 0}h Totais</Text>
                        </View>
                    </View>
                </TouchableOpacity>
              ))}
            </View>
          ))}
        </ScrollView>

        <TouchableOpacity 
          style={[styles.fab, { backgroundColor: cores.laranja, bottom: insets.bottom + 20 }]} 
          activeOpacity={0.8}
          onPress={() => { setPasso(1); setModalVisible(true); }}
        >
          <Ionicons name="add" size={26} color="#fff" />
          <Text style={styles.fabText}>Novo Plano</Text>
        </TouchableOpacity>
      </SafeAreaView>

      {/* MODAL DE CRIAÇÃO/EDIÇÃO */}
      <Modal visible={modalVisible} animationType="slide" transparent>
        <View style={[styles.modalOverlay, { backgroundColor: cores.overlay }]}>
          <View style={[styles.modalContent, { backgroundColor: cores.card, paddingBottom: insets.bottom + 20 }]}>
            <View style={styles.modalIndicator} />
            <View style={styles.modalHeader}>
              <View>
                <Text style={[styles.modalTitle, { color: cores.texto }]}>{passo === 1 ? "Vinculação" : "Configuração"}</Text>
                <Text style={[styles.modalSub, { color: cores.laranja }]}>Passo {passo} de 2</Text>
              </View>
              <TouchableOpacity onPress={handleFecharModal} style={[styles.closeBtn, {backgroundColor: cores.fundo}]}>
                <Ionicons name="close" size={22} color={cores.texto} />
              </TouchableOpacity>
            </View>

            <ScrollView showsVerticalScrollIndicator={false} nestedScrollEnabled>
              {passo === 1 ? (
                <View style={{ gap: 20 }}>
                  
                  {/* SELECIONAR ALUNO COM PESQUISA */}
                  <View>
                    <Text style={styles.inputLabel}>Selecionar Estagiário</Text>
                    <View style={[styles.modalSearchBar, { backgroundColor: cores.fundo, borderColor: cores.borda }]}>
                      <Ionicons name="search" size={16} color={cores.secundario} style={{ marginRight: 8 }} />
                      <TextInput 
                        placeholder="Procurar aluno..." 
                        placeholderTextColor={cores.secundario}
                        style={{ flex: 1, fontSize: 14, color: cores.texto }}
                        value={pesquisaAluno}
                        onChangeText={setPesquisaAluno}
                      />
                    </View>
                    <View style={[styles.pickerContainer, { borderColor: cores.borda, maxHeight: 180 }]}>
                      <ScrollView nestedScrollEnabled>
                        {Object.entries(alunosParaMostrar.reduce((acc, a) => {
                          const key = `${a.ano}º ${a.turma_curso}`.trim().toUpperCase();
                          if (!acc[key]) acc[key] = []; acc[key].push(a); return acc;
                        }, {} as Record<string, Aluno[]>))
                        .sort(([a], [b]) => a.localeCompare(b))
                        .map(([turma, lista]) => (
                          <View key={turma}>
                            <View style={[styles.groupHeader, { backgroundColor: cores.fundo }]}><Text style={[styles.groupHeaderText, { color: cores.secundario }]}>{turma}</Text></View>
                            {lista.map(a => (
                              <TouchableOpacity 
                                  key={a.id} 
                                  style={[styles.pickerItem, alunoSelecionado?.id === a.id && { backgroundColor: cores.azulSuave }]} 
                                  onPress={() => setAlunoSelecionado(a)}
                              >
                                <Text style={[styles.pickerItemText, { color: cores.texto }]}>{a.nome}</Text>
                                {alunoSelecionado?.id === a.id && <Ionicons name="checkmark-circle" size={18} color={cores.azul} />}
                              </TouchableOpacity>
                            ))}
                          </View>
                        ))}
                        {alunosParaMostrar.length === 0 && (
                          <Text style={{ padding: 20, textAlign: 'center', color: cores.secundario }}>Sem resultados.</Text>
                        )}
                      </ScrollView>
                    </View>
                  </View>

                  {/* SELECIONAR EMPRESA COM PESQUISA */}
                  <View>
                    <Text style={styles.inputLabel}>Entidade de Acolhimento</Text>
                    <View style={[styles.modalSearchBar, { backgroundColor: cores.fundo, borderColor: cores.borda }]}>
                      <Ionicons name="search" size={16} color={cores.secundario} style={{ marginRight: 8 }} />
                      <TextInput 
                        placeholder="Procurar empresa..." 
                        placeholderTextColor={cores.secundario}
                        style={{ flex: 1, fontSize: 14, color: cores.texto }}
                        value={pesquisaEmpresa}
                        onChangeText={setPesquisaEmpresa}
                      />
                    </View>
                    <View style={[styles.pickerContainer, { borderColor: cores.borda, maxHeight: 180 }]}>
                      <ScrollView nestedScrollEnabled>
                        {Object.entries(empresasParaMostrar.reduce((acc, e) => {
                          const key = (e.curso || 'GERAL').trim().toUpperCase();
                          if (!acc[key]) acc[key] = []; acc[key].push(e); return acc;
                        }, {} as Record<string, Empresa[]>))
                        .sort(([a], [b]) => a.localeCompare(b))
                        .map(([curso, lista]) => (
                          <View key={curso}>
                            <View style={[styles.groupHeader, { backgroundColor: cores.fundo }]}><Text style={[styles.groupHeaderText, { color: cores.secundario }]}>{curso}</Text></View>
                            {lista.map(emp => (
                              <TouchableOpacity 
                                  key={emp.id} 
                                  style={[styles.pickerItem, empresaSelecionada?.id === emp.id && { backgroundColor: cores.azulSuave }]} 
                                  onPress={() => setEmpresaSelecionada(emp)}
                              >
                                <Text style={[styles.pickerItemText, { color: cores.texto }]}>{emp.nome}</Text>
                                {empresaSelecionada?.id === emp.id && <Ionicons name="checkmark-circle" size={18} color={cores.azul} />}
                              </TouchableOpacity>
                            ))}
                          </View>
                        ))}
                        {empresasParaMostrar.length === 0 && (
                          <Text style={{ padding: 20, textAlign: 'center', color: cores.secundario }}>Sem resultados.</Text>
                        )}
                      </ScrollView>
                    </View>
                  </View>

                </View>
              ) : (
                <View style={{ gap: 18 }}>
                  <View style={[styles.modernGroup, { backgroundColor: cores.fundo, borderColor: cores.borda }]}>
                    <Text style={[styles.groupTitle, { color: cores.azul }]}>Cronograma e Horas</Text>
                    
                    <View style={styles.rowInputs}>
                        <View style={{flex:1}}>
                          <Text style={styles.miniLabel}>DATA INÍCIO</Text>
                          <TextInput 
                            style={[styles.modernInput, { color: cores.texto, backgroundColor: cores.card, borderColor: cores.borda }]} 
                            value={dataInicio} 
                            onChangeText={(t) => setDataInicio(mascararData(t))} 
                            placeholder="AAAA-MM-DD" 
                            maxLength={10}
                            keyboardType="numeric"
                            placeholderTextColor={cores.secundario}
                          />
                        </View>
                        <View style={{flex:1}}>
                          <View style={{flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', marginBottom: 6}}>
                            <Text style={[styles.miniLabel, {marginBottom: 0}]}>DATA FIM (PREV.)</Text>
                            <TouchableOpacity onPress={() => calcularMagia('dataFim')} hitSlop={{top: 10, bottom: 10, left: 10, right: 10}}>
                              <Ionicons name="color-wand" size={16} color={cores.laranja} />
                            </TouchableOpacity>
                          </View>
                          <TextInput 
                            style={[styles.modernInput, { color: cores.texto, backgroundColor: cores.card, borderColor: cores.borda }]} 
                            value={dataFim} 
                            onChangeText={(t) => setDataFim(mascararData(t))} 
                            placeholder="AAAA-MM-DD" 
                            maxLength={10}
                            keyboardType="numeric"
                            placeholderTextColor={cores.secundario}
                          />
                        </View>
                    </View>

                    <View style={{marginTop: 15}}>
                      <View style={{flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', marginBottom: 6}}>
                        <Text style={[styles.miniLabel, {marginBottom: 0}]}>HORAS TOTAIS DO ESTÁGIO</Text>
                        <TouchableOpacity onPress={() => calcularMagia('horasTotais')} style={{flexDirection: 'row', alignItems: 'center', gap: 4}} hitSlop={{top: 10, bottom: 10, left: 10, right: 10}}>
                          <Ionicons name="color-wand" size={16} color={cores.laranja} />
                          <Text style={{fontSize: 10, fontWeight: '800', color: cores.laranja}}>AUTO-CALCULAR</Text>
                        </TouchableOpacity>
                      </View>
                      <TextInput 
                        style={[styles.modernInput, { color: cores.texto, backgroundColor: cores.card, borderColor: cores.borda }]} 
                        value={horasTotaisEstagio} 
                        onChangeText={setHorasTotaisEstagio} 
                        keyboardType="numeric"
                        placeholderTextColor={cores.secundario}
                        placeholder="Ex: 400"
                      />
                    </View>
                  </View>

                  {/* 🟢 NOVO GRUPO: REGRAS DE ASSIDUIDADE */}
                  <View style={[styles.modernGroup, { backgroundColor: cores.fundo, borderColor: cores.borda }]}>
                    <Text style={[styles.groupTitle, { color: cores.azul, marginBottom: 8 }]}>Regras de Assiduidade</Text>
                    <Text style={{ fontSize: 11, color: cores.secundario, marginBottom: 15 }}>
                      Selecione abaixo os dias excepcionais em que este aluno está autorizado a estagiar e a marcar presença no sistema.
                    </Text>

                    <View style={styles.switchRow}>
                      <Text style={[styles.switchLabel, { color: cores.texto }]}>Permitir registos ao Sábado</Text>
                      <Switch 
                        value={permiteSabados} 
                        onValueChange={setPermiteSabados} 
                        trackColor={{ false: cores.borda, true: cores.azul }}
                        thumbColor="#FFF"
                      />
                    </View>

                    <View style={styles.switchRow}>
                      <Text style={[styles.switchLabel, { color: cores.texto }]}>Permitir registos ao Domingo</Text>
                      <Switch 
                        value={permiteDomingos} 
                        onValueChange={setPermiteDomingos} 
                        trackColor={{ false: cores.borda, true: cores.azul }}
                        thumbColor="#FFF"
                      />
                    </View>

                    <View style={[styles.switchRow, { borderBottomWidth: 0 }]}>
                      <Text style={[styles.switchLabel, { color: cores.texto }]}>Permitir registos em Feriados</Text>
                      <Switch 
                        value={permiteFeriados} 
                        onValueChange={setPermiteFeriados} 
                        trackColor={{ false: cores.borda, true: cores.azul }}
                        thumbColor="#FFF"
                      />
                    </View>
                  </View>

                  <View style={[styles.modernGroup, { backgroundColor: cores.fundo, borderColor: cores.borda }]}>
                    <View style={{flexDirection: 'row', justifyContent: 'space-between'}}>
                        <Text style={[styles.groupTitle, { color: cores.azul }]}>Horário de Trabalho</Text>
                        <View style={[styles.totalBadge, { backgroundColor: cores.laranja }]}><Text style={styles.totalText}>{totalHorasDiarias}/dia</Text></View>
                    </View>
                    
                    {/* BOTÕES DE PREENCHIMENTO RÁPIDO */}
                    <View style={styles.quickTimeRow}>
                      <TouchableOpacity style={[styles.quickTimeBtn, { backgroundColor: cores.azulSuave }]} onPress={() => preencherHorario('laboral')}>
                        <Text style={[styles.quickTimeBtnText, { color: cores.azul }]}>Laboral (9-18h)</Text>
                      </TouchableOpacity>
                      <TouchableOpacity style={[styles.quickTimeBtn, { backgroundColor: cores.azulSuave }]} onPress={() => preencherHorario('manha')}>
                        <Text style={[styles.quickTimeBtnText, { color: cores.azul }]}>Manhã (9-13h)</Text>
                      </TouchableOpacity>
                      <TouchableOpacity style={[styles.quickTimeBtn, { backgroundColor: cores.vermelhoSuave }]} onPress={() => preencherHorario('limpar')}>
                        <Ionicons name="trash-outline" size={14} color={cores.vermelho} />
                      </TouchableOpacity>
                    </View>

                    <View style={styles.tabelaRow}>
                      <Text style={[styles.tabelaLabel, {color: cores.texto}]}>Manhã</Text>
                      <TextInput 
                        style={[styles.tabelaInput, {color: cores.texto, backgroundColor: cores.card, borderColor: cores.borda}]} 
                        value={hManhaIni} 
                        onChangeText={(txt) => setHManhaIni(aplicarMascaraHora(txt))} 
                        keyboardType="numeric"
                        maxLength={5}
                        placeholderTextColor={cores.secundario}
                        placeholder="09:00" 
                      />
                      <TextInput 
                        style={[styles.tabelaInput, {color: cores.texto, backgroundColor: cores.card, borderColor: cores.borda}]} 
                        value={hManhaFim} 
                        onChangeText={(txt) => setHManhaFim(aplicarMascaraHora(txt))} 
                        keyboardType="numeric"
                        maxLength={5}
                        placeholderTextColor={cores.secundario}
                        placeholder="13:00" 
                      />
                    </View>
                    <View style={styles.tabelaRow}>
                      <Text style={[styles.tabelaLabel, {color: cores.texto}]}>Tarde</Text>
                      <TextInput 
                        style={[styles.tabelaInput, {color: cores.texto, backgroundColor: cores.card, borderColor: cores.borda}]} 
                        value={hTardeIni} 
                        onChangeText={(txt) => setHTardeIni(aplicarMascaraHora(txt))} 
                        keyboardType="numeric"
                        maxLength={5}
                        placeholderTextColor={cores.secundario}
                        placeholder="14:00" 
                      />
                      <TextInput 
                        style={[styles.tabelaInput, {color: cores.texto, backgroundColor: cores.card, borderColor: cores.borda}]} 
                        value={hTardeFim} 
                        onChangeText={(txt) => setHTardeFim(aplicarMascaraHora(txt))} 
                        keyboardType="numeric"
                        maxLength={5}
                        placeholderTextColor={cores.secundario}
                        placeholder="18:00" 
                      />
                    </View>
                  </View>

                  <View style={[styles.modernGroup, { backgroundColor: cores.fundo, borderColor: cores.borda }]}>
                    <Text style={[styles.groupTitle, { color: cores.azul }]}>Responsável na Empresa</Text>
                    <TextInput style={[styles.modernInput, {color: cores.texto, backgroundColor: cores.card, borderColor: cores.borda}]} value={empresaSelecionada?.tutor_nome} onChangeText={(t) => setEmpresaSelecionada(p => p ? {...p, tutor_nome: t} : p)} placeholderTextColor={cores.secundario} placeholder="Nome do Tutor"/>
                    <TextInput style={[styles.modernInput, {color: cores.texto, backgroundColor: cores.card, borderColor: cores.borda, marginTop: 10}]} value={empresaSelecionada?.tutor_telefone} onChangeText={(t) => setEmpresaSelecionada(p => p ? {...p, tutor_telefone: t} : p)} keyboardType="phone-pad" placeholderTextColor={cores.secundario} placeholder="Telemóvel"/>
                  </View>
                </View>
              )}
            </ScrollView>

            <View style={styles.modalFooter}>
              {passo === 2 && (
                <TouchableOpacity onPress={() => setPasso(1)} style={[styles.btnModalSec, { borderColor: cores.borda }]}>
                    <Text style={{color: cores.texto, fontWeight: '800'}}>VOLTAR</Text>
                </TouchableOpacity>
              )}
              <TouchableOpacity 
                onPress={() => {
                  if(passo === 1) {
                    if(alunoSelecionado && empresaSelecionada) setPasso(2);
                    else showToast("Selecione o aluno e a empresa antes de avançar.", "info");
                  } else salvarEstagio();
                }} 
                style={[styles.btnModalPri, { backgroundColor: cores.azul }]}
              >
                {loading ? <ActivityIndicator color="#fff" /> : <Text style={{color:'#fff', fontWeight: '900', letterSpacing: 0.5}}>{passo === 1 ? "CONTINUAR" : "FINALIZAR"}</Text>}
              </TouchableOpacity>
            </View>
          </View>
        </View>
      </Modal>

      {/* CUSTOM ALERT MODAL (CENTRADINHO E IGUAL À FOTO) */}
      <Modal 
        visible={customAlert.visible} 
        transparent 
        animationType="fade"
        onRequestClose={() => setCustomAlert({ ...customAlert, visible: false })}
      >
        <View style={styles.alertOverlay}>
          <View style={[styles.alertCard, { backgroundColor: cores.card, borderColor: cores.borda }]}>
            
            <TouchableOpacity 
              activeOpacity={0.7}
              onPress={() => setCustomAlert({ ...customAlert, visible: false })}
              style={[styles.alertIconBg, { backgroundColor: customAlert.tipo === 'error' ? cores.vermelho : cores.laranja }]}
            >
                <Ionicons 
                  name={customAlert.tipo === 'error' ? "close" : "warning"} 
                  size={20} 
                  color="#fff" 
                />
            </TouchableOpacity>

            <Text style={[styles.alertTitle, { color: cores.texto }]}>
              {customAlert.title.replace(' ⚖️', '')}
            </Text>
            
            {customAlert.title.includes('Excedido') && (
              <Text style={styles.alertEmoji}>⚖️</Text>
            )}
            
            <Text style={[styles.alertSubtitle, { color: cores.secundario }]}>
              {customAlert.msg}
            </Text>
            
          </View>
        </View>
      </Modal>

      {/* DELETE MODAL (COM NOVO DESIGN ARREDONDADO) */}
      <Modal visible={deleteModalVisible} transparent animationType="fade">
        <View style={[styles.modalOverlay, { backgroundColor: cores.overlay }]}>
          <View style={[styles.deleteCard, { backgroundColor: cores.card, borderColor: cores.borda }]}>
            <View style={[styles.deleteIconBg, { backgroundColor: cores.vermelhoSuave }]}>
                <Ionicons name="trash" size={35} color={cores.vermelho} />
            </View>
            <Text style={[styles.deleteTitle, { color: cores.texto }]}>Cancelar Estágio?</Text>
            <Text style={[styles.deleteSubtitle, { color: cores.secundario }]}>
                Irá remover o vínculo de <Text style={{fontWeight: '900', color: cores.texto}}>{estagioParaApagar?.nome}</Text>. Esta ação é irreversível.
            </Text>
            <View style={styles.deleteFooter}>
              <TouchableOpacity style={[styles.deleteBtnCancel, { borderColor: cores.borda, borderWidth: 1 }]} onPress={() => setDeleteModalVisible(false)}>
                <Text style={[styles.deleteBtnText, { color: cores.secundario }]}>CANCELAR</Text>
              </TouchableOpacity>
              <TouchableOpacity style={[styles.deleteBtnConfirm, { backgroundColor: cores.vermelho }]} onPress={confirmarEliminacao}>
                <Text style={[styles.deleteBtnText, { color: '#fff' }]}>ELIMINAR</Text>
              </TouchableOpacity>
            </View>
          </View>
        </View>
      </Modal>

    </View>
  );
}

const styles = StyleSheet.create({
  // TOAST STYLES
  toastContainer: { position: 'absolute', left: 20, right: 20, zIndex: 9999, flexDirection: 'row', alignItems: 'center', padding: 16, borderRadius: 16, elevation: 6, shadowColor: '#000', shadowOffset: { width: 0, height: 4 }, shadowOpacity: 0.2, shadowRadius: 8 },
  toastText: { color: '#FFF', fontSize: 14, fontWeight: '700', marginLeft: 12, flex: 1 },

  header: { flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between', paddingHorizontal: 20, paddingVertical: 15 },
  headerTitle: { fontSize: 20, fontWeight: '900', letterSpacing: -0.5 },
  headerSubtitle: { fontSize: 11, fontWeight: '800', textTransform: 'uppercase', letterSpacing: 0.5, marginTop: 2 },
  btnAction: { width: 44, height: 44, borderRadius: 14, justifyContent: 'center', alignItems: 'center', borderWidth: 1 },
  
  scroll: { paddingHorizontal: 20, paddingTop: 10 },
  searchSection: { paddingHorizontal: 4, marginBottom: 15 },
  searchBar: { flexDirection: 'row', alignItems: 'center', paddingHorizontal: 16, height: 56, borderRadius: 18, borderWidth: 1.5 },
  searchInput: { flex: 1, marginLeft: 12, fontSize: 14, fontWeight: '600' },
  
  sectionHeader: { flexDirection: 'row', alignItems: 'center', marginTop: 10, marginBottom: 18 },
  sectionDot: { width: 8, height: 8, borderRadius: 4, marginRight: 10 },
  sectionTitle: { fontSize: 14, fontWeight: '900', letterSpacing: 0.5 },
  sectionLine: { flex: 1, height: 1.5, marginLeft: 15, opacity: 0.6 },
  
  estagioCard: { padding: 16, borderRadius: 24, borderWidth: 1, marginBottom: 14, elevation: 2, shadowColor: '#000', shadowOpacity: 0.03, shadowRadius: 8, shadowOffset: { width: 0, height: 2 } },
  cardHeader: { flexDirection: 'row', alignItems: 'center', gap: 14 },
  avatar: { width: 48, height: 48, borderRadius: 16, justifyContent: 'center', alignItems: 'center' },
  avatarText: { fontSize: 20, fontWeight: '900' },
  alunoNome: { fontSize: 16, fontWeight: '800', letterSpacing: -0.3 },
  empresaRow: { flexDirection: 'row', alignItems: 'center', gap: 5, marginTop: 3 },
  empresaText: { fontSize: 13, fontWeight: '600' },
  timeBadge: { flexDirection: 'row', alignItems: 'center', gap: 5, paddingHorizontal: 8, paddingVertical: 4, borderRadius: 10, borderWidth: 1 },
  timeText: { fontSize: 10, fontWeight: '900' },
  
  fab: { position: 'absolute', right: 20, flexDirection: 'row', alignItems: 'center', paddingHorizontal: 22, paddingVertical: 16, borderRadius: 22, elevation: 6, shadowColor: '#E38E00', shadowOpacity: 0.3, shadowRadius: 10 },
  fabText: { color: '#fff', fontSize: 15, fontWeight: '900', marginLeft: 10, textTransform: 'uppercase', letterSpacing: 0.5 },
  
  modalOverlay: { flex: 1, justifyContent: 'flex-end', alignItems: 'center' },
  modalContent: { borderTopLeftRadius: 36, borderTopRightRadius: 36, padding: 25, height: '92%', width: '100%' },
  modalIndicator: { width: 45, height: 5, backgroundColor: 'rgba(0,0,0,0.1)', borderRadius: 10, alignSelf: 'center', marginBottom: 20 },
  modalHeader: { flexDirection: 'row', justifyContent: 'space-between', alignItems: 'flex-start', marginBottom: 25 },
  modalTitle: { fontSize: 22, fontWeight: '900', letterSpacing: -0.5 },
  modalSub: { fontSize: 11, fontWeight: '800', textTransform: 'uppercase', marginTop: 4, letterSpacing: 0.5 },
  closeBtn: { width: 40, height: 40, borderRadius: 14, justifyContent: 'center', alignItems: 'center' },
  
  inputLabel: { fontSize: 10, fontWeight: '900', textTransform: 'uppercase', color: '#64748B', marginBottom: 10, marginLeft: 5, letterSpacing: 0.5 },
  modalSearchBar: { flexDirection: 'row', alignItems: 'center', borderWidth: 1, borderRadius: 16, paddingHorizontal: 14, height: 46, marginBottom: 12 },
  pickerContainer: { borderWidth: 1.5, borderRadius: 24, overflow: 'hidden', width: '100%' },
  groupHeader: { paddingVertical: 10, paddingHorizontal: 18 },
  groupHeaderText: { fontSize: 10, fontWeight: '900', textTransform: 'uppercase' },
  pickerItem: { flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', padding: 18, borderBottomWidth: 1, borderColor: 'rgba(0,0,0,0.03)' },
  pickerItemText: { fontSize: 15, fontWeight: '700' },
  
  modernGroup: { padding: 20, borderRadius: 28, borderWidth: 1, marginBottom: 18 },
  groupTitle: { fontSize: 12, fontWeight: '900', textTransform: 'uppercase', marginBottom: 15, letterSpacing: 0.5 },
  rowInputs: { flexDirection: 'row', gap: 15 },
  miniLabel: { fontSize: 9, fontWeight: '900', color: '#94A3B8', marginBottom: 6, marginLeft: 2 },
  modernInput: { paddingVertical: 14, paddingHorizontal: 16, borderRadius: 16, fontSize: 14, fontWeight: '700', borderWidth: 1 },
  
  quickTimeRow: { flexDirection: 'row', gap: 8, marginBottom: 15 },
  quickTimeBtn: { paddingHorizontal: 12, paddingVertical: 6, borderRadius: 10 },
  quickTimeBtnText: { fontSize: 11, fontWeight: '800' },
  tabelaRow: { flexDirection: 'row', alignItems: 'center', gap: 12, marginBottom: 12 },
  tabelaLabel: { flex: 1, fontSize: 14, fontWeight: '800' },
  tabelaInput: { flex: 1, padding: 14, borderRadius: 16, textAlign: 'center', fontSize: 14, fontWeight: '800', borderWidth: 1 },
  
  totalBadge: { paddingHorizontal: 10, paddingVertical: 4, borderRadius: 8 },
  totalText: { color: '#fff', fontSize: 11, fontWeight: '900' },

  // 🟢 NOVO: Estilos para as Switches
  switchRow: { flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', paddingVertical: 12, borderBottomWidth: 1, borderColor: 'rgba(0,0,0,0.05)' },
  switchLabel: { fontSize: 13, fontWeight: '700' },
  
  modalFooter: { flexDirection: 'row', gap: 15, marginTop: 15 },
  btnModalPri: { flex: 2, height: 60, borderRadius: 18, justifyContent: 'center', alignItems: 'center' },
  btnModalSec: { flex: 1, height: 60, borderRadius: 18, justifyContent: 'center', alignItems: 'center', borderWidth: 1.5 },
  
  deleteCard: { width: '85%', borderRadius: 36, padding: 30, alignItems: 'center', borderWidth: 1, alignSelf: 'center', marginBottom: 30, elevation: 10 },
  deleteIconBg: { width: 80, height: 80, borderRadius: 25, justifyContent: 'center', alignItems: 'center', marginBottom: 20 },
  deleteTitle: { fontSize: 22, fontWeight: '900', marginBottom: 12, letterSpacing: -0.5 },
  deleteSubtitle: { fontSize: 15, textAlign: 'center', lineHeight: 22, marginBottom: 30 },
  deleteFooter: { flexDirection: 'row', gap: 15, width: '100%' },
  deleteBtnCancel: { flex: 1, height: 55, borderRadius: 16, justifyContent: 'center', alignItems: 'center' },
  deleteBtnConfirm: { flex: 1, height: 55, borderRadius: 16, justifyContent: 'center', alignItems: 'center' },
  deleteBtnText: { fontSize: 14, fontWeight: '900' },
  
  // --- ESTILOS ESPECÍFICOS PARA O AVISO CENTRADO ---
  alertOverlay: { flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: 'rgba(0, 0, 0, 0.6)', paddingHorizontal: 20 },
  alertCard: { width: '85%', borderRadius: 36, padding: 30, alignItems: 'center', borderWidth: 1, elevation: 10, shadowColor: '#000', shadowOpacity: 0.15, shadowRadius: 10 },
  alertIconBg: { width: 44, height: 44, borderRadius: 14, justifyContent: 'center', alignItems: 'center', marginBottom: 20 },
  alertTitle: { fontSize: 20, fontWeight: '900', textAlign: 'center', marginBottom: 8, letterSpacing: -0.5 },
  alertEmoji: { fontSize: 28, marginBottom: 10 },
  alertSubtitle: { fontSize: 14, textAlign: 'center', lineHeight: 22, fontWeight: '600' },
});