/*!
 * @pluginjs/gradient-picker v0.8.19 (https://pluginjs.com)
 * Copyright 2022 Creation Studio Limited
 * Released under the GPL-3.0 License.
 */
.pj-gradientPicker-trigger {
  position: relative; }

.pj-gradientPicker-input {
  width: 100% !important; }

.pj-gradientPicker-panel {
  box-sizing: border-box;
  width: 290px; }

.pj-gradientPicker-remove {
  position: absolute;
  top: 50%;
  right: 51px;
  z-index: 1;
  transform: translateY(-50%); }

.pj-gradientPicker-clear {
  position: absolute;
  top: 0;
  right: 51px;
  display: none;
  height: 100%;
  font-family: plugin-icons; }
  .pj-gradientPicker-clear::before {
    display: inline-block;
    font-style: normal;
    font-weight: normal;
    /* stylelint-disable-line */
    font-variant: normal;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: auto;
    vertical-align: middle;
    content: "\ea46"; }
  .pj-gradientPicker-clear::after {
    display: inline-block;
    width: 0;
    height: 100%;
    vertical-align: middle;
    content: ""; }

.pj-gradientPicker-preview {
  position: absolute;
  top: 50%;
  right: 0;
  width: 45px;
  height: 30px;
  cursor: pointer;
  transform: translateY(-50%); }
  .pj-gradientPicker-preview span {
    position: absolute;
    top: 50%;
    left: calc(50% - 1px);
    display: inline-block;
    width: 36px;
    height: 24px;
    transform: translate(-50%, -50%); }
  .pj-gradientPicker-preview-bg {
    z-index: -1; }

.pj-gradientPicker-handle {
  display: flex;
  flex-wrap: wrap;
  align-items: center; }
  .pj-gradientPicker-handle .pj-gradientPicker-bar {
    position: relative;
    width: 100%;
    height: 16px; }
    .pj-gradientPicker-handle .pj-gradientPicker-bar:hover {
      cursor: copy; }
    .pj-gradientPicker-handle .pj-gradientPicker-bar-view {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }
  .pj-gradientPicker-handle .pj-gradientPicker-delete {
    cursor: not-allowed; }
    .pj-gradientPicker-handle .pj-gradientPicker-delete-active {
      cursor: pointer; }

.pj-gradientPicker-mode {
  flex-grow: 1; }

.pj-gradientPicker .pj-colorPicker-panel {
  width: 100%;
  padding: 0;
  border: none !important; }

.pj-gradientPicker-inline {
  border: 1px solid #e6e6e6;
  box-shadow: none; }

.pj-gradientPicker-marker {
  position: absolute;
  top: 50%;
  z-index: 2;
  box-sizing: border-box;
  width: 12px;
  height: 12px;
  cursor: pointer;
  transform: translateY(-50%); }
  .pj-gradientPicker-marker:hover, .pj-gradientPicker-marker:active {
    transition: transform 0.3s;
    transform: translateY(-50%) scale(1.2); }
  .pj-gradientPicker-marker:focus {
    outline: none; }
  .pj-gradientPicker-marker.pj-gradientPicker-marker-active {
    transition: transform 0.3s;
    transform: translateY(-50%) scale(1.2); }

.pj-gradientPicker-wheel {
  position: relative;
  width: 22px;
  height: 22px; }
  .pj-gradientPicker-wheel:hover {
    cursor: pointer; }
  .pj-gradientPicker-wheel-handle {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    transform-origin: center 11px; }

.pj-gradientPicker-disabled .pj-gradientPicker-preview {
  pointer-events: none; }

.pj-gradientPicker {
  font-family: font-family-base; }
  .pj-gradientPicker-panel {
    padding: 24px; }
  .pj-gradientPicker-clear {
    color: #b3b3b3; }
    .pj-gradientPicker-clear:hover {
      color: #333; }
  .pj-gradientPicker-preview {
    border-left: 1px solid #e6e6e6; }
    .pj-gradientPicker-preview span {
      border-radius: 2px; }
    .pj-gradientPicker-preview-bg {
      background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABIAQMAAABvIyEEAAAABlBMVEXLy8v////hf8FnAAAAGklEQVQoz2PghwEG/KwPMECANWreqHkDaB4AtSFCzONj1qEAAAAASUVORK5CYII="); }
  .pj-gradientPicker-handle {
    margin-bottom: 15px; }
    .pj-gradientPicker-handle .pj-gradientPicker-bar {
      margin-bottom: 12px;
      background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABIAQMAAABvIyEEAAAABlBMVEXLy8v////hf8FnAAAAGklEQVQoz2PghwEG/KwPMECANWreqHkDaB4AtSFCzONj1qEAAAAASUVORK5CYII="); }
      .pj-gradientPicker-handle .pj-gradientPicker-bar-view {
        background-size: 100% 100% !important;
        border-radius: 2px; }
    .pj-gradientPicker-handle .pj-gradientPicker-delete {
      font-size: 16px;
      color: #b3b3b3; }
      .pj-gradientPicker-handle .pj-gradientPicker-delete-active {
        color: #f2f2f2; }
        .pj-gradientPicker-handle .pj-gradientPicker-delete-active:hover {
          color: #000; }
    .pj-gradientPicker-handle .pj-gradientPicker-wheel-angle {
      width: 48px !important;
      min-height: auto; }
  .pj-gradientPicker-mode .pj-select {
    width: auto;
    margin-right: 10px; }
  .pj-gradientPicker-marker {
    border: 2px solid #fff;
    border-radius: 1000px;
    box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.07); }
    .pj-gradientPicker-marker.pj-gradientPicker-marker-active {
      border-color: #215fdb; }
      .pj-gradientPicker-marker.pj-gradientPicker-marker-active i {
        border-color: #215fdb; }
  .pj-gradientPicker-wheel {
    margin-right: 10px;
    margin-left: 6px;
    border: 1px solid #e6e6e6;
    border-radius: 100%; }
    .pj-gradientPicker-wheel-handle {
      width: 6px;
      height: 6px;
      background-color: #333;
      border-radius: 100%; }
  .pj-gradientPicker-save {
    margin-top: 24px;
    font-weight: 500;
    letter-spacing: 1.3px;
    transition: unset; }