/* AutoPost AI - tema claro e sóbrio.
   Troca a paleta escura por uma base "papel" com um único acento (barro).
   Carregado depois do CSS principal; só redefine variáveis e ajusta detalhes. */

:root {
  color-scheme: light;

  --paper: #f5f2ec;
  --surface: #fffdf9;
  --ink: #1f1d19;
  --accent: #a8502b;

  /* Escala neutra (substitui o "slate" azulado escuro) */
  --color-slate-950: #f5f2ec;  /* fundo da página */
  --color-slate-900: #fffdf9;  /* cartões */
  --color-slate-800: #ebe6db;  /* fundos suaves e bordas leves */
  --color-slate-700: #d8d2c4;  /* bordas de campos */
  --color-slate-600: #a8a393;  /* texto de apoio bem discreto */
  --color-slate-500: #837e70;
  --color-slate-400: #6a6559;
  --color-slate-300: #4a463d;
  --color-slate-200: #34312a;
  --color-slate-100: #1f1d19;

  /* Acento único: barro / terracota */
  --color-blue-300: #8a3f1f;
  --color-blue-400: #9c4624;
  --color-blue-500: #b45a30;
  --color-blue-600: #a8502b;
  --color-blue-950: #f1e2d7;
  --color-indigo-600: #a8502b;

  /* Instagram e X deixam de gritar */
  --color-pink-300: #94375e;
  --color-pink-400: #a63f68;
  --color-pink-500: #b84a73;
  --color-pink-600: #a63f68;
  --color-purple-300: #62407a;
  --color-purple-400: #724a8c;
  --color-purple-500: #82559c;
  --color-purple-600: #724a8c;

  /* Estados */
  --color-emerald-200: #1c553a;
  --color-emerald-300: #226243;
  --color-emerald-400: #2a7350;
  --color-emerald-500: #34805a;
  --color-emerald-600: #2e7552;
  --color-emerald-800: #b6d3c2;
  --color-emerald-950: #e3efe7;
  --color-red-200: #7a2920;
  --color-red-400: #b03a2e;
  --color-red-800: #e3b8b2;
  --color-red-950: #fbe9e6;
  --color-amber-200: #6c4a12;
  --color-amber-300: #7d5313;
  --color-amber-400: #8f6013;
  --color-amber-500: #b57a22;

  /* Cantos menos "pílula" */
  --radius-md: .25rem;
  --radius-lg: .375rem;
  --radius-xl: .5rem;
  --radius-2xl: .625rem;

  --font-sans: "Instrument Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --default-font-family: var(--font-sans);
  --serif: "Instrument Serif", Georgia, "Times New Roman", serif;
}

html { background: var(--paper); }

body {
  font-family: var(--font-sans);
  background: var(--paper);
  color: var(--ink);
  font-feature-settings: "ss01", "cv11";
  -webkit-font-smoothing: antialiased;
}

/* Texto "branco" vira tinta; só continua branco dentro de botões coloridos */
.text-white { color: var(--ink); }
.bg-blue-600.text-white,
.bg-blue-500.text-white,
.bg-emerald-600.text-white,
.bg-emerald-500.text-white,
.bg-black\/80.text-white,
.bg-black\/75.text-white { color: #fff; }

/* Títulos de página com um toque editorial */
h1 {
  font-family: var(--serif);
  font-weight: 400 !important;
  letter-spacing: -.01em;
  font-size: 1.9em;
  line-height: 1.1;
}

/* Rótulos em caixa-alta e espaçados dão cara de template; ficam em frase normal */
.uppercase { text-transform: none; }
.tracking-wider, .tracking-widest, .tracking-wide { letter-spacing: .01em; }

/* Sem brilhos, desfoques decorativos e sombras coloridas */
.blur-3xl { display: none; }
[class*="shadow-blue"], [class*="shadow-emerald"] { --tw-shadow-color: transparent !important; }
.shadow-lg, .shadow-xl, .shadow-2xl, .shadow-md {
  --tw-shadow: 0 1px 2px rgb(60 50 30 / .06);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-2xl { --tw-shadow: 0 12px 32px rgb(60 50 30 / .14); }

/* Fundos degradê viram superfícies lisas */
.bg-gradient-to-b, .bg-gradient-to-br, .bg-gradient-to-r {
  background-image: none;
  background-color: var(--surface);
}

/* Camada atrás de janelas */
.bg-black\/75, .bg-black\/80:not(.text-white) { background-color: rgb(34 30 22 / .42); }
.bg-black\/80.text-white { background-color: rgb(34 30 22 / .72); }

/* Cabeçalho */
header, .sticky { backdrop-filter: saturate(1.1) blur(8px); }

/* Campos */
input, textarea, select { color: var(--ink); }
input::placeholder, textarea::placeholder { color: #a8a393; }
input:focus, textarea:focus, select:focus {
  outline: none;
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px rgb(168 80 43 / .14);
}

/* Números e códigos em fonte mono mais leve */
.font-mono { font-feature-settings: "zero"; }

/* Pulsos animados ficam mais calmos */
.animate-ping { animation-duration: 2.4s; }

::selection { background: var(--accent); color: #fff; }

/* ===== Seletor de motor de imagem (Central de APIs) ===== */
.nb-panel { display: grid; gap: .75rem; }
.nb-title { font-size: .75rem; font-weight: 600; color: var(--color-slate-300); }
.nb-opts { display: grid; gap: .5rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .nb-opts { grid-template-columns: repeat(3, 1fr); } }
.nb-opt {
  display: grid; gap: .15rem; text-align: left; padding: .6rem .75rem;
  border: 1px solid var(--color-slate-700); border-radius: var(--radius-lg);
  background: transparent; cursor: pointer; transition: border-color .15s, background .15s;
}
.nb-opt strong { font-size: .75rem; font-weight: 600; color: var(--ink); }
.nb-opt span { font-size: .6875rem; color: var(--color-slate-400); line-height: 1.35; }
.nb-opt:hover { border-color: var(--color-slate-500); }
.nb-opt-on { border-color: var(--accent); background: #f6e9df; }
.nb-opt-on strong { color: var(--color-blue-300); }
.nb-field { display: grid; gap: .35rem; }
.nb-field label { font-size: .6875rem; font-weight: 600; color: var(--color-slate-400); }
.nb-row { display: flex; align-items: center; gap: .5rem; }
.nb-input {
  width: 100%; border: 1px solid var(--color-slate-700); border-radius: var(--radius-lg);
  background: var(--surface); padding: .4rem .65rem; font-size: .75rem; color: var(--ink);
  font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
}
.nb-note { font-size: .6875rem; line-height: 1.5; color: var(--color-slate-400); margin: 0; }
.nb-link { font-size: .6875rem; color: var(--color-blue-400); background: none; border: 0; cursor: pointer; white-space: nowrap; }
.nb-link:hover { text-decoration: underline; }
.nb-check { display: flex; align-items: center; gap: .5rem; font-size: .75rem; color: var(--color-slate-300); cursor: pointer; }
.nb-check input { accent-color: var(--accent); width: 1rem; height: 1rem; }