/* Theme color variables usage:
   All four variables are actively used in the styles:
   --c-brand       → primary fills (headers, selected day, buttons)
   --c-brand-700   → borders and hover backgrounds
   --c-brand-800   → darker hover/active borders
   --c-focus       → focus-visible outlines
*/
:root{
  --c-brand:#2563eb;
  --c-brand-700:#1d4ed8;
  --c-brand-800:#1e40af;
  --c-focus:#93c5fd;
  --c-on-brand:#fff;
  /* Accent for required asterisks; default to brand so it changes per theme */
  --c-accent:var(--c-brand);
  --c-accent-700:var(--c-brand-700);
  --c-accent-800:var(--c-brand-800);
}
html[data-theme="orian"]{
  --c-brand:#2563eb;
  --c-brand-700:#1d4ed8;
  --c-brand-800:#1e40af;
  --c-focus:#93c5fd;
}
html[data-theme="kfc"]{
  --c-brand:#ebe013;
  --c-brand-700:#ebe013;
  --c-brand-800:#ebe013;
  --c-focus:#ebe013;
	}
html[data-theme="ayelet"]{
  --c-brand:#93a283;
  --c-brand-700:#93a283;
  --c-brand-800:#93a283;
  --c-focus:#93a283;
}
html[data-theme="ne"]{
  --c-brand:#7c3aed;
  --c-brand-700:#6d28d9;
  --c-brand-800:#5b21b6;
  --c-focus:#c4b5fd;
}
html[data-theme="fhba"]{
  --c-brand:#e11d48;
  --c-brand-700:#be123c;
  --c-brand-800:#9f1239;
  --c-focus:#fecdd3;
}

/* ——— Layout & container ——— */
#fbuilder .slotsCalendar,
#fbuilder .fieldCalendar { background: transparent; border: 0; box-shadow: none; }

/* Add space between the datepicker and the slots grid */
#fbuilder .fieldCalendar{ margin-bottom:12px; }

/* Inline calendar constrained width */
#fbuilder .ui-datepicker-inline,
fbuilder .ui-datepicker-inline{
  width: 100%;
  max-width: 360px !important;
  margin: 0 auto;
}

/* ——— Datepicker visual polish ——— */
#fbuilder .ui-datepicker{
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:12px;
  overflow:visible;
  box-shadow:0 10px 30px rgba(2,6,23,.06);
}
#fbuilder .ui-datepicker-header{
  background:var(--c-brand);
  color:#fff;
  border:0;
  padding:8px 44px; /* extra side padding so arrows don't overlap title */
  border-radius:12px 12px 0 0;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  min-height:44px;
}
#fbuilder .ui-datepicker .ui-widget-header{
  background:var(--c-brand) !important;
  color:#fff !important;
  border:0 !important;
}
#fbuilder .ui-datepicker .ui-datepicker-title{
  font-weight:700;
  font-size:14px;
  line-height:1.2;
}
/* RTL nav placement: prev on left, next on right; enforce alignment in WP */
#fbuilder .ui-datepicker .ui-datepicker-prev{ left:8px !important; right:auto !important; }
#fbuilder .ui-datepicker .ui-datepicker-next{ right:8px !important; left:auto !important; }
#fbuilder .ui-datepicker .ui-datepicker-prev,
#fbuilder .ui-datepicker .ui-datepicker-next{
  position:absolute !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:28px !important;
  height:28px !important;
  border-radius:8px !important;
}
#fbuilder .ui-datepicker .ui-datepicker-prev .ui-icon,
#fbuilder .ui-datepicker .ui-datepicker-next .ui-icon{
  position:absolute !important;
  top:50% !important;
  left:50% !important;
  transform:translate(-50%,-50%) !important;
  margin:0 !important;
}
#fbuilder .ui-datepicker .ui-datepicker-prev:hover,
#fbuilder .ui-datepicker .ui-datepicker-next:hover{
  background:rgba(255,255,255,.18);
}

