/* ************* WEB FONTS **************** */
/* vietnamese */
@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/publicsans/v14/ijwRs572Xtc6ZYQws9YVwnNJfJ7QwOk1Fig.woff2)
    format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1,
    U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329,
    U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/publicsans/v14/ijwRs572Xtc6ZYQws9YVwnNIfJ7QwOk1Fig.woff2)
    format("woff2");
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF,
    U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/publicsans/v14/ijwRs572Xtc6ZYQws9YVwnNGfJ7QwOk1.woff2)
    format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
    U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* vietnamese */
@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/publicsans/v14/ijwRs572Xtc6ZYQws9YVwnNJfJ7QwOk1Fig.woff2)
    format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1,
    U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329,
    U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/publicsans/v14/ijwRs572Xtc6ZYQws9YVwnNIfJ7QwOk1Fig.woff2)
    format("woff2");
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF,
    U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/publicsans/v14/ijwRs572Xtc6ZYQws9YVwnNGfJ7QwOk1.woff2)
    format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
    U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* vietnamese */
@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/publicsans/v14/ijwRs572Xtc6ZYQws9YVwnNJfJ7QwOk1Fig.woff2)
    format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1,
    U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329,
    U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/publicsans/v14/ijwRs572Xtc6ZYQws9YVwnNIfJ7QwOk1Fig.woff2)
    format("woff2");
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF,
    U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/publicsans/v14/ijwRs572Xtc6ZYQws9YVwnNGfJ7QwOk1.woff2)
    format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
    U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ***************** CUSTOM SENSYS STYLES ************ */
:root {
  font-size: 62.5%;
  --primary-600: #3f3ed7;
  --primary-500: #5756fb;
  --primary-200: #bcbbfe;
  --secondary-200: #cad9f2;
  --secondary-400: #495990;
  --secondary-500-main: #222f59;
  --bg-color: white;
  --input-height: 33px;
  --input-bg-color: #d5e5fe66;
  --color-grey-300: #ccc;
}

.parent-wrapper {
  display: flex;
  overflow: hidden;
  height: 100vh;
  width: 100%;
}

.login-pf-page {
  flex: 0 0 64.15vw;
  padding: 0 12vw;
  border-right: 1px solid rgba(202, 217, 242, 0.4);
}

.right-background-wrapper {
  flex: 1;
  overflow: hidden;
  background-color: rgba(202, 217, 242, 0.2);
}

.image-wrapper .background-image {
  position: relative;
  height: 100%;
  right: 0;
  top: 10vh;
}

.image-wrapper {
  padding-left: 9.3vw;
  height: 100vh;
}

