/* BundleAward offer-test page only. Colours and radius come from styles.css. */

body[data-family="bundleaward"] .btn-buy {
  background: hsl(var(--primary-surface));
  color: hsl(var(--primary-foreground));
  min-height: 44px;
}

body[data-family="bundleaward"] .btn-buy:hover,
body[data-family="bundleaward"] .btn-buy:focus-visible {
  background: hsl(var(--primary-surface-hover));
}

body[data-family="bundleaward"] caption {
  caption-side: top;
  text-align: left;
  padding: .75rem 1.125rem .25rem;
  color: var(--muted-fg);
  font-weight: 500;
}

body[data-family="bundleaward"] .ba-trail {
  margin: 0;
  padding: 1rem 1.125rem 1.25rem 2.25rem;
  color: var(--fg);
}

body[data-family="bundleaward"] .ba-trail li {
  margin: 0 0 .5rem;
}

body[data-family="bundleaward"] .ba-faq {
  display: grid;
  gap: .75rem;
  margin: 0 0 1rem;
}

body[data-family="bundleaward"] .ba-faq details {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  padding: .9rem 1.125rem;
}

body[data-family="bundleaward"] .ba-faq summary {
  cursor: pointer;
  font-weight: 650;
  min-height: 44px;
  display: flex;
  align-items: center;
}

body[data-family="bundleaward"] .ba-faq details p {
  margin: .75rem 0 0;
  color: var(--muted-fg);
}

@media (max-width: 640px) {
  body[data-family="bundleaward"] .wrap,
  body[data-family="bundleaward"] p,
  body[data-family="bundleaward"] li {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  body[data-family="bundleaward"] .evidence {
    max-width: 100%;
    overflow: hidden;
  }

  body[data-family="bundleaward"] .scroll {
    max-width: 100%;
    overflow-x: auto;
  }
}