/* =====================================================================
   Arvie Filters overlay — standalone island CSS
   ---------------------------------------------------------------------
   HARD ISOLATION on a hostile legacy page (common.css / Bootstrap), with
   NO Shadow DOM (AngularJS 1.3 + jQuery need the light DOM):

   1. Every rule is scoped under #arvie-filters. The id gives each rule
      id-level specificity (1,x,x), which beats common.css's class/element
      rules (0,x,x) regardless of stylesheet load order.
   2. The reset (`all: revert`) rolls every element inside the island back
      to browser defaults, wiping inherited/legacy author styles. Custom
      properties are NOT touched by `all`, so the --av-* tokens still cascade.
   3. All tokens are prefixed --av-* so they cannot collide with any custom
      properties the host page defines (--green, --bg, etc.).

   Caveat: `all: revert` neutralises all NORMAL legacy declarations. If any
   common.css rule uses !important and still reaches an element, add
   !important to the matching #arvie-filters rule below. (Bootstrap's
   navbar/dropdown/radio rules are normal declarations, so id-scoping wins.)
   ===================================================================== */

/* ---- reset: wipe legacy styles inside the island ---- */
#arvie-filters,
#arvie-filters *,
#arvie-filters *::before,
#arvie-filters *::after{
  all: revert;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-tap-highlight-color: transparent;
}
#arvie-filters [hidden]{ display: none !important; }
#arvie-filters button{ cursor: pointer; border: none; background: none; color: inherit; font: inherit; }
#arvie-filters input{ font: inherit; }
#arvie-filters svg{ display: block; }
#arvie-filters :focus-visible{ outline: 2px solid var(--av-blue); outline-offset: 2px; border-radius: 6px; }

/* ---- tokens (scoped to the island) ---- */
#arvie-filters{
  --av-bg:#F7F5F1; --av-chip:#EEEBE4; --av-card:#fff;
  --av-ink:#17271D; --av-body:#38473D; --av-muted:#586A5E; --av-forest:#15271C;
  --av-line:#DBE2D8; --av-line-soft:#E4E9E2; --av-line-hover:#C4CEC7;
  --av-blue:#2E6E8C; --av-blue-deep:#24596F; --av-blue-text:#2A6684; --av-blue-wash:#E4EEF4;
  --av-green:#2E6B45; --av-green-deep:#1F4E31; --av-green-wash:#DDEDE2; --av-green-line:#A9CBB4;
  --av-placeholder:#6B7871;
  --av-r:16px; --av-r-sm:10px; --av-r-xs:8px;
  --av-s1:4px; --av-s2:8px; --av-s3:12px; --av-s4:16px; --av-s5:20px; --av-s6:24px;
  --av-sh-sm:0 1px 2px rgba(21,39,28,.06), 0 6px 16px rgba(21,39,28,.07);
  --av-sh-lg:0 8px 40px rgba(21,39,28,.18);
  --av-ease:cubic-bezier(0.22,1,0.36,1);
  --av-fs-2xs:.6875rem; --av-fs-xs:.75rem; --av-fs-sm:.875rem; --av-fs-base:1rem; --av-fs-md:1.0625rem; --av-fs-lg:1.1875rem;
  --av-z: 20000;   /* above typical Bootstrap modals/dropdowns; adjust if the host stacks higher */

  font-family:'Figtree', system-ui, -apple-system, sans-serif;
  color: var(--av-body);
  line-height: 1.5;
}

/* ---- scrim + sheet (mobile bottom sheet by default) ---- */
#arvie-filters .av-scrim{
  position:fixed; inset:0; background:rgba(21,39,28,.45);
  z-index:var(--av-z); opacity:0; pointer-events:none;
  transition:opacity .25s var(--av-ease);
}
#arvie-filters .av-scrim.show{ opacity:1; pointer-events:auto; }

#arvie-filters .fsheet{
  position:fixed; left:0; right:0; bottom:0; max-height:90dvh;
  background:var(--av-card); border-radius:20px 20px 0 0;
  z-index:calc(var(--av-z) + 1);
  transform:translateY(100%); transition:transform .3s var(--av-ease);
  display:flex; flex-direction:column;
  padding-bottom:env(safe-area-inset-bottom);
  font-size:var(--av-fs-base);
}
#arvie-filters .fsheet.show{ transform:translateY(0); }
#arvie-filters .fsheet-grab{ width:40px; height:5px; border-radius:99px; background:var(--av-line); margin:10px auto 4px; }
#arvie-filters .fsheet-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:6px var(--av-s4) var(--av-s3); border-bottom:1px solid var(--av-line-soft);
}
#arvie-filters .fsheet-head b{ font-size:var(--av-fs-lg); font-weight:900; color:var(--av-ink); }
#arvie-filters .fsheet-head button{ font-size:var(--av-fs-sm); font-weight:800; color:var(--av-blue-text); padding:10px; }
#arvie-filters .fsheet-body{ overflow-y:auto; padding:var(--av-s4); flex:1; overscroll-behavior:contain; }
#arvie-filters .fsheet-foot{
  padding:var(--av-s3) var(--av-s4); border-top:1px solid var(--av-line);
  display:flex; gap:10px; align-items:center;
}
#arvie-filters .fsheet-clear{ font-weight:800; color:var(--av-ink); padding:12px; text-decoration:underline; text-underline-offset:3px; }
#arvie-filters .fsheet-show{
  flex:1; background:var(--av-blue); color:#fff; font-weight:800;
  padding:14px; border-radius:var(--av-r-sm); min-height:50px; text-align:center;
}
#arvie-filters .fsheet-show:active{ transform:scale(.99); }

