:root {
  --orderedLineColor: black;
  --expectedLineColor: black;
  --orderedRanLineColor: var(--blue2);
/*  --borderGray: var(--lightGray2);
  --version: var(--extraLightGray);
*/
  --deliveredLineColor: var(--lightBlue2);
  --delivered3pLineColor: var(--teal);
  /* color vars for frequncy chart being consumed */
  --frequencyRangeOver: var(--darkBlue2); /* replace with actual colors later */
  --frequencyRangeUnder: var(--lightBlue4); /* replace with actual colors later */
  --frequencyRangeOptimal: var(--lightBlue); /* replace with actual colors later */
  /* dark-theme-fix creating var to be comsumed by phoenix-theme-dark.css */
  --AND-THEME-blue1: var(--blue);
  --AND-THEME-bg1: var(--summaryBg);
  --AND-THEME-bg1alt: var(--paleBlue2);
  --disabledGray: var(--gray);
  --pale-text: var(--gray);
  --gray-bg: var(--midLightGray);
  --AND-THEME-blue2: var(--darkBlue);
  --AND-THEME-green1: var(--teal2);
}

.transparent-bar {
  background: rgba(250, 250, 250, 0.8);
}

.wj2mat-formfield {
  background: rgba(0, 0, 0, 0.04) !important;
  color: rgba(0, 0, 0, 1) !important;
  border-bottom: rgba(0, 0, 0, 0.5) 1px solid !important;
}
.wj2mat-formfield ::placeholder {
  color: rgba(0, 0, 0, 0.6) !important;
}
.wj-inputdate-dropdown {
  background-color: #fff !important;
}
.wj-inputdate-dropdown > .wj-listbox .wj-listbox-item {
  color:#333 !important;
}
/*scheduler footer*/
.sched-footer {
  background-color: #e2e2e2 !important;
}
.radio-pill-group {
  background-color: #fafafa;
}
.radio-pill-item label {
  color: #083851;
}

.toggle-graphs {
  color: #fff !important;
}
.mat-title-styled, .mat-num-styled-lg, .mat-num-styled-sm {
  color: #7b8186;
}
#segmentText, #totalText, #diffText, .legendText {
  color: #000;
}

/*Wijmo grid listboxes, including column pickers*/
.wj-listbox .wj-listbox-item .col-picker-wrap2 {
  background-color: var(--white);
  color: var(--darkGray);
}

.wj-listbox .wj-listbox-item .col-picker-wrap2:hover {
  background-color: #F2F2F2;
}

.select-footer {
  background-color: var(--white);
}

.mat-card-styled-bg {
  background: #fafcff;
}

.mat-bkgrd {
  background-color: #fafcff;
}

.order-queue-header {
   border: 1px solid #dee4ea;
}

app-define-and-find .af-filters-wrap {
  background-color: var(--lightWrapBg);
}

app-define-and-find .af-filters-text,
app-define-and-find .index-reach {
  color: var(--darkWrapBg);
}

/* Prevents highlighting the labels in the daypart column picker component */
.wj-daypart-column-picker > .wj-listbox-item:first-child, .wj-daypart-column-picker > .wj-listbox-item.wj-state-disabled + .wj-listbox-item {
  color: #000 !important;
}

.no-results, [class*="alert-"] {
  background-color: rgba(0, 0, 0, 0.03);
}

.app-define-and-find .wj-cells .wj-cell:first-of-type.wj-state-multi-selected,
.app-define-and-find .wj-cells .wj-cell:nth-of-type(2).wj-state-multi-selected,
.app-define-and-find .wj-cells .wj-cell:last-of-type.wj-state-multi-selected {
  background-color: var(--white);
  color: inherit;
}

.app-define-and-find .wj-cells .wj-cell.wj-alt.wj-state-multi-selected {
  background-color: var(--extraLightGray);
  color: inherit;
}

.app-define-and-find .wj-cell.wj-header {
  background-color: var(--white);
}

