//
// Copyright 2025 Sandlada & Kai Orion
// SPDX-License-Identifier: MIT
//

@use 'sass:map';
@use '../../../themes';
@use '../../../tokens';

$_motion: tokens.md-sys-motion-values();

@mixin styles() {
    $tokens: tokens.md-comp-navigation-rail-values();

    @layer navigation-rail-styles {
        & {
            @each $token, $value in $tokens {
                --_#{$token}: #{$value};
            }

            @include themes.md-comp-elevation-theme(
                (
                    'level': var(--_container-elevation),
                    'shadow-color': var(--_container-shadow-color),
                )
            );
        }

        & {
            height: 100%;
            width: map.get($tokens, 'container-width');
            box-sizing: border-box;
            position: relative;
            display: grid;
            grid-template-columns: 1fr;
            grid-template-rows: auto 1fr auto;
            padding: 12px 0px;

            &.top > .tabs-wrapper {
                height: fit-content;
            }

            &.center > .tabs-wrapper {
                place-content: center;
            }

            &.bottom > .tabs-wrapper {
                align-self: end;
            }

            & > .tabs-wrapper {
                width: inherit;
                position: relative;
                display: grid;
            }
        }

        & > .end-wrapper,
        & > .start-wrapper {
            width: inherit;
            min-height: 48px;
            min-width: 48px;
            padding: 8px 0px 12px;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        & > .end-wrapper {
            justify-self: end;
        }

        & > .background {
            background-color: map.get($tokens, 'container-color');
            position: absolute;
            inset: 0;
            border-radius: inherit;
            z-index: 0;
            pointer-events: none;
            user-select: none;
        }
    }
}
