.contact-modal-backdrop{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,0.45);
  z-index:9999;
}
.contact-modal{
  background:#fff;
  color:#111;
  border-radius:10px;
  max-width:520px;
  width:92%;
  padding:22px 20px;
  box-shadow:0 8px 30px rgba(0,0,0,0.25);
  position:relative;
}
.contact-modal h3{margin:0 0 8px;font-size:18px}
.contact-modal p{margin:0 0 14px;color:#444}
.contact-modal .contact-modal-close{position:absolute;top:8px;right:10px;border:0;background:transparent;font-size:20px;cursor:pointer}
.contact-modal .contact-modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:12px}
.contact-btn{background:#0b63ff;color:#fff;border:0;padding:8px 14px;border-radius:6px;cursor:pointer}
.contact-btn.secondary{background:#f1f5f9;color:#0b63ff}
.contact-modal .icon{display:inline-block;margin-right:8px}
.contact-success-icon{color:#16a34a}
.contact-error-icon{color:#dc2626}

/* Mobile light-mode contact form fixes (moved from contact-form-fixes.css) */
html:not(.dark) .contact-form-wrapper{
  background: transparent !important;
  padding: 0 !important;
}

html:not(.dark) .contact-form .form-control.form-input{
  background: #ffffff !important;
  color: #0b0b0b !important;
  border: 1px solid #d1d5db !important;
  box-shadow: none !important;
}

html:not(.dark) .contact-form .form-control.form-input::placeholder{
  color: #9ca3af !important;
}

@media (max-width: 768px){
  html:not(.dark) .contact-form-wrapper{
    padding: 12px !important;
    border-radius: 6px !important;
    background: transparent !important;
  }
  html:not(.dark) .contact-form{
    background: transparent !important;
  }
  html:not(.dark) .contact-form .d-grid .btn.submit-btn{
    width: 100%;
  }
}

/* Stronger fixes for autofill, focus and autocomplete background issues */
html:not(.dark) .contact-form .form-control.form-input,
html:not(.dark) .contact-form textarea.form-control.form-input{
  background: #ffffff !important;
  color: #0b0b0b !important;
  border: 1px solid #d1d5db !important;
  box-shadow: none !important;
  -webkit-box-shadow: 0 0 0 30px #fff inset !important; /* autofill */
}

html:not(.dark) .contact-form .form-control.form-input:focus,
html:not(.dark) .contact-form textarea.form-control.form-input:focus{
  background: #ffffff !important;
  color: #0b0b0b !important;
  border-color: #cbd5e1 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* WebKit autofill overrides */
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
  -webkit-text-fill-color: #0b0b0b !important;
  -webkit-box-shadow: 0 0 0 30px #fff inset !important;
  box-shadow: none !important;
}

/* On some browsers the autocomplete overlay can affect layout; ensure inputs remain opaque */
html:not(.dark) .contact-form .form-control.form-input{opacity:1 !important}

/* Additional strong overrides for browser autocomplete / suggestion highlights */
html:not(.dark) .contact-form .form-control.form-input::-webkit-input-placeholder{color:#9ca3af !important}
html:not(.dark) .contact-form textarea.form-control.form-input::-webkit-input-placeholder{color:#9ca3af !important}

/* Selection inside inputs (when user highlights or browser highlights matched text) */
html:not(.dark) .contact-form .form-control.form-input::selection,
html:not(.dark) .contact-form textarea.form-control.form-input::selection{
  background: #bfdbfe !important; /* light blue but readable */
  color: #0b0b0b !important;
}
html:not(.dark) .contact-form .form-control.form-input::-moz-selection,
html:not(.dark) .contact-form textarea.form-control.form-input::-moz-selection{
  background: #bfdbfe !important;
  color: #0b0b0b !important;
}

/* Ensure autofill doesn't tint the input on WebKit/Blink */
html:not(.dark) input.form-control.form-input:-webkit-autofill,
html:not(.dark) textarea.form-control.form-input:-webkit-autofill{
  -webkit-text-fill-color: #0b0b0b !important;
  -webkit-box-shadow: 0 0 0px 1000px #ffffff inset !important;
  box-shadow: 0 0 0px 1000px #ffffff inset !important;
}

/* Also handle focus after autofill */
html:not(.dark) input.form-control.form-input:-webkit-autofill:focus,
html:not(.dark) textarea.form-control.form-input:-webkit-autofill:focus{
  -webkit-text-fill-color: #0b0b0b !important;
  -webkit-box-shadow: 0 0 0px 1000px #ffffff inset !important;
}

/* Prevent browser suggestion dropdown from styling the input via outline or box-shadow */
html:not(.dark) .contact-form .form-control.form-input,
html:not(.dark) .contact-form textarea.form-control.form-input{
  outline: none !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}

/* Keep caret and selection visible */
html:not(.dark) .contact-form .form-control.form-input{caret-color:#0b0b0b !important}

/* Final stronger fallbacks to override any browser styling */
html:not(.dark) .contact-form .form-control.form-input,
html:not(.dark) .contact-form textarea.form-control.form-input,
html:not(.dark) .contact-form .form-control.form-input:-webkit-autofill,
html:not(.dark) .contact-form textarea.form-control.form-input:-webkit-autofill{
  background-color: #ffffff !important;
  background-clip: padding-box !important;
  color: #0b0b0b !important;
  -webkit-text-fill-color: #0b0b0b !important;
  border: 1px solid #d1d5db !important;
  box-shadow: 0 0 0 1000px #ffffff inset !important;
  -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
  opacity: 1 !important;
  outline: none !important;
  -webkit-appearance: none !important;
}

/* Remove any background-image that some UAs add */
html:not(.dark) .contact-form .form-control.form-input::-ms-value,
html:not(.dark) .contact-form .form-control.form-input::-webkit-textfield-decoration-container{
  background: transparent !important;
}

/* Ensure focus doesn't reintroduce tinted shadow */
html:not(.dark) .contact-form .form-control.form-input:focus,
html:not(.dark) .contact-form textarea.form-control.form-input:focus{
  -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
  box-shadow: 0 0 0 1000px #ffffff inset !important;
  border-color: #cbd5e1 !important;
}

/* Special case for autofill on Chromium/Blink */
html:not(.dark) input.form-control.form-input:-internal-autofill-selected,
html:not(.dark) input.form-control.form-input:-autofill,
html:not(.dark) textarea.form-control.form-input:-internal-autofill-selected{
  -webkit-text-fill-color: #0b0b0b !important;
  transition: background-color 5000s ease-in-out 0s !important;
}
