/**
 * Bolsa Empleo CSS
 * @copyright ATISoluciones 2021
 * 
 * 20210621 .form-group-dialog para los inputs en diálogos
 * 20210623 afinidades en validación
 * 20210909 form-group p para tamaño de texto
 */

:root {
  --principal: #006D38;
  --gris: #F1F1F1;
}

.bolsa-empleo {
	padding: 0px 8px;
}

.bolsa-empleo .pointer {	
    cursor: pointer;
}

.bolsa-empleo .ta-right {
	text-align: right;
}

.bolsa-empleo a.disabled {
    pointer-events: none;
}

.bolsa-empleo select, .bolsa-empleo input[type=text], .bolsa-empleo input[type=submit], .bolsa-empleo input[type=number],
 .bolsa-empleo input[type=button], .bolsa-empleo textarea, .bolsa-empleo button {
	border: 1px solid rgb(118, 118, 118);
	border-radius: 3px;
	box-sizing: border-box;
}

.bolsa-empleo input[type=text]:disabled, .bolsa-empleo input[type=submit]:disabled, .bolsa-empleo input[type=number]:disabled,
 .bolsa-empleo input[type=button]:disabled, .bolsa-empleo textarea:disabled, .bolsa-empleo button:disabled {
	border: 1px solid rgba(118, 118, 118, 0.3);
}

.bolsa-empleo select {
	padding: 3px;
	background-color: white;
}

.bolsa-empleo select:focus {
	background-color: #FFFF99;
}

.bolsa-empleo input[type=text], .bolsa-empleo input[type=number], .bolsa-empleo textarea, .bolsa-empleo button,
 .bolsa-empleo input[type=button], .bolsa-empleo input[type=submit] {
	padding: 4px 6px;
}

.bolsa-empleo button:hover, .bolsa-empleo input[type=submit]:hover, .bolsa-empleo input[type=button]:hover {
	cursor: pointer;
}

.bolsa-empleo button:hover:disabled, .bolsa-empleo input[type=submit]:hover:disabled, .bolsa-empleo input[type=button]:hover:disabled {
	cursor: inherit;
}

/* icons */
.bolsa-empleo .icon, .bolsa-empleo .only-icon {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.bolsa-empleo .icon {
	line-height: 12px;
}

.bolsa-empleo .only-icon {
	padding: 0px;
}

.bolsa-empleo .icon:before, .bolsa-empleo .only-icon:before {
    content: "";
	display: inline-block;
	width: 20px;
    height: 20px;
    background-size: 20px 20px;
  	background-repeat: no-repeat;
  	vertical-align: -50%;
}

.bolsa-empleo .icon-download:before {
	background-image: url(../img/md/file_download.svg);
}

.bolsa-empleo .icon-search:before {
	background-image: url(../img/md/search.svg);
}

#merito_preferente_form p.helper {
	margin-top: 0;
}

#merito_preferente_form li.selected {
	font-weight: bold;
}

/* grid system */
.bolsa-empleo .row {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}
.bolsa-empleo .row > .col {
	flex: 1 0 0%;
}
@media (min-width: 768px) {
	.bolsa-empleo .row > .col-md-7 {
		flex: 0 0 auto;
	    width: 58.3333333333%;
	}
}

/* datatable */
table.bluetable.bolsaempleo {
	width: 100%;
	margin-left: 0;
	margin-right: 0;
}
table.bluetable.bolsaempleo th {
	padding-left: 5px;
}
table.bluetable.bolsaempleo th.center,
table.bluetable.bolsaempleo td.center {
	text-align: center;
}
/* datatable ordenacion */
table.bluetable.bolsaempleo th img.order {
	height: 12px;
	filter: invert(100%) sepia(0%) saturate(7493%) hue-rotate(198deg) brightness(101%) contrast(103%);
}
/* datatable footer */
table.bluetable.bolsaempleo tfoot span.total {
	float: right;
}
table.bluetable.bolsaempleo tfoot button.btn.last {
	margin-right: 5px;
}
table.bluetable.bolsaempleo button {
	padding: 1px 6px;
}
table.bluetable.bolsaempleo .btn:hover:enabled {
	background-color: var(--principal);
	color: #fff;
	border: 1px solid var(--principal);
}
table.bluetable.bolsaempleo tfoot .btn:hover:enabled {
	border: 1px solid #fff;
}
table.bluetable.bolsaempleo span.pagination, table.bluetable.bolsaempleo span.total {
	color: #fff;
}

