/* JD's Journey survey skin. Paste into each GoHighLevel survey's Custom CSS box.
   Used by surveys WLq48zgdsvA4hORM4lvK (application) and VQuswffk0btSA9Aoc0Kz (identity verification).
   Brand: ink #0B0A09, gold #D8A531, gold-bright #F3CE72, gold-deep #8A5E0E, paper text #1A1611, Poppins.
   Selectors start with "html body" so they beat GoHighLevel's generated field CSS. */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

/* One clean card: the page around the iframe already supplies the white card */
html body, html body #app, html body .hl-app { background: transparent !important; }
html body [id^="hl_form_builder_main"] { padding: 10px 14px 12px !important; }
html body .ghl-form-wrap { box-shadow: none !important; margin-bottom: 0 !important; max-width: 560px !important; border-radius: 0 !important; }
html body #_builder-form { padding: 6px 0 18px !important; border: 0 !important; background: transparent !important; }

/* Type */
html body #_builder-form, html body #_builder-form p, html body #_builder-form label, html body #_builder-form input,
html body #_builder-form textarea, html body #_builder-form .text-element {
  font-family: 'Poppins', system-ui, sans-serif !important;
}
html body #_builder-form .heading-element .text-element, html body #_builder-form .heading-element p {
  color: #1A1611 !important; font-size: 15px !important; line-height: 1.6 !important;
}
html body #_builder-form .field-label, html body #_builder-form .label-alignment {
  color: #1A1611 !important; font-size: 15px !important; font-weight: 600 !important; line-height: 1.45 !important;
  margin-bottom: 10px !important;
}
html body #_builder-form .field-label span, html body #_builder-form .label-alignment span { color: #B8860B !important; }
html body #_builder-form .field-divider { display: none !important; }

/* Text inputs */
html body #_builder-form .form-builder--item input[type=text][class=form-control], html body #_builder-form input[type=text].form-control,
html body #_builder-form input[type=email], html body #_builder-form input[type=tel], html body #_builder-form input[type=number],
html body #_builder-form textarea, html body #_builder-form .multiselect .multiselect__tags, html body #_builder-form .date-picker-custom-style {
  background: #FBF8F1 !important; color: #1A1611 !important;
  border: 1.5px solid #E4DBC9 !important; border-radius: 12px !important;
  min-height: 52px !important; padding: 14px 16px !important;
  font-size: 16px !important; font-weight: 400 !important;
  box-shadow: none !important; transition: border-color .2s, box-shadow .2s, background .2s;
}
html body #_builder-form .iti--allow-dropdown input[type=tel] { padding-left: 52px !important; }
html body #_builder-form input::placeholder, html body #_builder-form textarea::placeholder { color: #A39886 !important; font-weight: 400 !important; }
html body #_builder-form input:focus, html body #_builder-form textarea:focus, html body #_builder-form .multiselect--active .multiselect__tags {
  outline: none !important; background: #fff !important;
  border-color: #D8A531 !important; box-shadow: 0 0 0 4px rgba(216,165,49,.18) !important;
}

