/* Shared page chrome. Load after global and isolated styles to keep all action bars consistent. */
/* Mobile keeps the original per-page styles; only group the newly added Back action. */
.footer-button-group { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; width: 100%; }
@media (min-width: 768px) {
body .mobile-shell .layout-content :is(.order-bar, .b2b-order-bar, .review-action-bar, .checkout-actions, .confirmed-order-actions, .dashboard-actions) {
    display: flex; align-items: center; justify-content: flex-end; gap: 12px;
    min-height: 78px; padding: 12px; padding-bottom: max(12px, env(safe-area-inset-bottom)); border: 0;
    background: linear-gradient(110deg, #623619 0%, #914b20 100%);
    color: #fff; box-shadow: 0 8px 28px #59351f1c;
    font-family: "Modam", Tahoma, Arial, sans-serif;
}
body .mobile-shell .layout-content :is(.order-bar, .b2b-order-bar, .review-action-bar, .checkout-actions, .confirmed-order-actions, .dashboard-actions) button {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    flex: 1 1 0; width: auto; min-width: 0; max-width: none;
    min-height: 50px; margin: 0; padding: 10px 16px;
    border: 1px solid #e5ae80; border-radius: 12px;
    background: #c88b58; color: #fff; box-shadow: none;
    font-family: inherit; font-size: .94rem; font-weight: 700; line-height: 1.7;
}
body .mobile-shell .layout-content :is(.order-bar, .b2b-order-bar, .review-action-bar, .checkout-actions, .confirmed-order-actions, .dashboard-actions) button:is(.action-secondary, .back-button, .details-orders-button, .dashboard-secondary-action) { background: transparent; }
body .mobile-shell .layout-content :is(.order-bar, .b2b-order-bar, .review-action-bar, .checkout-actions, .confirmed-order-actions, .dashboard-actions) button:disabled { opacity: .65; cursor: default; }
body .mobile-shell .layout-content :is(.order-bar, .b2b-order-bar, .review-action-bar, .checkout-actions, .confirmed-order-actions, .dashboard-actions) button:hover:not(:disabled) { background: #b87a48; }
body .mobile-shell .layout-content :is(.order-bar, .b2b-order-bar, .review-action-bar, .checkout-actions, .confirmed-order-actions, .dashboard-actions) button:focus-visible { outline: 3px solid #ffe2bd; outline-offset: 3px; }
body .mobile-shell .layout-content :is(.order-bar, .b2b-order-bar, .review-action-bar, .checkout-actions, .confirmed-order-actions, .dashboard-actions) button svg { flex: 0 0 21px; width: 21px; height: 21px; }
body .mobile-shell .layout-content :is(.order-bar, .b2b-order-bar, .review-action-bar, .checkout-actions, .confirmed-order-actions, .dashboard-actions) .footer-button-group { display: flex; align-items: center; gap: 12px; width: 100%; min-width: 0; }
}
@media (min-width: 768px) {
    body .mobile-shell .layout-content :is(.order-bar, .b2b-order-bar, .review-action-bar, .checkout-actions, .confirmed-order-actions, .dashboard-actions) { min-height: 86px; padding: 14px 20px; border-radius: 18px; }
    body .mobile-shell .layout-content :is(.order-bar, .b2b-order-bar, .review-action-bar, .checkout-actions, .confirmed-order-actions, .dashboard-actions) button { flex: 0 1 260px; width: 260px; max-width: 260px; }
    body .mobile-shell .layout-content :is(.order-bar, .b2b-order-bar, .review-action-bar, .checkout-actions, .confirmed-order-actions, .dashboard-actions) .footer-button-group { flex: 0 1 532px; width: auto; margin-inline-start: auto; }
    body .mobile-shell .layout-content :is(.order-bar, .b2b-order-bar, .review-action-bar, .checkout-actions, .confirmed-order-actions, .dashboard-actions) .footer-button-group button { flex: 1 1 0; }
    body .mobile-shell .brand-bar { height: 74px; grid-template-columns: auto minmax(0, 1fr); gap: 24px; padding: 6px 32px; }
    body .mobile-shell .desktop-nav { display: flex; align-items: center; gap: 6px; font-family: "Modam", Tahoma, Arial, sans-serif; }
    body .mobile-shell .desktop-nav :is(a, button) {
        display: inline-flex; align-items: center; justify-content: center; gap: 7px;
        min-height: 46px; padding: 10px 12px; border: 0; border-radius: 12px;
        color: #623619; font-family: inherit; font-size: .88rem; font-weight: 500; line-height: 1.7; text-decoration: none;
    }
    body .mobile-shell .desktop-nav .ui-icon { width: 19px; height: 19px; flex: 0 0 19px; stroke-width: 1.6; }
}
@media (min-width: 768px) and (max-width: 1023px) {
    body .mobile-shell .brand-bar { gap: 12px; padding-inline: 20px; }
    body .mobile-shell .desktop-nav :is(a, button) { gap: 5px; padding-inline: 7px; font-size: .75rem; }
}


/* Keep the cart summary at the RTL start while the action stays at the left. */
@media (min-width: 768px) {
    body .mobile-shell .layout-content .b2b-order-bar { direction: rtl; justify-content: space-between; }
    body .mobile-shell .layout-content .b2b-order-bar .b2b-cart-summary { margin-inline-end: auto; }
}

@media (min-width: 768px) {
    body .mobile-shell .layout-content .b2c-menu .order-bar { direction: rtl; justify-content: space-between; }
    body .mobile-shell .layout-content .b2c-menu .order-bar .b2c-cart-summary { margin-inline-end: auto; }
}

/* B2C review keeps the cart at the right and equal actions at the left. */
@media (min-width: 768px) {
    body .mobile-shell .layout-content .b2c-checkout .checkout-actions { direction: rtl; justify-content: space-between; }
    body .mobile-shell .layout-content .b2c-checkout .review-footer-buttons { flex: 0 1 532px; margin-inline-start: auto; }
    body .mobile-shell .layout-content .b2c-checkout .review-footer-buttons button { flex: 1 1 0; }
}

/* Address selection uses the shared desktop footer with its summary at the right. */
@media (min-width: 768px) {
    body .mobile-shell .layout-content .address-checkout .checkout-actions { direction: rtl; justify-content: space-between; }
    body .mobile-shell .layout-content .address-checkout .address-footer-buttons { flex: 0 1 532px; margin-inline-start: auto; }
    body .mobile-shell .layout-content .address-checkout .address-footer-buttons button { flex: 1 1 0; }
}

/* Payment shares the right-hand summary and left-hand desktop actions. */
@media (min-width: 768px) {
    body .mobile-shell .layout-content .payment-checkout .checkout-actions { direction: rtl; justify-content: space-between; }
    body .mobile-shell .layout-content .payment-checkout .payment-footer-buttons { flex: 0 1 532px; margin-inline-start: auto; }
    body .mobile-shell .layout-content .payment-checkout .payment-footer-buttons button { flex: 1 1 0; }
    body .mobile-shell .layout-content .payment-checkout .payment-footer-buttons button:only-child { margin-inline-start: auto; }
}