// change the theme
$theme-colors: (
  "dark": #2d0635,
  "light": #eeeeee,
  "primary-dark": #d60cff,
  "primary-light": #220027,
  "secondary-dark": #00ff4c,
  "secondary-light": #002500,
  "text-dark": #eeeeee,
  "text-light": #2d0635,
  "link-dark": #5900ff,
  "link-light": #0400ff,
);

// Import Bootstrap and its default variables
@import '~bootstrap/scss/bootstrap.scss';

.main-page {
  padding: 0px 40px 0px 40px;
}

body.dark {
  background-color: map-get($theme-colors, "dark") !important;
}

body.light {
  background-color: map-get($theme-colors, "light") !important;
}

.text-dark {
  color: map-get($theme-colors, "text-dark") !important;
}

.text-light {
  color: map-get($theme-colors, "text-light") !important;
}

.link-dark {
  color: map-get($theme-colors, "link-dark") !important;

  &:hover {
    color: map-get($theme-colors, "link-dark") !important;
    opacity: 0.5;
  }
}

.link-light {
  color: map-get($theme-colors, "link-light") !important;

  &:hover {
    color: map-get($theme-colors, "link-light") !important;
    opacity: 0.5;
  }
}

.table-dialog tr:nth-child(even) {
  background-color: map-get($theme-colors, "light");
  color: map-get($theme-colors, "text-light");
}

.table-dialog tr:nth-child(odd) {
  background-color: map-get($theme-colors, "dark");
  color: map-get($theme-colors, "text-dark");
}

.table-fielddays {
  font-size: small;
  white-space: nowrap;
  margin-bottom: 10px;
}

.table-fielddays td {
  padding: 5px;
  border: 1px solid;
  border-color: black;
}

.table-fielddays th {
  padding: 5px;
  border: 1px solid;
  border-color: black;
  background-color: burlywood;
}

.table-fielddays tr:hover {
  background-color: rgb(236, 221, 221);
}

.container-map {
  width: 65%;
}

.breadcrumbs a {
  text-decoration: none;

  &:hover {
    text-decoration: underline;
  }
}

.courses-card {
  max-width: 18rem;
  margin: 5px;
  display: inline-block;
}

// Core variables and mixins
// @import "variables";
// @import "mixins";