/*
 * MWS Front Wave V17
 * Gemeinsamer öffentlicher Hintergrund + Header-/Footer-Größen.
 * Wird ausschließlich auf Start, Legal, Store, Billing, Demo und Auth geladen.
 */

:root {
    --mws-front-header-height: 72px;
    --mws-front-header-width: 1220px;
    --mws-front-wave-soft: rgba(125, 78, 210, .10);
    --mws-front-wave-line: rgba(154, 102, 242, .17);
    --mws-front-wave-bright: rgba(208, 157, 255, .38);
}

html[data-theme="light"] {
    --mws-front-wave-soft: rgba(95, 59, 145, .065);
    --mws-front-wave-line: rgba(107, 67, 166, .105);
    --mws-front-wave-bright: rgba(124, 58, 237, .20);
}

html {
    background: #08030f;
}

html[data-theme="light"] {
    background: #f5f0fb;
}

body.mws-wave-page {
    position: relative;
    min-height: 100vh;
    min-height: 100dvh;
    isolation: isolate;
    background:
        radial-gradient(circle at 49% 42%, rgba(139, 92, 246, .20) 0%, rgba(109, 40, 217, .08) 26%, transparent 50%),
        radial-gradient(ellipse at 50% 112%, rgba(192, 132, 252, .09), transparent 48%),
        linear-gradient(180deg, #090411 0%, #08030f 54%, #050209 100%) !important;
    overflow-x: hidden;
}

html[data-theme="light"] body.mws-wave-page {
    background:
        radial-gradient(circle at 49% 42%, rgba(167, 139, 250, .20) 0%, rgba(216, 180, 254, .11) 26%, transparent 51%),
        radial-gradient(ellipse at 50% 110%, rgba(124, 58, 237, .06), transparent 48%),
        linear-gradient(180deg, #fcfbff 0%, #f5f0fd 51%, #eee8f8 100%) !important;
}

/* Alte öffentliche Hintergrundsysteme deaktivieren. */
body.mws-wave-page .site-backdrop,
body.mws-wave-page .page-grid,
body.mws-wave-page .page-orb,
body.mws-wave-page .billing-orb,
body.mws-wave-page .orb {
    display: none !important;
}

body.mws-wave-page::before {
    content: none !important;
    display: none !important;
}

body.mws-wave-page::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(0,0,0,.34), transparent 18%, transparent 82%, rgba(0,0,0,.34)),
        linear-gradient(180deg, rgba(0,0,0,.18), transparent 20%, transparent 76%, rgba(0,0,0,.34));
    box-shadow: inset 0 0 150px rgba(0,0,0,.42);
}

html[data-theme="light"] body.mws-wave-page::after {
    background:
        linear-gradient(90deg, rgba(83,49,125,.035), transparent 18%, transparent 82%, rgba(83,49,125,.035)),
        linear-gradient(180deg, rgba(255,255,255,.34), transparent 21%, transparent 78%, rgba(108,75,148,.045));
    box-shadow: inset 0 0 145px rgba(98,64,138,.055);
}

.mws-wave-canvas {
    position: fixed;
    inset: 0;
    z-index: -3;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: .94;
    transform: translateZ(0);
}

html[data-theme="light"] .mws-wave-canvas {
    opacity: .52;
    mix-blend-mode: multiply;
}

/* Nur die Größe wird vereinheitlicht, das jeweilige Seitendesign bleibt erhalten. */
body.mws-wave-page .site-header,
body.mws-wave-page .shop-header {
    width: min(var(--mws-front-header-width), calc(100% - 28px)) !important;
    min-height: var(--mws-front-header-height) !important;
    height: auto;
    margin-top: 14px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    box-sizing: border-box;
}

body.mws-wave-page .billing-header {
    max-width: var(--mws-front-header-width) !important;
}

/* Auth besitzt bewusst keine Navbar. Nur die vorhandenen Controls bleiben kompakt. */
body.auth-page.mws-wave-page .auth-controls {
    min-height: 44px;
}

/* Einheitlicher transparenter öffentlicher Footer. */
.mws-public-footer.site-footer,
.mws-public-footer.minimal-footer,
.mws-public-footer.store-home-footer,
.mws-public-footer.legal-footer,
.mws-public-footer.billing-footer {
    position: relative;
    z-index: 2;
    width: min(1180px, calc(100% - 32px));
    margin: 38px auto 18px;
    padding: 26px 0 16px;
    border: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    color: inherit;
}

.mws-public-footer .footer-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    gap: 18px;
    text-align: center;
}

.mws-public-footer .footer-brand {
    display: grid;
    justify-items: center;
    gap: 9px;
    max-width: 680px;
}

.mws-public-footer .footer-logo {
    display: block;
    width: 72px;
    height: 46px;
    margin: 0 !important;
    object-fit: contain;
}

.mws-public-footer .footer-brand p {
    margin: 0;
    max-width: 650px;
    color: var(--mws-muted, var(--muted, rgba(255,255,255,.62)));
    font-size: .76rem;
    line-height: 1.55;
}

.mws-public-footer .footer-links,
.mws-public-footer .footer-link-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px 16px;
}

.mws-public-footer .footer-link-row a {
    color: var(--mws-muted, var(--muted, rgba(255,255,255,.68)));
    font-size: .72rem;
    font-weight: 800;
    text-decoration: none;
}

.mws-public-footer .footer-link-row a:hover {
    color: var(--mws-text, var(--text, #fff));
}

.mws-public-footer .footer-bottom {
    display: flex;
    justify-content: center;
    margin-top: 17px;
    padding-top: 13px;
    border-top: 1px solid color-mix(in srgb, currentColor 9%, transparent);
}

.mws-public-footer .footer-meta {
    color: var(--mws-soft, var(--soft, rgba(255,255,255,.46)));
    font-size: .66rem;
}

@media (max-width: 760px) {
    :root {
        --mws-front-header-height: 68px;
    }

    body.mws-wave-page .site-header,
    body.mws-wave-page .shop-header {
        width: min(var(--mws-front-header-width), calc(100% - 18px)) !important;
        margin-top: 9px !important;
    }

    .mws-public-footer.site-footer {
        width: min(100% - 24px, 1180px);
        margin-top: 28px;
        padding-top: 20px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mws-wave-canvas {
        opacity: .72;
    }
}
