.button {
    display: inline-block;
}
.button:hover {
    text-decoration:none;
    cursor: default;
}

.button, .button:visited, input[type=reset], input[type=submit], input[class=button], button {
   color: #fff;
   background: #3858a3;
   padding: 0.25em;
   padding-left: 0.5em;
   padding-right: 0.5em;
   -moz-border-radius: 0.5em;
   -webkit-border-radius: 0.5em;
   border-radius: 0.5em;
   border-color: transparent;
}

.button:hover, input.button:hover, button:hover, input[type=reset]:hover, input[type=submit]:hover, input[class=button]:hover {
   background: #1D3B7D;
}

.button:focus, input.button:focus, button:focus, input[type=reset]:focus, input[type=submit]:focus, input[class=button]:focus {
   background: #1D3B7D;
}

div.error div.error {
 border: 2px solid #aa0000;
 border-top: 1px solid #bb0000;
 border-left: 1px solid #bb0000;
 background-color: #fcc;
}

div.error .titlebox-title span.left {
  background-color: #f00;
  color: #fff;
  border: 1px solid #cc0000;
  border-right: 2px solid #bb0000;
  border-bottom: 2px solid #bb0000;

}


div.results .titlebox-title .left, div.results .titlebox {
  border: 1px solid #aa9;
  border-bottom: 2px solid #990;
  border-right: 2px solid #990;
}

div.results .titlebox-title .left {
  background: #ff9;
  border: solid #aa9;
  border-width: 1px 1px 0 1px;
}

div.results .titlebox,
div.error-titlebox {
  border: none;
  background: none;
  font-weight: bold;
}

div.results .titlebox-content {
  border: 1px solid #aa9;
  border-bottom: 2px solid #990;
  border-right: 2px solid #990;
  background: #ffc;
}

.results .titlebox-content > p:first-child,
.error .titlebox-content > p:first-child {
    margin-top: 0;
}

.results .titlebox-content > p:last-child,
.error .titlebox-content > p:last-of-type {
    margin-bottom: 0;
}

div.error-titlebox .titlebox-content .card-body {
    background-color: #fcc;
    padding: 15px;
}

div.error .titlebox-content {
  background-color: #fcc;
}

div#body>div.error {
  background-color: #fcc;
  padding: 1em;
}

div.error .titlebox-title .widget a {
  background-position: center -7px;
}

.label {
  text-align: right;
}

.value > ul {
    margin-top: 0;
    margin-bottom: 0;
}

div.ticket-info-basics div.titlebox-content .labeltop{
  width: 10em;
}

div.submit {
 text-align: right;
}

div.submit .extra-buttons {
 text-align: left;
 float: left;
}


div.widget {
    padding-bottom: 0.5em;
    clear: both;
}

div.widget .hints {

  display: block;
  font-style: italic;
}

@media (max-width: 700px) {
    div.widget .label {
        text-align: left;
        width: auto;
        max-width: 100%;
        float: none;
    }

    div.widget .value,
    div.widget .hints {
        padding-left: 0;
        margin-left: 1em;
    }
}

.cfinvalidfield {
    font-style: italic;
    color: red;
}

.cfhints {
    color: #3858a3;
}

form div.submit div.buttons {
    min-height: 2.8em;
}

form div.submit div.buttons div.back {
    position: relative;
    float: left;
    width: 50%;
    text-align: left;
}

form div.submit div.buttons div.next {
    position: relative;
    float: right;
    width: 50%;
}

.invalid {
    font-style: italic;
    color: red;
}

.messagebox-attachment-warning {
  display: none;
  background-color: #fcc;
  font-weight: bold;
  padding: .5em 2em;
  margin: .5em 0;

  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.messagebox-attachment-warning .ignore {
    display: none;
}

ul.selectable {
    list-style-type: none;
}

ul.selectable input[type=checkbox],
ul.selectable a {
    vertical-align: bottom;
}

#reuse-attachments {
    padding-top: 0.25em;
}

.ticket-info-attachments ul li {
    font-size: .8em;
}

.dropzone .dz-message {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

/* query builder */

#formatbuttons {
    clear: both;
}

#ResetAuthTokenPrompt {
    display: block;
    text-align: right;
    font-weight: bold;
    text-decoration: underline;
}

#SimpleSearchForm {
    margin: 0 1em;
} 

#SimpleSearchForm input[name="q"] {
    width: 100%;
}

.button,
.button:visited,
.button:focus,
input[type=reset],
input[type=submit],
input[class=button],
button {
  color: #fff;
  background: #4868b3;
}

.button:focus,
input.button:focus,
button:focus,
input[type=reset]:focus,
input[type=submit]:focus,
input[class=button]:focus,
.button:hover,
input.button:hover,
button:hover,
input[type=reset]:hover,
input[type=submit]:hover,
input[class=button]:hover {
  background: #3D5B9D
}

.button:active,
input.button:active,
button:active,
input[type=reset]:active,
input[type=submit]:active,
input[class=button]:active {
  background: #1D3B7D
}

.button,
input[type=reset],
input[type=submit],
input[class=button],
button {
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  padding-left: 0.75em;
  padding-right: 0.75em;
  width: auto;
}

