.form-control,
.selectize-input {
    border-radius: 0 !important;
}

.btn-default:active,
.btn-primary:active,
.btn-success:active,
.btn-info:active,
.btn-warning:active,
.btn-danger:active,
.btn-default.active,
.btn-primary.active,
.btn-success.active,
.btn-info.active,
.btn-warning.active,
.btn-danger.active {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.btn-default,
.btn-primary,
.btn-success,
.btn-info,
.btn-warning,
.btn-danger,
.navbar-brand,
.navbar-nav > li > a {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

#wg_sitefooter .btn-subscribe {
    background-color: #eee !important;
    border: 1px solid black !important;
    color: black !important;
}

.navbar-default .navbar-toggle {
    border-color: #333;
}

#wg_header_container .alert-info {
    background-color: #000;
    background-image: none;
    color: #FFF;
    opacity: .9;
    padding-bottom: 6px;
    padding-top: 6px;
}

#wg_header_container .alert-info:hover {
    background-color: #000;
    background-image: none;
    color: #FFF;
    opacity: .7;
}

#wg_header_container .navbar {
    background: #FFF;
    border-bottom: 1px solid;
    border-radius: 0;
}

#wg_productactionbuy {
    min-width: 100px;
    text-align: center;
    text-transform: uppercase;
    padding-top: 0;
    padding-bottom: 0;
    height: 38px;
}

#wg_purchaseinfo {
    display: none;
    font-size: 10px;
    margin-top: -3px;
}

#wg_productinfo .wg_pretext {
    /*    float: left;*/
    font-family: 'Crimson Text', sans-serif;
    font-size: 15px;
    margin-top: 0;
    margin-right: 5px;
}

#wg_sizecolorspecification hr {
    margin-bottom: 5px;
    margin-left: -5px;
}

#wg_sizecolorspecification {
    display: none !important;
}

.wg_specificationdescription {
    margin-left: 0;
}

#wg_navbar_container,
#wg_navbar_container {
    font-size: 13px;
    font-weight: 400;
}

#wg_navbar_container,
#wg_navbar_container input {
    text-transform: uppercase;
}

#wg_productinfo .wg_posttext {
    margin-bottom: 15px;
    float: right;
    margin-right: 3px;
}

#wg_productinfo .wg_posttext:before {
    height: 15px;
    width: 15px;
    display: inline-block;
    content: "";
    margin-right: 5px;
    margin-bottom: -3px;
    background-color: #bbbdc0;
}


#wg_navigateprevious,
#wg_navigatenext,
#wg_navpathcontainer {
    font-family: Poppins, sans-serif;
    font-size: 13px;
    font-weight: 400;
}

#wg_navigateprevious:before {
    content: "\f177";
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    display: inline-block;
    margin-right: 7px;
}

#wg_navigatenext:after {
    content: "\f178";
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    display: inline-block;
    margin-left: 7px;
}

#wg_navpathcontainer .breadcrumb {
    background: none;
    padding-left: 0;
}

#wg_productaction_container,
#wg_pricingcontainer {
    text-align: left;
}

#wg_productactionreservation,
#wg_productactionmessage,
#mm_sizeimage,
#wg_productactionaddwishlist {
    color: #000;
    text-decoration: underline;
}

#wg_wishlistwebpage_container .wg_pretext {
    margin-bottom: -10px;
    font-size: 100%;
}

#wg_productdescription,
#wg_productinfotext,
#wg_imagegallerydescription,
#wg_productinfotext {
    font-family: 'Crimson Text', sans-serif;
    font-size: 15px;
    font-weight: 400;
}

#wg_productinfotext {
    padding-top: 10px;
}

#wg_productinfotitle {
    color: #221d1e;
    display: none;
    margin-bottom: 25px;
}

#wg_deliverymethods .wg_infobox_outer {
    padding-left: 0;
    padding-right: 0;
}

#wg_productinfotitle,
#wg_imagegalleryheader {
    color: var(--wg-customer-text-primary);
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-page-size);
    font-style: normal;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.2;
    opacity: 1;
    text-transform: none;
}

#wg_productdiscountcontainer .wg_productpriceinfo {
    color: #d32027;
}

#wg_productinfo .wg_infobox_inner,
#wg_paymentoptionscontainer .wg_infobox_inner {
    display: none;
}

#wg_productinfotext .wg_infobox_outer {
    padding-left: 0;
    padding-top: 5px;
}

#wg_productorginalprice {
    color: #221d1e;
    font-family: 'Crimson Text', sans-serif;
    font-size: 15px;
    font-weight: 400;
    margin-left: 0;
    text-decoration: line-through;
}

#wg_sitefooter .wg_footercontent {
    padding: 35px 0 0;
}

#wg_sizecolorgrid .wg_infobox_outer {
    padding-left: 0;
}

.btn,
.btn:hover,
.btn:focus {
    background-color: #333 !important;
    background-image: none;
    border: 1px solid #333;
    border-radius: 0;
    color: #eee;
}

.btn,
select {
    font-weight: 400;
}

.btn-default.active,
.wg_deliverylink:hover,
.btn-default.active:hover {
    color: #de6458;
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
    color: #eee;
}

.btn:hover,
.btn:focus {
    color: #eee;
}

.alert-info {
    background: #f5f5f5;
    border-color: #000;
}

.wg_emptytock {
    background-color: #f2f2f2 !important;
    background-image: none;
    border: 0;
    border-radius: 0;
    color: #939597 !important;
    padding: 2px 4px;
}

.wg_footercontent,
.wg_footercontent a,
.wg_footercontent a:hover {
    background-color: #f2f2f2;
    color: #000;
}

.wg_footercontent .wg_notification a {
    background-color: inherit;
}

.wg_footercontent,
.wg_footerwidget ul,
.wg_productprice,
.mm_custom_links,
.wg_notification {
    font-family: 'Crimson Text', sans-serif;
    font-size: 15px;
    font-weight: 400;
}

#wg_copyright {
    display: none;
}

.wg_footerwidget .wg_customer-footer-title span {
    font-family: Poppins, sans-serif;
    font-size: var(--wg-customer-type-eyebrow-size);
    padding-top: 3px;
    font-weight: 600;
    letter-spacing: .08em;
    line-height: 1.25;
    text-transform: uppercase;
}

.wg_imagegalleryimagetext {
    padding-bottom: 5px;
}

.wg_infobox_inner,
#wg_giftcertificate_container .wg_infobox_inner,
#wg_paymentcomplete_container .wg_infobox_inner,
#wg_paymentincomplete_container .wg_infobox_inner {
    background-color: transparent;
    border: none;
    border-bottom: 3px solid #000;
    border-radius: 0;
    color: #000;
}

.wg_infobox_outer,
#wg_shoppingcart_container .wg_infobox_outer,
#wg_giftcertificate_container .wg_infobox_outer,
#wg_paymentcomplete_container .wg_infobox_outer,
#wg_paymentincomplete_container .wg_infobox_outer {
    border: none;
}

.wg_itemdetails,
#wg_loadmorebutton {
    border-radius: 0;
}

.wg_itemwrapper {
    border: 0;
}

.wg_productcatalog_headercontainer {
    margin-bottom: 23px;
    margin-left: 18px;
    width: calc(100% - 36px);
}

#wg_productcatalog {
    margin-left: 18px;
    max-width: 1060px;
    width: calc(100% - 100px);
}

#wg_productcatalog .wg_itemwrapper {
    align-items: stretch;
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
}

#wg_productcatalog .wg_itemwrapper > div {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    width: 100%;
}

#wg_productcatalog .wg_productpreview .wg_previewproductimage {
    align-items: center;
    aspect-ratio: 8 / 13;
    background: #fff;
    display: flex;
    justify-content: center;
    margin-bottom: 28px;
    min-height: 1px;
    overflow: hidden;
    width: 100%;
}

#wg_productcatalog .wg_productpreview .wg_previewproductimage:has(> .wg_flickity.wg_customer-flickity-has-navigation) {
    overflow: visible;
}

#wg_productcatalog .mm_catalog-card-with-variants .wg_previewproductimage {
    overflow: visible;
}

#wg_productcatalog .wg_productpreview .wg_previewproductimage > .wg_flickity:not(.flickity-enabled) {
    visibility: hidden;
}

#wg_productcatalog .wg_productpreview .wg_previewproductimage > a,
#wg_productcatalog .wg_productpreview .wg_previewproductimage .wg_flickity,
#wg_productcatalog .wg_productpreview .wg_previewproductimage > .wg_flickity .flickity-viewport,
#wg_productcatalog .wg_productpreview .wg_previewproductimage > .wg_flickity .carousel-cell {
    height: 100% !important;
    min-height: 100%;
    width: 100%;
}

#wg_productcatalog .wg_productpreview .wg_previewproductimage > a img,
#wg_productcatalog .wg_productpreview .wg_previewproductimage > .wg_flickity .wg_image {
    display: block;
    height: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: center center;
    width: 100%;
}

#wg_productcatalog .wg_productpreview .wg_previewproductimage > .wg_flickity .carousel-cell,
#wg_productcatalog .wg_productpreview .wg_previewproductimage > .wg_flickity .wg_image {
    border: 0;
    box-shadow: none;
    outline: 0;
}

#wg_productcatalog .wg_productpreview .wg_previewproductimage > .wg_flickity .wg_image[data-flickity-lazyload],
#wg_productcatalog .wg_productpreview .wg_previewproductimage > .wg_flickity .wg_image.mm_catalog-image-pending,
#wg_productcatalog .wg_productpreview .wg_previewproductimage > .wg_flickity .wg_image.mm_catalog-image-error {
    visibility: hidden;
}

#wg_productcatalog .wg_productpreview .mm_catalog-product-carousel > .flickity-page-dots {
    display: none;
}

#wg_productcatalog .mm_catalog-variant-shell {
    --mm-catalog-variant-width: 27.5px;
    --mm-catalog-shell-width: 132px;
    background: #fff;
    border: 1px solid rgba(23, 21, 20, .12);
    border-radius: 10px;
    bottom: -15px;
    box-shadow: 0 2px 8px rgba(23, 21, 20, .16);
    box-sizing: border-box;
    height: 40px;
    max-width: calc(100% - 12px);
    opacity: 0;
    overflow: hidden;
    padding: 4px 5px;
    pointer-events: none;
    position: absolute;
    right: 6px;
    transition: opacity 120ms ease;
    visibility: hidden;
    width: var(--mm-catalog-shell-width);
    z-index: 3;
}

#wg_productcatalog .mm_catalog-variant-shell.mm_catalog-variant-shell-ready {
    opacity: 1;
    pointer-events: auto;
    visibility: visible;
}

#wg_productcatalog .mm_catalog-variant-carousel,
#wg_productcatalog .mm_catalog-variant-carousel .flickity-viewport {
    height: 30px !important;
    width: 100%;
}

#wg_productcatalog .mm_catalog-variant-carousel {
    outline: 0;
    touch-action: pan-y;
}

#wg_productcatalog .mm_catalog-variant {
    background: #fff;
    border: 0;
    border-radius: 5px;
    box-sizing: border-box;
    cursor: pointer;
    height: 30px;
    margin-bottom: 0;
    margin-right: 3px;
    margin-top: 0;
    overflow: visible;
    position: relative;
    width: var(--mm-catalog-variant-width);
}

#wg_productcatalog .mm_catalog-variant-input {
    border: 0 !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    left: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    top: 0 !important;
    white-space: nowrap !important;
    width: 1px !important;
}

#wg_productcatalog .mm_catalog-variant:last-child {
    margin-right: 0;
}

#wg_productcatalog .mm_catalog-variant img,
#wg_productcatalog .mm_catalog-variant img:hover {
    display: block;
    filter: saturate(1);
    height: 100%;
    object-fit: contain;
    object-position: center center;
    opacity: 1 !important;
    pointer-events: none;
    width: 100%;
}

#wg_productcatalog .mm_catalog-variant[aria-current="true"]::after {
    align-items: center;
    background: #242424;
    border: 1px solid #fff;
    border-radius: 50%;
    color: #fff;
    content: "\f00c";
    display: flex;
    font-family: FontAwesome;
    font-size: 7px;
    font-style: normal;
    font-weight: normal;
    height: 12px;
    justify-content: center;
    left: 1px;
    line-height: 1;
    pointer-events: none;
    position: absolute;
    top: 1px;
    width: 12px;
    z-index: 2;
}

#wg_productcatalog .mm_catalog-variant-overflow {
    align-items: center;
    display: flex;
    justify-content: center;
    overflow: hidden;
}

#wg_productcatalog .mm_catalog-variant-overflow-count {
    color: #242424;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
}

#wg_productcatalog .mm_catalog-variant:has(.mm_catalog-variant-input:focus-visible) {
    outline: 2px solid #242424;
    outline-offset: 2px;
}

#wg_productcatalog .wg_productpreview .wg_product_colors {
    display: none !important;
}

#wg_productcatalog .wg_productpreview .wg_producttitle {
    line-height: 1.25;
    min-height: 38px;
}

#wg_productcatalog .wg_productpreview .wg_producttitle a {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    overflow: hidden;
}

#wg_productcatalog .wg_productpreview .wg_productprice {
    min-height: 24px;
}

#wg_productcatalog .wg_productpreview .wg_priceold {
    min-height: 18px;
}

#wg_productcatalog .wg_productpreview .wg_producttitle,
#wg_productcatalog .wg_productpreview .wg_productprice,
#wg_productcatalog .wg_productpreview .wg_priceold,
#wg_productcatalog .wg_productpreview .wg_product_colors,
#wg_productcatalog .wg_productpreview .wg_itemdetails {
    flex-shrink: 0;
}

@media screen and (max-width: 767px) {
    .wg_productcatalog_headercontainer,
    #wg_productcatalog {
        margin-left: 0;
        max-width: none;
        width: 100%;
    }

    #wg_productcatalog .wg_itemwrapper {
        margin-bottom: 24px;
        padding: 8px;
    }

    #wg_productcatalog .wg_productpreview .wg_previewproductimage {
        margin-bottom: 28px;
    }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
    #wg_productcatalog {
        max-width: none;
        width: calc(100% - 36px);
    }
}

@media screen and (min-width: 900px) and (max-width: 1199px) {
    body.mm_catalog-page #wg_webpagecontainer {
        max-width: 1096px;
        width: calc(100% - 24px);
    }

    body.mm_catalog-page #wg_productcatalog .wg_itemwrapper {
        margin-right: 1% !important;
        width: 24% !important;
    }
}

.wg_lowstock {
    background-color: #bbbdc0 !important;
    background-image: none;
    border: 0;
    border-radius: 0;
    color: #333 !important;
    padding: 2px 4px;
}

.wg_lowstock a:hover,
.wg_productselectcell_active a:hover,
.wg_lowstock a {
    color: #333 !important;
    text-decoration: none;
}

.wg_lowstock:hover {
    background-color: #e6e7e8 !important;
    color: #333 !important;
    text-decoration: none;
}

.wg_normalstock {
    background-color: #333 !important;
    background-image: none;
    border: 0;
    border-radius: 0;
    color: #fff !important;
    padding: 2px 4px;
}

.wg_normalstock a:hover,
.wg_lowstock a:hover,
.btn:hover {
    color: #fff !important;
}

.wg_normalstock:hover {
    background-color: #6d6e78 !important;
    color: #fff !important;
}

.wg_productcategorytitle {
    color: var(--wg-customer-text-primary);
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-section-size);
    font-style: normal;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.3;
    opacity: 1;
    text-align: left;
    text-transform: none;
}

.wg_productpreview .wg_producttitle,
.wg_productpreview .wg_productprice,
.wg_productpreview img:hover {
    opacity: 0.68;
}

.wg_productpreview:hover .wg_producttitle,
.wg_productpreview:hover .wg_productprice {
    opacity: 1;
}

.wg_productpriceinfo {
    font-family: 'Crimson Text', sans-serif;
    font-size: 22px;
    font-weight: 700;
    margin-top: 0;
}

.wg_productselectcell a:hover {
    text-decoration: none;
}

.wg_productselectcell,
.wg_itemwrapper .wg_priceold {
    text-align: center;
}

.wg_productselectcell_active,
.wg_productselectrow_active,
.wg_productselectcell_active:hover,
.wg_productselectcell_active a,
#wg_deliverymethods a.active {
    background-color: #de6458 !important;
    color: #fff !important;
}

.wg_producttitle {
    /* display: none;*/
    font-family: 'Crimson Text', sans-serif;
    font-size: 15px;
    font-weight: 700;
}

/* A font-face family must be a single name; a fallback list here makes browsers drop the rule. */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 300;
    src: local('Poppins Light'), local('Poppins-Light'), url(/Misc/MetteMoller/fonts/PoppinsLight.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    src: local('Poppins Regular'), local('Poppins-Regular'), url(/Misc/MetteMoller/fonts/PoppinsRegular.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

@font-face {
    font-family: 'Crimson Text';
    font-style: normal;
    font-weight: 400;
    src: local('Crimson Text'), local('CrimsonText-Roman'), url(/Misc/MetteMoller/fonts/CrimsonText-Semibold.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

/* latin */
@font-face {
    font-family: 'Crimson Text';
    font-style: normal;
    font-weight: 600;
    src: local('Crimson Text Semibold'), local('CrimsonText-Semibold'), url(/Misc/MetteMoller/fonts/CrimsonText-Semibold.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

body a:hover,
#wg_pricingcontainer:not(.wg_productorginalprice) > .wg_productpriceinfo,
#wg_copyright a,
#wg_copyright a:hover {
    color: #000;
}

body,
.wg_productselectgrid {
    font-family: Poppins, sans-serif;
    font-size: 12px;
    font-weight: 400;
}

body#wg_mainbody {
    --wg-customer-font-ui: Poppins, sans-serif;
    --wg-customer-font-display: 'Crimson Text', Georgia, serif;
    --wg-customer-text-primary: #171514;
    --wg-customer-text-muted: #625d59;
    --wg-customer-commerce-primary: #242424;
    --wg-customer-commerce-primary-hover: #111111;
    --wg-customer-commerce-primary-text: #fff;
    --wg-customer-type-page-size: 30px;
    --wg-customer-type-dialog-size: 36px;
    --wg-customer-type-display-size: 27px;
    --wg-customer-type-section-size: 19px;
    --wg-customer-type-subsection-size: 17px;
    --wg-customer-type-card-size: 15px;
    --wg-customer-type-component-size: 14px;
    --wg-customer-type-meta-size: 13px;
    --wg-customer-type-eyebrow-size: 12px;
    --wg-customer-type-control-size: 14px;
    --wg-customer-type-navigation-size: 14px;
}

body#wg_mainbody #wg_header_container #wg_navbar_container .wg_customer-type-navigation {
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-navigation-size);
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.2;
    opacity: 1;
    text-transform: uppercase;
}

body#wg_mainbody .wg_customer-account-nav .wg_customer-type-navigation {
    font-size: var(--wg-customer-type-control-size);
    text-transform: none;
}

body#wg_mainbody #wg_sitefooter.mm_storefront-footer .wg_footerwidget > ul > li > a {
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-meta-size);
    font-style: normal;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.4;
    opacity: 1;
    text-transform: none;
}

body#wg_mainbody .mm_header-info-button {
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-eyebrow-size);
    font-style: normal;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.35;
    opacity: 1;
    text-transform: none;
}

body#wg_mainbody .cc-container {
    color: var(--wg-customer-text-primary);
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-component-size);
    font-style: normal;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.5;
}

body#wg_mainbody .cc-container .cc-title {
    color: var(--wg-customer-text-primary);
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-subsection-size);
    font-style: normal;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.3;
    opacity: 1;
    text-transform: none;
}

