/*
 * =====================================================
 * ETAPA DE CONTEÚDO
 * =====================================================
 */

.publico-etapa-conteudo__itens {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
}

.publico-item {
  width: 100%;
  box-sizing: border-box;
}

/*
 * =====================================================
 * TEXTO
 * =====================================================
 */

.publico-item-texto {
  font-size: 0.95rem;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.publico-item-texto--normal {
  font-weight: 400;
}

.publico-item-texto--destaque {
  font-weight: 600;
}

.publico-item-texto--auxiliar {
  font-size: 0.875rem;
  opacity: 0.72;
}

/*
 * =====================================================
 * CAMPOS
 * =====================================================
 */

.publico-item-campo {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.publico-item-campo__label {
  display: block;
  font-size: 0.84rem;
  font-weight: 600;
  line-height: 1.35;
}

.publico-item-campo__obrigatorio {
  opacity: 0.8;
}

.publico-item-campo__controle {
  width: 100%;
  box-sizing: border-box;

  min-height: 44px;

  padding: 11px 12px;

  border: 1px solid rgba(15, 23, 42, 0.16);
  border-radius: 10px;

  background: #ffffff;

  font: inherit;
  font-size: 0.95rem;

  color: inherit;

  outline: none;

  transition:
    border-color 160ms ease,
    box-shadow 160ms ease;
}

.publico-item-campo__controle:focus {
  border-color: rgba(31, 78, 121, 0.62);

  box-shadow: 0 0 0 3px rgba(31, 78, 121, 0.09);
}

.publico-item-campo__controle::placeholder {
  color: rgba(15, 23, 42, 0.42);
}

.publico-item-textarea__controle {
  min-height: 96px;
  resize: vertical;
  line-height: 1.45;
}

/*
 * =====================================================
 * IMAGEM
 * =====================================================
 */

.publico-item-imagem {
  width: 100%;
  margin: 0;
}

.publico-item-imagem__imagem {
  display: block;

  width: 100%;
  max-width: 100%;
  height: auto;

  border-radius: 12px;

  object-fit: contain;
}

.publico-item-imagem__legenda {
  margin-top: 7px;

  padding: 0 2px;

  font-size: 0.8rem;
  line-height: 1.4;

  opacity: 0.72;
}

/*
 * =====================================================
 * VALIDAÇÃO DOS CAMPOS
 * =====================================================
 */

.publico-item-campo__erro {
  display: block;

  margin-top: 3px;

  font-size: 0.78rem;
  line-height: 1.35;

  color: #b42318;
}

.publico-item-campo__erro[hidden] {
  display: none;
}

.publico-item-campo--invalido .publico-item-campo__controle {
  border-color: rgba(180, 35, 24, 0.72);

  box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.08);
}

.publico-item-campo--invalido .publico-item-campo__controle:focus {
  border-color: rgba(180, 35, 24, 0.9);

  box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.12);
}

/*
 * =====================================================
 * INSTAGRAM
 * =====================================================
 */

.publico-item-instagram {
  width: 100%;
}

.publico-item-instagram__publicacao {
  width: 100%;

  overflow: hidden;
}

.publico-item-instagram__publicacao[hidden] {
  display: none;
}

/*
 * A aparência definitiva da incorporação pertence ao
 * Instagram.
 *
 * Aqui apenas impedimos que a estrutura preliminar
 * ultrapasse a largura disponível da Lunnia.
 */

.publico-item-instagram .instagram-media {
  width: 100% !important;

  max-width: 100% !important;

  min-width: 0 !important;

  margin: 0 !important;
}

/*
 * =====================================================
 * FALLBACK
 * =====================================================
 */

.publico-item-instagram__fallback {
  display: flex;
  flex-direction: column;
  align-items: center;

  gap: 8px;

  width: 100%;

  padding: 20px 16px;

  border: 1px solid rgba(36, 59, 83, 0.12);
  border-radius: 12px;

  background: rgba(36, 59, 83, 0.035);

  text-align: center;
}

.publico-item-instagram__fallback[hidden] {
  display: none;
}

.publico-item-instagram__fallback-icone {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 42px;
  height: 42px;

  border-radius: 50%;

  background: rgba(36, 59, 83, 0.08);

  font-size: 20px;
}

.publico-item-instagram__fallback-titulo {
  font-size: 0.9rem;
  line-height: 1.3;
}

.publico-item-instagram__fallback-texto {
  font-size: 0.8rem;
  line-height: 1.4;

  opacity: 0.72;
}

.publico-item-instagram__fallback-link {
  display: inline-flex;
  align-items: center;

  gap: 7px;

  margin-top: 4px;

  font-size: 0.82rem;
  font-weight: 600;

  text-decoration: none;

  color: inherit;
}

