#env-warning {
  display: none;
}

:root {
  --color-neutral-100: #ffffff;
  --color-neutral-200: #8c8c8c;
  --color-neutral-300: #1c1c1c;
  --color-neutral-400: #171717;
  --color-neutral-500: #0d0d0d;
  --color-neutral-900: #000000;
  --color-primary-400: #e60045;
  --color-alert--error: #ff0000;
  --color-alert--success: #4bb643;

  --color-neutral-900-10: rgba(0, 0, 0, 0.88);
  --color-neutral-900-20: rgba(0, 0, 0, 0.89);
}

@font-face {
  font-family: "PP Right Gothic";
  font-weight: 900;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/PPRightGothic-WideBlack.woff2");
}

@font-face {
  font-family: "PP Right Gothic";
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/PPRightGrotesk-Regular.woff2");
}

@font-face {
  font-family: "PP Right Gothic";
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url("../fonts/PPRightGrotesk-Bold.woff2");
}

html {
  background: var(--color-neutral-900);
}

body {
  background-color: var(--color-neutral-900);
  font-family: "PP Right Gothic", arial, sans-serif !important;
  font-weight: 400;
}

body h1,
body h2,
body h3 {
  font-family: "PP Right Gothic", arial, sans-serif !important;
  font-weight: 900;
  color: var(--color-primary-400);
}

.fa {
  color: var(--color-neutral-100) !important;
}

body h4,
body h5,
body h6 {
  font-family: "PP Right Gothic", arial, sans-serif !important;
  font-weight: 700;
  color: var(--color-primary-400);
}

body p {
  color: var(--color-neutral-100);
}

body a {
  color: var(--color-primary-400);
  text-decoration: underline;
}

body a:hover {
  color: var(--color-primary-400);
}

/* TODO: REPLACE WITH RELATIVE PATH */
#headerTitle h1 {
  background: url("../images/logo.png") 0 0 no-repeat;
  display: table-caption;
  text-indent: -99999em;
  height: 60px;
  width: 130px;
  background-size: contain;
  overflow: hidden;
}

/* ACTION CODE */
#checkCombinedVoucherActionCode #actionCodeForm {
  background-color: var(--color-neutral-900);
}

#checkCombinedVoucherActionCode .checkCombinedVoucherActionCode {
  height: 36px;
}

#checkCombinedVoucherActionCode .action-code-invalid {
  color: var(--color-primary-400);
}

.not-on-sale {
  background-color: var(--color-primary-400) !important;
}

/* LOGIN PAGE */
body[data-page="login-auth"] {
  background-color: var(--color-neutral-900);
}

.stltSideblock img {
  display: none;
}

body[data-page="login-auth"] #bodyWrapper .row {
  background-color: var(--color-neutral-400);
  margin-bottom: 20px;
  padding: 20px;
}

body[data-page="login-auth"] #login_form {
  color: var(--color-neutral-100);
}

.btn,
.btn.btn-lg,
.btn.btn-default {
  box-shadow: none;
  text-shadow: none;
  background-image: none;
  border: none;
  background-color: transparent;

  position: relative;
  padding: 0.5rem 1.5rem;
  color: var(--color-neutral-100);
  border: 3px solid var(--color-primary-400);
  border-radius: 100vh;
  cursor: pointer;
  text-decoration: none;
  transition: background-color 0.1s;
}

.btn:hover,
.btn.btn-lg:hover,
.btn.btn-default:hover {
  color: var(--color-neutral-100);
  background-color: var(--color-primary-400);
  border-color: var(--color-primary-400);
}

/* DETAILS */
.sideBlock {
  background-color: var(--color-neutral-400) !important;
  color: var(--color-neutral-100);
  padding: 30px !important;
}

body[data-page="mtTicket-guest"],
body[data-page="mtTicket-save_guest"],
body[data-page="mtTicket-checkout"] {
  background-color: var(--color-neutral-900);
}

body[data-page="mtTicket-guest"] input[type="text"],
body[data-page="mtTicket-save_guest"] input[type="text"] {
  color: var(--color-neutral-900);
}

