<!-- source-hash: ef8653f94f0fdc48eb37fc59aa16aeb7 -->
Collapsible error/warning/info message component that displays a title with an optional expandable details section, supporting three severity types with distinct icon tinting.

## Key Components

### `ErrorMessageDisplay`
A `forwardRef` component that renders an alert card with:
- **`title`** — Always-visible summary text (truncated when collapsed)
- **`details`** — Optional expandable body text; when omitted, the card is non-interactive
- **`type`** — Severity level controlling icon color: `"error"` (default) | `"warning"` | `"info"`
- **`className`** — Additional CSS classes merged via `cn`

### `iconTint`
Internal map from `type` to ODS color tokens:
| Type | Token |
|---|---|
| `error` | `text-ods-error` |
| `warning` | `text-ods-warning` |
| `info` | `text-ods-text-secondary` |

### Internal Hooks & Sub-components
- **`useCollapsible`** — Provides animated `containerStyle` and `innerRef` for smooth height transitions
- **`ExpandChevron`** — Chevron icon that rotates based on `expanded` state
- **`AlertCircleIcon`** — 16px alert icon tinted by severity type

## Usage Example

```typescript
import { ErrorMessageDisplay } from "./error-message-display"

// Simple non-interactive error
<ErrorMessageDisplay
  type="error"
  title="Authentication failed"
/>

// Expandable warning with details
<ErrorMessageDisplay
  type="warning"
  title="Rate limit approaching"
  details="You have used 90% of your API quota. Requests may be throttled after midnight UTC."
/>

// Info message with custom class
<ErrorMessageDisplay
  type="info"
  title="Scheduled maintenance window"
  details="The service will be unavailable from 02:00–04:00 UTC on Saturday."
  className="mt-4"
/>
```

## Accessibility

- `aria-expanded` is set on the toggle button only when `details` is present
- `aria-label` dynamically switches between `"Expand details"` / `"Collapse details"`
- Button is `disabled` when no details exist, preventing keyboard interaction