/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Sortable JS styles */
.sortable-ghost {
  opacity: 0.5;
}

.sortable-chosen {
  background-color: rgba(59, 130, 246, 0.1);
}

.sortable-drag {
  opacity: 0.8;
}

/* The product reorder handle is only actionable when the admin list is in
   sortable mode (no active search/filter). Driving visibility off the
   controller ancestor — rather than a server-rendered flag — keeps
   Turbo-broadcast row replacements consistent regardless of the viewer's
   filter state. */
.product-reorder-handle {
  display: none;
}

[data-controller~="sortable-products"] .product-reorder-handle {
  display: inline-flex;
}