.on-orders-page .app-header { padding-inline: 0; }
.orders-back { position: absolute; left: 8px; top: var(--safe-area-top); display: grid; place-items: center; width: 56px; min-height: 56px; border-radius: var(--radius-control); background: transparent; color: var(--text); }
.orders-page-heading { width: 100%; padding: 8px calc(var(--capsule-width) + var(--capsule-right) + 4px); }
body.large-text .orders-page-heading { padding: 56px 16px 8px; }
.orders-page-heading h1 { text-align: center; text-wrap: balance; font-size: 1.375rem; line-height: 1.45; overflow-wrap: anywhere; }
#orders-content { font-size: var(--font-body); overflow-wrap: anywhere; }
.orders-business-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; border-bottom: 1px solid var(--border); }
.orders-business-tabs button { position: relative; min-width: 56px; min-height: 56px; padding: 12px 4px; background: transparent; border-radius: var(--radius-control) var(--radius-control) 0 0; color: var(--text-secondary); font-size: var(--font-body); line-height: 1.5; text-wrap: balance; }
.orders-business-tabs button[aria-pressed="true"] { color: var(--primary-text); font-weight: 600; }
.orders-business-tabs button[aria-pressed="true"]::after { content: ""; position: absolute; bottom: -1px; left: calc(50% - 12px); width: 24px; height: 3px; border-radius: 9999px; background: var(--primary); }
.orders-toolbar { position: relative; margin-block: 4px var(--space-content); }
.orders-count { flex: 1 1 7rem; color: var(--text-secondary); font-size: var(--font-supporting); }
.orders-status-toggle { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-width: 56px; min-height: 56px; padding: 8px 4px 8px 0; background: transparent; text-align: left; border-radius: var(--radius-control); color: var(--text); font-size: var(--font-supporting); cursor: pointer; list-style: none; }
.orders-status-label { display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; flex: 0 0 auto; max-width: 100%; margin-left: auto; text-wrap: balance; }
.orders-status-toggle .icon { width: 18px; height: 18px; }
.orders-status-toggle[aria-expanded="true"] .icon { transform: rotate(180deg); }
.orders-status-toggle[aria-expanded="true"] { color: var(--primary-text); }
#orders-status-options { position: absolute; z-index: 2; top: calc(100% + 4px); inset-inline: 0; max-height: var(--orders-status-max-height, 60dvh); overflow-y: auto; overscroll-behavior: contain; min-width: 0; padding: var(--space-card); border: 1px solid var(--border); border-radius: var(--radius-card); background: var(--surface); box-shadow: var(--shadow-floating); scroll-padding: var(--space-card); }
#orders-status-options.opens-up { top: auto; bottom: calc(100% + 4px); }
.orders-status-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 8rem), 1fr)); gap: 8px; }
.orders-status-options button { min-width: 56px; min-height: 56px; padding: 8px; border: 1px solid var(--control); border-radius: var(--radius-control); background: var(--surface); font-size: var(--font-supporting); }
.orders-status-options button[aria-pressed="true"] { background: var(--surface-tint); border-color: var(--primary-text); color: var(--primary-text); font-weight: 600; box-shadow: inset 0 0 0 1px var(--primary-text); }
.orders-list { display: grid; gap: var(--space-content); }
.orders-card { min-width: 0; padding: var(--space-card); border: 1px solid var(--border); border-radius: var(--radius-card); background: var(--surface); }
.orders-card-heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 12px; }
.orders-card-heading h2 { flex: 1 1 9rem; font-size: 1.375rem; line-height: 1.5; }
.orders-status { color: var(--primary-text); font-size: var(--font-supporting); }
.orders-status.is-cancelled, .orders-summary { color: var(--text-secondary); }
.orders-card > p { margin-top: 8px; font-size: var(--font-supporting); }
.orders-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.orders-business { background: var(--surface-tint); color: var(--primary-text); border-radius: 8px; padding: 2px 8px; }
.orders-card-footer { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; border-top: 1px solid var(--border); margin-top: var(--space-content); padding-top: var(--space-content); }
.orders-card-footer strong { font-weight: 600; }
.orders-card-footer .secondary-button { width: auto; max-width: 100%; }
.orders-empty { padding: var(--space-detail); text-align: center; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-card); }
.orders-empty > .icon { margin: 8px auto 12px; color: var(--primary-text); }
.orders-empty h2 { font-size: 1.375rem; }
.orders-empty p { margin-block: 12px; color: var(--text-secondary); }
.orders-error { padding: var(--space-card); border-radius: var(--radius-card); background: var(--rose-surface); color: var(--rose); }
.orders-error .secondary-button { margin-top: 12px; }

.orders-batch summary { min-height: 56px; padding-block: 12px; cursor: pointer; color: var(--primary-text); }
.orders-batch details { margin-block: 8px; }
.orders-batch details p { padding-block: 8px; border-top: 1px solid var(--border); }
