/* The Academy login design, with the existing Utarus authentication form. */
:root {
  color-scheme: dark;
  --background: oklch(0.16 0.04 258);
  --foreground: oklch(0.96 0.012 245);
  --card: oklch(0.2 0.048 258);
  --elevated: oklch(0.19 0.05 256);
  --primary: oklch(0.68 0.16 250);
  --primary-foreground: oklch(0.15 0.04 258);
  --muted-foreground: oklch(0.74 0.035 248);
  --border: oklch(0.32 0.05 255);
  --input: oklch(0.34 0.05 255);
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--background); color: var(--foreground); font-family: "Proxima Nova", Arial, Verdana, sans-serif; font-size: 16px; line-height: 1.5; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: underline; }
.velovest-login { display: grid; min-height: 100vh; min-height: 100dvh; place-items: center; padding: 24px 16px; }
.velovest-login__section { width: 100%; max-width: 56rem; }
.velovest-login__back { display: inline-flex; margin-bottom: 16px; font-size: 14px; color: var(--muted-foreground); }
.velovest-login__back:hover { color: var(--foreground); }
.velovest-login__panel { display: grid; overflow: hidden; border: 1px solid var(--border); background: var(--card); box-shadow: 0 24px 80px color-mix(in oklab, var(--background) 55%, transparent); }
.velovest-login__intro { padding: 24px; background: var(--elevated); }
.velovest-login__icon { color: var(--primary); }
.velovest-login__eyebrow { margin: 20px 0 0; color: var(--primary); font-size: 10px; font-weight: 700; text-transform: uppercase; }
h1 { margin: 12px 0 0; font-size: 30px; font-weight: 600; line-height: 1.25; }
.velovest-login__copy { margin: 12px 0 0; color: var(--muted-foreground); font-size: 14px; line-height: 24px; }
.velovest-login__form-panel { min-width: 0; padding: 24px; }
.velovest-login__signup { margin: 16px 0 0; text-align: center; font-size: 14px; color: var(--muted-foreground); }
.velovest-login__signup a { color: var(--primary); font-weight: 600; }
.utarus-login { --utarus-fg: var(--foreground); --utarus-muted: var(--muted-foreground); --utarus-accent: var(--primary); --utarus-accent-fg: var(--primary-foreground); --utarus-btn: var(--primary); --utarus-card: var(--card); --utarus-border: var(--border); --utarus-error: oklch(0.8 0.13 25); --utarus-error-bg: oklch(0.25 0.05 25); max-width: none; font-family: inherit; }
.utarus-login__card { padding: 0; border: 0; border-radius: 0; box-shadow: none; }
.utarus-login__form { gap: 0; }
.utarus-login__form label { margin-top: 16px; color: var(--foreground); font-size: 14px; font-weight: 500; }
.utarus-login__form input[type="text"], .utarus-login__form input[type="password"], .utarus-login select { height: 40px; margin-top: 6px; padding: 0 12px; border: 1px solid var(--input); border-radius: 0; background: var(--background); color: var(--foreground); }
.utarus-login__form input:focus, .utarus-login select:focus { border-color: var(--primary); outline: 2px solid var(--primary); outline-offset: 1px; box-shadow: none; }
.utarus-login__submit { min-height: 40px; margin-top: 16px; border-radius: 8px; font-weight: 600; background: var(--primary); color: var(--primary-foreground); }
.utarus-login__submit:hover:not(:disabled) { filter: brightness(1.1); }
.utarus-login__submit:disabled { background: var(--primary); opacity: .5; }
.utarus-login__tabs { background: var(--background); }
.utarus-login__tab { color: var(--muted-foreground); }
.utarus-login__tab[aria-selected="true"] { background: var(--card); color: var(--foreground); }
.utarus-login__footer { border-color: var(--border); color: var(--muted-foreground); }
.utarus-login__creds { overflow-wrap: anywhere; }
@media (min-width: 640px) {
  .velovest-login { padding-right: 24px; padding-left: 24px; }
  .velovest-login__intro, .velovest-login__form-panel { padding: 32px; }
  h1 { font-size: 36px; }
}
@media (min-width: 768px) { .velovest-login__panel { grid-template-columns: .9fr 1.1fr; } }