/* Multiple-choice answers as tappable cards */
html body #_builder-form .option-radio, html body #_builder-form .option-checkbox { margin: 0 0 10px !important; }
html body #_builder-form .standard-radio-container, html body #_builder-form .standard-checkbox-container {
  position: relative; display: flex !important; align-items: center; gap: 12px;
  background: #FBF8F1; border: 1.5px solid #E4DBC9; border-radius: 12px;
  padding: 13px 16px !important; cursor: pointer; transition: border-color .2s, background .2s, box-shadow .2s;
}
html body #_builder-form .standard-radio-container:hover, html body #_builder-form .standard-checkbox-container:hover { border-color: #D8A531; }
html body #_builder-form .standard-radio-container label, html body #_builder-form .standard-checkbox-container label {
  margin: 0 !important; color: #1A1611 !important; font-size: 15px !important; font-weight: 500 !important; cursor: pointer; flex: 1;
}
/* Whole card is clickable */
html body #_builder-form .standard-radio-container label::after, html body #_builder-form .standard-checkbox-container label::after {
  content: ""; position: absolute; inset: 0;
}
html body #_builder-form input[type=radio], html body #_builder-form input[type=checkbox] {
  appearance: none; -webkit-appearance: none; flex: none;
  width: 22px !important; height: 22px !important; margin: 0 !important;
  border: 2px solid #CFC3AB !important; background: #fff !important; border-radius: 50%;
  display: grid; place-content: center; cursor: pointer; transition: all .2s;
}
html body #_builder-form input[type=checkbox] { border-radius: 7px; }
html body #_builder-form input[type=radio]::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: #22180A; transform: scale(0); transition: transform .15s; }
html body #_builder-form input[type=checkbox]::before { content: ""; width: 11px; height: 6px; border: solid #22180A; border-width: 0 0 2.5px 2.5px; transform: rotate(-45deg) scale(0); margin-top: -3px; transition: transform .15s; }
html body #_builder-form input[type=radio]:checked, html body #_builder-form input[type=checkbox]:checked { border-color: #D8A531 !important; background: #D8A531 !important; }
html body #_builder-form input[type=radio]:checked::before { transform: scale(1); }
html body #_builder-form input[type=checkbox]:checked::before { transform: rotate(-45deg) scale(1); }
html body #_builder-form .standard-radio-container:has(input:checked), html body #_builder-form .standard-checkbox-container:has(input:checked) {
  border-color: #D8A531; background: #FFF6DF; box-shadow: 0 0 0 3px rgba(216,165,49,.16);
}

/* Signature pad, file upload, dropdowns (identity verification survey) */
html body #_builder-form canvas.signature-button {
  background: #FBF8F1 !important; border: 1.5px solid #E4DBC9 !important; border-radius: 12px !important; width: 100% !important;
}
html body #_builder-form .signature-placeholder { color: #A39886 !important; font-family: 'Poppins', sans-serif !important; font-size: 14px !important; }
html body #_builder-form .clear-button { font-size: 13px !important; }
html body #_builder-form label.custom-file-upload {
  background: #FBF8F1 !important; border: 1.5px dashed #D8A531 !important; border-radius: 14px !important;
  padding: 22px 16px !important; cursor: pointer; transition: background .2s, border-color .2s;
}
html body #_builder-form label.custom-file-upload:hover { background: #FFF6DF !important; border-color: #B8860B !important; }
html body #_builder-form .custom-file-upload, html body #_builder-form .custom-file-upload * {
  color: #5B5245 !important; font-family: 'Poppins', sans-serif !important; font-size: 14px !important; line-height: 1.5 !important;
}
html body #_builder-form .custom-file-upload svg, html body #_builder-form .custom-file-upload path { color: #B8860B !important; stroke: currentColor; }
html body #_builder-form .multiselect__placeholder, html body #_builder-form .multiselect__single, html body #_builder-form .multiselect__input {
  background: transparent !important; font-family: 'Poppins', sans-serif !important; font-size: 15px !important; color: #1A1611 !important;
}
html body #_builder-form .multiselect__placeholder { color: #A39886 !important; }
html body #_builder-form .multiselect__content-wrapper { border: 1.5px solid #E4DBC9 !important; border-radius: 12px !important; box-shadow: 0 16px 32px -16px rgba(0,0,0,.25); }
html body #_builder-form .multiselect__option--highlight { background: #FFF6DF !important; color: #1A1611 !important; }
html body #_builder-form .multiselect__option--selected { background: #D8A531 !important; color: #22180A !important; }
html body #_builder-form .multiselect__tag { background: #D8A531 !important; color: #22180A !important; border-radius: 999px !important; }

/* Consent checkbox */
html body #_builder-form .terms-and-conditions .checkbox-container { display: flex !important; align-items: flex-start; gap: 12px; }
html body #_builder-form .terms-and-conditions input[type=checkbox] { margin-top: 2px !important; }
html body #_builder-form .terms-text-container, html body #_builder-form .terms-text-container p {
  color: #5B5245 !important; font-size: 13px !important; line-height: 1.55 !important; font-weight: 400 !important;
}

