/* ============================================================================
   Rate Us prompt bar.

   Position is chosen in Customizer → Reviews & Testimonials (a separate value
   for desktop/tablet and for phones); PHP puts both on the element as
   .aj-review-prompt-bar--d-{pos} and --m-{pos}. Desktop rules live under
   min-width: 641px and key off --d-*; phone rules under max-width: 640px and
   key off --m-*. `top` / `bottom` are full-width bars; `left` / `right` and
   `top-card` / `bottom-card` are a compact card pinned to that edge, which the
   visitor can collapse to a handle. prompt.js handles the phone `top` reveal
   (hide until scrolled) and the collapse handle.
   ============================================================================ */

.aj-review-prompt-bar { position: relative; z-index: 1001; background: var(--primary, #2563eb); color: var(--white, #fff); font-family: var(--font-body, sans-serif); }
.aj-review-prompt-bar__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .35rem 1.25rem; padding-block: .3rem; }
.aj-review-prompt-bar__lead,
.aj-review-prompt-bar__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .9rem; min-width: 0; }
.aj-review-prompt-bar__actions { margin-inline-start: auto; } /* stay right even when there's no lead */
.aj-review-prompt-bar__item { display: inline-flex; align-items: center; gap: .35rem; font-size: .9em; font-weight: 500; line-height: 1.4; }
.aj-review-prompt-bar__item svg { flex: 0 0 auto; }
.aj-review-prompt-bar__addr > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 40ch; }
a.aj-review-prompt-bar__phone { color: inherit; text-decoration: none; white-space: nowrap; }
a.aj-review-prompt-bar__phone:hover, a.aj-review-prompt-bar__phone:focus-visible { text-decoration: underline; }
.aj-review-prompt-bar__social { gap: .15rem; }
.aj-review-prompt-bar__social a { display: inline-flex; padding: 6px; color: inherit; border-radius: .25rem; }
.aj-review-prompt-bar__social a:hover, .aj-review-prompt-bar__social a:focus-visible { background: rgb(255 255 255 / 18%); }
.aj-rate-us { display: flex; flex-wrap: wrap; align-items: center; gap: .1rem .55rem; max-width: 100%; }
.aj-rate-us__label { font-weight: 600; }

/* Individual star links: 1–4 open feedback; 5 opens Google. The row is an
   invitation, not a score, so the stars sit dimmed and only fill — left to
   right, up to the pointer — on hover or keyboard focus. */
.aj-rate-us__stars { display: inline-flex; align-items: center; gap: 0; line-height: 1; }
.aj-rate-us__stars a.aj-rate-us__star { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; border-radius: .25rem; color: rgb(255 255 255 / 42%); text-decoration: none; font-size: 1.5rem; transition: color .12s ease, transform .12s ease; }
/* Every fill rule carries the same `.aj-rate-us__stars a` prefix as the dim
   base rule above: without it the base selector is the more specific one and
   the hovered star itself never lights up (only the ones before it, via the
   sibling rule, which have the extra weight of :has()). */
