:root {
  --ai-action-bg: #d9ccff;
  --ai-action-bg-hover: #eee8ff;
  --ai-action-border: #a889ff;
  --ai-action-text: #23153f;
  --ai-action-focus: rgba(168, 137, 255, 0.42);
}

button.ai-action,
a.ai-action,
[role="button"].ai-action,
summary.ai-action {
  color: var(--ai-action-text) !important;
  background: var(--ai-action-bg) !important;
  border-color: var(--ai-action-border) !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 800 !important;
}

/* The shared GBU/AA workspace theme is loaded later and styles primary actions
   with higher specificity. Keep explicitly marked AI actions recognizable. */
html body.is-hub-embedded:not(.print-mode) button.ai-action.ai-action,
html body.is-hub-embedded:not(.print-mode) a.ai-action.ai-action,
html body.is-hub-embedded:not(.print-mode) [role="button"].ai-action.ai-action,
html body.is-hub-embedded:not(.print-mode) summary.ai-action.ai-action {
  color: var(--ai-action-text) !important;
  background: var(--ai-action-bg) !important;
  border-color: var(--ai-action-border) !important;
}

button.ai-action:hover:not(:disabled),
a.ai-action:hover,
[role="button"].ai-action:hover,
summary.ai-action:hover {
  color: var(--ai-action-text) !important;
  background: var(--ai-action-bg-hover) !important;
  border-color: #c1aaff !important;
}

html body.is-hub-embedded:not(.print-mode) button.ai-action.ai-action:hover:not(:disabled),
html body.is-hub-embedded:not(.print-mode) a.ai-action.ai-action:hover,
html body.is-hub-embedded:not(.print-mode) [role="button"].ai-action.ai-action:hover,
html body.is-hub-embedded:not(.print-mode) summary.ai-action.ai-action:hover {
  color: var(--ai-action-text) !important;
  background: var(--ai-action-bg-hover) !important;
  border-color: #c1aaff !important;
}

button.ai-action:focus-visible,
a.ai-action:focus-visible,
[role="button"].ai-action:focus-visible,
summary.ai-action:focus-visible {
  outline: 3px solid var(--ai-action-focus) !important;
  outline-offset: 2px;
}

button.ai-action:disabled,
a.ai-action[aria-disabled="true"] {
  color: #5d536f !important;
  background: #aaa2bc !important;
  border-color: #847b98 !important;
  opacity: 0.72;
}

.ai-action::before {
  content: "KI";
  display: inline-grid;
  place-items: center;
  min-width: 1.65em;
  min-height: 1.25em;
  margin-right: 0.5em;
  padding: 0 0.32em;
  color: #fff;
  background: #6f42c1;
  border-radius: 4px;
  font-size: 0.72em;
  font-weight: 900;
  line-height: 1.25;
}

summary.ai-action * {
  color: var(--ai-action-text) !important;
}

.ai-action.ai-icon-only::before,
.ai-action[data-ai-short]::before {
  margin-right: 0;
}

@media print {
  .ai-action,
  .eltracon-ai-progress {
    display: none !important;
  }
}

.eltracon-ai-progress {
  box-sizing: border-box;
  position: fixed;
  right: 76px;
  bottom: 18px;
  z-index: 2147483000;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: min(370px, calc(100vw - 100px));
  min-height: 68px;
  padding: 10px 12px;
  color: #f7f4ff;
  background: #26212f;
  border: 1px solid #a889ff;
  border-radius: 7px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.42);
  font-family: inherit;
}

.eltracon-ai-progress[hidden] {
  display: none !important;
}

.eltracon-ai-progress__indicator {
  width: 26px;
  height: 26px;
  border: 3px solid rgba(217, 204, 255, 0.32);
  border-top-color: #d9ccff;
  border-radius: 50%;
  animation: eltracon-ai-progress-spin 0.9s linear infinite;
}

