/* NTC Answer Styles */
.ntc-answer {
  /* container-level spacing for small screens */
  padding: 0.25rem;
}

.ntc-answer a {
  color: #fff;
  font-size: 1.875rem; /* 32px ~ 1.875rem */
  padding: 0.75rem 1rem;
  display: inline-block;
  text-decoration: none;
  line-height: 1; /* keeps vertical alignment tidy */
}

/* Current Activity */
.current-activity {
  border: 2px solid #000;
  border-radius: 4px;
}

/* Skip Status */
.is-skipped {
  background: #e53935; /* slightly softer red */
  color: #fff;
}

.not-skipped {
  background: #2e7d32; /* slightly softer green */
  color: #fff;
}

/* Shared Skip/Not-Skip Styles */
.is-skipped,
.not-skipped {
  text-align: center;
  margin: 0 auto;
  padding: 0.5rem;
  min-width: 2.25rem;   /* ensures a sensible touch target */
  min-height: 2.25rem;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Exam Answers Block Layout - responsive grid */
.exam-answer-block {
  display: grid;
  gap: 0.75rem; /* ~12px */
  grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));
  align-items: start;
  width: 100%;
  padding: 0.5rem;
  box-sizing: border-box;
}

/* Example styling for each grid item (views-row) */
.exam-answer-block .views-row {
  background: #f5f5f5;
  padding: 0.5rem;
  border-radius: 6px;
  text-align: center;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

/* Larger anchors/buttons inside grid items scale down on small screens */
.exam-answer-block .views-row .ntc-answer a {
  font-size: 1.125rem; /* ~18px for better fit on small cards */
  padding: 0.5rem;
}

/* Responsive breakpoints (optional refinements) */
@media (min-width: 480px) {
  .exam-answer-block {
    grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
  }

  .ntc-answer a {
    font-size: 2rem; /* ~32px on larger small screens */
    padding: 0.75rem 1rem;
  }
}

@media (min-width: 768px) {
  .exam-answer-block {
    grid-template-columns: repeat(10, 1fr); /* restore ten columns on wide screens */
    gap: 0.75rem;
    padding: 0.75rem;
  }

  .exam-answer-block .views-row {
    padding: 0.75rem;
  }

  .exam-answer-block .views-row .ntc-answer a {
    font-size: 1.875rem; /* ~30-32px */
    padding: 0.75rem 1rem;
  }
}

@media (min-width: 1024px) {
  .ntc-answer a {
    font-size: 2rem;
  }
}