/* =====================================================================
   Estudo NATAL — Tema do Django Admin (aparência de aplicação)
   Claro (padrão) + Escuro (via botão de tema do admin). Não destrutivo:
   apenas sobrescreve variáveis e refina componentes nativos do admin.
   ===================================================================== */

/* ---------- Paleta CLARA (padrão) ---------- */
:root,
html[data-theme="light"] {
  --primary: #1f8a4c;            /* verde do estudo */
  --primary-fg: #ffffff;
  --secondary: #16794a;
  --accent: #009e8e;             /* teal */

  --body-fg: #1f2933;
  --body-bg: #eef2f4;            /* cinza-azulado suave (fundo app) */
  --body-quiet-color: #5b6b78;
  --body-loud-color: #0f1720;

  --header-color: #ffffff;
  --header-branding-color: #ffffff;
  --header-bg: linear-gradient(90deg, #0f766e 0%, #1f8a4c 100%);
  --header-link-color: #ffffff;

  --breadcrumbs-fg: #3a4a55;
  --breadcrumbs-link-fg: var(--primary);
  --breadcrumbs-bg: transparent;

  --link-fg: #157347;
  --link-hover-color: #0b5132;
  --link-selected-fg: #0b5132;

  --hairline-color: #e2e8ed;
  --border-color: #dbe2e8;

  --error-fg: #d93025;
  --message-success-bg: #e6f4ea;
  --message-warning-bg: #fff4e5;
  --message-error-bg: #fdecea;

  --darkened-bg: #f6f8f9;
  --selected-bg: #eaf5ee;
  --selected-row: #fff8e1;

  --button-fg: #ffffff;
  --button-bg: var(--primary);
  --button-hover-bg: var(--secondary);
  --default-button-bg: var(--accent);
  --default-button-hover-bg: #017e72;
  --close-button-bg: #7b8a97;
  --close-button-hover-bg: #5b6b78;
  --delete-button-bg: #d93025;
  --delete-button-hover-bg: #b3271d;

  --object-tools-fg: #ffffff;
  --object-tools-bg: var(--accent);
  --object-tools-hover-bg: #017e72;

  --en-card-bg: #ffffff;
  --en-shadow: 0 1px 2px rgba(16,24,40,.06), 0 1px 3px rgba(16,24,40,.10);
  --en-radius: 12px;
  --en-radius-sm: 8px;
}

/* Força CLARO quando o tema é "auto", mesmo que o sistema esteja no escuro */
@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] {
    --primary: #1f8a4c; --primary-fg:#fff; --secondary:#16794a; --accent:#009e8e;
    --body-fg:#1f2933; --body-bg:#eef2f4; --body-quiet-color:#5b6b78; --body-loud-color:#0f1720;
    --header-bg: linear-gradient(90deg,#0f766e 0%,#1f8a4c 100%); --header-color:#fff; --header-link-color:#fff; --header-branding-color:#fff;
    --hairline-color:#e2e8ed; --border-color:#dbe2e8;
    --darkened-bg:#f6f8f9; --selected-bg:#eaf5ee; --selected-row:#fff8e1;
    --link-fg:#157347; --link-hover-color:#0b5132; --link-selected-fg:#0b5132;
    --button-bg:#1f8a4c; --button-hover-bg:#16794a; --default-button-bg:#009e8e;
    --en-card-bg:#ffffff; --en-shadow:0 1px 2px rgba(16,24,40,.06),0 1px 3px rgba(16,24,40,.10);
  }
}

/* ---------- Paleta ESCURA (via botão de tema) ---------- */
html[data-theme="dark"] {
  --primary: #37b46a;
  --primary-fg: #06120b;
  --secondary: #2ea15c;
  --accent: #2bd0bd;

  --body-fg: #e3e8ec;
  --body-bg: #0f151a;
  --body-quiet-color: #9fb0bd;
  --body-loud-color: #ffffff;

  --header-color: #ffffff;
  --header-branding-color: #ffffff;
  --header-bg: linear-gradient(90deg, #0b3b38 0%, #125a35 100%);
  --header-link-color: #ffffff;

  --breadcrumbs-fg: #b7c4cf;
  --breadcrumbs-link-fg: #46c07d;

  --link-fg: #4fc884;
  --link-hover-color: #7ad8a4;
  --link-selected-fg: #7ad8a4;

  --hairline-color: #26313a;
  --border-color: #2b3742;

  --message-success-bg: #12321f;
  --message-warning-bg: #3a2e12;
  --message-error-bg: #3a1a17;

  --darkened-bg: #172029;
  --selected-bg: #16302150;
  --selected-row: #2c2a14;

  --button-bg: var(--primary);
  --button-hover-bg: var(--secondary);
  --default-button-bg: var(--accent);
  --default-button-hover-bg: #21b3a2;

  --object-tools-bg: var(--accent);
  --object-tools-hover-bg: #21b3a2;

  --en-card-bg: #172029;
  --en-shadow: 0 1px 2px rgba(0,0,0,.4), 0 2px 6px rgba(0,0,0,.35);
}

/* ---------- Base ---------- */
body {
  background: var(--body-bg);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Cabeçalho tipo app: fixo, com gradiente da marca */
#header {
  background: var(--header-bg);
  box-shadow: 0 2px 10px rgba(0,0,0,.12);
  padding: 14px 40px;
  line-height: 1.2;
}
#branding h1 { font-weight: 700; letter-spacing: .2px; }
/* Título da marca sempre branco e legível sobre o gradiente (corrige contraste) */
#branding h1, #branding h1 a, #branding a,
#site-name, #site-name a, #site-name a:link, #site-name a:visited {
  color: #ffffff !important;
  font-weight: 700;
  text-decoration: none;
  text-shadow: 0 1px 2px rgba(0,0,0,.25);
}
#user-tools { font-size: .8rem; }
#user-tools a { border-bottom: none; text-decoration: underline; text-underline-offset: 3px; }

