card data - ora con secondi - meteo

type: custom:layout-card
layout_type: custom:grid-layout
layout:
  margin: 0px 0px 0px 0px
  grid-template-columns: 1fr
  grid-template-rows: min-content min-content min-content
  grid-template-areas: |
    "data" "ora" "meteo"
cards:
  - type: custom:button-card
    entity: sensor.pretty_date
    show_name: false
    show_state: true
    show_icon: false
    styles:
      card:
        - background: none
        - padding: 0px
        - border: none
        - justify-self: center
        - font-size: 18px
        - font-weight: 300
      state:
        - justify-self: center
        - font-size: 120%
        - font-weight: 500
    view_layout:
      grid-area: data
  - type: custom:mod-card
    view_layout:
      grid-area: ora
    card:
      type: custom:simple-clock-card
    card_mod:
      style: |
        ha-card {
          height: 2px !important;
        }
        div {
          padding: 0px !important;
          font-size: 2.3rem !important;
          font-weight: 800 !important;
        }
  - type: custom:button-card
    entity: sensor.meteo
    show_icon: false
    show_name: false
    show_state: true
    styles:
      card:
        - background: none
        - padding-bottom: 0px
      state:
        - justify-self: center
        - text-transform: capitalize
        - color: var(--paper-item-icon-active-color)
    view_layout: meteo