/*Stylings needed for WCAG*/

.DayPickerKeyboardShortcuts_show {
  display: none !important;
}

.DayPickerKeyboardShortcuts_panel {
  display: none !important;
}

.wcag_placeholder input::placeholder {
  color: #6d7878 !important;
}

.visuallyhidden {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

.user-is-tabbing *:focus {
  outline: 2px solid #bfd6fd;
  box-shadow: inset 0px 0px 4px #bfd6fd;
}

.user-is-tabbing button:focus {
  outline: 2px solid #bfd6fd !important;
  box-shadow: inset 0px 0px 4px #bfd6fd !important;
}

.user-is-tabbing .ui.blue.button:focus {
  outline: 2px solid #bfd6fd !important;
  box-shadow: inset 0px 0px 4px #bfd6fd !important;
}

.user-is-tabbing .black_focus_outline:focus {
  outline: 2px solid black !important;
  box-shadow: inset 0px 0px 4px black !important;
}

.user-is-tabbing .ui.modal.trav-trips-modal *:focus {
  outline: 2px solid #bfd6fd !important;
  box-shadow: inset 0px 0px 4px #bfd6fd !important;
}

.user-is-tabbing .ui.modal *:focus {
  outline: 2px solid black !important;
  box-shadow: inset 0px 0px 4px black !important;
}

.user-is-tabbing .ui.modal .carriers_filter *:focus {
  outline: 2px solid #bfd6fd !important;
  box-shadow: inset 0px 0px 4px #bfd6fd !important;
}

.user-is-tabbing .ui.radio:focus-within {
  outline: 2px solid white !important;
  box-shadow: inset 0px 0px 4px white !important;
}

.user-is-tabbing .ui.radio.black_focus_outline:focus-within {
  outline: 2px solid black !important;
  box-shadow: inset 0px 0px 4px black !important;
}

.user-is-tabbing .black_focus_outline .ui.radio:focus-within {
  outline: 2px solid black !important;
  box-shadow: inset 0px 0px 4px black !important;
}

.user-is-tabbing button.grey:focus {
  outline: 2px solid white !important;
  box-shadow: inset 0px 0px 4px white !important;
}

.user-is-tabbing button.grey.black_focus_outline:focus {
  outline: 2px solid black !important;
  box-shadow: inset 0px 0px 4px black !important;
}

.user-is-tabbing .padded.table .ui.checkbox:focus-within {
  outline: 2px solid black !important;
  box-shadow: inset 0px 0px 4px black !important;
}

.user-is-tabbing .ui.button:focus {
  background: #575760;
  color: white;
}

.user-is-tabbing div.ui.circular.icon.button:focus {
  background: #575760;
  color: white !important;
  outline: 2px solid #bfd6fd;
  box-shadow: inset 0px 0px 4px #bfd6fd;
}

.user-is-tabbing .ui.toggle:focus-within {
  outline: 2px solid #bfd6fd;
  box-shadow: inset 0px 0px 4px #bfd6fd;
}

.user-is-tabbing .offset_white_focus:focus-within {
  outline: 1px solid white;
  outline-offset: 4px;
}

.user-is-tabbing .app_link:focus > div {
  outline: 1px solid white;
  outline-offset: 4px;
}

.user-is-tabbing .add_button_focus:focus-within {
  outline: 1px solid white;
  outline-offset: -1px;
}

.user-is-tabbing .SingleDatePickerInput_calendarIcon:focus {
  outline: 2px solid black !important;
  box-shadow: inset 0px 0px 4px black !important;
}

.user-is-tabbing .ui.modal .app_link:focus > div {
  outline: 2px solid black !important;
  box-shadow: inset 0px 0px 4px black !important;
}

.user-is-tabbing .DateInput_input:focus {
  outline: 2px solid black !important;
  box-shadow: inset 0px 0px 4px black !important;
}

.user-is-tabbing .ui.button.fs_seemore:focus {
  color: unset !important;
  outline: 2px solid black !important;
  box-shadow: inset 0px 0px 4px black !important;
}

.user-is-tabbing .ui.button.fs_selectall:focus {
  color: black !important;
  outline: 2px solid black !important;
  box-shadow: inset 0px 0px 4px black !important;
}

/******COLOUR CONTRAST CHANGES*********/
.DayPickerKeyboardShortcuts_panel {
  color: black !important;
}

.positive.button {
  background: #26873b !important;
}

.green.button {
  background: #26873b !important;
}

.green.active.item {
  background: #26873b !important;
}

::placeholder {
  color: #747474 !important;
}

.default.text {
  color: #747474 !important;
}

body button.ui.pink.label {
  background: #d82289 !important;
}

body .ui.pink.label,
.ui.pink.labels .label {
  background-color: #d82289 !important;
  border-color: #d82289 !important;
}

.DateInput_input__disabled:disabled {
  opacity: 1 !important;
  background: #f8f8f8 !important;
  color: #707070 !important;
}

.menu .item:hover {
  background: #757575 !important;
  color: #fff !important;
}

.flight-sched-buttons {
  @media only screen and (max-width: 599px) {
    display: unset !important;
  }
}

.radio_button {
  label:before {
    border: 1px solid #000000a8 !important;
  }

  label:checked {
    border: 1px solid #000000a8 !important;
  }
}

.SingleDatePickerInput.SingleDatePickerInput_1.SingleDatePickerInput__disabled.SingleDatePickerInput__disabled_2.SingleDatePickerInput__withBorder.SingleDatePickerInput__withBorder_3 {
  border: 1px solid #727279 !important;
}

.SingleDatePickerInput.SingleDatePickerInput_1.SingleDatePickerInput__withBorder.SingleDatePickerInput__withBorder_2 {
  border: 1px solid #727279 !important;
}

.text_input {
  input {
    border: 1px solid #727279 !important;
    color: #000000a8;
  }

  .ui.input > input {
    border: 1px solid #727279 !important;
  }
}

.ui.dropdown .menu .selected.item {
  background: #757575 !important;
  color: #fff !important;
}

.menu .item.active {
  background: #757575 !important;
  color: #fff !important;
}

.ui.dropdown .menu .item:hover {
  background: #757575 !important;
  color: #fff !important;
}

.user-is-tabbing .ui.checkbox.black_focus_outline:focus-within {
  outline: 2px solid black !important;
  box-shadow: inset 3px 3px 3px 3px black !important;
  width: 19px;
  height: 19px;
}

.user-is-tabbing .ui.checkbox.radio.black_focus_outline:focus-within {
  outline: 2px solid black !important;
  box-shadow: none !important;
  width: unset;
  height: unset;
}

.user-is-tabbing .ui.checkbox.toggle.black_focus_outline.toggle:focus-within {
  outline: 2px solid black !important;
  box-shadow: none !important;
  outline-offset: 5px;
  width: 3.5rem;
  height: auto;
}

.ui.label.sc-kMribo.kpLvWl {
  background-color: unset !important;
}

.ui.label {
  background-color: unset !important;
}

.ui.label.country {
  background-color: #e8e8e8 !important;
}

.ui.selection.dropdown {
  border-color: #747474 !important;
}

.ui.checkbox label:before {
  border-color: #747474 !important;
}

.results .result:hover {
  background: #757575 !important;

  .ui.label {
    color: #fff !important;
  }
}

.results .result.active {
  background: #757575 !important;

  .ui.label {
    color: #fff !important;
  }
}

/****MAP*****/
.mapboxgl-popup-close-button {
  display: block;
  margin-left: auto;
  margin-bottom: 5px;
  position: relative;
}

.modals.dimmer .ui.scrolling.modal {
  margin: 3rem auto !important;
}

.modals.dimmer {
  z-index: 1001 !important;
}

@media (max-width: 1276px) {
  .fare_forecaster_radiogroup {
    display: block !important;
  }
}

@media (max-width: 700px) {
  .ui.search > .results {
    max-width: 100% !important;
  }

  .ui.search .category .name {
    white-space: pre-wrap !important;
    width: 30% !important;
  }

  .ui.search .category .category {
    width: 70% !important;
  }

  .DayPicker__horizontal {
    top: 0 !important;
    margin-top: 0 !important;
    max-height: 142vh !important;
    /*compensate for zoom*/
    overflow-y: auto !important;
    overflow-x: hidden !important;
    zoom: 0.7;
  }

  .ui.label {
    padding: 0 !important;
    word-wrap: break-word !important;
    max-width: 100% !important;
  }

  .ui.category.search > .results .category {
    display: flex !important;
  }
}

.fc .fc-day-other .fc-daygrid-day-top {
  opacity: 0.8 !important;
}

.user-is-tabbing .ui.button.dropdown:focus-within {
  background: rgb(87, 87, 96);
  color: white;
}

.user-is-tabbing .ui.button.dropdown .text:focus {
  outline: none !important;
  box-shadow: none !important;
}

.dropdown-container {
  position: relative;
}

.dropdown-container .menu {
  left: 0;
  cursor: auto;
  position: absolute;
  display: none;
  outline: 0;
  top: 100%;
  min-width: -webkit-max-content;
  min-width: -moz-max-content;
  min-width: max-content;
  margin: 0;
  padding: 0 0;
  background: #fff;
  font-size: 1em;
  text-shadow: none;
  text-align: left;
  box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
  border: 1px solid rgba(34, 36, 38, 0.15);
  border-radius: 0.28571429rem;
  transition: opacity 0.1s ease;
  z-index: 11;
  will-change: transform, opacity;
}

.dropdown-container .menu > .item:first-child {
  border-top-width: 0;
}

.dropdown-container .menu .selected.item {
  background: #757575 !important;
  color: #fff !important;
}

.dropdown-container .menu > .item {
  position: relative;
  cursor: pointer;
  display: block;
  border: none;
  height: auto;
  text-align: left;
  border-top: none;
  line-height: 1em;
  color: rgba(0, 0, 0, 0.87);
  padding: 0.78571429rem 1.14285714rem !important;
  font-size: 1rem;
  text-transform: none;
  font-weight: 400;
  box-shadow: none;
  -webkit-touch-callout: none;
}

.dropdown-container .menu > * {
  white-space: nowrap;
}

.ui.popup.left::before {
  left: 2px !important;
  box-shadow: none !important;
  width: 10px;
  height: 10px;
  bottom: -2px !important;
}

.ui.popup.right::before {
  right: 2px !important;
  box-shadow: none !important;
  width: 10px;
  height: 10px;
  bottom: -2px !important;
}

.ui.popup {
  margin-bottom: 0 !important;
}