.image-fade {
  pointer-events: none;
  position: absolute;
  bottom: 0;
  height: 230px;
  width: -webkit-fill-available;
  background: linear-gradient(180deg, rgba(244, 247, 252, 0) 0%, #f4f7fc 100%);
  z-index: 2;
}

/* FOOTER */
.footer {
  display: flex;
  gap: 4px;
  position: absolute;
  padding-bottom: 2.08vw;
  bottom: 0;
}

.footer-item {
  display: flex;
  align-items: center;
  padding: 2px 12px 2px 0;
  letter-spacing: 0.5px;
}

a,
a:visited,
a:hover,
a:focus {
  color: #222f59 !important;
  text-decoration: none;
}

.hr-with-text {
  width: 100%;
  text-align: center;
  border-top: 1px solid #cad9f299;
  line-height: 0.1em;
  margin: 25px 0;
  position: relative;
}

.hr-with-text span {
  background: #fff;
  padding: 0 10px;
  font-size: 13px;
  color: #222f59;
  position: relative;
  z-index: 1;
}

.kc-footer-link {
  cursor: pointer;
  color: #222f59;
  transition: background-color 0.2s ease;
  border-radius: 2px;
}

.kc-copyright {
  color: rgb(155, 155, 155);
}

.kc-footer-link:hover {
  background-color: #e0e0e0;
}

.kc-footer-link:focus-within {
  background-color: rgb(238 238 238);
}

.footer-item p {
  display: flex;
  align-items: center;
  margin: 0;
  gap: 0.4rem;
}

.icon-gen-external {
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url(../img/icon-gen-external.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.border-bottom {
  border-bottom: 1px solid #222f59;
}

.login-pf body {
  font-family: "Public Sans", sans-serif;
  background: var(--bg-color);
  background-repeat: no-repeat;
  background-position: center 0%;
}

.login-pf-page-header-custom .kc-logo-text {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='57' viewBox='0 0 220 57' fill='none'%3E%3Cg clip-path='url(%23clip0_13553_118265)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M38.2477 8.08346C41.2259 2.72279 45.9909 -8.46237e-05 52.4152 -8.46237e-05V-0.0851746C57.5206 -0.0851746 61.4773 1.70171 64.1576 5.1904C66.7954 8.63654 68.1143 13.6994 68.1143 20.2513L67.9441 23.6549C67.9016 24.1229 67.5612 24.4633 67.0932 24.4633H41.4386C42.247 32.8021 46.4589 36.8864 54.3297 36.8864C57.6057 36.8864 60.7115 35.8228 63.562 33.7806C63.7322 33.653 63.9023 33.6104 64.0725 33.6104C64.3278 33.6104 64.5831 33.7381 64.7532 33.9508L67.1358 37.1417C67.391 37.5246 67.3059 38.0351 66.9656 38.3329C63.2216 41.3111 58.7119 42.8427 53.5214 42.8427C47.6927 42.8427 43.0979 41.0133 39.8219 37.3119C36.5885 33.653 34.9292 28.4625 34.9292 21.9106C34.9292 16.5499 36.0779 11.9125 38.2477 8.08346ZM57.9886 7.61546C56.3293 6.5093 54.3297 5.91367 52.0748 5.91367L52.1174 5.87112C47.6502 5.87112 44.5869 7.95582 42.7575 12.2954C42.1193 13.827 41.6513 16.0819 41.4386 18.9324H61.9453C61.9027 16.0394 61.6475 13.7845 61.1795 12.2103C60.6689 10.2533 59.6479 8.76418 57.9886 7.61546Z' fill='%23222F59'/%3E%3Cpath d='M9.74309 14.9748C11.0194 15.9959 13.2318 17.0595 16.3376 18.0806V18.1232C20.8899 19.7399 24.0382 21.3991 25.9102 23.2711C27.8247 25.1856 28.8032 27.7383 28.8032 30.8867C28.8032 34.7157 27.4418 37.6938 24.804 39.8211C22.2088 41.8632 18.7201 42.9269 13.9125 42.9269C9.10492 42.9269 4.5526 41.608 0.383196 39.0553C0.0428366 38.8426 -0.127343 38.3746 0.0428366 37.9917L1.87227 33.9073C1.95736 33.6946 2.17008 33.5244 2.42535 33.4393H2.63808C2.8508 33.4393 3.02098 33.5244 3.14862 33.6095C6.38204 35.907 9.87072 37.0557 13.5721 37.0557C16.5077 37.0557 18.7201 36.5026 20.2517 35.4815C21.6982 34.503 22.3789 33.099 22.3789 31.1845C22.3789 29.5678 21.7408 28.2489 20.507 27.1427C19.1455 25.9514 16.763 24.8027 13.4445 23.654C9.19001 22.2075 6.2544 20.6333 4.46751 18.8464C2.63808 17.017 1.70209 14.5494 1.70209 11.5712C1.70209 7.95491 2.97844 5.1044 5.44605 3.06224C7.91366 1.06263 11.3173 0.0415463 15.5718 0.0415463C19.1881 0.0415463 22.9746 1.02008 26.8036 2.9346C27.1865 3.14733 27.3567 3.61532 27.1865 4.04077L25.3571 8.04C25.272 8.25273 25.0593 8.42291 24.8466 8.508H24.5913C24.4211 8.508 24.2935 8.46545 24.1658 8.38036C21.3153 6.76365 18.4223 5.9553 15.5718 5.9553C13.1041 5.9553 11.2322 6.46584 9.91327 7.48692C8.63692 8.46545 8.04129 9.82689 8.04129 11.5712C8.04129 12.8901 8.59438 14.0388 9.74309 14.9748Z' fill='%23222F59'/%3E%3Cpath d='M92.8758 0.340691C87.43 0.340691 83.3457 1.82976 80.6653 4.76537C78.0276 7.65843 76.7087 12.1256 76.7087 18.0394V41.7369C76.7087 42.2049 77.0916 42.5878 77.5596 42.5878H82.197C82.665 42.5878 83.0479 42.2049 83.0479 41.7369V18.0394C83.0479 10.126 86.2813 6.29699 92.8758 6.29699C99.4702 6.29699 102.619 10.126 102.619 18.0394V41.7369C102.619 42.2049 103.001 42.5878 103.469 42.5878H108.107C108.575 42.5878 108.958 42.2049 108.958 41.7369V18.0394C108.958 12.0831 107.639 7.61588 105.044 4.72282C102.406 1.82976 98.3215 0.340691 92.8758 0.340691Z' fill='%23222F59'/%3E%3Cpath d='M126.784 14.9748C128.061 15.9959 130.273 17.0595 133.379 18.0806V18.1232C137.974 19.7399 141.037 21.3566 142.951 23.2711C144.866 25.1856 145.844 27.7383 145.844 30.8867C145.844 34.7157 144.483 37.6938 141.845 39.8211C139.25 41.8632 135.761 42.9269 130.954 42.9269C126.146 42.9269 121.594 41.608 117.424 39.0553C117.084 38.8426 116.914 38.3746 117.084 37.9917L118.914 33.9073C118.999 33.6946 119.211 33.5244 119.467 33.4393H119.679C119.892 33.4393 120.062 33.5244 120.19 33.6095C123.423 35.907 126.912 37.0557 130.613 37.0557C133.549 37.0557 135.761 36.5026 137.293 35.4815C138.739 34.503 139.42 33.099 139.42 31.1845C139.42 29.5678 138.782 28.2489 137.548 27.1427C136.187 25.9514 133.804 24.8027 130.486 23.654C126.231 22.2075 123.296 20.6333 121.509 18.8464C119.679 17.017 118.743 14.5494 118.743 11.5712C118.743 7.95491 120.02 5.1044 122.487 3.06224C124.955 1.06263 128.359 0.0415463 132.613 0.0415463C136.229 0.0415463 140.016 1.02008 143.845 2.9346C144.228 3.14733 144.398 3.61532 144.228 4.04077L142.398 8.04C142.313 8.25273 142.101 8.42291 141.888 8.508H141.633C141.462 8.508 141.335 8.46545 141.207 8.38036C138.357 6.76365 135.464 5.9553 132.613 5.9553C130.145 5.9553 128.273 6.46584 126.955 7.48692C125.678 8.46545 125.083 9.82689 125.083 11.5712C125.083 12.8901 125.636 14.0388 126.784 14.9748Z' fill='%23222F59'/%3E%3Cpath d='M186.305 0.127716H181.284C180.944 0.127716 180.646 0.340441 180.476 0.638256L168.989 28.9732L157.161 0.638256C157.034 0.340441 156.736 0.127716 156.396 0.127716H151.29C150.992 0.127716 150.737 0.255351 150.567 0.510621C150.397 0.765891 150.397 1.06371 150.482 1.31898L165.67 37.0567L158.395 55.0958C158.31 55.3511 158.31 55.6489 158.48 55.9042C158.65 56.1169 158.906 56.2871 159.204 56.2871H163.969C164.309 56.2871 164.607 56.0743 164.734 55.7765L187.071 1.27643C187.198 1.02116 187.156 0.723346 186.985 0.468076C186.815 0.212806 186.56 0.0851715 186.262 0.0851715L186.305 0.127716Z' fill='%23222F59'/%3E%3Cpath d='M207.577 18.0806C212.129 19.6973 215.278 21.3566 217.15 23.2286V23.2711C219.064 25.1856 220.043 27.7383 220.043 30.8867C220.043 34.7157 218.681 37.6938 216.043 39.8211C213.448 41.8632 209.96 42.9269 205.152 42.9269C200.344 42.9269 195.792 41.608 191.623 39.0553C191.282 38.8426 191.112 38.3746 191.282 37.9917L193.112 33.9073C193.197 33.6946 193.41 33.5244 193.665 33.4393H193.878C194.09 33.4393 194.26 33.5244 194.388 33.6095C197.621 35.907 201.11 37.0557 204.812 37.0557C207.747 37.0557 209.96 36.5026 211.491 35.4815C212.938 34.503 213.618 33.099 213.618 31.1845C213.618 29.5678 212.98 28.2489 211.746 27.1427C210.385 25.9514 208.002 24.8027 204.684 23.654C200.429 22.2075 197.494 20.6333 195.707 18.8464C193.878 17.017 192.942 14.5494 192.942 11.5712C192.942 7.95491 194.218 5.1044 196.685 3.06224C199.153 1.06263 202.557 0.0415463 206.811 0.0415463C210.428 0.0415463 214.214 1.02008 218.043 2.9346C218.426 3.14733 218.596 3.61532 218.426 4.04077L216.597 8.04C216.511 8.25273 216.299 8.42291 216.086 8.508H215.831C215.661 8.508 215.533 8.46545 215.405 8.38036C212.555 6.76365 209.662 5.9553 206.811 5.9553C204.344 5.9553 202.472 6.46584 201.153 7.48692C199.876 8.46545 199.281 9.82689 199.281 11.5712C199.281 12.8901 199.834 14.0388 200.983 14.9748C202.259 15.9959 204.471 17.0595 207.577 18.0806Z' fill='%23222F59'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_13553_118265'%3E%3Crect width='220' height='56.2444' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center 0%;
  background-size: contain;
  height: 31px;
  width: 120px;
  margin: 0;
}

#kc-form-custom div.form-group {
  margin-bottom: 12px;
}

#kc-form-custom div.form-group:last-of-type {
  margin-bottom: 0px;
}

.kc-form-options .checkbox {
  margin-bottom: 0px;
}

.pf-c-form__label-custom,
#rememberMe + span {
  color: var(--secondary-400);
  font-size: 13px;
  font-weight: 400;
}