/* ---- filter groups ---- */
#arvie-filters .fgroup{ padding:var(--av-s5) 0; border-top:1px solid var(--av-line-soft); }
#arvie-filters .fgroup:first-child{ border-top:none; padding-top:var(--av-s2); }
#arvie-filters .pop-lab{
  font-size:var(--av-fs-2xs); font-weight:800; text-transform:uppercase;
  letter-spacing:.05em; color:var(--av-muted); margin-bottom:var(--av-s2);
}
#arvie-filters .pop-lab.mt{ margin-top:var(--av-s4); }

/* steppers (Adults / Children) */
#arvie-filters .step{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 0; border-top:1px solid var(--av-line-soft);
}
#arvie-filters .step:first-of-type{ border-top:none; }
#arvie-filters .step-name{ font-weight:700; color:var(--av-ink); }
#arvie-filters .step-ctl{ display:flex; align-items:center; gap:14px; }
#arvie-filters .step-ctl button{
  width:44px; height:44px; border-radius:50%; border:1.5px solid var(--av-line);
  color:var(--av-ink); font-size:20px; font-weight:700;
  display:flex; align-items:center; justify-content:center;
}
#arvie-filters .step-ctl button:disabled{ opacity:.35; }
#arvie-filters .step-ctl b{ min-width:26px; text-align:center; font-weight:800; color:var(--av-ink); }

/* site type chips */
#arvie-filters .chip-row{ display:flex; flex-wrap:wrap; gap:8px; }
#arvie-filters .fchip{
  display:inline-flex; align-items:center; gap:6px; font-size:var(--av-fs-sm); font-weight:700;
  color:var(--av-body); background:var(--av-card); border:1.5px solid var(--av-line);
  border-radius:99px; padding:9px 14px; min-height:44px;
}
#arvie-filters .fchip[aria-pressed="true"]{ background:var(--av-green-wash); border-color:var(--av-green); color:var(--av-green-deep); }

/* rig length input */
#arvie-filters .riglen-row{ margin-top:var(--av-s3); }
#arvie-filters .riglen-row .fld{ max-width:150px; }
#arvie-filters .fin{
  width:100%; border:1.5px solid var(--av-line); border-radius:var(--av-r-xs);
  padding:11px; font-weight:700; color:var(--av-ink); background:var(--av-card); min-height:44px;
}
#arvie-filters .fin:focus{ outline:none; border-color:var(--av-blue); box-shadow:0 0 0 3px var(--av-blue-wash); }

/* radios (electric hookup) */
#arvie-filters .radios{ display:flex; flex-direction:column; gap:2px; }
#arvie-filters .radio{
  display:flex; align-items:center; gap:11px; padding:9px 0;
  font-weight:600; color:var(--av-body); cursor:pointer; min-height:44px;
}
#arvie-filters .radio input{ width:22px; height:22px; accent-color:var(--av-green); flex-shrink:0; }
#arvie-filters [data-av="ada-warn"]{
  color:#b42318; font-size:13px; font-weight:600; margin:8px 0 0;
}
#arvie-filters .ada-decl{
  display:flex; gap:11px; align-items:flex-start; margin-top:8px; padding:9px 0 18px;
  font-size:13px; font-weight:600; line-height:1.4; color:var(--av-body); cursor:pointer;
  scroll-margin-bottom:24px;
}
#arvie-filters .ada-decl input{ width:22px; height:22px; accent-color:var(--av-green); flex-shrink:0; margin-top:1px; }

/* toggles (pets / water / sewer / pull-through) */
#arvie-filters .tog{
  display:flex; align-items:center; justify-content:space-between; padding:11px 0;
  border-top:1px solid var(--av-line-soft); font-weight:700; color:var(--av-ink);
}
#arvie-filters .tog.first{ border-top:none; }
#arvie-filters .switch{ position:relative; width:48px; height:28px; flex-shrink:0; }
#arvie-filters .switch input{ opacity:0; width:0; height:0; position:absolute; }
#arvie-filters .switch .sl{ position:absolute; inset:0; background:var(--av-line); border-radius:99px; transition:background .2s var(--av-ease); }
#arvie-filters .switch .sl::before{
  content:''; position:absolute; width:22px; height:22px; left:3px; top:3px;
  background:#fff; border-radius:50%; transition:transform .2s var(--av-ease); box-shadow:0 1px 3px rgba(0,0,0,.2);
}
#arvie-filters .switch input:checked + .sl{ background:var(--av-green); }
#arvie-filters .switch input:checked + .sl::before{ transform:translateX(20px); }

/* the hidden inputs the legacy jQuery reads ($('#no_of_adult') etc.) */
#arvie-filters .av-models{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }

/* ---- desktop: same sheet presented as a centered modal (>=1024px) ---- */
@media (min-width:1024px){
  #arvie-filters .fsheet{
    left:50%; right:auto; top:50%; bottom:auto;
    width:min(560px,92vw); max-height:86vh; border-radius:20px;
    transform:translate(-50%,-46%); opacity:0; pointer-events:none;
    transition:transform .22s var(--av-ease), opacity .22s var(--av-ease);
  }
  #arvie-filters .fsheet.show{ transform:translate(-50%,-50%); opacity:1; pointer-events:auto; }
  #arvie-filters .fsheet-grab{ display:none; }
}

/* ---- reduced motion ---- */
@media (prefers-reduced-motion:reduce){
  #arvie-filters *,
  #arvie-filters *::before,
  #arvie-filters *::after{ animation:none !important; transition:none !important; }
}