/* vendorplus-form.css — Form inputs, validation, file upload input, form-row/check-wrapper, Select2, Quill editor, form-field-combine */

/* FORM */
sup.required {
  color: #e84242;
}
input.error {
  color: #e84242;
  background: red;
  border-color: #e84242;
}

#vplus-login {
  width: 6.25rem;
}
/* USER LOGGED IN */
.vplus-login-info {
  text-align: right;
  margin-bottom: 1.25rem;
}
.vplus-login-nav {
  margin-bottom: 1.25rem;
}

.file-upload {
  font-size: var(--bs-body-font-size);
  font-weight: 300;
  height: 100%;
  min-height: 0;
  line-height: 1rem;
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-radius: var(--bs-border-radius);
  padding: .375rem 0.5rem;
  background: #fff;
  box-sizing: border-box;
  color: var(--bs-body-color);
  border-top-left-radius: var(--bs-border-radius) !important;
  border-bottom-left-radius: var(--bs-border-radius) !important;
}
.file-upload--hidden + .file-upload {
  border-right: 0;
}
.file-upload--hidden + .file-upload + .btn {
  border-left: 0;
  padding: .25rem .75rem;
}
.file-upload--hidden + .file-upload + .btn:before {
  border-left: 1px dashed var(--bs-border-color);
  content: "";
  margin-right: .5rem;
}
.file-upload--hidden:hover + .file-upload + .btn {
  background: transparent;
  color: var(--bs-primary);
}
.file-upload--hidden.d-none + .file-upload,
.file-upload--hidden.d-none + .file-upload + .btn {
  background-color: var(--bs-secondary-bg);
}
.file-upload--hidden.d-none + .file-upload + .btn {
  border-color: var(--bs-border-color);
  color: var(--bs-gray-700);
}

.input-group .file-upload--hidden {
  position: absolute;
  opacity: 0;
  width: 100%;
  z-index: 3;
  height: 100%;
}
.input-group.input-group div ~ button {
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-left-color: transparent;
}
.input-group.input-group div ~ button:hover {
  background: transparent;
  color: var(--bs-primary);
}
.input-group:has(.form-floating + button) input {
  border-right-color: transparent;
}

.input-group:has(.d-none + input) input {
  border-top-left-radius: var(--bs-border-radius) !important;
  border-bottom-left-radius: var(--bs-border-radius) !important;
}

.input-group:has(input + .d-none) input {
  border-top-right-radius: var(--bs-border-radius) !important;
  border-bottom-right-radius: var(--bs-border-radius) !important;
}

.vplus-form-status:empty,
.vplus-file-photo-ai-uploaded:empty {
  display: none;
}
.vplus-file-photo-ai-uploaded {
  position: relative;
}
.vplus-file-photo-ai-uploaded img {
  border: 1px solid #f2f2f2;
  max-width: 100%;
  height: auto;
  border-radius: var(--bs-border-radius);
}
.form-row {
  /* align-self: center; */
  margin-bottom: 0.5rem;
}
.form-check-wrapper,
.form-radio-wrapper {
  min-height: 3.625rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.form-group .description {
  margin-top: 0.25rem;
  margin-bottom: 0.5rem;
  font-size: var(--bs-body-font-size);
  color: #666;
}

.vplus-text-editor-wrapper {
  border: 1px solid var(--bs-border-color);
  border-radius: var(--bs-border-radius);
}

.vplus-text-editor-wrapper .ql-editor.ql-editor {
  font-size: var(--bs-body-font-size);
  padding: .5rem;
}

.vplus-file-wrapper {
  display: none;
  padding: 1rem;
  border: 1px dashed var(--bs-border-color);
  border-radius: var(--bs-border-radius);
}
.vplus-file-wrapper.show {
  display: block !important;
  margin-top: 1rem;
}

.is-invalid + .select2 .select2-selection {
  border-color: var(--bs-danger);
  color: var(--bs-danger);
}

.form-floating > label {
  color: #666;
  font-weight: var(--vplus-font-weight-light);
}

.input-group.input-group.input-group:has(.invalid-feedback)
  .input-group-text
  + .form-floating
  .form-control {
  border-right: 1px solid var(--bs-border-color);
}
.input-group.input-group.input-group:has(.invalid-feedback)
  .input-group-text
  + .form-floating
  .form-control,
.input-group.input-group.input-group:has(.invalid-feedback)
  .form-floating
  + .btn,
.input-group.input-group.input-group:has(.invalid-feedback)
  .form-floating
  + .input-group-text {
  border-top-right-radius: var(--bs-border-radius);
  border-bottom-right-radius: var(--bs-border-radius);
}

.admin-bar .select2-container--open .select2-dropdown {
  margin-top: 2.875rem;
}
@media (min-width: 783px) {
  .admin-bar .select2-container--open .select2-dropdown {
    margin-top: 2rem;
  }
}
.card-featured {
  --bs-card-border-color: var(--bs-warning-border-subtle);
  box-shadow: 0 0 0 0.25rem rgba(var(--bs-warning-rgb), 0.75);
}

.form-field-combine {
  display: flex;
}
.form-field-combine > .form-field-combine-item {
  flex: 1;
}
.form-field-combine > .form-field-combine-item:not(:last-child) input {
  border-radius: 0;
  border-right: 0;
}
.form-field-combine > .form-field-combine-item:first-child input {
  border-radius: var(--bs-border-radius) 0 0 var(--bs-border-radius);
  border-right: 0;
}
.form-field-combine > .form-field-combine-item:last-child input {
  border-radius: 0 var(--bs-border-radius) var(--bs-border-radius) 0;
  border-left-style: dashed;
}

#vplus-sign-in-form .row {
  gap: 1rem;
}

