/* ==========================================================================
   KROTAR — /opina/marketing (formulario público de reseñas de Marketing
   Digital)
   Reutiliza opina.css tal cual para tarjeta, textarea, consentimiento,
   botón y estado de éxito. Esta hoja solo añade lo que opina.css no
   define: el estilo de los inputs de texto simple (nombre, empresa), que
   /opina no necesitaba porque su formulario no tiene ninguno.
   ========================================================================== */

.opina-field input[type="text"] {
    width: 100%;
    padding: 0.75rem 1rem;
    font-family: var(--font-body);
    /* 16px mínimo: evita que iOS Safari haga zoom automático al enfocar
       (mismo motivo que ya documenta opina.css para el textarea). */
    font-size: 1rem;
    color: var(--color-text);
    background: rgba(4, 8, 20, 0.35);
    border: 1px solid rgba(59, 130, 246, 0.16);
    border-radius: var(--radius-sm);
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3);
    box-sizing: border-box;
    transition: border-color var(--duration-fast) ease, background var(--duration-fast) ease, box-shadow var(--duration-fast) ease;
}

.opina-field input[type="text"]::placeholder {
    color: var(--color-text-dim);
}

.opina-field input[type="text"]:focus-visible {
    outline: none;
    border-color: rgba(0, 174, 239, 0.55);
    background: rgba(4, 8, 20, 0.5);
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 0 0 3px rgba(0, 145, 255, 0.14);
}

.opina-field.has-error input[type="text"] {
    border-color: var(--color-error);
}