/* GFLEX TEST Stage 039 — presentational layer only.
   Source: Stage 038.1.  Does NOT touch event listeners, IDs, role checks,
   Supabase API, transfer SQL, dates, or the mobile Stage 037 navigation.
*/

/* A consistent GFLEX red / white treatment for the explicit workflow buttons
   inside application pages. Excludes shelf tiles, KPI filter cards, navigation,
   dismiss/close controls and destructive/cancel actions, preserving semantics. */
#appRoot section.panel button.action,
#appRoot section.panel button.finishLoadBtn,
#appRoot section.panel button.refreshBtn,
#appRoot section.panel button.exportBtn,
#appRoot section.panel button.smallExport,
#appRoot section.panel button.excelSecondaryBtn,
#appRoot section.panel button.routingToggleBtn,
#appRoot section.panel button.backBtn,
#appRoot section.panel button.adminMiniBtn,
#appRoot section.panel button.handoffFailureClear,
#appRoot section.panel button.routeMoveBtn,
#appRoot section.panel button.routingFixBtn,
#appRoot section.panel button.routingTransferBtn,
#appRoot section.panel button.returnConfirmBtn,
#appRoot section.panel button.deliverBtn,
#appRoot section.panel button.returnBtn,
#appRoot section.panel button.courierControlMiniBtn {
  background:linear-gradient(135deg,#fa2b38 0%,#e31627 56%,#c80f20 100%)!important;
  border:1px solid #ef3c4a!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  font-weight:850!important;
  border-radius:10px!important;
  box-shadow:0 3px 10px rgba(206,25,43,.18)!important;
  text-shadow:none!important;
  cursor:pointer;
  transition:filter .15s ease,transform .15s ease!important;
}
/* Page buttons with embedded label spans or auto-contrast marker classes. */
#appRoot section.panel button.action *,
#appRoot section.panel button.finishLoadBtn *,
#appRoot section.panel button.refreshBtn *,
#appRoot section.panel button.exportBtn *,
#appRoot section.panel button.smallExport *,
#appRoot section.panel button.excelSecondaryBtn *,
#appRoot section.panel button.adminMiniBtn *,
#appRoot section.panel button.courierControlMiniBtn * {
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
#appRoot section.panel button.action:not(:disabled):hover,
#appRoot section.panel button.finishLoadBtn:not(:disabled):hover,
#appRoot section.panel button.refreshBtn:not(:disabled):hover,
#appRoot section.panel button.exportBtn:not(:disabled):hover,
#appRoot section.panel button.smallExport:not(:disabled):hover,
#appRoot section.panel button.excelSecondaryBtn:not(:disabled):hover,
#appRoot section.panel button.adminMiniBtn:not(:disabled):hover {
  filter:brightness(1.09)!important;
  transform:translateY(-1px);
}
#appRoot section.panel button:disabled {
  cursor:not-allowed!important;
  filter:saturate(.62)!important;
  opacity:.67!important;
  transform:none!important;
}
#appRoot section.panel button:focus-visible {
  outline:3px solid #ffc267!important;
  outline-offset:3px!important;
}
/* All the above are visual only: don't recolor the Cancel/× buttons,
   the status chips, shelf tiles, KPI numbers, navigation, or accessibility toggles. */

/* Stage 039: transfer batches show actual UGF codes, not just a batch counter. */
#transfer #outgoingTransfersList .gflex039OutgoingBatch {
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:start!important;
  gap:10px 14px!important;
  padding:13px 14px!important;
  background:#173453!important;
  border:1px solid #486784!important;
  border-radius:11px!important;
  min-width:0!important;
  font-family:inherit!important;
}
#transfer .gflex039BatchInfo{min-width:0!important;}
#transfer .gflex039BatchTitle{display:block;font-size:14px;font-weight:950;line-height:1.4;color:#fff!important;}
#transfer .gflex039Route{font-size:12px;line-height:1.5;margin-top:3px;color:#c8d9f1!important;overflow-wrap:anywhere;}
#transfer .gflex039Count{
  padding:6px 9px;align-self:start;white-space:nowrap;
  border:1px solid #607b9e;border-radius:8px;
  color:#fff!important;font-size:12px;
}
#transfer .gflex039TransferCodes {
  display:flex;grid-column:1 / -1;flex-wrap:wrap;align-items:stretch;gap:7px;
  min-width:0!important;
}
#transfer .gflex039TransferChip{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:5px 13px;
  flex:1 1 225px;min-width:0;border:1px solid #55799c;border-radius:9px;
  padding:9px 11px;background:#0a2038!important;
}
#transfer .gflex039TransferCode {
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:clamp(13px,1.15vw,16px);letter-spacing:.25px;
  color:#fff!important;font-weight:950!important;
  overflow-wrap:anywhere;word-break:break-word;
}
#transfer .gflex039TransferStatus {
  display:inline-block;font-family:inherit;font-size:11px;
  padding:4px 7px;border-radius:7px;white-space:nowrap;
  color:#fff!important;font-weight:800;
}
#transfer .gflex039Pending {background:#815313!important;}
#transfer .gflex039Received {background:#166a4a!important;}
#transfer .gflex039MissingCode{font-size:12px;color:#ffe0a7!important;}
#transfer #incomingRemainingList .gflex039IncomingParcel {
  display:flex!important;align-items:center!important;
  gap:8px!important;justify-content:space-between!important;
  flex-wrap:wrap!important;min-width:0!important;
  padding:10px 12px!important;background:#173453!important;
  border-color:#486784!important;
}
#transfer #incomingRemainingList .gflex039IncomingParcel .gflex039TransferCode{
  font-size:14px!important;
}
#transfer #incomingTransferSelect {text-overflow:ellipsis;}

@media(max-width:760px){
  #transfer #outgoingTransfersList .gflex039OutgoingBatch{grid-template-columns:1fr!important;}
  #transfer .gflex039Count{justify-self:start;grid-row:2;}
  #transfer .gflex039TransferCodes{grid-row:3;}
  #transfer .gflex039TransferChip{flex-basis:100%;}
  #transfer #incomingRemainingList .gflex039IncomingParcel {padding:9px!important;}
  #appRoot section.panel button.action,
  #appRoot section.panel button.finishLoadBtn {
    min-height:44px!important;
  }
}

/* Only the UI version label changes. The backend version is still supplied by
   Supabase and is intentionally left untouched. */
#appRoot .testVersion::after{content:" · UI 039"!important;font-weight:950;color:#e2edff!important;}
