@font-face {
  font-family: NotoSansDisplay;
  src: url("../fonts/noto-sans-display-v10-latin-400.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: block;
}

@font-face {
  font-family: NotoSansDisplay;
  src: url("../fonts/noto-sans-display-v10-latin-600.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: block;
}

@font-face {
  font-family: NotoSansDisplay;
  src: url("../fonts/noto-sans-display-v10-latin-700.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: block;
}

@font-face {
  font-family: MMHeadline;
  src: url("../fonts/MMHeadlineProWebTT-Regular_subset.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: block;
}

@font-face {
  font-family: MMPrice;
  src: url("../fonts/MediaMarktPreise.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: block;
}

@font-face {
  font-family: "NotoSansDisplay-fallback";
  size-adjust: 106.53%;
  ascent-override: 102%;
  src: local("Arial");
}

:root {
  --font-body: NotoSansDisplay, "NotoSansDisplay-fallback", Arial, sans-serif;
  --font-heading: MMHeadline, Arial, sans-serif;
  /* The reference PDP renders its prominent prices in MMHeadline. */
  --font-price: MMHeadline, MMPrice, Arial, sans-serif;
}

html,
body,
button,
input,
select,
textarea {
  font-family: var(--font-body) !important;
}

.site-header,
.site-store-footer,
.admin,
.admin-login {
  font-family: var(--font-body) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
[role="heading"],
button,
input,
select,
textarea {
  font-family: var(--font-body) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  font-synthesis: none !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
[role="heading"] {
  letter-spacing: normal !important;
}

input::placeholder,
textarea::placeholder {
  color: #777 !important;
  font-family: var(--font-body) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  opacity: 1 !important;
}

.price,
.sticky-price,
.buyprice,
.offer-price,
.total-price,
.product-price,
.added-price,
.reco-price,
.amount,
[data-money],
[data-price] {
  font-family: var(--font-body) !important;
}

/* Product-page typography: only the prominent upper price uses MMHeadline. */
#title,
.specgroup > h3,
.site-store-footer h3,
.reco-card h4 {
  font-family: var(--font-body) !important;
  font-style: normal !important;
  font-weight: 400 !important;
}

.sticky-price {
  font-family: var(--font-body) !important;
  font-style: normal !important;
  font-weight: 700 !important;
}

#price.price {
  width: auto !important;
  height: auto !important;
  font-family: var(--font-price) !important;
  font-size: 48px !important;
  line-height: 1 !important;
  font-weight: 400 !important;
}

/* One consistent language control that blends into every red header. */
.site-language__button,
.payment-locale,
.locale {
  width: 70px !important;
  height: 36px !important;
  border: 0 !important;
  border-radius: 4px !important;
  background-color: transparent !important;
  color: #fff !important;
  font-family: var(--font-body) !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  cursor: pointer;
}

.site-language__button {
  gap: 6px !important;
  justify-content: center !important;
  padding: 0 4px !important;
}

.site-language__button svg {
  display: block !important;
  width: 22px !important;
  height: 22px !important;
}

.site-language__button svg path {
  fill: #fff !important;
}

.site-language__button .sr-only {
  display: none !important;
}

.payment-locale,
.locale {
  padding: 0 3px 0 28px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M12.73 2.027a1 1 0 0 0-.351-.02 10 10 0 0 0-.758 0 1 1 0 0 0-.35.02 10 10 0 0 0 0 19.946 1 1 0 0 0 .35.02 10 10 0 0 0 .758 0 1 1 0 0 0 .35-.02 10 10 0 0 0 0-19.946M9.622 4.36A8 8 0 0 0 5.073 8h3.3a18 18 0 0 1 1.252-3.639M10.43 8c.35-1.354.876-2.66 1.57-3.885A16 16 0 0 1 13.57 8zm-2.396 2h-3.78a8 8 0 0 0 0 4h3.78a18 18 0 0 1 0-4m2.014 4a16 16 0 0 1 0-4h3.904a16 16 0 0 1 0 4zm-1.676 2h-3.3a8 8 0 0 0 4.551 3.639A18 18 0 0 1 8.373 16M12 19.885A16 16 0 0 1 10.43 16h3.14A16 16 0 0 1 12 19.885m2.377-.246q.347-.108.684-.248A8 8 0 0 0 18.929 16h-3.3a18 18 0 0 1-1.251 3.639M15.967 14h3.779a8 8 0 0 0 0-4h-3.78a18 18 0 0 1 0 4m-.34-6h3.301a8 8 0 0 1-4.552-3.639A18 18 0 0 1 15.629 8' clip-rule='evenodd'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 3px center !important;
  background-size: 22px 22px !important;
}

.payment-locale option,
.locale option {
  background: #fff;
  color: #111;
}

/* Payment and verification modal titles must stay neutral and upright. */
#chooseTitle,
#confirmationTitle,
#loadingTitle,
#statusTitle,
#orderSummaryTitle,
#statusOrderSummaryTitle {
  font-family: var(--font-body) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  font-synthesis: none !important;
  letter-spacing: normal !important;
}

#back.back {
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  font-size: 0 !important;
}

#back.back svg {
  display: block;
  width: 22px;
  height: 22px;
}

#pay.pay {
  background: #050505 !important;
}

#pay.pay:hover:not(:disabled) {
  background: #292929 !important;
}