.ppc-extension-stats {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  width: min(780px, 100%);
  margin: 28px auto 0;
}

.ppc-extension-stats--left {
  justify-content: flex-start;
  margin-right: 0;
  margin-left: 0;
}

.ppc-extension-stats--right {
  justify-content: flex-end;
  margin-right: 0;
}

.ppc-extension-stats > .wp-block-group__inner-container {
  display: contents;
}

.ppc-extension-stats .policy-meta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  flex: 0 0 auto;
  flex-wrap: nowrap;
  max-width: 100%;
  min-height: 34px;
  margin: 0;
  padding: 0 12px;
  color: #24405f;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(191, 219, 254, 0.76);
  border-radius: 8px;
}

.ppc-extension-stats .policy-meta::before {
  content: "";
  flex: 0 0 15px;
  width: 15px;
  height: 15px;
  background: var(--primary-bright, #1a73e8);
  opacity: 0.88;
  -webkit-mask-image: var(--policy-meta-icon);
  mask-image: var(--policy-meta-icon);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.ppc-extension-stats .policy-meta--updated {
  --policy-meta-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.983 12.548a9 9 0 1 0 -8.45 8.436'/%3E%3Cpath d='M19 22v-6'/%3E%3Cpath d='M22 19l-3 -3l-3 3'/%3E%3Cpath d='M12 7v5l2.5 2.5'/%3E%3C/svg%3E");
}

.ppc-extension-stats .policy-meta--version {
  --policy-meta-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15.39 4.39a1 1 0 0 0 1.68-.474 2.5 2.5 0 1 1 3.014 3.015 1 1 0 0 0-.474 1.68l1.683 1.682a2.414 2.414 0 0 1 0 3.414L19.61 15.39a1 1 0 0 1-1.68-.474 2.5 2.5 0 1 0-3.014 3.015 1 1 0 0 1 .474 1.68l-1.683 1.682a2.414 2.414 0 0 1-3.414 0L8.61 19.61a1 1 0 0 0-1.68.474 2.5 2.5 0 1 1-3.014-3.015 1 1 0 0 0 .474-1.68l-1.683-1.682a2.414 2.414 0 0 1 0-3.414L4.39 8.61a1 1 0 0 1 1.68.474 2.5 2.5 0 1 0 3.014-3.015 1 1 0 0 1-.474-1.68l1.683-1.682a2.414 2.414 0 0 1 3.414 0z'/%3E%3C/svg%3E");
}

.ppc-extension-stats .policy-meta__label,
.ppc-extension-stats .policy-meta__value {
  flex: 0 0 auto;
  white-space: nowrap;
}

.ppc-extension-stats .policy-meta__label {
  color: #66778d;
  font-weight: 750;
}

.ppc-extension-stats .policy-meta__value {
  color: #24405f;
  font-weight: 800;
}

html[data-theme="dark"] .ppc-extension-stats .policy-meta {
  color: #a8d3ff;
  background: rgba(15, 23, 42, 0.86);
  border-color: rgba(148, 163, 184, 0.24);
}

html[data-theme="dark"] .ppc-extension-stats .policy-meta__value {
  color: #a8d3ff;
}

html[data-theme="dark"] .ppc-extension-stats .policy-meta__label {
  color: #8ea0b8;
}

@media (max-width: 760px) {
  .ppc-extension-stats {
    align-items: center;
    flex-direction: row;
    justify-content: center;
    gap: 8px;
    width: min(100%, calc(100vw - 32px));
    max-width: calc(100vw - 32px);
    min-width: 0;
  }

  .ppc-extension-stats .policy-meta {
    min-height: 32px;
    padding: 0 10px;
    font-size: 12px;
  }

  .ppc-extension-stats .policy-meta::before {
    flex-basis: 14px;
    width: 14px;
    height: 14px;
  }
}