/* ==================================================
   OPERATIVA.APP — FORMS
   Inputs, labels, ayudas, errores
   NO define botones
================================================== */

/* ===============================
   CONTENEDOR DE CAMPO
================================ */

.form-field {
  margin-bottom: var(--space-4);
}

/* ===============================
   LABELS
================================ */

.form-field label {
  display: block;
  margin-bottom: var(--space-2);

  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--color-muted);
}

/* ===============================
   INPUTS / SELECTS / TEXTAREA
================================ */

.form-field input,
.form-field select,
.form-field textarea {
  width: 100%;
  min-height: 40px;

  padding: 0 var(--space-3);

  font-size: var(--text-base);
  font-family: inherit;

  color: var(--color-text);
  background: var(--color-white);

  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);

  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background 0.15s ease;
}

/* ===============================
   FOCUS
================================ */

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

/* ===============================
   PLACEHOLDER
================================ */

.form-field input::placeholder,
.form-field textarea::placeholder {
  color: var(--color-subtle);
}

/* ===============================
   DISABLED / READONLY
================================ */

.form-field input:disabled,
.form-field select:disabled,
.form-field textarea:disabled {
  background: #f1f5f9;
  color: var(--color-subtle);
  cursor: not-allowed;
}

/* ===============================
   ERRORES DE CAMPO
================================ */

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

.form-field.has-error input:focus,
.form-field.has-error select:focus,
.form-field.has-error textarea:focus {
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.15);
}

/* Texto de error */
.form-error {
  margin-top: var(--space-2);
  font-size: var(--text-xs);
  color: var(--color-danger);
}

/* ===============================
   AYUDAS / HINTS
================================ */

.form-hint {
  margin-top: var(--space-2);
  font-size: var(--text-xs);
  color: var(--color-subtle);
}

/* ===============================
   GRUPOS DE ACCIONES (BOTONES)
================================ */

.form-actions {
  display: flex;
  gap: var(--space-4);
  margin-top: var(--space-6);
  align-items: center;
}

/* ===============================
   FORMULARIOS COMPACTOS (ERP)
================================ */

.form-compact .form-field {
  margin-bottom: var(--space-3);
}

.form-compact input,
.form-compact select {
  min-height: 36px;
  font-size: var(--text-sm);
}

/* ===============================
   LOGIN (AJUSTE CONTEXTUAL)
================================ */

.login-main {
  align-items: center;
}

.login-card {
  width: 100%;
  max-width: 420px;
}

/* Mensaje de error global (login) */
.login-error {
  margin-bottom: var(--space-4);
  padding: var(--space-3) var(--space-4);

  font-size: var(--text-sm);
  line-height: 1.4;

  color: #991b1b;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: var(--radius-sm);
}