.aj-rate-us__stars a.aj-rate-us__star:hover,
.aj-rate-us__stars a.aj-rate-us__star:focus-visible,
.aj-rate-us__stars a.aj-rate-us__star:has(~ .aj-rate-us__star:hover),
.aj-rate-us__stars a.aj-rate-us__star:has(~ .aj-rate-us__star:focus-visible) { color: #ffd35c; }
.aj-rate-us__stars a.aj-rate-us__star:hover { transform: scale(1.08); }
.aj-rate-us :focus-visible { outline: 3px solid #fff; outline-offset: 2px; }

/* Clip the card's rounded corner regardless of which edge it's on. */
.aj-review-prompt-bar--d-left, .aj-review-prompt-bar--d-right,
.aj-review-prompt-bar--d-top-card, .aj-review-prompt-bar--d-bottom-card,
.aj-review-prompt-bar--m-left, .aj-review-prompt-bar--m-right,
.aj-review-prompt-bar--m-top-card, .aj-review-prompt-bar--m-bottom-card { overflow: hidden; }

/* ===== Collapse handle (compact cards only) ==============================
   Which of the two positions is live depends on the breakpoint, so prompt.js
   resolves it and marks the element: `--collapsible` reveals the handle and
   `data-active-card` says which edge the card is on, driving both the handle's
   side and the chevron's direction. Without JavaScript neither lands and the
   card simply stays open — the handle never appears.
   ========================================================================= */
.aj-review-prompt-bar__collapse { display: none; }

.aj-review-prompt-bar--collapsible { display: flex; align-items: stretch; }
.aj-review-prompt-bar--collapsible .aj-review-prompt-bar__collapse {
    display: flex; align-items: center; justify-content: center; gap: .35rem;
    flex: 0 0 auto;
    min-width: 30px; min-height: 30px; padding: 0 2px;
    border: 0; background: rgb(0 0 0 / 14%); color: inherit; cursor: pointer;
    font: inherit; line-height: 1;
}
.aj-review-prompt-bar--collapsible .aj-review-prompt-bar__collapse:hover,
.aj-review-prompt-bar--collapsible .aj-review-prompt-bar__collapse:focus-visible { background: rgb(0 0 0 / 26%); }
.aj-review-prompt-bar__collapse:focus-visible { outline: 3px solid #fff; outline-offset: -3px; }

/* Collapsed: the handle is all that is left, so give it a full tap target. */
.aj-review-prompt-bar--collapsible.is-collapsed .aj-review-prompt-bar__inner { display: none; }
.aj-review-prompt-bar--collapsible.is-collapsed .aj-review-prompt-bar__collapse {
    min-width: 44px; min-height: 44px; padding: .35rem .75rem; background: none;
}

/* Handle wording. Open, the card already reads "Rate Us", so the handle stays a
   bare chevron. Collapsed, Customizer → Reviews & Testimonials decides between
   the label, the chevron, or both, via `--handle-{label|arrow|both}` on the bar.
   Each style is spelled out from the collapsed base rather than carved out with
   a :not(), so a page cached before the style class existed collapses to the
   default (label only) instead of landing in a half-applied arrow-and-label
   state. */
.aj-review-prompt-bar__handle-label {
    display: none;
    font-size: .82rem; font-weight: 600; white-space: nowrap;
}
/* Collapsed, default style: label only. */
.aj-review-prompt-bar--collapsible.is-collapsed .aj-review-prompt-bar__handle-label { display: block; }
.aj-review-prompt-bar--collapsible.is-collapsed .aj-review-prompt-bar__chevron { display: none; }
/* Arrow only. */
.aj-review-prompt-bar--collapsible.is-collapsed.aj-review-prompt-bar--handle-arrow .aj-review-prompt-bar__handle-label { display: none; }
/* Both styles that keep the chevron. */
.aj-review-prompt-bar--collapsible.is-collapsed.aj-review-prompt-bar--handle-arrow .aj-review-prompt-bar__chevron,
.aj-review-prompt-bar--collapsible.is-collapsed.aj-review-prompt-bar--handle-both .aj-review-prompt-bar__chevron { display: inline-flex; }

/* Handle sits on the card's inner edge: opposite the screen edge it is pinned
   to. The button is first in the DOM, so the reversed directions put it last. */
.aj-review-prompt-bar[data-active-card="left"] { flex-direction: row-reverse; }
.aj-review-prompt-bar[data-active-card="right"] { flex-direction: row; }
.aj-review-prompt-bar[data-active-card="top-card"] { flex-direction: column-reverse; }
.aj-review-prompt-bar[data-active-card="bottom-card"] { flex-direction: column; }

/* Side cards collapse to a narrow vertical tab, so the handle stacks and its
   label runs along the edge — reading top-to-bottom on the right, bottom-to-top
   on the left, the way an edge tab normally does. */
.aj-review-prompt-bar[data-active-card="left"] .aj-review-prompt-bar__collapse,
.aj-review-prompt-bar[data-active-card="right"] .aj-review-prompt-bar__collapse { flex-direction: column; }
.aj-review-prompt-bar[data-active-card="left"].is-collapsed .aj-review-prompt-bar__collapse,
.aj-review-prompt-bar[data-active-card="right"].is-collapsed .aj-review-prompt-bar__collapse { padding: .75rem .35rem; }
.aj-review-prompt-bar[data-active-card="left"] .aj-review-prompt-bar__handle-label,
.aj-review-prompt-bar[data-active-card="right"] .aj-review-prompt-bar__handle-label { writing-mode: vertical-rl; }
.aj-review-prompt-bar[data-active-card="left"] .aj-review-prompt-bar__handle-label { transform: rotate(180deg); }

/* The chevron points the way the card will move; collapsed, it points back. */
.aj-review-prompt-bar__chevron { display: inline-flex; transform: rotate(var(--aj-rp-chevron, 0deg)); }
.aj-review-prompt-bar[data-active-card="left"] .aj-review-prompt-bar__chevron { --aj-rp-chevron: 0deg; }
.aj-review-prompt-bar[data-active-card="right"] .aj-review-prompt-bar__chevron { --aj-rp-chevron: 180deg; }
.aj-review-prompt-bar[data-active-card="top-card"] .aj-review-prompt-bar__chevron { --aj-rp-chevron: 90deg; }
.aj-review-prompt-bar[data-active-card="bottom-card"] .aj-review-prompt-bar__chevron { --aj-rp-chevron: -90deg; }
.aj-review-prompt-bar.is-collapsed .aj-review-prompt-bar__chevron { transform: rotate(calc(var(--aj-rp-chevron, 0deg) + 180deg)); }
@media (prefers-reduced-motion: no-preference) {
    .aj-review-prompt-bar__chevron { transition: transform .2s ease; }
}

/* ===== Desktop / tablet ================================================== */
@media (min-width: 641px) {
    .aj-review-prompt-bar--d-bottom {
        position: fixed; inset-inline: 0; bottom: 0; top: auto;
        box-shadow: 0 -6px 18px rgb(0 0 0 / 18%);
    }

    .aj-review-prompt-bar--d-left,
    .aj-review-prompt-bar--d-right {
        position: fixed; top: 50%; transform: translateY(-50%);
        width: max-content; max-width: min(16rem, 24vw);
        box-shadow: 0 14px 38px rgb(0 0 0 / 28%);
    }
    .aj-review-prompt-bar--d-left  { left: 0;  border-radius: 0 14px 14px 0; }
    .aj-review-prompt-bar--d-right { right: 0; border-radius: 14px 0 0 14px; }

    .aj-review-prompt-bar--d-left  .aj-review-prompt-bar__inner,
    .aj-review-prompt-bar--d-right .aj-review-prompt-bar__inner {
        flex-direction: column; align-items: center; text-align: center;
        max-width: none; margin: 0; width: auto; gap: .45rem; padding: .8rem .9rem;
    }
    .aj-review-prompt-bar--d-left  .aj-review-prompt-bar__actions,
    .aj-review-prompt-bar--d-right .aj-review-prompt-bar__actions,
    .aj-review-prompt-bar--d-left  .aj-rate-us,
    .aj-review-prompt-bar--d-right .aj-rate-us {
        flex-direction: column; align-items: center; margin: 0; gap: .35rem;
    }
    .aj-review-prompt-bar--d-left  .aj-review-prompt-bar__lead,
    .aj-review-prompt-bar--d-left  .aj-review-prompt-bar__social,
    .aj-review-prompt-bar--d-right .aj-review-prompt-bar__lead,
    .aj-review-prompt-bar--d-right .aj-review-prompt-bar__social { display: none; }

    /* Compact card centred on the top or bottom edge. Unlike the side cards
       this one keeps its contents on one row — it is a shrunk bar, not a
       column. */
    .aj-review-prompt-bar--d-top-card,
    .aj-review-prompt-bar--d-bottom-card {
        position: fixed; left: 50%; transform: translateX(-50%);
        width: max-content; max-width: min(30rem, 92vw);
        box-shadow: 0 14px 38px rgb(0 0 0 / 28%);
    }
    .aj-review-prompt-bar--d-top-card    { top: 0; border-radius: 0 0 14px 14px; }
    .aj-review-prompt-bar--d-bottom-card { bottom: 0; border-radius: 14px 14px 0 0; }
    body.admin-bar .aj-review-prompt-bar--d-top-card { top: 32px; }

    .aj-review-prompt-bar--d-top-card    .aj-review-prompt-bar__inner,
    .aj-review-prompt-bar--d-bottom-card .aj-review-prompt-bar__inner {
        max-width: none; margin: 0; width: auto;
        justify-content: center; gap: .2rem .75rem; padding: .25rem .9rem;
    }
    .aj-review-prompt-bar--d-top-card    .aj-review-prompt-bar__actions,
    .aj-review-prompt-bar--d-bottom-card .aj-review-prompt-bar__actions {
        margin-inline-start: 0; justify-content: center;
    }
    .aj-review-prompt-bar--d-top-card    .aj-review-prompt-bar__lead,
    .aj-review-prompt-bar--d-top-card    .aj-review-prompt-bar__social,
    .aj-review-prompt-bar--d-bottom-card .aj-review-prompt-bar__lead,
    .aj-review-prompt-bar--d-bottom-card .aj-review-prompt-bar__social { display: none; }
}

/* ===== Phones (≤ 640px) ================================================= */
@media (max-width: 640px) {
    /* Full-width bars (top / bottom): drop the address + social rows and centre
       everything so the strip stays slim. */
    .aj-review-prompt-bar--m-top .aj-review-prompt-bar__lead,
    .aj-review-prompt-bar--m-top .aj-review-prompt-bar__social,
    .aj-review-prompt-bar--m-bottom .aj-review-prompt-bar__lead,
    .aj-review-prompt-bar--m-bottom .aj-review-prompt-bar__social { display: none; }
    .aj-review-prompt-bar--m-top .aj-review-prompt-bar__inner,
    .aj-review-prompt-bar--m-bottom .aj-review-prompt-bar__inner { justify-content: center; gap: .15rem .5rem; padding-block: .4rem; }
    .aj-review-prompt-bar--m-top .aj-review-prompt-bar__actions,
    .aj-review-prompt-bar--m-bottom .aj-review-prompt-bar__actions { margin-inline-start: 0; justify-content: center; gap: .1rem .5rem; }
    .aj-review-prompt-bar--m-top .aj-rate-us,
    .aj-review-prompt-bar--m-bottom .aj-rate-us { justify-content: center; gap: .1rem .3rem; }
    .aj-review-prompt-bar--m-top .aj-rate-us__label,
    .aj-review-prompt-bar--m-bottom .aj-rate-us__label { font-size: .95em; }
    .aj-review-prompt-bar--m-top .aj-rate-us__stars a.aj-rate-us__star,
    .aj-review-prompt-bar--m-bottom .aj-rate-us__stars a.aj-rate-us__star { min-width: 38px; min-height: 38px; font-size: 1.3rem; }

    .aj-review-prompt-bar--m-bottom {
        position: fixed; inset-inline: 0; bottom: 0; top: auto; transform: none;
        box-shadow: 0 -6px 16px rgb(0 0 0 / 22%);
    }

    /* Compact card, left or right edge. */
    .aj-review-prompt-bar--m-left,
    .aj-review-prompt-bar--m-right {
        position: fixed; top: 50%; transform: translateY(-50%);
        width: max-content; max-width: min(13rem, 62vw);
        box-shadow: 0 12px 30px rgb(0 0 0 / 30%);
    }
    .aj-review-prompt-bar--m-left  { left: 0;  border-radius: 0 12px 12px 0; }
    .aj-review-prompt-bar--m-right { right: 0; border-radius: 12px 0 0 12px; }
    .aj-review-prompt-bar--m-left  .aj-review-prompt-bar__inner,
    .aj-review-prompt-bar--m-right .aj-review-prompt-bar__inner {
        flex-direction: column; align-items: center; text-align: center;
        max-width: none; margin: 0; width: auto; gap: .35rem; padding: .6rem .55rem;
    }
    .aj-review-prompt-bar--m-left  .aj-review-prompt-bar__actions,
    .aj-review-prompt-bar--m-right .aj-review-prompt-bar__actions,
    .aj-review-prompt-bar--m-left  .aj-rate-us,
    .aj-review-prompt-bar--m-right .aj-rate-us {
        flex-direction: column; align-items: center; margin: 0; gap: .3rem;
    }
    .aj-review-prompt-bar--m-left  .aj-review-prompt-bar__lead,
    .aj-review-prompt-bar--m-left  .aj-review-prompt-bar__social,
    .aj-review-prompt-bar--m-right .aj-review-prompt-bar__lead,
    .aj-review-prompt-bar--m-right .aj-review-prompt-bar__social { display: none; }
    .aj-review-prompt-bar--m-left  .aj-rate-us__stars a.aj-rate-us__star,
    .aj-review-prompt-bar--m-right .aj-rate-us__stars a.aj-rate-us__star { min-width: 34px; min-height: 34px; font-size: 1.2rem; }

    /* Compact card centred on the top or bottom edge. */
    .aj-review-prompt-bar--m-top-card,
    .aj-review-prompt-bar--m-bottom-card {
        position: fixed; left: 50%; transform: translateX(-50%);
        width: max-content; max-width: 92vw;
        box-shadow: 0 12px 30px rgb(0 0 0 / 30%);
    }
    .aj-review-prompt-bar--m-top-card    { top: 0; border-radius: 0 0 12px 12px; }
    .aj-review-prompt-bar--m-bottom-card { bottom: 0; border-radius: 12px 12px 0 0; }
    body.admin-bar .aj-review-prompt-bar--m-top-card { top: 46px; }

    .aj-review-prompt-bar--m-top-card    .aj-review-prompt-bar__inner,
    .aj-review-prompt-bar--m-bottom-card .aj-review-prompt-bar__inner {
        max-width: none; margin: 0; width: auto;
        justify-content: center; gap: .15rem .5rem; padding: .25rem .6rem;
    }
    .aj-review-prompt-bar--m-top-card    .aj-review-prompt-bar__actions,
    .aj-review-prompt-bar--m-bottom-card .aj-review-prompt-bar__actions {
        margin-inline-start: 0; justify-content: center; gap: .1rem .5rem;
    }
    .aj-review-prompt-bar--m-top-card    .aj-review-prompt-bar__lead,
    .aj-review-prompt-bar--m-top-card    .aj-review-prompt-bar__social,
    .aj-review-prompt-bar--m-bottom-card .aj-review-prompt-bar__lead,
    .aj-review-prompt-bar--m-bottom-card .aj-review-prompt-bar__social { display: none; }
    .aj-review-prompt-bar--m-top-card    .aj-rate-us__label,
    .aj-review-prompt-bar--m-bottom-card .aj-rate-us__label { font-size: .95em; }
    .aj-review-prompt-bar--m-top-card    .aj-rate-us__stars a.aj-rate-us__star,
    .aj-review-prompt-bar--m-bottom-card .aj-rate-us__stars a.aj-rate-us__star { min-width: 38px; min-height: 38px; font-size: 1.3rem; }

    /* Phone `top` only: prompt.js lifts the bar off the top of the page and
       slides it back in as a fixed strip once you scroll past ~64px, then hides
       it again at the very top. */
    .aj-review-prompt-bar--m-top.aj-review-prompt-bar--reveal {
        position: fixed; inset-inline: 0; top: 0;
        transform: translateY(-100%); transition: transform .25s ease;
        box-shadow: 0 6px 16px rgb(0 0 0 / 22%);
    }
    body.admin-bar .aj-review-prompt-bar--m-top.aj-review-prompt-bar--reveal { top: 46px; }
    .aj-review-prompt-bar--m-top.aj-review-prompt-bar--reveal.is-visible { transform: translateY(0); }

    /* While that strip shows, drop the sticky header below it. */
    body.aj-review-prompt-visible .site-header { top: var(--aj-review-prompt-h, 2.4rem); transition: top .25s ease; }
    body.admin-bar.aj-review-prompt-visible .site-header { top: calc(46px + var(--aj-review-prompt-h, 2.4rem)); }
}

@media (prefers-reduced-motion: reduce) {
    .aj-review-prompt-bar--reveal,
    .aj-review-prompt-bar--reveal.is-visible,
    body.aj-review-prompt-visible .site-header,
    .aj-rate-us__star { transition: none; }
    .aj-rate-us__stars a.aj-rate-us__star:hover { transform: none; }
}