.publico-item-instagram__fallback-link:hover {
  text-decoration: underline;
}

/*
 * =====================================================
 * VÍDEO
 * =====================================================
 */

.publico-item-video {
  width: 100%;
}

.publico-item-video__figura {
  width: 100%;

  margin: 0;
}

.publico-item-video__video {
  display: block;

  width: 100%;
  max-width: 100%;

  height: auto;

  /* max-height: 520px; */

  border-radius: 14px;

  background: #000;

  object-fit: contain;
}

/*
 * =====================================================
 * LEGENDA
 * =====================================================
 */

.publico-item-video__legenda {
  margin-top: 8px;

  padding: 0 2px;

  font-size: 0.82rem;
  line-height: 1.4;

  opacity: 0.72;
}

/*
 * =====================================================
 * MOBILE
 * =====================================================
 */

@media (max-width: 640px) {
  .publico-item-video__video {
    /* max-height: 460px; */

    border-radius: 12px;
  }
}

/*
 * =====================================================
 * ARQUIVO
 * =====================================================
 */

.publico-item-arquivo {
  width: 100%;
}

.publico-item-arquivo__card {
  display: flex;
  align-items: center;

  gap: 12px;

  width: 100%;

  padding: 14px;

  border: 1px solid rgba(36, 59, 83, 0.12);
  border-radius: 14px;

  background: rgba(36, 59, 83, 0.035);
}

.publico-item-arquivo__icone {
  display: flex;
  align-items: center;
  justify-content: center;

  flex: 0 0 44px;

  width: 44px;
  height: 44px;

  border-radius: 12px;

  background: rgba(36, 59, 83, 0.08);

  font-size: 20px;
}

.publico-item-arquivo__conteudo {
  min-width: 0;

  flex: 1;
}

.publico-item-arquivo__titulo {
  font-size: 0.92rem;
  font-weight: 650;
  line-height: 1.3;

  color: inherit;

  overflow-wrap: anywhere;
}

.publico-item-arquivo__descricao {
  margin-top: 4px;

  font-size: 0.8rem;
  line-height: 1.4;

  opacity: 0.7;
}

.publico-item-arquivo__acao {
  display: flex;
  align-items: center;
  justify-content: center;

  gap: 8px;

  width: 100%;

  margin-top: 8px;

  padding: 11px 14px;

  border: 1px solid rgba(36, 59, 83, 0.14);
  border-radius: 12px;

  background: rgba(36, 59, 83, 0.055);

  font-size: 0.84rem;
  font-weight: 600;

  color: inherit;

  text-decoration: none;

  transition:
    background 160ms ease,
    transform 160ms ease;
}

.publico-item-arquivo__acao:hover {
  background: rgba(36, 59, 83, 0.09);
}

.publico-item-arquivo__acao:active {
  transform: scale(0.99);
}

/*
 * =====================================================
 * MOBILE
 * =====================================================
 */

@media (max-width: 640px) {
  .publico-item-arquivo__card {
    padding: 12px;

    border-radius: 12px;
  }

  .publico-item-arquivo__icone {
    flex-basis: 40px;

    width: 40px;
    height: 40px;

    border-radius: 10px;

    font-size: 18px;
  }
}

/*
 * =====================================================
 * ENDEREÇO
 * =====================================================
 *
 * A tipografia do endereço reutiliza diretamente os
 * estilos semânticos existentes do item Texto:
 *
 * título      → destaque
 * endereço    → normal
 * referência  → auxiliar
 *
 * Este bloco cuida somente do espaçamento e das ações
 * específicas do endereço.
 */

.publico-item-endereco {
  width: 100%;
}

/*
 * =====================================================
 * TÍTULO
 * =====================================================
 */

.publico-item-endereco__titulo {
  margin: 0;
}

/*
 * =====================================================
 * CORPO
 * =====================================================
 */

.publico-item-endereco__corpo {
  margin-top: 3px;

  padding-left: 25px;
}

/*
 * =====================================================
 * REFERÊNCIA
 * =====================================================
 */

.publico-item-endereco__referencia {
  margin-top: 4px;

  padding-left: 25px;
}
/*
 * =====================================================
 * AÇÕES DO ENDEREÇO
 * =====================================================
 *
 * As ações reutilizam o botão padrão da Lunnia.
 *
 * A disposição é horizontal sempre que houver espaço.
 * Quando não houver, o flex realiza a quebra
 * automaticamente.
 */

.publico-item-endereco__acoes {
  display: flex;
  flex-wrap: wrap;

  gap: 8px;

  width: 100%;

  margin-top: 12px;
}

