/* Actisense Product Finder. Everything is scoped to .apf so the theme's styles and these never clash.
   Background matches actisense.com (#f2f2f2). Brand Guidelines 2024: Orange #db5d28, Deep Blue #05223D, Muted Blue #576271, Grey #888B8D (PRO only), white.
   Headings Adelle Sans (falls back to Roboto), subheadings Roboto Bold, body Roboto Regular. */
.apf{
  --apf-bg:#f2f2f2; --apf-on-bg:#05223d; --apf-on-bg-muted:#576271;
  --apf-surface:#ffffff; --apf-fg:#05223d; --apf-muted:#576271; --apf-line:#dde2e8;
  --apf-accent:#db5d28; --apf-link:#db5d28; --apf-chip:#eceff2; --apf-chip-on:#05223d; --apf-chip-on-ink:#ffffff;
  --apf-head:"adelle-sans","Adelle Sans","Roboto",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --apf-body:"Roboto",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  background:var(--apf-bg); color:var(--apf-fg); font-family:var(--apf-body); font-size:15px; line-height:1.45;
  text-align:left; box-sizing:border-box;
}
/* Break out of the theme's content column so the deep blue runs edge to edge. */
/* --apf-sbw is the scrollbar width, set by finder.js, so Windows scrollbars don't cause sideways scrolling. */
.apf.apf--full{--apf-vw:calc(100vw - var(--apf-sbw,0px)); width:var(--apf-vw)!important; max-width:var(--apf-vw)!important; margin-left:calc(50% - var(--apf-vw) / 2)!important; margin-right:calc(50% - var(--apf-vw) / 2)!important; position:relative}
/* The !important flags win over block themes that force content to a centred column. */
.apf *,.apf *::before,.apf *::after{box-sizing:border-box}
.apf p{margin:0;padding:0;border:0;background:none;text-transform:none;letter-spacing:normal}
.apf img{max-width:100%;height:auto;border:0;box-shadow:none}
.apf button{margin:0;box-shadow:none;text-shadow:none;min-height:0;min-width:0;width:auto}
.apf a{box-shadow:none}

.apf__wrap{max-width:1180px;margin:0 auto;padding:32px max(16px,env(safe-area-inset-right,0px)) 48px max(16px,env(safe-area-inset-left,0px))}
.apf__header{margin-bottom:26px}
.apf .apf__title{font-family:var(--apf-head);font-size:clamp(26px,4vw,38px)!important;font-weight:400!important;line-height:1.2;margin:0;color:var(--apf-on-bg);text-wrap:balance}
.apf .apf__lede{margin:12px 0 0;color:var(--apf-on-bg-muted);max-width:62ch;font-size:15px}

.apf__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:24px;align-items:start}
@media (max-width:860px){.apf__grid{grid-template-columns:1fr}}
.apf__panel{background:var(--apf-surface);border:1px solid var(--apf-line);border-radius:8px;padding:20px}
.apf .apf__h2{font-family:var(--apf-body);font-size:13px;letter-spacing:1.3px;text-transform:uppercase;color:var(--apf-muted);margin:0 0 14px;font-weight:700;display:flex;justify-content:space-between;align-items:center;gap:8px;line-height:1.3}
.apf__group{margin-bottom:16px}
.apf .apf__h3{font-family:var(--apf-body);font-size:14px;margin:0 0 8px;color:var(--apf-fg);font-weight:700;line-height:1.3}
.apf__chips{display:flex;flex-wrap:wrap;gap:8px}
.apf .apf__chip{appearance:none;-webkit-appearance:none;border:1px solid transparent;background:var(--apf-chip);color:var(--apf-fg);font-family:var(--apf-body);font-size:14px;font-weight:400;padding:8px 12px;border-radius:999px;cursor:pointer;text-align:left;line-height:1.3;display:inline-flex;gap:8px;align-items:center;text-transform:none;letter-spacing:normal}
.apf .apf__chip:hover{border-color:var(--apf-muted);background:var(--apf-chip);color:var(--apf-fg)}
.apf .apf__chip:focus-visible{outline:2px solid var(--apf-accent);outline-offset:2px}
.apf .apf__chip[aria-pressed="true"]{background:var(--apf-chip-on);color:var(--apf-chip-on-ink)}
.apf__tick{width:14px;height:15px;border-radius:50%;border:1.5px solid currentColor;flex:none;opacity:.55;background-position:center;background-repeat:no-repeat;background-size:contain}
.apf__chip[aria-pressed="true"] .apf__tick{border:0;border-radius:0;opacity:1;background-image:var(--apf-a-icon)}
.apf__req .apf__tick{border-radius:3px}
.apf__hr{border:0;border-top:1px solid var(--apf-line);margin:18px 0;height:0;background:none}
.apf .apf__clear{appearance:none;-webkit-appearance:none;background:none;border:0;padding:0;color:var(--apf-link);font-family:var(--apf-body);font-size:13px;font-weight:500;cursor:pointer;text-transform:none;letter-spacing:0}
.apf .apf__clear:hover{background:none;color:var(--apf-link);text-decoration:underline}
.apf .apf__clear:focus-visible{outline:2px solid var(--apf-accent)}