[data-ref].invalid-feedback:empty {
  display: none;
}

.alert:empty {
  display: none;
}

.ql-editor.ql-editor > * {
  margin-bottom: 1rem;
}

.card-body .ql-toolbar.ql-snow {
  border: 0;
  border-bottom: 1px solid var(--bs-border-color);
}
.card-body .ql-editor {
  padding: 1rem 0;
}
.card-body .ql-container {
  font-family: var(--vplus-font-family-base);
  font-size: 1rem;
}
.card-body .ql-container *:not(strong) {
  font-weight: var(--vplus-font-weight-light);
}
.card-body .ql-container.ql-snow {
  border: 0;
}

.ql-snow .ql-picker.ql-expanded .ql-picker-options {
  z-index: 100;
}

.form-row .btn-group .btn {
  border-color: #ccc;
  margin-bottom: 0;
}

.form-row-separator {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.select2-container--bootstrap-5.select2-container--bootstrap-5
  .select2-selection--single
  .select2-selection__rendered
  .select2-selection__placeholder {
  font-weight: var(--bs-font-weight-light);
}

.select2-container--bootstrap-5.select2-container--bootstrap-5
  .select2-selection,
.select2-container--bootstrap-5.select2-container--bootstrap-5.select2-container--disabled
  .select2-selection,
.select2-container--bootstrap-5.select2-container--bootstrap-5.select2-container--disabled.select2-container--focus
  .select2-selection {
  border-color: var(--bs-border-color);
}
.form-floating .select2.select2-container--bootstrap-5 .select2-selection {
  overflow: hidden;
  text-overflow: ellipsis;
}
.form-control.disabled {
  background-color: var(--bs-secondary-bg);
  opacity: 1;
}

/* INPUT SUFFIX — input + adjacent label/button sitting flush */
.vplus-input-suffix {
  display: flex;
  align-items: stretch;
}
.vplus-input-suffix > :first-child.form-control,
.vplus-input-suffix > :first-child .form-control {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.vplus-input-suffix > :last-child:not(:first-child) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  margin-left: -1px;
}

/* TEXTAREA AUTO-RESIZE */
.vplus-textarea-wrap {
  position: relative;
}
textarea[data-auto-resize] {
  resize: none;
  overflow-y: hidden;
  max-height: 37.5rem;
}
.vplus-char-count {
  position: absolute;
  bottom: 0.5rem;
  right: 0.75rem;
  z-index: 1;
  font-size: var(--bs-body-font-size-sm);
  font-weight: 500;
  color: #fff;
  background: rgba(0, 0, 0, 0.45);
  padding: 0.1875rem 0.4375rem;
  border-radius: 1rem;
  pointer-events: none;
  line-height: 1;
  user-select: none;
}
