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

    --tw-primary-one: #f4f5f7; /* header bg color */
    --tw-primary-two: #F0F0F0; /* page bg color */
    --tw-primary-three: #5d606f; /* secondary nav color */
    --tw-primary-four: #fffefe; /* panel bg color */
    --tw-primary-five: #5d606f; /* table header */
    --tw-primary-six: #D5DEEC; /*#F3F2F1; /* input bg color */
    --tw-primary-seven: #f4f5f7; /* table bg color */
    --tw-primary-eight: #DBDCDE!important; /* selection bg 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-panel-border-color);
    --tw-dashboard-add-hover-color: var(--tw-hover-bg-color);

    /* Main Colors */
    --tw-focus-bg-color: var(--tw-primary-eight);
    --tw-hover-bg-color: var(--tw-primary-eight);
    /*--tw-panel-border-color: #b6b6b6;*/
    --tw-panel-border-color: var(--tw-page-bg-color);/* changed for dark mode */
    --tw-text-color: #141414; /* 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: var(--tw-primary-four); /* changed for dark mode */
    --tw-alt-bg-color: #eeeeee; /* changed for dark mode */
    --tw-disabled-bg-color: rgba(187, 196, 210, .4);
    --tw-resize-handle-color: #C0C2C4; /* changed for dark mode */
    --tw-secondary-text-color: #8c8c8c;
    --tw-disabled-color: #999999;

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

    --tw-accent-color: #006F91;
    --tw-focus-color: var(--tw-primary-color);
    --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(0, 0, 0, .1);

    /**
     * Checkbox
     */

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

    /**
     * Buttons
     */

    /* Primary */
    --tw-button-primary-bg-color: #bbc4d2; /*#DFE2E7;*/
    --tw-button-primary-text-color: #000;
    --tw-button-primary-hover-bg-color: #d4ddea;
    --tw-button-primary-hover-color: #ffffff;
    --tw-button-primary-border-color:  #a9b1bd;

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

    --tw-button-primary-disabled-color: #bbbbbb;
    --tw-button-primary-disabled-bg-color: #f5f5f5;
    --tw-button-primary-disabled-border-color: #eeeeee;

    /* Secondary */
    --tw-button-secondary-bg-color: #ffffff;
    --tw-button-secondary-text-color: #000;
    --tw-button-secondary-border-color: #cccccc;
    --tw-button-secondary-hover-bg-color: #f5f5f5;
    --tw-button-secondary-hover-color: #ffffff;

    --tw-button-secondary-hover-border-color: #999999;
    --tw-button-secondary-hover-text-color: #000000;

    --tw-button-secondary-disabled-color: #bbbbbb;
    --tw-button-secondary-disabled-bg-color: #f5f5f5;
    --tw-button-secondary-disabled-border-color: #eeeeee;

    --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: #9a9a9a;
    --tw-button-success-bg-color: #fffefe;
    --tw-button-success-text-color: #141414;
    --tw-button-success-hover-color: #eeeeee;

    --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);


    --tw-spinner-color: #ed1a3d;

    /**
     * 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: #5d606f;
    --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: #a9b1bd;
    --tw-select-background-color: #bbc4d2;
    --tw-select-dropdown-boder: 1px solid transparent;
    --tw-input-bg-color: var(--tw-primary-six);
    --tw-input-focus-color: transparent;
    --tw-input-border-focus: 1px solid var(--tw-input-focus-color);

    /* ICON BUTTON */
    --tw-icon-button-color: #141414;
    --tw-icon-button-hover-border-color: transparent;
    --tw-icon-button-hover-bg-color: transparent;

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

    /**
     * Portal Chrome Variables
     */

    /*
    * module/area background color
    * legacy: header background color
    * var(--tw-panel-bg-color);
     */
    --tw-header-bg-color: var(--tw-primary-one); /* changed for rebrand */

    --tw-header-nav-text: #767676; /* #414040; text under icons color */
    --tw-header-navicon-color: #767676; /* #6c6c6c header module icon color */
    --tw-header-nav-selected-color:  #000000; /* changed for dark mode */
    --tw-header-nav-hover-color:  #000000; /* changed for dark mode */
    --tw-header-nav-hover-bg-color: rgba(219, 220, 222, 1);
    /*
     * secondary nav background color
     * var(--tw-panel-bg-color);
     *
    */
    --tw-secondary-nav-bg-color: var(--tw-primary-three); /* changed for rebrand */
    --tw-secondary-nav-text-color: #E8EAED; /*var(--tw-text-color);*/
    --tw-secondary-nav-selected-color: var(--tw-alt-text-color); /* changed for rebrand */
    --tw-secondary-nav-hover-color: var(--tw-alt-text-color); /* changed for rebrand */
    --tw-secondary-module-name: var(--tw-alt-text-color); /* changed for rebrand */

    /*
     * New Nav Colors
     */

    --tw-username-label-color: #767676;

    --tw-nav-module-color: #767676;
    --tw-nav-module-hover-color: var(--tw-text-color);
    --tw-nav-moudule-separtor-color: var(--tw-border-color);

    --tw-nav-menu-text-color: #767676; /*#515559;*/
    --tw-nav-menu-text-hover-color: var(--tw-text-color);
    --tw-nav-menu-selected-background-color: transparent; /*#5d606f;*/
    --tw-nav-menu-selected-text-color: var(--tw-text-color);
    --tw-nav-right-border-color: #9a9a9a;
    --tw-nav-menu-small-roll-over-color: var(--tw-primary-eight);

    --tw-org-selector-side-label-color: #767676;
    --tw-org-selector-top-label-color: var(--tw-secondary-nav-text-color);

    /*
     * Toogle Button
     */

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

    /*
    * Nav Menus Dropdowns
    */

    --tw-nav-menu-bg-hover-color: #ed1a3d;
    --tw-nav-menu-bg-color: var(--tw-nav-menu-bg-color);

    --tw-header-seperator-color: #ed1a3d; /* changed for rebrand */

    --tw-launch-area-border-color: #eeeeee; /* launch area light border color */
    --tw-launch-area-bg-color: #C0C2C4; /* changed for rebrand */

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

    /**
     * Datagrid
     */

    --tw-datagrid-hover-color: var(--tw-hover-bg-color);
    --tw-datagrid-selected-color: var(--tw-focus-bg-color);
    --tw-datagrid-focus-color: var(--tw-focus-color);
    --tw-datagrid-row-separator-color: transparent;
    --tw-datagrid-border-color: transparent;

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

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

    --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, .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, .1);
    --tw-table-drag-color: rgba(154, 154, 154, .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: #767676;
    --tw-tab-menu-hover-color: var(--tw-text-color);
    --tw-tab-menu-selected-color: var(--tw-text-color);
    --tw-tab-menu-indicator-color: #5d606f;
    --tw-tab-outline-color: #5d606f;

    /**
     * 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: var(--tw-panel-bg-color);

    /**
     * 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;


    /**
     * ANGULAR TS
     */

    --tw-dash-header:#1e222734;
    --tw-dash-link: #1c99ff;
    --tw-dash-bg-color:#fcfcfc;
    --tw-dash-alerts-bg: #ebf1f5;
    --tw-dash-alerts-cell-bg: #ffffff;
    --tw-dash-alerts-cell-hover: #b5bdcc;
    --tw-dash-alerts-cell-font: #000000;
    --tw-dash-actionbar: #ebf1f5;
    --tw-dash-actionbar-font: #000000;
    --tw-dash-actionbar-button:#f4f6f7;
    --tw-dash-actionbar-button-selected:#d5dae5;
    --tw-dash-actionbar-button-shadow:inset 2px 2px 4px 0px #00000044;
    --tw-dash-input:#b9bdc6;
    --tw-dash-stats:linear-gradient(356deg, #ffffff, #ffffff55);
    --tw-dash-stats-font:#00000090;
    --tw-dash-stats-br:1px solid #afb9cf;
    --tw-dash-stats-bt: 35px solid #ffffff;
    --tw-dash-stats-bl: 5px solid #4445480f;
    --tw-dash-card:#ffffff;
    --tw-dash-card-border:1px solid #00000040;
    --tw-dash-card-font:#000000;
    --tw-dash-card-font-opposite:#ffffff;
    --tw-dash-stack-bar:#f7f7f7;
    --tw-dash-table-th:#ffffff;
    --tw-dash-low:#d9ce36;
    --tw-dash-table-tr-hover:#88b0d91c;

    /*************************************************************************************************************
     * 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: #ed1a3d;
    --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: #fcedc6;
    --tw-annotationactive-color: #f6c342;

    --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(255, 255, 255, .4);
}
/**
 * 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,.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;
}