@charset "UTF-8";
:root {
  --bs-body-font-size: 0.875em;
}

@font-face {
  font-family: "titillium-web";
  font-display: swap;
  src: local("titillium-web"), url("../../Content/fonts/titilliumweb/woff2/TitilliumWeb-SemiBold.woff2") format("woff2");
}
.justify-self-end {
  justify-self: end;
}

.width-max-content {
  width: max-content;
}

.col-fixed-30 {
  flex: 0 0 30px;
  max-width: 30px;
}

.col-fixed-50 {
  flex: 0 0 50px;
  max-width: 50px;
}

.col-fixed-80 {
  flex: 0 0 80px;
  min-width: 80px;
}

.col-fixed-100 {
  flex: 0 0 100px;
  min-width: 100px;
}

.col-fixed-150 {
  flex: 0 0 150px;
  min-width: 150px;
}

.col-fixed-175 {
  flex: 0 0 175px;
  min-width: 175px;
}

.col-fixed-200 {
  flex: 0 0 200px;
  min-width: 200px;
}

/* dynamic background */
.dynamic-background {
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.dynamic-background.Sunday {
  background-image: url(../../Content/images/BfClient/bg/pb_aufzug.jpg);
}

.dynamic-background.Monday {
  background-image: url(../../Content/images/BfClient/bg/pb_aufzug_jf.jpg);
}

.dynamic-background.Tuesday {
  background-image: url(../../Content/images/BfClient/bg/pb_bahnsteig_tunnel.jpg);
}

.dynamic-background.Wednesday {
  background-image: url(../../Content/images/BfClient/bg/pb_bahnsteig_tunnelii.jpg);
}

.dynamic-background.Thursday {
  background-image: url(../../Content/images/BfClient/bg/pb_busbahnhof.jpg);
}

.dynamic-background.Friday {
  background-image: url(../../Content/images/BfClient/bg/pb_station.jpg);
}

.dynamic-background.Saturday {
  background-image: url(../../Content/images/BfClient/bg/pb_ubahn.jpg);
}

/* body */
body {
  font-family: "titillium-web", sans-serif !important;
  height: 100vh !important;
}

/* header tools */
header button {
  background-color: white !important;
  color: black;
  /*  &:focus {
    outline: 2px solid $primary-color !important;
  }*/
}

/* footer */
footer {
  line-height: 2em;
}
footer .footer-container {
  background-color: rgb(140, 0, 65) !important;
  border: 1px solid transparent;
}
footer .footer-container span, footer .footer-container li, footer .footer-container li a {
  color: white !important;
}
footer .footer-container li a:focus {
  outline: 2px solid white !important;
}
footer .footer-container li a:hover {
  text-decoration: none;
}

/* title */
#title img {
  height: 3rem;
}
#title h1 {
  font-size: 2.5rem;
}
#title h3 {
  color: black !important;
}

/* common */
img {
  max-width: 100%;
}

a,
b,
h1,
h2,
h3,
h4,
h5,
h6 {
  color: rgb(140, 0, 65) !important;
}

h1 {
  font-size: 2rem;
}

h2 {
  font-size: 1.625rem;
}

h3 {
  font-size: 1.25rem;
}

h4 {
  font-size: 1rem;
}

em {
  font-style: normal;
  font-weight: lighter;
}
em strong {
  font-weight: bold;
  color: rgb(140, 0, 65) !important;
}

a {
  outline: 0;
}
a:focus {
  outline: 2px solid black !important;
  font-weight: normal !important;
  text-decoration: none !important;
}

::-moz-selection {
  color: white;
  background: rgb(140, 0, 65);
}

::selection {
  color: white;
  background: rgb(140, 0, 65);
}

input:focus,
textarea:focus,
select:focus {
  outline: 2px solid rgb(140, 0, 65) !important;
  box-shadow: none !important;
}

input,
textarea,
select,
.form-control,
.btn {
  border-color: #c1c0c0 !important;
}

