/* =============================================================
   FORMS — inline form, form-field, select styling
   ============================================================= */

/* ── Inline / sidebar form ──────────────────────────────────── */
.inline-form    { background: #fff; border-radius: var(--radius); border: 1px solid var(--border); padding: 22px; margin-bottom: 20px; }
.inline-form h4 { font-size: .95rem; font-weight: 800; color: var(--blue); margin-bottom: 16px; }

/* ── Field ──────────────────────────────────────────────────── */
.form-field { margin-bottom: 12px; }
.form-group { margin-bottom: 14px; }

/* form-field label: uppercase heading style (sidebar/single-page forms) */
.form-field label {
  display: block; font-size: .78rem; font-weight: 700; color: var(--text-3);
  margin-bottom: 4px; text-transform: uppercase; letter-spacing: .03em;
}
/* form-group label: normal case (quote, contact multi-field forms) */
.form-group label {
  display: block; font-size: .78rem; font-weight: 700; color: var(--text-2);
  margin-bottom: 5px;
}

/* ── Inputs ─────────────────────────────────────────────────── */
.form-field input,
.form-field textarea,
.form-field select,
.form-group input,
.form-group textarea,
.form-control {
  width: 100%; padding: 10px 13px;
  border: 1.5px solid var(--border); border-radius: 7px;
  font-size: .875rem; outline: none;
  transition: border-color var(--transition), box-shadow var(--transition);
  background: #fff; font-family: var(--font);
}
.form-field input:focus,
.form-field textarea:focus,
.form-field select:focus,
.form-group input:focus,
.form-group textarea:focus,
.form-control:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(30,58,123,.08);
}
.form-field textarea,
.form-group textarea,
textarea.form-control { resize: vertical; min-height: 80px; }

/* ── Select (custom appearance) ────────────────────────────── */
select,
.form-group select,
.form-field select,
.full-form select {
  padding: 10px 36px 10px 13px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23718096' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right 10px center;
  background-size: 16px;
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
  cursor: pointer; color: var(--text);
}
select option { padding: 8px; font-size: .875rem; }
/* Filter bar compact selects */
.filter-group select { padding: 7px 32px 7px 10px; font-size: .82rem; width: auto; }

/* ── Two-column grid row ────────────────────────────────────── */
.form-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 600px) { .form-row-2 { grid-template-columns: 1fr; } }

/* ── Messages ───────────────────────────────────────────────── */
.form-msg,
.form-message { padding: 10px 14px; border-radius: 7px; font-size: .85rem; margin-top: 10px; }
.form-msg.success,
.form-message.success { background: rgba(45,158,68,.1); color: var(--green-dark); }
.form-msg.error,
.form-message.error   { background: rgba(220,38,38,.1); color: #DC2626; }