/** Personalización general de estilo **/
body {
    font-family: 'Source Sans Pro', 'Segoe UI', 'Droid Sans', Tahoma, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.428571429;
    color: #4d4d4d;
    background: #e6e7e8;
}
#page-wrapper {
    background-color: #f7f8fa;
}


.navbar-default.sidebar a {
	color: #555;
	background-color: transparent;
}

.navbar-static-top .dropdown-notificaciones,
.navbar-static-top .dropdown-llamadas,
.navbar-static-top .dropdown-tareas {
		min-width: 300px;
}
	.navbar-static-top .dropdown-notificaciones a,
	.navbar-static-top .dropdown-llamadas a,
	.navbar-static-top .dropdown-tareas a {
		display: block;
		max-width: 30vw; /* Ajusta al ancho del contenedor */
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		color: #333; /* para los a que están dentro de componentes angular */
	}

	.dropdown-menu a:focus, .dropdown-notificaciones a:hover,
	.dropdown-menu a:focus, .dropdown-llamadas a:hover,
	.dropdown-menu a:focus, .dropdown-tareas a:hover {
		color: #262626;
		text-decoration: none;
		background-color: #f5f5f5;
	}



.icon-with-badge {
	position: relative;
}
.icon-with-badge .badge {
	position: absolute;
	top: 8px;
	right: 0px;
	background-color: red;
	color: white;
}




.page-header {
	border: 0;
}
	.page-header-actions {
	    padding-bottom: 0px;
	    margin: 0px 0 20px 0;
	}

/*+ BOtones */
.badge-primary,
.btn-primary {
	background-color: #2d146e;
	color: #ffffff;
}
.badge-secondary,
.btn-secondary {
	background-color: #00becd;
	color: #ffffff;
}
.badge-grayed,
.btn-grayed {
	background-color: #6c757d;
	color: #ffffff;
}
.badge-light,
.btn-light {
	background-color: #eee;
	color: #333;
}

.badge-success {
  background-color: #5cb85c;
}
.badge-info {
  background-color: #5bc0de;
}
.badge-warning {
  background-color: #f0ad4e;
}
.badge-danger {
	  background-color: #d9534f;
}
.badge-transparent{
	background-color: transparent;
	color: inherit;
}

.badge-sm {
    min-width: 8px;
    padding: 2px 5px;
    font-size: 9px;
    font-weight: 700;
}


.text-strike {
	text-decoration: line-through;
}

/* Navbar */
.navbar-default {
}
.navbar-inverse {
	background: #2d146e;
}
	.navbar a {
		color: white;
	}

/* Panel */

.panel-grayed {
	background-color: #ddd;
}
.panel-grayed>.panel-heading {
  color: #666;
  background-color: #eee;
  border-color: #ddd;
}

.panel-light {
  border-color: #ccc;
}
.panel-light > .panel-heading {
  color: #333;
  background-color: #efefef;
  border-color: #ccc;
}



.panel-default>.panel-heading {
	background: #00becd;
	border: 1px solid #00becd;
	color: white;
}
	.panel-default>.panel-heading a {
		color: white;
	}


.panel-heading.with-tabs,
.panel-heading.with-options {
	padding: 0;
	height: 42px;
}
	.panel-heading .options {
	    float: right !important;
	    float: right;
	}
		.panel-heading .options > a {
		    opacity: 0.5;
		    filter: alpha(opacity=50);
		    color: #000;
		    font-size: 14px;
		    float: right;
		    padding-left: 10px;
		}

.panel-heading.with-options {

}
	.panel-heading.with-options .dropdown.open a,
	.panel-heading.with-options .dropdown a:hover {
		color: #333;
	}
	.panel-heading.with-options .dropdown-menu {
		right: 0;
		left: initial;
		width: 350px;
		padding: 5px 10px;
	}
		.panel-heading.with-options .dropdown-menu li,
		.panel-heading.with-options .dropdown-menu a {
			color: #333!important;
		}

/* tabs en paneles */
[class*="panel-"].panel .panel-heading  > ul.nav.nav-tabs {
    bottom: -1px;
    right: 9px;
    border: none;
}
.panel-heading.tabs .nav-tabs>li.active>a {
	border-top-color: transparent;
}

.panel-body {
}
	.panel-body.no-padding {
		padding: 0;
	}
	.panel-body + .collapsed {
		display: none;
	}



/** Clases generales para imagenes **/
img {
	border: 0;
	max-width: 100% !important;
	vertical-align: middle;
}
.img-responsive,
.thumbnail > img,
.thumbnail a > img {
	display: block;
	max-width: 100%;
	height: auto;
}
.img-rounded {
	border-radius: 1px;
}
.img-thumbnail {
	padding: 10px;
	line-height: 1.428571429;
	background-color: #f7f8fa;
	border: 1px solid #e6e7e8;
	border-radius: 1px;
	-webkit-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	display: inline-block;
	max-width: 100%;
	height: auto;
}
.img-circle {
	border-radius: 50%;
}



/* TABLAS */
.vertical-table {
	width: 100%;
}

	.vertical-table > thead > tr > th,
	.vertical-table > tbody > tr > th,
	.vertical-table > tfoot > tr > th,
	.vertical-table > thead > tr > td,
	.vertical-table > tbody > tr > td,
	.vertical-table > tfoot > tr > td {
	 	padding: 8px;
	    line-height: 1.428571429;
	    vertical-align: top;
	    border-top: 1px solid #e6e7e8;
	    border-top-width: 1px;
	    border-top-style: solid;
	    border-top-color: rgb(230, 231, 232);
	}
	.vertical-table > thead > tr:first-child > th,
	.vertical-table > tbody > tr:first-child > th,
	.vertical-table > tfoot > tr:first-child > th,
	.vertical-table > thead > tr:first-child > td,
	.vertical-table > tbody > tr:first-child > td,
	.vertical-table > tfoot > tr:first-child > td {
		border-top: 0px;
	}

.vertical-table .form-group {
	margin: 0;
}

