Xbox Design Lab (Controller Designer) by x3ro

/* ==UserStyle==
@name           Xbox Design Lab - Controller Designer
@namespace      userstyles.x3ro.dev
@version        1.0.0
==/UserStyle== */
@-moz-document regexp("https://www.microsoft.com/[^/]*/store/configure/xbox-design-lab/.*") {
/**
 * Xbox Design Lab (Controller Designer)
 * =====================================
 *
 *
 * Change Log
 * ----------
 *
 * ### Version 1.1
 *
 * - FIX: Engraving was not positioned correctly
 *
 * ### Version 1.0
 *
 * - Everything else...
 *
 */

.drawer-selected-item {
    flex: 2 !important;
}

.drawerselectedprice {
    margin-left: 3px;
    padding-left: 1px;
    border-left: 1px solid black;
}

.drawerbody {
    padding: 10px 0 15px 0 !important;
}

@media screen and (min-width: 540px) {

    .m-page-bar.pagebar-module.f-sticky,
    [data-m*="cookiebanner_cont"],
    footer,
    .current-selected-title,
    .image-collection-carousel .c-flipper,
    .image-collection-carousel .c-sequence-indicator {
        display: none !important;
    }

    .image-collection-carousel ul.c-group {
        display: flex;
        flex-wrap: wrap;
    }

    .image-collection-carousel ul.c-group * {
        width: auto;
        height: auto;
        display: initial;
        margin: 0;
        padding: 0;
    }


    .image-collection-carousel ul.c-group li {
        max-width: 50%;
        position: relative;
    }

    .image-collection-carousel ul.c-group li .engraving-layer {
        position: absolute;
        left: 0;
        right: 0;
    }

    .c-carousel ul.c-group li button.sku-selector-btn {
        margin: 5px 3px !important;
        padding: 0 !important;
    }
}

@media only screen and (min-width: 1083px) {

    #TwoColumnRegion {
        margin: 0;
        padding: 0;
        width: 100%;
        max-width: none;
        display: flex;
    }

    #TwoColumnRegion > :nth-child(1) {
        flex-grow: 1;
        height: 100%;
    }

    #TwoColumnRegion > :nth-child(2) {
        width: 25%;
        min-width: 350px;
    }


    .drawerheader {
        padding-right: 20px !important;
    }

    .drawerheader::before {
        margin: 0 5px 0 10px !important;
    }
}
}