@font-face {
  font-family: "Cera Pro";
  src: url("fonts/CeraPro-Regular.otf") format("opentype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Cera Pro";
  src: url("fonts/CeraPro-Medium.otf") format("opentype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "Cera Pro";
  src: url("fonts/CeraPro-Bold.otf") format("opentype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Cera Pro";
  src: url("fonts/CeraPro-Black.otf") format("opentype");
  font-style: normal;
  font-weight: 900;
  font-display: swap;
}

body,
button,
input,
select,
textarea {
  font-family: "Cera Pro", Arial, sans-serif;
}

h1,
h2,
h3 {
  font-family: "Cera Pro", Arial, sans-serif;
  font-weight: 900;
}

button,
.button {
  font-weight: 700;
}

.eyebrow,
small,
.formHint,
.fieldsetLead,
.heroTechnical,
.eventFacts,
.tickerGroup,
th,
.pass span {
  font-weight: 500;
}

/* ICLO web palette for the portal interface. */
body:has(.appbar) {
  --ink: #2e2d2c;
  --red: #f7ab64;
  --gold: #c69a52;
}

body:has(.appbar) .eyebrow {
  color: #100675;
}

body:has(.appbar) button:not(.secondary),
body:has(.appbar) .button:not(.secondary) {
  color: #2e2d2c;
}

body:has(.appbar) .qr,
body:has(.appbar) .scanner video,
body:has(.appbar) .cameraPlaceholder {
  background: #100675;
}

/* Form fields hidden by the billing choice must never occupy layout space. */
body:has(.appbar) label[hidden],
body:has(.appbar) div[hidden] {
  display: none !important;
}