/**
 * A caixa da verificacao de identidade.
 *
 * Herda a cor do texto da pagina em vez de fixar preto ou branco: a pagina de
 * habilitacao e escura, e uma caixa que decide a propria cor de letra some num
 * fundo ou no outro. O laranja e o mesmo #f59d1a que ja manda no site.
 */

.mestra-jornada {
    margin: 24px 0;
}

.mestra-jornada__caixa {
    border: 1px solid rgba(128, 128, 128, .35);
    border-left: 4px solid #f59d1a;
    border-radius: 10px;
    padding: 24px 28px;
    color: inherit;
}

.mestra-jornada__titulo {
    margin: 0 0 8px;
    font-size: 20px;
    line-height: 1.3;
    /* O tema capitaliza toda palavra de titulo, o que em portugues escreve
       "Entre Na Sua Conta". Aqui o texto vale como foi escrito. */
    text-transform: none;
}

.mestra-jornada__texto {
    margin: 0;
    opacity: .85;
    line-height: 1.6;
}

.mestra-jornada__botao {
    display: inline-block;
    margin-top: 18px;
    padding: 14px 28px;
    border: 0;
    border-radius: 6px;
    background: #f59d1a;
    color: #1d1d1d;
    font-weight: 700;
    font-size: 15px;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
}

.mestra-jornada__botao:hover,
.mestra-jornada__botao:focus {
    background: #e78d00;
    color: #1d1d1d;
    text-decoration: none;
}

.mestra-jornada__botao[disabled] {
    opacity: .6;
    cursor: default;
}

.mestra-jornada__nota,
.mestra-jornada__aviso {
    margin: 10px 0 0;
    font-size: 13px;
    line-height: 1.5;
    opacity: .7;
}

.mestra-jornada__aviso {
    color: #dc3545;
    opacity: 1;
}

/* Enquanto se espera, a borda pulsa devagar — sinal de que a pagina esta
   viva e olhando, sem virar animacao que incomoda quem fica minutos ali. */
.mestra-jornada__caixa--aguardando {
    border-left-color: #f4b400;
    animation: mestra-jornada-espera 2.4s ease-in-out infinite;
}

@keyframes mestra-jornada-espera {
    50% { border-left-color: rgba(244, 180, 0, .3); }
}

@media (prefers-reduced-motion: reduce) {
    .mestra-jornada__caixa--aguardando { animation: none; }
}

.mestra-jornada__caixa--aprovada {
    border-left-color: #28a745;
}

.mestra-jornada__caixa--reprovada,
.mestra-jornada__caixa--expirada {
    border-left-color: #dc3545;
}

@media (max-width: 600px) {
    .mestra-jornada__caixa {
        padding: 20px;
    }

    .mestra-jornada__botao {
        display: block;
        width: 100%;
        text-align: center;
    }
}