.ylf-form {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin-block: 24px;
  padding: clamp(16px, 4vw, 32px);
  border: 1px solid var(--ylf-border, #cbdce5);
  border-radius: var(--ylf-radius, 8px);
  color: var(--ylf-text, #163b50);
  background: var(--ylf-background, #fff);
  font-family: inherit;
  font-size: var(--ylf-font-size, 16px);
  line-height: 1.7;
  text-align: start;
  container-type: inline-size;
}
.ylf-form *, .ylf-form *::before, .ylf-form *::after { box-sizing: border-box; }
.ylf-form [hidden] { display: none !important; }
.ylf-form .ylf-title { margin: 0 0 var(--ylf-gap, 16px); color: inherit; font: inherit; font-weight: 700; font-size: 1.3em; }
.ylf-form .ylf-fields { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--ylf-gap, 16px); column-gap: min(var(--ylf-gap, 16px), 2%); }
.ylf-form .ylf-field { --ylf-field-span: var(--ylf-default-span, 12); grid-column: span var(--ylf-field-span); min-width: 0; margin: 0; }
.ylf-form .ylf-label { display: block; margin-block-end: 6px; font-weight: 600; overflow-wrap: anywhere; }
.ylf-form label { display: block; color: inherit; font: inherit; margin: 0; }
.ylf-form input:not([type="checkbox"]), .ylf-form select, .ylf-form textarea {
  width: 100%; min-width: 0; min-height: 44px; margin: 0; padding: 9px 12px;
  border: 1px solid var(--ylf-border); border-radius: var(--ylf-radius); background: var(--ylf-background);
  color: var(--ylf-text); font: inherit; line-height: 1.5; box-shadow: none;
}
.ylf-form input[type="email"], .ylf-form input[type="tel"], .ylf-form input[inputmode="decimal"], .ylf-form input[type="number"], .ylf-form input[type="date"], .ylf-form input[type="datetime-local"] { direction: ltr; text-align: start; }
.ylf-form select:not([multiple]) { appearance: none; -webkit-appearance: none; height: auto; max-width: 100%; padding-inline-end: 38px; background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-repeat: no-repeat; background-size: 5px 5px, 5px 5px; background-position: right 17px center, right 12px center; text-overflow: ellipsis; cursor: pointer; }
.ylf-form select:not([multiple]):dir(rtl) { background-position: left 12px center, left 17px center; }
.ylf-form textarea { resize: vertical; }
.ylf-form .ylf-check { display: flex; align-items: flex-start; gap: 9px; cursor: pointer; margin-block: 5px; }
.ylf-form input[type="checkbox"] { width: 18px; height: 18px; flex: 0 0 18px; margin: 5px 0 0; accent-color: var(--ylf-primary); }
.ylf-form .ylf-container { --ylf-field-span: 12; border: 1px solid var(--ylf-border); border-radius: var(--ylf-radius); padding: 16px; }
.ylf-form legend { float: none; width: auto; margin: 0; padding-inline: 6px; color: inherit; font: inherit; font-weight: 600; }
.ylf-form .ylf-options { border: 0; min-width: 0; margin: 0; padding: 0; }
.ylf-form .ylf-options legend { padding: 0; margin-block-end: 6px; }
.ylf-form .ylf-repeat-row + .ylf-repeat-row { margin-block-start: var(--ylf-gap); padding-block-start: var(--ylf-gap); border-top: 1px solid var(--ylf-border); }
.ylf-form .ylf-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-block-start: 24px; }
.ylf-form button { width: auto; min-height: 44px; margin: 0; padding: 9px 18px; border: 1px solid var(--ylf-primary); border-radius: var(--ylf-radius); font: inherit; font-weight: 600; cursor: pointer; line-height: 1.5; }
.ylf-form .ylf-submit { color: var(--ylf-on-primary, #fff); background: var(--ylf-primary); }
.ylf-form .ylf-add, .ylf-form .ylf-remove { color: var(--ylf-text); background: var(--ylf-background); margin-block-start: 12px; }
.ylf-form .ylf-local-note { font-size: .8em; }
.ylf-form button:disabled, .ylf-form input:disabled, .ylf-form textarea:disabled, .ylf-form select:disabled { opacity: .6; cursor: not-allowed; }
.ylf-form :is(input, textarea, select, button):focus-visible { outline: 3px solid var(--ylf-primary); outline-offset: 3px; }
.ylf-form .ylf-status { margin-block: 0 20px; padding: 12px 16px; border: 1px solid #b8d9e7; border-radius: var(--ylf-radius); background: #edf7fb; color: #17445e; overflow-wrap: anywhere; }
.ylf-form .ylf-status[data-state="error"] { color: #842b2b; background: #fff2f1; border-color: #ebc1be; }
.ylf-form .ylf-status[data-state="success"] { color: #176144; background: #eef9f3; border-color: #b8dfcb; }
.ylf-form .ylf-trap { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; }
.ylf-form .ylf-noscript { color: #842b2b; }
.ylf-form .ylf-field-hint, .ylf-form .ylf-field-error { margin: 6px 0 0; font: inherit; font-size: .85em; line-height: 1.7; overflow-wrap: anywhere; }
.ylf-form .ylf-field-hint { color: inherit; }
.ylf-form .ylf-field-error { color: #842b2b; background: #fff2f1; border-inline-start: 3px solid #b3261e; padding: 6px 10px; border-radius: min(var(--ylf-radius), 8px); }
.ylf-form .ylf-field [aria-invalid="true"], .ylf-form .ylf-field[aria-invalid="true"] { border-color: #b3261e; }
.ylf-form .ylf-invalid > .ylf-options { border-inline-start: 3px solid #b3261e; padding-inline-start: 10px; }
.ylf-form .ylf-step-inactive { display: none !important; }
.ylf-form.ylf-wizard[data-wizard-ready="true"] {
  display: grid;
  grid-template-columns: minmax(160px, 220px) minmax(0, 1fr);
  column-gap: clamp(18px, 3vw, 32px);
  align-items: start;
}
.ylf-form.ylf-wizard > .ylf-title { grid-column: 1 / -1; margin-block-end: 8px; }
.ylf-form.ylf-wizard > .ylf-status { grid-column: 1 / -1; margin-block: 8px 20px; }
.ylf-form.ylf-wizard > .ylf-wizard-nav { grid-column: 1; grid-row: 3 / span 3; min-width: 0; }
.ylf-form.ylf-wizard > .ylf-step-heading { grid-column: 2; grid-row: 3; margin-block: 0 var(--ylf-gap, 16px); min-width: 0; }
.ylf-form.ylf-wizard > .ylf-scope { grid-column: 2; grid-row: 4; }
.ylf-form.ylf-wizard > .ylf-actions { grid-column: 2; grid-row: 5; }
.ylf-form .ylf-step-list { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ylf-form .ylf-step-item { min-width: 0; margin: 0; padding: 0; }
.ylf-form .ylf-step-button {
  display: flex; align-items: center; gap: 10px; width: 100%; min-height: 72px;
  padding: 12px; text-align: start; background: var(--ylf-background, #fff);
  color: var(--ylf-text, #163b50); border: 1px solid var(--ylf-border, #cbdce5);
  border-radius: var(--ylf-radius, 8px); font-size: .87em; font-weight: 400;
  transition: background-color .15s ease, border-color .15s ease;
}
.ylf-form .ylf-step-button:disabled { opacity: 1; cursor: not-allowed; }
.ylf-form .ylf-step-button:not(:disabled):hover { border-color: var(--ylf-primary); }
.ylf-form .ylf-step-button[data-state="current"] { color: var(--ylf-on-primary, #fff); background: var(--ylf-primary); border-color: var(--ylf-primary); }
.ylf-form .ylf-step-number {
  display: inline-flex; flex: 0 0 30px; align-items: center; justify-content: center;
  width: 30px; height: 30px; border: 1px solid currentColor; border-radius: 50%;
  font-size: .9em; font-weight: 700; line-height: 1;
}
.ylf-form .ylf-step-copy { display: flex; flex: 1; flex-direction: column; gap: 3px; min-width: 0; }
.ylf-form .ylf-step-title { font-weight: 650; line-height: 1.6; overflow-wrap: anywhere; }
.ylf-form .ylf-step-description { font-size: .83em; line-height: 1.6; overflow-wrap: anywhere; }
.ylf-form .ylf-step-state { flex: 0 0 auto; font-weight: 700; }
.ylf-form .ylf-step-button[data-state="complete"] { border-color: var(--ylf-primary); }
.ylf-form .ylf-step-button[data-state="complete"] .ylf-step-number { color: var(--ylf-on-primary); background: var(--ylf-primary); border-color: var(--ylf-primary); }
.ylf-form .ylf-step-counter { margin: 0 0 5px; font-size: .8em; line-height: 1.7; }
.ylf-form .ylf-current-step-title { margin: 0; padding: 0; color: inherit; font: inherit; font-size: 1.15em; font-weight: 700; overflow-wrap: anywhere; }
.ylf-form .ylf-current-step-description { margin: 6px 0 0; font-size: .88em; overflow-wrap: anywhere; }
.ylf-form .ylf-step-heading:focus { outline: none; }
.ylf-form .ylf-step-heading:focus-visible { outline: 2px solid var(--ylf-primary); outline-offset: 6px; border-radius: var(--ylf-radius, 8px); }
.ylf-form .ylf-previous { color: var(--ylf-text); background: var(--ylf-background); }
.ylf-form .ylf-next { color: var(--ylf-on-primary); background: var(--ylf-primary); }
.ylf-form.ylf-wizard .ylf-actions { border-block-start: 1px solid var(--ylf-border); padding-block-start: 18px; }
.ylf-form.ylf-wizard .ylf-local-note { flex-basis: 100%; line-height: 1.8; }
.ylf-form.ylf-wizard[data-wizard-template="progress"] { grid-template-columns: minmax(0, 1fr); }
.ylf-form.ylf-wizard[data-wizard-template="progress"] > .ylf-wizard-nav { grid-column: 1; grid-row: 3; margin-block: 14px 24px; padding-block: 4px; overflow-x: auto; }
.ylf-form.ylf-wizard[data-wizard-template="progress"] > .ylf-step-heading { grid-column: 1; grid-row: 4; }
.ylf-form.ylf-wizard[data-wizard-template="progress"] > .ylf-scope { grid-column: 1; grid-row: 5; }
.ylf-form.ylf-wizard[data-wizard-template="progress"] > .ylf-actions { grid-column: 1; grid-row: 6; }
.ylf-form.ylf-wizard[data-wizard-template="progress"] .ylf-step-list { flex-direction: row; gap: 0; }
.ylf-form.ylf-wizard[data-wizard-template="progress"] .ylf-step-item { position: relative; flex: 1; min-width: 108px; }
.ylf-form.ylf-wizard[data-wizard-template="progress"] .ylf-step-item::before {
  content: ''; position: absolute; inset-block-start: 27px; inset-inline: 0; height: 2px;
  background: var(--ylf-border); pointer-events: none;
}
.ylf-form.ylf-wizard[data-wizard-template="progress"] .ylf-step-item:first-child::before { inset-inline-start: 50%; }
.ylf-form.ylf-wizard[data-wizard-template="progress"] .ylf-step-item:last-child::before { inset-inline-end: 50%; }
.ylf-form.ylf-wizard[data-wizard-template="progress"] .ylf-step-button {
  position: relative; flex-direction: column; align-items: center; justify-content: flex-start;
  gap: 9px; padding: 10px 8px; min-height: 100px; border: 0; text-align: center;
  background: transparent; color: var(--ylf-text); border-radius: var(--ylf-radius);
}
.ylf-form.ylf-wizard[data-wizard-template="progress"] .ylf-step-number { position: relative; width: 36px; height: 36px; flex-basis: 36px; background: var(--ylf-background); border: 2px solid var(--ylf-border); }
.ylf-form.ylf-wizard[data-wizard-template="progress"] .ylf-step-copy { flex: 0; }
.ylf-form.ylf-wizard[data-wizard-template="progress"] .ylf-step-description { display: none; }
.ylf-form.ylf-wizard[data-wizard-template="progress"] .ylf-step-state { display: none; }
.ylf-form.ylf-wizard[data-wizard-template="progress"] .ylf-step-button:is([data-state="current"], [data-state="complete"]) .ylf-step-number { background: var(--ylf-primary); color: var(--ylf-on-primary); border-color: var(--ylf-primary); }
.ylf-form.ylf-wizard[data-wizard-template="progress"] .ylf-step-button[data-state="current"] .ylf-step-title { color: var(--ylf-text); text-decoration: underline; text-decoration-color: var(--ylf-primary); text-underline-offset: 5px; }
/* A shortcode can be narrow inside a desktop column or the builder preview. */
@container (max-width: 650px) {
  .ylf-form.ylf-wizard > .ylf-wizard-nav { grid-column: 1 / -1; grid-row: 3; margin-block: 8px 20px; }
  .ylf-form.ylf-wizard > .ylf-step-heading { grid-column: 1 / -1; grid-row: 4; }
  .ylf-form.ylf-wizard > .ylf-scope { grid-column: 1 / -1; grid-row: 5; }
  .ylf-form.ylf-wizard > .ylf-actions { grid-column: 1 / -1; grid-row: 6; }
  .ylf-form.ylf-wizard[data-wizard-template="sidebar"] .ylf-step-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 140px), 1fr)); gap: 8px; }
  .ylf-form.ylf-wizard[data-wizard-template="sidebar"] .ylf-step-button { min-height: 62px; padding: 9px; gap: 8px; }
  .ylf-form.ylf-wizard[data-wizard-template="sidebar"] .ylf-step-description { display: none; }
  .ylf-form .ylf-fields { grid-template-columns: minmax(0, 1fr); }
  .ylf-form .ylf-field { grid-column: 1 / -1; }
  .ylf-form .ylf-actions { gap: 10px; }
  .ylf-form.ylf-wizard .ylf-actions > button { flex: 1; }
}
@media (max-width: 640px) { .ylf-form .ylf-fields { grid-template-columns: minmax(0, 1fr); } .ylf-form .ylf-field { grid-column: 1 / -1; } .ylf-form .ylf-actions { align-items: stretch; flex-direction: column; } .ylf-form.ylf-wizard .ylf-actions { flex-direction: row; } .ylf-form .ylf-container { padding: 12px; } }
@media (prefers-reduced-motion: reduce) { .ylf-form *, .ylf-form *::before, .ylf-form *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }
@media (forced-colors: active) { .ylf-form select:not([multiple]) { appearance: auto; background-image: none; padding-inline-end: 12px; } }