body#wg_mainbody .cc-container .cc-btn {
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-control-size);
    font-style: normal;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.35;
    text-transform: none;
}

.wg_customer-alternatives-title {
    margin: 10px 0;
}

.qtip #wg_customer-order-message-title {
    margin: 15px 0 10px;
}

textarea:active {
    border-color: #000;
}

/*Disabled by Olav
.navbar-nav>li>a {
    padding-bottom: 0;
}*/

.wg_button_invalid {
    opacity: 1 !important;
}

.wg_product_colors {
    height: 36px !important;
}

#wg_menucartcontainer {
    margin-bottom: 8px;
}

.wg_headercontainer .wg_contenttitle {
    margin-top: 40px;
    margin-bottom: 5px;
    color: var(--wg-customer-text-primary);
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-page-size);
    font-style: normal;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.2;
    opacity: 1;
    text-transform: none;
}

.wg_contenttitle a:hover {
    text-decoration: none;
    -ms-opacity: 0.7;
    opacity: 0.7;
}

.wg_headercontainer,
.wg_contentinfo {
    padding-bottom: 3px;
    padding-top: 3px;
}

.wg_headercontainer ul {
    width: 100%;
    padding: 0;
    text-align: center;
}

.wg_headermisc {
    display: block;
}

.wg_headercontainer li {
    display: inline-block;
    opacity: 0.7;
    font-size: 10px;
    margin-right: 10px;
}

@media (min-width: 768px) {
    .wg_maindropdown {
        min-width: 400px;
        width: 100%;
    }

    .wg_fitcontainerinfo img {
        max-height: 400px;
    }

    #wg_commonsitemenu .active,
    #wg_menucartcontainer.active {
        border-bottom: 2px solid #000;
        margin-left: 5px;
        margin-right: 5px;
    }

    #wg_commonsitemenu .active a,
    #wg_websitemenu .active a {
        background-color: #FFF;
        background-image: none;
        font-weight: 700;
        padding-bottom: 1px;
    }

    #wg_websitemenu .wg_mobilefeatured {
        margin-left: 5px;
        margin-right: 5px;
    }

    #wg_websitemenu .wg_mobilefeatured a {
        border-bottom: 2px solid #000;
        background-color: #FFF;
        background-image: none;
        font-weight: 700;
        padding-bottom: 1px;
    }

    #wg_header_container .alert-info {
        margin-top: 9px;
    }

    #wg_shoppingcartcontent {
        max-width: 550px;
        min-width: 550px;
        float: right;
    }
}

.wg_selectproductcolortitle {
    padding-left: 5px;
    text-transform: capitalize;
    text-align: left;
}

@media screen and (max-width: 767px) {

    #wg_navbar_products,
    #wg_navbar_splashscreen {
        background-color: #333;
        background-image: none;
        color: #fff;
        padding: 6px 10px;
    }

    .wg_maindropdown {
        min-width: 300px;
        width: 100%;
    }

    #wg_shoppingcartterms {
        font-size: 10px;
    }

    .wg_fitcontainerinfo img {
        max-height: 200px;
    }

    .wg_notification .wg_businesshours li {
        display: block;
    }

    .wg_notification #newsletter_submit {
        margin-top: 5px;
    }

    .wg_selectproductcolortitle {
        /* text-align: center;*/
    }

    #wg_commonsitemenu .wg_mobilefeatured a,
    #wg_commonsitemenu .wg_mobilefeatured a:hover {
        background-color: #333;
        background-image: none;
        color: #fff;
        padding: 6px 10px;
    }

    #wg_productimagecontainer .wg_primaryproductimage {
        max-height: 400px !important;
        max-width: 400px !important;
        -webkit-touch-callout: none;
        user-select: none;
    }

    #wg_paymentcontainer .btn-group {
        display: flex
    }

    #wg_purchasegroupbutton_left {
        width: 100% !important
    }

    #shoppingcartcontent {
        zoom: 0.9;
        /*Needed for very small phones.*/
    }
}

#wg_productimagecontainer .flickity-button:disabled {
    opacity: 0;
}

.wg_magnify .flickity-viewport {
    overflow: visible;
}

.wg_magnify .flickity-viewport .carousel-cell {
    display: none !important;
}

.wg_magnify .flickity-viewport .carousel-cell.is-selected {
    display: block !important;
}

.wg_image_banner {
    position: absolute;
    background: hsla(0, 0%, 0%, 0.7);
    z-index: 1;
    padding: 2px 20px;
    font-size: 18px;
    color: white;
    pointer-events: none;
}

.wg_image_banner {
    left: 50px;
    bottom: 50px;
}

#wg_magnifyglass {
    position: absolute;
    left: 0;
    bottom: 5px;
    padding: 5px 12px;
    color: #222;
    text-decoration: none;
    font-size: 13px;
    line-height: 20px;
    background-color: rgba(255, 255, 255, .92);
    border: 1px solid #d6d6d6;
    border-radius: 16px;
    display: none;
}

#wg_magnifyglass::before {
    content: "\f00e";
    font-family: FontAwesome;
    margin-right: 6px;
}

#wg_magnifyglass:hover,
#wg_magnifyglass:focus {
    border-color: #222;
    color: #222;
}

#mm_sizeimage,
.wg_customer-sizeguide-placeholder {
    text-align: left;
    margin-bottom: 10px;
    margin-top: 0;
    max-width: 85px;
    display: inline-block;
    color: #000;
    text-decoration: underline;
    font-size: 11px;
}

#wg_navbar_container #wg_navbar_top {
    display: none !important;
}

.mm_fixed-button {
    background-color: #de6458;
    display: none;
    color: #FFFFFF;
    border: none;
    outline: none;
    position: fixed;
    bottom: 0;
    right: 15px;
    padding-left: 6px;
    padding-right: 6px;
    height: 40px;
    width: 40px;
    margin-bottom: 20px;
    border-radius: 30px;
    box-shadow: 1px 3px 5px #888888;
    z-index: 999;
}

.mm_supportimage {
    width: 35px;
    height: 35px;
    display: block;
    margin-left: -3px;
    margin-top: -2px;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9ItCh0LvQvtC5XzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgNDkuOSA0My45IiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA0OS45IDQzLjk7IiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPi5zdDB7ZmlsbDojRkZGRkZGO30uc3Qxe2ZpbGw6bm9uZTtzdHJva2U6I0ZGRkZGRjtzdHJva2Utd2lkdGg6MztzdHJva2UtbGluZWNhcDpyb3VuZDtzdHJva2UtbGluZWpvaW46cm91bmQ7c3Ryb2tlLW1pdGVybGltaXQ6MTA7fTwvc3R5bGU+PGc+PHBhdGggY2xhc3M9InN0MCIgZD0iTTQyLjYsMTYuNmMtMC4xLDAtMC4xLDAtMC4yLDBDNDIuMSw2LDM1LjctMC4yLDIzLjksMGMtMC4zLDAtMS4zLDAuMS0xLjMsMC4xQzExLjYsMC44LDUuNyw2LjksNS43LDE3LjVDMi41LDE4LjIsMCwyMS4yLDAsMjVjMCw0LjIsMy4xLDcuNiw2LjksNy42YzAuMSwwLDAuMSwwLDAuMiwwaDEuMVYxNy43QzguMiw4LDEzLjUsMywyMy45LDIuNmMwLjIsMCwwLjcsMCwxLDBjMTAsMC4xLDE1LDUuNiwxNSwxNS4xdjEzYzAsNS4zLTQuNiw4LjgtOC45LDguOGgtMy4yYy0wLjUtMS4xLTEuNi0xLjktMi45LTEuOWMtMS44LDAtMy4yLDEuNC0zLjIsMy4yYzAsMS44LDEuNCwzLjIsMy4yLDMuMmMxLjMsMCwyLjUtMC44LDIuOS0ySDMxYzUuNSwwLDEwLjMtNC4xLDExLjMtOS40YzAuMSwwLDAuMiwwLDAuMywwYzQsMCw3LjMtMy42LDcuMy03LjlDNDkuOSwyMC4yLDQ2LjYsMTYuNiw0Mi42LDE2LjZ6Ii8+PGc+PGVsbGlwc2UgY2xhc3M9InN0MCIgY3g9IjE5IiBjeT0iMTYuOCIgcng9IjEuMiIgcnk9IjIuMiIvPjxlbGxpcHNlIGNsYXNzPSJzdDAiIGN4PSIzMC45IiBjeT0iMTYuOCIgcng9IjEuMiIgcnk9IjIuMiIvPjxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik0zMC40LDIyLjdjMCwwLTEuOCwxLjktNS40LDEuOWMtMy45LDAtNS40LTEuOS01LjQtMS45Ii8+PC9nPjwvZz48L3N2Zz4=);
    background-position: center center;
    background-repeat: no-repeat;
}

@keyframes wobble {
    16.65% {
        -webkit-transform: translateY(8px);
        -ms-transform: translateY(8px);
        transform: translateY(8px);
    }

    33.3% {
        -webkit-transform: translateY(-6px);
        -ms-transform: translateY(-6px);
        transform: translateY(-6px);
    }

    49.95% {
        -webkit-transform: translateY(4px);
        -ms-transform: translateY(4px);
        transform: translateY(4px);
    }

    66.6% {
        -webkit-transform: translateY(-2px);
        -ms-transform: translateY(-2px);
        transform: translateY(-2px);
    }

    83.25% {
        -webkit-transform: translateY(1px);
        -ms-transform: translateY(1px);
        transform: translateY(1px);
    }

    100% {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}

.mm_wobble {
    -webkit-animation-name: wobble;
    animation-name: wobble;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
}

#wg_productactionmessage {
    display: none !important;
}

#wg_shoppingcartinfo .fa-shopping-cart:after,
#wg_navbar_cart .fa-shopping-cart:after {
    background-color: #de6458 !important;
    border-color: #de6458 !important;
}

.wg_productgalleryimagetext {
    height: 15px;
    display: block;
}

#wg_shoppingcartitem_header {
    display: none;
}

.wg_pricenew,
#wg_productorginalprice,
#wg_currentproductprice {
    text-transform: uppercase;
}

#wg_productdescription .nav > li > a {
    padding: 5px 7px;
    text-decoration: underline;
}

#wg_productdescription .nav-tabs > li.active > a {
    text-decoration: none !important;
}

#wg_productdescription .tab-content {
    margin-top: 10px;
}

#wg_productdescription .wg_featureslist {
    margin-bottom: 5px;
    position: relative;
}

.wg_featureslist ul {
    padding-left: 20px;
}

.wg_productimage {
    display: inline-block;
    border: 1px solid #a5a5a5;
    /* opacity: 0.8;*/
    margin-right: 3px;
    margin-top: 3px;
    position: relative;
}

.wg_productsize {
    display: inline-block;
    /*  opacity: 0.8;*/
    margin-right: 3px;
    position: relative;
}

.wg_productimage.wg_product_active {
    opacity: 1;
    border: 1px solid black;
    background-color: #de6458 !important;
    color: #fff !important;
}

.wg_productimage.wg_product_active:before,
.wg_productsize.wg_product_active:before {
    opacity: 1;
    content: "";
    position: absolute;
    background: #de6458;
    top: -5px;
    right: -5px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    z-index: 99;
}

.wg_productimage a {
    text-align: center;
}

.wg_productimages,
.wg_productsizes {
    padding-left: 0;
}

.wg_productimages {
    min-height: 77px;
}

.wg_productsizes {
    min-height: 66px;
    margin-bottom: 0;
}

.wg_productsize div {
    opacity: 0.8;
    height: 45px;
    width: 45px;
    line-height: 45px;
    text-align: center;
    position: relative;
    font-size: 15px;
    cursor: pointer;
    border: 1px solid #a5a5a5;
    overflow: hidden;
}

.wg_productsize.wg_product_active div {
    opacity: 1;
    border: 1px solid black;
}

.wg_productsize.wg_product_active {
    opacity: 1;
}

.wg_productsize span {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 11px;
}

.wg_sizecolortitle {
    font-size: 15px;
    font-weight: bold;
}

#wg_product_colortitle {
    margin-top: 10px;
}

.wg_productsizename,
.wg_productcolorname {
    font-weight: normal;
    font-size: 12px;
}

.wg_productcatalog_description {
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 50px;
}

#wg_product_description_tab,
#wg_product_info_tab {
    max-height: 150px;
    overflow-y: auto;
    position: relative;
}

.wg_productcatalog_description::-webkit-scrollbar-track,
#wg_product_description_tab::-webkit-scrollbar-track,
#wg_product_info_tab::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    background-color: #F5F5F5;
}

.wg_productcatalog_description::-webkit-scrollbar,
#wg_product_description_tab::-webkit-scrollbar,
#wg_product_info_tab::-webkit-scrollbar {
    width: 6px;
    background-color: #F5F5F5;
}

.wg_productcatalog_description::-webkit-scrollbar-thumb,
#wg_product_description_tab::-webkit-scrollbar-thumb,
#wg_product_info_tab::-webkit-scrollbar-thumb {
    background-color: #000000;
}

#wg_productselectgrid {
    display: none !important;
}

.wg_fithidden {
    display: none;
}

.wg_fitactive {
    display: block;
}

.wg_fitcontainer {
    display: block;
    padding-left: 0 !important;
}

.wg_fitcontainerinfo {
    display: block;
    padding-left: 0 !important;
    text-align: center;
}

.wg_fitcontainer li,
.wg_fitcontainerinfo li {
    margin-right: 3px;
    cursor: pointer;
    display: inline-block;
}

.flickity-enabled .flickity-viewport .is-selected .wg_image {
    cursor: move;
    cursor: -webkit-grab;
    cursor: pointer;
}

.wg_image {
    -webkit-touch-callout: none;
    user-select: none;
}

#wg_productimagecontainer .flickity-viewport {
    max-height: 500px;
}

@media screen and (max-width: 767px) {
    #wg_productimagecontainer .flickity-viewport {
        max-height: 400px;
    }
}

video::-webkit-media-controls-panel {
    background-image: none !important;
    filter: brightness(0.4);
}

#lp_colorlinks {
    text-align: left;
    margin-left: 0;
    padding-left: 0;
    position: relative;
    width: auto;
}

body#wg_mainbody .wg_productcatalog_headercontainer .wg_productcatalog_header {
    font-size: 28px;
    line-height: 1.05;
    margin-bottom: -2px;
}

.wg_productcatalog_headercontainer .wg_productcatalog_description {
    max-height: none;
    overflow: visible;
}

#lp_colorlinks .flickity-viewport {
    height: 66px !important;
}

#lp_colorlinks .carousel-catalog-cell {
    border: 0;
    border-radius: 3px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    height: 66px !important;
    width: 68px !important;
}

#lp_colorlinks .carousel-catalog-cell img {
    display: block;
    flex: 0 0 51px;
    height: 51px;
    margin: 0;
    object-fit: contain;
    width: 68px;
}

body#wg_mainbody #lp_colorlinks .carousel-catalog-cell-title {
    display: block;
    flex: 0 0 15px;
    font-size: 13px;
    height: 15px;
    line-height: 15px;
    margin: 0;
    overflow: visible;
    padding: 0;
    position: static;
    text-overflow: clip;
    width: 100%;
}

#lp_colorlinks .carousel-catalog-cell.wg_carousel_active.is-selected {
    background: #f2f2f2;
    border-color: transparent;
    overflow: visible;
}

#lp_colorlinks .carousel-catalog-cell.wg_carousel_active.is-selected::before {
    align-items: center;
    background: #242424;
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .24);
    box-sizing: border-box;
    color: #fff;
    content: "\f00c";
    display: flex;
    font-family: FontAwesome;
    font-size: 10px;
    font-style: normal;
    font-weight: normal;
    height: 18px;
    justify-content: center;
    line-height: 1;
    pointer-events: none;
    position: absolute;
    right: -2px;
    top: -2px;
    width: 18px;
    z-index: 2;
}

.mm_liststyle {
    text-align: left;
    margin: 5px;
    padding: 10px;
    border: 1px solid black;
}

.mm_liststyle li {
    padding-left: 0;
    margin-left: 20px;
    list-style: none;
    line-height: 25px;
    list-style-position: outside;
    margin-top: 3px;
    margin-bottom: 3px;
}

.mm_liststyle li:before {
    content: '\00b7';
    font-size: 60px;
    vertical-align: middle;
    margin-left: -25px;
    padding-right: 10px;
    line-height: 25px;
}

.cc-buttons .cc-btn-reject,
.cc-buttons .cc-btn-settings {
    display: none;
}

.cc-title {
    padding: 6px 0 4px 0 !important;
}

.flickity-slider {
    -webkit-overflow-scrolling: touch;
}


#wg_sccountry_container,
#wg_currentcountry,
#wg_countrylist,
.wg_customer-cart-field:has(#wg_sccountry_container) {
    display: none !important;
}

@media screen and (min-width: 851px) {
    #wg_customer-shoppingcart .wg_customer-cart-field:has(#wg_address1) {
        grid-column: span 2;
    }
}

#wg_paymentcontainer .dropdown-menu {
    padding: 0;
    outline: 1px solid;
}

#wg_paymentcontainer .dropdown-menu .divider {
    margin: 0;
}

#wg_paymentcontainer li:has(a#wg_purchase_bambora),
#wg_paymentcontainer li:has(a#wg_purchase_dintero) {
    background-color: cornsilk;
    text-align: center;
}

#wg_paymentcontainer #wg_purchase_bambora,
#wg_paymentcontainer #wg_purchase_dintero {
    font-weight: 900;
}

/* Mette Moller storefront footer. Admin continues to own the menu groups and links. */
body.mm_storefront-footer-ready {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
}

body.mm_storefront-footer-ready #wg_theme {
    flex: 1 0 auto;
}

body.mm_storefront-footer-ready #wg_webpagecontainer {
    padding-bottom: 0 !important;
}

#wg_sitefooter.mm_storefront-footer {
    background: #fff;
    bottom: auto;
    display: block;
    left: auto;
    margin: 48px auto 0;
    max-width: 1170px;
    position: relative;
    right: auto;
    width: 100%;
}

#wg_sitefooter.mm_storefront-footer .wg_footercontent,
#wg_sitefooter.mm_storefront-footer .wg_footercontent a,
#wg_sitefooter.mm_storefront-footer .wg_footercontent a:hover {
    background: transparent;
    color: #171717;
}

#wg_sitefooter.mm_storefront-footer .wg_footercontent {
    font-family: 'Crimson Text', serif;
    font-size: 15px;
    padding: 0;
}

#wg_sitefooter.mm_storefront-footer .container {
    max-width: none;
    padding-left: 16px;
    padding-right: 16px;
    width: 100%;
}

.mm_footer-newsletter {
    align-items: center;
    border-top: 1px solid #aaa5a3;
    display: grid;
    gap: 32px;
    grid-template-columns: minmax(220px, .8fr) minmax(360px, 1.3fr);
    padding: 28px 16px 30px;
}

.mm_footer-newsletter h2 {
    color: #171717;
    font-family: 'Crimson Text', serif;
    font-size: 27px;
    font-weight: 400;
    line-height: 1.1;
    margin: 0 0 8px;
}

.mm_footer-newsletter p {
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-component-size);
    font-weight: 400;
    line-height: 1.5;
    margin: 0;
    max-width: 360px;
}

.mm_footer-newsletter-form {
    display: grid;
    grid-template-areas:
        "field action"
        "message message";
    grid-template-columns: minmax(0, 1fr) auto;
}

