/**
 * @license
 * Copyright Tyler Technologies, Inc. 
 * License: Apache-2.0
 */
@use './core' as *;

:host {
  @include tokens;
}

:host(:focus) {
  outline: none;
}

:host([error]) {
  @include state-layer-error;
}

:host(:first-child[alternative]) {
  &::after {
    @include psudo-line-begin-alternate;
  }
}
:host(:last-child[alternative]) {
  &::before {
    @include psudo-line-end-alternate;
  }
}

:host(:not(:first-child):not(:last-child)[alternative]) {
  &::before,
  &::after {
    @include psudo-line-alternate;
  }
}

:host(:not(:last-child)[alternative]) {
  .after {
    @include after-container-alternate;

    &::after {
      @include after-container-alternate-psudo-base;
      @include line;
    }
  }
}

:host(:not(:first-child)[alternative]) {
  .before {
    @include before-container-alternate;

    &::before {
      @include before-container-alternate-psudo-base;
      @include line;
    }
  }
}

:host(:not(:first-child):not(:last-child)):host(:not([vertical])) {
  &::before,
  &::after {
    @include step-line;
    @include psudo-line-between-inset;
  }
}

:host(:last-child):host(:not([vertical])) {
  &::before {
    @include step-line;
    @include psudo-line-end-inset;
  }
}

:host(:is(:first-child)):host(:not([vertical])) {
  &::after {
    @include step-line;
    @include psudo-line-start-inset;
  }
}

:host([vertical]) {
  @include vertical-host;

  &::after {
    @include vertical-psudo-line;
  }

  &::before {
    @include vertical-psudo-line;
  }

  .forge-step {
    @include vertical-base;

    .text-container {
      @include vertical-text-container;
    }
  }

  .icon-container {
    .icon-content {
      @include vertical-icon-container-content;
    }
  }
}

:host([vertical]) {
  .expansion-panel {
    @include expansion-panel-base;
  }

  .expanded-icon {
    @include expansion-panel-icon;
  }
}

:host([vertical][expandable]) {
  .expansion-panel {
    @include veritcal-expansion-panel;
  }
}

:host([ignore-user-expansion]) {
  @include forge-ignore-user-expansion;
}

forge-expansion-panel {
  &::part(root) {
    @include expansion-panel-styles;
  }
}

forge-focus-indicator {
  @include focus-indicator-base;
}

.container {
  display: contents;
}

.forge-step {
  @include base;
  @include forge-interactable;

  &.error {
    forge-focus-indicator {
      @include focus-indicator-error;
    }
  }

  &.vertical {
    forge-focus-indicator {
      @include focus-indicator-vertical;
    }
  }

  &.selected:not(.disabled) {
    @include state-layer-active;
    &::before {
      @include background-selected;
    }

    &.error {
      @include background-selected-error;
    }
  }

  .title {
    @include label;
  }

  .subtitle {
    @include optional-label-slot-wrapper;

    ::slotted(*) {
      @include optional-label;
    }
  }

  .icon-container {
    .icon-content {
      @include icon-content;
    }
  }

  &.disabled {
    @include disabled-base;

    &.forge-step {
      .icon-container {
        .icon-content {
          @include icon-content-disabled;
        }
      }
    }

    .text-container {
      .title {
        @include title-disabled;
      }

      .subtitle {
        ::slotted(*) {
          @include subtitle-disabled;
        }
      }
    }
  }

  &.alternative {
    @include alternate;

    .icon-container {
      .icon-content {
        @include icon-content-alternate;
      }
    }
    .text-container {
      @include text-container-alternate;
    }
  }

  &:not(.selected):not(.disabled) {
    &:not(.editable):not(.completed),
    &.editable:not(.completed) {
      &:not(.error) {
        .icon-content {
          @include icon-content-default-theme;

          .index {
            @include icon-content-default-theme-index;
          }
        }
      }
    }
  }

  &.selected {
    &.disabled {
      .icon-content {
        @include icon-content-disabled;
      }
    }

    &:not(.disabled) {
      .icon-container {
        .icon-content {
          @include icon-content-selected;
        }
      }
    }

    &:not(.disabled) {
      .title {
        @include label-selected;
      }

      .subtitle {
        ::slotted(*) {
          @include optional-label-selected;
        }
      }
    }
  }

  &.error {
    &:not(.disabled) {
      .title {
        @include label-error;
      }

      .subtitle {
        ::slotted(*) {
          @include optional-label-error;
        }
      }

      .icon-container {
        .icon-content {
          @include icon-content-error;
        }
      }
    }
  }

  &.completed {
    &:not(.disabled) {
      &:not(.error) {
        &:not(.editable) {
          .icon-content {
            @include icon-content-completed;
          }
        }
        &.editable {
          .icon-content {
            @include icon-content-completed;
          }
        }
      }
    }
  }

  &.expandable {
    .expanded-icon {
      @include expandable-icon-base;
    }

    &.expanded {
      .expanded-icon {
        @include expandable-icon-animation;
      }
    }

    .icon-container {
      .icon-content {
        @include expandable-icon-content;
      }
    }
  }

  .text-container {
    @include text-container;
  }
}

:host(:not(:last-child)[clustered]) {
  &::after {
    @include line-clustered;
  }
}

:host(:last-child[clustered]) {
  &::before {
    @include line-clustered;
  }
}

:host(:not(:first-child):not(:last-child)[clustered]) {
  &::before,
  &::after {
    @include line-clustered;
  }
}
