/**
 * Trustwave Global Colors
 */
:root {
  /* Primary Colors */

  --tw-primary-one: #1e2327; /* header bg color */
  --tw-primary-two: #171d22; /* page bg color */
  --tw-primary-three: #2f393f; /* secondary nav color */
  --tw-primary-four: #272d32; /* panel bg color */
  --tw-primary-five: #1a2227; /* table header */
  --tw-primary-six: #494e54; /* input bg color */
  --tw-primary-seven: #2f393f; /* table bg color */
  --tw-primary-eight: #141517 !important; /* selection color */
  --tw-primary-nine: #66c2ad; /* selected color */

  /*--tw-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";*/
  --tw-font-family: "Roboto", Tahoma, Geneva, Verdana, sans-serif;
  --tw-dashboard-add-color: var(--tw-hover-bg-color);
  --tw-dashboard-add-hover-color: var(--tw-alt-text-color);

  /* Main Colors */
  --tw-focus-bg-color: var(--tw-primary-eight);
  --tw-hover-bg-color: var(--tw-primary-eight);
  --tw-panel-border-color: var(
    --tw-page-bg-color
  ); /* #9a9a9a;  changed for dark mode */
  --tw-text-color: #efefef; /* changed for dark mode */
  --tw-page-bg-color: var(--tw-primary-two); /* changed for dark mode */
  --tw-panel-bg-color: var(--tw-primary-four); /* changed for dark mode */
  --tw-bg-color: #1e1e1e !important; /* changed for dark mode */ /*drop down background color*/
  --tw-alt-bg-color: #2d2c2c; /* changed for dark mode */
  --tw-disabled-bg-color: rgba(55, 65, 74, 0.4); /* changed for dark mode */
  --tw-resize-handle-color: #6f6f6f; /* changed for dark mode */
  --tw-secondary-text-color: #8c8c8c;
  --tw-disabled-color: #999;

  --tw-primary-color: #008fc5;

  --tw-accent-color: #008fc5;
  --tw-focus-color: #177ec7;
  --tw-hover-color: #3cb6e3;
  --tw-on-color: #ff982c;
  --tw-error-color: #e66360 !important;
  --tw-error-text-color: #ffffff;

  --tw-border-color: #9a9a9a;

  --tw-material-underline-color: #e1e0e0;
  --tw-material-caret-color: #868686;
  --tw-watermark-opacity: 0.3;

  /* Positive/Negative Colors */
  --tw-positive-color: #54b95b;
  --tw-negative-color: #d90b0b;

  /* -severity, Risk & Confidence Colors */
  --tw-unknown-severity-color: #a4a4a4;
  --tw-info-severity-color: #177ec7;
  --tw-low-severity-color: #e1d041;
  --tw-medium-severity-color: #fd9700;
  --tw-high-severity-color: #d90b0b;
  --tw-critical-severity-color: #7a0256;

  --tw-unknown-confidence-color: var(--tw-unknown-severity-color);
  --tw-no-confidence-color: #44c767;
  --tw-low-confidence-color: var(--tw-low-severity-color);
  --tw-medium-confidence-color: var(--tw-medium-severity-color);
  --tw-high-confidence-color: var(--tw-high-severity-color);
  --tw-ultra-confidence-color: var(--tw-critical-severity-color);

  /* Progress Colors */
  --tw-not-started-color: #d90b0b;
  --tw-in-progress-color: #fd9700;
  --tw-completed-color: #54b95b;

  /* Chart Colors */
  --tw-chart-color-1: #0081de;
  --tw-chart-color-2: #54b95b;
  --tw-chart-color-3: #ffa100;
  --tw-chart-color-4: #ffd700;
  --tw-chart-color-5: #57b6b7;
  --tw-chart-color-6: #e34def;
  --tw-chart-color-7: #ff4500;
  --tw-chart-color-8: #6a3adb;

  /* Timeframe Colors */
  --tw-timeframe-color-1: #0d47a1;
  --tw-timeframe-color-2: #1976d2;
  --tw-timeframe-color-3: #2196f3;
  --tw-timeframe-color-4: #64b5f6;
  --tw-timeframe-color-5: #bbdefb;

  /**
     * Drawer
     */
  --tw-drawer-bg-color: var(--tw-panel-bg-color);
  --tw-drawer-border-color: rgba(255, 255, 255, 0.2);

  /**
     * Checkbox
     */

  --tw-checkbox-checked-color: var(--tw-primary-nine);

  --tw-spinner-color: var(--tw-primary-color);

  /**
     * Buttons
     */

  /* Primary */
  --tw-button-primary-bg-color: #37414a;
  --tw-button-primary-text-color: #ffffff;
  --tw-button-primary-hover-bg-color: #45535f;
  --tw-button-primary-hover-color: #ffffff;
  --tw-button-primary-border-color: #000;

  --tw-button-primary-hover-border-color: #000;
  --tw-button-primary-hover-text-color: #ffffff;

  --tw-button-primary-disabled-color: #dbdbdb;
  --tw-button-primary-disabled-bg-color: #b8b7b8;
  --tw-button-primary-disabled-border-color: #000;

  /* Secondary */
  --tw-button-secondary-bg-color: #565f67;
  --tw-button-secondary-text-color: #ffffff;
  --tw-button-secondary-hover-bg-color: #616c75;
  --tw-button-secondary-hover-color: #ffffff;
  --tw-button-secondary-border-color: #000;

  --tw-button-secondary-hover-border-color: #000;
  --tw-button-secondary-hover-text-color: #fffff;

  --tw-button-secondary-disabled-color: #b8b7b8;
  --tw-button-secondary-disabled-bg-color: #fffefe;
  --tw-button-secondary-disabled-border-color: #000;

  --tw-button-error-border-color: #9a9a9a;
  --tw-button-error-bg-color: #fffefe;
  --tw-button-error-text-color: #141414;
  --tw-button-error-hover-color: #eeeeee;

  --tw-button-success-border-color: #000;
  --tw-button-success-bg-color: #fffefe;
  --tw-button-success-text-color: #141414;
  --tw-button-success-hover-color: #eeeeee;
  --tw-button-success-hover-text-color: #141414;

  --tw-button-waiting-spinner-color: var(--tw-spinner-color);
  --tw-button-secondary-waiting-spinner-color: var(--tw-spinner-color);
  --tw-button-icon-waiting-spinner-color: var(--tw-spinner-color);

  /**
     * Fusion Message Variables
     */

  --tw-fusion-message-background: var(--tw-panel-bg-color);
  --tw-fusion-message-text-color: var(--tw-text-color);
  --tw-fusion-info-color: var(--tw-blue-color);
  --tw-fusion-warning-color: var(--tw-yellow-color);
  --tw-fusion-alert-color: var(--tw-red-color);

  /**
     * new  colors  for 2021 change
     */

  --tw-label-color: #9ca2a7;
  --tw-title-color: var(--tw-text-color);
  --tw-form-label-color: var(--tw-label-color);
  --tw-form-header-color: var(--tw-text-color);

  --tw-callout-border-color: transparent;

  /* INPUTS */
  --tw-input-border-color: transparent;
  --tw-input-button-border-color: transparent;
  --tw-select-dropdown-border-color: #000;
  --tw-select-background-color: #37414a;
  --tw-select-dropdown-boder: 1px solid transparent;
  --tw-input-bg-color: var(--tw-primary-six);
  --tw-input-focus-color: transparent; /*var(--tw-focus-color);*/
  --tw-input-border-focus: 1px solid var(--tw-input-focus-color);

  /* ICON BUTTON */
  --tw-icon-button-color: var(--tw-secondary-text-color); /* dark mode change */
  --tw-icon-button-hover-border-color: transparent; /*var(--tw-border-color);*/
  --tw-icon-button-hover-bg-color: transparent;

  --tw-dialog-title-color: var(--tw-title-color);

  /**
     * Portal Chrome Variables
     */

  --tw-header-bg-color: var(--tw-primary-one); /* changed for dark mode */

  --tw-header-nav-text: #9ca2a7; /* #414040; text under icons color */
  --tw-header-navicon-color: #9ca2a7; /* #6c6c6c header module icon color */
  --tw-header-nav-selected-color: #efefef; /* changed for dark mode */
  --tw-header-nav-hover-color: #efefef; /* changed for dark mode */
  --tw-header-nav-hover-bg-color: rgba(255, 255, 255, 0.1);
  /*
     * secondary nav background color
     * var(--tw-panel-bg-color);
     *
    */
  --tw-secondary-nav-bg-color: var(
    --tw-primary-three
  ); /* changed for dark mode */
  --tw-secondary-nav-text-color: #9ca2a7; /*var(--tw-text-color);*/
  --tw-secondary-nav-selected-color: var(
    --tw-text-color
  ); /* changed for dark mode */
  --tw-secondary-nav-hover-color: var(
    --tw-text-color
  ); /* changed for dark mode */
  --tw-secondary-module-name: var(--tw-text-color); /* changed for dark mode */

  /*
     * New Nav Colors
     */
  --tw-username-label-color: #9ca2a7;

  --tw-nav-module-color: #9ca2a7;
  --tw-nav-module-hover-color: #ffffff;
  --tw-nav-moudule-separtor-color: hsla(
    0,
    0%,
    93.3%,
    0.18
  ); /*var(--tw-border-color);*/

  --tw-nav-menu-text-color: #9ca2a7;
  --tw-nav-menu-text-hover-color: var(--tw-text-color);
  --tw-nav-menu-selected-background-color: transparent;
  --tw-nav-menu-selected-text-color: #ffffff;
  --tw-nav-menu-small-roll-over-color: var(--tw-primary-eight);

  --tw-org-selector-side-label-color: #9ca2a7;
  --tw-org-selector-top-label-color: var(--tw-text-color);

  /*
     * Toogle Button
     */

  --tw-toogle-bg-color: var(--tw-primary-nine);

  /*
     * Nav Menus Dropdowns
     */

  --tw-nav-menu-bg-hover-color: var(--tw-primary-color);
  --tw-nav-menu-bg-color: var(--tw-page-bg-color);

  --tw-header-seperator-color: #ffffff; /*var(--tw-border-color);*/

  --tw-launch-area-border-color: #eeeeee; /* launch area light border color */
  --tw-launch-area-bg-color: #5f5f5f; /* changed for dark mode */

  --tw-alt-text-color: #ffffff; /* used for when background is solid color or hovers */

  /**
     * Datagrid
     */

  --tw-datagrid-hover-color: var(
    --tw-hover-bg-color
  ); /* #0D293E;  #383837;  changed for dark mode var(--tw-hover-bg-color) */
  --tw-datagrid-selected-color: var(
    --tw-focus-bg-color
  ); /* #0D293E;  #5f5f5f;  changed for dark mode var(--tw-focus-bg-color) */
  --tw-datagrid-focus-color: var(
    --tw-focus-color
  ); /* changed for dark mode var(--tw-focus-color) */
  --tw-datagrid-row-separator-color: transparent;
  --tw-datagrid-border-color: var(--tw-border-color);

  --tw-table-header-color: var(--tw-text-color);
  --tw-table-title-color: var(--tw-text-color);

  --tw-table-header-border-top: 1px solid transparent; /* transparent;*/
  --tw-table-header-border-bottom: 1px solid transparent; /* rgba(0, 0, 0, .5); */

  --tw-table-header-bg-color: var(
    --tw-primary-five
  ); /*var(--tw-page-bg-color);*/
  --tw-table-column-border-right: 1px solid rgba(0, 0, 0, 0.5);

  --tw-table-grid-bg-color: var(--tw-primary-seven);

  --tw-table-row-bottom-border: 0px solid var(--tw-datagrid-row-separator-color);

  --tw-table-expansion-bg-color: var(--tw-page-bg-color);

  --tw-expand-handle-bg-color: rgba(192, 194, 196, 0.4);
  --tw-table-reorder-start-color: rgba(255, 255, 255, 0.1);
  --tw-table-drag-color: rgba(154, 154, 154, 0.9);
  --tw-table-reorder-drop-color: var(--tw-primary-nine);

  /**
     * Datalist
     */

  --tw-datalist-row-separator-color: var(--tw-panel-border-color);

  /**
     * Tab
     */

  --tw-tab-menu-color: #9ca2a7;
  --tw-tab-menu-hover-color: var(--tw-text-color);
  --tw-tab-menu-selected-color: var(--tw-text-color);
  --tw-tab-menu-indicator-color: var(--tw-text-color);
  --tw-tab-outline-color: var(--tw-text-color);

  /**
     * Wizard
     */

  --tw-wizard-left-panel-bg-color: var(--tw-primary-one);
  --tw-wizard-left-panel-marker-color: var(--tw-primary-six);
  --tw-wizard-task-button-text-color: #dddddd;

  /**
     * CBOX
     */

  --tw-cboxhoverbg-color: var(--tw-hover-bg-color);
  --tw-cboxicon-color: var(--tw-text-color);
  --tw-autohide-color: #b3b3b3;

  /**
     * TOOLTIP
     */

  --tw-tooltip-bg-color: var(--tw-bg-color);
  --tw-tooltip-border-color: var(--tw-bg-color);
  --tw-tooltip-text-color: var(--tw-text-color);

  /**
     * STS Colors
     */

  --tw-red-text-color: #ed6274;
  --tw-green-txt-color: #65c0ab;

  /*************************************************************************************************************
     * WARNING WARNING WARNING WARNING

     * DEPRECATED COLORS
     *
     * New code should not reference any color variables below this line.
     * These variables are subject to removal in a later version of ui_common_dart.
     *
     * All below colors are being used in old Polymer components.
     **************************************************************************************************************/

  --tw-blue-color: #177ec7;
  --tw-lightblue-color: #3cb6e3;
  --tw-red-color: #d90b0b;
  --tw-bigred-color: #f70000;
  --tw-green-color: #44c767;
  --tw-orange-color: #fd9700;
  --tw-yellow-color: #e1d041;
  --tw-black-color: #141414;
  --tw-gray-color: #8c8c8c;
  --tw-lightgray-color: #d6d6d6;
  --tw-verylightgray-color: #eeeeee;
  --tw-darkgray-color: #4f4f4f;
  --tw-white-color: #fffefe;

  --tw-grayblue-color: #728cb4;
  --tw-graygreen-color: #549c59;

  --tw-disabledbg-color: #dddddd;
  --tw-dropdown-color: #f2f2f2;

  --tw-help-color: var(--tw-lightblue-color);
  --tw-info-color: var(--tw-blue-color);
  --tw-warning-color: var(--tw-orange-color);
  --tw-normal-color: var(--tw-black-color);
  --tw-success-color: var(--tw-green-color);
  --tw-unknown-color: var(--tw-disabled-color);

  --tw-active-color: #2779a4;
  --tw-activebg-color: #c1e0f0;
  --tw-inputbuttonbg-color: #e6e6e6;
  --tw-inputbutton-color: #5f5f5f;
  --tw-icon-color: #888888;

  --tw-dptab-color: var(--tw-lightgray-color);
  --tw-dptabbottom-color: var(--tw-lightgray-color);
  --tw-dptoday-color: #666666;
  --tw-dphover-color: var(--tw-lightgray-color);
  --tw-dpdashed-color: var(--tw-gray-color);
  --tw-dpquick-color: var(--tw-black-color);

  --tw-radiodis-color: var(--tw-verylightgray-color);
  --tw-ddbuttonhover-color: var(--tw-verylightgray-color);

  --tw-messagearea-color: #fefce5;
  --tw-rtetoolbar-color: #f6f6f6;

  --tw-annotation-color: #a4a4a4;
  --tw-annotationactive-color: #fd9700;

  --tw-dg-tree-hover-color: #f1f1f1;
  --tw-dg-tree-selection-color: #ddd;

  --tw-caactive-color: #ff982c;

  --tw-cadefault-color: var(--tw-blue-color);

  --tw-macgray-color: #707070;
  --tw-macblack-color: #333333;
  --tw-macbackground-color: #f0f0f0;
  --tw-macbutton-color: #f5f5f5;

  --tw-wizardsteps-color: #e7f1fe;
  --tw-wizardinfo-color: #f8e49e;

  --tw-main-background-color: #e8e8e8;

  --tw-launchitem-border-color: #e8e8e8;
  --tw-caborder-color: var(--tw-border-color);

  --tw-cboxborder-color: var(--tw-lightborder-color);

  --tw-graytext-color: #a4a4a4;

  --tw-disabledtext-color: #6f6f6f;

  --tw-mask-color: rgba(45, 44, 44, 0.4);

  --tw-code-highlight: orange;
}
/**
 * Trustwave Component Overrides
 */
