@import url("./font.css");

html {
  font-size: 62.5%;
}

body {
  font-size: 1.2em;
}

* {
  -webkit-box-sizing: border-box !important;
  -moz-box-sizing: border-box !important;
  box-sizing: border-box !important;
}

@viewport {
  zoom: 1; /* เหมือน initial-scale ใน viewport meta tag */
}

.ui.menu {
  width: auto !important;
  border: none;
  box-shadow: none !important;
  height: 100%;
}
.ui.menu > .item,
.ui.menu > .item:hover {
  border: none;
  /* color: #0f00dd !important; */
  font-size: 1.4rem;
}
.ui.menuActive {
  background: rgba(0, 0, 0, 0.22);
}
.ui.menu .item:before,
.ui.menu:after {
  display: none;
}

.canvasjs-chart-credit {
  display: none !important;
}
.gzmtPb {
  width: 45px;
}
.padBottom0 {
  padding-bottom: 0px !important;
}
.padLeft20 {
  padding-left: 20px !important;
}
.marginTop20 {
  margin-top: 20px !important;
}
.actions > .cursorPointer {
  cursor: pointer !important;
}
.padding20 {
  padding: 20px !important;
}
.imgIcon {
  width: 35px;
}
.inlineFlex {
  display: inline-flex !important;
}
/* .dialogHeader {
  line-height: 45px;
  font-size: 25px;
} */
.dialogBottom {
  position: fixed !important;
  height: 70px;
  /* background-color: #fff; */
  bottom: 0;
  text-align: center;
}

/* Styles go here */

.ui.table > thead > tr > th {
  cursor: pointer;
}
.ui.table > thead > tr > th :hover{
background-color: #e6e6e6;
}  
th.sortable.sorted-asc:before {
  content: '\f0dd';
}

th.sortable.sorted-desc:before {
  content: '\f0de';
}

th.sortable:before {
  font-family: "Icons";
  margin-right: .3em;
  content: '\f0dc';
}

th:not(.sorted-asc):not(.sorted-desc):before {
  opacity: .2;
}


#main {height: calc(100vh - 100px);}
table {
  display: flex;
  flex-flow: column;
  height: 100%;
  width: 100%;
}
table thead {
  /* head takes the height it requires, 
  and it's not scaled when table is resized */
  flex: 0 0 auto;
  width: calc(100% - 0.9em);
}
table tbody.filters {
  flex: 0 0 auto;
  overflow-y: auto;
}
table tbody {
  /* body takes all the remaining available space */
  flex: 1 1 auto;
  display: block;
  overflow-y: auto;
}
table tbody tr {
  width: 100%;
}
table thead, table tbody tr {
  display: table;
  table-layout: fixed;
}

tbody.filters .ui.input > input {
  padding: .3em;
}