.mm_footer-newsletter-form input {
    background: #fff;
    border: 1px solid #c7c1bf;
    border-radius: 0;
    color: #171717;
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-control-size);
    font-weight: 400;
    line-height: 1.35;
    grid-area: field;
    height: 48px;
    min-width: 0;
    padding: 0 16px;
    width: 100%;
}

.mm_footer-newsletter-form input:focus {
    border-color: #171717;
    outline: 1px solid #171717;
    outline-offset: -2px;
}

.mm_footer-newsletter-form button {
    background: #262324 !important;
    border: 1px solid #262324 !important;
    border-radius: 0;
    color: #fff !important;
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-control-size);
    font-weight: 500;
    grid-area: action;
    height: 48px;
    letter-spacing: .2px;
    min-width: 102px;
    padding: 0 22px;
    text-transform: uppercase;
}

.mm_footer-newsletter-form .wg_customer-field-message {
    grid-area: message;
}

.mm_footer-newsletter-form button:hover,
.mm_footer-newsletter-form button:focus {
    background: #000 !important;
    border-color: #000 !important;
}

#wg_sitefooter.mm_storefront-footer #wg_footermenucontainer {
    padding-bottom: 28px;
    padding-top: 24px;
}

/* Keep the legacy footer menu markup available to the server and setup script, but do not render it. */
#wg_sitefooter #wg_footermenucontainer {
    display: none !important;
}

#wg_sitefooter.mm_storefront-footer #wg_footermenucontainer > .row {
    display: grid;
    gap: 28px;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    margin: 0;
}

#wg_sitefooter.mm_storefront-footer .wg_footerwidget {
    float: none;
    min-height: 0;
    padding: 0;
    text-align: left;
    width: auto;
}

#wg_sitefooter.mm_storefront-footer .wg_footerwidget.mm_footerwidget-empty {
    display: none;
}

#wg_sitefooter.mm_storefront-footer .wg_footerwidget .wg_customer-footer-title {
    color: #171717;
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-eyebrow-size);
    font-weight: 600;
    letter-spacing: .08em;
    line-height: 1.25;
    margin: 0 0 12px;
    min-height: 15px;
    text-transform: uppercase;
}

#wg_sitefooter.mm_storefront-footer .wg_footerwidget .wg_customer-footer-title span {
    font: inherit;
    padding: 0;
}

#wg_sitefooter.mm_storefront-footer .wg_footerwidget > ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#wg_sitefooter.mm_storefront-footer .wg_footerwidget > ul > li {
    line-height: 1.35;
    margin: 0 0 6px;
}

#wg_sitefooter.mm_storefront-footer .wg_footerwidget > ul > li > a {
    text-decoration: none;
}

#wg_sitefooter.mm_storefront-footer .wg_footerwidget > ul > li > a:hover,
#wg_sitefooter.mm_storefront-footer .wg_footerwidget > ul > li > a:focus {
    text-decoration: underline;
}

#wg_sitefooter.mm_storefront-footer .wg_socialicons > ul {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

#wg_sitefooter.mm_storefront-footer .wg_socialicons > ul > li {
    display: block;
    margin: 0;
}

#wg_sitefooter.mm_storefront-footer .wg_socialicons > ul > li > a {
    align-items: center;
    background: #242424;
    border-radius: 50%;
    color: #fff;
    display: inline-flex;
    height: 34px;
    justify-content: center;
    width: 34px;
}

#wg_sitefooter.mm_storefront-footer .wg_socialicons .fa-3x {
    font-size: 17px;
}

.mm_footer-assurances {
    border-bottom: 1px solid #aaa5a3;
    border-top: 1px solid #aaa5a3;
    padding: 18px 16px;
}

.mm_footer-assurances ul {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    list-style: none;
    margin: 0;
    padding: 0;
}

.mm_footer-assurances li {
    align-items: center;
    display: flex;
    gap: 13px;
    justify-content: center;
    min-width: 0;
}

.mm_footer-assurances .fa {
    color: #805043;
    flex: 0 0 30px;
    font-size: 24px;
    text-align: center;
}

.mm_footer-assurances strong,
.mm_footer-assurances small {
    display: block;
}

.mm_footer-assurances strong {
    font-family: var(--wg-customer-font-ui);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.25;
    text-transform: uppercase;
}

.mm_footer-assurances small {
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-meta-size);
    font-weight: 400;
    line-height: 1.4;
}

.mm_footer-payment-methods {
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    gap: clamp(10px, 4vw, 28px);
    justify-content: center;
    min-height: 64px;
    padding: 14px 10px;
}

.mm_payment-brand {
    align-items: center;
    color: #222;
    display: inline-flex;
    font-family: Arial, sans-serif;
    font-size: 17px;
    font-weight: 700;
    line-height: 1;
}

.mm_payment-logo {
    display: block;
    flex: 0 0 auto;
    max-width: none;
}

.mm_payment-vipps {
    background: #ff5b24;
    border-radius: 4px;
    padding: 4px 7px;
}

.mm_payment-logo-vipps {
    height: 16px;
    width: 64px;
}

.mm_payment-logo-visa {
    height: 15px;
    width: 46px;
}

.mm_payment-logo-mastercard {
    height: 24px;
    width: 34px;
}

.mm_payment-worldline {
    color: #16a5a5;
    flex-direction: column;
    font-size: 16px;
}

.mm_payment-worldline small {
    color: #777;
    font-size: 8px;
    font-weight: 400;
    margin-bottom: 2px;
}

#wg_sitefooter.mm_storefront-footer #wg_footercompanyinfo {
    display: none;
}

/* Installable app: footer link, phone banner and the Add to Home Screen guide (scripts/app-install.ts). */
.mm_footer-app {
    display: flex;
    justify-content: center;
    padding: 0 10px 18px;
}

.mm_footer-app[hidden] {
    display: none;
}

.mm_footer-app-install {
    align-items: center;
    background: none;
    border: 0;
    color: #222;
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: var(--wg-customer-type-meta-size);
    gap: 8px;
    line-height: 1.4;
    padding: 6px 4px;
}

.mm_footer-app-install span {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.mm_footer-app-install .fa {
    font-size: 20px;
}

.mm_app-banner {
    align-items: center;
    background: #fff;
    border: 1px solid #e2e2e2;
    border-radius: 8px;
    bottom: max(12px, env(safe-area-inset-bottom));
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.16);
    box-sizing: border-box;
    display: flex;
    gap: 12px;
    left: 12px;
    padding: 10px 6px 10px 12px;
    position: fixed;
    right: 12px;
    z-index: 1030;
}

.mm_app-banner-icon {
    border: 1px solid #ececec;
    border-radius: 10px;
    flex: 0 0 auto;
    height: 44px;
    width: 44px;
}

.mm_app-banner-copy {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 2px;
    line-height: 1.3;
    margin: 0;
    min-width: 0;
}

.mm_app-banner-copy strong {
    color: #222;
    font-size: 15px;
}

.mm_app-banner-copy span {
    color: #555;
    font-size: 13px;
}

.mm_app-banner-install {
    background: #222;
    border: 0;
    border-radius: 4px;
    color: #fff;
    flex: 0 0 auto;
    font-family: inherit;
    font-weight: 600;
    min-height: 40px;
    padding: 8px 14px;
}

/* While the banner is open, the floating contact button sits above it instead of under it. */
body.mm_app-banner-open .mm_fixed-button {
    bottom: calc(var(--mm-app-banner-height, 0px) + 12px);
}

@media screen and (max-width: 359px) {
    .mm_app-banner {
        gap: 8px;
        padding-left: 10px;
    }

    .mm_app-banner-copy span {
        display: none;
    }
}

.mm_app-banner-close {
    align-items: center;
    background: none;
    border: 0;
    color: #555;
    display: inline-flex;
    flex: 0 0 auto;
    height: 40px;
    justify-content: center;
    padding: 0;
    width: 36px;
}

.mm_app-guide-icon {
    border: 1px solid #ececec;
    border-radius: 14px;
    display: block;
    height: 64px;
    margin: 0 auto 16px;
    width: 64px;
}

.mm_app-guide-steps {
    display: table;
    margin: 16px auto 0;
    padding-left: 1.4em;
    text-align: left;
}

.mm_app-guide-steps li {
    line-height: 1.5;
    margin-bottom: 8px;
}

.mm_app-guide-share {
    display: inline-block;
    margin: 0 2px;
    vertical-align: -3px;
}
@media screen and (max-width: 767px) {
    body#wg_mainbody {
        --wg-customer-type-page-size: 27px;
        --wg-customer-type-dialog-size: 31px;
        --wg-customer-type-display-size: 25px;
        --wg-customer-type-section-size: 18px;
        --wg-customer-type-subsection-size: 16px;
        --wg-customer-type-navigation-size: 12px;
    }

    #wg_sitefooter.mm_storefront-footer {
        margin-top: 36px;
    }

    .mm_footer-newsletter {
        gap: 20px;
        grid-template-columns: 1fr;
        padding-left: 12px;
        padding-right: 12px;
    }

    .mm_footer-newsletter p {
        max-width: none;
    }

    #wg_sitefooter.mm_storefront-footer #wg_footermenucontainer {
        padding-left: 12px;
        padding-right: 12px;
    }

    .mm_footer-assurances ul {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mm_footer-assurances li {
        justify-content: flex-start;
    }
}

@media screen and (max-width: 479px) {
    .mm_footer-newsletter-form {
        grid-template-areas:
            "field"
            "message"
            "action";
        grid-template-columns: 1fr;
    }

    .mm_footer-newsletter-form button {
        width: 100%;
    }

    #wg_sitefooter.mm_storefront-footer #wg_footermenucontainer > .row {
        grid-template-columns: 1fr;
    }

    .mm_footer-payment-methods {
        gap: 10px;
    }
}

.mm_added-notification {
    bottom: max(18px, env(safe-area-inset-bottom));
    box-sizing: border-box;
    left: 50%;
    max-width: calc(100vw - 24px);
    opacity: 0;
    position: fixed;
    transform: translate(-50%, 8px);
    transition: opacity 160ms ease, transform 160ms ease;
    width: max-content;
    z-index: 1400;
}

.mm_added-notification.is-visible {
    opacity: 1;
    transform: translate(-50%, 0);
}

.mm_added-notification > a {
    align-items: center;
    background: #242424;
    border: 1px solid #242424;
    border-radius: 4px;
    box-shadow: 0 5px 18px rgba(0, 0, 0, .22);
    color: #fff !important;
    display: flex;
    font-family: var(--wg-customer-font-ui);
    font-size: 13px;
    gap: 10px;
    min-height: 48px;
    padding: 10px 15px;
    text-decoration: none !important;
}

.mm_added-notification > a:hover,
.mm_added-notification > a:focus-visible {
    background: #111;
    border-color: #fff;
    outline: 2px solid #111;
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    .mm_added-notification {
        transform: translate(-50%, 0);
        transition: none;
    }
}

/* Custom Made storefront configurator. */
body#wg_mainbody .wg_custommade {
    box-sizing: border-box;
    color: #292522;
    margin: 0 auto;
    max-width: 1240px;
    padding: 44px 30px 72px;
    width: 100%;
}

.wg_custommade *,
.wg_custommade *::before,
.wg_custommade *::after {
    box-sizing: border-box;
}

.wg_custommade-header {
    margin: 0 auto 42px;
    max-width: 760px;
    text-align: center;
}

.wg_custommade-header .wg_customer-type-page-title {
    margin-bottom: 14px;
}

.wg_custommade-intro {
    font-size: 16px;
    line-height: 1.65;
    margin: 0;
}

.wg_custommade-status:empty {
    display: none;
}

.wg_custommade-status:not(:empty) {
    margin: 0 auto 28px;
    max-width: 760px;
    padding: 14px 18px;
    text-align: center;
}

.wg_custommade-product-picker {
    border-bottom: 1px solid #dedad6;
    margin-bottom: 42px;
    padding-bottom: 34px;
}

.wg_custommade-product-picker > h2 {
    margin: 0 0 18px;
}

.wg_custommade-product-carousel {
    min-height: 126px;
    padding: 0 46px;
}

.wg_custommade-product-carousel:not(.flickity-enabled) {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    padding: 0 0 12px;
}

.wg_custommade-product-slide {
    margin-right: 14px;
    width: min(210px, 68vw);
}

.wg_custommade-product-slide > button {
    align-items: center;
    background: #fff;
    border: 1px solid #dedad6;
    border-radius: 5px;
    color: #292522;
    cursor: pointer;
    display: grid;
    gap: 10px;
    grid-template-columns: 64px minmax(0, 1fr);
    min-height: 106px;
    padding: 10px;
    position: relative;
    text-align: left;
    transition: border-color 160ms ease, box-shadow 160ms ease;
    width: 100%;
}

.wg_custommade-product-slide > button:hover,
.wg_custommade-product-slide > button:focus-visible,
.wg_custommade-product-slide > button[aria-current="true"] {
    border-color: #393532;
}

.wg_custommade-product-slide > button[aria-current="true"] {
    box-shadow: inset 0 0 0 1px #393532;
}

.wg_custommade-product-slide > button[aria-current="true"]::after {
    align-items: center;
    background: #242424;
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .24);
    color: #fff;
    content: "\2713";
    display: flex;
    font-size: 12px;
    font-weight: 700;
    height: 23px;
    justify-content: center;
    line-height: 1;
    position: absolute;
    right: 4px;
    top: 4px;
    width: 23px;
    z-index: 2;
}

.wg_custommade-product-slide img {
    background: #f4f2f0;
    height: 84px;
    object-fit: cover;
    width: 64px;
}

.wg_custommade-product-slide span {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
}

.wg_custommade-layout {
    align-items: start;
    display: grid;
    gap: clamp(34px, 5vw, 72px);
    grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
}

/* The storefront nav becomes a fixed 64px bar on scroll; keep the gallery below it. */
.wg_custommade-media {
    min-width: 0;
    padding-bottom: 34px;
    position: sticky;
    top: 88px;
}

.wg_custommade-image-carousel {
    background: #fff;
    min-height: 500px;
    overflow: hidden;
}

.wg_custommade-image-slide {
    align-items: flex-start;
    display: flex;
    justify-content: center;
    width: 100%;
}

.wg_custommade-image-slide img {
    display: block;
    height: 500px;
    max-width: 100%;
    object-fit: contain;
    object-position: center top;
    width: 100%;
}

.wg_custommade-image-carousel .flickity-viewport {
    max-height: 500px;
}

/* Thumbnail dots scroll sideways so every image stays reachable. */
.wg_custommade-image-carousel .flickity-page-dots {
    display: flex;
    gap: 6px;
    justify-content: safe center;
    margin: 8px 0 0;
    overflow-x: auto;
    padding: 3px;
    position: static;
    scrollbar-width: thin;
}

.wg_custommade-image-carousel .flickity-page-dots .dot,
.wg_custommade-image-carousel .flickity-page-dots .flickity-page-dot {
    background-color: #fff;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    border: 1px solid #dedede;
    border-radius: 0;
    flex: 0 0 auto;
    height: 48px;
    margin: 0;
    opacity: .65;
    width: 32px;
}

.wg_custommade-image-carousel .flickity-page-dots .dot[hidden],
.wg_custommade-image-carousel .flickity-page-dots .flickity-page-dot[hidden] {
    display: none;
}

.wg_custommade-image-carousel .flickity-page-dots .dot.is-selected,
.wg_custommade-image-carousel .flickity-page-dots .flickity-page-dot.is-selected {
    opacity: 1;
    outline: 2px solid #111;
    outline-offset: 1px;
}

.wg_custommade-image-carousel .flickity-button:focus,
.wg_custommade-image-carousel .flickity-page-dots .dot:focus,
.wg_custommade-image-carousel .flickity-page-dots .flickity-page-dot:focus {
    box-shadow: none;
    outline: 2px solid #111;
    outline-offset: 1px;
}

.wg_custommade-image-carousel .flickity-button:disabled {
    opacity: 0;
}

.wg_custommade-image-carousel .flickity-button,
.wg_custommade-product-carousel .flickity-button {
    background: rgba(255, 255, 255, .92);
    border: 1px solid #dedad6;
}

.wg_custommade-product-carousel .flickity-button:disabled {
    opacity: 0;
}

/* Under the photo on wide screens, where portrait photos leave empty space beside them;
   phones overlay it on the photo (see the 600px query). */
.wg_custommade-zoom {
    align-items: center;
    background: rgba(255, 255, 255, .94);
    border: 1px solid #c9c4c0;
    border-radius: 999px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .12);
    color: #292522;
    cursor: pointer;
    display: flex;
    font-size: 13px;
    font-weight: 600;
    margin: 12px auto 0;
    min-height: 40px;
    padding: 8px 18px;
    position: relative;
    z-index: 4;
}

.wg_custommade-zoom:hover,
.wg_custommade-zoom:focus-visible {
    background: #fff;
    border-color: #292522;
    color: #292522;
}

.wg_custommade-zoom[aria-pressed="true"] {
    background: #292522;
    border-color: #292522;
    color: #fff;
}

.wg_custommade-zoom:disabled {
    display: none;
}

.wg_custommade-zoom-hint {
    background: rgba(0, 0, 0, .7);
    border-radius: 4px;
    color: #fff;
    font-size: 15px;
    left: 50%;
    max-width: calc(100% - 24px);
    padding: 4px 14px;
    pointer-events: none;
    position: absolute;
    text-align: center;
    top: 16px;
    transform: translateX(-50%);
    z-index: 3;
}

.wg_custommade-media--zoomed .wg_custommade-image-carousel,
.wg_custommade-media--zoomed .flickity-viewport {
    overflow: visible;
}

.wg_custommade-media--zoomed .flickity-viewport .carousel-cell {
    display: none !important;
}

.wg_custommade-media--zoomed .flickity-viewport .carousel-cell.is-selected {
    display: flex !important;
}

.wg_custommade-media--zoomed .magnify {
    display: block;
    width: 100%;
}

/* Touch zoom: the enlarged photo stays inside its frame and follows the finger. */
.wg_custommade-media--panzoom .wg_custommade-image-carousel,
.wg_custommade-media--panzoom .flickity-viewport,
.wg_custommade-media--panzoom .wg_custommade-image-slide {
    overflow: hidden;
}

.wg_custommade-media--panzoom .wg_custommade-image-carousel {
    touch-action: none;
}

.wg_custommade-media--panzoom [data-custom-made-image] {
    cursor: zoom-out;
}

.wg_custommade-details > .wg_customer-type-eyebrow {
    margin-bottom: 8px;
}

.wg_custommade-details > .wg_customer-type-display-title {
    margin: 0 0 8px;
}

.wg_custommade-price {
    font-size: 22px;
    font-weight: 600;
    letter-spacing: .02em;
    margin: 0 0 8px;
}

.wg_custommade-delivery {
    color: #625d59;
    font-size: 14px;
    margin: 0 0 24px;
}

.wg_custommade-fit-trigger {
    appearance: none;
    background: transparent;
    border: 0;
    cursor: pointer;
    padding: 0;
}

.wg_custommade-accordions {
    border: 1px solid #d9d9d9;
    border-radius: 5px;
    display: block;
    font-family: inherit;
    font-size: 13px;
    margin-top: clamp(30px, 4vw, 52px);
    overflow: hidden;
    width: 100%;
}

.wg_custommade-accordion-item + .wg_custommade-accordion-item {
    border-top: 1px solid #d9d9d9;
}

.wg_custommade-accordion-button {
    background: #fff;
    border: 0;
    color: #111;
    display: block;
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-control-size);
    font-weight: 500;
    height: 43px;
    letter-spacing: 0;
    line-height: 1.35;
    padding: 0 45px 0 17px;
    position: relative;
    text-align: left;
    width: 100%;
}

