/* ============================================================
   Royal Phuket Marina — Gravity Forms skin (2026.07 rebuild)
   Two contexts:
   • Default  — light form on light/white grounds (Contact-style)
   • .rpm-leadform-card — dark translucent form on the navy
     "Reserve your …" lead-form section, matching the mockup.
   Targets only .gform_wrapper. Spec: landing.css .cl-leadform__form
   ============================================================ */

.gform_wrapper.gravity-theme, .gform_wrapper { font-family: var(--font-sans, var(--font-brand)); }

/* ---- 12-col grid so layoutGridColumnSpan (Email|Phone = 6) renders 2-up ---- */
.gform_wrapper .gform_fields {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 18px 20px;
}
.gform_wrapper .gfield { grid-column: span 12; }
.gform_wrapper .gfield.gfield--width-half { grid-column: span 6; }
@media (max-width: 640px) { .gform_wrapper .gfield { grid-column: span 12 !important; } }

/* ---- Labels ---- */
.gform_wrapper .gfield_label, .gform_wrapper legend.gfield_label {
  font-family: var(--font-brand); font-weight: 500; font-size: 11px;
  letter-spacing: .14em; text-transform: uppercase; color: var(--rpm-navy-800); margin-bottom: 8px;
}
.gform_wrapper .gfield_required { color: var(--rpm-brass-600); }

/* ---- Inputs (light default) ---- */
.gform_wrapper input[type=text], .gform_wrapper input[type=email],
.gform_wrapper input[type=tel], .gform_wrapper input[type=number],
.gform_wrapper input[type=date], .gform_wrapper select, .gform_wrapper textarea {
  width: 100%; background: #fff; border: 1px solid var(--rpm-line);
  border-radius: var(--radius-sm, 2px); padding: 12px 14px;
  font-family: var(--font-sans, var(--font-brand)); font-size: 14.5px; color: var(--text-body);
  transition: border-color .2s, box-shadow .2s;
}
.gform_wrapper input:focus, .gform_wrapper select:focus, .gform_wrapper textarea:focus {
  outline: none; border-color: var(--rpm-navy-700); box-shadow: 0 0 0 3px rgba(24,53,94,.08);
}
.gform_wrapper ::placeholder { color: var(--text-muted); opacity: .85; }

/*JaCkie*/
.gform-theme--framework .gform-field-label:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)) {
    --gf-local-color: var(--gf-color-primary-contrast) !important;
}

/* POPUP Download the Brochure Form*/
#gform_ajax_frame_23 .gform-theme--foundation .gform-field-label__text {
color:white !important;
}

/* ---- Radio / checkbox as pills ---- */
.gform_wrapper .gfield_radio, .gform_wrapper .gfield_checkbox { display: flex; flex-wrap: wrap; gap: 10px; }
.gform_wrapper .gfield_radio .gchoice, .gform_wrapper .gfield_checkbox .gchoice { display: flex; align-items: center; }
.gform_wrapper .gfield_radio .gchoice label, .gform_wrapper .gfield_checkbox .gchoice label {
  border: 1px solid var(--rpm-line); border-radius: var(--radius-sm, 2px); padding: 9px 16px;
  font-size: 12px; letter-spacing: .1em; text-transform: uppercase; font-weight: 500;
  color: var(--text-body); cursor: pointer; transition: all .2s; max-width: none; margin: 0;
}
.gform_wrapper .gfield_radio input[type=radio], .gform_wrapper .gfield_checkbox input[type=checkbox] { position: absolute; opacity: 0; }
.gform_wrapper .gfield_radio input:checked + label, .gform_wrapper .gfield_checkbox input:checked + label {
  border-color: var(--rpm-brass-500); color: var(--rpm-brass-600); background: rgba(176,137,79,.10);
}

