#booknetic_theme_9 *
{
    font-family: 'Poppins', sans-serif !important;
}
#booknetic_theme_9
{
    height: 750px;
}

#booknetic_theme_9 .booknetic_appointment_steps
{
    background: #325d8a;
}

#booknetic_theme_9 .booknetic_badge
{
    background: #f80860;
}
#booknetic_theme_9 .booknetic_appointment_steps_footer_txt2
{
    color: #f80860;
}
#booknetic_theme_9 .booknetic_step_title, #booknetic_theme_9 .booknetic_appointment_steps_footer_txt1
{
    color: #ffffff;
}

#booknetic_theme_9 .booknetic_selected_step > .booknetic_badge::after
{
background-color: #f80860;
}
#booknetic_theme_9 .booknetic_selected_step .booknetic_step_title
{
color: #ffffff;
}

#booknetic_theme_9 .booknetic_active_step .booknetic_badge, #booknetic_theme_9 .booknetic_calendar_days > div > span > i[a], #booknetic_theme_9 .booknetic_btn_success
{
    background: #50a054;
}
#booknetic_theme_9 .booknetic_active_step .booknetic_step_title
{
    color: #ffffff;
}

#booknetic_theme_9 .booknetic_btn_primary,
#booknetic_theme_9 .booknetic_selected_time,
#booknetic_theme_9 .booknetic_calendar_selected_day > div
{
    background: #325d8a !important;
    color: #ffffff !important;
}

#booknetic_theme_9 .booknetic_service_category, .booknetic_package_category, #booknetic_theme_9 .booknetic_service_extra_title, #booknetic_theme_9 .booknetic_times_title, #booknetic_theme_9 .booknetic_text_primary
{
    color: #325d8a !important;
}

#booknetic_theme_9 .booknetic_category_accordion .booknetic_service_category span,
#booknetic_theme_9 .booknetic_category_accordion .booknetic_service_extra_title span{
    background: #325d8a !important;
}

#booknetic_theme_9 .booknetic_appointment_container_header
{
    color: #292d32 !important;
}

#booknetic_theme_9 .booknetic_service_card_selected,
#booknetic_theme_9 .booknetic_card_selected,
#booknetic_theme_9 .booknetic_service_extra_card_selected,
#booknetic_theme_9 .booknetic_payment_method_selected,
#booknetic_theme_9 .booknetic-cart-item.active
{
    border-color: #b61b54 !important;
}

#booknetic_theme_9 .booknetic_service_card_price,
#booknetic_theme_9 .booknetic_service_extra_card_price,
#booknetic_theme_9 .booknetic_confirm_details_price:not([data-price-id="discount"] .booknetic_confirm_details_price,.booknetic_gift_discount_price),
#booknetic_theme_9 .booknetic-cart-item-body-cell.amount,
#booknetic_theme_9 .booknetic_sum_price
{
    color: #62a517 !important;
}

/* Package Booking Panel Theming */
#booknetic_theme_9 .bkntc_package-confirmation_header h1,
#booknetic_theme_9 .bkntc_package_summary h2
{
    color: #292d32 !important;
}

#booknetic_theme_9 .bkntc_package_summary,
#booknetic_theme_9 .bkntc_package_warning,
#booknetic_theme_9 .bkntc_package_appointment.booked,
#booknetic_theme_9 .bkntc_package_appointment.empty
{
    border-color: #b61b54 !important;
}

.booknetic_package_card_service_el > span:first-child
{
    color: #325d8a !important;
}

.booknetic_package_card_service_el > span:last-child {
    background: #325d8a !important;
}

#booknetic_theme_9 .bkntc_package_appointment.empty:hover
{
    border-color: #325d8a !important;
    background-color: rgba(108, 112, 220, 0.1) !important;
}

#booknetic_theme_9 .bkntc_package-confirmation_header span,
#booknetic_theme_9 .bkntc_package_summary h2
{
    color: #325d8a !important;
}

/* Theme 9: Base font */
#booknetic_theme_9 *,
[id^="booknetic_theme_"] #booknetic_theme_9 {
  font-family: var(--wp--preset--font-family--system-sans-serif) !important;
}

/* Header */
.booknetic_appointment_container_header_text {
  font-size: 1.3rem !important;
  font-weight: 600 !important;
}

