.di-page{max-width:1100px;margin:0 auto;padding:12px 0 28px;font-size:14px}.di-head h2{font-size:22px;margin:0}.di-head p{color:#64748b}.di-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:18px;margin:15px 0}.di-card h3{font-size:18px;margin:0 0 15px}.di-fields,.di-filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:12px 0}.di-page label{display:flex;flex-direction:column;gap:5px;font-weight:600}.di-page input{width:100%;box-sizing:border-box;padding:10px;border:1px solid #cbd5e1;border-radius:7px;font-size:14px}.di-page button{background:#163a60;color:white;border:0;border-radius:7px;padding:10px 14px;cursor:pointer;font-size:14px}.di-page button:disabled{opacity:.5}.di-actions{display:flex;gap:8px}.di-stats{padding:12px;background:#f1f5f9;border-radius:8px;margin:12px 0;font-weight:700}.di-table-wrap{overflow-x:auto}.di-table-wrap table{width:100%;border-collapse:collapse;min-width:620px}.di-table-wrap th,.di-table-wrap td{text-align:center;padding:10px 6px;border-bottom:1px solid #e2e8f0;font-size:13px}.di-page [role=status]{color:#475569;line-height:1.5}.di-page .hidden{display:none!important}@media(max-width:600px){.di-card{padding:12px}.di-fields,.di-filters{grid-template-columns:1fr 1fr}.di-head h2{font-size:22px}}
.di-ocr-meta{display:grid;gap:7px;margin:10px 0 14px;overflow-wrap:anywhere;font-size:13px}.di-ocr-ready{color:#087545!important;font-weight:700}.di-ocr-guide{font-size:12px;color:#64748b;line-height:1.6}.di-ocr-guide a{color:#165ea8}

.di-ocr-progress{display:flex;align-items:center;gap:10px;margin:12px 0;color:#163a60;font-size:14px;font-weight:600}.di-ocr-spinner{width:17px;height:17px;border:3px solid #dbeafe;border-top-color:#163a60;border-radius:50%;animation:di-spin .8s linear infinite}@keyframes di-spin{to{transform:rotate(360deg)}}

.di-page button.di-delete-button{background:#b42332;color:#fff}.di-page button.di-delete-button:disabled{background:#aeb5bf}.di-page .di-record-check,.di-page #diSelectAll{width:16px;height:16px;cursor:pointer}.di-actions{flex-wrap:wrap}

/* APP 1.1.57: admin filters on one desktop row; responsive wrapping on mobile. */
.di-query-toolbar{display:grid;grid-template-columns:minmax(90px,1fr) minmax(105px,1.15fr) minmax(125px,1.3fr) minmax(125px,1.3fr) auto auto auto auto;gap:8px;align-items:end;margin:12px 0 14px}
.di-query-toolbar>.di-toolbar-field{min-width:0;margin:0;font-size:12px;white-space:nowrap}
.di-query-toolbar>.di-toolbar-field input{min-width:0;width:100%;padding:9px 7px;height:38px}
.di-toolbar-action{min-width:0}
.di-toolbar-action button{white-space:nowrap;min-height:38px;padding:9px 10px;font-size:12px}
.di-table-wrap table{table-layout:fixed;min-width:730px}
.di-table-wrap th.di-col-branch,.di-table-wrap th.di-col-count{width:9%}
.di-table-wrap th.di-col-select{width:7%;white-space:nowrap}
.di-table-wrap td:nth-child(2),.di-table-wrap td:nth-child(4){white-space:nowrap}
.di-table-wrap td:nth-child(8){padding-left:3px;padding-right:3px}
.di-col-select input{vertical-align:middle;margin-left:4px}
@media(max-width:1100px){.di-query-toolbar{grid-template-columns:repeat(4,minmax(0,1fr))}.di-toolbar-action button{width:100%}}
@media(max-width:600px){.di-query-toolbar{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.di-toolbar-action button{width:100%;font-size:13px}.di-table-wrap{overflow-x:auto}}

/* APP 1.1.59: rider-specific six-control toolbar, one desktop row. */
.di-page:has(#diRiderUpload:not(.hidden)) .di-query-toolbar{grid-template-columns:minmax(115px,1.1fr) minmax(135px,1.3fr) minmax(135px,1.3fr) auto auto auto}
.di-page #diRiderBranchDisplay[readonly]{background:#f1f5f9;color:#475569;cursor:default}
@media(max-width:1100px){.di-page:has(#diRiderUpload:not(.hidden)) .di-query-toolbar{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.di-page:has(#diRiderUpload:not(.hidden)) .di-query-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Rider 1.1.60: mobile-first personal record cards; admin table unchanged. */
.di-page select{width:100%;box-sizing:border-box;padding:9px;border:1px solid #cbd5e1;border-radius:7px;font-size:14px;min-height:38px;background:#fff}
.di-rider-cards{display:none;gap:10px;margin:12px 0}
.di-rider-record{background:#fff;border:1px solid #dbe3ec;border-radius:12px;padding:14px;min-width:0}
.di-rider-record-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}
.di-rider-record-head a{color:#165ea8;font-weight:600;white-space:nowrap}
.di-rider-record-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.di-rider-record-values>div{display:flex;flex-direction:column;gap:5px;min-width:0}
.di-rider-record-values span{font-size:12px;color:#64748b}
.di-rider-record-values strong{font-size:15px;overflow-wrap:anywhere}
.di-rider-table table{min-width:540px}
.di-rider-table th,.di-rider-table td{width:20%;white-space:nowrap}
.di-page:has(#diRiderUpload:not(.hidden)) .di-query-toolbar>.di-toolbar-field:not(.hidden){text-align:center}
.di-page:has(#diRiderUpload:not(.hidden)) .di-query-toolbar>.di-toolbar-action{text-align:center}
@media(max-width:768px){
 .di-rider-cards:not(.hidden){display:grid}
 .di-rider-table{display:none}
 .di-page:has(#diRiderUpload:not(.hidden)) .di-query-toolbar{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .di-page:has(#diRiderUpload:not(.hidden)) #diRiderBranchDisplayWrap{grid-column:1/-1}
 .di-page:has(#diRiderUpload:not(.hidden)) .di-toolbar-action button{width:100%;min-height:44px}
 .di-page:has(#diRiderUpload:not(.hidden)) .di-card{padding:12px}
}
@media(max-width:370px){.di-rider-record-values strong{font-size:13px}}


/* Rider performance layout v1.0.5 */
@media(min-width:769px){
.di-page:has(#diRiderUpload:not(.hidden)) .di-fields{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;justify-content:center}
.di-page:has(#diRiderUpload:not(.hidden)) .di-fields>label{min-width:0;text-align:center}
.di-page:has(#diRiderUpload:not(.hidden)) .di-fields>label input{width:100%;min-width:0;height:38px;text-align:center;text-align-last:center}
.di-page:has(#diRiderUpload:not(.hidden)) .di-query-toolbar{grid-template-columns:minmax(130px,1.15fr) minmax(145px,1.25fr) minmax(145px,1.25fr) repeat(3,auto);gap:8px;align-items:end}
.di-page:has(#diRiderUpload:not(.hidden)) .di-query-toolbar>.di-toolbar-action button{width:auto;min-height:38px}
}


/* Rider performance v1.0.6: fit six fields and all search controls inside PC viewport. */
@media (min-width:769px){
  .di-page:has(#diRiderUpload:not(.hidden)) #diRiderUpload .di-fields{
    display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;width:100%;min-width:0;
  }
  .di-page:has(#diRiderUpload:not(.hidden)) #diRiderUpload .di-fields>label{
    min-width:0;max-width:100%;text-align:center;white-space:nowrap;font-size:12px;
  }
  .di-page:has(#diRiderUpload:not(.hidden)) #diRiderUpload .di-fields input{
    display:block;min-width:0;max-width:100%;width:100%;height:38px;
    padding:7px 3px;box-sizing:border-box;font-size:clamp(11px,0.9vw,14px);
    text-align:center;text-align-last:center;
  }
  .di-page:has(#diRiderUpload:not(.hidden)) .di-query-toolbar{
    display:grid;grid-template-columns:minmax(0,2fr) minmax(0,2fr) minmax(0,2fr) minmax(0,.75fr) minmax(0,.75fr) minmax(0,1.35fr);
    gap:6px;align-items:end;width:100%;min-width:0;
  }
  .di-page:has(#diRiderUpload:not(.hidden)) .di-query-toolbar>.di-toolbar-field,
  .di-page:has(#diRiderUpload:not(.hidden)) .di-query-toolbar>.di-toolbar-action{min-width:0;max-width:100%;}
  .di-page:has(#diRiderUpload:not(.hidden)) .di-query-toolbar>.di-toolbar-field input,
  .di-page:has(#diRiderUpload:not(.hidden)) .di-query-toolbar>.di-toolbar-field select{
    box-sizing:border-box;min-width:0;max-width:100%;width:100%;height:38px;
    padding:7px 3px;font-size:clamp(11px,0.9vw,14px);text-align:center;text-align-last:center;
  }
  .di-page:has(#diRiderUpload:not(.hidden)) .di-query-toolbar>.di-toolbar-action button{
    box-sizing:border-box;width:100%;max-width:100%;min-height:38px;padding:7px 2px;
    font-size:clamp(10px,0.85vw,13px);white-space:nowrap;
  }
}
/* Small touch screens keep readable inputs; no horizontal scrolling is introduced by the form. */
@media (max-width:768px){
  .di-page:has(#diRiderUpload:not(.hidden)) #diRiderUpload .di-fields{
    grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;
  }
  .di-page:has(#diRiderUpload:not(.hidden)) #diRiderUpload .di-fields>label{min-width:0;}
  .di-page:has(#diRiderUpload:not(.hidden)) #diRiderUpload .di-fields input{min-width:0;max-width:100%;}
}

/* RG 1.0.7: rider-only mobile performance registration and history.
   Admin screens and desktop layouts are intentionally unaffected. */
@media (max-width:768px) {
  #deliveryImagesPage.di-page:has(#diRiderUpload:not(.hidden)) {
    box-sizing:border-box;width:100%;max-width:100%;min-width:0;
    margin:0;padding:12px 10px 90px;overflow-x:clip;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) .di-card {
    box-sizing:border-box;width:100%;max-width:100%;min-width:0;
    padding:14px 12px;margin:12px 0;border-radius:12px;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) .di-head h2 {font-size:20px}
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) .di-card h3 {font-size:17px;margin-bottom:12px}
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) #diRiderUpload > label:first-of-type {
    background:#f1f5f9;border:1px dashed #b8c9dc;border-radius:12px;
    padding:15px 12px;text-align:center;align-items:stretch;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) #diFile {
    max-width:100%;min-width:0;background:#fff;font-size:12px;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) #diRecognizeBtn,
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) #diSaveBtn {
    display:block;width:100%;min-height:46px;margin:10px 0;
    font-size:14px;font-weight:700;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) #diRiderUpload .di-fields {
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 9px;
    width:100%;min-width:0;margin:16px 0;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) #diRiderUpload .di-fields>label {
    min-width:0;max-width:100%;font-size:12px;white-space:normal;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) #diRiderUpload .di-fields input {
    box-sizing:border-box;width:100%;max-width:100%;min-width:0;
    min-height:44px;padding:8px 6px;font-size:14px;text-align:center;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) .di-query-toolbar {
    display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px 7px;
    width:100%;min-width:0;align-items:end;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) .di-query-toolbar>.di-toolbar-field {
    grid-column:span 3;min-width:0;text-align:left;white-space:normal;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) #diRiderBranchDisplayWrap:not(.hidden) {
    grid-column:1/-1;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) .di-query-toolbar>.di-toolbar-field input,
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) .di-query-toolbar>.di-toolbar-field select {
    box-sizing:border-box;width:100%;min-width:0;max-width:100%;height:44px;
    padding:8px 5px;font-size:13px;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) .di-query-toolbar>.di-toolbar-action:not(.hidden) {
    grid-column:span 2;min-width:0;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) .di-query-toolbar>.di-toolbar-action button {
    box-sizing:border-box;width:100%;min-height:44px;padding:8px 2px;
    font-size:12px;white-space:nowrap;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) .di-stats {
    font-size:12px;line-height:1.5;overflow-wrap:anywhere;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) .di-rider-cards:not(.hidden) {
    display:grid;grid-template-columns:minmax(0,1fr);gap:10px;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) .di-rider-record {
    box-sizing:border-box;width:100%;min-width:0;padding:13px;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) .di-rider-record-values {
    grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) .di-rider-record-values strong {
    font-size:clamp(11px,3.4vw,14px);overflow-wrap:anywhere;
  }
  #deliveryImagesPage:has(#diRiderUpload:not(.hidden)) .di-rider-table {display:none}
}