/* Moin.Moments Markenebene.
   Wird NACH style.css geladen und schreibt die Token um. style.css bleibt
   unangetastet, damit die Engineering-Seite davon nichts merkt.
   Farben stammen aus dem Signet: Navy 05233D, Gold C49969. */

:root {
    color-scheme: light;

    /* Marke */
    --mark-navy: #05233d;
    --mark-gold: #c49969;

    /* Token aus style.css umdefiniert */
    --primary: #05233d;
    --primary-dark: #021728;
    --accent: #c49969;
    --accent-alt: #a87f50;

    --bg-white: #ffffff;
    --bg-light: #f5f7f8;
    --bg-gray: #eaeef1;

    --text-primary: #05233d;
    --text-secondary: #4a5c6b;
    --text-tertiary: #7b8b98;
    --border: #dde4e9;

    /* Schatten in den Navy-Ton getönt statt reinem Schwarz */
    --shadow-sm: 0 1px 2px rgba(5, 35, 61, .06), 0 2px 8px rgba(5, 35, 61, .04);
    --shadow-md: 0 4px 12px rgba(5, 35, 61, .07), 0 12px 32px rgba(5, 35, 61, .06);
    --shadow-lg: 0 12px 28px rgba(5, 35, 61, .09), 0 32px 64px rgba(5, 35, 61, .08);

    /* Radien: Eingaben 10, Karten 16, keine Pillen ausser bei Marken-Chips */
    --radius-sm: 10px;
    --radius-md: 14px;
    --radius-lg: 18px;

    /* Eigene Token der Landingpage */
    --gold-weich: #f0e3d4;
    --gold-linie: #e2cdb2;
    --navy-weich: #eef2f5;
    --papier: #f5f7f8;
    --schrift-display: "Playfair Display", Georgia, "Times New Roman", serif;
    --schrift-text: "Outfit", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --takt: 1.25rem;
}

/* Grundschriften. Playfair traegt die Ueberschriften wie im Signet,
   Outfit den Lauftext und die Bedienung. */
body,
input, select, textarea, button {
    font-family: var(--schrift-text);
}

h1, h2, h3,
.hero-title,
.section-title {
    font-family: var(--schrift-display);
    font-weight: 500;
    letter-spacing: -0.012em;
    color: var(--mark-navy);
}

/* Die alte ed-flock-Verlaufsschrift abschalten. Verlaufstext in
   Ueberschriften war der auffaelligste Rest der alten Optik. */
.gradient-text {
    background: none;
    -webkit-background-clip: initial;
    background-clip: initial;
    -webkit-text-fill-color: currentColor;
    color: var(--mark-gold);
}

/* Feste Blau- und Lilawerte, die an den Token vorbei im Bestand stehen.
   Gefunden ueber eine Suche nach 0066FF, 0052CC, 667eea und 764ba2. */
.btn-primary,
.nav-link-cta {
    background: var(--mark-navy);
    color: #fff;
    border-color: var(--mark-navy);
}
.btn-primary:hover,
.nav-link-cta:hover {
    background: var(--primary-dark);
    border-color: var(--primary-dark);
}
.btn-primary:active,
.nav-link-cta:active {
    transform: translateY(1px);
}

a { color: var(--mark-navy); }
a:hover { color: var(--accent-alt); }

::selection {
    background: var(--gold-weich);
    color: var(--mark-navy);
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 2px solid var(--mark-gold);
    outline-offset: 2px;
    border-radius: 4px;
}

/* ------------------------------------------------------------------------
   Feste Blauwerte aus dem Bestand.
   Sie stehen nicht als Hex, sondern als rgba(0, 102, 255, x) in rund 45
   Regeln, deshalb greift die Token-Umdefinition dort nicht. Alles hier ist
   auf body.mm eingegrenzt, damit die laufenden Seiten unberuehrt bleiben.
   Beim endgueltigen Umstieg wandern diese Werte in den Quelldateien auf
   var(--primary), dann kann dieser Block weg.
   ------------------------------------------------------------------------ */

body.mm .skip-link { background: var(--mark-navy); }

/* Marken-Chips und Abschnittsmarken: goldener Anflug statt Blau */
body.mm .section-label,
body.mm .booking-summary .section-label,
body.mm .product-group-tag {
    background: rgba(196, 153, 105, .12);
    color: var(--accent-alt);
}

/* Auswahl und Zustand: Navy */
body.mm .product-option.is-selected,
body.mm .package-option.is-selected,
body.mm .option-card:has(input:checked),
body.mm .booking-pay-options .payment-option:has(input:checked) {
    border-color: var(--mark-navy);
    background: rgba(5, 35, 61, .05);
}
body.mm .product-option-price,
body.mm .package-option .package-price,
body.mm .single-package .package-price {
    color: var(--mark-navy);
}
body.mm .booking-step { background: rgba(5, 35, 61, .08); }
body.mm .availability-box {
    background: rgba(5, 35, 61, .05);
    border-color: rgba(5, 35, 61, .14);
}
body.mm .price-package-featured,
body.mm .single-package,
body.mm .audiobook-card {
    border-color: rgba(5, 35, 61, .18);
}
body.mm .audiobook-card-icon { background: rgba(196, 153, 105, .16); color: var(--accent-alt); }
body.mm .voucher-input-row input:focus,
body.mm .pb-evlogin-input:focus {
    border-color: var(--mark-navy);
    box-shadow: 0 0 0 3px rgba(5, 35, 61, .12);
}
body.mm .tool-button:hover { border-color: var(--mark-navy); color: var(--mark-navy); }
body.mm .hero-bg, body.mm .photobox-cta-band { background-image: none; }

/* Gestalter */
body.mm .pbd-tool:hover:not(:disabled),
body.mm .pbd-template:hover,
body.mm .pbd-template:focus-visible { border-color: var(--mark-navy); color: var(--mark-navy); }
body.mm .pbd-object.is-selected { border-color: var(--mark-navy); }
body.mm .pbd-mini-photo { border-color: #9fb4c6; }

/* Cookie-Hinweis. Der fuegt sein CSS zur Laufzeit ein und stuende damit
   spaeter in der Reihenfolge, deshalb hier hoehere Gewichtung ueber body.mm. */
body.mm .cookie-banner { border-left-color: var(--mark-navy); }
body.mm .cookie-content a { color: var(--mark-navy); }
body.mm .btn-cookie.accept,
body.mm .btn-cookie.save {
    background: var(--mark-navy);
    border-color: var(--mark-navy);
    color: #fff;
}
body.mm .btn-cookie.accept:hover,
body.mm .btn-cookie.save:hover { background: #021728; border-color: #021728; }
body.mm .btn-cookie.settings {
    color: var(--mark-navy);
    border-color: rgba(5, 35, 61, .32);
}

/* Der Preis in den Paketkacheln der Buchungsstrecke haengt an einem
   klassenlosen span, deshalb ueber den Elternteil angesprochen. */
body.mm .package-option > span { color: var(--mark-navy); }
