Typography field outputs text align even if is not used

[rahulv3a]

Issue description:

Once settings are saved, typography field outputs text-align: inherit in CSS even if text-align is not used in its defaults. This overrides text-align defined theme's CSS for the same element.

If .test a is targeted in CSS using the typography field in the code below. <a> is aligned to the left instead of center. This happens due to text-align: inherit in Kirki's CSS output.

<div class="test">
  <a href="#">This is a link</a>
</div>

.test a {
  display: block;
  text-align: center;
}

Version used:

v2.2.7

Using theme_mods or options?

theme_mods

Code to reproduce the issue (config + field(s))

Kirki::add_config( 'my_config', array(
  'capability'  => 'edit_theme_options',
  'option_type' => 'theme_mod',
) );

Kirki::add_field( 'my_config', array(
  'settings' => 'my_typography',
  'section'  => 'my_section',
  'label'    => esc_html__( 'Typography', 'example' ),
  'type'     => 'typography',
  'default'  => array(
    'font-family'    => 'Open Sans',
    'variant'        => 'regular',
    'subset'         => array( 'latin-ext' ),
    'font-size'      => '11px',
    'letter-spacing' => '0',
    'text-transform' => 'uppercase',
  ),
  'output'   => array(
    array(
      'element'  => '.test a',
    ),
  ),
) );

<div class="test">
  <a href="#">This is a link</a>
</div>

.test a {
  display: block;
  text-align: center;
}

[hellor0bot]

I experience the same with font-weight.

[aristath]

Fixed.
The changes will apply once the value of the control changes and it's saved.