/*
    - Name: "heading.scss"
    - Description: "Add custom styles to heading component"
*/
.micon.iconXs {
  width: var(--sizeXs);
  height: var(--sizeXs);
}

.micon.iconSm {
  width: var(--sizeSm);
  height: var(--sizeSm);
}

.micon.iconMd {
  width: var(--sizeMd);
  height: var(--sizeMd);
}

.micon.iconLg {
  width: var(--sizeLg);
  height: var(--sizeLg);
}

.micon.iconXl {
  width: var(--sizeXl);
  height: var(--sizeXl);
}

.micon.icon2xl {
  width: var(--size2xl);
  height: var(--size2xl);
}

.announcement_banner_wrapper {
  /*margin-bottom: var(--spacingSm);;*/
}

.announcement_banner_wrapper .announcement_banner {
  padding: var(--spacingSm);
}

@media all and (min-width: 50.0625rem) {
  .announcement_banner_wrapper .announcement_banner {
    display: flex;
  }
}
.announcement_banner_wrapper .announcement_banner .ab_icon svg {
  transform: rotate(90deg);
  display: inline-block;
}

@media all and (min-width: 50.0625rem) {
  .announcement_banner_wrapper .announcement_banner .ab_icon svg {
    transform: none;
    margin-right: var(--spacingSm);
  }
}
.announcement_banner_wrapper .announcement_banner .ab_data .ab_title p {
  font-family: var(--fontFamilyPrimary);
  font-weight: var(--fontWeightSemibold);
  size: var(--fontSizeLead);
  line-height: var(--largeDefaultLineHeight);
  margin-top: 0;
}

.announcement_banner_wrapper .announcement_banner .ab_data .ab_description {
  margin-bottom: var(--spacingSm);
  font-family: var(--fontFamilyPrimary);
  font-weight: var(--baseDefaultFontWeight);
  size: var(--fontSizeLead);
  line-height: var(--largeDefaultLineHeight);
}

.announcement_banner_wrapper .announcement_banner .ab_link a {
  text-decoration: underline;
}

.announcement_banner_wrapper .announcement_banner.announcement_banner-primario {
  background-color: var(--colorBackgroundWarning);
  color: var(--colorBlack);
}

.announcement_banner_wrapper .announcement_banner.announcement_banner-primario .ab_link {
  background: var(--colorBlack);
  padding: var(--spacingXs) var(--spacingMd);
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  gap: var(--spacingXs);
  align-items: center;
  border: var(--colorBlack) var(--borderMd) solid;
}

.announcement_banner_wrapper .announcement_banner.announcement_banner-primario .ab_link a,
.announcement_banner_wrapper .announcement_banner.announcement_banner-primario .ab_link svg {
  color: var(--colorWhite);
  text-decoration: none;
}

.announcement_banner_wrapper .announcement_banner.announcement_banner-primario .ab_link:hover, .announcement_banner_wrapper .announcement_banner.announcement_banner-primario .ab_link:focus {
  background: var(--colorBackgroundWhite);
  color: var(--colorBlack);
  border: var(--colorBlack) var(--borderMd) solid;
}

.announcement_banner_wrapper .announcement_banner.announcement_banner-primario .ab_link:hover a,
.announcement_banner_wrapper .announcement_banner.announcement_banner-primario .ab_link:hover svg, .announcement_banner_wrapper .announcement_banner.announcement_banner-primario .ab_link:focus a,
.announcement_banner_wrapper .announcement_banner.announcement_banner-primario .ab_link:focus svg {
  color: var(--colorBlack);
}

.announcement_banner_wrapper .announcement_banner.announcement_banner-secundario {
  background-color: var(--colorBackgroundBlack);
  color: var(--colorWhite);
}

.announcement_banner_wrapper .announcement_banner.announcement_banner-secundario .ab_icon svg {
  color: var(--colorBackgroundWarning);
}

.announcement_banner_wrapper .announcement_banner.announcement_banner-secundario .ab_link {
  background: var(--colorBlack);
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  gap: var(--spacingXs);
  align-items: center;
  color: var(--colorWhite);
}

.announcement_banner_wrapper .announcement_banner.announcement_banner-secundario .ab_link a {
  color: var(--colorWhite);
}

.announcement_banner_wrapper .announcement_banner.announcement_banner-secundario .ab_link a:hover, .announcement_banner_wrapper .announcement_banner.announcement_banner-secundario .ab_link a:focus {
  text-decoration: none;
}