/* Beneficios por modelo de contratacao (admin preview + pagina publica).
   Fonte unica; espelhado p/ carreiras_subdomain/assets/css/ pelo build.py. */

.ben-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 20px;
}

.ben-card {
  background: #fff;
  border: 1px solid #e6eaf0;
  border-radius: 14px;
  padding: 22px 22px 20px;
  display: flex;
  flex-direction: column;
  min-width: 0; /* permite que o card encolha na grid e o texto quebre */
  box-shadow: 0 1px 2px rgba(8, 39, 100, .04);
}

.ben-card-head { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.ben-ico { width: 20px; height: 20px; flex: none; }
.ben-ico--shield { width: 22px; height: 22px; color: var(--coral, #0097b2); }
.ben-card-title {
  margin: 0;
  font-family: var(--font-display, 'Sora', sans-serif);
  font-size: var(--fs-h4, 20px);
  font-weight: 700;
  line-height: 1.25;
  color: var(--azul-profundo, #082764);
  overflow-wrap: break-word; /* nomes longos nao estouram o card */
  min-width: 0;
}

.ben-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.ben-badge {
  font-size: var(--fs-eyebrow, 11px);
  font-weight: 700;
  letter-spacing: .02em;
  padding: 3px 10px;
  border-radius: 99px;
  color: #fff;
}
/* Cores AA: texto branco 11px bold exige >=4.5:1. Verde/laranja escurecidos do
   baseline (#16a34a 3.3:1 / #ea580c 3.5:1 reprovavam). Ver project_contrast_wcag_debt. */
.ben-badge--clt         { background: #0856B1; } /* 6.6:1 */
.ben-badge--estagio     { background: #15803d; } /* 5.0:1 */
.ben-badge--pj          { background: #7c3aed; } /* 5.0:1 */
.ben-badge--cooperativa { background: #c2410c; } /* 5.2:1 */

.ben-rows { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.ben-row { display: flex; align-items: flex-start; gap: 10px; }
.ben-row .ben-ico { margin-top: 1px; color: var(--azul-medio, #0856B1); }
.ben-row-txt { display: flex; flex-direction: column; gap: 1px; }
.ben-row-label { font-size: var(--fs-meta, 13px); font-weight: 700; color: var(--azul-profundo, #082764); }
.ben-row-val { font-size: var(--fs-meta, 13px); line-height: 1.5; color: #5b6573; }

.ben-divider { height: 1px; margin: 16px 0 14px; background: #eef1f5; }

.ben-dependentes {
  display: flex; align-items: center; gap: 8px;
  font-size: var(--fs-meta, 13px); font-weight: 700;
  color: var(--azul-profundo, #082764);
}
.ben-pill { font-size: 12px; font-weight: 700; padding: 2px 12px; border-radius: 99px; }
.ben-pill--yes { background: rgba(190, 24, 93, .12); color: #be185d; }
.ben-pill--no  { background: #eef1f5; color: #5b6573; }

/* Pagina publica: secao em destaque */
.vaga-beneficios { padding: 56px 0; background: #f6f8fb; }
.vaga-beneficios .container { max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.vaga-beneficios h2 {
  margin: 0 0 6px;
  font-family: var(--font-display, 'Sora', sans-serif);
  font-size: var(--fs-h2, 32px);
  color: var(--azul-profundo, #082764);
}
.vaga-beneficios-sub { margin: 0 0 28px; font-size: var(--fs-meta, 13px); color: #5b6573; }

/* Admin preview */
.ben-preview { margin-top: 6px; }

@media (max-width: 640px) { .ben-grid { grid-template-columns: 1fr; } }

/* ---------- Variante compacta (pagina publica): icone + nome ---------- */
.ben-grid--compact {
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 14px;
}
.ben-card--compact {
  flex-direction: row;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
}
.ben-card-icowrap {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgba(0, 151, 178, 0.10);
  color: var(--coral-text, #007a91);
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
}
.ben-card-icowrap .ben-ico { width: 22px; height: 22px; }
.ben-card-title--compact { font-size: 16px; }
@media (max-width: 640px) { .ben-grid--compact { grid-template-columns: 1fr 1fr; } }
@media (max-width: 440px) { .ben-grid--compact { grid-template-columns: 1fr; } }

/* ── Admin: preview denso (read-only, filtrado pela modalidade) ───────
   Linguagem do painel (admin.css): mono uppercase, denso, sem cards de
   marketing. Tokens --admin-*/--font-mono vem do admin.css (carregado antes). */
.ben-admin-list { list-style: none; margin: 6px 0 0; padding: 0; }
.ben-admin-item {
  padding: 13px 2px 14px;
  border-bottom: 1px solid var(--admin-border, rgba(8, 39, 100, .08));
}
.ben-admin-item:first-child { padding-top: 2px; }
.ben-admin-item:last-child { border-bottom: none; padding-bottom: 2px; }

.ben-admin-head { display: flex; align-items: center; gap: 9px; }
.ben-admin-head .ben-ico--shield { width: 17px; height: 17px; }
.ben-admin-nome {
  font-family: var(--font-display, 'Sora', sans-serif);
  font-size: 14.5px; font-weight: 600; line-height: 1.2;
  color: var(--admin-ink, #082764);
  overflow-wrap: break-word; min-width: 0;
}
.ben-admin-dep {
  margin-left: auto; flex: none; white-space: nowrap;
  font-family: var(--font-display, 'Sora', sans-serif);
  font-size: 10px; font-weight: 600; letter-spacing: .04em;
  padding: 2px 9px; border-radius: 999px;
}
.ben-admin-dep.is-yes { background: rgba(190, 24, 93, .1); color: #be185d; }
.ben-admin-dep.is-no  { background: rgba(107, 114, 128, .12); color: #4b5563; }

.ben-admin-meta { display: flex; flex-wrap: wrap; gap: 3px 16px; margin: 7px 0 0 26px; }
.ben-admin-meta span {
  font-family: var(--font-display, 'Sora', sans-serif);
  font-size: 11px; line-height: 1.5; color: #5b6573;
}
.ben-admin-meta b {
  font-size: 10px; font-weight: 600; letter-spacing: .04em;
  text-transform: uppercase; color: var(--azul-medio, #0856B1); margin-right: 3px;
}
.ben-admin-sub {
  display: flex; align-items: flex-start; gap: 6px;
  margin: 6px 0 0 26px; font-size: 12px; line-height: 1.5; color: #5b6573;
}
.ben-admin-sub .ben-ico { width: 14px; height: 14px; margin-top: 2px; flex: none; color: var(--admin-faint, #94a3b8); }
.ben-admin-sub b { font-weight: 600; color: var(--azul-medio, #0856B1); }