table.bluetable.bolsaempleo p.loading {
	width: max-content;	
}

table.bluetable.bolsaempleo .selected {
	background: none repeat scroll 0 0 #FFDA84;
}

table.bluetable.bolsaempleo .clickable:hover {
	cursor: pointer;
}
table.bluetable.bolsaempleo .page-size select {
	margin-right: 5px;
	border-radius: unset;
}
.bolsa-empleo .table-responsive{
	overflow-x: auto;
}
/* datatable header */
table.bluetable.bolsaempleo caption {
	background-color:var(--principal);
	font-size: 13px;
	color:#fff;
	padding:0.5rem;
}
table.bluetable.bolsaempleo caption .dropdown {
	display: block;
	width: 15px;
    height: 15px;
    float: right;
    border-radius: 50%;
    background-repeat: no-repeat;
    background-color: #F0F0F0;
    cursor: pointer;
}
table.bluetable.bolsaempleo caption .dropdown img {
	width: 15px;
    height: 15px;
	filter: invert(29%) sepia(33%) saturate(1565%) hue-rotate(108deg) brightness(98%) contrast(104%);
}
table.bluetable.bolsaempleo caption .dropdown .show {
	transform: scaleY(-1);
}
/* datatable filters */
table.bluetable.bolsaempleo .filterable input {
	width: 100%;
	max-width: 150px;
	font-size: 13px;
}
table.bluetable.bolsaempleo .filterable select {
	width: 100%;
	max-width: 150px;
	font-size: 13px;
}
/* datatable inputs && selects && labels */
table.bluetable.bolsaempleo input[type=text], table.bluetable.bolsaempleo input[type=number], table.bluetable.bolsaempleo select {
	display: inline-block;
	border-radius: 0px;
}
table.bluetable.bolsaempleo input[type=text], table.bluetable.bolsaempleo input[type=number] {
	padding: 1px 2px;
}
table.bluetable.bolsaempleo tbody select {
	padding: 0px;
}
table.bluetable.bolsaempleo tbody select {
	width: 100%;
}
table.bluetable.bolsaempleo label {
	margin-right: 0px !important;
	float: none !important;
}
/* datatable buttons */
table.bluetable.bolsaempleo .btns .btn {
	width: 100%;
	border: 1px solid var(--principal);
	margin-bottom: 1px;
}
table.bluetable.bolsaempleo .btns .btn.only-icon {
	width: inherit;
	margin: 0 auto;
    display: block;
}
table.bluetable.bolsaempleo span button {
	margin-left: 1px;
	border: 1px solid rgb(118, 118, 118);
}
table.bluetable.bolsaempleo span button:disabled {
	border: 1px solid rgba(118, 118, 118, 0.3);
}
table.bluetable.bolsaempleo .btn, table.bluetable.bolsaempleo .page-size select {
	font-size: 11px; /* Set a font size */
	cursor: pointer; /* Mouse pointer on hover */
}
table.bluetable.bolsaempleo .page-size select {
	padding: 0px;
}

table.bluetable.bolsaempleo.tablebolsas span.actions {
	float:left;
	margin-top: 10px;
} 

/* overflow */