#rememberMe {
  top: 1px;
}

.pf-c-form__label-custom {
  padding-bottom: 4px;
}

.pf-c-form-control {
  border-radius: 2px;
  border: 1px solid var(--secondary-200);
  background: var(--bg-color);
  height: var(--input-height) !important;
  font-size: 15px;
  padding: 0 8px;
}

.pf-c-form-control:focus {
  border: 1px solid var(--secondary-400);
  outline: none;
}

.pf-c-form-control:not(:focus) {
  border: 1px solid var(--secondary-200);
}

.pf-c-form-control::placeholder {
  color: var(--color-grey-300);
  font-size: 15px;
  font-weight: 400;
}

.password-input-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.password-input-label a {
  font-size: 12px;
  color: var(--secondary-400);
  font-weight: 500;
  font-size: 12px;
  position: relative;
}

.password-input-label a:hover {
  color: var(--secondary-400);
  text-decoration: none;
}

.password-input-label a::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background: var(--secondary-400);
  left: 0;
  bottom: -2px;
}

.pf-c-button.pf-m-primary {
  height: var(--input-height);
  border-radius: 2px;
  background: var(--primary-200);
  font-size: 17px;
  font-weight: 400;
}

.pf-c-button.pf-m-primary:hover {
  background-color: var(--primary-600) !important;
}