/* Keep arrows solid-white and visible (default and hover) */
#fbuilder .ui-datepicker .ui-datepicker-prev,
#fbuilder .ui-datepicker .ui-datepicker-next{
  opacity:1 !important;
  background-image:none !important; /* remove sprite to avoid mismatched icon */
}
#fbuilder .ui-datepicker .ui-datepicker-prev:hover,
#fbuilder .ui-datepicker .ui-datepicker-next:hover,
#fbuilder .ui-datepicker .ui-widget-header .ui-state-hover{
  opacity:1 !important; /* cancel any theme hover dimming */
  background:rgba(255,255,255,.12) !important; /* lighter overlay so the white arrow keeps contrast */
}
#fbuilder .ui-datepicker .ui-datepicker-prev::after,
#fbuilder .ui-datepicker .ui-datepicker-next::after{
  content:''; 
  position:absolute !important;
  top:50% !important;
  left:50% !important;
  transform:translate(-50%,-50%) rotate(45deg);
  width:9px; height:9px;
  border-top:2px solid #fff;
  border-right:2px solid #fff;
  pointer-events:none;
}
#fbuilder .ui-datepicker .ui-datepicker-prev::after{
  transform:translate(-50%,-50%) rotate(225deg);
}

#fbuilder .ui-datepicker table{
  width:100%;
  border-collapse:separate;
  border-spacing:6px;
  padding:10px 8px 12px;
}
#fbuilder .ui-datepicker th{
  color:#64748b;
  font-weight:600;
  text-align:center;
}
#fbuilder .ui-datepicker td a,
#fbuilder .ui-datepicker td span{
  display:flex;
  align-items:center;
  justify-content:center;
  height:40px;
  padding:0;
  line-height:1;
  box-sizing:border-box;
  border-radius:10px;
  border:1px solid transparent;
  color:#0f172a;
  transition:background-color .12s ease, border-color .12s ease, color .12s ease, box-shadow .12s ease;
}
#fbuilder .ui-datepicker td a:hover{
  background:#f1f5f9;
  border-color:var(--c-brand) !important; /* theme-colored frame on hover */
  box-shadow:0 0 0 2px var(--c-brand) inset !important; /* inner frame to ensure visibility */
}
/* Ensure jQuery UI's .ui-state-hover (applied on day links) also shows the themed frame */
#fbuilder .ui-datepicker td a.ui-state-hover{
  border-color:var(--c-brand) !important;
  box-shadow:0 0 0 2px var(--c-brand) inset !important;
}
/* Disabled days are spans; give them a frame on hover too */
#fbuilder .ui-datepicker td span:hover{
  border-color:var(--c-brand) !important;
  box-shadow:0 0 0 2px var(--c-brand) inset !important;
}
#fbuilder .ui-datepicker .ui-state-active,
#fbuilder .ui-datepicker-current-day a{
  background:var(--c-brand) !important;
  color:var(--c-on-brand) !important;
  border-color:var(--c-brand-700);
  box-shadow:0 6px 16px rgba(37,99,235,.28);
}
#fbuilder .ui-datepicker .ui-state-highlight{ /* today */
  background:#eff6ff !important;
  border-color:#93c5fd;
  color:#0f172a !important;
}
#fbuilder .ui-datepicker .ui-state-disabled,
#fbuilder .ui-datepicker .ui-state-disabled span{
  opacity:.55;
  color:#94a3b8 !important;
}
#fbuilder .ui-datepicker td a:focus-visible{
  outline:3px solid var(--c-focus);
  outline-offset:2px;
}

/* ——— Service selector (above the datepicker) ——— */
#fbuilder .fieldCalendarService{
  display:block;            /* let inner grid span the full line */
  width:100%;
  /* spacing that frames the options nicely */
  margin-bottom:12px;               /* space before the datepicker */
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:12px;
  padding:8px 10px;
  box-shadow:0 10px 30px rgba(2,6,23,.06);
}
/* Compact mode once a service is selected: don't take full width */
#fbuilder .fieldCalendarService.service-compact{
  display:inline-block;
  width:auto;
  box-shadow:0 6px 16px rgba(2,6,23,.06);
}
#fbuilder .fieldCalendarService select{
  min-width:220px;
  padding:10px 12px;
  border:1px solid #cdd5e0;
  border-radius:10px;
  background:#fff;
  color:#0f172a;
  font-weight:600;
  line-height:1.2;
  box-shadow:0 1px 0 rgba(2,6,23,.04);
  transition:border-color .12s ease, box-shadow .12s ease, background-color .12s ease;
}
#fbuilder .fieldCalendarService select:hover{
  border-color:#94a3b8;
}
#fbuilder .fieldCalendarService select:focus{
  outline:3px solid var(--c-focus);
  outline-offset:2px;
  border-color:#60a5fa;
}
#fbuilder .fieldCalendarService .ahbfield_quantity_label{
  color:#64748b;
  font-weight:600;
  margin-inline-start:6px;
}
#fbuilder .fieldCalendarService .ahbfield_quantity_div br{ display:none; }

