/*
 * Shortcode: section-title.scss
 * -----------------------------------------------
*/
.tm-sc-section-title {
  margin-bottom: $section-title-mb;
  .title-wrapper {
    margin-bottom: 0;
    position: relative;
    .title {
      margin-top: -6px;
      margin-bottom: 10px;
      line-height: var(--section-title-line-height);
      position: relative;
      z-index: 0;
      font-family: var(--section-title-font-family);
      font-weight: var(--section-title-font-weight);
      @include transition(all 0.3s ease);
      .title-shadow-text {
        position: absolute;
        left: 0;
        right: 0;
        z-index: -1;
        color: #ddd;
        font-size: 6rem;
        opacity: 0.4;
        top: -40px;
        @include media-breakpoint-down(md) {
          font-size: 4rem;
          top: -20px;
        }
      }
      span {
        line-height: 1;
        display: inline;
      }
    }
    h2.title {
      font-size: var(--section-title-font-size);
      @include media-breakpoint-down(md) {
        font-size: $h2-font-size-mob;
      }
    }
    .subtitle {
      position: relative;
      z-index: 1;
      // text-transform: uppercase;
      letter-spacing: 0.1em;
      color: $section-title-subtitle-color;
      font-size: $section-title-subtitle-font-size;
      font-family: $section-title-subtitle-font-family;
      font-weight: $section-title-subtitle-font-weight;
      margin-bottom: 10px;
      @include transition(all 0.3s ease);
    }
    :first-child {
      margin-top: 0;
    }
    .paragraph {
      position: relative;
      @include transition(all 0.3s ease);
      > * {
        @include transition(all 0.3s ease);
      }
    }
  }

  &.title-icon-pos-icon-top {
    .title-wrapper {
      .subtitle {
        display: block;
      }
    }
  }
}

.elementor-widget-tm-ele-section-title {
  &.horizontal-line-align-center {
    .tm-sc-section-title {
      .title-wrapper {
        &:before,
        &:after {
          left: 50%;
          transform: translate(-50%, 0);
        }
      }
    }
  }
  &.horizontal-line-align-right {
    .tm-sc-section-title {
      .title-wrapper {
        &:before,
        &:after {
          left: auto;
          right: 0;
        }
      }
    }
  }
  &.vertical-line-align-top {
    .tm-sc-section-title {
      .title-wrapper {
        &:before,
        &:after {
          bottom: auto;
          top: -20px;
        }
      }
    }
  }
}

.tm-sc-section-title {
  .subtitle {
    padding-left: 20px;
  }
  .subtitle:before,
  &.center .subtitle:before {
    position: absolute;
    left: 0;
    top: 0;
    content: "//";
    color: var(--theme-color1);
  }
  &.center .subtitle:before {
    left: auto;
    margin-left: -20px;
  }
}