/* Overwrite Bootstrap defaults to match OT defaults in vistashare-medium.css */
@import url(/Static/css/calendar-win2k-1.css);
@import url(/Static/css/vistashare-common.css);

body,
p,
textarea,
h3,
td.fieldDescriptor,
td.fieldError, td.fieldErrorField,
a.tabLink,
td,
table.newsTable,
th.menuItem,
.navtext,
#tabmenu a,
button,
input,
select,
option,
optgroup,
table.menu,
table {
    font-size: 12px;
}

table {
    border-collapse: separate;
    border-spacing: 0;
}

h1 {
	font-size: 18px;
}

h2 {
	font-size: 15px;
}

em.entryTip {
	font-size: 12px;
}

p {
	margin-bottom: 10pt;
}

/* Header overwrites */
.headerDiv {
    line-height: 1;
}

.headerDiv, .headerDiv * {
    box-sizing: content-box;
}

.headerDiv img {
    vertical-align: initial;
}

.headerDiv .headerTbl {
    width: 100%;
    background-color:#2653a2;
    border-radius: 6px;
}

.headerDiv .headerTbl .topSection {
    background-repeat:repeat-x;
    border-radius: 6px;
    margin-bottom: 1px;
}

.headerDiv .headerTbl .topSection #id_ot_logo {
    padding-left: 5px;
}

.topPartDiv, div.topPartDivLeft, div.topPartDivRight {
    font-size: 100%;
}

.headerDiv .headerTbl .sideGutter {
    margin-left: 5px;
}

.headerDiv .headerTbl .topPartLink:hover {
    background-color: inherit;
}

.headerDiv .headerTbl a.topPartLink:hover {
    background-color: white;
}

.vs-notify-container {
    border-collapse: separate;
    padding: 5px;
}

.vs-notify-msg {
    font-weight: bold;
    font-size: 1.2em;
}

.notification.notificationUnread {
    /* Unread news messages icon */
    box-sizing: content-box;
}

/* jQuery UI overwrites */
.ui-tabs .ui-tabs-nav {
    box-sizing: content-box;
    border-collapse: separate;
    margin-top: 3px;
}

.ui-corner-top a {
    box-sizing: content-box;
    border-collapse: separate;
}

.ui-dialog {
    line-height: inherit;
}

.ui-dialog label {
    margin-bottom: 0;
}

.ui-dialog-titlebar-close {
    /* jQuery UI conflicts with Bootstrap which causes missing close icon on dialogs */
    padding: 0 !important;
    border-radius: 5px;
    line-height: 1em;
}

.ui-dialog-titlebar-close:after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: '\f00d';
    display: inline-block;
}

.ui-button {
    outline: none !important;
}

/* Bootstrap tabs */

.tab-pane {
    padding-top: 1rem;
}

/* Footer overwrites */
.footer-end div {
    color: #62778E;
 }
 .footer-end div.copyright-notice {
     text-align: left;
 }
 .footer-end div.copyright-notice a {
    color: #62778E;
    text-decoration: none;
 }
 .footer-end div.copyright-notice a:visited {
    color: #62778E;
    text-decoration: none;
 }
 .footer-end div.copyright-notice a:hover {
    color: #62778E;
    text-decoration: underline;
 }
 .footer-end div.login-history {
     text-align: center;
 }
 .footer-end div.page-load {
     text-align: right;
     color: #62778E;
 }

 /* Main content */
 #vs-main-layout {
    padding-left: 0;
    padding-right: 0;
 }

/* Form fields */
form .vs-field-group .input-group .form-control {
    border-radius: .25rem !important;
}

form .input-group .form-control + .form-control {
    margin-left: .5rem;
    margin-right: .5rem;
}

form label {
    margin-bottom: .25rem;
}

form .input-group .form-control-plaintext,
.vs-form-field .form-control-plaintext {
    /* Match the style of normal .form-control input fields for read only fields */
    font-size: 1rem;
    color: #495057;
    padding: 0;
}

form .input-group .vs-phone-ext,
.vs-form-field .vs-phone-ext {
    /* For fields that have an input for a phone number and extension */
    /* Shrink the extension */
    max-width: 25%;
}

form .input-group a.form-control-plaintext {
    color: var(--primary-3);
    color: hsl(218.23, 62%, 39.22%);
}

/* Formset table */

tr.link-formset td {
    border: none;
}

/* Hover help */
.tooltip-inner p {
    /*Standard Bootstrap color of text within the tooltip text*/
    color:#fff;
}

.tooltip-inner > ul > li {
   text-align: left;
}

.hover-help-tool-tip {
    /* 11276 - IE specific issue where images are stretched if they are within flexboxes */
    align-self: center;
}

.tooltip {
    pointer-events: none;
  }

.tooltip-inner {
    max-width: 47vw;
}

@media screen and (max-width: 999px) {
    .tooltip-inner {
        max-width: 94vw;
    }
}

