/* Botón de descarga de PDF.
   Naranja-500 con texto azul-900: es el color de acción de la marca y el único
   que resalta sobre el blanco y los verdes del catálogo. El texto va oscuro
   porque blanco sobre este naranja da 2.41:1 y no cumple; así da 6.43:1. */

.procam-pdf-boton {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 20px;
  border: 1px solid #fb8846;
  border-radius: 30px;
  background: #fb8846;
  color: #0b2735;
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: background-color .15s ease, border-color .15s ease;
}

.procam-pdf-boton:hover,
.procam-pdf-boton:focus {
  background: #fb9903;
  border-color: #fb9903;
  color: #0b2735;
  text-decoration: none;
}

.procam-pdf-boton:focus-visible {
  outline: 2px solid #14415b;
  outline-offset: 2px;
}

.procam-pdf-boton svg {
  width: 16px;
  height: 16px;
  flex: none;
}

/* En el listado va arriba a la izquierda, en la misma línea donde hoy está el
   botón gris, antes del selector de orden. */
.procam-pdf-boton--listado {
  float: left;
  margin: 0 0 21px;
}

.woocommerce-ordering { clear: none; }

.procam-pdf-boton--ficha {
  margin-top: 14px;
}

@media (max-width: 767px) {
  .procam-pdf-boton--listado { float: none; display: flex; justify-content: center; }
}

/* Segundo botón del listado: las fichas técnicas. Va en contorno para que no
   compita con el catálogo, que es la descarga de uso diario. */
.procam-pdf-boton--claro {
  background: transparent;
  border-color: #fb8846;
  color: #0b2735;
}

.procam-pdf-boton--claro:hover,
.procam-pdf-boton--claro:focus {
  background: #fb8846;
  border-color: #fb8846;
  color: #0b2735;
}

.procam-pdf-boton--listado + .procam-pdf-boton--listado {
  margin-left: 10px;
}