/* Additional AI operations card: keeps the main stylesheet stable and easy to customize. */
.node-doc { min-width: 222px !important; }

.node-automation {
  right: -20px;
  bottom: 3%;
  min-width: 218px !important;
  animation-delay: -2.4s !important;
}

.automation-flow {
  display: flex;
  align-items: center;
  gap: 5px;
  height: 16px;
  margin-top: 11px;
}

.automation-flow i {
  position: relative;
  width: 24px;
  height: 3px;
  overflow: hidden;
  border-radius: 4px;
  background: rgba(69, 222, 194, .22);
}

.automation-flow i::after {
  position: absolute;
  inset: 0;
  width: 45%;
  border-radius: inherit;
  background: var(--teal);
  box-shadow: 0 0 8px var(--teal);
  content: "";
  animation: automation-flow 1.8s ease-in-out infinite;
}

.automation-flow i:nth-child(2)::after { animation-delay: -.45s; }
.automation-flow i:nth-child(3)::after { animation-delay: -.9s; }
.automation-flow i:nth-child(4)::after { animation-delay: -1.35s; }

@keyframes automation-flow {
  50% { opacity: .3; transform: translateX(150%); }
}

@media (max-width: 900px) {
  .node-automation { right: -12px; bottom: 3%; }
}

@media (max-width: 680px) {
  .node-doc { min-width: 140px !important; }
  .node-automation { right: -4%; bottom: 8%; min-width: 150px !important; }
  .automation-flow { display: none; }
  .node-automation .node-heading b { font-size: .71rem; }
}

@media (min-width: 681px) {
  .advanced-visual .visual-caption { right: 2%; bottom: -36px; }
}

@media (prefers-reduced-motion: reduce) {
  .automation-flow i::after { animation: none; }
}
