#opportunities { padding-bottom: 12px; }
.opportunities-header p { margin-top: 8px; }
.opportunity-list { display: grid; gap: 12px; list-style: none; margin: 0; padding: 0; }
.opportunity-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 15rem) auto; align-items: center; gap: 12px; margin: 0; }
.opportunity-card h2 { font-size: 1.1rem; margin: 4px 0 8px; overflow-wrap: anywhere; }
.opportunity-card .order-state { display: inline-block; }
.opportunity-card .detail-field { margin: 0; }
.opportunity-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-block: 16px; }
.opportunity-actions > button { max-width: 100%; }
#opportunity-detail > p { margin-block: 10px; }
#opportunity-dialog { max-height: calc(100dvh - 24px); padding: clamp(14px, 3vw, 22px); overscroll-behavior: contain; }
#opportunity-detail .detail-section + .detail-section { margin-top: 10px; }
#opportunity-notice:empty { display: none; }
@media (max-width: 900px) { #opportunities { margin-top: 20px; } }
@media (max-width: 720px) {
  .opportunity-card { grid-template-columns: minmax(0, 1fr); }
  .opportunity-card > button { justify-self: start; }
}
@media (max-width: 390px) {
  .opportunity-actions { display: grid; }
}