@import "./../mixins";
@import "bottom-panel";
@import "loading";
@import "notifications";
@import "grid";

.wpra-postbox {
  .hndle {
    cursor: unset !important;
  }
}

.wpra-shortcode-copy {
  font-size: 13px;
  background-color: #fff;
  margin-left: auto;
  padding: 9px 14px;
  box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1);

  border-left: 4px solid #0085ba;

  display: flex;
  align-items: center;

  @include breakpoint (mobile) {
    display: block;
  }

  &__icon {
    padding-left: 16px;

    @include breakpoint (mobile) {
      padding-left: 0;
      margin-top: 1rem;
    }
  }
}

.page-title {
  display: flex;
  align-items: center;
  padding: 9px 0 4px 0;

  @include breakpoint (mobile) {
    display: block;
  }

  a {
    &:focus {
      text-decoration: none;
    }
  }

  h1 {
    margin-left: 6px;
    padding: 0;
  }
}

.back-button {
  opacity: .75;
  text-decoration: none;
  font-size: 20px;
  display: flex;
  align-items: center;
  padding-right: 10px;
  margin-right: 4px;
  border-right: 1px solid #b4b4b4;

  @include breakpoint (mobile) {
    border-right: none;
    margin-bottom: .5rem;
  }

  .dashicons {
    margin-right: 8px;
  }
}

.tippy-tooltip.light-theme {
  font-size: 13px !important;
  font-family: unset !important;
  text-align: left !important;

  hr {
    border: none;
    height: 1px;
    background-color: #efefef;
  }
}

.form-input {
  display: flex;
  margin: .75rem 0;
  &--disabled {
    pointer-events: none;
    .form-input__label {
      *:not(.disable-ignored) {
        opacity: .5;
        user-select: none;
      }
    }
  }
  .disable-ignored {
    opacity: 1;
  }
  &--vertical {
    flex-direction: column;
    .form-input__label {
      padding-right: 0;
      padding-bottom: 4px;
      flex-basis: 100%;
    }
  }

  @include breakpoint(mobile) {
    flex-direction: column;
    .form-input__label {
      padding-right: 0;
      padding-bottom: 4px;
      flex-basis: 100%;
    }
  }

  &:last-child {
    margin-bottom: 0;
  }
  &__tip {
    cursor: pointer;
    display: inline-block;
    margin-left: 4px;
    opacity: .25;
    vertical-align: middle;
    &:hover {
      opacity: .85;
    }
    .dashicons {
      font-size: 18px;
    }
  }
  &__label {
    padding-right: 12px;
    flex-basis: 260px;
    &-description {
      padding-top: 2px;
      padding-right: 10px;
      line-height: 1.65;
      opacity: .6;
      font-size: 12px;

      a {
        pointer-events: auto !important;
      }
    }
  }
  &__field {
    flex-grow: 1;
    input:not([type="checkbox"]), textarea, select {
      width: 100%;
      max-width: 325px;
    }
  }
}

.built-in {
  background: #f1f1f1;

  [type="checkbox"] {
    display: none;
  }
}

.wpra-preview-link {
  vertical-align: middle;

  span.dashicons {
    opacity: .75;
    font-size: 16px;
    vertical-align: middle;
  }
}

.wpra-no-cb {
  .column-cb {
    input[type="checkbox"] {
      display: none;
    }
  }
}

.column.name {
  small {
    @include breakpoint (mobile) {
      display: block;
    }
  }
}

.inside {
  .wpra-preview-link {
    @include breakpoint (mobile) {
      float: none;
    }
  }
}

.wpra-postbox-container {
  @include breakpoint (mobile) {
    display: flex;
    flex-direction: column;

    .wpra-postbox-last {
      order: 100;
    }
  }
}