td.actions {
}
	td.actions .btn {
		margin: 3px;
	}

tr.selected td.selected {
	background: #00becd;
	color: white;
}
.table-bordered>tbody>tr.separator,
.table-bordered>tbody>tr.separator {
	background: white;
}
	.table-bordered>tbody>tr.separator>td,
	.table-bordered>tbody>tr.separator>td {
		border-top: 2px solid #00becd;
	}
.table-bordered>tbody>tr.spacer,
.table-bordered>tbody>tr.spacer {
	background: white;
}
	.table-bordered>tbody>tr.spacer>td,
	.table-bordered>tbody>tr.spacer>td {
		border: 0px solid #00becd;
	}
.dataTables_wrapper .filters {
	margin-bottom: 10px;
}

.dataTables_wrapper .filters .dataTables_length{
}

.dataTables_wrapper .filters .dataTables_filter {
}

	.dataTables_wrapper .filters .dataTables_filter > div,
	.dataTables_wrapper .filters .dataTables_filter > a,
	.dataTables_wrapper .filters .dataTables_filter > button {
		float: right;
		margin-left: 10px;
	}

	.dataTables_wrapper .filters .dataTables_filter input[type=text],
	.dataTables_wrapper .filters .dataTables_filter input[type=date],
	.dataTables_wrapper .filters .dataTables_filter select,
	.dataTables_wrapper .filters .dataTables_filter > a,
	.dataTables_wrapper .filters .dataTables_filter > button,
	.dataTables_wrapper .filters .dataTables_filter .select2-container.form-control {
		height: 30px;
		padding: 5px;
		font-size: 12px;
		max-width: 120px;
		float: right;
	}

	.dataTables_wrapper .filters .dataTables_filter .select2-container {

	}
	.dataTables_wrapper .filters .dataTables_filter .select2-container.form-control {
		height: 30px;
		padding: 0;
	}
		.dataTables_wrapper .filters .dataTables_filter .select2-container.form-control a {
			height: 28px;
			line-height: 28px;
			border: 0;
			color: #555;
		}
		.dataTables_wrapper .filters .dataTables_filter .select2-container .select2-result {
			color: #555;
		}
		.dataTables_wrapper .filters .dataTables_filter .select2-container .select2-choice > .select2-chosen {
			margin-right: 20px;
		}
		.dataTables_wrapper .filters .dataTables_filter .select2-container .select2-arrow {
			background: transparent;
			border: 0;
			width: 20px;
		}
			.dataTables_wrapper .filters .dataTables_filter .select2-container .select2-arrow b {
				background-position-y: 1px;
			}

.tarifas_wrapper {
	overflow-x: auto;
}
.table-tarifas {

}
	.table-tarifas p {
		margin: 0;
	}
	.table-tarifas th,
	.table-tarifas td {
		text-align: center;
		vertical-align: middle!important;
		min-width: 70px;
	}

	.table-tarifas th {
		background: #ddd;
		border-top: 1px solid #eee!important;
		border-bottom: 1px solid #eee!important;
	}
	.table-tarifas td {
		border: 1px solid #eee!important;
	}
		.table-tarifas td .form-group {
			margin: 0;
		}
			.table-tarifas td .form-group input {
				padding: 5px;
			}

/* Sortable */

.sortable-paradas {
	padding: 0;

}
.sortable-paradas li{
	list-style:  none;
}



/* gestor de fechas */

.fc-event {
	background: transparent;
}
	.fc-day-grid-event .fc-content {
		white-space: normal;
	}
	.fc-time {
	}
	.fc-title {
		width: 100%;
		display: block;
		padding: 3px;
	}
		.fc-title ul {
			padding: 0;
			padding-left: 15px;
			margin: 5px;
		}
		.fc-event.NN .fc-title {
			background-color: #00becd;
		}
		.fc-event.F .fc-title {
			background-color: red;
		}
		.fc-event.VP .fc-title,
		.fc-event.FP .fc-title,
		.fc-event.AP .fc-title,
		.fc-event.EP .fc-title,
		.fc-event.PP .fc-title,
		.fc-event.RP .fc-title,
		.fc-event.SF .fc-title,
		.fc-event.VF .fc-title {
			background-color: orange;
		}
		.fc-event.ES .fc-title {
			background-color: black;
		}

/* Dashboard de ventas */
/* datepicker on title */

h1.page-header > form {
	display: inline;
	margin-left: 10px;
}
	h1.page-header > form i,
	h1.page-header > form input {
		font-size: 0.5em;
		display: inline;
		background: transparent;
		border: 0;
		width: auto;
	}

h2.with-form > form {
	display: inline;
	margin-left: 10px;
}
	h2.with-form > form i,
	h2.with-form > form input {
		font-size: 0.5em;
		display: inline;
		background: transparent;
		border: 0;
		width: auto;
	}
.panel-heading > form {
	display: inline;
	margin-left: 10px;
}
	.panel-heading > form i,
	.panel-heading > form input {
		color: white;
		display: inline;
		background: transparent;
		border: 0;
		width: auto;
	}



.message.info, .message.success, .message.warning, .message.error {
	border: 1px solid;
	margin: 10px 0px;
	padding:15px 10px 15px 65px;
	background-repeat: no-repeat;
	background-position: 10px center;
	font-size: 125%;
}
.message.info {
	/* color: #00529B; */
	border-color: #00529B;
	background-color: #BDE5F8;
	background-image: url('../../common/img/message/info.png');
}
.message.success {
	/* color: #4F8A10; */
	border-color: #4F8A10;
	background-color: #DFF2BF;
	background-image:url('../../common/img/message/success.png');
}
.message.warning {
	/* color: #9F6000; */
	border-color: #9F6000;
	background-color: #FFFABF;
	background-image: url('../../common/img/message/warning.png');
}
.message.error {
	/* color: #D8000C; */
	border-color: #D8000C;
	background-color: #FFBABA;
	background-image: url('../../common/img/message/error.png');
}



/* VISTOR DE ESTADISTICAS */

