.elementor-kit-6{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-74e0a99:#0251C7;--e-global-color-289b283:#FEF7EF;--e-global-color-9f4c2d6:#92C8FD;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1240px;}.e-con{--container-max-width:1240px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* ============================================
   CALENDLY-STYLE BOOKING - FINAL
   Surf City Paws / MWB Booking
   ============================================ */

:root {
  --bk-purple: #7c3aed;
  --bk-purple-light: #f5f3ff;
  --bk-purple-hover: #ede9fe;
  --bk-purple-dark: #6d28d9;
  --bk-text: #1a1a1a;
  --bk-muted: #6b7280;
  --bk-border: #eaeaea;
  --bk-radius: 12px;
}

/* === HIDE MWB DEFAULT UI === */
.mbfw-date-picker-section__wrapper,
.single-product .summary p.price,
.mwb-mbfw-total-area {
  display: none !important;
}

/* Hide the original flatpickr inputs — keep them in DOM for form submission */
input.flatpickr-input.wps_single_cal_hourly,
.mbfw-date-picker-section input.flatpickr-input {
  position: absolute !important;
  left: -9999px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* === MAIN PRODUCT LAYOUT === */
.single-product div.product.product-type-mwb_booking {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  max-width: 1200px;
  margin: 40px auto;
  padding: 0;
}

.single-product .woocommerce-product-gallery {
  padding: 32px;
}

.single-product .woocommerce-product-gallery img {
  border-radius: var(--bk-radius);
}

.single-product .summary.entry-summary {
  padding: 40px !important;
  margin: 0 !important;
}

.single-product h1.product_title {
  font-size: 28px !important;
  font-weight: 700 !important;
  letter-spacing: -0.5px !important;
  color: var(--bk-text) !important;
  margin: 0 0 28px 0 !important;
  line-height: 1.2 !important;
}

/* === CUSTOM CALENDLY UI - injected by JS === */
.cal-wrapper {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 0;
  border: 1px solid var(--bk-border);
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  margin-bottom: 24px;
  min-height: 540px;
}

/* LEFT info column */
.cal-info {
  padding: 32px;
  border-right: 1px solid var(--bk-border);
  display: flex;
  flex-direction: column;
}

.cal-info-host {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, #a78bfa, var(--bk-purple));
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 18px;
  margin-bottom: 20px;
}

.cal-info-brand {
  color: var(--bk-muted);
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 4px;
}

.cal-info-title {
  font-size: 22px;
  font-weight: 700;
  color: var(--bk-text);
  margin-bottom: 20px;
  letter-spacing: -0.3px;
  line-height: 1.2;
}

.cal-info-pills {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 24px;
}

.cal-info-pill {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #4b5563;
  font-size: 14px;
}

.cal-info-pill svg {
  width: 18px;
  height: 18px;
  color: var(--bk-muted);
  flex-shrink: 0;
}

.cal-info-prices {
  margin-top: auto;
  padding-top: 20px;
  border-top: 1px solid var(--bk-border);
}

.cal-info-price-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 0;
  font-size: 14px;
}

.cal-info-price-row .label {
  color: var(--bk-muted);
}

.cal-info-price-row .amount {
  color: var(--bk-text);
  font-weight: 600;
}

/* RIGHT calendar column */
.cal-right {
  padding: 32px;
  display: flex;
  flex-direction: column;
}

.cal-right-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--bk-text);
  margin-bottom: 20px;
}

/* From/To inputs */
.cal-date-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 24px;
}

.cal-field label {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: var(--bk-muted);
  margin-bottom: 6px;
}

.cal-field-display {
  border: 1.5px solid var(--bk-border);
  border-radius: 8px;
  padding: 12px 14px;
  font-size: 14px;
  color: var(--bk-text);
  background: #fff;
  cursor: pointer;
  transition: all 0.15s ease;
  min-height: 44px;
  display: flex;
  align-items: center;
}

.cal-field-display.active {
  border-color: var(--bk-purple);
  background: var(--bk-purple-light);
}

.cal-field-display.empty {
  color: #9ca3af;
}

/* Month header */
.cal-month-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.cal-month-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--bk-text);
}

.cal-month-nav {
  display: flex;
  gap: 4px;
}