/* Breadcrumbs mais leves */
div.breadcrumbs {
  background: transparent;
  color: var(--breadcrumbs-fg);
  padding: 14px 40px 4px;
  font-size: .82rem;
}

/* Conteúdo com respiro */
#content { padding: 20px 40px 40px; }

/* Módulos como cartões */
.module {
  background: var(--en-card-bg);
  border: 1px solid var(--hairline-color);
  border-radius: var(--en-radius);
  box-shadow: var(--en-shadow);
  overflow: hidden;
  margin-bottom: 18px;
}
.module > h2, .module caption, .inline-group .module > .tabular caption {
  background: var(--darkened-bg);
  color: var(--body-loud-color);
  font-weight: 700;
  font-size: .82rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: 12px 16px;
  border-bottom: 1px solid var(--hairline-color);
}
/* CORREÇÃO DE CONTRASTE: nomes de app/seção no painel são LINKS dentro do
   caption/h2. Sem cor explícita ficavam claros sobre fundo claro (invisíveis). */
.module > h2 a, .module > h2 a:link, .module > h2 a:visited,
.module caption a, .module caption a:link, .module caption a:visited,
.module caption a.section, .app-list .module caption a {
  color: var(--body-loud-color) !important;
  text-decoration: none;
}
.module > h2 a:hover, .module caption a:hover { color: var(--primary) !important; }

/* Painel inicial (lista de apps) tipo cartões */
.dashboard #content { max-width: 1100px; margin: 0 auto; }
.dashboard .module table th { width: auto; }
.dashboard .module table td a { font-weight: 600; }

/* Tabelas / listas */
#result_list { border: none; }
#result_list thead th {
  background: var(--darkened-bg);
  border-bottom: 2px solid var(--hairline-color);
  padding: 12px 12px;
}
#result_list thead th a { color: var(--body-loud-color); font-weight: 700; }
#result_list tbody td, #result_list tbody th { padding: 11px 12px; border-bottom: 1px solid var(--hairline-color); }
#result_list tbody tr:hover > * { background: var(--selected-bg) !important; }
tr.row1, tr.row2 { background: var(--en-card-bg); }

/* Botões — cantos arredondados, sombra sutil, alvo maior */
.button, input[type=submit], input[type=button], .submit-row input, a.button {
  border-radius: var(--en-radius-sm);
  padding: 9px 16px;
  font-weight: 600;
  border: none;
  box-shadow: 0 1px 2px rgba(16,24,40,.12);
  transition: background .15s ease, transform .05s ease;
}
.button:active, input[type=submit]:active { transform: translateY(1px); }
.object-tools a {
  border-radius: 999px;
  padding: 8px 16px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
  box-shadow: 0 1px 2px rgba(16,24,40,.15);
}

/* Filtros — cartão lateral com alvos grandes tipo "chips" (mais fáceis de usar) */
#changelist-filter {
  background: var(--en-card-bg);
  border: 1px solid var(--hairline-color);
  border-radius: var(--en-radius);
  box-shadow: var(--en-shadow);
  padding: 6px 0 12px;
  width: 240px;
}
#changelist-filter h2 {
  background: transparent;
  color: var(--body-loud-color);
  font-size: .9rem;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0;
  padding: 12px 16px 8px;
  border-bottom: 1px solid var(--hairline-color);
}
#changelist-filter h3 {
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--body-quiet-color);
  margin: 14px 16px 6px;
}
#changelist-filter ul { margin: 0 10px 6px; padding: 0; border: none; }
#changelist-filter li { list-style: none; margin: 0; }
#changelist-filter li a {
  display: block;
  padding: 8px 12px;
  margin: 2px 0;
  border-radius: 999px;
  color: var(--body-fg);
  font-size: .85rem;
  border: 1px solid transparent;
}
#changelist-filter li a:hover { background: var(--selected-bg); }
#changelist-filter li.selected a {
  background: var(--primary);
  color: var(--primary-fg);
  font-weight: 600;
}
#changelist-filter li.selected a:hover { background: var(--secondary); }

