/* Keep desktop content and mobile controls on the same pages. Loaded last. */
@media (max-width: 760px) {
  html { -webkit-text-size-adjust: 100%; }
  .admin-tab-panel input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
  .admin-tab-panel select, .admin-tab-panel textarea,
  .integrated-production-dialog input, .integrated-production-dialog select,
  .home-live-market-filters select, .customer-form input, .customer-form textarea {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
    min-height: 48px;
    font-size: 16px !important;
    line-height: 1.5;
  }
  .admin-tab-panel input[type="file"] { box-sizing: border-box; max-width: 100%; min-width: 0; }
  .operation-fields label, .vendor-fields label, .farm-cost-fields label,
  .production-field-grid label, .receiving-field-grid label {
    min-width: 0;
    gap: 8px;
    line-height: 1.5;
  }
  .admin-tab-panel input[inputmode="decimal"],
  .admin-tab-panel input[inputmode="numeric"],
  .admin-tab-panel input[type="number"],
  .materials-summary-metric strong, .farm-cost-totals strong,
  .farm-cost-calculated strong, .integrated-totals strong,
  .shipment-period-total strong { font-variant-numeric: tabular-nums; }

  /* Give each date an explicit label instead of hiding the period markers. */
  .admin-tab-panel .operation-toolbar .operation-date-filter,
  #shipmentPanel .shipment-toolbar-controls .operation-date-filter {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 16px minmax(0, 1fr) !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100%;
    min-width: 0;
    margin: 0 !important;
    align-items: center;
  }
  .admin-tab-panel .operation-toolbar .operation-date-filter > span,
  #shipmentPanel .shipment-toolbar-controls .operation-date-filter > span {
    display: block !important;
    grid-column: 1 / -1 !important;
    text-align: left;
    line-height: 1.5;
  }
  .admin-tab-panel .operation-toolbar .operation-date-filter > b,
  #shipmentPanel .shipment-toolbar-controls .operation-date-filter > b {
    display: grid !important;
    place-items: center;
    grid-column: 2;
    height: 48px;
    margin: 0;
  }
  .admin-tab-panel .operation-toolbar .operation-date-filter input,
  #shipmentPanel .shipment-toolbar-controls .operation-date-filter input {
    width: 100% !important;
    min-width: 0 !important;
    height: 48px !important;
    padding: 0 5px !important;
  }
  .admin-tab-panel .operation-toolbar .operation-date-filter input:first-of-type,
  #shipmentPanel .shipment-toolbar-controls .operation-date-filter input:first-of-type { grid-column: 1; }
  .admin-tab-panel .operation-toolbar .operation-date-filter input:last-of-type,
  #shipmentPanel .shipment-toolbar-controls .operation-date-filter input:last-of-type { grid-column: 3; }

  /* Large totals must remain complete rather than ending in an ellipsis. */
  #materialsPanel .materials-form-actions .materials-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
  #materialsPanel .materials-summary > label { grid-column: 1 / -1 !important; }
  #materialsPanel .materials-summary-metric { padding: 12px 10px; }
  #materialsPanel .materials-summary-metric strong {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.6;
    font-size: 16px;
  }
  .farm-cost-calculated article, .farm-cost-totals article,
  .integrated-totals article { min-width: 0; }
  .farm-cost-calculated strong, .farm-cost-totals strong,
  .integrated-totals strong { line-height: 1.6; overflow-wrap: anywhere; }
  .farm-cost-filter { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .farm-cost-filter label { display: flex; flex-wrap: wrap; width: 100%; min-width: 0; gap: 8px; }
  .farm-cost-filter label input { flex: 1 1 120px; width: 0; min-width: 0; }
  .farm-cost-filter > input, .farm-cost-filter select { width: 100%; min-width: 0; }
  .integrated-history-search { gap: 10px; }
  .integrated-history-search input { min-width: 0; flex-basis: 100%; }
  .integrated-subtabs, .vendor-tabs, .labor-subtabs { flex-wrap: wrap; box-sizing: border-box; }
  .integrated-subtabs button, .vendor-tabs button, .labor-subtabs button { min-height: 44px; }
  .vendor-card header { flex-wrap: wrap; }
  .vendor-card-actions { flex-wrap: wrap; }
  .vendor-card-actions button, .farm-cost-actions button,
  .integrated-toolbar-actions button { min-height: 44px; }
  .home-live-market-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px !important; }
  .home-live-market-filters label, .home-live-market-filters select { width: 100%; min-width: 0; }
  .home-market-price-summary-head { flex-wrap: wrap; gap: 12px; }
  .home-market-price-summary-head > div { min-width: 0; }
  .home-market-price-summary-head h2 { font-size: 24px; line-height: 1.4; overflow-wrap: anywhere; }
}
@media (max-width: 360px) {
  /* Native date controls need enough room for all digits at larger text sizes. */
  .admin-tab-panel .operation-toolbar .operation-date-filter,
  #shipmentPanel .shipment-toolbar-controls .operation-date-filter {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .admin-tab-panel .operation-toolbar .operation-date-filter > b,
  #shipmentPanel .shipment-toolbar-controls .operation-date-filter > b { grid-column: 1; height: 20px; }
  .admin-tab-panel .operation-toolbar .operation-date-filter input:last-of-type,
  #shipmentPanel .shipment-toolbar-controls .operation-date-filter input:last-of-type { grid-column: 1; }
}

