/* ==========================================================================
   Área do Participante (MIC) - camada visual sobre o design system do site
   ========================================================================== */

:root {
    --mic-verde-escuro: #14452f;
    --mic-verde-claro: #41a779;
    --mic-cinza-borda: #e2e5e2;
    --mic-cinza-fundo: #f7f8f7;
    --mic-texto-suave: #6b7a71;
}

.mic-oculto { display: none; }

/* ---- Cartão centralizado (login / cadastro / novo trabalho) ------------- */
.mic-cartao-wrapper {
    display: flex;
    justify-content: center;
    width: 100%;
}
.mic-cartao {
    position: relative;
    width: 100%;
    background: #fff;
    border: 1px solid var(--mic-cinza-borda);
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(20, 69, 47, 0.08);
    padding: 40px 45px;
    box-sizing: border-box;
}
.mic-cartao.mic-cartao-estreito { max-width: 480px; }
.mic-cartao.mic-cartao-medio { max-width: 720px; }
.mic-cartao.mic-cartao-largo { max-width: 920px; }

.mic-cartao-titulo {
    margin: 0 0 6px 0;
    color: var(--mic-verde-escuro);
    font-size: 22px;
    font-weight: 700;
}
.mic-cartao-subtitulo {
    margin: 0 0 28px 0;
    color: var(--mic-texto-suave);
    font-size: 14px;
}

/* ---- Campos com ícone ---------------------------------------------------- */
.mic-cartao .formulario .campo { margin: 0 0 18px 0; width: 100%; }
.mic-cartao .formulario .linha { display: flex; gap: 20px; margin: 0 0 0 0; width: 100%; }
.mic-cartao .formulario .linha .campo.metade { width: calc(50% - 10px); }
.mic-cartao .formulario .campo label {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--mic-verde-escuro);
    margin-bottom: 6px;
}
.mic-cartao .formulario .campo-icone { position: relative; }
.mic-cartao .formulario .campo-icone input,
.mic-cartao .formulario .campo-icone select {
    padding-left: 40px !important;
}
.mic-cartao .formulario .campo-icone i {
    position: absolute;
    left: 14px;
    top: 38px;
    color: var(--mic-texto-suave);
    font-size: 15px;
    pointer-events: none;
}
.mic-cartao .formulario .campo input,
.mic-cartao .formulario .campo select {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--mic-cinza-borda);
    background-color: var(--mic-cinza-fundo);
    transition: border-color .15s, background-color .15s;
}
.mic-cartao .formulario .campo input:focus,
.mic-cartao .formulario .campo select:focus {
    outline: none;
    border-color: var(--mic-verde-claro);
    background-color: #fff;
}

.mic-cartao .formulario .campo.linhadosbotoes {
    display: flex;
    width: 100%;
    box-sizing: border-box;
    align-items: center;
    gap: 14px;
    margin-top: 8px;
}
.mic-cartao .formulario .botao.padrao.noformulario { padding: 12px 26px; }

.mic-cartao-rodape {
    clear: both;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--mic-cinza-borda);
    text-align: center;
    font-size: 14px;
    color: var(--mic-texto-suave);
}
.mic-cartao-rodape a { color: var(--mic-verde-escuro); font-weight: 700; }
.mic-cartao-rodape p { font-size: 14px; margin: 0; }
.mic-cartao-rodape p + p { margin-top: 8px; }

/* ---- Alertas -------------------------------------------------------------- */
.mic-cartao .alertaformulario { margin-bottom: 22px; }

/* ---- Seções dentro do formulário (novo trabalho) --------------------------- */
.mic-secao-titulo {
    display: flex;
    width: 100%;
    box-sizing: border-box;
    align-items: center;
    gap: 10px;
    margin: 30px 0 16px 0;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--mic-cinza-borda);
    color: var(--mic-verde-escuro);
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.mic-secao-titulo:first-child { margin-top: 0; }
.mic-secao-titulo i { color: var(--mic-verde-claro); font-size: 16px; }

