.scroll-row {
    display: flex;
    overflow-x: scroll;
    scroll-behavior: smooth;
    gap: 15px;
    padding: 10px 0;
  }

  .scroll-row .content {
    flex: 0 0 auto;
    cursor: pointer;
    transition: transform 0.3s;
  }

  .scroll-row .content img {
    height: 350px;
    border-radius: 8px;
    display: block;
  }

  .scroll-row .content:hover {
    transform: scale(1.05);
  }

  /* Lightbox overlay */
  #lightboxPriorities {
    display: none; /* hidden by default */
    position: fixed;
    z-index: 9999;
    top:0; left:0;
    width:100%; height:100%;
    background-color: rgba(0,0,0,0.85);
    justify-content: center;
    align-items: center;
  }

  #lightboxPriorities img {
    max-width: 90%;
    max-height: 80%;
    border-radius: 10px;
    transition: transform 1s ease;
  }

  #lightboxPriorities button {
    position: absolute;
    border: none;
    padding: 10px 15px;
    font-size: 14px;
    cursor: pointer;
    border-radius: 5px;
    background: rgba(255,255,255,0.8);
  }

  #closeBtnPriorities { top: 20px; right: 20px; background: #fff; }
  #prevBtnPriorities { top: 50%; left: 20px; transform: translateY(-50%); }
  #nextBtnPriorities { top: 50%; right: 20px; transform: translateY(-50%); }

 @keyframes iridescent {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.iridescent-box {
  text-align: center;
  background: linear-gradient(
  135deg,
  #B3272C,
  #C4323B,
  #EC3B43,
  #9E1F28,
  #7F1B24
);
  background-size: 400% 400%;
  animation: iridescent 12s ease infinite;
  padding: 20px;
  border-radius: 10px;
  color: #fff;
}

/* Grey cards adjustments */
/* Make the row scrollable horizontally */
.row-horizontal-scroll {
  display: flex;
  flex-wrap: nowrap; /* keep everything in one row */
  overflow-x: auto;
  gap: 7px; /* space between cards */
  padding: 20px 0;
  scroll-behavior: smooth;
}

/* Make each column stay its natural width and not shrink */
.row-horizontal-scroll > div {
  flex: 0 0 auto;
  min-width: 350px; /* adjust so text fits */
}

/* Optional: hide scrollbar on Webkit browsers for a cleaner look */
.row-horizontal-scroll::-webkit-scrollbar {
  height: 8px;
}
.row-horizontal-scroll::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,0.2);
  border-radius: 4px;
}
.row-horizontal-scroll::-webkit-scrollbar-track {
  background: transparent;
}