/* These styles are generated from project.scss. */

.alert-debug {
  color: black;
  background-color: white;
  border-color: #d6e9c6;
}

.alert-error {
  color: #b94a48;
  background-color: #f2dede;
  border-color: #eed3d7;
}

html {
    position: relative;
    min-height: 100%;
}
body {
    margin-bottom: 60px;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 60px; /* Set the fixed height of the footer here */
    line-height: 60px; /* Vertically center the text there */
}

/* Styling the button in bootstrap-select so that it is correctly
 * aligned in  horizontal search form */
.bootstrap-select button.btn {
  margin-top: 0;
  margin-bottom: 0;
}

/* Multi-select: make selected options visually distinct (tick + background).
 * Theme only shows a check-mark; without a clear selected style, items look identical. */
.bootstrap-select.show-tick .dropdown-menu.inner li.selected a {
  background-color: rgba(249, 99, 50, 0.12);
  font-weight: 600;
}
.bootstrap-select.show-tick .dropdown-menu.inner li.selected a span.check-mark {
  display: inline-block;
  color: #f96332;
  font-size: 14px;
  line-height: 1;
}
/* Remove the padding from block, used for wrapper div around selects
 * in search form (otherwise, they are not aligned with the rest). */
.button-wrapper {
  padding: 0;
}

/* Add some margin on the lateral sides of a between label (that has inputs */
/* on each side) */
.between-label {
  margin: 0 10px;
}
/* For clickable appended element on input */
.append-button {
  cursor: pointer;
}


/* Sytling select2 so that they have a consistant style wrt to the global theme.
 * Selection choice's style is taken from global theme's badges. */
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    box-sizing: border-box;
    color: rgb(255, 255, 255);
    display: inline-block;
    height: 22px;
    overflow-wrap: break-word;
    text-align: center;
    text-decoration: none solid rgb(255, 255, 255);
    text-size-adjust: 100%;
    /* text-transform: uppercase; */
    white-space: nowrap;
    word-wrap: break-word;
    column-rule-color: rgb(255, 255, 255);
    perspective-origin: 15.9375px 11px;
    transform-origin: 15.9375px 11px;
    caret-color: rgb(255, 255, 255);
    background: #f96332 none repeat scroll 0% 0% / auto padding-box border-box;
    border: 1px solid #f96332;
    border-radius: 14px 14px 14px 14px;
    font: normal normal 700 normal 9.9988px / 12px Montserrat, "Helvetica Neue", Arial, sans-serif;
    /* margin: 0px 0px 5px; */
    outline: rgb(255, 255, 255) none 0px;
    padding: 4px 8px;
}/*#SPAN_1*/

.select2-container--default .select2-selection--multiple .select2-selection__choice:after {
    box-sizing: border-box;
    color: rgb(255, 255, 255);
    overflow-wrap: break-word;
    text-align: center;
    text-decoration: none solid rgb(255, 255, 255);
    text-size-adjust: 100%;
    text-transform: uppercase;
    white-space: nowrap;
    word-wrap: break-word;
    column-rule-color: rgb(255, 255, 255);
    caret-color: rgb(255, 255, 255);
    border: 0px none rgb(255, 255, 255);
    font: normal normal 700 normal 9.9988px / 12px Montserrat, "Helvetica Neue", Arial, sans-serif;
    outline: rgb(255, 255, 255) none 0px;
}/*#SPAN_1:after*/

.select2-container--default .select2-selection--multiple .select2-selection__choice:before {
    box-sizing: border-box;
    color: rgb(255, 255, 255);
    overflow-wrap: break-word;
    text-align: center;
    text-decoration: none solid rgb(255, 255, 255);
    text-size-adjust: 100%;
    text-transform: uppercase;
    white-space: nowrap;
    word-wrap: break-word;
    column-rule-color: rgb(255, 255, 255);
    caret-color: rgb(255, 255, 255);
    border: 0px none rgb(255, 255, 255);
    font: normal normal 700 normal 9.9988px / 12px Montserrat, "Helvetica Neue", Arial, sans-serif;
    outline: rgb(255, 255, 255) none 0px;
}/*#SPAN_1:before*/

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  color: white;
}

.select2-selection {
    border: 1px solid #e3e3e3 !important;
    /* border-radius: 30px; */
}


#article-list .search {
    background-color: white;
    padding: 15px;
}

#article-list .keywords h6 {
    cursor: pointer;
}
#article-list .classification h6 {
    cursor: pointer;
}

.article .card-title {
    font-weight: bold;
    color: #f96332;
    text-shadow: 1px 1px 0px rgba(0,0,0,0.1);
}
hr.primary {
    background-color: #ff9980;
}

.page-header.page-header-xsmall {
  min-height: 30vh;
  max-height: 300vh;
}

.rich-text {
  text-align: justify;
}
.rich-text img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.rich-text b {
    font-weight: bold;
}

/* Bulletins (Bootstrap 4 + Font Awesome 5) */
.bulletin-page .bulletin-header .title {
  font-weight: 600;
}
.bulletin-section-title {
  font-size: 1.35rem;
  font-weight: 600;
  margin-bottom: 0.75rem;
}
.bulletin-synthesis {
  white-space: pre-wrap;
  line-height: 1.55;
}
.bulletin-list-item h2 {
  color: inherit;
  font-weight: 600;
}
.bulletin-item-card {
  border-left-width: 4px;
}
.bulletin-item-cluster {
  border-left-color: #f96332;
}
.bulletin-item-singleton {
  border-left-color: #888;
}
.bulletin-item-summary {
  white-space: pre-wrap;
  line-height: 1.5;
}
.bulletin-map-panel {
  background: #fafafa;
  border: 1px solid #e9ecef;
  border-radius: 0.25rem;
  padding: 0.75rem;
}
.bulletin-map-panel .map-container.container {
  width: 100%;
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}
.bulletin-stats .card {
  border: 1px solid #e9ecef;
  box-shadow: none;
  max-width: 32rem;
  margin-left: auto;
  margin-right: auto;
}
.bulletin-article-list .list-group-item {
  border-left: 0;
  border-right: 0;
}
.bulletin-cluster-article-toggles .btn-link {
  display: block;
  line-height: 1.2;
}