/* FILE: /public_html/public/assets/css/forms.css
   Form controls + layout helpers (uses theme tokens: --line, --ink, --muted, --accent, --danger)
*/

/* Controls */
.input, .select, .textarea{
  width:100%;
  border:1px solid var(--line);
  border-radius:14px;
  padding:11px 12px;
  background:rgba(255,255,255,.85);
  color:var(--ink);
  outline:none;
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.select{appearance:none}
.textarea{min-height:110px; resize:vertical}

.input::placeholder,
.textarea::placeholder{
  color: rgba(11,18,32,.55);
}

.input:focus,
.select:focus,
.textarea:focus{
  box-shadow: 0 0 0 4px rgba(14,165,233,.18);
  border-color: rgba(14,165,233,.55);
  background: rgba(255,255,255,.95);
}

.input[disabled],
.select[disabled],
.textarea[disabled]{
  opacity:.65;
  cursor:not-allowed;
}

/* Field wrappers */
.field{display:grid; gap:6px}
.field label{
  font-weight:800;
  font-size:13px;
  color: var(--muted);
}
.help{
  font-size:12px;
  color: var(--muted);
  line-height:1.45;
}
.err{
  font-size:12px;
  color: var(--danger);
  line-height:1.45;
}

/* Rows */
.row2{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.row3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px}
@media (max-width: 860px){ .row2, .row3{grid-template-columns:1fr} }

/* Input group (optional) */
.igroup{
  display:flex;
  gap:10px;
  align-items:center;
}
.igroup .input{flex:1}
.igroup .btn{flex:0 0 auto}

/* Alerts */
.alert{
  border:1px solid var(--line);
  border-radius:16px;
  padding:12px;
  background:rgba(255,255,255,.75);
  line-height:1.55;
}
.alert strong{font-weight:900}

.alert.ok{
  border-color: rgba(34,197,94,.35);
  background: rgba(34,197,94,.08);
}
.alert.bad{
  border-color: rgba(239,68,68,.35);
  background: rgba(239,68,68,.08);
}