:root {
  --cta-primary-contained-default-background: var(--aot-sys-color-primary-accent-default);

  --cta-primary-contained-hover-background: var(--aot-sys-color-primary-accent-hover);

  --cta-primary-contained-active-background: var(--aot-sys-color-primary-accent-active);

  --aot-typography_font-family: var(--aot-sys-typography-font-family);
}

/* Contains atoms styling only for medium buttons */

.data-table {
  a.primary,
  a.secondary,
  a.tertiary,
  a.link {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    margin: 0;
    height: var(--aot-comp-buttonv2-common-height-large);
    border: none;
    border-radius: var(--aot-comp-buttonv2-common-border-radius);
    font-family: var(--aot-sys-typography-font-family);
    font-feature-settings: var(--aot-sys-typography-font-feature-settings);
    font-style: var(--aot-sys-typography-font-style);
    font-size: var(--aot-comp-buttonv2-common-large-font-size);
    font-weight: var(--aot-comp-buttonv2-common-large-font-weight);
    line-height: var(--aot-comp-buttonv2-common-large-line-height);
    text-decoration: var(--aot-comp-buttonv2-common-large-text-decoration);
    letter-spacing: var(--aot-comp-buttonv2-common-large-letter-spacing);
    text-transform: var(--aot-comp-buttonv2-common-large-text-transform);
    cursor: pointer;
    column-gap: var(--aot-comp-buttonv2-contained-column-gap);
    padding: var(--aot-comp-buttonv2-contained-padding);
  }

  a.primary:hover,
  a.primary:active,
  a.secondary:hover,
  a.secondary:active,
  a.tertiary:hover,
  a.tertiary:active,
  a.link:hover,
  a.link:active {
    cursor: pointer;
  }

  /* a.primary = Atom: Primary Contained */
  a.primary {
    background-color: var(--cta-primary-contained-default-background);
    color: var(--aot-sys-color-primary-white);
  }

  @media only screen and (min-width: 1024px) {
    a.primary:hover {
      background: var(--cta-primary-contained-hover-background);
      color: var(--aot-sys-color-primary-white);
    }
  }

  a.primary:active {
    background-color: var(--cta-primary-contained-active-background);
    color: var(--cta-primary-contained-active-text);
  }

  a.primary span {
    color: var(--cta-primary-contained-default-text);
  }

  a.primary[target='_self']::after,
  a.primary[target='_blank']::after,
  a.secondary[target='_self']::after,
  a.secondary[target='_blank']::after,
  a.tertiary[target='_self']::after,
  a.tertiary[target='_blank']::after,
  a.link[target='_blank']::after,
  a.link[target='_self']::after {
    content: '';
    display: block;
    width: 20px;
    height: 20px;
  }

  a.primary[target='_self']::after {
    background: transparent
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M0 9.97678C-1.50882e-08 10.322 0.279822 10.6018 0.625 10.6018H17.7695L11.4352 16.4145C11.1809 16.6479 11.1639 17.0433 11.3973 17.2976C11.6307 17.5519 12.026 17.5689 12.2804 17.3355L19.7976 10.4373C19.9268 10.3187 20.0003 10.1512 20 9.97573C19.9997 9.80029 19.9257 9.63305 19.796 9.51487L12.2788 2.66309C12.0237 2.43057 11.6284 2.44887 11.3959 2.70398C11.1634 2.95909 11.1817 3.35439 11.4368 3.58692L17.7615 9.35178L0.625 9.35178C0.279822 9.35178 1.50882e-08 9.6316 0 9.97678Z' fill='white'/%3E%3C/svg%3E")
      no-repeat center center;
  }

  a.primary[target='_blank']::after {
    background: transparent
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 40 40' fill='%23fff'%3E%3Cpath d='M17.867 20.392a1.25 1.25 0 0 0 0 1.768 1.247 1.247 0 0 0 1.765 0L35.008 6.766v6.982a1.249 1.249 0 1 0 2.497 0V3.75c0-.69-.56-1.25-1.248-1.25H26.255a1.249 1.249 0 0 0 0 2.5h6.988z'%3E%3C/path%3E%3Cpath d='M5.001 8.773c0-.69.559-1.25 1.248-1.25h12.482a1.249 1.249 0 0 0 0-2.499H6.25a3.746 3.746 0 0 0-3.744 3.749V33.75A3.746 3.746 0 0 0 6.249 37.5H31.2a3.746 3.746 0 0 0 3.744-3.749v-12.49a1.249 1.249 0 1 0-2.496 0v12.49c0 .69-.56 1.25-1.249 1.25H6.25c-.69 0-1.248-.56-1.248-1.25z'%3E%3C/path%3E%3C/svg%3E")
      no-repeat center center;
  }

  /* a.secondary = Atom: Secondary Contained */
  a.secondary {
    color: var(--aot-comp-buttonv2-outlined-light-default-text-color);
    background: transparent;
    border: 2px solid var(--aot-sys-color-primary-black);
  }

  @media only screen and (min-width: 1024px) {
    a.secondary:hover {
      border: 2px solid transparent;
      position: relative;
    }
  }

  a.secondary:hover::before {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: var(--aot-comp-buttonv2-common-border-radius);
    padding: 2px;
    background: var(--aot-ref-lilac-red-gradient);
    -webkit-mask:
      linear-gradient(#fff 0 0) content-box,
      linear-gradient(#fff 0 0);
    mask:
      linear-gradient(#fff 0 0) content-box,
      linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    z-index: 1;
  }

  a.secondary:active {
    background-color: transparent;
    border: 2px solid var(--aot-sys-color-primary-accent-active);
  }

  a.secondary:active::before {
    background-color: transparent;
    border: 2px solid var(--aot-sys-color-primary-accent-active);
    opacity: 0;
  }

  a.secondary[target='_blank']::after {
    background: transparent
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 40 40' fill='%23000'%3E%3Cpath d='M17.867 20.392a1.25 1.25 0 0 0 0 1.768 1.247 1.247 0 0 0 1.765 0L35.008 6.766v6.982a1.249 1.249 0 1 0 2.497 0V3.75c0-.69-.56-1.25-1.248-1.25H26.255a1.249 1.249 0 0 0 0 2.5h6.988z'%3E%3C/path%3E%3Cpath d='M5.001 8.773c0-.69.559-1.25 1.248-1.25h12.482a1.249 1.249 0 0 0 0-2.499H6.25a3.746 3.746 0 0 0-3.744 3.749V33.75A3.746 3.746 0 0 0 6.249 37.5H31.2a3.746 3.746 0 0 0 3.744-3.749v-12.49a1.249 1.249 0 1 0-2.496 0v12.49c0 .69-.56 1.25-1.249 1.25H6.25c-.69 0-1.248-.56-1.248-1.25z'%3E%3C/path%3E%3C/svg%3E")
      no-repeat center center;
  }

  a.secondary[target='_self']::after {
    background: transparent
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M0 9.97678C-1.50882e-08 10.322 0.279822 10.6018 0.625 10.6018H17.7695L11.4352 16.4145C11.1809 16.6479 11.1639 17.0433 11.3973 17.2976C11.6307 17.5519 12.026 17.5689 12.2804 17.3355L19.7976 10.4373C19.9268 10.3187 20.0003 10.1512 20 9.97573C19.9997 9.80029 19.9257 9.63305 19.796 9.51487L12.2788 2.66309C12.0237 2.43057 11.6284 2.44887 11.3959 2.70398C11.1634 2.95909 11.1817 3.35439 11.4368 3.58692L17.7615 9.35178L0.625 9.35178C0.279822 9.35178 1.50882e-08 9.6316 0 9.97678Z' fill='%23000'/%3E%3C/svg%3E")
      no-repeat center center;
  }

  /* a.tertiary = Atom: Secondary Outlined */
  a.tertiary {
    color: var(--aot-comp-buttonv2-outlined-light-default-text-color);
    background: transparent;
    border: 2px solid var(--aot-sys-color-shades-grey20);
  }

  @media only screen and (min-width: 1024px) {
    a.tertiary:hover {
      border: 2px solid var(--aot-comp-buttonv2-outlined-light-default-text-color);
    }
  }

  a.tertiary:active {
    background-color: transparent;
    border: 2px solid var(--aot-sys-color-primary-accent-active);
  }

  a.tertiary[target='_blank']::after {
    background: transparent
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 40 40' fill='%23000'%3E%3Cpath d='M17.867 20.392a1.25 1.25 0 0 0 0 1.768 1.247 1.247 0 0 0 1.765 0L35.008 6.766v6.982a1.249 1.249 0 1 0 2.497 0V3.75c0-.69-.56-1.25-1.248-1.25H26.255a1.249 1.249 0 0 0 0 2.5h6.988z'%3E%3C/path%3E%3Cpath d='M5.001 8.773c0-.69.559-1.25 1.248-1.25h12.482a1.249 1.249 0 0 0 0-2.499H6.25a3.746 3.746 0 0 0-3.744 3.749V33.75A3.746 3.746 0 0 0 6.249 37.5H31.2a3.746 3.746 0 0 0 3.744-3.749v-12.49a1.249 1.249 0 1 0-2.496 0v12.49c0 .69-.56 1.25-1.249 1.25H6.25c-.69 0-1.248-.56-1.248-1.25z'%3E%3C/path%3E%3C/svg%3E")
      no-repeat center center;
  }

  a.tertiary[target='_self']::after {
    background: transparent
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M0 9.97678C-1.50882e-08 10.322 0.279822 10.6018 0.625 10.6018H17.7695L11.4352 16.4145C11.1809 16.6479 11.1639 17.0433 11.3973 17.2976C11.6307 17.5519 12.026 17.5689 12.2804 17.3355L19.7976 10.4373C19.9268 10.3187 20.0003 10.1512 20 9.97573C19.9997 9.80029 19.9257 9.63305 19.796 9.51487L12.2788 2.66309C12.0237 2.43057 11.6284 2.44887 11.3959 2.70398C11.1634 2.95909 11.1817 3.35439 11.4368 3.58692L17.7615 9.35178L0.625 9.35178C0.279822 9.35178 1.50882e-08 9.6316 0 9.97678Z' fill='%23000'/%3E%3C/svg%3E")
      no-repeat center center;
  }

  /* a.link = Atom: Text */
  a.link {
    background-color: var(--cta-text-default-background);
    color: var(--cta-text-default-text);
  }

  @media only screen and (min-width: 1024px) {
    a.link:hover {
      color: var(--aot-comp-buttonv2-text-light-hover-text-color);
      text-decoration: var(--aot-comp-buttonv2-text-light-hover-text-decoration);
    }
  }

  a.link:active {
    background-color: var(--cta-text-active-background);
    color: var(--cta-text-active-text);
  }

  a.link[target='_blank']::after {
    background: transparent
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 40 40' fill='%23000'%3E%3Cpath d='M17.867 20.392a1.25 1.25 0 0 0 0 1.768 1.247 1.247 0 0 0 1.765 0L35.008 6.766v6.982a1.249 1.249 0 1 0 2.497 0V3.75c0-.69-.56-1.25-1.248-1.25H26.255a1.249 1.249 0 0 0 0 2.5h6.988z'%3E%3C/path%3E%3Cpath d='M5.001 8.773c0-.69.559-1.25 1.248-1.25h12.482a1.249 1.249 0 0 0 0-2.499H6.25a3.746 3.746 0 0 0-3.744 3.749V33.75A3.746 3.746 0 0 0 6.249 37.5H31.2a3.746 3.746 0 0 0 3.744-3.749v-12.49a1.249 1.249 0 1 0-2.496 0v12.49c0 .69-.56 1.25-1.249 1.25H6.25c-.69 0-1.248-.56-1.248-1.25z'%3E%3C/path%3E%3C/svg%3E")
      no-repeat center center;
  }

  @media only screen and (min-width: 1024px) {
    a.link[target='_blank']:hover:after {
      background: transparent
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 40 40' fill='%23615eef'%3E%3Cpath d='M17.867 20.392a1.25 1.25 0 0 0 0 1.768 1.247 1.247 0 0 0 1.765 0L35.008 6.766v6.982a1.249 1.249 0 1 0 2.497 0V3.75c0-.69-.56-1.25-1.248-1.25H26.255a1.249 1.249 0 0 0 0 2.5h6.988z'%3E%3C/path%3E%3Cpath d='M5.001 8.773c0-.69.559-1.25 1.248-1.25h12.482a1.249 1.249 0 0 0 0-2.499H6.25a3.746 3.746 0 0 0-3.744 3.749V33.75A3.746 3.746 0 0 0 6.249 37.5H31.2a3.746 3.746 0 0 0 3.744-3.749v-12.49a1.249 1.249 0 1 0-2.496 0v12.49c0 .69-.56 1.25-1.249 1.25H6.25c-.69 0-1.248-.56-1.248-1.25z'%3E%3C/path%3E%3C/svg%3E")
        no-repeat center center;
    }
  }

  a.link[target='_self']::after {
    background: transparent
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M0 9.97678C-1.50882e-08 10.322 0.279822 10.6018 0.625 10.6018H17.7695L11.4352 16.4145C11.1809 16.6479 11.1639 17.0433 11.3973 17.2976C11.6307 17.5519 12.026 17.5689 12.2804 17.3355L19.7976 10.4373C19.9268 10.3187 20.0003 10.1512 20 9.97573C19.9997 9.80029 19.9257 9.63305 19.796 9.51487L12.2788 2.66309C12.0237 2.43057 11.6284 2.44887 11.3959 2.70398C11.1634 2.95909 11.1817 3.35439 11.4368 3.58692L17.7615 9.35178L0.625 9.35178C0.279822 9.35178 1.50882e-08 9.6316 0 9.97678Z' fill='%23000'/%3E%3C/svg%3E")
      no-repeat center center;
  }

  @media only screen and (min-width: 1024px) {
    a.link[target='_self']:hover:after {
      background: transparent
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M0 9.97678C-1.50882e-08 10.322 0.279822 10.6018 0.625 10.6018H17.7695L11.4352 16.4145C11.1809 16.6479 11.1639 17.0433 11.3973 17.2976C11.6307 17.5519 12.026 17.5689 12.2804 17.3355L19.7976 10.4373C19.9268 10.3187 20.0003 10.1512 20 9.97573C19.9997 9.80029 19.9257 9.63305 19.796 9.51487L12.2788 2.66309C12.0237 2.43057 11.6284 2.44887 11.3959 2.70398C11.1634 2.95909 11.1817 3.35439 11.4368 3.58692L17.7615 9.35178L0.625 9.35178C0.279822 9.35178 1.50882e-08 9.6316 0 9.97678Z' fill='%23615eef'/%3E%3C/svg%3E")
        no-repeat center center;
    }
  }

  a:focus-visible {
    outline: 2px solid #2934ff;
    outline-offset: 2px;
    border-radius: 4px;
  }

  a.primary:focus-visible,
  a.secondary:focus-visible,
  a.tertiary:focus-visible,
  a.link:focus-visible {
    border-radius: var(--aot-comp-buttonv2-common-border-radius);
  }

  /* visually hidden approach: Added automatically with target blank */
  .cmp-link__screen-reader-only {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
}
