:root {
  --theme-color-assent: #edede9;
  --theme-background: #f3f3f3;
  --theme-border-radius-none: 0;
  --theme-border-radius-small: 3px;
  --theme-border-radius-medium: 6px;
  --theme-border-radius-large: 9px;
  --theme-border-radius-circular: 100%;
  --theme-neutral-background: #f5f5f5;
  --theme-shell-toolbar: #354a5f;
  --theme-shell-text-color: #fff;
  --theme-shell-background: #edeff0;
  --theme-border-control: #a9b4be;
  --theme-subtitle-color: #8396a8;
  --theme-label-text-color: #8396a8;
  --theme-negative: #fa6161;
  --theme-critical: #ffdf72;
  --theme-positive: #97dd40;
  --theme-neutral: #a9b4be;
  --theme-info: #4db1ff;
  --theme-background-negative: #490000;
  --theme-background-critical: #382700;
  --theme-background-positive: #143e20;
  --theme-background-neutral: #242e38;
  --theme-background-info: #00144a;
  --theme-ui-indicator1: #fd3535;
  --theme-ui-indicator2: #ff8f8f;
  --theme-ui-indicator3: #ffc933;
  --theme-ui-indicator4: #bde986;
  --theme-ui-indicator5: #a6e0ff;
  --theme-ui-indicator6: #64edd2;
  --theme-ui-indicator7: #d3b6ff;
  --theme-ui-indicator8: #ff8af0;
  --theme-header1: 3rem;
  --theme-header2: 2rem;
  --theme-header3: 1.5rem;
  --theme-header4: 1.25rem;
  --theme-header5: 1rem;
  --theme-header6: 0.875rem; }

/*colors*/
/*base layout*/
* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

.ui.container:first-child {
  border: silver thin solid;
  overflow: hidden;
  height: 100vh;
  width: 100vw;
  -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15);
  box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.22) inset, 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15); }

*::-webkit-scrollbar {
  height: 5px;
  width: 5px; }

.shadow {
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); }

div.ui.menu {
  border-radius: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: none;
  border-bottom: var(--theme-border-control) thin solid;
  margin: 0; }
  div.ui.menu .item {
    color: var(--theme-label-text-color) !important; }
    div.ui.menu .item:before {
      background: none; }

