/* Veolia reusable styling — adapted from the full original BeyondPFAS CSS.
 * Replace ALL previous custom CSS. No <style> tags.
 * Styles apply to Drupal Webforms using form.webform-submission-form.
 * PFAS-specific selectors are retained only where relevant.
 */
form.webform-submission-form {
  --bpfas-red: #e30613;
  --bpfas-red-dark: #b8000b;
  --bpfas-text: #292929;
  --bpfas-muted: #575757;
  --bpfas-border: #858585;
  --bpfas-line: transparent;
  --bpfas-field: #f7f7f7;
  --bpfas-focus: #0072ce;
  box-sizing: border-box !important;
  width: calc(100% - 32px) !important;
  max-width: 960px !important;
  margin: 32px auto !important;
  padding: 34px 36px !important;
  border: 1px solid var(--bpfas-line) !important;
  border-radius: 18px !important;
  background: #fff !important;
  color: var(--bpfas-text) !important;
  font-family: "Noto Sans", Arial, Helvetica, sans-serif !important;
  font-size: 16px;
  line-height: 1.5;
  box-shadow: 0 12px 42px rgb(0 0 0 / 7%) !important;
}
form.webform-submission-form *, form.webform-submission-form *::before, form.webform-submission-form *::after { box-sizing: border-box; }
form.webform-submission-form .webform-progress { display: none !important; }
form.webform-submission-form .bpfas-header { margin: 0 0 24px !important; }
form.webform-submission-form .bpfas-header::before {
  content: "";
  display: block;
  width: 44px;
  height: 4px;
  margin-bottom: 16px;
  border-radius: 4px;
  background: var(--bpfas-red);
}
form.webform-submission-form .bpfas-title {
  margin: 0 0 10px !important;
  padding: 0 !important;
  color: var(--bpfas-text) !important;
  font-family: inherit !important;
  font-size: clamp(28px, 3.5vw, 38px) !important;
  font-weight: 700 !important;
  line-height: 1.18 !important;
  letter-spacing: -0.7px;
  text-align: left !important;
}
form.webform-submission-form .bpfas-header p { margin: 0 0 8px !important; color: var(--bpfas-muted); font-size: 15px; }
form.webform-submission-form .bpfas-header .bpfas-required-note { margin-bottom: 0 !important; font-size: 12px; }
form.webform-submission-form fieldset { min-width: 0 !important; margin: 0; border: 0; padding: 0; }
form.webform-submission-form .bpfas-client { margin: 0 0 26px !important; }
form.webform-submission-form .client-type-choice { margin: 0 !important; padding: 0 !important; border: 0 !important; }
form.webform-submission-form .client-type-choice > legend { float: none !important; padding: 0 !important; margin: 0 0 10px !important; border: 0 !important; }
form.webform-submission-form .bpfas-section {
  min-width: 0 !important;
  margin: 0 0 20px !important;
  padding: 22px 24px 6px !important;
  border: 1px solid var(--bpfas-line) !important;
  border-radius: 12px !important;
  background: #fff !important;
}
/* Float the legend inside its card rather than cutting through the border. */
form.webform-submission-form .bpfas-section > legend {
  float: left !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 20px !important;
  padding: 0 0 0 12px !important;
  border: 0 !important;
  border-left: 3px solid var(--bpfas-red) !important;
  color: var(--bpfas-text) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}