/*
 * =====================================================
 * AÇÃO
 * =====================================================
 *
 * O visual principal continua vindo de:
 *
 * .publico-etapa-texto__opcao
 *
 * Aqui controlamos somente o comportamento do botão
 * dentro do grupo de ações do endereço.
 */

.publico-item-endereco__acao {
  flex: 1 1 140px;

  width: auto;
  min-width: 120px;

  justify-content: center;

  text-decoration: none;
}

/*
 * =====================================================
 * CONTEÚDO DA AÇÃO
 * =====================================================
 */

.publico-item-endereco__acao-conteudo {
  display: flex;
  align-items: center;
  justify-content: center;

  gap: 8px;

  min-width: 0;
}

/*
 * =====================================================
 * ÍCONE
 * =====================================================
 */

.publico-item-endereco__acao-icone {
  flex: 0 0 auto;

  width: 18px;

  color: rgba(36, 59, 83, 0.72);

  font-size: 15px;

  text-align: center;
}

/*
 * =====================================================
 * LINKS
 * =====================================================
 *
 * Evita alteração visual depois que Maps ou Waze
 * tiverem sido visitados.
 */

.publico-item-endereco__acao:visited {
  color: var(--publico-cor-texto, #24242c);
}

/*
 * =====================================================
 * COPIAR
 * =====================================================
 */

.publico-item-endereco__acao--copiar {
  appearance: none;
  -webkit-appearance: none;
}

/*
 * =====================================================
 * FEEDBACK
 * =====================================================
 */

.publico-item-endereco__acao--sucesso {
  border-color: rgba(22, 101, 52, 0.22);

  background: rgba(22, 101, 52, 0.045);
}

.publico-item-endereco__acao--erro {
  border-color: rgba(180, 35, 24, 0.22);

  background: rgba(180, 35, 24, 0.04);
}

/*
 * =====================================================
 * SEPARAÇÃO ENTRE ENDEREÇOS
 * =====================================================
 *
 * Quando dois itens Endereço aparecem consecutivamente,
 * criamos uma separação visual clara entre os grupos.
 */

.publico-item-endereco + .publico-item-endereco {
  margin-top: 20px;
}

/*
 * =====================================================
 * ITEM CONTATO
 * =====================================================
 */

.publico-item-contato {
  width: 100%;
}

/*
 * Mantém título e valor visualmente relacionados.
 */

.publico-item-contato__valor {
  margin-top: 2px;
}

/*
 * =====================================================
 * AÇÃO
 * =====================================================
 */

.publico-item-contato__acao {
  width: 100%;

  margin-top: 10px;

  justify-content: flex-start;

  text-decoration: none;
}

.publico-item-contato__acao:hover,
.publico-item-contato__acao:focus,
.publico-item-contato__acao:active,
.publico-item-contato__acao:visited {
  text-decoration: none;
}

.publico-item-contato__acao-conteudo {
  display: flex;
  align-items: center;

  gap: 10px;

  min-width: 0;
}

.publico-item-contato__acao-icone {
  flex: 0 0 auto;

  width: 18px;

  color: rgba(36, 59, 83, 0.72);

  font-size: 15px;

  text-align: center;
}

/*
 * =====================================================
 * CONTATOS CONSECUTIVOS
 * =====================================================
 */

.publico-item-contato + .publico-item-contato {
  margin-top: 18px;
}

/* =====================================================
 * CORES DOS CANAIS
 * ===================================================== */

/* WhatsApp */
.publico-item-contato__acao--whatsapp .publico-item-contato__acao-icone {
  color: #25d366;
}

/* Instagram */
.publico-item-contato__acao--instagram .publico-item-contato__acao-icone {
  color: #e4405f;
}

/* Facebook */
.publico-item-contato__acao--facebook .publico-item-contato__acao-icone {
  color: #1877f2;
}

/* LinkedIn */
.publico-item-contato__acao--linkedin .publico-item-contato__acao-icone {
  color: #0a66c2;
}

/* YouTube */
.publico-item-contato__acao--youtube .publico-item-contato__acao-icone {
  color: #ff0000;
}

/* TikTok */
.publico-item-contato__acao--tiktok .publico-item-contato__acao-icone {
  color: #000000;
}

/* =====================================================
 * CANAIS NEUTROS
 * ===================================================== */

.publico-item-contato__acao--telefone .publico-item-contato__acao-icone,
.publico-item-contato__acao--email .publico-item-contato__acao-icone,
.publico-item-contato__acao--link .publico-item-contato__acao-icone {
  color: inherit;
}