/* Styles exclusive to CartGrid_mod2b. */
.btm-material .card .card-content {
    padding-bottom: 10px;
}

/* BillingShipping2 text fields: compact labels above the input line. */
.btm-material .BTMEComm_BillingTextField,
.btm-material .BTMEComm_BillingSelectField {
    border-radius: 6px 6px 0 0;
    display: flex;
    flex-direction: column-reverse;
    padding-top: 10px;
    position: relative;
}

.btm-material .BTMEComm_BillingTextField::before,
.btm-material .BTMEComm_BillingSelectField::before {
    background-color: rgba(0, 0, 0, 0.03);
    border-radius: 6px 6px 0 0;
    bottom: 0;
    content: "";
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 0;
}

.btm-material .mtr-col.BTMEComm_BillingTextField::before {
    left: 0.75rem;
    right: 0.75rem;
}

/* Grid columns reset their padding as a shorthand; preserve the field's label inset. */
.btm-material .mtr-col.BTMEComm_BillingTextField {
    padding-top: 10px !important;
}

.btm-material .BTMEComm_BillingTextField > label,
.btm-material .BTMEComm_BillingSelectField > label {
    display: block;
    line-height: 1.2;
    margin-bottom: 0;
    padding: 0 10px;
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: translateY(-3px) !important;
    transform-origin: initial !important;
    z-index: 1;
}

.btm-material .BTMEComm_BillingTextField > input[type="text"] {
    background-color: transparent;
    box-sizing: border-box;
    height: 1.75rem;
    margin: 0;
    padding: 0 10px;
    position: relative;
    width: 100%;
    z-index: 1;
}

.btm-material .BTMEComm_BillingSelectField > select {
    background-color: transparent;
    box-sizing: border-box;
    height: 1.75rem;
    padding: 0 10px;
    position: relative;
    width: 100%;
    z-index: 1;
}

.btm-material .BTMEComm_BillingFields > .mtr-col {
    margin-bottom: 12px;
}

.btm-material .BTMEComm_BillingTextRow {
    margin-bottom: 0;
}

/* Locked Country, State and Zip fields retain the same visual language as disabled inputs. */
.btm-material .ship-lock.BTMEComm_BillingLockField:empty {
    display: none;
}

.btm-material .ship-lock.BTMEComm_BillingLockField {
    background-color: rgba(0, 0, 0, 0.03);
    border-bottom: 1px solid rgba(0, 0, 0, 0.26);
    border-radius: 6px 6px 0 0;
    box-sizing: border-box;
    color: rgba(0, 0, 0, 0.38);
    display: block;
    font-size: 16px;
    height: 53px;
    line-height: 1.2;
    padding: 25px 10px 0;
    position: relative;
}

.btm-material .ship-lock.BTMEComm_BillingLockField::before {
    color: rgba(0, 0, 0, 0.54);
    content: attr(data-label);
    font-size: 0.8rem;
    left: 10px;
    line-height: 1.2;
    position: absolute;
    top: 7px;
}

/* When a lock has a value, its faux field replaces the editable control and label. */
.btm-material .ship-lock.BTMEComm_BillingLockField:not(:empty) + .BTMEComm_BillingTextField,
.btm-material .ship-lock.BTMEComm_BillingLockField:not(:empty) + .BTMEComm_BillingSelectField {
    display: none;
}

/* Billing and Shipping remain side by side until the available width falls below 750 px. */
@media (max-width: 750px) {
    .btm-material .BTMEComm_BillingShippingColumns > .BTMEComm_BillingShippingColumn {
        width: 100% !important;
    }
}

.BTMEComm_CouponMessageLayout {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    margin-bottom: 20px;
}

.BTMEComm_CouponMessagePanel {
    flex: 1 1 0;
    min-width: 0;
}

.BTMEComm_CouponControls {
    display: flex;
    align-items: flex-end;
    gap: 16px;
}

/* Keep the coupon field compact while there is horizontal room. */
.BTMEComm_CouponInput {
    flex: 0 1 220px;
    max-width: 220px;
    min-width: 0;
}

.BTMEComm_CouponInput input {
    box-sizing: border-box;
    width: 100%;
}

.BTMEComm_CouponAction {
    flex: 0 0 auto;
}

/* Align Available Options with the shipping and coupon controls. */
.btm-material .BTMEComm_ShippingOptionsRow > .mtr-col {
    padding-left: 0 !important;
}

/* Checkout actions: use one consistent spacing system instead of right margins. */
.btm-material .BTMEComm_CheckoutActions {
    align-items: center;
    display: flex;
    gap: 24px;
    justify-content: flex-end;
}

.btm-material .BTMEComm_CheckoutActions .r30 {
    margin-right: 0 !important;
}

/* In horizontal layouts, destructive Clear Cart stays separate on the left. */
@media (min-width: 601px) {
    .btm-material .BTMEComm_CheckoutActions .BTMEComm_CheckoutClear {
        margin-right: auto !important;
    }
}