/* Custom service list UI: show options as separate clickable areas */
#fbuilder .fieldCalendarService .serviceListUI{ width:100%; }
#fbuilder .fieldCalendarService .service-options{
  display:grid;
  /* Two columns by default for wider spread */
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:12px;
  width:100%;
}
/* Mobile: collapse service options to a single column */
@media (max-width:640px){
  #fbuilder .fieldCalendarService .service-options{
    grid-template-columns: 1fr;
  }
}
#fbuilder .fieldCalendarService .service-option{
  display:block;
  padding:12px 14px;
  border:1px solid #cdd5e0;
  border-radius:12px;
  background:#fff;
  color:#0f172a;
  font-weight:700;
  line-height:1.2;
  cursor:pointer;
  box-shadow:0 1px 0 rgba(2,6,23,.04);
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease, background-color .12s ease;
}
#fbuilder .fieldCalendarService .service-option:hover{
  border-color:#94a3b8;
  transform:translateY(-1px);
}
#fbuilder .fieldCalendarService .service-option:active{
  transform:translateY(0);
}
#fbuilder .fieldCalendarService .service-option:focus-visible{
  outline:3px solid var(--c-focus);
  outline-offset:2px;
}
#fbuilder .fieldCalendarService .service-selected{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  margin-top:4px;
  background:#f8fafc;
  border:1px dashed #cbd5e1;
  border-radius:10px;
}
#fbuilder .fieldCalendarService .service-selected .selected-name{
  font-weight:700;
  color:#0f172a;
}
#fbuilder .fieldCalendarService .service-selected .service-back{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  border:1px solid #cbd5e1;
  border-radius:10px;
  background:#fff;
  color:#0f172a;
  font-weight:700;
  cursor:pointer;
  transition:transform .12s ease, border-color .12s ease, background-color .12s ease;
}
#fbuilder .fieldCalendarService .service-selected .service-back:hover{
  border-color:#94a3b8;
  transform:translateY(-1px);
}
#fbuilder .fieldCalendarService .service-selected .service-back:focus-visible{
  outline:3px solid var(--c-focus);
  outline-offset:2px;
}

/* Make the slot area full-width and use the space with a responsive grid */
#fbuilder .slotsCalendar .slots{
  width:100%;
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap:16px 18px;           /* row / column gaps */
  align-items:stretch;
  justify-items:stretch;
  border:0; background:transparent; box-shadow:none; padding:4px 0;
}

/* Hide the small date line above the slots */
#fbuilder .slotsCalendar .slots > span,
#fbuilder .slotsCalendar .slots > br { display:none !important; }

/* ——— Slot buttons ——— */
#fbuilder .slotsCalendar .availableslot{
  margin:0 !important;
  border:0 !important;               /* remove plugin’s rectangular frame */
  background:transparent !important; /* keep container invisible */
  box-shadow:none !important;
}
#fbuilder .slotsCalendar .availableslot a{
  display:block;
  text-align:center;
  padding:12px 14px;
  border:1px solid var(--c-brand) !important; /* always show theme-colored frame */
  border-radius:12px;
  background:#fff;
  color:#0f172a;
  font-weight:600;
  line-height:1.1;
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease, background-color .12s ease;
  box-shadow:0 1px 0 rgba(2,6,23,.04);
}
#fbuilder .slotsCalendar .availableslot a:hover{
  border-color:var(--c-brand) !important; /* theme-colored frame on hover */
  transform:translateY(-1px);
}

/* Selected state (JS adds .is-selected; keep fallbacks) */
#fbuilder .slotsCalendar .availableslot a.is-selected,
#fbuilder .slotsCalendar .availableslot a.selected,
#fbuilder .slotsCalendar .availableslot a.current{
  background:var(--c-brand);
  color:var(--c-on-brand);
  border-color:var(--c-brand-700);
  box-shadow:0 12px 24px rgba(37,99,235,.25);
}

/* Remove tiny counters next to times */
#fbuilder .ahb_slot_availability{ display:none !important; }

/* Keyboard focus visibility */
#fbuilder .slotsCalendar .availableslot a:focus-visible{
  outline:3px solid var(--c-focus);
  outline-offset:2px;
  border-color:#60a5fa;
}