.overflow-ellipsis {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.overflow-auto {
	white-space: nowrap;
	overflow: auto;
}


/* Nav bolsa empleo */

.nav-bolsa-empleo > ul {
	display: flex;
	justify-content: center;
	align-items: baseline;
	margin-top: 20px;
	margin-bottom: 42px;
	flex-wrap: wrap;
}

.nav-bolsa-empleo li {
	list-style-type: none !important;
	font-size: 16px;
	flex-shrink:0;
	margin-bottom: 16px;
}

.nav-bolsa-empleo a {
	padding-top: 8px;
	padding-bottom: 8px;
	padding-right: 15px;
	padding-left: 15px;
}

.nav-bolsa-empleo .active {
	background: var(--gris);
}

.nav-bolsa-empleo a:focus {
	outline: 2px solid var(--principal);
}

nav-bolsa-empleo a:active, nav-bolsa-empleo a:hover {
    outline: 0;
}


/* Descripción bolsa empleo */

.descripcion-bolsa-empleo p {
	font-size: 15px;
	padding: 0px 16px;
}


/* Noticias */

.noticias-bolsa-empleo {
	display: block;
	padding: 4px;
	width: 100%;
}

.noticias-bolsa-empleo > ul {
	border-top: 1px solid var(--gris);
	list-style-type: none !important;
	padding-top: 12px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: 0px !important;
    width: 100%;
}

.row-noticia {
	width: 100%;
	min-height: 1px;
	padding-right: 8px;
	padding-left: 8px;
	box-sizing: border-box;
}

.row-ver-todas {
	width: 100%;
	min-height: 1px;
	padding-right: 15px;
	padding-left: 15px;
	padding-top: 15px;
	padding-bottom: 15px;
	text-align: right;
}

@media(min-width: 768px) {
	.row-noticia {
		flex: 0 0 33.333333%;
		max-width: 33.333333%;
	}
}

.fecha-noticia {
	font-size: 12px;
	margin-bottom: 8px;
	margin-top: 14px;
	border-bottom: .0625rem;
    border-bottom-style: none;
	border-style: solid;
    border-top-style: solid;
    border-right-style: solid;
    border-left-style: solid;
	border-color: var(--gris);
}

.row-noticia a {
	font-size: 13px;
	font-weight: 500;
	line-height: 1.5;
}

/* Títulos bolsa empleo */

.titulo-bolsa-empleo {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.titulo-bolsa-empleo h4 {
	margin-left: 32px;
}

.titulo-bolsa-empleo .link-btn {
	margin-top: 16px;
}

/* Botón añadir */

.link-btn.disabled {
	pointer-events: none;
	opacity: .65;
}

.bolsa-empleo #nueva_noticia span {
	display: inline-block;
	padding: .6em;
	line-height: 2.4em;
	text-align: center;
	background-color: #fff;
	-webkit-mask: url(../img/md/add.svg) no-repeat center;
	mask: url(../img/md/add.svg) no-repeat center;
}

#nuevo_usuario span {
	display: inline-block;
	padding: .6em;
	line-height: 2.4em;
	text-align: center;
	background-color: #fff;
	-webkit-mask: url(../img/md/add.svg) no-repeat center;
	mask: url(../img/md/add.svg) no-repeat center;
}

/* Formularios */

.bolsa-empleo label {
	width: unset !important;
}

.form-group, .form-check, .form-btn, .form-file, .form-select {
	display: inline-block;
	width: 100% !important;
	margin-bottom: 1rem;
}

.form-group label, .form-check label, .form-file label, .form-select label {
	display: inline-block;
	font-size: .9rem;
}

.form-group label, .form-group-dialog label {
	width: 100% !important;
	text-align: left !important;
}

.form-group label {
	margin-bottom: .5rem;
}

.form-group input, .form-group-dialog input, .form-group-dialog textarea {
	display: block;
}

.form-group p {
	font-size: 1.1em;
}

.form-check label, .form-check input {
	vertical-align: middle;
}

.form-file, .form-select {
	display: flex;
	align-items: center;
}

.form-file label, .form-select {
	font-size: 15px;
}

.form-group-dialog input, .form-group-dialog textarea {
	width: 100%;
	padding: 1px 3px;
	border: 1px solid rgb(118, 118, 118);
    border-radius: 3px;
    box-sizing: border-box;
}

.form-group-dialog label {
	float: inherit;
}

/* Listas bolsa empleo */

.lista-bolsa-empleo {
	font-size: 14px;	
}

.lista-bolsa-empleo li {
	margin-bottom: 12px;
}

/* tooltip clipboard */

.tooltip:hover {
    position: relative;
}
.tooltip span {
    display: none;
    color: #fff;
}
.tooltip:hover span {
    border-radius: 6px;
    padding: 5px 20px 5px 5px;
    display: block;
    z-index: 120;
    background-color: #555;
    left: 0px;
    margin: 10px;
    width: 150px;
    text-align: center;
    position: absolute;
    top: 10px;
    text-decoration: none;
}

.tooltip-ficheros {
  position: relative;
  display: inline-block;
}

.tooltip-ficheros .tooltiptext-ficheros {
	visibility: hidden;
	background-color: #555;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	padding: 5px;
	position: absolute;
	z-index: 1;
	bottom: 160%;
	opacity: 0;
	transition: opacity 0.35s;
}

.tooltip-ficheros .tooltiptext-ficheros {
	width: 140px;
	margin-left: -60px;
	left: 110%;
}

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

.tooltip-ficheros:hover .tooltiptext-ficheros {
  visibility: visible;
  opacity: 1;
}

