/* ==========================================================================
   OXIN RTL v3 — product family pages (oxin-plans.tpl)
   Each family has its own accent; plans are "spec plates" with resource
   meters scaled to the biggest plan in the group.
   ========================================================================== */
.oxp{--a:#1463D8;--a2:#60A5FA;--at:var(--blue-tint);display:grid;gap:var(--s5);margin-block-end:var(--s8)}
.oxp>*{min-inline-size:0}
.oxp.is-teal{--a:#0E9384;--a2:#2DD4BF;--at:var(--teal-tint)}
.oxp.is-violet{--a:#7C3AED;--a2:#A78BFA;--at:color-mix(in srgb,#7C3AED 12%,var(--surface))}
.oxp.is-ink{--a:#1E293B;--a2:#94A3B8;--at:var(--surface-2)}
.oxp.is-amber{--a:#C2690B;--a2:#FBBF24;--at:var(--amber-tint)}
.oxp.is-pink{--a:#DB2777;--a2:#F472B6;--at:color-mix(in srgb,#DB2777 12%,var(--surface))}

/* ---- hero ---- */
.oxp-hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s5) var(--s6);align-items:center;overflow:hidden;isolation:isolate;
  padding:var(--s8) var(--s8) var(--s5);border-radius:22px;color:#E2E8F0;background:linear-gradient(135deg,#0B1424 0%,#0E1B33 55%,#0B1A2A 100%);box-shadow:0 30px 60px -32px rgba(11,20,36,.65)}
.oxp-hero-grid{position:absolute;inset:0;z-index:-1;opacity:.5;
  background:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px) 0 0/100% 32px,linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px) 0 0/32px 100%;
  -webkit-mask-image:radial-gradient(ellipse at 80% 20%,#000 0%,transparent 70%);mask-image:radial-gradient(ellipse at 80% 20%,#000 0%,transparent 70%)}
.oxp-hero-glow{position:absolute;z-index:-1;inset-block-start:-50%;inset-inline-start:-10%;inline-size:55%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--a2) 40%,transparent),transparent 65%);filter:blur(8px)}
.oxp-hero-main{display:flex;align-items:flex-start;gap:var(--s5);min-inline-size:0}
.oxp-hero-ic{flex:none;display:grid;place-items:center;inline-size:72px;block-size:72px;border-radius:20px;font-size:30px;color:#fff;
  background:linear-gradient(160deg,var(--a2),var(--a));box-shadow:0 18px 36px -16px var(--a),inset 0 1px 0 rgba(255,255,255,.25)}
.oxp-eyebrow{display:inline-block;padding:2px 10px;border-radius:999px;background:rgba(255,255,255,.08);font-size:var(--fs-100);font-weight:700;color:#CBD5E1}
.ox-body .oxp-title{margin:8px 0 6px;font-size:var(--fs-900);font-weight:900;color:#fff;line-height:1.25}
.oxp-lede{margin:0;max-inline-size:58ch;font-size:var(--fs-400);color:#94A3B8;line-height:1.9}
.oxp-stats{display:grid;grid-auto-flow:column;gap:10px;margin:0}
.oxp-stats div{display:flex;flex-direction:column;gap:2px;min-inline-size:110px;padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1)}
.oxp-stats dt{font-size:var(--fs-100);font-weight:600;color:#94A3B8}
.oxp-stats dd{margin:0;font-size:var(--fs-700);font-weight:900;color:#fff;line-height:1.25}
.oxp-stats .is-price{background:linear-gradient(160deg,color-mix(in srgb,var(--a) 45%,transparent),rgba(255,255,255,.04));border-color:color-mix(in srgb,var(--a2) 45%,transparent)}
.oxp-stats .is-price dd{font-size:var(--fs-500)}
.oxp-stats small{display:block;font-size:var(--fs-100);font-weight:600;color:#CBD5E1}
.oxp-fams{grid-column:1/-1;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin-block-start:var(--s3);padding-block-start:var(--s4);border-block-start:1px solid rgba(255,255,255,.08)}
.oxp-fams::-webkit-scrollbar{display:none}
.oxp-fams a{flex:none;display:inline-flex;align-items:center;gap:8px;block-size:40px;padding-inline:14px;border-radius:11px;color:#94A3B8!important;font-size:var(--fs-200);font-weight:700;text-decoration:none!important;transition:background .15s,color .15s}
.oxp-fams a:hover{background:rgba(255,255,255,.07);color:#fff!important}
.oxp-fams a.is-on{background:#fff;color:#0E1726!important}
.oxp-fams a.is-on i{color:var(--a)}

/* ---- group picker ---- */
.oxp-picker{padding:var(--s3);border-radius:18px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-1)}
.oxp-tabs{display:flex;flex-wrap:wrap;gap:6px}
.oxp-tab{display:inline-flex;align-items:center;gap:8px;min-block-size:46px;padding:6px 12px;border:1.5px solid transparent;border-radius:12px;background:var(--surface-2);color:var(--ink-2);
  font:700 var(--fs-300) var(--font);cursor:pointer;text-align:start;transition:background .15s,border-color .15s,color .15s}
.oxp-tab[hidden]{display:none}
.oxp-tab:hover{border-color:color-mix(in srgb,var(--a) 35%,transparent);color:var(--ink)}
.oxp-tab small{font-size:var(--fs-100);font-weight:600;color:var(--ink-3)}
.oxp-tab-n{display:inline-grid;place-items:center;min-inline-size:22px;block-size:20px;padding-inline:6px;border-radius:999px;background:var(--surface);font-size:var(--fs-100);color:var(--ink-3)}
.oxp-tab.is-on{background:var(--a);border-color:var(--a);color:#fff;box-shadow:0 10px 20px -12px var(--a)}
.oxp-tab.is-on small{color:rgba(255,255,255,.75)}
.oxp-tab.is-on .oxp-tab-n{background:rgba(255,255,255,.2);color:#fff}
.oxp-tab .ox-flag{inline-size:22px;block-size:16px;border-radius:3px;object-fit:cover;box-shadow:0 0 0 1px rgba(14,23,38,.12)}
/* international: one even grid of location tiles (7 per row on desktop) */
.oxp-loc-top{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-block-end:12px}
.oxp-loc-top .oxp-search{flex:1 1 240px;margin:0}
.oxp-regs{display:flex;flex-wrap:wrap;gap:6px}
.oxp-regs button{display:inline-flex;align-items:center;gap:6px;block-size:44px;padding-inline:12px;border:1px solid var(--line);border-radius:11px;background:var(--surface);color:var(--ink-2);font:700 var(--fs-200) var(--font);cursor:pointer;white-space:nowrap;transition:background .15s,color .15s,border-color .15s}
.oxp-regs button small{font-weight:600;color:var(--ink-3)}
.oxp-regs button:hover{border-color:color-mix(in srgb,var(--a) 40%,var(--line))}
.oxp-regs button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--surface)}
.oxp-regs button[aria-pressed="true"] small{color:inherit;opacity:.7}
.oxp-picker.is-locations .oxp-tabs{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.oxp-picker.is-locations .oxp-tab{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"flag city city" "flag country n";align-items:center;gap:1px 8px;
  block-size:58px;min-block-size:0;padding:8px 10px;font-size:var(--fs-200)}
.oxp-picker.is-locations .oxp-tab[hidden]{display:none}
.oxp-picker.is-locations .ox-flag{grid-area:flag}
.oxp-picker.is-locations .oxp-tab-t{grid-area:city;min-inline-size:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:1.5}
.oxp-picker.is-locations .oxp-tab small{grid-area:country;min-inline-size:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:1.5}
.oxp-picker.is-locations .oxp-tab-n{grid-area:n;min-inline-size:20px;block-size:18px;padding-inline:5px}
.oxp-search{position:relative;display:flex;align-items:center;margin:0 0 12px}
.oxp-search i{position:absolute;inset-inline-start:14px;color:var(--ink-3);pointer-events:none}
.oxp-search input{inline-size:100%;block-size:46px;padding-inline:40px 14px;border-radius:12px;border:1.5px solid var(--line-2);background:var(--surface-2);color:var(--ink);font:500 var(--fs-300) var(--font)}
.oxp-search input:focus{outline:0;border-color:var(--a);background:var(--surface);box-shadow:0 0 0 3px var(--at)}
.oxp-none{margin:8px 0 0;color:var(--ink-3);text-align:center}
.oxp-none[hidden]{display:none}

/* ---- cycle + view bar ---- */
.oxp-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.oxp-cycles,.oxp-views{display:inline-flex;padding:4px;border-radius:13px;background:var(--surface);border:1px solid var(--line)}
.oxp-cycles button,.oxp-views button{display:inline-flex;align-items:center;gap:6px;block-size:40px;padding-inline:16px;border:0;border-radius:10px;background:none;color:var(--ink-3);
  font:700 var(--fs-200) var(--font);cursor:pointer;transition:background .15s,color .15s}
.oxp-cycles button[hidden]{display:none}
.oxp-cycles button:hover,.oxp-views button:hover{color:var(--ink)}
.oxp-cycles button[aria-checked="true"],.oxp-views button[aria-pressed="true"]{background:var(--ink);color:var(--surface)}

/* ---- group ---- */
.oxp-group[hidden]{display:none}
.oxp-group-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin-block-end:var(--s4)}
.ox-body .oxp-group-h h2{margin:0;font-size:var(--fs-600);font-weight:800}
.oxp-group-h p{margin:0;color:var(--ink-3);font-size:var(--fs-300)}
.oxp-group-store{margin-inline-start:auto;font-size:var(--fs-200);font-weight:700;color:var(--a)!important}

/* ---- plans ---- */
.oxp-plans{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:var(--s4);align-items:start}
.oxp-plans[hidden]{display:none}
.oxp-plan{position:relative;display:flex;flex-direction:column;gap:14px;padding:22px 20px 20px;border-radius:20px;background:var(--surface);border:1px solid var(--line);
  box-shadow:var(--sh-1);transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .2s;animation:ox-up .45s var(--ease) both}
.oxp-plan:nth-child(2){animation-delay:.05s}.oxp-plan:nth-child(3){animation-delay:.1s}.oxp-plan:nth-child(n+4){animation-delay:.15s}
.oxp-plan:hover{transform:translateY(-4px);box-shadow:0 24px 48px -26px rgba(14,23,38,.35);border-color:color-mix(in srgb,var(--a) 35%,var(--line))}
.oxp-plan.is-featured{border:1.5px solid var(--a);box-shadow:0 0 0 4px var(--at),0 24px 48px -26px var(--a)}
.oxp-plan-ribbon{position:absolute;inset-block-start:-12px;inset-inline-end:18px;padding:3px 12px;border-radius:999px;background:linear-gradient(90deg,var(--a),var(--a2));color:#fff;font-size:var(--fs-100);font-weight:800;box-shadow:0 8px 16px -8px var(--a)}
.oxp-plan-ribbon[hidden]{display:none}
.oxp-plan-h{display:flex;align-items:center;gap:10px}
.ox-body .oxp-plan-h h3{margin:0;font-size:var(--fs-500);font-weight:900;letter-spacing:0}
.oxp-leds{display:inline-flex;gap:4px}
.oxp-leds i{inline-size:7px;block-size:7px;border-radius:50%;background:var(--teal);box-shadow:0 0 6px var(--teal)}
.oxp-leds i+i{background:var(--a2);box-shadow:0 0 6px var(--a2);animation:oxp-blink 1.6s steps(2) infinite}
@keyframes oxp-blink{50%{opacity:.25}}
.oxp-price{display:flex;flex-direction:column;gap:2px;padding:14px;border-radius:14px;background:linear-gradient(160deg,var(--at),color-mix(in srgb,var(--at) 30%,var(--surface)))}
.oxp-price b{font-size:var(--fs-700);font-weight:900;color:var(--ink);line-height:1.3;font-variant-numeric:tabular-nums}
.oxp-price small{font-size:var(--fs-200);color:var(--ink-3)}
.oxp-save{align-self:flex-start;margin-block-start:4px;padding:1px 9px;border-radius:999px;background:var(--teal);color:#fff;font-style:normal;font-size:var(--fs-100);font-weight:800}
.oxp-save[hidden]{display:none}
.oxp-plan.is-other-cycle .oxp-price{opacity:.75}
.oxp .oxp-specs{display:grid;gap:2px;margin:0;padding:0;padding-inline:0;list-style:none}
.oxp-specs li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2px 10px;padding:8px 2px;border-block-end:1px dashed var(--line)}
.oxp-specs li:last-child{border-block-end:0}
.oxp-specs li.is-extra{display:none}
.oxp-plan.is-open .oxp-specs li.is-extra{display:grid}
.oxp-spec-k{display:flex;align-items:center;gap:8px;min-inline-size:0;font-size:var(--fs-200);color:var(--ink-3)}
.oxp-spec-k i{display:grid;place-items:center;flex:none;inline-size:26px;block-size:26px;border-radius:8px;background:var(--surface-2);color:var(--a);font-size:12px}
.oxp-specs b{font-size:var(--fs-300);font-weight:800;text-align:end;overflow-wrap:anywhere}
.oxp-meter{grid-column:1/-1;display:block;block-size:5px;border-radius:5px;background:var(--surface-2);overflow:hidden}
.oxp-meter i{display:block;block-size:100%;inline-size:0;border-radius:inherit;background:linear-gradient(90deg,var(--a),var(--a2));transition:inline-size .8s var(--ease)}
.oxp-more{display:flex;align-items:center;justify-content:center;gap:6px;block-size:38px;border:1px dashed var(--line-2);border-radius:10px;background:none;color:var(--a);font:700 var(--fs-200) var(--font);cursor:pointer}
.oxp-plan.is-open .oxp-more i{transform:rotate(180deg)}
.oxp-custom{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:14px;border-radius:14px;border:1px dashed color-mix(in srgb,var(--a) 40%,transparent);background:var(--at)}
.oxp-custom i{color:var(--a);font-size:var(--fs-500)}
.oxp-custom small{color:var(--ink-3);line-height:1.8}
.oxp-setup{margin:0;display:flex;align-items:center;gap:6px;font-size:var(--fs-200);color:var(--amber-ink)}
.oxp-order{display:flex;align-items:center;justify-content:center;gap:10px;block-size:50px;margin-block-start:auto;border-radius:14px;background:linear-gradient(180deg,color-mix(in srgb,var(--a) 80%,#fff),var(--a));
  color:#fff!important;font-size:var(--fs-300);font-weight:800;text-decoration:none!important;box-shadow:0 12px 24px -14px var(--a),inset 0 1px 0 rgba(255,255,255,.25);transition:filter .15s,transform .15s}
.oxp-order:hover{filter:brightness(1.08);transform:translateY(-1px)}
.oxp-order i{transition:translate .2s var(--ease)}
.oxp-order:hover i{translate:-3px 0}
.oxp-order.is-sm{block-size:38px;padding-inline:14px;border-radius:10px;font-size:var(--fs-200)}

/* ---- comparison table ---- */
.oxp-compare[hidden]{display:none}
.oxp-table-wrap{overflow-x:auto;border-radius:18px;border:1px solid var(--line);background:var(--surface);box-shadow:var(--sh-1)}
.oxp-table{inline-size:100%;min-inline-size:640px;border-collapse:collapse;font-size:var(--fs-300)}
.oxp-table th,.oxp-table td{padding:12px 14px;border-block-end:1px solid var(--line);text-align:center;vertical-align:middle}
.oxp-table thead th{position:sticky;top:0;background:var(--surface-2);font-weight:800}
.oxp-table thead th b{display:block;font-size:var(--fs-400)}
.oxp-table thead th span{display:block;font-size:var(--fs-200);color:var(--a);font-weight:800}
.oxp-table tbody th{text-align:start;font-weight:600;color:var(--ink-2);white-space:nowrap}
.oxp-table tbody th i{inline-size:22px;margin-inline-end:6px;color:var(--a)}
.oxp-table .is-featured{background:var(--at)}
.oxp-table tbody tr:hover td,.oxp-table tbody tr:hover th{background:color-mix(in srgb,var(--at) 50%,var(--surface))}
.oxp-table tfoot td,.oxp-table tfoot th{border-block-end:0}

/* ---- help strip ---- */
.oxp-help{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.3fr);gap:10px}
.oxp-help-i,.oxp-help-cta{display:flex;align-items:center;gap:12px;padding:16px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.oxp-help i{display:grid;place-items:center;flex:none;inline-size:40px;block-size:40px;border-radius:11px;background:var(--at);color:var(--a);font-size:var(--fs-400)}
.oxp-help span{display:flex;flex-direction:column;line-height:1.6;min-inline-size:0}
.oxp-help b{font-size:var(--fs-300);font-weight:800}
.oxp-help small{font-size:var(--fs-100);color:var(--ink-3)}
.oxp-help-cta{background:linear-gradient(120deg,#0B1424,#13284A);border-color:transparent;color:#fff!important;text-decoration:none!important}
.oxp-help-cta span{flex:1}
.oxp-help-cta b{color:#fff}.oxp-help-cta small{color:#94A3B8}
.oxp-help-cta>i:first-child{background:rgba(255,255,255,.1);color:#7DD3FC}
.oxp-help-cta>i:last-child{background:none;inline-size:auto;color:#7DD3FC}

@media (max-width:1199px){.oxp-picker.is-locations .oxp-tabs{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media (max-width:991px){.oxp-picker.is-locations .oxp-tabs{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media (max-width:1100px){
  .oxp-hero{grid-template-columns:1fr;padding:var(--s6)}
  .oxp-stats{grid-auto-flow:row;grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}
  .oxp-help{grid-template-columns:1fr 1fr}
}
@media (max-width:767px){
  .oxp-hero{padding:var(--s5) var(--s4);border-radius:18px}
  .oxp-hero-main{flex-direction:column;gap:var(--s3)}
  .oxp-hero-ic{inline-size:56px;block-size:56px;font-size:24px}
  .ox-body .oxp-title{font-size:var(--fs-700)}
  .oxp-lede{font-size:var(--fs-300)}
  .oxp-stats{grid-template-columns:1fr 1fr}
  .oxp-stats .is-price{grid-column:1/-1}
  .oxp-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-block-end:2px}
  .oxp-tabs::-webkit-scrollbar{display:none}
  .oxp-tab{flex:none}
  .oxp-picker.is-locations .oxp-tabs{grid-template-columns:repeat(3,minmax(0,1fr));max-block-size:372px;overflow-y:auto;overscroll-behavior:contain;padding:2px}
  .oxp-regs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;inline-size:100%}
  .oxp-regs::-webkit-scrollbar{display:none}
  .oxp-regs button{flex:none}
  .oxp-bar{flex-direction:column;align-items:stretch}
  .oxp-cycles{display:grid;grid-template-columns:repeat(4,1fr)}
  .oxp-cycles button{padding-inline:4px;justify-content:center}
  .oxp-views{align-self:stretch;display:grid;grid-template-columns:1fr 1fr}
  .oxp-views button{justify-content:center}
  .oxp-help{grid-template-columns:1fr}
  .oxp-group-store{margin-inline-start:0}
}
@media (max-width:520px){.oxp-picker.is-locations .oxp-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (prefers-reduced-motion:reduce){.oxp-plan,.oxp-leds i{animation:none}}

/* availability (WHMCS stock control, refreshed from OneProvider every 5 minutes) */
.oxp-plan.is-oos .oxp-specs,.oxp-plan.is-oos .oxp-price{opacity:.65}
.oxp-plan.is-oos .oxp-leds i{background:var(--red,#c8372d)!important;box-shadow:none!important}
.oxp-oos-tag{display:inline-flex;align-items:center;gap:6px;margin-inline-start:auto;padding:2px 10px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap;color:var(--red,#c8372d);background:var(--red-tint,#fef1f0)}
.oxp .oxp-order.is-oos,.oxp .oxp-order.is-oos:hover{background:var(--red-tint,#fef1f0)!important;color:var(--red,#c8372d)!important;border:1px dashed currentColor!important;box-shadow:none!important;cursor:not-allowed;transform:none!important}
.oxp-order.is-oos i{translate:0 0!important}
.oxp-tab-oos{display:block;margin-top:2px;font-size:11px;font-weight:700;color:var(--red,#c8372d)}
.oxp-tab.is-stock-off{display:none!important}
.oxp-stock{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;border:1px solid var(--line,#e3e8ef);border-radius:12px;background:var(--surface,#fff)}
.oxp-stock button{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:4px 12px;border:0;border-radius:9px;background:transparent;color:var(--ink-2,#3a4556);font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.oxp-stock button[aria-checked="true"]{background:var(--blue-tint,#eaf2fd);color:var(--blue,#1463d8)}
.oxp-dot{inline-size:8px;block-size:8px;border-radius:50%}
.oxp-dot.is-in{background:var(--teal,#0e9384)}
.oxp-dot.is-out{background:var(--red,#c8372d)}
.oxp-stock-none{margin:12px 0;padding:16px;border:1px dashed var(--line-2,#cfd6e0);border-radius:14px;text-align:center;color:var(--ink-3,#5e6a7c)}

/* location grid: 6 → 5 → 4 → 3 → 2 columns; every card has a status row (in stock / out of stock) */
.oxp-picker.is-locations .oxp-tabs{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.oxp-picker.is-locations .oxp-tab{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"flag city n" "flag country country" "st st st";
  block-size:auto;min-block-size:84px;align-content:center;gap:2px 10px;padding:10px 12px}
.oxp-picker.is-locations .oxp-tab-t{font-weight:800;font-size:var(--fs-300)}
.oxp-tab-st{grid-area:st;display:flex;align-items:center;gap:6px;margin-top:6px;padding-top:6px;border-top:1px dashed var(--line-2,#cfd6e0);
  font-size:11.5px;font-weight:700;color:var(--teal,#0e9384);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oxp-tab-st>i{flex:none;inline-size:7px;block-size:7px;border-radius:50%;background:currentColor}
.oxp-tab-st.is-part{color:var(--amber,#c2690b)}
.oxp-tab-st.is-out{color:var(--red,#c8372d)}
.oxp-tab.is-on .oxp-tab-st{color:#fff;border-top-color:rgba(255,255,255,.35)}
.oxp-tab:not(.is-on):has(.oxp-tab-st.is-out){background:color-mix(in srgb,var(--red-tint,#fef1f0) 55%,var(--surface-2))}
.oxp-tab:not(.is-on):has(.oxp-tab-st.is-out) .ox-flag{filter:grayscale(.6);opacity:.8}
@media (max-width:1199px){.oxp-picker.is-locations .oxp-tabs{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media (max-width:991px){.oxp-picker.is-locations .oxp-tabs{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:767px){.oxp-picker.is-locations .oxp-tabs{grid-template-columns:repeat(3,minmax(0,1fr));max-block-size:430px}}
@media (max-width:520px){.oxp-picker.is-locations .oxp-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---- plan filters (oxin-plans.js): a header with the result count and sorting, one card per filter, active filters as removable tags ---- */
.oxp-filter{margin-block:var(--s4,16px);border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:var(--sh-1);overflow:hidden}
.oxp-filter-h{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;padding:14px 18px;background:linear-gradient(180deg,color-mix(in srgb,var(--a) 7%,var(--surface)),var(--surface))}
.oxp-filter-t{display:inline-flex;align-items:center;gap:12px;padding:0;border:0;background:none;color:var(--ink);font:inherit;text-align:start;cursor:pointer}
.oxp-filter-ic{display:grid;place-items:center;flex:none;inline-size:42px;block-size:42px;border-radius:13px;background:var(--a);color:#fff;font-size:16px;box-shadow:0 8px 18px -8px color-mix(in srgb,var(--a) 75%,transparent)}
.oxp-filter-tt{display:grid;gap:2px}
.oxp-filter-tt b{font-size:var(--fs-400);font-weight:900;line-height:1.3}
.oxp-filter-sum{font-size:var(--fs-200);font-weight:700;color:var(--ink-3)}
.oxp-filter-c{margin-inline-start:2px;color:var(--ink-3);transition:transform .2s}
.oxp-filter.is-closed .oxp-filter-c{transform:rotate(90deg)}
.oxp-filter.is-closed .oxp-filter-body{display:none}
.oxp-sort{display:flex;align-items:center;gap:10px;min-inline-size:0}
.oxp-sort>span{display:inline-flex;align-items:center;gap:6px;flex:none;font-size:var(--fs-200);font-weight:800;color:var(--ink-3)}
.oxp-sort .oxp-chips{flex-wrap:nowrap;gap:2px;padding:3px;border:1px solid var(--line);border-radius:13px;background:var(--surface-2)}
.oxp-sort .oxp-chip{min-height:34px;border:0;border-radius:10px;background:none}
.oxp-sort .oxp-chip[aria-checked="true"]{background:var(--surface);color:var(--a);box-shadow:0 1px 2px rgba(15,23,42,.08),0 0 0 1px var(--line)}
.oxp-filter-body{padding:16px 18px 18px;border-top:1px solid var(--line)}
.oxp-fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.oxp-fcard{display:flex;flex-direction:column;gap:10px;min-inline-size:0;padding:12px 14px 14px;border:1px solid var(--line);border-radius:16px;background:var(--surface-2);transition:border-color .2s,background .2s}
.oxp-fcard.is-set{border-color:color-mix(in srgb,var(--a) 45%,var(--line));background:color-mix(in srgb,var(--a) 5%,var(--surface))}
.oxp-fcard.is-wide{grid-column:1/-1}
.oxp-fcard-h{display:flex;align-items:center;gap:10px;min-inline-size:0}
.oxp-fcard-i{display:grid;place-items:center;flex:none;inline-size:30px;block-size:30px;border-radius:9px;background:var(--surface);color:var(--a);font-size:13px;box-shadow:inset 0 0 0 1px var(--line)}
.oxp-fcard-h b{font-size:var(--fs-200);font-weight:800;color:var(--ink);white-space:nowrap}
.oxp-fcard-h em{min-inline-size:0;margin-inline-start:auto;overflow:hidden;color:var(--ink-3);font-size:var(--fs-100);font-style:normal;font-weight:800;text-overflow:ellipsis;white-space:nowrap}
.oxp-fcard.is-set .oxp-fcard-h em{color:var(--a)}
.oxp-chips{display:flex;flex-wrap:wrap;gap:6px}
.oxp-chip{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:3px 11px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink-2);font:inherit;font-size:var(--fs-200);font-weight:700;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,color .15s}
.oxp-chip:hover{border-color:color-mix(in srgb,var(--a) 45%,transparent);color:var(--ink)}
.oxp-chip[aria-checked="true"]{background:var(--a);border-color:var(--a);color:#fff}
.oxp-chip:focus-visible,.oxp-filter-t:focus-visible,.oxp-filter-reset:focus-visible,.oxp-ftag:focus-visible{outline:2px solid var(--a);outline-offset:2px}
.oxp-chip[aria-checked="true"] .oxp-dot{box-shadow:0 0 0 2px rgba(255,255,255,.7)}
.oxp-price-range{display:grid;gap:4px;padding-block-start:4px}
.oxp-price-range input{inline-size:100%;margin:0;accent-color:var(--a);direction:ltr;cursor:pointer}
.oxp-price-ends{display:flex;justify-content:space-between;direction:ltr;color:var(--ink-3);font-size:var(--fs-100);font-weight:700}
.oxp-price-range output{font:inherit}
.oxp-ftags{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-block-start:14px;padding-block-start:14px;border-block-start:1px dashed var(--line-2)}
.oxp-ftags[hidden]{display:none}
.oxp-ftags-t{font-size:var(--fs-200);font-weight:800;color:var(--ink-3)}
.oxp-ftags-l{display:contents}
.oxp-ftag{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:3px 10px;border:1px solid color-mix(in srgb,var(--a) 35%,transparent);border-radius:999px;background:color-mix(in srgb,var(--a) 10%,var(--surface));color:var(--ink);font:inherit;font-size:var(--fs-200);font-weight:700;cursor:pointer}
.oxp-ftag span{color:var(--ink-3);font-weight:600}
.oxp-ftag span::after{content:":"}
.oxp-ftag i{color:var(--ink-3);font-size:.9em}
.oxp-ftag:hover{border-color:var(--red,#c8372d)}
.oxp-ftag:hover i{color:var(--red,#c8372d)}
.oxp-filter-reset{margin-inline-start:auto;display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:3px 12px;border:1px solid var(--line-2);border-radius:999px;background:var(--surface);color:var(--ink-2);font:inherit;font-size:var(--fs-200);font-weight:700;cursor:pointer}
.oxp-filter-reset:hover{border-color:var(--red,#c8372d);color:var(--red,#c8372d)}
.oxp-tab.is-filter-off{display:none!important}
.oxp-tab-n.is-match{background:var(--a);color:#fff}
.oxp-tab.is-on .oxp-tab-n.is-match{background:#fff;color:var(--a)}
@media (max-width:767px){
  .oxp-filter-h{padding:12px 14px}
  .oxp-filter-body{padding:12px 14px 14px}
  .oxp-sort{inline-size:100%}
  .oxp-sort .oxp-chips{overflow-x:auto;scrollbar-width:none}
  .oxp-fgrid{grid-template-columns:minmax(0,1fr)}
  .oxp-fcard.is-wide{grid-column:auto}
  .oxp-fcard .oxp-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-block-end:2px}
  .oxp-chips::-webkit-scrollbar{display:none}
}