/* Inline Edit Text Styles - Bootstrap 5 Compatible with Popover Support */

/* Inline mode styles */
.inline-edit-text-trigger {
  cursor: pointer;
  border-bottom: 1px dashed #6c757d;
  transition: border-color 0.2s;
}

.inline-edit-text-trigger:hover {
  border-bottom-color: #0d6efd;
  color: #0d6efd;
}

.inline-edit-text-trigger:empty:before {
  content: attr(data-placeholder);
  color: #6c757d;
  font-style: italic;
}

.inline-edit-text-form {
  min-width: 200px;
}

.inline-edit-text-form .form-control {
  flex: 1;
}

.inline-edit-text-form .btn {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  padding: 0;
  line-height: 32px;
  font-weight: bold;
}

/* Popover mode styles */
.inline-edit-text-popover {
  max-width: 400px;
}

.inline-edit-text-popover .popover-body {
  padding: 0.75rem;
}

.inline-edit-text-popover .inline-edit-text-form {
  min-width: 250px;
}

.inline-edit-text-popover .form-control {
  font-size: 0.875rem;
}

/* Editable elements styling */
[data-controller*="inline-edit-text"] [data-inline-edit-text-target="display"] {
  cursor: pointer;
  border-bottom: 1px dashed #6c757d;
  transition: all 0.2s ease;
  display: inline-block;
  padding: 2px 4px;
}

[data-controller*="inline-edit-text"]:hover [data-inline-edit-text-target="display"] {
  border-bottom-color: #0d6efd;
  color: #0d6efd;
  background-color: #f8f9fa;
}

/* Remove underline from badge-wrapped display targets */
.badge [data-inline-edit-text-target="display"],
.badge [data-inline-select-target="display"] {
  border-bottom: none !important;
  padding: 0;
  background-color: transparent !important;
}

.badge:hover [data-inline-edit-text-target="display"],
.badge:hover [data-inline-select-target="display"] {
  border-bottom: none !important;
  background-color: transparent !important;
  color: inherit !important;
}

[data-controller*="inline-edit-text"] [data-inline-edit-text-target="display"]:empty:before {
  content: "Click to edit";
  color: #6c757d;
  font-style: italic;
}

/* Error state */
.inline-edit-text-form .is-invalid {
  border-color: #dc3545;
}

.inline-edit-text-form .invalid-feedback {
  font-size: 0.75rem;
  margin-top: 0.25rem;
}

/* Inline Select Styles */
.inline-select-trigger {
  cursor: pointer;
  border-bottom: 1px dashed #6c757d;
  transition: all 0.2s ease;
  display: inline-block;
  padding: 2px 4px;
}

.inline-select-trigger:hover {
  border-bottom-color: #0d6efd;
  color: #0d6efd;
  background-color: #f8f9fa;
}

.inline-select-trigger:empty:before {
  content: "Click to select";
  color: #6c757d;
  font-style: italic;
}

.inline-select-popover {
  max-width: 400px;
}

.inline-select-popover .popover-body {
  padding: 0.75rem;
}

.inline-select-form {
  min-width: 250px;
}

.inline-select-form .form-select {
  flex: 1;
}