/* T2781 UX batch A: lists, search, navigation. All rules for this batch live here. */

/* 29: skip link, visible only when focused */
.skip-link{position:fixed;left:8px;top:-60px;z-index:1000;padding:9px 14px;border-radius:6px;background:var(--panel);color:var(--blue);border:2px solid var(--blue);font-weight:600;text-decoration:none}
.skip-link:focus{top:8px}
#content:focus{outline:none}

/* 30 (Mike): DASHBOARD and CALENDAR at the top in the group-heading style (.nav-heading, as SALES), then a short divider */
.sidebar .ce-nav-top{min-height:0}
/* Mike: the logo is a plain link to the Dashboard, never highlighted (only the DASHBOARD item is) */
.sidebar .ce-navlogo,.sidebar .ce-navlogo:hover,.sidebar .ce-navlogo.active{background:transparent;border-left-color:transparent}
.sidebar .ce-nav-top.active{border-left:3px solid #4cb3ff}
.sidebar .ce-nav-rule{width:50%;margin:4px 16px 8px;border:0;border-top:1px solid #3a5878}
.sidebar .ce-nav-rule+.nav-heading{padding-top:6px}

/* 13: a bulk bar with no actions is not drawn (also covers bars built elsewhere) */
.bulk:not(:has(button)){display:none}
/* 28: the phone-only Actions toggle and Filters (n) button are hidden on desktop; desktop bulk bar is unchanged */
.bulk-more,.ux-phone-only{display:none}
.bulk-items{display:contents}

/* 19: pager */
.footer .pager{display:flex;align-items:center;gap:6px}
.footer .pager button{min-width:34px;padding-left:8px;padding-right:8px;font-size:15px;line-height:1}
.footer .pagebox{display:inline-flex;align-items:center;gap:6px;color:var(--muted);white-space:nowrap}
.footer .pagebox input{width:72px;min-height:32px;padding:4px 6px;text-align:center;border:1px solid var(--line);border-radius:5px;background:light-dark(#fff,#101b29);color:var(--text)}
#range{font-variant-numeric:tabular-nums}

/* 14: blanked header labels keep their grid/flex cell */
.gh-empty{min-height:1px}

/* 18: group headers stick under the sticky column header while the results scroll */
.tablewrap .searchtable tr.group>td{position:sticky;top:var(--thead-h,40px);z-index:1;box-shadow:inset 0 -1px var(--line)}
.tablewrap .searchtable tr.line{scroll-margin-top:calc(var(--thead-h,40px) + 64px)}

/* 36: rows that open a record */
tr[data-row-href],tr[data-row-href] td{cursor:pointer}
tr[data-row-href]:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}

/* 33: long vendor names truncate (full name in the hover tooltip) instead of wrapping to three lines */
.searchtable td.k-vendor{max-width:190px}
.searchtable td.k-vendor>a{display:block;max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 28: phones: filters behind "Filters (n)", results as cards, actions in a menu */
/* T2827: page content follows the width #content has (container "main", base.css), not the viewport; the @media copy keeps dialogs/menus outside #content on the viewport */
@container main (max-width:736px){
 .ux-phone-only{display:inline-flex}
 #filterline{min-width:0}#filterline strong{white-space:normal}
 #hidefilters,#compactfilters,#filterline .filtersummary,#filterline small{display:none!important}
 .bulk{position:relative}
 .bulk-more{display:inline-flex;margin-left:auto}
 .bulk-more::after{content:"";width:6px;height:6px;margin:0 2px 3px 8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}
 .bulk-items{display:none;position:absolute;right:0;bottom:calc(100% - 4px);z-index:30;flex-direction:column;align-items:stretch;gap:4px;min-width:220px;padding:6px;border:1px solid var(--line);border-radius:8px;background:var(--panel);box-shadow:0 10px 30px #0004}
 .bulk.menu-open .bulk-items{display:flex}
 .bulk-items button{justify-content:flex-start;text-align:left}
 .vp-action-slot .bulk-items{bottom:auto;top:calc(100% - 4px)}

 #results.tablewrap{max-height:none!important;overflow:visible;border:0;background:transparent;min-height:0}
 #results table.searchtable{display:block;min-width:0!important;width:100%}
 #results table.searchtable>colgroup,#results table.searchtable>thead{display:none}
 #results table.searchtable>tbody{display:block}
 #results table.searchtable tr{display:block}
 #results table.searchtable tr>td{display:block;border:0}
 #results table.searchtable tr.group>td{position:static;box-shadow:none;border-radius:8px 8px 0 0;margin-top:12px}
 #results table.searchtable tr.group>td:not(:first-child){display:none}
 #results .gh-empty{display:none}
 #results table.searchtable tr.line{position:relative;display:flex;flex-wrap:wrap;gap:6px 16px;margin:6px 0;padding:10px 44px 10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--panel)}
 #results table.searchtable tr.group+tr.line{margin-top:0;border-top:0;border-radius:0 0 8px 8px}
 #results table.searchtable tr.line>td{display:none;padding:0;background:transparent!important;min-width:0;max-width:100%;text-align:left}
 #results table.searchtable tr.line>td:is(.selectcell,.k-id,.k-name,.k-first,.k-last,.k-customer,.k-vendor,.k-company,.k-part,.k-mfr,.k-qty,.k-price,.k-target,.k-status,.k-phone,.k-email,.inventory-lot,.inventory-vendor,.inventory-location,.inventory-available,.inventory-qty,.inventory-price){display:block}
 #results table.searchtable tr.line>td[data-label]:not(.selectcell)::before{content:attr(data-label);display:block;font-size:10px;font-weight:600;letter-spacing:.3px;text-transform:uppercase;color:var(--muted)}
 #results table.searchtable tr.line>td.k-part{flex-basis:100%;font-weight:600;font-size:14px}
 #results table.searchtable tr.line>td.k-part::before{display:none!important}
 #results table.searchtable tr.line>td.selectcell{position:absolute;right:8px;top:8px;width:auto}
 #results table.searchtable tr.line>td.selectcell input{width:22px;height:22px}
 #results table.searchtable tr.line>td.k-vendor,#results table.searchtable tr.line>td.k-vendor>a{max-width:none;white-space:normal}
 #results table.searchtable tr.vp-row>td{padding:0}
 #results .inventory-table .inventory-cell-text{white-space:normal}
 .footer{flex-direction:column;align-items:stretch}
 .footer .pager{justify-content:space-between}
 .footer .pager button{min-width:40px;min-height:40px}
}
@media (max-width:760px){.ux-phone-only:where(:not(#content *)){display:inline-flex}#filterline:where(:not(#content *)){min-width:0}#filterline strong:where(:not(#content *)){white-space:normal}#hidefilters:where(:not(#content *)),#compactfilters:where(:not(#content *)),#filterline .filtersummary:where(:not(#content *)),#filterline small:where(:not(#content *)){display:none!important}.bulk:where(:not(#content *)){position:relative}.bulk-more:where(:not(#content *)){display:inline-flex;margin-left:auto}.bulk-more:where(:not(#content *))::after{content:"";width:6px;height:6px;margin:0 2px 3px 8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}.bulk-items:where(:not(#content *)){display:none;position:absolute;right:0;bottom:calc(100% - 4px);z-index:30;flex-direction:column;align-items:stretch;gap:4px;min-width:220px;padding:6px;border:1px solid var(--line);border-radius:8px;background:var(--panel);box-shadow:0 10px 30px #0004}.bulk.menu-open .bulk-items:where(:not(#content *)){display:flex}.bulk-items button:where(:not(#content *)){justify-content:flex-start;text-align:left}.vp-action-slot .bulk-items:where(:not(#content *)){bottom:auto;top:calc(100% - 4px)}#results.tablewrap:where(:not(#content *)){max-height:none!important;overflow:visible;border:0;background:transparent;min-height:0}#results table.searchtable:where(:not(#content *)){display:block;min-width:0!important;width:100%}#results table.searchtable>colgroup:where(:not(#content *)),#results table.searchtable>thead:where(:not(#content *)){display:none}#results table.searchtable>tbody:where(:not(#content *)){display:block}#results table.searchtable tr:where(:not(#content *)){display:block}#results table.searchtable tr>td:where(:not(#content *)){display:block;border:0}#results table.searchtable tr.group>td:where(:not(#content *)){position:static;box-shadow:none;border-radius:8px 8px 0 0;margin-top:12px}#results table.searchtable tr.group>td:not(:first-child):where(:not(#content *)){display:none}#results .gh-empty:where(:not(#content *)){display:none}#results table.searchtable tr.line:where(:not(#content *)){position:relative;display:flex;flex-wrap:wrap;gap:6px 16px;margin:6px 0;padding:10px 44px 10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--panel)}#results table.searchtable tr.group+tr.line:where(:not(#content *)){margin-top:0;border-top:0;border-radius:0 0 8px 8px}#results table.searchtable tr.line>td:where(:not(#content *)){display:none;padding:0;background:transparent!important;min-width:0;max-width:100%;text-align:left}#results table.searchtable tr.line>td:is(.selectcell,.k-id,.k-name,.k-first,.k-last,.k-customer,.k-vendor,.k-company,.k-part,.k-mfr,.k-qty,.k-price,.k-target,.k-status,.k-phone,.k-email,.inventory-lot,.inventory-vendor,.inventory-location,.inventory-available,.inventory-qty,.inventory-price):where(:not(#content *)){display:block}#results table.searchtable tr.line>td[data-label]:not(.selectcell):where(:not(#content *))::before{content:attr(data-label);display:block;font-size:10px;font-weight:600;letter-spacing:.3px;text-transform:uppercase;color:var(--muted)}#results table.searchtable tr.line>td.k-part:where(:not(#content *)){flex-basis:100%;font-weight:600;font-size:14px}#results table.searchtable tr.line>td.k-part:where(:not(#content *))::before{display:none!important}#results table.searchtable tr.line>td.selectcell:where(:not(#content *)){position:absolute;right:8px;top:8px;width:auto}#results table.searchtable tr.line>td.selectcell input:where(:not(#content *)){width:22px;height:22px}#results table.searchtable tr.line>td.k-vendor:where(:not(#content *)),#results table.searchtable tr.line>td.k-vendor>a:where(:not(#content *)){max-width:none;white-space:normal}#results table.searchtable tr.vp-row>td:where(:not(#content *)){padding:0}#results .inventory-table .inventory-cell-text:where(:not(#content *)){white-space:normal}.footer:where(:not(#content *)){flex-direction:column;align-items:stretch}.footer .pager:where(:not(#content *)){justify-content:space-between}.footer .pager button:where(:not(#content *)){min-width:40px;min-height:40px}}
/* T2817 (Mike): icons beside DASHBOARD and CALENDAR */
.sidebar .ce-nav-top{display:flex;align-items:center;gap:8px}
.sidebar .ce-nav-icon{flex:none;opacity:.9}
/* T2822 (Mike): in English, every word in the sidebar menu starts with a capital (group headings stay all caps) */
html:lang(en) .sidebar .navitem:not(.nav-heading){text-transform:capitalize}