/* adapted from rrwebapp/style.css 12/07/17

/* override some JQuery theme information (prevents titlebar on dialog) */
.no-titlebar .ui-dialog-titlebar {
    display: none;
  }
  
  /* override JQuery.dataTables.yadcf class (prevents background on selected column filter) */
  .inuse {
    background: none;
  }
  
  /* override JQuery.dataTables padding for header */
  .dataTables_wrapper .ui-toolbar {
      padding: 4px;
  }
  
  /* any form error will be in red */
  div.DTE_Form_Error {
      color: red;
  }
  
  div.DTE_Field input[readonly="readonly"] {
      background-color: lightgray;
  }
  
  div.DTE_Field input._rsc_CRUD_input_short {
      width: 85%;
  }
  
  div.DTE_Body div.DTE_Body_Content div.DTE_Field.full > label {
      width: 50%;
  }
  
  /* jqueryui progressbar */
  .ui-progressbar {
    position: relative;
    z-index: 100
  }
  .progress-label {
    position: absolute;
    left: 50%;
    top: 4px;
    font-weight: bold;
    text-shadow: 1px 1px 0 #fff;
    z-index: 101
  }
  
  .body {
    font-family: Arial, Helvetica, sans-serif;
    text-align: left;
    margin: 5px;
    padding: 0;
    font-size: 0.8em;
    width: auto;
  }
  
  .body-printerfriendly {
    font-family: Arial, Helvetica, sans-serif;
    text-align: left;
    margin: 5px;
    padding: 0;
    position: absolute;
  /*  left: 10%; */
    padding-left:15px;
    padding-right:15px;
  /*  width:85%;  */
    float:left;
    font-size: 0.8em;
  }
  
  .pagename {
      text-align: center;
      background: #fafafa;
      text-transform: uppercase;
      margin: 0;
      font: bold 1em verdana,arial,sans-serif;
      color: #377ba8;
  }
  
  .DTED.ui-dialog {
    min-width: 600px;
  }
  
  .ui-widget h2 {
      font-family: Verdana,Arial,sans-serif;
  }
  
  
  /******************************************/
  /* editor field management                */
  /******************************************/
  .field_req label {
    font-weight: bold;
  }
  
  div.DTE_Field.editorFullWidthField > label.DTE_Label {
      display: none;
  }
  div.DTE_Field.editorFullWidthField > div.DTE_Field_Input {
      float: none !important;
      width: 100% !important;
  }
  .task_bold div.DTE_Field_Input {
    font-weight: bold;
  }
  
  .select-checkbox {
      display: none;
  }
  
  .body-printerfriendly {
    font-family: Arial, Helvetica, sans-serif;
    text-align: left;
    margin: 5px;
    padding: 0;
    position: absolute;
  /*  left: 10%; */
    padding-left:15px;
    padding-right:15px;
  /*  width:85%;  */
    float:left;
    font-size: 0.8em;
  }
  
  .noPrint {
    display: none;
  }
  
  .scrollarea {
    height:550px;
    width: 95%;
    overflow: auto; /* scroll */
  }
  
  .heading {
    font-family: Arial, Helvetica, sans-serif;
    text-align: left;
    margin: 0px;
    padding: 0;
    font-size: 1em;
  }
  
  div.wrapper div.Footer
  {
      border-top: 1px solid #336699;
      clear: both;
      height: 2em;
      margin-top: 2em;
      padding: 1em 0;
      vertical-align: top;
  }
  div.wrapper div.Footer div
  {
      float: right;
  }
  div.wrapper div.Footer span
  {
      margin: 0 1em;
  }
  div.wrapper div.Footer a
  {
      margin: 0 1em;
  }
  
  div.wrapper {
      width: 100%;
  }
  
  a, h1, h2       { color: #377ba8; }
  h1, h2          { font-family: Georgia, serif; margin: 0; }
  h1              { border-bottom: 2px solid #eee; }
  h2              { font-size: 1.2em; }
  
  .page           { margin: 2em auto; width: 35em; border: 1px solid #ccc;
                    padding: 0.8em; background: white; }
  .entries        { list-style: none; margin: 0; padding: 0; }
  .entries li     { margin: 0.8em 1.2em; }
  .entries li h2  { margin-left: -1em; }
  .add-entry      { font-size: 0.9em; border-bottom: 1px solid #ccc; }
  .add-entry dl   { font-weight: bold; }
  .pagename       { text-align: center; 
                    margin-bottom: 1em; background: #fafafa;
                    text-transform: uppercase;
                    margin: 0;
                    font: bold 1em verdana,arial,sans-serif;
                    color: #377ba8; font-weight: bold; }
  .metanav        { text-align: right; font-size: 0.8em;
                    padding-bottom: 0.3em; padding-right: 0.3em; 
                    margin-bottom: 1em; background: #fafafa; }
  .flash          { background: #cee5F5; padding: 0.5em;
                    border: 1px solid #aacbe2; }
  .error          { background: #f0d6d6; padding: 0.5em; }
  
  label
  {
      margin-right: 0.5em;
  }
  
  label.Label
  {
      display: inline-block;
      font-weight: bold;
      padding: 3px 2px 2px 2px;
      text-align: right;
  }
  .W7emLabel label.Label { width: 7em; }
  .W7emLabel .FieldDesc { margin-left: 8em; }
  
  .W9emLabel label.Label { width: 9em; }
  .W9emLabel .FieldDesc { margin-left: 10em; }
  
  .W11emLabel label.Label { width: 11em; }
  .W11emLabel .FieldDesc { margin-left: 13em; }
  .W11emLabel div.FormPanel div.FormValue { margin-left: 12em; }
  
  .W15emLabel label.Label { width: 15em; }
  .W15emLabel .FieldDesc { margin-left: 16em; }
  
  .W20emLabel label.Label { width: 20em; }
  .W20emLabel .FieldDesc { margin-left: 21em; }
  
  .PL20pxLabel label.Label {padding-left: 20px}
  
  .W9emTextBox input[type="date"],
  .W9emTextBox input[type="email"],
  .W9emTextBox input[type="text"],
  .W9emTextBox input[type="url"]
  {
      width: 9em;
  }
  
  .W15emTextBox input[type="date"],
  .W15emTextBox input[type="email"],
  .W15emTextBox input[type="text"],
  .W15emTextBox input[type="url"],
  .W15emTextBox input[type="password"]
  {
      width: 15em;
  }
  
  .W20emTextBox input[type="date"],
  .W20emTextBox input[type="email"],
  .W20emTextBox input[type="text"],
  .W20emTextBox input[type="url"],
  .W20emTextBox input[type="password"]
  {
      width: 20em;
  }
  
  .W25emTextBox input[type="date"],
  .W25emTextBox input[type="email"],
  .W25emTextBox input[type="text"],
  .W25emTextBox input[type="url"]
  {
      width: 25em;
  }
  
  .FloatLeft  { float: left; }
  .FloatRight { float: right; }
  .Hidden     { display: none; }
  .Bold       { font-weight: bold }
  
  .TextBottom { vertical-align: text-bottom; }
  .TextCenter { text-align: center; }
  .TextRight  { text-align: right; }
  .TextLeft  { text-align: left; }
  
  table.DataList
  {
      border-collapse: separate;
  }
  
  table.DataList td,
  table.DataList th,
  table.DataList tbody td,
  table.DataList thead th
  {
      /* padding: 1px 18px 1px 1px;  /* 18px required for dataTables sort icon */
      padding-top: 1px;
      padding-bottom: 1px;
  }
  table.PaddedDataList td,
  table.PaddedDataList th,
  table.PaddedDataList tbody td,
  table.PaddedDataList thead th
  {
      /*padding: 0.5em;*/
      padding-top: 0.5em;
      padding-bottom: 0.5em;    
  }
  table.SlightlyPaddedDataList td,
  table.SlightlyPaddedDataList th
  {
      /*padding: 3px;*/
      padding-top: 3px;
      padding-bottom: 3px;    
  }
  table.DataList th
  {
      background: linear-gradient(#F4F6F8, #E3E7ED) repeat scroll 0 0 transparent;
      background-color: #E3E7ED;
      border-bottom: 1px solid #CED4DC;
      cursor: default;
  }
  table.DataList td
  {
      vertical-align: top;
  }
  table.DataList img.icon
  { height: 1em; vertical-align: middle; text-align: center; }
  
  table.DataList a { display: block; text-decoration:none; }
  
  table.DataList tr:nth-child(even)
  {
      background-color: #F4F8FF;
  }
  table.DataList tr:nth-child(odd)
  {
      background-color: white;
  }
  
  table.DataList tr:hover .X
  {
      visibility: visible;
  }
  table.DataList tr:hover td
  {
      background-color: #ECF0FF;
      cursor: pointer;
  }
  
  /* datatables editor adjustments */
  div.DTE {
    font-size: 0.9em;
  }
  
  .ui-widget {    /* this also sets nav and metanav fonts */
    font-size: 0.9em;
  }
  
  /* fix labels on editor popups */
  div.DTE_Body div.DTE_Body_Content div.DTE_Field > label {
    margin-right: 0px;
  }
  
  #customForm fieldset {
      flex: 1;
      flex-direction: column;
  }
  
  div.row {
      display: flex;
      flex-flow: nowrap;
      padding-left: 5px;
  }
  
  div.DTE_Field.inhibitlabel > label {
    display: none;
    width: 0% !important;
  }
  
  div.DTE_Field.inhibitlabel > div.DTE_Field_Input {
    width: 100% !important;
  }
  
  /* dropdown and label */
  /* select2 - style the dropdown options - see select2-<ver>/css/select2.css for classes */
  .select2-dropdown {
      font-size: 0.8em;
      font-family: Arial, Helvetica, sans-serif;
  }
  label.interest-label {
      font-family: Verdana, Geneva, sans-serif;
      font-weight: bold;
  }
  /* jqueryui and dataTables selectize have conflict, this is needed to bring dataTables Editor selectize to front */
  div.selectize-dropdown {
    z-index: 102;
  }
  .select2-selection__rendered {
      text-align: left;
  }
  h1 .select2-selection__rendered {
      /* see h1 styling */
      color: #377ba8 !important;
  }
  
  /* mimic select2 sizing */
  .like-select2-sizing {
      /* match select2-container--default */
      background-color: white;
      border: 1px solid #aaa;
      border-radius: 4px;
      cursor: text;
      /* match select2-container */
      box-sizing: border-box;
      min-height: 32px;
  }
  
  /* hidden row display */
  table.dataTable tbody tr.hidden-row:not(.selected) {
      background-color: Peru;
  }
  
  /* yadcf display control */
  .yadcf-filter-range-date {
      min-height: 26px; /* somehow matches select2 min-height of 32px */
      border-radius: 4px;
  }

  /* allow version on same line as navigation */
  nav {
    display: inline;
  }

  /* display confirmed rows as green, should only happen in results view */
  table.dataTable tbody tr:has(.checkscanned)
  {
      background-color: #ffeb3b;  /*yellow https://www.w3schools.com/w3css/w3css_alerts.asp */
  }

  /* display confirmed rows as green, should only happen in results view */
  /* NOTE: putting this after table.dataTable tbody tr:has(.checkscanned) forces this to take precedence */
  table.dataTable tbody tr.confirmed
  {
      background-color: #99FF99;  /*green*/
  }

  /* scanned bib buttons */
  .scannedbib button {
    margin-right: 3px;
  }

  /* hide some features for small screens, match bootstrap breakpoint */
  @media screen and (max-width: 767.98px) {
      /* but this does not match bootstrap classes, see https://getbootstrap.com/docs/4.1/utilities/display/#hiding-elements */
      .hidden-sm-down {
          display: none;
      }
  }