/* BeTheme-aligned styling for Calendly University Booking */
.cub-wrapper{
  max-width: 620px;
  margin: 0 auto;
}

.cub-row{
  margin-bottom: 18px;
}

.cub-label{
  display:block;
  margin-bottom: 8px;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 600;
}

.cub-field{
  width: 100%;
  box-sizing: border-box;
  padding: 14px 16px;
  font-size: 16px;
  line-height: 1.4;
  font-family: inherit;
  border: 1px solid rgba(0,0,0,0.15);
  border-radius: 6px;
  background-color: #fff;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.cub-field:focus{
  outline: none;
  border-color: currentColor;
  box-shadow: 0 0 0 2px rgba(0,0,0,0.08);
}

.cub-field:disabled{
  background-color: rgba(0,0,0,0.04);
  cursor: not-allowed;
  opacity: 0.7;
}

.cub-error{
  margin-top: -4px;
  margin-bottom: 14px;
  font-size: 14px;
  line-height: 1.4;
  color: #b00020;
  min-height: 18px;
}

.cub-result{
  margin: 8px 0 18px;
  animation: cubFadeIn 0.35s ease;
}

.cub-selected{
  display: inline-block;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(0,0,0,0.04);
}

.cub-calendly{
  margin-top: 18px;
  animation: cubFadeIn 0.35s ease;
}

.cub-calendly iframe{
  width: 100%;
  min-height: 720px;
  border: none;
  border-radius: 8px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.08);
}

.cub-testbox{
  padding: 14px 16px;
  border: 1px dashed rgba(0,0,0,0.25);
  border-radius: 10px;
  background: rgba(0,0,0,0.03);
}

@keyframes cubFadeIn{
  from{ opacity:0; transform: translateY(10px); }
  to{ opacity:1; transform: translateY(0); }
}

@media (max-width: 767px){
  .cub-wrapper{ padding: 0 15px; }
  .cub-calendly iframe{ min-height: 620px; }
}

.cub-submit{width:100%;padding:14px 16px;border-radius:8px;font-weight:700;}

.cub-submit{color:#fff;}

.cub-submit.is-disabled,.cub-submit:disabled{opacity:.55;cursor:not-allowed;}


/* Inline input + button */
.cub-inline{
  display:flex;
  gap:12px;
  align-items:stretch;
}
.cub-inline .cub-field{
  flex:1 1 auto;
  min-width:0;
}
.cub-submit{
  width:auto;
  min-width:140px;
  padding:12px 16px;
  border-radius:10px;
  font-size:15px;
  font-weight:700;
  line-height:1;
  color:#fff;
}
@media (max-width:520px){
  .cub-inline{ flex-direction:column; }
  .cub-submit{ width:100%; min-width:0; }
}

/* Enhanced error box */
.cub-error{
  margin-top: 12px;
  margin-bottom: 14px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(176,0,32,0.08);
  border: 1px solid rgba(176,0,32,0.20);
  color: #b00020;
  font-weight: 600;
}
.cub-error:empty{
  padding: 0;
  border: none;
  background: transparent;
  margin-top: 0;
}


/* v1.2.8 adjustments: match button height to input */
.cub-inline{ align-items: stretch; }
.cub-submit{
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 14px 18px;
  line-height: 1.2;
}


/* === v1.2.8.1: padding-only fix (no CF7, no JS changes) ===
   Goal: keep functionality as in v1.2.8, just make the inline submit match input height better.
*/
.cub-inline{
  align-items: stretch;
  gap: 10px;
}

/* Match the input's vertical rhythm (inputs use 14px 16px) */
.cub-inline .cub-submit{
  padding: 14px 18px;      /* same vertical padding as input */
  line-height: 1.4;
  border-radius: 6px;      /* match input radius */
  font-size: 16px;         /* match input font size */
}

/* Prevent button from looking too wide */
.cub-inline .cub-submit{
  min-width: 120px;
}
@media (max-width: 520px){
  .cub-inline .cub-submit{ width: 100%; min-width: 0; }
}


/* === v1.2.8.3: stop flex-stretch "fat button" === */
.cub-inline{
  display:flex;
  gap:10px;
  align-items:center !important; /* don't stretch children vertically */
}

.cub-inline .cub-field{
  flex: 1 1 auto;
  min-width: 0;
}

/* Button should keep its natural size */
.cub-inline .cub-submit{
  flex: 0 0 auto;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 10px 14px !important;
  line-height: 1.1 !important;
  font-size: 15px !important;
  border-radius: 6px !important;
  min-width: 110px;
}

/* Mobile stacks */
@media (max-width: 520px){
  .cub-inline{ flex-direction: column; align-items: stretch !important; }
  .cub-inline .cub-submit{ width: 100% !important; min-width: 0; }
}


/* === v1.2.8.5: align heights without "fat" button ===
   We avoid flex-stretch (which made the button tall) and instead set a shared min-height.
   You can override per-site by setting --cub-control-minheight on .cub-wrapper.
*/
.cub-wrapper{
  --cub-control-minheight: 50px;
}

.cub-inline{
  align-items: center !important; /* don't stretch */
}

/* Both controls share the same minimum height */
.cub-inline .cub-field,
.cub-inline .cub-submit{
  min-height: var(--cub-control-minheight) !important;
}

/* Keep button slim: no extra vertical padding, center the label */
.cub-inline .cub-submit{
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Keep input comfortable while respecting min-height */
.cub-inline .cub-field{
  padding-top: 12px;
  padding-bottom: 12px;
}


/* === v1.2.8.6: remove theme input bottom margins INSIDE plugin only === */
.cub-wrapper input[type="date"],
.cub-wrapper input[type="email"],
.cub-wrapper input[type="number"],
.cub-wrapper input[type="password"],
.cub-wrapper input[type="search"],
.cub-wrapper input[type="tel"],
.cub-wrapper input[type="text"],
.cub-wrapper input[type="url"],
.cub-wrapper select,
.cub-wrapper textarea{
  margin-bottom: 0 !important;
}
