@use '../config' as *;

.dropzone {
  padding: 1rem !important;
  color: var(--secondary) !important;
  border: var(--border-width) dashed var(--border-color) !important;

  &.dz-drag-hover {
    color: var(--primary);
    background: color-transparent(var(--primary), 0.01);
    border: var(--border-width) dashed var(--primary);

    .dz-message {
      opacity: 1;
    }
  }

  .dz-preview {
    margin: 0.5rem;

    .dz-image {
      @include border-radius(var(--border-radius));
    }

    .dz-success-mark {
      height: 54px;
    }
  }
}