/* DAYUR — contact form additions + lightbox.
   Field/input looks come from BA Forms' ba-style.css (kept); this file only covers the
   bits BA Forms used to render from the backend: real submit button, consent, status,
   honeypot and the modal. */

/* ── Submit button: match the site's button family ──────────────────────────
   BA Forms drives its submit button off --submit-* variables (flat orange, 5px radius),
   which looked nothing like the rest of the site. Restyle it to the theme's button:
   the shared --gradient, near-square 4px corners and the same 15px/600 type and padding
   that `body .sppb-btn` uses. BA sets none of these with !important, so a plain
   class-on-class selector wins. */
.ba-form-submit-btn {
  cursor: pointer;
  font-family: inherit;
  appearance: none;
  -webkit-appearance: none;
}
.dayur-form .ba-form-submit-btn {
  background: var(--gradient);
  border: 0;
  border-radius: 4px;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  line-height: 2;
  padding: 10px 33px 10px 34px;
  width: auto;
  transition: opacity .25s ease;
}
/* The theme's filled buttons keep the identical gradient on hover (i.e. no feedback at
   all). Same gradient here, plus a slight fade so the form's primary action still
   acknowledges the pointer. */
.dayur-form .ba-form-submit-btn:hover,
.dayur-form .ba-form-submit-btn:focus {
  background: var(--gradient);
  opacity: .88;
}
.ba-form-submit-btn:disabled { opacity: .6; cursor: default; }

/* ── Navbar "Contact us" hover ───────────────────────────────────────────────
   Once the header sticks, the theme forces the button's text dark via
   "#sp-header.transparent-header.header-sticky .contact-us-wrap .sppb-btn
    { color: var(--text-color) !important }", where --text-color is #17161a.
   That is fine at rest (the button is transparent — background-clip:text — over the
   light sticky header), but :hover flips background-clip to border-box so the gradient
   fills the button, leaving dark text on a dark-navy gradient. The theme has no hover
   override, so we add one. Needs !important and >= specificity to beat the rule above. */
#sp-header .contact-us-wrap .sppb-btn:hover,
#sp-header.transparent-header.header-sticky .contact-us-wrap .sppb-btn:hover {
  color: #fff !important;
}

/* ── Square off the one odd button out ───────────────────────────────────────
   Every button on the page renders at 4px except the filled CTA under "Open-Minded
   Attitude…", which the theme gives 6px via .sppb-btn-rounded. Match the family.
   Specificity mirrors the theme's own rule; this file loads later, so it wins. */
body .sppb-btn.sppb-btn-default.sppb-btn-rounded,
body .sppb-btn.sppb-btn-primary.sppb-btn-rounded {
  border-radius: 4px;
}

/* ba-style.css ships an UNSCOPED `label { transform: translateY(40px) }` — it's BA Forms'
   floating-label animation, which its own JS undid on focus/fill. Any label we add outside a
   BA field wrapper inherits it and paints 40px too low; because transform doesn't affect
   layout, the parent box keeps its height and the label silently overlaps whatever follows
   (submit button, cookie switches). Reset it for every label we own. Class beats element,
   so no !important needed. */
.dayur-consent,
.dayur-hp label,
.ck-switch {
  transform: none;
}

/* Honeypot — off-screen for people, irresistible to bots. Never display:none. */
.dayur-hp {
  position: absolute !important;
  left: -9999px !important;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.dayur-consent-field { margin: 6px 0 18px; }
.dayur-consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  line-height: 1.45;
  cursor: pointer;
}
.dayur-consent input[type="checkbox"] {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
  accent-color: #f29100;
}
.dayur-consent a { text-decoration: underline; }

.dayur-form-status {
  margin: 14px 0 0;
  padding: 12px 16px;
  border-radius: 5px;
  font-size: 15px;
  line-height: 1.45;
}
.dayur-form-status--ok  { background: rgba(76, 175, 80, .12); border: 1px solid rgba(76, 175, 80, .5); }
.dayur-form-status--err { background: rgba(242, 145, 0, .12); border: 1px solid rgba(242, 145, 0, .6); }

.dayur-form-legal {
  margin: 12px 0 0;
  font-size: 12px;
  line-height: 1.5;
  opacity: .6;
}
.dayur-form-legal a { text-decoration: underline; }

/* We show the attribution above, so Google permits hiding the floating badge.
   Must be visibility (not display:none) or reCAPTCHA stops issuing tokens. */
.grecaptcha-badge { visibility: hidden; }

/* ---------- lightbox ---------- */

.dayur-modal {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 24px 16px;
  overflow-y: auto;
}
.dayur-modal[hidden] { display: none; }
body.dayur-modal-open { overflow: hidden; }

.dayur-modal__overlay {
  position: fixed;
  inset: 0;
  background: rgba(15, 20, 26, .75);
}
.dayur-modal__dialog {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 760px;
  margin: auto;
  padding: 40px 40px 32px;
  background: #fff;
  border-radius: 6px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
  animation: dayur-modal-in .22s ease-out;
}
@keyframes dayur-modal-in {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .dayur-modal__dialog { animation: none; }
}

.dayur-modal__title {
  margin: 0 0 24px;
  font-size: 28px;
  line-height: 1.2;
}
.dayur-modal__close {
  position: absolute;
  top: 10px;
  right: 14px;
  width: 40px;
  height: 40px;
  border: 0;
  background: none;
  font-size: 32px;
  line-height: 1;
  color: #5c5c5c;
  cursor: pointer;
  border-radius: 4px;
}
.dayur-modal__close:hover { color: #f29100; }

@media (max-width: 767px) {
  .dayur-modal__dialog { padding: 32px 20px 24px; }
  .dayur-modal__title { font-size: 22px; margin-bottom: 18px; }
}