.testimonial-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--amcp-space-300);
  border-radius: var(--amcp-radius-250);
  border: 1px solid var(--amcp-color-util-info);
  position: relative;
  .swiffy-slider {
    /* display: flex;
      align-items: center;
      justify-content: center;
      gap: var(--amcp-space-100); */
  }
  .avatar__image {
    max-width: 140px;
  }
  .testimonial-quote {
    font-size: var(--amcp-font-size-l);
    line-height: var(--amcp-line-height-large);
    font-style: italic;
    margin-bottom: var(--amcp-space-125);
    font-family: var(--header-font);
  }
  .testimonial-author {
    font-size: var(--amcp-font-size-s);
  }
  .testimonial-subtitle {
    display: block;
  }
  &.light {
    background: var(--amcp-lightest-grey);
    color: var(--amcp-color-primary);
  }
  .testimonial-avatar {
    flex-basis:100%;
    max-width: 140px;
  }
  &.dark,
  &.dark *:not(svg, .testimonial-quote-symbol) {
    background: var(--amcp-color-primary);
    color: var(--amcp-color-gamma-950);
  }

  &.side-by-side {
    border: 0;
    border-radius: 0;
    .testimonial-quote-symbol {
      top: 50%;
      &:before {
        width: 1px;
        height: 100%;
        background: var(--amcp-color-util-info);
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        
      }
    }
  }
} 

.testimonial-quote-symbol {
  position: absolute;
  top: -10px;
  z-index: 1;
  width: 4.5rem;
  height: 2.5rem;
  svg {
    fill: currentColor; /* This will use the color from .testimonial */
    width: 100%;
    height: 100%;
    background-color: none;
  }
}

.testimonial-wrapper.light .testimonial-quote-symbol svg {
  fill: var(--amcp-color-util-info); /* Color for light theme */
}

.testimonial-wrapper.dark .testimonial-quote-symbol svg {
  fill: var(--amcp-color-util-safe); /* Color for dark theme */
}
