// @use 'variables' as v;
// @use 'mixins' as m;
// @use 'modules/button';
// @use 'modules/form';
// @use 'pages/dashboard';
// @use 'pages/login';

// 重置样式
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

// 全局样式
body {
  // font-family: map-get(v.$font-family, 'base');
  // font-size: map-get(v.$font-size, 'base');
  // line-height: map-get(v.$line-height, 'normal');
  // color: map-get(v.$colors, 'black');
}

// 通用类
.text-ellipsis {
  @include m.text-ellipsis;
}

.flex-center {
  @include m.flex-center;
}

.el-upload-list__item.el-icon--close-tip {
  display: none !important;
}
.el-upload-list__item.is-success:focus:not(:hover) .el-icon--close-tip {
  display: none !important;
}

// 响应式容器
.container {
  width: 100%;
  margin: 0 auto;
  // padding: 0 map-get(v.$spacing, 'md');

  // @include m.respond-to('sm') {
  //   max-width: map-get(v.$breakpoints, 'sm');
  // }

  // @include m.respond-to('md') {
  //   max-width: map-get(v.$breakpoints, 'md');
  // }

  // @include m.respond-to('lg') {
  //   max-width: map-get(v.$breakpoints, 'lg');
  // }

  // @include m.respond-to('xl') {
  //   max-width: map-get(v.$breakpoints, 'xl');
  // }
}

::-webkit-scrollbar {
  width: 10px; 
}

::-webkit-scrollbar-track {
  background: #f1f1f1; 
}

::-webkit-scrollbar-thumb {
  background: #abaeb4; 
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: #555; 
}

::-webkit-scrollbar-corner {
  background: #f1f1f1;
}


.overall-container {
  height: 80vh !important;
  width: 100%;
  padding: 20px;
  background-color: #fff;
  font-size: 12px;
  overflow: auto !important;

  .search-container {
    
    .search-container-from {
      display: flex;
      flex-wrap: wrap;
      
    }
  }

  .table-container {
    width: 100%;
  }

  .layout-pagination {
    margin-top: 20px;
    display: flex;
    flex-wrap: wrap;
  }

  .layout-w150 {
    width: 150px;
  }
  .layout-w180 {
    width: 180px;
  }

  .layout-w200 {
    width: 200px;
  }
  .layout-w250{
    width: 250px;
  }

  .layout-pr10 {
    padding-right: 10px;
  }

  .layout-mr10 {
    margin-right: 10px;
  }
  
  .layout_flex {
    display: flex;
    justify-content: center;
  }
}


.layout_form {
  padding: 0 20px;
  overflow: auto;
  .el-input {
    width: 100% !important;
}
}

.layout_footer {
  text-align: center;
}

.layout_form {
  padding: 0 20px;
}

.layout_header_menu .el-menu--collapse .el-menu .el-submenu, .el-menu--popup {
  min-width: 100px !important;
}

.el-popover.el-popper.layout_attendance_popover {
  text-align: center !important;
  min-width: 85px !important;
}