/* ══════════════════════════════════════════════════════════════════
   pkg144 · Neuer Bikeley-Stil — Marktplatz
   ══════════════════════════════════════════════════════════════════
   Diese Datei enthaelt nur das, was NICHT in den einzelnen
   Marktplatz-Stylesheets stehen kann:

     1. Oxanium, selbst gehostet
     2. die globalen Variablen aus app.css und bikeley-tokens.css,
        eingegrenzt auf die Marktplatz-Seiten
     3. die Formensprache: dunkle Kante statt Schatten, engere Ecken

   Die Farben selbst stehen in den jeweiligen Dateien und im
   --market-*-Block oben in marketplace.css.
   ══════════════════════════════════════════════════════════════════ */

@font-face{font-family:'Oxanium';src:url('/assets/fonts/oxanium-latin-400-normal.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Oxanium';src:url('/assets/fonts/oxanium-latin-500-normal.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Oxanium';src:url('/assets/fonts/oxanium-latin-600-normal.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Oxanium';src:url('/assets/fonts/oxanium-latin-700-normal.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Oxanium';src:url('/assets/fonts/oxanium-latin-800-normal.woff2') format('woff2');font-weight:800;font-display:swap}

body.is-marketplace-page,
body.marketplace-bike-page,
body.marketplace-checkout-page{
  /* app.css */
  --bg:#FAF9E5; --surface:#F8FAE5; --surface-2:#F2F1DE;
  --text:#040C21; --muted:#5E5F61; --border:rgba(4,12,33,.14);
  --primary:#040C21; --primary-contrast:#FAF9E5;
  --accent:#E73101; --accent-rgb:231,49,1; --accent-2:#C22800;
  --accent-gradient:linear-gradient(135deg,#E73101 0%,#C22800 100%);
  --cta-fill:linear-gradient(180deg,#0A1428 0%,#040C21 100%);
  --focus:rgba(4,12,33,.18); --featured:#040C21;
  --shadow:0 10px 30px rgba(4,12,33,.10);
  --shadow-sm:0 6px 18px rgba(4,12,33,.08);
  /* bikeley-tokens.css */
  --bk-ink:#040C21; --bk-paper:#F8FAE5; --bk-mist:#F2F1DE;
  --bk-line:rgba(4,12,33,.14); --bk-slate:#5E5F61; --bk-red:#E73101;

  background:#FAF9E5;
  color:#040C21;
  font-family:'Oxanium',system-ui,-apple-system,'Segoe UI',sans-serif;
}

body.is-marketplace-page main *:not(i):not([class*="icon"]),
body.marketplace-bike-page main *:not(i):not([class*="icon"]),
body.marketplace-checkout-page main *:not(i):not([class*="icon"]){
  font-family:'Oxanium',system-ui,-apple-system,sans-serif;
}

/* Kopf und Fuss auf die neue Palette */
body.is-marketplace-page .site-header,
body.marketplace-bike-page .site-header{
  background:#FAF9E5 !important;
  border-bottom:1px solid rgba(4,12,33,.14);
}
body.is-marketplace-page .sf.sf--dark,
body.marketplace-bike-page .sf.sf--dark{background:#040C21 !important}
body.is-marketplace-page .sf a,
body.marketplace-bike-page .sf a{color:rgba(250,249,229,.72)}
body.is-marketplace-page .sf a:hover,
body.marketplace-bike-page .sf a:hover{color:#FAF9E5}
body.is-marketplace-page .sf, body.is-marketplace-page .sf *,
body.marketplace-bike-page .sf, body.marketplace-bike-page .sf *{
  font-family:'Oxanium',system-ui,sans-serif;
}

/* ── Formensprache: dunkle Kante statt Schatten ────────────────────
   Die Klassennamen sind aus den Marktplatz-Stylesheets ausgelesen,
   nicht geraten: alles mit border-radius >= 12px und eigener Flaeche
   gilt als Karte, alles darunter als Kleinteil.

   Bewusst NICHT dabei: Bild- und Medienflaechen (__media, __thumb,
   __stage, .ml-guide-*, .mkt-cat-tile) — die leben von ihrem Foto und
   wirken mit dunklem Rahmen wie Briefmarken. */

body.is-marketplace-page :is(
  .mkt-card, .ml-card, .ml-brand-card, .ml-trust, .ml-pill,
  .market-section, .market-side-card, .market-service-card,
  .market-buybox, .market-part__price-card, .market-part__seller,
  .market-part__trust, .market-empty-state, .mkt-empty,
  .market-inquiry-inline, .market-inquiry-success,
  .market-filters, .market-sorter, .market-pagination,
  .checkout__section, .checkout__summary-card, .checkout__trust,
  .bb__dealer-card, .bb__leasing-card, .bb__inquiry,
  .provider-market-card, .provider-market-form, .stat-card, .radio-card
),
body.marketplace-bike-page :is(
  .mkt-card, .market-buybox, .market-side-card, .market-section,
  .bb__dealer-card, .bb__leasing-card, .bb__inquiry
),
body.marketplace-checkout-page :is(
  .checkout__section, .checkout__summary-card, .checkout__trust
){
  border:1px solid #040C21 !important;
  border-radius:16px !important;
  box-shadow:none !important;
}

/* Kleinteile: gleiche Kante, flacher */
body.is-marketplace-page :is(
  .market-chip, .market-type-chip, .market-size-chip, .market-color-chip,
  .market-keyfact-chip, .market-keyfact-pill, .market-inquiry-chip,
  .mkt-card__size-chip, .mkt-toolbar__badge, .mkt-pagination__page,
  .market-pagination__page, .market-pagination__nav,
  .market-filter-input, .market-filter-select, .market-filter-trigger,
  .checkout__field, .form-field, .bb__chip, .ml-brand
),
body.marketplace-bike-page :is(
  .market-chip, .market-size-chip, .market-keyfact-chip, .bb__chip
){
  border:1px solid #040C21 !important;
  border-radius:9px !important;
  box-shadow:none !important;
}

/* Badges behalten ihre Signalfarbe und brauchen keine Kante */
body.is-marketplace-page :is(.mkt-badge, .market-badge--sale,
  .market-badge--year, .bb__price-badge, .bb__leasing-badge){
  border:0 !important;
  border-radius:8px !important;
}

/* Knoepfe: weiche Ecken, Akzent als Hauptfarbe */
body.is-marketplace-page :is(.btn, .bb__cta-btn, .bb__action-btn,
  .bb__dealer-btn, .mkt-hero__cta, .ml-cta__btn, .ml-hero__btn,
  .ml-sale-banner__btn, .mkt-pagination__btn, .provider-card__btn,
  .market-part__variant-btn, .checkout__submit, .bb__inquiry-submit,
  .market-filters__apply, .market-buybox__primary),
body.marketplace-bike-page :is(.btn, .bb__cta-btn, .bb__action-btn,
  .market-buybox__primary){
  border-radius:10px !important;
}
body.is-marketplace-page :is(.btn--primary, .btn-primary, .bb__cta-btn,
  .market-buybox__primary, .checkout__submit, .bb__inquiry-submit),
body.marketplace-bike-page :is(.bb__cta-btn, .market-buybox__primary){
  background:#E73101 !important;
  border-color:#E73101 !important;
  color:#fff !important;
}

/* Suchfeld im Marktplatz-Kopf war noch weiss */
body.is-marketplace-page :is(.mh-search, .nav__market-search,
  .mh-search-popup__form){
  background:#F8FAE5 !important;
  border:1px solid #040C21 !important;
  border-radius:12px !important;
}

@media (prefers-reduced-motion:reduce){
  body.is-marketplace-page *, body.marketplace-bike-page *{
    transition:none !important;
  }
}

/* ── Sicherung für den Marktplatz-Kopf ──────────────────────────────
   marketplace-header.css wird aus base.php mit eigener, fester
   Versionsnummer geladen. Wer die nicht mit hochzieht, bekommt die
   alte weisse Fassung aus dem Cache. Diese Datei laedt danach und
   kann sie ueberschreiben — als Netz, falls die Nummer in base.php
   nicht angepasst wird. */
body.is-marketplace-page :is(
  .mh-mega__panel, .mh-mega, .mh-drawer, .mh-drawer__subnav,
  .mh-search-popup__card, .mh-search-popup__form, .mh-search-popup__chip,
  .mh-suggest__panel, .mh-suggest__item, .mh-suggest__all,
  .mh-search-popup__all-link, .mh-tab, .mh-search
),
body.marketplace-bike-page :is(
  .mh-mega__panel, .mh-mega, .mh-drawer, .mh-search-popup__card,
  .mh-suggest__panel, .mh-search
){
  background:#F8FAE5 !important;
  color:#040C21 !important;
}
body.is-marketplace-page :is(.mh-mega__panel, .mh-drawer,
  .mh-search-popup__card, .mh-suggest__panel){
  border:1px solid #040C21 !important;
  border-radius:16px !important;
  box-shadow:none !important;
}
body.is-marketplace-page :is(.mh-link, .mh-mega__footer-link,
  .mh-drawer__close, .mh-mega__close){color:#040C21 !important}
body.is-marketplace-page .mh-search-popup{background:rgba(4,12,33,.45) !important}

/* Suchvorschläge: die Ergebniskarten hatten einen Rahmen bei 8%
   Deckung — vorhanden, aber unsichtbar. Volle Kante, kein Schatten,
   und beim Ueberfahren derselbe Umschlag wie ueberall. */
body.is-marketplace-page :is(.mh-suggest__item, .mh-search-popup__result,
  .mh-search-popup__card, .mh-suggest__all, .mh-search-popup__all-link),
body.marketplace-bike-page :is(.mh-suggest__item, .mh-search-popup__result){
  border:1px solid #040C21 !important;
  border-radius:14px !important;
  box-shadow:none !important;
}
body.is-marketplace-page :is(.mh-suggest__item, .mh-search-popup__result):hover{
  background:#040C21 !important;
  color:#FAF9E5 !important;
  transform:translateY(-1px);
  box-shadow:none !important;
}
body.is-marketplace-page :is(.mh-suggest__item, .mh-search-popup__result):hover
  :is(h3, h4, strong, span, div, p){color:#FAF9E5 !important}
/* Das Bildfeld darin behaelt seine helle Flaeche, damit das Rad sichtbar bleibt */
body.is-marketplace-page :is(.mh-suggest__item, .mh-search-popup__result):hover
  :is(.mh-suggest__thumb, .mh-search-popup__result-img){
  background:#F8FAE5 !important;
}
body.is-marketplace-page .mh-suggest__thumb{
  border:1px solid rgba(4,12,33,.14) !important;
  border-radius:10px !important;
}

/* Knöpfe: Umschlag auf Ink statt hellem Schatten.
   app.css setzt beim Ueberfahren nur box-shadow — die Flaeche bleibt
   hell. Hier kippt sie, wie auf den uebrigen Seiten. */
body.is-marketplace-page :is(.btn, .btn-small, .btn-ghost),
body.marketplace-bike-page :is(.btn, .btn-small, .btn-ghost),
body.marketplace-checkout-page :is(.btn, .btn-small){
  border:1px solid #040C21 !important;
  border-radius:10px !important;
  transition:background .2s ease, color .2s ease, transform .14s ease !important;
}
body.is-marketplace-page :is(.btn, .btn-small, .btn-ghost):hover,
body.marketplace-bike-page :is(.btn, .btn-small, .btn-ghost):hover,
body.marketplace-checkout-page :is(.btn, .btn-small):hover{
  background:#040C21 !important;
  color:#FAF9E5 !important;
  box-shadow:none !important;
  transform:translateY(-1px);
}
body.is-marketplace-page :is(.btn, .btn-small):hover :is(span, svg, i),
body.marketplace-bike-page :is(.btn, .btn-small):hover :is(span, svg, i){
  color:#FAF9E5 !important;
}
/* Hauptknoepfe: tiefer statt heller */
body.is-marketplace-page :is(.btn-primary, .btn-accent, .btn--primary,
  .bb__cta-btn, .market-buybox__primary, .checkout__submit):hover,
body.marketplace-bike-page :is(.bb__cta-btn, .market-buybox__primary):hover{
  background:#C22800 !important;
  border-color:#C22800 !important;
  color:#fff !important;
}
/* Kopfleiste */
body.is-marketplace-page .site-header :is(.nav__icon-btn, .nav-menu__summary):hover{
  background:#040C21 !important; color:#FAF9E5 !important;
}