/* ——— Picked/used slots summary list ——— */
#fbuilder .usedSlots{
  margin-top:12px;
}
#fbuilder .usedSlots .ahb_list{
  display:flex;
  align-items:center !important;      /* ensure vertical centering */
  flex-wrap:wrap;
  gap:8px 12px;
  padding:10px 12px;
  border:1px solid #e2e8f0;
  border-radius:12px;
  background:#fff;
  box-shadow:0 1px 0 rgba(2,6,23,.04);
}
/* Themed accent bar on the leading side */
html:not([dir="rtl"]) #fbuilder .usedSlots .ahb_list{
  border-left:4px solid var(--c-brand);
}
html[dir="rtl"] #fbuilder .usedSlots .ahb_list{
  border-right:4px solid var(--c-brand);
}
#fbuilder .usedSlots .ahb_list + .ahb_list{
  margin-top:8px;
}
#fbuilder .usedSlots .ahb_list_time{
  display:flex;
  gap:6px;
  font-weight:700;
  color:#0f172a;
}
#fbuilder .usedSlots .ahb_list_service{
  color:#64748b;
  font-weight:600;
}
#fbuilder .usedSlots .ahb_list_quantity{
  color:#64748b;
  font-size:12px;
}
/* Position cancel button on the physical left side */
#fbuilder .usedSlots .ahb_list .cancel{
  margin-left:0 !important;            /* no left margin */
  margin-right:auto !important;        /* push everything else to the right */
  margin-inline-start:0 !important;
  margin-inline-end:auto !important;
  order:999 !important;                /* place it last in flex order (left in RTL) */
}
/* In RTL, last items appear on the left, which is what we want */
html[dir="rtl"] #fbuilder .usedSlots .ahb_list .cancel{
  margin-left:12px !important;         /* padding from left edge */
  margin-right:auto !important;        /* push content to the right */
  margin-inline-start:auto !important;
  margin-inline-end:12px !important;
}
#fbuilder .usedSlots .ahb_list .cancel,
#fbuilder .usedSlots .ahb_list .showrepeat{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 10px;
  border:1px solid #cbd5e1;
  border-radius:10px;
  background:#fff;
  color:#0f172a;
  font-weight:700;
  text-decoration:none;
  transition:transform .12s ease, border-color .12s ease, background-color .12s ease;
}
#fbuilder .usedSlots .ahb_list .cancel:hover,
#fbuilder .usedSlots .ahb_list .showrepeat:hover{
  border-color:#94a3b8;
  background:#f8fafc;
  transform:translateY(-1px);
}
/* Turn cancel into an icon-only button */
#fbuilder .usedSlots .ahb_list .cancel{
  /* icon-only button, centered */
  width:48px !important;
  height:48px !important;
  min-width:48px !important;           /* prevent shrinking */
  min-height:48px !important;
  padding:0 !important;
  /* margin handled above for consistent left positioning */
  border:0 !important;                 /* remove frame */
  background:transparent !important;   /* transparent background */
  box-shadow:none !important;
  display:inline-flex !important;      /* ensure centering works everywhere */
  align-items:center !important;
  justify-content:center !important;
  flex-shrink:0 !important;            /* prevent flex shrinking */
  flex-direction:row !important;       /* ensure horizontal layout */
  text-decoration:none !important;
  color:transparent !important;        /* hide text */
  font-size:0 !important;
  line-height:1 !important;           /* reset line-height */
  vertical-align:middle;
  position:relative;                   /* for absolute positioning if needed */
}
#fbuilder .usedSlots .ahb_list .cancel::before{
  content:'';
  position:absolute;
  top:50% !important;
  left:50% !important;
  transform:translate(-50%, -50%) !important;
  display:block;
  width:28px !important;               /* bigger icon */
  height:28px !important;
  margin:0 !important;                 /* remove any margins */
  flex-shrink:0;                       /* prevent shrinking */
  background-color:var(--c-brand);
  -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M16.5 4.5a.75.75 0 0 1 .75.75V6h2.25a.75.75 0 0 1 0 1.5h-.231l-.698 11.172A2.25 2.25 0 0 1 16.33 21H7.67a2.25 2.25 0 0 1-2.242-2.328L4.73 7.5H4.5A.75.75 0 0 1 4.5 6h2.25v-.75a.75.75 0 0 1 .75-.75h9zM9 9.75a.75.75 0 0 0-1.5 0v8.25a.75.75 0 0 0 1.5 0V9.75zm3 0a.75.75 0 0 0-1.5 0v8.25a.75.75 0 0 0 1.5 0V9.75zm3 0a.75.75 0 0 0-1.5 0v8.25a.75.75 0 0 0 1.5 0V9.75z"/></svg>') no-repeat center / contain;
          mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M16.5 4.5a.75.75 0 0 1 .75.75V6h2.25a.75.75 0 0 1 0 1.5h-.231l-.698 11.172A2.25 2.25 0 0 1 16.33 21H7.67a2.25 2.25 0 0 1-2.242-2.328L4.73 7.5H4.5A.75.75 0 0 1 4.5 6h2.25v-.75a.75.75 0 0 1 .75-.75h9zM9 9.75a.75.75 0 0 0-1.5 0v8.25a.75.75 0 0 0 1.5 0V9.75zm3 0a.75.75 0 0 0-1.5 0v8.25a.75.75 0 0 0 1.5 0V9.75zm3 0a.75.75 0 0 0-1.5 0v8.25a.75.75 0 0 0 1.5 0V9.75z"/></svg>') no-repeat center / contain;
}
#fbuilder .usedSlots .ahb_list .cancel:hover{
  border-color:transparent;
  background:transparent;
  transform:none;
}
#fbuilder .usedSlots .ahb_list .cancel:hover::before{
  background-color:var(--c-brand-700);
}
#fbuilder .usedSlots .ahb_list .cancel:focus-visible{
  outline:3px solid var(--c-focus);
  outline-offset:2px;
}
/* Repeat panel polish */
#fbuilder .usedSlots .ahb_list .repeat{
  width:100%;
  margin-top:8px;
  padding:10px;
  border:1px dashed #cbd5e1;
  border-radius:10px;
  background:#f8fafc;
}

