/* ==========================================================================
   Felikis — Radar (produto de dados). Usa as variáveis de theme.css.
   Carregar depois de theme.css.
   ========================================================================== */

/* ---------- Selos de estado (disponível / parcial / homologação / roadmap) ---------- */
.state-badge {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-weight: 700;
  font-size: .68rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  border-radius: 50rem;
  padding: .26rem .7rem;
  border: 1px solid transparent;
  white-space: nowrap;
}
.state-badge .pip { width: 7px; height: 7px; border-radius: 50%; background-color: currentColor; flex-shrink: 0; }
.state-badge.is-disponivel { background-color: var(--fx-teal-light); color: var(--fx-teal); }
.state-badge.is-parcial    { background-color: var(--fx-primary-light); color: var(--fx-primary-dark); }
.state-badge.is-homologacao{ background-color: var(--fx-amber-light); color: var(--fx-amber); }
.state-badge.is-roadmap     { background-color: var(--fx-bg-soft); color: var(--fx-muted); border-color: var(--fx-border); }

/* ---------- Faixa de números (prova de escala) ---------- */
.metric-card {
  background-color: #fff;
  border: 1px solid var(--fx-border);
  border-top: 3px solid var(--fx-primary);
  border-radius: 1rem;
  padding: 1.5rem 1.25rem;
  height: 100%;
}
.metric-card .num { font-weight: 800; font-size: 2rem; color: var(--fx-primary); letter-spacing: -0.02em; line-height: 1.1; }
.metric-card .lbl { font-weight: 600; color: var(--fx-ink); margin-top: .35rem; }
.metric-card .sub { font-size: .82rem; color: var(--fx-muted); margin-top: .15rem; }
.metric-card.accent-teal { border-top-color: var(--fx-teal); }
.metric-card.accent-teal .num { color: var(--fx-teal); }
.metric-card.accent-amber { border-top-color: var(--fx-amber); }
.metric-card.accent-amber .num { color: var(--fx-amber); }
.metric-card.accent-purple { border-top-color: var(--fx-purple); }
.metric-card.accent-purple .num { color: var(--fx-purple); }

/* ---------- Cards de formato de entrega (agnóstico) ---------- */
.delivery-card {
  background-color: #fff;
  border: 1px solid var(--fx-border);
  border-radius: 1rem;
  padding: 1.5rem;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: .6rem;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.delivery-card:hover { transform: translateY(-4px); box-shadow: 0 16px 32px rgba(15, 40, 35, .08); border-color: var(--fx-primary); }
.delivery-card .d-icon {
  width: 48px; height: 48px; border-radius: .75rem;
  display: inline-flex; align-items: center; justify-content: center;
  background-color: var(--fx-primary-light); color: var(--fx-primary);
}
.delivery-card h3 { font-size: 1.05rem; font-weight: 700; margin: 0; }
.delivery-card p { color: var(--fx-muted); font-size: .9rem; margin: 0; flex-grow: 1; }

/* ---------- Cards de módulo ---------- */
.module-card {
  background-color: #fff;
  border: 1px solid var(--fx-border);
  border-left: 4px solid var(--fx-primary);
  border-radius: 1rem;
  padding: 1.75rem;
  height: 100%;
}
.module-card.accent-teal { border-left-color: var(--fx-teal); }
.module-card.accent-amber { border-left-color: var(--fx-amber); }
.module-card.accent-purple { border-left-color: var(--fx-purple); }
.module-card__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; flex-wrap: wrap; }
.module-card h3 { font-size: 1.15rem; font-weight: 700; margin: 0; }
.module-card ul { margin: .75rem 0 0; padding-left: 1.1rem; color: var(--fx-muted); font-size: .92rem; }
.module-card li { margin-bottom: .35rem; }