/* Barra de busca e ações mais destacadas */
#toolbar { border-radius: var(--en-radius-sm); }
#changelist-search #searchbar {
  border: 1px solid var(--border-color);
  border-radius: 999px;
  padding: 8px 14px;
  min-width: 240px;
}
#changelist .actions {
  background: var(--darkened-bg);
  border: 1px solid var(--hairline-color);
  border-radius: var(--en-radius-sm);
  padding: 8px 12px;
}

/* Formulários */
.form-row { border-bottom: 1px solid var(--hairline-color); }
input[type=text], input[type=password], input[type=email], input[type=url],
input[type=number], input[type=tel], textarea, select, .vTextField {
  border: 1px solid var(--border-color);
  border-radius: var(--en-radius-sm);
  padding: 8px 10px;
}
input:focus, textarea:focus, select:focus {
  outline: 2px solid color-mix(in srgb, var(--primary) 45%, transparent);
  outline-offset: 1px;
  border-color: var(--primary);
}
.submit-row {
  border-radius: 0 0 var(--en-radius) var(--en-radius);
  background: var(--darkened-bg);
  border-top: 1px solid var(--hairline-color);
}

/* Mensagens tipo "toast" */
ul.messagelist li {
  border-radius: var(--en-radius-sm);
  box-shadow: var(--en-shadow);
  padding: 12px 14px 12px 40px;
  font-size: .9rem;
}

/* Paginação */
.paginator a:link, .paginator a:visited {
  border-radius: var(--en-radius-sm);
  border: 1px solid var(--hairline-color);
  padding: 6px 11px;
  background: var(--en-card-bg);
}
.paginator .this-page { border-radius: var(--en-radius-sm); padding: 6px 11px; background: var(--primary); color: var(--primary-fg); }

/* Nav sidebar (lista de apps) */
#nav-sidebar { border-right: 1px solid var(--hairline-color); }
#nav-sidebar .current-model { background: var(--selected-bg); }
.toggle-nav-sidebar { border-right: 1px solid var(--hairline-color); }

/* Login do admin como cartão centralizado */
body.login #container {
  border-radius: var(--en-radius);
  box-shadow: 0 10px 30px rgba(16,24,40,.12);
  border: 1px solid var(--hairline-color);
  overflow: hidden;
}
body.login #header { border-radius: 0; }

/* Responsivo: reduz padding lateral no mobile */
@media (max-width: 767px) {
  #header, div.breadcrumbs, #content { padding-left: 16px; padding-right: 16px; }
  #changelist-filter { width: 100%; }
}

/* =====================================================================
   ENDURECIMENTO DE CONTRASTE (v2) — corrige:
   - texto escuro sobre o cabeçalho verde
   - cabeçalhos de seção do menu lateral (claro sobre claro)
   - paginação com fonte clara sobre fundo claro
   ===================================================================== */

/* Cabeçalho: TODO o texto branco e legível sobre o verde */
#header, #header * { color: #ffffff; }
#header a, #header a:link, #header a:visited,
#branding a, #site-name, #site-name a,
#user-tools, #user-tools a, #user-tools a:link, #user-tools a:visited {
  color: #ffffff !important;
}
#site-name a, #branding a { text-shadow: 0 1px 2px rgba(0,0,0,.30); }
#user-tools a { text-decoration: underline; text-underline-offset: 3px; opacity: .96; }
#user-tools a:hover { opacity: 1; }
/* Botão de tema (claro/escuro) visível no cabeçalho */
button.theme-toggle svg { color: #fff; }

/* Menu lateral (nav-sidebar): cabeçalhos de app/seção legíveis */
#nav-sidebar .module caption,
#nav-sidebar caption {
  background: var(--darkened-bg) !important;
  color: var(--body-loud-color) !important;
}
#nav-sidebar .module caption a,
#nav-sidebar caption a,
#nav-sidebar caption a.section,
#nav-sidebar a.section {
  color: var(--body-loud-color) !important;
  font-weight: 700;
}
#nav-sidebar .module th a, #nav-sidebar .model a { color: var(--link-fg) !important; }
#nav-sidebar #searchbar-input, #nav-sidebar input[type="search"] {
  border: 1px solid var(--border-color); border-radius: 8px; color: var(--body-fg);
}

/* Paginação e contadores: legíveis */
.paginator { color: var(--body-fg) !important; border-top-color: var(--hairline-color); }
.paginator a:link, .paginator a:visited { color: var(--body-fg) !important; }
.paginator a:hover { background: var(--selected-bg); }
.paginator .this-page { color: #fff !important; background: var(--primary) !important; }
.paginator .showall, p.paginator a { color: var(--link-fg) !important; }

/* Contagem de resultados / textos auxiliares mais legíveis */
.results + .paginator, .actions .all, .actions .question, .actions .clear,
.small.quiet, .help, p.help, .quiet { color: var(--body-quiet-color) !important; }