input:invalid,
textarea:invalid {
  border-color: transparent !important;
  outline: 2px dashed red !important;
}
input:invalid:focus,
textarea:invalid:focus {
  outline: 2px solid rgb(140, 0, 65) !important;
}

input[type=checkbox] {
  width: 24px;
  height: 24px;
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}

input[type=checkbox]:checked {
  background-color: rgb(140, 0, 65) !important;
}

::placeholder {
  color: gray !important;
}

.form-control,
.form-select {
  background-color: rgba(255, 255, 255, 0) !important;
}

.group-wrapper {
  background-color: rgba(255, 255, 255, 0.9);
  border: 1px solid transparent;
}

.issues-container {
  background-color: transparent !important;
}

button.icon-button, button.action-button {
  box-shadow: none !important;
  border: 0 !important;
  border-radius: var(--bs-border-radius-xxl) !important;
}
button.icon-button {
  padding-right: 0.5rem;
  padding-left: 0.5rem;
}
button.icon-button:focus {
  outline: 2px solid rgb(140, 0, 65) !important;
}
button.action-button {
  background-color: #8C0041 !important;
  color: white;
}
button.action-button:hover {
  color: white !important;
}
button.action-button:focus {
  outline: none !important;
  color: white !important;
  text-decoration: underline;
}
button.accordion-button {
  border-bottom: none !important;
  outline: none !important;
  box-shadow: none !important;
}

.accordion {
  --bs-accordion-bg: rgba(255, 255, 255, 0) !important;
  --bs-accordion-btn-bg: rgba(255, 255, 255, 0) !important;
  --bs-accordion-active-bg: rgba(255, 255, 255, 0) !important;
  --bs-accordion-btn-focus-box-shadow: 0 0 0 0 0 !important;
  --bs-accordion-border-color: #c1c0c0 !important;
}

.was-validated .form-control:valid {
  background-image: none !important;
}

a[href^="mailto:"]:before {
  content: "✉";
  display: inline-block;
  margin-right: 0.1em;
  text-decoration: none;
}

#calendar-expired-events,
#calendar-next-events,
#calendar-no-events {
  display: none;
}

#calendar-expired-events p,
#calendar-next-events p {
  margin-bottom: 0.5rem;
}
#calendar-expired-events a.calendar-info,
#calendar-next-events a.calendar-info {
  padding: 1px !important;
  margin: 3px;
  width: 22px;
  height: 22px;
}
#calendar-expired-events a.calendar-info:focus,
#calendar-next-events a.calendar-info:focus {
  outline: 2px solid var(--kendo-color-primary) !important;
}
#calendar-expired-events .calendar-event,
#calendar-next-events .calendar-event {
  padding-top: 0.5rem;
  border-top: 1px solid silver;
}
#calendar-expired-events .calendar-event:first-child,
#calendar-next-events .calendar-event:first-child {
  border-top: none;
}
#calendar-expired-events .calendar-event .calendar-event-details,
#calendar-next-events .calendar-event .calendar-event-details {
  margin-top: 0.25rem;
}

#calendar-expired-events h3, #calendar-expired-events h5, #calendar-expired-events p, #calendar-expired-events em {
  color: gray !important;
}
#calendar-expired-events .calendar-event em strong {
  color: gray !important;
}

#calendar-no-events {
  padding: 0;
}

