/**
 * Open source contributions section (_includes/opensource.html).
 */

.opensource-stats {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 20px;
  margin: 30px 0;
}

.opensource-stat {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-width: 120px;
  padding: 10px 20px;
}

.opensource-stat-number {
  font-family: 'PT Sans', Arial, Helvetica, sans-serif;
  font-weight: bold;
  font-size: 32px;
  font-size: 2rem;
  color: #c0392b;
}

.section-wrapper.patterned-bg .opensource-stat-number {
  color: #f5a623;
}

.opensource-stat-label {
  font-family: 'PT Sans', sans-serif;
  font-size: 14.4px;
  font-size: 0.9rem;
  color: #404040;
  text-align: center;
}

.section-wrapper.patterned-bg .opensource-stat-label {
  color: #fff;
}

.opensource-grid {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 16px;
  margin-top: 20px;
}

.opensource-item {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 300px;
          flex: 1 1 300px;
  max-width: 380px;
  box-sizing: border-box;
  display: block;
  padding: 14px 16px;
  border: 1px solid #222;
  border-radius: 2px;
  color: #404040;
  text-decoration: none;
  transition: all 0.2s ease-out;
}

.opensource-item:hover {
  background: #222;
  color: #fff;
  border-color: #222;
}

.opensource-item:hover .opensource-repo,
.opensource-item:hover .opensource-title {
  color: #fff;
}

.opensource-item-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 8px;
}

.opensource-repo {
  font-family: 'PT Sans', Arial, Helvetica, sans-serif;
  font-weight: bold;
  font-size: 14.4px;
  font-size: 0.9rem;
  color: #222;
}

.opensource-badge {
  font-size: 12px;
  font-size: 0.75rem;
  padding: 2px 8px;
  border-radius: 10px;
  white-space: nowrap;
}

.opensource-badge-merged {
  background: #2980b9;
  color: #fff;
}

.opensource-badge-open {
  background: transparent;
  border: 1px solid #222;
  color: #222;
}

.opensource-badge-closed {
  background: transparent;
  border: 1px solid #999;
  color: #999;
}

.opensource-title {
  margin: 8px 0 0;
  font-family: 'PT Sans', sans-serif;
  font-size: 15px;
  color: inherit;
}

.section-wrapper.patterned-bg .opensource-item {
  border-color: #fff;
  color: #fff;
}

.section-wrapper.patterned-bg .opensource-repo {
  color: #fff;
}

.section-wrapper.patterned-bg .opensource-badge-open {
  border-color: #fff;
  color: #fff;
}

.section-wrapper.patterned-bg .opensource-item:hover {
  background: #fff;
  color: #222;
  border-color: #fff;
}

.section-wrapper.patterned-bg .opensource-item:hover .opensource-repo,
.section-wrapper.patterned-bg .opensource-item:hover .opensource-title {
  color: #222;
}