refactor: improve InfoBox and NoteBox components with collapsible design

- Convert InfoBox to collapsible details element with chevron indicators
- Add internationalized default title support for InfoBox
- Update NoteBox styling to match new design system
- Replace custom alert styling with consistent border-based design
- Add text-base class to fieldset legends for uniform sizing
- Remove className prop from InfoBox and NoteBox (no longer needed)
- Update translations for clearer payment instruction descriptions

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

messages/en.json

@@ -204,7 +204,8 @@
     "title": "User settings",
 
     "iban-payment-instructions--legend": "Payment to Your IBAN",
-    "iban-payment-instructions--intro-message": "By activating this option, payment instructions will be included in the monthly statement sent to the tenant, allowing a direct payment via IBAN to be made to your bank account.",
+    "iban-payment-instructions--intro-title": "What does this option do?",
+    "iban-payment-instructions--intro-message": "By activating this option, the monthly statement sent to the tenant will contain payment details and a 2D barcode allowing a direct payment to your bank account.",
     "iban-payment-instructions--toggle-label": "enable IBAN payment instructions",
 
     "iban-form-title": "Payment Information for IBAN",
@@ -220,7 +221,8 @@
 
     "revolut-form-title": "Payment Information for Revolut",
     "revolut-payment-instructions--legend": "Payment to Your Revolut Profile",
-    "revolut-payment-instructions--intro-message": "By activating this option, payment instructions will be included in the monthly statement sent to the tenant, allowing a direct payment via Revolut to be made to your  Revolut profile.",
+    "revolut-payment-instructions--intro-title": "What does this option do?",
+    "revolut-payment-instructions--intro-message": "By activating this option, the monthly statement sent to the tenant will contain a link allowing a direct payment to your Revolut account.",
     "revolut-payment-instructions--toggle-label": "enable Revolut payment instructions",
 
     "revolut-profile-label": "Revolut profile name",
@@ -246,5 +248,8 @@
       "owner-revolut-profile-invalid": "Invalid Revolut profile format. Must start with '@' and contain only English letters and numbers (e.g., '@john123')",
       "validation-failed": "Validation failed. Please check the form and try again."
     }
+  },
+  "info-box": {
+    "default-title": "What is this option for?"
   }
 }

messages/hr.json

@@ -203,8 +203,8 @@
     "title": "Korisničke postavke",
     
     "iban-payment-instructions--legend": "Uplata na vaš IBAN",
-    "iban-payment-instructions--intro-message": "Aktiviranjem ove opcije, upute za uplatu bit će uključene u mjesečni izvještaj poslan podstanaru, omogućujući im da izvrše izravnu uplatu putem IBAN-a na vaš bankovni račun.",
-    "iban-payment-instructions--toggle-label": "uključi IBAN uplatu",
+    "iban-payment-instructions--intro-message": "Aktiviranjem ove opcije, mjesečni obračun poslan podstanaru sadržavati će podatke za uplatu i 2D barkod putem kojeg će podstanar moći izvršiti izravnu uplatu sredstava na bankovni račun.",
+    "iban-payment-instructions--toggle-label": "omogući IBAN uplatu",
 
     "iban-form-title": "Informacije za uplatu na IBAN",
     "iban-owner-name-label": "Vaše ime i prezime",
@@ -217,8 +217,8 @@
     "iban-owner-iban-placeholder": "IBAN putem kojeg ćete primate uplate",
 
     "revolut-payment-instructions--legend": "Uplata na vaš Revolut profil",
-    "revolut-payment-instructions--intro-message": "Aktiviranjem ove opcije, upute za uplatu bit će uključene u mjesečni izvještaj poslan podstanaru, omogućujući im da izvrše izravnu uplatu putem Revolut-a na vaš profil.",
-    "revolut-payment-instructions--toggle-label": "uključi Revolut uplatu",
+    "revolut-payment-instructions--intro-message": "Aktiviranjem ove opcije, mjesečni obračun poslan podstanaru sadržavati će link putem kojeg će podstanar moći izvršiti izravnu uplatu sredstava na vaš Revolut račun.",
+    "revolut-payment-instructions--toggle-label": "omogući Revolut uplatu",
 
     "revolut-form-title": "Informacije za uplatu na Revolut",
     "revolut-profile-label": "Naziv vašeg Revolut profila",
@@ -243,5 +243,8 @@
       "validation-failed": "Validacija nije uspjela. Molimo provjerite formu i pokušajte ponovno."
     },
     "payment-additional-notes": "VAŽNO: da bi upute za uplatu bile prikazane podstanaru, morate tu ovu opciju uključiti i u postavkama pripadajuće nekretnine."
+  },
+  "info-box": {
+    "default-title": "Čemu služi ova opcija?"
   }
 }