body[data-page="mtTicket-guest"] .col-main,
body[data-page="account-change_email"] .col-main,
body[data-page="account-validate"] .col-main,
body[data-page="mtTicket-save_guest"] .col-main,
body[data-page="mtTicket-checkout"] .col-main,
body[data-page="mtTicket-shoppingbasket"] .col-main,
body[data-page="account-resetpwd"] .col-main,
body[data-page="mtTicket-cancelled"] .col-main,
body[data-page="mtTicket-pending"] .col-main,
body[data-page="account-signup"] .col-main,
body[data-page="account-save_signup"] .col-main,
body[data-page="account-info"] .col-main,
body[data-page="account-change"] .col-main {
  background-color: var(--color-neutral-400);
  color: var(--color-neutral-100);
  padding: 30px;
}

body[data-page="mtTicket-guest"] .form-group.errors ul,
body[data-page="mtTicket-save_guest"] .form-group.errors ul {
  border: none;
  background-color: var(--color-primary-400);
  color: var(--color-neutral-100);
}

input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--color-primary-400);
}

/* PAYMENT */
body[data-page="mtTicket-identify"] {
  background-color: var(--color-neutral-900);
}

body[data-page="mtTicket-identify"] .col-main {
  background-color: var(--color-neutral-400);
  padding: 30px;
}

/* TICKETS */
body[data-page="account-tickets"] .ticketButtonCell .scan-ticket.ticketButton {
  background-color: var(--color-primary-400) !important;
}

.account-tickets {
  border-color: var(--color-primary-400) !important;
}

body[data-page="account-tickets"] .ticketButtonCell .ticketButton {
  background-color: var(--color-primary-400) !important;
}

body[data-page="account-tickets"] .mtPerformanceTicket > * {
  background-color: var(--color-neutral-400) !important;
  color: var(--color-neutral-100) !important;
}

.promoteLogin {
  background-color: var(--color-primary-400) !important;
  border: none !important;
  margin-top: 10px;
}

.promoteLogin a {
  color: var(--color-neutral-100) !important;
}

.col-main .roundup {
  background-color: transparent;
}

.col-main .roundup .step.done .step-number,
.col-main .roundup .step.active .step-number {
  background-color: var(--color-primary-400);
}

.col-main .roundup .step.active {
  color: var(--color-primary-400);
}

/* SHOPPING CART PAGE */
body[data-page="mtTicket-shoppingbasket"] {
  background-color: var(--color-neutral-900);
}

#orderbasket .orderbasket th,
#orderbasket .orderbasket td,
#orderbasket .orderbasket {
  border-color: var(--color-neutral-400);
  border: none;
  border-collapse: collapse;
}

#orderbasket .orderPerformance tbody .sub:nth-child(odd) {
  background-color: var(--color-neutral-900-20);
}

#orderbasket .orderPerformance tbody .sub:nth-child(even) {
  background-color: var(--color-neutral-900-10);
}

#orderbasket .orderbasket tbody {
  color: var(--color-neutral-100);
}

#orderbasket .orderbasket tbody tr {
  background-color: var(--color-neutral-400);
}

#orderbasket .orderbasket tbody tr.main {
  color: var(--color-primary-400);
}

.orderCountdown {
  background-color: var(--color-primary-400) !important;
  color: var(--color-neutral-100) !important;
  text-transform: uppercase;
}

/* CONFIRMATION */
body[data-page="mtTicket-extra2"] {
  background-color: var(--color-neutral-900);
}

/* NAV PILLS */
.nav.nav-pills li a {
  position: relative;
  padding: 0.5rem 1.5rem;
  color: var(--color-neutral-100);
  border: 3px solid var(--color-primary-400);
  border-radius: 100vh;
  cursor: pointer;
  text-decoration: none;
  transition: background-color 0.1s;
}

.nav.nav-pills li a:hover {
  background-color: inherit;
}

.nav.nav-pills li.active > a {
  background-color: var(--color-primary-400);
}

/* SHOPPING CART */
.shoppingBasketBlock {
  padding: 30px !important;
  background-color: var(--color-neutral-400) !important;
}

.shoppingBasketBlock a {
  color: var(--color-primary-400) !important;
}

.textBlock.sideBlock {
  padding: 30px;
  background-color: var(--color-neutral-400);
}

/* CONFIRMED */
body[data-page="mtTicket-confirmed"] #orderbasket {
  padding: 30px;
  background-color: var(--color-neutral-400);
}

.orderNumber {
  color: var(--color-primary-400);
}

/* PERFORMANCE */
body[data-page="mtTicket-performance"] {
  background-color: var(--color-neutral-900);
}

