/* Barra canônica de ações das missões. Todas as variações de alinhamento,
   visibilidade e prioridade ficam neste componente. */
.nulo-action-bar {
  order: 10;
  position: relative;
  z-index: var(--nulo-layer-action-bar);
  isolation: isolate;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--nulo-control-gap);
  width: 100%;
  margin: 0;
  padding: var(--nulo-space-2) 0 max(var(--nulo-space-2), env(safe-area-inset-bottom));
  border-top: 1px solid rgba(183, 155, 255, .18);
  background: linear-gradient(180deg, rgba(1, 7, 11, .74), var(--nulo-surface-action) 28%);
  pointer-events: auto;
}

.nulo-action-bar.sem-executar {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.nulo-action {
  position: relative;
  z-index: 1;
  min-width: 0;
  min-height: var(--nulo-control-height);
  margin: 0;
  padding: 9px 12px;
  border: 1px solid rgba(183, 155, 255, .30);
  border-radius: var(--nulo-control-radius);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  overflow: hidden;
  color: var(--texto-fraco, #a8bbc7);
  background: rgba(7, 13, 20, .86);
  font: 700 .6875rem/1.25 var(--fonte-codigo, var(--mono, "JetBrains Mono", monospace));
  letter-spacing: .08em;
  text-transform: uppercase;
  text-align: center;
  cursor: pointer;
  touch-action: manipulation;
}

.nulo-action > span {
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  min-width: 1.25em;
  margin: 0;
  color: var(--frio, #78f5ff);
  font-size: 1.125rem;
}

.nulo-action > b {
  min-width: 0;
  margin: 0;
  font: inherit;
  overflow-wrap: anywhere;
}

.nulo-action:hover {
  color: var(--texto, #eefbff);
  border-color: var(--borda-viva, #78f5ff);
  background: var(--nulo-surface-action-hover);
}

.nulo-action:focus-visible {
  color: var(--texto, #eefbff);
  border-color: var(--borda-viva, #78f5ff);
  outline: var(--nulo-focus-ring);
  outline-offset: 2px;
}

.nulo-action--primary {
  color: #230055;
  border-color: var(--quente, #ffd34f);
  background: linear-gradient(180deg, var(--marca-amarelo-luz, #fff0a6), var(--marca-amarelo, #ffd34f));
  box-shadow: 0 0 25px rgba(255, 211, 79, .14);
}

.nulo-action--primary > span { color: #230055; }
.nulo-action--primary:hover,
.nulo-action--primary:focus-visible {
  color: #17003b;
  border-color: #fff1ba;
  background: linear-gradient(180deg, #fff1ba, var(--marca-amarelo, #ffd34f));
}

.nulo-action--danger:hover,
.nulo-action--danger:focus-visible {
  color: var(--nulo-danger);
  border-color: rgba(255, 128, 110, .62);
}

.nulo-action--menu,
.atividade-ir-resposta {
  display: none;
}

.nulo-action[hidden] { display: none !important; }

@media (max-width: 900px) {
  .nulo-action-bar,
  .nulo-action-bar.sem-executar {
    position: sticky;
    bottom: 0;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 52px;
    gap: 8px;
    padding-top: 7px;
  }

  .nulo-action {
    min-height: 50px;
    padding: 8px 9px;
    font-size: .6875rem;
    letter-spacing: .055em;
  }

  .nulo-action--secondary { display: none; }
  .nulo-action--menu { display: inline-flex; grid-column: 3; }
  .nulo-action--support { grid-column: 1; }
  .nulo-action--primary { grid-column: 2; }

  .nulo-action-bar.opcoes-abertas .nulo-action--secondary {
    display: inline-flex;
    grid-column: 1 / -1;
  }

  .atividade-shell[data-etapa-mobile="caso"] .nulo-action--support,
  .atividade-shell[data-etapa-mobile="apoio"] .nulo-action--support,
  .atividade-shell[data-etapa-mobile="caso"] #x-executar-foco,
  .atividade-shell[data-etapa-mobile="apoio"] #x-executar-foco {
    display: none;
  }

  .atividade-shell[data-etapa-mobile="caso"] .atividade-ir-resposta,
  .atividade-shell[data-etapa-mobile="apoio"] .atividade-ir-resposta {
    display: inline-flex;
    grid-column: 1 / 3;
  }
}

@media (max-width: 480px) {
  .nulo-action-bar,
  .nulo-action-bar.sem-executar {
    grid-template-columns: minmax(0, 1fr) 50px;
  }
  .nulo-action--support,
  .nulo-action--primary,
  .atividade-ir-resposta { grid-column: 1; }
  .atividade-shell[data-etapa-mobile="caso"] .nulo-action-bar .atividade-ir-resposta,
  .atividade-shell[data-etapa-mobile="apoio"] .nulo-action-bar .atividade-ir-resposta {
    grid-column: 1;
    grid-row: 1;
  }
  .nulo-action--menu { grid-column: 2; grid-row: 1; }
  .nulo-action-bar.opcoes-abertas .nulo-action--secondary { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
  .nulo-action { transition: none !important; }
}