:root {
  --services-os-accent: #18d886;
  --services-os-accent-rgb: 24, 216, 134;
  --venues-os-accent: #ffd700;
  --venues-os-accent-rgb: 255, 215, 0;
  --tier-accent: var(--services-os-accent);
  --tier-accent-rgb: var(--services-os-accent-rgb);
  --tier-gradient: linear-gradient(135deg, #18d886, #0fbf76);
}

/* A plan changes capability and visual intensity, never the product identity. */
body[data-business-edition] {
  --tier-accent: var(--services-os-accent);
  --tier-accent-rgb: var(--services-os-accent-rgb);
  --tier-gradient: linear-gradient(135deg, #18d886, #0fbf76);
  --emerald: var(--services-os-accent);
  --emerald-rgb: var(--services-os-accent-rgb);
}

body[data-product-tier] {
  --tier-accent: var(--venues-os-accent);
  --tier-accent-rgb: var(--venues-os-accent-rgb);
  --tier-gradient: linear-gradient(135deg, #ffd700, #ffad42);
  --yellow: var(--venues-os-accent);
  --orange: #ffad42;
}

body[data-business-edition="growth"] .tier-card.current,
body[data-product-tier="growth"] .tier-card {
  box-shadow: inset 0 0 0 1px rgba(var(--tier-accent-rgb), .08);
}

body[data-business-edition="pro"] .tier-card.current,
body[data-product-tier="pro"] .tier-card,
body[data-product-tier="pro"] .settings-tier-card,
body[data-product-tier="pro"] .os-hero {
  border-color: rgba(var(--tier-accent-rgb), .34);
  background: radial-gradient(circle at 100% 0, rgba(var(--tier-accent-rgb), .13), transparent 34%), linear-gradient(145deg, rgba(var(--tier-accent-rgb), .08), rgba(255,255,255,.035));
  box-shadow: inset 0 0 0 1px rgba(var(--tier-accent-rgb), .06), 0 18px 48px rgba(0,0,0,.22);
}

body[data-product-tier="pro"] {
  background: radial-gradient(circle at 92% 0, rgba(var(--venues-os-accent-rgb), .14), transparent 31%), radial-gradient(circle at 0 78%, rgba(var(--venues-os-accent-rgb), .055), transparent 30%), var(--bg);
}
body[data-product-tier="pro"] .nav button.active,
body[data-product-tier="pro"] .btn.primary,
body[data-product-tier="pro"] .period-toggle button.active,
body[data-product-tier="pro"] .profile-cover,
body[data-product-tier="pro"] .os-health-bars i {
  color: #07070c;
  background: var(--tier-gradient);
  box-shadow: 0 8px 28px rgba(var(--venues-os-accent-rgb), .16);
}
body[data-product-tier="pro"] .tier-card span,
body[data-product-tier="pro"] .tier-card a,
body[data-product-tier="pro"] .settings-tier-card span,
body[data-product-tier="pro"] .os-eyebrow { color: var(--venues-os-accent); }

.hub-plan-badge,
.tier-card > span,
.settings-tier-card > span {
  white-space: nowrap;
}

body[data-business-edition] .hub-plan-badge {
  color: #bfffe0 !important;
  border-color: rgba(var(--services-os-accent-rgb), .34) !important;
  background: rgba(var(--services-os-accent-rgb), .11) !important;
  box-shadow: inset 0 0 0 1px rgba(var(--services-os-accent-rgb), .045) !important;
}
body[data-business-edition="growth"] .hub-plan-badge {
  background: rgba(var(--services-os-accent-rgb), .15) !important;
  box-shadow: inset 0 0 0 1px rgba(var(--services-os-accent-rgb), .07), 0 0 13px rgba(var(--services-os-accent-rgb), .07) !important;
}
body[data-business-edition="pro"] .hub-plan-badge {
  color: #e5fff2 !important;
  border-color: rgba(var(--services-os-accent-rgb), .5) !important;
  background: linear-gradient(90deg, rgba(var(--services-os-accent-rgb), .22), rgba(var(--services-os-accent-rgb), .12)) !important;
  box-shadow: inset 0 0 0 1px rgba(var(--services-os-accent-rgb), .09), 0 0 18px rgba(var(--services-os-accent-rgb), .12) !important;
}
