/* White and green administration theme */
:root {
  --el-color-primary-rgb: 0, 170, 108 !important;
  --el-color-primary: #00aa6c !important;
  --el-color-primary-light-3: #4fc99d !important;
  --el-color-primary-light-5: #80d8b8 !important;
  --el-color-primary-light-7: #b4ead6 !important;
  --el-color-primary-light-8: #d2f2e6 !important;
  --el-color-primary-light-9: #eaf9f3 !important;
  --el-color-primary-dark-2: #008a58 !important;
  --el-color-success: #00aa6c !important;
  --el-bg-color-page: #f3fbf7 !important;
  --el-text-color-primary: #17352b !important;
  --el-text-color-regular: #526960 !important;
  --el-border-color: #d3eade !important;
  --el-border-color-light: #dcefe7 !important;
  --el-border-color-lighter: #e7f5ef !important;
  --el-fill-color: #e9f7f1 !important;
  --el-fill-color-light: #f1faf6 !important;
  --el-fill-color-lighter: #f7fcfa !important;
}

html,
body,
#app {
  background: #f3fbf7 !important;
  color: #17352b !important;
}

.aside {
  background: linear-gradient(180deg, #07563f, #043f2e) !important;
}

.brand {
  border-bottom-color: rgba(255, 255, 255, 0.13) !important;
}

.brand-icon,
.logo-icon {
  background: linear-gradient(135deg, #34e0a1, #00aa6c) !important;
  box-shadow: 0 6px 18px rgba(0, 170, 108, 0.28) !important;
}

.aside .el-menu,
.aside .el-sub-menu,
.aside .el-menu-item,
.aside .el-sub-menu__title {
  background-color: transparent !important;
}

.aside .el-menu-item:hover,
.aside .el-sub-menu__title:hover {
  background: rgba(52, 224, 161, 0.13) !important;
}

.aside .el-menu-item.is-active {
  color: #ffffff !important;
  background: linear-gradient(90deg, rgba(52, 224, 161, 0.34), rgba(52, 224, 161, 0.08)) !important;
  border-right: 3px solid #34e0a1 !important;
}

.header {
  background: #ffffff !important;
  border-bottom: 1px solid #dcefe7 !important;
  box-shadow: 0 3px 14px rgba(0, 122, 77, 0.07) !important;
}

.main {
  background: #f3fbf7 !important;
}

.el-card,
.el-dialog,
.el-drawer,
.el-table,
.el-table tr,
.el-table th.el-table__cell,
.el-table td.el-table__cell {
  border-color: #dcefe7 !important;
}

.el-card,
.el-dialog,
.el-drawer {
  box-shadow: 0 8px 26px rgba(0, 122, 77, 0.08) !important;
}

.el-table th.el-table__cell {
  color: #245344 !important;
  background: #eaf9f3 !important;
}

.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell,
.el-table__body tr:hover > td.el-table__cell {
  background: #f2fbf7 !important;
}

.el-button--primary {
  color: #ffffff !important;
  border-color: #00aa6c !important;
  background: #00aa6c !important;
  box-shadow: 0 4px 12px rgba(0, 170, 108, 0.16) !important;
}

.el-button--primary:hover,
.el-button--primary:focus {
  border-color: #19bd81 !important;
  background: #19bd81 !important;
}

.el-switch.is-checked .el-switch__core,
.el-checkbox__input.is-checked .el-checkbox__inner,
.el-radio__input.is-checked .el-radio__inner {
  border-color: #00aa6c !important;
  background: #00aa6c !important;
}

.el-input__wrapper.is-focus,
.el-select__wrapper.is-focused {
  box-shadow: 0 0 0 1px #00aa6c inset !important;
}

.el-pagination.is-background .el-pager li.is-active {
  background: #00aa6c !important;
}

.login-page {
  background: radial-gradient(circle at 20% 15%, rgba(52, 224, 161, 0.5), transparent 32%), linear-gradient(135deg, #007a4d, #00aa6c, #dff8ed) !important;
}

.login-card {
  border: 1px solid rgba(255, 255, 255, 0.7) !important;
  box-shadow: 0 18px 50px rgba(0, 90, 57, 0.25) !important;
}

.logo-title {
  color: #17352b !important;
}