/* Buttons that fill like a loading bar (Raouf 2026-10-14, after cadrys.com.au): on hover or keyboard focus a band of the hover colour
   sweeps in from the left; when the pointer leaves it carries on and sweeps out to the right, so the motion always reads left to
   right. One background layer per button (no extra elements), the label colour follows the sweep; reduced motion and the "none" and
   "reduced" motion choices swap colours at once. Loaded after base, contact and home styles so it wins over their plain hovers. */
/* the sweep colours are defaults with no weight (:where), so the per-button overrides below always win */
:where(.btn, .ff-btn-submit, .visit-actions a.sarabi-directions, .cs-back) { --sweep: var(--c-link); --sweep-ink: var(--c-on-brand); }
:is(.btn, form.frm-fluent-form.frm-fluent-form .ff-btn-submit:not(.ff_btn_no_style), .visit-actions a.sarabi-directions, .cs-back) {
  background-image: linear-gradient(var(--sweep), var(--sweep));
  background-repeat: no-repeat;
  background-size: 0% 100%;
  background-position: right center;   /* leaving: the band shrinks toward the right, so it exits to the right */
  transition: background-size 0.6s cubic-bezier(0.65, 0, 0.15, 1), color 0.35s ease 0.08s, border-color 0.35s ease;
}
:is(.btn, form.frm-fluent-form.frm-fluent-form .ff-btn-submit:not(.ff_btn_no_style), .visit-actions a.sarabi-directions, .cs-back):is(:hover, :focus-visible) {
  background-size: 100% 100%;
  background-position: left center;    /* arriving: the band grows from the left */
  color: var(--sweep-ink);
}
/* the solid buttons keep their own fill underneath and sweep the deep green over it */
.btn:not(.btn-quiet):is(:hover, :focus-visible),
form.frm-fluent-form.frm-fluent-form .ff-btn-submit:not(.ff_btn_no_style):is(:hover, :focus-visible),
.visit-actions a.sarabi-directions:is(:hover, :focus-visible) { background-color: var(--c-brand); border-color: var(--c-link); }
/* the quiet buttons are outlines that fill with the brand colour */
.btn-quiet, .cs-back { --sweep: var(--c-brand); }
.btn-quiet:is(:hover, :focus-visible), .cs-back:is(:hover, :focus-visible) { background-color: transparent; border-color: var(--c-brand); }
/* on the showroom photo: the white button fills with ink, the outline button fills with white */
.hero-photo .btn-primary { --sweep: var(--c-ink); --sweep-ink: var(--c-on-photo); }
.hero-photo .btn-primary:is(:hover, :focus-visible) { background-color: var(--c-on-photo); border-color: var(--c-on-photo); }
.hero-photo .btn-quiet { --sweep: var(--c-on-photo); --sweep-ink: var(--c-ink); }
.hero-photo .btn-quiet:is(:hover, :focus-visible) { background-color: transparent; border-color: var(--c-on-photo); }
@media (prefers-reduced-motion: reduce) {
  :is(.btn, form.frm-fluent-form.frm-fluent-form .ff-btn-submit:not(.ff_btn_no_style), .visit-actions a.sarabi-directions, .cs-back) { transition: none; }
}
html:is([data-motion="none"], [data-motion="reduced"]) :is(.btn, form.frm-fluent-form.frm-fluent-form .ff-btn-submit:not(.ff_btn_no_style), .visit-actions a.sarabi-directions, .cs-back) { transition: none; }

/* every other button sweeps the same way (Raouf 2026-10-14 pm) */
:where(.wp-block-button__link, .ct-type-link, .cf-toggle) {
  --sweep: var(--c-text); --sweep-ink: var(--c-page); }
.entry .wp-block-button__link, .ct-type-link, .cf-toggle {
  background-image: linear-gradient(var(--sweep), var(--sweep)); background-repeat: no-repeat; background-size: 0% 100%; background-position: right center;
  transition: background-size 0.6s cubic-bezier(0.65, 0, 0.15, 1), color 0.35s ease 0.08s, border-color 0.35s ease; }
.entry .wp-block-button__link:is(:hover, :focus-visible), .ct-type-link:is(:hover, :focus-visible), .cf-toggle:is(:hover, :focus-visible) {
  background-size: 100% 100%; background-position: left center; color: var(--sweep-ink); }
/* solid: fill stays under the ink sweep */
.entry .wp-block-button:not(.is-style-outline) .wp-block-button__link:is(:hover, :focus-visible) { background-color: var(--c-brand); border-color: var(--c-text); }
/* outline: brand fill */
.entry .is-style-outline .wp-block-button__link { --sweep: var(--c-brand); --sweep-ink: var(--c-on-brand); }
.entry .is-style-outline .wp-block-button__link:is(:hover, :focus-visible) { background-color: transparent; border-color: var(--c-brand); }
/* on dark bands and photos */
:is(.entry > .lp-cta, body:is(.lp-custom, .lp-viewings) .entry > .lp-hero) .wp-block-button:not(.is-style-outline) .wp-block-button__link { --sweep: var(--c-ink); --sweep-ink: var(--c-on-band); }
:is(.entry > .lp-cta, body:is(.lp-custom, .lp-viewings) .entry > .lp-hero) .wp-block-button:not(.is-style-outline) .wp-block-button__link:is(:hover, :focus-visible) { background-color: var(--c-on-band); border-color: var(--c-on-band); }
:is(.entry > .lp-cta, body:is(.lp-custom, .lp-viewings) .entry > .lp-hero) .is-style-outline .wp-block-button__link { --sweep: var(--c-on-band); --sweep-ink: var(--c-ink); }
:is(.entry > .lp-cta, body:is(.lp-custom, .lp-viewings) .entry > .lp-hero) .is-style-outline .wp-block-button__link:is(:hover, :focus-visible) { background-color: transparent; border-color: var(--c-on-band); }

.ct-type-link[aria-current="true"] { background-size: 100% 100%; --sweep: var(--c-text); }
.ct-type-link:is(:hover, :focus-visible) { background-color: transparent; }

.cf-toggle { --sweep: var(--c-on-photo); --sweep-ink: var(--c-ink); }
.cf-toggle:is(:hover, :focus-visible) { background-color: color-mix(in srgb, var(--c-photo-shade) 35%, transparent); }
/* text link: the underline redraws */
.home-band .home-band-link { text-decoration: none; background: linear-gradient(var(--c-band-saffron), var(--c-band-saffron)) 0 calc(100% - 6px) / 100% 1.5px no-repeat;
  transition: background-size 0.5s cubic-bezier(0.65, 0, 0.15, 1), color 0.3s ease; }
.home-band .home-band-link:is(:hover, :focus-visible) { background-size: 0% 1.5px; background-position: right calc(100% - 6px); animation: band-link-redraw 0.9s cubic-bezier(0.65, 0, 0.15, 1) 0.1s forwards; }
@keyframes band-link-redraw { from { background-size: 0% 1.5px; background-position: left calc(100% - 6px); } to { background-size: 100% 1.5px; background-position: left calc(100% - 6px); } }
@media (prefers-reduced-motion: reduce) { .entry .wp-block-button__link, .ct-type-link, .cf-toggle, .home-band .home-band-link { transition: none; animation: none !important; } }
html:is([data-motion="none"], [data-motion="reduced"]) :is(.entry .wp-block-button__link, .ct-type-link, .cf-toggle, .home-band .home-band-link) { transition: none; animation: none !important; }

body .entry .wp-block-button .wp-block-button__link:is(:hover, :focus-visible) { color: var(--sweep-ink) !important; }
