/* ============================================================
   AQUI LEM – Foto e PDF do currículo (js/curriculo-arquivos.js)
   Peças usadas em perfil.html, curriculo.html e candidatos.html:
   prévia da foto, cartão do PDF anexado, pergunta de confirmação
   e a prévia do currículo para imprimir.
   ============================================================ */

.ca-texto { margin: 4px 0 6px; color: var(--lem-ink-2); font-size: 15px; line-height: 1.55; }

/* ── Prévia da foto ─────────────────────────────────────── */
.fp-previa { text-align: center; }
.fp-previa-img {
  width: 168px; height: 168px; margin: 8px auto 16px; border-radius: 50%; overflow: hidden;
  box-shadow: 0 0 0 6px var(--lem-mint), 0 14px 34px rgba(5, 150, 105, .22); background: var(--lem-bg);
}
.fp-previa-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fp-previa p { color: var(--lem-ink-2); font-size: 14.5px; line-height: 1.5; margin: 0 0 10px; }
.fp-dicas { list-style: none; padding: 0; margin: 0 0 6px; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 14px; }
.fp-dicas li { font-size: 13px; color: var(--lem-mute); display: flex; align-items: center; gap: 6px; }
.fp-dicas li::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--lem-green-l); }
.fp-progresso { height: 8px; border-radius: 99px; background: #e6efe9; overflow: hidden; margin-top: 12px; }
.fp-progresso i { display: block; height: 100%; width: 0; background: var(--lem-grad); border-radius: inherit; transition: width .2s; }

/* ── Cartão do PDF anexado ──────────────────────────────── */
.ax { border-radius: 16px; transition: box-shadow .15s, background .15s; }
.ax.ax-arrastando { box-shadow: 0 0 0 3px var(--lem-green-l); background: var(--lem-mint); }
.ax-vazio, .ax-linha { display: flex; align-items: center; gap: 14px; }
.ax-vazio {
  padding: 14px 16px; border: 1.5px dashed var(--lem-line-2); border-radius: 16px; cursor: pointer;
  background: #fbfdfc; transition: border-color .15s, background .15s;
}
.ax-vazio:hover, .ax-vazio:focus-visible { border-color: var(--lem-green-l); background: var(--lem-mint); outline: none; }
.ax-ico {
  width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; flex-shrink: 0;
  background: var(--lem-mint); color: var(--lem-green-d);
}
.ax-ico svg { width: 22px; height: 22px; }
.ax-ico-pdf { background: #fee2e2; color: #b91c1c; font-size: 12px; font-weight: 900; letter-spacing: .04em; }
.ax-info { flex: 1; min-width: 0; }
.ax-info b { display: block; font-size: 14.5px; color: var(--lem-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ax-info small { display: block; font-size: 12.5px; color: var(--lem-mute); margin-top: 2px; line-height: 1.4; }
.ax-btn { min-height: 40px; padding: 0 14px; font-size: 14px; flex-shrink: 0; }
.ax-acoes { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.ax-acoes .ui-btn { min-height: 40px; padding: 0 14px; font-size: 14px; flex: 1; }
.ax-acoes .ui-btn-perigo { flex: 0 0 auto; }
@media (max-width: 480px) {
  .ax-vazio { flex-wrap: wrap; }
  .ax-vazio .ax-btn { width: 100%; }
  .ax-acoes .ui-btn-perigo span { display: none; }
}

/* ── Prévia do currículo (folha com a página /cv dentro) ── */
.cv-previa-folha { width: min(980px, calc(100vw - 48px)) !important; max-height: 92vh !important; }
.cv-previa-folha .ui-sheet-corpo { padding: 0 !important; background: #e9efeb; display: flex; }
.cv-previa-folha iframe { width: 100%; height: 72vh; border: 0; display: block; background: #e9efeb; }
@media (max-width: 767px) {
  .cv-previa-folha { width: 100% !important; max-height: 94vh !important; }
  .cv-previa-folha iframe { height: 74vh; }
}
.cv-previa-dica { font-size: 12.5px; color: var(--lem-mute); flex: 1 1 100%; margin: 0; line-height: 1.4; }

/* ── Editor (curriculo.html): seção da foto e atalhos da prévia ── */
.cvf { display: flex; align-items: center; gap: 18px; }
.cvf-foto {
  width: 92px; height: 92px; border-radius: 50%; overflow: hidden; flex-shrink: 0; display: grid; place-items: center;
  background: var(--lem-grad); color: #fff; font-size: 30px; font-weight: 900;
  box-shadow: 0 0 0 4px var(--lem-mint), 0 8px 20px rgba(5, 150, 105, .2);
}
.cvf-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cvf-txt { flex: 1; min-width: 0; }
.cvf-txt .ui-dica { display: block; margin-top: 8px; line-height: 1.45; }
@media (max-width: 480px) { .cvf { flex-direction: column; text-align: center; } .cvf-txt .ui-btn { width: 100%; } }

.cvf-ver {
  display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; margin-top: 14px;
  min-height: 44px; border-radius: 12px; border: 1.5px solid var(--lem-line-2); background: #fff; cursor: pointer;
  font: 700 14px 'Inter', sans-serif; color: var(--lem-green-d); grid-column: 1 / -1;
}
.cvf-ver:hover { border-color: var(--lem-green-l); background: var(--lem-mint); }
.cvf-ver svg { width: 18px; height: 18px; }
@media (max-width: 767px) {
  .cv-barra .cvf-btn-previa { flex: 0 0 auto !important; width: 52px; padding: 0; }
  .cv-barra .cvf-btn-previa span { display: none; }
}

/* Links com cara de botão nas páginas .vg: "body.vg a { color: inherit }"
   (vagas.css) vence as cores do kit e o texto do botão some no fundo. */
.vg a.ui-btn-primario, .vg a.ui-btn-zap { color: #fff; }
.vg a.ui-btn-ouro { color: #3b2300; }
.vg a.ui-btn-contorno, .vg a.ui-btn-suave { color: var(--lem-green-d); }
.vg a.ui-btn-perigo { color: var(--lem-red); }
