/* DonkeyArt tool action system — shared by every page under ui/tools. */
body[data-app="art"] :is(
  button,
  .btn,
  .button,
  [role="button"],
  .download-link
) {
  font-family: inherit;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease,
    box-shadow .18s ease, transform .18s ease !important;
}

/* Secondary and utility actions. */
body[data-app="art"] :is(
  button,
  .btn,
  .button,
  [role="button"],
  .download-link
):not(.action-btn):not(.compile-btn):not(.btn-generate):not(.btn-generate-inner):not(.primary) {
  border-color: var(--ud-accent, #76527b) !important;
}

body[data-app="art"] :is(
  .nav-tab,
  .chip,
  .btn-reset,
  .btn-download,
  .btn-soundboard,
  .tool-menu-button,
  .add-line-btn,
  .add-node-btn,
  .secondary
) {
  border: 1px solid var(--ud-accent, #76527b) !important;
  border-radius: 10px !important;
  background: var(--ud-card, #fffdf8) !important;
  color: var(--ud-accent-dark, #513657) !important;
  box-shadow: none !important;
}

body[data-app="art"] :is(
  .nav-tab,
  .chip,
  .btn-reset,
  .btn-download,
  .btn-soundboard,
  .tool-menu-button,
  .add-line-btn,
  .add-node-btn,
  .secondary
):hover:not(:disabled) {
  border-color: var(--ud-accent-dark, #513657) !important;
  background: var(--ud-accent-soft, #eee5f0) !important;
  color: var(--ud-accent-dark, #513657) !important;
  box-shadow: 0 6px 16px rgba(94, 62, 101, .12) !important;
  transform: translateY(-1px);
}

/* Main creation, conversion, export and submit actions. */
body[data-app="art"] :is(
  .action-btn,
  .action-btn-black,
  .compile-btn,
  .btn-submit,
  .btn-generate,
  .btn-generate-inner,
  .btn-prompt,
  .btn-speech-disabled.active,
  .primary,
  .download-link,
  #compile_submit_btn,
  #json_submit_trigger,
  #submit-btn,
  #force-match-btn,
  #generate-btn,
  button[type="submit"]
) {
  border: 1px solid var(--ud-accent, #76527b) !important;
  border-radius: 999px !important;
  background: var(--ud-accent, #76527b) !important;
  color: #fff !important;
  box-shadow: 0 7px 18px rgba(94, 62, 101, .18) !important;
  font-weight: 700 !important;
}

body[data-app="art"] :is(
  .action-btn,
  .action-btn-black,
  .compile-btn,
  .btn-submit,
  .btn-generate,
  .btn-generate-inner,
  .btn-prompt,
  .btn-speech-disabled.active,
  .primary,
  .download-link,
  #compile_submit_btn,
  #json_submit_trigger,
  #submit-btn,
  #force-match-btn,
  #generate-btn,
  button[type="submit"]
):hover:not(:disabled) {
  border-color: var(--ud-accent-dark, #513657) !important;
  background: var(--ud-accent-dark, #513657) !important;
  color: #fff !important;
  box-shadow: 0 9px 22px rgba(94, 62, 101, .24) !important;
  transform: translateY(-1px);
}

/* Selected tabs and toggles use a soft fill to remain visually distinct. */
body[data-app="art"] :is(
  .nav-tab.active,
  .chip.active,
  [role="tab"][aria-selected="true"],
  .accordion-item.is-open .accordion-toggle-bar,
  .text-line-row.is-active .accordion-header
) {
  border-color: var(--ud-accent, #76527b) !important;
  background: var(--ud-accent-soft, #eee5f0) !important;
  color: var(--ud-accent-dark, #513657) !important;
}

/* Disabled actions are neutral; destructive actions remain semantically red. */
body[data-app="art"] :is(button, .btn, .button, [role="button"]):disabled,
body[data-app="art"] :is(button, .btn, .button, [role="button"])[aria-disabled="true"] {
  border-color: #d8d0ca !important;
  background: #eee9e4 !important;
  color: #8d837c !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
  transform: none !important;
  opacity: .78 !important;
}

body[data-app="art"] :is(.delete-btn, .remove-line-btn, .danger, [data-action="delete"]) {
  border: 1px solid #c75a5a !important;
  border-radius: 10px !important;
  background: #fff5f3 !important;
  color: #9e3535 !important;
  box-shadow: none !important;
}

body[data-app="art"] :is(.delete-btn, .remove-line-btn, .danger, [data-action="delete"]):hover:not(:disabled) {
  background: #fce5e1 !important;
  border-color: #9e3535 !important;
  color: #812929 !important;
}

@media (prefers-reduced-motion: reduce) {
  body[data-app="art"] :is(button, .btn, .button, [role="button"], .download-link) {
    transition: none !important;
  }
}