.discriminador_sentido {
	margin-top: 25px;
	height: 34px;
	padding: 6px 0;
	text-align: center;
}

.discriminador_sentido i {
	font-size: 20px;
}



/* Multipicker */
.picker-day.picker-selected {
	background-color: #00becd!important;
}
.picker-day.picker-empty, .picker-day.picker-empty:hover {
    background-color: #fafafa!important;
    cursor: default;
}



.qr_tachado {
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'%3e%3cline x1='0' y1='100' x2='100' y2='0' stroke-width='5' stroke='%23ff0000'/%3e%3c/svg%3e");
	background-size: 100% 100%;
}




/* Visor de buses y horas de paso ******/

.planning-table,
.incidencia-table {
	border: 1px solid black;
	margin-top: 5px;
}
	.planning-table td {
		width: 38%;
	}
	.planning-table th {
		width: 24%;
	}

.planning-table.active {
	background-color: #00becd;
	color: white;
}
	.planning-table.active td {
		width: 35%;
	}
	.planning-table.active th {
		width: 22%;
	}
	.planning-table.active a{
		font-weight: bold
	}


.planning-table td[rowspan]  {
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	width: 1.5em;
	width: 8%;
}
	.planning-table td[rowspan] div {
		margin-left: -10em;
		margin-right: -10em;
		font-size: 0.8em;
	}


.planning-table td.plan_selected[rowspan]  {
	background-color: #2d146e;
}
	.planning-table td.plan_selected[rowspan] div {
		-moz-transform: rotate(-90.0deg);  /* FF3.5+ */
		-o-transform: rotate(-90.0deg);  /* Opera 10.5 */
		-webkit-transform: rotate(-90.0deg);  /* Saf3.1+, Chrome */
		filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083);  /* IE6,IE7 */
		-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)"; /* IE8 */
	}
.planning-table td.plan_selector[rowspan]  {
	background-color: #00becd;
}
	.planning-table td.plan_selector[rowspan] div {
		font-size: 0.8em;
		font-weight: bold;
		color:  #2d146e;
		text-align: center;
	}
.planning-table.HLP tr td,
.planning-table.HLP tr th{
	background-color: #eee;
	color: #777;
	font-style: italic;

}


/* Modificaciones ui-select */

.ui-select-choices .dropdown-header {
	color: #000;
	font-weight: bold;
	font-size: 16px;
}

/* labels */
.label-light {
	color: #333;
	background-color: #efefef;
}



/* Añadimos los spacings de bootstrap 4 */
.font-weight-light {
  font-weight: 300 !important;
}

.font-weight-lighter {
  font-weight: lighter !important;
}

.font-weight-normal {
  font-weight: 400 !important;
}

.font-weight-bold {
  font-weight: 700 !important;
}

.font-weight-bolder {
  font-weight: bolder !important;
}

.font-italic {
  font-style: italic !important;
}



/* BACKPORTS DE BOOTSTRAP 4 */

/* Añadimos los margin y padding de bootstrap 4 */

.m-0 { margin:0!important; }
.m-1 { margin:.25rem!important; }
.m-2 { margin:.5rem!important; }
.m-3 { margin:1rem!important; }
.m-4 { margin:1.5rem!important; }
.m-5 { margin:3rem!important; }

.mt-0 { margin-top:0!important; }
.mr-0 { margin-right:0!important; }
.mb-0 { margin-bottom:0!important; }
.ml-0 { margin-left:0!important; }
.mx-0 { margin-left:0 !important;margin-right:0 !important; }
.my-0 { margin-top:0!important;margin-bottom:0!important; }

.mt-1 { margin-top:.25rem!important; }
.mr-1 { margin-right:.25rem!important; }
.mb-1 { margin-bottom:.25rem!important; }
.ml-1 { margin-left:.25rem!important; }
.mx-1 { margin-left:.25rem!important;margin-right:.25rem!important; }
.my-1 { margin-top:.25rem!important;margin-bottom:.25rem!important; }

.mt-2 { margin-top:.5rem!important; }
.mr-2 { margin-right:.5rem!important; }
.mb-2 { margin-bottom:.5rem!important; }
.ml-2 { margin-left:.5rem!important; }
.mx-2 { margin-right:.5rem!important;margin-left:.5rem!important; }
.my-2 { margin-top:.5rem!important;margin-bottom:.5rem!important; }

.mt-3 { margin-top:1rem!important; }
.mr-3 { margin-right:1rem!important; }
.mb-3 { margin-bottom:1rem!important; }
.ml-3 { margin-left:1rem!important; }
.mx-3 { margin-right:1rem!important;margin-left:1rem!important; }
.my-3 { margin-bottom:1rem!important;margin-top:1rem!important; }

.mt-4 { margin-top:1.5rem!important; }
.mr-4 { margin-right:1.5rem!important; }
.mb-4 { margin-bottom:1.5rem!important; }
.ml-4 { margin-left:1.5rem!important; }
.mx-4 { margin-right:1.5rem!important;margin-left:1.5rem!important; }
.my-4 { margin-top:1.5rem!important;margin-bottom:1.5rem!important; }

.mt-5 { margin-top:3rem!important; }
.mr-5 { margin-right:3rem!important; }
.mb-5 { margin-bottom:3rem!important; }
.ml-5 { margin-left:3rem!important; }
.mx-5 { margin-right:3rem!important;margin-left:3rem!important; }
.my-5 { margin-top:3rem!important;margin-bottom:3rem!important; }

.mt-auto { margin-top:auto!important; }
.mr-auto { margin-right:auto!important; }
.mb-auto { margin-bottom:auto!important; }
.ml-auto { margin-left:auto!important; }
.mx-auto { margin-right:auto!important;margin-left:auto!important; }
.my-auto { margin-bottom:auto!important;margin-top:auto!important; }

.p-0 { padding:0!important; }
.p-1 { padding:.25rem!important; }
.p-2 { padding:.5rem!important; }
.p-3 { padding:1rem!important; }
.p-4 { padding:1.5rem!important; }
.p-5 { padding:3rem!important; }