/* Links */
html body #_builder-form a { color: #8A5E0E !important; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(138,94,14,.35); }
html body #_builder-form .heading-element p:has(a) { font-size: 13px !important; text-align: center; }

/* Errors */
html body #_builder-form .error, html body #_builder-form .text-danger, html body #_builder-form .error-message { color: #B42318 !important; font-size: 13px !important; }

/* Footer: real buttons instead of a flat bar */
html body .ghl-footer {
  background: transparent !important; box-shadow: none !important; height: auto !important;
  border-radius: 0 !important; padding: 4px 0 2px !important;
}
html body .ghl-footer .ghl-footer-buttons { height: auto !important; gap: 10px; align-items: center; }
html body .ghl-footer .ghl-footer-buttons .ghl-btn:not(.ghl-btn-placeholder) {
  border-radius: 999px !important; height: 54px !important; padding: 0 24px !important;
  display: inline-flex !important; align-items: center; justify-content: center; gap: 8px;
  font-family: 'Poppins', sans-serif !important; font-size: 0 !important; opacity: 1 !important;
  cursor: pointer; transition: transform .15s, box-shadow .2s;
}
html body .ghl-footer .ghl-footer-buttons .ghl-btn::before { font-size: 15px; font-weight: 700; letter-spacing: .01em; }
html body .ghl-footer .ghl-footer-buttons .ghl-btn[aria-label="NEXT"]::before { content: "Next"; }
html body .ghl-footer .ghl-footer-buttons .ghl-btn[aria-label="SUBMIT"]::before { content: "Submit"; }
html body .ghl-footer .ghl-footer-buttons .ghl-btn[aria-label="PREV"]::before { content: "Back"; font-weight: 600; }
/* Primary (Next / Submit) */
html body .ghl-footer .ghl-footer-buttons .ghl-btn[aria-label="NEXT"], html body .ghl-footer .ghl-footer-buttons .ghl-btn[aria-label="SUBMIT"],
html body .ghl-footer .ghl-footer-buttons .ghl-footer-next, html body .ghl-footer .ghl-footer-buttons .ghl-footer-submit {
  background: linear-gradient(180deg, #F3CE72, #D8A531) !important; color: #22180A !important;
  box-shadow: 0 10px 24px -10px rgba(216,165,49,.8) !important; flex: 1 1 auto !important; width: auto !important;
}
html body .ghl-footer .ghl-footer-buttons .ghl-btn[aria-label="NEXT"]:hover, html body .ghl-footer .ghl-footer-buttons .ghl-btn[aria-label="SUBMIT"]:hover {
  transform: translateY(-1px); box-shadow: 0 14px 28px -10px rgba(216,165,49,.9) !important;
}
/* Back */
html body .ghl-footer .ghl-footer-buttons .ghl-btn[aria-label="PREV"] {
  background: #F3EEE3 !important; color: #5B5245 !important; flex: none !important; width: auto !important; order: -2;
}
html body .ghl-footer .ghl-btn svg { stroke: currentColor !important; width: 18px; height: 18px; }
html body .ghl-footer .ghl-btn-placeholder { display: none !important; }
html body .ghl-footer .ghl-mobile-step-indicator { order: -1; flex: none; padding: 0 6px; }
html body .ghl-footer .ghl-mobile-step-text { color: #8A7D66 !important; font-family: 'Poppins', sans-serif !important; font-size: 13px !important; font-weight: 600 !important; }

/* Progress bar */
html body .survey-progress-bar-mobile, html body .survey-progress-bar-header {
  height: 6px !important; border-radius: 999px !important; background: #EFE7D6 !important; margin: 0 2px 18px !important; overflow: hidden;
}
html body .survey-progress-fill-mobile { background: linear-gradient(90deg, #F3CE72, #D8A531) !important; border-radius: 999px !important; height: 100% !important; }