/* Split-form layout only. ui.css owns fonts, colors, borders, corners and controls. */
.sfui-form-panel {
  display: grid;
  grid-template-columns: minmax(0,1.12fr) minmax(0,.88fr);
  gap: var(--sfui-gap);
  min-width: 0;
  align-items: start;
}
.sfui-form-panel .sfui-button { width: 100%; }
.sfui-form-panel__footer { display: grid; gap: var(--sfui-space-12); margin-top: var(--sfui-gap); }
.sfui-form-panel__legal { text-align: center; }
.sfui-form-switch { display: grid; gap: var(--sfui-space-12); text-align: center; }
.sfui-form-panel__visual.sfui-card { position: relative; overflow: hidden; padding: 0; }
.sfui-form-panel__image-wrap { position: relative; display: flex; align-items: center; justify-content: center; padding: var(--sfui-space-32) var(--sfui-space-16) var(--sfui-space-24); }
.sfui-form-panel__image-wrap::after { content: ''; position: absolute; inset: auto 0 0; z-index: 2; height: 42%; pointer-events: none; background: linear-gradient(0deg,var(--sfui-surface),transparent); }
.sfui-form-panel__image { width: min(520px,92%); object-fit: contain; height: auto; position: relative; z-index: 1; }
.sfui-visual-badge {
  --sfui-icon-ink: var(--sfui-primary-ink);
  position: absolute;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: var(--sfui-space-8);
  padding: var(--sfui-space-8) var(--sfui-space-12) var(--sfui-space-8) var(--sfui-space-8);
  border-radius: var(--sfui-button-radius);
  font-size: var(--sfui-size-label);
  line-height: var(--sfui-line-label);
  font-weight: var(--sfui-weight-bold);
  color: var(--sfui-primary-ink);
  background: var(--sfui-button-background);
  border: var(--sfui-border-width) solid var(--sfui-border);
  pointer-events: none;
  white-space: nowrap;
}
.sfui-visual-badge > span { display: grid; place-items: center; width: var(--sfui-space-32); height: var(--sfui-space-32); border-radius: var(--sfui-control-radius); background: var(--sfui-soft); }
.sfui-visual-badge--top { background: var(--sfui-button-blue); top: 46%; right: 18%; }
.sfui-visual-badge--second { top: 58%; left: 16%; }
@media (max-width: 991.98px) {
  .sfui-form-panel { grid-template-columns: minmax(0,1fr); }
  .sfui-form-panel__heading { text-align: center; }
  .sfui-form-panel__visual { min-height: 260px; }
  .sfui-visual-badge--top { top: 58%; right: 14%; }
  .sfui-visual-badge--second { top: 70%; left: 12%; }
}