.pt-0 { padding-top:0!important; }
.pr-0 { padding-right:0!important; }
.pb-0 { padding-bottom:0!important; }
.pl-0 { padding-left:0!important; }
.px-0 { padding-left:0!important;padding-right:0!important; }
.py-0 { padding-top:0!important;padding-bottom:0!important; }

.pt-1 { padding-top:.25rem!important; }
.pr-1 { padding-right:.25rem!important; }
.pb-1 { padding-bottom:.25rem!important; }
.pl-1 { padding-left:.25rem!important; }
.px-1 { padding-left:.25rem!important;padding-right:.25rem!important; }
.py-1 { padding-top:.25rem!important;padding-bottom:.25rem!important; }

.pt-2 { padding-top:.5rem!important; }
.pr-2 { padding-right:.5rem!important; }
.pb-2 { padding-bottom:.5rem!important; }
.pl-2 { padding-left:.5rem!important; }
.px-2 { padding-right:.5rem!important;padding-left:.5rem!important; }
.py-2 { padding-top:.5rem!important;padding-bottom:.5rem!important; }

.pt-3 { padding-top:1rem!important; }
.pr-3 { padding-right:1rem!important; }
.pb-3 { padding-bottom:1rem!important; }
.pl-3 { padding-left:1rem!important; }
.py-3 { padding-bottom:1rem!important;padding-top:1rem!important; }
.px-3 { padding-right:1rem!important;padding-left:1rem!important; }

.pt-4 { padding-top:1.5rem!important; }
.pr-4 { padding-right:1.5rem!important; }
.pb-4 { padding-bottom:1.5rem!important; }
.pl-4 { padding-left:1.5rem!important; }
.px-4 { padding-right:1.5rem!important;padding-left:1.5rem!important; }
.py-4 { padding-top:1.5rem!important;padding-bottom:1.5rem!important; }

.pt-5 { padding-top:3rem!important; }
.pr-5 { padding-right:3rem!important; }
.pb-5 { padding-bottom:3rem!important; }
.pl-5 { padding-left:3rem!important; }
.px-5 { padding-right:3rem!important;padding-left:3rem!important; }
.py-5 { padding-top:3rem!important;padding-bottom:3rem!important; }

/* Añadimos los borders de bootstrap 4 */


.border {
	border: 1px solid #dee2e6 !important;
  }

  .border-top {
	border-top: 1px solid #dee2e6 !important;
  }

  .border-right {
	border-right: 1px solid #dee2e6 !important;
  }

  .border-bottom {
	border-bottom: 1px solid #dee2e6 !important;
  }

  .border-left {
	border-left: 1px solid #dee2e6 !important;
  }

  .border-0 {
	border: 0 !important;
  }

  .border-top-0 {
	border-top: 0 !important;
  }

  .border-right-0 {
	border-right: 0 !important;
  }

  .border-bottom-0 {
	border-bottom: 0 !important;
  }

  .border-left-0 {
	border-left: 0 !important;
  }

  .border-primary {
	border-color: #007bff !important;
  }

  .border-secondary {
	border-color: #6c757d !important;
  }

  .border-success {
	border-color: #28a745 !important;
  }

  .border-info {
	border-color: #17a2b8 !important;
  }

  .border-warning {
	border-color: #ffc107 !important;
  }

  .border-danger {
	border-color: #dc3545 !important;
  }

  .border-light {
	border-color: #f8f9fa !important;
  }

  .border-dark {
	border-color: #343a40 !important;
  }

  .border-white {
	border-color: #fff !important;
  }


/* Añadimos los display de bootstrap 4 */


.d-none {
  display: none !important;
}

.d-inline {
  display: inline !important;
}

.d-inline-block {
  display: inline-block !important;
}

.d-block {
  display: block !important;
}

.d-table {
  display: table !important;
}

.d-table-row {
  display: table-row !important;
}

.d-table-cell {
  display: table-cell !important;
}

.d-flex {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
}

.d-inline-flex {
  display: -webkit-inline-box !important;
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
}

