/* Switch "Soy humano" — verificación humana propia (os/js/human-verify.js).
   Es un <label>: forzamos inline-flex con !important para que el CSS del formulario
   (que suele fijar `label { display:inline-block }`) no rompa la fila switch+texto. */
.human-verify {
    display: inline-flex !important;
    align-items: center;
    gap: .6rem;
    margin: .5rem 0 1rem !important;
    cursor: pointer;
    user-select: none;
    font-size: .95rem;
    line-height: 1;
    color: var(--dark-color, #222);
}
.human-verify__switch {
    position: relative;
    display: block;
    width: 46px;
    height: 26px;
    border-radius: 999px;
    background: #cfd4da;
    transition: background-color .2s;
    flex-shrink: 0;
    outline: none;
}
.human-verify__text {
    line-height: 1;
    display: inline-flex;
    align-items: center;
    font-weight: 500;
}
.human-verify__switch:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color, #8CD50B) 40%, transparent);
}
.human-verify__switch.is-on {
    background: var(--primary-color, #8CD50B);
}
.human-verify__knob {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    transition: transform .2s;
}
.human-verify__switch.is-on .human-verify__knob {
    transform: translateX(20px);
}