.pm-purchase { color: #58677e; font-size: 12px; }
.pm-create-grid.pm-purchase-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px 24px; }
.pm-create-modal .pm-purchase-grid > label > span, .pm-create-modal .pm-purchase-grid > .pm-create-field > span:first-child { flex: 0 0 94px; }
.pm-purchase-input { display: flex; align-items: center; flex: 1; min-width: 0; border: 1px solid #cfd9e8; border-radius: 4px; background: #fff; transition: border-color .15s, box-shadow .15s; }
.pm-purchase-input:hover { border-color: #a8bedc; }
.pm-purchase-input:focus-within { border-color: #3978ff; box-shadow: 0 0 0 2px #3978ff12; }
.pm-purchase :is(input) { width: 100%; min-width: 0; height: 32px; padding: 6px 10px; border: 1px solid #cfd9e8; border-radius: 4px; color: #40516c; background: #fff; font: inherit; }
.pm-purchase input::placeholder { color: #a5b2c5; }
.pm-purchase .pm-purchase-input > input { flex: 1; width: 0; border: 0; box-shadow: none; outline: none; }
.pm-create-modal .pm-purchase .pm-purchase-input > input:is(:focus, :focus-visible) { outline: none; outline-offset: 0; box-shadow: none; }
.pm-purchase-dimensions > input:focus { background: #f5f9ff; }
.pm-purchase-dimensions > input:first-child { border-radius: 3px 0 0 3px; }
.pm-purchase-table > tbody > tr > td > input:focus { outline: none; border-color: #3978ff; box-shadow: 0 0 0 2px #3978ff12; }
.pm-purchase-input em { flex-shrink: 0; padding: 0 9px; font-style: normal; color: #8190a4; }
.pm-purchase-dimensions > input + input { border-left: 1px solid #d9e1ee !important; border-radius: 0; }
.pm-purchase-dimensions > em { align-self: stretch; display: flex; align-items: center; border-left: 1px solid #d9e1ee; background: #f6f8fc; }
.pm-purchase-heading { display: flex; align-items: center; gap: 12px; margin: 32px 0 20px; }
.pm-create-section .pm-purchase-heading h3 { margin: 0; }
.pm-purchase-system { display: flex; }
.pm-purchase-system button { padding: 5px 10px; border: 1px solid #cfd9e8; background: #fff; color: #58677e; font: inherit; }
.pm-purchase-system button:first-child { border-radius: 3px 0 0 3px; }
.pm-purchase-system button:last-child { margin-left: -1px; border-radius: 0 3px 3px 0; }
.pm-purchase-system button[aria-pressed=true] { position: relative; border-color: #3978ff; color: #2869ff; background: #f5f8ff; }
.pm-purchase-specs { display: flex; gap: 24px; margin-bottom: 20px; }
.pm-purchase-specs > div { display: flex; align-items: center; gap: 8px; width: 380px; min-width: 0; }
.pm-purchase-specs > div > span { white-space: nowrap; }
.pm-purchase-unit { position: relative; flex: 0 0 56px; border-left: 1px solid #d9e1ee; }
.pm-purchase-unit summary { display: flex; justify-content: space-between; align-items: center; height: 32px; padding: 0 9px; cursor: pointer; list-style: none; background: #f8faff; border-radius: 0 3px 3px 0; }
.pm-purchase-unit summary::-webkit-details-marker { display: none; }
.pm-purchase-unit summary:hover, .pm-purchase-unit[open] summary { background: #eef4ff; color: #2869db; }
.pm-purchase-unit summary:focus-visible { outline: 1px solid #3978ff; outline-offset: -3px; }
.pm-purchase-unit summary span { width: 6px; height: 6px; margin: -3px 1px 0 6px; border-right: 1px solid #8fa4c0; border-bottom: 1px solid #8fa4c0; font-size: 0; transform: rotate(45deg); transition: transform .15s; }
.pm-purchase-unit[open] summary span { margin-top: 3px; transform: rotate(225deg); }
.pm-purchase-unit > div { position: absolute; top: 100%; right: 0; z-index: 5; min-width: 70px; padding: 4px; border: 1px solid #dde5f0; border-radius: 4px; box-shadow: 0 6px 18px #263f6826; background: #fff; }
.pm-purchase-unit button { display: block; width: 100%; border: 0; border-radius: 3px; padding: 7px; background: #fff; color: #58677e; text-align: left; font: inherit; }
.pm-purchase-unit button:hover, .pm-purchase-unit button[aria-pressed=true] { background: #eef4ff; color: #2869ff; }
.pm-purchase-unit button[aria-pressed=true]::after { content: '✓'; float: right; margin-left: 10px; }
.pm-purchase-table-wrap { border: 1px solid #e0e5ee; border-radius: 4px; overflow-x: auto; }
.pm-purchase-table { width: 100%; min-width: 1200px; border-collapse: collapse; table-layout: fixed; }
.pm-purchase-table th { height: 40px; padding: 0 8px; background: #f5f7fa; color: #53647c; text-align: left; font-weight: 500; }
.pm-purchase-table th:first-child { width: 44px; text-align: center; }
.pm-purchase-table th:nth-child(2) { width: 17%; }
.pm-purchase-table th:nth-child(3) { width: 11%; }
.pm-purchase-table th:nth-child(4), .pm-purchase-table th:nth-child(5) { width: 18%; }
.pm-purchase-table th:last-child { width: 55px; text-align: right; }
.pm-purchase-table i { color: #db6d75; margin-right: 4px; font-style: normal; }
.pm-purchase-table td { padding: 10px 8px; border-top: 1px solid #e5eaf2; vertical-align: middle; }
.pm-purchase-table tbody tr:hover { background: #fafcff; }
.pm-purchase-table td:first-child { text-align: center; }
.pm-purchase-table td:last-child { text-align: right; }
.pm-purchase-table td > input { transition: border-color .15s, box-shadow .15s; }
.pm-purchase-table td > input:hover { border-color: #a8bedc; }
.pm-purchase :is(.pm-purchase-specs, .pm-purchase-table) input[type=number] { appearance: textfield; -moz-appearance: textfield; }
.pm-purchase :is(.pm-purchase-specs, .pm-purchase-table) input::-webkit-inner-spin-button,
.pm-purchase :is(.pm-purchase-specs, .pm-purchase-table) input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.pm-purchase-remove { border: 0; border-radius: 3px; padding: 6px 4px; background: transparent; color: #5278b2; font: inherit; }
.pm-purchase-remove:hover { color: #d65c66; background: #fff1f2; }
.pm-purchase-table-footer { padding: 8px 12px; border-top: 1px solid #e5eaf2; min-height: 90px; }
.pm-purchase-add { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border: 1px solid #3978ff; border-radius: 4px; background: #fff; color: #2869ff; font-size: 24px; line-height: 1; }
.pm-purchase-empty { color: #94a2b6; height: 48px; }
@media(max-width:1500px) { .pm-create-grid.pm-purchase-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media(max-width:900px) { .pm-create-grid.pm-purchase-grid { grid-template-columns: 1fr; } .pm-purchase-specs { flex-direction: column; } .pm-purchase-specs > div { width: 100%; } }