.pf-c-form-control[aria-invalid="true"] {
  background-image: none;
}

.input-group-append {
  position: relative;
}

.input-group-append input {
  padding-right: 40px;
}

.input-group-text {
  display: none;
  position: absolute;
  top: 11px;
  right: 10px;
  cursor: pointer;
}

.input-group-text .eye-slash,
.input-group-text .eye {
  display: none;
}

/* ***************** INHEREIT FROM KEYCLOCK THEMES ************ */

textarea.pf-c-form-control {
  height: auto;
}

.pf-c-alert__title {
  font-size: var(--pf-global--FontSize--xs);
}

p.instruction {
  margin: 5px 0;
}

h1#kc-page-title {
  font-weight: 500;
  letter-spacing: 0.5px;
  font-size: 24px;
  color: var(--secondary-500-main);
  text-align: left;
}

#kc-locale ul {
  background-color: var(--pf-global--BackgroundColor--100);
  display: none;
  top: 20px;
  min-width: 100px;
  padding: 0;
}

#kc-locale-dropdown {
  display: inline-block;
}

#kc-locale-dropdown:hover ul {
  display: block;
}

#kc-locale-dropdown a {
  color: var(--pf-global--Color--200);
  text-align: right;
  font-size: var(--pf-global--FontSize--sm);
}

