/* Smart Checklists plugin for Redmine
   Copyright (C) 2026 Smart IT Soft (Nguyen Thien An)
   Theme-agnostic styles: no reliance on Redmine base rules being present. */

.smart-checklist {
  margin: 1em 0;
  padding: 8px 10px;
  border: 1px solid #ddd;
  border-radius: 4px;
  background: #fafafa;
}

.smart-checklist-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}

.smart-checklist-title {
  font-weight: bold;
}

.smart-checklist-progress {
  font-size: 0.85em;
  color: #555;
}

.smart-checklist-bar {
  flex: 0 0 120px;
  height: 8px;
  background: #e0e0e0;
  border-radius: 4px;
  overflow: hidden;
}

.smart-checklist-bar > span {
  display: block;
  height: 100%;
  background: #4caf50;
  transition: width 0.2s ease;
}

.smart-checklist-error {
  margin: 4px 0;
  padding: 4px 8px;
  border: 1px solid #e0a0a0;
  border-radius: 3px;
  background: #fbeaea;
  color: #a33;
  font-size: 0.9em;
}

.smart-checklist-items {
  list-style: none;
  margin: 0;
  padding: 0;
}

.smart-checklist-row {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 2px 0;
}

.smart-checklist-row.is-done .smart-checklist-subject {
  text-decoration: line-through;
  color: #999;
}

.smart-checklist-row.is-heading {
  margin-top: 6px;
  font-weight: bold;
}

.smart-checklist-heading {
  font-weight: bold;
  color: #333;
}

.smart-checklist-label {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  margin: 0;
  font-weight: normal;
}

.smart-checklist-actions {
  margin-left: auto;
  visibility: hidden;
  white-space: nowrap;
}

.smart-checklist-row:hover .smart-checklist-actions {
  visibility: visible;
}

.smart-checklist-actions a {
  text-decoration: none;
  color: #888;
  padding: 0 3px;
}

.smart-checklist-actions a:hover {
  color: #c00;
}

.smart-checklist-edit-input {
  flex: 1;
}

.smart-checklist-add {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  padding-top: 6px;
  border-top: 1px dashed #ddd;
}

.smart-checklist-new-subject {
  flex: 1;
}

.smart-checklist-new-heading {
  font-weight: normal;
  font-size: 0.85em;
  white-space: nowrap;
}

/* Form rows (new-issue and template editors) */
.smart-checklist-form-row,
.smart-checklist-template-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}

.smart-checklist-form-remove,
.smart-checklist-template-remove {
  text-decoration: none;
  color: #999;
}

.smart-checklist-form-remove:hover,
.smart-checklist-template-remove:hover {
  color: #c00;
}

.smart-checklist-journal {
  color: #555;
}

/* AI generation: button row, language dropdown and the preview panel */
.smart-checklist-ai {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
}

.smart-checklist-ai-lang {
  max-width: 160px;
}

.smart-checklist-ai-btn[disabled] {
  opacity: 0.6;
  cursor: default;
}

.smart-checklist-ai-preview {
  margin-top: 8px;
  padding: 10px 12px;
  border: 1px solid #c9c2f2;
  border-radius: 6px;
  background: #f6f4ff;
}

.smart-checklist-ai-head {
  font-weight: bold;
  margin-bottom: 6px;
  color: #4b3fb3;
}

.smart-checklist-ai-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
  font-weight: normal;
}

.smart-checklist-ai-row.is-heading .smart-checklist-ai-text {
  font-weight: bold;
}

.smart-checklist-ai-text {
  flex: 1;
}

.smart-checklist-ai-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed #c9c2f2;
}

.smart-checklist-ai-again,
.smart-checklist-ai-cancel {
  background: none;
  border: none;
  color: #6c5ce7;
  cursor: pointer;
  padding: 2px 4px;
}

.smart-checklist-ai-again:hover,
.smart-checklist-ai-cancel:hover {
  text-decoration: underline;
}

.smart-checklist-ai-apply[disabled] {
  opacity: 0.5;
  cursor: default;
}