/* ─────────────────────────────────────────────────────────────
   togo-trust-pills.css
   Sitewide trust-signal pill row.
   Rendered above the footer on commercial pages.
   Subtle, brand-tinted, non-intrusive.
   Light + dark mode both work via tokens.
   ───────────────────────────────────────────────────────────── */

.tgp-trust-pills {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
  gap: 14px;
  padding: 24px 0;
  margin: 32px 0 0;
}

.tgp-trust-pills__pill {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  background: var(--color-bg-elevated, #0e0e11);
  border: 1px solid var(--color-border-soft, rgba(255, 255, 255, 0.08));
  border-radius: 12px;
  color: var(--color-text-muted, rgba(255, 255, 255, 0.7));
  font-size: 13px;
  font-weight: 500;
  line-height: 1.4;
  transition: border-color 200ms ease, transform 200ms ease;
  will-change: transform;
}

.tgp-trust-pills__pill:hover {
  border-color: rgba(216, 35, 47, 0.4);
  transform: translateY(-2px);
}

.tgp-trust-pills__icon {
  flex: none;
  width: 20px;
  height: 20px;
  color: var(--tgp-brand-red, #D31E27);
}

.tgp-trust-pills__label {
  display: block;
  min-width: 0;
}

.tgp-trust-pills__label strong {
  display: block;
  color: var(--color-text, #fff);
  font-weight: 700;
  font-size: 13px;
  margin-bottom: 2px;
}

/* Reduce motion — drop the lift animation for users who request it */
@media (prefers-reduced-motion: reduce) {
  .tgp-trust-pills__pill,
  .tgp-trust-pills__pill:hover {
    transition: none;
    transform: none;
  }
}

/* ─────────────────────────────────────────────────────────────
   Cluster 08 — Trust & conversion signals (additive)
   PDP buy-area expanded trust strip + policy explainer cards
   + About TogoPeptide trust micro-card + checkout pay pills.
   Kept token-aligned, factual copy only.
   ───────────────────────────────────────────────────────────── */

/* Inline single-line pill row used near buy / pay areas (compact). */
.tgp-trust-pills--inline {
  grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
  gap: 8px;
  padding: 0;
  margin: var(--space-4, 16px) 0 0;
}

.tgp-trust-pills--inline .tgp-trust-pills__pill {
  padding: 10px 12px;
  font-size: 12px;
  border-radius: 10px;
}

.tgp-trust-pills--inline .tgp-trust-pills__icon {
  width: 16px;
  height: 16px;
}

.tgp-trust-pills--inline .tgp-trust-pills__label strong {
  font-size: 12px;
  margin-bottom: 1px;
}

/* Policy explainer cards — small inline links to /returns + /shipping. */
.tgp-policy-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
  gap: 12px;
  margin: var(--space-5, 20px) 0 0;
}

.tgp-policy-cards__card {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  background: var(--color-bg-elevated, #0e0e11);
  border: 1px solid var(--color-border-soft, rgba(255, 255, 255, 0.08));
  border-radius: 12px;
  color: var(--color-text-muted, rgba(255, 255, 255, 0.7));
  font-size: 13px;
  line-height: 1.45;
  text-decoration: none;
  transition: border-color 200ms ease, transform 200ms ease;
}

.tgp-policy-cards__card:hover,
.tgp-policy-cards__card:focus-visible {
  border-color: rgba(216, 35, 47, 0.4);
  transform: translateY(-2px);
}

.tgp-policy-cards__icon {
  flex: none;
  width: 22px;
  height: 22px;
  color: var(--tgp-brand-red, #D31E27);
  margin-top: 1px;
}

.tgp-policy-cards__body {
  display: block;
  min-width: 0;
}

.tgp-policy-cards__body strong {
  display: block;
  color: var(--color-text, #fff);
  font-weight: 700;
  font-size: 13.5px;
  margin-bottom: 2px;
}

.tgp-policy-cards__cta {
  display: inline-block;
  margin-top: 4px;
  font-size: 12px;
  color: var(--tgp-brand-red, #D31E27);
  font-weight: 600;
}

@media (prefers-reduced-motion: reduce) {
  .tgp-policy-cards__card,
  .tgp-policy-cards__card:hover,
  .tgp-policy-cards__card:focus-visible {
    transition: none;
    transform: none;
  }
}

/* About TogoPeptide trust micro-card — small inline card on PDP. */
.tgp-trust-microcard {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  background: var(--color-bg-elevated, #0e0e11);
  border: 1px solid var(--color-border-soft, rgba(255, 255, 255, 0.08));
  border-radius: 12px;
  margin: var(--space-5, 20px) 0 0;
  font-size: 12.5px;
  color: var(--color-text-muted, rgba(255, 255, 255, 0.7));
  line-height: 1.45;
}

.tgp-trust-microcard__icon {
  flex: none;
  width: 28px;
  height: 28px;
  color: var(--tgp-brand-red, #D31E27);
}

.tgp-trust-microcard__body {
  display: block;
  min-width: 0;
}

.tgp-trust-microcard__body strong {
  display: block;
  color: var(--color-text, #fff);
  font-weight: 700;
  font-size: 13px;
  margin-bottom: 2px;
}

.tgp-trust-microcard__meta {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  margin-top: 2px;
  font-size: 11.5px;
}

.tgp-trust-microcard__meta span {
  white-space: nowrap;
}

.tgp-trust-microcard__cta {
  margin-left: auto;
  flex: none;
  font-size: 12px;
  color: var(--tgp-brand-red, #D31E27);
  font-weight: 600;
  text-decoration: none;
}

.tgp-trust-microcard__cta:hover,
.tgp-trust-microcard__cta:focus-visible {
  text-decoration: underline;
}

@media (max-width: 480px) {
  .tgp-trust-microcard {
    flex-wrap: wrap;
  }
  .tgp-trust-microcard__cta {
    margin-left: 0;
    width: 100%;
  }
}