div[desktop] {
  height: calc(100vh - 6.5rem);
  display: -ms-grid;
  display: grid;
  grid-gap: 1px;
  -ms-grid-columns: 0 234px 1fr;
  grid-template-columns: 0 234px 1fr;
  overflow: hidden; }
  div[desktop].closed {
    -ms-grid-columns: 0 0 1fr;
    grid-template-columns: 0 0 1fr; }
    div[desktop].closed div[aside] {
      overflow: hidden;
      display: none; }
    div[desktop].closed div[verticaltoolbar] {
      border-right: #cdcdcd thin solid; }

/*deprecade*/
div[verticaltoolbar] {
  -ms-grid-column: 1;
  grid-column: 1;
  border-right: #cdcdcd thin solid;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column; }
  div[verticaltoolbar] .verticaltoolbar-buttons {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1; }
  div[verticaltoolbar] .verticaltoolbar-buttons-extras {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none; }
  div[verticaltoolbar] .ui.button {
    background: transparent;
    border: none;
    border-radius: 0 !important;
    height: 64px; }

div[aside] {
  -ms-grid-column: 2;
  grid-column: 2;
  border-right: var(--theme-border-control) thin solid;
  padding: 2px 10px; }

div[content] {
  -ms-grid-column: 3;
  grid-column: 3;
  padding: 15px 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-flow: column;
  flex-flow: column;
  overflow-y: auto;
  background: rgba(255, 255, 255, 0.5); }
  div[content]::-webkit-scrollbar {
    width: 5px;
    background: transparent !important; }
  div[content]::-webkit-scrollbar-thumb {
    border-radius: 0;
    width: 1px;
    border: #c0c0c0 2px solid;
    background: -webkit-gradient(linear, left top, left bottom, from(#cdcdcd), color-stop(#c0c0c0), to(#cdcdcd));
    background: -webkit-linear-gradient(#cdcdcd, #c0c0c0, #cdcdcd);
    background: linear-gradient(#cdcdcd, #c0c0c0, #cdcdcd); }

div[toolbar] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
  div[toolbar] div {
    margin-right: 1rem; }

div[aside] .ui.list .item {
  height: 38px;
  line-height: 38px;
  padding: 0 0.3rem; }
  div[aside] .ui.list .item a {
    color: black; }
    div[aside] .ui.list .item a:visited {
      color: black; }
    div[aside] .ui.list .item a:hover {
      color: black; }

div[aside] .ui.list .item:hover, div[aside] .ui.list .item.active {
  border-radius: 3px;
  background: #eaeaea; }

div[aside] .ui.list .item.active:before {
  content: ' ';
  background: blue;
  left: 0;
  top: 33.3%;
  width: 2px;
  position: relative;
  height: 5px; }

table.ui.table {
  border: silver thin solid; }
  table.ui.table td, table.ui.table th {
    padding: 2px 5px; }
  table.ui.table th {
    text-align: center;
    text-transform: uppercase;
    background: #EBEBEB;
    padding: 3px 0; }
  table.ui.table tr:hover {
    background: whitesmoke; }
  table.ui.table td {
    /*parche para terminar en ellipsis*/
    white-space: nowrap;
    min-width: 200px; }
    table.ui.table td .cell-text-center {
      text-align: center; }
    table.ui.table td .cell-text-rigth {
      text-align: right; }
    table.ui.table td .centered {
      text-align: center; }
    table.ui.table td .ui.dropdown {
      padding: 0;
      margin: 0; }
    table.ui.table td .ui.label {
      margin: 0;
      height: 100%; }
  table.ui.table tbody tr td input {
    border: #cdcdcd thin solid;
    padding: 5px;
    border-radius: 3px;
    line-height: 18px; }
  table.ui.table tfoot tr {
    background: #f0f0f0; }
    table.ui.table tfoot tr:first-child {
      border-top: silver thin solid; }

.wide-1 {
  width: 100px !important; }

.wide-2 {
  width: 200px !important; }

.wide-3 {
  width: 300px !important; }

.wide-4 {
  width: 400px !important; }

.wide-5 {
  width: 500px !important; }

.wide-6 {
  width: 600px !important; }

.wide-7 {
  width: 700px !important; }

.wide-8 {
  width: 800px !important; }

.wide-9 {
  width: 900px !important; }

.wide-10 {
  width: 1000px !important; }

.v-table {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  background: white;
  padding: 6px;
  border: 1px solid #ccc;
  border-radius: 5px; }
  .v-table .v-table-container {
    -webkit-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0; }
    .v-table .v-table-container table {
      border-collapse: collapse;
      width: 100%; }
      .v-table .v-table-container table thead th {
        padding: 6px;
        font-weight: bolder;
        text-transform: uppercase; }
      .v-table .v-table-container table thead th:not(:last-child) {
        border-right: 1px solid lightgray; }
      .v-table .v-table-container table tbody td {
        padding: 6px;
        white-space: nowrap;
        border-bottom: 1px solid lightgray; }
      .v-table .v-table-container table tbody tr:hover {
        background: #f5f5f5; }

div[aside] .ui.list .item.active {
  color: green;
  font-weight: bold; }
  div[aside] .ui.list .item.active i {
    color: green; }

.number {
  font-weight: bolder;
  font-size: 36px;
  float: right; }

.ui.input {
  border-radius: 0 !important; }

input[type=date], input[type=time], input[type=datetime-local] {
  padding: 7px !important; }

div[desktop-login] {
  display: -ms-grid;
  display: grid;
  background: #6D6D6D;
  place-content: center;
  width: 100vw;
  height: calc(100vh - 3.6rem);
  overflow: hidden; }

.screen-w {
  width: 100vw; }

.screen-h {
  height: 100vh; }

.grid-centered {
  display: -ms-grid;
  display: grid;
  place-content: center; }

.flex-centered {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  place-content: center; }

.flex-spaced {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  place-content: space-between; }

.flex-around {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  place-content: space-around; }

.border-top {
  border-top: #cdcdcd thin solid; }

.mt-1 {
  margin-top: 1px; }

.mt-2 {
  margin-top: 2px; }

.mt-3 {
  margin-top: 3px; }

.mt-4 {
  margin-top: 4px; }

.mt-5 {
  margin-top: 5px; }

.mt-10 {
  margin-top: 10px; }

a {
  cursor: pointer; }

.ui.tab {
  padding: 1rem 0; }

.ui.tabular.menu .item.active {
  border-top: #c0c0c0 2px solid; }

/*window style*/
/* Color */
:root {
  --surface: #c0c0c0;
  --button-highlight: #ffffff;
  --button-face: #dfdfdf;
  --button-shadow: #808080;
  --window-frame: #0a0a0a;
  --dialog-blue: #000080;
  --dialog-blue-light: #1084d0;
  --dialog-gray: #808080;
  --dialog-gray-light: #b5b5b5;
  --link-blue: #0000ff; }

div[window] {
  -webkit-box-shadow: var(--border-window-outer), var(--border-window-inner);
  box-shadow: var(--border-window-outer), var(--border-window-inner);
  background: var(--surface);
  padding: 3px; }
  div[window] div[titlebar] {
    font-family: "Pixelated MS Sans Serif", Arial;
    -webkit-font-smoothing: none;
    font-size: 11px;
    background: -webkit-gradient(linear, left top, right top, from(var(--dialog-blue)), to(var(--dialog-blue-light)));
    background: -webkit-linear-gradient(left, var(--dialog-blue), var(--dialog-blue-light));
    background: -o-linear-gradient(left, var(--dialog-blue), var(--dialog-blue-light));
    background: linear-gradient(90deg, var(--dialog-blue), var(--dialog-blue-light));
    padding: 3px 2px 3px 3px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: bold;
    color: white;
    letter-spacing: 0; }

.resultados {
  position: absolute;
  left: 0;
  top: 100%;
  max-height: 72px;
  z-index: 100;
  overflow-y: auto;
  padding: 5px;
  width: 100%;
  background: white;
  border: #cdcdcd thin solid;
  border-radius: 0; }
  .resultados .ui.list .item {
    text-align: left; }

.toolbar {
  border-radius: 5px;
  border: thin solid rgba(192, 192, 192, 0.5);
  padding: 2px;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, transparent), to(white));
  background: -webkit-linear-gradient(top, transparent 50%, white);
  background: -o-linear-gradient(top, transparent 50%, white);
  background: linear-gradient(to bottom, transparent 50%, white); }

.chart-kpi {
  width: 200px;
  height: 100px;
  border-radius: 3px;
  border: 1px solid #ccc;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 0.3rem; }
  .chart-kpi span {
    font-size: 24px;
    font-weight: bolder; }

.d-options-bar {
  z-index: 100;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
  .d-options-bar .extras {
    border: silver thin solid;
    border-radius: 3px;
    padding: 1.3rem;
    background: white;
    -webkit-transform: translateX(-25%);
    -ms-transform: translateX(-25%);
    transform: translateX(-25%);
    position: absolute;
    z-index: 10;
    top: 100%;
    left: 0;
    min-width: 800px;
    -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.14);
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.14); }
    .d-options-bar .extras.hidden {
      display: none; }
    .d-options-bar .extras .title {
      line-height: 24px;
      margin-bottom: 1rem; }
    .d-options-bar .extras .actions {
      margin-top: 0.6rem;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
      flex-direction: row-reverse; }

i.icons {
  cursor: pointer; }
  i.icons:hover {
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2); }

.conexiones_contador {
  position: relative;
  text-align: center;
  margin: 5px; }

.conexiones_contador_dialog {
  min-width: 250px;
  position: absolute;
  z-index: 10;
  bottom: 0.5rem;
  background: white;
  padding: 10px;
  border: silver thin solid;
  border-radius: 3px;
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  left: 130%; }
  .conexiones_contador_dialog .ui.list .item {
    text-align: left; }
  .conexiones_contador_dialog .conexiones_contador_dialog_title {
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 0.5rem; }
  .conexiones_contador_dialog .conexiones_contador_dialog_content {
    font-size: 1rem;
    margin: 0.5rem 0 0.5rem 0;
    padding: 5px; }
  .conexiones_contador_dialog .conexiones_contador_dialog_extra {
    height: 16px;
    color: steelblue; }
    .conexiones_contador_dialog .conexiones_contador_dialog_extra .button {
      display: inline-block; }

.toolbar {
  -webkit-box-shadow: rgba(205, 205, 205, 0.5) 1px 1px 1px;
  box-shadow: rgba(205, 205, 205, 0.5) 1px 1px 1px; }
  .toolbar:before {
    content: '';
    border-right: silver 1px dotted;
    border-left: silver 1px dotted;
    margin-right: 6px; }

#app {
  background: var(--theme-shell-background); }
  #app .ui.container .ui.menu {
    background: var(--theme-subtitle-color) !important; }
  #app footer {
    color: var(--theme-label-text-color);
    border-top: var(--theme-border-control) thin solid;
    line-height: 1rem;
    padding: 5px; }

/*controls*/
.v-table {
  -webkit-box-flex: 1;
  -ms-flex: 1 0 auto;
  flex: 1 0 auto; }

.v-desktop-content {
  margin-top: 3px;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: auto; }