improvement: lab/clinic commiunication flow completely overhauled. no more shit.

frontend/src/components/ui/treatment/TreatmentRailSection.tsx

@@ -0,0 +1,60 @@
+'use client';
+
+import { useState } from 'react';
+import { ChevronDown } from 'lucide-react';
+
+interface TreatmentRailSectionProps {
+  title: string;
+  subtitle?: string;
+  count?: number;
+  defaultExpanded?: boolean;
+  variant?: 'default' | 'attention';
+  children: React.ReactNode;
+}
+
+export function TreatmentRailSection({
+  title,
+  subtitle,
+  count,
+  defaultExpanded = false,
+  variant = 'default',
+  children,
+}: TreatmentRailSectionProps) {
+  const [expanded, setExpanded] = useState(defaultExpanded);
+
+  const shellClass =
+    variant === 'attention'
+      ? 'surface-card border border-amber-500/35 bg-amber-500/5'
+      : 'surface-card';
+
+  return (
+    <section className={`${shellClass} overflow-hidden`}>
+      <button
+        type="button"
+        onClick={() => setExpanded((open) => !open)}
+        className="flex w-full items-start gap-2 px-3 py-2.5 text-left hover:bg-background-secondary/30 transition-colors"
+        aria-expanded={expanded}
+      >
+        <ChevronDown
+          className={`h-4 w-4 shrink-0 mt-0.5 text-text-muted transition-transform ${
+            expanded ? 'rotate-0' : '-rotate-90'
+          }`}
+        />
+        <div className="min-w-0 flex-1">
+          <div className="flex flex-wrap items-center gap-1.5">
+            <h3 className="text-sm font-semibold text-text-primary">{title}</h3>
+            {count !== undefined && count > 0 ? (
+              <span className="rounded-full bg-background-secondary px-1.5 py-0.5 text-[10px] font-medium tabular-nums text-text-muted">
+                {count}
+              </span>
+            ) : null}
+          </div>
+          {subtitle ? (
+            <p className="text-[11px] text-text-muted mt-0.5 line-clamp-2">{subtitle}</p>
+          ) : null}
+        </div>
+      </button>
+      {expanded ? <div className="px-3 pb-3 pt-0 border-t border-border/50">{children}</div> : null}
+    </section>
+  );
+}