/****** PACIFIC APC — Booking CSS (compact + label caps + no phone flag + pills + full-row toggle) ******/

/* --- knobs --- */
:root{
  --field-gap:3px;         /* small vertical gap between fields */
  --input-vpad:6px;
  --input-hpad:8px;
  --label-bottom:0px;
  --accent:#c77000;
}

/* Base / typography */
#sb_booking_content,#sb_main,.detail-step,.left-side{line-height:1.25!important;font-size:16px;}
#sb_back_button{margin-bottom:4px!important;}
.left-side .custom-form,.left-side .add-details,#sb_client_info_container{margin-top:2px!important;}

/* Kill form gaps everywhere on the left pane */
#sb_booking_content .form-horizontal .form-group{margin:0!important;padding:0!important;}
#sb_booking_content form,
#sb_client_info_container,#sb_attribute_container,#sb_product_container{
  gap:var(--field-gap)!important;
  row-gap:var(--field-gap)!important;
}

/* ===== Client info ===== */
#sb_client_info_container .form-group,
#sb_client_info_container .sb-form-row,
#sb_client_info_container li,
#sb_client_info_container p{
  margin:0 0 var(--field-gap) 0!important;
  padding:0!important;
}
#sb_client_info_container .input-group{margin:0!important;padding:0!important;}

#sb_client_info_container .form-group label,
#sb_client_info_container .control-label{margin:0 0 var(--label-bottom) 0!important;padding:0!important;font-weight:600;}

#sb_client_info_container .form-group input,
#sb_client_info_container .form-group select,
#sb_client_info_container .form-group textarea{
  margin:0!important;
  padding:var(--input-vpad) var(--input-hpad)!important;
  line-height:1.2!important;
  box-sizing:border-box;
}

/* Hide helper text spacing */
#sb_client_info_container .help-block,
#sb_client_info_container .description,
#sb_client_info_container .duration,
#sb_client_info_container .error,
#sb_client_info_container .hint{
  margin:0!important;padding:0!important;height:0!important;overflow:hidden!important;
}

/* ===== Additional/custom questions ===== */
#sb_attribute_container .form-group,
#sb_attribute_container .sb-form-row,
#sb_attribute_container li,
#sb_attribute_container p{
  margin:0 0 var(--field-gap) 0!important;
  padding:0!important;
}
#sb_attribute_container label,
#sb_attribute_container .control-label{margin:0 0 var(--label-bottom) 0!important;padding:0!important;font-weight:600;}

#sb_attribute_container input,
#sb_attribute_container select,
#sb_attribute_container textarea{
  margin:0!important;
  padding:var(--input-vpad) var(--input-hpad)!important;
  line-height:1.2!important;
  box-sizing:border-box;
}

/* ===== Legacy (Zend/jQuery UI) ===== */
#eventForm dd.extention_data,
#eventForm dd.extention_data dl.zend_form,
#eventForm dd.extention_data dl.zend_form dt,
#eventForm dd.extention_data dl.zend_form dd{
  margin:0 0 var(--field-gap) 0!important;
  padding:0!important;
}
#eventForm dd.extention_data input,
#eventForm dd.extention_data select,
#eventForm dd.extention_data textarea{
  margin:0!important;
  padding:var(--input-vpad) var(--input-hpad)!important;
}

/* ===== Angular Material guard ===== */
.mat-mdc-form-field,.mat-form-field{margin:0!important;padding:0!important;}
.mat-mdc-form-field-infix,.mat-form-field-infix{padding:2px 0!important;min-height:32px!important;}
.mat-mdc-form-field-subscript-wrapper,.mat-form-field-subscript-wrapper{height:0!important;margin:0!important;padding:0!important;overflow:hidden!important;}

/* ===== Common rows/gutters ===== */
#sb_booking_content .row,
#sb_booking_content [class*="col-"],
#sb_booking_content ul,#sb_booking_content li{
  padding-top:0!important;padding-bottom:0!important;margin-top:0!important;margin-bottom:0!important;
}

/* ===== Buttons ===== */
#eventForm #save_button,
#eventForm input.reserve_time_btn,
#eventForm input.select_another_btn{margin-top:12px!important;}

/* ===== Mobile ===== */
@media (max-width:640px){:root{--input-vpad:8px;--input-hpad:10px;}}

/* ===== Labels: capitalize only first word ===== */
#sb_client_info_container .form-group label,
#sb_client_info_container .control-label,
#sb_additional_fields_container .form-group label,
#sb_additional_fields .form-group label,
#sb_attribute_container .form-group label,
#sb_attribute_container .control-label,
#eventForm dd.extention_data label,
form label{ text-transform:lowercase!important; }
#sb_client_info_container .form-group label::first-letter,
#sb_client_info_container .control-label::first-letter,
#sb_additional_fields_container .form-group label::first-letter,
#sb_additional_fields .form-group label::first-letter,
#sb_attribute_container .form-group label::first-letter,
#sb_attribute_container .control-label::first-letter,
#eventForm dd.extention_data label::first-letter,
form label::first-letter{ text-transform:uppercase!important; }

/* ===== Phone field: hide flag/dropdown, keep single input ===== */
#sb_client_info_container .form-group.form-client-phone .iti .iti__flag-container,
#sb_client_info_container .form-group.form-client-phone .iti .iti__country-list,
#sb_client_info_container .form-group.form-client-phone .iti .iti__arrow{
  display:none!important;visibility:hidden!important;width:0!important;margin:0!important;padding:0!important;
}
#sb_client_info_container .form-group.form-client-phone .iti{
  display:block!important;width:100%!important;padding-left:0!important;
}
#sb_client_info_container .form-group.form-client-phone .iti input[type="tel"]{
  display:block!important;width:100%!important;
  padding-left:var(--input-hpad)!important;
  margin-bottom:var(--field-gap)!important;
}
#sb_client_info_container .form-group.form-client-phone .iti input[type="tel"] ~ input[type="tel"]{display:none!important;}

/* ===== Add-on “pills” ===== */
#sb_additional_fields_container .form-group.form-group--checkbox{position:relative;}

/* Make whole add-on area clickable */
#sb_additional_fields_container .form-group.form-group--checkbox input[type="checkbox"]{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  opacity:0!important;
  cursor:pointer!important;
  margin:0!important;
  z-index:2!important;
}

/* Label & pill text */
#sb_additional_fields_container .form-group.form-group--checkbox label{
  display:inline-block;
  position:relative;
  padding-right:0;
  z-index:1;
}
#sb_additional_fields_container .form-group.form-group--checkbox label::after{
  content:"Add service";
  display:inline-block;
  margin-top:10px;
  padding:6px 12px;
  border-radius:999px;
  border:2px solid var(--accent);
  color:var(--accent);
  font-weight:600;
  cursor:pointer;
}
#sb_additional_fields_container .form-group.form-group--checkbox:has(input[type="checkbox"]:checked) label::after{
  content:"Service added";
  background:var(--accent);
  color:#FF6313;
  border-color:var(--accent);
}

/* Hover feedback */
#sb_additional_fields_container .form-group.form-group--checkbox:hover label::after{
  filter:brightness(0.95);
}