.editable {
	display: inline-block;
	min-width:200px;
	word-wrap: break-word;
	position: relative;
}


/*
 table structuur:
 div tabel id / name
	mhtable-header
		theaderrow
			hdr cells
	mhtable-Body
		tblBodyRow
			tblcells
		tblBodyRow
		tblBodyRow
		tblBodyRow
*/
#mhtable {
	overflow-x:auto;
	width:max-content;
	margin:20px;
}
.mhtable-header {
//	overflow:hidden;
	margin-right:30px;
}

.tblHdrRow {
	display:table;
}
.mhtable-body {
	height:max-content;
 }
.tblBodyRow  {
	display:table;
}

.hdrCell, .dragCell, .tblCell {
  display:table-cell;
}
.hdrCell, .dragCell, .tblCell {
  border: 1px solid #ccc;
  padding: 10px;
}
.tblCell input,select{
	outline: none !important;
	border: none;	
	background-color: transparant;
}
.tblCell input:focus, select:focus{
	background-color: #FFF8Dc;
}

.dragCell {
	width: 50px;
}
	
/* Hide Spin arrows on input type number */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}
input[type="number"] {
    -moz-appearance: textfield;
}
.ui-overlay-a, .ui-page-theme-a, .ui-panel-wrapper {
	background-color:none;

}
/* chat 1 */
.mhtable-header .tblHdrRow {
    display: flex;
    position: sticky;
    top: 0;
    background-color: #fff;
    z-index: 2;
}

.mhtable-body .tblBodyRow {
    display: flex;
}

.mhtable-header div,
.mhtable-body div {
    min-width: 100px;
 //   padding: 5px;
    text-align: left;
    box-sizing: border-box;
}

.mhtable-body {
//    max-height: 500px;
    height: 500px;
    overflow-y: auto;
    overflow-x: auto;
}
// chat 2
.mhtable-container {
    display: flex;
    flex-direction: column;
    height: 100%; /* Zorgt ervoor dat de container de volledige hoogte inneemt */
}

.mhtable-header {
    flex: 0 0 auto; /* Header heeft een vaste hoogte */
}

.mhtable-body {
    flex: 1 1 auto; /* Body neemt de resterende ruimte */
    overflow-y: auto; /* Schakel verticale scroll in */
    overflow-x: auto; /* Schakel horizontale scroll in */
}
// chat 3
/*
.mhtable-container {
    display: flex;
    flex-direction: column;
    height: 100%; /* Zorg ervoor dat de container de volledige hoogte inneemt */
    border: 1px solid #ccc;
    overflow: hidden;
    postion: relative;
}

.mhtable-header {
    flex: 0 0 auto; /* Header heeft een vaste hoogte */
    display: flex;
    position: sticky;
    top: 0;
    background-color: #fff;
    z-index: 2;
}

.mhtable-header .tblHdrRow {
    display: flex;
}

.mhtable-body {
    flex: 1 1 auto; /* Body neemt de resterende ruimte in */
    overflow-y: auto; /* Schakel verticale scroll in */
    overflow-x: auto; /* Schakel horizontale scroll in */
}

.mhtable-header div,
.mhtable-body div {
    min-width: 100px;
    padding: 5px;
    text-align: left;
    box-sizing: border-box;
}

.mhtable-body .tblBodyRow {
    display: flex;
}
*/