@use './typography';
@use './spacing';

@mixin g-theme-common {
    @include typography.variables;
    @include spacing.variables;

    --g-scrollbar-width: 12px;

    --g-border-radius-xs: 3px;
    --g-border-radius-s: 5px;
    --g-border-radius-m: 6px;
    --g-border-radius-l: 8px;
    --g-border-radius-xl: 10px;

    --g-focus-border-radius: 2px;

    @at-root body#{&} {
        // default document direction is ltr
        --g-flow-direction: 1;
        --g-flow-is-ltr: 1;
        --g-flow-is-rtl: 0;
    }

    &[dir='ltr'] {
        --g-flow-direction: 1;
        --g-flow-is-ltr: 1;
        --g-flow-is-rtl: 0;
    }

    &[dir='rtl'] {
        --g-flow-direction: -1;
        --g-flow-is-ltr: 0;
        --g-flow-is-rtl: 1;
    }
}