feat: Identity brokering (#730)

* feat: add/ remove external idps * feat: external idp add /remove * fix: auth proto * fix: handle login * feat: loginpolicy on authrequest * feat: idp providers on login * feat: link external idp * fix: check login policy on check username * feat: add mapping fields for idp config * feat: use user org id if existing * feat: use user org id if existing * feat: register external user * feat: register external user * feat: user linking * feat: user linking * feat: design external login * feat: design external login * fix: tests * fix: regenerate login design * feat: next step test linking process * feat: next step test linking process * feat: cascade remove external idps on user * fix: tests * fix: tests * feat: external idp requsts on users * fix: generate protos * feat: login styles * feat: login styles * fix: link user * fix: register user on specifig org * fix: user linking * fix: register external, linking auto * fix: remove unnecessary request from proto * fix: tests * fix: new oidc package * fix: migration version * fix: policy permissions * Update internal/ui/login/static/i18n/en.yaml Co-authored-by: Livio Amstutz <livio.a@gmail.com> * Update internal/ui/login/static/i18n/en.yaml Co-authored-by: Livio Amstutz <livio.a@gmail.com> * Update internal/ui/login/handler/renderer.go Co-authored-by: Livio Amstutz <livio.a@gmail.com> * Update internal/ui/login/handler/renderer.go Co-authored-by: Livio Amstutz <livio.a@gmail.com> * fix: pr requests * Update internal/ui/login/handler/link_users_handler.go Co-authored-by: Livio Amstutz <livio.a@gmail.com> * fix: pr requests * fix: pr requests * fix: pr requests * fix: login name size * fix: profile image light * fix: colors * fix: pr requests * fix: remove redirect uri validator * fix: remove redirect uri validator Co-authored-by: Livio Amstutz <livio.a@gmail.com>
2025-12-12 01:22:26 +00:00 · 2020-09-18 13:26:28 +02:00
parent 1d542a0c57
commit 320ddfa46d
141 changed files with 30057 additions and 12535 deletions
--- a/internal/ui/login/static/resources/themes/caos/css/dark.css
+++ b/internal/ui/login/static/resources/themes/caos/css/dark.css
@@ -73,7 +73,7 @@
 *, *::before, *::after {
  box-sizing: border-box;
  font-family: Lato;
-  font-size: 18px;
+  font-size: 16px;
  font-weight: 400;
 }

@@ -97,6 +97,7 @@ h1 {
  font-family: Aileron;
  font-weight: 300;
  font-size: 40px;
+  text-align: center;
 }

 h2 {
@@ -122,7 +123,13 @@ header .logo {
  margin: 30px;
 }

-.content {
+.head {
+  width: 100%;
+  max-width: 1000px;
+  margin: auto;
+}
+
+.content form {
  margin: auto;
  padding: 20px;
  width: 100%;
@@ -137,11 +144,14 @@ a {
 a:hover {
  color: #f60075;
 }
+a.tos-link {
+  font-size: 14px;
+}

-button {
+button, .button {
  background-color: #282828;
  color: #760038;
-  border: 2px solid #760038;
+  border: 1px solid #760038;
  border-radius: 5px;
  width: 100%;
  max-width: 600px;
@@ -149,36 +159,39 @@ button {
  transition: all 0.3s ease 0s;
  cursor: pointer;
  outline: none;
+  display: inline-block;
+  text-align: center;
+  line-height: 40px;
 }
-button:hover {
+button:hover, .button:hover {
  background-color: #f60075;
  color: #282828;
-  border: 2px solid #f60075;
+  border: 1px solid #f60075;
 }
-button.primary {
+button.primary, .button.primary {
  background-color: #760038;
  color: white;
  border: none;
 }
-button.primary:hover {
+button.primary:hover, .button.primary:hover {
  background-color: #f60075;
 }
-button:disabled {
-  background-color: #505050;
-  border: 2px solid #505050;
+button:disabled, .button:disabled {
+  background-color: #999999;
+  border: 1px solid #999999;
 }
-button:disabled:hover {
-  background-color: #505050;
-  border: 2px solid #505050;
+button:disabled:hover, .button:disabled:hover {
+  background-color: #999999;
+  border: 1px solid #999999;
 }

 input:not([type=radio]), select {
  background-color: #252525;
  color: white;
  height: 50px;
-  border: 2px solid #505050;
+  border: 1px solid #999999;
  border-radius: 5px;
-  padding-left: 15px;
+  padding-left: 8px;
 }

 form button.user-selection .profile-image, .login-profile .profile-image {
@@ -213,7 +226,7 @@ form button.user-selection:hover .profile-image, .login-profile:hover .profile-i
  text-align: center;
 }
 .login-profile .names div:first-of-type {
-  font-size: 40px;
+  font-size: 26px;
  font-weight: 300;
 }
 .login-profile .names div:nth-of-type(2) {
@@ -244,20 +257,21 @@ form .field.check-box {
  display: flex;
 }
 form .field.check-box input[type=checkbox] {
-  height: 20px;
+  height: 16px;
  vertical-align: middle;
 }
 form .field.check-box label {
-  height: 20px;
+  height: 16px;
  text-transform: inherit;
  display: inline-block;
  padding: 2px 0 0 15px;
  width: 100%;
+  color: white;
 }
 form label {
  color: #898989;
  text-transform: uppercase;
-  font-size: 0.9rem;
+  font-size: 0.8rem;
  margin-bottom: 3px;
 }
 form label span.optional {
@@ -301,7 +315,7 @@ form button.user-selection .sessionstate {
  height: 20px;
  width: 20px;
  border-radius: 20px;
-  border-color: #505050;
+  border-color: #999999;
  border-style: solid;
  border-width: 1px;
  position: absolute;
@@ -362,6 +376,7 @@ form ul#passwordcomplexity {
  flex-wrap: wrap;
  padding: 0;
  list-style: none;
+  margin-bottom: 0;
 }
 form ul#passwordcomplexity li {
  flex: 1 0 50%;
@@ -444,4 +459,8 @@ footer {
  padding: 10px;
 }

+.error {
+  color: #F20D6B;
+}
+
 /*# sourceMappingURL=dark.css.map */
--- a/internal/ui/login/static/resources/themes/caos/css/dark.css.map
+++ b/internal/ui/login/static/resources/themes/caos/css/dark.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/caos/variables.scss","../../scss/variables.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCMW;EDLX;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA,kBCDc;EDEd,OCDQ;EDER;EACA;EACA;;;AAMJ;EACI,OCXQ;EDYR,aClBS;EDmBT;EACA,WEzBS;;;AF4Bb;EACI,OClBQ;EDmBR,aCzBS;ED0BT;EACA,WE/BU;;;AFkCd;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OChDW;EDiDX;EACA;;AAEA;EACI,OCpDY;;;ADwDpB;EACI,kBC5Dc;ED6Dd,OC3DW;ED4DX;EACA;EACA;EACA;EACA,QE7EU;EF8EV;EACA;EACA;;AACA;EACI,kBCpEY;EDqEZ,OCxEU;EDyEV;;AAGJ;EACI,kBC3EO;ED4EP,OC7EI;ED8EJ;;AACA;EACI,kBC9EQ;;ADkFhB;EACI,kBEzEW;EF0EX;;AAEA;EACI,kBE7EO;EF8EP;;;AAKZ;EACI,kBEnFmB;EFoFnB,OCjGQ;EDkGR,QE9GU;EF+GV;EACA;EACA;;;AAIA;EACI;EACA;EACA;EACA;EE9GN;;AACA;EFyGE;IExGA;IACA;;;AF+GA;EElHF;;AACA;EFiHE;IEhHA;IACA;;;;AFsHA;EACI;EACA;;AAGJ;EACI;EACA;;AAEA;EACI,WE7IC;EF8ID;;AAGJ;EACI;EACA;EACA;EACA,OE/HC;;;AFqIT;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAIR;EACI,OE5KK;EF6KL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA,OCjNI;EDkNJ;EACA;EACA;EACA;;AAEA;EACI;EACA,kBE5MW;;AF+Mf;EACI;;AAIR;EACI;;AAKA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA,cErOO;EFsOP;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKR;EACI;;AAEA;EACI;;AAEA;EACI;;AAEJ;EACI,OEjQP;;AFwQL;EACI;;AAEJ;EACI;EACA;EACA;EACA;EE3RV;;AACA;EFsRM;IErRJ;IACA;;;AF6RQ;EACI;EACA;EElSd;;AACA;EF+RU;IE9RR;IACA;;;AFoSI;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA,OE3SN;;AFgTE;EACI,OElTL;;AFuTP;EACI;;AACA;EACI;EACA;;;AAKZ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI,MC1VI;;AD6VR;EACI,MC/VU;;;ADoWd;EACI;EACA;;;AAIR;EAEQ;EAEJ;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA;;;AAGJ;EACI;EACA;EACA","file":"dark.css"}
+{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/caos/variables.scss","../../scss/variables.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCMW;EDLX;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA,kBCDc;EDEd,OCDQ;EDER;EACA;EACA;;;AAMJ;EACI,OCXQ;EDYR,aClBS;EDmBT;EACA,WEzBS;EF0BT;;;AAGJ;EACI,OCnBQ;EDoBR,aC1BS;ED2BT;EACA,WEhCU;;;AFmCd;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OCvDW;EDwDX;EACA;;AAEA;EACI,OC3DY;;AD8DhB;EACI;;;AAIR;EACI,kBCvEc;EDwEd,OCtEW;EDuEX;EACA;EACA;EACA;EACA,QExFU;EFyFV;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI,kBCnFY;EDoFZ,OCvFU;EDwFV;;AAGJ;EACI,kBC1FO;ED2FP,OC5FI;ED6FJ;;AACA;EACI,kBC7FQ;;ADiGhB;EACI,kBEvFW;EFwFX;;AAEA;EACI,kBE3FO;EF4FP;;;AAOZ;EACI,kBEnGmB;EFoGnB,OClHQ;EDmHR,QE/HU;EFgIV;EACA;EACA;;;AAIA;EACI;EACA;EACA;EACA;EE9HN;;AACA;EFyHE;IExHA;IACA;;;AF+HA;EElIF;;AACA;EFiIE;IEhIA;IACA;;;;AFsIA;EACI;EACA;;AAGJ;EACI;EACA;;AAEA;EACI,WE5JE;EF6JF;;AAGJ;EACI;EACA;EACA;EACA,OE/IC;;;AFqJT;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA,OCpMA;;ADwMR;EACI,OE7LK;EF8LL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA,OCnOI;EDoOJ;EACA;EACA;EACA;;AAEA;EACI;EACA,kBE7NW;;AFgOf;EACI;;AAIR;EACI;;AAKA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA,cEtPO;EFuPP;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKR;EACI;;AAEA;EACI;;AAEA;EACI;;AAEJ;EACI,OElRP;;AFyRL;EACI;;AAEJ;EACI;EACA;EACA;EACA;EE5SV;;AACA;EFuSM;IEtSJ;IACA;;;AF8SQ;EACI;EACA;EEnTd;;AACA;EFgTU;IE/SR;IACA;;;AFqTI;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA,OE7TN;;AFkUE;EACI,OEpUL;;AFyUP;EACI;;AACA;EACI;EACA;;;AAKZ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI,MC7WI;;ADgXR;EACI,MClXU;;;ADuXd;EACI;EACA;;;AAIR;EAEQ;EAEJ;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI,OEpZO","file":"dark.css"}
--- a/internal/ui/login/static/resources/themes/caos/css/light.css
+++ b/internal/ui/login/static/resources/themes/caos/css/light.css
@@ -73,7 +73,7 @@
 *, *::before, *::after {
  box-sizing: border-box;
  font-family: Lato;
-  font-size: 18px;
+  font-size: 16px;
  font-weight: 400;
 }

@@ -97,6 +97,7 @@ h1 {
  font-family: Aileron;
  font-weight: 300;
  font-size: 40px;
+  text-align: center;
 }

 h2 {
@@ -122,7 +123,13 @@ header .logo {
  margin: 30px;
 }

-.content {
+.head {
+  width: 100%;
+  max-width: 1000px;
+  margin: auto;
+}
+
+.content form {
  margin: auto;
  padding: 20px;
  width: 100%;
@@ -137,11 +144,14 @@ a {
 a:hover {
  color: #f60075;
 }
+a.tos-link {
+  font-size: 14px;
+}

-button {
+button, .button {
  background-color: #282828;
  color: #760038;
-  border: 2px solid #760038;
+  border: 1px solid #760038;
  border-radius: 5px;
  width: 100%;
  max-width: 600px;
@@ -149,36 +159,39 @@ button {
  transition: all 0.3s ease 0s;
  cursor: pointer;
  outline: none;
+  display: inline-block;
+  text-align: center;
+  line-height: 40px;
 }
-button:hover {
+button:hover, .button:hover {
  background-color: #f60075;
  color: #282828;
-  border: 2px solid #f60075;
+  border: 1px solid #f60075;
 }
-button.primary {
+button.primary, .button.primary {
  background-color: #760038;
  color: white;
  border: none;
 }
-button.primary:hover {
+button.primary:hover, .button.primary:hover {
  background-color: #f60075;
 }
-button:disabled {
-  background-color: #505050;
-  border: 2px solid #505050;
+button:disabled, .button:disabled {
+  background-color: #999999;
+  border: 1px solid #999999;
 }
-button:disabled:hover {
-  background-color: #505050;
-  border: 2px solid #505050;
+button:disabled:hover, .button:disabled:hover {
+  background-color: #999999;
+  border: 1px solid #999999;
 }

 input:not([type=radio]), select {
  background-color: #252525;
  color: white;
  height: 50px;
-  border: 2px solid #505050;
+  border: 1px solid #999999;
  border-radius: 5px;
-  padding-left: 15px;
+  padding-left: 8px;
 }

 form button.user-selection .profile-image, .login-profile .profile-image {
@@ -213,7 +226,7 @@ form button.user-selection:hover .profile-image, .login-profile:hover .profile-i
  text-align: center;
 }
 .login-profile .names div:first-of-type {
-  font-size: 40px;
+  font-size: 26px;
  font-weight: 300;
 }
 .login-profile .names div:nth-of-type(2) {
@@ -244,20 +257,21 @@ form .field.check-box {
  display: flex;
 }
 form .field.check-box input[type=checkbox] {
-  height: 20px;
+  height: 16px;
  vertical-align: middle;
 }
 form .field.check-box label {
-  height: 20px;
+  height: 16px;
  text-transform: inherit;
  display: inline-block;
  padding: 2px 0 0 15px;
  width: 100%;
+  color: white;
 }
 form label {
  color: #898989;
  text-transform: uppercase;
-  font-size: 0.9rem;
+  font-size: 0.8rem;
  margin-bottom: 3px;
 }
 form label span.optional {
@@ -301,7 +315,7 @@ form button.user-selection .sessionstate {
  height: 20px;
  width: 20px;
  border-radius: 20px;
-  border-color: #505050;
+  border-color: #999999;
  border-style: solid;
  border-width: 1px;
  position: absolute;
@@ -362,6 +376,7 @@ form ul#passwordcomplexity {
  flex-wrap: wrap;
  padding: 0;
  list-style: none;
+  margin-bottom: 0;
 }
 form ul#passwordcomplexity li {
  flex: 1 0 50%;
@@ -444,6 +459,10 @@ footer {
  padding: 10px;
 }

+.error {
+  color: #F20D6B;
+}
+
 html {
  background-color: white;
  color: #282828;
@@ -454,66 +473,75 @@ html header .logo {
 html h1, html h2 {
  color: #282828;
 }
-html button {
+html button, html .button {
  background-color: white;
  color: #760038;
-  border: 2px solid #760038;
+  border: 1px solid #760038;
 }
-html button:hover {
+html button:hover, html .button:hover {
  background-color: #f60075;
-  border: 2px solid #f60075;
+  border: 1px solid #f60075;
+  color: #FFFFFF;
 }
-html button.primary {
+html button.primary, html .button.primary {
  background-color: #760038;
-  color: white;
+  color: #FFFFFF;
  border: none;
  box-shadow: 0px 10px 30px #760038;
 }
-html button.primary:hover {
+html button.primary:hover, html .button.primary:hover {
  background-color: #f60075;
 }
-html button.clean {
+html button:disabled, html .button:disabled {
+  background-color: #999999;
+  border: 1px solid #999999;
+}
+html button:disabled:hover, html .button:disabled:hover {
+  background-color: #999999;
+  border: 1px solid #999999;
+}
+html button.clean, html .button.clean {
  color: #282828;
 }
-html button.clean:hover {
+html button.clean:hover, html .button.clean:hover {
  border: none;
  background-color: #FFFFFF;
 }
-html button.user-selection .profile-image {
+html button.user-selection .profile-image, html .button.user-selection .profile-image {
  background-image: url("../../../images/icon-user-light.png");
 }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
-  html button.user-selection .profile-image {
+  html button.user-selection .profile-image, html .button.user-selection .profile-image {
    background-image: url("../../../images/icon-user-light@2x.png");
    background-size: 80px 80px;
  }
 }
-html button.user-selection:hover {
+html button.user-selection:hover, html .button.user-selection:hover {
  background-color: #FFFFFF;
 }
-html button.user-selection:hover .profile-image {
+html button.user-selection:hover .profile-image, html .button.user-selection:hover .profile-image {
  background-image: url("../../../images/icon-user-light-hover.png");
 }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
-  html button.user-selection:hover .profile-image {
+  html button.user-selection:hover .profile-image, html .button.user-selection:hover .profile-image {
    background-image: url("../../../images/icon-user-light-hover@2x.png");
    background-size: 80px 80px;
  }
 }
-html button.other-user .other-user-image {
+html button.other-user .other-user-image, html .button.other-user .other-user-image {
  background-image: url("../../../images/icon-newuser-light.png");
 }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
-  html button.other-user .other-user-image {
+  html button.other-user .other-user-image, html .button.other-user .other-user-image {
    background-image: url("../../../images/icon-newuser-light@2x.png");
    background-size: 80px 60px;
  }
 }
-html button.other-user:hover .other-user-image {
+html button.other-user:hover .other-user-image, html .button.other-user:hover .other-user-image {
  background-image: url("../../../images/icon-newuser-light-hover.png");
 }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
-  html button.other-user:hover .other-user-image {
+  html button.other-user:hover .other-user-image, html .button.other-user:hover .other-user-image {
    background-image: url("../../../images/icon-newuser-light-hover@2x.png");
    background-size: 80px 60px;
  }
@@ -532,4 +560,41 @@ html footer {
  background-image: url("../gradientdeco-full.svg");
 }

+form .field.check-box label {
+  color: #282828;
+}
+form ul#passwordcomplexity li i {
+  color: #50CA3D;
+}
+form ul#passwordcomplexity li.invalid i {
+  color: #F20D6B;
+}
+
+.login-profile .profile-image, form button.user-selection .profile-image {
+  background-image: url("../../../images/icon-user-light.png");
+}
+@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
+  .login-profile .profile-image, form button.user-selection .profile-image {
+    background-image: url("../../../images/icon-user-light@2x.png");
+    background-size: 80px 80px;
+  }
+}
+.login-profile:hover .profile-image, form button.user-selection:hover .profile-image {
+  background-image: url("../../../images/icon-user-light-hover.png");
+}
+@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
+  .login-profile:hover .profile-image, form button.user-selection:hover .profile-image {
+    background-image: url("../../../images/icon-user-light-hover@2x.png");
+    background-size: 80px 80px;
+  }
+}
+
+.free-tier {
+  border: 2px solid #F20D6B;
+}
+
+.error {
+  color: #F20D6B;
+}
+
 /*# sourceMappingURL=light.css.map */
--- a/internal/ui/login/static/resources/themes/caos/css/light.css.map
+++ b/internal/ui/login/static/resources/themes/caos/css/light.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/caos/variables.scss","../../scss/variables.scss","../../scss/light.scss"],"names":[],"mappings":"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","file":"light.css"}
+{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/caos/variables.scss","../../scss/variables.scss","../../scss/light.scss"],"names":[],"mappings":"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","file":"light.css"}
--- a/internal/ui/login/static/resources/themes/scss/light.scss
+++ b/internal/ui/login/static/resources/themes/scss/light.scss
@@ -14,19 +14,20 @@ html {
        color: $fontColorLight;
    }

-    button {
+    button, .button {
        background-color: $backgroundColorLight;
        color: $primaryColorLight;
-        border: 2px solid $primaryColorLight;
+        border: 1px solid $primaryColorLight;

        &:hover {
            background-color: $primaryColorHoverLight;
-            border: 2px solid $primaryColorHoverLight;
+            border: 1px solid $primaryColorHoverLight;
+            color: $buttonBackgroundColorHoverLight
        }

        &.primary {
            background-color: $primaryColor;
-            color: $fontColor;
+            color: $buttonBackgroundColorHoverLight;
            border: none;
            box-shadow: 0px 10px 30px $primaryColor;
            &:hover {
@@ -34,6 +35,16 @@ html {
            }
        }

+        &:disabled {
+            background-color: $inputBorderColor;
+            border: 1px solid $inputBorderColor;
+
+            &:hover {
+                background-color: $inputBorderColor;
+                border: 1px solid $inputBorderColor;
+            }
+        }
+
        &.clean {
            color: $fontColorLight;

@@ -90,4 +101,41 @@ html {
            background-image: url($footerimgLight);
        }
    }
+}
+
+form {
+    .field.check-box label {
+        color: $fontColorLight;
+    }
+
+ ul#passwordcomplexity li {
+     i {
+         color: $okColorLight;
+     }
+
+     &.invalid {
+         i {
+             color: $nokColorLight;
+         }
+     }
+ }
+}
+
+
+%profile-image {
+    .profile-image {
+        @include retina-background-image($profileImgLight, "png", false, 80px, 80px);
+    }
+
+    &:hover .profile-image {
+        @include retina-background-image($profileImgLight, "png", true, 80px, 80px);
+    }
+}
+
+.free-tier {
+    border: 2px solid $nokColorLight;
+}
+
+.error {
+    color: $nokColorLight;
 }
--- a/internal/ui/login/static/resources/themes/scss/main.scss
+++ b/internal/ui/login/static/resources/themes/scss/main.scss
@@ -3,7 +3,7 @@
 *, *::before, *::after {
    box-sizing: border-box;
    font-family: $standardFont;
-    font-size: 18px;
+    font-size: 16px;
    font-weight: 400;
 }

@@ -30,6 +30,7 @@ h1 {
    font-family: $headerFont;
    font-weight: 300;
    font-size: $headerSize;
+    text-align: center;
 }

 h2 {
@@ -56,7 +57,13 @@ header {
    }
 }

-.content {
+.head {
+    width: 100%;
+    max-width: 1000px;
+    margin: auto;
+}
+
+.content form {
    margin: auto;
    padding: 20px;
    width: 100%;
@@ -71,12 +78,16 @@ a {
    &:hover {
        color: $primaryColorHover;
    }
+
+    &.tos-link {
+        font-size: 14px;
+    }
 }

-button {
+button, .button {
    background-color: $backgroundColor;
    color: $primaryColor;
-    border: 2px solid $primaryColor;
+    border: 1px solid $primaryColor;
    border-radius: 5px;
    width: 100%;
    max-width: 600px;
@@ -84,10 +95,14 @@ button {
    transition: all 0.3s ease 0s;
    cursor: pointer;
    outline: none;
+    display: inline-block;
+    text-align: center;
+    line-height: 40px;
+
    &:hover {
        background-color: $primaryColorHover;
        color: $backgroundColor;
-        border: 2px solid $primaryColorHover;
+        border: 1px solid $primaryColorHover;
    }

    &.primary {
@@ -101,22 +116,24 @@ button {

    &:disabled {
        background-color: $inputBorderColor;
-        border: 2px solid $inputBorderColor;
+        border: 1px solid $inputBorderColor;

        &:hover {
            background-color: $inputBorderColor;
-            border: 2px solid $inputBorderColor;
+            border: 1px solid $inputBorderColor;
        }
    }
 }

+
+
 input:not([type='radio']), select {
    background-color: $inputBackgroundColor;
    color: $fontColor;
    height: $inputHeight;
-    border: 2px solid $inputBorderColor;
+    border: 1px solid $inputBorderColor;
    border-radius: 5px;
-    padding-left: 15px;
+    padding-left: 8px;
 }

 %profile-image {
@@ -145,7 +162,7 @@ input:not([type='radio']), select {
        text-align: center;

        div:first-of-type {
-            font-size: $headerSize;
+            font-size: $header3Size;
            font-weight: 300;
        }

@@ -184,23 +201,24 @@ form {
        display: flex;

        input[type='checkbox'] {
-            height: 20px;
+            height: 16px;
            vertical-align: middle;
        }

        & label {
-            height: 20px;
+            height: 16px;
            text-transform: inherit;
            display: inline-block;
            padding: 2px 0 0 15px;
            width: 100%;
+            color: $fontColor;
        }
    }

    label {
        color: $labelColor;
        text-transform: uppercase;
-        font-size: 0.9rem;
+        font-size: 0.8rem;
        margin-bottom: 3px;

        span.optional {
@@ -320,6 +338,7 @@ form {
        flex-wrap: wrap;
        padding: 0;
        list-style: none;
+        margin-bottom: 0;

        li {
            flex: 1 0 50%;
@@ -412,7 +431,11 @@ footer {
 }

 .free-tier {
-    border: 2px solid #F20D6B;
+    border: 2px solid $nokColor;
    border-radius: 5px;
    padding: 10px;
+}
+
+.error {
+    color: $nokColor;
 }
--- a/internal/ui/login/static/resources/themes/scss/variables.scss
+++ b/internal/ui/login/static/resources/themes/scss/variables.scss
@@ -6,6 +6,7 @@ $headerFont: Lato;
 $inputHeight: 50px;
 $headerSize: 40px;
 $header2Size: 30px;
+$header3Size: 26px;
 $retina: "only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx)";

@mixin retina-background-image($file, $type, $hover, $width, $height) {
@@ -27,13 +28,14 @@ $fontColor: #BBBBC8;
 $primaryColor: #3574C6;
 $primaryColorHover: lighten($primaryColor, 10%);
 $labelColor: #898989;
-$inputBorderColor: #505050;
+$inputBorderColor: #999999;
 $inputBackgroundColor: #252525;
 $buttonBackgroundColorHover: $inputBackgroundColor;
 $profileImgDark: "../../../images/icon-user-dark";
 $otherUserImgDark: "../../../images/icon-newuser-dark";
 $nokColor: #F20D6B;
 $okColor: #0DF279;
+$errorColor: red;


 // ----- LIGHT-THEME --------
@@ -44,4 +46,6 @@ $primaryColorHoverLight: lighten($primaryColorLight, 10%);
 $inputBackgroundColorLight: #FFFFFF;
 $buttonBackgroundColorHoverLight: $inputBackgroundColorLight;
 $profileImgLight: "../../../images/icon-user-light";
-$otherUserImgLight: "../../../images/icon-newuser-light";
+$otherUserImgLight: "../../../images/icon-newuser-light";
+$nokColorLight: #F20D6B;
+$okColorLight: #50CA3D;
--- a/internal/ui/login/static/resources/themes/zitadel/css/dark.css
+++ b/internal/ui/login/static/resources/themes/zitadel/css/dark.css
@@ -73,7 +73,7 @@
 *, *::before, *::after {
  box-sizing: border-box;
  font-family: Lato;
-  font-size: 18px;
+  font-size: 16px;
  font-weight: 400;
 }

@@ -98,6 +98,7 @@ h1 {
  font-family: Lato;
  font-weight: 300;
  font-size: 40px;
+  text-align: center;
 }

 h2 {
@@ -123,7 +124,13 @@ header .logo {
  margin: 30px;
 }

-.content {
+.head {
+  width: 100%;
+  max-width: 1000px;
+  margin: auto;
+}
+
+.content form {
  margin: auto;
  padding: 20px;
  width: 100%;
@@ -138,11 +145,14 @@ a {
 a:hover {
  color: #5b8fd3;
 }
+a.tos-link {
+  font-size: 14px;
+}

-button {
+button, .button {
  background-color: #282828;
  color: #3574C6;
-  border: 2px solid #3574C6;
+  border: 1px solid #3574C6;
  border-radius: 5px;
  width: 100%;
  max-width: 600px;
@@ -150,36 +160,39 @@ button {
  transition: all 0.3s ease 0s;
  cursor: pointer;
  outline: none;
+  display: inline-block;
+  text-align: center;
+  line-height: 40px;
 }
-button:hover {
+button:hover, .button:hover {
  background-color: #5b8fd3;
  color: #282828;
-  border: 2px solid #5b8fd3;
+  border: 1px solid #5b8fd3;
 }
-button.primary {
+button.primary, .button.primary {
  background-color: #3574C6;
  color: #BBBBC8;
  border: none;
 }
-button.primary:hover {
+button.primary:hover, .button.primary:hover {
  background-color: #5b8fd3;
 }
-button:disabled {
-  background-color: #505050;
-  border: 2px solid #505050;
+button:disabled, .button:disabled {
+  background-color: #999999;
+  border: 1px solid #999999;
 }
-button:disabled:hover {
-  background-color: #505050;
-  border: 2px solid #505050;
+button:disabled:hover, .button:disabled:hover {
+  background-color: #999999;
+  border: 1px solid #999999;
 }

 input:not([type=radio]), select {
  background-color: #252525;
  color: #BBBBC8;
  height: 50px;
-  border: 2px solid #505050;
+  border: 1px solid #999999;
  border-radius: 5px;
-  padding-left: 15px;
+  padding-left: 8px;
 }

 form button.user-selection .profile-image, .login-profile .profile-image {
@@ -214,7 +227,7 @@ form button.user-selection:hover .profile-image, .login-profile:hover .profile-i
  text-align: center;
 }
 .login-profile .names div:first-of-type {
-  font-size: 40px;
+  font-size: 26px;
  font-weight: 300;
 }
 .login-profile .names div:nth-of-type(2) {
@@ -245,20 +258,21 @@ form .field.check-box {
  display: flex;
 }
 form .field.check-box input[type=checkbox] {
-  height: 20px;
+  height: 16px;
  vertical-align: middle;
 }
 form .field.check-box label {
-  height: 20px;
+  height: 16px;
  text-transform: inherit;
  display: inline-block;
  padding: 2px 0 0 15px;
  width: 100%;
+  color: #BBBBC8;
 }
 form label {
  color: #898989;
  text-transform: uppercase;
-  font-size: 0.9rem;
+  font-size: 0.8rem;
  margin-bottom: 3px;
 }
 form label span.optional {
@@ -302,7 +316,7 @@ form button.user-selection .sessionstate {
  height: 20px;
  width: 20px;
  border-radius: 20px;
-  border-color: #505050;
+  border-color: #999999;
  border-style: solid;
  border-width: 1px;
  position: absolute;
@@ -363,6 +377,7 @@ form ul#passwordcomplexity {
  flex-wrap: wrap;
  padding: 0;
  list-style: none;
+  margin-bottom: 0;
 }
 form ul#passwordcomplexity li {
  flex: 1 0 50%;
@@ -444,4 +459,8 @@ footer {
  padding: 10px;
 }

+.error {
+  color: #F20D6B;
+}
+
 /*# sourceMappingURL=dark.css.map */
--- a/internal/ui/login/static/resources/themes/zitadel/css/dark.css.map
+++ b/internal/ui/login/static/resources/themes/zitadel/css/dark.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/variables.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCHW;EDIX;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA,kBCOc;EDNd,OCOQ;EDNR;EACA;EACA;EAEI;;;AAIR;EACI,OCHQ;EDIR,aC3BS;ED4BT;EACA,WCzBS;;;AD4Bb;EACI,OCVQ;EDWR,aClCS;EDmCT;EACA,WC/BU;;;ADkCd;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OCxCW;EDyCX;EACA;;AAEA;EACI,OC5CY;;;ADgDpB;EACI,kBCpDc;EDqDd,OCnDW;EDoDX;EACA;EACA;EACA;EACA,QC7EU;ED8EV;EACA;EACA;;AACA;EACI,kBC5DY;ED6DZ,OChEU;EDiEV;;AAGJ;EACI,kBCnEO;EDoEP,OCrEI;EDsEJ;;AACA;EACI,kBCtEQ;;AD0EhB;EACI,kBCzEW;ED0EX;;AAEA;EACI,kBC7EO;ED8EP;;;AAKZ;EACI,kBCnFmB;EDoFnB,OCzFQ;ED0FR,QC9GU;ED+GV;EACA;EACA;;;AAIA;EACI;EACA;EACA;EACA;EC9GN;;AACA;EDyGE;ICxGA;IACA;;;AD+GA;EClHF;;AACA;EDiHE;IChHA;IACA;;;;ADsHA;EACI;EACA;;AAGJ;EACI;EACA;;AAEA;EACI,WC7IC;ED8ID;;AAGJ;EACI;EACA;EACA;EACA,OC/HC;;;ADqIT;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAIR;EACI,OC5KK;ED6KL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA,OCzMI;ED0MJ;EACA;EACA;EACA;;AAEA;EACI;EACA,kBC5MW;;AD+Mf;EACI;;AAIR;EACI;;AAKA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA,cCrOO;EDsOP;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKR;EACI;;AAEA;EACI;;AAEA;EACI;;AAEJ;EACI,OCjQP;;ADwQL;EACI;;AAEJ;EACI;EACA;EACA;EACA;EC3RV;;AACA;EDsRM;ICrRJ;IACA;;;AD6RQ;EACI;EACA;EClSd;;AACA;ED+RU;IC9RR;IACA;;;ADoSI;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA,OC3SN;;ADgTE;EACI,OClTL;;ADuTP;EACI;;AACA;EACI;EACA;;;AAKZ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI,MClVI;;ADqVR;EACI,MCvVU;;;AD4Vd;EACI;EACA;;;AAIR;EAII;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA;;;AAGJ;EACI;EACA;EACA","file":"dark.css"}
+{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/variables.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCHW;EDIX;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA,kBCQc;EDPd,OCQQ;EDPR;EACA;EACA;EAEI;;;AAIR;EACI,OCFQ;EDGR,aC3BS;ED4BT;EACA,WCzBS;ED0BT;;;AAGJ;EACI,OCVQ;EDWR,aCnCS;EDoCT;EACA,WChCU;;;ADmCd;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OC9CW;ED+CX;EACA;;AAEA;EACI,OClDY;;ADqDhB;EACI;;;AAIR;EACI,kBC9Dc;ED+Dd,OC7DW;ED8DX;EACA;EACA;EACA;EACA,QCxFU;EDyFV;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI,kBC1EY;ED2EZ,OC9EU;ED+EV;;AAGJ;EACI,kBCjFO;EDkFP,OCnFI;EDoFJ;;AACA;EACI,kBCpFQ;;ADwFhB;EACI,kBCvFW;EDwFX;;AAEA;EACI,kBC3FO;ED4FP;;;AAOZ;EACI,kBCnGmB;EDoGnB,OCzGQ;ED0GR,QC/HU;EDgIV;EACA;EACA;;;AAIA;EACI;EACA;EACA;EACA;EC9HN;;AACA;EDyHE;ICxHA;IACA;;;AD+HA;EClIF;;AACA;EDiIE;IChIA;IACA;;;;ADsIA;EACI;EACA;;AAGJ;EACI;EACA;;AAEA;EACI,WC5JE;ED6JF;;AAGJ;EACI;EACA;EACA;EACA,OC/IC;;;ADqJT;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA,OC3LA;;AD+LR;EACI,OC7LK;ED8LL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA,OC1NI;ED2NJ;EACA;EACA;EACA;;AAEA;EACI;EACA,kBC7NW;;ADgOf;EACI;;AAIR;EACI;;AAKA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA,cCtPO;EDuPP;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKR;EACI;;AAEA;EACI;;AAEA;EACI;;AAEJ;EACI,OClRP;;ADyRL;EACI;;AAEJ;EACI;EACA;EACA;EACA;EC5SV;;AACA;EDuSM;ICtSJ;IACA;;;AD8SQ;EACI;EACA;ECnTd;;AACA;EDgTU;IC/SR;IACA;;;ADqTI;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA,OC7TN;;ADkUE;EACI,OCpUL;;ADyUP;EACI;;AACA;EACI;EACA;;;AAKZ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI,MCpWI;;ADuWR;EACI,MCzWU;;;AD8Wd;EACI;EACA;;;AAIR;EAII;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI,OCpZO","file":"dark.css"}
--- a/internal/ui/login/static/resources/themes/zitadel/css/light.css
+++ b/internal/ui/login/static/resources/themes/zitadel/css/light.css
@@ -73,7 +73,7 @@
 *, *::before, *::after {
  box-sizing: border-box;
  font-family: Lato;
-  font-size: 18px;
+  font-size: 16px;
  font-weight: 400;
 }

@@ -98,6 +98,7 @@ h1 {
  font-family: Lato;
  font-weight: 300;
  font-size: 40px;
+  text-align: center;
 }

 h2 {
@@ -123,7 +124,13 @@ header .logo {
  margin: 30px;
 }

-.content {
+.head {
+  width: 100%;
+  max-width: 1000px;
+  margin: auto;
+}
+
+.content form {
  margin: auto;
  padding: 20px;
  width: 100%;
@@ -138,11 +145,14 @@ a {
 a:hover {
  color: #5b8fd3;
 }
+a.tos-link {
+  font-size: 14px;
+}

-button {
+button, .button {
  background-color: #282828;
  color: #3574C6;
-  border: 2px solid #3574C6;
+  border: 1px solid #3574C6;
  border-radius: 5px;
  width: 100%;
  max-width: 600px;
@@ -150,36 +160,39 @@ button {
  transition: all 0.3s ease 0s;
  cursor: pointer;
  outline: none;
+  display: inline-block;
+  text-align: center;
+  line-height: 40px;
 }
-button:hover {
+button:hover, .button:hover {
  background-color: #5b8fd3;
  color: #282828;
-  border: 2px solid #5b8fd3;
+  border: 1px solid #5b8fd3;
 }
-button.primary {
+button.primary, .button.primary {
  background-color: #3574C6;
  color: #BBBBC8;
  border: none;
 }
-button.primary:hover {
+button.primary:hover, .button.primary:hover {
  background-color: #5b8fd3;
 }
-button:disabled {
-  background-color: #505050;
-  border: 2px solid #505050;
+button:disabled, .button:disabled {
+  background-color: #999999;
+  border: 1px solid #999999;
 }
-button:disabled:hover {
-  background-color: #505050;
-  border: 2px solid #505050;
+button:disabled:hover, .button:disabled:hover {
+  background-color: #999999;
+  border: 1px solid #999999;
 }

 input:not([type=radio]), select {
  background-color: #252525;
  color: #BBBBC8;
  height: 50px;
-  border: 2px solid #505050;
+  border: 1px solid #999999;
  border-radius: 5px;
-  padding-left: 15px;
+  padding-left: 8px;
 }

 form button.user-selection .profile-image, .login-profile .profile-image {
@@ -214,7 +227,7 @@ form button.user-selection:hover .profile-image, .login-profile:hover .profile-i
  text-align: center;
 }
 .login-profile .names div:first-of-type {
-  font-size: 40px;
+  font-size: 26px;
  font-weight: 300;
 }
 .login-profile .names div:nth-of-type(2) {
@@ -245,20 +258,21 @@ form .field.check-box {
  display: flex;
 }
 form .field.check-box input[type=checkbox] {
-  height: 20px;
+  height: 16px;
  vertical-align: middle;
 }
 form .field.check-box label {
-  height: 20px;
+  height: 16px;
  text-transform: inherit;
  display: inline-block;
  padding: 2px 0 0 15px;
  width: 100%;
+  color: #BBBBC8;
 }
 form label {
  color: #898989;
  text-transform: uppercase;
-  font-size: 0.9rem;
+  font-size: 0.8rem;
  margin-bottom: 3px;
 }
 form label span.optional {
@@ -302,7 +316,7 @@ form button.user-selection .sessionstate {
  height: 20px;
  width: 20px;
  border-radius: 20px;
-  border-color: #505050;
+  border-color: #999999;
  border-style: solid;
  border-width: 1px;
  position: absolute;
@@ -363,6 +377,7 @@ form ul#passwordcomplexity {
  flex-wrap: wrap;
  padding: 0;
  list-style: none;
+  margin-bottom: 0;
 }
 form ul#passwordcomplexity li {
  flex: 1 0 50%;
@@ -444,6 +459,10 @@ footer {
  padding: 10px;
 }

+.error {
+  color: #F20D6B;
+}
+
 html {
  background-color: #f5f5f5;
  color: #282828;
@@ -455,66 +474,75 @@ html header .logo {
 html h1, html h2 {
  color: #282828;
 }
-html button {
+html button, html .button {
  background-color: #f5f5f5;
  color: #3574C6;
-  border: 2px solid #3574C6;
+  border: 1px solid #3574C6;
 }
-html button:hover {
+html button:hover, html .button:hover {
  background-color: #5b8fd3;
-  border: 2px solid #5b8fd3;
+  border: 1px solid #5b8fd3;
+  color: #FFFFFF;
 }
-html button.primary {
+html button.primary, html .button.primary {
  background-color: #3574C6;
-  color: #BBBBC8;
+  color: #FFFFFF;
  border: none;
  box-shadow: 0px 10px 30px #3574C6;
 }
-html button.primary:hover {
+html button.primary:hover, html .button.primary:hover {
  background-color: #5b8fd3;
 }
-html button.clean {
+html button:disabled, html .button:disabled {
+  background-color: #999999;
+  border: 1px solid #999999;
+}
+html button:disabled:hover, html .button:disabled:hover {
+  background-color: #999999;
+  border: 1px solid #999999;
+}
+html button.clean, html .button.clean {
  color: #282828;
 }
-html button.clean:hover {
+html button.clean:hover, html .button.clean:hover {
  border: none;
  background-color: #FFFFFF;
 }
-html button.user-selection .profile-image {
+html button.user-selection .profile-image, html .button.user-selection .profile-image {
  background-image: url("../../../images/icon-user-light.png");
 }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
-  html button.user-selection .profile-image {
+  html button.user-selection .profile-image, html .button.user-selection .profile-image {
    background-image: url("../../../images/icon-user-light@2x.png");
    background-size: 80px 80px;
  }
 }
-html button.user-selection:hover {
+html button.user-selection:hover, html .button.user-selection:hover {
  background-color: #FFFFFF;
 }
-html button.user-selection:hover .profile-image {
+html button.user-selection:hover .profile-image, html .button.user-selection:hover .profile-image {
  background-image: url("../../../images/icon-user-light-hover.png");
 }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
-  html button.user-selection:hover .profile-image {
+  html button.user-selection:hover .profile-image, html .button.user-selection:hover .profile-image {
    background-image: url("../../../images/icon-user-light-hover@2x.png");
    background-size: 80px 80px;
  }
 }
-html button.other-user .other-user-image {
+html button.other-user .other-user-image, html .button.other-user .other-user-image {
  background-image: url("../../../images/icon-newuser-light.png");
 }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
-  html button.other-user .other-user-image {
+  html button.other-user .other-user-image, html .button.other-user .other-user-image {
    background-image: url("../../../images/icon-newuser-light@2x.png");
    background-size: 80px 60px;
  }
 }
-html button.other-user:hover .other-user-image {
+html button.other-user:hover .other-user-image, html .button.other-user:hover .other-user-image {
  background-image: url("../../../images/icon-newuser-light-hover.png");
 }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
-  html button.other-user:hover .other-user-image {
+  html button.other-user:hover .other-user-image, html .button.other-user:hover .other-user-image {
    background-image: url("../../../images/icon-newuser-light-hover@2x.png");
    background-size: 80px 60px;
  }
@@ -529,5 +557,41 @@ html #qrcode svg rect.color {
 html #qrcode svg rect.bg-color {
  fill: #f5f5f5;
 }
+form .field.check-box label {
+  color: #282828;
+}
+form ul#passwordcomplexity li i {
+  color: #50CA3D;
+}
+form ul#passwordcomplexity li.invalid i {
+  color: #F20D6B;
+}
+
+.login-profile .profile-image, form button.user-selection .profile-image {
+  background-image: url("../../../images/icon-user-light.png");
+}
+@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
+  .login-profile .profile-image, form button.user-selection .profile-image {
+    background-image: url("../../../images/icon-user-light@2x.png");
+    background-size: 80px 80px;
+  }
+}
+.login-profile:hover .profile-image, form button.user-selection:hover .profile-image {
+  background-image: url("../../../images/icon-user-light-hover.png");
+}
+@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
+  .login-profile:hover .profile-image, form button.user-selection:hover .profile-image {
+    background-image: url("../../../images/icon-user-light-hover@2x.png");
+    background-size: 80px 80px;
+  }
+}
+
+.free-tier {
+  border: 2px solid #F20D6B;
+}
+
+.error {
+  color: #F20D6B;
+}

 /*# sourceMappingURL=light.css.map */
--- a/internal/ui/login/static/resources/themes/zitadel/css/light.css.map
+++ b/internal/ui/login/static/resources/themes/zitadel/css/light.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/variables.scss","../../scss/light.scss"],"names":[],"mappings":"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","file":"light.css"}
+{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/variables.scss","../../scss/light.scss"],"names":[],"mappings":"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","file":"light.css"}