/* MILOBRAS Passport: scoped presentation for the existing CF7 form.
 * Native page title, field nodes, metadata, feedback and submit handlers stay owned
 * by the theme/CF7. No status column is reserved beside the detail fields.
 */
html body.mb-passport-page .AreaPage > .pagespan {
  box-sizing: border-box !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 22px 24px 20px !important;
  overflow: visible !important;
}

html body.mb-passport-page .pagespan [hidden] {
  display: none !important;
}

/* Align the native title/form wrappers with the introduction on both breakpoints. */
html body.page.mb-passport-page .AreaPage > .pagespan > header.page-title,
html body.page.mb-passport-page .AreaPage > .pagespan > .wpcf7 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

html body.page.mb-passport-page .mb-p-intro a:is([href*="/pedido-de-orcamento/"], [href*="/request-a-quote/"]) {
  font-weight: 700 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
}

html body.mb-passport-page .pagespan .mb-p-intro {
  margin: 0 !important;
  padding: 0 0 20px !important;
  font-size: 13px !important;
  line-height: 21px !important;
}

html body.mb-passport-page .pagespan .mb-p-intro p {
  margin: 0 0 9px !important;
  padding: 0 !important;
}

html body.mb-passport-page .pagespan .mb-p-intro p.mb-p-lead {
  font-size: 15px !important;
  line-height: 23px !important;
  font-weight: 700 !important;
}

html body.mb-passport-page .pagespan .mb-p-intro :is(.mb-p-required-note, .mb-p-required) {
  margin: 13px 0 0 !important;
  color: #5f695a !important;
  font-size: 12px !important;
  line-height: 19px !important;
}

