.calendar .teaser--date,
.recurring-output--wrapper,
.date {
  display: inline-block;

  .item-list > ul {
    margin: 0;
    list-style-type: none;
    > li {
      margin: 0;
    }
  }
}

// Smart date is missing markup in some scenarios,
// see https://www.drupal.org/project/smart_date/issues/3386082
//
//.smart-date--date .datetime,
//.datetime .smart-date--date {
//  //background: $color_bg-slight-contrast;
//  //margin-left: -.25rem;
//  //padding: 0 .25rem;
//  padding-right: .25rem;
//  font-size: $font-size-l;
//  font-weight: bold;
//}

.recurring-output--wrapper {
  display: block;
  width: 100%;
  padding-right: 3rem;
  font-size: var(--font-size-l);
  font-weight: bold;

  dialog {
    font-size: var(--font-size-default);
    font-weight: normal;
  }

  button.button {
    position: absolute;
    left: auto;
    right: -3rem;
    font-size: $font-size-default;
    overflow: hidden;
    width: 2.5rem;
    height: 2rem;
    padding-left: .75rem;
    padding-right: .75rem;
    @include icon(calendar-plus) {
      margin-right: 1.5rem;
      margin-bottom: 1.5rem;
      position: relative;
      top: -.25rem;
    }
  }
}

// using "—" (code-induced spaces adjusted)
.date-join {
  position: relative;
  left: -.125em;
  margin-right: -.25em;
  font-size: inherit;
  padding: 0 .25rem;
}

// if you prefer the old comma, uncomment
//.time-join::before {
//  content: ",";
//}

.add-to-calendar.modal {
  a {
    @extend %button;
    margin-top: 1rem;
    margin-right: 1rem;
  }
}

// see ../views/view-related-date.scss for further date styling