/* Always hide repeat toggle button */
#fbuilder .showrepeat{ display:none !important; }

/* Responsive tweaks */
@media (max-width:480px){
  #fbuilder .slotsCalendar .slots{
    grid-template-columns: repeat(auto-fit, minmax(88px, 1fr));
    gap:10px;
  }
  #fbuilder .slotsCalendar .availableslot a{ padding:10px 12px; }
}

/* Optional: widen this Elementor section only (uses your section id) */
.elementor-element-500b608.e-con.e-con-boxed > .e-con-inner{ max-width:1400px !important; }

/* Keep your existing rule */
#fbuilder .center_aligned .two_column{ text-align:right; }

/* —— Extra hardening: kill theme pseudo-underline effects only on calendar cells and slots —— */
/* Some themes draw an underline using ::after; disable it just for day cells and slot links */
#fbuilder .ui-datepicker td a,
#fbuilder .slotsCalendar .availableslot a{
  background-image:none !important; /* cancel gradient-underlines */
  box-shadow:none !important;       /* cancel shadow-underlines */
  outline:0 !important;
}
#fbuilder .ui-datepicker td a::after,
#fbuilder .ui-datepicker td a::before,
#fbuilder .slotsCalendar .availableslot a::after,
#fbuilder .slotsCalendar .availableslot a::before{
  content:none !important;
  display:none !important;
  border:0 !important;
  background:none !important;
  height:0 !important;
  width:0 !important;
}

/* Minimal: remove right-side vertical separators between days */
#fbuilder .ui-datepicker tbody td{
  border-right:0 !important;
}

/* ——— General fields (text, email, tel, textarea, extra selects) ——— */
/* Spacing and labels */
#fbuilder .fields{ margin-bottom:14px; }
#fbuilder .fields:last-child{ margin-bottom:0; }
#fbuilder label{
  display:block;
  margin:0 0 6px 0;
  color:#0f172a;
  font-weight:700;
  line-height:1.3;
}
#fbuilder label .r{ color:var(--c-accent); margin-inline-start:4px; }

/* Inputs, textareas, and selects within the form (exclude the calendar service select already styled above) */
#fbuilder input.field[type="text"],
#fbuilder input.field[type="tel"],
#fbuilder input.field[type="email"],
#fbuilder textarea.field,
#fbuilder select.field{
  width:100%;
  padding:12px 14px;
  border:1px solid #cdd5e0;
  border-radius:12px;
  background:#fff;
  color:#0f172a;
  font-weight:500;
  line-height:1.2;
  box-shadow:0 1px 0 rgba(2,6,23,.04);
  transition:border-color .12s ease, box-shadow .12s ease, background-color .12s ease;
  box-sizing:border-box;
}
#fbuilder textarea.field{ min-height:96px; resize:vertical; }
#fbuilder input.field::placeholder,
#fbuilder textarea.field::placeholder{ color:#94a3b8; }
#fbuilder input.field:hover,
#fbuilder textarea.field:hover,
#fbuilder select.field:hover{ border-color:#94a3b8; }
#fbuilder input.field:focus,
#fbuilder textarea.field:focus,
#fbuilder select.field:focus{
  outline:3px solid var(--c-focus);
  outline-offset:2px;
  border-color:#60a5fa;
}
#fbuilder input.field[disabled],
#fbuilder textarea.field[disabled],
#fbuilder select.field[disabled]{
  background:#f8fafc;
  color:#94a3b8;
  border-color:#e2e8f0;
}

