:root {
  --colorprincipal: #1F3769;
  --colorsecundario: #00B3CD;
  --colordestacado: #13A1B8; 
  --colorlinea: #DADBDA; 
  
}
@font-face {
    font-family: 'Poppins-Medium';
    src: url('https://control.mri-assist.com/css/webfonts/Poppins-Medium.ttf');
}
html{
	background-image: url("https://control.mri-assist.com/images/bg-inicio-sesion.jpg");
 	background-color: #FFFFFF;
	background-position: center; /* Center the image */
  	background-repeat: repeat; /* Do not repeat the image */
  	background-size: cover; 
}


body{
	font-family: 'Poppins-Medium', sans-serif;
	font-weight:normal;
	color: var(--colorprincipal);
	background-color:transparent;
	
}

nav{  height:7.5rem;width:100%}
nav .container{
	width: 100%;
	height: 100%;
	display: block;
	opacity: 0.7;
	background-color: white;
	padding: 0;
	margin: 0;
	max-width: 100%;}
h1{
	font-family: 'Poppins-Medium', sans-serif;
	font-weight:800;/*bold;*/
	color: var(--colorprincipal);
	font-size:21px!important;
}
/*h1{ font-size:1.5em;}*/
#app{ position:relative;}
.navbar-brand{
	/*padding-top: 2.5rem;
	padding-bottom: 1rem;*/
	position:absolute;
	top:2.5rem;
	left:15%;	
	z-index:999;
}
.card{/*    box-shadow: 0 0 1px rgba(0, 0, 0, 0.125), 0 1px 3px rgba(0, 0, 0, 0.2);*/
	box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.2), 0 1px 3px rgba(0, 0, 0, 0.125) !important;
	border-radius:0 !important;
}

.card-header{ border-bottom:1.5px solid var(--colorlinea)!important;padding: 1.25rem 0rem 0.25rem;}
.card-body{ padding:3rem 0rem 2rem;}
.card label,.col-form-label {font-size:16px!important;font-weight:normal!important;text-align:right;}
.btn-end{ display:flex;justify-content:end;}
.btn-center{ display:flex;justify-content:center;}

.botones button{ border-radius:0;background-color:var(--colorprincipal);border:0;font-size:16px;}
.botones button:hover{background-color:var(--colorsecundario);}


.form-control {/*color:var(--colorlinea);*/border-radius:0;}
.btn-link{padding-left:0px;font-size:12px;color:var(--colorsecundario); }
.btn-link:hover{ color:var(--colorprincipal); }
.form-control:focus{border-color:var(--colorprincipal)!important;}
.pb-6, .py-6{
  padding-bottom: 4.5rem !important;
}
.pt-6, .py-6{
  padding-top: 4.5rem !important;
}
.pl-6, .px-6{
  padding-left: 4.5rem !important;
}
.pr-6, .px-6{
  padding-right: 4.5rem !important;
}
@media (max-width: 768px) {
.card label,.col-form-label {text-align:left;}
}

.secciones-list li {
 padding:.5rem
}
.secciones-list li.active {
 --bg-opacity:1;
 background-color:#fff;
 background-color:rgba(255,255,255,var(--bg-opacity));
 border-top-right-radius:.25rem;
 border-bottom-right-radius:.25rem;
 --border-opacity:1;
 border-color:#ef7f1a;
 border-left:4px;
 border-color:rgba(239,127,26,var(--border-opacity));
 border-style:solid
}
@media (min-width:768px) {
 .secciones-list li.active {
  box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)
 }
}
.secciones-list li a {
 text-decoration:none;
 font-size:.9rem;
 color:#000;
 transition:all .25s ease
}
.secciones-list li a:hover {
 color:#686868
}

.mobile-title {
 display:none
}
@media (max-width:870px) {
 
 .mobile-info {
  text-align:right
 }
}
.item-detalles {
 background-color:#fafafa;
 border:1px solid #ececec;
 border-radius:4px;
 padding:.25rem .75rem;
 margin:.1rem;
 display:inline-flex;
 align-items:center
}
.incidencia td {
 background-color:#f3b4b4;
 font-weight:700
}
.incidencia td .btn {
 --text-opacity:1;
 color:#fff;
 color:rgba(255,255,255,var(--text-opacity));
 --bg-opacity:1;
 background-color:#f05252;
 background-color:rgba(240,82,82,var(--bg-opacity))
}
.finalized td {
 background-color:#dfffdf
}

.modal-dialog .card {border:0px}
.modal-dialog button.btn-primary {/*width:100%*/}
.modal-dialog {max-width: 750px;}
.modal-dialog .container{ margin-top: 1em;}
@media(max-width:440px) {
 #loginModal .modal-dialog {
  max-width:460px!important;
  margin-right:10px;
  margin-left:10px
 }
 #loginModal h1 {
  font-size:27px!important;
  line-height:31px!important;
  padding-top:0
 }
 #loginModal p {
  margin-bottom:18px!important
 }
 #loginModal input {
  font-size:14px;
  width:263px
 }
 #loginModal .btn {
  width:263px
 }
 #loginModal .row>div {
  padding:0px!important
 }
}
@media(min-width:441px) and (max-width:768px) {
 #loginModal .modal-dialog {
  max-width:380px!important;
  margin-right:auto;
  margin-left:auto
 }
}


.verde{color: #196f3d }
.rojo{color:#a8090c}

/* Soportado en Firefox usando prefijo */
input[type=text]:-moz-read-only {
  background-color: #ccc;
}

/* El prefijo no es necesario en navegadores basados en Blink/WebKit/Edge  */
input[type=text]:read-only {
  /*cursor: not-allowed;*/
  background-color: #ccc;
}

.lista-admin th{text-align:center;cursor:pointer;padding-left:0em;padding-right:0em;}
.lista-admin th i{margin-left:10px;}
.lista-admin .btn{height:3em;font-size: 0.9em;line-height: 0.9em;vertical-align:middle;display: table-cell;border: 0px;}
.campo-busqueda{ width:300px;margin:1em 0em;float:left;}
.campo-busqueda.small{float:left;width:100px!important;}
.campo-busqueda+.campo-busqueda{margin-left:1em;}
.filtros{float:left;}
.btn-mass-action{float:left;}
	.btn-mass-action .btn{margin:1em 0em}


html {
  scroll-behavior: smooth;
}


#form-login{ border-right:1px solid #ced4da;}

@media(max-width:768px){
	#loginModal form{text-align:center;}
	#loginModal input{width:90%;margin-left:5%;}
	#form-send-password_email button{font-size:13px;}
	#form-register{margin-top:2rem;}
	#form-login{ border-right:none;}
	

}
@media(min-width:769px){
	#form-login h6,#form-register h6{display:none;}	
}
.error{color:red}

#loginModal .modal-dialog {
   width: 90%;
   max-width:1200px;
}

#form-login h6,#form-register h6{color:#007bff;font-size:1.5rem;}


.msg-error{ border:0; color:#dc3545;background-color:white;font-size:80%;margin: 0 auto;padding: 0rem !important;font-weight:bold;}