.app-define-and-find .index-daypart-value-greater-than-110 .reach-container,
.app-define-and-find .index-daypart-value-greater-than-110 .af-legend,
.app-define-and-find .index-daypart-value-greater-than-110 .af-daypart-cell {
  background-color: #81D947;
}

.app-define-and-find .wj-alt.index-daypart-value-greater-than-110:not(.wj-header):not(.wj-group):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cell.index-daypart-value-greater-than-110:not(.wj-header):not(.wj-group):not(.wj-alt):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cells .wj-cell.wj-state-multi-selected.index-daypart-value-greater-than-110 {
  color: #81D947 !important;
}

.app-define-and-find .index-daypart-value-90-110 .reach-container,
.app-define-and-find .index-daypart-value-90-110 .af-legend,
.app-define-and-find .index-daypart-value-90-110 .af-daypart-cell {
  background-color: rgba(129, 217, 71, 0.5);
}

.app-define-and-find .wj-alt.index-daypart-value-90-110:not(.wj-header):not(.wj-group):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cell.index-daypart-value-90-110:not(.wj-header):not(.wj-group):not(.wj-alt):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cells .wj-cell.wj-state-multi-selected.index-daypart-value-90-110 {
  color: rgba(129, 217, 71, 0.5) !important;
}

.app-define-and-find .index-daypart-value-80-90 .reach-container,
.app-define-and-find .index-daypart-value-80-90 .af-legend,
.app-define-and-find .index-daypart-value-80-90 .af-daypart-cell {
  background-color: #F0F1F5;
}

.app-define-and-find .wj-alt.index-daypart-value-80-90:not(.wj-header):not(.wj-group):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cell.index-daypart-value-80-90:not(.wj-header):not(.wj-group):not(.wj-alt):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cells .wj-cell.wj-state-multi-selected.index-daypart-value-80-90 {
  color: #F0F1F5 !important;
}

.app-define-and-find .index-daypart-value-less-than-80 .reach-container,
.app-define-and-find .index-daypart-value-less-than-80 .af-legend,
.app-define-and-find .index-daypart-value-less-than-80 .af-daypart-cell {
  background-color: var(--white);
}

.app-define-and-find .wj-alt.index-daypart-value-less-than-80:not(.wj-header):not(.wj-group):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cell.index-daypart-value-less-than-80:not(.wj-header):not(.wj-group):not(.wj-alt):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cells .wj-cell.wj-state-multi-selected.index-daypart-value-less-than-80 {
  color: var(--white) !important;
}

.app-define-and-find .reach-daypart-value-fourth-quarter .reach-container,
.app-define-and-find .reach-daypart-value-fourth-quarter .af-legend,
.app-define-and-find .reach-daypart-value-fourth-quarter .af-daypart-cell {
  background-color: #00D9FF;
}

.app-define-and-find .wj-alt.reach-daypart-value-fourth-quarter:not(.wj-header):not(.wj-group):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cell.reach-daypart-value-fourth-quarter:not(.wj-header):not(.wj-group):not(.wj-alt):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cells .wj-cell.wj-state-multi-selected.reach-daypart-value-fourth-quarter {
  color: #00D9FF !important;
}

.app-define-and-find .reach-daypart-value-third-quarter .reach-container,
.app-define-and-find .reach-daypart-value-third-quarter .af-legend,
.app-define-and-find .reach-daypart-value-third-quarter .af-daypart-cell {
  background-color: rgba(0, 217, 255, 0.5);
}

.app-define-and-find .wj-alt.reach-daypart-value-third-quarter:not(.wj-header):not(.wj-group):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cell.reach-daypart-value-third-quarter:not(.wj-header):not(.wj-group):not(.wj-alt):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cells .wj-cell.wj-state-multi-selected.reach-daypart-value-third-quarter {
  color: rgba(0, 217, 255, 0.5) !important;
}

.app-define-and-find .reach-daypart-value-second-quarter .reach-container,
.app-define-and-find .reach-daypart-value-second-quarter .af-legend,
.app-define-and-find .reach-daypart-value-second-quarter .af-daypart-cell {
  background-color: #F0F1F5;
}

