/* Rapid - App do Entregador. Identidade própria (laranja/preto, combinando com o ícone do
   capacete), separada da marca AltyFood do cardápio digital — é um produto à parte. */
:root {
    --rapid-primaria: #F97316;
    --rapid-primaria-escura: #EA580C;
    --rapid-preto: #111827;
    --rapid-cinza: #6B7280;
    --rapid-cinza-claro: #F3F4F6;
    --rapid-borda: #E5E7EB;
    --rapid-verde: #16A34A;
    --rapid-vermelho: #DC2626;
}

@keyframes rapid-entrada-card {
    from { opacity: 0; transform: translateY(14px) scale(0.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes rapid-pulsar {
    0%, 100% { box-shadow: 0 0 0 0 rgba(249, 115, 22, 0.35); }
    50% { box-shadow: 0 0 0 10px rgba(249, 115, 22, 0); }
}
@keyframes rapid-pulsar-verde {
    0%, 100% { box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.4); }
    50% { box-shadow: 0 0 0 8px rgba(22, 163, 74, 0); }
}
@keyframes rapid-flutuar {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-4px); }
}

* { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Inter', -apple-system, sans-serif; -webkit-tap-highlight-color: transparent; }
html, body { height: 100%; overscroll-behavior-y: contain; }
body { background: var(--rapid-cinza-claro); color: var(--rapid-preto); }

.tela { display: none; min-height: 100vh; flex-direction: column; }
.tela.ativa { display: flex; }

.topo-rapid {
    background: var(--rapid-preto);
    color: white;
    padding: 20px 20px 28px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.topo-rapid .logo-rapid { display: flex; align-items: center; gap: 8px; font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 1.3rem; letter-spacing: -0.5px; }
.topo-rapid .logo-rapid i { color: var(--rapid-primaria); font-size: 1.6rem; }

.container-rapid { max-width: 480px; margin: 0 auto; width: 100%; padding: 20px; flex: 1; display: flex; flex-direction: column; gap: 16px; }

.card-rapid { background: white; border-radius: 14px; padding: 20px; box-shadow: 0 2px 10px rgba(0,0,0,0.06); }

.campo-rapid { margin-bottom: 14px; }
.campo-rapid label { display: block; font-size: 0.82rem; font-weight: 600; color: var(--rapid-cinza); margin-bottom: 6px; }
.campo-rapid input, .campo-rapid textarea {
    width: 100%; padding: 13px 14px; border: 1.5px solid var(--rapid-borda); border-radius: 10px;
    font-size: 1rem; background: var(--rapid-cinza-claro);
}
.campo-rapid input:focus, .campo-rapid textarea:focus { outline: none; border-color: var(--rapid-primaria-escura); background: white; }

.upload-foto-rapid {
    border: 2px dashed var(--rapid-borda); border-radius: 12px; padding: 16px; text-align: center;
    cursor: pointer; position: relative; overflow: hidden; background: var(--rapid-cinza-claro);
}
.upload-foto-rapid img { width: 100%; max-height: 140px; object-fit: cover; border-radius: 8px; display: none; }
.upload-foto-rapid input[type="file"] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.upload-foto-rapid .upload-icone { font-size: 1.8rem; color: var(--rapid-cinza); }
.upload-foto-rapid .upload-texto { font-size: 0.82rem; color: var(--rapid-cinza); margin-top: 6px; }

.btn-rapid {
    width: 100%; padding: 15px; border: none; border-radius: 12px; font-weight: 700; font-size: 1rem;
    cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px;
    transition: opacity 0.15s, transform 0.1s;
}
.btn-rapid:active { transform: scale(0.98); }
.btn-rapid:disabled { opacity: 0.5; cursor: not-allowed; }
.btn-rapid-primario { background: var(--rapid-primaria); color: var(--rapid-preto); }
.btn-rapid-secundario { background: var(--rapid-preto); color: white; }
.btn-rapid-outline { background: transparent; color: var(--rapid-preto); border: 1.5px solid var(--rapid-borda); }
.btn-rapid-perigo { background: #FEE2E2; color: var(--rapid-vermelho); }
.btn-rapid-sucesso { background: var(--rapid-verde); color: white; }

.link-rapid { color: var(--rapid-preto); font-weight: 700; text-decoration: underline; cursor: pointer; }

.aviso-erro-rapid { background: #FEE2E2; color: #B91C1C; padding: 12px 14px; border-radius: 10px; font-size: 0.88rem; font-weight: 600; margin-bottom: 14px; display: none; }
.aviso-sucesso-rapid { background: #DCFCE7; color: #166534; padding: 12px 14px; border-radius: 10px; font-size: 0.88rem; font-weight: 600; margin-bottom: 14px; }

/* Toggle Online/Offline */
.toggle-status-rapid {
    display: flex; align-items: center; justify-content: space-between; padding: 16px 20px;
    background: white; border-radius: 14px; box-shadow: 0 2px 10px rgba(0,0,0,0.06);
}
.toggle-status-rapid .texto-status { display: flex; align-items: center; gap: 10px; font-weight: 700; }
.toggle-status-rapid .bolinha-status { width: 12px; height: 12px; border-radius: 50%; background: var(--rapid-cinza); transition: background 0.2s; }
.toggle-status-rapid.online .bolinha-status { background: var(--rapid-verde); animation: rapid-pulsar-verde 2s ease-in-out infinite; }

.switch-rapid { position: relative; width: 52px; height: 30px; flex-shrink: 0; }
.switch-rapid input { opacity: 0; width: 0; height: 0; }
.switch-rapid .slider-rapid {
    position: absolute; inset: 0; background: var(--rapid-borda); border-radius: 30px; cursor: pointer; transition: 0.2s;
}
.switch-rapid .slider-rapid::before {
    content: ''; position: absolute; width: 24px; height: 24px; left: 3px; top: 3px; background: white;
    border-radius: 50%; transition: 0.2s; box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}
.switch-rapid input:checked + .slider-rapid { background: var(--rapid-verde); }
.switch-rapid input:checked + .slider-rapid::before { transform: translateX(22px); }

/* Card de corrida disponível */
.corrida-card { background: white; border-radius: 14px; padding: 16px; box-shadow: 0 2px 10px rgba(0,0,0,0.06); border-left: 4px solid var(--rapid-primaria); animation: rapid-entrada-card 0.35s ease-out backwards; }
.corrida-card.nova { animation: rapid-entrada-card 0.35s ease-out backwards, rapid-pulsar 1.6s ease-out 2; }
.corrida-card .btn-rapid:active { transform: scale(0.97); }
.corrida-card .corrida-loja { font-weight: 800; font-size: 1.05rem; margin-bottom: 4px; }
.corrida-card .corrida-endereco { font-size: 0.85rem; color: var(--rapid-cinza); display: flex; align-items: flex-start; gap: 6px; margin-bottom: 4px; }
.corrida-card .corrida-valor { font-size: 1.3rem; font-weight: 800; color: var(--rapid-verde); margin: 10px 0; }

.vazio-rapid { text-align: center; padding: 50px 20px; color: var(--rapid-cinza); }
.vazio-rapid i { font-size: 2.5rem; margin-bottom: 10px; display: block; }

/* Etapas da corrida ativa */
.etapa-badge { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border-radius: 30px; font-weight: 700; font-size: 0.8rem; text-transform: uppercase; }
.etapa-badge.aceita { background: #FEF3C7; color: #92400E; }
.etapa-badge.coletando { background: #DBEAFE; color: #1E40AF; }
.etapa-badge.em_rota { background: #E0E7FF; color: #3730A3; }

.linha-info-rapid { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--rapid-borda); font-size: 0.9rem; }
.linha-info-rapid:last-child { border-bottom: none; }
.linha-info-rapid .rotulo { color: var(--rapid-cinza); }
.linha-info-rapid .valor { font-weight: 700; text-align: right; }

.nav-inferior-rapid {
    position: sticky; bottom: 0; background: white; border-top: 1px solid var(--rapid-borda);
    display: flex; padding: 8px 0 max(8px, env(safe-area-inset-bottom));
}
.nav-inferior-rapid .item-nav { flex: 1; text-align: center; padding: 8px; cursor: pointer; color: var(--rapid-cinza); font-size: 0.72rem; font-weight: 700; }
.nav-inferior-rapid .item-nav i { font-size: 1.4rem; display: block; margin-bottom: 2px; }
.nav-inferior-rapid .item-nav.ativo { color: var(--rapid-preto); }
.nav-inferior-rapid .item-nav.ativo i { color: var(--rapid-primaria-escura); }

.perfil-header-rapid { display: flex; align-items: center; gap: 12px; }
.perfil-header-rapid img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; border: 2px solid var(--rapid-primaria); background: #333; }
.perfil-header-rapid .nome { font-weight: 700; }
.perfil-header-rapid .nota { font-size: 0.8rem; color: var(--rapid-primaria); display: flex; align-items: center; gap: 3px; }

.resumo-loja-ganhos { display: flex; justify-content: space-between; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--rapid-borda); }
.resumo-loja-ganhos:last-child { border-bottom: none; }
.resumo-loja-ganhos .nome-loja { font-weight: 700; }
.resumo-loja-ganhos .qtd-corridas { font-size: 0.78rem; color: var(--rapid-cinza); }
.resumo-loja-ganhos .valor-total { font-weight: 800; color: var(--rapid-verde); font-size: 1.05rem; }

.carregando-rapid { text-align: center; padding: 40px; color: var(--rapid-cinza); }