.cal-nav-btn {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: none;
  background: var(--bk-purple-light);
  color: var(--bk-purple);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 600;
  transition: background 0.15s;
}

.cal-nav-btn:hover {
  background: var(--bk-purple-hover);
}

.cal-nav-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

/* Calendar grid */
.cal-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
  margin-bottom: 4px;
}

.cal-weekday {
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  color: #9ca3af;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 8px 0;
}

.cal-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
}

.cal-day {
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 14px;
  font-weight: 500;
  color: var(--bk-text);
  background: var(--bk-purple-light);
  cursor: pointer;
  transition: all 0.15s ease;
  border: none;
  padding: 0;
}

.cal-day:hover:not(.disabled):not(.empty) {
  background: var(--bk-purple-hover);
  color: var(--bk-purple-dark);
}

.cal-day.today {
  font-weight: 700;
  box-shadow: inset 0 0 0 1.5px var(--bk-purple);
}

.cal-day.selected,
.cal-day.range-start,
.cal-day.range-end {
  background: var(--bk-purple) !important;
  color: #fff !important;
  font-weight: 600;
}

.cal-day.in-range {
  background: var(--bk-purple-light);
  color: var(--bk-purple-dark);
  border-radius: 0;
}

.cal-day.range-start {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.cal-day.range-end {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.cal-day.disabled {
  color: #d1d5db;
  cursor: not-allowed;
  background: transparent;
}

.cal-day.empty {
  background: transparent;
  cursor: default;
}

/* === TIME SLOTS === */
.cal-times {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--bk-border);
}

.cal-times-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--bk-text);
  margin-bottom: 12px;
}

.cal-times-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
  gap: 8px;
  max-height: 280px;
  overflow-y: auto;
  padding-right: 4px;
}

.cal-time-slot {
  padding: 10px;
  border: 1.5px solid var(--bk-purple);
  border-radius: 6px;
  background: #fff;
  color: var(--bk-purple);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  transition: all 0.15s;
}

.cal-time-slot:hover {
  background: var(--bk-purple-light);
}

.cal-time-slot.selected {
  background: var(--bk-purple);
  color: #fff;
}

.cal-times-empty {
  color: var(--bk-muted);
  font-size: 14px;
  text-align: center;
  padding: 20px;
}

/* === SUMMARY / TOTAL === */
.cal-summary {
  background: var(--bk-purple-light);
  border-radius: var(--bk-radius);
  padding: 16px 20px;
  margin-bottom: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.cal-summary-label {
  color: var(--bk-text);
  font-size: 14px;
  font-weight: 500;
}

.cal-summary-total {
  color: var(--bk-text);
  font-size: 18px;
  font-weight: 700;
}

/* === QUANTITY + BOOK NOW === */
.single-product .quantity {
  margin: 0 0 16px 0 !important;
}

.single-product .quantity label {
  display: none !important;
}

.single-product .quantity input.qty {
  border: 1.5px solid var(--bk-border) !important;
  border-radius: 8px !important;
  padding: 10px 12px !important;
  width: 72px !important;
  height: auto !important;
  font-size: 14px !important;
  text-align: center !important;
}

.single-product button.single_add_to_cart_button {
  background: var(--bk-purple) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 14px 24px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  width: 100% !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: background 0.15s ease !important;
}

.single-product button.single_add_to_cart_button:hover {
  background: var(--bk-purple-dark) !important;
}

.single-product button.single_add_to_cart_button:disabled {
  background: #c4b5fd !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
}

/* === HIDE CLUTTER === */
.single-product .product_meta {
  display: none !important;
}

.woocommerce-breadcrumb {
  color: var(--bk-muted) !important;
  font-size: 14px !important;
  margin-bottom: 24px !important;
}

.woocommerce-breadcrumb a {
  color: var(--bk-muted) !important;
  text-decoration: none !important;
}

/* === MOBILE === */
@media (max-width: 768px) {
  .cal-wrapper {
    grid-template-columns: 1fr;
  }
  .cal-info {
    border-right: none;
    border-bottom: 1px solid var(--bk-border);
  }
  .single-product div.product.product-type-mwb_booking {
    margin: 16px;
  }
  .single-product .summary.entry-summary {
    padding: 24px !important;
  }
}/* End custom CSS */