/* Label styling */
.gfield_label_slider {
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 8px;
  padding: 0;
  color: #5a4e35;
}


/* Label values below the slider */
.slider-values {
  display: flex;
  justify-content: space-between;
  font-size: 1.125rem;
  color: #5a4e35;
  margin-top: 0.8em;
}

/* Add padding to slider containers */
.slider-card {
  margin: 2rem 1.5rem;
}

.bold {
  font-weight: 700;
  white-space: nowrap;
}

/* Make the holiday message a single block, not a flex row */
#holiday_message.slider-values {
  display: block !important;
  justify-content: flex-start !important;
  /* optional: ensure long lines wrap naturally */
  white-space: normal !important;
  text-align: left;
}

/* Shift request message flows as a single block */
#work_range_output.slider-values {
  display: block !important;
  justify-content: flex-start !important;
  /* optional: ensure long lines wrap naturally */
  white-space: normal !important;
  text-align: left;
}

/* Default slider color before status is chosen */
#work_range_slider .noUi-connect {
  background-color: #5a4e35; /* Submit button brown */
}

/* Work range outpot change justification */
#work_range_output {
  text-align: left;
}

/* Conditional slider colouring classes */
/* inner bar (you already have these) */
.slider-connect-green   { background-color: #62c36e !important; }
.slider-connect-red     { background-color: #d45656 !important; }

/* outer track */
.slider-track-green     { background-color: #62c36e !important; }
.slider-track-red       { background-color: #d45656 !important; }


/* Only apply to the holiday (pay/rest) slider */
.holiday-slider .noUi-connect {
  background-color: #00B0F0 !important; /* Holiday (paid) – blue */
}

.holiday-slider .noUi-base {
  background-color: #F79646 !important; /* Rest (unpaid) – orange */
}