:root {
  --font-family: apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
  --default-color: #494646;
  --dark-bg-color: #4185b6; /* old thead */
  --dark-bg-text-color: #ffffff;
  --form-text-color: #4185b6;
  --form-bg-color: #f6f9fc;
  --button-text-color: #2143a6;
  --button-bg-color: #bcd1e1;
  --label-bg-color: #c4d0df; /* old tfoot bg */
  --label-text-color: #2143a6;
  --field-color: #000000;
  --field-disabled-color: #808080;
  --field-required-color: #ffdddd;
  --field-bg-color: #ffffff;
  --tab-inactive-bg-color: #cccccc;
  --tab-inactive-border-color: #cccccc;
  --tab-border-color: #cccccc;
  --tab-text-color: #666666;
  --tab-bg-color: #e3e8ec;
  --table-even-bg-color: #ffffff;
  --table-odd-bg-color: #f6f9fc; /* old stripe odd */
  --table-selected-bg-color: #b0bed9; /* old selected */
  --table-hover-bg-color: #66ccff; /* legacy hover */
  --table-hover-color: #2143a6;
  --dt-row-stripe: 246, 249, 252; /* #f6f9fc */
  --dt-row-hover: 102, 204, 255; /* #66ccff */
  --dt-row-selected: 176, 190, 217; /* #b0bed9 */
  --dt-column-ordering: 234, 242, 249; /* #eaf2f9 */

  --dt-row-stripe-alpha: 1;
  --dt-row-hover-alpha: 1;
  --dt-row-selected-stripe-alpha: 1;
  --dt-row-selected-column-ordering-alpha: 1;
  --dt-header-align-items: center;
  --dt-header-vertical-align: middle;
  --table-sort-color: #eaf2f9;
}

/* DT2 default nemění hover text jako starý skin -> doplnit ručně */
table.dataTable.hover > tbody > tr:hover > *,
table.dataTable.display > tbody > tr:hover > * {
  color: var(--table-hover-color);
}
  
div.h1 {
  height: 45px;
  line-height: 45px;
  z-index: 10;
  vertical-align: text-bottom;
  overflow: hidden;
  white-space: nowrap;
  FONT-WEIGHT: bold;
  FONT-SIZE: 1.4em;
  COLOR: #314268;
  LETTER-SPACING: 1pt;
}

  div.h1 > img {
    padding: 0 10px 0 10px;
  }

@media screen and (min-width: 600px) {
  div.h1::after {
    content: 'Doodles';
    height: 45px;
    width: 158px;
    float: right;
    padding-right: 20px;
    background-color: var(--dark-bg-text-color);
  }
}

  fieldset, input, select {
    border: var(--dark-bg-color) 1px solid;
  }

  legend {
    color: var(--dark-bg-color);
  }

  div.edit > div:nth-child(1),
  label, div.label {
    color: var(--label-text-color) !important;
  }

  div.edit > div:nth-child(1), div.label {
    background-color: var(--label-bg-color);
  }

  h1, h2, h3 {
    color: var(--dark-bg-color);
  }

  div.edit > div:nth-child(1n)[colspan],
  table.edit > tbody > tr > td:nth-child(1) {
    background-color: var(--label-bg-color);
    color: var(--label-text-color) !important;
  }

  .ui-dialog-custom-title {
    background: var(--dark-bg-color);
    color: var(--dark-bg-text-color);
  }

  .list-file:hover, .list-file-container input:checked ~ .list-file {
    background-color: var(--dark-bg-color);
  }

/*  table.dataTable thead td, .list-file:hover, .list-file-container input:checked ~ .list-file, span.header, table.ajax thead td, table.striped thead td, tr.thead td, .thead > div, span.header,
  table.ajax thead tr, table.striped thead tr,
  tr.thead {
    background-color: var(--dark-bg-color) !important;
    color: var(--dark-bg-text-color);
  }*/

  #control_contextmenu ul li.selected,
  #control_contextmenu ul li:hover {
    color: var(--field-color);
    background-color: var(--dark-bg-color);
  }