/* nx-feed-empty.css — stato vuoto del feed: gancio + richiesta (19/10/2026, v2)
   Obiettivo: non deve sembrare «un errore», ma un invito. Tutto centrato, con respiro.
   Colori: solo trasparenze + oro di brand (nessun tema imposto). */

/* ---------- gancio ---------- */
.nx-empty-gancio {
    --o: #c9a227;
    --o-chiaro: #e8cf94;
    display: grid;
    justify-items: center;
    gap: 14px;
    text-align: center;
    width: 100%;
    max-width: 780px;
    margin: 10px auto;
    padding: clamp(38px, 7vw, 72px) clamp(20px, 4vw, 44px);
    border: 1px solid color-mix(in srgb, currentColor 16%, transparent);
    border-radius: 24px;
    background:
        radial-gradient(680px 260px at 50% -10%, color-mix(in srgb, var(--o) 12%, transparent), transparent 70%),
        color-mix(in srgb, currentColor 3%, transparent);
}
.nx-feed-masonry-grid.is-vuoto .nx-empty-gancio,
.nx-empty-gancio[data-sezione] {
    column-span: all;
}

.nx-empty-eti {
    font: 700 clamp(9px, 1vw, 10.5px)/1 system-ui, Arial, sans-serif;
    letter-spacing: .34em;
    text-transform: uppercase;
    color: var(--o);
}
.nx-empty-gancio h4 {
    margin: 0;
    font: 400 clamp(24px, 3.6vw, 38px)/1.12 Georgia, "Times New Roman", serif;
    letter-spacing: -.01em;
}
.nx-empty-gancio > p {
    margin: 0;
    max-width: 52ch;
    font-size: clamp(14.5px, 1.4vw, 16.5px);
    line-height: 1.7;
    opacity: .72;
}