body.high-contrast ::-moz-selection {
  background: black;
}
body.high-contrast ::selection {
  background: black;
}
body.high-contrast.dynamic-background {
  background-image: none !important;
  background-color: white;
}
body.high-contrast footer .footer-container {
  background-color: white !important;
  border: 1px solid black;
}
body.high-contrast footer .footer-container span, body.high-contrast footer .footer-container li, body.high-contrast footer .footer-container li a {
  color: var(--bs-body-color) !important;
}
body.high-contrast footer .footer-container li a:focus {
  outline: 3px solid black !important;
}
body.high-contrast button.icon-button:focus {
  outline: 3px solid black !important;
}
body.high-contrast button.action-button {
  background-color: black !important;
}
body.high-contrast img {
  filter: grayscale(100%);
}
body.high-contrast #markdown img {
  filter: none;
}
body.high-contrast a,
body.high-contrast b,
body.high-contrast h1,
body.high-contrast h2,
body.high-contrast h3,
body.high-contrast h4,
body.high-contrast h5,
body.high-contrast h6 {
  color: var(--bs-body-color) !important;
}
body.high-contrast em {
  font-style: normal;
  font-weight: lighter;
}
body.high-contrast em strong {
  font-weight: bold;
  color: var(--bs-body-color) !important;
}
body.high-contrast a:focus {
  outline: 3px solid black !important;
}
body.high-contrast input:focus,
body.high-contrast textarea:focus {
  outline: 3px solid black !important;
  box-shadow: none !important;
}
body.high-contrast input:invalid,
body.high-contrast textarea:invalid {
  border-color: transparent !important;
  outline: 2px dashed black !important;
}
body.high-contrast input:invalid:focus,
body.high-contrast textarea:invalid:focus {
  outline: 3px solid black !important;
}
body.high-contrast input[type=checkbox] {
  width: 24px;
  height: 24px;
  appearance: none; /* Remove default styles */
  background-color: transparent;
  border: 2px solid #ccc;
  border-radius: 4px;
  cursor: pointer;
  position: relative;
}
body.high-contrast input[type=checkbox]:checked {
  background-color: black !important;
  border: 2px solid black;
}
body.high-contrast .group-wrapper {
  border: 1px solid black;
}
body.high-contrast .group-wrapper.issues-container {
  border: none !important;
}
body.high-contrast .group-wrapper .alert.alert-danger,
body.high-contrast .group-wrapper .alert.alert-warning,
body.high-contrast .group-wrapper .alert.alert-success {
  color: var(--bs-body-color);
  border-color: black;
  background-color: white !important;
}
body.high-contrast .invalid-feedback {
  color: var(--bs-body-color);
  font-weight: bold;
}
body.high-contrast .was-validated .form-control:invalid {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23000000'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23000000' stroke='none'/%3e%3c/svg%3e");
}

body.account button[type=submit] span {
  padding-left: 0.5rem;
}
body.account button[type=submit]:focus {
  color: white !important;
  text-decoration: none;
}
body.account button[type=submit]:focus span {
  text-decoration: underline;
}
body.account input:-webkit-autofill,
body.account input:-webkit-autofill:hover,
body.account input:-webkit-autofill:focus,
body.account input:-webkit-autofill:active {
  box-shadow: 0 0 0 30px white inset !important;
  -webkit-box-shadow: 0 0 0 30px white inset !important;
}
body.account.login header, body.account.login main, body.account.login footer, body.account.login .issues-container {
  max-width: 512px;
  margin: auto;
}
body.account.manage header, body.account.manage main, body.account.manage footer, body.account.manage .issues-container {
  max-width: 900px;
  margin: auto;
}
body.account input.input-validation-error {
  border-color: transparent !important;
  outline: 2px dashed red !important;
}
body.account span.field-validation-error {
  color: var(--bs-form-invalid-color);
}
body.account .validation-summary-errors {
  padding: 1em;
  color: var(--bs-danger-text-emphasis);
  border: var(--bs-border-width) solid;
  border-radius: var(--bs-border-radius);
  border-color: var(--bs-danger-border-subtle);
  background-color: var(--bs-danger-bg-subtle);
}
body.account .validation-summary-errors ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

body.account.high-contrast button[type=submit]:focus {
  color: white !important;
}
body.account.high-contrast button[type=submit]:focus span {
  text-decoration: underline;
}
body.account.high-contrast input.input-validation-error {
  outline-color: black !important;
}
body.account.high-contrast span.field-validation-error {
  color: var(--bs-body-color);
}
body.account.high-contrast .validation-summary-errors {
  border-color: black;
  background-color: black;
  color: white;
}