a#kc-current-locale-link::after {
  content: "\2c5";
  margin-left: var(--pf-global--spacer--xs);
}

.login-pf .container {
  padding-top: 40px;
}

#kc-logo {
  width: 100%;
}

div.kc-logo-text span {
  display: none;
}

#kc-header {
  padding: 0 5.5vw;
  border: 1px solid rgba(202, 217, 242, 0.4);
  border-bottom: none;
  border-top: none;
}

#kc-header-wrapper {
  font-size: 29px;
  text-transform: uppercase;
  letter-spacing: 3px;
  line-height: 1.2em;
  padding: 3.33vw 0 0;
  white-space: normal;
}

#kc-content {
  width: 100%;
  padding-top: 16px;
}

#kc-attempted-username {
  font-size: 20px;
  font-family: inherit;
  font-weight: normal;
  padding-right: 10px;
}

#kc-username {
  text-align: center;
  margin-bottom: -10px;
}

#kc-webauthn-settings-form {
  padding-top: 8px;
}

#kc-form-webauthn .select-auth-box-parent {
  pointer-events: none;
}

#kc-form-webauthn .select-auth-box-desc {
  color: var(--pf-global--palette--black-600);
}

#kc-form-webauthn .select-auth-box-headline {
  color: var(--pf-global--Color--300);
}

#kc-form-webauthn .select-auth-box-icon {
  flex: 0 0 3em;
}

#kc-form-webauthn .select-auth-box-icon-properties {
  margin-top: 10px;
  font-size: 1.8em;
}

#kc-form-webauthn .select-auth-box-icon-properties.unknown-transport-class {
  margin-top: 3px;
}

#kc-form-webauthn .pf-l-stack__item {
  margin: -1px 0;
}

#kc-content-wrapper {
  margin-top: 0;
}

#kc-form-wrapper {
  margin-top: 10px;
}

#kc-info {
  margin: 20px -40px -30px;
}

#kc-info-wrapper {
  font-size: 13px;
  padding: 15px 35px;
  background-color: transparent !important;
}

#kc-form-options span {
  display: block;
}

#kc-form-options .checkbox {
  margin-bottom: 0;
  color: #72767b;
}

#kc-terms-text {
  margin-bottom: 20px;
}

#kc-registration {
  margin-bottom: 0;
}

/* TOTP */

.subtitle {
  text-align: right;
  margin-top: 30px;
  color: #909090;
}

.required {
  color: var(--pf-global--danger-color--200);
}

ol#kc-totp-settings {
  margin: 0;
  padding-left: 20px;
}

ul#kc-totp-supported-apps {
  margin-bottom: 10px;
}

#kc-totp-secret-qr-code {
  max-width: 150px;
  max-height: 150px;
}

#kc-totp-secret-key {
  background-color: #fff;
  color: #333333;
  font-size: 16px;
  padding: 10px 0;
}

/* OAuth */

#kc-oauth h3 {
  margin-top: 0;
}

