@use "sass:meta";
body {
  --primary: #00afcb;
  --secondary: #46a1d4;
  --black: #2A2D34;
  --grey: #656D73;
  --white: #FFFFFF;
  --success: #26a028;
  --danger: #b42e3f;
  --warning: #a3752f;
  --login-background: #2A2D34;
  --login-panel-background: #FFFFFF;
  --login-btn-color: #00afcb;
  --login-btn-hover: #46a1d4;
  --sidebar-logo-color: #FFFFFF;
  --sidebar-logo-background: #181a1d;
  --sidebar-inner-background: #2b2e33;
  --sidebar-default-li-background: #2b2e33;
  --sidebar-default-li-color: #FFFFFF;
  --sidebar-li-active-background: #00afcb;
  --sidebar-li-hover-background: #46a1d4;
  --sidebar-li-active-color: #FFFFFF;
  --sidebar-li-hover-color: #FFFFFF;
  --topbar-background: #FFFFFF;
  --topbar-color: #2A2D34;
  --btn-default-background: #00afcb;
  --btn-default-hover-background: #008398;
  --btn-default-color: #FFFFFF;
  --btn-default-empty-color: #2A2D34; }

body.login-page {
  background: #fff; }
  body.login-page .message.error {
    background: #b42e3f;
    position: absolute;
    top: 20px;
    left: calc(50% - 224px);
    width: 448px;
    padding: 24px;
    color: #000;
    font-weight: 500;
    font-size: 1.1em;
    border-radius: 8px;
    box-shadow: 0 0 20px 3px rgba(255, 100, 60, 0.2); }
  body.login-page .page-content {
    display: flex;
    width: 100vw;
    height: 100vh;
    color: #202124; }
    body.login-page .page-content .login--wrapper {
      flex: 0 0 auto;
      margin: auto;
      background: #fff;
      border-radius: 8px;
      width: 448px;
      border: 1px solid rgba(0, 0, 0, 0.2);
      padding: 24px; }
      body.login-page .page-content .login--wrapper form {
        display: grid;
        grid-template-rows: auto 54px 54px 54px 54px;
        grid-gap: 14px; }
      body.login-page .page-content .login--wrapper .login--header {
        padding-bottom: 14px;
        text-align: center; }
        body.login-page .page-content .login--wrapper .login--header .title * {
          display: block;
          text-align: center; }
        body.login-page .page-content .login--wrapper .login--header .title .h3 {
          font-weight: 600; }
        body.login-page .page-content .login--wrapper .login--header .title .h4 {
          font-weight: 500;
          letter-spacing: .1px;
          color: #3f4549; }
      body.login-page .page-content .login--wrapper .form-input {
        position: relative; }
        body.login-page .page-content .login--wrapper .form-input span.placeholder {
          position: absolute;
          left: 15px;
          top: -12px;
          font-size: 1.1em;
          background: #fff;
          padding: 0 7px;
          font-weight: 500; }
        body.login-page .page-content .login--wrapper .form-input input {
          border: 1px solid rgba(0, 0, 0, 0.2);
          padding: 13px 15px;
          border-radius: 4px;
          width: 100%; }
          body.login-page .page-content .login--wrapper .form-input input::placeholder {
            display: none; }
          body.login-page .page-content .login--wrapper .form-input input:focus {
            border: 1px solid #00afcb; }
          body.login-page .page-content .login--wrapper .form-input input:focus ~ span {
            color: #00afcb; }
      body.login-page .page-content .login--wrapper .form-help a {
        font-weight: 600;
        color: #00afcb; }
      body.login-page .page-content .login--wrapper .align-right {
        text-align: right; }

/*# sourceMappingURL=login.css.map */