@use "../../jkl";

@layer jokul.components {
    .jkl-table-head {
        &--sr-only {
            @include jkl.screenreader-only;
        }

        &--sticky {
            & > .jkl-table-row {
                position: sticky;
                top: var(--jkl-table-head-sticky-offset, 0);
                z-index: 1;
                background-color: var(--jkl-table-head-sticky-color, var(--jkl-color-background-page));

                border-bottom: none;

                box-shadow: inset 0 0 0 #000,
                    inset 0 var(--jkl-border-width-1) 0 var(--jkl-color-border-strong);
                background-clip: padding-box;

                // legg til litt (nesten-cirka 16px) over headingen
                vertical-align: bottom;
                height: 2.3em;
            }
        }
    }
}