/* Lugon skin for Vikunja login / no-auth screens only. */

.no-auth-wrapper {
  min-block-size: 100vh !important;
  padding: 2.25rem 1rem !important;
  justify-content: center !important;
  background:
    radial-gradient(circle at 50% -20%, rgba(255,255,255,.10), transparent 42%),
    linear-gradient(145deg, #111820 0%, #1b2633 48%, #101720 100%) !important;
}

/* Custom Lugon logo rendered by Vikunja's supported custom-logo setting. */
.no-auth-wrapper > .logo {
  width: min(330px, 72vw) !important;
  height: auto !important;
  margin: 0 0 1.6rem !important;
}

.no-auth-wrapper > .logo .logo {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-inline-size: 330px !important;
  max-block-size: 120px !important;
  object-fit: contain !important;
}

/* Remove Vikunja's stock desert photo panel and llama background. */
.noauth-container > .image {
  display: none !important;
}

.noauth-container {
  inline-size: min(500px, calc(100vw - 2rem)) !important;
  max-inline-size: 500px !important;
  min-block-size: 0 !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  background: rgba(15, 23, 42, .96) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 0 28px 80px rgba(0,0,0,.38) !important;
  backdrop-filter: blur(12px);
}

.noauth-container .content {
  inline-size: 100% !important;
  max-inline-size: none !important;
  min-block-size: 0 !important;
  padding: 2.15rem 2.25rem 1.75rem !important;
  color: #e5e7eb !important;
}

/* This link is useful for desktop/mobile multi-instance installs, but noise here. */
.noauth-container .api-config {
  display: none !important;
}

.noauth-container .title {
  color: #f8fafc !important;
  font-size: 1.75rem !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  margin-block-end: 1.6rem !important;
}

.noauth-container label,
.noauth-container .label,
.noauth-container .checkbox {
  color: #dbe3ec !important;
}

.noauth-container a,
.noauth-container .inline-link,
.noauth-container .reset-password-link {
  color: #cbd5e1 !important;
}

.noauth-container a:hover,
.noauth-container .inline-link:hover,
.noauth-container .reset-password-link:hover {
  color: #ffffff !important;
}

#loginform input[type="text"],
#loginform input[type="password"],
#loginform input[type="email"],
#loginform input[type="url"] {
  min-height: 44px !important;
  background: #0b1220 !important;
  color: #f8fafc !important;
  border: 1px solid #334155 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

#loginform input::placeholder {
  color: #7f8b9c !important;
}

#loginform input:focus {
  border-color: #94a3b8 !important;
  box-shadow: 0 0 0 3px rgba(255,255,255,.06) !important;
}

#loginform .button,
#loginform button {
  min-height: 44px !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
}

#loginform .button.is-primary,
#loginform button.is-primary {
  background: #f8fafc !important;
  color: #111827 !important;
  border-color: #f8fafc !important;
}

#loginform .button.is-primary:hover,
#loginform button.is-primary:hover {
  background: #ffffff !important;
  color: #000000 !important;
}

@media (max-width: 600px) {
  .no-auth-wrapper {
    padding: 1.25rem .75rem !important;
    justify-content: flex-start !important;
  }

  .no-auth-wrapper > .logo {
    width: min(280px, 72vw) !important;
    margin-block-start: 1rem !important;
    margin-block-end: 1.2rem !important;
  }

  .noauth-container {
    inline-size: 100% !important;
    border-radius: 14px !important;
  }

  .noauth-container .content {
    padding: 1.65rem 1.35rem 1.35rem !important;
  }
}

/* LUGON: remove a lhama da tela de tarefas vazias */
.show-tasks .llama-cool {
  display: none !important;
}


/* LUGON: white-label */
.menu-bottom-link[href*="vikunja.io"] {
  display: none !important;
}