// Remember to compile changes made in this stylesheet as it is not imported in main.scss

@import "../css/base/colors";
@import "../css/base/breakpoints";

:root {
  --course-color-dark: #0A6C88;
  --course-color-medium: #8CC8D9;
  --course-color-light: #E0F0F5;
}

.course-list-container {
  .course-title {
    span {
      color: $dark_blue;
    }
  }
}

.course-list-types {
  .course-chips {
    .chip {
      color: $dark_blue;
      border: 1px solid $dark_blue;

      &:hover, &.selected {
        background: $dark_blue;
        color: $white;
      }
    }
  }
}

.popup {
  background-color: $light-blue;

  .badge {
    color: $light_blue;
    background: $dark-blue;
  }

  span, p, div, h3 {
    color: $dark_blue;
  }

  button {
    span {
      color: white;
    }
  }
}