/****************************************
  ==== RESETS
****************************************/

input, select, textarea, button {
  outline: none; -webkit-appearance: none;
}
select {
  -webkit-appearance: auto; -moz-appearance: auto; appearance: auto;
}
button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"]::-moz-focus-inner {
  padding: 0;
}

/****************************************
  ==== WRAPPERS
****************************************/

.primary-field {
  display: -webkit-flex; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; align-self: stretch;
}
.secondary-field {
  display: -webkit-flex; display: flex; justify-content: center; align-items: flex-start; gap: 20px; align-self: stretch; font-size: 1.4em; line-height: 1.35714; color: #1f2b3f;
}
.secondary-field .action-wrap {
  flex: 1;
}
.secondary-field .action-wrap.align-left {
  text-align: left;
}
.secondary-field .action-wrap.align-right {
  text-align: right;
}

/****************************************
  ==== INPUTS, TEXTAREAS & LABELS
****************************************/

input[type="text"], input[type="tel"], input[type="email"], input[type="url"], input[type="number"], input[type="password"], input[type="search"], select, textarea {
  width: 100%; height: 2.286em; font-size: 1.4em; display: block; line-height: 1; padding: 0 12px; border: #62737a 1px solid; outline-width: 0; outline: none; background: #fff; resize: vertical; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
}
textarea {
  height: 150px;
}
input[type="text"]:focus, input[type="tel"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, select:focus, textarea:focus,
input[type="text"]:active, input[type="tel"]:active, input[type="email"]:active, input[type="url"]:active, input[type="number"]:active, input[type="password"]:active, input[type="search"]:active, select:active, textarea:active {
  -webkit-box-shadow: 0 0 0 2px #fff, 0 0 0 4px #2666f1; -moz-box-shadow: 0 0 0 2px #fff, 0 0 0 4px #2666f1; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #2666f1;
}
input[type="text"]:hover, input[type="tel"]:hover, input[type="email"]:hover, input[type="url"]:hover, input[type="number"]:hover, input[type="password"]:hover, input[type="search"]:hover, select:hover, textarea:hover {
  -webkit-box-shadow: 0px 0px 0px 3px rgba(38, 102, 241, 0.20); -moz-box-shadow: 0px 0px 0px 3px rgba(38, 102, 241, 0.20); box-shadow: 0px 0px 0px 3px rgba(38, 102, 241, 0.20);
}
input[type="text"].error, input[type="tel"].error, input[type="email"].error, input[type="url"].error, input[type="number"].error, input[type="password"].error, input[type="search"].error, textarea.error {
  border-color: #f0134c !important;
}
input[type="text"]:disabled, input[type="tel"]:disabled, input[type="email"]:disabled, input[type="url"]:disabled, input[type="number"]:disabled, input[type="password"]:disabled, input[type="search"]:disabled, select:disabled, textarea:disabled {
  cursor: not-allowed; border-color: #e8e9ec; background-color: #f4f5f6;
}
input[type="text"]::placeholder, input[type="tel"]::placeholder, input[type="email"]::placeholder, input[type="url"]::placeholder, input[type="number"]::placeholder, input[type="password"]::placeholder, input[type="search"]::placeholder, select::placeholder, textarea::placeholder {
  color: #62737a;
}

/****************************************
  ==== FORM LABELS & MESSAGES
****************************************/

label {
  display: block; margin: 0; cursor: pointer; font-weight: 700; text-align: left; font-size: 1.6em; line-height: 1.5;
}
label .info-icon {
  position: relative; top: 3px;
}

/****************************************
  ==== CHECKBOXES
****************************************/

input[type="checkbox"]:not(:checked), input[type="checkbox"]:checked {
  position: absolute; left: -9999px;
}
input[type="checkbox"]:not(:checked) + label, input[type="checkbox"]:checked + label {
  position: relative; padding: 0 0 0 26px; margin: 0; line-height: 22px; display: inline-block; font-weight: 400; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
}
input[type="checkbox"]:not(:checked) + label:before, input[type="checkbox"]:checked + label:before {
  content: ''; width: 18px; height: 18px; position: absolute; left: 0; top: 0; border: #62737a 1px solid; background: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
}
input[type="checkbox"]:not(:checked) + label:after, input[type="checkbox"]:checked + label:after {
  content: ''; width: 20px; height: 20px; line-height: 20px; position: absolute; top: 1px; left: 1px; text-align: center; font-family: 'icons8'; font-size: 100%;
}
input[type="checkbox"]:checked + label:before {
  background-color: #2666f1; background-image: url('../images/global/checkbox/checkmark.svg'); background-size: contain; border-color: #2666f1;
}
input[type="checkbox"]:checked:focus-visible + label:before, input[type="checkbox"]:not(:checked):focus-visible + label:before {
  -webkit-box-shadow: 0 0 0 2px #fff, 0 0 0 4px #2666f1; -moz-box-shadow: 0 0 0 2px #fff, 0 0 0 4px #2666f1; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #2666f1;
}
input[type="checkbox"]:checked:active + label:before {
  background-color: #26227c; background-image: url('../images/global/checkbox/checkmark.svg'); background-size: contain; border-color: #26227c;
}
input[type="checkbox"]:not(:checked):active + label:before {
  border-color: #26227c; background-color: #c8e8fa;
}
input[type="checkbox"]:checked:hover + label:before, input[type="checkbox"]:not(:checked):hover + label:before {
  -webkit-box-shadow: 0px 0px 0px 3px rgba(38, 102, 241, 0.20); -moz-box-shadow: 0px 0px 0px 3px rgba(38, 102, 241, 0.20); box-shadow: 0px 0px 0px 3px rgba(38, 102, 241, 0.20);
}
input[type="checkbox"].error:not(:checked) + label:before {
  border-color: #f0134c;
}
input[type="checkbox"]:disabled:not(:checked) + label:before, input[type="checkbox"]:disabled:checked + label:before {
  cursor: not-allowed; border-color: #e1e2e5;
}
input[type="checkbox"]:disabled + label {
  cursor: not-allowed; color: #8e8f92; font-style: italic;
}
.secondary-field .action-wrap input[type="checkbox"]:not(:checked) + label, .secondary-field .action-wrap input[type="checkbox"]:checked + label {
  font-size: inherit; line-height: inherit;
}

/****************************************
  ==== SHOW/HIDE PWD ICON
****************************************/

.toggle-pwd {
  position: absolute !important; top: 14px; right: 14px; cursor: pointer;
}
.toggle-pwd:before {
  font-size: 200%;
}
.toggle-pwd.visible:after {
  content: ''; width: 2px; height: 20px; display: block; position: absolute; top: 0; left: 50%; margin: 0 0 0 -1px; visibility: visible; background: #5a5a5b; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg);
}
.toggle-pwd span.s, .toggle-pwd.visible span.h {
  display: block;
}
.toggle-pwd span.h, .toggle-pwd.visible span.s {
  display: none;
}

/****************************************
  ==== VALIDATION
****************************************/

.validation-summary-errors {
  align-self: start;
}
.validation-summary-errors > ul {
  list-style: none; padding-left: 0; margin: 0;
}
.validation-summary-errors > ul > li {
  color: #d04257; padding-left: 20px; font-size: 1.2em; line-height: 1.25; background-image: url('../images/global/icons/warn.svg'); background-repeat: no-repeat; background-position-y: center;
}
.field-validation-error {
  color: #d04257; font-size: 1.2em; line-height: 1.25; padding: 0 0 0 20px; background-image: url('../images/global/icons/warn.svg'); background-repeat: no-repeat; background-position-y: center;
}
