/* Shared menu surfaces also cover the legacy graphite palette. */
html[data-surface-theme=graphite]{--ys-base-100:#202328;--ys-base-200:#181b20;--ys-base-300:#30353d;--ys-base-content:#e6e9ee;--ys-primary:#b8c8e0;--ys-primary-content:#18202c;}
html body.zip-ui.dashboard-shell #app-content {
 --menu-surface:var(--ys-base-100,#fff);
 --menu-ink:var(--ys-base-content,#33465a);
 --menu-border:color-mix(in srgb,var(--menu-ink) 22%,var(--menu-surface));
 --menu-hover:color-mix(in srgb,var(--ys-primary,#356cb4) 14%,var(--menu-surface));
}
html body.zip-ui.dashboard-shell #app-content :is(.order-sort-menu>div,.page-size-menu>div,.page-size-menu>summary){
 background:var(--menu-surface)!important;color:var(--menu-ink)!important;
 border:1px solid var(--menu-border)!important;box-shadow:0 8px 24px #0002!important;
 border-radius:10px!important;
}
html body.zip-ui.dashboard-shell #app-content :is(.order-sort-menu>div,.page-size-menu>div){padding:6px!important;z-index:80;}
html body.zip-ui.dashboard-shell #app-content .order-sort-menu>div{top:calc(100% + 8px);min-width:190px;}
html body.zip-ui.dashboard-shell #app-content :is(.order-sort-menu>div a,.page-size-menu>div a){
 color:var(--menu-ink)!important;font-size:13px!important;font-weight:500!important;
 line-height:1.5;min-height:38px;box-sizing:border-box;padding:9px 12px!important;
 display:flex;align-items:center;justify-content:space-between;gap:14px;border-radius:6px;
}
html body.zip-ui.dashboard-shell #app-content :is(.order-sort-menu>div a,.page-size-menu>div a):is(:hover,:focus-visible,.is-active){background:var(--menu-hover)!important;color:var(--menu-ink)!important;}
html body.zip-ui.dashboard-shell #app-content .page-size-menu>summary{min-height:40px;box-shadow:none!important;font-size:13px;}
html body.zip-ui.dashboard-shell #app-content .pagination{color:var(--menu-ink)!important;gap:16px;align-items:center;}
html body.zip-ui.dashboard-shell #app-content th{color:var(--menu-ink)!important;}
html body.zip-ui.dashboard-shell #app-content .order-sort-menu>summary{color:var(--menu-ink)!important;}
html body.zip-ui.dashboard-shell #app-content :is(.order-sort-menu>div a span,.page-size-menu span){color:inherit!important;opacity:.8;}
html[data-theme-tone=dark] body.zip-ui.dashboard-shell #app-content .filter-panel{background:color-mix(in srgb,var(--ys-base-100) 65%,var(--ys-base-200))!important;border-color:var(--menu-border)!important;}
html body.zip-ui.dashboard-shell #app-content .filter-panel :is(.filter-collapse,.filter-expand){color:var(--menu-ink)!important;opacity:.85;}

/* Black palettes: content sits on the page; controls and floating menus keep boundaries. */
html[data-surface-theme]:is([data-surface-theme=black],[data-surface-theme=graphite]) body.zip-ui.dashboard-shell #app-content :is(.card,.filter-panel,.orders-table,.table-wrap,.pagination,.export-quick-panel,.export-field-group,.export-inline-preview,.export-download-bar,.export-state-filter) {
 background:transparent!important;background-image:none!important;
 border-color:transparent!important;box-shadow:none!important;
}
html[data-surface-theme]:is([data-surface-theme=black],[data-surface-theme=graphite]) body.zip-ui.dashboard-shell #app-content .orders-table :is(table,thead,tbody,tr,th,td) {
 background:transparent!important;box-shadow:none!important;
}
html[data-surface-theme]:is([data-surface-theme=black],[data-surface-theme=graphite]) body.zip-ui.dashboard-shell #app-content .orders-table :is(th,td) {
 border-color:color-mix(in srgb,var(--ys-base-content) 10%,transparent)!important;
}
html[data-surface-theme]:is([data-surface-theme=black],[data-surface-theme=graphite]) body.zip-ui.dashboard-shell #app-content .orders-table tbody tr:hover>td {
 background:color-mix(in srgb,var(--ys-base-content) 4%,transparent)!important;
}

/* Fixed action column needs an opaque page-matched surface during horizontal scrolling. */
html[data-surface-theme=graphite]{--flat-page:#1c1e23;}
html[data-surface-theme=black]{--flat-page:var(--ys-base-300);}
html[data-surface-theme]:is([data-surface-theme=black],[data-surface-theme=graphite]) body.zip-ui.dashboard-shell #app-content .orders-table tr>:last-child {
 background:var(--flat-page)!important;
}
