// @import "~@fullcalendar/core/main.css";
// @import "~@fullcalendar/daygrid/main.css";
// @import '~highlight.js/styles/dark.css';
@import "~highlight.js/styles/default.css";
/* You can add global styles to this file, and also import other style files */

// -------------------全局清除一些默认样式开始—---------------------------
html,
body {
  // font-size: 62.5%; //1rem==10px
  font-size: 10px; //1rem==10px
  min-width: 767px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji",
    "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

ul,
li {
  padding: 0;
  margin: 0;
  list-style: none;
}

//弹窗、下拉框参考字体
.cdk-overlay-container {
  font-size: 1.4rem;
}

// -------------------layout(default)部分开始——---------------------------
$body-background: #e8e8e8; //!第一层背景色
$content-background: #f5f5f5; //!工作区内容背景色
$header-color: #fff; //!header内字体颜色:
$header-background: rgba(9, 109, 217, 0.8); //!header的背景色
// -------------------content部分开始(公共样式)——---------------------------
//字体颜色
$title-color: rgba(0, 0, 0, 0.85); //!标题颜色
$primary-text-color: rgba(0, 0, 0, 0.65); //!主要文字颜色
$secondary-text-color: rgba(0, 0, 0, 0.45); //!次要文字颜色
$disable-text-color: rgba(0, 0, 0, 0.25); //!无法点击文字颜色
$border-color: rgba(0, 0, 0, 0.15); //!边框颜色
$divders-color: rgba(0, 0, 0, 0.15); //!分割线颜色
//!一级阴影(一般盒子使用一级阴影)
$box-shadow-level1: 0 0.3rem 0.6rem -0.4rem rgba(0, 0, 0, 0.45);
//!页面搜索图标大小
$searchicon-font-size: 2.2rem;

//!content的padding边距
@mixin content {
  padding: 1.2rem 2rem;
}

//!标题的字重
$title-font-weight: 600;
//!Echarts图表
$title-echarts: $title-color;
$xaxis-color: $primary-text-color;
$yaxis-color: $primary-text-color;

//!卡片
@mixin cards {
  padding: 2rem;
  background: #fff;
  box-shadow: $box-shadow-level1;
}

//!div的四个边框,弃用
@mixin div-border {
  border-left: 0.1rem solid rgba(25, 23, 23, 0.1);
  border-right: 0.1rem solid rgba(25, 23, 23, 0.3);
  border-top: 0.1rem solid rgba(25, 23, 23, 0.1);
  border-bottom: 0.1rem solid rgba(25, 23, 23, 0.3);
}

//!表格header居中
@mixin table-header {
  text-align: left;
}

//!表格header里面的图标，如导出
@mixin table-icon {
  font-size: 1.6rem;
  text-align: right;
  padding-bottom: 0.8rem;
}

//! 表格标题文字(弹窗里面的不算)
@mixin tabletitle {
  font-size: 1.4rem;
  font-weight: 600;
  color: $title-color;
  line-height: 1.5;
  height: 4rem;
}

//! echart图的标题文字(弹窗里面的不算)
@mixin graph-title {
  font-size: 1.4rem;
  font-weight: 600;
  color: $title-color;
  line-height: 1.5;
  padding: 0.4rem;
}

//!表格th单位
@mixin th-unit {
  color: rgba(0, 0, 0, 0.5);
  font-size: 1.2rem;
}

//!页面搜索文字
@mixin search-text {
  color: $primary-text-color;
  font-size: 2rem;
}

//!表格第一行(表头)颜色
$table-firsr-row: #fafafa;

//!表格隔行换色
@mixin table-cross-color {
  // &:nth-child(odd) {
  //     background: #fff;
  // }
  &:nth-child(even) {
    .ant-table-td-left-sticky,
    .ant-table-td-right-sticky {
      background: #fafafa;
    }
    background: #fafafa;
  }
}

//!嵌套表格隔行换色
@mixin nesttable-cross-color {
  // &:nth-child(4n-3) {
  //     background: #fff;
  // }
  &:nth-child(4n-1) {
    background: #fafafa;
  }
}

//!第三层（通用）背景色
@mixin third-layer-backgroupcolor {
  background: #fff;
}

//!第三层（通用）背景色及内外边距
@mixin third-layer-common {
  padding: 1rem;
  margin: 1rem;
  background: #fff;
}

//!第三层（里面装的表格）背景色及内外边距
@mixin third-layer-table {
  padding: 2rem 2rem 3rem 2rem;
  margin: 1rem;
  background: #fff;
}

//!第三层（里面装echarts）背景色及内边距,外边距根据实际情况自己设定
@mixin third-layer-echarts {
  padding: 1rem;
  background: #fff;
}

//!通用查询样式(注意类名的一致,类名参照数据审核)
@mixin commom-query-style {
  padding: 1rem;
  min-height: 4rem;

  .searchbox {
    text-align: right;

    .searchicon {
      font-size: $searchicon-font-size;
      text-align: right;
    }

    .searchicon:hover {
      cursor: pointer;
    }

    .searchtext {
      @include search-text;
    }

    .searchtext:hover {
      cursor: pointer;
    }
  }

  .outsidetime {
    text-align: right;

    .searchbox {
      display: inline-block;
    }

    .timelabel {
      margin-left: 1%;
    }

    .timepick {
      margin-left: 1%;
    }

    .timebutton {
      margin-left: 1%;
    }
  }
}

//!表格标题不换行
@mixin thtd-no-linebreak {
  //标题不换行
  white-space: nowrap;
}

//!面包屑公共样式
:host ::ng-deep nz-breadcrumb-item:last-child a {
  color: rgba(0, 0, 0, 0.65);
}

//!去掉面包屑跳转连接
:host ::ng-deep nz-breadcrumb-item a {
  pointer-events: none;
}

//!去掉table的默认外边框（nzSize为small的情况;其他大小的表格自行修改）
:host ::ng-deep .ant-table-small > .ant-table-content > .ant-table-body {
  margin: 0;
}

//!表格过滤重置、取消位置调整
::ng-deep .ant-table-filter-dropdown-link {
  &.confirm {
    float: right;
    color: #fff;
    background-color: #1890ff;
    border-color: #1890ff;
    padding: 0 4px;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 0 rgba(0, 0, 0, 0.45);
    border-radius: 2px;
  }

  &.clear {
    float: left;
  }
}

//!表格过滤下拉框的宽度  --废弃
// ::ng-deep .ant-table-filter-dropdown .ant-dropdown-menu {
//   min-width: 8rem;
//   max-width: 40rem;
//   min-height: 4rem;
//   max-height: 30rem;
//   overflow-y: auto;
//   overflow-x: hidden;
// }

//!表格过滤下拉框的宽度--废弃
// ::ng-deep .ant-table-filter-dropdown .ant-dropdown-menu-item {
//   padding-right: 0;
//   overflow: hidden;
//   text-overflow: ellipsis;
//   -o-text-overflow: ellipsis;
//   white-space: nowrap;
//   min-width: 4rem;
//   max-width: 39rem;
//   display: inline-block;
//   padding: 0.4rem 1.2rem;

//   &:hover {
//     text-overflow: clip !important;
//     white-space: normal;
//   }
// }

// -------------------改变antD组件字体——---------------------------

//!修改antD组件默认字体
::ng-deep body {
  font-size: 1.2rem;
}

//!修改antD表格组件默认字体和padding、自带icon
::ng-deep {
  .ant-empty,
  .ant-table {
    font-size: 1.4rem;
  }

  .ant-table-tbody > tr > td,
  .ant-table-thead > tr > th {
    padding: 0.8rem;
  }

  .ant-table-small
    > .ant-table-content
    > .ant-table-body
    > table
    > .ant-table-tbody
    > tr
    > td,
  .ant-table-small
    > .ant-table-content
    > .ant-table-body
    > table
    > .ant-table-thead
    > tr
    > th,
  .ant-table-small
    > .ant-table-content
    > .ant-table-fixed-left
    > .ant-table-body-outer
    > .ant-table-body-inner
    > table
    > .ant-table-tbody
    > tr
    > td,
  .ant-table-small
    > .ant-table-content
    > .ant-table-fixed-left
    > .ant-table-body-outer
    > .ant-table-body-inner
    > table
    > .ant-table-thead
    > tr
    > th,
  .ant-table-small
    > .ant-table-content
    > .ant-table-fixed-left
    > .ant-table-header
    > table
    > .ant-table-tbody
    > tr
    > td,
  .ant-table-small
    > .ant-table-content
    > .ant-table-fixed-left
    > .ant-table-header
    > table
    > .ant-table-thead
    > tr
    > th,
  .ant-table-small
    > .ant-table-content
    > .ant-table-fixed-right
    > .ant-table-body-outer
    > .ant-table-body-inner
    > table
    > .ant-table-tbody
    > tr
    > td,
  .ant-table-small
    > .ant-table-content
    > .ant-table-fixed-right
    > .ant-table-body-outer
    > .ant-table-body-inner
    > table
    > .ant-table-thead
    > tr
    > th,
  .ant-table-small
    > .ant-table-content
    > .ant-table-fixed-right
    > .ant-table-header
    > table
    > .ant-table-tbody
    > tr
    > td,
  .ant-table-small
    > .ant-table-content
    > .ant-table-fixed-right
    > .ant-table-header
    > table
    > .ant-table-thead
    > tr
    > th,
  .ant-table-small
    > .ant-table-content
    > .ant-table-header
    > table
    > .ant-table-tbody
    > tr
    > td,
  .ant-table-small
    > .ant-table-content
    > .ant-table-header
    > table
    > .ant-table-thead
    > tr
    > th,
  .ant-table-small
    > .ant-table-content
    > .ant-table-scroll
    > .ant-table-body
    > table
    > .ant-table-tbody
    > tr
    > td,
  .ant-table-small
    > .ant-table-content
    > .ant-table-scroll
    > .ant-table-body
    > table
    > .ant-table-thead
    > tr
    > th,
  .ant-table-small
    > .ant-table-content
    > .ant-table-scroll
    > .ant-table-header
    > table
    > .ant-table-tbody
    > tr
    > td,
  .ant-table-small
    > .ant-table-content
    > .ant-table-scroll
    > .ant-table-header
    > table
    > .ant-table-thead
    > tr
    > th,
  .ant-table-small > .ant-table-footer,
  .ant-table-small > .ant-table-title {
    padding: 0.8rem;
  }

  .ant-table-thead
    > tr
    > th
    .ant-table-column-sorter
    .ant-table-column-sorter-inner {
    //自带排序按钮
    height: 100%;
  }

  .ant-table-thead > tr > th .ant-table-filter-icon,
  .ant-table-thead > tr > th .anticon-filter {
    //自带过滤按钮
    width: 2.8rem;
  }

  .ant-pagination {
    //页面
    font-size: 100%;
  }

  .ant-table-placeholder {
    //表格无数据
    font-size: 100%;
  }
}

//!修改antd组件Radio单选框字体
::ng-deep {
  .ant-radio,
  .ant-radio-group,
  .ant-radio-wrapper {
    font-size: 100%;
  }
}

//!修改antd下拉nz-select组件字体
::ng-deep {
  .ant-select,
  .ant-select-dropdown {
    font-size: 100%;
  }
}

//!修改antd日期nz-picker组件字体
::ng-deep {
  .ant-calendar-picker,
  .ant-calendar-picker-container,
  .ant-calendar {
    font-size: 100%;
  }
}

//!修改antd弹窗组件字体
::ng-deep {
  .ant-modal-body,
  .ant-modal,
  .ant-modal-title {
    font-size: 100%;
  }
}

//!修改antd输入input组件字体
::ng-deep .ant-input {
  font-size: 100%;
}

//!修改antd nz-tab组件字体
::ng-deep {
  .ant-tabs,
  .ant-tabs-nav-container {
    font-size: 100%;
  }
}

//!修改antd的nz-step组件字号
::ng-deep {
  .ant-steps-item-icon,
  .ant-steps-item-title,
  .ant-steps,
  .ant-steps-item-description,
  .ant-steps-item-subtitle {
    font-size: 100%;
  }
}

//!修改表单默认字体
::ng-deep {
  .ant-form,
  .ant-form-item,
  .ant-form label {
    font-size: 100%;
  }
}

//!修改穿梭框组件字体
::ng-deep {
  .ant-transfer,
  .ant-checkbox,
  .ant-checkbox-wrapper,
  .ant-transfer-list-body,
  .ant-checkbox,
  .ant-checkbox-wrapper {
    font-size: 100%;
  }
}

//!修改button字号、height
::ng-deep {
  .ant-btn,
  .ant-btn-sm {
    font-size: 100%;
  }
}

//!修改抽屉组件字号
::ng-deep {
  .ant-drawer-body,
  .ant-dropdown {
    font-size: 100%;
  }
}

//!修改面包屑字体大小
::ng-deep {
  .ant-breadcrumb {
    font-size: 100%;
  }
}

//!树形控件字体大小
::ng-deep {
  .ant-tree,
  .ant-tree-checkbox-group,
  .ant-tree-checkbox,
  .ant-tree-checkbox-wrapper {
    font-size: 100%;
  }
}

//!确认对话框
::ng-deep {
  .ant-modal-confirm-body .ant-modal-confirm-title {
    font-size: 1.6rem;
  }
}

//提示框
::ng-deep .ant-tooltip-inner {
  background-color: rgba(0, 0, 0, 0.5);
  min-width: 3rem;
  min-height: 3.2rem;
  padding: 0.6rem 0.8rem;
  font-size: 1.4rem;
}

// 表格选择页码
::ng-deep .ant-pagination-options-size-changer.ant-select {
  margin-right: 0;
}

// -------------------表格模板
@mixin table {
  @include third-layer-table;
  margin-top: 2.4rem;
  // min-height: 58rem;
  box-shadow: $box-shadow-level1;

  .table-thead {
    background: $table-firsr-row;
  }

  .table-header {
    @include table-header;
  }

  .table-title {
    @include tabletitle;
  }

  .table-icon {
    @include table-icon;

    i {
      margin: 0.3rem;
      cursor: pointer;
    }

    input {
      width: 20rem;
      font-size: 1.2rem;
    }

    span {
      color: #8e8e8e;
    }
  }

  tbody tr {
    @include table-cross-color;
  }

  .unit {
    @include th-unit;
  }

  .tbody-icon {
    font-size: 1.2rem;
  }

  #th-1 {
    //调整表头的选择框对齐方式
    text-align: center;
  }

  #td-1 {
    padding: 0.8rem;
  }
}

