/* ============================================================
   LINDE UI · a régua da casa
   Uma medida só para todo o sistema — mesma altura, mesmo raio,
   mesmo respiro em cada tela. Carrega SEMPRE por último (depois
   do <style> da página) para ser a palavra final.
   Dois temas: .tema-verde (MarketView, Horizon, Contratos) e
   .tema-marrom (Pricing, Risco). Trocam só a cor — a forma é igual.
   ============================================================ */
:root{
  --ui-h:40px;        /* altura de TODO controle: chip, campo, botão */
  --ui-r:8px;         /* raio de campo e botão */
  --ui-pill:20px;     /* raio de pílula (metade da altura = pílula perfeita) */
  --ui-fs:13px;       /* corpo dos controles */
  --ui-padx:14px;     /* respiro horizontal */
}

/* ---------- TEMA VERDE (o teal da casa) ---------- */
body.tema-verde{
  --teal:#2C9199; --teal-d:#1F6B72; --teal-x:#16494D; --teal-xx:#0F3538;
  --soft:#EAF4F5; --line:#D5E9EB; --bg:#F4F8F8;
  --ink:#16494D; --ink2:#2E6167; --mut:#566E76;
}
/* ---------- TEMA MARROM (a terra, o café, o algodão) ---------- */
body.tema-marrom{
  --teal:#7C6242; --teal-d:#634E34; --teal-x:#42331E; --teal-xx:#2F2413;
  --soft:#F3EEE4; --line:#E5DAC7; --bg:#FAF6EF;
  --ink:#3B2E1B; --ink2:#634E34; --mut:#8A7B63;
}
/* NÃO forçamos o fundo do body: cada página escolhe o seu (ex.: o login é
   escuro). Os temas trocam só as VARIÁVEIS — a página se re-veste sozinha. */

/* ============================================================
   CONTROLES — a mesma barra em toda tela
   ============================================================ */

/* ---- campos de formulário (input / select) ---- */
body .lt-fld>input, body .lt-fld>select,
body .fld>input, body .fld>select,
body .linha-add>input, body .linha-add>select,
body .premio-linha>input,
body.ui-form-wide main input[type=text], body.ui-form-wide main input[type=date],
body.ui-form-wide main input[type=email], body.ui-form-wide main input[type=password],
body.ui-form-wide main input[type=search], body.ui-form-wide main select,
body.ui-form-wide .box input{
  height:var(--ui-h); box-sizing:border-box; margin:0;
  padding:0 var(--ui-padx);
  border:1px solid var(--line); border-radius:var(--ui-r);
  font:500 var(--ui-fs)/1.1 var(--sans);
  background:#fff; color:var(--ink);
}
body .lt-fld>select, body .fld>select, body .linha-add>select,
body.ui-form-wide main select{ padding-right:32px; }

/* ---- pílulas de filtro + busca (a régua base do MarketView) ---- */
body .filtros button, body .filtros input{
  height:var(--ui-h); box-sizing:border-box; margin:0;
  padding:0 16px; border:1px solid var(--line); border-radius:var(--ui-pill);
  font:600 var(--ui-fs)/1 var(--sans); background:#fff; color:var(--ink2);
  display:inline-flex; align-items:center; justify-content:center; white-space:nowrap;
}
body .filtros input{ font-weight:500; justify-content:flex-start; }

/* ---- botões nas barras de ação ---- */
body .lt-row>.btn, body .linha-add>.btn, body .btnrow>.btn{
  height:var(--ui-h); box-sizing:border-box;
  padding:0 18px; border-radius:var(--ui-r);
  font:600 var(--ui-fs)/1 var(--sans);
  display:inline-flex; align-items:center; justify-content:center;
}

/* ---- exceção: campos sobre o cartão-gradiente continuam translúcidos ---- */
body .destaque .fld>input, body .destaque .fld>select{
  background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.32); color:#fff;
}
body .destaque .fld>input::placeholder{ color:rgba(255,255,255,.55); }

/* ---- foco: o mesmo anel em tudo ---- */
body input:focus, body select:focus, body textarea:focus{
  outline:2px solid var(--teal); outline-offset:1px;
}

/* ---- rótulos de campo: mesma voz, mesmo tamanho ---- */
body .lt-fld>label, body .fld>label{
  font:700 9px var(--mono); letter-spacing:.12em; text-transform:uppercase;
  color:var(--mut); margin:0 0 4px; white-space:nowrap;
}