[Feature Request] Define sass variables based on css variables where possible in Vuetify v3

Problem to solve

• Allows per element overriding of variables
• No more need to manually import and compile sass just to override variables
• Binding css variables in Vue 3 allows for simpler dynamic and computed styles

Proposed solution

Define sass variables based on css variables where possible. example:
instead of:

$icon-size: 24px !default;

--v-icon-size: 24px;
$icon-size: var(--v-icon-size, 24px) !default;

Since this is a breaking change in some instances, ideally it should be implemented before stabilizing v3