html,
body {
  color: var(--tw-text-color);
}

input {
  font-family: "Open Sans", sans-serif;
  color: var(--tw-text-color);
}

hr {
  border: 0;
  border-bottom: 1px solid var(--tw-border-color);
}

/**
 * Anchor styles
 *
 * These styles are designed to match the twa-linkbutton styles.
 */
a {
  color: var(--tw-accent-color);
  text-decoration: underline;
  cursor: pointer;
}
a:hover,
a:focus {
  color: var(--tw-hover-color);
  outline: none;
}
a:active {
  color: var(--tw-focus-color);
}
a[disabled=""],
a[disabled="true"] {
  pointer-events: none;
  color: var(--tw-disabled-color);
  cursor: default;
}
a.dashed,
a[dashed=""],
a[dashed="true"] {
  text-decoration: none;
  border-bottom: 1px dashed var(--tw-accent-color);
}

/**
 * Override AngularDart's overlay container to be higher than our mask.
 */
#default-acx-overlay-container {
  z-index: 1000001 !important;
}

.acx-overlay-container > .pane.modal {
  background: rgba(33, 33, 33, 0.8);
}

/**
 * Icon Color Classes
 */

.dashboard-control-icons {
  color: white;
}

.primary-icon {
  color: var(--tw-primary-color);
}

