@broxus/react-uikit 0.1.0

package/dist/esm/styles/mixins.scss

@@ -0,0 +1,1947 @@
+@import 'variables';
+@import 'mixin';
+
+@mixin hook-accordion() {}
+@mixin hook-accordion-item() {}
+@mixin hook-accordion-item-disable() {}
+@mixin hook-accordion-header() {}
+@mixin hook-accordion-header-hover() {}
+@mixin hook-accordion-header-collapsible-only() {}
+@mixin hook-accordion-content() {}
+@mixin hook-accordion-content-box() {}
+@mixin hook-accordion-extra() {}
+@mixin hook-accordion-misc() {}
+@mixin hook-inverse-accordion-item() {}
+@mixin hook-inverse-accordion-header() {}
+@mixin hook-inverse-accordion-header-hover() {}
+@mixin hook-inverse-component-accordion() {
+    .uk-accordion > :nth-child(n+2) {
+        @if  mixin-exists(hook-inverse-accordion-item) {
+            @include hook-inverse-accordion-item;
+        }
+    }
+
+    .uk-accordion-header {
+        color: var(--inverse-accordion-header-color);
+        @if  mixin-exists(hook-inverse-accordion-header) {
+            @include hook-inverse-accordion-header;
+        }
+    }
+
+    .uk-accordion-header:hover,
+    .uk-accordion-header:focus {
+        color: var(--inverse-accordion-header-hover-color);
+    }
+
+    .uk-accordion-item-disabled {
+        color: var(--inverse-accordion-item-disabled-color);
+    }
+}
+
+@mixin hook-alert() {
+    a:not([class]) {
+        color: inherit;
+        text-decoration: underline;
+    }
+}
+@mixin hook-alert-close() {}
+@mixin hook-alert-close-hover() {}
+@mixin hook-alert-primary() {}
+@mixin hook-alert-success() {}
+@mixin hook-alert-warning() {}
+@mixin hook-alert-danger() {}
+@mixin hook-alert-misc() {}
+
+@mixin hook-align-misc() {}
+
+@mixin hook-animation-misc() {}
+
+@mixin hook-article() {}
+@mixin hook-article-adjacent() {}
+@mixin hook-article-title() {}
+@mixin hook-article-meta() {}
+@mixin hook-article-misc() {}
+@mixin hook-inverse-article-title() {}
+@mixin hook-inverse-article-meta() {}
+@mixin hook-inverse-component-article() {
+    .uk-article-title {
+        @if mixin-exists(hook-inverse-article-title) {
+            @include hook-inverse-article-title;
+        }
+    }
+
+    .uk-article-meta {
+        color: var(--inverse-article-meta-color);
+        @if mixin-exists(hook-inverse-article-meta) {
+            @include hook-inverse-article-meta;
+        }
+    }
+}
+
+@mixin hook-background-misc() {}
+
+@mixin hook-badge() {}
+@mixin hook-badge-hover() {}
+@mixin hook-badge-misc() {}
+@mixin hook-inverse-badge() {}
+@mixin hook-inverse-badge-hover() {}
+@mixin hook-inverse-component-badge() {
+    .uk-badge {
+        background-color: var(--inverse-badge-background);
+        color: var(--inverse-badge-color);
+        @if mixin-exists(hook-inverse-badge) {
+            @include hook-inverse-badge;
+        }
+    }
+
+    .uk-badge:hover,
+    .uk-badge:focus {
+        color: var(--inverse-badge-hover-color);
+        @if mixin-exists(hook-inverse-badge-hover) {
+            @include hook-inverse-badge-hover;
+        }
+    }
+}
+
+@mixin hook-base-body() {}
+@mixin hook-base-link() {}
+@mixin hook-base-link-hover() {}
+@mixin hook-base-code() {}
+@mixin hook-base-heading() {}
+@mixin hook-base-h1() {}
+@mixin hook-base-h2() {}
+@mixin hook-base-h3() {}
+@mixin hook-base-h4() {}
+@mixin hook-base-h5() {}
+@mixin hook-base-h6() {}
+@mixin hook-base-hr() {}
+@mixin hook-base-blockquote() {}
+@mixin hook-base-blockquote-footer() {}
+@mixin hook-base-pre() {}
+@mixin hook-base-misc() {}
+@mixin hook-inverse-base-link() {}
+@mixin hook-inverse-base-link-hover() {}
+@mixin hook-inverse-base-code() {}
+@mixin hook-inverse-base-heading() {}
+@mixin hook-inverse-base-h1() {}
+@mixin hook-inverse-base-h2() {}
+@mixin hook-inverse-base-h3() {}
+@mixin hook-inverse-base-h4() {}
+@mixin hook-inverse-base-h5() {}
+@mixin hook-inverse-base-h6() {}
+@mixin hook-inverse-base-blockquote() {}
+@mixin hook-inverse-base-blockquote-footer() {}
+@mixin hook-inverse-base-hr() {}
+@mixin hook-inverse-component-base() {
+    color: var(--inverse-base-color);
+
+    // Base
+    // ========================================================================
+
+    //
+    // Link
+    //
+
+    a,
+    .uk-link {
+        color: var(--inverse-base-link-color);
+
+        @if mixin-exists(hook-inverse-base-link) {
+            @include hook-inverse-base-link;
+        }
+    }
+
+    a:hover,
+    .uk-link:hover,
+    .uk-link-toggle:hover .uk-link,
+    .uk-link-toggle:focus .uk-link {
+        color: var(--inverse-base-link-hover-color);
+
+        @if mixin-exists(hook-inverse-base-link-hover) {
+            @include hook-inverse-base-link-hover;
+        }
+    }
+
+    //
+    // Code
+    //
+
+    :not(pre) > code,
+    :not(pre) > kbd,
+    :not(pre) > samp {
+        color: var(--inverse-base-code-color);
+
+        @if mixin-exists(hook-inverse-base-code) {
+            @include hook-inverse-base-code;
+        }
+    }
+
+    //
+    // Emphasize
+    //
+
+    em {
+        color: var(--inverse-base-em-color);
+    }
+
+    //
+    // Headings
+    //
+
+    h1, .uk-h1,
+    h2, .uk-h2,
+    h3, .uk-h3,
+    h4, .uk-h4,
+    h5, .uk-h5,
+    h6, .uk-h6,
+    .uk-heading-small,
+    .uk-heading-medium,
+    .uk-heading-large,
+    .uk-heading-xlarge,
+    .uk-heading-2xlarge {
+        color: var(--inverse-base-heading-color);
+
+        @if mixin-exists(hook-inverse-base-heading) {
+            @include hook-inverse-base-heading;
+        }
+    }
+
+    h1, .uk-h1 {
+        @if mixin-exists(hook-inverse-base-h1) {
+            @include hook-inverse-base-h1;
+        }
+    }
+
+    h2, .uk-h2 {
+        @if mixin-exists(hook-inverse-base-h2) {
+            @include hook-inverse-base-h2;
+        }
+    }
+
+    h3, .uk-h3 {
+        @if mixin-exists(hook-inverse-base-h3) {
+            @include hook-inverse-base-h3;
+        }
+    }
+
+    h4, .uk-h4 {
+        @if mixin-exists(hook-inverse-base-h4) {
+            @include hook-inverse-base-h4;
+        }
+    }
+
+    h5, .uk-h5 {
+        @if mixin-exists(hook-inverse-base-h5) {
+            @include hook-inverse-base-h5;
+        }
+    }
+
+    h6, .uk-h6 {
+        @if mixin-exists(hook-inverse-base-h6) {
+            @include hook-inverse-base-h6;
+        }
+    }
+
+    //
+    // Blockquotes
+    //
+
+    blockquote {
+        @if mixin-exists(hook-inverse-base-blockquote) {
+            @include hook-inverse-base-blockquote;
+        }
+    }
+
+    blockquote footer {
+        @if mixin-exists(hook-inverse-base-blockquote-footer) {
+            @include hook-inverse-base-blockquote-footer;
+        }
+    }
+
+    //
+    // Horizontal rules
+    //
+
+    hr, .uk-hr {
+        border-top-color: var(--inverse-base-hr-border);
+
+        @if mixin-exists(hook-inverse-base-hr) {
+            @include hook-inverse-base-hr;
+        }
+    }
+
+    //
+    // Focus
+    //
+
+    :focus { outline-color: var(--inverse-base-focus-outline); }
+    :focus-visible { outline-color: var(--inverse-base-focus-outline); }
+}
+
+@mixin hook-breadcrumb() {}
+@mixin hook-breadcrumb-item() {}
+@mixin hook-breadcrumb-item-hover() {}
+@mixin hook-breadcrumb-item-disabled() {}
+@mixin hook-breadcrumb-item-active() {}
+@mixin hook-breadcrumb-divider() {}
+@mixin hook-breadcrumb-misc() {}
+@mixin hook-inverse-breadcrumb-item() {}
+@mixin hook-inverse-breadcrumb-item-hover() {}
+@mixin hook-inverse-breadcrumb-item-disabled() {}
+@mixin hook-inverse-breadcrumb-item-active() {}
+@mixin hook-inverse-breadcrumb-divider() {}
+@mixin hook-inverse-component-breadcrumb() {
+    .uk-breadcrumb > * > * {
+        color: var(--inverse-breadcrumb-item-color);
+        @if mixin-exists(hook-inverse-breadcrumb-item) {
+            @include hook-inverse-breadcrumb-item;
+        }
+    }
+
+    .uk-breadcrumb > * > :hover,
+    .uk-breadcrumb > * > :focus {
+        color: var(--inverse-breadcrumb-item-hover-color);
+        @if mixin-exists(hook-inverse-breadcrumb-item-hover) {
+            @include hook-inverse-breadcrumb-item-hover;
+        }
+    }
+
+    .uk-breadcrumb > .uk-disabled > * {
+        @if mixin-exists(hook-inverse-breadcrumb-item-disabled) {
+            @include hook-inverse-breadcrumb-item-disabled;
+        }
+    }
+
+    .uk-breadcrumb > :last-child > * {
+        color: var(--inverse-breadcrumb-item-active-color);
+        @if mixin-exists(hook-inverse-breadcrumb-item-active) {
+            @include hook-inverse-breadcrumb-item-active;
+        }
+    }
+
+    //
+    // Divider
+    //
+
+    .uk-breadcrumb > :nth-child(n+2):not(.uk-first-column)::before {
+        color: var(--inverse-breadcrumb-divider-color);
+        @if mixin-exists(hook-inverse-breadcrumb-divider) {
+            @include hook-inverse-breadcrumb-divider;
+        }
+    }
+}
+
+@mixin hook-button() {}
+@mixin hook-button-hover() {}
+@mixin hook-button-focus() {}
+@mixin hook-button-active() {}
+@mixin hook-button-default() {}
+@mixin hook-button-default-hover() {}
+@mixin hook-button-default-active() {}
+@mixin hook-button-primary() {}
+@mixin hook-button-primary-hover() {}
+@mixin hook-button-primary-active() {}
+@mixin hook-button-secondary() {}
+@mixin hook-button-secondary-hover() {}
+@mixin hook-button-secondary-active() {}
+@mixin hook-button-tertiary() {}
+@mixin hook-button-tertiary-hover() {}
+@mixin hook-button-tertiary-active() {}
+@mixin hook-button-danger() {}
+@mixin hook-button-danger-hover() {}
+@mixin hook-button-danger-active() {}
+@mixin hook-button-disabled() {}
+@mixin hook-button-xsmall() {}
+@mixin hook-button-small() {}
+@mixin hook-button-medium() {}
+@mixin hook-button-large() {}
+@mixin hook-button-xlarge() {}
+@mixin hook-button-text() {}
+@mixin hook-button-text-hover() {}
+@mixin hook-button-text-disabled() {}
+@mixin hook-button-link() {}
+@mixin hook-button-misc() {
+    .uk-button-group {
+        .uk-button-circle:not(:last-child),
+        .uk-button-round:not(:last-child) {
+            border-bottom-right-radius: 0;
+            border-top-right-radius: 0;
+        }
+
+        .uk-button-circle:not(:first-child),
+        .uk-button-round:not(:first-child) {
+            border-bottom-left-radius: 0;
+            border-top-left-radius: 0;
+        }
+    }
+}
+@mixin hook-inverse-button() {}
+@mixin hook-inverse-button-default() {}
+@mixin hook-inverse-button-default-hover() {}
+@mixin hook-inverse-button-default-active() {}
+@mixin hook-inverse-button-primary() {}
+@mixin hook-inverse-button-primary-hover() {}
+@mixin hook-inverse-button-primary-active() {}
+@mixin hook-inverse-button-secondary() {}
+@mixin hook-inverse-button-secondary-hover() {}
+@mixin hook-inverse-button-secondary-active() {}
+@mixin hook-inverse-button-tertiary() {}
+@mixin hook-inverse-button-tertiary-hover() {}
+@mixin hook-inverse-button-tertiary-active() {}
+@mixin hook-inverse-button-danger() {}
+@mixin hook-inverse-button-danger-hover() {}
+@mixin hook-inverse-button-danger-active() {}
+@mixin hook-inverse-button-text() {}
+@mixin hook-inverse-button-text-hover() {}
+@mixin hook-inverse-button-text-disabled() {}
+@mixin hook-inverse-button-link() {}
+@mixin hook-inverse-component-button() {
+    .uk-button {
+        color: var(--inverse-button-color);
+        @if mixin-exists(hook-inverse-button) {
+            @include hook-inverse-button;
+        }
+    }
+
+    //
+    // Default
+    //
+
+    .uk-button-default {
+        background-color: var(--inverse-button-default-background);
+        color: var(--inverse-button-default-color);
+        @if mixin-exists(hook-inverse-button-default) {
+            @include hook-inverse-button-default;
+        }
+    }
+
+    .uk-button-default:hover,
+    .uk-button-default:focus {
+        background-color: var(--inverse-button-default-hover-background);
+        color: var(--inverse-button-default-hover-color);
+        @if mixin-exists(hook-inverse-button-default-hover) {
+            @include hook-inverse-button-default-hover;
+        }
+    }
+
+    .uk-button-default:active,
+    .uk-button-default.uk-active {
+        background-color: var(--inverse-button-default-active-background);
+        color: var(--inverse-button-default-active-color);
+        @if mixin-exists(hook-inverse-button-default-active) {
+            @include hook-inverse-button-default-active;
+        }
+    }
+
+    //
+    // Primary
+    //
+
+    .uk-button-primary {
+        background-color: var(--inverse-button-primary-background);
+        color: var(--inverse-button-primary-color);
+        @if mixin-exists(hook-inverse-button-primary) {
+            @include hook-inverse-button-primary;
+        }
+    }
+
+    .uk-button-primary:hover,
+    .uk-button-primary:focus {
+        background-color: var(--inverse-button-primary-hover-background);
+        color: var(--inverse-button-primary-hover-color);
+        @if mixin-exists(hook-inverse-button-primary-hover) {
+            @include hook-inverse-button-primary-hover;
+        }
+    }
+
+    .uk-button-primary:active,
+    .uk-button-primary.uk-active {
+        background-color: var(--inverse-button-primary-active-background);
+        color: var(--inverse-button-primary-active-color);
+        @if mixin-exists(hook-inverse-button-primary-active) {
+            @include hook-inverse-button-primary-active;
+        }
+    }
+
+    //
+    // Secondary
+    //
+
+    .uk-button-secondary {
+        background-color: var(--inverse-button-secondary-background);
+        color: var(--inverse-button-secondary-color);
+        @if mixin-exists(hook-inverse-button-secondary) {
+            @include hook-inverse-button-secondary;
+        }
+    }
+
+    .uk-button-secondary:hover,
+    .uk-button-secondary:focus {
+        background-color: var(--inverse-button-secondary-hover-background);
+        color: var(--inverse-button-secondary-hover-color);
+        @if mixin-exists(hook-inverse-button-secondary-hover) {
+            @include hook-inverse-button-secondary-hover;
+        }
+    }
+
+    .uk-button-secondary:active,
+    .uk-button-secondary.uk-active {
+        background-color: var(--inverse-button-secondary-active-background);
+        color: var(--inverse-button-secondary-active-color);
+        @if mixin-exists(hook-inverse-button-secondary-active) {
+            @include hook-inverse-button-secondary-active;
+        }
+    }
+
+    //
+    // Tertiary
+    //
+
+    .uk-button-tertiary {
+        background-color: var(--inverse-button-tertiary-background);
+        color: var(--inverse-button-tertiary-color);
+        @if mixin-exists(hook-inverse-button-tertiary) {
+            @include hook-inverse-button-tertiary;
+        }
+    }
+
+    .uk-button-tertiary:hover,
+    .uk-button-tertiary:focus {
+        background-color: var(--inverse-button-tertiary-hover-background);
+        color: var(--inverse-button-tertiary-hover-color);
+        @if mixin-exists(hook-inverse-button-tertiary-hover) {
+            @include hook-inverse-button-tertiary-hover;
+        }
+    }
+
+    .uk-button-tertiary:active,
+    .uk-button-tertiary.uk-active {
+        background-color: var(--inverse-button-tertiary-active-background);
+        color: var(--inverse-button-tertiary-active-color);
+        @if mixin-exists(hook-inverse-button-tertiary-active) {
+            @include hook-inverse-button-tertiary-active;
+        }
+    }
+
+    //
+    // Danger
+    //
+
+    .uk-button-danger {
+        background-color: var(--inverse-button-danger-background);
+        color: var(--inverse-button-danger-color);
+        @if mixin-exists(hook-inverse-button-danger) {
+            @include hook-inverse-button-danger;
+        }
+    }
+
+    .uk-button-danger:hover,
+    .uk-button-danger:focus {
+        background-color: var(--inverse-button-danger-hover-background);
+        color: var(--inverse-button-danger-hover-color);
+        @if mixin-exists(hook-inverse-button-danger-hover) {
+            @include hook-inverse-button-danger-hover;
+        }
+    }
+
+    .uk-button-danger:active,
+    .uk-button-danger.uk-active {
+        background-color: var(--inverse-button-danger-active-background);
+        color: var(--inverse-button-danger-active-color);
+        @if mixin-exists(hook-inverse-button-danger-active) {
+            @include hook-inverse-button-danger-active;
+        }
+    }
+
+    //
+    // Text
+    //
+
+    .uk-button-text {
+        color: var(--inverse-button-text-color);
+        @if mixin-exists(hook-inverse-button-text) {
+            @include hook-inverse-button-text;
+        }
+    }
+
+    .uk-button-text:hover,
+    .uk-button-text:focus {
+        color: var(--inverse-button-text-hover-color);
+        @if mixin-exists(hook-inverse-button-text-hover) {
+            @include hook-inverse-button-text-hover;
+        }
+    }
+
+    .uk-button-text:disabled {
+        color: var(--inverse-button-text-disabled-color);
+        @if mixin-exists(hook-inverse-button-text-disabled) {
+            @include hook-inverse-button-text-disabled;
+        }
+    }
+
+    //
+    // Link
+    //
+
+    .uk-button-link {
+        color: var(--inverse-button-link-color);
+        @if mixin-exists(hook-inverse-button-link) {
+            @include hook-inverse-button-link;
+        }
+    }
+
+    .uk-button-link:hover,
+    .uk-button-link:focus {
+        color: var(--inverse-button-link-hover-color);
+    }
+}
+
+@mixin hook-card() {}
+@mixin hook-card-body() {}
+@mixin hook-card-header() {}
+@mixin hook-card-footer() {}
+@mixin hook-card-media() {}
+@mixin hook-card-media-top() {}
+@mixin hook-card-media-bottom() {}
+@mixin hook-card-media-left() {}
+@mixin hook-card-media-right() {}
+@mixin hook-card-title() {}
+@mixin hook-card-badge() {}
+@mixin hook-card-hover() {}
+@mixin hook-card-default() {}
+@mixin hook-card-default-title() {}
+@mixin hook-card-default-hover() {}
+@mixin hook-card-default-header() {}
+@mixin hook-card-default-footer() {}
+@mixin hook-card-primary() {}
+@mixin hook-card-primary-title() {}
+@mixin hook-card-primary-hover() {}
+@mixin hook-card-secondary() {}
+@mixin hook-card-secondary-title() {}
+@mixin hook-card-secondary-hover() {}
+@mixin hook-card-tertiary() {}
+@mixin hook-card-tertiary-title() {}
+@mixin hook-card-tertiary-hover() {}
+@mixin hook-card-misc() {}
+@mixin hook-inverse-card-badge() {}
+@mixin hook-inverse-component-card() {
+    &.uk-card-badge {
+        background-color: var(--inverse-card-badge-background);
+        color: var(--inverse-card-badge-color);
+        @if mixin-exists(hook-inverse-card-badge) {
+            @include hook-inverse-card-badge;
+        }
+    }
+}
+
+@mixin hook-close() {}
+@mixin hook-close-hover() {}
+@mixin hook-close-misc() {}
+@mixin hook-inverse-close() {}
+@mixin hook-inverse-close-hover() {}
+@mixin hook-inverse-component-close() {
+    .uk-close {
+        color: var(--inverse-close-color);
+        @if mixin-exists(hook-inverse-close) {
+            @include hook-inverse-close;
+        }
+    }
+
+    .uk-close:hover,
+    .uk-close:focus {
+        color: var(--inverse-close-hover-color);
+        @if mixin-exists(hook-inverse-close-hover) {
+            @include hook-inverse-close-hover;
+        }
+    }
+}
+
+@mixin hook-column-misc() {}
+@mixin hook-inverse-component-column() {
+    .uk-column-divider {
+        column-rule-color: var(--inverse-column-divider-rule-color);
+    }
+}
+
+@mixin hook-comment() {}
+@mixin hook-comment-body() {}
+@mixin hook-comment-header() {}
+@mixin hook-comment-title() {}
+@mixin hook-comment-meta() {}
+@mixin hook-comment-avatar() {}
+@mixin hook-comment-list-adjacent() {}
+@mixin hook-comment-list-sub() {}
+@mixin hook-comment-list-sub-adjacent() {}
+@mixin hook-comment-primary() {}
+@mixin hook-comment-misc() {}
+
+@mixin hook-container-misc() {}
+
+@mixin hook-cover-misc() {}
+
+@mixin hook-description-list-term() {}
+@mixin hook-description-list-description() {}
+@mixin hook-description-list-divider-term() {}
+@mixin hook-description-list-misc() {}
+@mixin hook-inverse-description-list-term() {}
+@mixin hook-inverse-component-description() {
+    .uk-description-list > dt {
+        color: var(--inverse-description-list-term-color);
+        @if mixin-exists(hook-inverse-description-list-term) {
+            @include hook-inverse-description-list-term;
+        }
+    }
+}
+
+@mixin hook-divider-icon() {}
+@mixin hook-divider-icon-line() {}
+@mixin hook-divider-icon-line-left() {}
+@mixin hook-divider-icon-line-right() {}
+@mixin hook-divider-small() {}
+@mixin hook-divider-vertical() {}
+@mixin hook-divider-misc() {}
+@mixin hook-inverse-divider-icon() {}
+@mixin hook-inverse-divider-icon-line() {}
+@mixin hook-inverse-divider-small() {}
+@mixin hook-inverse-divider-vertical() {}
+@mixin hook-inverse-component-divider() {
+    .uk-divider-icon {
+        @if mixin-exists(svg-fill) {
+            @include svg-fill($divider-icon-image-path, '#000', $inverse-divider-icon-color);
+        }
+        @if mixin-exists(hook-inverse-divider-icon) {
+            @include hook-inverse-divider-icon;
+        }
+    }
+
+    .uk-divider-icon::before,
+    .uk-divider-icon::after {
+        border-bottom-color: var(--inverse-divider-icon-line-border);
+        @if mixin-exists(hook-inverse-divider-icon-line) {
+            @include hook-inverse-divider-icon-line;
+        }
+    }
+
+    .uk-divider-small::after {
+        border-top-color: var(--inverse-divider-small-border);
+        @if mixin-exists(hook-inverse-divider-small) {
+            @include hook-inverse-divider-small;
+        }
+    }
+
+    .uk-divider-vertical {
+        border-left-color: var(--inverse-divider-vertical-border);
+        @if mixin-exists(hook-inverse-divider-vertical) {
+            @include hook-inverse-divider-vertical;
+        }
+    }
+}
+
+@mixin hook-dotnav() {}
+@mixin hook-dotnav-item() {}
+@mixin hook-dotnav-item-hover() {}
+@mixin hook-dotnav-item-onclick() {}
+@mixin hook-dotnav-item-active() {}
+@mixin hook-dotnav-misc() {}
+@mixin hook-inverse-dotnav-item() {}
+@mixin hook-inverse-dotnav-item-hover() {}
+@mixin hook-inverse-dotnav-item-onclick() {}
+@mixin hook-inverse-dotnav-item-active() {}
+@mixin hook-inverse-component-dotnav() {
+    .uk-dotnav > * > * {
+        background-color: var(--inverse-dotnav-item-background);
+        @if mixin-exists(hook-inverse-dotnav-item) {
+            @include hook-inverse-dotnav-item;
+        }
+    }
+
+    .uk-dotnav > * > :hover,
+    .uk-dotnav > * > :focus {
+        background-color: var(--inverse-dotnav-item-hover-background);
+        @if mixin-exists(hook-inverse-dotnav-item-hover) {
+            @include hook-inverse-dotnav-item-hover;
+        }
+    }
+
+    .uk-dotnav > * > :active {
+        background-color: var(--inverse-dotnav-item-onclick-background);
+        @if mixin-exists(hook-inverse-dotnav-item-onclick) {
+            @include hook-inverse-dotnav-item-onclick;
+        }
+    }
+
+    .uk-dotnav > .uk-active > * {
+        background-color: var(--inverse-dotnav-item-active-background);
+        @if mixin-exists(hook-inverse-dotnav-item-active) {
+            @include hook-inverse-dotnav-item-active;
+        }
+    }
+}
+
+@mixin hook-drawer() {}
+@mixin hook-drawer-content-wrapper() {}
+@mixin hook-drawer-content() {}
+@mixin hook-drawer-body-wrapper() {}
+@mixin hook-drawer-body() {}
+@mixin hook-drawer-mask() {}
+@mixin hook-drawer-mask-open() {}
+
+@mixin hook-drop-misc() {}
+
+@mixin hook-dropdown() {}
+@mixin hook-dropdown-nav() {}
+@mixin hook-dropdown-nav-item() {}
+@mixin hook-dropdown-nav-item-hover() {}
+@mixin hook-dropdown-nav-header() {}
+@mixin hook-dropdown-nav-divider() {}
+@mixin hook-dropdown-misc() {}
+@mixin hook-inverse-dropdown() {}
+@mixin hook-inverse-dropdown-nav-item() {}
+@mixin hook-inverse-dropdown-nav-item-hover() {}
+@mixin hook-inverse-dropdown-nav-header() {}
+@mixin hook-inverse-dropdown-nav-divider() {}
+@mixin hook-inverse-component-dropdown() {
+    .uk-dropdown {
+        background: var(--inverse-dropdown-background);
+        color: var(--inverse-dropdown-color);
+        @if mixin-exists(hook-inverse-dropdown) {
+            @include hook-inverse-dropdown;
+        }
+    }
+
+    .uk-dropdown-nav > li > a {
+        color: var(--inverse-dropdown-nav-item-color);
+        @if mixin-exists(hook-inverse-dropdown-nav-item) {
+            @include hook-inverse-dropdown-nav-item;
+        }
+    }
+
+    .uk-dropdown-nav > li > a:hover,
+    .uk-dropdown-nav > li > a:focus,
+    .uk-dropdown-nav > li.uk-active > a {
+        color: var(--inverse-dropdown-nav-item-hover-color);
+        @if mixin-exists(hook-inverse-dropdown-nav-item-hover) {
+            @include hook-inverse-dropdown-nav-item-hover;
+        }
+    }
+
+    .uk-dropdown-nav .uk-nav-header {
+        color: var(--inverse-dropdown-nav-header-color);
+        @if mixin-exists(hook-inverse-dropdown-nav-header) {
+            @include hook-inverse-dropdown-nav-header;
+        }
+    }
+
+    .uk-dropdown-nav .uk-nav-divider {
+        border-color: var(--inverse-dropdown-nav-divider-border);
+        @if mixin-exists(hook-inverse-dropdown-nav-divider) {
+            @include hook-inverse-dropdown-nav-divider;
+        }
+    }
+
+    .uk-dropdown-nav .uk-nav-sub a {
+        color: var(--inverse-dropdown-nav-sublist-item-color);
+    }
+
+    .uk-dropdown-nav .uk-nav-sub a:hover,
+    .uk-dropdown-nav .uk-nav-sub a:focus,
+    .uk-dropdown-nav .uk-nav-sub li.uk-active > a {
+        color: var(--inverse-dropdown-nav-sublist-item-hover-color);
+    }
+}
+
+@mixin hook-flex-misc() {}
+
+@mixin hook-form() {}
+@mixin hook-form-single-line() {}
+@mixin hook-form-multi-line() {}
+@mixin hook-form-focus() {}
+@mixin hook-form-disabled() {}
+@mixin hook-form-danger() {}
+@mixin hook-form-warning() {}
+@mixin hook-form-success() {}
+@mixin hook-form-blank() {}
+@mixin hook-form-blank-focus() {}
+@mixin hook-form-legend() {}
+@mixin hook-form-label() {}
+@mixin hook-form-stacked-label() {}
+@mixin hook-form-horizontal-label() {}
+@mixin hook-form-misc() {}
+@mixin hook-inverse-form() {}
+@mixin hook-inverse-form-focus() {}
+@mixin hook-inverse-form-label() {}
+@mixin hook-inverse-component-form() {
+    .uk-input,
+    .uk-textarea {
+        background-clip: padding-box;
+        background-color: var(--inverse-form-background);
+        color: var(--inverse-form-color);
+        @if mixin-exists(hook-inverse-form) {
+            @include hook-inverse-form;
+        }
+
+        &:focus {
+            background-color: var(--inverse-form-focus-background);
+            color: var(--inverse-form-focus-color);
+            @if mixin-exists(hook-inverse-form-focus) {
+                @include hook-inverse-form-focus;
+            }
+        }
+    }
+
+    //
+    // Placeholder
+    //
+
+    .uk-input::-ms-input-placeholder {
+        color: var(--inverse-form-placeholder-color) !important;
+    }
+
+    .uk-input::placeholder {
+        color: var(--inverse-form-placeholder-color);
+    }
+
+    .uk-textarea::-ms-input-placeholder {
+        color: var(--inverse-form-placeholder-color) !important;
+    }
+
+    .uk-textarea::placeholder {
+        color: var(--inverse-form-placeholder-color);
+    }
+
+    //
+    // Datalist
+    //
+
+    .uk-input[list]:hover,
+    .uk-input[list]:focus {
+        @if mixin-exists(svg-fill) {
+            @include svg-fill($form-icon-datalist-image-path, '#000', $inverse-form-datalist-icon-color);
+        }
+    }
+
+    // Label
+    .uk-form-label {
+        @if mixin-exists(hook-inverse-form-label) {
+            @include hook-inverse-form-label;
+        }
+    }
+
+    // Icon
+    .uk-form-icon {
+        color: var(--inverse-form-icon-color);
+    }
+
+    .uk-form-icon:hover {
+        color: var(--inverse-form-icon-hover-color);
+    }
+}
+
+@mixin hook-control() {}
+@mixin hook-control-hover() {}
+@mixin hook-control-focus() {}
+@mixin hook-control-disabled() {}
+@mixin hook-control-small() {}
+@mixin hook-control-medium() {}
+@mixin hook-control-large() {}
+@mixin hook-control-success() {}
+@mixin hook-control-warning() {}
+@mixin hook-control-danger() {}
+@mixin hook-control-blank() {}
+@mixin hook-control-blank-focus() {}
+@mixin hook-control-input() {}
+@mixin hook-control-prefix() {}
+@mixin hook-inverse-control() {}
+@mixin hook-inverse-control-hover() {}
+@mixin hook-inverse-control-focus() {}
+@mixin hook-inverse-control-disabled() {}
+@mixin hook-inverse-control-success() {}
+@mixin hook-inverse-control-warning() {}
+@mixin hook-inverse-control-danger() {}
+@mixin hook-inverse-control-blank-focus() {}
+@mixin hook-inverse-component-control() {
+    .uk-control {
+        background-color: var(--inverse-control-background);
+        border-color: var(--inverse-control-border);
+        color: var(--inverse-control-color);
+        @if mixin-exists(hook-inverse-control) {
+            @include hook-inverse-control;
+        }
+    }
+
+    // Hover state (unused for disabled state)
+    .uk-control:hover {
+        background-color: var(--inverse-control-hover-background);
+        border-color: var(--inverse-control-hover-border);
+        color: var(--inverse-control-hover-color);
+        @if mixin-exists(hook-inverse-control-hover) {
+            @include hook-inverse-control-hover;
+        }
+    }
+
+    // Focus state (unused for disabled state)
+    .uk-control:focus-within {
+        background-color: var(--inverse-control-focus-background);
+        border-color: var(--inverse-control-focus-border);
+        color: var(--inverse-control-focus-color);
+        @if mixin-exists(hook-inverse-control-focus) {
+            @include hook-inverse-control-focus;
+        }
+    }
+
+    // Disabled state
+    .uk-control.uk-disabled {
+        background-color: var(--inverse-ontrol-disabled-background);
+        border-color: var(--inverse-control-disabled-border);
+        color: var(--inverse-control-disabled-color);
+        @if mixin-exists(hook-inverse-control-disabled) {
+            @include hook-inverse-control-disabled;
+        }
+    }
+
+    // Success
+    .uk-control-success,
+    .uk-control-success:hover,
+    .uk-control-success:focus-within {
+        border-color: var(--control-success-border);
+        color: var(--control-success-color);
+        @if mixin-exists(hook-inverse-control-success) {
+            @include hook-inverse-control-success;
+        }
+    }
+
+    // Warning
+    .uk-control-warning,
+    .uk-control-warning:hover,
+    .uk-control-warning:focus-within {
+        border-color: var(--control-warning-border);
+        color: var(--control-warning-color);
+        @if mixin-exists(hook-inverse-control-warning) {
+            @include hook-inverse-control-warning;
+        }
+    }
+
+    // Danger
+    .uk-control-danger,
+    .uk-control-danger:hover,
+    .uk-control-danger:focus-within {
+        border-color: var(--control-danger-border);
+        color: var(--control-danger-color);
+        @if mixin-exists(hook-inverse-control-danger) {
+            @include hook-inverse-control-danger;
+        }
+    }
+
+    // Blank
+    .uk-control-blank:focus-within {
+        border-color: var(--control-blank-focus-border);
+        @if mixin-exists(hook-inverse-control-blank-focus) {
+            @include hook-inverse-control-blank-focus;
+        }
+    }
+}
+
+@mixin hook-checkbox-wrapper() {}
+@mixin hook-checkbox-checkbox() {}
+@mixin hook-checkbox-input() {}
+@mixin hook-checkbox-inner() {}
+@mixin hook-checkbox-label() {}
+@mixin hook-checkbox-hover() {}
+@mixin hook-checkbox-checked() {}
+@mixin hook-checkbox-disabled() {}
+@mixin hook-checkbox-indeterminate() {}
+@mixin hook-checkbox-group() {}
+@mixin hook-checkbox-group-stack() {}
+@mixin hook-checkbox-control() {}
+
+@mixin hook-radio-wrapper() {}
+@mixin hook-radio-radio() {}
+@mixin hook-radio-input() {}
+@mixin hook-radio-inner() {}
+@mixin hook-radio-label() {}
+@mixin hook-radio-hover() {}
+@mixin hook-radio-checked() {}
+@mixin hook-radio-disabled() {}
+@mixin hook-radio-indeterminate() {}
+@mixin hook-radio-group() {}
+@mixin hook-radio-group-stack() {}
+@mixin hook-radio-control() {}
+
+@mixin hook-select() {}
+@mixin hook-select-selector() {}
+@mixin hook-select-selection-search-input() {}
+@mixin hook-select-selection-placeholder() {}
+@mixin hook-select-single-selector() {}
+@mixin hook-select-single-selection-search() {}
+@mixin hook-select-single-selection-search-input() {}
+@mixin hook-select-single-selection-item() {}
+@mixin hook-select-single-open-selection-item() {}
+@mixin hook-select-multiple-selector() {}
+@mixin hook-select-multiple-selection-placeholder() {}
+@mixin hook-select-multiple-selection-item() {}
+@mixin hook-select-multiple-selection-item-remove() {}
+@mixin hook-select-multiple-selection-search() {}
+@mixin hook-select-multiple-selection-search-input() {}
+@mixin hook-select-arrow() {}
+@mixin hook-select-clear() {}
+@mixin hook-select-dropdown() {}
+
+@mixin hook-grid-divider-horizontal() {}
+@mixin hook-grid-divider-vertical() {}
+@mixin hook-grid-misc() {}
+@mixin hook-inverse-grid-divider-horizontal() {}
+@mixin hook-inverse-grid-divider-vertical() {}
+@mixin hook-inverse-component-grid() {
+    .uk-grid-divider > :not(.uk-first-column)::before {
+        border-left-color: var(--inverse-grid-divider-border);
+        @if mixin-exists(hook-inverse-grid-divider-horizontal) {
+            @include hook-inverse-grid-divider-horizontal;
+        }
+    }
+
+    .uk-grid-divider.uk-grid-stack > .uk-grid-margin::before {
+        border-top-color: var(--inverse-grid-divider-border);
+        @if mixin-exists(hook-inverse-grid-divider-vertical) {
+            @include hook-inverse-grid-divider-vertical;
+        }
+    }
+}
+
+@mixin hook-heading-small() {}
+@mixin hook-heading-medium() {}
+@mixin hook-heading-large() {}
+@mixin hook-heading-xlarge() {}
+@mixin hook-heading-2xlarge() {}
+@mixin hook-heading-primary() {}
+@mixin hook-heading-hero() {}
+@mixin hook-heading-divider() {}
+@mixin hook-heading-bullet() {}
+@mixin hook-heading-line() {}
+@mixin hook-heading-misc() {}
+@mixin hook-inverse-heading-small() {}
+@mixin hook-inverse-heading-medium() {}
+@mixin hook-inverse-heading-large() {}
+@mixin hook-inverse-heading-xlarge() {}
+@mixin hook-inverse-heading-2xlarge() {}
+@mixin hook-inverse-heading-primary() {}
+@mixin hook-inverse-heading-hero() {}
+@mixin hook-inverse-heading-divider() {}
+@mixin hook-inverse-heading-bullet() {}
+@mixin hook-inverse-heading-line() {}
+@mixin hook-inverse-component-heading() {
+    .uk-heading-small {
+        @if mixin-exists(hook-inverse-heading-small) {
+            @include hook-inverse-heading-small;
+        }
+    }
+
+    .uk-heading-medium {
+        @if mixin-exists(hook-inverse-heading-medium) {
+            @include hook-inverse-heading-medium;
+        }
+    }
+
+    .uk-heading-large {
+        @if mixin-exists(hook-inverse-heading-large) {
+            @include hook-inverse-heading-large;
+        }
+    }
+
+    .uk-heading-xlarge {
+        @if mixin-exists(hook-inverse-heading-xlarge) {
+            @include hook-inverse-heading-xlarge;
+        }
+    }
+
+    .uk-heading-2xlarge {
+        @if mixin-exists(hook-inverse-heading-2xlarge) {
+            @include hook-inverse-heading-2xlarge;
+        }
+    }
+
+    .uk-heading-divider {
+        border-bottom-color: var(--inverse-heading-divider-border);
+        @if mixin-exists(hook-inverse-heading-divider) {
+            @include hook-inverse-heading-divider;
+        }
+    }
+
+    .uk-heading-bullet::before {
+        border-left-color: var(--inverse-heading-bullet-border);
+        @if mixin-exists(hook-inverse-heading-bullet) {
+            @include hook-inverse-heading-bullet;
+        }
+    }
+
+    .uk-heading-line > ::before,
+    .uk-heading-line > ::after {
+        border-bottom-color: var(--inverse-heading-line-border);
+        @if mixin-exists(hook-inverse-heading-line) {
+            @include hook-inverse-heading-line;
+        }
+    }
+}
+
+@mixin hook-height-misc() {}
+
+@mixin hook-icon-link() {}
+@mixin hook-icon-link-hover() {}
+@mixin hook-icon-link-active() {}
+@mixin hook-icon-button() {}
+@mixin hook-icon-button-hover() {}
+@mixin hook-icon-button-active() {}
+@mixin hook-icon-misc() {}
+@mixin hook-inverse-icon-link() {}
+@mixin hook-inverse-icon-link-hover() {}
+@mixin hook-inverse-icon-link-active() {}
+@mixin hook-inverse-icon-button() {}
+@mixin hook-inverse-icon-button-hover() {}
+@mixin hook-inverse-icon-button-active() {}
+@mixin hook-inverse-component-icon() {
+    //
+    // Link
+    //
+
+    .uk-icon-link {
+        color: var(--inverse-icon-link-color);
+        @if mixin-exists(hook-inverse-icon-link) {
+            @include hook-inverse-icon-link;
+        }
+    }
+
+    .uk-icon-link:hover,
+    .uk-icon-link:focus {
+        color: var(--inverse-icon-link-hover-color);
+        @if mixin-exists(hook-inverse-icon-link-hover) {
+            @include hook-inverse-icon-link-hover;
+        }
+    }
+
+    .uk-icon-link:active,
+    .uk-active > .uk-icon-link {
+        color: var(--inverse-icon-link-active-color);
+        @if mixin-exists(hook-inverse-icon-link-active) {
+            @include hook-inverse-icon-link-active;
+        }
+    }
+
+    //
+    // Button
+    //
+
+    .uk-icon-button {
+        background-color: var(--inverse-icon-button-background);
+        color: var(--inverse-icon-button-color);
+        @if mixin-exists(hook-inverse-icon-button) {
+            @include hook-inverse-icon-button;
+        }
+    }
+
+    .uk-icon-button:hover,
+    .uk-icon-button:focus {
+        background-color: var(--inverse-icon-button-hover-background);
+        color: var(--inverse-icon-button-hover-color);
+        @if mixin-exists(hook-inverse-icon-button-hover) {
+            @include hook-inverse-icon-button-hover;
+        }
+    }
+
+    .uk-icon-button:active {
+        background-color: var(--inverse-icon-button-active-background);
+        color: var(--inverse-icon-button-active-color);
+        @if mixin-exists(hook-inverse-icon-button-active) {
+            @include hook-inverse-icon-button-active;
+        }
+    }
+}
+
+@mixin hook-iconnav() {}
+@mixin hook-iconnav-item() {}
+@mixin hook-iconnav-item-hover() {}
+@mixin hook-iconnav-item-active() {}
+@mixin hook-iconnav-misc() {}
+@mixin hook-inverse-iconnav-item() {}
+@mixin hook-inverse-iconnav-item-hover() {}
+@mixin hook-inverse-iconnav-item-active() {}
+@mixin hook-inverse-component-iconnav() {
+    .uk-iconnav > * > a {
+        color: var(--inverse-iconnav-item-color);
+        @if mixin-exists(hook-inverse-iconnav-item) {
+            @include hook-inverse-iconnav-item;
+        }
+    }
+
+    .uk-iconnav > * > a:hover,
+    .uk-iconnav > * > a:focus {
+        color: var(--inverse-iconnav-item-hover-color);
+        @if mixin-exists(hook-inverse-iconnav-item-hover) {
+            @include hook-inverse-iconnav-item-hover;
+        }
+    }
+
+    .uk-iconnav > .uk-active > a {
+        color: var(--inverse-iconnav-item-active-color);
+        @if mixin-exists(hook-inverse-iconnav-item-active) {
+            @include hook-inverse-iconnav-item-active;
+        }
+    }
+}
+
+@mixin hook-label() {}
+@mixin hook-label-success() {}
+@mixin hook-label-warning() {}
+@mixin hook-label-danger() {}
+@mixin hook-label-misc() {}
+@mixin hook-inverse-label() {}
+@mixin hook-inverse-component-label() {
+    .uk-label {
+        background-color: var(--inverse-label-background);
+        color: var(--inverse-label-color);
+        @if mixin-exists(hook-inverse-label) {
+            @include hook-inverse-label;
+        }
+    }
+}
+
+@mixin hook-leader() {}
+@mixin hook-leader-misc() {}
+@mixin hook-inverse-leader() {}
+@mixin hook-inverse-component-leader() {}
+
+@mixin hook-link-muted() {}
+@mixin hook-link-muted-hover() {}
+@mixin hook-link-text() {}
+@mixin hook-link-text-hover() {}
+@mixin hook-link-heading() {}
+@mixin hook-link-heading-hover() {}
+@mixin hook-link-reset() {}
+@mixin hook-link-misc() {}
+@mixin hook-inverse-link-muted() {}
+@mixin hook-inverse-link-muted-hover() {}
+@mixin hook-inverse-link-text-hover() {}
+@mixin hook-inverse-link-heading-hover() {}
+@mixin hook-inverse-component-link() {
+    a.uk-link-muted,
+    .uk-link-muted a {
+        color: var(--inverse-link-muted-color);
+        @if mixin-exists(hook-inverse-link-muted) {
+            @include hook-inverse-link-muted;
+        }
+    }
+
+    a.uk-link-muted:hover,
+    .uk-link-muted a:hover,
+    .uk-link-toggle:hover .uk-link-muted,
+    .uk-link-toggle:focus .uk-link-muted {
+        color: var(--inverse-link-muted-hover-color);
+        @if mixin-exists(hook-inverse-link-muted-hover) {
+            @include hook-inverse-link-muted-hover;
+        }
+    }
+
+    a.uk-link-text:hover,
+    .uk-link-text a:hover,
+    .uk-link-toggle:hover .uk-link-text,
+    .uk-link-toggle:focus .uk-link-text {
+        color: var(--inverse-link-text-hover-color);
+        @if mixin-exists(hook-inverse-link-text-hover) {
+            @include hook-inverse-link-text-hover;
+        }
+    }
+
+    a.uk-link-heading:hover,
+    .uk-link-heading a:hover,
+    .uk-link-toggle:hover .uk-link-heading,
+    .uk-link-toggle:focus .uk-link-heading {
+        color: var(--inverse-link-heading-hover-color);
+        @if mixin-exists(hook-inverse-link-heading-hover) {
+            @include hook-inverse-link-heading-hover;
+        }
+    }
+}
+
+@mixin hook-list-divider() {}
+@mixin hook-list-striped() {}
+@mixin hook-list-misc() {}
+@mixin hook-inverse-list-divider() {}
+@mixin hook-inverse-list-striped() {}
+@mixin hook-inverse-component-list() {
+    .uk-list-muted > ::before {
+        color: var(--inverse-list-muted-color) !important;
+    }
+
+    .uk-list-emphasis > ::before {
+        color: var(--inverse-list-emphasis-color) !important;
+    }
+
+    .uk-list-primary > ::before {
+        color: var(--inverse-list-primary-color) !important;
+    }
+
+    .uk-list-secondary > ::before {
+        color: var(--inverse-list-secondary-color) !important;
+    }
+
+    .uk-list-bullet > ::before {
+        @if mixin-exists(svg-fill) {
+            @include svg-fill($list-bullet-icon-image-path, '#000', $inverse-list-bullet-icon-color);;
+        }
+    }
+
+    .uk-list-divider > :nth-child(n+2) {
+        border-top-color: var(--inverse-list-divider-border);
+        @if mixin-exists(hook-inverse-list-divider) {
+            @include hook-inverse-list-divider;
+        }
+    }
+
+    .uk-list-striped > * {
+        @if mixin-exists(hook-inverse-list-striped) {
+            @include hook-inverse-list-striped;
+        }
+    }
+
+    .uk-list-striped > :nth-of-type(odd) {
+        background-color: var(--inverse-list-striped-background);
+    }
+}
+
+@mixin hook-nav-sub() {}
+@mixin hook-nav-header() {}
+@mixin hook-nav-divider() {}
+@mixin hook-nav-default() {}
+@mixin hook-nav-default-item() {}
+@mixin hook-nav-default-item-hover() {}
+@mixin hook-nav-default-item-active() {}
+@mixin hook-nav-default-header() {}
+@mixin hook-nav-default-divider() {}
+@mixin hook-nav-primary() {}
+@mixin hook-nav-primary-item() {}
+@mixin hook-nav-primary-item-hover() {}
+@mixin hook-nav-primary-item-active() {}
+@mixin hook-nav-primary-header() {}
+@mixin hook-nav-primary-divider() {}
+@mixin hook-nav-dividers() {}
+@mixin hook-nav-misc() {}
+@mixin hook-inverse-nav-parent-icon() {}
+@mixin hook-inverse-nav-default-item() {}
+@mixin hook-inverse-nav-default-item-hover() {}
+@mixin hook-inverse-nav-default-item-active() {}
+@mixin hook-inverse-nav-default-header() {}
+@mixin hook-inverse-nav-default-divider() {}
+@mixin hook-inverse-nav-primary-item() {}
+@mixin hook-inverse-nav-primary-item-hover() {}
+@mixin hook-inverse-nav-primary-item-active() {}
+@mixin hook-inverse-nav-primary-header() {}
+@mixin hook-inverse-nav-primary-divider() {}
+@mixin hook-inverse-component-nav() {
+    //
+    // Default
+    //
+
+    .uk-nav-default > li > a {
+        color: var(--inverse-nav-default-item-color);
+        @if mixin-exists(hook-inverse-nav-default-item) {
+            @include hook-inverse-nav-default-item;
+        }
+    }
+
+    .uk-nav-default > li > a:hover,
+    .uk-nav-default > li > a:focus {
+        color: var(--inverse-nav-default-item-hover-color);
+        @if mixin-exists(hook-inverse-nav-default-item-hover) {
+            @include hook-inverse-nav-default-item-hover;
+        }
+    }
+
+    .uk-nav-default > li.uk-active > a {
+        color: var(--inverse-nav-default-item-active-color);
+        @if mixin-exists(hook-inverse-nav-default-item-active) {
+            @include hook-inverse-nav-default-item-active;
+        }
+    }
+
+    .uk-nav-default .uk-nav-header {
+        color: var(--inverse-nav-default-header-color);
+        @if mixin-exists(hook-inverse-nav-default-header) {
+            @include hook-inverse-nav-default-header;
+        }
+    }
+
+    .uk-nav-default .uk-nav-divider {
+        border-top-color: var(--inverse-nav-default-divider-border);
+        @if mixin-exists(hook-inverse-nav-default-divider) {
+            @include hook-inverse-nav-default-divider;
+        }
+    }
+
+    .uk-nav-default .uk-nav-sub a {
+        color: var(--inverse-nav-default-sublist-item-color);
+    }
+
+    .uk-nav-default .uk-nav-sub a:hover,
+    .uk-nav-default .uk-nav-sub a:focus {
+        color: var(--inverse-nav-default-sublist-item-hover-color);
+    }
+
+    .uk-nav-default .uk-nav-sub li.uk-active > a {
+        color: var(--inverse-nav-default-sublist-item-active-color);
+    }
+
+    //
+    // Primary
+    //
+
+    .uk-nav-primary > li > a {
+        color: var(--inverse-nav-primary-item-color);
+        @if mixin-exists(hook-inverse-nav-primary-item) {
+            @include hook-inverse-nav-primary-item;
+        }
+    }
+
+    .uk-nav-primary > li > a:hover,
+    .uk-nav-primary > li > a:focus {
+        color: var(--inverse-nav-primary-item-hover-color);
+        @if mixin-exists(hook-inverse-nav-primary-item-hover) {
+            @include hook-inverse-nav-primary-item-hover;
+        }
+    }
+
+    .uk-nav-primary > li.uk-active > a {
+        color: var(--inverse-nav-primary-item-active-color);
+        @if mixin-exists(hook-inverse-nav-primary-item-active) {
+            @include hook-inverse-nav-primary-item-active;
+        }
+    }
+
+    .uk-nav-primary .uk-nav-header {
+        color: var(--inverse-nav-primary-header-color);
+        @if mixin-exists(hook-inverse-nav-primary-header) {
+            @include hook-inverse-nav-primary-header;
+        }
+    }
+
+    .uk-nav-primary .uk-nav-divider {
+        border-top-color: var(--inverse-nav-primary-divider-border);
+        @if mixin-exists(hook-inverse-nav-primary-divider) {
+            @include hook-inverse-nav-primary-divider;
+        }
+    }
+
+    .uk-nav-primary .uk-nav-sub a {
+        color: var(--inverse-nav-primary-sublist-item-color);
+    }
+
+    .uk-nav-primary .uk-nav-sub a:hover,
+    .uk-nav-primary .uk-nav-sub a:focus {
+        color: var(--inverse-nav-primary-sublist-item-hover-color);
+    }
+
+    .uk-nav-primary .uk-nav-sub li.uk-active > a {
+        color: var(--inverse-nav-primary-sublist-item-active-color);
+    }
+}
+
+@mixin hook-navbar() {}
+@mixin hook-navbar-container() {}
+@mixin hook-navbar-nav-item() {}
+@mixin hook-navbar-nav-item-hover() {}
+@mixin hook-navbar-nav-item-onclick() {}
+@mixin hook-navbar-nav-item-active() {}
+@mixin hook-navbar-item() {}
+@mixin hook-navbar-toggle() {}
+@mixin hook-navbar-toggle-hover() {}
+@mixin hook-navbar-toggle-icon() {}
+@mixin hook-navbar-toggle-icon-hover() {}
+@mixin hook-navbar-subtitle() {}
+@mixin hook-navbar-primary() {}
+@mixin hook-navbar-transparent() {}
+@mixin hook-navbar-sticky() {}
+@mixin hook-navbar-dropdown() {}
+@mixin hook-navbar-dropdown-dropbar() {}
+@mixin hook-navbar-dropdown-nav() {}
+@mixin hook-navbar-dropdown-nav-item() {}
+@mixin hook-navbar-dropdown-nav-item-hover() {}
+@mixin hook-navbar-dropdown-nav-item-active() {}
+@mixin hook-navbar-dropdown-nav-header() {}
+@mixin hook-navbar-dropdown-nav-divider() {}
+@mixin hook-navbar-dropbar() {}
+@mixin hook-navbar-dropbar-slide() {}
+@mixin hook-navbar-misc() {}
+@mixin hook-inverse-navbar-container() {}
+@mixin hook-inverse-navbar-nav-item() {}
+@mixin hook-inverse-navbar-nav-item-hover() {}
+@mixin hook-inverse-navbar-nav-item-onclick() {}
+@mixin hook-inverse-navbar-nav-item-active() {}
+@mixin hook-inverse-navbar-item() {}
+@mixin hook-inverse-navbar-toggle() {}
+@mixin hook-inverse-navbar-toggle-hover() {}
+@mixin hook-inverse-navbar-dropdown() {}
+@mixin hook-inverse-navbar-dropdown-nav-item() {}
+@mixin hook-inverse-navbar-dropdown-nav-item-hover() {}
+@mixin hook-inverse-navbar-dropdown-nav-item-active() {}
+@mixin hook-inverse-navbar-dropdown-nav-header() {}
+@mixin hook-inverse-navbar-dropdown-nav-divider() {}
+@mixin hook-inverse-navbar-dropbar() {}
+@mixin hook-inverse-component-navbar() {
+    .uk-navbar-container:not(.uk-navbar-transparent) {
+        background: var(--inverse-navbar-background);
+        @if mixin-exists(hook-inverse-navbar-container) {
+            @include hook-inverse-navbar-container;
+        }
+    }
+
+    .uk-navbar-nav > li > a {
+        color: var(--inverse-navbar-nav-item-color);
+        @if mixin-exists(hook-inverse-navbar-nav-item) {
+            @include hook-inverse-navbar-nav-item;
+        }
+    }
+
+    .uk-navbar-nav > li:hover > a,
+    .uk-navbar-nav > li > a:focus,
+    .uk-navbar-nav > li > a.uk-open {
+        color: var(--inverse-navbar-nav-item-hover-color);
+        @if mixin-exists(hook-inverse-navbar-nav-item-hover) {
+            @include hook-inverse-navbar-nav-item-hover;
+        }
+    }
+
+    .uk-navbar-nav > li > a:active {
+        color: var(--inverse-navbar-nav-item-onclick-color);
+        @if mixin-exists(hook-inverse-navbar-nav-item-onclick) {
+            @include hook-inverse-navbar-nav-item-onclick;
+        }
+    }
+
+    .uk-navbar-nav > li.uk-active > a {
+        color: var(--inverse-navbar-nav-item-active-color);
+        @if mixin-exists(hook-inverse-navbar-nav-item-active) {
+            @include hook-inverse-navbar-nav-item-active;
+        }
+    }
+
+    .uk-navbar-item {
+        color: var(--inverse-navbar-item-color);
+        @if mixin-exists(hook-inverse-navbar-item) {
+            @include hook-inverse-navbar-item;
+        }
+    }
+
+    .uk-navbar-toggle {
+        color: var(--inverse-navbar-toggle-color);
+        @if mixin-exists(hook-inverse-navbar-toggle) {
+            @include hook-inverse-navbar-toggle;
+        }
+    }
+
+    .uk-navbar-toggle:hover,
+    .uk-navbar-toggle:focus,
+    .uk-navbar-toggle.uk-open {
+        color: var(--inverse-navbar-toggle-hover-color);
+        @if mixin-exists(hook-inverse-navbar-toggle-hover) {
+            @include hook-inverse-navbar-toggle-hover;
+        }
+    }
+
+    .uk-navbar-dropdown {
+        background: var(--inverse-navbar-dropdown-background);
+        color: var(--inverse-navbar-dropdown-color);
+        @if mixin-exists(hook-inverse-navbar-dropdown) {
+            @include hook-inverse-navbar-dropdown;
+        }
+    }
+
+    .uk-navbar-dropdown-nav > li > a {
+        color: var(--inverse-navbar-dropdown-nav-item-color);
+        @if mixin-exists(hook-inverse-navbar-dropdown-nav-item) {
+            @include hook-inverse-navbar-dropdown-nav-item;
+        }
+    }
+
+    /* Hover + Focus */
+    .uk-navbar-dropdown-nav > li > a:hover,
+    .uk-navbar-dropdown-nav > li > a:focus {
+        color: var(--inverse-navbar-dropdown-nav-item-hover-color);
+        @if mixin-exists(hook-inverse-navbar-dropdown-nav-item-hover) {
+            @include hook-inverse-navbar-dropdown-nav-item-hover;
+        }
+    }
+
+    /* Active */
+    .uk-navbar-dropdown-nav > li.uk-active > a {
+        color: var(--inverse-navbar-dropdown-nav-item-active-color);
+        @if mixin-exists(hook-inverse-navbar-dropdown-nav-item-active) {
+            @include hook-inverse-navbar-dropdown-nav-item-active;
+        }
+    }
+
+    /*
+     * Header
+     */
+
+    .uk-navbar-dropdown-nav .uk-nav-header {
+        color: var(--inverse-navbar-dropdown-nav-header-color);
+        @if mixin-exists(hook-inverse-navbar-dropdown-nav-header) {
+            @include hook-inverse-navbar-dropdown-nav-header;
+        }
+    }
+
+    /*
+     * Divider
+     */
+
+    .uk-navbar-dropdown-nav .uk-nav-divider {
+        border-color: var(--inverse-navbar-dropdown-nav-divider-border);
+        @if mixin-exists(hook-inverse-navbar-dropdown-nav-divider) {
+            @include hook-inverse-navbar-dropdown-nav-divider;
+        }
+    }
+
+    /*
+     * Sublists
+     */
+
+    // noinspection Stylelint
+    .uk-navbar-dropdown-nav .uk-nav-sub a {
+        color: var(--inverse-navbar-dropdown-nav-sublist-item-color);
+    }
+
+    .uk-navbar-dropdown-nav .uk-nav-sub a:hover,
+    .uk-navbar-dropdown-nav .uk-nav-sub a:focus {
+        color: var(--inverse-navbar-dropdown-nav-sublist-item-hover-color);
+    }
+
+    .uk-navbar-dropdown-nav .uk-nav-sub li.uk-active > a {
+        color: var(--inverse-navbar-dropdown-nav-sublist-item-active-color);
+    }
+
+
+    /* Dropbar
+     ========================================================================== */
+
+    .uk-navbar-dropbar {
+        background: var(--inverse-navbar-dropbar-background);
+        @if mixin-exists(hook-inverse-navbar-dropbar) {
+            @include hook-inverse-navbar-dropbar;
+        }
+    }
+}
+
+@mixin hook-position-misc() {}
+
+@mixin hook-print() {}
+
+@mixin hook-section() {}
+@mixin hook-section-default() {}
+@mixin hook-section-muted() {}
+@mixin hook-section-primary() {}
+@mixin hook-section-secondary() {}
+@mixin hook-section-tertiary() {}
+@mixin hook-section-overlap() {}
+@mixin hook-section-misc() {}
+
+@mixin hook-text-lead() {}
+@mixin hook-text-meta() {}
+@mixin hook-text-small() {}
+@mixin hook-text-large() {}
+@mixin hook-text-background() {}
+@mixin hook-text-misc() {}
+@mixin hook-inverse-text-lead() {}
+@mixin hook-inverse-text-meta() {}
+@mixin hook-inverse-component-text() {
+    .uk-text-lead {
+        color: var(--inverse-text-lead-color);
+        @if mixin-exists(hook-inverse-text-lead) {
+            @include hook-inverse-text-lead;
+        }
+    }
+
+    .uk-text-meta {
+        color: var(--inverse-text-meta-color);
+        @if mixin-exists(hook-inverse-text-meta) {
+            @include hook-inverse-text-meta;
+        }
+    }
+
+    .uk-text-muted { color: var(--inverse-text-muted-color) !important; }
+    .uk-text-emphasis { color: var(--inverse-text-emphasis-color) !important; }
+    .uk-text-primary { color: var(--inverse-text-primary-color) !important; }
+    .uk-text-secondary { color: var(--inverse-text-secondary-color) !important; }
+    .uk-text-tertiary { color: var(--inverse-text-tertiary-color) !important; }
+}
+
+@mixin hook-tile() {}
+@mixin hook-tile-default() {}
+@mixin hook-tile-default-hover() {}
+@mixin hook-tile-muted() {}
+@mixin hook-tile-muted-hover() {}
+@mixin hook-tile-primary() {}
+@mixin hook-tile-primary-hover() {}
+@mixin hook-tile-secondary() {}
+@mixin hook-tile-secondary-hover() {}
+@mixin hook-tile-tertiary() {}
+@mixin hook-tile-tertiary-hover() {}
+@mixin hook-tile-misc() {}
+
+@mixin hook-panel-scrollable() {}
+@mixin hook-box-shadow-bottom() {}
+@mixin hook-dropcap() {}
+@mixin hook-logo() {}
+@mixin hook-logo-hover() {}
+@mixin hook-utility-misc() {}
+@mixin hook-inverse-dropcap() {}
+@mixin hook-inverse-logo() {}
+@mixin hook-inverse-logo-hover() {}
+@mixin hook-inverse-component-utility() {
+    .uk-dropcap::first-letter,
+    .uk-dropcap p:first-of-type::first-letter {
+        @if mixin-exists(hook-inverse-dropcap) {
+            @include hook-inverse-dropcap;
+        }
+    }
+
+    .uk-logo {
+        color: var(--inverse-logo-color);
+        @if mixin-exists(hook-inverse-logo) {
+            @include hook-inverse-logo;
+        }
+    }
+
+    .uk-logo:hover,
+    .uk-logo:focus {
+        color: var(--inverse-logo-hover-color);
+        @if mixin-exists(hook-inverse-logo-hover) {
+            @include hook-inverse-logo-hover;
+        }
+    }
+
+    .uk-logo > :not(.uk-logo-inverse, :only-of-type) {
+        display: none;
+    }
+
+    .uk-logo-inverse {
+        display: inline;
+    }
+}
+
+@mixin hook-modal() {}
+@mixin hook-modal-content() {}
+@mixin hook-modal-mask() {}
+@mixin hook-modal-full() {}
+@mixin hook-modal-header() {}
+@mixin hook-modal-body() {}
+@mixin hook-modal-footer() {}
+@mixin hook-modal-title() {}
+@mixin hook-modal-close() {}
+@mixin hook-modal-close-hover() {}
+@mixin hook-modal-close-default() {}
+@mixin hook-modal-close-default-hover() {}
+@mixin hook-modal-close-outside() {}
+@mixin hook-modal-close-outside-hover() {}
+@mixin hook-modal-close-full() {}
+@mixin hook-modal-close-full-hover() {}
+@mixin hook-modal-misc() {}
+
+@mixin hook-width-misc() {}
+
+@mixin hook-spinner() {}
+@mixin hook-spinner-misc() {}
+
+@mixin hook-tabs() {}
+@mixin hook-tabs-tab() {}
+@mixin hook-tabs-tab-hover() {}
+@mixin hook-tabs-tab-active() {}
+@mixin hook-tabs-tab-disabled() {}
+@mixin hook-tabs-top() {}
+@mixin hook-tabs-top-tab() {}
+@mixin hook-tabs-bottom() {}
+@mixin hook-tabs-bottom-tab() {}
+@mixin hook-tabs-left() {}
+@mixin hook-tabs-left-tab() {}
+@mixin hook-tabs-right() {}
+@mixin hook-tabs-right-tab() {}
+@mixin hook-tabs-misc() {}
+@mixin hook-inverse-tabs() {}
+@mixin hook-inverse-tabs-tab() {}
+@mixin hook-inverse-tabs-tab-hover() {}
+@mixin hook-inverse-tabs-tab-active() {}
+@mixin hook-inverse-tabs-tab-disabled() {}
+@mixin hook-inverse-component-tabs() {
+    .uk-tabs {
+        @if mixin-exists(hook-inverse-tabs) {
+            @include hook-inverse-tabs;
+        }
+    }
+
+    .uk-tabs > * > a {
+        color: var(--inverse-tabs-tab-color);
+        @if mixin-exists(hook-inverse-tabs-tab) {
+            @include hook-inverse-tabs-tab;
+        }
+    }
+
+    .uk-tabs > * > a:hover,
+    .uk-tabs > * > a:focus {
+        color: var(--inverse-tabs-tab-hover-color);
+        @if mixin-exists(hook-inverse-tabs-tab-hover) {
+            @include hook-inverse-tabs-tab-hover;
+        }
+    }
+
+    .uk-tabs > .uk-active > a {
+        color: var(--inverse-tabs-tab-active-color);
+        @if mixin-exists(hook-inverse-tabs-tab-active) {
+            @include hook-inverse-tabs-tab-active;
+        }
+    }
+
+    .uk-tabs > .uk-disabled > a {
+        color: var(--inverse-tabs-tab-disabled-color);
+        @if mixin-exists(hook-inverse-tabs-tab-disabled) {
+            @include hook-inverse-tabs-tab-disabled;
+        }
+    }
+}
+
+
+@mixin hook-inverse() {
+    @include hook-inverse-component-base;
+    @include hook-inverse-component-link;
+    @include hook-inverse-component-heading;
+    @include hook-inverse-component-description;
+    @include hook-inverse-component-divider;
+    @include hook-inverse-component-list;
+    @include hook-inverse-component-icon;
+    @include hook-inverse-component-card;
+    @include hook-inverse-component-form;
+    @include hook-inverse-component-control;
+    @include hook-inverse-component-button;
+    @include hook-inverse-component-grid;
+    @include hook-inverse-component-close;
+
+    // @include hook-inverse-component-totop;
+    @include hook-inverse-component-badge;
+    @include hook-inverse-component-label;
+    @include hook-inverse-component-leader;
+    @include hook-inverse-component-article;
+
+    // @include hook-inverse-component-search;
+    @include hook-inverse-component-accordion;
+    @include hook-inverse-component-dropdown;
+    @include hook-inverse-component-nav;
+    @include hook-inverse-component-navbar;
+
+    // @include hook-inverse-component-subnav;
+    @include hook-inverse-component-breadcrumb;
+
+    // @include hook-inverse-component-pagination;
+    @include hook-inverse-component-tabs;
+
+    // @include hook-inverse-component-slidenav;
+    @include hook-inverse-component-dotnav;
+    @include hook-inverse-component-iconnav;
+    @include hook-inverse-component-text;
+    @include hook-inverse-component-column;
+    @include hook-inverse-component-utility;
+}