/* Tables Styles */

/* Necesario para poder agregar scrollbars (y box-shadow) */
div.table-container {
	margin: 10px auto;
	overflow-x: auto;
	overflow-y: hidden;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

table {
	background: #fff;
	border-collapse: collapse;
	border-spacing: 0;
	margin: auto;
	width: 100%;
	border: 1px solid #e0e0e0;
	color: #576a75;
}

caption {
	text-align: center;
	font-weight: bold;
	background: #576a75;
	color: #fff;
	border: 1px solid #e0e0e0;
	line-height:40px;
  	height:40px;
}

th {
	height: 40px;
	background: #eaeff0;
	color: #6d8492;
	border-bottom: 2px solid #39aacb;
	padding: 4px;
	text-align: left;
	vertical-align: middle;
	font-weight: bold;
}

th:first-child {
	width: 20px;
}

th.vertical {
	border-bottom: 0;
	border-right: 2px solid #3aa9ca;
	text-align: center;
}

tr {
	height: 40px;
	border-bottom: 1px solid #ebebeb;
}

tr.row-modified td {
	background: #98d098;
	color: #fff;
    transition: 0.3s ease;
}

tr.row-modified td a {
	color: #fff;
	transition: 0.3s ease;
}

tr:hover td {
	background: #e8f5f8;
	color: #576a75;
	/* cursor: pointer; */
	transition: 0.3s ease;
}

tr.selected td {
	background: #c9e8ef;
	color: #2c343a;
}

tr:first-child {
	border-top: none;
}

tr:last-child {
	border-bottom: none;
}

td {
	background: #fff;
	padding: 4px;
	text-align: left;
	vertical-align: middle;
	/* Transión necesaria para agregar suavidad a los distintos estados (hover, modified-ok, etc) */
	transition: 0.3s ease;
}

td img {
	vertical-align: middle;
	margin: 0 2px;
}

td a img {
	box-shadow: none;
	vertical-align: middle;
	margin: 0 2px;
}

td:last-child {
	border-right: 0;
}

th.text-left {
	text-align: left;
}

th.text-center {
	text-align: center;
}

th.text-right {
	text-align: right;
}

td.text-left {
	text-align: left;
}

td.text-center {
	text-align: center;
}

td.text-right {
	text-align: right;
}

td.table-checkbox {
	width: 60px;
}

.fixed-height {
	max-height: 300px;
	overflow-y: auto;
}