:root {
  /* font defaults */
  --font-family-default: var(
    --default-font-family,
    -apple-system,
    BlinkMacSystemFont,
    'GE Inspira Sans',
    'Segoe UI',
    'Roboto',
    'Oxygen',
    'Ubuntu',
    'Fira Sans',
    'Droid Sans',
    'Helvetica Neue',
    sans-serif
  );
  --default-font-size: 0.85rem;
  --default-font-weight: 400;
  --font-weight-bold: 600;

  --text-color: #2c404c;
  --secondary-text-color: #ffffff;
  --primary-color: #0582c5;
  --secondary-color: #d8e0e5;
  --text-secondary-color: #889aa5;

  --cb-component-padding: 0px;

  --cb-default-bg-color: #ffffff;
  --cb-default-box-shadow: 0 0 0 2px #2c404c;
  --cb-default-border-color: #889aa5;
  --cb-default-border-radius: 0;

  --cb-default-button-bg-color: var(--secondary-color, #d8e0e5);
  --cb-button-hover-bg-color: #a3b5bf;
  --cb-button-active-bg-color: #889aa5;
  --cb-default-button-height: 34px;
  --cb-default-button-icon-width: 34px;
  --cb-disabled-button-color: rgba(136, 154, 165, 0.5);

  --cb-default-text-field-bg-color: transparent;
  --cb-text-field-hover-bg-color: #d8e0e5;
  --cb-text-field-focus-bg-color: #eefbff;

  --cb-default-icon-color: #2c404c;
  --cb-icon-hover-color: var(--primary-color, #0582c5);
  --cb-icon-button-box-shadow: none;
  --cb-tree-button-focus: inset 0 0 0 0.1rem rgba(0, 123, 255, 0.25);

  --cb-checkbox-cursor: pointer;
  --cb-default-checkbox-bg-color: var(--secondary-color, #d8e0e5);
  --cb-checkbox-hover-bg-color: var(--cb-button-hover-bg-color, #a3b5bf);
  --cb-checkbox-checked-bg-color: var(--primary-color, #0582c5);
  --cb-default-checkbox-border: 1px solid #9098a9;
  --cb-checkbox-checked-border-color: var(--primary-color, #0582c5);
  --cb-checkbox-disabled-border-color: rgba(0, 0, 0, 0.08);
  --cb-checkbox-border-radius: 20%;
  --cb-checkbox-box-shadow: 0 0 0 1px rgba(5, 130, 197, 0.1);
  --cb-checkbox-icon-transition: all 0.3s ease;
  --cb-checkbox-icon-transition-delay: 0.1s;
  --cb-checkbox-icon-transform: translate3d(0, 0, 0);
  --cb-checkbox-checked-animation: wave 0.4s ease;
  --cb-checkbox-icon-checked-transition: all 0.6s ease;

  /* flex defaults */
  --cb-dropdowns-flex-direction: row;
  --cb-dropdowns-align-items: center;

  /* Common styles for dropdown */
  --cb-dd-height: var(--cb-default-button-height, 34px);
  --cb-dd-item-padding: 0 10px;
  --cb-dd-default-bg-color: var(--cb-default-button-bg-color, #d8e0e5);
  --cb-dd-hover-bg-color: var(--cb-button-hover-bg-color, #a3b5bf);
  --cb-dd-active-bg-color: var(--cb-button-active-bg-color, #889aa5);
  --cb-dd-text-color: var(--text-color, #2c404c);
  --cb-dd-list-items-max-height: 200px;

  /* #1 Select type dropdown Component*/
  --cb-type-dd-margin: 0 10px 5px 0;
  --cb-type-dd-width: 200px;
  --cb-type-width: 100%;

  /* 2 Select Source Dropdown Component*/
  --cb-source-dd-margin: 0 0 5px 0;
  --cb-data-source-dd-width: 200px;
  --cb-ds-wrapper-width: 100%;
  --cb-source-dd-width: 200px;

  /* 3 Search Source button */
  --cb-search-source-button-margin: 0 0 0 5px;
  --cb-search-source-button-default-bg-color: var(
    --cb-default-button-bg-color,
    var(--secondary-color, #d8e0e5)
  );
  --cb-search-source-button-hover-bg-color: var(
    --cb-button-hover-bg-color,
    #a3b5bf
  );
  --cb-search-source-button-active-bg-color: var(
    --cb-button-active-bg-color,
    #889aa5
  );
  --cb-search-source-button-height: var(--cb-default-button-height, 34px);
  --cb-search-source-button-width: var(--cb-button-icon-default-width, 34px);

  /* 4 Search Field component*/
  --cb-search-field-margin: 0;
  --cb-search-field-padding: 0;
  --cb-search-field-default-bg-color: var(
    --cb-text-field-default-bg-color,
    transparent
  );
  --cb-search-field-hover-bg-color: var(
    --cb-text-field-hover-bg-color,
    #d8e0e5
  );
  --cb-search-field-focus-bg-color: var(
    --cb-text-field-focus-bg-color,
    #eefbff
  );
  --cb-search-field-border-top: none;
  --cb-search-field-border-right: none;
  --cb-search-field-border-bottom: 1px solid
    var(--cb-default-border-color, #889aa5);
  --cb-search-field-border-left: none;
  --cb-search-field-focus-border-color: var(--primary-color, #0582c5);
  --cb-search-field-height: 34px;
  --cb-search-field-width: auto;
  --cb-search-field-clear-icon-hover-color: #ff4a4a;
  --cb-search-field-search-btn-bg: none;
  --cb-search-field-search-btn-border: none;
  --cb-search-field-text-padding: 0 0 0 10px;
  --cb-search-field-text-min-height: 24px;
  --cb-search-highlight-bg-color: rgba(255,212,0,0.61961);

  /* 5 List-view component */
  --cb-list-items-margin: 0;
  --cb-list-items-border: none;
  --cb-list-items-height: calc(100% - 120px);
  --cb-list-items-max-height: calc(100vh - 173px);
  --cb-list-items-min-height: 100px;
  --cb-list-items-overflow: auto;
  --cb-selectable-list-item-margin: 0;
  --cb-list-item-padding: 0 0 0 10px;
  --cb-list-item-height: 34px;
  --cb-flat-list-item-height: var(--cb-list-item-height, 34px);
  --cb-list-item-cursor: auto;
  --cb-list-item-default-bg-color: transparent;
  --cb-list-item-hover-bg-color: #ebeff2;
  --cb-list-item-checked-bg-color: var(--secondary-color, #d8e0e5);
  --cb-tree-offset: 16px;
  --cb-list-item-description-size: 12px;
  --cb-list-item-description-color: #777a7d;
  --cb-list-item-content-width: auto;
  --cb-tree-items-height: 400px;

  --cb-tree-items-min-height: 400px;

  /*6 OPCUA browse component*/
  --cb-OPCUA-checkbox-font-size: 9px;

  /* 7 Pagination Component*/
  /* --cb-pagination-margin: 0;
  --cb-pagination-content-padding: 0 5px 0 5px;
  --cb-pagination-bg: transparent;
  --cb-pagination-border: none;
  --cb-pagination-text-color: var(--text-color, #2c404c);
  --cb-pagination-input-border: 1px solid
    var(--cb-default-border-color, #889aa5);
  --cb-pagination-input-width: 34px;

  /* lumo variables */
  --lumo-border-radius: 0;
  --lumo-disabled-text-color: rgba(28, 52, 84, 0.74);

  /* loader  */
  --linear-loader-bg-color: rgba(0, 126, 193, 0.2);
  /* Scroll behavior */
  --default-scroll-behavior: smooth;
}
opcua-browse {
  height: calc(100% - 40px);
}
/* @import url('normalize.css'); */
/* Document level adjustments */
html {
  font-size: 17px;
}
common-browser {
  font-family: -apple-system,
    BlinkMacSystemFont,
    'GE Inspira Sans',
    'Segoe UI',
    'Roboto',
    'Oxygen',
    'Ubuntu',
    'Fira Sans',
    'Droid Sans',
    'Helvetica Neue',
    sans-serif
  ;
  font-family: -apple-system,
    BlinkMacSystemFont,
    'GE Inspira Sans',
    'Segoe UI',
    'Roboto',
    'Oxygen',
    'Ubuntu',
    'Fira Sans',
    'Droid Sans',
    'Helvetica Neue',
    sans-serif
  ;
  font-family: var(--font-family-default);
  font-size: 1rem;
  font-weight: 400;
  font-weight: 400;
  font-weight: var(--default-font-weight, 400);
  line-height: 1.4;
  color: #2c404c;
  color: #2c404c;
  color: var(--text-color);
}
@media (max-width: 900px) {
  html {
    font-size: 15px;
  }
}
@media (max-width: 400px) {
  html {
    font-size: 13px;
  }
}
body {
  background: rgb(243, 243, 243);
}
common-browser {
  padding: 0px;
  padding: 0px;
  padding: var(--cb-component-padding, 20px);
  display: flex;
  background: #ffffff;
  background: #ffffff;
  background: var(--cb-default-bg-color, #ffffff);
  flex-direction: column;
  min-height: 300px;
  min-width: 400px;
  overflow: auto;
  scroll-behavior: smooth;
  scroll-behavior: smooth;
  scroll-behavior: var(--default-scroll-behavior, auto);
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
loader-component {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: center;
}


/*# sourceMappingURL=common-browse-styles.css.map*/