/* ---------- Tabela de formatos / dicionário ---------- */
.data-table-wrap { background-color: #fff; border: 1px solid var(--fx-border); border-radius: 1rem; overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; font-size: .93rem; margin: 0; }
.data-table thead th {
  background-color: var(--fx-bg-soft); text-align: left; font-weight: 700;
  font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--fx-muted);
  padding: .85rem 1rem; white-space: nowrap;
}
.data-table td, .data-table th { padding: .8rem 1rem; border-top: 1px solid var(--fx-border); vertical-align: middle; }
.data-table tbody th { font-weight: 600; color: var(--fx-ink); }
.data-table code { background-color: var(--fx-bg-soft); border-radius: .3rem; padding: .1rem .4rem; font-size: .85rem; color: var(--fx-primary-dark); }

/* ---------- Bloco de código / exemplo ---------- */
.code-block {
  background-color: #10222b;
  color: #d6e6ee;
  border-radius: .85rem;
  padding: 1.15rem 1.35rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .85rem;
  line-height: 1.6;
  overflow-x: auto;
  border: 1px solid var(--fx-border);
}
.code-block .tok-key { color: #7fd4ef; }
.code-block .tok-str { color: #9be3a8; }
.code-block .tok-com { color: #6b8794; }

/* ---------- Callout de honestidade / aviso metodológico ---------- */
.data-note {
  border-left: 4px solid var(--fx-primary);
  background-color: var(--fx-primary-light);
  border-radius: .6rem;
  padding: 1rem 1.25rem;
  font-size: .92rem;
}
.data-note.accent-amber { border-left-color: var(--fx-amber); background-color: var(--fx-amber-light); }
.data-note strong { color: var(--fx-primary-dark); }

/* ---------- Legenda de estados ---------- */
.state-legend { display: flex; flex-wrap: wrap; gap: .6rem 1.25rem; align-items: center; }
.state-legend .item { display: inline-flex; align-items: center; gap: .4rem; font-size: .85rem; color: var(--fx-muted); }
.state-legend .dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.state-legend .dot.d { background-color: var(--fx-teal); }
.state-legend .dot.p { background-color: var(--fx-primary); }
.state-legend .dot.h { background-color: var(--fx-amber); }
.state-legend .dot.r { background-color: var(--fx-muted); }

/* ---------- Faixa de destaque do catálogo ---------- */
.catalog-cta {
  background: linear-gradient(120deg, var(--fx-primary) 0%, var(--fx-primary-dark) 100%);
  color: #fff;
  border-radius: 1.25rem;
  box-shadow: 0 22px 48px rgba(15, 40, 35, .18);
  position: relative;
  overflow: hidden;
}
.catalog-cta::after {
  content: "";
  position: absolute;
  right: -60px; top: -60px;
  width: 260px; height: 260px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .08);
  pointer-events: none;
}
.catalog-cta__eyebrow {
  display: inline-block;
  font-weight: 700; font-size: .78rem;
  text-transform: uppercase; letter-spacing: .08em;
  color: #bfe6f4;
}
.catalog-cta__title { font-weight: 800; letter-spacing: -0.02em; font-size: 2rem; line-height: 1.15; }
.catalog-cta__lead { color: rgba(255, 255, 255, .85); max-width: 620px; }
.catalog-cta .btn-outline-light { border-width: 1.5px; font-weight: 600; }
.catalog-cta__chips { display: flex; flex-direction: column; gap: .55rem; position: relative; z-index: 1; }
.catalog-cta__chips span {
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 50rem;
  padding: .5rem 1rem;
  font-size: .9rem;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
}
.catalog-cta__chips span::before {
  content: "";
  width: 7px; height: 7px; border-radius: 50%;
  background: #7fd4ef; flex-shrink: 0;
}
@media (max-width: 575.98px) {
  .catalog-cta__title { font-size: 1.6rem; }
}

/* ---------- Navbar mais compacto (acomoda mais itens de menu) ---------- */
.navbar-fx .navbar-nav .nav-link.px-3 { padding-left: .7rem !important; padding-right: .7rem !important; }