.wg_custommade-accordion-button::after {
    border-bottom: 1.5px solid #111;
    border-right: 1.5px solid #111;
    content: "";
    height: 7px;
    position: absolute;
    right: 18px;
    top: 16px;
    transform: rotate(45deg);
    transition: transform .2s ease;
    width: 7px;
}

.wg_custommade-accordion-button[aria-expanded="true"]::after {
    transform: rotate(225deg);
}

.wg_custommade-accordion-content {
    line-height: 1.65;
    max-height: none;
    overflow: visible;
    padding: 3px 17px 18px;
    position: static;
}

.wg_custommade-accordion-content[hidden] {
    display: none !important;
}

.wg_custommade-accordion-content > :last-child {
    margin-bottom: 0;
}

.wg_custommade-fabric-description {
    margin: 0 0 18px;
}

.wg_custommade-fabric-description:empty,
.wg_custommade-fit:empty {
    display: none;
}

.wg_custommade-fieldset {
    border: 0;
    margin: 30px 0 0;
    min-width: 0;
    padding: 0;
}

/* Bootstrap floats legends and clears only the next sibling; keep the options below the heading. */
.wg_custommade-fieldset > legend {
    border: 0;
    color: inherit;
    float: none;
    margin: 0 0 14px;
    padding: 0;
    width: auto;
}

.wg_custommade-fabric-options {
    align-items: flex-start;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.wg_custommade-fabric-option {
    align-items: center;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    margin: 0;
    position: relative;
    width: 72px;
}

.wg_custommade-fabric-option:has(input:checked)::after {
    align-items: center;
    background: #242424;
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .24);
    color: #fff;
    content: "\2713";
    display: flex;
    font-size: 12px;
    font-weight: 700;
    height: 22px;
    justify-content: center;
    line-height: 1;
    pointer-events: none;
    position: absolute;
    right: -3px;
    top: -3px;
    width: 22px;
    z-index: 2;
}

.wg_custommade-fabric-option > input {
    height: 1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    width: 1px;
}

.wg_custommade-fabric-option > .wg_custommade-swatch {
    background: #f4f2f0;
    border: 1px solid #dedede;
    border-radius: 5px;
    display: block;
    height: 80px;
    transition: border-color 140ms ease, box-shadow 140ms ease, opacity 140ms ease;
    width: 72px;
}

.wg_custommade-fabric-option:not(:has(input:disabled)):hover > .wg_custommade-swatch {
    border-color: #666;
}

.wg_custommade-fabric-option > input:checked + .wg_custommade-swatch {
    border: 2px solid #111;
}

.wg_custommade-fabric-option > input:focus-visible + .wg_custommade-swatch {
    box-shadow: 0 0 0 3px rgba(39, 109, 125, .28);
    outline: 2px solid #276d7d;
    outline-offset: 2px;
}

.wg_custommade-fabric-option > input:focus-visible {
    outline: 0;
}

.wg_custommade-fabric-option:has(input:disabled) {
    cursor: not-allowed;
}

.wg_custommade-fabric-option:has(input:disabled) > .wg_custommade-swatch,
.wg_custommade-fabric-option:has(input:disabled) > .wg_custommade-fabric-name {
    opacity: .45;
}

/* Sold out: a diagonal line across the swatch plus a text label. */
.wg_custommade-fabric-option:has(input:disabled) > .wg_custommade-swatch {
    background-image: linear-gradient(to top right, transparent calc(50% - 1px), #fff calc(50% - 1px), #fff calc(50% + 1px), transparent calc(50% + 1px));
}

.wg_custommade-fabric-name {
    display: block;
    font-size: 12px;
    line-height: 1.3;
    margin-top: 5px;
    max-width: 100%;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 72px;
}

.wg_custommade-fabric-sold-out {
    color: #9c2634;
    display: block;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.3;
    text-align: center;
}

.wg_custommade-selected-value {
    font-size: 14px;
    font-weight: 600;
    margin: -6px 0 12px;
}

.wg_custommade-selected-value[hidden] {
    display: none;
}

.wg_custommade-empty-option {
    color: #625d59;
    grid-column: 1 / -1;
    margin: 0;
}

.wg_custommade-size-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.wg_custommade-size-option {
    cursor: pointer;
    margin: 0;
    position: relative;
}

.wg_custommade-size-option > input {
    height: 1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    width: 1px;
}

.wg_custommade-size-option > span {
    align-items: center;
    background: #fff;
    border: 1px solid #c9c4c0;
    cursor: pointer;
    display: inline-flex;
    height: 46px;
    justify-content: center;
    min-width: 50px;
    padding: 0 10px;
}

.wg_custommade-size-option:hover > input:not(:checked) + span {
    border-color: #292522;
}

.wg_custommade-size-option > input:checked + span {
    background: #292522;
    border-color: #292522;
    color: #fff;
}

.wg_custommade-acknowledgement {
    align-items: start;
    display: grid;
    gap: 5px 10px;
    grid-template-columns: auto minmax(0, 1fr);
    margin-top: 30px;
}

.wg_custommade-acknowledgement > input {
    accent-color: #292522;
    grid-column: 1;
    grid-row: 1;
    height: 20px;
    margin: 1px 0 0;
    width: 20px;
}

.wg_custommade-acknowledgement > label {
    cursor: pointer;
    font-size: 14px;
    grid-column: 2;
    grid-row: 1;
    line-height: 1.55;
    margin: 0;
}

/* The shared helper inserts the message after the checkbox; show it under the text. */
.wg_custommade-acknowledgement > .wg_customer-field-message {
    grid-column: 2;
    grid-row: 2;
}

/* Missing choices: outline the options next to the inline message. */
.wg_custommade-fieldset[aria-invalid="true"] .wg_custommade-size-option > span,
.wg_custommade-fieldset[aria-invalid="true"] .wg_custommade-swatch {
    border-color: #9c2634;
}

.wg_custommade-fieldset,
.wg_custommade-acknowledgement {
    scroll-margin-top: 96px;
}

.wg_custommade-actions {
    margin-top: 24px;
}

.wg_custommade-add-status:empty {
    display: none;
}

.wg_custommade-add-status {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
    margin-top: 12px;
}

.wg_custommade-add-status--success {
    color: #16713a;
}

.wg_custommade-add-status--error {
    color: #9c2634;
}

.wg_custommade-actions > button {
    min-height: 52px;
    width: 100%;
}

.wg_custommade-actions > button:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.wg_custommade :is(a, button, input):focus-visible,
.wg_customer-custom-made-dialog a:focus-visible,
.wg_customer-dialog:has(.wg_customer-custom-made-dialog) .mfp-close:focus-visible {
    outline: 3px solid #276d7d;
    outline-offset: 3px;
}

.wg_custommade-size-option > input:focus-visible + span {
    outline: 3px solid #276d7d;
    outline-offset: 3px;
}

.wg_customer-custom-made-dialog {
    color: #292522;
    line-height: 1.65;
}

.wg_customer-custom-made-dialog p {
    margin: 0 0 18px;
}

.wg_customer-custom-made-dialog p:last-child {
    margin-bottom: 0;
}

@media screen and (max-width: 900px) {
    .wg_custommade-layout {
        gap: 26px;
        grid-template-columns: 1fr;
    }

    /* Not sticky in one column, but still the anchor for the zoom button and hint. */
    .wg_custommade-media {
        padding-bottom: 0;
        position: relative;
        top: auto;
    }

    .wg_custommade-image-carousel {
        min-height: 500px;
    }
}

@media screen and (max-width: 600px) {
    body#wg_mainbody .wg_custommade {
        padding: 30px 16px 52px;
    }

    .wg_custommade-header {
        margin-bottom: 30px;
    }

    .wg_custommade-product-picker {
        margin-bottom: 30px;
        padding-bottom: 26px;
    }

    .wg_custommade-product-carousel {
        margin-left: -16px;
        margin-right: -16px;
        padding-left: 16px;
        padding-right: 46px;
    }

    .wg_custommade-product-slide {
        width: min(200px, 75vw);
    }

    /* Use most of a phone's width for the photo instead of a fixed 400px box. */
    .wg_custommade-image-carousel {
        min-height: clamp(320px, 115vw, 460px);
    }

    .wg_custommade-image-carousel .flickity-viewport {
        max-height: clamp(320px, 115vw, 460px);
        min-height: clamp(320px, 115vw, 460px);
    }

    .wg_custommade-image-slide img {
        height: clamp(320px, 115vw, 460px);
    }

    .wg_custommade-zoom {
        margin: 0;
        position: absolute;
        right: 8px;
        top: 8px;
    }

    /* Swipe instead of arrows; the next design peeks in at the screen edge. */
    .wg_custommade-product-carousel .flickity-prev-next-button {
        display: none;
    }

    .wg_custommade-product-carousel.flickity-enabled {
        padding-right: 0;
    }

    .wg_custommade-details > .wg_customer-type-display-title {
        font-size: 26px;
    }

    .wg_custommade-fieldset {
        margin-top: 24px;
    }

    .wg_custommade-fabric-options {
        display: grid;
        gap: 12px 8px;
        grid-template-columns: repeat(auto-fill, minmax(64px, 1fr));
    }

    .wg_custommade-fabric-option,
    .wg_custommade-fabric-option > .wg_custommade-swatch,
    .wg_custommade-fabric-name {
        width: 100%;
    }

    .wg_custommade-fabric-option > .wg_custommade-swatch {
        aspect-ratio: 1;
        height: auto;
    }

    .wg_custommade-size-options {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .wg_custommade-size-option > span {
        min-width: 0;
        width: 100%;
    }

    .wg_custommade-accordion-button {
        height: 48px;
    }

    .wg_custommade-accordion-button::after {
        top: 18px;
    }
}

@media (pointer: coarse) {
    .wg_custommade-image-carousel .flickity-prev-next-button {
        height: 44px;
        width: 44px;
    }

    .wg_custommade-image-carousel [data-custom-made-image] {
        cursor: zoom-in;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wg_custommade-product-slide > button {
        transition: none;
    }
}

/* Customer dialog system - shared by account, contact, gift-card and header information flows. */
.mm_header-info {
    align-items: center;
    display: flex;
    gap: 26px;
    justify-content: center;
    margin: 0 auto 12px;
    max-width: 680px;
    min-height: 28px;
    text-align: center;
}

.mm_header-info-button {
    appearance: none;
    background: transparent;
    border: 0;
    border-bottom: 1px solid #777270;
    border-radius: 0;
    color: #343130;
    cursor: pointer;
    font-family: Poppins, sans-serif;
    font-size: 12px;
    line-height: 1.4;
    padding: 2px 0;
}

.mm_shop-dialog {
    text-align: center;
}

.mm_shop-overview[hidden],
.mm_shop-photo-view[hidden] {
    display: none !important;
}

.mm_shop-dialog .mm_shop-eyebrow {
    color: #776f63;
    font-size: 17px;
    letter-spacing: .16em;
    margin: 0 0 8px;
    text-transform: uppercase;
    max-width:100%;
}

body#wg_mainbody .wg_customer-dialog-content.mm_shop-dialog .wg_customer-type-dialog-title {
    font-size: clamp(28px, 4.5vw, 38px);
    margin-bottom: 12px;
    padding-left: 0;
    padding-right: 0;
}

.mm_shop-dialog .mm_shop-address {
    margin: 0 0 6px;
    max-width:100%;
}

.mm_shop-dialog .mm_shop-hours {
    align-items: center;
    background: #f1f3ed;
    border-radius: 20px;
    color: #46513e;
    display: inline-flex;
    font-size: 12px;
    gap: 7px;
    margin: 8px 0 24px;
    padding: 6px 12px;
}

.mm_shop-hours > span {
    background: #7b8c6d;
    border-radius: 50%;
    height: 5px;
    width: 5px;
}

.mm_shop-map {
    border: 1px solid #dfdad4;
    border-radius: 8px;
    display: block;
    overflow: hidden;
}

.mm_shop-map img {
    display: block;
    height: auto;
    max-width: 100%;
    width: 100%;
}

.mm_shop-dialog .mm_shop-map-actions {
    display: flex;
    justify-content: flex-end;
}

.mm_shop-dialog .mm_shop-directions {
    align-items: center;
    display: inline-flex;
    gap: 8px;
    min-height: 44px;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.mm_shop-gallery {
    border-top: 1px solid #e8e3dc;
    margin-top: 12px;
    padding-top: 22px;
    text-align: left;
}

.mm_shop-dialog .mm_shop-gallery-heading {
    align-items: baseline;
    display: flex;
    flex-wrap: wrap;
    gap: 4px 14px;
    justify-content: space-between;
    margin-bottom: 14px;
}

body#wg_mainbody .mm_shop-gallery-heading h3 {
    font-family: var(--wg-customer-font-display);
    font-size: 23px;
    font-weight: 400;
    line-height: 1.25;
    margin: 0;
}

.mm_shop-dialog .mm_shop-gallery-heading p {
    color: #7a7369;
    font-size: 11px;
    margin: 0;
}

.mm_shop-dialog .mm_shop-photo-grid {
    display: grid;
    gap: 18px 14px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.mm_shop-photo {
    background: none;
    border: 0;
    color: inherit;
    cursor: zoom-in;
    font: inherit;
    min-width: 0;
    padding: 0;
    text-align: left;
}

.mm_shop-photo-image {
    border-radius: 6px;
    display: block;
    overflow: hidden;
    position: relative;
}

.mm_shop-photo img {
    aspect-ratio: 4 / 3;
    display: block;
    height: auto;
    object-fit: cover;
    transition: transform .2s ease;
    width: 100%;
}

.mm_shop-photo:hover img,
.mm_shop-photo:focus-visible img {
    transform: scale(1.035);
}

.mm_shop-photo-expand {
    align-items: center;
    background: #fffdf5eb;
    border-radius: 50%;
    bottom: 8px;
    display: flex;
    height: 25px;
    justify-content: center;
    position: absolute;
    right: 8px;
    width: 25px;
}

.mm_shop-photo-label {
    display: block;
    font-size: 11px;
    line-height: 1.4;
    padding-top: 8px;
}

.mm_shop-dialog .mm_shop-photo-toolbar,
.mm_shop-dialog .mm_shop-photo-navigation {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: space-between;
}

.mm_shop-photo-toolbar {
    margin-bottom: 16px;
}

.mm_shop-photo-counter {
    color: #7a7369;
    font-size: 12px;
    white-space: nowrap;
}

.mm_shop-photo-view button {
    align-items: center;
    background: none;
    border: 0;
    color: inherit;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-size: 12px;
    gap: 8px;
    min-height: 44px;
    padding: 0;
}

.mm_shop-photo-view button:hover {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.mm_shop-photo-figure {
    margin: 0;
}

.mm_shop-photo-expanded {
    background: #f3efe8;
    border-radius: 8px;
    display: block;
    height: auto;
    max-height: 58vh;
    object-fit: contain;
    width: 100%;
}

.mm_shop-photo-caption {
    font-size: 14px;
    padding: 14px 0 6px;
}

@media (max-width: 575px) {
    .mm_shop-dialog .mm_shop-photo-grid {
        gap: 16px 12px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mm_shop-dialog .mm_shop-gallery-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mm_shop-photo img {
        transition: none;
    }
}

.mm_header-info-button:hover,
.mm_header-info-button:focus-visible {
    border-color: #111;
    color: #111;
}

.mm_header-info-button:focus-visible,
.wg_customer-dialog button:focus-visible,
.wg_customer-dialog a:focus-visible,
.wg_customer-dialog input:focus-visible,
.wg_customer-dialog textarea:focus-visible,
.wg_customer-dialog select:focus-visible,
.wg_customer-dialog-page button:focus-visible,
.wg_customer-dialog-page input:focus-visible,
.wg_customer-dialog-page textarea:focus-visible,
.wg_customer-dialog-page select:focus-visible {
    outline: 2px solid #171717;
    outline-offset: 3px;
}

.mfp-bg.wg_customer-dialog-modal {
    background: #d6d3d0;
    opacity: .82;
}

body.wg_customer-dialog-open .cc-container {
    z-index: 1041 !important;
}

.mfp-wrap.wg_customer-dialog-modal .mfp-container {
    align-items: center;
    display: flex;
    justify-content: center;
    overflow-y: auto;
    padding: 24px;
}

.mfp-wrap.wg_customer-dialog-modal .mfp-container::before {
    display: none;
}

.mfp-wrap.wg_customer-dialog-modal .mfp-content {
    width: 100%;
}

.wg_customer-dialog,
.wg_customer-dialog-page {
    background: #fff;
    color: #211f1e;
    font-family: Poppins, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.55;
}

.wg_customer-dialog {
    border-radius: 7px;
    box-shadow: 0 18px 55px rgba(24, 20, 18, .24);
    display: flex;
    flex-direction: column;
    margin: auto;
    max-height: calc(100vh - 48px);
    max-height: calc(100dvh - 48px);
    overflow: hidden;
    padding: 0;
    width: calc(100% - 8px);
}

.wg_customer-dialog:focus {
    outline: none;
}

.wg_customer-dialog-body {
    overflow-x: hidden;
    overflow-y: auto;
    padding: 48px 54px 38px;
}

.wg_customer-dialog .wg_container,
.wg_customer-dialog .wg_sub_notificationcontainer,
.wg_customer-dialog .wg_notification,
.wg_customer-dialog .wg_notification > div {
    margin: 0;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
    width: 100%;
}

.wg_customer-dialog .wg_customer-dialog-notification {
    background: transparent;
    border: 0;
    font-family: Poppins, sans-serif;
}

.wg_customer-dialog .wg_sub_notificationcontainer > .wg_customer-message {
    margin: 0 0 18px;
}

.wg_customer-dialog .wg_customer-dialog-confirmation {
    margin: 0 auto;
    max-width: 470px;
    text-align: center;
}

.wg_customer-dialog .wg_sub_notificationcontainer > .wg_customer-dialog-notification > .alert-info {
    background: transparent;
    border: 0;
    color: inherit;
    padding-bottom: 0;
    padding-top: 0;
}

.wg_customer-dialog-content > .row,
.wg_customer-dialog-page .row {
    display: block;
    margin-left: 0;
    margin-right: 0;
}

.wg_customer-dialog-content [class*="col-"],
.wg_customer-dialog-page [class*="col-"] {
    float: none;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
    width: 100%;
}

body#wg_mainbody .wg_customer-dialog-content .wg_customer-type-dialog-title,
body#wg_mainbody .wg_customer-dialog-page .wg_customer-type-page-title {
    margin: 8px 0 18px;
    text-align: center;
}

.wg_customer-dialog-content > .row:first-child > [class*="col-"],
.wg_customer-dialog-info {
    text-align: center;
}

.wg_customer-dialog-content > br {
    display: none;
}

.wg_customer-dialog-field {
    color: #302d2b;
    display: block;
    font-size: 13px;
    margin-top: 20px;
}

.wg_customer-dialog-field > br {
    display: block;
    line-height: 0;
}

.wg_customer-dialog-content input:not([type="checkbox"]):not([type="radio"]),
.wg_customer-dialog-content textarea,
.wg_customer-dialog-content select,
.wg_customer-dialog-page input:not([type="checkbox"]):not([type="radio"]),
.wg_customer-dialog-page textarea,
.wg_customer-dialog-page select {
    background: #fff;
    border: 1px solid #c9c6c3;
    border-radius: 4px;
    box-shadow: none;
    color: #211f1e;
    font-family: Poppins, sans-serif;
    font-size: 15px;
    margin-top: 8px;
    min-height: 54px;
    padding: 13px 16px;
    transition: border-color .15s ease, box-shadow .15s ease;
    width: 100% !important;
}

.wg_customer-dialog-content textarea,
.wg_customer-dialog-page textarea {
    min-height: 112px;
    resize: vertical !important;
}

.wg_customer-dialog-content input:focus,
.wg_customer-dialog-content textarea:focus,
.wg_customer-dialog-content select:focus,
.wg_customer-dialog-page input:focus,
.wg_customer-dialog-page textarea:focus,
.wg_customer-dialog-page select:focus {
    border-color: #4a4745;
    box-shadow: 0 0 0 3px rgba(30, 28, 27, .1);
}

.wg_customer-password-control {
    display: block;
    position: relative;
}

.wg_customer-password-control input {
    padding-right: 52px !important;
}

.wg_customer-phone-control {
    align-items: stretch;
    display: flex;
    width: 100%;
}

.wg_customer-phone-prefix {
    align-items: center;
    background: #f5f5f5;
    border: 1px solid #d4d1cf;
    border-radius: 3px 0 0 3px;
    color: #242424;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 14px;
    gap: 6px;
    justify-content: center;
    min-width: 50px;
    padding: 0 5px;
    position: relative;
}

.wg_customer-phone-prefix:hover {
    background: #eceae8;
}

.wg_customer-phone-prefix:focus-within {
    border-color: #4a4745;
    box-shadow: 0 0 0 3px rgba(30, 28, 27, .1);
    z-index: 1;
}

.wg_customer-phone-code-caret {
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid currentColor;
    height: 0;
    width: 0;
}

.wg_customer-phone-country {
    cursor: pointer;
    height: 100%;
    inset: 0;
    opacity: 0;
    position: absolute;
    width: 100%;
}

.wg_customer-phone-control input {
    border-radius: 0 3px 3px 0 !important;
    flex: 1 1 auto;
    min-width: 0;
}

.wg_customer-dialog-kind-reservation .wg_customer-phone-control {
    align-items: flex-start;
    flex-wrap: nowrap;
    display: flex;
}

.wg_customer-dialog-kind-reservation .wg_customer-phone-prefix {
    margin-right: 8px;
}

.wg_customer-dialog-kind-reservation .wg_customer-phone-prefix,
.wg_customer-dialog-kind-reservation .wg_customer-phone-control input {
    box-sizing: border-box;
    height: 54px;
    margin-top: 8px;
    min-height: 54px;
}

.wg_customer-dialog-kind-reservation .wg_customer-phone-country {
    height: 100%;
    margin: 0;
    min-height: 0;
    padding: 0;
    width: 100%;
}

.wg_customer-phone-control:has(input[aria-invalid="true"]) .wg_customer-phone-prefix {
    border-color: #c62d36;
}

.wg_customer-password-toggle {
    align-items: center;
    background: transparent !important;
    border: 0 !important;
    color: #575250 !important;
    display: flex;
    height: 48px;
    justify-content: center;
    margin: 0 !important;
    padding: 0 !important;
    position: absolute;
    right: 3px;
    top: 11px;
    width: 46px !important;
}

.wg_customer-dialog .wg_customer-dialog-primary,
.wg_customer-dialog-page .wg_customer-dialog-primary {
    background: #171717 !important;
    border: 1px solid #171717 !important;
    border-radius: 3px !important;
    color: #fff !important;
    display: block;
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-control-size);
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.35;
    margin-top: 22px;
    min-height: 54px;
    padding: 13px 20px;
    width: 100%;
}

.wg_customer-dialog-kind-login #login_submit,
.wg_customer-dialog-kind-forgot-password #password_submit,
.wg_customer-dialog-kind-reset-password #password_reset_submit {
    margin-bottom: 10px;
}

.wg_customer-dialog-kind-reset-password .help-block {
    margin: 16px 0 0;
}

.wg_customer-dialog-kind-login .wg_customer-dialog-content > .row:last-child > [class*="col-"]:last-child,
.wg_customer-dialog-kind-forgot-password .wg_customer-dialog-content > .row:last-child > [class*="col-"]:last-child {
    font-size: 13px;
    text-align: right;
    white-space: nowrap;
}

.wg_customer-dialog .wg_customer-dialog-primary:hover,
.wg_customer-dialog .wg_customer-dialog-primary:focus,
.wg_customer-dialog-page .wg_customer-dialog-primary:hover,
.wg_customer-dialog-page .wg_customer-dialog-primary:focus {
    background: #303030 !important;
}

.wg_customer-dialog #getpassword {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid currentColor !important;
    border-radius: 0 !important;
    color: #302d2b !important;
    display: inline;
    font-family: Poppins, sans-serif;
    font-size: 13px;
    margin: 0 0 0 6px;
    min-height: 0;
    padding: 0;
    vertical-align: baseline;
    width: auto;
}

