html,
body {
  padding: 0;
  margin: 0;
  height: 100%;
  width: 100%;
  overflow: hidden;
}

html,
html.dark,
:root {
  --el-color-primary: #277186;
  --el-color-primary-light-3: #689caa;
  --el-color-primary-light-5: #93b8c3;
  --el-color-primary-light-7: #bed4db;
  --el-color-primary-light-8: #d4e3e7;
  --el-color-primary-light-9: #e9f1f3;
  --el-color-primary-dark-2: #1f5a6b;
  --el-border-radius-base: 10px;
}

* {
  box-sizing: border-box;
}

#app {
  width: 100%;
  height: 100%;
  overflow: auto;
}

.el-popper {
  border-radius: 20px;
  overflow: hidden;
}

.el-popover.el-popper {
  border-radius: 20px;
}

.el-main {
  padding: 0 !important;
}

.el-dropdown {
  color: var(--el-text-color-primary);
}

.el-upload {
  display: block;
}

.el-upload-list {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  overflow-x: auto;
  gap: 5px;
  overflow-y: scroll;
  flex-wrap: wrap;
  .el-upload-list__item {
    margin: 0;
    width: fit-content;
    height: 50px;
    padding: 0;
    border-radius: 10px;
    position: relative;
  }
}

.el-dropdown-menu {
  padding: 10px;
  .el-dropdown-menu__item {
    border-radius: 15px;
    color: var(--el-text-color-primary);
  }
}

.el-form-item__label {
  color: var(--el-text-color-primary);
}

.el-dropdown__popper {
  --el-dropdown-menuItem-hover-fill: var(--el-bg-color-page);
  --el-dropdown-menuItem-hover-color: var(--el-text-color-primary);
}

.el-menu-item {
  height: initial;
  line-height: inherit;
  --el-menu-hover-bg-color: var(--el-bg-color-page);
  border-radius: 15px;
  color: var(--el-text-color-primary);
}

.el-card {
  word-wrap: break-word;
  border-radius: 1rem;
  border: none;
  --el-card-padding: 10px;
}

.el-breadcrumb__inner a,
.el-breadcrumb__inner.is-link {
  color: var(--el-text-color-primary);
}

.el-radio-group {
  --el-border-radius-base: 5px;
}

.el-slider {
  --el-slider-button-wrapper-size: 12px;
  --el-slider-button-wrapper-offset: -8px;
  --el-slider-height: 6px;
  --el-slider-button-size: 12px;
  &.is-vertical {
    --el-slider-button-wrapper-offset: -3px;
  }
}

.el-textarea {
  border-radius: 10px;
  .el-textarea__inner {
    border-radius: 10px;
    resize: none;
  }
}

.el-input {
  .el-input__wrapper {
    border-radius: 10px;
    width: 100%;
    &.is-focus {
      box-shadow: 0 0 0 1px var(--el-input-border-color, var(--el-border-color)) inset;
    }
    textarea:focus,
    input:focus {
      outline: none;
    }
  }
}

.el-dialog {
  border-radius: 20px;
  .el-dialog__body {
    color: var(--el-text-color-primary);
  }
}

.el-radio-group {
  --el-border-radius-base: 10px;
}

.v-codemirror {
  .cm-editor {
    border-radius: 10px;
    overflow: hidden;
  }
}

.el-table__header {
  width: 100% !important;
}

.el-table__body {
  width: 100% !important;
}
