/*cambio de colores*/
body, html {    
    height: 100%;
    margin: 0;
    padding: 0 0;
   background-color: #448aff;
}

.container-fluid {
   width: 100%;
   height: 100%;     
   padding-left: 0;
   padding-right: 0;   
   display: table;
}

.row-fluid {
    height: 100%;
    display: table-cell;
    vertical-align: middle;
    width: 100%;
}

.btn-login {
	color: #FFFFFF;	
	background-color: #C7200F;
	*background-color: #C7200F;
	background-image: -moz-linear-gradient(top, #e48e07, #C7200F);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#e48e07), to(#C7200F));
	background-image: -webkit-linear-gradient(top, #e48e07, #C7200F);
	background-image: -o-linear-gradient(top, #e48e07, #C7200F);
	background-image: linear-gradient(to bottom, #e48e07, #C7200F);
	background-repeat: repeat-x;	
}
.btn-login:hover,
.btn-login:focus,
.btn-login:active,
.btn-login.active,
.btn-login.disabled,
.btn-login[disabled] {
	color: #FFFFFF;
	background-color: #C7200F;	
}

.login {  
  width: 370px;
  float: none;
  margin: 0 auto; 
}

.login hr {
    padding-top:0px;
    padding-bottom:0px;
    margin-top:5px;
    margin-bottom:10px;
}

.login .panel-heading,
.login .panel-body,
.login .panel-footer {
    width:100%;
}

.login .panel-footer {	
	color: #A0A0A0;
}

.login .panel-footer .small {
    cursor:default;
    font-size: 70%;
    padding:0px;
    margin:0px;
}

.login .profile-img {
	margin-top: 5px;
	margin-right: auto;
	margin-bottom: 5px;
	margin-left: auto;
	display: block;	
}

@media (max-width: 767px) {
    .login {        
        width: 100%;
        height: 100%;     
        padding-left: 0;
        padding-right: 0;          
        display:table;
    }        

    .login .panel-heading {       
        display:table-row;
        height:auto;
    }

    .login .panel-body {       
         height: 80%;       
         vertical-align: middle;
         display:table-cell;
    }    

    .login .panel-body .panel-body-content {        
        float: none;
        margin: 0 auto;    
    }

    .login .panel-footer {
        display:table-row;       
        height:auto;
    }

    .login .panel-footer .row {
         margin-left: 0px;
        margin-right: 0px;
    }    
}

/*cambio de colores*/
.fondo{
   background-color: #448aff;
}

/* smart-dark login */
body,
html {
  background: #080e1d;
  color: #f5f8ff;
}

.container-fluid {
  background: radial-gradient(circle at 50% 34%, rgba(47, 114, 255, .08), transparent 24%),
              linear-gradient(180deg, #080e1d 0%, #0a1020 100%);
}

.login .panel {
  background: #111b31;
  border: 1px solid rgba(142, 165, 200, .16);
  border-radius: 14px;
  box-shadow: 0 24px 58px rgba(0, 0, 0, .30);
  overflow: hidden;
}

.login .panel-heading,
.login .panel-body,
.login .panel-footer {
  background: transparent;
  border-color: transparent;
  color: #f5f8ff;
}

.login .panel-heading {
  padding-bottom: 8px;
}

.login .panel-body {
  padding-top: 12px;
}

.login .panel-footer {
  border-top: 1px solid rgba(142, 165, 200, .12);
  color: #8ea5c8;
}

.login .panel-footer .row.fondo {
  background: #0d1628 !important;
}

.login .panel-footer .small,
.login .panel-footer .small a {
  color: #c1cce0 !important;
}

.login .panel-footer .small a:hover {
  color: #00c6e8 !important;
}

.login-icon {
  max-height: 88px;
  max-width: 180px;
  width: auto;
  background-color: transparent !important;
  border-radius: 0;
}

.login-footer-logo {
  max-height: 54px;
  width: auto;
  margin-top: 18px;
}

.login .input-group-addon {
  background: #0b1426;
  border: 1px solid #263853;
  color: #8ea5c8;
}

.login .form-control {
  background: #0b1426;
  border: 1px solid #263853;
  color: #f5f8ff;
  box-shadow: none;
}

.login .form-control:focus {
  border-color: #2f72ff;
  box-shadow: 0 0 0 2px rgba(47, 114, 255, .16);
}

.login .form-control::-webkit-input-placeholder {
  color: #7f90ad;
}

.login .form-control:-ms-input-placeholder {
  color: #7f90ad;
}

.login .form-control::placeholder {
  color: #7f90ad;
}

.login button[type="submit"] {
  background: #3f83f8 !important;
  border: 0;
  border-radius: 7px;
  box-shadow: none;
  color: #ffffff !important;
  font-weight: 700;
  height: 40px;
}

.login button[type="submit"]:hover,
.login button[type="submit"]:focus {
  background: #5b96ff !important;
}

/* Overrides finales para ganar contra Materialize/Bootstrap del login legado. */
.container-fluid.fondo {
  background: #080e1d !important;
}

.row-fluid {
  background: transparent !important;
}

.login.panel,
.login.panel.white,
.login.panel-default.white {
  width: 380px;
  max-width: 92%;
  background: #111b31 !important;
  border: 1px solid rgba(80, 110, 158, .38) !important;
  border-radius: 14px !important;
  color: #f5f8ff !important;
}

.login .panel-heading.white,
.login .panel-heading {
  background: #111b31 !important;
  padding: 34px 40px 12px;
}

.login .panel-body {
  background: #111b31 !important;
  padding: 18px 40px 22px;
}

.login .panel-body-content {
  width: 100%;
  float: none;
  margin: 0 auto;
  padding: 0;
}

.login .input-group {
  width: 100%;
}

.login .input-group-addon {
  min-width: 34px;
}

.login .form-control {
  height: 36px;
}

.login hr {
  border-color: rgba(142, 165, 200, .16);
  margin: 16px 0 12px;
}

.login .panel-footer {
  background: #111b31 !important;
  padding: 0 30px 22px;
}

.login .panel-footer .row.fondo {
  display: table;
  width: 100%;
  margin: 0;
  padding: 14px 18px 12px;
  background: #0b1426 !important;
  border-radius: 0;
}

.login .panel-footer .row.fondo > div {
  display: table-cell;
  float: none;
  vertical-align: middle;
}

.login .panel-footer .row.fondo > div:first-child {
  width: 54%;
  padding-right: 18px;
}

.login .panel-footer .row.fondo > div:last-child {
  width: 46%;
  padding-left: 6px;
}

.login-footer-logo {
  display: block;
  max-width: 160px;
  max-height: 64px;
  width: 100%;
  height: auto;
  margin: 0;
  object-fit: contain;
}

.login .panel-footer .col-xs-12,
.login .panel-footer .col-sm-12,
.login .panel-footer .col-md-5,
.login .panel-footer .col-lg-5,
.login .panel-footer .col-md-7,
.login .panel-footer .col-lg-7 {
  padding-left: 0;
  padding-right: 0;
}

.login .panel-footer br {
  display: none;
}

.login .panel-footer .small {
  font-size: 10px;
  line-height: 1.15;
  white-space: normal;
}

.login .panel-footer .small strong {
  display: inline;
}

@media (max-width: 767px) {
  .login.panel,
  .login.panel.white,
  .login.panel-default.white {
    width: 100%;
    max-width: 100%;
    min-height: 100%;
    border-radius: 0 !important;
  }

  .login .panel-footer .row.fondo,
  .login .panel-footer .row.fondo > div {
    display: block;
    width: 100%;
    text-align: center;
  }

  .login-footer-logo {
    margin: 0 auto 10px;
  }
}

.login .input-group .form-control,
.login .input-group .form-control:focus,
.login input[type="text"],
.login input[type="text"]:focus,
.login input[type="password"],
.login input[type="password"]:focus {
  background-color: #0b1426 !important;
  border-color: #263853 !important;
  color: #f5f8ff !important;
  -webkit-text-fill-color: #f5f8ff;
  box-shadow: none !important;
}

.login .input-group .form-control:focus,
.login input[type="text"]:focus,
.login input[type="password"]:focus {
  border-color: #2f72ff !important;
  box-shadow: 0 0 0 2px rgba(47, 114, 255, .16) !important;
}

.login input:-webkit-autofill,
.login input:-webkit-autofill:hover,
.login input:-webkit-autofill:focus,
.login input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px #0b1426 inset !important;
  -webkit-text-fill-color: #f5f8ff !important;
  caret-color: #f5f8ff;
  transition: background-color 9999s ease-out;
}

/* smart-dark: footer integrado al panel, sin bloque azul ni separador. */
.login hr {
  display: none !important;
}

.login .panel-footer {
  border-top: 0 !important;
}

.login .panel-footer .row.fondo {
  background: transparent !important;
  padding-top: 8px;
}

/* smart-dark: alertas bootbox del login */
.bootbox.modal,
.modal.bootbox {
  color: #d7e1ef;
}

.bootbox.alert-danger,
.modal.bootbox.alert-danger,
.bootbox.alert.alert-danger {
  background: transparent !important;
  border: 0 !important;
  color: #f3d7dc !important;
  text-shadow: none !important;
}

.bootbox .modal-dialog {
  margin-top: 18vh;
}

.bootbox .modal-content,
.bootbox .modal-content.alert,
.bootbox .modal-content.alert-danger,
.bootbox.alert-danger .modal-content,
.modal.bootbox.alert-danger .modal-content,
.bootbox.alert.alert-danger .modal-content,
.bootbox .alert,
.bootbox .alert-danger {
  background: linear-gradient(180deg, #3a121c 0%, #1c0d16 100%) !important;
  border: 1px solid rgba(255, 103, 116, .42) !important;
  border-radius: 14px !important;
  color: #d7e1ef !important;
  box-shadow: 0 22px 55px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 255, 255, .04) inset !important;
  text-shadow: none !important;
  overflow: hidden;
}

.bootbox .modal-header,
.bootbox .modal-body,
.bootbox .modal-footer {
  background: transparent !important;
  border-color: rgba(255, 120, 132, .18) !important;
}

.bootbox .modal-header {
  padding: 18px 20px 6px !important;
}

.bootbox .modal-body {
  padding: 8px 20px 14px !important;
  color: #d7e1ef !important;
}

.bootbox .modal-footer {
  padding: 10px 20px 18px !important;
}

.bootbox .modal-title {
  color: #fff4f6 !important;
  font-weight: 700;
}

.bootbox .bootbox-body {
  color: #ffd7dc !important;
  font-size: 13px;
  line-height: 1.4;
}

.bootbox .bootbox-alert {
  background: rgba(17, 10, 17, .34) !important;
  border: 1px solid rgba(255, 144, 154, .18) !important;
  border-radius: 8px !important;
  color: #ffd7dc !important;
  padding: 10px 12px !important;
  white-space: pre-wrap;
}

.bootbox .bootbox-close-button,
.bootbox .close {
  color: #8ea5c8 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.bootbox .bootbox-close-button:hover,
.bootbox .close:hover,
.bootbox .bootbox-close-button:focus,
.bootbox .close:focus {
  color: #ffffff !important;
}

.bootbox .modal-footer .btn,
.bootbox .modal-footer .btn-primary,
.bootbox .modal-footer .btn-danger {
  min-width: 132px;
  background: linear-gradient(180deg, #263851 0%, #172338 100%) !important;
  border: 1px solid rgba(255, 120, 132, .45) !important;
  color: #edf5fc !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

.bootbox .modal-footer .btn:hover,
.bootbox .modal-footer .btn:focus {
  background: linear-gradient(180deg, #334966 0%, #1e2e49 100%) !important;
  border-color: rgba(255, 147, 157, .62) !important;
  color: #ffffff !important;
}