/* Medium and larger: Country, Zip Code, and Calculate Shipping share one row. */
@media (min-width: 601px) {
    .BTMEComm_ShippingControlsLayout {
        display: flex;
        align-items: flex-start;
    }

    .BTMEComm_ShippingControlsLayout .BTMEComm_ShippingInfoColumn {
        width: 66.66667% !important;
    }

    .BTMEComm_ShippingControlsLayout .BTMEComm_ShippingActionColumn {
        width: 33.33333% !important;
    }

    .BTMEComm_ShippingLocationLayout {
        display: flex;
    }

    .BTMEComm_ShippingLocationLayout .BTMEComm_ShippingLocationField {
        width: 65% !important;
    }

    .BTMEComm_ShippingLocationLayout .BTMEComm_ShippingLocationField:last-child {
        width: 35% !important;
    }

    /* With no Country selector, keep Zip compact and place Calculate immediately beside it. */
    .BTMEComm_ShippingControlsLayout.BTMEComm_ShippingCountryHidden {
        gap: 16px;
        justify-content: flex-start;
        margin-left: 0 !important;
        margin-right: auto !important;
    }

    .BTMEComm_ShippingInfoColumn.BTMEComm_ShippingCountryHiddenInfo {
        flex: 0 0 196px;
        max-width: 196px;
        padding-left: 0 !important;
        padding-right: 0 !important;
        width: 196px !important;
    }

    .BTMEComm_ShippingActionColumn.BTMEComm_ShippingCountryHiddenAction {
        flex: 0 0 auto;
        padding-left: 0 !important;
        width: auto !important;
    }

    .BTMEComm_ShippingCountryHiddenInfo .BTMEComm_ShippingLocationField {
        width: 100% !important;
    }

    /* Fallback based on the rendered markup: no Country field means Zip + Calculate is one compact block. */
    .btm-material .BTMEComm_ShippingControlsLayout:has(.BTMEComm_ShippingLocationLayout > .BTMEComm_ShippingLocationField:only-child) {
        gap: 16px;
        justify-content: flex-start !important;
        margin-left: 0 !important;
        margin-right: auto !important;
        width: fit-content !important;
    }

    .btm-material .BTMEComm_ShippingControlsLayout:has(.BTMEComm_ShippingLocationLayout > .BTMEComm_ShippingLocationField:only-child) .BTMEComm_ShippingInfoColumn {
        flex: 0 0 196px !important;
        max-width: 196px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        width: 196px !important;
    }

    .btm-material .BTMEComm_ShippingControlsLayout:has(.BTMEComm_ShippingLocationLayout > .BTMEComm_ShippingLocationField:only-child) .BTMEComm_ShippingActionColumn {
        flex: 0 0 auto !important;
        padding-left: 0 !important;
        width: auto !important;
    }

    .btm-material .BTMEComm_ShippingControlsLayout:has(.BTMEComm_ShippingLocationLayout > .BTMEComm_ShippingLocationField:only-child) .BTMEComm_ShippingLocationField {
        width: 100% !important;
    }

    .btm-material .BTMEComm_ShippingOptionsDropdown {
        max-width: 100%;
        width: fit-content !important;
    }

    /* Diagnostic compact spacing for medium and large shipping layouts. */
    .btm-material .BTMEComm_ShippingControlsLayout,
    .btm-material .BTMEComm_ShippingOptionsRow {
        margin-bottom: 0 !important;
    }

    .btm-material .BTMEComm_ShippingDivider {
        margin-top: 20px !important;
        padding-top: 0;
    }
}

/* Large screens: prevent the shipping controls from becoming excessively wide. */
@media (min-width: 992px) {
    .btm-material .BTMEComm_ShippingControlsLayout {
        margin-left: 0 !important;
        margin-right: auto !important;
        width: 75%;
    }
}

/* Medium and smaller: keep the message below the coupon section. */
@media (max-width: 991px) {
    .BTMEComm_CouponMessageLayout {
        flex-direction: column;
    }

    .BTMEComm_CouponMessagePanel {
        flex: 0 0 auto;
        width: 100%;
    }
}

/* XS: stack the panels and give the coupon field its own full-width row. */
@media (max-width: 600px) {
    /* The stacked shipping controls align with the card content, without grid gutters. */
    .BTMEComm_ShippingControlsLayout > .BTMEComm_ShippingInfoColumn,
    .BTMEComm_ShippingControlsLayout > .BTMEComm_ShippingActionColumn {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .BTMEComm_CouponMessageLayout,
    .BTMEComm_CouponControls {
        flex-direction: column;
    }

    .BTMEComm_CouponMessagePanel,
    .BTMEComm_CouponInput {
        flex: 0 0 auto;
        max-width: none;
        width: 100%;
    }

    .BTMEComm_CouponControls,
    .BTMEComm_CouponAction {
        width: 100%;
    }

    .BTMEComm_CouponInput input,
    .BTMEComm_CouponAction .mtr-btn,
    .BTMEComm_ShippingCalculateAction {
        box-sizing: border-box;
        display: block;
        width: 100% !important;
    }

    /* Avoid compounded desktop row margins in the stacked shipping layout. */
    .btm-material .BTMEComm_ShippingLocationLayout,
    .btm-material .BTMEComm_ShippingControlsLayout,
    .btm-material .BTMEComm_ShippingOptionsRow {
        margin-bottom: 8px;
    }

    .btm-material .BTMEComm_ShippingCalculateAction {
        margin-top: 0 !important;
    }

    /* Reduce only the whitespace above the shipping divider. */
    .btm-material .BTMEComm_ShippingDivider {
        margin-top: 20px;
        padding-top: 0;
    }

    /* Cart Message, when present, still determines the block height. */
    .BTMEComm_CouponMessageLayout {
        margin-bottom: 4px;
    }

    .btm-material .BTMEComm_CheckoutActions {
        flex-direction: column;
        align-items: flex-end;
        gap: 16px;
    }

    .BTMEComm_CheckoutSubmit {
        order: 1;
    }

    .BTMEComm_CheckoutContinue {
        order: 2;
    }

    .BTMEComm_CheckoutClear {
        order: 3;
    }
}