/*
 * Hinweis „Aktuelles“ der Restaurantseiten, für alle Vorlagen (notice.js, docs/restopage-website-vorlagen.md).
 * Aufbau: schmales Band oben im Startbild bzw. Kopfbild, Titel als kleines Etikett vor dem Text, kurze Zeilen als Fließtext
 * mit Punkten (am Handy als Aufzählung). Das Aussehen hier ist das der Standard-Vorlage (Fläche in der Farbe, die das
 * Restaurant für die Meldung gewählt hat); Abendlicht und Standard Modern setzen in ihrem CSS ihr eigenes Aussehen.
 */

.restaurant-home-main__intro-stack.tpl-empty {
    display: none !important;
}

.tpl-has-notice {
    position: relative;
}

body .announcement_section.tpl-notice-band {
    position: absolute !important;
    top: var(--tpl-notice-top, 16px);
    left: 50%;
    z-index: 6;
    width: min(1180px, calc(100% - 2 * clamp(16px, 3vw, 40px))) !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: translateX(-50%);
}

body .announcement_section.tpl-notice-band .restaurant-home-main__announcement-shell {
    display: flex !important;
    align-items: baseline;
    gap: 16px;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 13px 20px 14px !important;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.08) !important;
    border-left: 4px solid var(--restaurant-announcement-accent, #16a34a) !important;
    border-radius: 14px !important;
    background: var(--tpl-notice-bg, rgba(255, 255, 255, 0.94)) !important;
    box-shadow: 0 18px 44px -24px rgba(15, 23, 42, 0.45) !important;
    -webkit-backdrop-filter: blur(14px) saturate(130%);
    backdrop-filter: blur(14px) saturate(130%);
    color: var(--restaurant-announcement-ink, #0f172a) !important;
}

body .announcement_section.tpl-notice-band .restaurant-home-main__announcement-shell::before,
body .announcement_section.tpl-notice-band .restaurant-home-main__announcement-shell::after,
body .announcement_section.tpl-notice-band .restaurant-home-main__announcement-icon,
body .announcement_section.tpl-notice-band .restaurant-home-main__announcement-kicker {
    display: none !important;
}

body .announcement_section.tpl-notice-band .restaurant-home-main__announcement-head {
    display: block !important;
    flex: none;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

body .announcement_section.tpl-notice-band .restaurant-home-main__announcement-copy {
    display: block !important;
}

body .announcement_section.tpl-notice-band .restaurant-home-main__announcement-title {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    max-width: none !important;
    color: var(--restaurant-announcement-accent, #16a34a) !important;
    font-size: 0.72rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.14em !important;
    line-height: 1.6 !important;
    text-transform: uppercase;
    white-space: nowrap;
}

body .announcement_section.tpl-notice-band .restaurant-home-main__announcement-title::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
}

body .announcement_section.tpl-notice-band .restaurant-home-main__announcement-content {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    font-size: 0.98rem !important;
    line-height: 1.6 !important;
}

body .announcement_section.tpl-notice-band .restaurant-home-main__announcement-content :is(p, h1, h2, h3, h4, h5, h6) {
    margin: 0 0 0.3em !important;
}

body .announcement_section.tpl-notice-band .restaurant-home-main__announcement-content > :last-child {
    margin-bottom: 0 !important;
}

/* aus einem Übersetzer eingefügt: feste Breite, Kasten und große Schrift gelten nicht */
body .announcement_section .restaurant-home-main__announcement-content pre {
    position: static !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: inherit !important;
    font: inherit !important;
    white-space: pre-wrap !important;
    overflow: visible !important;
}

/* Fließtext (notice.js): kurze Einträge bleiben zusammen, Punkte als Trenner, am Handy als Aufzählung */
body .announcement_section .tpl-notice-lead {
    font-weight: 700;
}

body .announcement_section .tpl-notice-keep {
    white-space: nowrap;
}

body .announcement_section .tpl-notice-dot {
    margin: 0 0.55em 0 0.25em;
    color: var(--restaurant-announcement-accent, currentColor);
    font-weight: 700;
}

body .announcement_section .tpl-notice-first .tpl-notice-dot {
    display: none;
}

body .announcement_section .tpl-notice-dash {
    margin-left: 0.35em;
    color: var(--restaurant-announcement-accent, currentColor);
}

@media (max-width: 767.98px) {
    body .announcement_section.tpl-notice-band .restaurant-home-main__announcement-shell {
        display: block !important;
        padding: 11px 15px 12px !important;
    }

    body .announcement_section.tpl-notice-band .restaurant-home-main__announcement-head {
        margin-bottom: 3px !important;
    }

    body .announcement_section.tpl-notice-band .restaurant-home-main__announcement-content {
        font-size: 0.94rem !important;
        line-height: 1.55 !important;
    }

    body .announcement_section .tpl-notice-lead {
        display: block;
    }

    body .announcement_section .tpl-notice-first .tpl-notice-dot {
        display: inline;
    }

    body .announcement_section .tpl-notice-dash {
        display: none;
    }
}
