// ============================================================================
// Code
// ============================================================================


// Code Logic -----------------------------------------------------------------
@mixin code-inline-spacing() {
    margin-left: em(2);
    margin-right: em(2);
    padding-left: em(4);
    padding-right: em(4);
}


// Grouped Styles -------------------------------------------------------------
// [1] Ensures hyphenation won't interfere with code
// code,
// kbd,
// pre,
// samp,
// var {
//     @include typography-tracking(slight);
//
//     overflow: auto; // [1]
//
//     font-family: $font-family-code;
//     line-height: $global-type-line-height;
//     white-space: pre; // [1]
//     white-space: pre-wrap; // [1]
//     word-break: break-all; // [1]
//     word-wrap: break-word; // [1]
// }


// Individual Styles ----------------------------------------------------------
// code {
//     @include code-inline-spacing();
// }


kbd {
    margin-right: ms(0.15, em);
    margin-left: ms(0.15, em);

    // [1] Removes formatting for individual key presses in a key command
    kbd {
        @include content-show-interaction(input);
        @include typography-tracking(slight);

        padding-right: ms(0.35, em);
        padding-left: ms(0.35, em);
        position: relative;
          bottom: em(2);

        border: border(thinner) solid currentColor;
        border-bottom: border(thin) solid currentColor;
        border-radius: ms(0.25, em);

        font-family: $font-family-primary;
        font-size: 70%;
        text-transform: uppercase;
    }
}


// pre {
//     line-height: 1.8;
// }


// samp {
//     @include code-inline-spacing();
// }


// var {
//     @include code-inline-spacing();
// }
