html, body {
  min-height: 100vh;
  background: linear-gradient(135deg, #ffffff 0%, #f9fafb 100%);
  background-repeat: no-repeat;
  background-size: cover;
  overscroll-behavior: none;
}

body {
  font-family: 'Urbanist', sans-serif;
  color: #111827;
}

#theme-toggle {
  transition: background-color .2s ease, color .2s ease;
  border: none;
}

#theme-toggle:hover {
  background: #f3f4f6;
}

[data-theme="dark"] #theme-toggle {
  background: var(--surface-2);
  color: var(--text-1);
}

[data-theme="dark"] #theme-toggle:hover {
  background: rgba(255, 255, 255, .08);
  color: var(--text-1);
}

[data-theme="dark"] html,
[data-theme="dark"] body {
  background: #0B1220;
  background-repeat: no-repeat;
  background-size: cover;
}

::selection {
  background: rgba(36, 68, 228, 0.2);
  color: inherit;
}

.input-focus:focus {
  box-shadow: 0 0 0 3px rgba(36, 68, 228, 0.12);
  border-color: #2444E4;
}

.btn-primary {
  background-color: #2444E4;
  color: #ffffff;
  border: 1px solid #1f3ad4;
}

.btn-primary:hover {
  background-color: #1d34b3;
}

[data-theme="dark"] .btn-primary {
  background-color: #2444E4;
  color: #ffffff;
  border-color: #1f3ad4;
}

.text-lowify-primary { color: #2444E4 !important; }
.bg-lowify-primary { background-color: #2444E4 !important; }

.from-lowify-primary {
  --tw-gradient-from: #2444E4 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(36 68 228 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.bg-gradient-to-r {
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
}

.btn-lowify-primary {
  color: #ffffff;
  border: 1px solid #1f3ad4;
  background-image: linear-gradient(to right, #2444E4, #1f3ad4);
}

.btn-lowify-primary:hover {
  background-image: linear-gradient(to right, #1f3ad4, #1a2d9e);
}