//
// CivicTheme Service Card component styles.
//

.ct-service-card {
  $root: &;

  @include ct-highlight-stripe-horizontal(var(--ct-service-card-stripe-height), var(--ct-service-card-border-radius), 0);

  & {
    @include ct-elevation(2);

    position: relative;
    border-radius: var(--ct-service-card-border-radius);
    width: 100%;
  }

  #{$root}__content {
    padding: ct-spacing(3);

    @include ct-breakpoint(m) {
      padding: ct-spacing(4);
    }
  }

  #{$root}__title {
    text-align: center;
  }

  #{$root}__links {
    margin-top: ct-spacing(2);

    .ct-item-list__item {
      text-align: center;
    }
  }

  @include ct-component-theme($root) using($root, $theme) {
    @include ct-component-property($root, $theme, background-color);
    @include ct-highlight-stripe-background-color(ct-component-var($root, $theme, stripe, background-color));
  }
}
