/*
==================================================
RotaBras Framework CSS
Arquivo: forms.css
Versão: 1.0
Descrição: Estilos globais de formulários
==================================================
*/

/* ===== Campos base ===== */
input,
select,
textarea {
  width: 100%;
  padding: var(--rb-space-sm);
  border: 1px solid var(--rb-border);
  border-radius: var(--rb-radius-sm);
  background: var(--rb-surface-light);
  color: var(--rb-white);
  font-family: var(--rb-font);
  font-size: var(--font-md);
  transition: var(--rb-transition);
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--rb-primary);
  box-shadow: 0 0 0 3px rgba(30, 215, 96, 0.3);
}

/* ===== Placeholder ===== */
::placeholder {
  color: var(--rb-text-muted);
  opacity: 0.8;
}

/* ===== Botões ===== */
button,
input[type="submit"],
input[type="button"] {
  background: var(--rb-primary);
  color: var(--rb-bg);
  border: none;
  border-radius: var(--rb-radius-sm);
  padding: var(--rb-space-sm) var(--rb-space-md);
  font-weight: var(--fw-semibold);
  cursor: pointer;
  transition: var(--rb-transition);
}

button:hover,
input[type="submit"]:hover,
input[type="button"]:hover {
  background: var(--rb-primary-hover);
}

/* ===== Estados ===== */
input:disabled,
select:disabled,
textarea:disabled {
  background: var(--rb-surface);
  color: var(--rb-text-muted);
  cursor: not-allowed;
}

input.error,
textarea.error,
select.error {
  border-color: var(--color-danger);
}

input.success,
textarea.success,
select.success {
  border-color: var(--color-success);
}

/* ===== Checkboxes e Radios ===== */
input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--rb-primary);
}

/* ===== Responsividade ===== */
@media (max-width: 768px) {
  input,
  select,
  textarea {
    font-size: var(--font-sm);
  }

  button,
  input[type="submit"],
  input[type="button"] {
    width: 100%;
  }
}