/* Shared layout rules loaded after module styles. Keep controls inside their
   working area, and let content wrap at deliberate layout breakpoints. */
:root { --control-height: 44px; --control-gap: 10px; }
:is(.card, .card-body, .card-header, .page-actions, .plan-top-actions,
    .po-heading, .po-actions, .fba-actions, .loc-actions, .product-review-actions,
    .workspace-toolbar, .form-actions, .cm-panel-actions, .cd-toolbar) {
  min-width: 0;
}
.btn {
  max-width: 100%;
  min-width: 0;
  white-space: normal;
  text-align: center;
  overflow-wrap: normal;
}
.btn-icon {
  width: var(--control-height);
  height: var(--control-height);
  min-width: var(--control-height);
  min-height: var(--control-height);
  flex-shrink: 0;
}
:is(.page-actions, .product-review-actions, .plan-top-actions, .po-actions,
    .fba-actions, .loc-actions, .cd-form-actions, .form-actions) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--control-gap);
  max-width: 100%;
}
:is(.card-header, .po-heading, .loc-heading, .fba-heading) {
  align-items: flex-start;
  gap: 16px;
}
:is(.card-header, .po-heading, .loc-heading, .fba-heading) > :first-child {
  min-width: 0;
}
:is(.plan-toolbar, .table-toolbar, .cd-toolbar, .workspace-toolbar) {
  align-items: flex-end;
  gap: 12px;
}
:is(.plan-toolbar, .table-toolbar, .cd-toolbar) > label:not(.sr-only):not(.btn) {
  display: grid;
  gap: 7px;
  min-width: 0;
}
:is(.plan-toolbar, .table-toolbar, .plan-controls, .cd-toolbar, .workspace-toolbar) :is(input,select) {
  min-height: var(--control-height);
  max-width: 100%;
  min-width: 0;
}
:is(.plan-toolbar, .table-toolbar, .plan-controls, .cd-toolbar) > .btn {
  min-height: var(--control-height);
}
:is(.plan-form-grid, .cd-form-grid, .po-grid, .fba-grid, .product-create-grid) {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
:is(.plan-form-grid, .cd-form-grid, .po-grid, .fba-grid, .product-create-grid, .cost-fields) > * {
  min-width: 0;
}
:is(.plan-field, .cd-field, .po-grid > label, .fba-grid > label, .cost-fields > label) {
  gap: 8px;
}
:is(.plan-field, .cd-field, .po-grid, .fba-grid, .product-create-grid, .cost-fields) :is(input,select,textarea) {
  width: 100%;
  max-width: 100%;
}
/* Stable tab columns avoid stranded labels and inconsistent button widths. */
.product-workspace-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}
.product-workspace-tab {
  min-width: 0;
  padding: 10px 8px;
  white-space: normal;
  text-align: center;
  line-height: 1.45;
}
:is(.plan-tabs, .cd-tabs) {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
:is(.plan-tab, .cd-tab) {
  flex: 0 1 auto;
  min-width: 0;
  white-space: normal;
  text-align: center;
}
/* The body owns dialog scrolling; fields never pass underneath footer actions. */
:is(.plan-modal, .product-create-dialog) { overflow: hidden; }
:is(.plan-modal, .product-create-dialog) > form {
  display: flex;
  flex-direction: column;
  min-height: 0;
  max-height: calc(100dvh - 42px);
}
:is(.plan-modal-head, .product-create-head, .plan-form-footer, .product-create-actions) {
  flex: 0 0 auto;
  position: static;
}
:is(.plan-modal-body, .product-create-body) {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  flex: 1 1 auto;
  scroll-padding-block: 16px;
}
:is(.plan-modal-body, .cd-body, .product-create-body) :is(input, select, textarea) {
  scroll-margin-block: 16px;
}
:is(.plan-form-footer, .product-create-actions, .cd-footer, .cm-dialog-footer, .mr-footer) {
  gap: 12px;
  align-items: center;
}
/* Costs share the same field rhythm as product and purchasing forms. */
.cost-fields { grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,2fr); }
.cost-workspace .plan-toolbar > label { flex: 1 1 200px; }
.cost-workspace :is(.cost-fields input, textarea) {
  font: inherit;
  padding: 11px 12px;
  border: 1px solid var(--border);
  border-radius: 9px;
  color: var(--ink);
  background: #fff;
}
.cost-workspace textarea { display: block; width: 100%; min-height: 120px; margin-block: 8px 14px; resize: vertical; }
.cost-workspace .card-header > label.btn { flex: 0 1 auto; }
.workspace-toolbar select { min-width: 0; }
.workspace-save { min-width: 0; }
.workspace-save input { min-width: 0; max-width: 100%; flex: 1 1 200px; }
.workspace-save li > :first-child { min-width: 0; overflow-wrap: anywhere; }
.po-filters { grid-template-columns: minmax(0,2fr) minmax(150px,1fr) minmax(0,2fr); }
.po-actions .btn { min-height: var(--control-height); }
.po-shipment { max-width: 100%; }
.po-shipment dd { min-width: 0; }
.loc-workspace { min-width: 0; grid-template-columns: minmax(0,1fr); }
.loc-workspace > *, .loc-form-card label { min-width: 0; }
.loc-form-card :is(input:not([type=checkbox]),select,textarea) { max-width: 100%; width: 100%; }
.loc-metrics { grid-template-columns: repeat(auto-fit,minmax(min(190px,100%),1fr)); }
@media (min-width: 1400px) {
  .product-workspace-tabs { grid-template-columns: repeat(9,minmax(0,1fr)); }
}
@media (max-width: 1000px) {
  .po-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .po-filters > :first-child { grid-column: 1 / -1; }
  .pf-heading { flex-wrap: wrap; }
  .pf-heading-actions { width: 100%; max-width: none; }
}
@media (max-width: 760px) {
  :is(.plan-form-grid, .cd-form-grid, .po-grid, .fba-grid, .product-create-grid, .cost-fields) {
    grid-template-columns: minmax(0,1fr);
  }
  :is(.plan-tabs, .cd-tabs) { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .product-workspace-tab { min-height: 52px; font-size: 12px; padding: 8px 6px; }
  :is(.plan-toolbar, .table-toolbar, .cd-toolbar) > :is(input,select,label:not(.sr-only):not(.btn)) {
    flex: 1 1 100%;
    width: 100%;
    max-width: none;
  }
  .plan-toolbar .plan-filter-field { min-width: 0; }
  .workspace-toolbar > span { flex: 1 1 100%; margin-right: 0; }
  .workspace-toolbar > select { flex: 1 1 200px; width: auto; max-width: 100%; }
  .po-metrics { grid-template-columns: minmax(0,1fr); }
  .po-heading > .po-actions { width: 100%; }
  .cost-workspace .card-header > label.btn { width: 100%; }
}
@media (max-width: 480px) {
  .po-filters { grid-template-columns: minmax(0,1fr); }
  .po-shipment { grid-template-columns: minmax(0,1fr); }
  .po-shipment dd { margin-bottom: 10px; }
  .loc-metrics { grid-template-columns: minmax(0,1fr); }
  :is(.plan-modal, .product-create-dialog) > form { max-height: calc(100dvh - 24px); }
}
/* Confirmation screens have no form wrapper and retain their own scrolling. */
.product-create-dialog:not(:has(> form)) { overflow: auto; }
/* Purchasing: inset chevrons, in-card line headings and product-level costs. */
.purchasing-workspace select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23677d70' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 16px;
  padding-right: 44px !important;
}
.po-line-title { margin: 0 0 20px; font-size: 16px; line-height: 1.5; }
.po-core-item { display: grid; grid-template-columns: minmax(0,2fr) minmax(100px,1fr) minmax(100px,1fr); align-items: end; gap: 16px; }
.po-core-item > *, .po-extra-cost > * { min-width: 0; }
.po-core-item > .po-map { display: block; margin: 0; }
.po-core-item .component-picker, .po-map .component-picker { width: 100%; }
.po-mappings h4 { margin: 0 0 14px; }
.po-extra-costs { display: grid; gap: 18px; margin-top: 18px; }
.po-extra-cost { display: grid; grid-template-columns: minmax(0,2fr) minmax(0,1fr) 44px; align-items: end; gap: 14px; }
.po-payment-summary { display: grid; gap: 8px; margin: 18px 0; }
.po-payment-summary p { margin: 0; }
@media(max-width:850px) {
  .po-core-item { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .po-core-item > .po-map { grid-column: 1 / -1; }
}
@media(max-width:600px) {
  .po-extra-cost { grid-template-columns: minmax(0,1fr) 44px; }
  .po-extra-cost > label:first-child { grid-column: 1 / -1; }
}
@media(forced-colors:active) {
  .purchasing-workspace select { appearance: auto; -webkit-appearance: auto; background-image: none; }
}
.po-line { scroll-margin-block-start: 84px; }
.po-mappings > .po-actions { margin-top: 16px; }
.po-form > .po-note { margin-top: 14px; }

/* Checkbox labels are horizontal controls, rather than full-width form fields. */
.purchasing-workspace label.po-check {display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:10px;align-self:center;line-height:1.5;min-height:44px;}
.purchasing-workspace label.po-check input[type=checkbox] {appearance:auto;width:18px!important;height:18px!important;min-width:18px;min-height:18px;flex:0 0 18px;margin:0;padding:0;accent-color:#173f39;}
.purchasing-workspace label.po-check span {flex:1;}