@use '../../ui/mat-selectors' as mat;

.aca-sidenav {
  display: flex;
  flex: 1;
  flex-direction: column;
  height: 100%;
  overflow-y: hidden;
  background: var(--theme-sidenav-background-color);

  &-header {
    padding: 32px 0;

    &-title {
      display: flex;
      flex-direction: row;
      align-items: center;
      height: 32px;
      padding: 0 24px;

      &-logo {
        background: transparent;
        border: none;

        img {
          cursor: pointer;
          height: 28px;
          vertical-align: middle;
          transform: scale(0.7);
        }
      }

      &-text {
        flex: 1;
        color: var(--theme-sidenav-text-color);
        padding-left: 12px;
        letter-spacing: 0.25px;
        font-style: normal;
        font-weight: 400;
        font-size: var(--theme-body-1-font-size);
        cursor: pointer;
      }
    }
  }

  .aca-sidenav__section {
    overflow-y: auto;

    #{mat.$mat-expansion-panel-body} {
      padding: 0;
    }

    .aca-expansion-panel {
      width: 100%;
      background-color: unset;
      box-shadow: none;
      border-radius: 0;

      &-header {
        padding: 0 32px 0 0;
        display: flex;
        align-items: center;
        border: none;

        span::after {
          transform: rotate(226deg);
        }

        &-title {
          display: flex;
          flex-direction: row;

          .aca-action-button__label {
            font-size: var(--theme-caption-font-size);
          }
        }
      }

      .aca-expansion-panel-header:hover {
        background: var(--adf-theme-background-hover-color);
      }

      &-item {
        flex-direction: row;
        display: flex;
        align-items: center;
        text-decoration: none;
        width: 100%;
        user-select: none;

        .aca-action-button__label {
          color: var(--theme-text-light-color);
        }

        &:hover .aca-action-button__label {
          color: var(--theme-sidenav-hovered-text-color);
        }

        .aca-action-button--active {
          color: var(--adf-sidenav-active-text-color);
          background: var(--theme-selected-background-color);

          .aca-action-button__label {
            color: var(--adf-sidenav-active-text-color);
          }
        }
      }

      &-body {
        font-size: var(--theme-body-1-font-size);
        padding: 0;
        margin: 0;

        button {
          line-height: 32px;
          align-items: center;
        }
      }
    }

    .aca-action-button {
      cursor: pointer;
      color: var(--theme-action-button-text-color);
      height: 32px;
      padding: 0 24px;
      border-radius: 0;
      line-height: 32px;
      justify-content: start;

      #{mat.$mat-button-label} {
        overflow: hidden;
        text-overflow: ellipsis;
      }
    }

    .aca-full-width {
      display: flex;
      width: 100%;
    }

    .aca-sidenav__section__actions {
      &__item:has(span) {
        padding: 0;
        height: 100%;
        margin-bottom: 32px;

        span {
          pointer-events: auto;
        }
      }

      &:last-child {
        border-bottom: 0;
      }
    }
  }
}
