Top Notification Bar

<?php
if ( ! function_exists( 'scseed_notif_bar' ) ) {
    // Customise these three values:
    define( 'SCSEED_NOTIF_MSG',  'Free shipping on all orders over $50!' );
    define( 'SCSEED_NOTIF_LINK', '/shop/' );
    define( 'SCSEED_NOTIF_CTA',  'Shop now' );

    function scseed_notif_bar() {
        $msg  = esc_html( SCSEED_NOTIF_MSG );
        $link = esc_url( SCSEED_NOTIF_LINK );
        $cta  = esc_html( SCSEED_NOTIF_CTA );
        ?>
<div id="scseed-notif-bar" role="banner">
  <span class="scseed-notif-text"><?php echo $msg; ?>
    <?php if ( $link ) : ?>
      <a href="<?php echo $link; ?>" class="scseed-notif-cta"><?php echo $cta; ?></a>
    <?php endif; ?>
  </span>
  <button class="scseed-notif-close" aria-label="Dismiss notification">&times;</button>
</div>
        <?php
    }
    add_action( 'wp_body_open', 'scseed_notif_bar' );
}

#scseed-notif-bar {
    background: #2563eb;
    color: #fff;
    text-align: center;
    padding: 10px 44px;
    font-size: 14px;
    font-weight: 500;
    position: relative;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.scseed-notif-cta {
    color: #fff;
    text-decoration: underline;
    font-weight: 700;
    margin-left: 6px;
}
.scseed-notif-close {
    position: absolute;
    right: 12px; top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    color: rgba(255,255,255,.8);
    font-size: 20px;
    cursor: pointer;
    line-height: 1;
    padding: 2px 6px;
}
.scseed-notif-close:hover { color: #fff; }

(function () {
    var KEY = 'scseed_notif_dismissed';
    var bar = document.getElementById('scseed-notif-bar');
    if (!bar) return;
    if (sessionStorage.getItem(KEY)) { bar.style.display = 'none'; return; }
    var btn = bar.querySelector('.scseed-notif-close');
    if (btn) {
        btn.addEventListener('click', function () {
            bar.style.display = 'none';
            sessionStorage.setItem(KEY, '1');
        });
    }
}());