fix(trips): stop the two date fields overlapping in the trip dialog

A grid item defaults to min-width:auto, so the two date cells never went below
the width of their contents: a long locale date plus the keyboard button beside
it pushed each cell past its track, and on a phone the end date came to sit on
top of the start date with its own button clipped off the edge. Measured on a
412px viewport, the row overflowed its container by 30px.

Both cells get min-w-0 so the track wins, and the picker's own trigger gets it
too, which is what finally lets the ellipsis it already carries do its job
rather than the button simply growing. "12. Sept. 2026" now reads "12. Sept…"
in a narrow column instead of escaping it.

Keeping the locale format: the report suggests ISO 8601, but the date is
formatted from the user's language everywhere in the app, and the overlap is
the layout, not the wording.

client/src/components/Trips/TripFormModal.tsx

@@ -534,14 +534,17 @@ export default function TripFormModal({ isOpen, onClose, onSave, trip, onCoverUp
 
         <div className={panelCls}>
 
+        {/* min-w-0 on both cells: a grid item defaults to min-width:auto, so a
+            long date ("12. Sept. 2026" and the keyboard button beside it) pushed
+            the cell past its track and the two columns overlapped (#2267). */}
         <div className="grid grid-cols-2 gap-3">
-          <div>
+          <div className="min-w-0">
             <label className={labelCls}>
               <Calendar className="w-3.5 h-3.5" />{t('dashboard.startDate')}
             </label>
             <CustomDatePicker value={formData.start_date} onChange={v => update('start_date', v)} placeholder={t('dashboard.startDate')} />
           </div>
-          <div>
+          <div className="min-w-0">
             <label className={labelCls}>
               <Calendar className="w-3.5 h-3.5" />{t('dashboard.endDate')}
             </label>

client/src/components/shared/CustomDateTimePicker.tsx

@@ -304,6 +304,11 @@ export function CustomDatePicker({
             aria-haspopup="dialog"
             style={{
               flex: 1,
+              // Without this the trigger never goes below its text width, so the
+              // ellipsis on the label below is unreachable and the button
+              // overflows its column instead. A long locale date ("12. Sept.
+              // 2026") in a two-column grid is exactly that case (#2267).
+              minWidth: 0,
               display: 'flex',
               alignItems: 'center',
               justifyContent: 'center',