/* Formularios */
.bold-label {
	font-weight: bold;
}

.form-group-custom, .form-btn, .form-file, .form-select {
	display: inline-block;
	width: 50% !important;
	margin-bottom: 1rem;
}

.form-check-custom {
	display: inline-block;
	width: 49% !important;
}

.form-check-custom.w-35{
	width: 35% !important;
}
.form-check-custom.w-64{
	width: 64% !important;
}

.form-group-custom label, .form-check-custom label, .form-file label, .form-select label {
	display: inline-block;
	font-size: .9rem;
}

.form-group-custom label {
	text-align: left !important;
	margin-bottom: .5rem;
}

.form-group-custom input {
	display: block;
}

.form-group-custom.w100{
	display: inline-block;
	width: 100% !important;
	margin-bottom: 1rem;
}

.form-group-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 20px;
}

.form-group-container.helper > .form-group {
	margin-bottom: 0;
}

.form-group-container-offset {
    display: grid;
    grid-template-columns: 4fr 1fr;
    grid-gap: 20px;
}

.gap-5 {
	grid-gap: 5px;
}

.form-group-container.col1 {
	grid-template-columns: 1fr;
}

.form-group-container.col2 {
	grid-template-columns: 1fr 1fr;
}

.form-group-container.col2-button-left {
	grid-template-columns: 1.5fr 0.5fr;
}

.form-group-container.col3 {
	grid-template-columns: 1fr 1fr 1fr;
}

.form-input-custom{
	width:100%;
}

.form-label-custom{
	width: 10px !important;
}

/* circles */
.circle-true, .circle-false, .circle-neutral {
	width: 10px;
	height: 10px;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	margin: 0 auto;
}
.circle-true {
	background: #5cb85c;
}
.circle-false {
	background: #cc0000;
}
.circle-neutral {
	background: #babdb6;
}

/* text colors */
.text-danger {
    color: #cc0000!important;
}
.text-success {
	color: #5cb85c!important;
}
.text-primary {
	color: #003399!important;
}

/* Botones */
.btn-align-right {
	display: flex;
	flex-direction: row-reverse;
}

.btns-by-steps {
	display: flex;
	justify-content: space-between;
	margin: 10px 0px;
}

a.consultar-fichero {
  background-color: var(--principal);
  color: #fff;
  padding: 2px 6px 2px 6px;
  text-decoration: none;
  margin: 0 auto;
}

a.consultar-fichero:hover {
  background-color: var(--principal);
  cursor: pointer;
}

/* validar */

table.bluetable.bolsaempleo input.validar-afinidad {
	border-radius: 3px;
	
	width: 100%;
	max-width: 150px;
}

table.bluetable.bolsaempleo input + input {
   margin-top: 2px;
}

/* tab widget */

.nav-tabs-widget {
	border-bottom: 1px solid #DDDDDD;
	padding-left: 0;
	margin-bottom: 0;
    list-style: none !important;
    display: inline-block;
}

.nav-tabs-widget > li {
	float: left;
	margin-bottom: -1px;
    position: relative;
    display: block;
}

.nav-tabs-widget > li > a {
	border: 1px solid rgba(0, 0, 0, 0);
	border-radius: 4px 4px 0 0;
	line-height: 1.42857;
	margin-right: 2px;
	position: relative;
    display: block;
    padding: 10px 15px;
    color: #fff;
    text-decoration: none;
    background-color: var(--principal);
    font-size: 14px;
}

.nav-tabs-widget > li > a:hover {
    border-color: #EEEEEE #EEEEEE #DDDDDD;
    cursor: pointer;
}

.nav-tabs-widget > li.tab-selected > a, .nav-tabs-widget > li.tab-selected > a:hover {
	background-color: #FFFFFF;
    border-color: #DDDDDD #DDDDDD rgba(0, 0, 0, 0);
    border-image: none;
    border-style: solid;
    border-width: 1px;
    color: inherit;
    cursor: default;
}

/* afinidades en validación */

.cell-afinidad .table-afinidades tr {
	border-top: inherit;
	background: inherit;
}

.cell-afinidad .table-afinidades td {
	padding: 3px;
}

.cell-afinidad select {
	border-radius: 3px !important;
}

.merito-observacion-candidato {
	display: block;
	padding-top: 1px !important;
}

.centered-highlighted {
	border: 1px solid var(--principal);
	padding: 12px;
	display: flex;
	justify-content: center;
}