#kc-oauth ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

#kc-oauth ul li {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 12px;
  padding: 10px 0;
}

#kc-oauth ul li:first-of-type {
  border-top: 0;
}

#kc-oauth .kc-role {
  display: inline-block;
  width: 50%;
}

/* Code */
#kc-code textarea {
  width: 100%;
  height: 8em;
}

/* Social */
.kc-social-links {
  margin-top: 20px;
}

.kc-social-provider-logo {
  visibility: hidden;
}

.pf-c-button {
  color: #222f59;
  border-radius: 2px;
  border: solid var(--pf-global--BorderWidth--sm);
  border-color: rgba(230, 230, 230, 0.5);
}

.pf-c-button:after {
  border: none;
}

.pf-c-button:hover {
  background: #eeeeee;
}

.kc-social-gray {
  color: var(--pf-global--Color--200);
}

.kc-social-item {
  margin-bottom: var(--pf-global--spacer--sm);
  font-size: 15px;
  text-align: center;
  border-color: rgba(202, 217, 242, 0.6) !important;
  color: #222f59 !important;
}

.kc-social-provider-name {
  position: relative;
  top: 3px;
}

.kc-social-icon-text {
  left: -15px;
}

.kc-social-grid {
  display: grid;
  grid-column-gap: 10px;
  grid-row-gap: 5px;
  grid-column-end: span 6;
  --pf-l-grid__item--GridColumnEnd: span 6;
}

.kc-social-grid .kc-social-icon-text {
  left: -10px;
}

.kc-login-tooltip {
  position: relative;
  display: inline-block;
}

.kc-social-section {
  text-align: center;
}

.kc-social-section hr {
  margin-bottom: 10px;
}

.kc-login-tooltip .kc-tooltip-text {
  top: -3px;
  left: 160%;
  background-color: black;
  visibility: hidden;
  color: #fff;

  min-width: 130px;
  text-align: center;
  border-radius: 2px;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.6);
  padding: 5px;

  position: absolute;
  opacity: 0;
  transition: opacity 0.5s;
}

/* Show tooltip */
.kc-login-tooltip:hover .kc-tooltip-text {
  visibility: visible;
  opacity: 0.7;
}

/* Arrow for tooltip */
.kc-login-tooltip .kc-tooltip-text::after {
  content: " ";
  position: absolute;
  top: 15px;
  right: 100%;
  margin-top: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent black transparent transparent;
}

@media (min-width: 768px) {
  #kc-container-wrapper {
    position: absolute;
    width: 100%;
  }

  .login-pf .container {
    padding-right: 80px;
  }

  #kc-locale {
    position: relative;
    text-align: right;
    z-index: 9999;
  }

  .login-pf-header {
    margin: 0px !important;
  }
}

@media (max-width: 767px) {
  .login-pf body {
    background: white;
  }

  .login-pf-page {
    flex: 100vw;
  }

  .right-background-wrapper,
  .footer {
    display: none;
  }

  #kc-header {
    padding-left: 15px;
    padding-right: 15px;
    float: none;
    text-align: left;
  }

  #kc-header-wrapper {
    font-size: 16px;
    font-weight: bold;
    color: #72767b;
    letter-spacing: 0;
  }

  div.kc-logo-text {
    margin: 0;
    width: 150px;
    height: 32px;
    background-size: 100%;
  }

  #kc-form {
    float: none;
  }

  #kc-info-wrapper {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    background-color: transparent !important;
  }

  .login-pf .container {
    padding-top: 15px;
    padding-bottom: 15px;
  }

  #kc-locale {
    position: absolute;
    width: 200px;
    top: 20px;
    right: 20px;
    text-align: right;
    z-index: 9999;
  }
}

@media (min-height: 646px) {
  #kc-container-wrapper {
    bottom: 12%;
  }
}

@media (max-height: 645px) {
  #kc-container-wrapper {
    padding-top: 50px;
    top: 20%;
  }
}

.card-pf-custom form.form-actions .btn {
  float: right;
  margin-left: 10px;
}

