/**
 * ==================================================
 * BUTTON
 * ==================================================
 */

.ik-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--ik-space-sm);

  min-height: 48px;
  padding: 0 var(--ik-space-lg);

  border: 1px solid transparent;
  border-radius: var(--ik-radius-sm);

  font-size: var(--ik-font-size-sm);
  font-weight: var(--ik-font-weight-semibold);
  line-height: 1;

  cursor: pointer;

  text-decoration: none !important;

  transition: var(--ik-transition);
}

.ik-button--block {
  width: 100%;
}

.ik-button:focus-visible {
  outline: none;

  box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.12);
}

.ik-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/**
 * ==================================================
 * BUTTON VARIANTS
 * ==================================================
 */

.ik-button--primary {
  color: #fff;

  background: var(--ik-color-primary);
}

.ik-button--primary:hover {
  background: var(--ik-color-primary-hover);
}

.ik-button--secondary {
  color: var(--ik-color-heading);

  background: var(--ik-color-card);

  border-color: var(--ik-color-border);
}

.ik-button--secondary:hover {
  background: var(--ik-color-background);
}

.ik-button--outline {
  color: var(--ik-color-primary);

  background: transparent;

  border-color: var(--ik-color-primary);
}

.ik-button--outline:hover {
  color: #fff;

  background: var(--ik-color-primary);
}

.ik-button--ghost {
  color: var(--ik-color-heading);

  background: transparent;
}

.ik-button--ghost:hover {
  background: rgba(15, 23, 42, 0.05);
}

/* Keep theme link styles from adding underlines to Indonesia Kerja buttons. */
.ik-button:hover,
.ik-button:focus,
.ik-button:visited {
  text-decoration: none !important;
}
