/*--------------Colors--------------*/
/* Primary */
/* Secondary */
/* Success */
/* Info */
/* Warning */
/* Danger */
/* Light */
/* Dark */
/* Link */
/* Accent */
/* Indigo */
/*--------------Colors--------------*/
/*--------------Button--------------*/
/*--------------Button--------------*/
/*--------------Navbar--------------*/
/*--------------Navbar--------------*/
/*--------------Checkbox/Radio--------------*/
/*--------------Checkbox/Radio--------------*/
/*--------------Switch--------------*/
/*--------------Switch--------------*/
/*--------------Panel--------------*/
/*--------------Panel--------------*/
/*--------------Task--------------*/
/*--------------Task--------------*/
/*--------------Event--------------*/
/*--------------Event--------------*/
/*--------------Series--------------*/
/*--------------Series--------------*/
/*--------------Other--------------*/
/*--------------Other--------------*/
/*--------------Grid--------------*/
/*--------------Grid--------------*/
/* ======================================================================== */
/* CSS FOR THE LOGON PAGE
 * Colors used in this theme $white $black */
/* ======================================================================== */
/*------------------------------------------------------------------------*/
.logon {
  font-size: 12px;
  font-weight: 400;
}

/* ------------------------------------------------------------------------ */
/* Left side with logo */
.logon .logon-left {
  background-color: #fff;
  height: 100vh;
}

.logon.invert .logon-left { /* INVERT */
  background-color: #000;
  height: 100vh;
}

.logon .logon-left .logon-left-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
}

.logon .logon-left .logon-logo {
  max-height: 512px;
  min-height: 128px;
}

/* ------------------------------------------------------------------------ */
/* Right side with input form */
.logon .logon-right {
  background-color: #000;
  color: #fff;
  height: 100vh;
}

.logon.invert .logon-right { /* INVERT */
  background-color: #fff;
  color: #000;
  height: 100vh;
}

.logon .logon-right .logon-right-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
}

.logon .logon-right .logon-form {
  font-size: 14px;
  font-weight: 400;
  width: 400px;
}

.logon .logon-right .logon-title {
  color: #fff;
  text-align: center;
  margin-bottom: 2rem;
  font-weight: 300;
}

.logon.invert .logon-right .logon-title {
  color: #000;
}

.logon .logon-right input {
  width: 100%;
  height: 40px;
  color: #fff !important;
  background-color: transparent !important;
  border: 0;
  padding: 0;
  padding-left: 32px;
  border-bottom: solid 1px #fff;
}

.logon.invert .logon-right input { /* INVERT */
  color: #000 !important;
  border-bottom: solid 1px #000;
}

.logon .logon-right input::placeholder {
  text-transform: uppercase;
  color: #fff;
}

.logon.invert .logon-right input::placeholder { /* INVERT */
  color: #000;
}

.logon .logon-right input:focus {
  border-bottom: solid 2px #fff;
  outline: none;
}

.logon.invert .logon-right input:focus { /* INVERT */
  border-bottom: solid 2px #000;
}

.logon .logon-right a {
  color: #fff;
}

.logon.invert .logon-right a { /* INVERT */
  color: #000;
}

.logon .logon-right .btn-logon {
  width: 100%;
  height: 40px;
  background-color: #fff;
  color: #000;
  text-transform: uppercase;
  padding: 2px;
}

.logon.invert .logon-right .btn-logon { /* INVERT */
  background-color: #000;
  color: #fff;
}

.logon .logon-right .input-logo {
  color: #fff;
  position: relative;
  top: -31px;
  left: 10px;
}

.logon.invert .logon-right .input-logo { /* INVERT */
  color: #000;
}

/* ------------------------------------------------------------------------ */
/* Autofill changes */
.logon input:-webkit-autofill,
.logon input:-webkit-autofill:hover,
.logon textarea:-webkit-autofill,
.logon textarea:-webkit-autofill:hover,
.logon select:-webkit-autofill,
.logon select:-webkit-autofill:hover {
  border: 0;
  border-bottom: solid 1px #fff;
  -webkit-text-fill-color: #fff;
  -webkit-box-shadow: 0 0 0px 1000px #000 inset !important;
  transition: none;
}

.logon input:-webkit-autofill + i,
.logon input:-webkit-autofill:hover + i,
.logon textarea:-webkit-autofill + i,
.logon textarea:-webkit-autofill:hover + i,
.logon select:-webkit-autofill + i,
.logon select:-webkit-autofill:hover + i {
  color: #fff !important;
}

.logon input:focus,
.logon select:focus,
.logon textarea:focus,
.logon button:focus .logon a:focus {
  outline-color: #fff;
}

.logon.invert input:-webkit-autofill,
.logon.invert input:-webkit-autofill:hover,
.logon.invert textarea:-webkit-autofill,
.logon.invert textarea:-webkit-autofill:hover,
.logon.invert select:-webkit-autofill,
.logon.invert select:-webkit-autofill:hover { /* INVERT */
  border: 0;
  border-bottom: solid 1px #000;
  -webkit-text-fill-color: #000;
  -webkit-box-shadow: 0 0 0px 1000px #fff inset !important;
  transition: none;
}

.logon.invert input:-webkit-autofill + i,
.logon.invert input:-webkit-autofill:hover + i,
.logon.invert textarea:-webkit-autofill + i,
.logon.invert textarea:-webkit-autofill:hover + i,
.logon.invert select:-webkit-autofill + i,
.logon.invert select:-webkit-autofill:hover + i { /* INVERT */
  color: #000 !important;
}

.logon.invert input:focus,
.logon.invert select:focus,
.logon.invert textarea:focus,
.logon.invert button:focus .logon.invert a:focus { /* INVERT */
  outline-color: #000;
}

/* ------------------------------------------------------------------------ */
/* Validation */
.logon .alert-danger .validation-summary-errors {
  color: inherit;
  background: none;
  border: none;
  padding: 0;
  padding-left: 25px;
}

.logon .alert-warning .validation-summary-errors {
  color: inherit;
  background: none;
  border: none;
  padding: 0;
  padding-left: 25px;
}

/*.logon .alert-danger {
    margin-top: 1rem;
    color: $white;
    border: solid 1px $white;
    background-color: rgba($black, 0);
}

    .logon .alert-danger button.close {
        color: $white;
        opacity: 1;
    }

    .logon .alert-danger .validation-summary-errors {
        color: $white;
        background: none;
        border: none;
        padding: 0;
    }*/
.logon .logon-right .input-validation-error {
  color: #fff;
  border-bottom-color: #fff !important;
}

/* ------------------------------------------------------------------------ */
body {
  padding-top: 0px;
}

.app-header, .app-footer {
  display: none;
}

.app-body {
  margin-top: 0 !important;
}

header.navbar {
  display: none;
}

.zone-messages .message-Information {
  display: none;
}

.container {
  height: 100vh;
}

/* ======================================================================== */