ci4sManagement-cloud/react-ui/src/global.less

html,
body,
#root {
  height: 100%;
  margin: 0;
  padding: 0;
  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';
}

.colorWeak {
  filter: invert(80%);
}

.ant-layout {
  min-height: 100vh;
}
.ant-pro-sider.ant-layout-sider.ant-pro-sider-fixed {
  left: unset;
}
.ant-layout-sider-children {
  margin-top: 60px !important;
}
canvas {
  display: block;
}

body {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
a{
  color:#1664ff;
}
.ant-btn-link{
  color: #1664ff;
}
.ant-pro-layout .ant-pro-layout-content {
  padding: 10px;
}
.ant-pro-layout .ant-pro-layout-bg-list {
  background: #f9fafb;
}
.ant-table-wrapper .ant-table-thead > tr > th {
  background-color: #fff;
}
.ant-table-wrapper .ant-table-thead > tr > td {
  background-color: #fff;
}
.ant-menu-light .ant-menu-item-selected {
  background: rgba(197, 232, 255, 0.8) !important;
}
.ant-pro-layout .ant-pro-sider .ant-layout-sider-children{
  background:#f2f5f7;

}
.ant-pro-base-menu-inline {
  // height: 87vh;
  background: #f2f5f7;
  border-radius: 0px 20px 20px 0px;
}
.ant-pro-layout .ant-pro-layout-content {
  background-color: transparent;
}
.ant-table-wrapper .ant-table-pagination.ant-pagination{
  background-color: #fff;
  margin: 0;
  padding: 21px 16px;
}
.ant-table-wrapper .ant-table{
  height: 75vh;
}
.ant-pro-global-header-logo img {
  height: 21px;
}
.ant-pro-layout .ant-layout-sider.ant-pro-sider {
  height: 87vh;
}
.ant-pro-layout .ant-pro-layout-container {
  height: 98vh;
}
.ant-modal-confirm .ant-modal-confirm-paragraph{
  margin: 54px 0 auto;
  text-align: center;
}
.ant-modal-confirm-confirm .ant-modal-confirm-body>.anticon{
  display: none;
}
.ant-modal-confirm .ant-modal-confirm-btns {
  margin-top: 30px;
  text-align: center;
}
.ant-modal-confirm-btns .ant-btn-default{
  width:110px;
height:40px;
background:rgba(22, 100, 255, 0.06);
border-radius:10px;
color:#1d1d20;
font-size:18px;
margin-right: 10px;
border-color: transparent;
}
.ant-modal-confirm-btns .ant-btn-default:hover{
  background:rgba(22, 100, 255, 0.06);
  border-color: transparent;
}
.ant-modal-confirm-btns .ant-btn-primary{
  width:110px;
  height:40px;
  background:#1664ff;
  border-radius:10px;
  font-size: 18px;
}
.ant-modal .ant-input-affix-wrapper{
  height: 46px;
  padding: 1px 11px;
}
.ant-modal  .ant-select-single{
  height: 46px;
  
}
.ant-modal .ant-select-single .ant-select-selector .ant-select-selection-placeholder{
  line-height: 46px;
}
.ant-modal .ant-modal-close-x{
  border: 2px solid #272536;
  border-radius: 50%;
  width: 26px;
  height: 26px;
  color: #272536;
}
.ant-modal-content{
  margin-left: -130px;
  margin-top: 50px;
  
}
.ant-modal .ant-modal-content{
  padding: 0;
}
.ant-modal-confirm-body-wrapper{
height:303px;
border-radius:21px;
background-image: url(/assets/images/modal-back.png);
background-repeat:no-repeat;
background-size:100%;
background-position: top center;
border-radius: 0;
}
.ant-modal .ant-modal-content {
  border-radius: 20px;
}
.ant-modal .ant-modal-close:hover {
  background-color: transparent;
}
.ant-modal .ant-modal-footer >.ant-btn+.ant-btn{
  margin-left: 20px;
}
.ant-pagination .ant-pagination-item-active a {
  color: #fff;
  background: #1664ff;
  border-color: #1664ff;
  border-radius:6px;
}
.ant-pagination .ant-pagination-item-active:hover {
  color: #fff;
  background: rgba(22, 100, 255, 0.8);
  border-color: rgba(22, 100, 255, 0.8);
  border-radius:6px;
}
.ant-pagination .ant-pagination-item {
  border: 1px solid #e6e6e6;
  border-radius:6px;
}
// ::-webkit-scrollbar-button {
//   background: #97a1bd;
// }
::-webkit-scrollbar {
  width: 9px;
  border-radius: 2px;
}
::-webkit-scrollbar-thumb {
  // background-color: #9aa3bc!important;
  width: 7px;
  background: rgba(77, 87, 123, 0.5) !important;
}
::-webkit-scrollbar-track {
  // background-color: #eaf1ff!important;
  width: 9px;
  background: rgba(22, 100, 255, 0.06) !important;
}
ul,
ol {
  list-style: none;
}

@media (max-width: 768px) {
  .ant-table {
    width: 100%;
    overflow-x: auto;
    &-thead > tr,
    &-tbody > tr {
      > th,
      > td {
        white-space: pre;
        > span {
          display: block;
        }
      }
    }
  }
}