/* Product previews retain their original layout and animation hooks. */
.product-page
  :is(
    .desk-demo,
    .owner-demo,
    .call-demo,
    .msg-demo,
    .portal-demo,
    .sched-demo,
    .fax-demo,
    .lead-demo,
    .report-demo,
    .hero-claim
  ) {
  --line: #dceaf5;
  --line-strong: #bed7ec;
  --surface: #fff;
  --warm-white: #f8fbff;
  --pewter: #5e7486;
  --stone: #687e90;
  min-width: 0;
  text-align: left;
}

.product-page
  :is(
    .desk-demo,
    .owner-demo,
    .call-demo,
    .msg-demo,
    .portal-demo,
    .sched-demo,
    .fax-demo,
    .lead-demo,
    .report-demo,
    .claim-card
  ) {
  border: 1px solid #d2e7f8;
  border-radius: 19px;
  background: #f8fbff;
  box-shadow:
    0 18px 48px rgba(48, 115, 171, 0.16),
    0 0 0 6px rgba(255, 255, 255, 0.54);
}

.product-page :is(.call-demo, .fax-demo, .report-demo) {
  background: #fff;
}

.product-page
  :is(.dk-top, .pt-top, .sc-top, .op-top, .ms-top, .ld-head, .claim-head) {
  background: #fff;
  border-bottom-color: #e2edf6;
}

.product-page :is(.cd-avatar, .pt-logo) {
  background: #e6f3ff;
  color: #276c9e;
  box-shadow: inset 0 0 0 1px #d2e8fa;
}

.product-page .cd-avatar svg {
  color: #287dc3;
}

.product-page :is(.cd-wave span, .rd-caret, .pt-tab::after, .dk-track i) {
  background: #378ed6;
}

.product-page :is(.rd-spark, .claim-head .claim-ico) {
  color: #287dc3;
}

/* Voice and lead conversations use the same calm blue language as the homepage. */
.product-page :is(.cd-caller, .ld-msg.in, .ms-b.in) {
  background: #edf4fa;
  color: #38566e;
}

.product-page :is(.cd-ai, .ld-msg.out, .ld-typing, .ms-b.out) {
  background: #266ca6;
  color: #fff;
}

.product-page .ld-avatar {
  background: #e7f3fd;
  color: #326991;
}

.product-page .ld-time {
  opacity: 0.85;
}

/* Day-to-day activity and practice dashboard. Success and urgent states retain
   their green, amber, and red semantics from the underlying component styles. */
.product-page :is(.dk-tally, .op-kpis) {
  background: #f5faff;
}

.product-page :is(.dk-tile, .op-kpi) {
  border-color: #dceaf6;
  background: #fff;
}

.product-page .dk-tile.lit {
  border-color: #bfdcf2;
  background: #eaf5fe;
}

.product-page :is(.dk-clock, .op-date, .fx-count) {
  border-color: #d7e9f6;
  background: #f0f7fd;
  color: #375e7c;
}

.product-page .dk-ch.ch-phone {
  background: #e6f2fd;
  color: #3778ad;
}

.product-page .dk-track {
  background: #dcecf8;
}

.product-page .op-dow.today {
  color: #266da6;
}

/* Scheduling and the patient portal. Keep panel heights, container queries,
   and selection classes intact so automated flows stay synchronized. */
.product-page :is(.pt-tabs, .sc-steps) {
  background: #f4f9fe;
}

.product-page .pt-tab.is-active {
  color: #256da6;
  background: #eaf5fe;
}

.product-page .sc-step.is-active {
  color: #256da6;
}

.product-page .sc-step.is-active i {
  border-color: #286fa8;
  background: #286fa8;
  color: #fff;
}

.product-page :is(.pt-btn-primary, .pt-slot.picked, .sc-day.sel) {
  background: #286fa8;
  border-color: #286fa8;
  color: #fff;
}

.product-page .sc-chip {
  border-color: #cde5f7;
  background: #eaf5fe;
  color: #376a90;
}

.product-page .sc-day.avail:not(.sel) {
  background: #eaf5fe;
  color: #346b98;
}

/* Message center: retain the responsive compact inbox sidebar. */
.product-page .ms-side {
  background: #f5faff;
}

.product-page .ms-search {
  background: #fff;
}

.product-page .ms-row.is-sel {
  border-left-color: #328bd0;
  background: #e6f2fd;
}

.product-page .ms-chip:first-child:not(.pressed) {
  border-color: #c3dff3;
  background: #eaf5fe;
  color: #356887;
}

.product-page :is(.ms-chip.pressed, .ms-send) {
  border-color: #286fa8;
  background: #286fa8;
  color: #fff;
}

/* Neutral report and claims chrome; data values and status colors remain intact. */
.product-page .rd-bar {
  border-color: #c9e0f3;
  background: #f7fbff;
}

.product-page .rd-btrack {
  background: #e8f2fa;
}

.product-page .rd-bfill:not(.is-amber) {
  background: #3288cd;
}

.product-page .rd-spinner {
  border-top-color: #3288cd;
}

.product-page .rd-chip {
  border-color: #dceaf5;
  background: #f7fbff;
}

.product-page .hero-claim {
  --claim-accent: #286fa8;
  --claim-info-text: #286189;
  --claim-info-bg: #e6f3fc;
  margin-inline: auto;
}

.product-page .claim-card {
  background: #fff;
}

.product-page .claim-scan {
  border-color: rgba(50, 136, 205, 0.3);
  background: linear-gradient(
    180deg,
    transparent,
    rgba(50, 136, 205, 0.12),
    transparent
  );
}

.product-page .claim-paid {
  background: #fff;
}

@media (max-width: 640px) {
  .product-page
    :is(
      .desk-demo,
      .owner-demo,
      .call-demo,
      .msg-demo,
      .portal-demo,
      .sched-demo,
      .fax-demo,
      .lead-demo,
      .report-demo,
      .claim-card
    ) {
    border-radius: 15px;
    box-shadow:
      0 12px 28px rgba(48, 115, 171, 0.13),
      0 0 0 4px rgba(255, 255, 255, 0.54);
  }

  .product-page :is(.call-demo, .fax-demo, .report-demo) {
    padding: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .product-page :is(.rd-caret, .rd-spinner, .ld-dot, .ld-typing span) {
    animation: none;
  }
}