/* ---------- campo richiesta: una pillola unica ---------- */
.nx-richiesta {
    display: flex;
    align-items: center;
    gap: 8px;
    width: min(620px, 100%);
    margin-top: 10px;
    padding: 6px;
    border: 1px solid color-mix(in srgb, currentColor 22%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, currentColor 4%, transparent);
    transition: border-color .2s ease, box-shadow .2s ease;
}
.nx-richiesta:focus-within {
    border-color: var(--o);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--o) 18%, transparent);
}
.nx-richiesta input[type="text"] {
    flex: 1 1 auto;
    min-width: 0;
    padding: 13px 18px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: 15px;
}
.nx-richiesta input[type="text"]::placeholder { opacity: .55; }
.nx-richiesta input[type="text"]:focus { outline: none; }
.nx-richiesta button {
    flex: 0 0 auto;
    padding: 13px 24px;
    border: 0;
    border-radius: 999px;
    cursor: pointer;
    background: linear-gradient(135deg, var(--o), #a8851b);
    color: #151004;
    font: 700 11.5px/1 system-ui, Arial, sans-serif;
    letter-spacing: .14em;
    text-transform: uppercase;
    white-space: nowrap;
    transition: filter .16s ease, transform .16s ease, opacity .16s ease;
}
.nx-richiesta button:hover { filter: brightness(1.07); transform: translateY(-1px); }
.nx-richiesta button:active { transform: none; }
.nx-richiesta button[disabled] { opacity: .6; cursor: progress; transform: none; }

/* ---------- esito ---------- */
.nx-richiesta-esito {
    min-height: 20px;
    font-size: 13px;
    letter-spacing: .01em;
    opacity: 0;
    transition: opacity .25s ease;
}
.nx-richiesta-esito:not(:empty) { opacity: .9; }
.nx-richiesta.is-inviata input[type="text"] { color: var(--o-chiaro); }
.nx-richiesta.is-errore { border-color: #b4543f; }

/* ---------- reimposta ---------- */
.nx-empty-reset {
    margin-top: 2px;
    font: 500 12px/1 system-ui, Arial, sans-serif;
    letter-spacing: .1em;
    text-transform: uppercase;
    opacity: .55;
    text-decoration: none;
    border-bottom: 1px solid color-mix(in srgb, currentColor 30%, transparent);
    padding-bottom: 3px;
    transition: opacity .2s ease, border-color .2s ease;
}
.nx-empty-reset:hover { opacity: 1; border-color: var(--o); }

/* ---------- accessibilità ---------- */
.nx-empty-gancio .nx-visually-hidden {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0);
    white-space: nowrap; border: 0;
}

@media (max-width: 560px) {
    .nx-richiesta { flex-direction: column; border-radius: 20px; padding: 10px; gap: 10px; }
    .nx-richiesta input[type="text"],
    .nx-richiesta button { width: 100%; border-radius: 14px; }
    .nx-empty-gancio { border-radius: 18px; }
}

@media (prefers-reduced-motion: reduce) {
    .nx-richiesta, .nx-richiesta button, .nx-empty-reset { transition: none; }
}

/* ---------- canale AZIENDE (19/10/2026) ---------- */
.nx-empty-sep {
    display: flex; align-items: center; gap: 14px;
    width: min(620px, 100%); margin: 26px 0 8px;
    font: 600 10px/1 system-ui, Arial, sans-serif;
    letter-spacing: .3em; text-transform: uppercase; opacity: .45;
}
.nx-empty-sep::before, .nx-empty-sep::after {
    content: ''; flex: 1; height: 1px;
    background: currentColor; opacity: .3;
}
.nx-proposta { display: grid; gap: 10px; width: min(620px, 100%); text-align: left; }
.nx-proposta-titolo { margin: 0 0 4px; font-size: 14.5px; line-height: 1.55; opacity: .85; }
.nx-proposta-griglia { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.nx-proposta input {
    padding: 12px 14px;
    border: 1px solid color-mix(in srgb, currentColor 20%, transparent);
    border-radius: 12px;
    background: color-mix(in srgb, currentColor 3%, transparent);
    color: inherit; font: inherit; font-size: 14px; min-width: 0;
}
.nx-proposta input::placeholder { opacity: .55; }
.nx-proposta input:focus {
    outline: none; border-color: var(--o, #c9a227);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--o, #c9a227) 16%, transparent);
}
.nx-proposta input[name="testo"] { grid-column: 1 / -1; }
.nx-proposta button {
    justify-self: start; margin-top: 6px;
    padding: 13px 24px; border: 0; border-radius: 999px; cursor: pointer;
    background: linear-gradient(135deg, var(--o, #c9a227), #a8851b); color: #151004;
    font: 700 11.5px/1 system-ui, Arial, sans-serif; letter-spacing: .14em; text-transform: uppercase;
    transition: filter .16s ease, transform .16s ease, opacity .16s ease;
}
.nx-proposta button:hover { filter: brightness(1.07); transform: translateY(-1px); }
.nx-proposta button[disabled] { opacity: .6; cursor: progress; transform: none; }
.nx-proposta.is-inviata input { border-color: color-mix(in srgb, var(--o, #c9a227) 55%, transparent); }
.nx-proposta.is-errore input[name="azienda"],
.nx-proposta.is-errore input[name="testo"] { border-color: #b4543f; }
.nx-riservato { margin: 2px 0 0; font-size: 11.5px; line-height: 1.6; opacity: .55; }
@media (max-width: 560px) { .nx-proposta-griglia { grid-template-columns: 1fr; } .nx-proposta button { justify-self: stretch; } }

/* ---------- INVIO EVIDENTE (19/10/2026) ---------- */
.nx-richiesta.is-invio, .nx-proposta.is-invio { border-color: color-mix(in srgb, var(--o,#c9a227) 45%, transparent); }

/* durante l'invio: bottone in attesa */
.nx-richiesta.is-invio button,
.nx-proposta.is-invio button { opacity: .75; }

/* successo: il modulo si illumina e il messaggio diventa chiaro */
.nx-richiesta.is-inviata, .nx-proposta.is-inviata {
    border-color: color-mix(in srgb, #25d366 55%, transparent);
    box-shadow: 0 0 0 4px color-mix(in srgb, #25d366 14%, transparent);
}
.nx-richiesta.is-inviata .nx-richiesta-esito,
.nx-proposta.is-inviata .nx-richiesta-esito,
#nx-richiesta-esito.is-ok, #nx-proposta-esito.is-ok {
    font-size: 15px; font-weight: 600; opacity: 1;
    color: #1f7a4d;
}
.nx-richiesta.is-inviata .nx-richiesta-esito::before,
.nx-proposta.is-inviata .nx-richiesta-esito::before {
    content: '\2713  '; font-weight: 700;
}

/* errore: rosso deciso, ma senza allarme */
.nx-richiesta.is-errore, .nx-proposta.is-errore { border-color: #b4543f; }
.nx-richiesta.is-errore .nx-richiesta-esito,
.nx-proposta.is-errore .nx-richiesta-esito { opacity: 1; font-weight: 600; color: #b4543f; }

/* tema scuro: verde piu luminoso */
@media (prefers-color-scheme: dark) {
    .nx-richiesta.is-inviata .nx-richiesta-esito,
    .nx-proposta.is-inviata .nx-richiesta-esito { color: #6ee7a8; }
}
