@charset "UTF-8";
@use "../../core/jkl";

@layer jokul.components {
    .jkl-summary-table {
        display: flex;
        flex-direction: column;
        overflow-wrap: anywhere;
        width: 100%;

        @include jkl.text-style("text-medium");

        tr {
            display: flex;
            justify-content: space-between;
            padding-bottom: var(--jkl-unit-10);
        }

        th,
        td {
            flex-basis: 50%;
            padding-right: var(--jkl-unit-20);

            &:first-child {
                text-align: left;
            }

            &:last-child {
                text-align: right;
                padding-right: 0;
            }
        }

        & > tbody {
            th {
                font-weight: jkl.$typography-weight-normal;
            }
        }

        & > tfoot {
            border-top: jkl.rem(1px) solid
                var(--jkl-color-border-separator-strong);
            border-bottom: jkl.rem(1px) solid
                var(--jkl-color-border-separator-strong);
            padding-top: var(--jkl-unit-10);

            th,
            td {
                font-weight: var(--jkl-typography-weight-bold);
            }
        }
    }
}