.accent-icon {
  color: var(--tw-accent-color);
}

.disabled-icon {
  color: var(--tw-disabled-color);
}

.on-icon {
  color: var(--tw-on-color);
}

.positive-icon {
  color: var(--tw-positive-color);
}

.negative-icon {
  color: var(--tw-negative-color);
}

.unknown-severity-icon {
  color: var(--tw-unknown-severity-color);
}
.info-severity-icon {
  color: var(--tw-info-severity-color);
}
.low-severity-icon {
  color: var(--tw-low-severity-color);
}
.medium-severity-icon {
  color: var(--tw-medium-severity-color);
}
.high-severity-icon {
  color: var(--tw-high-severity-color);
}
.critical-severity-icon {
  color: var(--tw-critical-severity-color);
}

.unknown-confidence-icon {
  color: var(--tw-unknown-confidence-color);
}
.no-confidence-icon {
  color: var(--tw-no-confidence-color);
}
.low-confidence-icon {
  color: var(--tw-low-confidence-color);
}
.medium-confidence-icon {
  color: var(--tw-medium-confidence-color);
}
.high-confidence-icon {
  color: var(--tw-high-confidence-color);
}
.ultra-confidence-icon {
  color: var(--tw-ultra-confidence-color);
}

.not-started-icon {
  color: var(--tw-not-started-color);
}
.in-progress-icon {
  color: var(--tw-in-progress-color);
}
.completed-icon {
  color: var(--tw-completed-color);
}

