/* Kadesh Contabilidade - visual foundation shared by every Kadesh app.
 * Source of truth: brand guide (identidade.md, out/2026).  Loaded after each
 * page's own styles, so it overrides the old tokens (#16324a / #b98a42).
 * Proportion: 60% white/cream, 30% navy, 10% gold - gold is a detail.
 */
:root {
  --k-navy: #0A1931;        /* principal: titles, header, main buttons */
  --k-navy-2: #14284a;      /* hover/gradient step of the navy */
  --k-gold: #D4AF37;        /* highlight: gold buttons, icons, details */
  --k-gold-ink: #826522;    /* gold text on light backgrounds (legible) */
  --k-gold-soft: #DBCA9D;   /* borders, separators */
  --k-cream: #FBF8F0;       /* warm background */
  --k-ice: #F1F4F8;         /* cool background */
  --k-text: #566271;        /* running text */
  --k-whatsapp: #25D366;    /* WhatsApp buttons only */
  --k-font-title: "Playfair Display", Georgia, "Times New Roman", serif;
  --k-font-text: Inter, "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;

  /* Old app tokens mapped onto the brand. */
  --bg: var(--k-ice);
  --ink: #1b2533;
  --muted: var(--k-text);
  --brand: var(--k-navy);
  --brand2: var(--k-navy-2);
  --gold: var(--k-gold);
  --shadow: 0 8px 28px rgba(10, 25, 49, .08);
}

body { font-family: var(--k-font-text); }
h1, h2, h3, .k-title { font-family: var(--k-font-title); color: var(--k-navy); font-weight: 700; letter-spacing: .005em; }
header h1, header h2, header h3 { color: #fff; }

/* Buttons: navy is the main action, gold the highlight (navy text for contrast). */
.btn { background: var(--k-navy); }
.btn:hover:not(:disabled) { filter: brightness(1.12); }
.btn.gold { background: var(--k-gold); color: var(--k-navy); }
.btn.ghost { background: #fff; color: var(--k-navy); border: 1px solid #d5dbe3; }
.btn.ghost:hover:not(:disabled) { border-color: var(--k-gold-soft); filter: none; background: var(--k-cream); }
.btn.whatsapp { background: var(--k-whatsapp); color: #fff; }

/* Header and side menu. */
header { background: linear-gradient(105deg, var(--k-navy), var(--k-navy-2)); border-bottom: 1px solid rgba(212, 175, 55, .55); }
nav { background: var(--k-navy); }
.navgroup { color: var(--k-gold-soft); }
.navbtn:hover, .navbtn.active { background: rgba(212, 175, 55, .16); box-shadow: inset 3px 0 0 var(--k-gold); }
.header-logo { border-color: rgba(212, 175, 55, .7); }

/* Login. */
.login { background: radial-gradient(circle at 50% 0, #1a3360 0, var(--k-navy) 55%, #050d1b 100%); }
.loginbox { border-color: rgba(212, 175, 55, .45); }

/* Cards, tables, fields. */
.card { border-color: #e2e7ee; }
.table th { color: var(--k-text); }
.table tbody tr:hover td { background: var(--k-cream); }
.field input:focus, .field select:focus, .field textarea:focus, .search:focus { outline: 2px solid rgba(212, 175, 55, .55); outline-offset: 0; border-color: var(--k-gold); }
.hero { background: linear-gradient(135deg, #fff 0, var(--k-cream) 100%); }
.hero:after { color: rgba(10, 25, 49, .05); }
.progress span { background: linear-gradient(90deg, var(--k-navy), var(--k-gold)); }
.socials a { color: var(--k-navy); }
.tag { background: var(--k-cream); border-color: var(--k-gold-soft); color: var(--k-navy); }

/* Status pills (meaning first: red late, amber pending, blue in progress, green done). */
.pill.EM_EXECUCAO { background: #dde8f7; color: #1c4d86; }
.pill.ENVIADA { background: #f4ecd2; color: var(--k-gold-ink); }

/* Phones (25/10/2026): the header must fit the screen (the Portal kept the search box and
   the page became wider than the phone, pushing windows off-centre). */
@media (max-width: 640px) {
  header { flex-wrap: wrap; }
  .headright { flex-wrap: wrap; justify-content: flex-end; max-width: 100%; }
  .header-search { display: none; }
}