/* Shared spacing for BizOne ecosystem and POS benefit illustrations. */
.thl-value-spacing {
  --value-screen-padding:20px;
  --value-screen-inset:24px;
  --value-screen-row-gap:10px;
  --value-screen-border:#e3e5e9;
}
.thl-value-spacing :is(.thl-value-grid,.colla-benefits) > article > :is(.product-benefit,.value-picture,.benefit-visual),
.thl-value-spacing.thl-value-grid > article > :is(.product-benefit,.value-picture,.benefit-visual) {
  box-sizing:border-box;
  margin:var(--value-screen-inset)!important;
  padding:var(--value-screen-padding)!important;
  border:1px solid var(--value-screen-border)!important;
  background:#fff!important;
  border-radius:10px;
  min-width:0;
  max-width:calc(100% - 48px);
  overflow:visible;
}
/* A single padding owner prevents doubled white mats around screens. */
.thl-value-spacing.thl-value-spacing :is(.thl-pos-value-visual,.thl-value-excerpt):has(> :is(.pos-value-screen,.thl-value-screen)) {
  padding:0!important;
}
.thl-value-spacing :is(.pos-value-screen,.thl-value-screen) {padding:var(--value-screen-padding)!important}
.thl-value-spacing.thl-value-spacing :is(.product-benefit,.value-picture):has(>img),
.thl-value-spacing.thl-value-grid > article > .value-picture:has(>img) {padding:0!important}
.thl-value-spacing .value-flow {gap:var(--value-screen-row-gap)!important}
.thl-value-spacing .value-flow > :is(span,strong) {margin:0!important;padding:10px!important}
.thl-value-spacing :is(.pos-checklist,.pos-store-list,.pos-customer-fields,.thl-value-screen-rows) {gap:var(--value-screen-row-gap)}
@media(max-width:1100px) {
  .thl-value-spacing :is(.thl-value-grid,.colla-benefits) > article,
  .thl-value-spacing.thl-value-grid > article {
    grid-template-columns:minmax(0,1fr)!important;
  }
}