/* ---- Submit ---- */
.gform_wrapper input[type=submit], .gform_wrapper .gform_button {
  background: var(--rpm-brass-500); color: #fff; border: 1px solid var(--rpm-brass-500);
  border-radius: var(--radius-sm, 2px); font-family: var(--font-brand); font-weight: 500;
  font-size: 12.5px; letter-spacing: .16em; text-transform: uppercase; padding: 15px 30px; cursor: pointer;
  transition: background .2s;
}
.gform_wrapper input[type=submit]:hover, .gform_wrapper .gform_button:hover { background: var(--rpm-brass-600); border-color: var(--rpm-brass-600); }
.gform_wrapper .gform_footer { margin-top: 6px; }

/* ---- Validation / confirmation ---- */
.gform_wrapper .gfield_error input, .gform_wrapper .gfield_error select, .gform_wrapper .gfield_error textarea { border-color: var(--rpm-error, var(--error)); }
.gform_wrapper .gfield_validation_message, .gform_wrapper .validation_message { color: var(--error); font-size: 12.5px; background: none; border: none; padding: 6px 0 0; }
.gform_confirmation_message { font-family: var(--font-display-italic); font-size: 17px; color: var(--rpm-brass-300); border-left: 2px solid var(--rpm-brass-500); padding-left: 16px; }

/* ============================================================
   DARK lead-form card (navy "Reserve your …" section)
   ============================================================ */
.rpm-leadform-card {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 6px;
}
.rpm-leadform-card .gfield_label, .rpm-leadform-card legend.gfield_label { color: rgba(255,255,255,.92); }
.rpm-leadform-card .gfield_required { color: var(--rpm-brass-300); }
.rpm-leadform-card input[type=text], .rpm-leadform-card input[type=email],
.rpm-leadform-card input[type=tel], .rpm-leadform-card input[type=number],
.rpm-leadform-card input[type=date], .rpm-leadform-card select, .rpm-leadform-card textarea {
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.22); color: #fff; border-radius: 3px;
}
.rpm-leadform-card ::placeholder { color: rgba(255,255,255,.42); }
.rpm-leadform-card input:focus, .rpm-leadform-card select:focus, .rpm-leadform-card textarea:focus {
  border-color: var(--rpm-brass-300); background: rgba(255,255,255,.07); box-shadow: none;
}
.rpm-leadform-card select { -webkit-appearance: none; appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23DBC299' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center; padding-right: 36px; }
.rpm-leadform-card select option { color: #14181D; }
.rpm-leadform-card .gfield_radio .gchoice label, .rpm-leadform-card .gfield_checkbox .gchoice label {
    border-color: rgba(255,255,255,.28);
    color: rgba(255,255,255,.82);
/* 	background: rgba(176,137,79,.40)rgba(255,255,255,.10); */
	background: rgba(255,255,255,.10);
    border-radius: 20px;
}

.rpm-leadform-card .gfield_radio input:checked + label, .rpm-leadform-card .gfield_checkbox input:checked + label {
  border-color: var(--rpm-brass-300); color: #fff; background-color: var(--accent);
}
.rpm-leadform-card .gform_confirmation_message { color: #fff; }

/* ---- Overrides to beat Gravity Forms gravity-theme specificity ---- */
.rpm-leadform-card .gform_wrapper input[type=text],
.rpm-leadform-card .gform_wrapper input[type=email],
.rpm-leadform-card .gform_wrapper input[type=tel],
.rpm-leadform-card .gform_wrapper input[type=number],
.rpm-leadform-card .gform_wrapper input[type=date],
.rpm-leadform-card .gform_wrapper select,
.rpm-leadform-card .gform_wrapper textarea {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.24) !important;
  color: #fff !important;
}
.rpm-leadform-card .gform_wrapper ::placeholder { color: rgba(255,255,255,.45) !important; }
.rpm-leadform-card .gform_wrapper select option { color:#14181D !important; }
/* Pills: force horizontal row */
.gform_wrapper .gfield_radio,
.gform_wrapper .gfield_checkbox { display:flex !important; flex-direction:row !important; flex-wrap:wrap !important; gap:10px !important; }
.gform_wrapper .gfield_radio .gchoice,
.gform_wrapper .gfield_checkbox .gchoice { width:auto !important; margin:0 !important; }
.gform_wrapper .gfield_radio .gchoice label,
.gform_wrapper .gfield_checkbox .gchoice label { display:inline-flex; align-items:center; }