/* SIAPIYA_OPERATIONAL_FINAL_FEEDBACK_A11Y_V37047
   Operational & Monitoring Workspace UX Wave 4 — Final Action Feedback & Accessibility Polish.
   Visual/client feedback only; existing Swal/backend remains result authority. */

#mainContent[data-siapiya-operational-ux="1"]{
  --siapiya-operational-final-border:color-mix(in srgb,var(--bs-border-color) 92%,transparent);
  --siapiya-operational-final-radius:.86rem;
}

/* Final feedback states do not claim business success/failure. */
#mainContent[data-siapiya-operational-ux="1"] .siapiya-operational-selected-context[data-operational-feedback-state="pending"]{
  border-color:color-mix(in srgb,var(--bs-primary) 46%,var(--siapiya-operational-final-border));
  background:color-mix(in srgb,var(--bs-primary-bg-subtle) 28%,var(--bs-body-bg));
}

#mainContent[data-siapiya-operational-ux="1"] .siapiya-operational-selected-context[data-operational-feedback-state="pending"] .siapiya-operational-selected-state::after{
  content:"";
  width:.72rem;
  height:.72rem;
  margin-inline-start:.38rem;
  border:2px solid currentColor;
  border-inline-end-color:transparent;
  border-radius:999px;
  animation:siapiya-operational-feedback-spin .78s linear infinite;
}

#mainContent[data-siapiya-operational-ux="1"] .siapiya-operational-selected-context[data-operational-feedback-state="refreshed"]{
  border-color:color-mix(in srgb,var(--bs-info) 46%,var(--siapiya-operational-final-border));
  background:color-mix(in srgb,var(--bs-info-bg-subtle) 25%,var(--bs-body-bg));
}

@keyframes siapiya-operational-feedback-spin{
  to{transform:rotate(360deg)}
}

/* Existing queue actions receive consistent touch/focus treatment. */
#mainContent[data-siapiya-operational-ux="1"] table tbody :is(button,.btn,[role="button"]){
  min-block-size:2.65rem;
  min-inline-size:2.65rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.3rem;
}

#mainContent[data-siapiya-operational-ux="1"] table tbody :is(button,.btn,[role="button"]) i{
  line-height:1;
}

#mainContent[data-siapiya-operational-ux="1"] table tbody :is(button,.btn,[role="button"]):disabled,
#mainContent[data-siapiya-operational-ux="1"] table tbody :is(button,.btn,[role="button"]).disabled{
  opacity:.58;
  cursor:not-allowed;
}

/* Action groups stay readable instead of collapsing into an indistinguishable icon strip. */
#mainContent[data-siapiya-operational-ux="1"] table tbody td:last-child{
  white-space:nowrap;
}

#mainContent[data-siapiya-operational-ux="1"] table tbody td:last-child > :is(.btn,button)+:is(.btn,button){
  margin-inline-start:.2rem;
}

/* Loading / empty / refreshed surfaces use a consistent final rhythm. */
#mainContent[data-siapiya-operational-ux="1"] :is(
  .siapiya-operational-lens,
  .siapiya-operational-selected-context,
  .table-responsive,
  .alert
){
  border-radius:var(--siapiya-operational-final-radius);
}

#mainContent[data-siapiya-operational-ux="1"] .table td[colspan].text-center:has(.spinner-border),
#mainContent[data-siapiya-operational-ux="1"] .table td[colspan].text-center:has(.spinner-grow){
  min-height:5rem;
  align-content:center;
}

#mainContent[data-siapiya-operational-ux="1"] .spinner-border,
#mainContent[data-siapiya-operational-ux="1"] .spinner-grow{
  vertical-align:-.125em;
}

/* Keyboard focus remains obvious even inside selected rows. */
#mainContent[data-siapiya-operational-ux="1"] tr.siapiya-operational-selected-row :is(
  button,.btn,a,[role="button"],input,select,textarea
):focus-visible{
  outline:3px solid color-mix(in srgb,var(--bs-primary) 60%,transparent);
  outline-offset:3px;
  box-shadow:none!important;
}

/* Avoid selected-row highlight drowning warning/success cues. */
#mainContent[data-siapiya-operational-ux="1"] tr.siapiya-operational-selected-row [class*="text-bg-"],
#mainContent[data-siapiya-operational-ux="1"] tr.siapiya-operational-selected-row .badge{
  position:relative;
  z-index:1;
}

/* Final typography density */
#mainContent[data-siapiya-operational-ux="1"] .siapiya-operational-lens-copy b,
#mainContent[data-siapiya-operational-ux="1"] .siapiya-operational-selected-label{
  text-wrap:pretty;
}

#mainContent[data-siapiya-operational-ux="1"] .siapiya-operational-selected-reason{
  max-width:72ch;
}

/* Dark mode */
[data-bs-theme="dark"] #mainContent[data-siapiya-operational-ux="1"] .siapiya-operational-selected-context[data-operational-feedback-state="pending"]{
  background:color-mix(in srgb,var(--bs-primary-bg-subtle) 18%,var(--bs-body-bg));
}

[data-bs-theme="dark"] #mainContent[data-siapiya-operational-ux="1"] .siapiya-operational-selected-context[data-operational-feedback-state="refreshed"]{
  background:color-mix(in srgb,var(--bs-info-bg-subtle) 16%,var(--bs-body-bg));
}

/* Mobile final polish */
@media (max-width:767.98px){
  #mainContent[data-siapiya-operational-ux="1"] .siapiya-operational-lens{
    gap:.6rem;
  }

  #mainContent[data-siapiya-operational-ux="1"] table tbody :is(button,.btn,[role="button"]){
    min-block-size:2.8rem;
    min-inline-size:2.8rem;
  }

  #mainContent[data-siapiya-operational-ux="1"] table tbody td:last-child{
    white-space:normal;
  }

  #mainContent[data-siapiya-operational-ux="1"] table tbody td:last-child > :is(.btn,button){
    margin-block:.1rem;
  }

  #mainContent[data-siapiya-operational-ux="1"] .siapiya-operational-selected-reason{
    line-height:1.42;
  }
}

@media (max-width:420px){
  #mainContent[data-siapiya-operational-ux="1"] .siapiya-operational-selected-context{
    border-radius:.68rem;
  }

  #mainContent[data-siapiya-operational-ux="1"] .siapiya-operational-selected-actions{
    line-height:1.35;
  }
}

/* High contrast */
@media (forced-colors:active){
  #mainContent[data-siapiya-operational-ux="1"] .siapiya-operational-selected-context[data-operational-feedback-state]{
    border-color:Highlight!important;
  }

  #mainContent[data-siapiya-operational-ux="1"] .siapiya-operational-selected-context[data-operational-feedback-state="pending"] .siapiya-operational-selected-state::after{
    border-color:CanvasText;
    border-inline-end-color:Canvas;
  }

  #mainContent[data-siapiya-operational-ux="1"] tr.siapiya-operational-selected-row :is(
    button,.btn,a,[role="button"],input,select,textarea
  ):focus-visible{
    outline:3px solid Highlight;
  }
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  #mainContent[data-siapiya-operational-ux="1"] .siapiya-operational-selected-context[data-operational-feedback-state="pending"] .siapiya-operational-selected-state::after{
    animation:none;
    border-inline-end-color:currentColor;
  }

  #mainContent[data-siapiya-operational-ux="1"] *,
  #mainContent[data-siapiya-operational-ux="1"] *::before,
  #mainContent[data-siapiya-operational-ux="1"] *::after{
    scroll-behavior:auto!important;
  }
}