/* Steps layout */
.booknetic_appointment_steps
  .booknetic_appointment_step_element[style*="display: block"] {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

.booknetic_appointment_steps_footer_txt2 {
  color: #fff !important;
}

/* Step/service labels */
.booknetic_badge,
.booknetic_step_title,
.booknetic_service_category.booknetic_fade {
  font-size: 1rem !important;
  font-weight: 600 !important;
}

/* Service titles */
.booknetic_service_title_span {
  font-size: 1.25rem !important;
  line-height: 1.15 !important;
  font-weight: 600 !important;
}

/* Common sizes */
.booknetic_appointment .select2-results__option,
.booknetic_month_name,
.booknetic_service_duration_wrapper,
.booknetic_times_head,
.booknetic_times_title,
.booknetic_appointment_container [data-step-id="information"],
.booknetic_appointment_container [data-step-id="information"] * {
  font-size: 1rem !important;
}

/* Times header spacing */
.booknetic_times_head {
  padding: 0 10px 10px !important;
}

/* Pricing */
.booknetic_service_card_price {
  font-size: 1.5rem !important;
  font-weight: 600 !important;
  width: auto !important;
  max-width: none !important;
  flex: 0 0 auto;
  padding-left: 0 !important;
  padding-right: 20px !important;
}

/* Descriptions */
.booknetic_card_description,
.booknetic_service_card_description_fulltext,
.booknetic_service_card_description_wrapped {
  font-size: 1rem !important;
  color: #555;
}

/* Notes buttons */
.booknetic_view_less_service_notes_button,
.booknetic_view_more_service_notes_button {
  color: #f80860 !important;
}

/* Card title */
.booknetic_card_title_first {
  font-size: 1rem !important;
  line-height: 1.15 !important;
  font-weight: 600 !important;
}

/* Information step: text colors */
.booknetic_appointment_container [data-step-id="information"] .help-text {
  color: #666;
}

.booknetic_appointment_container [data-step-id="information"] .form-control-plaintext {
  color: #555;
}

.booknetic_appointment_container
  [data-step-id="information"]
  input::placeholder,
.booknetic_appointment_container
  [data-step-id="information"]
  textarea::placeholder {
  color: #888;
  opacity: 1;
}

/* Information step: checkbox/radio */
.booknetic_appointment_container
  [data-step-id="information"]
  input[type="checkbox"],
.booknetic_appointment_container
  [data-step-id="information"]
  input[type="radio"] {
  accent-color: #666666;
}

.booknetic_appointment_container
  [data-step-id="information"]
  input[type="checkbox"] ~ label,
.booknetic_appointment_container
  [data-step-id="information"]
  input[type="radio"] ~ label {
  color: #666 !important;
}

.booknetic_appointment_container
  [data-step-id="information"]
  input[type="checkbox"]:checked ~ label,
.booknetic_appointment_container
  [data-step-id="information"]
  input[type="radio"]:checked ~ label {
  color: #292d32 !important;
}


/* Available dates: keep the free portion green, but show the booked portion in yellow */
.booknetic_calendar_days:not(.booknetic_calendar_empty_day) > div > span > i[b] {
  background: #f4c542;
}

/* Fully unavailable dates: add a single diagonal slash from bottom-left to top-right */
.booknetic_calendar_days.booknetic_calendar_empty_day > div {
  position: relative;
  overflow: hidden;
}

.booknetic_calendar_days.booknetic_calendar_empty_day > div::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.45;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: linear-gradient(
    to top right,
    transparent calc(50% - 1px),
    currentColor calc(50% - 1px),
    currentColor calc(50% + 1px),
    transparent calc(50% + 1px)
  );
}

.booknetic_loading_layout {
  background: rgba(255, 255, 255, 0.1) !important; /* weaker white overlay than the current 0.2 */
}

#booknetic_progress {
  background: #e4032f !important; /* HKAF red for the top loading bar */
}

#booknetic_progress dd,
#booknetic_progress dt {
  box-shadow: #e4032f 1px 0 6px 1px !important; /* match the loading bar glow to HKAF red */
}

.booknetic_preloader_card1_image:after,
.booknetic_preloader_card1_description:before,
.booknetic_preloader_card1_description:after,
.booknetic_preloader_card2_image:after,
.booknetic_preloader_card2_description:before,
.booknetic_preloader_card2_description:after,
.booknetic_preloader_card3:before,
.booknetic_preloader_card3:after {
  animation-duration: 1.2s !important; /* speed up the skeleton shimmer so it is easier to notice */
  opacity: 0.8 !important; /* make the animated placeholder highlight more visible */
}

/*booknetic animation patch fix */
.booknetic_appointment_container_body .booknetic_fade,
.booknetic_appointment_container_body .booknetic_fade img,
.booknetic_appointment_container_body .booknetic_fade video,
.booknetic_appointment_container_body .booknetic_fade canvas {
    overflow: hidden;
}


/* Back button: pink background, white text, and 1.1rem size */
.booknetic_appointment_steps_footer .booknetic_prev_step,
.booknetic_appointment_steps_footer .booknetic_prev_step * {
background-color: #f80860 !important;
color: #fff !important;
font-size: 1.1rem !important;
}

/* Next button: increase size to 1.1rem */
.booknetic_appointment_steps_footer .booknetic_next_step,
.booknetic_appointment_steps_footer .booknetic_next_step * {
font-size: 1.1rem !important;
}

/* Footer text 2: force white and 1.1rem */
.booknetic_appointment_steps_footer_txt2 {
color: #fff !important;
font-size: 1rem !important;
}


