/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 *= require_tree .
 *= require_self
 */

/* .hidden {
  display: none;
} */

/* Section styling */
.section {
  margin-bottom: 2rem;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  overflow: hidden;
  background: #ffffff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.section-header {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  padding: 1rem 1.5rem;
  border-bottom: 1px solid #e2e8f0;
}

.section-title {
  margin: 0;
  color: white;
  font-size: 1.25rem;
  font-weight: 600;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.section-questions {
  /* padding: 1.5rem; */
  padding: .2rem;
}

/* Base spacing for all visible question divs */
.section-questions > div:not(.hidden) {
  /* margin-bottom: 1.5rem; */
}

/* Add border only if there's another visible element after this one */
.section-questions > div:not(.hidden):has(~ div:not(.hidden)) {
  border-bottom: 1px solid #f1f5f9;
  /* padding-bottom: 1.5rem; */
}

/* Enhance question visibility within sections */
.section-questions .transition-all {
  transition: opacity 0.3s ease, max-height 0.3s ease, margin 0.3s ease;
}

/* .section-questions .hidden {
  opacity: 0;
  max-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
} */

/* .hidden {
  display: none;
} */