/* WELLNESS LIBRARY — each section's primary CTA takes a DEEPER shade of that
   section's own tint, at her request: pale sage → deep green, pale blue → navy,
   and so on. Before this every filled button in the page was the same coral
   #EE725F regardless of which section it sat in.
   Shades are the tint's own hue several steps down, chosen so white on them
   clears AA comfortably AND they still read against the tint behind them. */
#page-rv-library [data-libtint="sage"]    { --cta:#4E6640; --cta-h:#445A38; }
#page-rv-library [data-libtint="sky"]     { --cta:#243447; --cta-h:#1F3D5C; }
#page-rv-library [data-libtint="cream"]   { --cta:#7A5A16; --cta-h:#6E5214; }
#page-rv-library [data-libtint="lavender"]{ --cta:#4C3F73; --cta-h:#443868; }
#page-rv-library [data-libtint="mint"]    { --cta:#35604A; --cta-h:#2E5641; }
#page-rv-library [data-libtint="blush"]   { --cta:#94465A; --cta-h:#8C3F56; }

/* PRIMARY ONLY. Tagged by the layer rather than selected by class — the island's
   coral is a Tailwind arbitrary value shared with several non-primary controls. */
#page-rv-library [data-libcta="1"]{
  background-color:var(--cta) !important;
  border-color:var(--cta) !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}
#page-rv-library [data-libcta="1"]:hover{
  background-color:var(--cta-h) !important;
  border-color:var(--cta-h) !important;
}
#page-rv-library [data-libcta="1"] svg{ color:#ffffff !important; }
#page-rv-library [data-libcta="1"]:focus-visible{ outline:3px solid #CF9E3F; outline-offset:2px; }
/* my own guides section: the tabs and Read guide follow the same variable */
#wgxSec[data-libtint] .wgx-tab[aria-pressed="true"],
#wgxSec[data-libtint] .wgx-btn{
  background:var(--cta) !important; border-color:var(--cta) !important;
}
#wgxSec[data-libtint] .wgx-btn:hover,
#wgxSec[data-libtint] .wgx-tab[aria-pressed="true"]:hover{
  background:var(--cta-h) !important; border-color:var(--cta-h) !important;
}
#wgxSec[data-libtint] .wgx-btn--ghost{
  background:#fff !important; border-color:#DDD7C9 !important;
  color:#3D4A3A !important; -webkit-text-fill-color:#3D4A3A !important;
}