html body.mb-passport-page .pagespan > .wpcf7 {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form {
  --mb-p-control-height: 34px;
  --mb-p-green: #86d500;
  --mb-p-field-border: var(--milobras-content-frame-color, #e4e4e4);
  --mb-p-input-border: #d6d6d6;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 19px 0 0 !important;
  border: 0 !important;
  border-top: 2px solid var(--mb-p-green) !important;
  background: transparent !important;
  overflow: visible !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-passport,
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-fields,
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-section + .mb-p-section {
  margin-top: 22px !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-section {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form h2.mb-p-title,
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review > h2,
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review-section h3.mb-p-title {
  display: block !important;
  margin: 0 0 2px !important;
  padding: 0 !important;
  color: #333f4c !important;
  font-family: "Roboto Condensed", Arial, sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 25px !important;
  text-transform: uppercase !important;
  letter-spacing: normal !important;
  border: 0 !important;
  background: transparent !important;
}

/* Compact the heading-to-field gap without changing spacing between fields. */
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-fields h2.mb-p-title {
  margin-bottom: 0 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-row {
  display: block !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form label.mb-p-field {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 5px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #333f4c !important;
  font-family: Roboto, Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 19px !important;
  text-align: left !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-label {
  display: block !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 19px !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-row:has(input[name="Area"]) .mb-p-label,
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-row[data-field="area"] .mb-p-label {
  white-space: nowrap !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > input:not([type="hidden"]):not([type="file"]):not([type="submit"]),
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > select,
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > textarea {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 5px 10px !important;
  color: #333f4c !important;
  background: #fff !important;
  background-image: none !important;
  border: 1px solid var(--mb-p-input-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-family: Roboto, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 21px !important;
  text-align: left !important;
  text-indent: 0 !important;
  letter-spacing: normal !important;
  transform: none !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > input:not([type="hidden"]):not([type="file"]):not([type="submit"]),
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > select {
  height: var(--mb-p-control-height) !important;
  min-height: var(--mb-p-control-height) !important;
  max-height: var(--mb-p-control-height) !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > input:not([type="hidden"]):not([type="file"]):not([type="submit"]) {
  -webkit-appearance: none !important;
  appearance: none !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > select {
  /* The element remains a native select; its icon has a consistent right inset. */
  -webkit-appearance: none !important;
  appearance: none !important;
  padding-right: 24px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='16' viewBox='0 0 12 16' fill='none' stroke='%23333f4c' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6 6 3 9 6M3 10 6 13 9 10'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-size: 12px 16px !important;
  font-size: 14px !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form label.mb-p-message > span.wpcf7-form-control-wrap > textarea {
  height: 190px !important;
  min-height: 190px !important;
  max-height: none !important;
  padding: 10px !important;
  resize: vertical !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-pair {
  display: grid !important;
  align-items: start !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form label.mb-p-attach {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  position: relative !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  height: var(--mb-p-control-height) !important;
  min-height: var(--mb-p-control-height) !important;
  max-height: var(--mb-p-control-height) !important;
  margin: 4px 0 0 !important;
  padding: 5px 10px !important;
  border: 1px solid var(--mb-p-input-border) !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: #333f4c !important;
  font-family: Roboto, Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-attach > svg {
  display: block !important;
  flex: 0 0 21px !important;
  width: 21px !important;
  height: 21px !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-attach-copy {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-attach-copy :is(strong, small) {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 20px !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-attach-copy strong {
  font-size: 13px !important;
  font-weight: 700 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-attach-copy small {
  color: #66715f !important;
  font-size: 11px !important;
  font-weight: 400 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-attach > span.wpcf7-form-control-wrap,
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-attach > span.wpcf7-form-control-wrap > input[type="file"] {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-attach > span.wpcf7-form-control-wrap > input[type="file"] {
  opacity: 0 !important;
  z-index: 1 !important;
}

/* Keep the clickable upload area compact, with error text in a natural second row. */
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form label.mb-p-attach:has(:is(.wpcf7-not-valid-tip, .mb-p-inline-error)) {
  display: grid !important;
  grid-template-columns: 21px minmax(0, 1fr) !important;
  grid-template-rows: var(--mb-p-control-height) auto !important;
  gap: 4px 10px !important;
  height: auto !important;
  min-height: var(--mb-p-control-height) !important;
  max-height: none !important;
  margin-bottom: 0 !important;
  padding: 0 10px !important;
  border: 0 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form label.mb-p-attach:has(:is(.wpcf7-not-valid-tip, .mb-p-inline-error))::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  box-sizing: border-box;
  height: var(--mb-p-control-height);
  border: 2px solid #86d500;
  pointer-events: none;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form label.mb-p-attach:has(:is(.wpcf7-not-valid-tip, .mb-p-inline-error)) > :is(svg, .mb-p-attach-copy) {
  grid-row: 1 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form label.mb-p-attach:has(:is(.wpcf7-not-valid-tip, .mb-p-inline-error)) > span.wpcf7-form-control-wrap {
  display: contents !important;
  position: static !important;
  inset: auto !important;
  height: auto !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form label.mb-p-attach:has(:is(.wpcf7-not-valid-tip, .mb-p-inline-error)) > span.wpcf7-form-control-wrap > input[type="file"] {
  inset: 0 0 auto !important;
  height: var(--mb-p-control-height) !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form label.mb-p-attach > span.wpcf7-form-control-wrap > :is(.wpcf7-not-valid-tip, .mb-p-inline-error) {
  display: block !important;
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  position: static !important;
  inset: auto !important;
  margin: 0 !important;
  white-space: normal !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-file-name {
  margin: 0 !important;
  color: #5f6d54 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
  overflow-wrap: anywhere !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-file-name:empty {
  display: none !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-progress {
  margin: auto 0 0 !important;
  padding: 23px 0 0 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-progress > :first-child {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 3px 12px !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  color: #65705f !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 18px !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-progress > .mb-p-progress-track {
  display: block !important;
  height: 4px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #e8ebe4 !important;
  /* One segment per required field; the native fill ratio stays exact. */
  --mb-p-progress-segments: 10;
  -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 3px), transparent 0);
  mask-image: linear-gradient(to right, #000 calc(100% - 3px), transparent 0);
  -webkit-mask-size: calc((100% + 3px) / var(--mb-p-progress-segments)) 100%;
  mask-size: calc((100% + 3px) / var(--mb-p-progress-segments)) 100%;
  -webkit-mask-repeat: repeat-x;
  mask-repeat: repeat-x;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-progress > .mb-p-progress-track[aria-valuemax="6"] {
  --mb-p-progress-segments: 6;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-progress > .mb-p-progress-track > span {
  display: block !important;
  flex: none !important;
  width: 0;
  height: 4px !important;
  min-width: 0 !important;
  margin: 0 !important;
  background: var(--mb-p-green) !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form button.mb-p-review-button,
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-actions > input.wpcf7-submit[type="submit"] {
  display: block !important;
  position: relative !important;
  float: none !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: none !important;
  margin: 15px 0 0 !important;
  padding: 8px 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--mb-p-green) !important;
  color: #283414 !important;
  box-shadow: none !important;
  font-family: Roboto, Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 22px !important;
  text-align: center !important;
  text-indent: 0 !important;
  text-transform: uppercase !important;
  transform: none !important;
  cursor: pointer !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review > p.mb-p-review-intro {
  margin: 7px 0 0 !important;
  padding: 0 !important;
  font-size: 13px !important;
  line-height: 21px !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review-list {
  margin: 0 !important;
  padding: 0 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review-section {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  column-gap: 12px !important;
  row-gap: 10px !important;
  align-items: start !important;
  margin: 0 !important;
  padding: 19px 0 !important;
  border-bottom: 1px solid var(--mb-p-field-border) !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review-section > div {
  grid-column: 1 !important;
  min-width: 0 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review-section h3.mb-p-title {
  margin-bottom: 11px !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review-section dl {
  display: grid !important;
  gap: 9px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review-section dl > div {
  display: grid !important;
  grid-template-columns: 130px minmax(0, 1fr) !important;
  gap: 10px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 13px !important;
  line-height: 20px !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review-section dt {
  margin: 0 !important;
  color: #333f4c !important;
  font-weight: 600 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review-section dd {
  min-width: 0 !important;
  margin: 0 !important;
  white-space: pre-wrap !important;
  overflow-wrap: anywhere !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form button.mb-p-edit,
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form button.mb-p-back {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 8px 12px !important;
  color: #333f4c !important;
  background: #fff !important;
  border: 1px solid var(--mb-p-input-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-family: Roboto, Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  cursor: pointer !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form button.mb-p-edit {
  grid-column: 2 !important;
  grid-row: 1 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review > p.mb-p-notice {
  box-sizing: border-box !important;
  margin: 22px 0 0 !important;
  padding: 14px 16px !important;
  color: #333f4c !important;
  border: 0 !important;
  border-left: 2px solid var(--mb-p-green) !important;
  background: #edf2e6 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 22px !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-actions {
  display: flex !important;
  position: relative !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: auto 0 0 !important;
  padding: 23px 0 0 !important;
  border: 0 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-actions > input.wpcf7-submit[type="submit"] {
  flex: 1 1 220px !important;
  width: auto !important;
  margin: 0 !important;
  inset: auto !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-actions > :is(button.mb-p-back, input.wpcf7-submit[type="submit"]) {
  box-sizing: border-box !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  line-height: 22px !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form.milobras-submit-locked .mb-p-actions > input.wpcf7-submit[type="submit"] {
  padding-right: 34px !important;
  cursor: wait !important;
}

/* The existing submit lock owns the visible spinner; the native hidden span
 * must not reserve an extra flex gap or row beside the two final actions. */
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-actions > .wpcf7-spinner {
  display: none !important;
}

/* The final submit is the last action on desktop and mobile. */
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-actions > .milobras-submit-indicator {
  top: auto !important;
  bottom: 15px !important;
  margin: 0 !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-actions > button.mb-p-back {
  background: transparent !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form :is(button.mb-p-review-button, button.mb-p-edit, button.mb-p-back, input.wpcf7-submit):focus-visible {
  outline: 2px solid #86d500 !important;
  outline-offset: 2px !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > :is(input, select, textarea)[aria-invalid="true"],
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > .wpcf7-not-valid,
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > input:not([type="hidden"]):not([type="file"]):not([type="submit"]):is([aria-invalid="true"], .wpcf7-not-valid),
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-attach:has(input[aria-invalid="true"]) {
  border-color: var(--mb-p-input-border) !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form :is(.wpcf7-not-valid-tip, .mb-p-inline-error) {
  display: block !important;
  margin: 4px 0 0 !important;
  color: #3f6600 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  font-style: normal !important;
  line-height: 18px !important;
  white-space: normal !important;
}

/* These selectors must outrank the component display rules, including submit. */
html body.mb-passport-page .pagespan .wpcf7 form.wpcf7-form.mb-passport-form .mb-passport [hidden],
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-passport[hidden],
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-actions > input.wpcf7-submit[type="submit"][hidden] {
  display: none !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form > .wpcf7-response-output {
  box-sizing: border-box !important;
  margin: 14px 0 0 !important;
  font-size: 13px !important;
  line-height: 21px !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form.invalid > .wpcf7-response-output {
  display: none !important;
}

html body.mb-passport-page .pagespan .wpcf7 > .screen-reader-response {
  position: absolute !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  border: 0 !important;
  white-space: nowrap !important;
}

/* The approved success dialog belongs to this component; no old confirmation
 * overlay, language detector or timer-based copy patches are loaded here. */
html body.mb-passport-page .swal2-popup {
  border: 1px solid var(--mb-p-field-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.12) !important;
  color: #333f4c !important;
}
html body.mb-passport-page :is(.swal2-title, .swal2-html-container) {
  color: #333f4c !important;
}
html body.mb-passport-page .swal2-actions .swal2-styled {
  border-radius: 6px !important;
  box-shadow: none !important;
  font-weight: 700 !important;
}
html body.mb-passport-page .swal2-actions .swal2-confirm {
  background: #86d500 !important;
  border: 2px solid #86d500 !important;
  color: #fff !important;
}

/* Reuse native columns and frames; stretch their containers, not their contents. */
@media (min-width: 768px) {
  html body.page.mb-passport-page .container.sidebar > .row.base-mobile-2.base-desktop-2 {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
  }

  html body.page.mb-passport-page .container.sidebar > .row.base-mobile-2.base-desktop-2 > div {
    display: flex !important;
    flex-direction: column !important;
    flex: 0 0 auto !important;
    align-self: stretch !important;
    float: none !important;
    min-width: 0 !important;
  }

  html body.mb-passport-page .container.sidebar > .row.base-mobile-2.base-desktop-2 > div > .AreaPage,
  html body.mb-passport-page .container.sidebar > .row.base-mobile-2.base-desktop-2 > div > .AreaSpot.AreaspotTOP,
  html body.mb-passport-page .container.sidebar > .row.base-mobile-2.base-desktop-2 .AreaPage > .pagespan,
  html body.mb-passport-page .container.sidebar > .row.base-mobile-2.base-desktop-2 .AreaspotTOP > .SideGoals {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }

  html body.mb-passport-page .container.sidebar > .row.base-mobile-2.base-desktop-2 .SideGoals {
    margin-top: 0 !important;
  }

  html body.mb-passport-page .container.sidebar > .row.base-mobile-2.base-desktop-2 .SideGoals > .widget {
    flex: 1 1 auto !important;
    box-sizing: border-box !important;
    height: auto !important;
    min-height: 0 !important;
  }

  html body.mb-passport-page .container.sidebar > .row.base-mobile-2.base-desktop-2 .pagespan > .wpcf7,
  html body.mb-passport-page .container.sidebar > .row.base-mobile-2.base-desktop-2 .pagespan form.wpcf7-form.mb-passport-form {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
  }

  html body.page.mb-passport-page .container.sidebar > .row:has(> .AreaTestemunhos):has(> .AreaMapa) {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
  }

  html body.page.mb-passport-page .container.sidebar > .row > :is(.AreaSpot.AreaTestemunhos, .AreaSpot.AreaMapa) {
    display: flex !important;
    flex-direction: column !important;
    flex: 0 0 auto !important;
    align-self: stretch !important;
    min-width: 0 !important;
    float: none !important;
  }

  html body.mb-passport-page .container.sidebar > .row > .AreaTestemunhos > .SideTestemunhos,
  html body.mb-passport-page .container.sidebar > .row > .AreaMapa > .Sidemapa {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    float: none !important;
  }

  html body.mb-passport-page .container.sidebar > .row > .AreaTestemunhos > .SideTestemunhos > .widget,
  html body.mb-passport-page .container.sidebar > .row > .AreaMapa > .Sidemapa > .widget {
    flex: 1 1 auto !important;
    height: auto !important;
    min-height: 0 !important;
  }
}

/* The native col-sm-12 classes stack here; Passport uses the approved 2:1 pair. */
@media (min-width: 768px) and (max-width: 1023px) {
  html body.page.mb-passport-page .container.sidebar > .row.base-mobile-2.base-desktop-2 > div:first-child,
  html body.page.mb-passport-page .container.sidebar > .row > .AreaSpot.AreaTestemunhos {
    width: 66.66666667% !important;
  }

  html body.page.mb-passport-page .container.sidebar > .row.base-mobile-2.base-desktop-2 > div:nth-child(2),
  html body.page.mb-passport-page .container.sidebar > .row > .AreaSpot.AreaMapa {
    width: 33.33333333% !important;
  }
}

html body.mb-passport-page .container.sidebar .SideGoals .textwidget :is(#NumeroOrcamento, #NumeroClientes) {
  display: grid !important;
  place-items: center !important;
  box-sizing: border-box !important;
  width: min(220px, 100%) !important;
  min-width: 0 !important;
  max-width: 220px !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: 1 / 1 !important;
  flex-shrink: 0 !important;
  line-height: 1 !important;
}

@media (min-width: 1024px) {
  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-row > label.mb-p-field {
    grid-template-columns: 214px minmax(0, 1fr) !important;
    align-items: center !important;
    column-gap: 12px !important;
  }

  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review-section dl > div {
    grid-template-columns: 214px minmax(0, 1fr) !important;
    column-gap: 12px !important;
  }

  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review-section dt {
    white-space: nowrap !important;
  }
}

@media (max-width: 1023px) {
  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-contacts > .mb-p-pair {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-row > label.mb-p-field {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 5px !important;
  }

  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review-section dl > div {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 2px !important;
  }
}

@media (max-width: 767px) {
  html body.mb-passport-page .AreaPage > .pagespan {
    padding: 18px 14px 20px !important;
  }

  html body.page.mb-passport-page .container.sidebar > .row.base-mobile-2.base-desktop-2 .AreaPage > .pagespan {
    padding-bottom: 20px !important;
  }

  html body.mb-passport-page .pagespan .mb-p-intro {
    padding-bottom: 14px !important;
    font-size: 14px !important;
    line-height: 22px !important;
  }

  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form {
    --mb-p-control-height: 36px;
    padding-top: 14px !important;
  }

  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form button.mb-p-review-button {
    height: 40px !important;
    min-height: 40px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    line-height: 22px !important;
  }

  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > input:not([type="hidden"]):not([type="file"]):not([type="submit"]),
  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > textarea {
    font-size: var(--mb-p-mobile-field-font, 15px) !important;
  }

  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > input:not([type="hidden"]):not([type="file"]):not([type="submit"]),
  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > select {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }

  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > select {
    font-size: var(--mb-p-mobile-field-font, 15px) !important;
  }

  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form label.mb-p-message > span.wpcf7-form-control-wrap > textarea {
    height: 210px !important;
    min-height: 210px !important;
  }

  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form label.mb-p-attach {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }

  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-progress {
    margin-top: 0 !important;
    padding-top: 26px !important;
  }

  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review-section {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
  }

  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form button.mb-p-edit {
    grid-column: 1 !important;
    grid-row: auto !important;
    justify-self: start !important;
  }

  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-actions > :is(button.mb-p-back, input.wpcf7-submit[type="submit"]) {
    flex: 1 1 100% !important;
    width: 100% !important;
  }

  html body.mb-passport-page .container.sidebar > .row.base-mobile-2.base-desktop-2 .SideGoals > .widget {
    height: auto !important;
    min-height: 0 !important;
  }
}

/* Use the site's typography layer so its important mobile heading rule can be
 * refined for these form sections without changing headings elsewhere. */
@layer milobras-mobile-typography {
  @media (max-width: 767px) {
    html body.page.mb-passport-page .AreaPage .pagespan form.wpcf7-form.mb-passport-form .mb-p-review > h2 {
      font-size: 15px !important;
    }
    html body.page.mb-passport-page .AreaPage .pagespan form.wpcf7-form.mb-passport-form .mb-p-review-section h3.mb-p-title {
      font-size: 15px !important;
    }
    html body.page.mb-passport-page .AreaPage .pagespan form.wpcf7-form.mb-passport-form .mb-p-fields h2.mb-p-title {
      font-size: 15px !important;
      line-height: 24px !important;
      margin-bottom: 3px !important;
    }
  }
}

/* A readable value for long renovation types, over the same native select. */
html body.page.mb-passport-page form.mb-passport-form .mb-p-native-select-value {
  display: none !important;
}
@media (max-width: 767px) {
  html body.page.mb-passport-page form.mb-passport-form .mb-p-field > .wpcf7-form-control-wrap.mb-p-native-select-label {
    position: relative !important;
  }
  html body.page.mb-passport-page form.mb-passport-form .mb-p-field > .mb-p-native-select-label > select {
    opacity: 0 !important;
    font-size: var(--mb-p-mobile-field-font, 15px) !important;
    cursor: pointer;
  }
  html body.page.mb-passport-page form.mb-passport-form .mb-p-native-select-label > .mb-p-native-select-value {
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
    position: absolute !important;
    inset: 0 !important;
    height: var(--mb-p-control-height) !important;
    padding: 1px 24px 1px 10px !important;
    pointer-events: none !important;
    border: 1px solid var(--mb-p-input-border) !important;
    border-radius: 0 !important;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='16' viewBox='0 0 12 16' fill='none' stroke='%23333f4c' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6 6 3 9 6M3 10 6 13 9 10'/%3E%3C/svg%3E") no-repeat right 8px center / 12px 16px !important;
    color: #333f4c !important;
    font-family: Roboto, Arial, sans-serif !important;
    font-size: var(--mb-p-mobile-field-font, 15px) !important;
    font-weight: 400 !important;
    line-height: 16px !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    text-align: left !important;
    text-indent: 0 !important;
  }
  html body.page.mb-passport-page form.mb-passport-form .mb-p-native-select-label:has(select:focus) > .mb-p-native-select-value {
    outline: 0 !important;
    outline-offset: 0 !important;
    background-color: #fff !important;
    -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, .18) !important;
    box-shadow: 0 0 6px rgba(0, 0, 0, .18) !important;
  }
  html body.page.mb-passport-page form.mb-passport-form .mb-p-native-select-label:has(select:is([aria-invalid="true"], .wpcf7-not-valid)) > .mb-p-native-select-value {
    border-color: var(--mb-p-input-border) !important;
  }
}

/* Match the counter circles to the existing green form divider on these pages. */
html body.mb-passport-page .AreaSpot .SideGoals #NumeroOrcamento,
html body.mb-passport-page .AreaSpot .SideGoals #NumeroClientes {
  border-width: 2px !important;
  border-style: solid !important;
  border-color: #86d500 !important;
}

/* Compact section headings in fields and review at every viewport. */
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review > h2,
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-fields h2.mb-p-title,
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-review-section h3.mb-p-title {
  font-size: 15px !important;
}

/* Neutral secondary styling for the edit action. */
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form button.mb-p-edit,
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form button.mb-p-edit:is(:hover, :focus, :active) {
  color: #333f4c !important;
  border-color: #d6d6d6 !important;
  border-width: 2px !important;
  background: #fff !important;
}
/* Soft field focus: retain the normal contour without a second outer frame. */
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > :is(input, select, textarea):focus,
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-field > span.wpcf7-form-control-wrap > input:not([type="hidden"]):not([type="file"]):not([type="submit"]):focus {
  outline: 0 !important;
  outline-offset: 0 !important;
  background-color: #fff !important;
  -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, .18) !important;
  box-shadow: 0 0 6px rgba(0, 0, 0, .18) !important;
}

html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-attach:focus-within {
  outline: 0 !important;
  outline-offset: 0 !important;
  box-shadow: none !important;
}

/* Page and original surrounding block headings, per the owner's size table. */
html body.page.mb-passport-page .AreaPage > .pagespan > header.page-title > h1 {
  font-size: 18px !important;
  line-height: 30px !important;
}
html body.page.mb-passport-page .AreaSpot .SideGoals h2,
html body.page.mb-passport-page .AreaTestemunhos h2,
html body.page.mb-passport-page .AreaMapa h2 {
  font-size: 18px !important;
  line-height: 20px !important;
}
@layer milobras-mobile-typography {
  @media (max-width: 767px) {
    html body.page.mb-passport-page .AreaPage > .pagespan > header.page-title > h1,
    html body.page.mb-passport-page .AreaSpot .SideGoals h2,
    html body.page.mb-passport-page .AreaTestemunhos h2,
    html body.page.mb-passport-page .AreaMapa h2 {
      font-size: 18px !important;
      line-height: 30px !important;
    }
  }
}

/* Extend only the requested work/subject fields left; phone geometry stays intact. */
@media (min-width: 768px) {
  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-p-row > label.mb-p-field > span.wpcf7-form-control-wrap {
    width: calc(100% + 12px) !important;
    margin-left: -12px !important;
  }
}

/* Empty choices are quieter; selected values keep their original contrast. */
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form select:has(> option:checked[value=""]),
html body.page.mb-passport-page form.mb-passport-form .mb-p-native-select-label:has(> select > option:checked[value=""]) > .mb-p-native-select-value {
  color: #879098 !important;
}
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form select > option {
  color: #333f4c !important;
}
html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form select > option[value=""] {
  color: #879098 !important;
}

/* Native half-pixel grey contours share the live content-frame palette. */
@media (max-width: 767px) {
  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form .mb-passport {
    --mb-p-field-border: var(--milobras-content-frame-color, #e4e4e4);
  }
}

/* Smaller editable text only on narrow phone viewports. */
@media (max-width: 375px) {
  html body.mb-passport-page .pagespan form.wpcf7-form.mb-passport-form {
    --mb-p-mobile-field-font: 14px;
  }
  html body.page.mb-passport-page form.mb-passport-form .mb-p-native-select-label > .mb-p-native-select-value {
    padding-left: 6px !important;
    padding-right: 20px !important;
  }
}
