@charset "utf-8";
/* CSS Document */

// Buttons variables

$button-context: "Button";
$button-stroke: inset 0 0 0 units($theme-button-stroke-width);

// Buttons

.usa-button {

    color: #fff !important;
    background-color: #a6192e !important;
    
}
.bg-secondary, .hover\:bg-secondary:hover {
    background-color: #a6192e !important;
}

  @include at-media("mobile-lg") {
    width: auto;
  }
	

  &:visited {
    color: color("white");
  }

  &:hover,
  &.usa-button--hover {
    @include set-text-and-bg("#a6192e !important", $context: $button-context);
    border-bottom: 0;
    text-decoration: none;
  }

  &:active,
  &.usa-button--active {
    @include set-text-and-bg("primary-darker", $context: $button-context);
  }

  &:not([disabled]):focus,
  &:not([disabled]).usa-focus {
    outline-offset: units(0.5);
  }

  &:disabled {
    @include button-disabled;
  }
}

.usa-button--accent-cool {
  @include set-text-and-bg("accent-cool", $context: $button-context);

  &:visited {
    @include set-text-and-bg("accent-cool", $context: $button-context);
  }

  &:hover,
  &.usa-button--hover {
    @include set-text-and-bg("accent-cool-dark", $context: $button-context);
  }

  &:active,
  &.usa-button--active {
    @include set-text-and-bg("accent-cool-darker", $context: $button-context);
  }
}

.usa-button--accent-warm {
  @include set-text-and-bg("accent-warm", $context: $button-context);

  &:visited {
    @include set-text-and-bg("accent-warm", $context: $button-context);
  }

  &:hover,
  &.usa-button--hover {
    @include set-text-and-bg("accent-warm-dark", $context: $button-context);
  }

  &:active,
  &.usa-button--active {
    @include set-text-and-bg("accent-warm-darker", $context: $button-context);
  }
}

.usa-button--outline {
    background-color: #a6192e !important;
    box-shadow: inset 0 0 0 2px #a6192e !important;
    color: #fff !important;

  &:visited {
    color: #fff !important;
   
  }

  &:hover,
  &.usa-button--hover {
    background-color: #fff !important;
    box-shadow: inset 0 0 0 2px #a6192e;
    color: #a6192e !important;
  }

  &:active,
  &.usa-button--active {
    background-color: transparent;
    box-shadow: inset 0 0 0 2px #162e51;
    color: #a6192e !important;
  }

  &.usa-button--inverse {
    $button-inverse-color: $theme-link-reverse-color;
    $button-inverse-hover-color: $theme-link-reverse-hover-color;
    $button-inverse-active-color: $theme-link-reverse-active-color;

    box-shadow: $button-stroke color("base-lighter");
    color: color($button-inverse-color);

    &:visited {
      color: color($button-inverse-color);
    }

    &:hover,
    &.usa-button--hover {
      box-shadow: $button-stroke color($button-inverse-hover-color);
      color: color($button-inverse-hover-color);
    }

    &:active,
    &.usa-button--active {
      background-color: transparent;
      box-shadow: $button-stroke color($button-inverse-active-color);
      color: color($button-inverse-active-color);
    }

    &.usa-button--unstyled {
      @include button-unstyled;
      color: color($button-inverse-color);

      &:visited {
        color: color($button-inverse-color);
      }

      &:hover,
      &.usa-button--hover {
        color: color($button-inverse-hover-color);
      }

      &:active,
      &.usa-button--active {
        color: color($button-inverse-active-color);
      }
    }
  }
}

.usa-button--base {
  @include set-text-and-bg("base", $context: $button-context);

  &:hover,
  &.usa-button--hover {
    @include set-text-and-bg("base-dark", $context: $button-context);
  }

  &:active,
  &.usa-button--active {
    @include set-text-and-bg("base-darker", $context: $button-context);
  }
}

.usa-button--secondary {
  @include set-text-and-bg("secondary", $context: $button-context);

  &:hover,
  &.usa-button--hover {
    @include set-text-and-bg("secondary-dark", $context: $button-context);
  }

  &:active,
  &.usa-button--active {
    @include set-text-and-bg("secondary-darker", $context: $button-context);
  }
}

.usa-button--big {
  border-radius: radius($theme-button-border-radius);
  font-size: font-size($theme-button-font-family, "lg");
  padding: units(2) units(3);
}

.usa-button--disabled {
  @include button-disabled;
}

.usa-button--outline-disabled,
.usa-button--outline-inverse-disabled,
.usa-button--outline:disabled,
.usa-button--outline-inverse:disabled,
.usa-button--outline-inverse:disabled {
  background-color: color("transparent");
  pointer-events: none;

  &:hover,
  &.usa-button--hover,
  &:active,
  &.usa-button--active,
  &:focus,
  &.usa-focus {
    background-color: color("transparent");
    border: 0;
  }
}

.usa-button--outline-disabled,
.usa-button--outline:disabled {
  box-shadow: $button-stroke color("disabled");
  color: color("disabled");
  &.usa-button--inverse {
    background-color: transparent;
    box-shadow: $button-stroke color("base");
    color: color("base");
  }
}

.usa-button--unstyled {
  @include button-unstyled;
}

.usa-footer__return-to-top a,

.usa-link {
    color: #333;
    text-decoration: none !important;
}

.usa-link:visited {
    color: #333 !important;
}

.usa-link:hover {
    color: #333 !important;

    border-bottom: 2px solid #a6192e !important;
}

.usa-link:active {
    color: #162e51 !important;
}

.usa-link:focus {
    outline: .25rem solid #2491ff !important;
    outline-offset: 0 !important;
}
