@aplus-frontend/ui/theme/antdv-override.less

@import './mixins/config.less';
@tw: ~'@{ns}-ap-table__table-wrapper';
@sb: ~'@{ns}-scroll-bar';

[data-aplus-ui-mode='aplus'] {
  // Alert
  .ant-alert {
    .ant-alert-close-icon {
      line-height: 18px;
    }

    .ant-alert-icon {
      font-size: 16px;
      margin-inline-end: @spacing;
    }

    .ant-alert-message {
      color: #182948;
      font-weight: normal !important;
      font-size: @font-size-base;
      line-height: @line-height-base;

      .href {
        color: #0070ff;
        cursor: pointer;
      }
    }

    &.ant-alert-with-description {
      .ant-alert-message {
        margin-bottom: @spacing-xs;
        font-weight: bold !important;
      }
    }

    .ant-alert-description {
      color: #182948;
    }

    &.ant-alert-warning {
      background: rgba(255, 169, 64, 0.1);
      border: 1px solid rgba(255, 169, 64, 0.4);
    }

    &.ant-alert-info {
      background: rgba(0, 112, 255, 0.1);
      border: 1px solid rgba(0, 112, 255, 0.4);
    }

    &.ant-alert-success {
      background: rgba(46, 209, 163, 0.1);
      border: 1px solid rgba(46, 209, 163, 0.4);
    }

    &.ant-alert-error {
      background: rgba(255, 77, 79, 0.1);
      border: 1px solid rgba(255, 77, 79, 0.4);
    }
  }
  // Button
  .ant-btn {
    box-shadow: none;

    &.ant-btn-primary[disabled],
    &.ant-btn-primary[disabled]:hover {
      color: #ffffff;
      background: #cce2ff;
      border-color: #cce2ff;
    }

    &.ant-btn-dangerous.ant-btn-primary[disabled],
    &.ant-btn-dangerous.ant-btn-primary[disabled]:hover {
      color: #ffffff;
      background: #ffdbdc;
      border-color: #ffdbdc;
    }

    &.ant-btn-default[disabled],
    &.ant-btn-default[disabled]:hover {
      color: #abb7cc;
      background: #f9f9fa;
      border-color: #dee4ed;
    }

    &.ant-btn-link[disabled],
    &.ant-btn-link[disabled]:hover {
      color: #cce2ff;
    }
  }
  // message
  .ant-message {
    div.ant-message-notice-content {
      padding: 10px 16px;
      font-size: 14px;
      line-height: 22px;
      box-shadow: 0 3px 6px 0 rgba(44, 54, 69, 0.102);
    }

    .ant-message-notice .anticon {
      margin-bottom: 1px;
      margin-inline-end: 9px;
    }
  }
  // Modal
  .ant-modal-root {
    .ant-modal {
      .ant-modal-close {
        top: 14px;
        inset-inline-end: 18px;
        color: rgb(135, 150, 176);

        &:hover {
          background-color: transparent;
        }
      }

      .ant-modal-close-x {
        line-height: 0;
      }

      .ant-modal-content {
        padding: 0;

        .ant-modal-header {
          margin-bottom: 0;
          padding: 12px 20px;
          border-bottom: 1px solid#E9EDF3;
        }

        .ant-modal-body {
          padding: 16px 20px;

          &:has([class*='ap-modal-body-wrapper']) {
            padding: 16px 0 !important;

            [class*='ap-modal-body-wrapper'] {
              padding: 0 20px;
              overflow: hidden auto;
            }
          }
        }

        .ant-modal-footer {
          margin-top: 0;
          padding: 0 20px 12px;

          button {
            min-width: 72px;
          }

          .ant-btn + .ant-btn:not(.ant-dropdown-trigger) {
            margin-inline-start: 8px;
          }
        }
      }
    }

    .ant-modal-confirm {
      .ant-modal-content {
        .ant-modal-body {
          padding: 20px 24px;

          .ant-modal-confirm-body {
            // left icon
            & > .anticon {
              margin-inline-end: 10px;
              font-size: 22px;
            }

            .ant-modal-confirm-title {
              color: #182948;
              font-weight: normal;
            }

            .ant-modal-confirm-content {
              max-width: calc(100% - 40px);
              color: #8896b0;
              font-weight: normal;
              line-height: 1.5;
              margin-block-start: 4px;
              margin-inline-start: 34px;

              & > * {
                color: #8896b0;
              }
            }
          }

          .ant-modal-confirm-btns {
            margin-top: 0;
            padding-top: 16px;

            button {
              min-width: 72px;
            }

            .ant-btn + .ant-btn:not(.ant-dropdown-trigger) {
              margin-inline-start: 8px;
            }
          }
        }
      }
    }
  }

  .ant-modal-confirm-success .ant-modal-confirm-body > .anticon {
    color: #06c687;
  }

  .ant-modal-confirm-info .ant-modal-confirm-body > .anticon {
    color: #0070ff;
  }

  .ant-modal-confirm-warning .ant-modal-confirm-body > .anticon,
  .ant-modal-confirm-confirm .ant-modal-confirm-body > .anticon {
    color: #ffa940;
  }

  .ant-modal-confirm-error .ant-modal-confirm-body > .anticon {
    color: #ff4d4f;
  }
  // Table
  [class*='-ap-table'].ap-table--sticky {
    .@{tw},
    .ant-table-wrapper {
      &:has(ul.ant-pagination) {
        padding-bottom: 0;
      }

      & .ant-spin-container,
      &,
      .ant-spin-container {
        overflow: visible;

        .ant-table {
          overflow: visible;

          .ant-table-container {
            overflow: visible;

            .ant-table-header {
              position: sticky;
              top: 0;
              z-index: 90;
              border-top: 4px solid #ffffff;
            }
          }
        }
        .@{sb} {
          position: sticky;
          bottom: -1px;
          z-index: 90;
        }

        &:has(ul.ant-pagination) {
          .@{sb} {
            bottom: 44px;
          }
        }

        ul.ant-pagination {
          position: sticky;
          bottom: 0;
          z-index: 90;
          margin: 0;
          padding: 8px 0;
          background-color: #ffffff;
        }

        &:has(.@{sb}) {
          ul.ant-pagination {
            padding-top: 4px;
          }
        }
      }
    }
  }
  // Field
  .ant-checkbox:not(.ant-checkbox-checked) .ant-checkbox-inner {
    border-color: #d3d7de;
  }

  .ant-radio:not(.ant-radio-checked) .ant-radio-inner {
    border-color: #d3d7de;
  }

  .ant-input::placeholder {
    color: #abb7cc;
  }

  .ant-select .ant-select-selection-placeholder {
    color: #abb7cc;
  }

  .ant-picker .ant-picker-input > input::placeholder {
    color: #abb7cc;
  }

  .ant-input-number .ant-input-number-input-wrap > input::placeholder {
    color: #abb7cc;
  }
  // Tooltip
  .ant-tooltip div[role='tooltip'] {
    padding-block: 6px;
  }
  // Drawer
  .ant-drawer {
    &-right {
      .ant-drawer-content-wrapper {
        box-shadow: -8px 2px 24px 0 rgba(24, 41, 72, 0.2);
      }
    }
  }
}

