/*=========================================================
    HELP MED CWB — Minha conta (área do usuário)

    Página do PÚBLICO: herda a identidade do site
    (style.css/conta.css); aqui só o que é próprio dela.
=========================================================*/

.pagina-minha-conta{

    display:flex;
    justify-content:center;

    padding:40px 16px 80px;

    min-height:70vh;

    background:#f4f4f8;

}

.cartao-minha-conta{

    width:100%;
    max-width:820px;

    padding:30px 34px;

    background:#ffffff;

    border-radius:16px;

    box-shadow:0 10px 30px rgba(20,20,60, .08);

}

.topo-conta{

    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;

    margin-bottom:10px;

}

.topo-conta h1{
    font-size:24px;
    color:#060775;
}

.topo-conta p{
    color:#5c6b76;
    font-size:14px;
}

.btn-sair-conta{

    padding:8px 18px;

    background:transparent;

    border:1px solid #cfcfd9;
    border-radius:8px;

    font-family:inherit;
    font-weight:600;

    cursor:pointer;

    transition:.2s;

}

.btn-sair-conta:hover,
.btn-sair-conta:focus{
    border-color:#060775;
    color:#060775;
}

.mensagem-conta{
    min-height:18px;
    font-size:13px;
    font-weight:600;
}

.mensagem-conta a{
    color:#060775;
}

/*=====================================================
    SEÇÕES
=====================================================*/

.secao-conta{
    margin-top:26px;
}

.titulo-secao-conta{

    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:10px;

}

.titulo-secao-conta h2{
    font-size:17px;
    color:#22303a;
}

.titulo-secao-conta a{
    font-size:13px;
    font-weight:600;
    color:#060775;
    text-decoration:none;
}

.titulo-secao-conta a:hover,
.titulo-secao-conta a:focus{
    text-decoration:underline;
}

.explica-conta{
    margin:4px 0 12px;
    font-size:12.5px;
    color:#5c6b76;
}

.lista-conta{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.vazio-conta{
    padding:18px 0;
    color:#5c6b76;
    font-size:14px;
}

/*=====================================================
    ITENS
=====================================================*/

.item-conta{

    padding:14px 16px;

    border:1px solid #e2e2e9;
    border-radius:10px;

}

.item-conta header{

    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;

    margin-bottom:6px;

}

.item-conta header strong{
    font-size:14px;
}

.data-conta{
    margin-left:auto;
    font-size:12px;
    color:#5c6b76;
}

.item-conta ul{

    margin:0;
    padding-left:18px;

    font-size:13.5px;

}

.pendencia-conta{
    color:#9a6417;
    font-weight:600;
}

.prazo-conta{
    margin-top:6px;
    font-size:13px;
}

/*=====================================================
    SELOS
=====================================================*/

.selo-conta{

    padding:3px 10px;

    border-radius:999px;

    font-size:11.5px;
    font-weight:600;

    white-space:nowrap;

}

.selo-conta.tom-andamento{ background:#e7eefb; color:#2c5aa8; }
.selo-conta.tom-pronto{ background:#eaf6df; color:#4c7a1e; }
.selo-conta.tom-concluido{ background:#060775; color:#ffffff; }
.selo-conta.tom-encerrado{ background:#f0f0f0; color:#6b6b6b; }

/* Pendente e o unico selo que pede ACAO de quem esta lendo -- o pedido so
   anda quando a foto da receita chegar. Por isso o tom de alerta. */
.selo-conta.tom-pendente{ background:#fdf3e7; color:#8a5a12; }

/*=====================================================
    PENDENCIA DA RECEITA (2026-09-17)

    A receita pode ser anexada sem bloquear a análise do pedido.
    Quando falta -- ou quando a equipe devolveu por
    ilegivel -- a pendencia e o que a resolve ficam no
    mesmo cartao.
=====================================================*/

.pendencia-receita{

    display:grid;
    gap:10px;

    margin-top:12px;
    padding:14px 16px;

    background:#fdf3e7;

    border-radius:12px;

}

.pendencia-receita p{
    margin:0;
    font-size:14px;
    line-height:1.55;
}

.motivo-receita{
    color:#8a5a12;
    font-weight:600;
}

.pendencia-receita input[type=file]{
    font-size:13.5px;
}

.pendencia-receita .btn-conta{
    justify-self:start;
}

.resposta-receita:empty{
    display:none;
}

.resposta-receita{
    font-size:13.5px;
    font-weight:600;
}

@media (max-width:560px){

    .cartao-minha-conta{
        padding:22px 18px;
    }

    .data-conta{
        margin-left:0;
        width:100%;
    }

}

/* Pagina de privacidade reusa o cartao da conta. */
.pagina-privacidade h1{
    font-size:24px;
    color:#060775;
    margin-bottom:8px;
}

.pagina-privacidade h2{
    font-size:16px;
    color:#22303a;
    margin:22px 0 8px;
}

.pagina-privacidade ul{
    padding-left:20px;
    font-size:14px;
    line-height:1.7;
}

.pagina-privacidade li{
    margin-bottom:8px;
}

.pagina-privacidade p{
    font-size:14px;
    line-height:1.7;
}

.pagina-privacidade a{
    color:#060775;
}

/* Meus dados. */
.form-meus-dados{

    display:flex;
    flex-wrap:wrap;
    align-items:flex-end;
    gap:12px;

}

.form-meus-dados label{

    display:block;

    flex:1 1 200px;

    font-size:13px;
    font-weight:600;

}

.form-meus-dados input{

    display:block;

    width:100%;

    margin-top:4px;
    padding:9px 11px;

    border:1px solid #cfcfd9;
    border-radius:8px;

    font-family:inherit;
    font-size:14px;

}

/* Historico dentro do item. */
.historico-conta{
    margin-top:8px;
    font-size:12.5px;
}

.historico-conta summary{
    cursor:pointer;
    color:#060775;
    font-weight:600;
}

.historico-conta ul{
    margin-top:6px;
    color:#5c6b76;
}

/* Endereco da conta (#29). */
.form-endereco-conta{

    display:grid;

    grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
    gap:12px;

    align-items:end;

}

.form-endereco-conta label{

    display:block;

    font-size:13px;
    font-weight:600;

}

.form-endereco-conta input{

    display:block;

    width:100%;

    margin-top:4px;
    padding:9px 11px;

    border:1px solid #cfcfd9;
    border-radius:8px;

    font-family:inherit;
    font-size:14px;

}

.form-endereco-conta .campo-largo{
    grid-column:span 2;
}

.form-endereco-conta .campo-uf-conta{
    max-width:90px;
}

.acoes-endereco-conta{

    grid-column:1 / -1;

    display:flex;
    flex-wrap:wrap;
    gap:10px;

}

.btn-remover-endereco{

    padding:10px 16px;

    background:#ffffff;

    border:1px solid #cfcfd9;
    border-radius:8px;

    color:#8c2626;

    font-family:inherit;
    font-size:14px;
    font-weight:600;

    cursor:pointer;

}

.btn-remover-endereco:hover{
    border-color:#8c2626;
}