/* Collections follow-up and the offline field page. */
/* ---- collections */
.dm-coll-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-bottom: 12px; }
@media (min-width: 768px) { .dm-coll-stats { grid-template-columns: repeat(4, 1fr); } }
.dm-coll-stat { background: var(--dm-card); border-radius: var(--dm-radius, 16px); box-shadow: var(--dm-shadow); padding: 12px 14px; border-inline-start: 4px solid var(--dm-border, #dfe5ee); display: flex; flex-direction: column; }
.dm-coll-stat small { color: var(--dm-muted); }
.dm-coll-stat strong { font-size: 1.25rem; direction: ltr; text-align: start; }
.dm-coll-stat span { font-size: .8rem; color: var(--dm-muted); }
.dm-coll-stat.navy { border-color: var(--dm-navy); } .dm-coll-stat.warn { border-color: #e0a526; } .dm-coll-stat.danger { border-color: #d64545; }
.dm-coll-bar { display: flex; height: 12px; border-radius: 6px; overflow: hidden; background: var(--dm-soft-2); }
.dm-coll-bar.sm { height: 6px; width: 100%; margin-top: 4px; }
.dm-coll-bar .b0, .dm-coll-legend .b0 { background: #4caf7d; } .dm-coll-bar .b1, .dm-coll-legend .b1 { background: #e0c14a; }
.dm-coll-bar .b2, .dm-coll-legend .b2 { background: #e08a3c; } .dm-coll-bar .b3, .dm-coll-legend .b3 { background: #d64545; }
.dm-coll-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 8px 0 14px; font-size: .84rem; color: var(--dm-muted); }
.dm-coll-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-inline-end: 5px; }
.dm-coll-reps, .dm-coll-filter { padding: 12px 14px; margin-bottom: 12px; }
.dm-coll-reprow { cursor: pointer; } .dm-coll-reprow:hover { background: var(--dm-soft); }
.dm-coll-rows { display: flex; flex-direction: column; gap: 8px; }
.dm-coll-row { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; text-align: start; width: 100%; background: var(--dm-card); border: 1px solid var(--dm-border, #e3e8f0); border-radius: 14px; padding: 10px 14px; box-shadow: var(--dm-shadow); color: inherit; }
.dm-coll-row:hover { box-shadow: var(--dm-shadow-lift); }
.dm-coll-main { display: flex; flex-direction: column; min-width: 0; }
.dm-coll-main small { color: var(--dm-muted); }
.dm-coll-rep { color: var(--dm-gold-dark) !important; }
.dm-coll-amt { display: flex; flex-direction: column; align-items: flex-end; min-width: 120px; }
.dm-coll-age { font-size: .78rem; font-weight: 700; border-radius: 10px; padding: 1px 9px; justify-self: start; }
.dm-coll-age.ok { background: #dff3e9; color: #1d6b43; } .dm-coll-age.mid { background: #fbf0c8; color: #7a6212; } .dm-coll-age.warn { background: #fbe3c9; color: #8a4a10; } .dm-coll-age.danger { background: #fbe1de; color: #a12828; }
.dm-coll-prom { justify-self: end; font-size: .84rem; text-align: end; }
.dm-coll-head { display: flex; flex-wrap: wrap; gap: 10px 22px; padding: 4px 0 12px; border-bottom: 1px solid var(--dm-soft-2); margin-bottom: 12px; }
.dm-coll-head div { display: flex; flex-direction: column; } .dm-coll-head small { color: var(--dm-muted); }
.dm-coll-form { background: var(--dm-soft); border-radius: 14px; padding: 12px; }
.dm-coll-note { border: 1px solid var(--dm-soft-2); border-radius: 12px; padding: 8px 12px; margin-bottom: 8px; }
.dm-coll-note-top { display: flex; justify-content: space-between; gap: 8px; color: var(--dm-muted); }
.dm-coll-note-text { white-space: pre-wrap; word-break: break-word; }
.dm-coll-note-act { margin-top: 6px; }
.dm-pill { border-radius: 10px; padding: 0 9px; font-size: .75rem; font-weight: 700; }
.dm-pill.open { background: #dbe9f7; color: #3249c9; } .dm-pill.kept { background: #dff3e9; color: #1d6b43; } .dm-pill.broken { background: #fbe1de; color: #a12828; } .dm-pill.cancelled { background: var(--dm-soft-2); color: var(--dm-muted); }

/* ---- field (offline) page */
.dm-f-status { padding: 10px 14px; margin-bottom: 12px; }
.dm-f-line { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.dm-f-btns { margin-inline-start: auto; display: flex; gap: 6px; }
.dm-f-pill { border-radius: 12px; padding: 2px 10px; font-weight: 700; font-size: .84rem; }
.dm-f-pill.on { background: #dff3e9; color: #1d6b43; } .dm-f-pill.off { background: #fbe3c9; color: #8a4a10; }
.dm-f-warn { background: #fbf0c8; color: #6b5510; border-radius: 10px; padding: 6px 10px; margin-top: 8px; font-size: .88rem; }
.dm-f-form { padding: 14px; }
.dm-f-results { display: flex; flex-direction: column; margin-top: 6px; }
.dm-f-res { display: grid; grid-template-columns: 1fr auto; gap: 0 10px; text-align: start; border: 0; border-bottom: 1px solid var(--dm-soft-2); background: none; padding: 8px 6px; color: inherit; }
.dm-f-res:hover { background: var(--dm-soft); } .dm-f-res small { color: var(--dm-muted); grid-column: 1; }
.dm-f-client { display: flex; justify-content: space-between; align-items: center; gap: 10px; background: var(--dm-soft); border-radius: 12px; padding: 10px 12px; }
.dm-f-bal { font-size: .88rem; color: var(--dm-muted); }
.dm-f-line-item { display: grid; grid-template-columns: 1fr 76px 88px auto; gap: 6px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--dm-soft-2); }
.dm-f-li-name { display: flex; flex-direction: column; min-width: 0; }
.dm-f-total { display: flex; flex-wrap: wrap; gap: 6px 20px; margin-top: 10px; padding: 10px 12px; background: var(--dm-soft); border-radius: 12px; }
.dm-f-total > div:not(.dm-f-warn) { display: flex; flex-direction: column; } .dm-f-total .dm-f-warn { width: 100%; margin: 0; }
.dm-f-doc { background: var(--dm-card); border-radius: 14px; box-shadow: var(--dm-shadow); padding: 10px 14px; margin-bottom: 8px; border-inline-start: 4px solid var(--dm-border, #dfe5ee); }
.dm-f-doc.done { border-color: #4caf7d; } .dm-f-doc.pending, .dm-f-doc.sending { border-color: #e0a526; } .dm-f-doc.rejected, .dm-f-doc.attention { border-color: #d64545; }
.dm-f-doc-top, .dm-f-doc-mid { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.dm-f-doc-mid small { color: var(--dm-muted); }
.dm-f-doc-msg { color: #a12828; font-size: .9rem; margin-top: 4px; } .dm-f-doc-act { margin-top: 8px; }
.dm-f-st { font-size: .75rem; font-weight: 700; border-radius: 10px; padding: 1px 9px; background: var(--dm-soft-2); }
.dm-f-st.done { background: #dff3e9; color: #1d6b43; } .dm-f-st.rejected, .dm-f-st.attention { background: #fbe1de; color: #a12828; } .dm-f-st.pending, .dm-f-st.sending { background: #fbf0c8; color: #6b5510; }
.dm-f-cl { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; padding: 8px 0; border-bottom: 1px solid var(--dm-soft-2); align-items: center; }
.dm-f-cl small { display: block; color: var(--dm-muted); } .dm-f-cl-act { grid-column: 1 / -1; display: flex; gap: 6px; }