[data-aplus-ui-mode='admin'] {
  // Alert
  .ant-alert {
    .ant-alert-close-icon {
      line-height: 18px;
    }

    .ant-alert-icon {
      font-size: 16px;
      margin-inline-end: @spacing;
    }

    .ant-alert-message {
      color: #333333;
      font-weight: normal !important;
      font-size: @font-size-base;
      line-height: @line-height-base;

      .href {
        color: #1890ff;
        cursor: pointer;
      }
    }

    &.ant-alert-with-description {
      .ant-alert-message {
        margin-bottom: @spacing-xs;
        font-weight: bold !important;
      }
    }

    &.ant-alert-warning {
      background: rgba(250, 173, 20, 0.1);
      border: 1px solid rgba(250, 173, 20, 0.4);
    }

    &.ant-alert-info {
      background: rgba(24, 144, 255, 0.1);
      border: 1px solid rgba(24, 144, 255, 0.4);
    }

    &.ant-alert-success {
      background: rgba(52, 183, 124, 0.1);
      border: 1px solid rgba(52, 183, 124, 0.4);
    }

    &.ant-alert-error {
      background: rgba(255, 77, 79, 0.1);
      border: 1px solid rgba(255, 77, 79, 0.4);
    }
  }
  // Button
  .ant-btn {
    box-shadow: none;

    &.ant-btn-primary[disabled],
    &.ant-btn-primary[disabled]:hover {
      color: #ffffff;
      background: #d6f1e5;
      border-color: #d6f1e5;
    }

    &.ant-btn-dangerous.ant-btn-primary[disabled],
    &.ant-btn-dangerous.ant-btn-primary[disabled]:hover {
      color: #ffffff !important;
      background: #ffdbdc !important;
      border-color: #ffdbdc !important;
    }

    &.ant-btn-default[disabled],
    &.ant-btn-default[disabled]:hover {
      color: #bfbfbf !important;
      background: #fafafa !important;
      border-color: #d9d9d9 !important;
    }

    &.ant-btn-link[disabled],
    &.ant-btn-link[disabled]:hover {
      color: rgba(24, 144, 255, 0.2) !important;
    }
  }
  // message
  .ant-message {
    div.ant-message-notice-content {
      padding: 10px 16px;
      font-size: 14px;
      line-height: 22px;
      box-shadow: 0 3px 6px 0 rgba(44, 54, 69, 0.102);
    }

    .ant-message-notice .anticon {
      margin-bottom: 1px;
      margin-inline-end: 9px;
    }
  }
  // Modal
  .ant-modal-root {
    .ant-modal {
      .ant-modal-close {
        top: 14px;
        inset-inline-end: 18px;
        color: #666666;

        &:hover {
          background-color: transparent;
        }
      }

      .ant-modal-close-x {
        line-height: 0;
      }

      .ant-modal-content {
        padding: 0;

        .ant-modal-header {
          margin-bottom: 0;
          padding: 12px 20px;
          border-bottom: 1px solid#E9E9E9;
        }

        .ant-modal-body {
          padding: 16px 20px;

          & > .scrollbar {
            padding: 0;
          }

          .scrollbar__wrap {
            margin-bottom: 0 !important;
          }

          &:has([class*='ap-modal-body-wrapper']) {
            padding: 16px 0 !important;

            [class*='ap-modal-body-wrapper'] {
              padding: 0 20px;
              overflow: hidden auto;
            }
          }
        }

        .ant-modal-footer {
          margin-top: 0;
          padding: 0 20px 12px;
          border-top: none;

          button {
            min-width: 72px;
          }

          .ant-btn + .ant-btn:not(.ant-dropdown-trigger) {
            margin-inline-start: 8px;
          }
        }
      }
    }

    .ant-modal-confirm {
      .ant-modal-content {
        .ant-modal-body {
          padding: 20px 24px;

          .ant-modal-confirm-body {
            & > .anticon {
              margin-inline-end: 10px;
              font-size: 22px;
            }

            .ant-modal-confirm-title {
              color: #333333;
              font-weight: normal;
            }

            .ant-modal-confirm-content {
              max-width: calc(100% - 40px);
              color: #999999;
              font-weight: normal;
              line-height: 200%;
              margin-block-start: 4px;
              margin-inline-start: 34px;

              & > * {
                color: #999999;
              }
            }
          }

          .ant-modal-confirm-btns {
            margin-top: 0;
            padding-top: 16px;

            button {
              min-width: 72px;
            }

            .ant-btn + .ant-btn:not(.ant-dropdown-trigger) {
              margin-inline-start: 8px;
            }
          }
        }
      }
    }
  }

  .ant-modal-confirm-success .ant-modal-confirm-body > .anticon {
    color: #06c687;
  }

  .ant-modal-confirm-info .ant-modal-confirm-body > .anticon {
    color: #1890ff;
  }

  .ant-modal-confirm-warning .ant-modal-confirm-body > .anticon,
  .ant-modal-confirm-confirm .ant-modal-confirm-body > .anticon {
    color: #faad14;
  }

  .ant-modal-confirm-error .ant-modal-confirm-body > .anticon {
    color: #ff4d4f;
  }
  // Table
  [class*='-ap-table'].ap-table--sticky {
    .@{tw},
    .ant-table-wrapper {
      &:has(ul.ant-pagination) {
        padding-bottom: 0;
      }

      & .ant-spin-container,
      &,
      .ant-spin-container {
        overflow: visible;

        .ant-table {
          overflow: visible;

          .ant-table-container {
            overflow: visible;

            .ant-table-header {
              position: sticky;
              top: 0;
              z-index: 90;
              border-top: 4px solid #ffffff;
            }
          }
        }

        .@{sb} {
          position: sticky;
          bottom: -1px;
          z-index: 90;
        }

        &:has(ul.ant-pagination) {
          .@{sb} {
            bottom: 44px;
          }
        }

        ul.ant-pagination {
          position: sticky;
          bottom: 0;
          z-index: 90;
          margin: 0;
          padding: 8px 0;
          background-color: #ffffff;
        }

        &:has(.@{sb}) {
          ul.ant-pagination {
            padding-top: 4px;
          }
        }
      }
    }
  }
  // Tooltip
  .ant-tooltip div[role='tooltip'] {
    padding-block: 6px;
  }
  // Field
  .ant-checkbox:not(.ant-checkbox-checked) .ant-checkbox-inner {
    border-color: #d9d9d9;
  }

  .ant-radio:not(.ant-radio-checked) .ant-radio-inner {
    border-color: #d9d9d9;
  }

  .ant-input::placeholder {
    color: #bfbfbf;
  }

  .ant-select .ant-select-selection-placeholder {
    color: #bfbfbf;
  }

  .ant-picker .ant-picker-input > input::placeholder {
    color: #bfbfbf;
  }

  .ant-input-number .ant-input-number-input-wrap > input::placeholder {
    color: #bfbfbf;
  }

  // Drawer
  .ant-drawer {
    &-right {
      .ant-drawer-content-wrapper {
        box-shadow: -8px 2px 24px 0 rgba(51, 51, 51, 0.2);
      }
    }
  }
}