body[data-page="mtTicket-performance"] #bodyWrapper .row .col-main {
  padding: 30px;
  background-color: var(--color-neutral-400);
  color: var(--color-neutral-100);
}

/* PROGRAM */
body[data-page="mtTicket-program"] {
  background-color: var(--color-neutral-900);
}

body[data-page="mtTicket-program"] .row .col-main .mtTicket-program {
  display: flex;
  flex-direction: column;
  margin-top: 20px;
  gap: 20px;
}

body[data-page="mtTicket-program"]
  .row
  .col-main
  .form-inline
  .performance-search
  input[name="search_performance"] {
  height: 36px;
  border: none;
  box-shadow: none;
  color: var(--color-neutral-900);
}

.mtPerformance.mtProgramPerformance {
  background-color: var(--color-neutral-400);
  border: none;
  padding: 30px;
}

.mtPerformance.mtProgramPerformance h3 {
  margin-top: 0;
}

.mtPerformance.mtProgramPerformance h3 .subtitle {
  display: block;
  margin-top: 4px;
  font-weight: 400;
  color: var(--color-neutral-100);
}

.mtPerformance.mtProgramPerformance .order,
.not-on-sale {
  right: 30px !important;
  bottom: 30px !important;
}

.mtPerformance .date,
.mtPerformance .location,
#reservationPerformance .tickets-available,
#reservationPerformance .choose-tickets {
  font-size: 18px;
}

.tandc-agreement {
  border: none !important;
}

@media (max-width: 767px) {
  .mtPerformance.mtProgramPerformance .order,
  .not-on-sale {
    right: 0px !important;
    bottom: 0px !important;
  }
}

.mtPerformance.mtProgramPerformance .order a {
  font-size: 18px;
}

.mtPerformance.mtProgramPerformance {
  color: var(--color-neutral-100);
}

.mtPerformance.mtProgramPerformance .fa {
  color: var(--color-neutral-100);
}

/* HEADER */
@media (max-width: 767px) {
  #headerWrapper {
    height: 85px !important;
  }

  #headerWrapper #header #headerMenu {
    font-size: 2em;
  }
}

#headerWrapper {
  border: none !important;
  background-color: var(--color-neutral-900) !important;
}

#headerWrapper.smaller {
  min-height: unset !important;
  height: inherit !important;
}

#headerWrapper.smaller #header {
  padding: 20px 15px 20px 10px !important;
}

#headerWrapper.smaller #header #headerMenu {
  font-size: 2em !important;
}

#headerWrapper #header {
  padding: 20px 15px 20px 10px;
  max-width: 1170px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#headerWrapper #header #headerMenu a {
  color: var(--color-neutral-100);

  :hover {
    color: var(--color-primary-400);
  }
}

/* PAGINATION */
.paginateButtons .currentStep {
  background-color: var(--color-primary-400) !important;
  border: none !important;
}

.paginateButtons .prevLink,
.paginateButtons .nextLink {
  background-color: var(--color-primary-400) !important;
  border: none !important;
  color: var(--color-neutral-100) !important;
}

.date > i,
.location > i {
  margin-right: 8px !important;
}

.date > i:nth-of-type(2) {
  margin-right: 8px !important;
  margin-left: 8px !important;
}

@media (max-width: 767px) {
  .date > i:nth-of-type(2) {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
}

.tandc-mustagree .formControls form {
  flex-direction: row !important;
  justify-content: space-between !important;
}

@media (max-width: 767px) {
  .tandc-mustagree .formControls form {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px;
  }
}
/* BODY */
#bodyWrapper {
  margin-top: 120px !important;
}

/* FOOTER */
#footerWrapper .mtContact {
  background-color: transparent !important;
  color: var(--color-neutral-100);
}

#footerWrapper .mtContactSatellite a {
  color: var(--color-primary-400);
}

#footerWrapper {
  display: none;
}

#headerMenu .english {
  display: none;
}

.choose-tickets .current-action-code {
  background-color: var(--color-primary-400);
  color: var(--color-neutral-100);
}

.delayed-date-highlight {
  background-color: var(--color-primary-400) !important;
  color: var(--color-neutral-100) !important;
}

#login.modal .modal-dialog .modal-content .modal-footer .btn {
  color: var(--color-primary-400);
}

#login.modal .modal-dialog .modal-content .modal-footer .btn:hover {
  color: var(--color-neutral-100);
}