/* Datatables */
div.dataTables_length {
    float: left;
    padding-top: 0.45em;
}

div.dataTables_filter {
    float: right;
}

div.dataTables_paginate {
    float: right;
    padding-top: 0.25em;
}

div.DTTT {
    float: left;
    margin-right: 50px;
}

div.buttons {
    clear: both;
}

table.dataTable {
    border-spacing: 0;
}

table.dataTable th {
    padding: 5px;
    border: solid 1px #BBB;
}

table.dataTable th input, table.dataTable td input {
    display: table-cell;
    vertical-align: middle;
}

table.dataTable thead > tr > th.sorting_desc {
    padding-right: 30px;
  }

table.dataTable thead .sorting::before, table.dataTable thead .sorting::after,
table.dataTable thead .sorting_asc::before, table.dataTable thead .sorting_asc::after,
table.dataTable thead .sorting_desc::before, table.dataTable thead .sorting_desc::after,
table.dataTable thead .sorting_asc_disabled::before, table.dataTable thead .sorting_asc_disabled::after,
table.dataTable thead .sorting_desc_disabled::before, table.dataTable thead .sorting_desc_disabled::after {
    bottom: 6px !important;
}

div.dataTables_wrapper div.dataTables_processing {
    z-index: 1;
}

div.dataTables_wrapper .ui-button:not(:last-child), div.dataTables_wrapper span.grid-button-tooltip:not(:last-child) {
    margin-right: 5px;
}

div.dataTables_wrapper .ui-button:last-child {
    margin-right: 0;
}

/* Date fields */

.ui-datepicker-trigger {
    /* Fix stretched image caused by flexbox */
    align-self: center;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    /* Fix HTML5 date inputs not shrinking past a certain width in Chrome */
    margin-left: auto;
}

/* Buttons */
.btn.btn-primary, .btn.btn-secondary {
    /* Default all buttons to the vs-btn-classic style on admin interface */
    border: 1px solid var(--gray-5);
    border: 1px solid hsl(206, 11%, 71%);
    border-radius: 5px;
    color: var(--gray-1);
    color: hsl(217, 11%, 15%);
    background-color: var(--gray-7);
    background-color: hsl(217, 14%, 89%);
}

/* Give .form-control-plaintext the same layout as .form-control. This affects the placement of the hover help icon. */
.form-control-plaintext {
	flex: 1 1 auto;
}

/* Allow read only paragraphs to take more width */
p.form-control-plaintext {
    width: auto;
}

/* Overwrites for the Multipane select */
.ui-multiselect.ui-widget {
    display: flex;
    flex-wrap: wrap;
    border-style: none;
}
.ui-multiselect .ui-widget-content li {
    font-size: 12px;
}
.ui-multiselect .ui-widget-content .search {
    flex: 1 1 5em;
    min-width: 0;
    max-width: 20em;
    font-size: 12px;
    height: 20px;
    padding-left: 5px;
    padding-right: 5px;
}
.ui-multiselect .ui-widget-content.list-container {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--gray-6);
    border: 1px solid hsl(212, 13%, 83%);
    min-width: 0;
}
.ui-multiselect .ui-widget-content .actions {
    display: flex;
    flex-wrap: wrap;
    background: var(--gray-7);
    background: hsl(217, 14%, 89%);
    margin-bottom: 0;
}
.ui-multiselect .ui-widget-content .actions > a {
    /* Keep 'Add All' and 'Remove All' right-justified */
    margin-left: auto;
}
.ui-multiselect .ui-widget-content .list {
    flex-grow: 1;
    min-height: 40px;
    max-height: 150px;
}
.ui-multiselect .ui-widget-content .action {
    background: white;
    margin-right: 5px;
}
.ui-multiselect .ui-widget-content .action span {
    /* Vertically center icon */
    margin-bottom: 4px;
}
.ui-multiselect .ui-widget-content .ui-element {
    background: white;
    margin-bottom: 0;
    border-top: 1px solid var(--gray-9);
    border-top: 1px solid hsl(220, 13%, 95%);
    border-bottom: 1px solid var(--gray-9);
    border-bottom: 1px solid hsl(220, 13%, 95%);
}
.ui-multiselect .ui-widget-content .action.ui-state-hover,
.ui-multiselect .ui-widget-content .ui-element:hover {
    background: var(--gray-9);
    background: hsl(220, 13%, 95%);
}
.ui-multiselect .ui-widget-content .ui-multiselect-item-text {
    /* Add margin so text is truncated before the icon */
    margin-right: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* JSTree overwrites */

.dropdown-menu .jstree {
    /* Make font size more reasonable in trees that render in popup */
    font-size: 15px;
}

/* Popover Overwrites */
.popover {
    font-size: 12px;
}

/* Dropdown styles overwrite */
.dropdown-menu .dropdown-item.active, .dropdown-menu .dropdown-item:active {
    background-color: white;
    color: var(--gray-2);
    color: hsl(212, 9%, 23%);
    font-weight: bold;
}
