/*
 * NovaFeed ↔ NovaPaywall integration styling.
 *
 * Three components :
 *   - .nvf-paywall-welcome  : empty-feed welcome banner (renewable subscriber).
 *   - .nvf-paywall-stickies : sticky bar wrapper at the top of the NovaFeed page.
 *   - .nvf-paywall-sticky   : single sticky row (renewal or expiration).
 *
 * Anchored on the --nt-* NovaTheme variables ; no !important.
 *
 * Copyright (c) 2026 Emmanuel Riolet / NovaFuture.org. Licensed under AGPL v3.
 */

/* ── Empty-feed welcome ─────────────────────────────────────────────────── */

.nvf-paywall-welcome {
    margin: 0 0 var(--nt-space-md);
    padding: var(--nt-space-md) var(--nt-space-lg);
    border: 1px solid var(--nt-green);
    border-left: 4px solid var(--nt-green);
    border-radius: 6px;
    background: #f4faf4;
    color: var(--nt-text);
    line-height: 1.5;
    font-size: var(--nt-text-base);
}

/* ── Sticky bar wrapper ─────────────────────────────────────────────────── */

.nvf-paywall-stickies {
    margin: 0 0 var(--nt-space-md);
    display: flex;
    flex-direction: column;
    gap: var(--nt-space-sm);
}

.nvf-paywall-sticky {
    display: flex;
    align-items: flex-start;
    gap: var(--nt-space-md);
    padding: var(--nt-space-md) var(--nt-space-lg);
    border: 1px solid var(--nt-border);
    border-left-width: 4px;
    border-radius: 6px;
    background: var(--nt-white);
    transition: opacity 200ms ease;
}

/* Renewal : positive event, green left border like the welcome banner. */
.nvf-paywall-sticky--renewal {
    border-left-color: var(--nt-green);
}

/* Expiration : warning event, orange left border. */
.nvf-paywall-sticky--expiration {
    border-left-color: #d97706;
}

.nvf-paywall-sticky__text {
    flex: 1 1 auto;
    margin: 0;
    line-height: 1.5;
    color: var(--nt-text);
}

.nvf-paywall-sticky__text a {
    color: var(--nt-green);
    text-decoration: underline;
}

.nvf-paywall-sticky__dismiss {
    flex: 0 0 auto;
    background: transparent;
    border: 1px solid var(--nt-border);
    border-radius: 4px;
    padding: 4px 10px;
    font-size: var(--nt-text-sm);
    color: var(--nt-text-muted);
    cursor: pointer;
    transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
}
.nvf-paywall-sticky__dismiss:hover,
.nvf-paywall-sticky__dismiss:focus {
    background: var(--nt-gray-50);
    color: var(--nt-text);
    border-color: var(--nt-text-muted);
}

/* Fade-out triggered by JS just before the AJAX dismiss request returns. */
.nvf-paywall-sticky.is-dismissing {
    opacity: 0;
    pointer-events: none;
}

/* ── System notifications (no human actor) in the bell list ─────────────── */
/* The 3 NovaPaywall lifecycle notifs have no avatar and no timestamp. The
 * content area takes the full row width minus the type icon. Plain wording :
 * we keep the surrounding .nvf-notif chrome (border, padding, hover) so the
 * row visually aligns with follow/like/reply rows above and below. */

.nvf-notif.nvf-notif--system .nvf-notif-content {
    flex: 1 1 auto;
}

.nvf-notif.nvf-notif--system .nvf-notif-message {
    /* The wording is a multi-line paragraph for welcome ; preserve line
     * breaks but keep margins small so the row does not balloon. */
    white-space: pre-line;
    margin: 0;
    line-height: 1.5;
}