.eltracon-ai-progress__content {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.eltracon-ai-progress__content strong,
.eltracon-ai-progress__content span,
.eltracon-ai-progress__content small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.eltracon-ai-progress__content strong {
  color: #eee8ff;
  font-size: 13px;
  font-weight: 800;
}

.eltracon-ai-progress__content span {
  color: #fff;
  font-size: 12px;
  font-weight: 650;
}

.eltracon-ai-progress__content small {
  color: #bcb4ca;
  font-size: 10px;
  font-weight: 500;
}

.eltracon-ai-progress__time {
  min-width: 46px;
  padding: 4px 6px;
  color: #23153f;
  background: #d9ccff;
  border-radius: 4px;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  font-weight: 900;
  text-align: center;
}

.eltracon-ai-progress[data-state="success"] {
  border-color: #39b982;
  background: #152c24;
}

.eltracon-ai-progress[data-state="success"] .eltracon-ai-progress__indicator {
  border: 0;
  animation: none;
}

.eltracon-ai-progress[data-state="success"] .eltracon-ai-progress__indicator::before {
  content: "OK";
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  color: #d8fff0;
  background: #14764f;
  border-radius: 50%;
  font-size: 10px;
  font-weight: 900;
}

.eltracon-ai-progress[data-state="error"] {
  border-color: #e35f5f;
  background: #331b20;
}

.eltracon-ai-progress[data-state="error"] .eltracon-ai-progress__indicator {
  border-color: #e35f5f;
  border-top-color: #ffd6d6;
  animation: none;
}

[data-ai-running="true"] {
  cursor: progress !important;
}

[data-ai-running="true"]::before {
  content: "" !important;
  box-sizing: border-box;
  width: 1.25em;
  min-width: 1.25em !important;
  height: 1.25em;
  min-height: 1.25em !important;
  padding: 0 !important;
  border: 2px solid rgba(35, 21, 63, 0.25);
  border-top-color: #6f42c1;
  border-radius: 50% !important;
  background: transparent !important;
  animation: eltracon-ai-progress-spin 0.9s linear infinite;
}

@keyframes eltracon-ai-progress-spin {
  to { transform: rotate(360deg); }
}

@media (max-width: 600px) {
  .eltracon-ai-progress {
    right: 12px;
    bottom: 76px;
    width: calc(100vw - 24px);
  }
}

:is(
  button[data-ai-field],
  button[data-ai-field-action],
  button[data-ai-retry],
  button[data-ai-help],
  button[data-ai],
  button[data-action="run-ai"],
  button[data-action="toggle-ai"],
  button.field-ai-button,
  button.mini-ai,
  button#runAi,
  button#generateDescription,
  button#generateReportSummary,
  button#aiBtn,
  button#completeGbuButton,
  button#aiDraftButton,
  button#generateAiButton
) {
  color: var(--ai-action-text) !important;
  background: var(--ai-action-bg) !important;
  border-color: var(--ai-action-border) !important;
  box-shadow: none !important;
  font-weight: 800 !important;
}

:is(
  button[data-ai-field],
  button[data-ai-field-action],
  button[data-ai-retry],
  button[data-ai-help],
  button[data-ai],
  button[data-action="run-ai"],
  button[data-action="toggle-ai"],
  button.field-ai-button,
  button.mini-ai,
  button#runAi,
  button#generateDescription,
  button#generateReportSummary,
  button#aiBtn,
  button#completeGbuButton,
  button#aiDraftButton,
  button#generateAiButton
):hover:not(:disabled) {
  color: var(--ai-action-text) !important;
  background: var(--ai-action-bg-hover) !important;
  border-color: #c1aaff !important;
}

:is(
  button[data-ai-field],
  button[data-ai-field-action],
  button[data-ai-retry],
  button[data-ai-help],
  button[data-ai],
  button[data-action="run-ai"],
  button[data-action="toggle-ai"],
  button.field-ai-button,
  button#runAi,
  button#generateDescription,
  button#generateReportSummary,
  button#aiBtn,
  button#completeGbuButton,
  button#aiDraftButton,
  button#generateAiButton
)::before {
  content: "KI";
  display: inline-grid;
  place-items: center;
  min-width: 1.65em;
  min-height: 1.25em;
  margin-right: 0.5em;
  padding: 0 0.32em;
  color: #fff;
  background: #6f42c1;
  border-radius: 4px;
  font-size: 0.72em;
  font-weight: 900;
  line-height: 1.25;
}
