.root {
    composes: bg-gray-100 from global;
    composes: h-[2px] from global;
    composes: overflow-hidden from global;
    composes: w-full from global;
}

.root_relative {
    composes: root;

    composes: relative from global;
}

.root_absolute {
    composes: root;

    composes: absolute from global;
    composes: bottom-0 from global;
    composes: left-0 from global;
}

.indicator_off {
    composes: absolute from global;
    composes: bg-brand-dark from global;
    composes: h-full from global;
    composes: left-0 from global;
    composes: opacity-0 from global;
    composes: top-0 from global;
    composes: w-full from global;
    transform: translateX(-100%);
    transform-origin: left;
    transition: transform 0.25s linear;
}

.indicator_loading {
    composes: indicator_off;
    @apply opacity-100;
    transform: translateX(-25%);
}

.indicator_done {
    composes: indicator_off;
    @apply opacity-100;
    transform: translateX(0%);
}