.wg_customer-dialog #newuser {
    color: #302d2b;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.wg_customer-dialog-support {
    align-items: center;
    background: #faf9f7;
    border-top: 1px solid #e4e1de;
    display: flex;
    flex: 0 0 auto;
    gap: 10px;
    justify-content: center;
    min-height: 66px;
    padding: 16px 28px;
}

.wg_customer-dialog-support > i {
    font-size: 18px;
    margin-right: 2px;
}

.wg_customer-dialog-contact {
    background: transparent;
    border: 0;
    border-bottom: 1px solid currentColor;
    border-radius: 0;
    color: #302d2b;
    padding: 0;
}

.wg_customer-dialog-kind-contact .wg_customer-dialog-support {
    display: none;
}

.wg_customer-dialog .mfp-close {
    align-items: center;
    color: #222;
    display: flex;
    font-family: Arial, sans-serif;
    font-size: 31px;
    font-weight: 300;
    height: 48px;
    justify-content: center;
    line-height: 1;
    opacity: 1;
    padding: 0;
    right: 8px;
    top: 7px;
    width: 48px;
}

.wg_customer-dialog .mfp-close:active {
    top: 7px;
}

.wg_customer-dialog .alert-danger,
.wg_customer-dialog .alert-warning {
    border-radius: 4px;
    margin: 16px 0 0;
    padding: 13px 15px;
}

.wg_customer-dialog-info p {
    font-size: 14px;
    margin: 0 auto;
    max-width: 470px;
}

.wg_customer-dialog-page {
    border: 1px solid #e3dfdc;
    border-radius: 7px;
    box-shadow: none;
    margin: 34px auto 58px;
    max-width: 680px;
    padding: 46px 54px;
}

.wg_customer-dialog-page .wg_infobox_outer,
.wg_customer-dialog-page .wg_infobox_inner {
    background: transparent;
    border: 0;
}

.wg_customer-dialog-page > .wg_customer-dialog-support {
    margin: 36px -54px -46px;
}

.wg_customer-dialog-content > .row.wg_customer-account-actions,
.wg_customer-dialog-page .row.wg_customer-account-actions,
.wg_customer-account-actions {
    display: grid !important;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 18px auto 0;
    max-width: 480px;
    width: 100%;
}

.wg_customer-account-actions > .btn,
.wg_customer-account-actions > a {
    background: #fff !important;
    border: 1px solid #bbb6b2 !important;
    border-radius: 3px !important;
    color: #252220 !important;
    font-size: 13px;
    margin: 0 !important;
    min-height: 42px;
    padding: 10px 14px;
    text-align: center;
    width: 100%;
}

.wg_customer-account-actions > .btn:hover,
.wg_customer-account-actions > .btn:focus,
.wg_customer-account-actions > a:hover,
.wg_customer-account-actions > a:focus {
    background: #f5f3f1 !important;
    border-color: #393532 !important;
}

.wg_customer-account > .row:nth-of-type(3) .wg_customer-type-subsection-title {
    background: #f8f6f4;
    border-left: 3px solid #746e69;
    border-radius: 3px;
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-subsection-size);
    font-weight: 500;
    line-height: 1.5;
    margin: 0 0 14px;
    padding: 13px 15px;
    text-align: left;
}

.wg_customer-order-card {
    align-items: center;
    border: 1px solid #e1ddda;
    border-radius: 5px;
    display: grid;
    gap: 6px 16px;
    grid-template-columns: 100px minmax(0, 1fr);
    margin: 10px 0;
    padding: 14px;
    text-align: left;
}

.wg_customer-order-card > .row {
    margin: 0;
}

.wg_customer-order-card > .row > [class*="col-"] {
    float: none;
    min-height: 0;
    padding: 0;
    width: 100%;
}

.wg_customer-order-card > .row:first-child {
    grid-column: 2;
    grid-row: 1;
}

.wg_customer-order-card > .row:nth-child(2) {
    grid-column: 1;
    grid-row: 1 / span 2;
}

.wg_customer-order-card > .row:nth-child(3) {
    grid-column: 2;
    grid-row: 2;
}

.wg_customer-order-card > .row:nth-child(2) img {
    border: 0 !important;
    height: auto;
    max-width: 96px;
    width: 100%;
}

.wg_customer-order-card > .row:nth-child(3) img {
    height: 16px;
    max-width: 16px;
    width: 16px;
}

.wg_customer-dialog-kind-account,
.wg_customer-dialog-kind-account-orders {
    max-width: 940px !important;
}

.wg_customer-account-shell {
    color: #252220;
    margin: 0 auto;
    max-width: 820px;
    text-align: left;
}

.wg_customer-account-header {
    margin: 0 auto 26px;
    max-width: 600px;
    text-align: center;
}

.wg_customer-account-header .wg_customer-type-dialog-title {
    margin: 0 0 9px;
}

.wg_customer-account-header p {
    color: #625d59;
    margin: 0;
}

.wg_customer-account-nav {
    border-bottom: 1px solid #dedad6;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0 0 30px;
}

.wg_customer-account-nav > a,
.wg_customer-account-nav > button {
    align-items: center;
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    color: #5f5a56;
    display: flex;
    font-size: 14px;
    justify-content: center;
    margin: 0 0 -1px;
    min-height: 48px;
    padding: 10px 14px;
    text-align: center;
    text-decoration: none;
}

.wg_customer-account-nav > a:hover,
.wg_customer-account-nav > a:focus,
.wg_customer-account-nav > button:hover,
.wg_customer-account-nav > button:focus,
.wg_customer-account-nav > .is-active {
    border-bottom-color: #282421;
    color: #282421;
    text-decoration: none;
}

.wg_customer-account-orders > .wg_customer-type-section-title,
.wg_customer-account-detail-products > .wg_customer-type-section-title {
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-section-size);
    font-weight: 500;
    margin: 0 0 16px;
    padding: 0;
    text-align: left;
}

.wg_customer-account-order-list {
    display: grid !important;
    gap: 16px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wg_customer-account-order-summary {
    background: #fff;
    border: 1px solid #dedad6;
    border-radius: 5px;
    display: grid;
    min-width: 0;
    padding: 18px;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.wg_customer-account-order-summary.has-image {
    gap: 16px;
    grid-template-columns: 88px minmax(0, 1fr);
}

.wg_customer-account-order-summary:hover,
.wg_customer-account-order-summary:focus-within {
    border-color: #aaa49f;
    box-shadow: 0 8px 24px rgba(30, 27, 25, .07);
}

.wg_customer-account-order-image {
    align-self: stretch;
    background: #f7f5f3;
    border-radius: 3px;
    display: flex;
    justify-content: center;
    min-height: 132px;
    overflow: hidden;
}

.wg_customer-account-order-image[hidden] {
    display: none;
}

.wg_customer-account-order-image img {
    height: 100%;
    object-fit: contain;
    width: 100%;
}

.wg_customer-account-order-body {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.wg_customer-account-order-meta {
    display: flex;
    justify-content: flex-end;
    min-height: 25px;
}

.wg_customer-account-order-status {
    align-items: center;
    background: #edf5eb;
    border: 1px solid #d6e6d2;
    border-radius: 999px;
    color: #365c38;
    display: inline-flex;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    padding: 5px 10px;
}

.wg_customer-account-order-summary .wg_customer-type-card-title {
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-card-size);
    font-weight: 500;
    margin: 0 0 4px;
    padding: 0;
    text-align: left;
}

.wg_customer-account-order-title {
    background: transparent;
    border: 0;
    color: #252220;
    font: inherit;
    padding: 0;
    text-align: left;
    text-decoration: none;
}

.wg_customer-account-order-title:hover,
.wg_customer-account-order-title:focus {
    text-decoration: underline;
}

.wg_customer-account-order-date,
.wg_customer-account-order-items {
    color: #6a6561;
    font-size: 13px;
    margin: 0 0 7px;
}

.wg_customer-account-order-footer {
    align-items: center;
    display: flex !important;
    gap: 20px;
    margin-top: auto;
    padding-top: 14px;
}

.wg_customer-account-order-footer strong {
    font-family: Poppins, sans-serif;
    font-size: 17px;
    font-weight: 500;
}

.wg_customer-account-order-open,
.wg_customer-account-back {
    background: #fff;
    border: 1px solid #aaa49f;
    border-radius: 3px;
    color: #252220;
    min-height: 42px;
    padding: 9px 15px;
}

.wg_customer-account-order-open {
    flex: 0 0 auto;
    margin-left: auto !important;
}

.wg_customer-account-order-open:hover,
.wg_customer-account-order-open:focus,
.wg_customer-account-back:hover,
.wg_customer-account-back:focus {
    background: #f5f3f1;
    border-color: #393532;
}

.wg_customer-account-secondary {
    border-top: 1px solid #e5e1de;
    display: flex;
    gap: 18px;
    justify-content: center;
    margin-top: 30px;
    padding-top: 20px;
}

.wg_customer-account-secondary button {
    background: transparent;
    border: 0;
    color: #5f5a56;
    padding: 7px 4px;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.wg_customer-account-empty {
    background: #f8f6f4;
    border-radius: 5px;
    padding: 30px 24px;
    text-align: center;
}

.wg_customer-account-empty > .fa {
    font-size: 24px;
    margin-bottom: 10px;
}

.wg_customer-account-empty p {
    margin: 0 0 14px;
}

.wg_customer-account-empty a {
    color: #252220;
    font-weight: 500;
    text-decoration: underline;
}

.wg_customer-account-loading {
    opacity: .55;
    pointer-events: none;
}

.wg_customer-account-back {
    align-items: center;
    display: inline-flex;
    gap: 9px;
    margin: 0 0 24px;
}

.wg_customer-account-detail .wg_customer-account-header {
    margin-bottom: 20px;
}

.wg_customer-account-detail-summary {
    align-items: center;
    background: #f8f6f4;
    border-left: 3px solid #746e69;
    border-radius: 3px;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1fr) auto auto;
    margin-bottom: 28px;
    padding: 16px 18px;
}

.wg_customer-account-detail-summary .wg_customer-type-subsection-title {
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-subsection-size);
    font-weight: 500;
    margin: 0 0 3px;
    padding: 0;
    text-align: left;
}

.wg_customer-account-detail-summary p,
.wg_customer-account-detail-total span {
    color: #6a6561;
    font-size: 13px;
    margin: 0;
}

.wg_customer-account-detail-total {
    display: flex !important;
    flex-direction: column;
    gap: 2px;
    text-align: right;
}

.wg_customer-account-detail-total strong {
    font-family: Poppins, sans-serif;
    font-size: 18px;
    font-weight: 500;
}

.wg_customer-account-detail-products [data-customer-account-order-lines] {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wg_customer-account-detail .wg_customer-order-card {
    margin: 0;
}

.mm_order-status {
    background: #fff;
    border: 1px solid #dedad6;
    border-radius: 7px;
    box-shadow: 0 12px 38px rgba(30, 27, 25, .08);
    box-sizing: border-box;
    color: #272321;
    margin: 52px auto 72px;
    max-width: 760px;
    padding: 52px 60px 48px;
    text-align: center;
}

.mm_order-status-marker {
    align-items: center;
    background: #28733e;
    border-radius: 50%;
    color: #fff;
    display: flex;
    font-size: 24px;
    height: 58px;
    justify-content: center;
    margin: 0 auto 18px;
    width: 58px;
}

.mm_order-status--warning .mm_order-status-marker {
    background: #9a6500;
}

.mm_order-status-eyebrow {
    color: #5e5854;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .1em;
    margin: 0 0 8px;
    text-transform: uppercase;
}

.mm_order-status-content .wg_customer-type-page-title {
    margin: 6px 0 18px;
}

.mm_order-status-content {
    font-size: 14px;
    line-height: 1.7;
}

.mm_order-status-content p:last-child {
    margin-bottom: 0;
}

.mm_order-status-legacy-action {
    display: none !important;
}

.mm_order-status-actions {
    display: flex;
    gap: 10px;
    justify-content: center;
    margin-top: 30px;
}

.mm_order-status-primary,
.mm_order-status-secondary {
    align-items: center;
    border-radius: 3px;
    display: inline-flex;
    font-size: 13px;
    font-weight: 500;
    justify-content: center;
    min-height: 48px;
    padding: 12px 20px;
    text-decoration: none;
}

.mm_order-status-primary {
    background: #171717;
    border: 1px solid #171717;
    color: #fff;
}

.mm_order-status-secondary {
    background: #fff;
    border: 1px solid #a9a39f;
    color: #292522;
}

.mm_order-status-primary:hover,
.mm_order-status-primary:focus {
    background: #303030;
    color: #fff;
}

.mm_order-status-secondary:hover,
.mm_order-status-secondary:focus {
    background: #f5f3f1;
    border-color: #393532;
}

@media screen and (max-width: 767px) {
    .mfp-wrap.wg_customer-dialog-modal .mfp-container {
        align-items: flex-start;
        padding: 10px;
    }

    .wg_customer-dialog {
        border-radius: 5px;
        margin-bottom: 10px;
        max-height: none;
        overflow: visible;
        width: 100%;
    }

    .wg_customer-dialog-body {
        overflow: visible;
    }

    .wg_customer-dialog-body,
    .wg_customer-dialog-page {
        padding: 42px 22px 30px;
    }

    body#wg_mainbody .wg_customer-dialog-content .wg_customer-type-dialog-title,
    body#wg_mainbody .wg_customer-dialog-page .wg_customer-type-page-title {
        padding-left: 24px;
        padding-right: 24px;
    }

    .wg_customer-dialog-support {
        flex-wrap: wrap;
        font-size: 13px;
        min-height: 60px;
        padding: 13px 18px;
    }

    .wg_customer-dialog-page {
        margin: 20px 0 40px;
    }

    .wg_customer-dialog-page > .wg_customer-dialog-support {
        margin: 30px -22px -30px;
    }

    /* The page card already has side padding; inner boxes would squeeze the fields on phones. */
    .wg_customer-dialog-page .wg_infobox_outer {
        padding-left: 0;
        padding-right: 0;
    }

    .mm_header-info {
        gap: 18px;
        padding: 0 12px;
    }

    .wg_customer-dialog-content > .row.wg_customer-account-actions,
    .wg_customer-dialog-page .row.wg_customer-account-actions,
    .wg_customer-account-actions {
        grid-template-columns: 1fr;
    }

    .mm_order-status-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .wg_customer-account-actions > .btn,
    .wg_customer-account-actions > a,
    .mm_order-status-primary,
    .mm_order-status-secondary {
        width: 100%;
    }

    .wg_customer-order-card {
        gap: 5px 12px;
        grid-template-columns: 76px minmax(0, 1fr);
        padding: 12px;
    }

    .wg_customer-order-card > .row:nth-child(2) img {
        max-width: 72px;
    }

    .wg_customer-account-shell {
        max-width: none;
    }

    .wg_customer-account-header {
        margin-bottom: 22px;
    }

    .wg_customer-account-header .wg_customer-type-dialog-title {
        padding-left: 8px;
        padding-right: 8px;
    }

    .wg_customer-account-header p {
        font-size: 14px;
    }

    .wg_customer-account-nav {
        grid-template-columns: repeat(3, minmax(96px, 1fr));
        margin-bottom: 24px;
        overflow-x: auto;
    }

    .wg_customer-account-nav > a,
    .wg_customer-account-nav > button {
        font-size: 12px;
        padding-left: 8px;
        padding-right: 8px;
    }

    .wg_customer-account-orders > .wg_customer-type-section-title,
    .wg_customer-account-detail-products > .wg_customer-type-section-title,
    .wg_customer-account-detail-summary .wg_customer-type-subsection-title {
        padding: 0;
    }

    .wg_customer-account-order-list,
    .wg_customer-account-detail-products [data-customer-account-order-lines] {
        grid-template-columns: 1fr;
    }

    .wg_customer-account-order-summary {
        padding: 14px;
    }

    .wg_customer-account-order-summary.has-image {
        gap: 12px;
        grid-template-columns: 72px minmax(0, 1fr);
    }

    .wg_customer-account-order-image {
        min-height: 112px;
    }

    .wg_customer-account-order-summary .wg_customer-type-card-title {
        padding: 0;
    }

    .wg_customer-account-order-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .wg_customer-account-order-open,
    .wg_customer-account-back {
        justify-content: center;
        width: 100%;
    }

    .wg_customer-account-order-open {
        margin-left: 0 !important;
    }

    .wg_customer-account-secondary {
        align-items: center;
        flex-direction: column;
        gap: 4px;
    }

    .wg_customer-account-detail-summary {
        gap: 12px;
        grid-template-columns: minmax(0, 1fr) auto;
        padding: 14px;
    }

    .wg_customer-account-detail-total {
        border-top: 1px solid #dedad6;
        grid-column: 1 / -1;
        padding-top: 12px;
        text-align: left;
    }

    .mm_order-status {
        margin: 28px 0 48px;
        padding: 38px 22px 30px;
    }

    .mm_order-status-marker {
        font-size: 21px;
        height: 52px;
        width: 52px;
    }

}

@media (prefers-reduced-motion: reduce) {
    .wg_customer-dialog-content input,
    .wg_customer-dialog-content textarea,
    .wg_customer-dialog-content select {
        transition: none;
    }
}

/* Tools & Guides (/guides): hub, step guides and calculators. Scoped to .mm_guide / .mm_guides. */
body#wg_mainbody .mm_guide,
body#wg_mainbody .mm_guides {
    --mm-guide-accent: #9b6a52;
    --mm-guide-soft: #efe9e4;
    --mm-guide-surface: #f4f2f0;
    --mm-guide-border: #dedad6;
    --mm-guide-control-border: #c9c4c0;
    --mm-guide-focus: #276d7d;
    --mm-guide-error: #9c2634;
    /* The blue of the shape lines in our body-shape illustrations; the strong one carries text. */
    --mm-fit-shape: #3488bc;
    --mm-fit-shape-strong: #23709e;
    box-sizing: border-box;
    color: #292522;
    font-family: var(--wg-customer-font-ui);
    font-size: 15px;
    line-height: 1.6;
    margin: 0 auto;
    max-width: 980px;
    padding: 36px 30px 72px;
    width: 100%;
}