::ng-deep .ant-table-thead > tr > th .ant-table-column-sorter {
  position: absolute;
  top: 35%;
  right: 1rem;
}

// 表头
::ng-deep
  .ant-table-small
  > .ant-table-content
  > .ant-table-body
  > table
  > .ant-table-thead
  > tr
  > th,
::ng-deep
  .ant-table-small
  > .ant-table-content
  > .ant-table-scroll
  > .ant-table-body
  > table
  > .ant-table-thead
  > tr
  > th,
::ng-deep
  .ant-table-small
  > .ant-table-content
  > .ant-table-scroll
  > .ant-table-header
  > table
  > .ant-table-thead
  > tr
  > th {
  padding: 1rem;
  text-align: left;
  font-size: 1.4rem;
  font-weight: 600;
}

//表格数据对齐方式
::ng-deep .ant-table-tbody > tr {
  text-align: left;
}

// 表格里的多选框对齐方式
::ng-deep .ant-table-tbody > tr > td.ant-table-selection-column,
.ant-table-thead > tr > th.ant-table-selection-column {
  text-align: center;
}

// 表格里的多选框
::ng-deep .ant-checkbox-inner {
  width: 1.2rem;
  height: 1.2rem;
}

//单选框
::ng-deep .ant-radio-group-small .ant-radio-button-wrapper {
  height: 2.4rem;
  padding: 0 0.7rem;
  line-height: 2.2rem;
}

