.wu-content-form,
.wu-comments,
.wu-newsletter {
    width: 100%;
    color: var(--bs-body-color);
}

.wu-comments {
    --wu-comments-accent: var(--color-principal, currentColor);
    --wu-comments-border: color-mix(in srgb, currentColor 14%, transparent);
    --wu-comments-muted: color-mix(in srgb, currentColor 62%, transparent);
    width: 100%;
    margin-block: clamp(2.5rem, 6vw, 4.5rem);
    padding-inline: clamp(1rem, 4vw, 2rem);
}

.wu-comments__inner {
    width: min(100%, 72rem);
    margin-inline: auto;
}

.wu-content-form__card,
.wu-comments__form,
.wu-newsletter {
    padding: clamp(1.25rem, 4vw, 2.5rem);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius-xl, 1rem);
    background: var(--bs-body-bg);
    box-shadow: var(--bs-box-shadow-sm);
}

.wu-content-form h3,
.wu-comments__title,
.wu-newsletter__title { margin-bottom: 1.5rem; font-weight: 700; }

.wu-content-form .form-control,
.wu-content-form .form-select,
.wu-comments .form-control,
.wu-newsletter .form-control { min-height: 3rem; }

.wu-content-form textarea.form-control,
.wu-comments textarea.form-control { min-height: 8rem; resize: vertical; }

.wu-content-form .EtiquetaError,
.wu-comments .EtiquetaError,
.wu-comments__field-error,
.wu-content-form [id*="Validator"],
.wu-comments [id*="Validator"] {
    display: block;
    margin-top: .35rem;
    color: var(--bs-danger);
    font-size: .875rem;
}

.wu-comments__alert {
    margin-bottom: 1rem;
}

.wu-comments__alert ul {
    margin: .35rem 0 0;
    padding-left: 1.1rem;
}

.wu-content-form__actions,
.wu-comments__actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }

.wu-content-form__actions .CapaBtnAnyadir,
.wu-comments__actions .CapaBtnAnyadir { margin: 0; }

.wu-comments__list { display: grid; gap: 1rem; margin-bottom: 2rem; }
.wu-comments__item { padding: 1.25rem; border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius-lg); background: var(--bs-tertiary-bg); }
.wu-comments__body { margin: 0 0 .75rem; white-space: pre-line; }
.wu-comments__meta { display: flex; flex-wrap: wrap; gap: .5rem; color: var(--bs-secondary-color); font-size: .875rem; }

.wu-newsletter__form { display: flex; flex-wrap: wrap; gap: .75rem; }
.wu-newsletter__form .form-control { flex: 1 1 16rem; }
.wu-newsletter__consent { margin-top: 1rem; }

.wu-page-content { width: 100%; }
.wu-page-content__body { line-height: 1.7; }
.wu-page-content__image { float: left; width: min(100%, 20rem); margin: .35rem 1.5rem 1rem 0; border-radius: var(--bs-border-radius-lg); }
.wu-page-content__text :where(img, video, iframe) { max-width: 100%; height: auto; }
.wu-page-content__text :where(h2, h3, h4) { margin-top: 1.5em; margin-bottom: .65em; }

/* Los contenidos creados con Bootstrap 3 solían usar columnas sin un .row.
   La clase se añade únicamente a esos contenedores heredados. */
.wu-bootstrap-legacy-row {
    display: flex !important;
    flex-wrap: wrap;
    width: 100%;
}

@media (max-width: 575.98px) {
    .wu-bootstrap-legacy-row > [class*="col-"] {
        flex: 0 0 100%;
        width: 100%;
        min-width: 0;
    }

    .wu-page-content__image { float: none; width: 100%; margin: 0 0 1rem; }
}

@media (max-width: 575.98px) {
    .wu-content-form__actions > *, .wu-comments__actions > * { width: 100%; }
}
