/**
 * @file
 * Form component's rules.
 *
 * Defines rules for form components : input, label, etc.
 *
 */

/**
 * Forms bases
 */
input,
textarea {
	max-width: 100%;
}



/**
 * Forms bases
 */

 input,
 textarea {
	 max-width: 100%;
 }


 /**
  * User Log Block
  */

 .user-login-form,
 .user-pass {
   padding: 1rem 1rem 3rem 1rem;
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
   display: -o-flex;
   display: flex;
   -webkit-flex-direction: column;
   -moz-flex-direction: column;
   -ms-flex-direction: column;
   -o-flex-direction: column;
   flex-direction: column;
   align-items: center;
   justify-content: center;
 }
 .user-login-form .form-item,
 .user-pass .form-item {
   width: 100%;
   display: flex;
   flex-direction: column;
 }
 .user-login-form .form-item .form-text,
 .user-pass .form-item .form-text {
   padding: 12px 20px;
   margin: 8px 0;
   display: inline-block;
   border: 1px solid #ccc;
   border-radius: 4px;
   box-sizing: border-box;
 }
 .user-login-form .form-submit,
 .user-pass .form-submit {
   background: var(--color-primary--3);
   color: #FFF;
   padding: 14px 20px;
   margin: 8px 0;
   border: none;
   border-radius: 10px;
   cursor: pointer;
 }
 .user-login-form .form-submit:hover,
 .user-pass .form-submit:hover {
   background: var(--color-primary--4);
   color: #000;
 }
 @media screen and (min-width: 700px) {
   .user-login-form .form-item,
   .user-pass .form-item {
	 width: 50%;
	 max-width: 745px;
   }
 }
 @media screen and (min-width: 1200px) {
   .user-login-form .form-item,
   .user-pass .form-item {
	 width: 33.333%;
	 max-width: 438px;
   }
 }


 /**
  * Input Type Text
  */

 .form-item input,
 .form-item textarea,
 .form-item select {
   border: none;
   border-radius: 3px;
   background-color: var(--color-secondary--6);
   padding: 0.75rem 1rem;
   width: 100%;
   border-bottom: 1px solid var(--color-secondary--2);
 }
 .form-item label {
   display: block;
   margin-bottom: 0.6rem;
   font-family: 'Raleway';
   color: var(--color-primary--1);
   font-size: 1rem;
   font-weight: 600;
 }
 .form-item label.form-required::after {
   content: none;
 }

 /**
  * Webform contact
  */

 .webform-submission-contact-add-form {
   margin-top: 2.125rem;
 }
 .webform-submission-contact-add-form .form-item {
   margin: 1.125rem 0;
 }
 .webform-submission-contact-add-form > .form-item:not(.form-type-textarea) {
	max-width: 448px;
 }


 /**
  * Webform manuscript
  */

.webform-submission-manuscript-form {
  margin-top: 2.125rem;
}
.webform-submission-manuscript-form .form-item {
  margin: 1.125rem 0;
}
.webform-submission-manuscript-form .form-item:not(.form-type-textarea) {
max-width: 448px;
}
.webform-submission-manuscript-form .js-form-type-webform-document-file {
  font-family: 'Raleway';
  font-size: smaller;
  color: var(--color-secondary--1);
}
.webform-submission-manuscript-form .description {
  margin-top: 10px;
  font-family: 'Merriweather';
  color: var(--color-secondary--1);
}
.webform-submission-manuscript-form .js-form-type-webform-document-file input::file-selector-button {
  all: unset;
  padding: 1rem;
  border-radius: 3px;
  background-color: var(--color-secondary--2);
  cursor: pointer;
  color: white;
  font-family: 'Raleway';
  text-align: right;
  margin-right: 10px;
  transition: ease 150ms;
  font-size: initial;
}
.webform-submission-manuscript-form .js-form-type-webform-document-file input::file-selector-button:hover {
  background-color: var(--color-secondary--1);
}
.webform-submission-manuscript-form input[name="manuscript_remove_button"]{
  background-color: var(--color-secondary--2);
  color: white;
  margin: 10px 0;
  font-family: 'Raleway';
  transition: ease 150ms;
  font-size: initial;
}
.webform-submission-manuscript-form input[name="manuscript_remove_button"]:hover{
  background-color: var(--color-secondary--1);
}
.webform-submission-manuscript-form span.file a {
  font-family: 'Raleway';
  color: var(--color-secondary--1);
}


/**
 * Select
 */

.select {
  position: relative;
}
.select::after {
  display: block;
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  content: '';
  background-image: url('../../images/icons/Polygon.svg');
  background-position: center;
  background-repeat: no-repeat;
  width: 12px;
  height: 12px;
}
.select > select {
  appearance: none;
}


/**
 * Captcha
 */

.captcha {
  font-family: 'Raleway', sans-serif;
  border: none;
  color: var(--color-primary--1);
  font-size: 1rem;
}
.captcha .details-wrapper {
  padding: 0.5rem 0;
}
.captcha .details-description {
  margin-bottom: 1rem;
}