/*
 * The orbit control.
 *
 * One form, four possible states, and the server decides which: orbit, unorbit, request, cancel request.
 * `OrbitService::buttonState()` supplies both the route and the button variant, so nothing about which
 * button this is gets decided here — CSS that chose the colour would be a second opinion about what the
 * control does, and the two opinions would eventually disagree (§64).
 *
 * So there is very little here on purpose. The button's appearance comes from `buttons.css` through the
 * variant class the server picked; this file only makes the form stop behaving like a block that owns a line
 * of its own, because it sits in a row of other controls on a profile header and in list rows.
 *
 * A visitor who is not signed in gets a link to the sign-in page shaped like the button they expected. That
 * is deliberate: a disabled orbit button explains nothing, and "sign in to orbit" is the actual next step.
 */

.orbit-form {
    display: inline-flex;
    margin: 0;
}

/* The width is held steady across states so the row does not jog when "Orbit" becomes "Orbiting" — the
   words differ in length in every language, and the button is pressed and unpressed in place. */
.orbit-form__button {
    min-width: 8rem;
    justify-content: center;
}

/* In flight: still there, still the same size, no longer inviting a second press. The script sets the
   attribute on the form, so a slow network cannot produce two orbits from one intention. */
.orbit-form[data-loading="true"] .orbit-form__button {
    pointer-events: none;
    opacity: 0.6;
}

.orbit-form__signin {
    min-width: 8rem;
    justify-content: center;
}