Impedisce ai campi data di sfondare la card del tesseramento su iOS.

In `grid-cols-2` l'elemento di griglia è la label di `Campo`, che ha
`min-width: auto` e quindi non scende sotto la larghezza del contenuto. Su iOS
`input[type="date"]` è un controllo nativo con una larghezza intrinseca che
`width: 100%` non riduce: le due date affiancate sfondavano la card e
l'`overflow-hidden` del pannello a tab tagliava via quello che usciva.

`min-w-0` sulla label e sulla classe condivisa degli input, più `min-width: 0`
e `appearance: none` sulle sole date — è `appearance` a rendere il controllo
davvero ridimensionabile, e restando sulle date il select tiene la sua freccia.

Il fix sta in `CampiProfilo`, quindi copre anche la dashboard amministratore.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

src/components/crapp/ProfiloAmministrativo.tsx

@@ -22,11 +22,18 @@ import {
 
 const TIPI_DOCUMENTO = ["Carta d'identità", "Patente", "Passaporto"];
 
-const classiInput = "w-full rounded-xl border border-border bg-background px-3 py-2 text-sm";
+const classiInput =
+  "w-full min-w-0 rounded-xl border border-border bg-background px-3 py-2 text-sm";
 
+/**
+ * `min-w-0`: dentro `grid-cols-2` questa label è l'elemento di griglia e ha
+ * `min-width: auto`, quindi si allarga fino al contenuto invece di stare nella
+ * colonna. Con un controllo nativo largo dentro (una data su iOS) la coppia
+ * sfonda la card.
+ */
 function Campo({ label, children }: { label: string; children: React.ReactNode }) {
   return (
-    <label className="block">
+    <label className="block min-w-0">
       <span className="text-xs font-bold uppercase tracking-wide text-muted-foreground">
         {label}
       </span>

src/styles.css

@@ -527,6 +527,22 @@
   }
 }
 
+/*
+ * Su iOS `input[type="date"]` è un controllo nativo con una larghezza
+ * intrinseca (lo spazio di «gg/mm/aaaa») che `width: 100%` non riesce a far
+ * scendere: dentro `grid-cols-2` due date affiancate sfondano la card, e
+ * l'`overflow-hidden` del pannello a tab taglia via quello che esce.
+ * `appearance: none` è quello che rende il campo davvero ridimensionabile;
+ * bordo, sfondo e padding li mette già la classe condivisa.
+ */
+@layer base {
+  input[type="date"] {
+    min-width: 0;
+    appearance: none;
+    -webkit-appearance: none;
+  }
+}
+
 /* Focus da tastiera sempre visibile: nessun controllo custom lo definiva. */
 @layer base {
   :focus-visible {