/* CoCarely for Patients: plum accent.
   Same pair the patient app uses (supercare apps/memberly/src/styles/index.css, "Plum, sampled from
   the CoCarely for Patients icon"). Brand only, never an alert colour.
   Put class="plum" on <body> to theme a whole page, or on any element to theme just that block.
   --app / --app2   accents for text, borders, rings, chips, icons (lifted in dark mode for contrast)
   --app-fill(2)    backgrounds that carry white text (6.1:1 and 4.9:1 against #fff in both modes) */
.plum{
  --app:#8f4e60; --app2:#c38b9a;
  --app-fill:#8f4e60; --app-fill2:#a05e70;
  --grad:linear-gradient(90deg,var(--app-fill),var(--app-fill2));
  --app-grad:linear-gradient(135deg,var(--app-fill2),var(--app-fill));
  --logo1:#8f4e60; --logo2:#c38b9a;
}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) .plum{--app:#c38b9a;--app2:#dcb3bf}}
html[data-theme="dark"] .plum{--app:#c38b9a;--app2:#dcb3bf}

/* whole-page plum: blush surfaces in light mode, the shared dark surfaces in dark mode */
@media (prefers-color-scheme:light){html:not([data-theme="dark"]) body.plum{--bg:#f5eff0;--surface:#fffbfc;--surface-2:#f2e8eb;--surface-3:#e8dadf;--line:#e6d5da;background-color:#f5eff0}}
html[data-theme="light"] body.plum{--bg:#f5eff0;--surface:#fffbfc;--surface-2:#f2e8eb;--surface-3:#e8dadf;--line:#e6d5da;background-color:#f5eff0}

/* anything with white text sits on the fill, not the lifted accent */
.plum :is(.ui-bub.me,.ui-chip.solid,.ui-nav.on,.testi-av,.hero-shot-item.on,.price-free){background:var(--app-fill)}
.plum .nav-cta > a.btn[href*="calendar.app.google"]{background:var(--grad)!important;border-color:transparent!important}
.plum .btn-outline{color:var(--app);border-color:var(--app)}
.plum ::selection,.plum::selection{background:color-mix(in srgb,var(--app) 30%,transparent)}
/* logo tiles inside a plum block take the plum pair (beats the inline brown --c1/--c2) */
.plum .cs-ico{--c1:var(--logo1)!important;--c2:var(--logo2)!important}