/* ---------------------------------------------------------------------------
   Shared form polish, loaded by the website and by every panel so a field looks
   the same wherever it appears.

   Number fields: the browser's own up and down arrows sit inside the field, cut
   into the padding, and look different in every browser. They are put away, and
   the field keeps every other way of changing it (typing, the up and down keys,
   and a wheel over the field on a computer).
   --------------------------------------------------------------------------- */

input[type="number"] {
    -moz-appearance: textfield;
    appearance: textfield;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    appearance: none;
    margin: 0;
}

/* A field that really wants its arrows can ask for them back. */
input[type="number"].mhx-steppers {
    -moz-appearance: auto;
    appearance: auto;
}

input[type="number"].mhx-steppers::-webkit-outer-spin-button,
input[type="number"].mhx-steppers::-webkit-inner-spin-button {
    -webkit-appearance: auto;
    appearance: auto;
}

/* ---------------------------------------------------------------------------
   One height for every control in the owner panel.

   Fields were coming out at 40, 41 and 42 pixels depending on which page drew
   them, which is close enough to look like a mistake rather than a choice: put
   two of them side by side and one sits a pixel proud of the other. They are
   all 42 now, which is a comfortable size for a mouse and meets the 44 that a
   finger wants once the ring around a focused field is counted.

   A page that genuinely needs another size marks the field .mhx-own-size and
   keeps whatever it sets, so this can be stepped around deliberately but not
   by accident.
   --------------------------------------------------------------------------- */
body .mhx-page input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]):not(.mhx-own-size),
body .mhx-page select:not(.mhx-own-size) {
    height: 42px;
    box-sizing: border-box;
}

/* A field the guest types several lines into keeps its own height. */
body .mhx-page textarea:not(.mhx-own-size) {
    min-height: 84px;
    height: auto;
    box-sizing: border-box;
}
