@import "./mixin";
.ws-app-bar-locale-select {
  @include no_select;
  position: relative;
  .ws-app-bar-locale-select__button {
    @include flex;
    @include flex_align;
    width: 125px;
    height: 32px;
    border-radius: 8px;
    box-shadow: 0 1px 2px 0 rgba(4, 48, 71, 0.06), 0 0 1px 0 rgba(4, 48, 71, 0.1);
    border: solid 1px #d7dee7;
    background-color: #ffffff;
    padding: 6px 12px;
    cursor: pointer;
    .icon {
      font-size: 1.25rem;
      color: var(--v-textSecondary-base);
      margin-right: 8px;
    }
    .text {
      font-size: 0.875rem;
      line-height: 1.43;
      color: var(--v-textSecondary-base);
    }
  }
  .ws-app-bar-locale-select__options {
    position: absolute;
    top: 35px;
    left: 0;
    width: 100%;
    border-radius: 8px;
    box-shadow: 0 16px 16px -2px rgba(4, 48, 71, 0.1), 0 0 1px 0 rgba(4, 48, 71, 0.1);
    background-color: #ffffff;
    max-width: 300px;
    overflow: auto;
    a {
      @include flex;
      padding: 14px 10px;
      font-size: 0.875rem;
      line-height: 1.43;
      color: var(--v-textPrimary-base);
      &:hover {
        background-color: var(--v-dataTableExpandRow-base);
      }
      &:focus {
        background-color: var(--v-dataTableExpandRow-base);
      }
    }
  }
}