@use "../../Sass/common/_variables";
@use "../../Sass/common/mixins";

.root {
}

.btn--add {
  composes: btn from "../../Sass/common/_buttons.scss";
  composes: btn-primary from "../../Sass/common/_buttons.scss";
  z-index: 10; // keeps the button above the preview map in IE9.
  padding: 10px;

  // toggle-enable data-preview__add-to-map
  @media (min-width: variables.$sm) {
    display: inline-block;
    width: inherit;
    position: absolute;
    top: variables.$padding * 2;
    right: variables.$padding * 2;
  }
}

.previewed--info {
  margin: 2 * variables.$padding 0;
}

.field {
  composes: field from "../../Sass/common/_form.scss";
}

.description {
  composes: clearfix from "../../Sass/common/_base.scss";
  @extend %wrap;

  // a {
  //   @include link(
  //     $modal-bg
  //   ); // The background is taken from tabs.scss's panel-content.
  // }
}

.link {
  // @include link(
  //   $modal-bg
  // ); // The background is taken from tabs.scss's panel-content.
}

.title-and-share-wrapper {
  display: flex;
  justify-content: space-between;
}

.share-link--wrapper {
  margin-top: variables.$padding;
  min-width: 118px;
  float: right;
}

.h3 {
  composes: h3 from "../../Sass/common/_base.scss";
  margin-top: 0;
  padding-right: variables.$padding-small;
  float: left;
  width: 80%;
  font-size: variables.$font-size-mid-large;
}
.h4 {
  composes: h4 from "../../Sass/common/_base.scss";

  font-size: variables.$font-size-mid-small;
}

.error {
  color: variables.$grey;
}

.metadata {
  padding-top: 10px;
}

.btn--add-all {
  composes: btn from "../../Sass/common/_buttons.scss";
  composes: btn-primary from "../../Sass/common/_buttons.scss";
  padding: 8px;
  @media (min-width: variables.$sm) {
    display: inline-block;
    width: inherit;
  }
}