@include exports("card/theme") {

    // Card
    .k-card {
        @extend .k-text-selection;
        @include fill( $card-text, $card-bg, $card-border );

        .k-card-callout {
            border-color: $card-border;
            background-color: $card-bg;
        }
    }


    // Header
    .k-card-header {
        @include fill( $card-header-text, $card-header-bg, $card-header-border );
    }

    // Footer
    .k-card-footer {
        @include fill( $card-footer-text, $card-footer-bg, $card-footer-border );
    }

    // Separator
    .k-card-separator {
        border-color: $card-border;
    }

    // Card actions
    .k-card-actions {
        border-color: $card-border;
    }

    .k-card-subtitle {
        color: $card-subtitle-text;

        .k-state-primary &,
        .k-state-info &,
        .k-state-success &,
        .k-state-warning &,
        .k-state-error & {
            color: inherit;
        }
    }

    // Theme variants
    .k-card {
        &.k-card-primary,
        &.k-state-primary {
            @extend .k-state-primary;
        }

        &.k-card-info,
        &.k-state-info {
            @extend .k-state-info;
        }

        &.k-card-success,
        &.k-state-success {
            @extend .k-state-success;
        }

        &.k-card-warning,
        &.k-state-warning {
            @extend .k-state-warning;
        }

        &.k-card-error,
        &.k-state-error {
            @extend .k-state-error;
        }
    }


    .k-card-wrap {
        &.k-state-focused,
        &.k-state-selected {
            > .k-card {
                box-shadow: $card-box-focused-shadow;
            }
        }
    }

}