.purchase-expenses-hero { display:flex; justify-content:space-between; gap:24px; align-items:center; margin-bottom:18px; padding:24px; border:1px solid #d9e6df; border-radius:16px; background:linear-gradient(135deg,#fff 0%,#f1f8f4 100%); }
.purchase-expenses-hero .intro span { display:block; margin-bottom:6px; color:#16805a; font-size:11px; font-weight:800; letter-spacing:.09em; }
.purchase-expenses-hero h2 { margin:0 0 6px; font-size:23px; }
.purchase-expenses-hero p { margin:0; color:#61716a; }
.purchase-expense-summary { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:16px; }
.purchase-expense-summary span { padding:8px 12px; border:1px solid #dce5e0; border-radius:999px; background:#fff; color:#52645b; font-size:12px; }
.purchase-expense-summary b { color:#173e2e; }
.purchase-expense-catalog { display:grid; gap:16px; }
.expense-category-card { overflow:hidden; border:1px solid #dce5e0; border-radius:16px; background:#fff; box-shadow:0 4px 18px rgba(19,59,43,.04); }
.expense-category-head { display:grid; grid-template-columns:minmax(220px,1fr) auto auto; gap:14px; align-items:center; padding:16px 18px; border-bottom:1px solid #e5ece8; background:#fbfdfc; }
.expense-category-name { display:flex; align-items:center; gap:10px; }
.expense-category-name > span { display:grid; place-items:center; width:36px; height:36px; border-radius:10px; background:#e7f5ee; color:#08764e; }
.expense-category-name input { width:100%; max-width:360px; border:0; border-bottom:1px solid transparent; background:transparent; color:#123d2d; font-size:17px; font-weight:800; }
.expense-category-name input:focus { border-bottom-color:#16805a; outline:0; }
.expense-required-toggle { display:flex; align-items:center; gap:9px; padding:8px 11px; border:1px solid #d7e2dc; border-radius:10px; color:#52645b; font-size:12px; font-weight:700; cursor:pointer; }
.expense-required-toggle:has(input:checked) { border-color:#e9a23b; background:#fff6e7; color:#9a5700; }
.expense-required-toggle input { accent-color:#d78313; }
.expense-item-list { display:grid; gap:10px; padding:16px 18px 10px; }
.expense-item-row { display:grid; grid-template-columns:minmax(150px,1.25fr) 120px 130px minmax(180px,1.5fr) 38px; gap:10px; align-items:end; padding:12px; border:1px solid #e4ebe7; border-radius:12px; background:#fff; }
.expense-item-row label { display:grid; gap:5px; color:#6a7972; font-size:11px; }
.expense-item-row input { min-width:0; width:100%; padding:9px 10px; border:1px solid #d7e1dc; border-radius:8px; background:#fbfcfb; }
.expense-category-actions { display:flex; justify-content:space-between; align-items:center; padding:8px 18px 16px; }
.expense-category-empty { padding:18px; border:1px dashed #d8e1dc; border-radius:10px; color:#77857e; text-align:center; }
.purchase-expense-savebar { position:sticky; bottom:14px; z-index:3; display:flex; justify-content:space-between; gap:16px; align-items:center; margin-top:18px; padding:13px 15px; border:1px solid #d4e3db; border-radius:13px; background:rgba(255,255,255,.96); box-shadow:0 10px 28px rgba(17,51,38,.12); }
.purchase-expense-savebar > span { display:flex; gap:8px; align-items:center; color:#65756d; font-size:12px; }
.product-expense-fieldset > p { margin:14px 18px 18px; color:#74817b; font-size:11px; }
.product-expense-picker { display:grid; gap:8px; margin: 14px 18px 18px;}
.product-expense-choice-group { overflow:hidden; padding:0; border:1px solid #dce5e0; border-radius:9px; background:#fff; }
.product-expense-choice-group.required-missing,.product-expense-choice-group.completion-missing { border-color:#e7a43b; background:#fff; box-shadow:inset 3px 0 #e7a43b; }
.product-expense-group-head { display:flex; justify-content:space-between; gap:12px; align-items:center; min-height:36px; margin:0; padding:8px 12px; border-bottom:1px solid #e8eeea; background:#f8faf9; }
.product-expense-group-head b { color:#254438; font-size:12px; }
.product-expense-group-head span { padding:3px 7px; border-radius:999px; background:#fff0da; color:#9d5d05; font-size:8px; font-weight:800; letter-spacing:.03em; text-transform:uppercase; }
.product-expense-options { display:block; }
.product-expense-option { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:center; min-height:44px; padding:8px 12px; border-bottom:1px solid #edf1ef; background:#fff; transition:background .15s ease; }
.product-expense-option:last-child { border-bottom:0; }
.product-expense-option:hover { background:#f8fbf9; }
.product-expense-option:has(input[type=checkbox]:checked) { background:#f0f8f4; }
.product-expense-choice { display:flex; align-items:center; gap:10px; min-width:0; cursor:pointer; }
.product-expense-choice input[type=checkbox] { width:15px; height:15px; flex:0 0 auto; margin:0; accent-color:#08764e; }
.product-expense-choice > span { min-width:0; }
.product-expense-option strong,.product-expense-option small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.product-expense-option strong { color:#243a31; font-size:12px; font-weight:700; }
.product-expense-option small { margin-top:2px; color:#839088; font-size:9px; font-weight:400; }
.product-expense-option-end { display:flex; align-items:center; justify-content:flex-end; gap:9px; }
.product-expense-option em { min-width:54px; color:#08764e; font-size:12px; font-style:normal; font-weight:800; text-align:right; white-space:nowrap; }
.product-expense-quantity-wrap { display:flex; align-items:center; gap:3px; color:#7b8981; font-size:10px; }
.product-expense-quantity { width:43px; height:27px; padding:3px 5px; border:1px solid #d3ded8; border-radius:6px; background:#fff; color:#40544a; font-size:11px; text-align:center; }
.product-expense-total { display:flex; justify-content:flex-end; gap:7px; padding:5px 2px 0; color:#65756d; font-size:11px; }
.product-expense-total b { color:#08764e; }
.product-expense-empty { padding:12px; border:1px dashed #d6dfda; border-radius:10px; color:#78867f; text-align:center; }
.product-expense-legacy { padding:10px 12px; border:1px dashed #cbd6d0; border-radius:10px; background:#f8faf9; }
.product-expense-legacy div { display:flex; justify-content:space-between; gap:10px; align-items:center; margin-top:7px; }
@media (max-width:900px) { .expense-item-row { grid-template-columns:1fr 1fr; } .expense-item-row label:first-child,.expense-item-row label:nth-child(4) { grid-column:1/-1; } .expense-category-head { grid-template-columns:1fr; } .purchase-expenses-hero,.purchase-expense-savebar { align-items:stretch; flex-direction:column; } }