/* ============================================================
   Sistema Financeiro — Campos de formulário
   Padroniza o arredondamento dos controles (inputs, selects e
   textareas) em todas as páginas, usando o token --radius-input.
   Carregar DEPOIS de global.css e de sistema-financeiro-tokens.css.
   ============================================================ */

input[type="text"],
input[type="number"],
input[type="date"],
input[type="datetime-local"],
input[type="month"],
input[type="time"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="url"],
select,
textarea {
  border-radius: var(--radius-input);
}

/* Selects nativos ignoram border-radius no Safari e ficam quadrados ao lado
   dos inputs. Com appearance:none o raio passa a valer e a seta vira nossa.
   As longhands de background levam !important porque várias páginas declaram
   `background` (shorthand) nos selects, o que apagaria a seta desenhada aqui;
   o mesmo vale para o padding-right, que reserva o espaço dela. */
select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%23665e57' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' d='M2.5 4.5 L6 8 L9.5 4.5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 10px center !important;
  background-size: 12px !important;
  padding-right: 30px !important;
}

/* Listas de seleção múltipla não têm seta e não precisam do espaço extra. */
select[multiple],
select[size]:not([size="1"]) {
  background-image: none !important;
  padding-right: 10px !important;
}