/* Estilos genéricos para formularios Mautic embebidos (bloque HTML, sin target de iframe).
   Extraídos y generalizados desde el formulario de referencia /f/bio/formulario/ (id 3492),
   quitando el scope por ID de wrapper para que aplique a cualquier formulario del sitio.
   Ver encargo_20260710_CLAU_51_a_CLAU_41_css_formularios_mangled.md — vía 2 (robusta). */

.mauticform_wrapper {
    max-width: 600px;
    margin: 20px auto;
    font-family: Helvetica, Arial, sans-serif;
    color: #333;
}

.mauticform-innerform {
    width: 100%;
}

.mauticform-row {
    display: block;
    margin-bottom: 18px;
}

.mauticform-label {
    font-size: 15px;
    font-weight: 700;
    display: block;
    margin-bottom: 5px;
    color: #333;
}

.mauticform-required .mauticform-label:after {
    content: " *";
    color: #ff0000;
    display: inline;
}

.mauticform-input,
.mauticform-textarea,
.mauticform-selectbox {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff;
    font-size: 16px;
    box-sizing: border-box;
    color: #333;
}

.mauticform-textarea {
    min-height: 110px;
    resize: vertical;
}

.mauticform-helpmessage {
    display: block;
    font-size: 12px;
    margin-top: 4px;
}

.mauticform-error {
    margin-bottom: 10px;
    color: red;
    text-align: center;
}

.mauticform-message {
    margin-bottom: 10px;
    color: green;
    text-align: center;
}

.form-note {
    font-size: 14px;
    color: #555;
    margin-bottom: 22px;
    line-height: 1.4;
}

.required-star {
    color: #ff0000;
    font-weight: bold;
}

.mauticform-checkboxgrp-row,
.mauticform-radiogrp-row {
    display: flex;
    align-items: flex-start;
    margin-bottom: 8px;
}

.mauticform-checkboxgrp-checkbox,
.mauticform-radiogrp-radio {
    margin-right: 10px;
    margin-top: 4px;
    transform: scale(1.15);
}

.mauticform-checkboxgrp-label,
.mauticform-radiogrp-label {
    font-weight: normal;
    font-size: 14px;
    line-height: 1.4;
}

.optional-consents {
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    padding: 14px 0 10px 0;
    margin: 22px 0;
}

.optional-title {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 10px;
    color: #333;
}

.optional-help {
    font-size: 12px;
    color: #666;
    margin-top: 6px;
    line-height: 1.4;
}

.privacy-row {
    margin-top: 18px;
}

.privacy-row a {
    color: #000;
    font-weight: bold;
    text-decoration: underline;
}

.mauticform-button-wrapper {
    text-align: center;
    margin-top: 28px;
}

.mauticform-button {
    background-color: #9E1B1E;
    color: #ffffff;
    border: none;
    padding: 12px 24px;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.3s ease;
    white-space: nowrap;
    min-width: 250px;
}

.mauticform-button:hover {
    background-color: #7a1417;
}

.mauticform-button:disabled {
    background-color: #999;
    cursor: not-allowed;
}

.mauticform-field-hidden,
.mauticform-hidden {
    display: none !important;
}

/* Texto libre (freetext) usado como cabecera corta antes de un grupo de casillas
   opcionales (p.ej. «¿Quieres que sigamos en contacto?»). Sin esta clase hereda
   el tamaño de párrafo genérico del tema (18px), demasiado grande para una nota
   de contexto que precede a checkboxes de 14px. */
.mauticform-freetext-nota {
    font-size: 14px;
    font-weight: 700;
    color: #333;
    margin: 18px 0 8px 0;
}

/* En móvil, algunos formularios llevan el ancho y el "nowrap" del botón puestos
   a mano por estilo inline (mayor especificidad que esta hoja) para evitar que
   el texto se parta en dos líneas en escritorio. En pantallas estrechas eso
   desborda en vez de partir bien, así que aquí se fuerza con !important. */
@media (max-width: 480px) {
    .mauticform-button {
        width: 100% !important;
        white-space: normal !important;
        font-size: 15px !important;
        padding: 12px 16px !important;
    }
}