/* ---- Linhas repetíveis (autores/orientadores) ------------------------------ */
.mic-linha-repetivel {
    display: flex;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    gap: 10px;
    margin-bottom: 10px;
}
.mic-linha-repetivel input { flex: 1 1 0%; }
.mic-linha-repetivel .mic-remover-linha {
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border: 1px solid var(--mic-cinza-borda);
    background: var(--mic-cinza-fundo);
    border-radius: 6px;
    color: #c0392b;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color .15s;
}
.mic-linha-repetivel .mic-remover-linha:hover { background: #fdecea; }
.mic-link-adicionar {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 2px;
    font-size: 14px;
    font-weight: 700;
    color: var(--mic-verde-escuro);
}
.mic-link-adicionar:hover { color: var(--mic-verde-claro); }

/* ---- Upload de arquivo ------------------------------------------------------ */
.mic-upload {
    position: relative;
    border: 2px dashed var(--mic-cinza-borda);
    border-radius: 10px;
    background: var(--mic-cinza-fundo);
    padding: 18px;
    text-align: center;
    transition: border-color .15s, background-color .15s;
}
.mic-upload:hover { border-color: var(--mic-verde-claro); }
.mic-upload i { display: block; font-size: 22px; color: var(--mic-verde-claro); margin-bottom: 8px; }
.mic-upload .mic-upload-legenda { font-size: 13px; color: var(--mic-texto-suave); }
.mic-upload .mic-upload-nome { font-size: 13px; color: var(--mic-verde-escuro); font-weight: 700; margin-top: 4px; }
.mic-upload input[type="file"] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

/* ---- Menu do participante --------------------------------------------------- */
.mic-menu {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 30px;
    padding: 6px;
    background: var(--mic-cinza-fundo);
    border: 1px solid var(--mic-cinza-borda);
    border-radius: 12px;
}
.mic-menu a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 700;
    color: var(--mic-texto-suave);
    text-decoration: none;
    transition: background-color .15s, color .15s;
}
.mic-menu a i { font-size: 14px; width: 16px; text-align: center; }
.mic-menu a:hover { background: #fff; color: var(--mic-verde-escuro); }
.mic-menu a.ativo { background: var(--mic-verde-escuro); color: #fff; }
.mic-menu a.mic-menu-sair { margin-left: auto; color: #c0392b; }
.mic-menu a.mic-menu-sair:hover { background: #fdecea; color: #c0392b; }

/* ---- Cabeçalho das telas de listagem ----------------------------------------- */
.mic-boasvindas {
    margin: 0 0 4px 0;
    color: var(--mic-verde-escuro);
    font-size: 20px;
    font-weight: 700;
}
.mic-contador {
    margin: 0;
    color: var(--mic-texto-suave);
    font-size: 14px;
}
.mic-contador strong { color: var(--mic-verde-escuro); }

/* ---- Tabela ------------------------------------------------------------------- */
.mic-tabela-wrapper {
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--mic-cinza-borda);
    border-radius: 12px;
    margin-top: 18px;
}
.mic-tabela {
    position: relative;
    width: 100%;
    min-width: 600px;
    border-collapse: collapse;
}
.mic-tabela th,
.mic-tabela td {
    text-align: left;
    padding: 14px 18px;
    font-size: 14px;
}
.mic-tabela thead th {
    background-color: var(--mic-cinza-fundo);
    color: var(--mic-verde-escuro);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .04em;
    border-bottom: 1px solid var(--mic-cinza-borda);
}
.mic-tabela tbody tr { border-bottom: 1px solid var(--mic-cinza-borda); transition: background-color .15s; }
.mic-tabela tbody tr:last-child { border-bottom: none; }
.mic-tabela tbody tr:hover { background-color: var(--mic-cinza-fundo); }
.mic-tabela td.mic-col-titulo { font-weight: 700; color: #2b2b2b; }

/* ---- Badge de status ----------------------------------------------------------- */
.mic-status {
    display: inline-block;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
    background: #eef2ef;
    color: var(--mic-verde-escuro);
}
.mic-status.mic-status-aprovado { background: #e6f4ea; color: #1e7e34; }
.mic-status.mic-status-rejeitado { background: #fdecea; color: #c0392b; }
.mic-status.mic-status-aguardando { background: #fff6e0; color: #9a7100; }

/* ---- Estado vazio --------------------------------------------------------------- */
.mic-vazio {
    padding: 40px 20px;
    text-align: center;
    color: var(--mic-texto-suave);
    background: var(--mic-cinza-fundo);
    border: 1px dashed var(--mic-cinza-borda);
    border-radius: 12px;
    margin-top: 18px;
}
.mic-vazio a { color: var(--mic-verde-escuro); font-weight: 700; }

/* ---- Anais ------------------------------------------------------------------------ */
.mic-anais-intro {
    margin: 0 0 22px 0;
    color: var(--mic-texto-suave);
    font-size: 16px;
    line-height: 1.5;
}
.mic-anais-intro strong { color: var(--mic-verde-escuro); }

.mic-filtro {
    display: flex;
    align-items: flex-end;
    gap: 16px;
    flex-wrap: wrap;
    margin: 0 0 32px 0;
    padding: 22px;
    background: var(--mic-cinza-fundo);
    border: 1px solid var(--mic-cinza-borda);
    border-radius: 12px;
}
.mic-filtro .campo { flex: 1 1 220px; }
.mic-filtro .campo label {
    display: block;
    margin-bottom: 6px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--mic-verde-escuro);
}
.mic-filtro .campo select {
    width: 100%;
    box-sizing: border-box;
    padding: 12px 14px;
    font-size: 15px;
    border: 1px solid var(--mic-cinza-borda);
    background-color: #fff;
    border-radius: 8px;
}
.mic-filtro .campo select:focus {
    outline: none;
    border-color: var(--mic-verde-claro);
}
.mic-filtro .campo select:disabled { background-color: #eef0ee; color: #9aa59e; cursor: not-allowed; }
.mic-filtro .botao { flex: 0 0 auto; }
.mic-filtro .botao i { margin-right: 6px; }

.mic-anos {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 14px;
    margin-top: 18px;
}
.mic-ano-cartao {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 22px 12px;
    text-decoration: none;
    background: #fff;
    border: 1px solid var(--mic-cinza-borda);
    border-radius: 12px;
    transition: border-color .15s, box-shadow .15s, transform .15s;
}
.mic-ano-cartao strong { font-size: 28px; font-weight: 700; color: var(--mic-verde-escuro); line-height: 1.1; }
.mic-ano-cartao span { font-size: 13px; color: var(--mic-texto-suave); }
.mic-ano-cartao:hover {
    border-color: var(--mic-verde-claro);
    box-shadow: 0 6px 18px rgba(20, 69, 47, .12);
    transform: translateY(-2px);
}

.mic-anais-resumo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 18px;
}
.mic-link-voltar {
    color: var(--mic-verde-escuro);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}
.mic-link-voltar i { margin-right: 6px; }
.mic-link-voltar:hover { color: var(--mic-verde-claro); }

.mic-anais-lista { display: flex; flex-direction: column; gap: 14px; }
.mic-anais-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    padding: 20px 24px;
    background: #fff;
    border: 1px solid var(--mic-cinza-borda);
    border-left: 4px solid var(--mic-verde-claro);
    border-radius: 12px;
    transition: box-shadow .15s;
}
.mic-anais-item:hover { box-shadow: 0 6px 18px rgba(20, 69, 47, .1); }
.mic-anais-corpo { flex: 1 1 auto; min-width: 0; }
.mic-anais-corpo h4 {
    margin: 0 0 10px 0;
    font-size: 17px;
    line-height: 1.35;
    color: var(--mic-verde-escuro);
}
.mic-anais-corpo p {
    margin: 0 0 4px 0;
    font-size: 14px;
    line-height: 1.5;
    color: #3b3b3b;
}
.mic-anais-corpo p b { color: var(--mic-verde-escuro); }
.mic-anais-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.mic-anais-tags span {
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 700;
    border-radius: 999px;
    background: #eef2ef;
    color: var(--mic-verde-escuro);
}
.mic-anais-tags span i { margin-right: 5px; color: var(--mic-verde-claro); }
.mic-anais-acoes { display: flex; flex-direction: column; gap: 8px; flex: 0 0 auto; }
.mic-anais-acoes .botao { padding: 10px 18px; font-size: 13px; white-space: nowrap; }
.mic-anais-acoes .botao i { margin-right: 6px; }

/* ---- Responsivo ------------------------------------------------------------------ */
@media (max-width: 767px) {

    .mic-cartao { padding: 28px 20px; }
    .mic-cartao .formulario .linha { flex-direction: column; gap: 0; }
    .mic-cartao .formulario .linha .campo.metade { width: 100%; }

    .mic-linha-repetivel { flex-wrap: wrap; }
    .mic-linha-repetivel input { flex: 1 1 100%; }
    .mic-linha-repetivel .mic-remover-linha { margin-left: auto; }

    .mic-menu {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        padding: 8px;
    }
    .mic-menu a {
        justify-content: center;
        text-align: center;
        padding: 12px 8px;
        font-size: 13px;
    }
    .mic-menu a.mic-menu-sair { margin-left: 0; grid-column: 1 / -1; }

    .indice { flex-direction: column; align-items: flex-start; gap: 14px; }
    .indice .minipesquisa { width: 100%; }

    /* Tabela vira uma lista de cartões - cabeçalho oculto, cada linha é um bloco
       e cada célula ganha o rótulo da coluna via data-label. */
    .mic-tabela-wrapper { border: none; overflow-x: visible; }
    .mic-tabela { min-width: 0; }
    .mic-tabela thead { display: none; }
    .mic-tabela tbody tr {
        display: block;
        margin-bottom: 14px;
        border: 1px solid var(--mic-cinza-borda);
        border-radius: 12px;
        overflow: hidden;
    }
    .mic-tabela tbody tr:last-child { margin-bottom: 0; }
    .mic-tabela td {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        width: 100%;
        box-sizing: border-box;
        padding: 12px 16px;
        border-bottom: 1px solid var(--mic-cinza-borda);
        text-align: right;
    }
    .mic-tabela td:last-child { border-bottom: none; }
    .mic-tabela td[data-label]:before {
        content: attr(data-label);
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .04em;
        color: var(--mic-verde-escuro);
        text-align: left;
    }
    .mic-tabela td[data-label=""] { display: block; text-align: center; }
    .mic-tabela td[data-label=""] .botao { width: 100%; box-sizing: border-box; }
    .mic-tabela td[data-label=""] .botao i { margin-right: 6px; }
    .mic-tabela td.mic-col-titulo {
        display: block;
        background: var(--mic-cinza-fundo);
        text-align: left;
    }
    .mic-tabela td.mic-col-titulo:before { display: none; }

    .mic-filtro { padding: 16px; }
    .mic-filtro .botao { width: 100%; }
    .mic-anos { grid-template-columns: repeat(2, 1fr); }
    .mic-anais-item { flex-direction: column; align-items: stretch; gap: 16px; padding: 18px; }
    .mic-anais-acoes { flex-direction: row; flex-wrap: wrap; }
    .mic-anais-acoes .botao { flex: 1 1 130px; text-align: center; }

}