/* input.css — v2 Form-Input-Primitives (.input / .select / .textarea).
   Konsumenten: alle .app-scope-Forms (Drawer-Field-Grid, Filter-Popover-
   Inputs, Setup-Wizards, Custom-Forms). Focus-Ring via --lod-shadow-focus,
   Invalid-State via [aria-invalid="true"]. */

.app-scope .input,
.app-scope .select,
.app-scope .textarea {
  width: 100%;
  border: 1px solid var(--lod-gray-200);
  border-radius: var(--radius-md);
  padding: 7px var(--space-2-5);
  font-size: 13px;
  background: #fff;
  color: var(--lod-gray-900);
  outline: none;
  transition: border-color var(--duration-quick), box-shadow var(--duration-quick);
  font-family: inherit;
}
.app-scope .input:focus,
.app-scope .select:focus,
.app-scope .textarea:focus {
  border-color: var(--lod-turquoise);
  box-shadow: var(--lod-shadow-focus);
}
.app-scope .input[aria-invalid="true"],
.app-scope .select[aria-invalid="true"],
.app-scope .textarea[aria-invalid="true"] {
  border-color: var(--lod-danger);
}
.app-scope .input::placeholder,
.app-scope .textarea::placeholder { color: var(--lod-gray-500); }
.app-scope .textarea { resize: vertical; min-height: 64px; }
.app-scope .select {
  appearance: none;
  padding-right: 26px;
  background: #fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23555a63' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>") no-repeat right 8px center;
}