:root{font-family:'Segoe UI',system-ui,Arial,sans-serif;color:#253247;background:#f5f7fb}*{box-sizing:border-box}body{margin:0}.app-shell{display:flex;min-height:100vh}.sidebar{width:250px;flex:0 0 250px;background:#fff;border-right:1px solid #e2e8f0;display:flex;flex-direction:column;min-height:100vh;position:sticky;top:0;height:100vh}.brand{font-size:1.12rem;font-weight:750;letter-spacing:.025em;color:#17365b;text-decoration:none;padding:29px 18px 25px;white-space:nowrap}.sidebar nav{display:flex;flex-direction:column;gap:4px;padding:0 12px}.nav-link{display:flex;align-items:center;gap:12px;text-decoration:none;color:#475569;padding:12px 13px;border-radius:7px;font-size:.93rem;font-weight:650}.nav-link img{width:19px;height:19px;object-fit:contain}.nav-link:hover,.nav-link.active{background:#eaf2ff;color:#1d4f91}.nav-link.active{outline:1px solid #cfe0f8}.sidebar-bottom{margin-top:auto;padding:18px}.logout-button{width:100%;background:#f1f5f9;color:#475569}.workspace{min-width:0;flex:1;display:flex;flex-direction:column}main{width:100%;max-width:1500px;margin:0 auto;padding:25px 27px;flex:1}h1{font-size:1.75rem;color:#17365b;margin:0 0 19px;font-weight:750}h2{font-size:1.05rem;color:#17365b;margin:0 0 14px}.panel{background:white;border:1px solid #dce5ef;border-radius:9px;padding:20px;margin-bottom:18px;box-shadow:0 2px 7px #25324706}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.stats.three{grid-template-columns:repeat(3,minmax(0,1fr))}.stat{text-align:center;display:flex;flex-direction:column;gap:6px;padding:20px 12px}.stat span,.muted{color:#66758a;font-size:.9rem}.stat strong{font-size:2rem;color:#17365b}.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 19px}.split{display:grid;grid-template-columns:1fr 1fr;gap:18px}.panel-heading,.page-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.panel-heading h2,.page-heading h1{margin-bottom:12px}.page-heading{margin-bottom:8px}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:.91rem}th{text-align:left;color:#334155;background:#eaf0f7;font-weight:700;font-size:.82rem;white-space:nowrap}td,th{padding:10px 9px;border-bottom:1px solid #e8edf2;vertical-align:middle}tr[hidden]{display:none}tbody tr:hover{background:#f8fbff}.low{color:#b42318;font-weight:700}a{color:#2f6fbd}button,.button{border:0;background:#2f6fbd;color:#fff;border-radius:6px;padding:10px 14px;cursor:pointer;text-decoration:none;display:inline-block;font-size:.88rem;font-weight:650;white-space:nowrap}button:hover,.button:hover{filter:brightness(.95)}.secondary{background:#e8eef6;color:#20324a}.subtle{background:#f1f5f9;color:#475569;border:1px solid #cbd5e1}.fields{display:flex;flex-wrap:wrap;align-items:end;gap:14px}label{display:flex;flex-direction:column;gap:5px;font-size:.82rem;font-weight:650;color:#44596e}input,select{padding:10px 9px;border:1px solid #cbd6e0;border-radius:6px;min-width:110px;max-width:100%;font:inherit;color:#253247;background:#fff}.inline-form{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.inline-form input{width:125px}.inline-form input[type=number]{width:75px}.login{max-width:420px;margin:9vh auto}.login form{display:flex;flex-direction:column;gap:15px}.login input{width:100%}.flash{padding:13px 16px;margin-bottom:16px;border-radius:8px;background:#e6f4e9;color:#27633a}.flash.error{background:#ffe9e7;color:#8e302b}footer{text-align:center;color:#8796a4;padding:15px}.logged-out .workspace{width:100%}@media(max-width:1000px){.sidebar{width:210px;flex-basis:210px}.brand{font-size:1rem}.split{grid-template-columns:1fr}}@media(max-width:720px){.app-shell{display:block}.sidebar{position:relative;height:auto;min-height:0;width:100%;border-right:0;border-bottom:1px solid #e2e8f0}.brand{padding:14px 17px 8px}.sidebar nav{flex-direction:row;overflow-x:auto;padding:6px 10px 12px}.nav-link{flex:0 0 auto;font-size:.82rem;padding:9px}.sidebar-bottom{position:absolute;right:8px;top:3px;padding:0}.logout-button{padding:7px}main{padding:20px 13px}.stats.three{grid-template-columns:repeat(3,minmax(0,1fr))}.stat{padding:14px 5px}.stat strong{font-size:1.6rem}}@media(max-width:450px){.stats.three{grid-template-columns:1fr}.stat{flex-direction:row;justify-content:space-between;align-items:center}.panel{padding:14px}}
/* Consolidated v3.0 refinements */
.brand{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;white-space:normal;padding:22px 15px 24px;text-transform:none}
.company-logo{display:block;max-width:100%;width:200px;height:auto;max-height:95px;object-fit:contain}
.brand span{display:block;font-size:1.12rem;font-weight:750}
.stats.two{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:16px}
.critical-total{color:#b42318!important}
.critical-transaction td{color:#b42318;font-weight:750}
.critical-transaction a{color:#b42318;font-weight:750}
.danger{background:#b42318;color:#fff}
.permanent-delete-form{display:inline-block;margin-left:8px}
.sort-header{background:transparent;border:0;color:inherit;font:inherit;font-weight:inherit;padding:0;text-align:left;cursor:pointer;white-space:nowrap}
.sort-header:hover{text-decoration:underline;filter:none}
.sort-header:focus-visible{outline:2px solid #2563eb;outline-offset:3px;border-radius:2px}
.sort-indicator{font-size:.9em;opacity:.75;margin-left:3px}
th[aria-sort="ascending"] .sort-indicator,th[aria-sort="descending"] .sort-indicator{opacity:1}
@media(max-width:720px){.brand{align-items:flex-start;gap:3px;padding:10px 15px}.company-logo{width:140px;max-height:48px}.brand span{font-size:1rem}}
@media(max-width:450px){.stats.two{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Distribution reporting */
.filter-fields{margin-bottom:12px}.report-metrics{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0}.metric{background:#f1f6fc;border:1px solid #dbe6f4;border-radius:8px;padding:13px 18px;min-width:155px;display:flex;flex-direction:column;gap:4px}.metric span{color:#60728a;font-size:.8rem}.metric strong{color:#17365b;font-size:1.55rem}.bar-list{display:flex;flex-direction:column;gap:10px;margin:18px 0 26px}.bar-button{display:block;width:100%;background:transparent;color:#253247;text-align:left;padding:6px 3px;border-radius:5px;white-space:normal}.bar-button:hover{background:#f3f7fc;filter:none}.bar-label{display:flex;justify-content:space-between;gap:12px;margin-bottom:5px}.bar-track{height:23px;background:#e8eef6;border-radius:4px;overflow:hidden}.bar-fill{height:100%;background:#457eb8;border-radius:4px;min-width:2px}.drilldown{border-top:1px solid #dce5ef;padding-top:18px}.drilldown[hidden],#distribution-detail[hidden]{display:none}.drilldown h3{color:#17365b}#distribution-detail{margin-top:18px}@media print{.sidebar,.sidebar-bottom,.print-report,form,.button,footer{display:none!important}.workspace main{padding:0}.panel{box-shadow:none;break-inside:avoid}.bar-fill{print-color-adjust:exact;-webkit-print-color-adjust:exact}}

/* v3.2 polish */
:root{--line:#e5ebf3}body{background:#f5f7fa}h1{letter-spacing:-.025em}.panel{border-radius:12px;box-shadow:0 3px 14px #183b6508}.nav-link{transition:background .15s,color .15s}button,.button{transition:filter .15s,transform .15s}button:focus-visible,.button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #377cce;outline-offset:2px}thead th{position:sticky;top:0;z-index:1}tbody tr:nth-child(even){background:#fafcff}.table-wrap{max-height:650px}.global-search{display:flex;gap:8px;align-items:center;justify-content:flex-end;margin-bottom:20px}.global-search label{white-space:nowrap}.global-search input{width:min(440px,100%)}.stock-pill{display:inline-block;border-radius:30px;padding:5px 9px;font-size:.8rem;font-weight:700;white-space:nowrap}.stock-ok{background:#e8f5ee;color:#166534}.stock-low{background:#fff4d7;color:#92400e}.stock-out{background:#fde9e7;color:#a12a24}.metric small{color:#66758a;font-size:.72rem;max-width:240px}.date-stat{font-size:1.15rem!important}.page-heading .toolbar{margin-bottom:12px}@media(max-width:720px){.global-search{justify-content:stretch;flex-wrap:wrap}.global-search input{flex:1;min-width:150px}.stats.three{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* v3.2 consolidated usability refinements */
.inline-form label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:600;min-width:95px}
.inline-form label input{font-size:14px;font-weight:400}
.check-inline{display:flex!important;align-items:center;gap:8px;white-space:normal}
.check-inline input{width:auto!important}
.batch-form .toolbar{margin-bottom:12px}.batch-form .row-select,.batch-form .select-all{width:17px;height:17px;cursor:pointer}
.focused-row{outline:3px solid #377dbd;outline-offset:-3px;background:#e9f4ff!important}
.switch-employee{display:flex;flex-direction:column;gap:5px;font-weight:600;min-width:220px}
.switch-employee select{max-width:300px}
@media(max-width:720px){.switch-employee{width:100%;min-width:0}.switch-employee select{max-width:100%}}

/* v3.2 final preview: consistent inventory controls */
.inventory-edit-form,.inventory-action-form{display:flex;flex-direction:column;gap:9px;align-items:stretch}
.inventory-actions{display:flex;flex-direction:column;gap:16px;min-width:480px}
.inventory-fields{display:flex;align-items:flex-start;gap:8px;flex-wrap:nowrap}
.inventory-fields label{display:flex;flex:1 1 0;min-width:105px;gap:5px;font-size:12px;font-weight:650}
.inventory-fields input,.inventory-fields select{height:39px;width:100%;min-width:0;font-size:13px;font-weight:400}
.inventory-form-actions{display:flex;align-items:center;min-height:38px}
.inventory-edit-form{min-width:380px}
.inventory-action-form .inventory-fields label:last-child{flex:1.7 1 0;min-width:175px}
@media(max-width:800px){.inventory-actions{min-width:430px}}

/* Mobile-only responsive enhancements; desktop styling remains unchanged. */
.mobile-menu-toggle,.mobile-nav-backdrop{display:none}
@media(max-width:720px){
 html,body{max-width:100%;overflow-x:hidden}
 .app-shell{display:block;min-width:0}
 .workspace,.workspace main,.panel{min-width:0}
 .mobile-menu-toggle{display:flex;position:sticky;top:0;z-index:40;align-items:center;gap:10px;width:100%;min-height:52px;padding:12px 16px;border-radius:0;background:#17365b;color:white;text-align:left;font-size:16px}
 .mobile-menu-toggle span{font-size:22px;line-height:1}
 .sidebar{display:flex;position:fixed;top:0;left:0;bottom:0;z-index:60;transform:translateX(-105%);transition:transform .2s ease;width:min(300px,85vw);height:100dvh;min-height:0;border-right:1px solid #dce5ef;box-shadow:8px 0 25px #0002;overflow-y:auto}
 body.mobile-nav-open .sidebar{transform:translateX(0)}
 .mobile-nav-backdrop:not([hidden]){display:block;position:fixed;inset:0;z-index:55;background:#0f172a80}
 .sidebar nav{display:flex;flex-direction:column;overflow:visible;padding:8px 12px 18px;gap:5px}
 .sidebar .nav-link{font-size:15px;padding:13px 12px;min-height:46px;flex:0 0 auto}
 .sidebar-bottom{position:static;margin-top:auto;padding:18px}
 .brand{align-items:center;text-align:center;padding:18px 14px;gap:8px}
 .company-logo{width:175px;max-height:75px}
 main{padding:16px 12px}
 h1{font-size:1.5rem}
 .panel{padding:15px;margin-bottom:14px}
 .split{grid-template-columns:minmax(0,1fr)}
 .stats,.stats.two,.stats.three{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
 .stat{min-width:0;padding:14px 8px}
 .stat strong{font-size:1.5rem;overflow-wrap:anywhere}
 .fields,.filter-fields{display:grid;grid-template-columns:minmax(0,1fr);align-items:stretch;gap:12px}
 .fields>label,.filter-fields>label,.fields>button,.fields>.button,.filter-fields>button,.filter-fields>.button{width:100%;min-width:0}
 input:not([type=checkbox]):not([type=radio]),select,textarea{max-width:100%;font-size:16px}
 .fields input,.fields select,.filter-fields input,.filter-fields select{width:100%;min-width:0}
 button,.button{min-height:42px}
 .toolbar{gap:8px}
 .toolbar>.button,.toolbar>button{white-space:normal;text-align:center}
 .global-search{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;justify-content:stretch}
 .global-search label{grid-column:1/-1}
 .global-search input{min-width:0;width:100%}
 .table-wrap{width:100%;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
 .table-wrap table{width:max-content;min-width:100%}
 .table-wrap td,.table-wrap th{white-space:nowrap}
 .table-wrap td .inline-form{white-space:normal}
 .inline-form{max-width:100%}
 .page-heading,.panel-heading{align-items:flex-start}
 .inventory-actions,.inventory-edit-form{min-width:0}
 .inventory-fields{flex-wrap:wrap}
 .inventory-fields label{min-width:min(100%,140px)}
 .report-metrics{gap:8px}.metric{min-width:0;flex:1 1 140px}
 .switch-employee,.switch-employee select{width:100%;min-width:0;max-width:100%}
 .inventory-modal{width:calc(100vw - 16px);max-height:calc(100dvh - 24px)}
 .inventory-modal-body{max-height:calc(100dvh - 155px);overflow-y:auto}
 .inventory-modal-actions button{width:100%}
 .logged-out .mobile-menu-toggle{display:none}
}
@media(max-width:380px){.stats,.stats.two,.stats.three{grid-template-columns:minmax(0,1fr)}.stat{flex-direction:row;justify-content:space-between;align-items:center}}
@media(prefers-reduced-motion:reduce){.sidebar{transition:none!important}}
@media print{.mobile-menu-toggle,.mobile-nav-backdrop{display:none!important}}


/* Phone-only inventory and transaction cards. Desktop tables are untouched. */
@media(max-width:720px){
 .inventory-table-wrap,.transactions-history-wrap{overflow-x:visible!important}
 .inventory-clean-table,.transactions-history-table{display:block!important;width:100%!important;min-width:0!important;border:0;background:transparent}
 .inventory-clean-table thead,.transactions-history-table thead{display:none}
 .inventory-clean-table tbody,.transactions-history-table tbody{display:flex;flex-direction:column;gap:12px;width:100%}
 .inventory-clean-table tbody>tr,.transactions-history-table tbody>tr{display:grid;width:100%;min-width:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 10px;padding:15px;border:1px solid #dce5ef;border-radius:12px;background:#fff;box-shadow:0 2px 8px #102b4510;box-sizing:border-box}
 .inventory-clean-table tbody>tr>td,.transactions-history-table tbody>tr>td{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:4px;min-width:0;padding:0!important;border:0!important;white-space:normal!important;overflow-wrap:anywhere}
 .inventory-clean-table tbody>tr>td:before,.transactions-history-table tbody>tr>td:before{display:block;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#68798b}
 .inventory-clean-table tbody>tr>td:first-child{grid-column:1/-1;font-size:16px}
 .inventory-clean-table tbody>tr>td:nth-child(2):before{content:'Available'}
 .inventory-clean-table tbody>tr>td:nth-child(3):before{content:'Minimum stock'}
 .inventory-clean-table tbody>tr>td:nth-child(4){grid-column:1/-1}
 .inventory-clean-table .inventory-manage-button{width:100%;min-height:44px}
 .inventory-clean-table .inventory-empty-state{grid-column:1/-1}
 .transactions-history-table tbody>tr>td:nth-child(1){grid-column:1/-1}
 .transactions-history-table tbody>tr>td:nth-child(1):before{content:'Select transaction'}
 .transactions-history-table tbody>tr>td:nth-child(2):before{content:'Date (ET)'}
 .transactions-history-table tbody>tr>td:nth-child(3):before{content:'Time (ET)'}
 .transactions-history-table tbody>tr>td:nth-child(4){grid-column:1/-1;font-weight:700;font-size:16px}
 .transactions-history-table tbody>tr>td:nth-child(4):before{content:'Item'}
 .transactions-history-table tbody>tr>td:nth-child(5):before{content:'Size'}
 .transactions-history-table tbody>tr>td:nth-child(6):before{content:'Action'}
 .transactions-history-table tbody>tr>td:nth-child(7):before{content:'Quantity'}
 .transactions-history-table tbody>tr>td:nth-child(8):before{content:'Employee'}
 .transactions-history-table tbody>tr>td:nth-child(9){grid-column:1/-1}
 .transactions-history-table tbody>tr>td:nth-child(9):before{content:'Notes'}
 .transactions-history-table tbody>tr>td:nth-child(10){grid-column:1/-1}
 .transactions-history-table tbody>tr>td:nth-child(10)>button{width:100%;min-height:44px}
 .transactions-history-table tbody>tr>td[colspan]{grid-column:1/-1}
 .transactions-history-table tbody>tr.critical-transaction{border-left:4px solid #c44}
 .transactions-history-table tbody>tr.focused-row{outline:2px solid #4d89bc}
}


/* Mobile refinements: preserve all desktop layouts and existing forms. */
@media(max-width:720px){
 /* Tables previously had a 650px scroll viewport, causing the footer to appear
    before the visually expanded card rows had ended. */
 .table-wrap{max-height:none!important}
 .workspace{display:flex;flex-direction:column;min-height:calc(100dvh - 52px);height:auto!important;overflow:visible}
 .workspace main{flex:1 0 auto;overflow:visible}
 .workspace>footer{position:static!important;flex:0 0 auto;clear:both;display:block;width:100%;margin-top:8px;padding:20px 12px 28px;text-align:center}
 .global-search{grid-template-columns:minmax(0,1fr)}
 .global-search label,.global-search input,.global-search button{grid-column:1/-1;width:100%;min-width:0}
 .global-search button{min-height:44px}
 .employees-directory-wrap,.employee-history-wrap,.holdings-wrap,.dashboard-alerts-wrap{overflow:visible!important}
 .employees-directory-table,.employee-history-table,.holdings-table,.dashboard-alerts-table{display:block!important;width:100%!important;min-width:0!important}
 .employees-directory-table>tr:first-child,.employee-history-table>tr:first-child,.holdings-table>tr:first-child,.dashboard-alerts-table thead{display:none}
 .employees-directory-table>tr:not(:first-child),.employee-history-table>tr:not(:first-child),.holdings-table>tr:not(:first-child),.dashboard-alerts-table tbody>tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:15px;margin-bottom:12px;background:white;border:1px solid #dce5ef;border-radius:12px;box-shadow:0 2px 8px #102b4510}
 .employees-directory-table td,.employee-history-table td,.holdings-table td,.dashboard-alerts-table td{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0;padding:0!important;border:0!important;white-space:normal!important;overflow-wrap:anywhere}
 .employees-directory-table td:first-child,.holdings-table td:first-child,.dashboard-alerts-table td:first-child{grid-column:1/-1;font-size:16px;font-weight:700}
 .employees-directory-table td:nth-child(2):before{content:'Status'}
 .employees-directory-table td:nth-child(3),.employees-directory-table td:nth-child(4){grid-column:1/-1}
 .employees-directory-table td:nth-child(4) a{display:block;width:100%;text-align:center;padding:12px;background:#e8eef6;border-radius:8px;font-weight:700;text-decoration:none}
 .employee-manage-details{width:100%;min-width:0}
 .employee-manage-details summary{list-style:none;cursor:pointer;text-align:center;padding:12px;border:1px solid #cbd5e1;border-radius:8px;font-weight:700;background:#f1f5f9;color:#20324a}
 .employee-manage-details summary::-webkit-details-marker{display:none}
 .employee-manage-details[open] summary{margin-bottom:12px}
 .employee-manage-details .inline-form{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;width:100%}
 .employee-manage-details .inline-form input,.employee-manage-details .inline-form select,.employee-manage-details .inline-form button{width:100%;min-width:0}
 .employee-history-table td:nth-child(1){grid-column:1/-1}
 .employee-history-table td:nth-child(1):before{content:'Select transaction'}
 .employee-history-table td:nth-child(2):before{content:'Date'}
 .employee-history-table td:nth-child(3){grid-column:1/-1;font-weight:700;font-size:16px}
 .employee-history-table td:nth-child(3):before{content:'Item / size'}
 .employee-history-table td:nth-child(4):before{content:'Action'}
 .employee-history-table td:nth-child(5):before{content:'Quantity'}
 .employee-history-table td:nth-child(6),.employee-history-table td:nth-child(7){grid-column:1/-1}
 .employee-history-table td:nth-child(6):before{content:'Notes'}
 .employee-history-table td:nth-child(7) button{width:100%;min-height:44px}
 .employee-history-table tr.critical-transaction{border-left:4px solid #c44}
 .holdings-table td:nth-child(2):before{content:'Size'}
 .holdings-table td:nth-child(3):before{content:'Quantity held'}
 .dashboard-alerts-table td:nth-child(2):before{content:'Size'}
 .dashboard-alerts-table td:nth-child(3):before{content:'Available'}
 .dashboard-alerts-table td:nth-child(4):before{content:'Minimum stock'}
 .dashboard-alerts-table td:nth-child(5){grid-column:1/-1;font-weight:700;color:#92400e}
 .dashboard-alerts-table td:nth-child(5):before{content:'Status'}
 .employees-directory-table td:before,.employee-history-table td:before,.holdings-table td:before,.dashboard-alerts-table td:before{display:block;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#68798b}
 .employees-directory-table td[colspan],.employee-history-table td[colspan],.holdings-table td[colspan],.dashboard-alerts-table td[colspan]{grid-column:1/-1}
}

/* Mobile correction: employee directory, alert cards, and native date inputs. */
@media (max-width:720px) {
  .employees-directory-wrap { overflow:visible!important; max-height:none!important; }
  .employees-directory-table { display:block!important; width:100%!important; min-width:0!important; border:0!important; }
  .employees-directory-table > tbody { display:flex!important; flex-direction:column!important; gap:12px!important; width:100%!important; }
  .employees-directory-table > tbody > tr:first-child { display:none!important; }
  .employees-directory-table > tbody > tr:not(:first-child) { display:grid!important; width:100%!important; box-sizing:border-box!important; grid-template-columns:minmax(0,1fr)!important; gap:12px!important; margin:0!important; padding:16px!important; border:1px solid #dce5ef!important; border-radius:12px!important; background:#fff!important; }
  .employees-directory-table > tbody > tr > td { display:flex!important; flex-direction:column!important; width:100%!important; min-width:0!important; box-sizing:border-box!important; padding:0!important; border:0!important; white-space:normal!important; }
  .employees-directory-table > tbody > tr > td:first-child { font-size:17px!important; }
  .employees-directory-table > tbody > tr > td:nth-child(2):before { content:'Status'; }
  .employees-directory-table .employee-manage-details, .employees-directory-table .employee-manage-details summary, .employees-directory-table td:nth-child(4) a { width:100%!important; box-sizing:border-box!important; }
  .dashboard-alerts-table > tbody { display:flex!important; flex-direction:column!important; gap:12px!important; width:100%!important; }
  .dashboard-alerts-table > tbody > tr { display:grid!important; width:100%!important; min-width:0!important; box-sizing:border-box!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; margin:0!important; }
  .fields, .fields label, .filter-fields, .filter-fields label { min-width:0!important; }
  .fields input[type="date"], .filter-fields input[type="date"] { display:block!important; width:100%!important; min-width:0!important; max-width:100%!important; box-sizing:border-box!important; }
  .page-heading { flex-wrap:wrap; gap:12px; }
}

/* Employee controls: original edit form on desktop; compact disclosure on phones. */
.employee-mobile-management{display:none}
.employee-desktop-management{display:block}
@media(max-width:720px){
 .employee-desktop-management{display:none!important}
 .employee-mobile-management{display:block!important;width:100%}
 /* Safari's native date picker can retain an intrinsic minimum width.
    A small inset prevents it from crossing the right card border. */
 #transaction-form label:has(input[type="date"]),
 .filter-fields label:has(input[type="date"]){min-width:0!important;max-width:100%!important;overflow:hidden}
 #transaction-form input[type="date"],
 .filter-fields input[type="date"],
 form[action*="transactions"] input[type="date"]{
   display:block!important;inline-size:calc(100% - 8px)!important;
   max-inline-size:calc(100% - 8px)!important;min-inline-size:0!important;
   box-sizing:border-box!important;margin-inline:0!important;
   -webkit-appearance:none;appearance:none;
 }
}

/* Consolidated employee bulk tools, alert navigation, and iOS date control fixes */
.employee-bulk-tools{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:12px 0 16px}
.employee-bulk-tools>label{display:flex;align-items:center;gap:7px;white-space:nowrap}
.employee-bulk-tools form{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.employee-bulk-tools button{padding:9px 12px}
.employee-selection-cell input{width:18px;height:18px}
.employee-edit-target{outline:2px solid #377cce;outline-offset:4px;border-radius:5px}
.inventory-alert-link{cursor:pointer}
.inventory-alert-link:hover{background:#eef5ff}
.inventory-alert-link:focus-visible{outline:2px solid #377cce;outline-offset:-2px}
@media(max-width:720px){
 .employees-directory-table>tbody>tr>td:nth-child(2){font-size:17px!important;font-weight:700}
 .employees-directory-table>tbody>tr>td:nth-child(3):before{content:'Status'}
 .employees-directory-table>tbody>tr>td:nth-child(4):before{content:'Manage'}
 .employees-directory-table>tbody>tr>td:nth-child(5):before{content:'History'}
 .employees-directory-table>tbody>tr>td:nth-child(5) a{width:100%!important;box-sizing:border-box!important}
 .employees-directory-table>tbody>tr>td:first-child{font-size:14px!important}
 .employees-directory-table>tbody>tr>td:first-child:before{content:'Select employee'}
 .employees-directory-table>tbody>tr>td:nth-child(4),.employees-directory-table>tbody>tr>td:nth-child(5){grid-column:1/-1!important}
 .employee-bulk-tools,.employee-bulk-tools form{display:flex;flex-direction:column;align-items:stretch;width:100%;box-sizing:border-box}
 .employee-bulk-tools form button{width:100%}
 /* Prevent iOS date inputs from imposing their intrinsic width on the form grid. */
 .workspace main,.workspace form,.workspace .fields,.workspace .fields>label,.workspace .filter-fields,.workspace .filter-fields>label{min-width:0;max-width:100%;box-sizing:border-box}
 .workspace input[type=date]{display:block!important;min-width:0!important;max-width:100%!important;width:100%!important;inline-size:100%!important;box-sizing:border-box!important;overflow:hidden!important}
 .workspace label:has(>input[type=date]){display:block;min-width:0!important;max-width:100%!important;overflow:hidden}
}

/* Fixed five-icon mobile navigation. Desktop remains unchanged. */
.mobile-bottom-nav{display:none}
@media screen and (max-width:720px){
 body:not(:has(.app-shell.logged-out)) .mobile-bottom-nav{
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));
  position:fixed;left:0;right:0;bottom:0;z-index:50;
  padding:5px 4px calc(5px + env(safe-area-inset-bottom,0px));
  background:#17365b;border-top:1px solid rgba(255,255,255,.15);
  box-shadow:0 -2px 12px rgba(0,0,0,.12);
 }
 .mobile-bottom-nav .nav-link{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;min-width:0;min-height:54px;padding:5px 1px;
  text-align:center;font-size:10px;line-height:1.15;
  text-decoration:none;white-space:normal;overflow-wrap:normal;
 }
 .mobile-bottom-nav .nav-link img{width:22px;height:22px;object-fit:contain;flex:none}
 .mobile-bottom-nav .nav-link.active{font-weight:700}
 body:has(.mobile-bottom-nav) .workspace{padding-bottom:calc(86px + env(safe-area-inset-bottom,0px))!important}
 body:has(.mobile-bottom-nav) .workspace footer{position:static!important}
}
@media print{.mobile-bottom-nav{display:none!important}}


/* Mobile-only header, compact fixed navigation and card/date refinements. */
.mobile-app-header{display:none}
@media screen and (max-width:720px){
 /* Reuse the original company logo; no mobile hamburger needed with five tabs. */
 .app-shell:not(.logged-out) .mobile-menu-toggle,
 .app-shell:not(.logged-out) .mobile-nav-backdrop{display:none!important}
 .app-shell:not(.logged-out) .mobile-app-header{
  display:flex;position:sticky;top:0;z-index:45;align-items:center;
  justify-content:space-between;gap:12px;min-height:58px;
  padding:7px 14px;background:#fff;border-bottom:1px solid #dce5ef;
 }
 .mobile-company-brand{display:flex;align-items:center;min-width:0;max-width:65%;text-decoration:none}
 .mobile-company-brand img{display:block;width:auto;max-width:100%;height:auto;max-height:42px;object-fit:contain;object-position:left center}
 .mobile-header-logout{margin:0!important;padding:0;flex:0 0 auto}
 .mobile-header-logout button{background:#e8eef6;color:#20324a;padding:10px 12px;min-height:40px;white-space:nowrap}
 .app-shell:not(.logged-out) .sidebar{display:none!important}
 /* Keep the five existing tabs, but remove excess height and improve contrast. */
 body:not(:has(.app-shell.logged-out)) .mobile-bottom-nav{
  padding:4px 4px max(5px,env(safe-area-inset-bottom,0px));
  background:#17365b;align-items:stretch;
 }
 .mobile-bottom-nav .nav-link{color:#fff!important;opacity:1!important;
  min-height:48px;padding:5px 1px;gap:3px;font-weight:650;
  background:transparent;outline:0;border-radius:8px;
 }
 .mobile-bottom-nav .nav-link img{filter:brightness(0) invert(1)!important;opacity:1!important}
 .mobile-bottom-nav .nav-link.active{background:rgba(255,255,255,.16)!important;
  color:#fff!important;outline:1px solid rgba(255,255,255,.35)!important}
 .mobile-bottom-nav .nav-link:focus-visible{outline:2px solid white!important}
 body:has(.mobile-bottom-nav) .workspace{padding-bottom:calc(68px + env(safe-area-inset-bottom,0px))!important}
 /* These two tables have direct tr children, not tbody rows; make them real cards. */
 .holdings-wrap,.employee-history-wrap{overflow:visible!important;max-height:none!important}
 .holdings-table,.employee-history-table{display:block!important;width:100%!important;min-width:0!important;border:0!important}
 .holdings-table>tbody,.employee-history-table>tbody{display:flex!important;flex-direction:column!important;gap:12px;width:100%!important}
 .holdings-table>tbody>tr:first-child,.employee-history-table>tbody>tr:first-child{display:none!important}
 .holdings-table>tbody>tr:not(:first-child),.employee-history-table>tbody>tr:not(:first-child){
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px 10px!important;width:100%!important;min-width:0!important;
  box-sizing:border-box!important;padding:15px!important;margin:0!important;
  background:#fff!important;border:1px solid #dce5ef!important;border-radius:12px!important;
  box-shadow:0 2px 8px #102b4510!important;
 }
 .holdings-table>tbody>tr>td,.employee-history-table>tbody>tr>td{
  display:flex!important;flex-direction:column!important;align-items:flex-start!important;
  min-width:0!important;width:auto!important;padding:0!important;border:0!important;
  white-space:normal!important;overflow-wrap:anywhere!important;
 }
 .holdings-table>tbody>tr>td:first-child{grid-column:1/-1!important;font-weight:700;font-size:16px}
 .employee-history-table>tbody>tr>td:first-child,.employee-history-table>tbody>tr>td:nth-child(3),
 .employee-history-table>tbody>tr>td:nth-child(6),.employee-history-table>tbody>tr>td:nth-child(7){grid-column:1/-1!important}
 .employee-history-table>tbody>tr>td:nth-child(7)>button{width:100%!important}
 .holdings-table>tbody>tr>td:before,.employee-history-table>tbody>tr>td:before{
  display:block!important;font-size:11px;font-weight:700;letter-spacing:.04em;
  text-transform:uppercase;color:#68798b;
 }
 .holdings-table>tbody>tr>td:nth-child(2):before{content:'Size'}
 .holdings-table>tbody>tr>td:nth-child(3):before{content:'Quantity held'}
 .employee-history-table>tbody>tr>td:nth-child(1):before{content:'Select transaction'}
 .employee-history-table>tbody>tr>td:nth-child(2):before{content:'Date'}
 .employee-history-table>tbody>tr>td:nth-child(3):before{content:'Item / size'}
 .employee-history-table>tbody>tr>td:nth-child(4):before{content:'Action'}
 .employee-history-table>tbody>tr>td:nth-child(5):before{content:'Quantity'}
 .employee-history-table>tbody>tr>td:nth-child(6):before{content:'Notes'}
 .holdings-table>tbody>tr>td[colspan],.employee-history-table>tbody>tr>td[colspan]{grid-column:1/-1!important}
 /* iOS date controls: use form width, not Safari's intrinsic date width. */
 form.fields:has(input[type="date"]){display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%!important;max-width:100%!important}
 form.fields:has(input[type="date"])>label{display:flex!important;flex-direction:column!important;
  min-width:0!important;width:100%!important;max-width:100%!important;overflow:visible!important}
 form.fields:has(input[type="date"]) input[type="date"]{
  display:block!important;width:100%!important;inline-size:100%!important;
  min-width:0!important;min-inline-size:0!important;max-width:100%!important;
  max-inline-size:100%!important;box-sizing:border-box!important;margin:0!important;
  -webkit-appearance:none;appearance:none;
 }
 form.fields:has(input[type="date"])>button,
 form.fields:has(input[type="date"])>.button{width:100%!important;max-width:100%!important;box-sizing:border-box!important}
}
@media print{.mobile-app-header{display:none!important}}


/* Compact employee directory cards — mobile only, no desktop changes. */
@media screen and (max-width:720px){
 .employees-directory-table>tbody>tr:not(:first-child){
   display:grid!important;
   grid-template-columns:42px minmax(0,1fr)!important;
   grid-template-areas:"select name" "select status" "history manage"!important;
   column-gap:12px!important;row-gap:5px!important;
   padding:14px!important;
   align-items:start!important;
 }
 .employees-directory-table>tbody>tr>td{
   grid-column:auto!important;width:auto!important;min-width:0!important;
   margin:0!important;padding:0!important;
 }
 .employees-directory-table>tbody>tr>td:nth-child(1){
   grid-area:select!important;display:flex!important;align-items:flex-start!important;
   padding-top:3px!important;
 }
 .employees-directory-table>tbody>tr>td:nth-child(1) input{
   width:22px!important;height:22px!important;margin:0!important;
 }
 .employees-directory-table>tbody>tr>td:nth-child(2){
   grid-area:name!important;font-size:17px!important;font-weight:700!important;
 }
 .employees-directory-table>tbody>tr>td:nth-child(3){
   grid-area:status!important;justify-self:start!important;
   display:inline-flex!important;align-items:center!important;
   background:#e6f4eb!important;color:#17643a!important;
   border-radius:999px!important;padding:4px 10px!important;
   font-size:13px!important;font-weight:650!important;
 }
 .employees-directory-table>tbody>tr>td:nth-child(4){grid-area:manage!important;margin-top:10px!important}
 .employees-directory-table>tbody>tr>td:nth-child(5){grid-area:history!important;margin-top:10px!important}
 .employees-directory-table>tbody>tr>td:nth-child(1):before,
 .employees-directory-table>tbody>tr>td:nth-child(2):before,
 .employees-directory-table>tbody>tr>td:nth-child(3):before,
 .employees-directory-table>tbody>tr>td:nth-child(4):before,
 .employees-directory-table>tbody>tr>td:nth-child(5):before{content:none!important;display:none!important}
 .employees-directory-table .employee-mobile-management summary,
 .employees-directory-table>tbody>tr>td:nth-child(5) a{
   display:flex!important;align-items:center!important;justify-content:center!important;
   width:100%!important;min-height:44px!important;
   padding:10px 5px!important;box-sizing:border-box!important;
   border-radius:8px!important;font-size:13px!important;
   line-height:1.2!important;text-align:center!important;
   white-space:normal!important;
 }
 .employees-directory-table>tbody>tr>td:nth-child(5) a{text-decoration:none!important}
 .employees-directory-table .employee-mobile-management summary{font-size:0!important}
 .employees-directory-table .employee-mobile-management summary:after{
   content:'Manage';font-size:13px!important;font-weight:700!important;
 }
 .employees-directory-table .employee-mobile-management[open]{position:relative!important}
 .employees-directory-table .employee-mobile-management[open] .inline-form{
   position:relative!important;width:calc(200% + 54px)!important;
   max-width:calc(100vw - 68px)!important;
   margin-left:calc(-100% - 54px)!important;
   margin-top:12px!important;
   background:white!important;border:1px solid #dce5ef!important;
   padding:12px!important;border-radius:10px!important;
   box-sizing:border-box!important;
 }
}
@media screen and (max-width:720px){
 .employees-directory-table>tbody>tr:has(.employee-mobile-management[open]){
   grid-template-areas:"select name" "select status" "history manage" "edit edit"!important;
 }
 .employees-directory-table>tbody>tr:has(.employee-mobile-management[open])>td:nth-child(4){display:contents!important}
 .employees-directory-table>tbody>tr:has(.employee-mobile-management[open]) .employee-mobile-management{display:contents!important}
 .employees-directory-table>tbody>tr:has(.employee-mobile-management[open]) .employee-mobile-management summary{grid-area:manage!important;margin-top:10px!important}
 .employees-directory-table>tbody>tr:has(.employee-mobile-management[open]) .employee-mobile-management .inline-form{
   grid-area:edit!important;width:100%!important;max-width:100%!important;margin:10px 0 0!important;
 }
}

/* Mobile compact directory and transaction cards — desktop styles untouched. */
.mobile-item-name{display:none}
@media screen and (max-width:720px){
 /* Directory: checkbox/name/status on left, history in top-right, manage full-width. */
 .employees-directory-table>tbody>tr:not(:first-child){
  grid-template-columns:42px minmax(0,1fr) auto!important;
  grid-template-areas:"select name history" "select status history" "manage manage manage" "edit edit edit"!important;
  gap:5px 10px!important;align-items:start!important;
 }
 .employees-directory-table>tbody>tr>td:nth-child(1){grid-area:select!important}
 .employees-directory-table>tbody>tr>td:nth-child(2){grid-area:name!important}
 .employees-directory-table>tbody>tr>td:nth-child(3){grid-area:status!important}
 .employees-directory-table>tbody>tr>td:nth-child(4){grid-area:manage!important;margin-top:10px!important;display:block!important}
 .employees-directory-table>tbody>tr>td:nth-child(5){grid-area:history!important;margin-top:0!important;align-self:start!important;justify-self:end!important}
 .employees-directory-table>tbody>tr>td:nth-child(5) a{
  display:inline-block!important;width:auto!important;min-height:0!important;
  padding:4px 0!important;text-align:right!important;white-space:nowrap!important;
  font-size:12px!important;line-height:1.4!important;text-decoration:underline!important;
 }
 .employees-directory-table .employee-mobile-management summary{width:100%!important;min-height:44px!important}
 .employees-directory-table>tbody>tr:has(.employee-mobile-management[open]){
  grid-template-areas:"select name history" "select status history" "manage manage manage" "edit edit edit"!important;
 }
 .employees-directory-table>tbody>tr:has(.employee-mobile-management[open])>td:nth-child(4){display:block!important}
 .employees-directory-table>tbody>tr:has(.employee-mobile-management[open]) .employee-mobile-management{display:block!important}
 .employees-directory-table>tbody>tr:has(.employee-mobile-management[open]) .employee-mobile-management summary{grid-area:auto!important;margin:0!important}
 .employees-directory-table>tbody>tr:has(.employee-mobile-management[open]) .employee-mobile-management .inline-form{
  position:static!important;width:100%!important;max-width:100%!important;
  margin:10px 0 0!important;padding:12px!important;
 }
 /* Main transactions: compact item/date header and small data rows. */
 .transactions-history-wrap{overflow:visible!important}
 .transactions-history-table{display:block!important;min-width:0!important;width:100%!important}
 .transactions-history-table>thead{display:none!important}
 .transactions-history-table>tbody{display:flex!important;flex-direction:column!important;gap:12px!important}
 .transactions-history-table>tbody>tr:not(:has(td[colspan])){
  display:grid!important;grid-template-columns:28px minmax(0,1fr) auto!important;
  grid-template-areas:"select item action" ". date time" "employee employee employee" "quantity quantity quantity" "notes notes notes" "delete delete delete"!important;
  gap:7px 10px!important;width:100%!important;min-width:0!important;
  margin:0!important;padding:14px!important;box-sizing:border-box!important;
  background:#fff!important;border:1px solid #dce5ef!important;border-radius:12px!important;
 }
 .transactions-history-table>tbody>tr>td{display:block!important;min-width:0!important;width:auto!important;
  margin:0!important;padding:0!important;border:0!important;overflow-wrap:anywhere!important;white-space:normal!important}
 .transactions-history-table>tbody>tr>td:nth-child(1){grid-area:select!important}
 .transactions-history-table>tbody>tr>td:nth-child(2){grid-area:date!important;color:#6a7a8b;font-size:12px}
 .transactions-history-table>tbody>tr>td:nth-child(3){grid-area:time!important;color:#6a7a8b;font-size:12px;text-align:right}
 .transactions-history-table>tbody>tr>td:nth-child(4){grid-area:item!important;font-weight:700;font-size:16px}
 .transactions-history-table>tbody>tr>td:nth-child(5){display:none!important}
 .transactions-history-table>tbody>tr>td:nth-child(6){grid-area:action!important;align-self:start;
  background:#e8f1ff!important;color:#174c82!important;border-radius:999px!important;
  padding:5px 9px!important;font-size:12px!important;font-weight:700!important;white-space:nowrap!important}
 .transactions-history-table>tbody>tr>td:nth-child(7){grid-area:quantity!important}
 .transactions-history-table>tbody>tr>td:nth-child(8){grid-area:employee!important}
 .transactions-history-table>tbody>tr>td:nth-child(9){grid-area:notes!important}
 .transactions-history-table>tbody>tr>td:nth-child(10){grid-area:delete!important}
 .transactions-history-table>tbody>tr>td:nth-child(7):before{content:'Quantity';color:#68798b}
 .transactions-history-table>tbody>tr>td:nth-child(8):before{content:'Employee';color:#68798b}
 .transactions-history-table>tbody>tr>td:nth-child(9):before{content:'Notes';color:#68798b}
 .transactions-history-table>tbody>tr>td:nth-child(7),
 .transactions-history-table>tbody>tr>td:nth-child(8),
 .transactions-history-table>tbody>tr>td:nth-child(9){display:flex!important;justify-content:space-between;gap:12px;font-size:14px}
 .transactions-history-table>tbody>tr>td:nth-child(10) button{width:100%!important;min-height:44px!important}
 .transactions-history-table .desktop-item-name{display:none!important}
 .transactions-history-table .mobile-item-name{display:inline!important}
 .transactions-history-table>tbody>tr>td:first-child:before{display:none!important}
 /* Employee history cards use the same compact visual hierarchy. */
 .employee-history-table>tbody>tr:not(:first-child){
  grid-template-columns:28px minmax(0,1fr) auto!important;
  grid-template-areas:"select item action" ". date date" "qty qty qty" "notes notes notes" "delete delete delete"!important;
  gap:7px 10px!important;padding:14px!important;align-items:start!important;
 }
 .employee-history-table>tbody>tr>td:nth-child(1){grid-area:select!important}
 .employee-history-table>tbody>tr>td:nth-child(2){grid-area:date!important;font-size:12px;color:#68798b}
 .employee-history-table>tbody>tr>td:nth-child(3){grid-area:item!important;font-size:16px!important;font-weight:700!important}
 .employee-history-table>tbody>tr>td:nth-child(4){grid-area:action!important;justify-self:end;
  background:#e8f1ff!important;color:#174c82!important;border-radius:999px!important;
  padding:5px 9px!important;font-size:12px!important;font-weight:700!important;white-space:nowrap!important}
 .employee-history-table>tbody>tr>td:nth-child(5){grid-area:qty!important}
 .employee-history-table>tbody>tr>td:nth-child(6){grid-area:notes!important}
 .employee-history-table>tbody>tr>td:nth-child(7){grid-area:delete!important}
 .employee-history-table>tbody>tr>td:nth-child(1):before,
 .employee-history-table>tbody>tr>td:nth-child(2):before,
 .employee-history-table>tbody>tr>td:nth-child(3):before,
 .employee-history-table>tbody>tr>td:nth-child(4):before{content:none!important;display:none!important}
 .employee-history-table>tbody>tr>td:nth-child(5),
 .employee-history-table>tbody>tr>td:nth-child(6){display:flex!important;flex-direction:row!important;justify-content:space-between!important;gap:12px!important;font-size:14px}
 .employee-history-table>tbody>tr>td:nth-child(5):before{content:'Quantity'!important}
 .employee-history-table>tbody>tr>td:nth-child(6):before{content:'Notes'!important}
 .employee-history-table>tbody>tr>td:nth-child(7) button{width:100%!important;min-height:44px!important}
 .employee-history-table>tbody>tr>td:nth-child(1) input{margin:0!important}
 .employee-history-table>tbody>tr>td:nth-child(6):empty:after,
 .transactions-history-table>tbody>tr>td:nth-child(9):empty:after{content:'—';color:#84909c}
}

/* 2026-10 mobile-only transaction card refinement. No desktop changes. */
.mobile-timestamp{display:none}
@media screen and (max-width:720px){
 .transactions-history-table>tbody>tr:not(:has(td[colspan])){
   grid-template-columns:28px minmax(0,1fr) auto!important;
   grid-template-areas:"select item action" "employee employee employee" "quantity quantity quantity" "notes notes notes" "delete delete delete"!important;
   align-items:start!important;
 }
 .transactions-history-table>tbody>tr>td:nth-child(2),
 .transactions-history-table>tbody>tr>td:nth-child(3){display:none!important}
 .transactions-history-table>tbody>tr.no-employee-transaction{
   grid-template-areas:"select item action" "quantity quantity quantity" "notes notes notes" "delete delete delete"!important;
 }
 .transactions-history-table>tbody>tr.no-employee-transaction>td:nth-child(8){display:none!important}
 .transactions-history-table .mobile-item-name{display:block!important;line-height:1.3}
 .mobile-timestamp{display:block!important;margin-top:4px;color:#68798b;font-size:12px;font-weight:400;line-height:1.4;white-space:normal}
 .transactions-history-table>tbody>tr>td:nth-child(6),
 .employee-history-table>tbody>tr>td:nth-child(4){max-width:125px!important;white-space:normal!important;text-align:center;overflow-wrap:break-word!important}
 .transactions-history-table>tbody>tr>td:nth-child(7),
 .transactions-history-table>tbody>tr>td:nth-child(8),
 .transactions-history-table>tbody>tr>td:nth-child(9){align-items:baseline!important}
 .transactions-history-table>tbody>tr>td:nth-child(9){text-align:right!important}
 .transactions-history-table>tbody>tr>td:nth-child(9):before{margin-right:auto;text-align:left}
 .employee-history-table>tbody>tr:not(:first-child){
   grid-template-areas:"select item action" "qty qty qty" "notes notes notes" "delete delete delete"!important;
 }
 .employee-history-table>tbody>tr>td:nth-child(2){display:none!important}
 .employee-history-table>tbody>tr>td:nth-child(3){line-height:1.3!important}
 .employee-history-table>tbody>tr>td:nth-child(6){text-align:right!important}
 .employee-history-table>tbody>tr>td:nth-child(6):before{margin-right:auto;text-align:left}
}

/* Compact inventory cards on mobile only; desktop table and inventory modal unchanged. */
@media screen and (max-width:720px){
 .inventory-clean-table tbody>tr:not(:has(td[colspan])){
   grid-template-columns:minmax(0,1fr) auto!important;
   grid-template-areas:"item stock" "manage manage"!important;
   gap:10px 12px!important;padding:14px!important;align-items:start!important;
 }
 .inventory-clean-table tbody>tr:not(:has(td[colspan]))>td:nth-child(1){
   grid-area:item!important;grid-column:auto!important;min-width:0!important;
   font-size:16px!important;line-height:1.35!important;gap:3px!important;
 }
 .inventory-clean-table tbody>tr:not(:has(td[colspan]))>td:nth-child(2){
   grid-area:stock!important;grid-column:auto!important;align-items:flex-end!important;
   justify-self:end!important;min-width:0!important;max-width:145px!important;
 }
 .inventory-clean-table tbody>tr:not(:has(td[colspan]))>td:nth-child(2):before{display:none!important}
 .inventory-clean-table tbody>tr:not(:has(td[colspan]))>td:nth-child(2) .stock-pill{
   font-size:12px!important;line-height:1.3!important;text-align:center!important;
   white-space:normal!important;max-width:145px!important;
 }
 .inventory-clean-table tbody>tr:not(:has(td[colspan]))>td:nth-child(3){display:none!important}
 .inventory-clean-table tbody>tr:not(:has(td[colspan]))>td:nth-child(4){
   grid-area:manage!important;grid-column:auto!important;width:100%!important;
 }
 .inventory-clean-table tbody>tr:not(:has(td[colspan]))>td:nth-child(4) button{width:100%!important;min-height:44px!important}
}

/* Explicit mobile employee-row visibility, independent of grid auto-placement. */
@media screen and (max-width:720px){
 .transactions-history-table>tbody>tr>td.mobile-empty-employee{display:none!important}
 .transactions-history-table>tbody>tr:has(>td.mobile-empty-employee){
  grid-template-areas:"select item action" "quantity quantity quantity" "notes notes notes" "delete delete delete"!important;
 }
}

/* Dashboard inventory alert cards: match compact Inventory mobile layout. */
@media (max-width:720px){
 .dashboard-alerts-wrap{overflow-x:visible!important}
 .dashboard-alerts-table{display:block!important;width:100%!important;min-width:0!important;border:0!important;background:transparent!important}
 .dashboard-alerts-table thead{display:none!important}
 .dashboard-alerts-table tbody{display:flex!important;flex-direction:column;gap:12px}
 .dashboard-alerts-table tbody>tr.inventory-alert-link{display:grid!important;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:12px;row-gap:3px;align-items:start;width:100%;padding:15px!important;border:1px solid #dce5ef!important;border-radius:12px!important;background:#fff!important;box-shadow:0 2px 8px #102b4510;box-sizing:border-box}
 .dashboard-alerts-table tbody>tr.inventory-alert-link>td{display:block!important;min-width:0!important;padding:0!important;border:0!important;white-space:normal!important;overflow-wrap:anywhere}
 .dashboard-alerts-table tbody>tr.inventory-alert-link>td:before{display:none!important}
 .dashboard-alerts-table tbody>tr.inventory-alert-link>td:nth-child(1){grid-column:1;grid-row:1;font-size:16px!important;font-weight:700!important}
 .dashboard-alerts-table tbody>tr.inventory-alert-link>td:nth-child(1) a{color:inherit;text-decoration:none}
 .dashboard-alerts-table tbody>tr.inventory-alert-link>td:nth-child(2){grid-column:1;grid-row:2;color:#68798b!important;font-size:14px!important}
 .dashboard-alerts-table tbody>tr.inventory-alert-link>td:nth-child(3){grid-column:2;grid-row:1;justify-self:end;font-size:15px!important;font-weight:700!important;color:#9a3412!important}
 .dashboard-alerts-table tbody>tr.inventory-alert-link>td:nth-child(3):after{content:' available';font-size:12px;font-weight:500}
 .dashboard-alerts-table tbody>tr.inventory-alert-link>td:nth-child(4){display:none!important}
 .dashboard-alerts-table tbody>tr.inventory-alert-link>td:nth-child(5){grid-column:2;grid-row:2;justify-self:end;text-align:right;font-size:12px!important;font-weight:700!important;color:#b42318!important}
}

/* Mobile Employee History: omit notes row entirely when blank. */
@media screen and (max-width:720px){
 .employee-history-table>tbody>tr>td.mobile-no-notes{display:none!important}
 .employee-history-table>tbody>tr:has(>td.mobile-no-notes){grid-template-areas:"select item action" "qty qty qty" "delete delete delete"!important}
}

/* Mobile Inventory: keep item name and size together, without a flex-row
   break element creating extra vertical space. Desktop remains unchanged. */
@media screen and (max-width:720px){
 .inventory-clean-table tbody>tr:not(:has(td[colspan]))>td:first-child{
   display:flex!important;
   flex-direction:column!important;
   justify-content:flex-start!important;
   align-items:flex-start!important;
   gap:2px!important;
   line-height:1.25!important;
 }
 .inventory-clean-table tbody>tr:not(:has(td[colspan]))>td:first-child>br{display:none!important}
 .inventory-clean-table tbody>tr:not(:has(td[colspan]))>td:first-child>strong,
 .inventory-clean-table tbody>tr:not(:has(td[colspan]))>td:first-child>span{
   display:block!important;
   margin:0!important;
   padding:0!important;
   line-height:1.3!important;
 }
}

/* 2026 mobile-only compact transaction and employee history cards. */
@media screen and (max-width:720px){
 .transactions-history-table>tbody>tr:not(:has(td[colspan])),
 .employee-history-table>tbody>tr:not(:first-child){
   padding:12px 13px!important;gap:7px 10px!important;
   grid-template-columns:26px minmax(0,1fr) auto!important;
   grid-template-areas:"select item action" "quantity quantity quantity" "employee employee employee" "notes notes notes" "delete delete delete"!important;
   align-items:start!important;
 }
 .employee-history-table>tbody>tr:not(:first-child){
   grid-template-areas:"select item action" "qty qty qty" "notes notes notes" "delete delete delete"!important;
 }
 .transactions-history-table>tbody>tr>td:nth-child(4),
 .employee-history-table>tbody>tr>td:nth-child(3){
   margin:0!important;padding:0!important;line-height:1.25!important;
   overflow-wrap:anywhere;
 }
 .transactions-history-table .mobile-item-name{line-height:1.25!important}
 .transactions-history-table .mobile-timestamp,
 .employee-history-table .mobile-timestamp{margin-top:3px!important;line-height:1.25!important;font-size:12px!important}
 .transactions-history-table>tbody>tr>td:nth-child(6),
 .employee-history-table>tbody>tr>td:nth-child(4){
   margin:0!important;padding:5px 8px!important;max-width:128px!important;
   font-size:12px!important;line-height:1.25!important;
 }
 .transactions-history-table>tbody>tr>td:nth-child(7),
 .transactions-history-table>tbody>tr>td:nth-child(8),
 .transactions-history-table>tbody>tr>td:nth-child(9),
 .employee-history-table>tbody>tr>td:nth-child(5),
 .employee-history-table>tbody>tr>td:nth-child(6){
   margin:0!important;padding:2px 0!important;line-height:1.35!important;
 }
 .transactions-history-table>tbody>tr>td:nth-child(10),
 .employee-history-table>tbody>tr>td:nth-child(7){margin-top:3px!important;padding:0!important}
 .transactions-history-table>tbody>tr.no-employee-transaction>td:nth-child(8),
 .transactions-history-table>tbody>tr>td.mobile-empty-employee{display:none!important}
 .transactions-history-table>tbody>tr.no-notes-transaction>td:nth-child(9),
 .transactions-history-table>tbody>tr>td.mobile-no-notes,
 .employee-history-table>tbody>tr>td.mobile-no-notes{display:none!important}
 .transactions-history-table>tbody>tr.no-employee-transaction:not(.no-notes-transaction){
   grid-template-areas:"select item action" "quantity quantity quantity" "notes notes notes" "delete delete delete"!important;
 }
 .transactions-history-table>tbody>tr.no-notes-transaction:not(.no-employee-transaction){
   grid-template-areas:"select item action" "quantity quantity quantity" "employee employee employee" "delete delete delete"!important;
 }
 .transactions-history-table>tbody>tr.no-employee-transaction.no-notes-transaction{
   grid-template-areas:"select item action" "quantity quantity quantity" "delete delete delete"!important;
 }
 .employee-history-table>tbody>tr:has(>td.mobile-no-notes){
   grid-template-areas:"select item action" "qty qty qty" "delete delete delete"!important;
 }
}

/* Dashboard recent transactions: compact mobile-only cards. Desktop table intact. */
.dashboard-recent-mobile{display:none}
@media screen and (max-width:720px){
 .dashboard-recent-section .dashboard-recent-desktop{display:none!important}
 .dashboard-recent-mobile{display:grid;gap:9px;margin-top:12px}
 .dashboard-tx-card{border:1px solid #dce4ed;border-radius:12px;background:#fff;padding:12px 13px;min-width:0}
 .dashboard-tx-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
 .dashboard-tx-ident{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
 .dashboard-tx-ident strong{font-size:15px;line-height:1.25;overflow-wrap:anywhere}
 .dashboard-tx-size{font-size:13px;color:#65758a;line-height:1.25}
 .dashboard-tx-time{font-size:12px;color:#65758a;line-height:1.35;margin-top:2px}
 .dashboard-tx-badge{flex-shrink:0;max-width:45%;font-size:11px;font-weight:700;line-height:1.25;padding:5px 8px;border-radius:20px;background:#e9f0fa;color:#25456d;text-align:center;overflow-wrap:anywhere}
 .dashboard-tx-summary,.dashboard-tx-change{font-size:13px;line-height:1.35;margin-top:9px;overflow-wrap:anywhere}
 .dashboard-tx-summary{color:#304257}
 .dashboard-tx-person{font-weight:600}
 .dashboard-tx-sep{color:#8793a4}
 .dashboard-tx-change{font-weight:650}
 .dashboard-tx-add{color:#187346}.dashboard-tx-remove{color:#b42318}.dashboard-tx-neutral{color:#64748b}
 .dashboard-tx-critical .dashboard-tx-badge{background:#fff0ef;color:#a1261e}
}

/* Transaction activity summaries match Dashboard mobile cards; desktop remains unchanged. */
.mobile-tx-summary{display:none}
@media screen and (max-width:720px){
 .transactions-history-table .desktop-tx-qty{display:none!important}
 .transactions-history-table .mobile-tx-summary{display:block!important;font-size:13px;line-height:1.35;color:#304257;font-weight:600}
 .transactions-history-table .mobile-tx-added{color:#187346}
 .transactions-history-table .mobile-tx-removed{color:#b42318}
 .transactions-history-table>tbody>tr>td:nth-child(7){display:block!important;text-align:left!important}
 .transactions-history-table>tbody>tr>td:nth-child(7):before{display:none!important;content:none!important}
 .transactions-history-table>tbody>tr>td:nth-child(6):before{display:none!important;content:none!important}
}

/* Mobile Reports: compact, evenly spaced backup actions. */
@media (max-width:720px) {
  .reports-download-panel { padding:16px!important; }
  .reports-download-panel > h2 { margin:0 0 14px!important; }
  .reports-download-panel > p:has(> a.button) { margin:0 0 9px!important; display:grid; grid-template-columns:minmax(0,1fr); gap:9px; }
  .reports-download-panel > p > a.button { display:flex; align-items:center; justify-content:center; width:100%; min-width:0; min-height:44px; margin:0!important; padding:11px 12px; text-align:center; white-space:normal; line-height:1.25; }
  .reports-download-panel > p.muted { margin:13px 0 0!important; }
}

/* Desktop-only: signed manual adjustment colors in transaction tables.
   Keep all mobile styles and all existing layout rules unchanged. */
@media screen and (min-width: 769px) {
  .dashboard-recent-desktop td .desktop-adjustment-phrase.adjustment-positive,
  .dashboard-recent-desktop td .desktop-adjustment-phrase.adjustment-positive *,
  .transactions-history-table td .desktop-adjustment-phrase.adjustment-positive,
  .transactions-history-table td .desktop-adjustment-phrase.adjustment-positive * {
    color: #187346 !important;
    font-weight: 700 !important;
    -webkit-text-fill-color: #187346 !important;
  }
  .dashboard-recent-desktop td .desktop-adjustment-phrase.adjustment-negative,
  .dashboard-recent-desktop td .desktop-adjustment-phrase.adjustment-negative *,
  .transactions-history-table td .desktop-adjustment-phrase.adjustment-negative,
  .transactions-history-table td .desktop-adjustment-phrase.adjustment-negative * {
    color: #b42318 !important;
    font-weight: 700 !important;
    -webkit-text-fill-color: #b42318 !important;
  }
}


/* Dashboard-specific styling moved from inline styles to comply with CSP. */
@media (min-width: 769px) { .desktop-adjustment-phrase.adjustment-positive { color: #187346; font-weight: 700; } .desktop-adjustment-phrase.adjustment-negative { color: #b42318; font-weight: 700; } .desktop-adjustment-phrase.adjustment-zero { color: #68798b; font-weight: 700; } }

/* Self-contained Dashboard action layout; overrides shared button/toolbar rules. */
.dashboard-actions-v2 {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  row-gap: 12px !important;
  width: 472px !important;
  max-width: 100% !important;
  margin: 0 0 28px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}
.dashboard-actions-v2 > .dashboard-record-v2 {
  display: flex !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 58px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 14px 16px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  background: #20834b !important;
  border: 1px solid #19713e !important;
  color: #fff !important;
  border-radius: 9px !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: normal !important;
  transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease !important;
}
.dashboard-actions-v2 .dashboard-record-plus-v2 {
  display: inline-block !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  font: 700 21px/1 Arial, sans-serif !important;
  color: inherit !important;
}
.dashboard-secondary-v2 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  column-gap: 12px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}
.dashboard-secondary-v2 > a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  box-sizing: border-box !important;
  text-align: center !important;
  white-space: normal !important;
}
@media (hover:hover) {
  .dashboard-actions-v2 > .dashboard-record-v2:hover {
    background: #176a3b !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 14px rgba(20,90,51,.22);
  }
}
@media (max-width: 520px) {
  .dashboard-actions-v2 { width: 100% !important; }
  .dashboard-actions-v2 > .dashboard-record-v2 { font-size: 15px !important; }
  .dashboard-secondary-v2 > a { font-size: 14px !important; }
}
@media (prefers-reduced-motion:reduce) {
  .dashboard-actions-v2 > .dashboard-record-v2 { transition: none !important; }
}


/* Dashboard transaction popup. External CSS required by the app CSP. */
.dashboard-tx-dialog{width:min(520px,calc(100vw - 24px));max-height:min(90dvh,760px);overflow-y:auto;border:1px solid #dce5ef;border-radius:14px;padding:22px;background:#fff;color:#253247;box-shadow:0 20px 65px #0f172a50}
.dashboard-tx-dialog::backdrop{background:rgba(15,23,42,.58)}
.dashboard-tx-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.dashboard-tx-dialog-heading h2{font-size:1.25rem;margin:0}
.dashboard-tx-close{display:grid;place-items:center;min-width:36px;min-height:36px;padding:0;background:#eef2f7;color:#334155;font-size:25px;line-height:1;border-radius:8px}
.dashboard-tx-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.dashboard-tx-form label{min-width:0}
.dashboard-tx-form input:not([type=checkbox]),.dashboard-tx-form select{width:100%;min-width:0;max-width:100%;height:42px}
.dashboard-tx-form label:has([name="item_id"]),.dashboard-tx-form label:has([name="employee_id"]),.dashboard-tx-form label:has([name="notes"]),.dashboard-tx-form .check-inline,.dashboard-tx-help,.dashboard-tx-dialog-actions{grid-column:1/-1}
.dashboard-tx-form .check-inline{flex-direction:row;align-items:center;font-size:.86rem}
.dashboard-tx-form .check-inline input{min-width:17px;min-height:17px}
.dashboard-tx-help{margin:0;line-height:1.5}
.dashboard-tx-dialog-actions{display:flex;justify-content:flex-end;gap:10px;padding-top:4px}
.dashboard-tx-dialog-actions button{white-space:normal}
@media(max-width:520px){.dashboard-tx-dialog{padding:17px}.dashboard-tx-form{gap:12px}.dashboard-tx-dialog-actions{flex-direction:column-reverse}.dashboard-tx-dialog-actions button{width:100%;min-height:44px}}

/* Dashboard compact summary panels: keep cards independent in height. */
@media (min-width:721px) {
  .dashboard-summary-split { align-items:start; }
  .dashboard-summary-split > .panel { align-self:start; min-height:0; }
  .dashboard-summary-split .dashboard-alerts-wrap { max-height:380px; overflow-y:auto; }
  .dashboard-summary-split .dashboard-held-wrap { max-height:350px; overflow-y:auto; }
}
@media (max-width:720px) {
  .dashboard-summary-split .dashboard-alerts-wrap,
  .dashboard-summary-split .dashboard-held-wrap { max-height:none!important; overflow-y:visible; }
}

/* Mobile transaction/history card correction: actual table column positions. */
@media screen and (max-width:720px) {
  .employee-history-table>tbody>tr:not(:first-child),
  .transactions-history-table>tbody>tr:not(:has(td[colspan])) {
    display:grid!important;
    grid-template-columns:28px minmax(0,1fr)!important;
    grid-template-areas:none!important;
    gap:9px 12px!important;
    align-items:start!important;
  }
  .employee-history-table>tbody>tr>td,
  .transactions-history-table>tbody>tr>td {
    grid-area:auto!important;
    grid-column:1/-1!important;
    min-width:0!important;
    max-width:none!important;
    overflow-wrap:break-word!important;
    word-break:normal!important;
    text-align:left!important;
    background:transparent;
  }
  .employee-history-table>tbody>tr>td:first-child,
  .transactions-history-table>tbody>tr>td:first-child {grid-column:1!important;grid-row:1!important;}
  .employee-history-table>tbody>tr>td:nth-child(3),
  .transactions-history-table>tbody>tr>td:nth-child(4) {grid-column:2!important;grid-row:1!important;font-size:16px!important;font-weight:700!important;}
  .employee-history-table>tbody>tr>td:nth-child(4),
  .transactions-history-table>tbody>tr>td:nth-child(6) {grid-column:2!important;justify-self:start!important;max-width:100%!important;}
  .employee-history-table>tbody>tr>td:nth-child(2),
  .transactions-history-table>tbody>tr>td:nth-child(2),
  .transactions-history-table>tbody>tr>td:nth-child(3),
  .transactions-history-table>tbody>tr>td:nth-child(5) {display:none!important;}
  .employee-history-table>tbody>tr>td:nth-child(5),
  .employee-history-table>tbody>tr>td:nth-child(6),
  .employee-history-table>tbody>tr>td:nth-child(7),
  .transactions-history-table>tbody>tr>td:nth-child(7),
  .transactions-history-table>tbody>tr>td:nth-child(8),
  .transactions-history-table>tbody>tr>td:nth-child(9),
  .transactions-history-table>tbody>tr>td:nth-child(10) {
    display:flex!important;flex-direction:row!important;justify-content:space-between!important;align-items:baseline!important;gap:12px!important;
  }
  .employee-history-table>tbody>tr>td:nth-child(5):before{content:'Quantity'!important;}
  .employee-history-table>tbody>tr>td:nth-child(6):before{content:'Recorded by'!important;}
  .employee-history-table>tbody>tr>td:nth-child(7):before{content:'Notes'!important;}
  .transactions-history-table>tbody>tr>td:nth-child(7):before{content:'Quantity'!important;}
  .transactions-history-table>tbody>tr>td:nth-child(8):before{content:'Employee'!important;}
  .transactions-history-table>tbody>tr>td:nth-child(9):before{content:'Recorded by'!important;}
  .transactions-history-table>tbody>tr>td:nth-child(10):before{content:'Notes'!important;}
  .employee-history-table>tbody>tr>td:nth-child(8),
  .transactions-history-table>tbody>tr>td:nth-child(11) {grid-column:1/-1!important;display:block!important;}
  .employee-history-table>tbody>tr>td:nth-child(8) button,
  .transactions-history-table>tbody>tr>td:nth-child(11) button{width:100%!important;}
  .employee-history-table .history-recorded-by-mobile{display:none!important;}
  .employee-history-table .history-recorded-by-desktop{display:flex!important;}
  .employee-history-table>tbody>tr>td.mobile-no-notes,
  .transactions-history-table>tbody>tr>td.mobile-no-notes{display:none!important;}
  .employee-history-table>tbody>tr>td:nth-child(3):before,
  .transactions-history-table>tbody>tr>td:nth-child(4):before{display:none!important;content:none!important;}
  .employee-history-table>tbody>tr>td:nth-child(6):before,
  .transactions-history-table>tbody>tr>td:nth-child(9):before{display:block!important;}
}

/* November 6: definitive phone-only history card layout (11/8 actual columns). */
@media screen and (max-width:720px) {
 .transactions-history-table>tbody>tr:not(:has(td[colspan])),
 .employee-history-table>tbody>tr:not(:first-child){
  display:grid!important;grid-template-columns:32px minmax(0,1fr)!important;
  grid-template-areas:none!important;gap:9px 12px!important;
  align-items:start!important;padding:14px!important;
 }
 .transactions-history-table>tbody>tr>td,
 .employee-history-table>tbody>tr>td{
  grid-area:auto!important;grid-column:1/-1!important;grid-row:auto!important;
  width:auto!important;min-width:0!important;max-width:none!important;
  overflow-wrap:normal!important;word-break:normal!important;
  text-align:left!important;justify-self:stretch!important;
  background:transparent!important;border-radius:0!important;padding:0!important;
 }
 .transactions-history-table>tbody>tr>td:nth-child(1),
 .employee-history-table>tbody>tr>td:nth-child(1){grid-column:1!important;grid-row:1!important;align-self:center!important;}
 .transactions-history-table>tbody>tr>td:nth-child(4),
 .employee-history-table>tbody>tr>td:nth-child(3){grid-column:2!important;grid-row:1!important;display:block!important;line-height:1.35!important;}
 .transactions-history-table>tbody>tr>td:nth-child(6),
 .employee-history-table>tbody>tr>td:nth-child(4){grid-column:2!important;grid-row:2!important;justify-self:start!important;display:inline-block!important;width:max-content!important;max-width:100%!important;background:#e8f1ff!important;color:#174c82!important;border-radius:999px!important;padding:5px 10px!important;font-size:12px!important;}
 .transactions-history-table>tbody>tr>td:nth-child(2),
 .transactions-history-table>tbody>tr>td:nth-child(3),
 .transactions-history-table>tbody>tr>td:nth-child(5),
 .employee-history-table>tbody>tr>td:nth-child(2){display:none!important;}
 .transactions-history-table>tbody>tr>td:nth-child(7),
 .transactions-history-table>tbody>tr>td:nth-child(8),
 .transactions-history-table>tbody>tr>td:nth-child(9),
 .transactions-history-table>tbody>tr>td:nth-child(10),
 .employee-history-table>tbody>tr>td:nth-child(5),
 .employee-history-table>tbody>tr>td:nth-child(6),
 .employee-history-table>tbody>tr>td:nth-child(7){
  display:flex!important;flex-direction:row!important;justify-content:space-between!important;
  align-items:baseline!important;gap:12px!important;white-space:normal!important;
  font-size:14px!important;font-weight:400!important;
 }
 .transactions-history-table>tbody>tr>td:nth-child(7):before{content:'Quantity'!important;}
 .transactions-history-table>tbody>tr>td:nth-child(8):before{content:'Employee'!important;}
 .transactions-history-table>tbody>tr>td:nth-child(9):before{content:'Recorded by'!important;}
 .transactions-history-table>tbody>tr>td:nth-child(10):before{content:'Notes'!important;}
 .employee-history-table>tbody>tr>td:nth-child(5):before{content:'Quantity'!important;}
 .employee-history-table>tbody>tr>td:nth-child(6):before{content:'Recorded by'!important;}
 .employee-history-table>tbody>tr>td:nth-child(7):before{content:'Notes'!important;}
 .transactions-history-table>tbody>tr>td:nth-child(7):before,
 .transactions-history-table>tbody>tr>td:nth-child(8):before,
 .transactions-history-table>tbody>tr>td:nth-child(9):before,
 .transactions-history-table>tbody>tr>td:nth-child(10):before,
 .employee-history-table>tbody>tr>td:nth-child(5):before,
 .employee-history-table>tbody>tr>td:nth-child(6):before,
 .employee-history-table>tbody>tr>td:nth-child(7):before{
  display:block!important;flex:0 0 auto!important;font-size:11px!important;font-weight:700!important;
  letter-spacing:.04em!important;text-transform:uppercase!important;color:#68798b!important;
  margin:0!important;text-align:left!important;
 }
 .transactions-history-table>tbody>tr>td:nth-child(11),
 .employee-history-table>tbody>tr>td:nth-child(8){grid-column:1/-1!important;display:block!important;}
 .transactions-history-table>tbody>tr>td:nth-child(11) button,
 .employee-history-table>tbody>tr>td:nth-child(8) button{width:100%!important;min-height:44px!important;}
 .employee-history-table .history-recorded-by-mobile{display:none!important;}
 .employee-history-table .history-recorded-by-desktop{display:flex!important;}
 .transactions-history-table>tbody>tr>td.mobile-no-notes,
 .employee-history-table>tbody>tr>td.mobile-no-notes{display:none!important;}
 .transactions-history-table>tbody>tr>td:nth-child(4):before,
 .employee-history-table>tbody>tr>td:nth-child(3):before{display:none!important;content:none!important;}
}


/* 2026-11-06: scoped mobile-only fix for actual 11-column Transactions
   and 8-column Employee History markup. No desktop selectors changed. */
@media screen and (max-width:720px){
 .transactions-history-wrap .transactions-history-table>tbody>tr:not(:has(td[colspan])),
 .employee-history-wrap .employee-history-table>tbody>tr:not(:first-child){
  display:grid!important;grid-template-columns:30px minmax(0,1fr)!important;
  grid-template-areas:none!important;gap:8px 12px!important;
  align-items:start!important;padding:15px!important;width:100%!important;
 }
 .transactions-history-wrap .transactions-history-table>tbody>tr>td,
 .employee-history-wrap .employee-history-table>tbody>tr>td{
  grid-area:auto!important;grid-row:auto!important;grid-column:1/-1!important;
  width:auto!important;min-width:0!important;max-width:none!important;
  padding:0!important;margin:0!important;border:0!important;
  white-space:normal!important;overflow-wrap:break-word!important;word-break:normal!important;
  background:transparent!important;text-align:left!important;justify-self:stretch!important;
  border-radius:0!important;
 }
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(1),
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(1){grid-column:1!important;grid-row:1!important;align-self:start!important;padding-top:4px!important;}
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(4),
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(3){grid-column:2!important;grid-row:1!important;display:block!important;font-size:16px!important;font-weight:700!important;line-height:1.35!important;}
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(6),
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(4){
  grid-column:2!important;grid-row:2!important;display:block!important;
  width:fit-content!important;max-width:100%!important;justify-self:start!important;
  padding:5px 10px!important;background:#e8f1ff!important;color:#174c82!important;
  border-radius:999px!important;font-size:12px!important;font-weight:700!important;
 }
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(2),
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(3),
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(5),
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(2){display:none!important;}
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(7){display:flex!important;}
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(7),
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(8),
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(9),
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(10),
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(5),
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(6),
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(7){
  display:flex!important;flex-direction:row!important;justify-content:space-between!important;
  align-items:baseline!important;gap:14px!important;font-size:14px!important;
  font-weight:400!important;text-align:right!important;
 }
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(7):before{content:'Quantity'!important;}
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(8):before{content:'Employee'!important;}
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(9):before{content:'Recorded by'!important;}
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(10):before{content:'Notes'!important;}
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(5):before{content:'Quantity'!important;}
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(6):before{content:'Recorded by'!important;}
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(7):before{content:'Notes'!important;}
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(n+7):nth-child(-n+10):before,
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(n+5):nth-child(-n+7):before{
  display:block!important;flex:0 0 auto!important;min-width:90px!important;
  margin:0!important;text-align:left!important;font-size:11px!important;
  font-weight:700!important;letter-spacing:.04em!important;text-transform:uppercase!important;color:#68798b!important;
 }
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(11),
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(8){display:block!important;grid-column:1/-1!important;}
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(11) button,
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(8) button{width:100%!important;min-height:44px!important;}
 .transactions-history-wrap .transactions-history-table .mobile-item-name{display:block!important;}
 .transactions-history-wrap .transactions-history-table .desktop-item-name{display:none!important;}
 .transactions-history-wrap .transactions-history-table .mobile-timestamp,
 .employee-history-wrap .employee-history-table .mobile-timestamp{display:block!important;margin-top:4px!important;font-size:12px!important;font-weight:400!important;color:#68798b!important;}
 .transactions-history-wrap .transactions-history-table .mobile-only-qty .desktop-tx-qty{display:none!important;}
 .transactions-history-wrap .transactions-history-table .mobile-only-qty .mobile-tx-summary{display:inline!important;}
 .transactions-history-wrap .transactions-history-table>tbody>tr>td.mobile-empty-employee,
 .transactions-history-wrap .transactions-history-table>tbody>tr>td.mobile-no-notes,
 .employee-history-wrap .employee-history-table>tbody>tr>td.mobile-no-notes{display:none!important;}
 .employee-history-wrap .employee-history-table .history-recorded-by-mobile{display:none!important;}
 .employee-history-wrap .employee-history-table .history-recorded-by-desktop{display:flex!important;}
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(4):before,
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(3):before{content:none!important;display:none!important;}
}


/* Mobile only: transaction-type badge at the upper-right of each card. */
@media screen and (max-width:720px){
 .transactions-history-wrap .transactions-history-table>tbody>tr:not(:has(td[colspan])),
 .employee-history-wrap .employee-history-table>tbody>tr:not(:first-child){
  grid-template-columns:30px minmax(0,1fr) auto!important;
  column-gap:12px!important;
 }
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(4),
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(3){
  grid-column:2!important;grid-row:1!important;min-width:0!important;
 }
 .transactions-history-wrap .transactions-history-table>tbody>tr>td:nth-child(6),
 .employee-history-wrap .employee-history-table>tbody>tr>td:nth-child(4){
  grid-column:3!important;grid-row:1!important;align-self:start!important;
  justify-self:end!important;width:max-content!important;max-width:125px!important;
  text-align:center!important;white-space:normal!important;overflow-wrap:normal!important;
  margin:0!important;
 }
}