/*
Placeholder file.
Real file with values from ENV is generated in the web/assets folder via AssetManager.
*/
/* ratio of fontsize to size */
.file-ajax-field-container {
  display: flex;
  flex-direction: column;
}
.file-ajax-field-container .label {
  order: 1;
}
.file-ajax-field-container .hint {
  order: 2;
  margin: 0;
  font-size: 90%;
  opacity: 0.8;
}
.file-ajax-field-container .file-ajax-field {
  order: 3;
}
.file-ajax-field-container .help-block {
  order: 4;
}

.file-ajax-field .files {
  display: flex;
  flex-direction: column;
}
.file-ajax-field .files li {
  display: flex;
  align-items: center;
  background-color: #ffffff;
  margin: 1px 0;
}
.file-ajax-field .files li:first-child {
  border-radius: 5px 5px 0 0;
}
.file-ajax-field .files li:last-child {
  border-radius: 0 0 5px 5px;
}
.file-ajax-field .files li:before {
  font-family: "Font Awesome 5 Pro";
  content: "\f15b";
  display: inline-block;
  padding: 10px;
}
.file-ajax-field .files li .filename {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
@media (max-width: 768px) {
  .file-ajax-field .files li .filename {
    flex-grow: 1;
  }
}
.file-ajax-field .files li .size {
  padding-left: 10px;
  color: #A4A4A4;
  flex-grow: 1;
}
@media (max-width: 768px) {
  .file-ajax-field .files li .size {
    display: none;
  }
}
.file-ajax-field .files li:before {
  font-family: "Font Awesome 5 Pro";
  content: "\f15b";
  display: inline-block;
  padding-right: 10px;
}
.file-ajax-field .files li .remove {
  line-height: inherit;
  padding-right: 10px;
  justify-self: flex-end;
  padding-right: 10px;
}
@media (max-width: 768px) {
  .file-ajax-field .files li .remove:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f1f8";
  }
  .file-ajax-field .files li .remove span {
    display: none;
  }
}
.file-ajax-field .fieldzone {
  position: relative;
}
.file-ajax-field .fieldzone .drag-label, .file-ajax-field .fieldzone .add-label {
  display: flex;
  align-items: center;
}
.file-ajax-field .fieldzone .drag-label i, .file-ajax-field .fieldzone .add-label i {
  font-size: 130%;
}
.file-ajax-field .fieldzone .drag-label {
  border-radius: 5px;
  border: 2px dotted #23418B;
  background-color: white;
}
.file-ajax-field .fieldzone.dropping .drag-label {
  border-style: solid;
}

.file-ajax-field .fieldzone input[type=file] {
  opacity: 0;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  font-size: 0;
  cursor: pointer;
}
.file-ajax-field .fieldzone input[type=file]::file-selector-button {
  cursor: pointer;
}
.file-ajax-field .fieldzone em {
  font-style: normal;
  color: #23418B;
}
.file-ajax-field.loading .fieldzone i:before {
  font-family: "Font Awesome 5 Pro";
  content: "\f110";
  display: inline-block;
  animation: fa-spin 1s infinite steps(8);
}

/*# sourceMappingURL=file-ajax-field.css.map */