/* Amoria Slider Styles */
.amoria-slider-wrapper {
  position: relative;
  width: 100%;
  overflow: hidden; /* Ensures both slider and wave area are clipped */
}


.amoria-slider-container {
  background-color: #face7c; /* Dark grey background for text slider */
  padding: 10px 0; /* Vertical padding for the text */
  box-sizing: border-box;
  font-style: var(--amoria-slider-font-style, normal);
  font-family: "Montserrat", sans-serif; /* Assuming Inter is loaded by theme */
  color: var(--amoria-slider-font-color, #D4AF37);
  font-weight: var(--amoria-slider-font-weight, 700);
  font-size: var(--amoria-slider-font-size, 1em);
  white-space: nowrap; /* Keep all items on one line */
  display: flex; /* Use flexbox for alignment */
  align-items: center; /* Vertically center items */
  min-height: 60px; /* Ensure enough height for content and padding */
  position: relative; /* Needed for z-index */
  z-index: 15; /* Ensure slider is above the wave */
  overflow: hidden; /* Explicitly hide overflow for the text slider */
}

.amoria-slider-content {
  display: flex; /* Use flex for the content wrapper */
  width: max-content; /* Allow content to be as wide as needed */
  min-width: 200%; /* Ensure content is wide enough for animation to be visible */
  animation: amoria-slide-left var(--amoria-slider-speed) linear infinite;
}

.amoria-slider-item {
  display: inline-flex; /* Use flex for item content to align stars */
  align-items: center;
  margin-right: var(--amoria-slider-gap);
  vertical-align: middle; /* Align items vertically */
  flex-shrink: 0; /* Prevent items from shrinking */
}

.amoria-slider-item .amoria-slider-star {
  margin-right: 2px; /* Space between stars */
  vertical-align: middle;
  /* The star stroke color is #D4AF37 (gold) from the PHP.
     It should still be visible against the dark grey background. */
}

/* Keyframe animation for sliding from right to left (TEXT) */
@keyframes amoria-slide-left {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}



/* Responsive adjustments */
@media (max-width: 768px) {
  .amoria-slider-container {
    font-size: 1em;
    padding: 15px 0;
  }
  .amoria-slider-item {
    margin-right: 20px; /* Smaller gap on mobile */
  }
}
@media (max-width: 480px) {
  .amoria-slider-container {
    font-size: 0.9em;
    padding: 10px 0;
  }
  .amoria-slider-item {
    margin-right: 15px;
  }
}
