// 重置部分antd组件样式
:global {
  .@{ant-prefix}-message {
    .@{ant-prefix}-message-notice-content {
      color: #fff;
      background-color: #000;
      margin-top: 60px;
    }
  }
  div p {
    margin-bottom: 0;
  }
  a:focus {
    text-decoration: none !important;
  }

  //Button
  .button-color(@color; @background; @border) {
    color: @color;
    background: @background;
    border-color: @border;
  }

  .@{ant-prefix}-btn-gap {
    margin-right: 30px;
  }

  // Table
  .@{ant-prefix}-table {
    border-radius: 0;
    background: #fff;
    .@{ant-prefix}-table-tbody > tr:hover {
      background-color: #f6f8fb;
    }
    .@{ant-prefix}-table-thead > tr > th,
    .@{ant-prefix}-table-tbody > tr > td {
      padding: 9px 2px;
      line-height: 32px;
    }
    .@{ant-prefix}-table-thead > tr > th {
      background: #dee1e9;
      font-weight: 500;
      text-align: left;
      color: #212121;
      &:first-child {
        padding-left: 40px;
      }
      &:last-child {
        padding-right: 40px;
      }
    }
    &:not(.@{ant-prefix}-table-empty) .@{ant-prefix}-table-tbody > tr > td {
      border-bottom-color: #efefef;
      color: #30344f;
      &:first-child {
        padding-left: 40px;
      }
      &:last-child {
        // padding-right: 40px; // 会导致列对不齐
      }
    }
    .@{ant-prefix}-table-thead > tr > th.@{ant-prefix}-table-selection-column,
    .@{ant-prefix}-table-tbody > tr > td.@{ant-prefix}-table-selection-column {
      text-align: left;
      width: 88px;
    }
    .@{ant-prefix}-table-thead > tr > th.@{ant-prefix}-table-column-sort {
      background: #dee1e9;
    }
    .@{ant-prefix}-table-thead > tr > th.@{ant-prefix}-table-column-has-sorters {
      background: #f5f5f5;
    }
    .@{ant-prefix}-table-footer {
      padding: 0;
      background-color: #fff;
    }
  }

  // 抽屉中的表格
  .@{ant-prefix}-table_drawer {
    .@{ant-prefix}-table-thead > tr > th,
    .@{ant-prefix}-table-tbody > tr > td {
      position: relative;
      &:first-child {
        padding-left: 20px;
      }
      &:last-child {
        padding-right: 20px;
      }
    }
    .@{ant-prefix}-table-body {
      overflow-x: hidden;
    }
    .@{ant-prefix}-table-tbody > tr > td {
      padding: 8px;
    }
    .@{ant-prefix}-table-tbody > tr > td:first-child::before,
    .@{ant-prefix}-table-tbody > tr > td:last-child::before {
      content: '';
      position: absolute;
      bottom: -1px;
      width: 20px;
      border-bottom: 1px solid #fff;
      left: 0;
      z-index: 5;
      border-color: inherit;
    }
    .@{ant-prefix}-table-tbody > tr > td:last-child::before {
      left: auto;
      right: 0;
    }
    .@{ant-prefix}-table-thead > tr > th.@{ant-prefix}-table-selection-column > div {
      display: none;
    }
    .@{ant-prefix}-table-thead > tr > th.@{ant-prefix}-table-selection-column,
    .@{ant-prefix}-table-tbody > tr > td.@{ant-prefix}-table-selection-column {
      width: 40px;
      min-width: 40px;
    }
  }

  // 抽屉中的表单
  div .@{ant-prefix}-form_drawer {
    padding: 0 20px;
  }

  //Drawer

  .@{ant-prefix}-drawer {
    .@{ant-prefix}-drawer-right.@{ant-prefix}-drawer-open .@{ant-prefix}-drawer-content-wrapper {
      box-shadow: -8px -6px 16px 0 rgba(0, 0, 0, 0.1);
    }
    .@{ant-prefix}-drawer-title {
      padding-bottom: 17px;
      font-size: 16px;
      font-weight: 400;
      border-bottom: 1px solid #d8deec;
    }
    .@{ant-prefix}-drawer-subtitle {
      font-size: 14px;
      margin-left: 15px;
      color: #7e849c;
    }
    .@{ant-prefix}-drawer-header {
      padding: 20px 20px 0;
      border: none;
    }
    .@{ant-prefix}-drawer-close {
      top: 3px;
      color: #212121;
    }
    .@{ant-prefix}-drawer-body {
      padding: 0;
    }
    .@{ant-prefix}-drawer-body-fullheight {
      height: calc(100vh - 130px);
      overflow: auto;
    }
    /*  自定义footer  */
    .@{ant-prefix}-drawer-footer {
      height: 70px;
      line-height: 70px;
      text-align: right;
      background-color: #eef0f5;
      padding: 0 20px;
      color: #212121;
    }
  }

  // Tab
  .@{ant-prefix}-tabs {
    .@{ant-prefix}-tabs-nav-wrap {
      margin-bottom: 0;
      padding-left: 40px;
      color: #7e849c;
    }
    .@{ant-prefix}-tabs-nav-container {
      line-height: 1.95;
      font-size: 14px;
    }
    .@{ant-prefix}-tabs-ink-bar {
      height: 3px;
    }
    .@{ant-prefix}-tabs-nav .@{ant-prefix}-tabs-tab {
      margin-right: 46px;
      padding: 12px 4px;
      position: relative;
    }
  }

  //Select
  div {
    .@{ant-prefix}-select-dropdown-menu-item-selected,
    .@{ant-prefix}-select-dropdown-menu-item-selected:hover {
      background-color: #5b99ea !important;
      color: #ffffff;
    }
    .@{ant-prefix}-select-selection {
      border-radius: 2px;
      border: 1px solid #c5cddb;
      color: #30354d;
    }
  }

  // Switch
  div {
    .@{ant-prefix}-switch {
      height: 20px;
      border: 1px solid rgba(230, 230, 230, 1);
      background-color: rgba(255, 255, 255, 1);
      .@{ant-prefix}-switch-handle{
        top: 1px;
        left: 1px;
        &:before {
          background: rgba(230, 230, 230, 1);
          box-shadow: unset;
          width: 16px;
          height: 16px;
        }
      }
      
      &.@{ant-prefix}-switch-checked {
        background: rgba(91, 153, 234, 1);
        border: 1px solid rgba(91, 153, 234, 1);
        .@{ant-prefix}-switch-handle{
          left: calc(100% - 16px - 1px);
          &:before {
            background: rgba(255, 255, 255, 1);
            box-shadow: unset;
            width: 16px;
            height: 16px;
          }
        }
      }
      &:focus {
        box-shadow: none;
      }
    }
  }

  // Input
  .@{ant-prefix}-form-item {
    .@{ant-prefix}-form-item-label {
      margin-bottom: 10px;
    }
    .@{ant-prefix}-input {
      // height: 36px;
    }
  }

  // Checkbox
  .@{ant-prefix}-form-item {
    .@{ant-prefix}-checkbox-checked {
      &:hover .@{ant-prefix}-checkbox-inner {
        background-color: #5b99ea;
        border-color: #5b99ea;
      }
    }
    .@{ant-prefix}-radio-checked {
      &:hover {
        border-color: #5b99ea;
        .@{ant-prefix}-radio-inner:after {
          background-color: #5b99ea;
        }
      }
    }
  }

  // Step
  div .@{ant-prefix}-steps-item-process > .@{ant-prefix}-steps-item-content > .@{ant-prefix}-steps-item-title {
    color: #1f7df8;
  }
  div .@{ant-prefix}-steps-item-process .@{ant-prefix}-steps-item-icon {
    background-color: #1f7df8;
  }
  // tags
  @default: #999999;
  @orange: #f98c00;
  @red: #d72739;
  @blue: #0088ee;
  @green: #4bb081;
  @lime: #5ba0af;
  .@{ant-prefix}-tag {
    color: @default !important;
    border-color: @default !important;
    background: #ffffff !important;
    margin-right: 10px !important;
    &:hover {
      color: none;
    }
  }
  .@{ant-prefix}-tag-orange {
    color: @orange !important;
    border-color: @orange !important;
    background: #ffffff !important;
  }
  .@{ant-prefix}-tag-red {
    color: @red !important;
    border-color: @red !important;
    background: #ffffff !important;
  }
  .@{ant-prefix}-tag-blue {
    color: @blue !important;
    border-color: @blue !important;
    background: #ffffff !important;
  }
  .@{ant-prefix}-tag-green {
    color: @green !important;
    border-color: @green !important;
    background: #ffffff !important;
  }
  .@{ant-prefix}-tag-lime {
    color: @lime !important;
    border-color: @lime !important;
    background: #ffffff !important;
  }
  // 半选框
  .@{ant-prefix}-checkbox.@{ant-prefix}-checkbox-indeterminate {
    .@{ant-prefix}-checkbox-inner {
      background-color: #2e60f8;
      border-color: #2e60f8;
      &:after {
        width: 10px;
        height: 4px;
        background-color: #fff;
        transform: translate(-50%, -50%) scale(1, 0.5);
      }
    }
    &.@{ant-prefix}-checkbox-disabled {
      .@{ant-prefix}-checkbox-inner {
        background-color: #f5f5f5;
        border-color: #d9d9d9;
        &:after {
          background-color: #dfe3e8;
        }
      }
    }
  }

  // buttons
  button.@{ant-prefix}-btn {
    // type default
    min-width: 100px;
    line-height: 1.5715;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 400;

    &:not(.@{ant-prefix}-btn-primary):not(.@{ant-prefix}-btn-danger):not(.@{ant-prefix}-btn-dashed):not(.@{ant-prefix}-btn-link) {
      &:hover {
        color: #30354d;
        border: 1px solid #97a5c7;
        box-shadow: 0 2px 4px 0 #e6e9f0;
      }

      &:focus {
        color: #30354d;
        border: 1px solid #97a5c7;
        box-shadow: 0 2px 4px 0 #e6e9f0;
      }

      &:active {
        color: #30354d;
        background: #f2f3f6;
        border: 1px solid #97a5c7;
        box-shadow: 0 2px 4px 0 #e6e9f0;
      }

      &[disabled] {
        color: #bccef6;
        background: #f6f8fc;
        border: 1px solid #bccef6;
        box-shadow: none;

        &:hover,
        &:focus,
        &:active {
          color: #bccef6;
          background: #f6f8fc;
          border: 1px solid #bccef6;
          box-shadow: none;
        }
      }
    }

    &.@{ant-prefix}-btn-primary {
      min-width: 100px;
      border-radius: 4px;
      font-size: 14px;
      font-weight: 400;
      color: #fff;
      background-color: #2e60f8;
      border: unset;
      transition: none;
      box-shadow: 0 2px 4px 0 #c1ccea;

      &:hover {
        color: #fff;
        background-color: #1f7df8;
      }

      &:focus {
        color: #fff;
        background-color: #1f7df8;
      }

      &:active {
        color: #fff;
        background-color: #2956de;
      }

      &[disabled] {
        background-color: #a5bbff;
        box-shadow: none;
        border: none;

        &:hover,
        &:focus,
        &:active {
          background-color: #a5bbff;
          box-shadow: none;
          border: none;
        }
      }
    }

    &.@{ant-prefix}-btn-danger {
      min-width: 100px;
      font-size: 14px;
      font-weight: 400;
      color: #fff;
      border: unset;
      background-color: #f5222d;
      box-shadow: 0 2px 4px 0 #e6e9f0;
      transition: none;

      &:hover {
        color: #fff;
        background-color: #ff6364;
      }

      &:focus {
        color: #fff;
        background-color: #ff6364;
      }

      &:active {
        color: #fff;
        background-color: #db1e28;
      }

      &[disabled] {
        background-color: #ffa5a5;
        box-shadow: none;
        border: none;

        &:hover,
        &:focus,
        &:active {
          background-color: #ffa5a5;
          box-shadow: none;
          border: none;
        }
      }
    }

    &.@{ant-prefix}-btn-dashed {
      min-width: 100px;
      font-size: 14px;
      font-weight: 400;
      color: #2e60f8;
      border: 1px dashed #2e60f8;
      background: #fff;
      transition: none;

      &:hover {
        color: #1f7df8;
        background-color: #f8f9fb;
        border: 1px dashed #1f7df8;
      }

      &:focus {
        color: #1f7df8;
        background-color: #f8f9fb;
        border: 1px dashed #1f7df8;
      }

      &:active {
        color: #2e60f8;
        background-color: #f8f9fb;
        border: 1px dashed #2e60f8;
      }

      &[disabled] {
        color: #aabffd;
        background: #f2f2f8;
        border: 1px dashed #aabffd;

        &:hover,
        &:focus,
        &:active {
          color: #aabffd;
          background: #f2f2f8;
          border: 1px dashed #aabffd;
        }
      }
    }

    &.@{ant-prefix}-btn-sm {
      min-width: 60px;
      border-radius: 4px;
      font-size: 14px;
      font-weight: 400;
      box-shadow: none;

      &:not(.@{ant-prefix}-btn-primary):not(.@{ant-prefix}-btn-danger):not(.@{ant-prefix}-btn-dashed):not(.@{ant-prefix}-btn-link) {
        background-color: #fff;
        border: 1px solid #d4dbea;
        box-shadow: none;

        &:hover {
          background-color: #fff;
          border: 1px solid #97a5c7;
          box-shadow: none;
        }

        &:focus {
          background-color: #fff;
          border: 1px solid #97a5c7;
          box-shadow: none;
        }

        &:active {
          background: #f3f5f9;
          border: 1px solid #d4dbea;
          box-shadow: none;
        }

        &[disabled] {
          color: #bccef6;
          background: #f6f8fc;
          border: 1px solid #bccef6;
          box-shadow: none;
          &:hover,
          &:focus,
          &:active {
            color: #bccef6;
            background: #f6f8fc;
            border: 1px solid #bccef6;
            box-shadow: none;
          }
        }
      }
    }
  }

  .dj-input-container {
    position: relative;
    :global {
      .@{ant-prefix}-input {
        height: 42px !important;
        font-size: 14px;
        padding: 11px 10px;
        border-radius: 4px;
        border-color: #c5cddb;
        &:focus {
          border-color: #9eaeca;
          box-shadow: none;
        }
        &:hover {
          border-color: #9eaeca;
        }
        &:disabled {
          background: #f3f5f8;
          cursor: not-allowed;
        }
      }
      .@{ant-prefix}-input-group-addon {
        background: rgba(238, 240, 245, 1);
        border-color: #c5cddb;
      }
      .@{ant-prefix}-input-suffix {
        position: absolute;
        top: 50%;
        right: 10px;
        z-index: 2;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        line-height: 0;
        color: rgba(0, 0, 0, 0.65);
      }
      .@{ant-prefix}-input-prefix {
        position: absolute;
        top: 50%;
        z-index: 2;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        line-height: 0;
        color: rgba(0, 0, 0, 0.65);
      }
    }
  }
  .dj-placeholder {
    font-size: 14px;
    color: rgba(157, 164, 178, 1);
    line-height: 20px;
    height: 20px;
    position: absolute;
    left: 10px;
    top: 11px;
    cursor: default;
    pointer-events: none;
    background: transparent;
    &::before {
      content: '';
      display: inline-block;
      position: absolute;
      top: 40%;
      left: 0;
      width: 100%;
      height: 3px;
      background: #fff;
      z-index: 1;
    }
  }

  .has-error .dj-placeholder {
    color: #d0021b !important;
    height: 20px;
    line-height: 20px;
    top: -10px;
    left: 11px;
  }

  .dj-input {
    &:-webkit-autofill ~ .dj-placeholder {
      height: 20px;
      color: rgba(157, 164, 178, 1);
      line-height: 20px;
      top: -10px;
      left: 11px;
    }
    &:focus ~ .dj-placeholder {
      height: 20px;
      color: rgba(157, 164, 178, 1);
      line-height: 20px;
      top: -10px;
      left: 11px;
    }
    &-addonbefore {
      border-bottom-left-radius: 0 !important;
      border-top-left-radius: 0 !important;
    }
    &-addonafter {
      border-bottom-right-radius: 0 !important;
      border-top-right-radius: 0 !important;
    }
  }

  .dj-addonbefore {
    border-bottom-left-radius: 4px !important;
    border-top-left-radius: 4px !important;
    border-right-width: 0 !important;
  }

  .dj-addonafter {
    border-bottom-right-radius: 4px !important;
    border-top-right-radius: 4px !important;
    border-left-width: 0 !important;
  }

  .has-content ~ .dj-placeholder {
    height: 20px;
    color: rgba(157, 164, 178, 1);
    line-height: 20px;
    top: -10px;
    left: 11px;
  }
}