/* Tema de marca dos portais externos (/autonomo, /financeiro).
   Aplica a identidade Gestou (azul + amarelo, CTA dourado) sobre o Bootstrap base.
   Carregado DEPOIS do bootstrap/createemployee p/ sobrescrever. Ver mockup aprovado. */

:root{
  --g-brand:#1b5fb0;
  --g-brand-deep:#0a3466;
  --g-gold:#ffc10a;
  --g-gold-ink:#3a2c00;
  --g-gold-shadow:rgba(224,166,0,.55);
}

/* Header/hero da marca — gradiente azul em vez do liso */
.gestou-hero{
  background:linear-gradient(160deg,var(--g-brand) 0%,var(--g-brand-deep) 100%);
  color:#fff;
}

/* CTA principal (Entrar, Tenho interesse) — o amarelo é a assinatura da marca */
.btn-gestou{
  background:var(--g-gold);
  color:var(--g-gold-ink);
  border:none;
  font-weight:800;
  letter-spacing:.01em;
  box-shadow:0 6px 14px -6px var(--g-gold-shadow);
  transition:filter .15s ease, transform .05s ease;
}
.btn-gestou:hover,.btn-gestou:focus{ filter:brightness(1.04); color:var(--g-gold-ink); }
.btn-gestou:active{ transform:translateY(1px); }

/* Botão secundário no azul da marca (mantém hierarquia com o CTA amarelo) */
.btn-gestou-outline{
  background:transparent;color:var(--g-brand);border:1.5px solid var(--g-brand);font-weight:700;
}
.btn-gestou-outline:hover{ background:var(--g-brand);color:#fff; }

/* Cards e campos com um acabamento mais leve/consistente */
.g-card{ border:none;border-radius:14px;box-shadow:0 8px 22px -14px rgba(20,50,90,.35); }
.g-field{ border:1.5px solid #e2e8f1;border-radius:11px; }
.g-field:focus-within{ border-color:var(--g-brand); box-shadow:0 0 0 3px rgba(27,95,176,.12); }

/* Badge de diária (amarelo) */
.g-diaria{ background:var(--g-gold);color:var(--g-gold-ink);font-weight:800;border-radius:8px; }

/* Título de função em destaque azul */
.g-funcao{ color:var(--g-brand);font-weight:800; }