/* v4.57 — universal mobile layout hardening */
@media(max-width:680px){
  html,body{max-width:100%;overflow-x:hidden}
  .wrap,section,.card,.row,.fields,.grid,.grid3,.split,.tablewrap,label{min-width:0;max-width:100%}
  section>h2,section>.row.between:first-child h2{font-size:21px;line-height:1.35;word-break:normal;overflow-wrap:break-word}
  section>.row.between:first-child{display:grid;grid-template-columns:minmax(0,1fr);align-items:stretch;gap:12px;width:100%}
  section>.row.between:first-child>div:first-child{width:100%;min-width:0;max-width:100%;display:block}
  section>.row.between:first-child>.row{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:8px;align-items:stretch}
  section>.row.between:first-child>.row>.btn{width:100%;min-width:0;white-space:normal;line-height:1.45;padding-inline:10px}
  section>.row.between:first-child>.btn{width:100%;min-width:0;white-space:normal}
  .card>.row.between:has(h3),.card>.row.between:has(>div>h3){align-items:flex-start;gap:10px}
  .card>.row.between:has(h3)>div:first-child,.card>.row.between:has(>div>h3)>div:first-child{min-width:0;flex:1 1 190px}
  .fields>*{grid-column:auto!important;min-width:0}
  .row>input,.row>select,.row>textarea,.row>label,.row>.smart-select,.row>.orderItemPicker{min-width:0;max-width:100%}
  input,select,textarea{max-width:100%}
  h1,h2,h3,h4,p,.muted,.notice,label{word-break:normal;overflow-wrap:break-word}
  .tablewrap{width:100%;overflow-x:auto;overscroll-behavior-inline:contain}
  .orderInlineDetailCard .row.between:first-child{display:grid;grid-template-columns:1fr;align-items:start}
  .orderInlineDetailCard .row.between:first-child>span.row{width:100%;justify-content:flex-start}
}
@media(max-width:460px){
  header{padding-inline:9px;gap:7px}
  .brand{gap:7px}.brandText b{font-size:13.5px}.navToggle{width:40px;height:40px}.storeSwitch select{min-width:104px;max-width:122px}
  .wrap{padding-inline:9px}
  section>.row.between:first-child>.row{grid-template-columns:1fr 1fr}
  section>.row.between:first-child>.row>.btn:only-child{grid-column:1/-1}
  .card>.row.between:has(h3),.card>.row.between:has(>div>h3){display:grid;grid-template-columns:1fr}
  .card>.row.between:has(h3)>.btn,.card>.row.between:has(>div>h3)>.btn{width:100%}
  .barcodeInputRow{grid-template-columns:minmax(0,1fr) 98px}.cameraInlineBtn{font-size:12px;padding-inline:7px}
  .orderInlineDetailCard .row,.orderInlineDetailCard .row.between{min-width:0}
}
@media(max-width:350px){
  section>.row.between:first-child>.row{grid-template-columns:1fr}
  .barcodeInputRow{grid-template-columns:1fr}.barcodeInputRow .cameraInlineBtn{width:100%}
}


