@import "../../node_modules/bootstrap/scss/bootstrap"

@import "src/components/calendar/calendar-fixes"

p, span, td, .h3, a, button
  .svg-inline--fa, .fa, .far, .fas, .fab
    &:not(.comparing):not(.trend)
      text-align: center !important
      width: 1.25em !important

.card
  @extend .shadow
  @extend .mb-4

  .card-header
    @extend .py-3
    @extend .d-flex
    @extend .flex-row
    @extend .align-items-center
    @extend .justify-content-between

    h6
      @extend .m-0
      @extend .fw-bold

.alert-popup-area
  position: absolute
  top: 0.66rem
  left: 50%
  transform: translateX(-50%)
  display: flex
  flex-direction: column
  z-index: 999

  .alert-timer
    animation: alert-timer linear
    background-color: rgba(0, 0, 0, 0.2)
    height: 5px
    position: absolute
    bottom: 0
    margin-left: -1rem