// //蓝色主题
.blueStyle {
  .header {
    background: #20a0ff;
  }

  .el-menu {
    background: #20a0ff;

    i {
      color: @color-white !important;
    }

    .el-menu-item {
      color: @color-white;
    }

    .el-submenu .el-submenu__title {
      color: @color-white;
    }

    .el-menu-item:not(.is-disabled):focus,
    .el-menu-item:not(.is-disabled):hover {
      color: #20a0ff;
      background-color: #f2f2f2;
      border-bottom: 2px solid #f2f2f2;

      i {
        color: #20a0ff !important;
      }
    }

    .el-submenu:focus .el-submenu__title,
    .el-submenu:hover .el-submenu__title {
      color: #20a0ff !important;
      background-color: #f2f2f2;
      border-bottom: 2px solid #f2f2f2;

      i {
        color: #20a0ff !important;
      }
    }
  }
  .el-menu--horizontal > .el-menu-item.is-active {
    border-bottom: 2px solid #fff !important;
    color: #20a0ff !important;
    background-color: #fff !important;
    i {
      color: #20a0ff !important;
    }
  }
  .el-submenu.is-active {
    .el-submenu__title {
      border-bottom: 2px solid #fff !important;
      color: #20a0ff !important;
      background-color: #fff;
      i {
        color: #20a0ff !important;
      }
    }
  }
  .gallery-thumbs .swiper-slide-active {
    border: 3px solid #20a0ff !important;
  }
  .tags-li.active {
    border: 1px solid #20a0ff;
    background-color: #20a0ff;
  }
}

// //红色主题
// .redStyle {
//   .header {
//     background: #ee320c;
//   }

//   .el-menu {
//     background: #ee320c;

//     i {
//       color: @color-white !important;
//     }

//     .el-menu-item {
//       color: @color-white;
//     }

//     .el-menu-item.is-active {
//       color: @color-white;
//     }

//     .el-submenu .el-submenu__title {
//       color: @color-white;
//     }

//     .el-menu-item:not(.is-disabled):focus,
//     .el-menu-item:not(.is-disabled):hover {
//       color: #ee320c;
//       background-color: @color-white;
//       border-bottom: 2px solid @color-white;

//       i {
//         color: #ee320c !important;
//       }
//     }

//     .el-submenu:focus .el-submenu__title,
//     .el-submenu:hover .el-submenu__title {
//       color: #ee320c !important;
//       background-color: @color-white;
//       border-bottom: 2px solid @color-white;

//       i {
//         color: #ee320c !important;
//       }
//     }

//     .el-submenu.is-active .el-submenu__title {
//       color: @color-white;
//     }
//   }

//   .sidebar .el-menu--horizontal .el-menu-item.is-active i {
//     color: #ee320c;
//   }

//   .sidebar
//     .el-menu--horizontal
//     .el-submenu.is-active
//     .el-submenu__title
//     > i:first-child {
//     color: #ee320c;
//   }

//   .tags-li.active {
//     border: 1px solid #ee320c;
//     background-color: #ee320c;
//   }
// }

//绿色主题
.greenStyle {
  .header {
    background: #169e8c;
  }
  .el-menu {
    background: #169e8c;

    i {
      color: @color-white !important;
    }
    .el-menu-item {
      color: @color-white;
    }
    .el-submenu .el-submenu__title {
      color: @color-white;
    }
    .el-menu-item:not(.is-disabled):focus,
    .el-menu-item:not(.is-disabled):hover {
      color: #fff;
      background-color: #128071;
      border-bottom: 2px solid #128071;
      i {
        color: #fff !important;
      }
    }
    .el-submenu:focus .el-submenu__title,
    .el-submenu:hover .el-submenu__title {
      color: #fff !important;
      background-color: #128071;
      border-bottom: 2px solid #128071;
      i {
        color: #fff !important;
      }
    }
  }
  .el-menu--horizontal > .el-menu-item.is-active {
    border-bottom: 2px solid #128071 !important;
    color: #fff !important;
    background-color: #128071 !important;
    i {
      color: #fff !important;
    }
  }
  .el-submenu.is-active {
    .el-submenu__title {
      border-bottom: 2px solid #128071 !important;
      color: #fff !important;
      background-color: #128071;
      i {
        color: #fff !important;
      }
    }
  }
  .gallery-thumbs .swiper-slide-active {
    border: 3px solid #169e8c !important;
  }
  .tags-li.active {
    border: 1px solid #169e8c;
    background-color: #169e8c;
  }
  //渐变
  .thumb-example .picBottom .smallPicBox .borderActive .timeInfo {
    background: linear-gradient(180deg, #4cdbc8 10%, #128071 100%);
  }
  .picRotation .imageCenter .imgList .infoTop {
    background: linear-gradient(180deg, #4cdbc8 10%, #128071 100%);
  }
  .picRotation .imageCenter .imgList .infoBottom {
    background: linear-gradient(180deg, #4cdbc8 10%, #128071 100%);
  }
}

// //橙色主题
// .orangeStyle {
//   .header {
//     background: @orange-color;
//   }
//   .sidebar {
//     .el-menu {
//       background: @orange-color;

//       i {
//         color: @color-white !important;
//       }

//       .el-menu-item {
//         color: @color-white;
//       }

//       .el-menu-item.is-active {
//         color: @color-white;
//       }

//       .el-submenu .el-submenu__title {
//         color: @color-white;
//       }

//       .el-menu-item:not(.is-disabled):focus,
//       .el-menu-item:not(.is-disabled):hover {
//         color: @color-white;
//         background-color: #f39b33;
//         border-bottom: 2px solid #f39b33;
//         i {
//           color: @color-white !important;
//         }
//       }
//       .el-submenu:focus .el-submenu__title,
//       .el-submenu:hover .el-submenu__title {
//         color: @color-white !important;
//         background-color: #f39b33;
//         border-bottom: 2px solid #f39b33;

//         i {
//           color: @color-white !important;
//         }
//       }

//       .el-submenu.is-active .el-submenu__title {
//         color: @color-white;
//       }
//     }
//     .el-menu--horizontal > .el-submenu.is-active .el-submenu__title {
//       background-color: #f39b33;
//       border-bottom: 2px solid #f39b33;
//     }
//     .el-menu--horizontal > .el-menu-item.is-active {
//       background-color: #f39b33;
//       border-bottom: 2px solid #f39b33;
//     }
//     .el-menu--horizontal
//       .el-submenu.is-active
//       .el-submenu__title
//       > i:first-child {
//       color: @orange-color;
//     }
//     .el-tree--highlight-current
//       .el-tree-node.is-current
//       > .el-tree-node__content {
//       // 设置颜色
//       color: #fff;
//       background: #f39b33 !important;
//     }
//     .el-menu--horizontal .el-menu-item.is-active i {
//       color: @orange-color;
//     }
//   }
//   .monitor-container
//     .sideBar
//     .el-tree--highlight-current
//     .el-tree-node.is-current
//     > .el-tree-node__content {
//     color: #fff;
//     background: #f39b33 !important;
//   }

//   .gallery-thumbs .swiper-slide-active {
//     border: 3px solid @orange-color !important;
//   }
//   .tags-li.active {
//     border: 1px solid @orange-color;
//     background-color: @orange-color;
//   }
// }