.form-row {
  margin-top: 0.5em;
}

.form-row > .value .form-row,
.list-group-item > .form-row {
  margin-top: 0;
}

div[id^="TitleBox--_Ticket_ModifyPeople_html"] .list-group-item {
  padding-top: 0.25em;
  padding-bottom: 0.25em;
}

/* These move horizontal radio buttons and a single checkbox down
   to be centered next to the label, which is also pushed down */
.form-row.boolean > .value .form-row,
.form-row.cfrendertype-Checkbox > .value {
  margin-top: 5px;
}

.col-auto .datepicker {
  width: 17em;
}

span.current-value.form-control {
  border: none;
  padding-left: 0;
  height: auto;
}

/* Align radio inputs with labels */
.custom-control.has-text-input label::before,
.custom-control.has-text-input label::after {
  top: 0.6rem;
}

/* Make radio options without inputs in labels the same height as ones that have inputs in labels */
.custom-control.no-text-input {
  height: calc(1.5em + 0.75rem + 2px); /* the same as .form-control input */
  padding-top: 5px;
}

/* Assets widget in ticket display */
form span.current-value {
  display: block;
  padding-top: 5px;
}

.list-group-item label {
  margin-bottom: 0;
}

.list-group-compact .list-group-item,
.list-group-borderless .list-group-item {
  border: none;
}

.list-group-compact .list-group-item {
  padding: 0.25em;
}

/* show markers like 1. 2. 3. for lists */
.list-group-item.marker {
  display: list-item;
}

.bootstrap-select button:focus {
  background: #f8f9fa;
}

.input-group input.btn {
  margin-left: 0.5em;
}

.input-group-text {
  line-height: 1;
}

.label.input,
form .label,
form .value > .list-group {
  padding-top: 5px;
}

.value .list-group > .list-group-item:first-child {
  padding-top: 0;
}

.value .list-group .list-group-item {
  padding-left: 0;
}

.value .list-group {
  line-height: inherit;
}

.btn {
  font-weight: 500;
}

ul li .dropdown-item.active span,
ul li .dropdown-item:active span {
  color: #fff;
}

/* remove unnecessary left padding for radio options */
#EditConfig div.widget .label {
    width: auto;
    float: none;
}

#EditConfig textarea:disabled,
#EditConfig input:disabled {
    background-color: #EEE;
}

.widget.code textarea,
textarea.code {
    font-family: Consolas, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace;
}

#EditConfig ul.plugins {
    margin: 0;
}

/* reminders */
#UpdateReminders .form-row.reminder-headers, #UpdateReminders [id^=reminder-] {
    border-bottom: 1px solid #dee2e6;
}

#UpdateReminders .current-value {
    background-color: unset;
}

/* javascript selection box */

.selectionbox-js .source li .remove {
    display: none;
}

/* make it look more like we're cloning */
.selectionbox-js .source .placeholder {
    display: none;
}

.selectionbox-js .destination {
    margin-bottom: 2em;
}

.selectionbox-js .source .contents,
.selectionbox-js .destination .contents {
    min-height: 350px;
    max-height: 1000px;
}

/* include ul rule specifically to make the drop target work when there are
   no selected searches */
.selectionbox-js .destination .contents ul {
    min-height: 250px;
}

.selectionbox-js h2 {
    margin: 0 0 .5em 0;
}

.selectionbox-js .source .filters {
    margin-bottom: 1em;
}

.selectionbox-js .destinations {
    margin-top: 3.75rem;
}

.selectionbox-js .contents {
    border: 1px solid #ccc;
    border-radius: 0.25rem;
    overflow-y: scroll;
    padding: 0 .5em;
}

.selectionbox-js .contents ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.selectionbox-js .contents li,
.selectionbox-js .contents .placeholder {
    border: 1px solid #aaa;
    border-radius: 0.25rem;
    padding: .5em;
    margin: .5em 0;
    background-color: #eee;
    cursor: default;
}

.selectionbox-js .contents li {
    position: relative;

    /* wrap very long search names */
    word-wrap: break-word;
    padding-right: 2em;
}

.selectionbox-js .contents li .text-warning {
    display: block;
    font-size: .9em;
    font-style: italic;
}

.selectionbox-js .contents li a.remove {
    position: absolute;
    right: .5em;
    color: #5C6273;
}

.selectionbox-js .contents .placeholder {
    box-sizing: border-box;
    border-style: dashed;
    opacity: 0.5;
    padding-left: 0;
    padding-right: 0;
    width: 100%;
}

.selectionbox-js .contents h3 {
    margin: .5em 0;
}

.selectionbox-js .contents .section {
    margin-bottom: 1em;
}

.selectionbox-js select[name=filter] {
    float: right;
}

/* always show scrollbars */
.selectionbox-js .contents::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 7px;
}

.selectionbox-js .contents::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: rgba(0, 0, 0, .5);
  -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}

/* Try not wrap icon-helper only */
div.form-row > div.label > span.prev-icon-helper {
  padding-right: 1em;
}

div.form-row > div.label > span.prev-icon-helper + .icon-helper {
  margin-left: -1em;
}
