/**
 * @file
 * Visual styles for form components.
 */




/**
 * ===== FORM - LABEL =====
 */

label.form-required::after {
  color: var(--site--main--color--02-03);
  content: " *";
}




/**
 * ===== FORM - FIELDS =====
 */


/**
 * form-date
 */
input.form-date {
    -moz-appearance: none;
    -webkit-appearance: none;
}


/**
 * form-email
 */
input.form-email {
    -moz-appearance: none;
    -webkit-appearance: none;
  width: 100%;
}


/**
 * form-number
 */
input.form-number {
    -moz-appearance: none;
    -webkit-appearance: none;
  width: 100%;
}


/**
 * form-search
 */
input.form-search {
    -moz-appearance: none;
    -webkit-appearance: none;
}


/**
 * form-tel 
 */
input.form-tel {
    -moz-appearance: none;
    -webkit-appearance: none;
  width: 100%;
}


/**
 * form-text 
 */
input.form-text {
    -moz-appearance: none;
    -webkit-appearance: none;
  width: 100%;
}
input.form-text::placeholder {}


/**
 * form-checkbox
 */
input.form-checkbox {}


/**
 * form-checkbox
 */
input.form-file {
    -moz-appearance: none;
    -webkit-appearance: none;
  width: 100%;
}


/**
 * form-submit
 */
input.form-submit {
    -moz-appearance: none;
    -webkit-appearance: none;
  background-color: var(--site--main--color--05-02);
  /**/
  background-image: url("../../img/gui/gui-direction/gui-direction-arrow-default-right.svg");
  background-position: right 1.25rem center;
  background-repeat: no-repeat;
  background-size: 32px;
  /**/
  box-shadow: 1px 1px 1px 0 rgba(0,0,0,0.1);
  color: var(--site--main--color--06-03);
  cursor: pointer;
  display: inline-block;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.5;
  padding: 0.75rem calc(1.0rem + 32px + 1.25rem) 0.75rem 1.0rem;
  /**/
  transition: 
    background-color 0.4s ease, background-position 0.2s ease;
  /**/
  width: auto;
}
input.form-submit:hover {
  background-color: var(--site--main--color--05-03);
  background-position: right 1.0rem center;
}


/**
 * form-select
 */
select.form-select {
  width: 100%;
}


/**
 * form-textarea 
 */
textarea.form-textarea {
    -moz-appearance: none;
    -webkit-appearance: none;
}




/**
 * ===== FORM LAYOUT =====
 */


/**
 * form-item
 */
.form-item {
  margin: 1.0rem 0;
}


/**
 * form-actions
 */
.form-actions {
  margin: 1.0rem 0;
  text-align: right;
}




/**
 * ===== FORM - DESCRIPTION =====
 */

.form-item .description,
.form-composite > .fieldset-wrapper > .description {
  font-size: 0.8rem;
  font-style: italic;
  padding: 5px 3px;
}

.description a {
  text-decoration: underline;
}
