/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 21 2026 | 23:01:55 */
/* ============================================================
   ACCESSIBILITY AND MENU PATCH (AODA / WCAG 2.1 AA)
   Each block says which of your three files it belongs in,
   and what to delete or replace there. Nothing here changes the look
   of the theme except item 3, which is marked as a small visible change.
   ============================================================ */


/* ------------------------------------------------------------
   1. FILE 1 (site CSS): keyboard focus on the insurance list
   DELETE this line from .insurance-list summary:   outline: none;
   (Removing the outline hides where keyboard users are.)
   ADD:
   ------------------------------------------------------------ */
.insurance-list summary:focus-visible {
  outline: 3px solid #6845AA;
  outline-offset: 2px;
}


/* ------------------------------------------------------------
   2. FILE 1 (site CSS): left-align long text
   Justified text creates uneven gaps that are hard to read.
   REPLACE text-align: justify with the following:
   ------------------------------------------------------------ */
.homepage-intro { text-align: left; }
.lp-section-header .lp-section-desc { text-align: left; }


/* ------------------------------------------------------------
   3. FILE 1 (site CSS): Book button colour contrast
   White text on the teal #1EAE98 is about 2.8:1. AA needs 4.5:1.
   A slightly deeper teal fixes it (white on #13796a is about 5.3:1).
   The purple hover is unchanged. This is the only visible change.
   REPLACE the first background-color in .appointment-button
   (currently rgba(30, 174, 152, 1)) with:
   ------------------------------------------------------------ */
.appointment-button { background-color: #13796a; }

/* Keep a clear focus ring for keyboard users.
   You can delete the older .appointment-button:focus rule if you like. */
.appointment-button:focus-visible {
  outline: 3px solid #6845AA;
  outline-offset: 3px;
}


/* ------------------------------------------------------------
   4. FILE 2 (homepage CSS): hours card text size bug
   clamp(1.5vw, 3vw, 1.9rem) shrinks the times to about 6 to 12 px on phones.
   REPLACE the font-size in .ct-hours dd with:
   ------------------------------------------------------------ */
.ct-hours dd { font-size: clamp(1.4rem, 3vw, 1.9rem); }


/* ------------------------------------------------------------
   5. FILE 2 (homepage CSS): focus ring on the small teal buttons
   ------------------------------------------------------------ */
a.ct-btn-sm:focus-visible {
  outline: 3px solid #6845AA;
  outline-offset: 3px;
}


/* ------------------------------------------------------------
   6. FILE 3 (first responders CSS)
   Already updated in the new first-responders.css:
   --frp-btn is now #13796a (white text 5.3:1), and a visible focus ring
   and reduced-motion rule were added. Replace that file with the new one.
   ------------------------------------------------------------ */


/* ------------------------------------------------------------
   7. FILE 1 (site CSS): respect "reduce motion" settings
   Stops the button slide, scale and fade for people who ask their device
   to reduce motion (an AODA and WCAG good practice).
   ------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  .appointment-button,
  .appointment-button::before,
  .ct-btn-sm,
  .profile-button,
  .faq-item summary::before,
  .insurance-list__icon {
    transition: none !important;
    animation: none !important;
  }
  .appointment-button:hover { transform: none; }
}


/* ------------------------------------------------------------
   8. SHORT MENU: turn the last menu item into a Book button
   In Appearance > Menus, open Screen Options and tick "CSS Classes".
   Add a Custom Link item "Book" pointing to https://connectionstherapy.janeapp.com
   and give it the CSS class: menu-cta
   This is a starting point. Menu markup varies by theme, so if the button does
   not pick up the style, inspect the menu item and adjust the selector.
   ------------------------------------------------------------ */
.menu-cta > a {
  background: #13796a;
  color: #ffffff !important;
  border-radius: 6px;
  padding-left: 1.1em;
  padding-right: 1.1em;
  font-weight: 600;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.menu-cta > a:hover,
.menu-cta > a:focus-visible {
  background: #1EAE98;
  color: #0e1a19 !important;
}
.menu-cta > a:focus-visible {
  outline: 3px solid #6845AA;
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  .menu-cta > a { transition: none; }
}


/* ------------------------------------------------------------
   9. FILE 2 (homepage CSS): spacing for the Services page category lists
   Needed by services-page.html. Adds space between stacked two-column rows
   and between each category heading and its list.
   ------------------------------------------------------------ */
.ct-two + .ct-two { margin-top: 2rem; }
section.ct-card .ct-two h3 { margin-bottom: 0.6rem; }