@import "../MsfsAvionicsCommon/definitions";

:root {
  font-family: "HoneywellMCDU" !important;

  --mcduWhite: #ffffff;
  --mcduLightGrey: #666666;
  --mcduGrey: #787878;
  --mcduGreen: #00ff00;
  --mcduAmber: #ff9a00;
  --mcduCyan: #00ffff;
  --mcduYellow: #ffff00;
  --mcduRed: #ff0000;
  --mcduMagenta: #ff94ff;
}

@font-face {
  src: url("/Fonts/fbw-a32nx/HoneywellMCDU.ttf") format("truetype");
  font-family: "HoneywellMCDU";
  font-style: normal;
  font-weight: 900;
}

@font-face {
  src: url("/Fonts/fbw-a32nx/HoneywellMCDUSmall.ttf") format("truetype");
  font-family: "HoneywellMCDUSmall";
  font-style: normal;
  font-weight: 900;
}

#highlight {
  position: absolute;
  height: 100%;
  width: 100%;
  z-index: 10;
}

@keyframes TemporaryShow {
  0%,
  100% {
    visibility: visible;
  }
}

@keyframes TemporaryHide {
  0%,
  100% {
    visibility: hidden;
  }
}

#SystemTesting {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  text-align: center;
  justify-content: center;
}

#BackglowCDU {
  content: '';
  width: 100%;
  height: 100%;
  z-index: -99999;
  position: absolute;
  opacity: 1;
  background-color: rgba(4, 4, 4, 1);
}

#Mainframe {
  width: 100%;
  height: 100%;
}

span:empty:before {
  content: " ";
}

#MCDU_CONTENT {
  position: absolute;
  width: 100%;
  height: 100%;
}

a32nx-mcdu {
  font-family: "HoneywellMCDU" !important;
  font-size: 5.3vw !important;
  color: var(--displayWhite);
}

a32nx-mcdu div {
  font-family: "HoneywellMCDU" !important;
}

a32nx-mcdu text {
  font-family: "HoneywellMCDU" !important;
}

.white {
  color: var(--mcduWhite);
}

.inop {
  color: var(--mcduLightGrey);
}

.cyan {
  color: var(--mcduCyan);
}

.yellow {
  color: var(--mcduYellow);
}

.green {
  color: var(--mcduGreen);
}

.amber {
  color: var(--mcduAmber);
}

.red {
  color: var(--mcduRed);
}

.magenta {
  color: var(--mcduMagenta);
}

fmc-main-display::before {
  content: " ";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: linear-gradient(rgba(9, 13, 20, 1) 50%, rgba(9, 13, 20, 1) 50%),
    linear-gradient(
      90deg,
      rgba(9, 13, 20, 1),
      rgba(9, 13, 20, 1),
      rgba(9, 13, 20, 1)
    );
  z-index: 2;
  background-size: 100% 2px, 3px 100%;
  pointer-events: none;
}

#header {
  height: 8.1%;
  margin-top: 7.5%;
  margin-bottom: -3%;
  display: block;
  text-align: center;
}

#page-info {
  display: block;
  text-align: right;
  position: absolute;
  top: 7.5%;
  right: 5%;
}

.s-text,
text .s-text,
div .s-text,
span .s-text {
  font-family: HoneywellMCDUSmall, HoneywellMCDU !important;
  line-height: 1.25;
}

.b-text {
  font-family: HoneywellMCDU !important;
  letter-spacing: normal;
  line-height: normal;
}

.msg-text {
  margin-top: 1.5% !important;
  height: 8.1% !important;
}

.msg-text.label-left {
  left: 4% !important;
}

.msg-text.label-right {
  right: 6% !important;
}

.label {
  height: 6.55%;
  margin: 0;
  white-space: pre;
}

.label-left {
  position: absolute;
  left: 4.5%;
  width: 100%;
  text-align: left;
}

.label-right {
  position: absolute;
  right: 5%;
  width: 100%;
  text-align: right;
}

.label-center {
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
}

.line {
  height: 6.55%;
  margin: 0;
  white-space: pre;
}

.line-left {
  position: absolute;
  left: 4.5%;
  width: 100%;
  text-align: left;
}

.line-right {
  position: absolute;
  right: 5%;
  width: 100%;
  text-align: right;
}

.line-center {
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
}

#in-out {
  padding-left: 4%;
}

#arrow-vertical {
  float: right;
}

#arrow-horizontal {
  position: absolute;
  right: 1%;
  width: 100%;
  text-align: right;
}