.mm_guide *,
.mm_guide *::before,
.mm_guide *::after,
.mm_guides *,
.mm_guides *::before,
.mm_guides *::after {
    box-sizing: border-box;
}

.mm_guide [hidden],
.mm_guides [hidden] {
    display: none !important;
}

.mm_guide-visually-hidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.mm_guide p,
.mm_guides p {
    margin: 0 0 12px;
}

.mm_guide :is(a, button, input, summary, [tabindex]):focus-visible,
.mm_guides :is(a, button, input, summary):focus-visible {
    outline: 3px solid var(--mm-guide-focus);
    outline-offset: 3px;
}

.mm_guide a,
.mm_guides a {
    color: #292522;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Breadcrumb and header */
.mm_guide-breadcrumb {
    margin-bottom: 22px;
}

.mm_guide-breadcrumb-list {
    display: flex;
    flex-wrap: wrap;
    font-size: var(--wg-customer-type-meta-size);
    gap: 4px 0;
    list-style: none;
    margin: 0;
    padding: 0;
}

.mm_guide-breadcrumb-list > li:not(:last-child)::after {
    color: var(--wg-customer-text-muted);
    content: "/";
    margin: 0 8px;
}

.mm_guide-breadcrumb-list > li[aria-current="page"] {
    color: var(--wg-customer-text-muted);
}

.mm_guide-header {
    margin: 0 0 28px;
    position: relative;
}

.mm_guide-header .mm_guide-title,
.mm_guide-header .mm_guide-intro {
    max-width: 720px;
}

.mm_guide-header .mm_guide-eyebrow {
    margin: 0 0 8px;
}

.mm_guide-header .mm_guide-title {
    margin: 0 0 14px;
}

.mm_guide-intro {
    font-size: 17px;
    line-height: 1.65;
}

.mm_guide-context {
    margin-top: 6px;
}

.mm_guide-header-actions {
    margin-top: 10px;
}

/* On wide screens "Print" sits at the top right of the header instead of taking a row. */
@media screen and (min-width: 768px) {
    .mm_guide-header-actions {
        margin: 0;
        position: absolute;
        right: 0;
        top: -12px;
    }
}

/* Buttons */
.mm_guide-button {
    align-items: center;
    background: var(--wg-customer-commerce-primary);
    border: 1px solid var(--wg-customer-commerce-primary);
    border-radius: 4px;
    color: var(--wg-customer-commerce-primary-text);
    cursor: pointer;
    display: inline-flex;
    font-family: var(--wg-customer-font-ui);
    font-size: var(--wg-customer-type-control-size);
    font-weight: 600;
    gap: 8px;
    justify-content: center;
    line-height: 1.2;
    min-height: 48px;
    min-width: 44px;
    padding: 0 20px;
    text-decoration: none;
}

.mm_guide-button:hover {
    background: var(--wg-customer-commerce-primary-hover);
    border-color: var(--wg-customer-commerce-primary-hover);
}

.mm_guide-button--secondary {
    background: #fff;
    border-color: var(--mm-guide-control-border);
    color: #292522;
}

.mm_guide-button--secondary:hover {
    background: var(--mm-guide-surface);
    border-color: #292522;
}

.mm_guide-button--quiet {
    background: transparent;
    border-color: transparent;
    color: #292522;
    min-height: 44px;
    padding: 0 6px;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.mm_guide-button--quiet:hover {
    background: transparent;
    border-color: transparent;
    color: #000;
}

.mm_guide-button:disabled {
    cursor: not-allowed;
    opacity: .45;
}

/* Sections and lists */
.mm_guide-section {
    border-top: 1px solid var(--mm-guide-border);
    margin: 0 0 28px;
    padding-top: 24px;
}

.mm_guide-section > h2,
.mm_guide-steps-head > h2 {
    margin: 0 0 14px;
}

.mm_guide-list,
.mm_guide-checklist,
.mm_guide-links {
    margin: 0 0 14px;
    padding-left: 20px;
}

.mm_guide-list > li,
.mm_guide-checklist > li,
.mm_guide-links > li {
    margin-bottom: 6px;
}

.mm_guide-checklist {
    list-style: none;
    padding-left: 0;
}

.mm_guide-checklist > li {
    padding-left: 26px;
    position: relative;
}

.mm_guide-checklist > li::before {
    color: var(--mm-guide-accent);
    content: "\2713";
    font-weight: 600;
    left: 2px;
    position: absolute;
    top: 0;
}

.mm_guide-links {
    list-style: none;
    padding-left: 0;
}

/* Short checklist items and links share a row on wider screens; phones keep one per line. */
@media screen and (min-width: 600px) {
    .mm_guide-checklist,
    .mm_guide-links {
        display: flex;
        flex-wrap: wrap;
        gap: 6px 28px;
    }

    .mm_guide-checklist > li,
    .mm_guide-links > li {
        margin-bottom: 0;
    }
}

.mm_guide-tip {
    background: var(--mm-guide-surface);
    border-left: 3px solid var(--mm-guide-accent);
    padding: 10px 14px;
}

.mm_guide-hint {
    color: var(--wg-customer-text-muted);
    font-size: var(--wg-customer-type-meta-size);
    margin: 0 0 6px;
}

/* Illustrations */
.mm_guide-figure {
    margin: 0;
}

.mm_guide-figure svg,
.mm_guide-figure img {
    display: block;
    height: auto;
    max-width: 100%;
    width: 100%;
}

.mm_guide-figure--small svg {
    max-width: 180px;
}

.mm_guide .mm_svg-accent {
    stroke: var(--mm-guide-accent);
}

.mm_guide .mm_svg-soft,
.mm_guides .mm_svg-soft {
    fill: var(--mm-guide-soft);
}

/* Hub cards */
.mm_guides-group {
    margin: 0 0 36px;
}

.mm_guides-group > h2 {
    margin: 0 0 16px;
}

.mm_guides-cards {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Hub: on wide screens each category takes as many of three columns as it has cards, so categories
   with one or two cards share a row. */
@media screen and (min-width: 900px) {
    .mm_guides-groups {
        column-gap: 20px;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    /* Cards in a row are as tall as the tallest of them, across categories. */
    .mm_guides-groups > .mm_guides-group {
        display: flex;
        flex-direction: column;
        grid-column: span var(--mm-guides-cards, 3);
    }

    .mm_guides-groups .mm_guides-cards {
        flex: 1 1 auto;
        grid-template-columns: repeat(var(--mm-guides-cards, 3), minmax(0, 1fr));
    }
}

/* A card: the illustration on a soft tile, then kind, title, summary and an action line at its foot. */
.mm_guides-card-link {
    background: #fff;
    border: 1px solid var(--mm-guide-border);
    border-radius: 6px;
    color: #292522;
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    text-decoration: none !important;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.mm_guides-card-link:hover {
    border-color: #a49d97;
    box-shadow: 0 10px 24px rgba(41, 37, 34, .08);
}

.mm_guides-card-media {
    align-items: center;
    background: var(--mm-guide-surface);
    display: flex;
    height: 156px;
    justify-content: center;
    padding: 8px 16px;
    transition: background-color 160ms ease;
}

.mm_guides-card-link:hover .mm_guides-card-media {
    background: var(--mm-guide-soft);
}

.mm_guides-card-media svg,
.mm_guides-card-media img {
    color: #292522;
    display: block;
    height: 100%;
    max-width: 100%;
    transition: transform 200ms ease;
    width: auto;
}

.mm_guides-card-link:hover .mm_guides-card-media svg,
.mm_guides-card-link:hover .mm_guides-card-media img {
    transform: scale(1.04);
}

.mm_guides-card-media .mm_svg-accent {
    stroke: var(--mm-guide-accent);
}

.mm_guides-card-text {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 6px;
    padding: 16px 18px 18px;
}

.mm_guides-card-kind {
    color: var(--wg-customer-text-muted);
    font-size: var(--wg-customer-type-eyebrow-size);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.mm_guides-card-title {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.3;
}

.mm_guides-card-summary {
    color: var(--wg-customer-text-muted);
    font-size: 14px;
    line-height: 1.5;
}

/* The action sits at the foot of every card in a row, whatever the length of the summaries. */
.mm_guides-card-action {
    align-items: center;
    display: inline-flex;
    font-size: 14px;
    font-weight: 600;
    gap: 8px;
    margin-top: auto;
    padding-top: 10px;
}

.mm_guides-card-action::after {
    content: "\2192";
    transition: transform 160ms ease;
}

.mm_guides-card-link:hover .mm_guides-card-action {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.mm_guides-card-link:hover .mm_guides-card-action::after {
    transform: translateX(4px);
}

.mm_guides .mm_guides-group-more {
    margin: 14px 0 0;
}

/* Phones: a compact row per card, the tile beside the text, so the list stays easy to scan. */
@media screen and (max-width: 599px) {
    .mm_guides-card-link {
        flex-direction: row;
    }

    .mm_guides-card-media {
        flex: 0 0 92px;
        height: auto;
        padding: 10px;
    }

    .mm_guides-card-media svg,
    .mm_guides-card-media img {
        height: auto;
        width: 100%;
    }

    .mm_guides-card-text {
        gap: 4px;
        padding: 14px 16px;
    }

    .mm_guides-card-title {
        font-size: var(--wg-customer-type-subsection-size);
    }

    .mm_guides-card-action {
        display: none;
    }
}

/* Back to the hub's card overview, at the end of guide pages and the knitting collection. */
.mm_guide .mm_guide-back,
.mm_guides .mm_guide-back {
    border-top: 1px solid var(--mm-guide-border);
    margin: 0;
    padding-top: 20px;
}

.mm_guide-back-link {
    align-items: center;
    display: inline-flex;
    font-weight: 600;
    gap: 8px;
    min-height: 44px;
}

/* Step guides */
.mm_guide-steps {
    border-top: 1px solid var(--mm-guide-border);
    margin: 0 0 28px;
    padding-top: 24px;
}

.mm_guide-steps-head {
    align-items: baseline;
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
    justify-content: space-between;
    margin-bottom: 18px;
}

.mm_guide-steps-head > h2 {
    flex: 1 1 auto;
    margin: 0;
}

.mm_guide-progress {
    color: var(--wg-customer-text-muted);
    font-size: var(--wg-customer-type-meta-size);
    margin: 0;
}

.mm_guide-step-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* The illustrations are drawn at 240 x 200, so a step is as tall as its text, not an enlarged picture. */
.mm_guide-step {
    align-items: start;
    border-bottom: 1px solid var(--mm-guide-border);
    display: grid;
    gap: 24px 32px;
    grid-template-columns: minmax(0, 1fr) 240px;
    padding: 22px 0;
}

.mm_guide-steps--single .mm_guide-step {
    border-bottom: 0;
}

.mm_guide-step--hidden {
    display: none;
}

/* One step at a time: every step shares one grid cell, so the list is as tall as the tallest step and
   Previous / Next stay in the same place from step to step. Hidden steps keep their space only. */
@media screen {
    /* The step is framed like a card, so the room kept for longer steps reads as part of it, with a
       progress bar along its top edge (guides.js sets the fraction). */
    .mm_guide-steps--single:not(.mm_guide-steps--printing) .mm_guide-step-list {
        border: 1px solid var(--mm-guide-border);
        border-radius: 6px;
        display: grid;
        overflow: hidden;
        padding: 6px 26px 4px;
        position: relative;
    }

    .mm_guide-steps--single:not(.mm_guide-steps--printing) .mm_guide-step-list::before {
        background: var(--mm-guide-accent);
        content: "";
        height: 3px;
        left: 0;
        position: absolute;
        top: 0;
        transition: width 200ms ease;
        width: calc(var(--mm-guide-step-progress, 0) * 100%);
    }

    .mm_guide-steps--single:not(.mm_guide-steps--printing) .mm_guide-step {
        grid-area: 1 / 1;
    }

    .mm_guide-steps--single:not(.mm_guide-steps--printing) .mm_guide-step--hidden {
        display: grid;
        visibility: hidden;
    }
}

.mm_guide-step-title {
    align-items: center;
    display: flex;
    font-size: var(--wg-customer-type-subsection-size);
    font-weight: 500;
    gap: 12px;
    line-height: 1.3;
    margin: 0 0 12px;
}

.mm_guide-step-title:focus {
    outline: none;
}

.mm_guide-step-title:focus-visible {
    outline: 3px solid var(--mm-guide-focus);
    outline-offset: 4px;
}

.mm_guide-step-number {
    align-items: center;
    border: 1px solid #292522;
    border-radius: 50%;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 14px;
    font-weight: 600;
    height: 32px;
    justify-content: center;
    width: 32px;
}

.mm_guide-step-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
    margin-top: 16px;
}

.mm_guide-step-nav > [data-mm-guide-next],
.mm_guide-step-nav > [data-mm-guide-finish] {
    margin-left: auto;
}

.mm_guide-finished {
    background: var(--mm-guide-surface);
    margin-top: 18px;
    padding: 18px 20px;
}

.mm_guide-finished:focus {
    outline: none;
}

.mm_guide-finished > .mm_guide-button {
    margin: 4px 12px 0 0;
}

.mm_guide a.mm_guide-button {
    color: var(--wg-customer-commerce-primary-text);
    text-decoration: none;
}

.mm_guide a.mm_guide-button--secondary {
    color: #292522;
}

/* Closed disclosures: background, measuring help, method, advice, saving and optional settings. A
   group reads as one list: a line above it and one under each disclosure. */
.mm_guide-more-group {
    border-top: 1px solid var(--mm-guide-border);
    margin: 0 0 28px;
}

.mm_guide-more {
    border-bottom: 1px solid var(--mm-guide-border);
}

.mm_guide-more-summary {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: 10px;
    list-style: none;
    min-height: 52px;
    padding: 10px 2px;
}

.mm_guide-more-summary::-webkit-details-marker {
    display: none;
}

/* A chevron at the end of the row, pointing down when closed and up when open. */
.mm_guide-more-summary::after {
    border-bottom: 2px solid #292522;
    border-right: 2px solid #292522;
    content: "";
    flex: 0 0 auto;
    height: 8px;
    margin: 0 6px 0 auto;
    transform: translateY(-2px) rotate(45deg);
    transition: transform 160ms ease;
    width: 8px;
}

.mm_guide-more[open] > .mm_guide-more-summary::after {
    transform: translateY(2px) rotate(-135deg);
}

.mm_guide .mm_guide-more-title {
    font-family: var(--wg-customer-font-ui);
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.35;
    margin: 0;
    text-transform: none;
}

.mm_guide-more-summary:hover .mm_guide-more-title {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.mm_guide-more-note {
    color: var(--wg-customer-text-muted);
    font-size: var(--wg-customer-type-meta-size);
}

.mm_guide-more-body {
    padding: 2px 2px 20px;
}

.mm_guide-more-body > :last-child,
.mm_guide-more-body > :last-child > li:last-child {
    margin-bottom: 0;
}

.mm_guide .mm_guide-more-subtitle {
    font-size: var(--wg-customer-type-component-size);
    font-weight: 600;
    margin: 16px 0 6px;
}

.mm_guide-more-body > .mm_guide-more-subtitle:first-child {
    margin-top: 0;
}

/* Measuring help sits inside a tool section, closer to the controls than a page-level group. */
/* A section right after a group of disclosures shares the group's last line instead of drawing its own. */
.mm_guide-more-group + :is(.mm_guide-section, .mm_guide-steps, .mm_guide-back) {
    border-top: 0;
    padding-top: 0;
}

.mm_guide-more-group--measure {
    margin-bottom: 20px;
}

.mm_guide-more-group--measure .mm_guide-measure-list {
    margin-bottom: 0;
}

/* Optional settings inside a form: the same row, framed so it reads as part of the controls. */
.mm_guide-more--options {
    border-top: 1px solid var(--mm-guide-border);
}

.mm_guide-more--options > .mm_guide-more-summary {
    gap: 8px;
}

.mm_guide-more--options .mm_guide-more-title {
    font-size: var(--wg-customer-type-control-size);
    font-weight: 600;
}

.mm_guide-more--options > .mm_guide-more-body {
    padding-top: 6px;
}

/* Forms */
.mm_guide-form {
    margin: 0 0 18px;
}

/* The worked-example note with "Back to the example" beside it, above the controls. */
.mm_guide-form-head {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0 16px;
    justify-content: space-between;
    margin: 0 0 14px;
}

.mm_guide-form-head > .mm_guide-example {
    flex: 1 1 320px;
    margin: 0;
}

.mm_guide-example {
    color: var(--wg-customer-text-muted);
    font-size: var(--wg-customer-type-meta-size);
}

.mm_guide-reset {
    flex: 0 0 auto;
    font-size: var(--wg-customer-type-meta-size);
    font-weight: 600;
    margin-right: -6px;
}

.mm_guide-reset > .fa {
    font-size: 12px;
}

.mm_guide-fieldset {
    border: 0;
    margin: 0 0 18px;
    min-width: 0;
    padding: 0;
}

.mm_guide-fieldset > legend {
    border: 0;
    margin: 0 0 10px;
    padding: 0;
}

.mm_guide-field {
    min-width: 0;
}

.mm_guide-label {
    display: block;
    font-size: var(--wg-customer-type-control-size);
    font-weight: 500;
    margin: 0 0 6px;
}

/* Sliders: the label, then − value + on one line, and the full-width track below. The value shows
   the unit. The track is filled from --mm-fill-from to --mm-fill, thumb positions from 0 to 1. */
.mm_guide-sliders {
    display: grid;
    gap: 22px;
}

.mm_guide-slider-head {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 4px 12px;
    justify-content: space-between;
}

.mm_guide-stepper {
    align-items: center;
    display: inline-flex;
    flex: none;
    gap: 6px;
    margin-left: auto;
}

/* Every label starts from the same width, so whether − value + shares its line depends on the screen,
   never on the wording: a label that changes with a unit keeps the slider at one height. Two lines of
   label are as tall as the buttons. */
.mm_guide-slider-head .mm_guide-label {
    flex: 1 1 8em;
    line-height: 22px;
    margin: 0;
    min-width: 0;
    overflow-wrap: break-word;
}

.mm_guide-slider-value {
    color: #292522;
    font-size: 20px;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    line-height: 1.2;
    min-width: 4.4em;
    text-align: center;
    white-space: nowrap;
}

.mm_guide-slider .mm_guide-hint {
    margin: 2px 0 0;
}

.mm_guide-slider-track {
    margin-top: 2px;
    min-width: 0;
    position: relative;
}

.mm_guide-range {
    -webkit-appearance: none;
    appearance: none;
    background: transparent;
    cursor: pointer;
    display: block;
    height: 44px;
    margin: 0;
    padding: 0;
    width: 100%;
}

.mm_guide-range:focus {
    outline: none;
}

.mm_guide-range::-webkit-slider-runnable-track {
    background: linear-gradient(to right,
        var(--mm-guide-border) 0,
        var(--mm-guide-border) calc(13px + (100% - 26px) * var(--mm-fill-from, 0)),
        #292522 calc(13px + (100% - 26px) * var(--mm-fill-from, 0)),
        #292522 calc(13px + (100% - 26px) * var(--mm-fill, 0)),
        var(--mm-guide-border) calc(13px + (100% - 26px) * var(--mm-fill, 0)),
        var(--mm-guide-border) 100%);
    border-radius: 3px;
    height: 6px;
}

.mm_guide-range::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    background: #fff;
    border: 2px solid #292522;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(41, 37, 34, .3);
    height: 26px;
    margin-top: -10px;
    transition: box-shadow 120ms ease;
    width: 26px;
}

.mm_guide-range::-moz-range-track {
    background: var(--mm-guide-border);
    border-radius: 3px;
    height: 6px;
}

.mm_guide-range::-moz-range-progress {
    background: #292522;
    border-radius: 3px;
    height: 6px;
}

.mm_guide-range::-moz-range-thumb {
    background: #fff;
    border: 2px solid #292522;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(41, 37, 34, .3);
    height: 22px;
    width: 22px;
}

.mm_guide-range:hover::-webkit-slider-thumb {
    box-shadow: 0 0 0 6px rgba(41, 37, 34, .08), 0 1px 3px rgba(41, 37, 34, .3);
}

.mm_guide-range:focus-visible::-webkit-slider-thumb {
    border-color: var(--mm-guide-focus);
    box-shadow: 0 0 0 4px rgba(39, 109, 125, .35);
}

.mm_guide-range:focus-visible::-moz-range-thumb {
    border-color: var(--mm-guide-focus);
    box-shadow: 0 0 0 4px rgba(39, 109, 125, .35);
}

.mm_guide-range:disabled {
    cursor: not-allowed;
    opacity: .5;
}

.mm_guide-nudge {
    align-items: center;
    background: #fff;
    border: 1px solid var(--mm-guide-control-border);
    border-radius: 50%;
    color: #292522;
    cursor: pointer;
    display: inline-flex;
    font-family: var(--wg-customer-font-ui);
    font-size: 22px;
    font-weight: 500;
    height: 44px;
    justify-content: center;
    line-height: 1;
    padding: 0;
    touch-action: manipulation;
    -webkit-user-select: none;
    user-select: none;
    width: 44px;
}

.mm_guide-nudge:hover {
    background: var(--mm-guide-surface);
    border-color: #292522;
}

.mm_guide-nudge:active {
    background: var(--mm-guide-soft);
}

/* Size ruler: the chart sizes marked under a slider, at the thumb positions of their measurements. */
.mm_guide-slider-ticks {
    height: 22px;
    margin: -8px 13px 0;
    position: relative;
}

.mm_guide-slider-tick {
    color: var(--wg-customer-text-muted);
    font-size: 11px;
    font-variant-numeric: tabular-nums;
    left: calc(var(--mm-tick) * 100%);
    line-height: 1;
    padding-top: 8px;
    position: absolute;
    top: 0;
    transform: translateX(-50%);
}

.mm_guide-slider-tick::before {
    background: #a49d97;
    content: "";
    height: 5px;
    left: 50%;
    position: absolute;
    top: 0;
    width: 1px;
}

.mm_guide-slider-tick--match {
    color: #292522;
    font-weight: 700;
}

.mm_guide-slider-tick--match::before {
    background: #292522;
    height: 6px;
    margin-left: -.5px;
    width: 2px;
}

/* A slider and a related select side by side, such as stitches counted and the width counted over. */
.mm_guide-pair {
    align-items: start;
    display: grid;
    gap: 16px;
    grid-template-columns: minmax(0, 1fr) 150px;
}

.mm_guide-pair > .mm_guide-select-field {
    padding-top: 2px;
}

.mm_guide-pair--even {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.mm_guide-select {
    position: relative;
}

.mm_guide-select::after {
    border-bottom: 2px solid #292522;
    border-right: 2px solid #292522;
    content: "";
    height: 8px;
    pointer-events: none;
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-70%) rotate(45deg);
    width: 8px;
}

.mm_guide-select > select {
    -webkit-appearance: none;
    appearance: none;
    background: #fff;
    border: 1px solid var(--mm-guide-control-border);
    border-radius: 0;
    color: #292522;
    cursor: pointer;
    font-family: var(--wg-customer-font-ui);
    font-size: 16px;
    height: 48px;
    padding: 0 40px 0 12px;
    width: 100%;
}

.mm_guide-select > select:hover {
    border-color: #292522;
}

.mm_guide-select > select:focus-visible {
    outline: 3px solid var(--mm-guide-focus);
    outline-offset: 2px;
}

.mm_guide-toggle {
    margin: 4px 0 6px;
}

.mm_guide-toggle-body {
    margin-top: 14px;
}

/* Tools: controls beside the diagram on wide screens. */
.mm_guide-tool-layout {
    display: grid;
    gap: 28px;
    grid-template-columns: minmax(0, 1fr);
}

@media screen and (min-width: 900px) {
    .mm_guide-tool-layout {
        align-items: start;
        grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
    }
}

/* The diagram and the result under it stay in view while the controls scroll past, clearing the
   storefront's fixed menu bar. guides.js sets the class only while the whole column fits on screen,
   so a short screen scrolls the column normally rather than hide the result. */
@media screen and (min-width: 900px) {
    .mm_guide-tool-visual--sticky {
        position: sticky;
        top: 80px;
    }
}

.mm_guide-tool-visual > .mm_guide-result-region {
    margin: 12px 0 0;
}

/* The result's summary at the foot of the screen, after a change made while the result is out of view. */
.mm_guide .mm_guide-live {
    background: #fff;
    border-top: 3px solid var(--mm-guide-accent);
    bottom: 0;
    box-shadow: 0 -6px 18px rgba(41, 37, 34, .12);
    font-size: 15px;
    font-weight: 600;
    left: 0;
    line-height: 1.4;
    margin: 0 auto;
    max-width: 980px;
    padding: 12px 20px calc(12px + env(safe-area-inset-bottom, 0px));
    pointer-events: none;
    position: fixed;
    right: 0;
    z-index: 60;
}

.mm_guide .mm_guide-live:empty {
    display: none;
}

.mm_guide-live:not([hidden]) {
    animation: mm-guide-live-in 160ms ease-out;
}

@keyframes mm-guide-live-in {
    from {
        opacity: 0;
        transform: translateY(100%);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.mm_guide-diagram {
    background: #fff;
    border: 1px solid var(--mm-guide-border);
    border-radius: 6px;
    margin: 0;
    padding: 14px;
}

.mm_guide-diagram-caption {
    color: var(--wg-customer-text-muted);
    font-size: 12px;
    line-height: 1.45;
    margin-top: 10px;
}

/* Wide screens: each drawing is at most as tall as the screen leaves room for, after the menu bar and
   the rest of its column (caption and result). The column then fits on a laptop screen
   and stays in view beside the controls (guides.js). Ratio is the drawing's height / width. */
@media screen and (min-width: 900px) {
    .mm_guide-tool-visual .mm_guide-diagram-canvas {
        margin-inline: auto;
        max-width: min(var(--mm-diagram-max, 100%), max(240px, calc((100vh - var(--mm-diagram-reserve, 0px)) / var(--mm-diagram-ratio, 1))));
    }

    .mm_guide-diagram--fit {
        --mm-diagram-max: 360px;
        --mm-diagram-ratio: .882;
        --mm-diagram-reserve: 335px;
    }

    .mm_guide-diagram--length {
        --mm-diagram-ratio: 1.316;
        --mm-diagram-reserve: 214px;
    }

    .mm_guide-diagram--gauge {
        --mm-diagram-ratio: .833;
        --mm-diagram-reserve: 395px;
    }
}

/* Diagrams drawn by guides.js. */
.mm_diagram {
    display: block;
    font-family: var(--wg-customer-font-ui);
    height: auto;
    overflow: visible;
    -webkit-user-select: none;
    user-select: none;
    width: 100%;
}

.mm_diagram text {
    fill: #292522;
    font-size: 11px;
}

.mm_diagram .mm_diagram-scale {
    fill: #6f6964;
    font-size: 10px;
    font-variant-numeric: tabular-nums;
    text-anchor: end;
}

.mm_diagram .mm_diagram-scale--start {
    text-anchor: start;
}

.mm_diagram .mm_diagram-scale--middle {
    text-anchor: middle;
}

.mm_diagram .mm_diagram-label {
    fill: #6f6964;
    font-size: 11px;
    text-anchor: start;
}

.mm_diagram .mm_diagram-label--hem,
.mm_diagram .mm_diagram-value--hem {
    fill: var(--mm-guide-accent);
}

.mm_diagram .mm_diagram-value {
    font-size: 13px;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    text-anchor: start;
}

.mm_diagram .mm_diagram-title {
    font-size: 13px;
    font-weight: 600;
}

.mm_diagram-body {
    fill: #fff;
    stroke: #a49d97;
    stroke-width: 1.5;
}

.mm_diagram-garment {
    fill: var(--mm-guide-soft);
    stroke: #292522;
    stroke-linejoin: round;
    stroke-width: 1.5;
}

.mm_diagram-hem line {
    stroke: var(--mm-guide-accent);
    stroke-linecap: round;
    stroke-width: 3;
}

.mm_diagram-hem-guide {
    stroke: var(--mm-guide-accent);
    stroke-dasharray: 2 3;
    stroke-width: 1.5;
}

.mm_diagram-mark {
    stroke: #292522;
    stroke-dasharray: 6 4;
    stroke-width: 2;
}

.mm_diagram-floor {
    stroke: var(--mm-guide-control-border);
    stroke-linecap: round;
    stroke-width: 2;
}

.mm_diagram-tape-body {
    fill: #f7f0e6;
    stroke: #cdbba6;
}

.mm_diagram-tick {
    stroke: #6f6964;
    stroke-width: 1;
}

.mm_diagram-reference {
    fill: var(--mm-guide-accent);
}

.mm_diagram-reference-guide {
    stroke: var(--mm-guide-accent);
    stroke-dasharray: 3 3;
    stroke-width: 1;
}

.mm_diagram-grip {
    fill: transparent;
}

.mm_diagram-handle {
    cursor: grab;
    touch-action: none;
}

.mm_diagram--dragging,
.mm_diagram--dragging .mm_diagram-handle {
    cursor: grabbing;
}

.mm_diagram-knob {
    fill: #fff;
    filter: drop-shadow(0 1px 1.5px rgba(41, 37, 34, .3));
    stroke-width: 2.5;
    transition: stroke-width 120ms ease;
}

.mm_diagram-knob--hem {
    stroke: var(--mm-guide-accent);
}

.mm_diagram-knob--mark {
    stroke: #292522;
}

.mm_diagram-handle:hover .mm_diagram-knob,
.mm_diagram--dragging .mm_diagram-knob {
    stroke-width: 4;
}

.mm_diagram-piece {
    stroke: #292522;
    stroke-width: 1.5;
}

.mm_diagram-knit-ground {
    fill: #f6f1ec;
}

.mm_diagram-knit {
    fill: none;
    stroke: #d9cabe;
    stroke-width: 1;
}

.mm_diagram-swatch-ground {
    fill: #e9dacf;
}

.mm_diagram-knit--swatch {
    stroke: #b58f79;
}

.mm_diagram-swatch {
    stroke: var(--mm-guide-accent);
    stroke-width: 1.5;
}

.mm_diagram-target {
    fill: none;
    stroke: var(--mm-guide-accent);
    stroke-dasharray: 5 4;
    stroke-width: 1.5;
}

.mm_diagram-dimension {
    fill: none;
    stroke: #6f6964;
    stroke-width: 1;
}

.mm_diagram-dimension--target {
    stroke: var(--mm-guide-accent);
}

/* Fit and size: the dress form, live beside the sliders and on each body-shape card. */
.mm_diagram-form,
.mm_fit-figure-form {
    fill: #fff;
    stroke: #6f6964;
    stroke-linejoin: round;
    stroke-width: 1.5;
}

.mm_diagram-stand,
.mm_fit-figure-stand {
    fill: none;
    stroke: #6f6964;
    stroke-linecap: round;
    stroke-width: 1.5;
}

/* The shape line traces the form's sides from bust to hips. */
.mm_diagram-shape,
.mm_fit-figure-shape {
    fill: none;
    stroke: var(--mm-fit-shape);
    stroke-linecap: round;
    stroke-width: 3;
}

.mm_fit-figure-form,
.mm_fit-figure-stand {
    stroke-width: 1.2;
}

.mm_fit-figure-shape {
    stroke-width: 2.4;
}

.mm_diagram-tape-front,
.mm_diagram-tape-back {
    fill: none;
    stroke: var(--mm-guide-accent);
    stroke-linecap: round;
}

.mm_diagram-tape-front {
    stroke-width: 2;
}

.mm_diagram-tape-back {
    stroke-dasharray: 3 4;
    stroke-width: 1.25;
}

.mm_diagram-leader {
    stroke: #c9c4c0;
    stroke-dasharray: 2 3;
    stroke-width: 1;
}

.mm_diagram-knob--fit {
    stroke: var(--mm-guide-accent);
}

/* The tape and label of the measurement being changed. */
.mm_diagram--active-bust .mm_diagram-tape-front.mm_diagram-part--bust,
.mm_diagram--active-waist .mm_diagram-tape-front.mm_diagram-part--waist,
.mm_diagram--active-hips .mm_diagram-tape-front.mm_diagram-part--hips {
    stroke-width: 3.5;
}

.mm_diagram--active-bust .mm_diagram-label.mm_diagram-part--bust,
.mm_diagram--active-waist .mm_diagram-label.mm_diagram-part--waist,
.mm_diagram--active-hips .mm_diagram-label.mm_diagram-part--hips {
    fill: var(--mm-guide-accent);
    font-weight: 600;
}

.mm_diagram-bar--pattern {
    fill: #c9c4c0;
}

.mm_diagram-bar--yours {
    fill: var(--mm-guide-accent);
}

/* The length comparison before it is ticked. */
.mm_diagram-placeholder {
    fill: none;
    stroke: #c9c4c0;
    stroke-dasharray: 4 3;
}

.mm_diagram .mm_diagram-title--off {
    fill: #6f6964;
}

.mm_diagram-ball {
    fill: var(--mm-guide-surface);
}

.mm_diagram-ball-needed {
    fill: var(--mm-guide-accent);
}

.mm_diagram-ball-extra {
    fill: #dcc0b0;
}

.mm_diagram-ball-outline {
    fill: none;
    stroke: var(--mm-guide-control-border);
}

/* One legend entry per line, so the legend keeps its height when an entry comes or goes. */
.mm_diagram-legend {
    display: grid;
    font-size: 13px;
    gap: 4px;
    list-style: none;
    margin: 12px 0 0;
    min-height: calc(3 * 1.6em + 8px);
    padding: 0;
}

.mm_diagram-legend > li {
    align-items: center;
    display: inline-flex;
    gap: 7px;
}

.mm_diagram-legend-swatch {
    border: 1px solid var(--mm-guide-control-border);
    border-radius: 3px;
    display: inline-block;
    height: 14px;
    width: 14px;
}

.mm_diagram-legend-swatch--needed {
    background: var(--mm-guide-accent);
    border-color: var(--mm-guide-accent);
}

.mm_diagram-legend-swatch--extra {
    background: #dcc0b0;
    border-color: #dcc0b0;
}

.mm_diagram-legend-swatch--spare {
    background: var(--mm-guide-surface);
}

.mm_guide-choice {
    border: 0;
    margin: 0 0 20px;
    min-width: 0;
    padding: 0;
}

.mm_guide-choice > legend {
    border: 0;
    margin: 0 0 10px;
    padding: 0;
}

.mm_guide-choice-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.mm_guide-choice-option {
    cursor: pointer;
    margin: 0;
    position: relative;
}

/* The storefront makes every radio button position: relative !important; these stay out of the layout. */
.mm_guide-choice-option > input[type="radio"] {
    height: 1px;
    opacity: 0;
    overflow: hidden;
    position: absolute !important;
    width: 1px;
}

.mm_guide-choice-option > span {
    align-items: center;
    background: #fff;
    border: 1px solid var(--mm-guide-control-border);
    display: inline-flex;
    font-weight: 500;
    min-height: 46px;
    min-width: 46px;
    padding: 6px 14px;
}

.mm_guide-choice-option:hover > input:not(:checked) + span {
    border-color: #292522;
}

.mm_guide-choice-option > input:checked + span {
    background: #292522;
    border-color: #292522;
    color: #fff;
}

.mm_guide-choice-option > input:focus-visible + span {
    outline: 3px solid var(--mm-guide-focus);
    outline-offset: 3px;
}

/* A short choice on one line with its label, such as the ease unit. A floated legend joins the line. */
.mm_guide-choice--inline {
    margin: 0;
}

.mm_guide-choice--inline > legend {
    float: left;
    font-weight: 500;
    line-height: 46px;
    margin: 0 14px 0 0;
    width: auto;
}

.mm_guide-choice--inline > .mm_guide-choice-options {
    display: inline-flex;
}

/* Gauge: the mode buttons name the panel below them, so its heading is for assistive technology
   only and the two read as one block. Printing shows both panels with their headings. */
@media screen {
    .mm_guide-mode-panel {
        border-top: 0;
        padding-top: 0;
    }

    .mm_guide-mode-panel > h2 {
        border: 0;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        white-space: nowrap;
        width: 1px;
    }
}

.mm_guide-check {
    align-items: center;
    display: flex;
    gap: 10px;
    min-height: 44px;
}

.mm_guide-check > input {
    accent-color: #292522;
    height: 22px;
    margin: 0;
    width: 22px;
}

.mm_guide-check > label {
    cursor: pointer;
    font-weight: 500;
    margin: 0;
}

/* Results: a few short lines in a box. Its heading is read out but not shown (CustomerGuideRenderer). */
.mm_guide-result-region {
    background: var(--mm-guide-surface);
    border-left: 3px solid var(--mm-guide-accent);
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    margin: 0 0 24px;
    padding: 12px 16px;
    position: relative;
}

/* The result shares its cell with a hidden copy of its longest wording (guides.js), so the box keeps
   one height while values change and nothing around it moves. */
.mm_guide-result {
    display: flex;
    flex-direction: column;
    font-size: 15px;
    gap: 2px;
    grid-area: 1 / 1;
    line-height: 1.4;
}

.mm_guide-result-sizer {
    visibility: hidden;
}

.mm_guide-result-slot {
    display: grid;
}

.mm_guide-result-slot > p {
    grid-area: 1 / 1;
    margin: 0;
}

.mm_guide-result > p {
    margin: 0;
}

.mm_guide-result-summary {
    font-size: 16px;
    font-weight: 600;
}

.mm_guide-result-note,
.mm_guide-result-empty {
    color: var(--wg-customer-text-muted);
    font-size: 14px;
}

/* Opens the closest shape's description, under the result's lines. */
.mm_guide .mm_fit-closest-read {
    font-size: 14px;
    justify-self: start;
    margin: 2px 0 -10px -6px;
    min-height: 36px;
}

.mm_fit-closest-read::after {
    content: " \2192";
}

/* Measuring instructions and reference points */
.mm_guide-measure-list {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    list-style: none;
    margin: 0 0 24px;
    padding: 0;
}

/* Each measuring card puts its small figure beside the text. */
.mm_guide-measure {
    align-items: start;
    border: 1px solid var(--mm-guide-border);
    border-radius: 5px;
    display: grid;
    gap: 12px;
    grid-template-columns: 76px minmax(0, 1fr);
    padding: 14px;
    transition: border-color 150ms ease, box-shadow 150ms ease;
}

.mm_guide-measure p:last-child {
    margin-bottom: 0;
}

.mm_guide-measure--active {
    border-color: var(--mm-guide-accent);
    box-shadow: inset 0 0 0 1px var(--mm-guide-accent);
}

.mm_guide-measure .mm_guide-figure svg {
    margin: 0;
    max-width: 76px;
}

.mm_guide-measure-title {
    font-size: var(--wg-customer-type-component-size);
    font-weight: 600;
    margin: 0 0 6px;
}

.mm_length-reference {
    align-items: start;
    background: var(--mm-guide-surface);
    display: grid;
    gap: 18px;
    grid-template-columns: 160px minmax(0, 1fr);
    padding: 16px;
}

.mm_length-reference .mm_guide-list {
    margin-bottom: 0;
}

/* The three reference points share one grid cell, so the panel keeps its height when the choice
   changes; the ones not chosen keep their space only. */
@media screen {
    .mm_length-references {
        display: grid;
    }

    .mm_length-references > .mm_length-reference {
        grid-area: 1 / 1;
    }

    .mm_guide .mm_length-references > [hidden] {
        display: grid !important;
        visibility: hidden;
    }
}

.mm_guide-more-subtitle + .mm_guide-checklist {
    margin-bottom: 16px;
}

/* Body shapes */
.mm_fit-shape-picker {
    border: 0;
    margin: 0 0 20px;
    min-width: 0;
    padding: 0;
}

/* Room above the cards for the "closest" badge, which overlaps a card's top edge. */
.mm_fit-shape-options {
    display: grid;
    gap: 18px 10px;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    padding-top: 10px;
}

.mm_fit-shape-option {
    cursor: pointer;
    margin: 0;
    position: relative;
}

.mm_fit-shape-option > input[type="radio"] {
    height: 1px;
    left: 0;
    opacity: 0;
    overflow: hidden;
    position: absolute !important;
    top: 0;
    width: 1px;
}

/* Every card has the same proportions, so the forms line up and can be compared. */
.mm_fit-shape-image {
    align-items: center;
    aspect-ratio: 84 / 156;
    background: #fff;
    border: 1px solid var(--mm-guide-border);
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    gap: 4%;
    justify-content: center;
    overflow: hidden;
    padding: 6% 4%;
    transition: background-color 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}

.mm_fit-figure {
    display: block;
    height: 72%;
    max-width: 100%;
    width: auto;
}

.mm_fit-shape-symbol {
    display: block;
    height: 13%;
}

.mm_fit-shape-symbol svg {
    display: block;
    fill: none;
    height: 100%;
    stroke: var(--mm-fit-shape);
    stroke-width: 2;
    width: auto;
}

/* The closest shape is tinted and labelled; the runner-up, when almost as close, is outlined. */
.mm_fit-shape-option--closest .mm_fit-shape-image {
    background: #eef5fa;
    border-color: var(--mm-fit-shape);
}

.mm_fit-shape-option--also .mm_fit-shape-image {
    border-color: var(--mm-fit-shape);
    border-style: dashed;
}

.mm_fit-shape-badge {
    background: var(--mm-fit-shape-strong);
    border-radius: 999px;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    left: 50%;
    line-height: 1.3;
    max-width: calc(100% + 8px);
    overflow: hidden;
    padding: 2px 8px;
    pointer-events: none;
    position: absolute;
    text-overflow: ellipsis;
    top: -9px;
    transform: translateX(-50%);
    white-space: nowrap;
}

.mm_fit-shape-option--also .mm_fit-shape-badge {
    background: #e3eff7;
    color: #1f5f86;
}

.mm_fit-shapes-title {
    margin-top: 40px;
}

.mm_fit-shape-detail {
    scroll-margin-top: 110px;
}

.mm_fit-shape-detail h4:focus {
    outline: none;
}

.mm_fit-shape-image--unsure {
    color: var(--wg-customer-text-muted);
    font-family: var(--wg-customer-font-display);
    font-size: 40px;
}

.mm_fit-shape-name {
    display: block;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.3;
    margin-top: 6px;
    text-align: center;
}

.mm_fit-shape-option:hover .mm_fit-shape-image {
    border-color: #292522;
}

.mm_fit-shape-option > input:checked ~ .mm_fit-shape-image {
    border-color: #292522;
    box-shadow: inset 0 0 0 2px #292522;
}

.mm_fit-shape-option > input:checked ~ .mm_fit-shape-name {
    font-weight: 700;
}

.mm_fit-shape-option > input:focus-visible ~ .mm_fit-shape-image {
    outline: 3px solid var(--mm-guide-focus);
    outline-offset: 3px;
}

.mm_fit-shape-detail {
    background: var(--mm-guide-surface);
    margin: 0 0 16px;
    padding: 18px 20px;
}

.mm_fit-shape-detail > h3 {
    margin: 0 0 12px;
}

.mm_fit-shape-detail-grid {
    align-items: start;
    display: grid;
    gap: 22px;
    grid-template-columns: 110px minmax(0, 1fr);
}

/* The shape's figure in its description: the card's drawing and symbol on a white tile. */
.mm_fit-shape-figure {
    align-items: center;
    aspect-ratio: 84 / 156;
    background: #fff;
    border: 1px solid var(--mm-guide-border);
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    gap: 4%;
    justify-content: center;
    margin: 0;
    padding: 6% 4%;
}

.mm_fit-traits-title {
    font-size: var(--wg-customer-type-component-size);
    font-weight: 600;
    margin: 0 0 6px;
}

/* Size chart */
.mm_guide-table-wrap {
    max-width: 100%;
    overflow-x: auto;
}

.mm_fit-tool .mm_guide-table-wrap {
    margin-top: 32px;
}

.mm_fit-chart {
    border-collapse: collapse;
    font-size: 14px;
    width: 100%;
}

.mm_fit-chart caption {
    caption-side: top;
    color: #292522;
    padding: 0 0 10px;
    text-align: left;
}

.mm_fit-chart-title {
    display: block;
    font-weight: 600;
}

.mm_fit-chart-caption {
    color: var(--wg-customer-text-muted);
    font-size: var(--wg-customer-type-meta-size);
}

.mm_fit-chart th,
.mm_fit-chart td {
    border-bottom: 1px solid var(--mm-guide-border);
    padding: 9px 8px;
    text-align: right;
    white-space: nowrap;
}

.mm_fit-chart th:first-child {
    text-align: left;
}

.mm_fit-chart thead th {
    color: var(--wg-customer-text-muted);
    font-size: 13px;
    font-weight: 600;
}

.mm_fit-chart-row--match th,
.mm_fit-chart-row--match td {
    background: var(--mm-guide-surface);
    font-weight: 700;
}

/* Related products */
/* Six products fit one row at the guide's full width. */
.mm_guide-products {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fill, minmax(136px, 1fr));
    list-style: none;
    margin: 0;
    padding: 0;
}

.mm_guide-product-link {
    color: #292522;
    display: block;
    text-decoration: none !important;
}

.mm_guide-product-link img {
    aspect-ratio: 3 / 4;
    background: var(--mm-guide-surface);
    display: block;
    height: auto;
    margin-bottom: 8px;
    object-fit: cover;
    width: 100%;
}

.mm_guide-product-title {
    font-size: 14px;
    font-weight: 500;
}

/* Saving */
.mm_guide-saved {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 8px 0;
}

.mm_guide-saved > p {
    flex: 1 1 100%;
    margin: 0;
}

.mm_guide-save-status:empty {
    display: none;
}

.mm_guide-script-error {
    color: var(--mm-guide-error);
    font-weight: 600;
}

/* Row counter */
.mm_counter-display {
    margin: 0 0 20px;
    text-align: center;
}

.mm_counter-label {
    margin: 0 0 4px;
}

.mm_counter-value {
    display: block;
    font-family: var(--wg-customer-font-ui);
    font-size: 88px;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    line-height: 1.05;
}

.mm_counter-progress {
    accent-color: #292522;
    height: 10px;
    margin-top: 10px;
    max-width: 420px;
    width: 100%;
}

.mm_counter-progress-text {
    line-height: 1.5;
    margin: 6px 0 0;
    min-height: 1.5em;
}

/* The progress keeps its room while no target is set, so ticking the target never moves the buttons. */
.mm_counter .mm_counter-progress[hidden] {
    display: inline-block !important;
    visibility: hidden;
}

.mm_counter-actions {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0 auto 20px;
    max-width: 520px;
}

.mm_counter-increment {
    background: var(--wg-customer-commerce-primary);
    border: 1px solid var(--wg-customer-commerce-primary);
    border-radius: 6px;
    color: var(--wg-customer-commerce-primary-text);
    cursor: pointer;
    font-size: 40px;
    font-weight: 600;
    grid-column: 1 / -1;
    min-height: 112px;
    touch-action: manipulation;
}

.mm_counter-increment:hover {
    background: var(--wg-customer-commerce-primary-hover);
}

.mm_counter-actions .mm_guide-button {
    width: 100%;
}

.mm_counter-confirm {
    background: var(--mm-guide-surface);
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 auto 20px;
    max-width: 520px;
    padding: 16px;
}

.mm_counter-confirm > p {
    flex: 1 1 100%;
    font-weight: 600;
    margin: 0;
}

.mm_counter .mm_guide-form {
    margin: 0 auto 10px;
    max-width: 520px;
}

.mm_counter-wake,
.mm_counter [data-mm-counter-wake-unsupported] {
    margin: 0 auto;
    max-width: 520px;
}

@media screen and (max-width: 900px) {
    .mm_fit-shape-options {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .mm_guide-measure-list {
        grid-template-columns: 1fr;
    }

    .mm_guide-measure {
        gap: 14px;
        grid-template-columns: 88px minmax(0, 1fr);
    }

    .mm_guide-measure .mm_guide-figure svg {
        max-width: 88px;
        margin: 0;
    }
}

@media screen and (max-width: 767px) {
    body#wg_mainbody .mm_guide,
    body#wg_mainbody .mm_guides {
        padding: 24px 16px 56px;
    }

    .mm_guide-intro {
        font-size: 16px;
    }

    .mm_guide-step {
        gap: 14px;
        grid-template-columns: 1fr;
    }

    .mm_guide-step .mm_guide-figure svg {
        margin: 0 auto;
        max-width: 240px;
    }

    .mm_guide-steps--single:not(.mm_guide-steps--printing) .mm_guide-step-list {
        padding: 4px 16px 0;
    }

    .mm_guide-pair {
        gap: 14px;
        grid-template-columns: minmax(0, 1fr);
    }

    .mm_guide-products {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mm_guide-diagram {
        padding: 12px;
    }

    .mm_length-reference,
    .mm_fit-shape-detail-grid {
        grid-template-columns: 90px minmax(0, 1fr);
    }

    .mm_guide-step-nav > .mm_guide-button {
        flex: 1 1 auto;
    }

    .mm_fit-chart {
        font-size: 13px;
    }

    .mm_fit-chart th,
    .mm_fit-chart td {
        padding: 8px 5px;
    }

    .mm_fit-chart thead th {
        font-size: 12px;
        vertical-align: bottom;
        white-space: normal;
    }

    .mm_counter-value {
        font-size: 72px;
    }
}

@media screen and (max-width: 899px) {
    /* One column: the result follows the controls, and the diagram follows the result. */
    .mm_guide-tool-layout {
        gap: 24px;
    }

    .mm_guide-tool-visual {
        display: contents;
    }

    .mm_guide-tool-visual > .mm_guide-result-region {
        margin: 0;
        order: 1;
    }

    .mm_guide-tool-visual > .mm_guide-diagram {
        order: 2;
    }

    /* The length figure and the body figure are what visitors drag, so they come before the sliders. */
    .mm_length-tool .mm_guide-tool-visual > .mm_guide-diagram,
    .mm_fit-tool .mm_guide-diagram--fit {
        order: -1;
    }

    .mm_fit-tool .mm_guide-diagram-canvas {
        max-width: 270px;
    }
}

@media screen and (max-width: 360px) {
    /* Every other size label on the narrowest size rulers, so labels never touch; matches stay visible. */
    .mm_guide-slider-tick:nth-child(even):not(.mm_guide-slider-tick--match) {
        color: transparent;
    }

    /* Two neighbouring matches would overlap: the first keeps its label, both keep their marks. */
    .mm_guide-slider-tick--match + .mm_guide-slider-tick--match {
        color: transparent;
    }
}

@media screen and (max-width: 380px) {
    .mm_fit-shape-options {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .mm_fit-chart {
        font-size: 12px;
    }

    .mm_fit-chart th,
    .mm_fit-chart td {
        padding: 7px 2px;
    }

    .mm_fit-chart thead th {
        font-size: 11px;
        letter-spacing: -.01em;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mm_guides-card-link,
    .mm_guides-card-media,
    .mm_guides-card-media svg,
    .mm_guides-card-media img,
    .mm_guides-card-action::after,
    .mm_guide-step-list::before,
    .mm_guide-more-summary::after {
        transition: none;
    }

    .mm_guides-card-link:hover .mm_guides-card-media svg,
    .mm_guides-card-link:hover .mm_guides-card-media img,
    .mm_guides-card-link:hover .mm_guides-card-action::after {
        transform: none;
    }

    .mm_guide-live:not([hidden]) {
        animation: none;
    }
}

/* Print: the whole guide, all steps and every method section, without page chrome or controls. */
@media print {
    body#wg_mainbody * {
        visibility: hidden;
    }

    body#wg_mainbody .mm_guide,
    body#wg_mainbody .mm_guide * {
        visibility: visible;
    }

    body#wg_mainbody .mm_guide {
        left: 0;
        max-width: none;
        padding: 0;
        position: absolute;
        top: 0;
    }

    .mm_guide-step--hidden,
    .mm_guide [hidden][data-mm-print-visible] {
        display: block !important;
    }

    .mm_guide-step {
        border-bottom: 1px solid var(--mm-guide-border);
        break-inside: avoid;
    }

    /* guides.js opens every disclosure for printing; the summaries print as plain headings. */
    .mm_guide-more,
    .mm_guide-more-group {
        border: 0;
    }

    .mm_guide-more-summary {
        min-height: 0;
        padding: 12px 0 4px;
    }

    .mm_guide-more-summary::after,
    .mm_guide-reset,
    .mm_guide-result-sizer {
        display: none !important;
    }

    .mm_guide-breadcrumb,
    .mm_guide-back,
    .mm_guide-header-actions,
    .mm_guide-step-nav,
    .mm_guide-progress,
    .mm_guide-finished,
    [data-mm-guide-mode],
    .mm_guide-mode-choice,
    .mm_guide-nudge,
    .mm_fit-closest-read,
    .mm_diagram-knob,
    .mm_guide-save,
    .mm_guide-script-error,
    .mm_guide-live,
    .mm_counter-actions,
    .mm_counter-confirm,
    .mm_counter-wake {
        display: none !important;
    }

    .mm_guide-figure svg {
        max-width: 240px;
    }

    .mm_guide-diagram-canvas {
        margin: 0 auto;
        max-width: 340px;
    }
}

/* Tools & Guides: contextual links on product, Custom Made and collection pages. */
#mm_fitguidelink.mm_fitguide-link,
#wg_custommade_fitguide {
    margin-left: 16px;
}

.mm_guide-related-links ul {
    list-style: none;
    margin: 12px 0 0;
    padding: 0;
}

.mm_guide-related-links li {
    margin: 4px 0;
}

.mm_guide-related-links a {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Content pages (blog, customer service, about): readable side margins on phones. */
@media screen and (max-width: 767px) {
    #wg_contentpagewebpage_container #wg_contentcontainer {
        padding-left: 12px;
        padding-right: 12px;
    }
}

/* Not-found page: the ways back into the store must look like links. */
.wg_customer-notfound-links a {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Small text links in the header and footer: a larger, invisible touch area (at least 24px high) without moving the underline. */
.mm_header-info-button,
.mm_footer-assurance-link {
    position: relative;
}

.mm_header-info-button::after,
.mm_footer-assurance-link::after {
    bottom: -8px;
    content: "";
    left: -4px;
    position: absolute;
    right: -4px;
    top: -8px;
}

/* Pinch-zoom is allowed (viewport in Templates/Common.htm). iOS zooms into form fields with text below
   16px when they get focus, so phones use 16px field text. */
@media screen and (max-width: 767px) {
    body#wg_mainbody input[type="text"],
    body#wg_mainbody input[type="email"],
    body#wg_mainbody input[type="tel"],
    body#wg_mainbody input[type="number"],
    body#wg_mainbody input[type="password"],
    body#wg_mainbody input[type="search"],
    body#wg_mainbody input[type="url"],
    body#wg_mainbody input:not([type]),
    body#wg_mainbody select,
    body#wg_mainbody textarea {
        font-size: 16px !important;
    }
}