input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

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

.form-box {
    width: 34vw;
    margin-right: auto;
    margin-left: auto;
}

.form-box-actions {
    padding-top: var(--space-between);
    text-align: right;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.form-box-actions > *:not(:first-child) {
    margin-left: var(--space-between-s);
}

.form-group {
    margin-bottom: var(--space-between);
}
.control-label {
    margin-bottom: 6px;
    font-weight: 400;
    font-size: inherit;
}
.form-control {
    border-radius: 1px;
    font-size: inherit;
    background-color: var(--background-color);
    border-color: var(--border-color);
}
.form-control:focus {
    color: inherit;
    border-color: var(--border-color-active);
    box-shadow: none;
}
.form-control-sibling {
    display: block;
    height: calc(1.5em + .75rem + 2px);
    padding-top: .375rem;
    padding-bottom: .375rem;
    font-size: inherit;
    line-height: 1.5;
}
.custom-select {
    border-radius: 1px;
    color: inherit;
    font-size: inherit;
    background-color: var(--background-color);
    border-color: var(--border-color);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3e%3cpath fill='%23cccccc' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right .75rem center/8px 10px;
}
.custom-select:focus {
    border-color: var(--border-color-active);
    box-shadow: none;
}

.custom-file-label {
    border-radius: 1px;
    border-color: var(--border-color);
}
.custom-file-label::after {
    border-radius: 0 var(--border-radius) var(--border-radius) 0;
    color: var(--color-soft);
    background-color: var(--border-color);
}

.control-optional {
    background-color: var(--background-color-behind);
    margin-left: 6px;
    font-weight: 300;
    vertical-align: top;
    margin-top: 3px;
    text-transform: lowercase;
}

.input-validation-error {
    border-color: var(--color-danger);
}
.field-validation-error {
    display: block;
    color: var(--color-danger);
    margin-top: .25rem;
    font-size: 80%;
}

.form-text {
    color: #6c757d;
}

.form-help {
    display: block;
    margin-bottom: 6px;
    color: #6c757d;
    font-size: .875em;
}
.form-help p:last-of-type {
    margin-bottom: 0;
}

.alert,
.modal-content {
    border-radius: var(--border-radius);
}

.validation-summary-valid {
    display: none;
}
.validation-summary-errors {
    display: inline-block;
    color: var(--color-danger);
}
.validation-summary-errors span {
    display: inline-block;
    margin-bottom: .25rem;
}
.validation-summary-errors ul {
    list-style-position: inside;
    list-style-type: square;
    padding-left: 2px;
}

.redactor-styles {
    font-family: "Open Sans", sans-serif, var(--emoji-font-families), var(--font-awesome) !important;
    font-size: var(--font-size) !important;
}

.twitter-typeahead {
    width: 100%;
}
.tt-menu {
    width: 100%;
    padding: 4px 0;
    background-color: var(--background-color);
    border: 1px solid var(--border-color);
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
    box-shadow: 0 4px 4px rgba(0, 0, 0, .2);
}
.tt-suggestion {
    padding: 4px .75rem;
}
.tt-suggestion:hover {
    cursor: pointer;
    background-color: var(--background-color-behind);
}
.tt-suggestion.tt-cursor {
    background-color: var(--background-color-behind);
}
.tt-suggestion p {
    margin: 0;
}
.tt-highlight {
    font-weight: 400;
}

.dropdown-menu {
    border-color: var(--border-color-active);
    width: 100%;
}
.dropdown-menu[x-placement="top-start"] {
    border-bottom: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
.dropdown-menu[x-placement="bottom-start"] {
    border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.dropdown-toggle {
    outline: 0;
}
.dropdown-item {
    font-size: var(--font-size);
}

.input-group-append .btn,
.input-group-prepend .btn {
    height: 100%;
}

.btn-append-secondary {
    min-width: auto;
    padding-left: var(--space-between);
    padding-right: var(--space-between);
    background-color: var(--border-color);
    border-color: var(--border-color);
    color: var(--color-soft);
}
