# Flutter Trip Itinerary Day Card with Booking Codes

A daily travel itinerary card listing timed stops with category icons, confirmation codes, and booking status badges. Great for trip planners and travel concierge apps.

`WDiv`, `WText`, `WIcon`

```dart
WDiv(
  className: 'mx-auto max-w-sm flex flex-col gap-5 rounded-3xl p-6 bg-white border border-gray-200 shadow-xl dark:bg-gray-900 dark:border-gray-800',
  children: [
    WDiv(
      className: 'flex flex-row items-center justify-between w-full',
      children: [
        WDiv(
          className: 'flex flex-col',
          children: [
            WText(
              'Tuesday, May 12',
              className: 'text-base font-bold text-gray-900 dark:text-white',
            ),
            WText(
              'Day 3 · Lisbon',
              className: 'text-xs text-gray-500 dark:text-gray-400',
            ),
          ],
        ),
        WDiv(
          className: 'flex flex-row items-center gap-1 rounded-full px-3 py-1 bg-teal-100 dark:bg-teal-500/20',
          children: [
            WIcon(
              Icons.calendar_today,
              className: 'text-teal-600 text-sm dark:text-teal-300',
            ),
            WText(
              '3 stops',
              className: 'text-xs font-bold text-teal-700 dark:text-teal-300',
            ),
          ],
        ),
      ],
    ),
    WDiv(
      className: 'flex flex-col gap-3 w-full',
      children: [
        WDiv(
          className: 'flex flex-row items-center justify-between w-full rounded-2xl px-4 py-3 bg-gray-50 dark:bg-gray-800',
          children: [
            WDiv(
              className: 'flex flex-row items-center gap-3',
              children: [
                WDiv(
                  className: 'flex items-center justify-center w-10 h-10 rounded-xl bg-sky-100 dark:bg-sky-500/20',
                  child: WIcon(
                    Icons.schedule,
                    className: 'text-sky-600 text-lg dark:text-sky-300',
                  ),
                ),
                WDiv(
                  className: 'flex flex-col',
                  children: [
                    WText(
                      'Train to Sintra',
                      className: 'text-sm font-semibold text-gray-900 dark:text-white',
                    ),
                    WText(
                      '09:15 · Rossio Station',
                      className: 'text-xs text-gray-500 dark:text-gray-400',
                    ),
                  ],
                ),
              ],
            ),
            WText(
              'SE-2241',
              className: 'text-xs font-bold tracking-wide text-sky-600 dark:text-sky-300',
            ),
          ],
        ),
        WDiv(
          className: 'flex flex-row items-center justify-between w-full rounded-2xl px-4 py-3 bg-gray-50 dark:bg-gray-800',
          children: [
            WDiv(
              className: 'flex flex-row items-center gap-3',
              children: [
                WDiv(
                  className: 'flex items-center justify-center w-10 h-10 rounded-xl bg-violet-100 dark:bg-violet-500/20',
                  child: WIcon(
                    Icons.location_on,
                    className: 'text-violet-600 text-lg dark:text-violet-300',
                  ),
                ),
                WDiv(
                  className: 'flex flex-col',
                  children: [
                    WText(
                      'Pena Palace tour',
                      className: 'text-sm font-semibold text-gray-900 dark:text-white',
                    ),
                    WText(
                      '11:00 · skip-the-line',
                      className: 'text-xs text-gray-500 dark:text-gray-400',
                    ),
                  ],
                ),
              ],
            ),
            WDiv(
              className: 'flex flex-row items-center gap-1 rounded-full px-2 py-1 bg-emerald-100 dark:bg-emerald-500/20',
              children: [
                WIcon(
                  Icons.check,
                  className: 'text-emerald-600 text-xs dark:text-emerald-300',
                ),
                WText(
                  'Booked',
                  className: 'text-[10px] font-bold text-emerald-700 dark:text-emerald-300',
                ),
              ],
            ),
          ],
        ),
        WDiv(
          className: 'flex flex-row items-center justify-between w-full rounded-2xl px-4 py-3 bg-gray-50 dark:bg-gray-800',
          children: [
            WDiv(
              className: 'flex flex-row items-center gap-3',
              children: [
                WDiv(
                  className: 'flex items-center justify-center w-10 h-10 rounded-xl bg-amber-100 dark:bg-amber-500/20',
                  child: WIcon(
                    Icons.star,
                    className: 'text-amber-500 text-lg dark:text-amber-300',
                  ),
                ),
                WDiv(
                  className: 'flex flex-col',
                  children: [
                    WText(
                      'Dinner at Belcanto',
                      className: 'text-sm font-semibold text-gray-900 dark:text-white',
                    ),
                    WText(
                      '20:00 · 2 Michelin stars',
                      className: 'text-xs text-gray-500 dark:text-gray-400',
                    ),
                  ],
                ),
              ],
            ),
            WText(
              'Table 7',
              className: 'text-xs font-bold text-amber-600 dark:text-amber-300',
            ),
          ],
        ),
      ],
    ),
    WDiv(
      className: 'flex flex-row items-center justify-center gap-2 w-full rounded-2xl px-4 py-3 bg-teal-600 dark:bg-teal-500',
      children: [
        WText(
          'View full itinerary',
          className: 'text-sm font-bold text-white dark:text-white',
        ),
        WIcon(
          Icons.arrow_forward,
          className: 'text-white text-base dark:text-white',
        ),
      ],
    ),
  ],
)
```
