/* cmsms stylesheet: ISS_style modified: Friday, May 8, 2026 11:08:38 PM */
/* Container to constrain the width */
.carousel-container {
  width: 100%;
  max-width: 400px; /* Adjust based on your layout */
  margin: 0 auto;
}

/* The scrollable track */
.carousel-track {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  gap: 16px;
  padding: 16px;
  
  /* Hide scrollbars for a cleaner UI */
  scrollbar-width: none; /* Firefox */
  -webkit-overflow-scrolling: touch; /* Smooth iOS scrolling */
}

.carousel-track::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Edge */
}

/* Individual link cards */
.carousel-item {
  flex: 0 0 85%; /* Shows a peek of the next card */
  scroll-snap-align: center; /* Snaps the card to the middle */
  display: flex;
  align-items: center;
  justify-content: center;
  height: 200px;
  background: linear-gradient(135deg, #6e8efb, #a777e3);
  color: white;
  text-decoration: none;
  font-size: 1.5rem;
  font-family: sans-serif;
  font-weight: bold;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
  transition: transform 0.2s ease;
  user-select: none; /* Prevents text highlighting when dragging */
}

.carousel-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 15px rgba(0,0,0,0.2);
}