//!侧边menu导航栏
::ng-deep {
  .ant-menu,
  .ant-menu-inline .ant-menu-item,
  .ant-menu-inline .ant-menu-submenu-title,
  .ant-menu-vertical .ant-menu-item,
  .ant-menu-vertical .ant-menu-submenu-title,
  .ant-menu-vertical-left .ant-menu-item,
  .ant-menu-vertical-left .ant-menu-submenu-title,
  .ant-menu-vertical-right .ant-menu-item,
  .ant-menu-vertical-right .ant-menu-submenu-title,
  .ant-menu-item .anticon,
  .ant-menu-submenu-title .anticon {
    font-size: 100%;
  }
}

//!nz-descriptions組件
::ng-deep {
  .ant-descriptions-item-label {
    font-size: 100%;
  }
}

//!timeline时间轴字体大小
::ng-deep {
  .ant-timeline,
  .ant-timeline-item {
    font-size: 100%;
  }
}

//!复选框字体大小
::ng-deep {
  .ant-checkbox-group,
  .ant-collapse {
    font-size: 100%;
  }
}

// 改变滑动条样式
::ng-deep .ant-table-body::-webkit-scrollbar {
  height: 8px;
  width: 8px;
  background-color: #eeecec;
}
::ng-deep .ant-table-body::-webkit-scrollbar-thumb {
  background-color: #c0c0c0;
  border-radius: 5px;
}

// -------------------字体变化——---------------------------
@media screen and (min-width: 2000px) {
  html,
  body {
    font-size: 12px;
  }
}

@media screen and (min-width: 992px) and (max-width: 1500px) {
  html,
  body {
    font-size: 8px;
  }

  //表格th单位
  .unit {
    display: inline-block;
    transform: scale(0.83);
  }
}

@media screen and (min-width: 768px) and (max-width: 992px) {
  html,
  body {
    font-size: 6px;
  }

  //表格th单位
  .unit {
    display: inline-block;
    transform: scale(0.83);
  }
}

@media screen and (max-width: 768px) {
  html,
  body {
    font-size: 5px;
  }

  //表格th单位
  .unit {
    display: inline-block;
    transform: scale(0.83);
  }
}