@import "color.css";

/* add missing css for table when render in markdown */
table > thead > tr.header > th {
  border: 1px solid black;
}
table > tbody > tr.odd > td {
  border: 1px solid black;
}

table > tbody > tr.even > td {
  border: 1px solid black;
}

.row-toolbox {
  padding: 10px;
}

.row-flex {
  display: flex;
}

.link-print {
  padding-right: 1em;
}

.alert-banner {
  padding: 10px;
  background-color: red;
  color: white;
  width: 100%;
  font-size: 2rem;
  text-align: center;
  font-family: "NotoColorEmojiLimited", "ag_condensed", Arial, "Apple Color Emoji", "Segoe UI Emoji", Symbola, Aegyptus,
    Code2000, Code2001, Code2002, Musica, LastResort;
}

ul li:has(input[type="checkbox"]) {
  list-style-type: none;
}

.article-content {
  table {
    border-collapse: collapse;
    width: 100%;
    background-color: #fff;
    border: 1px solid #e0e0e0;
  }

  th,
  td {
    padding: 10px;
    border: 1px solid #e0e0e0;
  }

  th {
    background-color: #f0f0f0;
    color: #333;
  }

  tr:nth-child(even) {
    background-color: #f8f8f8;
  }

  tr:hover {
    background-color: #f2f7fb;
  }
}

.fa-icon-white {
  /* use filter to convert svg in white */
  filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(106%) contrast(101%);
}

.fa-icon {
  width: 1.1em;
  height: 1.1em;
}

.fa-caret {
  align-self: flex-end;
  transform: translateY(-0.15em);
}

.fa-rss {
  height: 0.9em;
}

@media (min-width: 842px) {
  /* only on desktop, bootstrap value */
  .fa-icon-container {
    display: flex !important;
    align-items: center;
  }
}

.menu-item-incident {
  padding-inline: 15px;
  background-color: #d01a1f;
  > a {
    padding-inline: 0 !important;
    > img {
      height: 0.8em;
      padding-right: 0.2em;
    }
  }
}
#menu-item-contact {
  color: white !important;
}