/*
 * 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.
 */

/* Loading indicator for Turbo Frame navigation */
turbo-frame#recent_bids[aria-busy="true"] {
  position: relative;
  pointer-events: none;
}

turbo-frame#recent_bids[aria-busy="true"]::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.6);
  z-index: 10;
}

turbo-frame#recent_bids[aria-busy="true"]::before {
  content: "";
  position: fixed;
  top: 50%;
  left: 50%;
  width: 2.5rem;
  height: 2.5rem;
  margin: -1.25rem 0 0 -1.25rem;
  border-radius: 50%;
  background: conic-gradient(
    #ff3b30, #ff9500, #ffcc00, #34c759,
    #007aff, #af52de, #ff2d55, #ff3b30
  );
  z-index: 11;
  animation: turbo-spin 0.8s linear infinite;
}

@keyframes turbo-spin {
  to { transform: rotate(360deg); }
}

/* Inline conic-gradient spinner — matches the Turbo Frame loader. */
.rfp-spinner {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background: conic-gradient(
    #ff3b30, #ff9500, #ffcc00, #34c759,
    #007aff, #af52de, #ff2d55, #ff3b30
  );
  animation: turbo-spin 0.8s linear infinite;
  vertical-align: middle;
}

.rfp-spinner-lg {
  width: 2.5rem;
  height: 2.5rem;
}

/* Full-viewport overlay with a centered spinner. Used during full-page form
   submissions where the navigation will replace the page on completion. */
.rfp-overlay {
  position: fixed;
  inset: 0;
  background: rgba(255, 255, 255, 0.6);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}