/* Supplier finance workspace. No shared queue or global table styles. */
#nav-payables[hidden],
.payables-workspace[hidden],
.payables-workspace [hidden] { display: none !important; }

.payables-workspace .pw-supplier-filters { grid-template-columns: minmax(150px, 1fr) minmax(240px, 1.5fr) auto auto; }
@media (max-width: 700px) {
  .payables-workspace .pw-supplier-filters { grid-template-columns: minmax(0, 1fr); }
}

.payables-workspace {
  --pw-muted: #687c96;
  --pw-border: #dce5f1;
  --pw-surface-soft: #f7f9fd;
  --pw-ink: #173554;
  min-width: 0;
  scroll-margin-top: 94px;
  color: var(--ink);
}
.pw-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin: 2px 0 25px;
}
.pw-eyebrow { margin: 0 0 8px; color: var(--primary); font-size: 10px; font-weight: 850; letter-spacing: .13em; }
.pw-heading h1 { margin: 0; color: #163655; font-size: 29px; letter-spacing: -.035em; line-height: 1.25; }
.pw-heading p:last-child { max-width: 750px; margin: 8px 0 0; color: var(--pw-muted); font-size: 12px; line-height: 1.65; }
.pw-button {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 15px;
  border: 1px solid var(--pw-border);
  border-radius: 10px;
  background: #fff;
  color: #355274;
  font: 700 11px "Roboto", Arial, sans-serif;
  cursor: pointer;
  white-space: nowrap;
  transition: background .15s, border-color .15s, box-shadow .15s;
}
.pw-button:hover:not(:disabled) { border-color: #a7bff2; background: #f3f7ff; }
.pw-button:disabled { opacity: .45; cursor: not-allowed; }
.pw-button svg,
.pw-heading svg,
.pw-readonly-label svg { width: 17px; height: 17px; flex: 0 0 auto; }
.pw-primary { border-color: var(--primary); color: #fff; background: var(--primary); box-shadow: 0 5px 12px #2555b21c; }
.pw-primary:hover:not(:disabled) { border-color: var(--primary-dark); color: #fff; background: var(--primary-dark); box-shadow: 0 6px 15px #2555b224; }
.pw-subtle { border-color: transparent; color: var(--primary); background: transparent; }
.pw-small { min-height: 34px; padding: 7px 11px; font-size: 10px; }
.pw-danger { border-color: #c94353; color: #fff; background: #c94353; }
.pw-danger:hover:not(:disabled) { border-color: #b52f40; color: #fff; background: #b52f40; }
.pw-danger-text { color: #bd4253; }
.payables-workspace :is(button, input, select, textarea, a):focus-visible,
.pw-dialog :is(button, input, select, textarea, a):focus-visible { outline: 3px solid #2563eb40; outline-offset: 3px; }

.pw-section-title { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 13px; }
.pw-section-title h2 { margin: 0; color: #23415f; font-size: 16px; letter-spacing: -.015em; }
.pw-section-title p { margin: 5px 0 0; color: var(--pw-muted); font-size: 10px; line-height: 1.6; }
.pw-readonly-label { display: inline-flex; align-items: center; gap: 6px; color: #32836a; font-size: 10px; white-space: nowrap; }
.pw-period-section { margin-bottom: 26px; padding: 22px; border: 1px solid #cfdcf4; border-radius: 17px; background: linear-gradient(135deg, #f7faff, #fff 75%); }
.pw-period-section .pw-filters { padding: 0; }
.pw-period-caption { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 17px; margin: 18px 0 13px; color: #6a809c; font-size: 10px; line-height: 1.6; }
.pw-period-caption > strong { color: #2b517d; font-weight: 750; }
.pw-period-grid { display: grid; gap: 12px; }
.pw-period-card { min-width: 0; overflow: hidden; border: 1px solid #dce6f5; border-radius: 13px; background: #fff; box-shadow: 0 5px 18px #17376804; }
.pw-period-card > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 18px; border-bottom: 1px solid #e7edf6; }
.pw-period-card h3 { margin: 0; color: #224b76; font-size: 13px; overflow-wrap: anywhere; }
.pw-period-card header small { display: block; margin-top: 5px; color: #7488a2; font-size: 10px; }
.pw-period-metrics { display: grid; grid-template-columns: 1.2fr repeat(4, minmax(0, 1fr)); }
.pw-period-metric { display: flex; min-width: 0; flex-direction: column; justify-content: center; gap: 8px; padding: 18px; border-left: 1px solid #edf1f7; }
.pw-period-metric:first-child { border-left: 0; }
.pw-period-metric > span { color: #687e99; font-size: 10px; line-height: 1.5; }
.pw-period-metric > strong { color: #335779; font-size: clamp(17px, 1.6vw, 23px); line-height: 1.3; letter-spacing: -.025em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.pw-period-metric > small { color: #8a99ae; font-size: 10px; }
.pw-period-metric.is-total { background: #f0f5ff; }
.pw-period-metric.is-total > strong { color: #2656ab; font-weight: 850; }
.pw-period-metric.is-paid > strong { color: #278169; }
.pw-period-metric.is-balance > strong { color: #9b6b25; }
.pw-period-warning { margin: 0; padding: 12px 17px; border-top: 1px solid #f2e5cb; background: #fff9ee; color: #94713a; font-size: 11px; line-height: 1.75; }
.pw-period-payment-note { margin: 12px 0 0; color: #7388a3; font-size: 10px; line-height: 1.7; }
.pw-period-empty { padding: 25px 15px; border: 1px dashed #d6e1f4; border-radius: 12px; background: #ffffffb3; }
.pw-alltime-section { margin-bottom: 18px; }
@media (max-width: 1180px) {
  .pw-period-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pw-period-metric:nth-child(4) { border-left: 0; }
}
@media (max-width: 760px) {
  .pw-period-section { padding: 17px 16px; }
  .pw-period-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pw-period-metric { padding: 14px; border-top: 1px solid #edf1f7; }
  .pw-period-metric:nth-child(2n) { border-left: 0; }
  .pw-period-metric.is-total { grid-column: 1 / -1; }
  .pw-period-metric.is-total > strong { font-size: 26px; }
  .pw-period-card > header { align-items: flex-start; padding: 14px; }
  .pw-period-caption { display: grid; gap: 5px; }
}
.pw-balance-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.pw-balance-card {
  display: grid;
  grid-template-columns: minmax(125px, 180px) minmax(0, 1fr);
  align-items: center;
  min-width: 0;
  padding: 22px;
  border: 1px solid var(--pw-border);
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 5px 20px #17376805;
}
.pw-balance-card header { display: flex; gap: 11px; align-items: center; padding-right: 18px; min-width: 0; }
.pw-supplier-icon { display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 40px; border: 1px solid #e0e9ff; border-radius: 12px; color: var(--primary); background: #f0f5ff; }
.pw-supplier-icon svg { width: 21px; height: 21px; }
.pw-balance-card h3 { margin: 0; color: #23415f; font-size: 14px; overflow-wrap: anywhere; }
.pw-balance-card header small { display: block; margin-top: 5px; color: var(--pw-muted); font-size: 10px; }
.pw-balance-metrics { display: grid; grid-template-columns: 1.25fr 1fr 1fr 1.15fr; align-items: stretch; min-width: 0; }
.pw-balance-main,
.pw-balance-stat { display: flex; min-width: 0; flex-direction: column; justify-content: center; gap: 8px; padding: 9px 18px; border-left: 1px solid #e7edf5; }
.pw-balance-label,
.pw-balance-stat > span { display: block; margin: 0; color: #617791; font-size: 10px; line-height: 1.45; }
.pw-balance { display: block; color: #123e71; font-size: clamp(21px, 2vw, 27px); font-weight: 850; letter-spacing: -.03em; line-height: 1.15; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.pw-balance-stat > strong { display: block; color: #375979; font-size: 19px; letter-spacing: -.02em; line-height: 1.35; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.pw-balance-stat.is-paid > strong { color: #267c66; }
.pw-balance-stat > small { color: #7387a2; font-size: 10px; }
.pw-balance-stat.is-pending { margin-left: 12px; border: 1px solid #f2e4c8; border-radius: 10px; background: #fffcf5; }
.pw-balance-stat.is-pending > span,
.pw-balance-stat.is-pending > strong,
.pw-balance-stat.is-pending > small { color: #956b24; }

/* Compatibility with historic summary markup used by older consumers. */
.pw-balance-breakdown { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 18px 0; }
.pw-balance-breakdown span { color: #687c96; font-size: 10px; }
.pw-balance-breakdown b { display: block; margin-top: 7px; color: #526b88; font-size: 13px; font-variant-numeric: tabular-nums; }
.pw-balance-card footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; border: 1px solid #f1e3c9; border-radius: 9px; color: #956b24; background: #fffcf5; font-size: 10px; }

.pw-exceptions { margin: 12px 0 0; padding: 11px 14px; border: 1px solid #eddcb9; border-radius: 10px; background: #fff9ed; color: #946b2c; font-size: 10px; line-height: 1.65; }
.pw-exceptions[hidden] { display: none; }
.pw-start-note { display: flex; align-items: flex-start; gap: 9px; margin: 12px 0 22px; padding: 11px 14px; border: 1px solid #e1e8f2; border-radius: 10px; background: #f9fbfe; }
.pw-start-note svg { width: 16px; height: 16px; flex: 0 0 auto; color: #7891b0; margin-top: 1px; }
.pw-start-note p { margin: 0; color: #687d98; font-size: 10px; line-height: 1.65; }
.pw-panel { position: relative; min-width: 0; overflow: visible; border: 1px solid var(--pw-border); border-radius: 16px; background: #fff; box-shadow: 0 10px 28px #17376805; }
.pw-tabs { display: flex; gap: 27px; padding: 0 22px; border-bottom: 1px solid #e4ebf4; }
.pw-tabs button { position: relative; padding: 18px 0 17px; border: 0; background: none; color: #6f8098; font: 750 12px "Roboto", Arial, sans-serif; cursor: pointer; white-space: nowrap; }
.pw-tabs button:hover { color: #315d98; }
.pw-tabs button[aria-selected="true"] { color: var(--primary); }
.pw-tabs button[aria-selected="true"]::after { content: ""; position: absolute; bottom: -1px; left: 0; right: 0; height: 3px; border-radius: 3px 3px 0 0; background: var(--primary); }
.pw-filters { display: grid; grid-template-columns: minmax(165px, 1fr) minmax(145px, .9fr) minmax(125px, .7fr) minmax(200px, 1.1fr) auto auto; align-items: end; gap: 10px; padding: 19px 22px 0; }
.pw-store-field { min-width: 0; }
.pw-store-scope-note { margin: 9px 0 13px; color: #8392a6; font-size: 10px; line-height: 1.65; }
#pw-period-stores { overflow-wrap: anywhere; color: #345c9b; }
#pw-store-feedback { margin-top: 13px; }
.pw-filters > label { display: grid; min-width: 0; gap: 7px; }
.pw-filters > label > span,
.pw-filter-label { color: #6a7e98; font-size: 10px; font-weight: 700; }
.pw-filters input,
.pw-filters select { min-width: 0; width: 100%; height: 42px; padding: 8px 12px; border: 1px solid var(--pw-border); border-radius: 10px; color: #39516f; background: #fff; font-size: 11px; }
.pw-filters input[hidden] { display: none; }
.pw-filters > .pw-button { min-height: 42px; }
.pw-filter-note { padding: 0 22px; margin: 11px 0 17px; color: #71839b; font-size: 10px; line-height: 1.6; }
.pw-feedback { margin: 12px 22px; padding: 11px 13px; border: 1px solid #c4e7dc; border-radius: 9px; background: #f0fbf7; color: #287a62; font-size: 11px; line-height: 1.6; }
.pw-feedback[hidden] { display: none; }
.pw-feedback.is-error { border-color: #f0c6cd; background: #fff5f6; color: #aa3e4f; }
.pw-list-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 22px; border-top: 1px solid #edf1f7; background: #fbfcfe; }
.pw-list-heading h2,
.pw-list-heading h3,
#pw-list-title { margin: 0; color: #244567; font-size: 14px; font-weight: 750; letter-spacing: -.01em; }
.pw-list-heading p { margin: 5px 0 0; color: #71859d; font-size: 10px; line-height: 1.55; }
#pw-list-count { display: inline-flex; justify-content: center; align-items: center; min-width: 27px; min-height: 25px; padding: 4px 9px; border: 1px solid #dce6f8; border-radius: 7px; background: #eef4ff; color: #3566ad; font-size: 11px; font-weight: 750; font-variant-numeric: tabular-nums; }
.pw-selection { position: sticky; top: 76px; z-index: 12; display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 12px 22px; padding: 12px 15px; border: 1px solid #bacef7; border-radius: 10px; background: #f2f7ff; box-shadow: 0 3px 10px #1b4f9510; }
.pw-selection[hidden] { display: none; }
.pw-selection strong { color: #264c86; font-size: 12px; }
.pw-selection p { margin: 4px 0 0; color: #637c9e; font-size: 10px; line-height: 1.5; }
.pw-selection > div:last-child { display: flex; align-items: center; gap: 7px; flex: 0 0 auto; }

.pw-table-wrap { max-width: 100%; overflow: auto; overscroll-behavior: contain; scrollbar-color: #c1cfdf #f4f7fb; scrollbar-width: thin; }
.pw-list > .pw-table-wrap { max-height: min(640px, 65vh); min-height: 200px; border-top: 1px solid #e7edf6; border-bottom: 1px solid #e7edf6; }
.pw-table-wrap table { width: 100%; min-width: 810px; border-collapse: separate; border-spacing: 0; }
.pw-table-wrap th { padding: 13px 17px; border-bottom: 1px solid #e5edf6; background: #f5f8fc; color: #6e829d; font-size: 9px; white-space: nowrap; text-align: left; letter-spacing: .025em; }
.pw-list > .pw-table-wrap th { position: sticky; top: 0; z-index: 2; }
.pw-table-wrap td { height: 66px; padding: 13px 17px; border-top: 0; border-bottom: 1px solid #edf2f8; vertical-align: middle; color: #536b88; background: #fff; font-size: 11px; transition: background .12s; }
.pw-table-wrap tr:last-child td { border-bottom: 0; }
.pw-table-wrap tbody tr:hover td { background: #f9fbff; }
.pw-table-wrap tbody tr:has(input[type="checkbox"]:checked) td { background: #f1f6ff; }
.pw-table-wrap td strong { color: #24466b; font-size: 11px; font-weight: 750; }
.pw-table-wrap td small { display: block; margin-top: 5px; color: #7c8fa9; font-size: 9px; }
.pw-table-wrap th:first-child:has(input),
.pw-table-wrap td:first-child:has(input) { width: 48px; padding-right: 10px; padding-left: 20px; }
.pw-table-wrap input[type="checkbox"] { width: 16px; height: 16px; margin: 0; accent-color: var(--primary); vertical-align: middle; cursor: pointer; }
.pw-right { text-align: right !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pw-badge { display: inline-flex; align-items: center; width: fit-content; padding: 5px 8px; border-radius: 7px; background: #f0f4fa; color: #657b96; font-size: 9px; line-height: 1.35; font-weight: 700; }
.pw-status-unpaid,
.pw-warn { color: #936417; background: #fff3d9; }
.pw-status-partial { color: #416bb2; background: #ecf2ff; }
.pw-status-paid,
.pw-success { color: #24846e; background: #eaf8f2; }
.pw-status-void { color: #8b6f79; background: #f4eef0; }
.pw-table-wrap td .pw-warn { display: flex; margin-top: 7px; max-width: 240px; }
.pw-pagination { display: flex; align-items: center; justify-content: space-between; gap: 15px; min-height: 66px; padding: 13px 22px; color: #70839c; font-size: 10px; }
#pw-pagination-top { border-top: 1px solid #eaf0f7; }
#pw-pagination-bottom { border-top: 0; border-radius: 0 0 16px 16px; background: #fbfcfe; }
.pw-pagination > div { display: flex; align-items: center; gap: 7px; min-width: 0; }
.pw-page-summary { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; line-height: 1.5; }
.pw-page-summary strong { color: #335475; font-weight: 750; }
.pw-page-controls { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 5px; }
.pw-page-size { display: flex; align-items: center; gap: 8px; color: #657b95; font-size: 10px; font-weight: 600; white-space: nowrap; }
.pw-page-size select { width: 68px; height: 34px; padding: 6px 9px; border: 1px solid #dbe5f3; border-radius: 8px; color: #375676; background: #fff; font-size: 11px; font-weight: 700; cursor: pointer; }
.pw-page-button { display: inline-flex; justify-content: center; align-items: center; gap: 6px; min-width: 34px; min-height: 34px; padding: 7px 10px; border: 1px solid #dce5f1; border-radius: 8px; color: #56708f; background: #fff; font: 700 10px "Roboto", Arial, sans-serif; line-height: 1.3; cursor: pointer; }
.pw-page-button:hover:not(:disabled) { border-color: #b1c8f4; background: #f2f6ff; color: #2854a0; }
.pw-page-button[aria-current="page"] { border-color: #2563eb; color: #fff; background: #2563eb; box-shadow: 0 3px 8px #2563eb18; }
.pw-page-button:disabled { opacity: .4; cursor: not-allowed; }
.pw-page-button svg { width: 14px; height: 14px; }
.pw-page-ellipsis { display: inline-flex; justify-content: center; align-items: center; width: 24px; color: #8a9cb4; font-size: 12px; }
.pw-empty { display: grid; justify-items: center; place-content: center; min-height: 250px; padding: 34px 26px; text-align: center; }
.pw-empty > svg { width: 35px; height: 35px; margin-bottom: 13px; color: #9cb1d2; }
.pw-empty strong { color: #465f7e; font-size: 13px; }
.pw-empty p { max-width: 550px; color: #758aa4; font-size: 11px; line-height: 1.7; white-space: normal; }
.pw-loading { padding: 45px 26px; text-align: center; color: #7389a4; font-size: 12px; }

.pw-dialog { --pw-border: #dce6f3; width: min(1000px, calc(100vw - 36px)); max-width: none; max-height: calc(100dvh - 42px); padding: 0; border: 1px solid #d5e1f2; border-radius: 20px; color: var(--ink); background: #fff; box-shadow: 0 35px 110px #081e413b; }
.pw-dialog::backdrop { background: #1023407a; backdrop-filter: blur(5px); }
.pw-dialog > form { display: flex; flex-direction: column; max-height: calc(100dvh - 44px); }
.pw-dialog-head { display: flex; align-items: center; gap: 13px; padding: 22px 25px; border-bottom: 1px solid #e4ecf7; background: linear-gradient(120deg, #fff, #f7faff); }
.pw-dialog-icon { display: grid; place-items: center; width: 43px; height: 43px; flex: 0 0 auto; border: 1px solid #d9e4ff; border-radius: 12px; background: #eef3ff; color: var(--primary); }
.pw-dialog-icon svg { width: 24px; height: 24px; }
.pw-dialog-head > div { flex: 1; min-width: 0; }
.pw-dialog-head h2 { margin: 0; font-size: 20px; letter-spacing: -.025em; }
.pw-dialog-head p:last-child { margin: 7px 0 0; color: #7388a4; font-size: 10px; line-height: 1.6; }
.pw-close { width: 36px; height: 36px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid #dae4f4; border-radius: 10px; color: #7088a6; background: #fff; cursor: pointer; }
.pw-close svg { width: 18px; height: 18px; }
.pw-dialog-body { overflow: auto; padding: 24px 25px; }
.pw-dialog-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; padding: 17px 25px; border-top: 1px solid #e6edf7; background: #fbfcff; }
.pw-preview-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 20px; }
.pw-preview-summary > div { min-width: 0; padding: 16px 18px; border: 1px solid #dfe8f7; border-radius: 12px; background: #f9fbff; }
.pw-preview-summary span { display: block; color: #6d83a0; font-size: 10px; }
.pw-preview-summary strong { display: block; margin-top: 9px; color: #2e5481; font-size: 20px; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.pw-snapshot-table { max-height: 300px; border: 1px solid #e1e9f6; border-radius: 10px; }
.pw-snapshot-table table { min-width: 400px; }
.pw-snapshot-table th { position: sticky; top: 0; z-index: 2; }
.pw-snapshot-table td { height: auto; padding: 12px 17px; }
.pw-field { display: grid; gap: 8px; margin-top: 18px; color: #566f90; font-size: 11px; font-weight: 650; }
.pw-field input,
.pw-field textarea,
.pw-field select { width: 100%; min-width: 0; min-height: 42px; padding: 10px 12px; border: 1px solid #d4e0f2; border-radius: 9px; background: #fff; color: #294764; font: 400 12px "Roboto", Arial, sans-serif; }
.pw-field textarea { resize: vertical; }
.pw-field small { color: #7489a5; font-size: 9px; font-weight: 400; line-height: 1.5; }
.pw-checkbox { display: flex; align-items: flex-start; gap: 10px; margin-top: 20px; padding: 14px 15px; border: 1px solid #d7e3fb; border-radius: 10px; background: #f5f8ff; color: #546c8b; font-size: 11px; line-height: 1.7; }
.pw-checkbox input { width: 16px; height: 16px; flex: 0 0 auto; margin: 2px 0 0; accent-color: var(--primary); }
.pw-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 15px; }
.pw-payment-outstanding { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; border: 1px solid #dbe7f6; border-radius: 12px; background: #f5f9ff; color: #6e84a2; font-size: 12px; }
.pw-payment-outstanding strong { color: #1d497d; font-size: 23px; font-variant-numeric: tabular-nums; }
.pw-callout { padding: 13px 15px; border-radius: 9px; background: #fff8e9; color: #8f7543; font-size: 11px; line-height: 1.75; }
.pw-detail-status { display: flex; align-items: center; gap: 12px; margin-bottom: 17px; color: #7489a4; font-size: 10px; }
.pw-detail-note { white-space: pre-wrap; padding: 13px; background: #f8fafd; border-radius: 8px; color: #6b819d; font-size: 11px; line-height: 1.6; }
.pw-detail-history h3 { margin: 24px 0 13px; font-size: 14px; }
.pw-muted { color: #7389a4; font-size: 11px; }
.pw-payment-item { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: 9px; padding: 15px 17px; border: 1px solid #dfe8f4; border-radius: 11px; }
.pw-payment-item strong { color: #327c69; font-size: 15px; }
.pw-payment-item span,
.pw-payment-item small { display: block; margin-top: 5px; color: #7388a2; font-size: 10px; line-height: 1.5; }
.pw-payment-item.is-reversed { background: #faf8f9; }
.pw-payment-item.is-reversed strong { color: #98909b; text-decoration: line-through; }
.pw-payment-item .pw-reversal-reason { color: #ad7381; line-height: 1.6; }
.pw-unknown { padding: 35px; text-align: center; }
.pw-unknown > .pw-dialog-icon { margin: 0 auto 18px; }
.pw-unknown h2 { font-size: 22px; }
.pw-unknown p { max-width: 590px; margin: 15px auto 23px; color: #7385a0; font-size: 12px; line-height: 1.8; }

@media (max-width: 1180px) {
  .pw-balance-card { grid-template-columns: minmax(0, 1fr); gap: 17px; padding: 20px; }
  .pw-balance-card header { padding-right: 0; }
  .pw-balance-main { padding-left: 0; border-left: 0; }
  .pw-balance-metrics { grid-template-columns: 1.2fr 1fr 1fr 1.15fr; }
  .pw-balance { font-size: 25px; }
  .pw-balance-stat > strong { font-size: 18px; }
  .pw-list-heading { align-items: flex-start; }
}
@media (max-width: 960px) {
  .pw-heading { align-items: flex-start; gap: 16px; }
  .pw-heading h1 { font-size: 26px; }
  .pw-section-title { align-items: flex-start; flex-direction: column; gap: 8px; }
  .pw-balance-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 0; }
  .pw-balance-main { padding-left: 0; }
  .pw-balance-stat { padding-right: 15px; }
  .pw-balance-stat:nth-child(3) { padding-left: 0; border-left: 0; }
  .pw-balance-stat.is-pending { margin-left: 0; padding-left: 16px; }
  .pw-filters { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  #pw-store-filter { grid-column: 1 / -1; }
  #pw-date-filter { grid-column: 1 / -1; }
  .pw-filters > .pw-button { justify-self: start; }
  .pw-filters > #pw-reset { justify-self: end; }
  .pw-pagination { align-items: flex-start; flex-wrap: wrap; gap: 11px; }
  .pw-page-controls { margin-left: auto; }
  .pw-dialog { width: min(900px, calc(100vw - 26px)); }
}
@media (max-width: 760px) {
  .pw-heading { gap: 14px; margin-bottom: 22px; }
  .pw-heading h1 { font-size: 24px; }
  .pw-heading p:last-child { font-size: 11px; }
  .pw-readonly-label { font-size: 9px; }
  .pw-tabs { gap: 20px; padding: 0 16px; overflow-x: auto; }
  .pw-tabs button { font-size: 11px; }
  .pw-filters { padding: 17px 16px 0; }
  .pw-filter-note { padding: 0 16px; }
  .pw-list-heading { padding: 15px 16px; }
  .pw-selection { top: 76px; flex-wrap: wrap; margin: 12px 16px; }
  .pw-selection > div:last-child { margin-left: auto; }
  .pw-pagination { padding: 12px 16px; }
  .pw-page-summary { justify-content: space-between; width: 100%; }
  .pw-page-controls { justify-content: flex-start; width: 100%; margin: 0; }
  .pw-page-size { margin-left: auto; }
  .pw-feedback { margin: 10px 16px; }
  .pw-list > .pw-table-wrap { max-height: 560px; }
}
@media (max-width: 480px) {
  .pw-heading h1 { font-size: 22px; }
  .pw-heading > .pw-button { width: 40px; min-width: 40px; height: 40px; padding: 10px; font-size: 0; }
  .pw-heading > .pw-button svg { width: 19px; height: 19px; }
  .pw-balance-card { padding: 17px; border-radius: 13px; }
  .pw-balance { font-size: 24px; }
  .pw-balance-stat > strong { font-size: 17px; }
  .pw-balance-main,
  .pw-balance-stat { padding-top: 7px; padding-bottom: 7px; }
  .pw-balance-stat.is-pending { padding-right: 10px; padding-left: 12px; }
  .pw-balance-label,
  .pw-balance-stat > span { font-size: 9px; }
  .pw-start-note { padding: 11px 12px; }
  .pw-filters { gap: 13px 9px; }
  .pw-list-heading { gap: 10px; }
  .pw-list-heading p { max-width: 260px; }
  .pw-selection { position: static; align-items: stretch; }
  .pw-selection > div:last-child { width: 100%; margin-left: 0; justify-content: flex-end; }
  .pw-page-button { min-width: 32px; min-height: 34px; padding: 7px 9px; }
  .pw-page-controls { gap: 4px; }
  .pw-page-ellipsis { width: 18px; }
  .pw-dialog { width: calc(100vw - 18px); max-height: calc(100dvh - 20px); border-radius: 15px; }
  .pw-dialog > form { max-height: calc(100dvh - 22px); }
  .pw-dialog-head { padding: 17px 16px; gap: 10px; }
  .pw-dialog-head h2 { font-size: 17px; }
  .pw-dialog-icon { width: 35px; height: 35px; border-radius: 10px; }
  .pw-dialog-body { padding: 17px 16px; }
  .pw-dialog-actions { padding: 14px 16px; }
  .pw-preview-summary { gap: 7px; }
  .pw-preview-summary > div { padding: 12px 10px; }
  .pw-preview-summary strong { font-size: 15px; }
  .pw-preview-summary span { font-size: 9px; }
  .pw-form-grid { grid-template-columns: minmax(0, 1fr); }
  .pw-payment-outstanding strong { font-size: 20px; }
  .pw-payment-item { align-items: flex-start; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  .payables-workspace *,
  .pw-dialog * { transition: none !important; scroll-behavior: auto !important; animation: none !important; }
}
.payables-workspace .pw-list-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:10px}
.payables-workspace #pw-select-filtered{border-color:#b9caff;background:#f4f7ff;color:#2856c3;font-weight:750}
.payables-workspace #pw-select-filtered:disabled{opacity:.55;cursor:not-allowed}
.pw-dialog .pw-bulk-groups{margin:14px 0}.pw-dialog .pw-bulk-sample-title{font-size:13px;margin:24px 0 10px;color:#24446e}
.pw-dialog .pw-bulk-result{display:grid;gap:8px}.pw-dialog .pw-bulk-result article{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px;border:1px solid #dce6f5;border-radius:12px}
.pw-dialog .pw-bulk-result article div{display:grid;gap:6px}.pw-dialog .pw-bulk-result article span{font-size:11px;color:#6c7f9f}.pw-dialog .pw-bulk-result article b{font-size:13px;color:#2856a6}
@media(max-width:600px){.payables-workspace .pw-list-actions{width:100%;justify-content:space-between}.payables-workspace #pw-select-filtered{width:100%;justify-content:center}.pw-dialog .pw-bulk-result article{align-items:flex-start}}
