.yz-volunteer-progress {
  box-sizing: border-box;
  width: calc(100% - 44px);
  max-width: calc(100% - 44px);
  min-width: 0;
  margin: 14px auto;
  padding: 13px 14px;
  border: 1px solid #b9dfcc;
  border-radius: 17px;
  color: #12392b !important;
  background: #f1fbf6 !important;
  box-shadow: 0 10px 28px rgba(6, 118, 71, .08);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Tahoma, Arial, sans-serif;
  line-height: 1.55;
  text-align: start;
  color-scheme: only light;
  forced-color-adjust: none;
  overflow: hidden;
  overflow-wrap: anywhere;
}
.yz-volunteer-progress[hidden] { display: none !important; }
.yz-volunteer-progress.is-warning { border-color: #e8c66f !important; background: #fff9e9 !important; }
.yz-volunteer-progress.is-success { border-color: #86d1a8 !important; background: #edfbf3 !important; }
.yz-volunteer-progress.is-stale { border-style: dashed; }
.yz-volunteer-progress-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; min-width: 0; }
.yz-volunteer-progress-head strong { min-width: 0; color: #075d3a !important; font-size: 15px; }
.yz-volunteer-progress.is-warning .yz-volunteer-progress-head strong { color: #81570e !important; }
.yz-volunteer-progress-head a { flex: 0 0 auto; color: #067647 !important; font-size: 12px; font-weight: 800; text-decoration: none; }
.yz-volunteer-progress-metrics { display: flex; flex-wrap: wrap; gap: 6px 12px; margin-top: 6px; color: #405b50 !important; font-size: 13px; }
.yz-volunteer-progress-metrics span { min-width: 0; color: #405b50 !important; }
.yz-volunteer-progress-metrics b { color: #102b21 !important; font-variant-numeric: tabular-nums; }
.yz-volunteer-progress-note { display: block; margin-top: 5px; color: #6f5012 !important; font-size: 12px; font-weight: 700; }
html[data-volunteer-language="en"] .yz-volunteer-progress { direction: ltr; }
html:not([data-volunteer-language="en"]) .yz-volunteer-progress { direction: rtl; }
@media (max-width: 430px) {
  .yz-volunteer-progress {
    width: calc(100% - 32px);
    max-width: calc(100% - 32px);
    padding: 12px;
    border-radius: 15px;
  }
  .yz-volunteer-progress-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .yz-volunteer-progress-metrics span { white-space: nowrap; }
}
@media (max-width: 340px) {
  .yz-volunteer-progress-head { display: grid; }
  .yz-volunteer-progress-metrics { grid-template-columns: 1fr; }
}
