/**
 * Vikunja — тема Nergy только для страницы /login (есть #loginform).
 * Не трогает основное приложение после входа и другие no-auth экраны.
 * Подключается с task.nergy.team через nginx.
 */

.no-auth-wrapper:has(#loginform) {
  --nergy-text: #e8eefc;
  --nergy-muted: #9aa8c4;
  --nergy-accent: #5b8cff;
  min-height: 100vh;
  font-family: "DM Sans", system-ui, sans-serif !important;
  color: var(--nergy-text) !important;
  background-color: #070a10;
  background-image: radial-gradient(1200px 600px at 10% -10%, #1a2a4a 0%, transparent 55%),
    radial-gradient(900px 500px at 90% 10%, #123a38 0%, transparent 50%),
    linear-gradient(165deg, #070a10, #0f1624);
  padding-block-end: 2rem !important;
  position: relative;
  z-index: 0;
}

/* Сетка как на nergy.team — только зона логина */
.no-auth-wrapper:has(#loginform)::before {
  content: "";
  position: fixed;
  inset: 0;
  background-image: linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse at 50% 20%, black 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}

/* Лого Vikunja сверху и блок «Используется Vikunja на … (Изменить)» */
.no-auth-wrapper:has(#loginform) > .logo {
  display: none !important;
}

.no-auth-wrapper:has(#loginform) .api-config {
  display: none !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container {
  position: relative;
  z-index: 1;
  background: rgba(20, 28, 44, 0.72) !important;
  border: 1px solid rgba(120, 160, 220, 0.18) !important;
  border-radius: 18px !important;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.45) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  max-inline-size: min(1080px, 100%) !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container .image {
  display: none !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container .content {
  inline-size: 100% !important;
  max-inline-size: 480px !important;
  margin-inline: auto !important;
  padding: clamp(1.25rem, 3vw, 1.75rem) !important;
  color: var(--nergy-text) !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container .title {
  color: var(--nergy-text) !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em;
}

.no-auth-wrapper:has(#loginform) .noauth-container label {
  color: var(--nergy-muted) !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container input[type="text"],
.no-auth-wrapper:has(#loginform) .noauth-container input[type="password"],
.no-auth-wrapper:has(#loginform) .noauth-container input[type="email"],
.no-auth-wrapper:has(#loginform) .noauth-container input[type="search"],
.no-auth-wrapper:has(#loginform)
  .noauth-container
  input:not([type="checkbox"]):not([type="radio"]) {
  border-radius: 12px !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  background: rgba(5, 8, 14, 0.55) !important;
  color: var(--nergy-text) !important;
  box-shadow: none !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container input:focus,
.no-auth-wrapper:has(#loginform) .noauth-container textarea:focus {
  border-color: rgba(91, 140, 255, 0.55) !important;
  box-shadow: 0 0 0 3px rgba(91, 140, 255, 0.18) !important;
  outline: none !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container input::placeholder {
  color: rgba(154, 168, 196, 0.65) !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container input[type="checkbox"] {
  accent-color: #5b8cff;
}

.no-auth-wrapper:has(#loginform) .noauth-container label:has(input[type="checkbox"]) {
  color: var(--nergy-muted) !important;
  font-size: 0.88rem !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container .base-button:not(.password-field-type-toggle) {
  border-radius: 12px !important;
  font-weight: 700 !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container .password-field {
  position: relative !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container .password-field-type-toggle {
  width: auto !important;
  min-width: auto !important;
  padding: 0.35rem !important;
  font-weight: 600 !important;
  color: var(--nergy-muted) !important;
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
  position: absolute !important;
  inset-block-start: 50% !important;
  inset-inline-end: 0.85rem !important;
  transform: translateY(-50%) !important;
  border-radius: 8px !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container .password-field-type-toggle:hover {
  color: var(--nergy-text) !important;
  filter: none !important;
}

.no-auth-wrapper:has(#loginform)
  .noauth-container
  form#loginform
  .base-button:not(.password-field-type-toggle) {
  width: 100%;
  color: #061018 !important;
  background: linear-gradient(135deg, #5b8cff, #7aa7ff) !important;
  border: none !important;
  box-shadow: 0 14px 40px rgba(91, 140, 255, 0.35) !important;
}

.no-auth-wrapper:has(#loginform)
  .noauth-container
  form#loginform
  .base-button:not(.password-field-type-toggle):hover {
  filter: brightness(1.05);
}

.no-auth-wrapper:has(#loginform) .noauth-container .base-button.is-fullwidth,
.no-auth-wrapper:has(#loginform) .noauth-container .is-fullwidth.base-button {
  background: rgba(255, 255, 255, 0.08) !important;
  color: var(--nergy-text) !important;
  border: 1px solid rgba(120, 160, 220, 0.18) !important;
  box-shadow: none !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container a:not(.base-button),
.no-auth-wrapper:has(#loginform) .noauth-container .reset-password-link {
  color: var(--nergy-accent) !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container a:not(.base-button):hover {
  color: #7aa7ff !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container .message-wrapper {
  border-radius: 12px !important;
}

.no-auth-wrapper:has(#loginform) .content-auth {
  z-index: 2;
}

.no-auth-wrapper:has(#loginform) .legal-links,
.no-auth-wrapper:has(#loginform) .legal-links a {
  color: var(--nergy-muted) !important;
  font-size: 0.78rem !important;
}

.no-auth-wrapper:has(#loginform) .legal-links a:hover {
  color: var(--nergy-text) !important;
}

.no-auth-wrapper:has(#loginform) .noauth-container .notification,
.no-auth-wrapper:has(#loginform) .noauth-container [class*="motd"] {
  border-radius: 14px !important;
  border: 1px solid rgba(120, 160, 220, 0.25) !important;
  background: rgba(91, 140, 255, 0.08) !important;
  color: var(--nergy-text) !important;
}
