/* ===== AVFOODS – Layout do formulário (HTML inalterado) ===== */
:root{
  --av-primary:#163F30; /* verde escuro */
  --av-accent:#DAA520;  /* dourado */
  --av-text:#111827;    /* slate-900 */
  --muted:#71717a;      /* zinc-500 */
  --ring:rgba(218,165,32,.22);
}

/* --- Conteúdo rolável do modal --- */
#trial-modal .overflow-y-auto{
  /* já existe max-h no container; aqui só garantimos a rolagem suave */
  scrollbar-gutter: stable;
}
#trial-modal .overflow-y-auto::-webkit-scrollbar{ width:10px; }
#trial-modal .overflow-y-auto::-webkit-scrollbar-thumb{
  background: rgba(24,24,27,.18);
  border-radius: 999px;
}

/* --- Rótulos e dicas --- */
#trial-modal .text-zinc-700 { color:#3f3f46; } /* mantém teu Tailwind, só reforça contraste */
#trial-modal .field-hint,
#trial-modal small.text-zinc-500,
#trial-modal span.text-zinc-500 { color: var(--muted); }

/* ================== INPUTS ================== */
#trial-modal .input-avfoods{
  width:100%;
  background:#fff;                  /* pedido: bg branco */
  color:var(--av-text);             /* pedido: texto escuro */
  border:1px solid #e5e7eb;         /* zinc-200 */
  border-radius: .625rem;           /* 10px */
  padding: .625rem .875rem;         /* 10px 14px */
  line-height: 1.4;
  box-shadow: 0 1px 1px rgba(0,0,0,.02);
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
#trial-modal .input-avfoods::placeholder{ color:#a1a1aa; } /* zinc-400 */

/* Foco: sem inverter bg; só borda + ring dourado */
#trial-modal .input-avfoods:focus,
#trial-modal .input-avfoods:focus-visible{
  border-color: var(--av-primary);
  box-shadow: 0 0 0 .25rem var(--ring);
  background:#fff; /* mantém branco no foco */
}

/* Estados úteis (se você adicionar essas classes via JS) */
#trial-modal .input-error{
  border-color:#ef4444 !important;
  box-shadow: 0 0 0 .25rem rgba(239,68,68,.18) !important;
}
#trial-modal .input-success{
  border-color:#10b981 !important;
  box-shadow: 0 0 0 .25rem rgba(16,185,129,.18) !important;
}

/* Botão do olho: clique confortável e alinhado */
#trial-modal [data-toggle-pass]{
  height: 2.25rem; width: 2.25rem;
  display:grid; place-items:center;
  border-radius:.5rem;
}
#trial-modal [data-toggle-pass]:hover{ background: rgba(0,0,0,.04); }

/* ================== CHECKBOX ================== */
#trial-modal input[type="checkbox"]{
  accent-color: var(--av-primary);
  outline: none;
}
#trial-modal input[type="checkbox"]:focus-visible{
  box-shadow: 0 0 0 .25rem var(--ring);
  border-radius:.25rem;
}

/* ================== BOTÕES ================== */
#trial-modal .btn-primary{
  background: var(--av-primary);
  color:#fff;
  border:0;
  border-radius:.75rem;             /* mais premium */
  padding:.625rem 1rem;
  font-weight:600;
  transition: transform .06s ease, filter .15s ease, box-shadow .15s ease;
  box-shadow: 0 6px 18px rgba(22,63,48,.18);
}
#trial-modal .btn-primary:hover{ filter: brightness(0.95); }
#trial-modal .btn-primary:active{ transform: translateY(1px); }
#trial-modal .btn-primary:focus-visible{
  box-shadow: 0 0 0 .3rem rgba(22,63,48,.25), 0 6px 18px rgba(22,63,48,.18);
}

#trial-modal .btn-secondary{
  background:#fff;
  color:#111827;
  border:1px solid #e5e7eb;
  border-radius:.75rem;
  padding:.625rem 1rem;
  font-weight:500;
  transition: background-color .15s ease, box-shadow .15s ease;
}
#trial-modal .btn-secondary:hover{ background:#fafafa; }
#trial-modal .btn-secondary:focus-visible{ box-shadow: 0 0 0 .3rem var(--ring); }

/* ================== MICRO AJUSTES ================== */
/* Dourado do chip do header já vem do Tailwind; só melhora contraste em telas claras */
#trial-modal .bg-\[\#DAA520\]\/15{ background-color: rgba(218,165,32,.15); }
#trial-modal .text-\[\#DAA520\]{ color: var(--av-accent); }

/* Ícones dentro do submit (spinner/ícone) sempre legíveis */
#trial-modal #trial-submit i,
#trial-modal #trial-submit svg{ color:#fff; }

/* Autofill (Chrome) mantendo fundo branco e texto escuro) */
#trial-modal .input-avfoods:-webkit-autofill,
#trial-modal .input-avfoods:-webkit-autofill:hover,
#trial-modal .input-avfoods:-webkit-autofill:focus{
  -webkit-text-fill-color: var(--av-text);
  -webkit-box-shadow: 0 0 0px 1000px #ffffff inset;
  transition: background-color 9999s ease-out 0s;
}