/* Compact input fields for all forms and modals */
.modal-content .form-input,
.modal-content .eleventa-input,
.modal-content select.form-input,
.modal-content select.eleventa-input,
.modal-content textarea.form-input,
.modal-content textarea.eleventa-input,
form .form-input,
form .eleventa-input,
form select.form-input,
form select.eleventa-input,
form textarea.form-input,
form textarea.eleventa-input {
  font-size: 0.9rem !important;
  padding: 0.9rem 0.9rem !important;
  box-sizing: border-box;
}

/* Ensure the actual runtime wrapper (.modal-content-wrapper) also receives compact styles
   and that select controls show visible text inside modals */
.modal-content-wrapper .form-input,
.modal-content-wrapper .eleventa-input,
.modal-content-wrapper select.form-input,
.modal-content-wrapper select.eleventa-input,
.modal-content-wrapper textarea.form-input,
.modal-content-wrapper textarea.eleventa-input {
  font-size: 0.9rem !important;
  padding: 0.5rem 0.6rem !important;
  color: #111827 !important; /* dark visible text */
  background-color: #ffffff !important;
  line-height: 1.25 !important;
  box-sizing: border-box;
}

/* Ensure modal wrapper is constrained and scrollable on small screens */
.modal-content-wrapper {
  max-height: 85vh !important;
  overflow-y: auto !important;
}

/* Make selects inside modals render with proper height and padding so selected text is visible */
.modal-content-wrapper select.form-input,
.modal-content-wrapper select.eleventa-input,
.modal-content-wrapper select {
  height: auto !important;
  min-height: 2rem !important; /* ensure enough vertical space for text */
  line-height: 1.4 !important;
  padding-right: 2.2rem !important; /* leave space for native arrow */
  -webkit-appearance: menulist-button !important;
  appearance: menulist-button !important;
  background-position: right 0.6rem center !important;
  background-size: 1.2em auto !important;
}

/* Slightly reduce textarea min-height inside modals to avoid excessive vertical space */
.modal-content-wrapper textarea.form-input,
.modal-content-wrapper textarea.eleventa-input {
  min-height: 2.4rem !important;
}

.modal-content textarea.form-input,
.modal-content textarea.eleventa-input,
form textarea.form-input,
form textarea.eleventa-input {
  min-height: 18px !important;
  height: auto !important;
}

/* 
   Specific overrides for .eleventa-input to ensure they are truly compact 
   matching the h-7 (1.75rem) and py-0.5 (0.125rem) utility classes 
*/
.modal-content-wrapper input.eleventa-input,
.modal-content-wrapper select.eleventa-input {
    padding-top: 0.125rem !important;
    padding-bottom: 0.125rem !important;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
    height: 1.75rem !important;
    min-height: 0 !important;
    font-size: 0.875rem !important;
    line-height: 1.25rem !important;
}

/* Adjust select specifically to ensure text is visible */
.modal-content-wrapper select.eleventa-input {
    padding-right: 1.5rem !important; /* Space for arrow */
}