/*
 * Arzinja — retention: newsletter boxes, push opt-in banner, confirm page.
 * Standalone (style.css is a build artifact). Tokens below carry light and
 * dark; html.dark-mode redefines them from theme-mode.css values.
 */
.arz-nl, .arz-push, .arz-nl-page {
    --rt-bg: #ffffff;
    --rt-bg-soft: rgb(242 244 250);
    --rt-border: rgb(211 214 227);
    --rt-title: rgb(31 34 48);
    --rt-text: rgb(78 83 107);
    --rt-muted: rgb(104 109 135);
    --rt-green: #00df9a;
    --rt-green-dark: #007a55;
    --rt-green-wash: rgb(230 252 245);
    --rt-red: #dc1432;
    --rt-red-wash: rgb(255 236 239);
    box-sizing: border-box;
}
html.dark-mode .arz-nl, html.dark-mode .arz-push, html.dark-mode .arz-nl-page {
    --rt-bg: rgb(24 29 35);
    --rt-bg-soft: rgb(35 42 50);
    --rt-border: rgb(44 52 62);
    --rt-title: rgb(229 229 229);
    --rt-text: rgb(212 212 212);
    --rt-muted: rgb(163 163 163);
    --rt-green-dark: rgb(84 234 187);
    --rt-green-wash: rgb(12 42 34);
    --rt-red: rgb(255 120 136);
    --rt-red-wash: rgb(42 20 22);
}
.arz-nl *, .arz-push * { box-sizing: border-box; }

/* ---------------------------------------------------------------- box */
.arz-nl {
    background: var(--rt-bg);
    border: 1px solid var(--rt-border);
    border-radius: 12px;
    padding: 20px 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    color: var(--rt-text);
    text-align: start;
}
.arz-nl--article {
    margin: 0 0 32px;
    padding: 24px 16px;
    background: linear-gradient(135deg, var(--rt-green-wash), var(--rt-bg) 60%);
}
.arz-nl--sidebar { margin: 0 0 32px; }
.arz-nl--footer {
    width: 100%;
    margin: 0 0 32px;
    background: var(--rt-bg);
}
.arz-nl__text { display: flex; flex-direction: column; gap: 4px; }
.arz-nl__title {
    margin: 0;
    font-size: 1.25rem;
    line-height: 1.6;
    font-weight: 700;
    color: var(--rt-title);
}
.arz-nl--sidebar .arz-nl__title { font-size: 1.125rem; }
.arz-nl__desc { margin: 0; font-size: .95rem; line-height: 1.8; color: var(--rt-muted); }
.arz-nl__form { display: flex; gap: 8px; flex-wrap: wrap; }
.arz-nl__input {
    flex: 1 1 200px;
    min-width: 0;
    height: 44px;
    padding: 0 14px;
    border: 1px solid var(--rt-border);
    border-radius: 10px;
    background: var(--rt-bg-soft);
    color: var(--rt-title);
    font: inherit;
    font-size: 1rem;
    text-align: left;
}
.arz-nl__input::placeholder { color: var(--rt-muted); opacity: .8; }
.arz-nl__input:focus { outline: 2px solid rgba(0, 223, 154, .45); outline-offset: 0; border-color: var(--rt-green); }
.arz-nl__button {
    flex: 0 0 auto;
    height: 44px;
    padding: 0 22px;
    border: 0;
    border-radius: 10px;
    background: var(--rt-green);
    color: #fff;
    font: inherit;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    transition: filter .2s;
}
.arz-nl__button:hover { filter: brightness(.94); }
.arz-nl__button:disabled { opacity: .7; cursor: progress; }
.arz-nl__button:focus-visible { outline: 2px solid var(--rt-title); outline-offset: 2px; }
.arz-nl__hp { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.arz-nl { position: relative; }
.arz-nl__msg { margin: 0; min-height: 0; font-size: .9rem; line-height: 1.7; }
.arz-nl__msg:empty { display: none; }
.arz-nl--error .arz-nl__msg { color: var(--rt-red); }
.arz-nl--success .arz-nl__msg { color: var(--rt-green-dark); font-weight: 700; }
.arz-nl--error .arz-nl__input { border-color: var(--rt-red); }
.arz-nl__consent { margin: 0; font-size: .78rem; line-height: 1.7; color: var(--rt-muted); }

@media (min-width: 1024px) {
    .arz-nl--article, .arz-nl--footer {
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        padding: 24px 32px;
    }
    .arz-nl--article .arz-nl__text, .arz-nl--footer .arz-nl__text { flex: 1 1 320px; }
    .arz-nl--article .arz-nl__form, .arz-nl--footer .arz-nl__form { flex: 0 1 460px; flex-wrap: nowrap; }
    .arz-nl--article .arz-nl__msg, .arz-nl--footer .arz-nl__msg,
    .arz-nl--article .arz-nl__consent, .arz-nl--footer .arz-nl__consent { flex-basis: 100%; }
}

/* ---------------------------------------------------- confirm / unsub page */
.arz-nl-page { padding: 48px 0 64px; min-height: 40vh; }

/* ---------------------------------------------------------- push banner */
.arz-push {
    position: fixed;
    inset-inline: 12px;
    bottom: 12px;
    z-index: 900;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    max-width: 440px;
    margin-inline-start: auto;
    padding: 14px 16px;
    background: var(--rt-bg);
    color: var(--rt-text);
    border: 1px solid var(--rt-border);
    border-radius: 14px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .14);
    transform: translateY(16px);
    opacity: 0;
    transition: transform .3s ease, opacity .3s ease;
}
.arz-push--in { transform: none; opacity: 1; }
.arz-push__icon { font-size: 1.5rem; line-height: 1; padding-top: 2px; }
.arz-push__text { flex: 1 1 auto; min-width: 0; }
.arz-push__title { margin: 0 0 2px; font-size: 1rem; font-weight: 700; color: var(--rt-title); }
.arz-push__desc { margin: 0; font-size: .85rem; line-height: 1.7; color: var(--rt-muted); }
.arz-push__actions { display: flex; flex-direction: column; gap: 6px; flex: 0 0 auto; }
.arz-push__yes, .arz-push__later {
    min-height: 40px;
    padding: 0 14px;
    border-radius: 10px;
    border: 1px solid var(--rt-border);
    background: var(--rt-bg-soft);
    color: var(--rt-title);
    font: inherit;
    font-size: .9rem;
    cursor: pointer;
    white-space: nowrap;
}
.arz-push__yes { background: var(--rt-green); border-color: var(--rt-green); color: #fff; font-weight: 700; }
.arz-push__yes:disabled { opacity: .7; }
@media (prefers-reduced-motion: reduce) {
    .arz-push { transition: none; }
}