.app-define-and-find .wj-alt.reach-daypart-value-second-quarter:not(.wj-header):not(.wj-group):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cell.reach-daypart-value-second-quarter:not(.wj-header):not(.wj-group):not(.wj-alt):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cells .wj-cell.wj-state-multi-selected.reach-daypart-value-second-quarter {
  color: #F0F1F5 !important;
}

.app-define-and-find .reach-daypart-value-first-quarter .reach-container,
.app-define-and-find .reach-daypart-value-first-quarter .af-legend,
.app-define-and-find .reach-daypart-value-first-quarter .af-daypart-cell {
  background-color: var(--white);
}

.app-define-and-find .wj-alt.reach-daypart-value-first-quarter:not(.wj-header):not(.wj-group):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cell.reach-daypart-value-first-quarter:not(.wj-header):not(.wj-group):not(.wj-alt):not(.wj-state-selected):not(.wj-state-multi-selected),
.app-define-and-find .wj-cells .wj-cell.wj-state-multi-selected.reach-daypart-value-first-quarter {
  color: var(--white) !important;
}

app-custom-slider:focus-within,
.app-define-and-find button.mat-focus-indicator:focus,
.app-define-and-find .mat-standard-chip:focus,
.app-define-and-find .mat-tab-group.mat-primary .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled) .mat-tab-label-content,
.app-define-and-find .wj-flexgridsearch.wj-state-focused {
  outline-color: var(--blue);
}

.customer-slider-item label {
  border-color: var(--softGray);
}

.customer-slider-item .customer-slider-item-checked {
  color: var(--blue);
  border-color: var(--softPaleBlue);
}

/* Loading button */
.loading-btn::after {
  border-right-color: var(--darkThemeBlack) !important;
}

/* charting vars used in graph-styles */
:root {
  --chartBorders: var(--lightGray2);
  --chartHeaders: var(--gray);
  --chartTooltipBg: white;
  --chartTooltipColor: black;
  --chartTooltipPaceColor: forestgreen;
  --paginationBg: var(--lightGray);
}

/* segment-builder */
:root {
  --segmentBuilderMainColor: var(--blue);
  --segmentBuilderHoverColor: var(--extraLightGray);
  --segmentBuilderListSeperatorColor: var(--lightGray);
  --segmentBuilderPathColor: var(--lightGray);
  --segmentBuilderBreadcrumbColor: var(--gray);
  --segmentBuilderSelectedColor: var(--lightGray2);
  --segmentBuilderTooltipColor: var(--white);
  --segmentBuilderTooltipBgColor: var(--darkWrapBg);
}

#grid-traffic-data {
  --progressBarBg: var(--lightGray);
  --progressBarValue: var(--green);
}
.demodrag-list {
  border: solid 1px #ccc;
}

.demodrag-box {
  border-bottom: solid 1px #ccc;
  color: rgba(0, 0, 0, 0.87);
}
.pill-gray {
  background: var(--midLightGray);
}
.background-dark {
  background: var(--lightGray);
}
.add-note-container {
  border: 1px solid var(--lightGray);
}
.styled-card-2 {
  background-color: var(--summaryBg);
}
.mat-num-styled-lrg {
  color: var(--gray);
}

/*addressable - media styles*/
.lock-back-indicator {
  background: var(--gray) !important;
}

.lock-front-indicator {
  color: black;
  opacity: 0.4;
}

.pkg-avail-text {
  color: var(--teal);
}

.pkg-avail-approved-text {
  color: var(--darkGreen);
}

.placement-item-left-border-teal-container::before {
  background-color: var(--teal);
}

.placement-item-left-border-green-container::before {
  background-color: var(--darkGreen);
}

.addressable-item-label {
  color: var(--gray);
}

.live-ramp-indicator {
  background: black !important;
}

.lock-back-indicator {
  background: var(--gray) !important;
}

.searchInput {
  background: var(--lightGray2);
  border-color: var(--lightGray);
}

/* addressable color vars */
:root {
  --carrot-default: var(--gray);
}

/* Traffic Queue Summary */
:root {
    --trafficSummaryHeaderBg: var(--summaryBg);
}