/* ══════════════════════════════════════
   FERRANOVA — Botones
   ══════════════════════════════════════ */

.fn-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--fn-sp-xs);
  padding: 12px 28px;
  border-radius: var(--fn-radio-md);
  font-family: var(--fn-fuente-titulo);
  font-size: var(--fn-fs-sm);
  font-weight: var(--fn-fw-semibold);
  letter-spacing: var(--fn-ls-wide);
  text-transform: uppercase;
  cursor: pointer;
  transition: all var(--fn-trans-normal);
  border: 2px solid transparent;
  text-decoration: none;
  white-space: nowrap;
}

.fn-btn:active {
  transform: scale(0.97);
}

/* Primario */
.fn-btn--primario {
  background: var(--fn-primario);
  color: var(--fn-blanco);
  border-color: var(--fn-primario);
}

.fn-btn--primario:hover {
  background: var(--fn-primario-hover);
  border-color: var(--fn-primario-hover);
  color: var(--fn-blanco);
  box-shadow: var(--fn-sombra-hover);
  transform: translateY(-2px);
}

/* Secundario */
.fn-btn--secundario {
  background: var(--fn-secundario);
  color: var(--fn-blanco);
  border-color: var(--fn-secundario);
}

.fn-btn--secundario:hover {
  background: var(--fn-secundario-hover);
  border-color: var(--fn-secundario-hover);
  color: var(--fn-blanco);
  transform: translateY(-2px);
  box-shadow: 0 8px 30px rgba(255, 116, 61, 0.25);
}

/* Outline */
.fn-btn--outline {
  background: transparent;
  color: var(--fn-primario);
  border-color: var(--fn-primario);
}

.fn-btn--outline:hover {
  background: var(--fn-primario);
  color: var(--fn-blanco);
  transform: translateY(-2px);
}

/* Outline Blanco */
.fn-btn--outline-blanco {
  background: transparent;
  color: var(--fn-blanco);
  border-color: rgba(255,255,255,0.4);
}

.fn-btn--outline-blanco:hover {
  background: var(--fn-blanco);
  color: var(--fn-primario);
  border-color: var(--fn-blanco);
}

/* Ghost */
.fn-btn--ghost {
  background: transparent;
  color: var(--fn-primario);
  padding: 8px 16px;
}

.fn-btn--ghost:hover {
  background: var(--fn-primario-ultra-light);
}

/* Tamaños */
.fn-btn--sm {
  padding: 8px 18px;
  font-size: var(--fn-fs-xs);
}

.fn-btn--lg {
  padding: 16px 36px;
  font-size: var(--fn-fs-base);
}

/* Con ícono */
.fn-btn svg,
.fn-btn i {
  width: 18px;
  height: 18px;
}

.fn-btn--lg svg,
.fn-btn--lg i {
  width: 20px;
  height: 20px;
}

/* Full width */
.fn-btn--full {
  width: 100%;
}

/* WooCommerce buttons */
.woocommerce .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce .btn,
.woocommerce a.btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 12px 28px !important;
  border-radius: var(--fn-radio-md) !important;
  font-family: var(--fn-fuente-titulo) !important;
  font-size: var(--fn-fs-sm) !important;
  font-weight: var(--fn-fw-semibold) !important;
  letter-spacing: var(--fn-ls-wide) !important;
  text-transform: uppercase !important;
  background: var(--fn-primario) !important;
  color: var(--fn-blanco) !important;
  border: 2px solid var(--fn-primario) !important;
  transition: all var(--fn-trans-normal) !important;
  cursor: pointer !important;
}

.woocommerce .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
  background: var(--fn-primario-hover) !important;
  border-color: var(--fn-primario-hover) !important;
  color: var(--fn-blanco) !important;
  box-shadow: var(--fn-sombra-hover) !important;
}

.woocommerce .button.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt {
  background: var(--fn-secundario) !important;
  border-color: var(--fn-secundario) !important;
}

.woocommerce .button.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
  background: var(--fn-secundario-hover) !important;
  border-color: var(--fn-secundario-hover) !important;
}