.apf .apf__summary{font-size:14px;color:var(--apf-on-bg-muted);margin:0 0 14px}
.apf__summary b{color:var(--apf-on-bg)}
.apf__results{display:grid;gap:12px}
.apf__card{background:var(--apf-surface);border:1px solid var(--apf-line);border-radius:8px;padding:16px 18px;display:grid;grid-template-columns:104px minmax(0,1fr);gap:18px;align-items:start}
.apf__body{display:grid;gap:8px;min-width:0}
.apf a.apf__media{display:flex;align-items:center;justify-content:center;width:104px;height:104px;border-radius:6px;background:#f7f8fa;overflow:hidden;text-decoration:none}
.apf .apf__photo{width:100%!important;height:100%!important;object-fit:contain;display:block}
.apf .apf__placeholder{width:34px!important;height:auto!important;opacity:.3;display:block}
@media (max-width:520px){.apf__card{grid-template-columns:64px minmax(0,1fr);gap:12px;padding:14px}.apf a.apf__media{width:64px;height:64px}.apf .apf__placeholder{width:24px!important}}
.apf__card--top{border-color:var(--apf-accent);box-shadow:0 0 0 1px var(--apf-accent)}
.apf__cardhead{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.apf__code{font-weight:700;font-size:20px;color:var(--apf-fg)}
.apf__type{color:var(--apf-muted);font-size:14px;margin-left:6px}
.apf .apf__pro{height:26px!important;width:auto!important;vertical-align:-6px;margin-left:8px;display:inline-block}
.apf__badge{font-weight:700;font-size:12px;letter-spacing:.8px;text-transform:uppercase;padding:3px 8px;border-radius:4px;white-space:nowrap;line-height:1.4}
.apf__badge--all{background:var(--apf-accent);color:#fff}
.apf__badge--part{background:var(--apf-chip);color:var(--apf-fg)}
.apf__badge--new{background:var(--apf-accent);color:#fff;margin-left:8px}
.apf__badge--soon{background:var(--apf-fg);color:#fff;margin-left:8px}
.apf .apf__why{margin:0;max-width:65ch;color:var(--apf-fg);font-size:15px}
.apf__meta{display:flex;flex-wrap:wrap;gap:6px}
.apf__pill{font-size:12.5px;padding:3px 8px;border-radius:4px;background:var(--apf-chip);color:var(--apf-fg);line-height:1.4}
.apf__pill--miss{background:transparent;border:1px dashed var(--apf-line);color:var(--apf-muted);text-decoration:line-through}
.apf a.apf__more{color:var(--apf-link);font-weight:500;text-decoration:none;font-size:14px;justify-self:start}
.apf a.apf__more:hover{text-decoration:underline;color:var(--apf-link)}
.apf__combo{background:var(--apf-surface);border:1px dashed var(--apf-accent);border-radius:8px;padding:14px 18px;font-size:14px;margin-bottom:12px}
.apf__combo b{color:var(--apf-accent)}
.apf__empty{background:var(--apf-surface);border:1px dashed var(--apf-line);border-radius:8px;padding:22px;color:var(--apf-muted)}
.apf .apf__foot{margin-top:28px;color:var(--apf-on-bg-muted);font-size:13px}
.apf .apf__foot a{color:var(--apf-on-bg);text-decoration:underline}
@media (prefers-reduced-motion:reduce){.apf *{transition:none!important}}