@use "../helpers/variables" as vars;

$text-padding: 12px;
$tick-size: 1;

.tick {
    line {
        fill: none;
        shape-rendering: crispedges;
        stroke: vars.$grey-500;
        stroke-width: $tick-size;
    }

    text {
        fill: vars.$grey-600;
        font-size: vars.$text-size-small;
        padding: $text-padding;
    }
}

.y-axis-label,
.x-axis-label {
    fill: vars.$grey-500;
    font-size: vars.$text-size-medium;
}