/* Validation states (jQuery Validate often adds .error) */
#fbuilder input.field.error,
#fbuilder textarea.field.error,
#fbuilder select.field.error{
  border-color:#ef4444 !important;
  background:#fef2f2;
}
#fbuilder .cpefb_error,
#fbuilder label.error{
  display:block;
  margin-top:6px;
  color:#b91c1c;
  font-size:12px;
  line-height:1.3;
}

/* ——— Checkbox/radio groups (two_column) ——— */
#fbuilder .two_column label{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border:1px solid #cdd5e0;
  border-radius:10px;
  background:#fff;
  box-shadow:0 1px 0 rgba(2,6,23,.04);
  cursor:pointer;
  transition:border-color .12s ease, background-color .12s ease, box-shadow .12s ease;
}
#fbuilder .two_column label:hover{ border-color:#94a3b8; }
html[dir="rtl"] #fbuilder .two_column input[type="checkbox"],
html[dir="rtl"] #fbuilder .two_column input[type="radio"]{
  margin-right:8px;
  margin-left:0;
}
html:not([dir="rtl"]) #fbuilder .two_column input[type="checkbox"],
html:not([dir="rtl"]) #fbuilder .two_column input[type="radio"]{
  margin-left:8px;
  margin-right:0;
}

/* ——— Submit button ——— */
#fbuilder .pbSubmit{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 18px;
  border:1px solid var(--c-brand-700);
  border-radius:12px;
  background:var(--c-brand);
  color:var(--c-on-brand);
  font-weight:700;
  line-height:1.2;
  cursor:pointer;
  box-shadow:0 8px 20px rgba(37,99,235,.22);
  transition:transform .12s ease, box-shadow .12s ease, background-color .12s ease, border-color .12s ease;
}
#fbuilder .pbSubmit:hover{
  background:var(--c-brand-700);
  border-color:var(--c-brand-800);
  transform:translateY(-1px);
  box-shadow:0 12px 28px rgba(37,99,235,.26);
}
#fbuilder .pbSubmit:focus-visible{
  outline:3px solid var(--c-focus);
  outline-offset:2px;
}
#fbuilder .pbSubmit[disabled]{
  background:#93c5fd;
  border-color:#93c5fd;
  box-shadow:none;
  cursor:not-allowed;
  opacity:.85;
}
 
 /* ——— Strong overrides for production to beat late-loaded plugin CSS ——— */
 /* The plugin injects default colors later (e.g. rgb(115,185,214)). Ensure brand wins. */
 html[data-theme] .cp_cff_elegant #fbuilder .pbSubmit{
   background:var(--c-brand) !important;
   border-color:var(--c-brand-700) !important;
   color:var(--c-on-brand) !important;
 }
 html[data-theme] .cp_cff_elegant #fbuilder .pbSubmit:hover{
   background:var(--c-brand-700) !important;
   border-color:var(--c-brand-800) !important;
 }
 /* The plugin sometimes renders a separate floating submit element `.cp_subbtn`.
    Hide it by default to avoid duplicates; allow opt-in via `.no-pbsubmit` on <html>. */
 html[data-theme] .cp_subbtn{ display:none !important; }
 html[data-theme].no-pbsubmit .cp_subbtn{
   display:inline-flex !important;
   align-items:center;
   justify-content:center;
   padding:12px 18px;
   border:1px solid var(--c-brand-700) !important;
   border-radius:12px !important;
   background:var(--c-brand) !important;
   color:var(--c-on-brand) !important;
   font-weight:700;
   line-height:1.2;
   cursor:pointer;
   box-shadow:0 12px 30px rgba(2,6,23,.12);
   transition:transform .12s ease, box-shadow .12s ease, background-color .12s ease, border-color .12s ease;
 }
 html[data-theme].no-pbsubmit .cp_subbtn:hover{
   background:var(--c-brand-700) !important;
   border-color:var(--c-brand-800) !important;
   transform:translateY(-1px);
 }
 /* Asterisk color (plugin sets #fbuilder .r to rgb(115,185,214)) */
 html[data-theme] #fbuilder .r{
   color:var(--c-accent) !important;
 }