@media (min-width: 576px) {
  .d-sm-none {
    display: none !important;
  }
  .d-sm-inline {
    display: inline !important;
  }
  .d-sm-inline-block {
    display: inline-block !important;
  }
  .d-sm-block {
    display: block !important;
  }
  .d-sm-table {
    display: table !important;
  }
  .d-sm-table-row {
    display: table-row !important;
  }
  .d-sm-table-cell {
    display: table-cell !important;
  }
  .d-sm-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .d-sm-inline-flex {
    display: -webkit-inline-box !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media (min-width: 768px) {
  .d-md-none {
    display: none !important;
  }
  .d-md-inline {
    display: inline !important;
  }
  .d-md-inline-block {
    display: inline-block !important;
  }
  .d-md-block {
    display: block !important;
  }
  .d-md-table {
    display: table !important;
  }
  .d-md-table-row {
    display: table-row !important;
  }
  .d-md-table-cell {
    display: table-cell !important;
  }
  .d-md-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .d-md-inline-flex {
    display: -webkit-inline-box !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media (min-width: 992px) {
  .d-lg-none {
    display: none !important;
  }
  .d-lg-inline {
    display: inline !important;
  }
  .d-lg-inline-block {
    display: inline-block !important;
  }
  .d-lg-block {
    display: block !important;
  }
  .d-lg-table {
    display: table !important;
  }
  .d-lg-table-row {
    display: table-row !important;
  }
  .d-lg-table-cell {
    display: table-cell !important;
  }
  .d-lg-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .d-lg-inline-flex {
    display: -webkit-inline-box !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media (min-width: 1200px) {
  .d-xl-none {
    display: none !important;
  }
  .d-xl-inline {
    display: inline !important;
  }
  .d-xl-inline-block {
    display: inline-block !important;
  }
  .d-xl-block {
    display: block !important;
  }
  .d-xl-table {
    display: table !important;
  }
  .d-xl-table-row {
    display: table-row !important;
  }
  .d-xl-table-cell {
    display: table-cell !important;
  }
  .d-xl-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .d-xl-inline-flex {
    display: -webkit-inline-box !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}


.flex-row {
	-ms-flex-direction: row !important;
	flex-direction: row !important;
  }

  .flex-column {
	-ms-flex-direction: column !important;
	flex-direction: column !important;
  }

  .flex-row-reverse {
	-ms-flex-direction: row-reverse !important;
	flex-direction: row-reverse !important;
  }

  .flex-column-reverse {
	-ms-flex-direction: column-reverse !important;
	flex-direction: column-reverse !important;
  }

  .flex-wrap {
	-ms-flex-wrap: wrap !important;
	flex-wrap: wrap !important;
  }

  .flex-nowrap {
	-ms-flex-wrap: nowrap !important;
	flex-wrap: nowrap !important;
  }

  .flex-wrap-reverse {
	-ms-flex-wrap: wrap-reverse !important;
	flex-wrap: wrap-reverse !important;
  }

  .flex-fill {
	-ms-flex: 1 1 auto !important;
	flex: 1 1 auto !important;
  }

  .flex-grow-0 {
	-ms-flex-positive: 0 !important;
	flex-grow: 0 !important;
  }

  .flex-grow-1 {
	-ms-flex-positive: 1 !important;
	flex-grow: 1 !important;
  }

  .flex-shrink-0 {
	-ms-flex-negative: 0 !important;
	flex-shrink: 0 !important;
  }

  .flex-shrink-1 {
	-ms-flex-negative: 1 !important;
	flex-shrink: 1 !important;
  }

  .justify-content-start {
	-ms-flex-pack: start !important;
	justify-content: flex-start !important;
  }

  .justify-content-end {
	-ms-flex-pack: end !important;
	justify-content: flex-end !important;
  }

  .justify-content-center {
	-ms-flex-pack: center !important;
	justify-content: center !important;
  }

  .justify-content-between {
	-ms-flex-pack: justify !important;
	justify-content: space-between !important;
  }

  .justify-content-around {
	-ms-flex-pack: distribute !important;
	justify-content: space-around !important;
  }

  .align-items-start {
	-ms-flex-align: start !important;
	align-items: flex-start !important;
  }

  .align-items-end {
	-ms-flex-align: end !important;
	align-items: flex-end !important;
  }

  .align-items-center {
	-ms-flex-align: center !important;
	align-items: center !important;
  }

  .align-items-baseline {
	-ms-flex-align: baseline !important;
	align-items: baseline !important;
  }

  .align-items-stretch {
	-ms-flex-align: stretch !important;
	align-items: stretch !important;
  }

  .align-content-start {
	-ms-flex-line-pack: start !important;
	align-content: flex-start !important;
  }

  .align-content-end {
	-ms-flex-line-pack: end !important;
	align-content: flex-end !important;
  }

  .align-content-center {
	-ms-flex-line-pack: center !important;
	align-content: center !important;
  }

  .align-content-between {
	-ms-flex-line-pack: justify !important;
	align-content: space-between !important;
  }

  .align-content-around {
	-ms-flex-line-pack: distribute !important;
	align-content: space-around !important;
  }

  .align-content-stretch {
	-ms-flex-line-pack: stretch !important;
	align-content: stretch !important;
  }

  .align-self-auto {
	-ms-flex-item-align: auto !important;
	align-self: auto !important;
  }

  .align-self-start {
	-ms-flex-item-align: start !important;
	align-self: flex-start !important;
  }

  .align-self-end {
	-ms-flex-item-align: end !important;
	align-self: flex-end !important;
  }

  .align-self-center {
	-ms-flex-item-align: center !important;
	align-self: center !important;
  }

  .align-self-baseline {
	-ms-flex-item-align: baseline !important;
	align-self: baseline !important;
  }

  .align-self-stretch {
	-ms-flex-item-align: stretch !important;
	align-self: stretch !important;
  }

  @media (min-width: 576px) {
	.flex-sm-row {
	  -ms-flex-direction: row !important;
	  flex-direction: row !important;
	}
	.flex-sm-column {
	  -ms-flex-direction: column !important;
	  flex-direction: column !important;
	}
	.flex-sm-row-reverse {
	  -ms-flex-direction: row-reverse !important;
	  flex-direction: row-reverse !important;
	}
	.flex-sm-column-reverse {
	  -ms-flex-direction: column-reverse !important;
	  flex-direction: column-reverse !important;
	}
	.flex-sm-wrap {
	  -ms-flex-wrap: wrap !important;
	  flex-wrap: wrap !important;
	}
	.flex-sm-nowrap {
	  -ms-flex-wrap: nowrap !important;
	  flex-wrap: nowrap !important;
	}
	.flex-sm-wrap-reverse {
	  -ms-flex-wrap: wrap-reverse !important;
	  flex-wrap: wrap-reverse !important;
	}
	.flex-sm-fill {
	  -ms-flex: 1 1 auto !important;
	  flex: 1 1 auto !important;
	}
	.flex-sm-grow-0 {
	  -ms-flex-positive: 0 !important;
	  flex-grow: 0 !important;
	}
	.flex-sm-grow-1 {
	  -ms-flex-positive: 1 !important;
	  flex-grow: 1 !important;
	}
	.flex-sm-shrink-0 {
	  -ms-flex-negative: 0 !important;
	  flex-shrink: 0 !important;
	}
	.flex-sm-shrink-1 {
	  -ms-flex-negative: 1 !important;
	  flex-shrink: 1 !important;
	}
	.justify-content-sm-start {
	  -ms-flex-pack: start !important;
	  justify-content: flex-start !important;
	}
	.justify-content-sm-end {
	  -ms-flex-pack: end !important;
	  justify-content: flex-end !important;
	}
	.justify-content-sm-center {
	  -ms-flex-pack: center !important;
	  justify-content: center !important;
	}
	.justify-content-sm-between {
	  -ms-flex-pack: justify !important;
	  justify-content: space-between !important;
	}
	.justify-content-sm-around {
	  -ms-flex-pack: distribute !important;
	  justify-content: space-around !important;
	}
	.align-items-sm-start {
	  -ms-flex-align: start !important;
	  align-items: flex-start !important;
	}
	.align-items-sm-end {
	  -ms-flex-align: end !important;
	  align-items: flex-end !important;
	}
	.align-items-sm-center {
	  -ms-flex-align: center !important;
	  align-items: center !important;
	}
	.align-items-sm-baseline {
	  -ms-flex-align: baseline !important;
	  align-items: baseline !important;
	}
	.align-items-sm-stretch {
	  -ms-flex-align: stretch !important;
	  align-items: stretch !important;
	}
	.align-content-sm-start {
	  -ms-flex-line-pack: start !important;
	  align-content: flex-start !important;
	}
	.align-content-sm-end {
	  -ms-flex-line-pack: end !important;
	  align-content: flex-end !important;
	}
	.align-content-sm-center {
	  -ms-flex-line-pack: center !important;
	  align-content: center !important;
	}
	.align-content-sm-between {
	  -ms-flex-line-pack: justify !important;
	  align-content: space-between !important;
	}
	.align-content-sm-around {
	  -ms-flex-line-pack: distribute !important;
	  align-content: space-around !important;
	}
	.align-content-sm-stretch {
	  -ms-flex-line-pack: stretch !important;
	  align-content: stretch !important;
	}
	.align-self-sm-auto {
	  -ms-flex-item-align: auto !important;
	  align-self: auto !important;
	}
	.align-self-sm-start {
	  -ms-flex-item-align: start !important;
	  align-self: flex-start !important;
	}
	.align-self-sm-end {
	  -ms-flex-item-align: end !important;
	  align-self: flex-end !important;
	}
	.align-self-sm-center {
	  -ms-flex-item-align: center !important;
	  align-self: center !important;
	}
	.align-self-sm-baseline {
	  -ms-flex-item-align: baseline !important;
	  align-self: baseline !important;
	}
	.align-self-sm-stretch {
	  -ms-flex-item-align: stretch !important;
	  align-self: stretch !important;
	}
  }

  @media (min-width: 768px) {
	.flex-md-row {
	  -ms-flex-direction: row !important;
	  flex-direction: row !important;
	}
	.flex-md-column {
	  -ms-flex-direction: column !important;
	  flex-direction: column !important;
	}
	.flex-md-row-reverse {
	  -ms-flex-direction: row-reverse !important;
	  flex-direction: row-reverse !important;
	}
	.flex-md-column-reverse {
	  -ms-flex-direction: column-reverse !important;
	  flex-direction: column-reverse !important;
	}
	.flex-md-wrap {
	  -ms-flex-wrap: wrap !important;
	  flex-wrap: wrap !important;
	}
	.flex-md-nowrap {
	  -ms-flex-wrap: nowrap !important;
	  flex-wrap: nowrap !important;
	}
	.flex-md-wrap-reverse {
	  -ms-flex-wrap: wrap-reverse !important;
	  flex-wrap: wrap-reverse !important;
	}
	.flex-md-fill {
	  -ms-flex: 1 1 auto !important;
	  flex: 1 1 auto !important;
	}
	.flex-md-grow-0 {
	  -ms-flex-positive: 0 !important;
	  flex-grow: 0 !important;
	}
	.flex-md-grow-1 {
	  -ms-flex-positive: 1 !important;
	  flex-grow: 1 !important;
	}
	.flex-md-shrink-0 {
	  -ms-flex-negative: 0 !important;
	  flex-shrink: 0 !important;
	}
	.flex-md-shrink-1 {
	  -ms-flex-negative: 1 !important;
	  flex-shrink: 1 !important;
	}
	.justify-content-md-start {
	  -ms-flex-pack: start !important;
	  justify-content: flex-start !important;
	}
	.justify-content-md-end {
	  -ms-flex-pack: end !important;
	  justify-content: flex-end !important;
	}
	.justify-content-md-center {
	  -ms-flex-pack: center !important;
	  justify-content: center !important;
	}
	.justify-content-md-between {
	  -ms-flex-pack: justify !important;
	  justify-content: space-between !important;
	}
	.justify-content-md-around {
	  -ms-flex-pack: distribute !important;
	  justify-content: space-around !important;
	}
	.align-items-md-start {
	  -ms-flex-align: start !important;
	  align-items: flex-start !important;
	}
	.align-items-md-end {
	  -ms-flex-align: end !important;
	  align-items: flex-end !important;
	}
	.align-items-md-center {
	  -ms-flex-align: center !important;
	  align-items: center !important;
	}
	.align-items-md-baseline {
	  -ms-flex-align: baseline !important;
	  align-items: baseline !important;
	}
	.align-items-md-stretch {
	  -ms-flex-align: stretch !important;
	  align-items: stretch !important;
	}
	.align-content-md-start {
	  -ms-flex-line-pack: start !important;
	  align-content: flex-start !important;
	}
	.align-content-md-end {
	  -ms-flex-line-pack: end !important;
	  align-content: flex-end !important;
	}
	.align-content-md-center {
	  -ms-flex-line-pack: center !important;
	  align-content: center !important;
	}
	.align-content-md-between {
	  -ms-flex-line-pack: justify !important;
	  align-content: space-between !important;
	}
	.align-content-md-around {
	  -ms-flex-line-pack: distribute !important;
	  align-content: space-around !important;
	}
	.align-content-md-stretch {
	  -ms-flex-line-pack: stretch !important;
	  align-content: stretch !important;
	}
	.align-self-md-auto {
	  -ms-flex-item-align: auto !important;
	  align-self: auto !important;
	}
	.align-self-md-start {
	  -ms-flex-item-align: start !important;
	  align-self: flex-start !important;
	}
	.align-self-md-end {
	  -ms-flex-item-align: end !important;
	  align-self: flex-end !important;
	}
	.align-self-md-center {
	  -ms-flex-item-align: center !important;
	  align-self: center !important;
	}
	.align-self-md-baseline {
	  -ms-flex-item-align: baseline !important;
	  align-self: baseline !important;
	}
	.align-self-md-stretch {
	  -ms-flex-item-align: stretch !important;
	  align-self: stretch !important;
	}
  }

  @media (min-width: 992px) {
	.flex-lg-row {
	  -ms-flex-direction: row !important;
	  flex-direction: row !important;
	}
	.flex-lg-column {
	  -ms-flex-direction: column !important;
	  flex-direction: column !important;
	}
	.flex-lg-row-reverse {
	  -ms-flex-direction: row-reverse !important;
	  flex-direction: row-reverse !important;
	}
	.flex-lg-column-reverse {
	  -ms-flex-direction: column-reverse !important;
	  flex-direction: column-reverse !important;
	}
	.flex-lg-wrap {
	  -ms-flex-wrap: wrap !important;
	  flex-wrap: wrap !important;
	}
	.flex-lg-nowrap {
	  -ms-flex-wrap: nowrap !important;
	  flex-wrap: nowrap !important;
	}
	.flex-lg-wrap-reverse {
	  -ms-flex-wrap: wrap-reverse !important;
	  flex-wrap: wrap-reverse !important;
	}
	.flex-lg-fill {
	  -ms-flex: 1 1 auto !important;
	  flex: 1 1 auto !important;
	}
	.flex-lg-grow-0 {
	  -ms-flex-positive: 0 !important;
	  flex-grow: 0 !important;
	}
	.flex-lg-grow-1 {
	  -ms-flex-positive: 1 !important;
	  flex-grow: 1 !important;
	}
	.flex-lg-shrink-0 {
	  -ms-flex-negative: 0 !important;
	  flex-shrink: 0 !important;
	}
	.flex-lg-shrink-1 {
	  -ms-flex-negative: 1 !important;
	  flex-shrink: 1 !important;
	}
	.justify-content-lg-start {
	  -ms-flex-pack: start !important;
	  justify-content: flex-start !important;
	}
	.justify-content-lg-end {
	  -ms-flex-pack: end !important;
	  justify-content: flex-end !important;
	}
	.justify-content-lg-center {
	  -ms-flex-pack: center !important;
	  justify-content: center !important;
	}
	.justify-content-lg-between {
	  -ms-flex-pack: justify !important;
	  justify-content: space-between !important;
	}
	.justify-content-lg-around {
	  -ms-flex-pack: distribute !important;
	  justify-content: space-around !important;
	}
	.align-items-lg-start {
	  -ms-flex-align: start !important;
	  align-items: flex-start !important;
	}
	.align-items-lg-end {
	  -ms-flex-align: end !important;
	  align-items: flex-end !important;
	}
	.align-items-lg-center {
	  -ms-flex-align: center !important;
	  align-items: center !important;
	}
	.align-items-lg-baseline {
	  -ms-flex-align: baseline !important;
	  align-items: baseline !important;
	}
	.align-items-lg-stretch {
	  -ms-flex-align: stretch !important;
	  align-items: stretch !important;
	}
	.align-content-lg-start {
	  -ms-flex-line-pack: start !important;
	  align-content: flex-start !important;
	}
	.align-content-lg-end {
	  -ms-flex-line-pack: end !important;
	  align-content: flex-end !important;
	}
	.align-content-lg-center {
	  -ms-flex-line-pack: center !important;
	  align-content: center !important;
	}
	.align-content-lg-between {
	  -ms-flex-line-pack: justify !important;
	  align-content: space-between !important;
	}
	.align-content-lg-around {
	  -ms-flex-line-pack: distribute !important;
	  align-content: space-around !important;
	}
	.align-content-lg-stretch {
	  -ms-flex-line-pack: stretch !important;
	  align-content: stretch !important;
	}
	.align-self-lg-auto {
	  -ms-flex-item-align: auto !important;
	  align-self: auto !important;
	}
	.align-self-lg-start {
	  -ms-flex-item-align: start !important;
	  align-self: flex-start !important;
	}
	.align-self-lg-end {
	  -ms-flex-item-align: end !important;
	  align-self: flex-end !important;
	}
	.align-self-lg-center {
	  -ms-flex-item-align: center !important;
	  align-self: center !important;
	}
	.align-self-lg-baseline {
	  -ms-flex-item-align: baseline !important;
	  align-self: baseline !important;
	}
	.align-self-lg-stretch {
	  -ms-flex-item-align: stretch !important;
	  align-self: stretch !important;
	}
  }

  @media (min-width: 1200px) {
	.flex-xl-row {
	  -ms-flex-direction: row !important;
	  flex-direction: row !important;
	}
	.flex-xl-column {
	  -ms-flex-direction: column !important;
	  flex-direction: column !important;
	}
	.flex-xl-row-reverse {
	  -ms-flex-direction: row-reverse !important;
	  flex-direction: row-reverse !important;
	}
	.flex-xl-column-reverse {
	  -ms-flex-direction: column-reverse !important;
	  flex-direction: column-reverse !important;
	}
	.flex-xl-wrap {
	  -ms-flex-wrap: wrap !important;
	  flex-wrap: wrap !important;
	}
	.flex-xl-nowrap {
	  -ms-flex-wrap: nowrap !important;
	  flex-wrap: nowrap !important;
	}
	.flex-xl-wrap-reverse {
	  -ms-flex-wrap: wrap-reverse !important;
	  flex-wrap: wrap-reverse !important;
	}
	.flex-xl-fill {
	  -ms-flex: 1 1 auto !important;
	  flex: 1 1 auto !important;
	}
	.flex-xl-grow-0 {
	  -ms-flex-positive: 0 !important;
	  flex-grow: 0 !important;
	}
	.flex-xl-grow-1 {
	  -ms-flex-positive: 1 !important;
	  flex-grow: 1 !important;
	}
	.flex-xl-shrink-0 {
	  -ms-flex-negative: 0 !important;
	  flex-shrink: 0 !important;
	}
	.flex-xl-shrink-1 {
	  -ms-flex-negative: 1 !important;
	  flex-shrink: 1 !important;
	}
	.justify-content-xl-start {
	  -ms-flex-pack: start !important;
	  justify-content: flex-start !important;
	}
	.justify-content-xl-end {
	  -ms-flex-pack: end !important;
	  justify-content: flex-end !important;
	}
	.justify-content-xl-center {
	  -ms-flex-pack: center !important;
	  justify-content: center !important;
	}
	.justify-content-xl-between {
	  -ms-flex-pack: justify !important;
	  justify-content: space-between !important;
	}
	.justify-content-xl-around {
	  -ms-flex-pack: distribute !important;
	  justify-content: space-around !important;
	}
	.align-items-xl-start {
	  -ms-flex-align: start !important;
	  align-items: flex-start !important;
	}
	.align-items-xl-end {
	  -ms-flex-align: end !important;
	  align-items: flex-end !important;
	}
	.align-items-xl-center {
	  -ms-flex-align: center !important;
	  align-items: center !important;
	}
	.align-items-xl-baseline {
	  -ms-flex-align: baseline !important;
	  align-items: baseline !important;
	}
	.align-items-xl-stretch {
	  -ms-flex-align: stretch !important;
	  align-items: stretch !important;
	}
	.align-content-xl-start {
	  -ms-flex-line-pack: start !important;
	  align-content: flex-start !important;
	}
	.align-content-xl-end {
	  -ms-flex-line-pack: end !important;
	  align-content: flex-end !important;
	}
	.align-content-xl-center {
	  -ms-flex-line-pack: center !important;
	  align-content: center !important;
	}
	.align-content-xl-between {
	  -ms-flex-line-pack: justify !important;
	  align-content: space-between !important;
	}
	.align-content-xl-around {
	  -ms-flex-line-pack: distribute !important;
	  align-content: space-around !important;
	}
	.align-content-xl-stretch {
	  -ms-flex-line-pack: stretch !important;
	  align-content: stretch !important;
	}
	.align-self-xl-auto {
	  -ms-flex-item-align: auto !important;
	  align-self: auto !important;
	}
	.align-self-xl-start {
	  -ms-flex-item-align: start !important;
	  align-self: flex-start !important;
	}
	.align-self-xl-end {
	  -ms-flex-item-align: end !important;
	  align-self: flex-end !important;
	}
	.align-self-xl-center {
	  -ms-flex-item-align: center !important;
	  align-self: center !important;
	}
	.align-self-xl-baseline {
	  -ms-flex-item-align: baseline !important;
	  align-self: baseline !important;
	}
	.align-self-xl-stretch {
	  -ms-flex-item-align: stretch !important;
	  align-self: stretch !important;
	}
  }

  .col {
	-ms-flex-preferred-size: 0;
	flex-basis: 0;
	-ms-flex-positive: 1;
	flex-grow: 1;
	max-width: 100%;
  }

  .col-auto {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	width: auto;
	max-width: 100%;
  }



  /* Clases para la barra de equilibrio */
.equilibrio-perfecto {
    background-color: #28a745 !important;
    transition: width 0.5s ease;
}
.equilibrio-cercano {
    background-color: #ffc107 !important;
    transition: width 0.5s ease;
}
.equilibrio-lejano {
    background-color: #dc3545 !important;
    transition: width 0.5s ease;
}

/* Estilos para la barra de progreso personalizada */
.progress {
    position: relative;
    height: 20px;
    background-color: #f5f5f5;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
}

.progress .marcador-central {
    position: absolute;
    left: 50%;
    width: 2px;
    height: 100%;
    background-color: #000;
    opacity: 0.5;
    z-index: 2;
}

.progress-bar {
    position: absolute;
    height: 100%;
    transition: all 0.5s ease;
}


@media (min-width: 992px) {
	.modal-xl {
	  width: 900px;
	}
}
@media (min-width: 1200px) {
	.modal-xl {
		width: 1200px;
	}
}


    /* Estilos para el tooltip */
    .tooltip-icon {
        position: relative;
        display: inline-block;
        cursor: help;
    }

        .tooltip-icon .tooltip-text {
            visibility: hidden;
            width: 400px;
            background-color: #555;
            color: #fff;
            text-align: center;
            border-radius: 6px;
            padding: 5px;
            position: absolute;
            z-index: 1;
            bottom: 125%;
            left: 50%;
            margin-left: -100px;
            opacity: 0;
            transition: opacity 0.3s;
            font-weight: normal;
            font-size: 13px;
        }

        .tooltip-icon .tooltip-text::after {
            content: "";
            position: absolute;
            top: 100%;
            left: 33%;
            margin-left: -5px;
            border-width: 5px;
            border-style: solid;
            border-color: #555 transparent transparent transparent;
        }

        .tooltip-icon:hover .tooltip-text {
            visibility: visible;
            opacity: 1;
        }



/* Estilos para tabla con scroll horizontal y columnas fijas */
.sticky-table-horizontal-table-container {
	position: relative;
	width: 100%;
	overflow-x: auto;
	overflow-y: visible;
	margin-bottom: 15px;
	/* Para navegadores webkit */
	-webkit-overflow-scrolling: touch;
}

.sticky-table-horizontal {
	border-collapse: separate;
	border-spacing: 0;
}
	.sticky-table-horizontal th,
	.sticky-table-horizontal td {
		white-space: nowrap;
	}
	/* Primera columna fija */
	.sticky-table-horizontal th:first-child {
		position: sticky;
		left: 0;
		z-index: 2;
		background-color: #f8f8f8;
		width: 1%; /* Fuerza el ancho mínimo */
		max-width: 325px; /* Establece un máximo para evitar que sea demasiado estrecha */
	}
	/* Segunda columna fija */
	.sticky-table-horizontal th:nth-child(2) {
		position: sticky;
		left: 0px; /* Ajusta este valor según el ancho de la primera columna */
		z-index: 1;
		background-color: #f8f8f8;
		min-width: 1%;
		max-width: 325px;
	}
	.sticky-table-horizontal td:last-child {
		border-right: none!important;
	}