/* A/B wave 1 (bc-sticky-bar-v1, bc-vehicle-cards-v1). Loaded on the 27 static
   pages and on every WordPress page. Every variant element ships with the HTML
   `hidden` attribute, so arm A (and a failed stylesheet) shows the original
   page; only the rules below, keyed on html[data-ab-*="b"], reveal arm B.
   Plain colours, no page.css variables: WordPress pages do not load page.css. */

/* ---- Test 1: sticky Call + Get a Free Quote bar (mobile, <768px) ---- */
@media (max-width: 767.98px) {
  html[data-ab-sticky-bar="b"] body { padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px)) !important; }
  html[data-ab-sticky-bar="b"] .bcsb {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990;
    display: flex; gap: 8px; box-sizing: border-box;
    height: calc(64px + env(safe-area-inset-bottom, 0px));
    padding: 8px 8px calc(8px + env(safe-area-inset-bottom, 0px));
    background: #ffffff; box-shadow: 0 -2px 12px rgba(13, 0, 1, .16);
    transform: translateY(100%); visibility: hidden;
    transition: transform .2s ease, visibility 0s linear .2s;
  }
  html[data-ab-sticky-bar="b"] .bcsb.is-on { transform: none; visibility: visible; transition: transform .2s ease; }
  html[data-ab-sticky-bar="b"] .bcsb__btn {
    flex: 1 1 0; min-width: 0; display: flex; align-items: center; justify-content: center; gap: 6px;
    height: 48px; margin: 0; padding: 0 8px; box-sizing: border-box;
    border: 2px solid #da1a20; border-radius: 100px;
    font: 700 15px/1.1 "Red Hat Display", Lato, Arial, sans-serif; white-space: nowrap;
    text-decoration: none; text-align: center; -webkit-tap-highlight-color: transparent;
  }
  html[data-ab-sticky-bar="b"] .bcsb__call { background: #ffffff; color: #0d0001; }
  html[data-ab-sticky-bar="b"] .bcsb__quote { background: #da1a20; color: #ffffff; }
  html[data-ab-sticky-bar="b"] .bcsb__btn:active { transform: translateY(1px); }
  html[data-ab-sticky-bar="b"] .bcsb__btn:focus-visible { outline: 2px solid #0d0001; outline-offset: 2px; }
  /* Chat launcher above the bar (only while the bar is showing; wave1.js also calls Intercom('update')). */
  html[data-bc-bar-on] .intercom-lightweight-app-launcher,
  html[data-bc-bar-on] iframe.intercom-launcher-frame { bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
  /* Static pages' floating Google review pill sits bottom-left: lift it too. */
  html[data-bc-bar-on] .grf { bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 359px) {
  html[data-ab-sticky-bar="b"] .bcsb__btn { font-size: 13px; padding: 0 4px; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-ab-sticky-bar="b"] .bcsb, html[data-ab-sticky-bar="b"] .bcsb.is-on { transition: none; }
}
@media print { .bcsb { display: none !important; } }

/* ---- Test 4: clickable vehicle cards (/minibus-hire/) ---- */
html[data-ab-vehicle-cards="b"] .bcvc { position: relative; cursor: pointer; transition: box-shadow .15s ease, border-color .15s ease; }
html[data-ab-vehicle-cards="b"] .bcvc:hover { border-color: #da1a20; box-shadow: 0 6px 20px rgba(13, 0, 1, .10); }
html[data-ab-vehicle-cards="b"] .bcvc__actions { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
html[data-ab-vehicle-cards="b"] .bcvc__cta {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 14px 24px; border: 1px solid #da1a20; border-radius: 100px;
  background: #da1a20; color: #ffffff; font-size: 17px; font-weight: 700; line-height: 1.2; text-decoration: none;
}
/* The whole card (image + title) is the CTA's hit area. */
html[data-ab-vehicle-cards="b"] .bcvc__cta::after { content: ""; position: absolute; inset: 0; border-radius: 10px; }
html[data-ab-vehicle-cards="b"] .bcvc:hover .bcvc__cta { background: #bd0d15; border-color: #bd0d15; }
html[data-ab-vehicle-cards="b"] .bcvc__cta:focus-visible { outline: 2px solid #0d0001; outline-offset: 3px; }
html[data-ab-vehicle-cards="b"] .bcvc__details { position: relative; z-index: 1; font-size: 14px; font-weight: 700; color: #da1a20; text-decoration: underline; }
@media (max-width: 767.98px) {
  html[data-ab-vehicle-cards="b"] .bcvc__actions { align-items: stretch; }
  html[data-ab-vehicle-cards="b"] .bcvc__details { align-self: center; padding: 6px 0; }
}

/* ---- /quote/?vehicle=N-seater: chosen vehicle shown on step 1 (any arm) ---- */
.bcvp { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; margin: 0 0 12px; padding: 10px 12px;
  border: 1px solid #1f9d55; border-radius: 6px; background: #e8f6ee; color: #0d0001; font-size: 14px; line-height: 1.3; }
.bcvp strong { font-weight: 700; }
.bcvp__x { margin-left: auto; padding: 2px 0; border: 0; background: none; color: #4e4e4e; font-size: 13px; text-decoration: underline; cursor: pointer; }
