#booking-wrapper {
      max-width: 80%;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 6%;
    border-radius: 10px;
    color: #fff;
    margin: auto;
}

.steps {
    display: flex;
    margin-bottom: 20px;
}
.step {
    flex: 1;
    text-align: center;
    padding: 10px;
    background: #222;
    color: #fff;
    cursor: pointer;
    border-bottom: 3px solid transparent;
}
.step.active {
    border-bottom: 3px solid #FF781E;
}

.field-label {
    font-weight: bold;
    margin-top: 10px;
    display: block;
    margin-bottom: 5px;
}
.time-options{
        padding: 20px;
}
.icon {
    margin-right: 5px;
}
.flatpickr-calendar.inline{
    width: 100%;
    max-width: 100%;
    background: transparent;
   box-shadow: none;
}
.flatpickr-current-month, span.flatpickr-weekday{
    color: #fff;
}
.dayContainer{
       width: 100%;
    max-width: 100%;
}
.flatpickr-days{
       width: 100%;
    max-width: 100%;
}
.flatpickr-innerContainer, .flatpickr-rContainer{
    display: block;
    width: 100%;
    max-width: 100%;
}
input, textarea {
    width: 100%;
    padding: 8px;
    margin-bottom: 10px;
    border-radius: 6px;
    border: none;
}

.time-options button {
    background: #333;
    color: white;
    border: 2px solid #FF781E;
    margin-right: 10px;
    margin-top: 5px;
    border-radius: 6px;
    padding: 5px 10px;
    cursor: pointer;
}
.time-options button.active {
    background: #FF781E;
    color: white;
}

button.next-step, button.back-step, button.submit-booking {
    margin-top: 15px;
    background: #FF781E;
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 6px;
    cursor: pointer;
}
.actions {
    display: flex;
    justify-content: space-between;
}
/* Lớp phủ mờ */
.popup-overlay {
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.6);
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Hộp nội dung popup */
.popup-success {
  background: #fff;
  padding: 30px 40px;
  border-radius: 10px;
  text-align: center;
  max-width: 400px;
  width: 100%;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.popup-success .checkmark {
  font-size: 60px;
  color: #FF781E;
  margin-bottom: 15px;
}
.popup-success{
        color: #222;
}
.booking-input, .booking-select {
    padding: 6px 10px;
    font-size: 14px;
    width: 100%;
    box-sizing: border-box;
}
.booking-actions {
    display: flex;
    gap: 5px;
}
.booking-actions .button {
    padding: 6px 12px;
    font-size: 14px;
}
.section_label{
    border:1px solid #fff;
    border-radius: 8px;
    padding-bottom: 20px;
    margin-bottom: 20px;
}
.section_label .field-label{
     background: #fff;
    margin-top: 0;
    padding: 10px;
    border-radius: 8px 8px 0 0;
    font-family: "Sarabun", Sans-serif;
    font-weight: 400;
    color: #222;
    vertical-align: bottom;
    display: flex;
    align-items: center;
}
.section_label i{
margin-right: 15px;
}
.section_label input{
  width: 90% !important;
    margin: auto;
    display: block;
    background: transparent;
    border: 0 !important;
    border-bottom: 1px solid #8f8e8e !important;
    border-radius: 0 !important;
    color: #fff;

}
[type=button]:focus, [type=button]:hover, [type=submit]:focus, [type=submit]:hover, button:focus, button:hover{
    background-color: #ff781e !important;
}
.flatpickr-day{
    color:  #fff;
    max-width: 100%;
}
.flatpickr-day.today{
        border-color: #ff781e;
   
}
.flatpickr-day.endRange, .flatpickr-day.endRange.inRange, .flatpickr-day.endRange.nextMonthDay, .flatpickr-day.endRange.prevMonthDay, .flatpickr-day.endRange:focus, .flatpickr-day.endRange:hover, .flatpickr-day.selected, .flatpickr-day.selected.inRange, .flatpickr-day.selected.nextMonthDay, .flatpickr-day.selected.prevMonthDay, .flatpickr-day.selected:focus, .flatpickr-day.selected:hover, .flatpickr-day.startRange, .flatpickr-day.startRange.inRange, .flatpickr-day.startRange.nextMonthDay, .flatpickr-day.startRange.prevMonthDay, .flatpickr-day.startRange:focus, .flatpickr-day.startRange:hover{
    border-color: #ff781e;
    background: #ff781e;
}
.flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled:hover{
    color:#939393;
}
.step-content.step-2 label{
display: block;
margin-bottom:  20px;
}
.step-content.step-2 input,.step-content.step-2 textarea{
    background: transparent;
      color: #fff !important;
}
.step-content.step-2 input[type=date], .step-content.step-2 input[type=email], .step-content.step-2 input[type=number], .step-content.step-2 input[type=password], input[type=search], input[type=tel], input[type=text], input[type=url], select, textarea{
    border: 1px solid #fff !important;
    color: #fff !important;
}
.flatpickr-current-month .flatpickr-monthDropdown-months{
    border: 0 !important;
}
.time-options { display:flex; gap:10px; flex-wrap:wrap }
.time-options button { padding:10px 14px; border:1px solid #ddd; border-radius:10px; }
.time-options button.active { outline: 2px solid #000; }
.time-options button.is-disabled,
.time-options button[disabled] { opacity:.5; cursor:not-allowed; pointer-events:none; }
.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month{
  background-color: #201b1b;
  border:none !important;
}
@media (max-width: 768px){
    #booking-wrapper{
        max-width: 100%;
    }
}