.table
    width: 100%
    border-radius: $radius
    overflow: hidden
    border: 1px solid $dark

    table
        border: none
        border-collapse: collapse
        width: 100%

        tr
            border: none
            border-bottom: 1px solid $dark

            &:last-child
                border: none

        th, td
            padding: 0.5rem
            text-align: left
            vertical-align: top
            border-right: 1px solid $dark

            &:last-child
                border: none

        th
            background: $dark
            color: $light

@media (max-width: 768px)
    .table table
        th, td
            padding: 0.25rem

@media (prefers-color-scheme: dark)
    .table
        border: 1px solid $light

        table
            tr
                border-bottom: 1px solid $light

            th, td
                border-right: 1px solid $light

            th
                background: $light
                color: $dark