form.webform-submission-form .bpfas-section > legend .fieldset-legend {
  display: block !important;
  margin: 0 !important;
  color: inherit !important;
  font: inherit !important;
}
form.webform-submission-form .bpfas-section > .fieldset-wrapper { clear: both; }
form.webform-submission-form .fieldset-wrapper { min-width: 0 !important; }
form.webform-submission-form .form-item { min-width: 0; margin: 0 0 18px; padding: 0; }
form.webform-submission-form label:not(.option), form.webform-submission-form .client-type-choice .fieldset-legend {
  display: block;
  margin: 0 0 8px !important;
  color: var(--bpfas-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  text-transform: none !important;
}
form.webform-submission-form .form-required { background: none !important; }
form.webform-submission-form .form-required::before { content: none !important; }
form.webform-submission-form .form-required::after {
  content: " *" !important;
  display: inline !important;
  position: static !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  color: var(--bpfas-red-dark) !important;
  font-size: inherit !important;
}
form.webform-submission-form .webform-flexbox {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 20px !important;
  width: 100% !important;
  margin: 0 !important;
}
form.webform-submission-form .webform-flexbox > .webform-flex { flex: 1 1 0 !important; min-width: 0 !important; margin: 0 !important; }
form.webform-submission-form .webform-flex--container { min-width: 0 !important; margin: 0 !important; padding: 0 !important; }
form.webform-submission-form input:is([type="text"], [type="email"], [type="tel"]),
form.webform-submission-form textarea.form-textarea,
form.webform-submission-form select:not(.select2-hidden-accessible) {
  width: 100% !important;
  max-width: 100% !important;
  height: 50px !important;
  min-height: 50px !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  border: 1px solid var(--bpfas-border) !important;
  border-radius: 6px !important;
  background-color: var(--bpfas-field) !important;
  color: var(--bpfas-text) !important;
  font-family: inherit !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 24px !important;
  text-transform: none !important;
  box-shadow: none !important;
}
form.webform-submission-form select:not(.select2-hidden-accessible) {
  appearance: none !important;
  padding-right: 42px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23292929' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-position: right 14px center !important;
  background-repeat: no-repeat !important;
  background-size: 16px !important;
  cursor: pointer;
}
form.webform-submission-form textarea.form-textarea { height: 50px !important; min-height: 50px !important; resize: none !important; overflow-y: auto; }
form.webform-submission-form input::placeholder, form.webform-submission-form textarea::placeholder { color: #686868 !important; opacity: 1 !important; font-weight: 400 !important; text-transform: none !important; }
form.webform-submission-form :is(input, textarea, select):focus-visible,
form.webform-submission-form a:focus-visible, form.webform-submission-form button:focus-visible,
form.webform-submission-form .select2-selection:focus-visible {
  outline: 3px solid var(--bpfas-focus) !important;
  outline-offset: 3px !important;
}
form.webform-submission-form :is(input, textarea, select).error,
form.webform-submission-form [aria-invalid="true"] { border-color: var(--bpfas-red-dark) !important; }
form.webform-submission-form .form-item--error-message { color: #a3000d; font-size: 14px; margin-top: 6px; }
form.webform-submission-form :is(.description, .webform-element-description, .form-item__description) { color: var(--bpfas-muted); font-size: 13px; margin-top: 6px; }
/* Force radio and text onto the same line despite theme ordering. */
form.webform-submission-form .client-type-choice .webform-options-display-side-by-side {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
  margin: 0 !important;
}
form.webform-submission-form .client-type-choice :is(.js-form-type-radio, .form-type-radio) {
  position: relative;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 12px !important;
  width: auto !important;
  min-height: 58px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  border: 1px solid var(--bpfas-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  cursor: pointer;
}
form.webform-submission-form .client-type-choice :is(.js-form-type-radio, .form-type-radio):has(input:checked),
form.webform-submission-form .client-type-choice .is-selected { border-color: var(--bpfas-red) !important; background: #fff5f5 !important; box-shadow: inset 0 0 0 1px var(--bpfas-red); }
form.webform-submission-form .client-type-choice :is(.js-form-type-radio, .form-type-radio):focus-within { outline: 2px solid var(--bpfas-focus); outline-offset: 3px; }
form.webform-submission-form input:is([type="radio"], [type="checkbox"]) {
  appearance: auto !important;
  display: block !important;
  position: static !important;
  inset: auto !important;
  transform: none !important;
  width: 20px !important;
  height: 20px !important;
  min-height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 1 !important;
  clip: auto !important;
  clip-path: none !important;
  accent-color: var(--bpfas-red);
  flex-shrink: 0;
}
form.webform-submission-form input:is([type="radio"], [type="checkbox"])::before,
form.webform-submission-form input:is([type="radio"], [type="checkbox"])::after { content: none !important; }
form.webform-submission-form .client-type-choice .ui-front { display: flex !important; order: 0 !important; flex: 0 0 20px !important; width: 20px !important; margin: 0 !important; padding: 0 !important; }
form.webform-submission-form .client-type-choice label.option {
  position: static !important;
  display: block !important;
  order: 1 !important;
  flex: 1 !important;
  width: auto !important;
  margin: 0 !important;
  padding: 16px 0 !important;
  color: var(--bpfas-text) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 24px !important;
  text-transform: none !important;
  cursor: pointer;
}
form.webform-submission-form .client-type-choice label.option::before,
form.webform-submission-form .client-type-choice label.option::after,
form.webform-submission-form .js-form-type-checkbox label.option::before { content: none !important; }
form.webform-submission-form .client-routing-message { margin-top: 18px; padding: 18px 20px; border-left: 3px solid var(--bpfas-red); border-radius: 6px; background: #f7f7f7; color: var(--bpfas-text); font-size: 14px; }
form.webform-submission-form .client-routing-message p { margin: 0 0 8px !important; }
form.webform-submission-form .client-routing-message p:last-child { margin-bottom: 0 !important; }
form.webform-submission-form .webform-rgpd-notice { color: var(--bpfas-muted); font-size: 14px; line-height: 1.6; }
form.webform-submission-form .webform-rgpd-notice p { margin: 0 0 16px !important; }
/* Checkbox supports both Drupal theme layouts:
 * input-wrapper + sibling label, OR input and label inside the same .ui-front.
 */
form.webform-submission-form .js-form-type-checkbox {
  display: grid !important;
  grid-template-columns: 20px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 0 18px !important;
}
form.webform-submission-form .js-form-type-checkbox > .ui-front {
  grid-column: 1;
  width: 20px !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 2px 0 0 !important;
}
form.webform-submission-form .js-form-type-checkbox:has(> .ui-front label) { display: block !important; }
form.webform-submission-form .js-form-type-checkbox > .ui-front:has(label) {
  display: grid !important;
  grid-template-columns: 20px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
form.webform-submission-form .js-form-type-checkbox label {
  grid-column: 2;
  display: block !important;
  position: static !important;
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--bpfas-text) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  writing-mode: horizontal-tb !important;
  text-transform: none !important;
  cursor: pointer;
}
form.webform-submission-form .js-form-type-checkbox input[type="checkbox"] { margin-top: 2px !important; }
form.webform-submission-form .js-form-type-checkbox .form-item--error-message { grid-column: 1 / -1; }
/* Display stays overridable by Drupal's inline #states visibility. */
form.webform-submission-form .form-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 22px;
  margin: 22px 0 0 !important;
  padding: 22px 0 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--bpfas-line) !important;
  background: transparent !important;
}
form.webform-submission-form .webform-legal-notice { flex: 1 1 320px; min-width: 0; font-size: 13px !important; line-height: 1.6; color: var(--bpfas-muted) !important; }
form.webform-submission-form a { color: var(--bpfas-text); text-decoration: underline; text-underline-offset: 3px; }
form.webform-submission-form .webform-submit-wrapper { display: flex; flex-wrap: wrap; flex: 0 0 auto; gap: 12px; width: auto; min-width: 0; margin: 0; overflow: visible; }
form.webform-submission-form .form-actions .webform-button--submit {
  display: inline-block;
  width: auto !important;
  min-width: 230px;
  min-height: 50px !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 14px 26px !important;
  border: 1px solid var(--bpfas-red) !important;
  border-radius: 999px !important;
  background: var(--bpfas-red) !important;
  color: #fff !important;
  font-family: inherit !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  text-align: center !important;
  text-transform: uppercase !important;
  white-space: normal;
  box-shadow: 0 5px 14px rgb(227 6 19 / 12%) !important;
  cursor: pointer;
}
form.webform-submission-form .webform-submit-wrapper::before, form.webform-submission-form .webform-submit-wrapper::after,
form.webform-submission-form .webform-button--submit::before, form.webform-submission-form .webform-button--submit::after { content: none !important; }
form.webform-submission-form .form-actions .webform-button--submit:hover { background: var(--bpfas-red-dark) !important; border-color: var(--bpfas-red-dark) !important; }
form.webform-submission-form .webform-button--submit:disabled { opacity: 0.6; cursor: not-allowed; }
form.webform-submission-form .select2-container { width: 100% !important; max-width: 100%; }
form.webform-submission-form .select2-selection--single { height: 50px !important; border: 1px solid var(--bpfas-border) !important; border-radius: 6px !important; background: var(--bpfas-field) !important; }
form.webform-submission-form .select2-selection--single .select2-selection__rendered { padding: 0 38px 0 14px !important; line-height: 48px !important; color: var(--bpfas-text) !important; font-family: inherit; font-size: 16px; }
form.webform-submission-form .select2-selection--single .select2-selection__arrow { height: 48px !important; right: 12px !important; }
form.webform-submission-form .select2-container--focus .select2-selection { outline: 3px solid var(--bpfas-focus); outline-offset: 3px; }
/* Theme-generated select controls (jQuery UI and Select2). */
form.webform-submission-form .ui-selectmenu-button,
form.webform-submission-form .select2-selection--single {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 50px !important;
  min-height: 50px !important;
  margin: 0 !important;
  padding: 12px 42px 12px 14px !important;
  border: 1px solid var(--bpfas-border) !important;
  border-radius: 6px !important;
  background-color: var(--bpfas-field) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23292929' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-position: right 14px center !important;
  background-repeat: no-repeat !important;
  background-size: 16px !important;
  color: var(--bpfas-text) !important;
  font-family: inherit !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 24px !important;
  text-align: left !important;
  text-transform: none !important;
  box-shadow: none !important;
  cursor: pointer;
}
form.webform-submission-form .ui-selectmenu-button .ui-selectmenu-text,
form.webform-submission-form .select2-selection--single .select2-selection__rendered {
  display: block !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--bpfas-text) !important;
  font-family: inherit !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 24px !important;
  text-transform: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
form.webform-submission-form .ui-selectmenu-button .ui-selectmenu-icon,
form.webform-submission-form .ui-selectmenu-button > .ui-icon,
form.webform-submission-form .select2-selection--single .select2-selection__arrow { display: none !important; }
form.webform-submission-form .ui-selectmenu-button::before,
form.webform-submission-form .ui-selectmenu-button::after,
form.webform-submission-form .select2-selection--single::before,
form.webform-submission-form .select2-selection--single::after { content: none !important; }
form.webform-submission-form .ui-selectmenu-button:focus-visible {
  outline: 3px solid var(--bpfas-focus) !important;
  outline-offset: 3px !important;
}
form.webform-submission-form .ui-selectmenu-button-open,
form.webform-submission-form .select2-container--open .select2-selection--single {
  border-color: var(--bpfas-focus) !important;
  background-color: #fff !important;
}
form.webform-submission-form .ui-selectmenu-button.ui-state-disabled,
form.webform-submission-form .select2-container--disabled .select2-selection--single { opacity: .6; cursor: not-allowed; }
/* Menus may be appended outside the form. The JS marks only this form's menus.
 * Existing widget positioning and open/closed display are deliberately preserved.
 */
.bpfas-dropdown-panel,
.bpfas-dropdown-list {
  color: #292929;
  font-family: "Noto Sans", Arial, Helvetica, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.45 !important;
}
.bpfas-dropdown-panel.select2-dropdown {
  border: 1px solid #858585 !important;
  border-radius: 6px !important;
  background: #fff !important;
  box-shadow: 0 10px 28px rgb(0 0 0 / 12%) !important;
}
.bpfas-dropdown-panel .ui-menu,
.bpfas-dropdown-panel .select2-results__options,
.bpfas-dropdown-list {
  box-sizing: border-box !important;
  max-height: 280px !important;
  margin: 0 !important;
  padding: 6px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  border: 1px solid #858585 !important;
  border-radius: 6px !important;
  background: #fff !important;
  list-style: none !important;
  box-shadow: 0 10px 28px rgb(0 0 0 / 12%) !important;
}
.bpfas-dropdown-panel .select2-results__options { border: 0 !important; box-shadow: none !important; }
.bpfas-dropdown-panel .ui-menu-item,
.bpfas-dropdown-list .ui-menu-item { margin: 0 !important; padding: 0 !important; border: 0 !important; }
.bpfas-dropdown-panel .ui-menu-item-wrapper,
.bpfas-dropdown-list .ui-menu-item-wrapper,
.bpfas-dropdown-panel .select2-results__option,
.bpfas-dropdown-list .select2-results__option {
  min-height: 44px;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: #292929 !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  white-space: normal !important;
  overflow-wrap: break-word;
  text-transform: none !important;
  cursor: pointer;
}
.bpfas-dropdown-panel .ui-menu-item-wrapper.ui-state-active,
.bpfas-dropdown-list .ui-menu-item-wrapper.ui-state-active,
.bpfas-dropdown-panel .select2-results__option--highlighted,
.bpfas-dropdown-list .select2-results__option--highlighted {
  background: #fff0f1 !important;
  color: #b8000b !important;
  box-shadow: inset 3px 0 #e30613;
}
.bpfas-dropdown-panel [role="option"][aria-selected="true"],
.bpfas-dropdown-list [role="option"][aria-selected="true"] { font-weight: 700 !important; }
.bpfas-dropdown-panel .ui-state-disabled,
.bpfas-dropdown-panel [aria-disabled="true"],
.bpfas-dropdown-list .ui-state-disabled,
.bpfas-dropdown-list [aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.bpfas-dropdown-panel .select2-search__field {
  box-sizing: border-box;
  width: 100% !important;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid #858585 !important;
  border-radius: 4px;
  font: inherit;
}

form.webform-submission-form .bpfas-live-status {
  position: absolute !important; width: 1px !important; height: 1px !important;
  padding: 0 !important; margin: -1px !important; overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important; clip-path: inset(50%) !important;
  white-space: nowrap !important; border: 0 !important;
}
@media (max-width: 640px) {
  form.webform-submission-form { width: calc(100% - 20px) !important; margin: 20px auto !important; padding: 24px 16px !important; border-radius: 12px !important; }
  form.webform-submission-form .bpfas-title { font-size: 29px !important; letter-spacing: -0.4px; }
  form.webform-submission-form .bpfas-section { padding: 18px 14px 2px !important; }
  form.webform-submission-form .bpfas-section > legend { font-size: 20px !important; }
  form.webform-submission-form .webform-flexbox { flex-direction: column !important; gap: 0 !important; }
  form.webform-submission-form .webform-flexbox > .webform-flex { flex: none !important; width: 100% !important; }
  form.webform-submission-form .webform-submit-wrapper { width: 100%; }
  form.webform-submission-form .form-actions .webform-button--submit { width: 100% !important; min-width: 0; }
}
@media (max-width: 420px) {
  form.webform-submission-form .client-type-choice .webform-options-display-side-by-side { grid-template-columns: 1fr !important; }
  form.webform-submission-form .client-type-choice :is(.js-form-type-radio, .form-type-radio) { min-height: 52px !important; }
  form.webform-submission-form .client-type-choice label.option { padding: 13px 0 !important; }
}
@media (forced-colors: active) {
  form.webform-submission-form .client-type-choice .is-selected { outline: 2px solid Highlight; }
  form.webform-submission-form .form-actions .webform-button--submit { border-color: ButtonText !important; }
}


/* Generic sections for forms without the original YAML class. */
form.webform-submission-form fieldset:not(.bpfas-section):not(.client-type-choice):not(.webform-composite-hidden-title):not(.fieldset--visually-hidden) {
  min-width: 0 !important;
  margin: 0 0 20px !important;
  padding: 22px 24px 6px !important;
  border: 1px solid var(--bpfas-line) !important;
  border-radius: 12px !important;
  background: #fff !important;
}
form.webform-submission-form fieldset:not(.bpfas-section):not(.client-type-choice):not(.webform-composite-hidden-title):not(.fieldset--visually-hidden) > legend {
  float: left !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 20px !important;
  padding: 0 0 0 12px !important;
  border: 0 !important;
  border-left: 3px solid var(--bpfas-red) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: var(--bpfas-text) !important;
}
form.webform-submission-form fieldset:not(.bpfas-section):not(.client-type-choice):not(.webform-composite-hidden-title):not(.fieldset--visually-hidden) > .fieldset-wrapper { clear: both; }
/* Make the special consent layout apply to any ordinary checkbox, rather than one machine name. */
form.webform-submission-form .js-form-type-checkbox { position: relative !important; }
/* PFAS original textarea is 50px. Keep that where present; long free-text on other forms must remain readable. */
form.webform-submission-form:not(:has(.bpfas-header)) textarea.form-textarea { height: auto !important; min-height: 96px !important; resize: vertical !important; }
@media (max-width:640px) {
  form.webform-submission-form fieldset:not(.bpfas-section):not(.client-type-choice):not(.webform-composite-hidden-title):not(.fieldset--visually-hidden) { padding: 18px 14px 2px !important; }
}

/* Keep original consent machine-name layout unchanged on the source form. */
/* Make the consent field and its inner wrapper full width. */
html body form.webform-submission-form
.form-item.js-form-type-checkbox.form-item-j_accepte_d_etre_contacte_par_veolia,
html body form.webform-submission-form
.form-item.js-form-type-checkbox.form-item-j_accepte_d_etre_contacte_par_veolia > .ui-front {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  grid-template-columns: none !important;
}

html body form.webform-submission-form
.form-item.js-form-type-checkbox.form-item-j_accepte_d_etre_contacte_par_veolia > .ui-front {
  margin: 0 !important;
  padding: 0 !important;
}

/* Position the checkbox beside its label. */
html body form.webform-submission-form
.form-item.js-form-type-checkbox.form-item-j_accepte_d_etre_contacte_par_veolia input[type="checkbox"] {
  position: absolute !important;
  inset: 2px auto auto 0 !important;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
}

html body form.webform-submission-form
.form-item.js-form-type-checkbox.form-item-j_accepte_d_etre_contacte_par_veolia label.option {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 0 0 0 32px !important;
  white-space: normal !important;
  word-break: normal !important;
}

/* Remove the theme's duplicate decorative checkbox. */
html body form.webform-submission-form
.form-item.js-form-type-checkbox.form-item-j_accepte_d_etre_contacte_par_veolia .checkbox-mark {
  display: none !important;
}

/* Let validation messages use the full width. */
html body form.webform-submission-form
.form-item.js-form-type-checkbox.form-item-j_accepte_d_etre_contacte_par_veolia > :not(.ui-front):not(input):not(label.option):not(.checkbox-mark),
html body form.webform-submission-form
.form-item.js-form-type-checkbox.form-item-j_accepte_d_etre_contacte_par_veolia > .ui-front > :not(input):not(label.option):not(.checkbox-mark) {
  position: static !important;
  float: none !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  writing-mode: horizontal-tb !important;
}


/* ============================================================================
   AJUSTEMENT FINAL — bouton Envoyer compact, mentions légales conservées.
   Compatible avec les formulaires simples et le formulaire PFAS initial.
   ============================================================================ */
form.webform-submission-form .form-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px 24px !important;
}
form.webform-submission-form .form-actions .webform-legal-notice {
  flex: 1 1 320px !important;
  min-width: 0 !important;
}
form.webform-submission-form .form-actions .webform-submit-wrapper {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 0 0 auto !important;
  padding: 0 !important;
}
form.webform-submission-form .form-actions .webform-button--submit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 180px !important;
  max-width: 100% !important;
  min-height: 48px !important;
  padding: 12px 28px !important;
  margin: 0 !important;
  border: 1px solid var(--bpfas-red, #e30613) !important;
  border-radius: 999px !important;
  background: var(--bpfas-red, #e30613) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
  text-align: center !important;
  text-transform: uppercase !important;
}
@media (max-width: 640px) {
  form.webform-submission-form .form-actions .webform-submit-wrapper {
    width: 100% !important;
    margin-left: 0 !important;
  }
  form.webform-submission-form .form-actions .webform-button--submit {
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* ==========================================
   VEOLIA — INDIVIDUAL CONSENT CHECKBOX FIX
   ========================================== */

/* Target standalone checkboxes, not checkbox groups */
form.webform-submission-form
.js-form-type-checkbox:not(.form-checkboxes .js-form-type-checkbox) {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  width: 100% !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  grid-template-columns: none !important;
}

/* Keep the checkbox wrapper inline with its label */
form.webform-submission-form
.js-form-type-checkbox:not(.form-checkboxes .js-form-type-checkbox) > .ui-front {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  grid-template-columns: none !important;
}

/* Restore native checkbox */
form.webform-submission-form
.js-form-type-checkbox:not(.form-checkboxes .js-form-type-checkbox)
input[type="checkbox"] {
  appearance: auto !important;
  position: static !important;
  flex: 0 0 20px !important;
  width: 20px !important;
  height: 20px !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  opacity: 1 !important;
  accent-color: #e30613 !important;
}

/* Remove the theme's duplicate decorative checkbox */
form.webform-submission-form
.js-form-type-checkbox:not(.form-checkboxes .js-form-type-checkbox)
.checkbox-mark {
  display: none !important;
}

/* Align label correctly */
form.webform-submission-form
.js-form-type-checkbox:not(.form-checkboxes .js-form-type-checkbox)
label.option {
  display: block !important;
  position: static !important;
  flex: 1 1 auto !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.5 !important;
  white-space: normal !important;
}

/* ============================================
   VEOLIA WEBFORM — CHECKBOX GROUP FIX
   ============================================ */

/* Preserve the layout of Drupal checkbox groups */
form.webform-submission-form .form-checkboxes {
  width: 100% !important;
}

/* Fix individual options inside checkbox groups */
form.webform-submission-form
.form-checkboxes .js-form-type-checkbox {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  grid-template-columns: none !important;
}

/* Keep checkbox wrapper properly positioned */
form.webform-submission-form
.form-checkboxes .js-form-type-checkbox > .ui-front {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  grid-template-columns: none !important;
}

/* Consistent native checkbox appearance */
form.webform-submission-form
.form-checkboxes input[type="checkbox"] {
  position: absolute !important;
  top: 3px !important;
  left: 0 !important;
  inset: 3px auto auto 0 !important;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  appearance: auto !important;
  accent-color: #e30613 !important;
  opacity: 1 !important;
}

/* Align conference description with checkbox */
form.webform-submission-form
.form-checkboxes label.option {
  display: block !important;
  position: relative !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 0 0 36px !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
}

/* Remove duplicated decorative checkboxes */
form.webform-submission-form
.form-checkboxes .checkbox-mark {
  display: none !important;
}

/* Prevent styling from breaking existing columns */
form.webform-submission-form
.form-checkboxes .webform-flexbox {
  align-items: flex-start !important;
}

/* Mobile adjustments */
@media (max-width: 640px) {
  form.webform-submission-form
  .form-checkboxes .webform-flexbox {
    flex-direction: column !important;
  }
}


/* ========================================================================
   VEOLIA WEBFORMS — CORRECTIF MISE EN PAGE v1.1 | Octobre 2026
   Champs alignés + intitulés et dates des cases à cocher.
   Ne modifie ni la validation ni les données de soumission.
   ======================================================================== */

/* 1. Chaque colonne Webform occupe la même largeur et peut rétrécir proprement. */
form.webform-submission-form .webform-flexbox {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 20px !important;
  align-items: stretch !important;
}
form.webform-submission-form .webform-flexbox > .webform-flex {
  flex: 1 1 0 !important;
  width: 0 !important;
  max-width: none !important;
  min-width: 0 !important;
}
form.webform-submission-form .webform-flexbox > .webform-flex > .webform-flex--container,
form.webform-submission-form .webform-flex--container > .form-item,
form.webform-submission-form .webform-flex--container > .form-wrapper,
form.webform-submission-form .webform-flexbox .form-item {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}
form.webform-submission-form .webform-flexbox input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]),
form.webform-submission-form .webform-flexbox select,
form.webform-submission-form .webform-flexbox textarea,
form.webform-submission-form .webform-flexbox .ui-selectmenu-button,
form.webform-submission-form .webform-flexbox .select2-container,
form.webform-submission-form .webform-flexbox .select2-selection--single {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
form.webform-submission-form .webform-flexbox .ui-selectmenu-button,
form.webform-submission-form .webform-flexbox .select2-selection--single {
  display: flex !important;
  align-items: center !important;
}

/* 2. Ne pas utiliser les CSS génériques de colonnes pour les options. 
      La colonne reste une colonne; chaque option garde ses textes ensemble. */
form.webform-submission-form .form-checkboxes .js-form-type-checkbox,
form.webform-submission-form .form-checkboxes .form-type-checkbox {
  clear: both !important;
  float: none !important;
  break-inside: avoid !important;
  page-break-inside: avoid !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
form.webform-submission-form .form-checkboxes label.option,
form.webform-submission-form .form-checkboxes label.option :is(span, strong, em, small, div, p),
form.webform-submission-form .form-checkboxes .description,
form.webform-submission-form .form-checkboxes .webform-element-description {
  float: none !important;
  clear: none !important;
  max-width: 100% !important;
  min-width: 0 !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
}
form.webform-submission-form .form-checkboxes label.option :is(div, p),
form.webform-submission-form .form-checkboxes label.option > span {
  display: block !important;
  width: auto !important;
}
form.webform-submission-form .form-checkboxes label.option em,
form.webform-submission-form .form-checkboxes label.option i {
  font-style: italic;
}
/* If the date is markup *inside the option*, keep it beneath its title. */
form.webform-submission-form .form-checkboxes label.option :is(.date, .conference-date, .session-date, .event-date, time) {
  display: block !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
  position: static !important;
  width: auto !important;
}

/* 3. Smaller viewports: field pairs stack in reading order. */
@media (max-width: 700px) {
  form.webform-submission-form .webform-flexbox {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
  }
  form.webform-submission-form .webform-flexbox > .webform-flex {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}


/* ======================================================================
   VEOLIA WEBFORM v1.2 — CORRECTIONS STRUCTURELLES
   Ne change pas les champs, les valeurs ni les règles de soumission.
   ====================================================================== */

/* 1. Champs de toute flexbox Drupal: supprimer les limites de largeur
      héritées du thème, y compris sur les wrappers internes. */
form.webform-submission-form .webform-flexbox > .webform-flex {
  flex: 1 1 0% !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
}
form.webform-submission-form .webform-flexbox > .webform-flex > .webform-flex--container,
form.webform-submission-form .webform-flexbox .webform-flex--container,
form.webform-submission-form .webform-flexbox .form-item,
form.webform-submission-form .webform-flexbox .form-element,
form.webform-submission-form .webform-flexbox .ui-front,
form.webform-submission-form .webform-flexbox .form-item > div:not(.form-item--error-message) {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}
form.webform-submission-form .webform-flexbox :is(input.form-text, input.form-email, input[type="email"], input[type="text"], select.form-select, select, .ui-selectmenu-button, .select2-container, .select2-selection--single) {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
/* Certains thèmes encapsulent select dans .ui-front et dessinent une seconde bordure. */
form.webform-submission-form .webform-flexbox .ui-front:has(> select),
form.webform-submission-form .webform-flexbox .ui-front:has(> .ui-selectmenu-button) {
  box-sizing: border-box !important;
  border: 0 !important;
  padding: 0 !important;
}

/* 2. Groupes de conférences : interdire la coupure d'une option entre
      deux colonnes ou deux pages, y compris dans les wrappers Drupal. */
form.webform-submission-form .form-checkboxes :is(.form-item, .js-form-type-checkbox, .form-type-checkbox),
form.webform-submission-form .webform-options-display-two-columns :is(.form-item, .js-form-type-checkbox, .form-type-checkbox),
form.webform-submission-form .webform-options-display-three-columns :is(.form-item, .js-form-type-checkbox, .form-type-checkbox) {
  break-inside: avoid-column !important;
  page-break-inside: avoid !important;
  -webkit-column-break-inside: avoid !important;
  display: flow-root !important;
  clear: none !important;
  float: none !important;
  overflow: visible !important;
}
/* Alignement de la case et du contenu sans détacher les dates incluses
      dans le libellé. Ne toucher ni aux textes ni aux liens HTML. */
form.webform-submission-form .form-checkboxes .js-form-type-checkbox,
form.webform-submission-form .form-checkboxes .form-type-checkbox {
  position: relative !important;
  padding-left: 0 !important;
  margin-bottom: 20px !important;
}
form.webform-submission-form .form-checkboxes .js-form-type-checkbox label.option,
form.webform-submission-form .form-checkboxes .form-type-checkbox label.option {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  padding-left: 36px !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}
form.webform-submission-form .form-checkboxes .js-form-type-checkbox label.option :is(em, i, time, .date, .conference-date, .session-date, .event-date) {
  position: static !important;
  float: none !important;
}

/* 3. Correction ciblée si le groupe utilise les colonnes CSS du module
      Webform. L'option entière doit être un bloc insécable. */
form.webform-submission-form :is(.webform-options-display-two-columns, .webform-options-display-three-columns) {
  column-fill: balance !important;
}

@media (max-width: 700px) {
  form.webform-submission-form .webform-flexbox {
    flex-direction: column !important;
  }
  form.webform-submission-form .webform-flexbox > .webform-flex {
    width: 100% !important;
    flex: 0 0 auto !important;
  }
  form.webform-submission-form :is(.webform-options-display-two-columns, .webform-options-display-three-columns) {
    column-count: 1 !important;
  }
}
