.v-btn {
  background-color: #1677ff;

  &:not(.v-btn--round) {
    border-radius: 6px;
  }

  &-radius {
    &__20 {
      border-radius: 20px !important;
    }

    &__50per {
      border-radius: 50% !important;
    }
  }

  &__full {
    width: 100%;
  }

  &__round {
    min-width: 100px !important;
    padding: 8px 25px !important;
    border-radius: 20px !important;
  }

  &__excel {
    background-color: #47535c !important;
  }

  &-bg {
    &__transparent {
      background-color: transparent !important;
    }

    &__blue {
      background-color: $--color-primary__blue;
    }

    &__white-blue {
      background-color: $--color-white;
      color: $--color-primary__blue;
    }
  }

  &__transparent {
    border: 0;
    background-color: transparent !important;
  }

  &.v-btn--icon.v-btn--tile {
    border-radius: 4px;
  }
}

@each $theme in dark, light {
  @include theme($theme);

  .v-application.#{$theme}-mode {
    .v-btn-bg__w-g5 {
      background-color: $--theme-color-w-g5;

      i {
        color: $--theme-color-g5-w;
      }
    }

    .custom-action-btn{
      height: 24px;
      width: 24px;
      font-size: 12px;
    }

    .v-btn {
      background-color: map-deep-get($config,
        #{$theme},
        "v-btn-backgroundColor"
      );
      color: map-deep-get($color, "white", "0");

      &.v-btn--disabled {
        opacity: 0.4;
        background-color: map-deep-get($config,
          #{$theme},
          "v-btn-backgroundColor"
        ) !important;
        color: map-deep-get($color, "white", "0") !important;

        .v-icon {
          color: map-deep-get($color, "white", "0") !important;
        }
      }
    }

    .basic-button {
      color: map-deep-get($config, #{$theme}, "basic-button-color");
      background: map-deep-get($config, #{$theme}, "basic-button-background");
    }

    .searchFilter {
      .search-button {
        height: 40px;
        color: map-deep-get($config, #{$theme}, "search-btn-color");
      }
    }

    .v-dialog {
      .ant-btn-icon-only {
        color: map-deep-get($config,
          #{$theme},
          "icon-color"
        );
      }
    }

    .ant-btn {

      &.ant-btn-outlined {
        color:map-deep-get($config, #{$theme}, "ant-btn-default-color");
        border:1px solid map-deep-get($config, #{$theme}, "ant-btn-default-border-outlined");
        background-color: transparent;
      }

      &.ant-btn-primary {
        background: map-deep-get($config, #{$theme}, "ant-btn-primary-bg");
        border-color:map-deep-get($config, #{$theme}, "ant-btn-primary-bg");
        color:map-deep-get($config, #{$theme}, "ant-btn-primary-color");

        &.ant-btn-background-ghost {
          color:map-deep-get($config, #{$theme}, "ant-btn-primary-bg");
        }
      }

      &.ant-btn-default {
        background:map-deep-get($config, #{$theme}, "ant-btn-default-bg");
        color:map-deep-get($config, #{$theme}, "ant-btn-default-color");
      }

      &.ant-btn-popup-default {
        background:map-deep-get($config, #{$theme}, "ant-btn-popup-bg");
        color:map-deep-get($config, #{$theme}, "ant-btn-popup-color");
        border: 1px solid map-deep-get($config, #{$theme}, "ant-btn-popup-border");
      }

      &.ant-btn-danger {
        &.ant-btn-background-ghost {
          color:map-deep-get($config, #{$theme}, "ant-btn-danger-color");
          border-color:map-deep-get($config, #{$theme}, "ant-btn-danger-border");
          background: map-deep-get($config, #{$theme}, "ant-btn-danger-bg") !important;
        }
      }

      &.expand-btn {
        .v-icon {
          color: map-deep-get($config, #{$theme}, "basic-button-color");

          svg {
            fill: map-deep-get($config, #{$theme}, "basic-button-color");
          }
        }
      }
    }
  }
}

.v-application {
  .ant-btn {
    border-radius: 6px;

    &.ant-btn-lg {
      border-radius: 8px;
    }

    &.ant-btn-default {
      border: none !important
    }

  }
}



.v-dialog {
  .ant-btn-icon-only {
    border: none;
    width: 16px;
    height: 16px;
    background: none;
  }
}

.ant-btn {
  &.expand-btn {
    span {
      &.v-icon {
        margin-right: 8px;
      }
    }
  }
}