﻿.form-field-label, .Form_Control .field-label {
  color: var(--vel-color-text-default);
  font-weight: var(--vel-typography-text-100-bold-font_weight, var(--vel-typography-text-100-font_weight));
  font-size: var(--vel-typography-text-100-bold-font_size, var(--vel-typography-text-100-font_size));
  line-height: var(--vel-typography-text-100-bold-line_height, var(--vel-typography-text-100-line_height));
  font-family: var(--vel-typography-text-100-bold-font_family, var(--vel-typography-text-100-font_family));
  letter-spacing: var(--vel-typography-text-100-bold-letter_spacing, var(--vel-typography-text-100-letter_spacing));
  margin-bottom: 4px;
  display: inline-block;
}

.validation-error-message, .Form_Control_Error {
  font-weight: var(--vel-typography-text-100-font_weight);
  font-size: var(--vel-typography-text-100-font_size);
  line-height: var(--vel-typography-text-100-line_height);
  font-family: var(--vel-typography-text-100-font_family);
  letter-spacing: var(--vel-typography-text-100-letter_spacing);
  color: var(--vel-color-semantic-error-high);
  margin-top: var(--vel-fixed-spacing-01);
  display: flex;
  align-items: flex-start;
  flex-flow: row;
}

.validation-error-input:not([type=checkbox]):not(:focus):not(:hover), ._AlertRequired input:not([type=checkbox]):not(:focus):not(:hover) {
  border-color: var(--vel-color-semantic-error-high);
  background-image: url("../../../img/velocity/precolored/error.svg");
  background-position: right center;
  background-repeat: no-repeat;
  background-size: 24px;
}

.validation-field-badge-optional, .Form_Control .field-label > .badge-optional {
  margin-inline-start: var(--vel-fixed-spacing-02);
  font-weight: var(--vel-typography-text-100-font_weight);
  font-size: var(--vel-typography-text-100-font_size);
  line-height: var(--vel-typography-text-100-line_height);
  font-family: var(--vel-typography-text-100-font_family);
  letter-spacing: var(--vel-typography-text-100-letter_spacing);
}

a.file-download-link {
  display: inline-flex;
  flex-direction: row;
  margin-right: var(--vel-fixed-spacing-01);
  padding: var(--vel-fixed-spacing-02);
  align-items: center;
}

a.file-download-link::before {
  content: "";
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  background-image: url(../../../img/velocity/precolored/download.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 16px;
}

.myleaseplan-form.narrow {
  padding: 0 180px;
}

h4.form-header,
h4.open,
.myleaseplan-form .form-header {
  display: flex;
  align-items: center;
  gap: var(--vel-fixed-spacing-04);
  border-bottom: 1px solid silver;
  margin-bottom: 1rem;
}

.myleaseplan-form .field {
  margin: 0 0 1.5em;
}

/*.myleaseplan-form .field label {
    margin-bottom:.25em;
    display: flex;
    font-weight: 400;
    text-align: left;
}*/
.Form_Control {
  margin: 0 0 1em;
}

.myleaseplan-form .dataTable td .Form_Control {
  margin: 0 0;
}

.Form_Control li.field {
  margin-bottom: 0;
}

.Form_Control li.field .checkbox-inline {
  display: block;
}

.Form_Control .checkbox-inline li.field, .Form_Control .radio-inline li.field {
  margin: 0 0 0.75em;
}

.myleaseplan-form .field.inline-content,
.Form_Control.inline-content {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 1rem;
}

.Form_Control .field.inline-content .calculation-label,
.myleaseplan-form .Form_Control.inline-content label.field-label {
  width: 30%;
}

.Form_Control.radio-list.inline-content .fields.radio-inline .field {
  margin-bottom: 0;
}

.Form_Control.radio-list.inline-content .fields.radio-inline {
  display: flex;
  gap: 1rem;
}

input[type=checkbox], input[type=radio] {
  height: 16px;
  width: 16px;
  flex: 0 0 auto;
}

.check-field .input-caption {
  flex: 1 1 auto;
}

.check-field > label {
  display: flex;
  flex-direction: row;
  gap: 0.5em;
  align-items: center;
}

.check-field > label > span {
  /*display: flex;
  flex-direction: row;
  align-items: center;*/
}

.command-row {
  padding: 1rem;
  display: flex;
  flex-direction: row;
  gap: 1rem;
  justify-content: flex-start;
  align-items: center;
  /*padding-left:0;*/
}

.command-row > button.command-row-button-right {
  margin-left: auto;
}

/*.myleaseplan-form [role=button] {
    margin: 0 1em 1em 0
}*/
/*.myleaseplan-form .command-row .service-prev-button {
    padding: .875em 2em .875em 3em !important
}*/
.Form_Control.checkbox-list .field-label {
  display: block;
  margin-bottom: 8px;
}

.head > h4,
h4.form-header,
.form-header > h4 {
  flex: 1 1 auto;
}

li.head > h4.long-text {
  height: 4rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.two-col-form {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  row-gap: 1rem;
}

.two-col-form > * {
  flex-basis: 100%;
  padding-inline: 0;
}

.icon-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

@media only screen and (max-width: 480px) {
  .command-row {
    flex-wrap: wrap;
  }
  .command-row > button {
    width: 100%;
  }
  .myleaseplan-form .Form_Control.inline-content label.field-label {
    width: 100%;
  }
  .Form_Control .checkbox-inline li.field, .Form_Control .radio-inline li.field {
    margin: 0 0 1em;
  }
}
@media only screen and (min-width: 480px) {
  .myleaseplan-form.narrow {
    padding: 0 80px;
  }
}
@media only screen and (min-width: 740px) {
  .myleaseplan-form.narrow {
    padding: 0 180px;
  }
  .two-col-form > * {
    flex-basis: 50%;
    padding-inline: 0.5rem;
  }
  .five-col-form > * {
    flex-basis: 20%;
    padding-inline: 0.5rem;
  }
}
.cheat-border-bottom {
  border-bottom: 1px solid var(--vel-color-form-border-default);
  border-radius: var(--vel-shape300-border_radius);
}
