/**
 * Tokens visuais do Nexo369 — compartilhado entre o app principal
 * (public/assets/) e o Criativos (criativos/public/assets/). Os dois
 * webroots são separados fisicamente (sem servidor único), então este
 * arquivo é DUPLICADO em cada um — mudou aqui, muda lá também.
 */

:root {
    --nexo-cor-marca: #16213e;
    --nexo-cor-marca-hover: #22315c;
    --nexo-cor-acento: #ff7733;
    --nexo-cor-acento-hover: #e5652a;
    --nexo-cor-fundo: #f7f7f8;
    --nexo-cor-texto: #1a1a1a;
    --nexo-cor-texto-suave: #666;
    --nexo-cor-borda: #e2e2e2;
    --nexo-cor-card: #fff;
    --nexo-cor-erro: #b00020;
    --nexo-cor-erro-fundo: #fbe3e3;
    --nexo-cor-ok-fundo: #e3f7e8;
    --nexo-cor-ok-texto: #1a6d2f;

    --nexo-fonte: system-ui, -apple-system, "Segoe UI", sans-serif;
    --nexo-radius: 6px;
    --nexo-radius-lg: 8px;
    --nexo-espaco-1: 0.5rem;
    --nexo-espaco-2: 1rem;
    --nexo-espaco-3: 1.5rem;
    --nexo-sombra: 0 2px 10px rgba(0,0,0,0.08);
}

* { box-sizing: border-box; }

body {
    font-family: var(--nexo-fonte);
    margin: 0;
    background: var(--nexo-cor-fundo);
    color: var(--nexo-cor-texto);
}

a { color: var(--nexo-cor-marca); }

/* Header + menu principal (nav.php) */
.nexo-header { background: var(--nexo-cor-marca); color: #fff; }
.nexo-header-top {
    display: flex;
    align-items: center;
    gap: var(--nexo-espaco-3);
    padding: 0.75rem var(--nexo-espaco-3);
    flex-wrap: wrap;
}
.nexo-brand { color: #fff; text-decoration: none; font-weight: 700; font-size: 1.1rem; white-space: nowrap; }
.nexo-menu { display: flex; gap: var(--nexo-espaco-2); list-style: none; margin: 0; padding: 0; flex-wrap: wrap; }
.nexo-menu a {
    color: #cfd3e0;
    text-decoration: none;
    font-size: 0.9rem;
    padding: 0.35rem 0.1rem;
    border-bottom: 2px solid transparent;
}
.nexo-menu a:hover, .nexo-menu a:focus-visible { color: #fff; }
.nexo-menu a.ativo { color: #fff; border-bottom-color: var(--nexo-cor-acento); font-weight: 600; }
.nexo-subnav {
    background: var(--nexo-cor-marca-hover);
    padding: 0.5rem var(--nexo-espaco-3);
    display: flex;
    gap: var(--nexo-espaco-2);
    flex-wrap: wrap;
}
.nexo-subnav a { color: #dfe2ec; text-decoration: none; font-size: 0.85rem; }
.nexo-subnav a:hover, .nexo-subnav a:focus-visible { color: #fff; text-decoration: underline; }
.nexo-subnav a.ativo { color: #fff; font-weight: 600; }

/* Botões */
.nexo-btn {
    display: inline-block;
    background: var(--nexo-cor-marca);
    color: #fff;
    border: none;
    padding: 0.6rem 1.1rem;
    border-radius: var(--nexo-radius);
    font-size: 0.9rem;
    font-family: inherit;
    cursor: pointer;
    text-decoration: none;
}
.nexo-btn:hover { background: var(--nexo-cor-marca-hover); }
.nexo-btn:focus-visible { outline: 2px solid var(--nexo-cor-acento); outline-offset: 2px; }
.nexo-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.nexo-btn-acento { background: var(--nexo-cor-acento); }
.nexo-btn-acento:hover { background: var(--nexo-cor-acento-hover); }
.nexo-btn-secundario { background: transparent; color: var(--nexo-cor-marca); border: 1px solid var(--nexo-cor-borda); }
.nexo-btn-secundario:hover { background: #f0f0f2; }

/* Inputs/forms */
.nexo-campo { display: block; margin-bottom: var(--nexo-espaco-2); }
.nexo-campo label, form label { display: block; font-weight: 600; font-size: 0.85rem; margin-bottom: var(--nexo-espaco-2); }
input, select, textarea {
    font-family: inherit;
    font-size: 0.9rem;
}
form input[type=text], form input[type=number], form select, form textarea,
.nexo-campo input, .nexo-campo select, .nexo-campo textarea {
    display: block;
    width: 100%;
    padding: 0.5rem;
    margin-top: 0.25rem;
    border: 1px solid var(--nexo-cor-borda);
    border-radius: var(--nexo-radius);
}
input:focus-visible, select:focus-visible, textarea:focus-visible {
    outline: 2px solid var(--nexo-cor-acento);
    outline-offset: 1px;
}

/* Cards */
.nexo-card {
    background: var(--nexo-cor-card);
    border: 1px solid var(--nexo-cor-borda);
    border-radius: var(--nexo-radius-lg);
    padding: var(--nexo-espaco-2);
}
.nexo-card:hover { box-shadow: var(--nexo-sombra); }

.nexo-field-error, .field-error { color: var(--nexo-cor-erro); margin: 0 0 var(--nexo-espaco-1); font-size: 0.85rem; }
.nexo-flash-ok { background: var(--nexo-cor-ok-fundo); color: var(--nexo-cor-ok-texto); padding: 0.5rem 0.75rem; border-radius: var(--nexo-radius); }
.nexo-flash-erro { background: var(--nexo-cor-erro-fundo); color: #a11; padding: 0.5rem 0.75rem; border-radius: var(--nexo-radius); }