// ============================================================================
// Imports
// ============================================================================

@use "../../../variables" as *;
@use "../../../mixins" as *;
@use "../../../dev" as *;

// ============================================================================
// Container Styles | Ribbon | Ttile
// ============================================================================

// ============================================================================
// Ribbon Title Utilities
// ============================================================================

.ribbon__title {
    @include ribbon__title;
}
.ribbon__title__logo {
    @include ribbon__title__logo;
}
.ribbon__title__text {
    @include ribbon__title__text;
}
.ribbon__title__image {
    @include ribbon__title__image;
}

// ============================================================================
// .ribbon__title {
//     @include reset_bleed;
//     @include icon_bar--horizontal;
//     @include align_self--start;
//     @include font--size('04');
//     @include align--center;
//     @include character--hyperlink--clean;
//     // @include color_scheme_dark;
//     font-size: q(20);
//     align-content: center;
//     height: 100%;
//     grid-area: ribbon--center;
//     @include justify--center;

//     @media screen and (min-width: $media_md) {
//         grid-area: ribbon--left;
//         @include justify_start;
//     }

//     .ribbon__title_logo {
//         padding-left: calc($ribbon_spacing / 2);
//         padding-right: calc($ribbon_spacing / 2);
//     }

//     .ribbon__title_logo {
//        @include icon--size(04)
//         svg {
//             // @include color_scheme_dark;
//             position: relative;
//             width: 100%;
//             height: 100%;
//         }
//     }

//     .ribbon__title_text {
//         @include character--hyperlink--clean;
//         @include invisible;
//         @include font--size('03');
//         display: none;
//         @media screen and (min-width: $media_md) {
//             @include visible;
//             display: inherit;
//             overflow: visible;
//             white-space: nowrap;
//         }
//     }
// }