/* v4.58 — Mobile UI System: app-style cards, zero page-level horizontal scroll */
:root{--mobile-card-gap:10px;--mobile-key:#667085;--mobile-surface:#ffffff;--mobile-line:#e6ebf2}
.mobileOnly{display:none!important}
@media(max-width:760px){
  html,body{width:100%;max-width:100%;overflow-x:hidden!important}
  body{background:#f3f6fa;-webkit-text-size-adjust:100%}
  header{min-width:0}
  .wrap{width:100%;max-width:100%;overflow:visible;padding-bottom:38px}
  section.active{width:100%;max-width:100%;overflow:visible}
  .card{width:100%;max-width:100%;overflow-wrap:anywhere}
  .mobileOnly{display:initial!important}.desktopOnly{display:none!important}

  /* App-like page headers and action bars */
  section>.row.between:first-child{background:transparent;padding:0;margin-bottom:14px}
  section>.row.between:first-child h2{font-size:22px;line-height:1.35;margin:0}
  section>.row.between:first-child .muted{font-size:12.5px;line-height:1.7;margin-top:4px}
  section>.row.between:first-child>.row,.mobileActionGrid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%}
  section>.row.between:first-child>.row>.btn,.mobileActionGrid>.btn{width:100%;min-width:0;white-space:normal}
  .storeBanner{position:relative;padding:11px 13px;border-radius:14px;margin-bottom:14px}

  /* Forms behave as native mobile screens */
  .fields,.grid,.grid3,.split{grid-template-columns:1fr!important;gap:10px}
  .fields>*{grid-column:auto!important}
  .row.mobileStack,.mobileStack{display:grid!important;grid-template-columns:1fr!important;gap:9px;width:100%}
  label{width:100%;max-width:100%;font-size:12.5px}
  input,select,textarea{width:100%;max-width:100%;min-width:0;min-height:48px;font-size:16px}
  textarea{min-height:100px}
  .btn{touch-action:manipulation}
  .card .row>.btn:only-child{max-width:100%}
  .notice{line-height:1.75;overflow-wrap:anywhere}
  .money{max-width:100%;overflow-wrap:anywhere}

  /* Universal mobile table -> card system. No sideways scrolling. */
  .tablewrap{overflow:visible!important;width:100%;max-width:100%;margin:0!important;background:transparent;border:0;box-shadow:none;border-radius:0}
  .tablewrap>table.mobileCardTable{display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;border-collapse:separate;border-spacing:0;background:transparent}
  .mobileCardTable>thead{display:none!important}
  .mobileCardTable>tbody{display:grid!important;grid-template-columns:minmax(0,1fr);gap:var(--mobile-card-gap);width:100%}
  .mobileCardTable>tbody>tr{display:block!important;width:100%;max-width:100%;margin:0;background:var(--mobile-surface);border:1px solid var(--border);border-radius:15px;box-shadow:0 4px 14px rgba(15,39,71,.055);overflow:hidden}
  .mobileCardTable>tbody>tr:hover{background:#fff}
  .mobileCardTable>tbody>tr>td{display:grid!important;grid-template-columns:minmax(94px,34%) minmax(0,1fr);align-items:start;gap:10px;width:100%!important;max-width:100%!important;min-width:0!important;padding:10px 12px!important;border:0!important;border-bottom:1px solid var(--mobile-line)!important;text-align:right!important;white-space:normal!important;overflow-wrap:anywhere;word-break:normal;background:transparent!important}
  .mobileCardTable>tbody>tr>td:last-child{border-bottom:0!important}
  .mobileCardTable>tbody>tr>td::before{content:attr(data-mobile-label);display:block;color:var(--mobile-key);font-size:11.5px;font-weight:800;line-height:1.5;min-width:0}
  .mobileCardTable>tbody>tr>td[data-mobile-label=""]{grid-template-columns:1fr}
  .mobileCardTable>tbody>tr>td[data-mobile-label=""]::before{display:none}
  .mobileCardTable>tbody>tr>td[colspan]{display:block!important;padding:12px!important}
  .mobileCardTable>tbody>tr>td[colspan]::before{display:none!important}
  .mobileCardTable td>b,.mobileCardTable td>strong{overflow-wrap:anywhere}
  .mobileCardTable td .status{max-width:100%;white-space:normal;text-align:center;justify-content:center}
  .mobileCardTable td .btn{max-width:100%;white-space:normal}
  .mobileCardTable td[data-mobile-action="1"]{display:block!important;padding:10px 12px!important}
  .mobileCardTable td[data-mobile-action="1"]::before{display:none!important}
  .mobileCardTable td[data-mobile-action="1"] .btn{width:100%;min-height:44px;margin:2px 0}

  /* Orders: list row + inline detail are one continuous mobile card flow */
  #orders .mobileCardTable>tbody>tr.orderListRow{border-right:4px solid #cfe0ff}
  #orders .mobileCardTable>tbody>tr.orderListRow.orderOpen{border-right-color:#2563eb;border-bottom-left-radius:8px;border-bottom-right-radius:8px}
  #orders .mobileCardTable>tbody>tr.orderInlineDetailRow{border:0!important;box-shadow:none!important;background:transparent!important;border-radius:0!important;margin-top:-7px}
  #orders .mobileCardTable>tbody>tr.orderInlineDetailRow>td{display:block!important;padding:0!important;border:0!important;background:transparent!important}
  .orderInlineDetailCard{margin:0 0 7px!important;padding:13px!important;border-radius:15px!important;box-shadow:0 5px 18px rgba(15,39,71,.08)!important;overflow:hidden}
  .orderDetailHead{display:grid!important;grid-template-columns:1fr;gap:9px!important;margin-bottom:8px}
  .orderDetailHead h3{margin:0;font-size:18px;direction:ltr;text-align:right;overflow-wrap:anywhere}
  .orderDetailHead .orderDetailBadges{display:flex;flex-wrap:wrap;gap:6px;width:100%}
  .orderDetailHead .orderDetailBadges .btn{margin-inline-start:auto}
  .orderDetailAddress{padding:11px 12px;background:#f8fafc;border:1px solid #e5eaf1;border-radius:12px;line-height:1.8;margin:8px 0;overflow-wrap:anywhere}
  .orderDetailSectionTitle{margin:15px 0 8px;font-size:15px;color:#344054}
  .orderDetailList{display:grid;gap:8px}
  .orderDetailItem{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:start;padding:11px 12px;border:1px solid #e7ecf3;border-radius:12px;background:#fbfcfe;min-width:0}
  .orderDetailItemMain{min-width:0;overflow-wrap:anywhere;line-height:1.65}
  .orderDetailItemMain small{display:block;margin-top:3px;color:#667085;overflow-wrap:anywhere}
  .orderDetailItemValue{font-weight:900;white-space:nowrap;text-align:left;direction:ltr;unicode-bidi:isolate;padding-top:1px}
  .orderDetailActions{display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important;width:100%;margin-top:12px!important}
  .orderDetailActions .btn{width:100%;margin:0!important;white-space:normal}
  .orderDetailTimeline{display:grid;gap:7px}
  .orderDetailTimelineItem{padding:9px 10px;border-right:3px solid #dbe7f7;background:#f8fafc;border-radius:9px;line-height:1.65}
  .orderDetailTimelineItem .muted{display:block;margin-bottom:2px}

  /* Long div rows also stack cleanly instead of forcing width */
  .row.between{max-width:100%}
  .row.between>span,.row.between>div,.row.between>b{min-width:0;overflow-wrap:anywhere}
  .courierCompanyAdminActions{display:grid!important;grid-template-columns:1fr;gap:8px}
  .courierPolicyToggle{width:100%;min-width:0}
  .receiveLockedGrid{grid-template-columns:1fr!important}
  .scanActionForm,.exchangeSearchRow,.exchangeCandidate{grid-template-columns:1fr!important}
  .appConfirmCard{width:min(94vw,480px);max-height:86vh;overflow:auto}
  .appConfirmActions{display:grid!important;grid-template-columns:1fr 1fr;gap:8px}

  /* Protect every common content type from pushing the viewport sideways */
  pre,code,.scanbox,.lockedField,.status,.orderItemResultName,.pickOrderNo{max-width:100%;overflow-wrap:anywhere;word-break:break-word}
  img,svg,canvas,video{max-width:100%;height:auto}
}
@media(max-width:430px){
  section>.row.between:first-child>.row,.mobileActionGrid,.orderDetailActions,.appConfirmActions{grid-template-columns:1fr!important}
  .mobileCardTable>tbody>tr>td{grid-template-columns:minmax(82px,32%) minmax(0,1fr);padding:9px 10px!important;gap:8px}
  .orderDetailItem{grid-template-columns:1fr;gap:5px}
  .orderDetailItemValue{text-align:right}
  .orderDetailHead .orderDetailBadges .btn{margin-inline-start:0;width:100%}
}



/* v4.59 — typography hardening + searchable Iraq location picker */
.geoField{position:relative;display:grid;align-content:start;gap:6px}
.geoNativeControl{position:absolute!important;width:1px!important;height:1px!important;min-height:1px!important;opacity:0!important;pointer-events:none!important;overflow:hidden!important;padding:0!important;border:0!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important}
.geoPickerTrigger{width:100%;min-height:52px;border:1px solid #cfd8e6;border-radius:14px;background:#fff;padding:9px 13px;display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:right;color:#101828;font:inherit;cursor:pointer;box-shadow:0 1px 2px rgba(16,24,40,.03)}
.geoPickerTrigger:hover{border-color:#9db6da;background:#fbfdff}.geoPickerTrigger:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 4px rgba(37,99,235,.10)}.geoPickerTrigger:disabled{opacity:.58;cursor:not-allowed;background:#f8fafc}
.geoPickerTriggerText{min-width:0;display:grid;gap:2px}.geoPickerTriggerText b{font-size:14px;line-height:1.45;overflow-wrap:anywhere}.geoPickerTriggerText small{font-size:11.5px;color:#667085;line-height:1.5;overflow-wrap:anywhere}.geoPickerChevron{flex:0 0 auto;color:#667085;font-size:18px}
.geoPickerOverlay{position:fixed;z-index:430;inset:0;background:rgba(15,23,42,.56);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;padding:16px}.geoPickerOverlay.hidden{display:none!important}
.geoPickerSheet{width:min(680px,96vw);max-height:min(760px,88vh);background:#fff;border-radius:22px;box-shadow:0 28px 80px rgba(15,23,42,.30);display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;overflow:hidden;border:1px solid rgba(148,163,184,.25)}
.geoPickerHandle{display:none}.geoPickerHeader{padding:15px 16px 12px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #edf1f6}.geoPickerHeading{min-width:0;display:grid;gap:3px}.geoPickerHeading b{font-size:18px;line-height:1.35}.geoPickerHeading small{color:#667085;font-size:12px;line-height:1.5}.geoPickerClose{width:42px;height:42px;flex:0 0 42px;border:0;border-radius:12px;background:#f2f4f7;color:#101828;font-size:29px;line-height:1;cursor:pointer}
.geoPickerSearchWrap{margin:12px 14px 8px;position:relative;z-index:2;background:#fff}.geoPickerSearchWrap input{width:100%;min-height:50px;padding-right:44px!important;border-radius:14px;font-size:16px;background:#fbfcfe}.geoPickerSearchIcon{position:absolute;right:15px;top:50%;transform:translateY(-50%);font-size:22px;color:#667085;pointer-events:none}
.geoPickerResults{overflow:auto;padding:6px 12px 12px;display:grid;gap:7px;overscroll-behavior:contain;min-height:0;position:relative;z-index:1;scroll-padding-top:8px}.geoPickerItem{width:100%;border:1px solid #e7ecf3;background:#fff;border-radius:14px;padding:12px 13px;display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:right;font:inherit;color:#101828;cursor:pointer}.geoPickerItem:hover,.geoPickerItem.selected{background:#eff6ff;border-color:#b9d2f8}.geoPickerItemText{min-width:0;display:grid;gap:3px}.geoPickerItemText b{font-size:15px;line-height:1.5;overflow-wrap:anywhere}.geoPickerItemText small{font-size:12px;color:#667085;line-height:1.5;overflow-wrap:anywhere}.geoPickerBadge{flex:0 0 auto;max-width:42%;padding:4px 8px;border-radius:999px;background:#f2f4f7;color:#475467;font-size:11px;font-weight:800;white-space:normal;text-align:center}.geoPickerItem.selected .geoPickerBadge{background:#dbeafe;color:#1d4ed8}.geoPickerEmpty{padding:28px 12px;text-align:center;color:#667085;line-height:1.8}.geoPickerFooter{padding:10px 14px 14px;border-top:1px solid #edf1f6;background:#fbfcfe;display:grid;gap:7px}.geoPickerFooter .btn{width:100%}.geoPickerSourceNote{font-size:10.5px;line-height:1.55;color:#667085;text-align:center}

@media(max-width:760px){
  /* Prevent text collisions across app-style mobile layouts */
  body{line-height:1.55}
  h1,h2,h3,h4,h5,h6,p,small,label,b,strong,span,div{word-break:normal;overflow-wrap:anywhere}
  .row,.between,.card,.fields,.grid,.grid3,.split,.orderItemPickerMain,.pickOrderPickerMain{min-width:0}
  .row.between{gap:10px;align-items:flex-start}
  .status{white-space:normal!important;line-height:1.45!important;min-height:28px;height:auto!important;max-width:100%;text-align:center}
  .muted,.small{line-height:1.65}
  .btn{white-space:normal!important;line-height:1.45;height:auto;min-height:44px;overflow-wrap:anywhere}
  label{line-height:1.55}
  /* Product/search picker results become stacked cards: title/meta never share a row with stock/price. */
  .orderItemResult{grid-template-columns:minmax(0,1fr)!important;gap:8px!important;align-items:start!important;padding:13px!important}
  .orderItemResult>span:first-child{display:block;min-width:0;width:100%}
  .orderItemResultName{display:block!important;white-space:normal!important;font-size:15px!important;line-height:1.6!important;margin:0 0 3px}
  .orderItemResultSub{display:block!important;white-space:normal!important;line-height:1.6!important;overflow-wrap:anywhere!important;color:#667085}
  .orderItemResultSide{width:100%;display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;text-align:right!important;white-space:normal!important;border-top:1px dashed #e5eaf1;padding-top:8px}
  .orderItemStock,.orderItemPrice{font-size:12px!important;line-height:1.4!important;white-space:nowrap!important}
  .pickOrderResult{grid-template-columns:minmax(0,1fr)!important;gap:8px!important}.pickOrderResultSide{width:100%;display:flex!important;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px;white-space:normal!important;border-top:1px dashed #e5eaf1;padding-top:7px}
  .exchangeCandidate{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}.exchangeCandidate .meta{min-width:0;line-height:1.7;overflow-wrap:anywhere}.exchangeCandidate .btn{width:100%}
  .orderDetailBadges{align-items:stretch}.orderDetailBadges>*{max-width:100%}
  /* mobile location picker acts like a native app bottom sheet */
  .geoPickerOverlay{align-items:flex-end;padding:0}.geoPickerSheet{width:100%;max-height:88dvh;border-radius:24px 24px 0 0;border-bottom:0;grid-template-rows:auto auto auto minmax(0,1fr) auto}.geoPickerHandle{display:block;width:46px;height:5px;border-radius:999px;background:#cbd5e1;margin:9px auto 0}.geoPickerHeader{padding-top:10px}.geoPickerResults{padding-bottom:16px}.geoPickerItem{min-height:66px}.geoPickerItemText b{font-size:16px}.geoPickerBadge{max-width:38%}
}
@media(max-width:430px){
  .geoPickerHeader{padding-inline:12px}.geoPickerSearchWrap{margin-inline:10px}.geoPickerResults{padding-inline:9px}.geoPickerFooter{padding-inline:10px}.geoPickerItem{padding:11px 10px;gap:8px}.geoPickerBadge{font-size:10.5px;max-width:40%}
}


/* v4.61 — robust mobile location picker: header/search/results never overlap. */
@media (max-width:760px){
  .geoPickerSheet{display:flex!important;flex-direction:column!important;width:100%!important;height:min(88dvh,820px)!important;max-height:88dvh!important;overflow:hidden!important;border-radius:24px 24px 0 0!important}
  .geoPickerHandle,.geoPickerHeader,.geoPickerSearchWrap,.geoPickerFooter{flex:0 0 auto!important;position:relative!important;inset:auto!important}
  .geoPickerSearchWrap{z-index:3!important;margin:8px 10px 8px!important;background:#fff!important;padding:0!important}
  .geoPickerResults{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;position:relative!important;z-index:1!important;padding:8px 9px 18px!important;margin:0!important;scroll-padding-top:8px!important}
  .geoPickerResults>.geoPickerItem:first-child{margin-top:0!important}
  .geoPickerFooter{z-index:2!important;background:#fff!important;padding:10px!important}
  .geoPickerHeading{min-width:0!important}
  .geoPickerHeading b,.geoPickerHeading small{overflow-wrap:anywhere!important;word-break:normal!important}
}
/* v4.66 — Customer Service Accounts */
#customer_service_accounts{--section-color:#0f766e}
.tabs button[data-tab="customer_service_accounts"]:before{background:#2dd4bf}
.csPeriodCard{margin-bottom:12px;display:grid;gap:12px}
.csCustomPeriod{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:end;padding-top:4px}.csCustomPeriod.hidden{display:none!important}
.csHeroGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0}.csHero{min-height:112px;display:flex;flex-direction:column;justify-content:space-between;border-right:4px solid #64748b}.csHero span{color:#667085;font-weight:800}.csHero b{font-size:27px;line-height:1.2}.csHero.blue{border-right-color:#3b82f6}.csHero.red{border-right-color:#ef4444}.csHero.purple{border-right-color:#8b5cf6}.csHero.green{border-right-color:#22c55e}.csHero.orange{border-right-color:#f59e0b}
.csPolicyCard{margin-top:12px;display:grid;gap:12px;background:linear-gradient(180deg,#ffffff,#fbfffe)}.csPolicyGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.csPolicyOption{position:relative;display:flex!important;align-items:center;justify-content:space-between;gap:14px;padding:14px;border:1px solid #dce5e3;border-radius:15px;background:#fff;cursor:pointer;min-width:0}.csPolicyOption>span{display:grid;gap:4px;min-width:0}.csPolicyOption small{color:#667085;line-height:1.55}.csPolicyOption input{position:absolute;opacity:0;pointer-events:none}.csPolicyOption i{width:48px;height:28px;border-radius:999px;background:#cbd5e1;position:relative;flex:0 0 auto;transition:.2s}.csPolicyOption i:after{content:"";position:absolute;width:22px;height:22px;top:3px;right:3px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(15,23,42,.22);transition:.2s}.csPolicyOption input:checked+i{background:#0f766e}.csPolicyOption input:checked+i:after{transform:translateX(-20px)}.csRuleNote{background:#f0fdfa;border-color:#ccfbf1;color:#134e4a}
.csEmployeeGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:10px}.csEmployeeCard{display:grid;gap:12px;position:relative;overflow:hidden}.csEmployeeCard:before{content:"";position:absolute;top:0;right:0;width:5px;height:100%;background:linear-gradient(#14b8a6,#0f766e)}.csEmployeeHead{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.csEmployeeName{font-size:18px;font-weight:900}.csEmployeeMeta{color:#667085;font-size:12px;margin-top:3px}.csRateBadge{padding:5px 9px;border-radius:999px;background:#ecfeff;color:#155e75;font-weight:900;white-space:nowrap}.csStats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.csStat{padding:9px;background:#f8fafc;border:1px solid #eef2f6;border-radius:11px;display:grid;gap:2px}.csStat span{font-size:11px;color:#667085}.csStat b{font-size:17px}.csMoneyGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.csMoney{padding:10px;border-radius:12px;background:#f8fafc}.csMoney span{display:block;color:#667085;font-size:11px}.csMoney b{display:block;margin-top:3px;font-size:17px}.csMoney.net{background:#ecfdf3}.csMoney.deduct{background:#fff7ed}.csMoney.balance{background:#eff6ff}.csEmployeeFoot{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}.csQuality{display:flex;gap:6px;flex-wrap:wrap}.csQuality span{padding:4px 7px;border-radius:999px;background:#f2f4f7;font-size:11px;color:#475467}
.csAdminTools{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}.csDetailPositive{color:#15803d;font-weight:900}.csDetailNegative{color:#b91c1c;font-weight:900}.csDetailZero{color:#667085}.csHistoryEvent{display:block;font-size:11px;line-height:1.55;margin-top:2px}.csPolicyReadOnly #csPolicyAdminFields,.csPolicyReadOnly #csSavePolicy{display:none!important}.csPolicyReadOnly .csPolicyOption{cursor:default}.csPolicyReadOnly .csPolicyOption input{pointer-events:none}
@media(max-width:900px){.csHeroGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.csEmployeeGrid,.csAdminTools{grid-template-columns:1fr}.csStats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.csCustomPeriod{grid-template-columns:1fr}.csHeroGrid{grid-template-columns:1fr 1fr}.csHero{min-height:96px;padding:13px}.csHero b{font-size:23px}.csPolicyGrid{grid-template-columns:1fr}.csEmployeeGrid{grid-template-columns:1fr}.csStats{grid-template-columns:1fr 1fr}.csMoneyGrid{grid-template-columns:1fr}.csEmployeeHead{align-items:center}.csPolicyOption{align-items:flex-start}.csPolicyOption i{margin-top:2px}}
@media(max-width:380px){.csHeroGrid{grid-template-columns:1fr}.csStats{grid-template-columns:1fr}}


/* v4.66 — CS historical start, partial settlements, mobile-first search */
.csSevenPeriods{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}.csHero.teal{border-right-color:#14b8a6}.csEmployeeToolbar{display:grid;gap:10px}.csEmployeeToolbar label{max-width:520px}.csPaySnapshot{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.csPaySnapshot>div{padding:11px;border:1px solid #e2e8f0;border-radius:12px;background:#f8fafc}.csPaySnapshot span{display:block;color:#667085;font-size:11px}.csPaySnapshot b{display:block;font-size:18px;margin-top:3px}.csStartBadge{display:inline-flex;padding:4px 7px;border-radius:999px;background:#f1f5f9;color:#475569;font-size:11px;font-weight:800}.csRemainingStrong{color:#b45309}.csSettledStrong{color:#047857}.csEmployeeCard.hiddenBySearch{display:none!important}
@media(max-width:1000px){.csSevenPeriods{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){.csSevenPeriods{grid-template-columns:repeat(2,minmax(0,1fr))}.csSevenPeriods button:last-child{grid-column:1/-1}.csPaySnapshot{grid-template-columns:1fr 1fr}.csPaySnapshot>div:first-child{grid-column:1/-1}}
@media(max-width:430px){.csPaySnapshot{grid-template-columns:1fr}.csPaySnapshot>div:first-child{grid-column:auto}}

/* v4.108 — mobile bottom-sheet hardening + predictable browser Back navigation UI. */
@media(max-width:760px){
  body.orderPickerOpen,body.pickOrderPickerOpen,body.geoPickerOpen{overflow:hidden!important;overscroll-behavior:none}
  .orderItemPicker.open .orderItemPickerPanel,.pickOrderPicker.open .pickOrderPickerPanel{
    display:flex!important;flex-direction:column!important;
    width:100%!important;max-width:100%!important;
    height:min(78dvh,640px);max-height:calc(100dvh - 10px)!important;
    overflow:hidden!important;
  }
  .pickOrderPicker.open .pickOrderPickerPanel{height:min(80dvh,680px)}
  .orderItemPickerHead,.pickOrderPickerHead{
    flex:0 0 auto!important;
    grid-template-columns:minmax(0,1fr) minmax(72px,auto)!important;
    align-items:center!important;gap:8px!important;
  }
  .orderItemPickerClose,.pickOrderPickerClose{
    display:inline-flex!important;align-items:center!important;justify-content:center!important;
    width:auto!important;min-width:72px!important;max-width:none!important;height:46px!important;min-height:46px!important;
    padding:0 12px!important;white-space:nowrap!important;word-break:keep-all!important;overflow-wrap:normal!important;
    flex:0 0 auto!important;font-size:13px!important;line-height:1!important;
  }
  .orderItemResults,.pickOrderResults{
    flex:1 1 auto!important;min-height:0!important;max-height:none!important;
    overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch;
  }
  .orderItemSearchHint,.pickOrderSearchHint{flex:0 0 auto!important}
}
@media(max-width:420px){
  .orderItemPickerHead,.pickOrderPickerHead{grid-template-columns:minmax(0,1fr) 68px!important;padding-inline:9px!important}
  .orderItemPickerClose,.pickOrderPickerClose{min-width:68px!important;padding-inline:8px!important;font-size:12.5px!important}
}