/**
 * DEPRECATED Color Classes
 *
 * New code should not reference any color classes below this line.
 * These classes are subject to removal in a later version of ui_common_dart.
 */

.blueTxt {
  color: var(--tw-primary-color);
}
.lightGrayTxt {
  color: var(--tw-lightgray-color);
}
.orangeTxt {
  color: #fd9700;
}
.greenTxt {
  color: #54b95b;
}
.whiteTxt {
  color: #ffffff;
}
.grayTxt {
  color: #a4a4a4;
}
.grayblueTxt {
  color: #728cb4;
}
.graygreenTxt {
  color: #549c59;
}
.redTxt {
  color: #ff0000;
}
.yellowTxt {
  color: #e1d041;
}

/* END DEPRECATED Color Classes */

.icon10 {
  text-decoration: none;
  font-size: 10px;
}

.btn-default {
  background-color: var(--tw-panel-bg-color);
  border-color: var(--tw-panel-bg-color);
}

.btn-default:hover {
  background-color: var(--tw-panel-bg-color);
  border-color: var(--tw-border-color);
}

.btn {
  text-decoration: none;
  display: inline-block;
  margin-bottom: 0;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 1px solid transparent;
  white-space: nowrap;
  -webkit-user-select: none;
  moz-user-select: none;
  ms-user-select: none;
  user-select: none;
  outline: none;
}
.btn:hover {
  background-color: var(--tw-panel-bg-color);
  border-color: var(--tw-border-color);
}
.btn:visited {
  background-color: var(--tw-lightgray-color);
}
.btn[disabled] {
  opacity: 0.3;
  pointer-events: none;
}
.btn-sm,
.btn-group-sm > .btn {
  width: 23px;
  height: 23px;
  font-size: 18px;
  line-height: 23px;
  border-radius: 3px;
  align-content: center;
  vertical-align: middle;
}