/* ==========================================
   SW+ — BOTONES GLOBALES
   Se aplica a los bloques Botón de todo el sitio.
   ========================================== */

/* Ajustes comunes */
body .sqs-block-button .sqs-block-button-element {
  box-sizing: border-box;
  opacity: 1 !important;

  transition:
    background-color 0.2s ease,
    color 0.2s ease,
    border-color 0.2s ease !important;
}


/* ==========================================
   1. BOTÓN PRIMARIO
   ========================================== */

/* Estado normal */
body .sqs-block-button .sqs-button-element--primary {
  background: #18191A !important;
  color: #FFFAE2 !important;
  border: 2px solid #18191A !important;

  border-radius: 999px !important;
  padding: 14px 26px !important;
  font-size: 20px !important;
  text-decoration: none !important;
}

/* Hover y selección con teclado */
body .sqs-block-button .sqs-button-element--primary:hover,
body .sqs-block-button .sqs-button-element--primary:focus-visible {
  background: #FFFAE2 !important;
  color: #18191A !important;
  border-color: #18191A !important;
}


/* ==========================================
   2. BOTÓN SECUNDARIO
   ========================================== */

/* Estado normal */
body .sqs-block-button .sqs-button-element--secondary {
  background: #FFFAE2 !important;
  color: #18191A !important;
  border: 2px solid #18191A !important;

  border-radius: 999px !important;
  padding: 14px 26px !important;
  font-size: 20px !important;
  text-decoration: none !important;
}

/* Hover y selección con teclado */
body .sqs-block-button .sqs-button-element--secondary:hover,
body .sqs-block-button .sqs-button-element--secondary:focus-visible {
  background: #18191A !important;
  color: #FFFAE2 !important;
  border-color: #18191A !important;
}


/* ==========================================
   3. BOTÓN TERCIARIO
   ========================================== */

/* Estado normal */
body .sqs-block-button .sqs-button-element--tertiary {
  background: transparent !important;
  color: #18191A !important;
  border: 2px solid transparent !important;

  border-radius: 999px !important;
  padding: 10px 18px !important;
  font-size: 18px !important;
  text-decoration: underline !important;
  text-underline-offset: 4px;
}

/* Hover y selección con teclado */
body .sqs-block-button .sqs-button-element--tertiary:hover,
body .sqs-block-button .sqs-button-element--tertiary:focus-visible {
  background: #18191A !important;
  color: #FFFAE2 !important;
  border-color: #18191A !important;
}


/* ==========================================
   INDICADOR DE NAVEGACIÓN CON TECLADO
   ========================================== */

body .sqs-block-button .sqs-block-button-element:focus-visible {
  outline: 2px solid #F15B37 !important;
  outline-offset: 4px;
}
