/* Those Css Are Copied from orginal azure template */

@charset "UTF-8";
/* Container and Panel */
.self_asserted_container .row .panel-default {
  padding: 40px 30px;
  margin: auto;
  height: 100%;
  background-color: #fff;
}

.self_asserted_container .row .panel-default .panel-body {
  margin: 0 auto;
  max-width: 380px;
  padding: 0;
}

/* Logo and Branding */
.self_asserted_container .panel-body img.companyLogo {
  display: block;
  margin: auto;
  height: 60px;
}

.self_asserted_container .panel-body .branding h1,
.self_asserted_container .panel-body h3 {
  font-size: 1.5em;
  color: #505050;
}

.self_asserted_container .panel-body h3 {
  margin: 5px 0 30px;
}

/* Intro and Error Messages */
.self_asserted_container .panel-body .intro {
  display: none;
  text-align: left;
  margin-top: 2rem;
}

.self_asserted_container .panel-body #api #attributeVerification .pageLevel,
.self_asserted_container .panel-body #api #attributeVerification .error {
  color: #b00;
  text-align: left;
}

.self_asserted_container .panel-body #api #attributeVerification .error {
  margin-bottom: 5px;
}

.errorText {
  color: #a61e0c;
  border: none;
  padding: 0;
  background: none;
}

/* Verification Modal */
.self_asserted_container .panel-body #api .verifying-modal {
  display: none;
  margin-top: 10px;
}

/* Attribute List */
#attributeVerification #attributeList ul {
  display: flex;
  flex-direction: column;
  width: 100%;
}

#attributeVerification #attributeList ul li input {
  width: 100%;
}

#attributeVerification #attributeList ul li input:invalid {
  outline: none;
}

#attributeVerification #attributeList ul li .helpText {
  display: none;
  color: #a61e0c;
  text-align: justify;
}

/* Email Verification */
#attributeVerification #attributeList ul li #email_success.verificationSuccessText,
#attributeVerification #attributeList ul li #email_info,
#attributeVerification #attributeList ul li .attrEntry.validate #email_fail_retry,
#attributeVerification #attributeList ul li .attrEntry.validate #email_fail_server,
#attributeVerification #attributeList ul li #email_fail_no_retry {
  float: left;
}

#attributeVerification #attributeList ul li .attrEntry.validate #email_fail_server {
  text-align: left;
}

div#email_intro,
div#email_info {
  width: 100%;
  text-align: left;
}

/* Checkbox and Radio Inputs */
#attributeVerification #attributeList ul li input[type='checkbox'],
#attributeVerification #attributeList ul li input[type='radio'] {
  width: 14px !important;
  height: 14px !important;
  min-width: 14px;
  display: inline-block;
  -webkit-appearance: none;
  appearance: none;
  outline: none;
  user-select: none;
  padding: 0;
}

#attributeVerification #attributeList ul li input[type='checkbox'] {
  position: relative;
  border: none;
}

#attributeVerification #attributeList ul li input[type='checkbox']::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 14px;
  height: 14px;
  border: 1px solid #ced4da;
  border-radius: 2px;
  box-sizing: border-box;
  text-indent: 0;
}

#attributeVerification #attributeList ul li input[type='checkbox']:checked::after {
  content: '✓';
  position: absolute;
  top: 0;
  left: 0;
  width: 14px;
  height: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  text-indent: 0;
  color: #fff;
  background-color: var(--color-primary);
  border: 1px solid var(--color-primary);
  border-radius: 2px;
}

#attributeVerification #attributeList ul li input[type='checkbox']:focus {
  box-shadow: 0 0 0 2px var(--color-primary-light);
}

#attributeVerification #attributeList ul li input:focus {
  box-shadow: 0 0 0 1px var(--color-primary-light);
}

#attributeVerification #attributeList ul li input[type='radio'] {
  width: 20px;
  height: 20px;
  border: 1px solid #dedede;
  border-radius: 50%;
  background-color: #fff;
}

#attributeVerification #attributeList ul li input[type='radio']:checked {
  background-color: #296ec6;
  border: 1px solid #296ec6;
}

/* Checkbox and Radio Labels */
#attributeList ul li input[type='checkbox'] + label,
#attributeList ul li input[type='radio'] + label {
  display: inline-block;
  color: #112a46;
  font-size: 16px;
  margin-left: 8px;
  margin-bottom: 0;
  font-weight: 400;
  line-height: 20px;
}

/* Select and Verification Info */
.attrEntry .verificationInfoText {
  margin-bottom: 5px;
}

#attributeList ul li .attrEntry select:hover {
  border-color: #888;
}

#attributeList ul li .attrEntry select option {
  font-weight: 400;
}

/* Disclaimer */
.disclaimer-container {
  text-align: left;
  font-size: 10px;
}

.disclaimer-container .disclaimer-link {
  display: block;
  width: fit-content;
}

.disclaimer-container-page-level {
  margin-top: 10px;
}

/* Buttons and QR Code */
#attributeList ul li .buttons.verify label {
  float: left;
}

.qrCodeControlContent img,
#totpQrCodeControl-picture {
  margin: 1em auto;
  display: block;
}

.qrCodeInfo {
  text-align: left;
}

/* Store Icons */
.googleStoreIconControlContent,
.appStoreIconControlContent {
  display: inline-block;
  width: 50%;
}

.appStoreIconControlContent {
  margin-bottom: 10px;
}

/* Focus States */
a:focus {
  box-shadow: 0 0 0 1px var(--color-primary-light);
}

/* Required Field Indicator */
span.required {
  position: absolute;
  right: 5%;
  font-size: 1.4em;
  color: red;
  margin-top: 0.5em;
}

li.DateTimeDropdown span.required {
  margin-top: -2em;
}

/* Responsive Design */
@media screen and (max-width: 320px) {
  .self_asserted_container .row .panel-default {
    padding: 20px 15px;
  }
  span.required {
    right: 4%;
  }
}

/*# sourceMappingURL=Form.css.map */