/* Gamhyeop search: explicit grid positions keep the date separator in its own cell. */
@media (max-width: 760px) {
  #gamhyeopPanel .gamhyeop-page { padding: 16px 12px; }
  #gamhyeopPanel .gamhyeop-heading { gap: 16px; }
  #gamhyeopPanel .gamhyeop-heading h2 { font-size: 25px; line-height: 1.35; }
  #gamhyeopPanel .gamhyeop-heading p { font-size: 13px; line-height: 1.7; }
  #gamhyeopPanel #gamhyeopRefresh { min-height: 44px; font-size: 14px; }
  #gamhyeopPanel #gamhyeopUpdated {
    display: inline-flex; align-items: center; margin: 12px 0 0; padding: 6px 10px;
    border-radius: 6px; background: #edf5ef; color: #376349; font-size: 12px;
    font-weight: 600; line-height: 1.5;
  }
  #gamhyeopPanel .gamhyeop-toolbar {
    display: grid; grid-template-columns: minmax(0, 1fr); align-items: stretch;
    gap: 18px; padding: 14px 12px; margin-top: 16px; border-radius: 12px;
  }
  #gamhyeopPanel .gamhyeop-date-filter {
    display: grid; grid-template-columns: minmax(0, 1fr) 12px minmax(0, 1fr);
    align-items: end; gap: 6px; min-width: 0; width: 100%;
  }
  #gamhyeopPanel .gamhyeop-date-filter > label {
    display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px;
    min-width: 0; width: 100%; margin: 0; color: #365343; font-size: 13px; line-height: 1.5;
  }
  #gamhyeopPanel .gamhyeop-date-filter > label:first-child { grid-column: 1; grid-row: 1; }
  #gamhyeopPanel .gamhyeop-date-filter > label:last-child { grid-column: 3; grid-row: 1; }
  #gamhyeopPanel .gamhyeop-date-filter > span {
    display: grid; place-items: center; grid-column: 2; grid-row: 1; align-self: end;
    height: 48px; margin: 0; padding: 0; font-size: 14px; font-weight: 500; color: #708477;
  }
  #gamhyeopPanel .gamhyeop-toolbar input {
    display: block; box-sizing: border-box; width: 100% !important; min-width: 0;
    max-width: 100%; height: 48px; padding: 0 10px; font-size: 16px !important;
    color: #243f30; background: #fff; border: 1px solid #bfcfc4; border-radius: 8px;
  }
  #gamhyeopPanel .gamhyeop-date-filter input { padding: 0 4px; text-align: left; }
  #gamhyeopPanel .gamhyeop-search { display: grid; gap: 8px; min-width: 0; color: #365343; font-size: 13px; line-height: 1.5; }
  #gamhyeopPanel .gamhyeop-search > span {
    position: static; width: auto; height: auto; padding: 0; margin: 0;
    overflow: visible; clip: auto; clip-path: none; white-space: normal;
  }
  #gamhyeopPanel .gamhyeop-toolbar-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  #gamhyeopPanel .gamhyeop-toolbar-buttons button {
    width: 100%; min-width: 0; height: 46px; padding: 0 12px; font-size: 14px;
    line-height: 1.4; font-weight: 700; border: 1px solid #c3d3c8; background: #fff; color: #315840;
  }
  #gamhyeopPanel .gamhyeop-toolbar-buttons button[type="submit"] {
    grid-column: 1 / -1; background: #246b45; border-color: #246b45; color: #fff;
  }
  #gamhyeopPanel .gamhyeop-filter-status { margin: 12px 2px 16px; font-size: 12px; line-height: 1.7; }
  #gamhyeopPanel > .gamhyeop-page > .vendor-tabs {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 16px 0;
  }
  #gamhyeopPanel > .gamhyeop-page > .vendor-tabs button {
    min-width: 0; min-height: 46px; padding: 10px 8px; font-size: 14px; line-height: 1.5; white-space: nowrap;
  }
  #gamhyeopPanel .gamhyeop-toolbar :focus-visible { outline: 3px solid #87b79a; outline-offset: 2px; }
}
@media (max-width: 359px) {
  #gamhyeopPanel .gamhyeop-date-filter { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  #gamhyeopPanel .gamhyeop-date-filter > label:first-child { grid-column: 1; grid-row: 1; }
  #gamhyeopPanel .gamhyeop-date-filter > label:last-child { grid-column: 1; grid-row: 2; }
  #gamhyeopPanel .gamhyeop-date-filter > span { display: none; }
  #gamhyeopPanel .gamhyeop-date-filter input { padding: 0 10px; }
}