#kc-form-buttons {
  margin-top: 20px;
}

.login-pf-page .login-pf-brand {
  margin-top: 20px;
  max-width: 360px;
  width: 40%;
}

.select-auth-box-arrow {
  display: flex;
  align-items: center;
  margin-right: 2rem;
}

.select-auth-box-icon {
  display: flex;
  flex: 0 0 2em;
  justify-content: center;
  margin-right: 1rem;
  margin-left: 3rem;
}

.select-auth-box-parent {
  border-top: 1px solid var(--pf-global--palette--black-200);
  padding-top: 1rem;
  padding-bottom: 1rem;
  cursor: pointer;
}

.select-auth-box-parent:hover {
  background-color: #f7f8f8;
}

.select-auth-container {
  padding-bottom: 0px !important;
}

.select-auth-box-headline {
  font-size: var(--pf-global--FontSize--md);
  color: var(--pf-global--primary-color--100);
  font-weight: bold;
}

.select-auth-box-desc {
  font-size: var(--pf-global--FontSize--sm);
}

.select-auth-box-paragraph {
  text-align: center;
  font-size: var(--pf-global--FontSize--md);
  margin-bottom: 5px;
}

.login-pf-header,
#kc-page-title {
  margin-top: 10px;
  margin-bottom: 0;
}

.card-pf-custom {
  margin: 0 auto;
  padding: 2vh 5.5vw;
  padding-top: 64px !important;
  border-radius: 2px;
  border: 1px solid rgba(202, 217, 242, 0.4);
  border-bottom: none;
  border-top: none;
  height: 100%;
  overflow: scroll;

  &::-webkit-scrollbar {
    display: none;
  }
}

/*phone*/
@media (max-width: 767px) {
  .login-pf-page .card-pf-custom {
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    padding-top: 0;
    border-top: 0;
    box-shadow: 0 0;
  }

  .kc-social-grid {
    grid-column-end: 12;
    --pf-l-grid__item--GridColumnEnd: span 12;
  }

  .kc-social-grid .kc-social-icon-text {
    left: -15px;
  }
}

.login-pf-page .login-pf-signup {
  font-size: 15px;
  color: #72767b;
}

#kc-content-wrapper .row {
  margin-left: 0;
  margin-right: 0;
}

.login-pf-page.login-pf-page-accounts {
  margin-left: auto;
  margin-right: auto;
}

.login-pf-page .btn-primary {
  margin-top: 0;
}

.login-pf-page .list-view-pf .list-group-item {
  border-bottom: 1px solid #ededed;
}

.login-pf-page .list-view-pf-description {
  width: 100%;
}

#kc-form-login div.form-group:last-of-type,
#kc-register-form div.form-group:last-of-type,
#kc-update-profile-form div.form-group:last-of-type,
#kc-update-email-form div.form-group:last-of-type {
  margin-bottom: 0px;
}

.no-bottom-margin {
  margin-bottom: 0;
}

#kc-back {
  margin-top: 5px;
}

/* Recovery codes */
.kc-recovery-codes-warning {
  margin-bottom: 32px;
}

.kc-recovery-codes-warning .pf-c-alert__description p {
  font-size: 0.875rem;
}

.kc-recovery-codes-list {
  list-style: none;
  columns: 2;
  margin: 16px 0;
  padding: 16px 16px 8px 16px;
  border: 1px solid #d2d2d2;
}

.kc-recovery-codes-list li {
  margin-bottom: 8px;
  font-size: 11px;
}

.kc-recovery-codes-list li span {
  color: #6a6e73;
  width: 16px;
  text-align: right;
  display: inline-block;
  margin-right: 1px;
}

.kc-recovery-codes-actions {
  margin-bottom: 24px;
}

.kc-recovery-codes-actions button {
  padding-left: 0;
}

.kc-recovery-codes-actions button i {
  margin-right: 8px;
}

.kc-recovery-codes-confirmation {
  align-items: baseline;
  margin-bottom: 16px;
}

/* End Recovery codes */