/* Card */
.cd {
  background: var(--branco);
  border: 1px solid var(--borda);
  border-radius: var(--raio);
  padding: 16px;
  box-shadow: var(--sombra-sm);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Botoes */
.btn-primary,
.btn-secundario {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  min-height: 40px;
  padding: 0 var(--sp-4);
  border-radius: var(--raio-sm);
  font-size: var(--fs-base);
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  text-decoration: none;
  border: 1px solid transparent;
  transition: background-color 0.15s, border-color 0.15s;
}

.btn-primary {
  background: var(--cor-primaria);
  color: var(--texto-sobre-cor-primaria);
}

.btn-primary:hover { background: var(--cor-primaria-hover); }

.btn-secundario {
  background: var(--branco);
  color: var(--texto);
  border-color: var(--borda-forte);
}

.btn-secundario:hover { background: var(--fundo); }

.btn-primary:disabled,
.btn-secundario:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* Formulario */
.campo {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}

.campo label,
.campo .rotulo {
  font-size: var(--fs-sm);
  font-weight: 600;
  color: var(--texto);
}

.campo input[type="text"],
.campo input[type="email"],
.campo input[type="tel"],
.campo input[type="password"] {
  height: 40px;
  box-sizing: border-box;
  width: 100%;
  padding: 0 var(--sp-3);
  border: 1px solid var(--borda-forte);
  border-radius: var(--raio-sm);
  background: var(--branco);
  color: var(--texto);
  font-size: var(--fs-base);
}

.campo textarea {
  width: 100%;
  min-height: 96px;
  padding: var(--sp-2) var(--sp-3);
  border: 1px solid var(--borda-forte);
  border-radius: var(--raio-sm);
  background: var(--branco);
  color: var(--texto);
  font-size: var(--fs-base);
  resize: vertical;
}

.campo input:focus,
.campo textarea:focus {
  border-color: var(--cor-primaria);
  outline: none;
  box-shadow: 0 0 0 3px var(--cor-primaria-soft);
}

.campo-ajuda {
  font-size: var(--fs-xs);
  color: var(--texto-suave);
}

.campo-erro {
  font-size: var(--fs-xs);
  color: var(--erro);
}

.aviso-erro {
  padding: var(--sp-3) var(--sp-4);
  border-radius: var(--raio-sm);
  background: var(--erro-suave);
  color: var(--erro);
  font-size: var(--fs-sm);
  font-weight: 600;
}

/* Loading */
.loading-inline {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  color: var(--texto-suave);
  font-size: var(--fs-sm);
}

.spinner-circle {
  width: 18px;
  height: 18px;
  border: 2px solid var(--borda);
  border-top-color: var(--cor-primaria);
  border-radius: 50%;
  animation: girar 0.8s linear infinite;
}

@keyframes girar {
  to { transform: rotate(360deg); }
}

/* Estado vazio */
.vz {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--sp-2);
  padding: var(--sp-6) var(--sp-4);
  color: var(--texto-suave);
}

.vz i { font-size: 40px; color: var(--borda-forte); }
.vz .vz-titulo { font-weight: 700; color: var(--texto); }

@media (max-width: 720px) {
  .btn-primary,
  .btn-secundario { min-height: 44px; }

  .campo input[type="text"],
  .campo input[type="email"],
  .campo input[type="tel"],
  .campo input[type="password"] { height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  .spinner-circle { animation-duration: 2s; }
}