/* ====== FORMS (site-wide dark theme) — minimal, non-duplicative ====== */
:root{
  --c-accent:#ff00ff;         /* magenta */
  --c-accent-2:#00ffff;       /* cyan */
  --c-bg:rgba(255,255,255,.08);
  --c-bg-focus:rgba(255,255,255,.12);
  --c-border:rgba(255,255,255,.20);
  --c-text:#fff;
  --c-muted:#aaa;
}

/* Hint browsers for dark popups/tooltips */
html, body, form { color-scheme: dark; }

/* Base controls */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="search"],
select,
textarea {
  width:100%;
  background:var(--c-bg) !important;
  color:var(--c-text) !important;
  border:1px solid var(--c-border) !important;
  border-radius:12px !important;
  padding:14px 16px !important;
  font:inherit; line-height:1.4;
  transition:border-color .25s, box-shadow .25s, background .25s;
  background-clip:padding-box;
}
::placeholder{ color:var(--c-muted); }

input:focus, select:focus, textarea:focus{
  outline:none;
  border-color:var(--c-accent) !important;
  box-shadow:0 0 14px rgba(255,0,255,.30) !important;
  background:var(--c-bg-focus) !important;
}

/* Dark select + chevron */
select{
  -webkit-appearance:none; -moz-appearance:none; appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 24 24' fill='%23ff00ff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 10l5 5 5-5H7z'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 12px center; background-size:18px;
  padding-right:44px !important;
}
select::-ms-expand{ display:none; }                   /* old Edge/IE */
select option{ background:#101010 !important; color:#fff !important; }

/* iOS/Safari: keep the closed field dark (popup is system UI) */
@supports (-webkit-touch-callout:none){
  select{ background-color:var(--c-bg) !important; color:var(--c-text) !important; border-color:var(--c-border) !important; }
}

/* Autofill (Chrome) */
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill{
  -webkit-text-fill-color:var(--c-text) !important;
  -webkit-box-shadow:0 0 0 1000px var(--c-bg) inset !important;
  box-shadow:0 0 0 1000px var(--c-bg) inset !important;
  caret-color:var(--c-text);
}

/* Checkboxes / radios */
input[type="checkbox"], input[type="radio"]{ accent-color:var(--c-accent); }

/* Validation / disabled */
input:invalid, select:invalid, textarea:invalid{ border-color:#ff4d8a !important; }
input:disabled, select:disabled, textarea:disabled{ opacity:.6; cursor:not-allowed; }

/* Plugin overrides (compact): CF7, WPForms, Gravity, Ninja, Elementor */
:where(.wpcf7, .wpforms-container, .gform_wrapper, .nf-form-content, .elementor-field-group)
  :where(select, textarea, input){
    background:var(--c-bg) !important;
    color:var(--c-text) !important;
    border-color:var(--c-border) !important;
    border-radius:12px !important;
}
:where(.wpcf7, .wpforms-container, .gform_wrapper, .nf-form-content, .elementor-field-group) select{
  background-image:inherit; padding-right:44px !important;
}
:where(.wpforms-form, .gform_wrapper, .wpcf7, .nf-form-content) select option{
  background:#101010 !important; color:#fff !important;
}

/* Kill hard-coded white backgrounds some plugins inject */
:where(select).bg-white,
.bg-white :where(select),
.form-select.bg-white,
:where(.wpforms-field select, .gfield_select)[style*="background"]{
  background:var(--c-bg) !important;
  color:var(--c-text) !important;
  border-color:var(--c-border) !important;
}

/* Buttons (kept brief; matches your theme) */
.btn{padding:14px 28px;border-radius:40px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;display:inline-block;transition:.2s;text-decoration:none}
.btn-primary{background:linear-gradient(45deg,var(--c-accent),#ffff00);color:#000;border:none}
.btn-secondary{background:transparent;color:#fff;border:2px solid var(--c-accent-2)}
.btn:hover{transform:translateY(-2px);box-shadow:0 15px 35px rgba(255,0,255,.35)}
.btn-secondary:hover{background:var(--c-accent-2);color:#000}

.my-form-container {
  max-width: 700px; /* You can change this number */
  margin: 0 auto;   /* This centers the form */
}