/* CSTV website floating actions — served by the Inbox. Do not edit in WordPress. */
:root {
  --cstv-cta-bottom: 12px;
  --cstv-cta-side: 12px;
  --cstv-cta-safe: env(safe-area-inset-bottom, 0px);
  --cstv-cta-cart-gap: 0px;
  --cstv-cta-primary: #1279be;
  --cstv-cta-primary-strong: #0d4d79;
  --cstv-cta-on-primary: #ffffff;
  --cstv-cta-surface: #ffffff;
  --cstv-cta-surface-text: #12212f;
  --cstv-cta-surface-border: #b9d6ea;
  --cstv-cta-ring: #ffb020;
  --cstv-cta-shadow: rgba(16, 42, 58, 0.22);
}
/* The WooCommerce side-cart button owns the bottom-right corner; the group
   sits bottom-left and stops short of it. */
body:has(.xoo-wsc-basket) { --cstv-cta-cart-gap: 84px; }
body { padding-bottom: calc(76px + var(--cstv-cta-safe)); }

.cstv-float-cta-wrap {
  position: fixed;
  z-index: 9998;
  right: calc(var(--cstv-cta-side) + var(--cstv-cta-cart-gap) + env(safe-area-inset-right, 0px));
  bottom: calc(var(--cstv-cta-bottom) + var(--cstv-cta-safe));
  left: calc(var(--cstv-cta-side) + env(safe-area-inset-left, 0px));
  display: flex;
  justify-content: flex-start;
  pointer-events: none;
}
.cstv-float-cta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 8px;
  max-width: 100%;
  pointer-events: auto;
}
.cstv-float-cta a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-sizing: border-box;
  min-width: 48px;
  min-height: 48px;
  padding: 0 16px;
  border-radius: 14px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  box-shadow: 0 8px 22px var(--cstv-cta-shadow);
  -webkit-tap-highlight-color: transparent;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.cstv-float-cta a:hover { transform: translateY(-1px); }
/* Phones: the group tucks away while scrolling down and returns on scroll-up or pause (script in the snippet). */
.cstv-float-cta-wrap { transition: transform 0.28s ease, opacity 0.22s ease; }
.cstv-float-cta-wrap.is-hidden { transform: translateY(calc(100% + 18px)); opacity: 0.01; }
.cstv-float-cta-wrap.is-entering .cstv-float-cta { animation: cstvCtaEnter 0.42s cubic-bezier(0.2, 0.8, 0.2, 1); }
@keyframes cstvCtaEnter { 0% { opacity: 0; transform: translateY(10px) scale(0.985); } 100% { opacity: 1; transform: translateY(0) scale(1); } }
.cstv-float-cta a:focus-visible { outline: 3px solid var(--cstv-cta-ring); outline-offset: 2px; }
.cstv-float-cta .cstv-chat {
  color: var(--cstv-cta-surface-text);
  background: var(--cstv-cta-surface);
  border: 1px solid var(--cstv-cta-surface-border);
}
.cstv-float-cta .cstv-book {
  color: var(--cstv-cta-on-primary);
  background: linear-gradient(135deg, var(--cstv-cta-primary), var(--cstv-cta-primary-strong));
  border: 1px solid var(--cstv-cta-primary-strong);
}
.cstv-float-cta svg { flex: 0 0 auto; width: 18px; height: 18px; }
.cstv-float-cta .cstv-label-short { display: none; }

/* Phones and tablets: both buttons share the full strip beside the cart. */
@media (max-width: 782px) {
  .cstv-float-cta { width: 100%; flex-wrap: nowrap; }
  .cstv-float-cta a { flex: 1 1 0; min-width: 0; padding: 0 12px; }
}
/* Phones: shorter visible labels (the full name stays in aria-label). */
@media (max-width: 480px) {
  .cstv-float-cta .cstv-label-full { display: none; }
  .cstv-float-cta .cstv-label-short { display: inline; }
}
/* Very narrow phones: icon-only, still 48px and still named. */
@media (max-width: 340px) {
  .cstv-float-cta .cstv-label-short { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
  .cstv-float-cta a { padding: 0 14px; }
}
@media (min-width: 783px) {
  /* Desktop never hides the group, so keep the page's last row clear of it. */
  body { padding-bottom: calc(80px + var(--cstv-cta-safe)); }
  .cstv-float-cta-wrap { left: 16px; right: calc(16px + var(--cstv-cta-cart-gap)); bottom: 16px; }
  .cstv-float-cta-wrap.is-hidden { transform: none; opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .cstv-float-cta-wrap, .cstv-float-cta a, .cstv-float-cta-wrap.is-entering .cstv-float-cta { transition: none; animation: none; }
  .cstv-float-cta a:hover { transform: none; }
}