.formulario-dynamic {
    display: grid;
    gap: var(--spacing-scale-4x, 1.5rem);
}

.formulario-dynamic__field {
    min-width: 0;
}

.formulario-dynamic .br-input,
.formulario-dynamic .br-select,
.formulario-dynamic .br-textarea,
.formulario-dynamic .br-upload {
    max-width: 100%;
}

.formulario-dynamic .br-input input,
.formulario-dynamic .br-select select,
.formulario-dynamic .br-textarea textarea {
    width: 100%;
}

.formulario-dynamic .br-textarea textarea {
    min-height: 8rem;
    resize: vertical;
}

.formulario-dynamic__choice-group {
    border: 0;
    margin: 0;
    min-width: 0;
    padding: 0;
}

.formulario-dynamic__legend {
    color: var(--text-color, #333);
    font-size: var(--font-size-scale-up-01, 1.125rem);
    font-weight: var(--font-weight-semi-bold, 600);
    margin-bottom: var(--spacing-scale-2x, 0.75rem);
}

.formulario-dynamic__choices {
    display: grid;
    gap: var(--spacing-scale-2x, 0.75rem);
}

.formulario-dynamic .br-radio,
.formulario-dynamic .br-checkbox {
    margin: 0;
}

.formulario-dynamic__help {
    color: var(--color-secondary-07, #555);
    font-size: var(--font-size-scale-down-01, 0.875rem);
    line-height: 1.45;
    margin: var(--spacing-scale-half, 0.25rem) 0 0;
}

.formulario-dynamic__error {
    margin-top: var(--spacing-scale-base, 0.5rem);
}

.formulario-dynamic__error .message-title {
    font-weight: var(--font-weight-semi-bold, 600);
}

.formulario-preview {
    padding: var(--spacing-scale-4x, 1.5rem) var(--spacing-scale-5x, 2rem);
}

.formulario-preview__notice {
    margin-bottom: var(--spacing-scale-5x, 2rem);
}

.formulario-preview__header {
    margin-bottom: var(--spacing-scale-5x, 2rem);
    max-width: 50rem;
}

.formulario-preview__title {
    color: var(--text-color, #333);
    font-size: clamp(2rem, 4vw, 2.75rem);
    font-weight: var(--font-weight-regular, 400);
    line-height: 1.15;
    margin: 0 0 var(--spacing-scale-2x, 0.75rem);
}

.formulario-preview__description {
    color: var(--color-secondary-07, #555);
    font-size: var(--font-size-scale-up-01, 1.125rem);
    line-height: 1.55;
    margin: 0;
}

.formulario-preview__form {
    max-width: 46rem;
}

.formulario-preview__actions,
.formulario-preview__navigation {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-scale-2x, 0.75rem);
}

.formulario-preview__actions {
    margin-top: var(--spacing-scale-5x, 2rem);
}

.formulario-preview__navigation {
    border-top: 1px solid var(--color-secondary-04, #ccc);
    margin-top: var(--spacing-scale-5x, 2rem);
    padding-top: var(--spacing-scale-4x, 1.5rem);
}

.formulario-publico {
    background: var(--background-alternative, #f5f5f5);
    color: var(--text-color, #333);
    margin: 0;
    min-height: 100vh;
}

.formulario-publico__main {
    margin: 0 auto;
    max-width: 72rem;
    padding: clamp(1.5rem, 4vw, 4rem) clamp(1rem, 4vw, 3rem);
}

.formulario-publico__surface {
    background: var(--background, #fff);
    border: 1px solid var(--color-secondary-04, #ccc);
    border-radius: var(--surface-rounder-md, 0.5rem);
    box-shadow: var(--surface-shadow-sm, 0 0.25rem 1rem rgba(0, 0, 0, 0.08));
    padding: clamp(1.5rem, 4vw, 3rem);
}

.formulario-publico__header {
    margin-bottom: var(--spacing-scale-5x, 2rem);
    max-width: 52rem;
}

.formulario-publico__title {
    color: var(--text-color, #333);
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: var(--font-weight-regular, 400);
    line-height: 1.15;
    margin: 0 0 var(--spacing-scale-2x, 0.75rem);
}

.formulario-publico__description {
    color: var(--color-secondary-07, #555);
    font-size: var(--font-size-scale-up-01, 1.125rem);
    line-height: 1.55;
    margin: 0;
}

.formulario-publico__message,
.formulario-publico__errors,
.formulario-publico__privacy {
    margin-bottom: var(--spacing-scale-4x, 1.5rem);
}

.formulario-publico__errors ul {
    margin: 0;
    padding-left: var(--spacing-scale-3x, 1rem);
}

.formulario-publico__errors .message-body {
    margin-bottom: 0;
}

.formulario-publico__privacy {
    border-top: 1px solid var(--color-secondary-04, #ccc);
    margin-top: var(--spacing-scale-5x, 2rem);
    padding-top: var(--spacing-scale-4x, 1.5rem);
}

.formulario-publico__actions {
    margin-top: var(--spacing-scale-5x, 2rem);
}

@media (max-width: 575px) {
    .formulario-preview,
    .formulario-publico__surface {
        padding: var(--spacing-scale-3x, 1rem);
    }

    .formulario-preview__actions,
    .formulario-preview__navigation,
    .formulario-publico__actions {
        align-items: stretch;
        flex-direction: column;
    }

    .formulario-preview__actions .br-button,
    .formulario-preview__navigation .br-button,
    .formulario-publico__actions .br-button {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .formulario-publico *,
    .formulario-preview * {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}

/* A mesma superfície de campos pode ser renderizada dentro de uma coluna do
 * hotsite. As regras ficam no asset compartilhado para não duplicar widgets
 * nem impor largura mínima ao grid da página. */
.formulario-embedded {
    min-width: 0;
    max-width: 100%;
}

.formulario-embedded--slot {
    padding: var(--spacing-scale-3x, 1rem);
}

.formulario-embedded .formulario-publico__header,
.formulario-embedded .formulario-publico__privacy,
.formulario-embedded .formulario-publico__message,
.formulario-embedded .formulario-publico__errors {
    max-width: 100%;
}

.formulario-embedded .formulario-publico__title {
    overflow-wrap: anywhere;
}

.formulario-embedded .formulario-dynamic {
    min-width: 0;
}

.formulario-embedded .formulario-dynamic__field,
.formulario-embedded .br-input,
.formulario-embedded .br-select,
.formulario-embedded .br-textarea,
.formulario-embedded .br-upload {
    min-width: 0;
    max-width: 100%;
}

.formulario-embedded .formulario-publico__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-scale-2x, 0.75rem);
}

.formulario-embedded .formulario-publico__actions .br-button {
    max-width: 100%;
}

.formulario-embedded [disabled] {
    cursor: not-allowed;
}
