/* Conta e empresas (frente "Feedbem › Conta e base"). Só variáveis --fb-* e a base de base.css. */

/* Tela de entrar: sem menu, cartão estreito no meio */
body.fb-entrando #fb-menu { display: none; }
.fb-entrar { max-width: 420px; margin: 32px auto 0; }
.fb-entrar form { display: grid; gap: 4px; margin-top: 16px; }
.fb-entrar form[hidden] { display: none; }
.fb-entrar .fb-aviso { margin-bottom: 14px; }
.fb-largo { width: 100%; min-height: 48px; }
.fb-codigo { font-size: 28px !important; letter-spacing: 10px; text-align: center; font-weight: 800; }
.fb-link {
  font: inherit; font-size: inherit; background: none; border: 0; padding: 0; cursor: pointer;
  color: var(--fb-framboesa); text-decoration: underline;
}
.fb-link.fb-erro { color: var(--fb-erro); }

/* Minhas empresas */
.fb-emp-cabeca { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.fb-emp-cabeca h1 { margin: 0; }
.fb-emp-cabeca .fb-botao, .fb-emp-acoes .fb-botao { text-decoration: none; display: inline-block; }
.fb-emp-cartao {
  display: flex; gap: 12px; align-items: flex-start; flex-wrap: wrap;
  color: var(--fb-tinta); text-decoration: none; transition: border-color .15s;
}
.fb-emp-cartao:hover { border-color: var(--fb-tinta); }
.fb-emp-texto { display: grid; gap: 2px; min-width: 0; flex: 1; }
.fb-emp-texto strong { font-size: var(--fb-texto-h3); line-height: 1.3; }
.fb-emp-texto .fb-apoio { overflow-wrap: anywhere; }
.fb-emp-chips { display: flex; gap: 4px; flex-wrap: wrap; margin: 6px 0 0; }
.fb-emp-falta { width: 100%; font-size: var(--fb-texto-legenda); }

.fb-emp-selo {
  flex: none; width: 48px; height: 48px; border-radius: var(--fb-canto-m);
  display: grid; place-items: center; overflow: hidden;
  font-weight: 800; font-size: 22px; border: 1px solid var(--fb-linha); background: var(--fb-nevoa);
}
.fb-emp-selo img { width: 100%; height: 100%; object-fit: contain; }
.fb-emp-selo.grande { width: 72px; height: 72px; font-size: 32px; }

.fb-emp-vazio { max-width: 640px; }
.fb-emp-vazio h2 { margin-top: 0; }

/* Formulário */
.fb-emp-form { max-width: 640px; }
.fb-emp-form .fb-campo .fb-apoio { font-size: var(--fb-texto-legenda); }
.fb-emp-redes { border: 1px solid var(--fb-linha); border-radius: var(--fb-canto-m); padding: 12px 16px; margin: 0 0 14px; }
.fb-emp-redes legend { font-weight: 600; font-size: var(--fb-texto-menor); padding: 0 4px; }
.fb-emp-rede {
  display: inline-flex; align-items: center; gap: 8px; margin: 4px 16px 4px 0; min-height: 40px;
  font-weight: 600; cursor: pointer;
}
.fb-emp-rede input { width: 20px; height: 20px; accent-color: var(--fb-tinta); }
.fb-emp-acoes { display: flex; gap: 8px; flex-wrap: wrap; }

/* Página da empresa */
.fb-emp-topo { display: flex; gap: 16px; align-items: flex-start; margin-bottom: 24px; }
.fb-emp-topo > div { flex: 1; min-width: 0; }
.fb-emp-topo h1 { margin-bottom: 4px; overflow-wrap: anywhere; }
.fb-emp-links { margin: 0; color: var(--fb-grafite); font-size: var(--fb-texto-menor); overflow-wrap: anywhere; }
.fb-emp-editar { flex: none; }
.fb-emp-atalho { display: grid; gap: 6px; align-content: start; color: var(--fb-tinta); text-decoration: none; }
.fb-emp-atalho:hover { border-color: var(--fb-tinta); }
.fb-emp-atalho strong { font-size: var(--fb-texto-h3); }
.fb-emp-atalho-principal { border: 2px solid var(--fb-tinta); }
.fb-emp-paleta { display: flex; gap: 4px; margin-top: 4px; }
.fb-emp-paleta i { width: 20px; height: 20px; border-radius: 50%; border: 1px solid var(--fb-linha); }

.fb-emp-pecas { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.fb-emp-pecas a { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; color: var(--fb-tinta); text-decoration: none; }
.fb-emp-pecas .fb-etiqueta { margin-left: auto; }

#fb-edicao { margin-top: 32px; }
.fb-emp-apagar { margin-top: 16px; }

@media (max-width: 600px) {
  .fb-emp-topo { flex-wrap: wrap; }
  .fb-emp-selo.grande { width: 56px; height: 56px; font-size: 26px; }
  .fb-emp-cabeca .fb-botao { width: 100%; text-align: center; }
  .fb-entrar { margin-top: 8px; }
}
