/* ==========================================================================
   OXIN RTL — shell v2: brand lockup, island header, mega menu, account menu,
   command palette, footer. Loaded after oxin.css (see includes/head.tpl).
   ========================================================================== */

/* --- brand lockup: the gauge mark, redrawn as vector ------------------- */
:root{--logo-a:#17B3BC;--logo-b:#1B2A44}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--logo-a:#2DD4D8;--logo-b:#C7D7F5}}
:root[data-theme="dark"]{--logo-a:#2DD4D8;--logo-b:#C7D7F5}
.ox-logo{display:inline-flex;align-items:center;text-decoration:none!important;color:var(--ink)!important;flex:none}
.ox-lockup{display:inline-flex;align-items:center;gap:10px;line-height:1}
.ox-mark{inline-size:44px;block-size:30px;flex:none;overflow:visible}
.ox-lockup--sm .ox-mark{inline-size:36px;block-size:25px}
.ox-lockup--lg .ox-mark{inline-size:60px;block-size:41px}
.ox-wordmark{display:grid;gap:4px}
.ox-wordmark b{font-size:var(--fs-500);font-weight:800;color:var(--ink);letter-spacing:normal}
.ox-lockup--lg .ox-wordmark b{font-size:var(--fs-600)}
.ox-wordmark small{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.24em;color:var(--ink-3);direction:ltr;text-align:right}
/* power-up: the needle sweeps from zero and settles; arcs draw in order */
.ox-mark-needle{transform-origin:32px 38px;transform-box:view-box;animation:ox-needle 1.4s cubic-bezier(.3,1.5,.5,1) .15s both}
@keyframes ox-needle{0%{transform:rotate(-132deg)}100%{transform:rotate(0)}}
.ox-mark-arcs path{stroke-dasharray:60;stroke-dashoffset:60;animation:ox-arc .9s var(--ease) forwards}
.ox-mark-arcs path:nth-child(2){animation-delay:.12s}
.ox-mark-arcs path:nth-child(3){animation-delay:.24s}
@keyframes ox-arc{to{stroke-dashoffset:0}}
.ox-logo:hover .ox-mark-needle{animation:ox-wiggle .7s var(--ease)}
@keyframes ox-wiggle{30%{transform:rotate(-14deg)}60%{transform:rotate(5deg)}100%{transform:rotate(0)}}

/* --- header: one row, lifts into a floating island on scroll ----------- */
.ox-hdr{position:sticky;top:0;z-index:1030;padding:0;background:transparent;border:0;-webkit-backdrop-filter:none;backdrop-filter:none;transition:padding var(--t-slow) var(--ease)}
.ox-hdr-island{margin-inline:auto;display:flex;align-items:center;gap:var(--s4);min-block-size:72px;padding-inline:clamp(16px,3vw,32px);max-inline-size:100%;
  background:color-mix(in srgb,var(--surface) 80%,transparent);-webkit-backdrop-filter:saturate(1.6) blur(18px);backdrop-filter:saturate(1.6) blur(18px);
  border-block-end:1px solid var(--line);
  transition:max-inline-size var(--t-slow) var(--ease),border-radius var(--t-slow) var(--ease),box-shadow var(--t-slow) var(--ease),min-block-size var(--t-slow) var(--ease)}
.ox-hdr.is-floating{padding:10px clamp(8px,2vw,24px) 0}
.ox-hdr.is-floating .ox-hdr-island{max-inline-size:var(--wrap);min-block-size:62px;border:1px solid color-mix(in srgb,var(--line-2) 70%,transparent);border-radius:18px;
  box-shadow:0 12px 32px -16px rgba(14,23,38,.28),inset 0 1px 0 rgba(255,255,255,.5)}
.ox-mainnav{position:relative;display:flex;align-items:center;gap:2px;margin-inline:auto}
.ox-nav-pill{position:absolute;left:0;top:50%;block-size:38px;margin-block-start:-19px;border-radius:12px;background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line);
  opacity:0;pointer-events:none;transition:transform var(--t-slow) var(--ease),width var(--t-slow) var(--ease),opacity var(--t) var(--ease)}
.ox-mi{position:relative}
.ox-mi-t{position:relative;z-index:1;display:inline-flex;align-items:center;gap:6px;min-block-size:40px;padding-inline:14px;border:0;border-radius:12px;background:transparent;
  font-size:var(--fs-300);font-weight:700;color:var(--ink-2)!important;text-decoration:none!important;white-space:nowrap;cursor:pointer}
.ox-mi-t:hover,.ox-mi.show>.ox-mi-t{color:var(--ink)!important}
.ox-mi-t.is-active{color:var(--blue)!important}
.ox-mi-t.is-active::before{content:'';position:absolute;inset-inline:42%;inset-block-end:1px;block-size:3px;border-radius:3px;background:var(--blue)}
.ox-mi-c{font-size:11px;opacity:.55;transition:transform var(--t) var(--ease)}
.ox-mi.show .ox-mi-c{transform:rotate(180deg)}
.ox-mi-t.dropdown-toggle::after{display:none}
.ox-count{display:inline-grid;place-items:center;min-inline-size:18px;block-size:18px;padding-inline:5px;border-radius:var(--r-pill);background:var(--blue-tint);color:var(--blue);font-size:10px;font-weight:800}

/* --- mega panel --------------------------------------------------------- */
.ox-body .ox-mega{left:auto;right:0;margin-block-start:14px;inline-size:min(92vw,560px);padding:10px;border:1px solid var(--line);border-radius:18px;
  background:color-mix(in srgb,var(--surface) 95%,transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:var(--sh-pop);
  grid-template-columns:minmax(0,1fr);gap:10px}
.ox-body .ox-mega.show{display:grid;animation:ox-drop var(--t) var(--ease)}
@keyframes ox-drop{from{opacity:0;transform:translateY(-6px)}}
.ox-mega::before{content:'';position:absolute;inset-block-start:-16px;inset-inline:0;block-size:16px}
.ox-body .ox-mega:has(.ox-mega-feat){inline-size:min(94vw,760px);grid-template-columns:minmax(0,1fr) 220px}
.ox-mega-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px}
.ox-mega-i{display:flex;align-items:flex-start;gap:12px;padding:12px;border-radius:12px;color:var(--ink)!important;text-decoration:none!important;transition:background-color var(--t-fast) var(--ease)}
.ox-mega-i:hover,.ox-mega-i:focus-visible{background:var(--surface-2)}
.ox-mega-ic{display:grid;place-items:center;inline-size:38px;block-size:38px;flex:none;border-radius:11px;background:var(--surface);border:1px solid var(--line);color:var(--blue);font-size:15px;
  box-shadow:0 1px 2px rgba(14,23,38,.06);transition:transform var(--t) var(--ease),background-color var(--t) var(--ease)}
.ox-mega-i:hover .ox-mega-ic{transform:translateY(-1px);background:var(--blue-tint)}
.ox-mega-tx{display:grid;gap:3px;min-inline-size:0}
.ox-mega-tx b{font-size:var(--fs-300);font-weight:800;line-height:1.5}
.ox-mega-tx small{font-size:var(--fs-200);color:var(--ink-3);line-height:1.55}
.ox-mega-feat{display:grid;align-content:start;gap:8px;padding:16px;border-radius:14px;color:var(--ink)!important;text-decoration:none!important;
  background:linear-gradient(160deg,var(--blue-tint),color-mix(in srgb,var(--teal) 10%,var(--surface)));border:1px solid color-mix(in srgb,var(--blue) 18%,transparent)}
.ox-mega-feat .ox-plate{justify-self:start}
.ox-mega-feat b{font-size:var(--fs-400);font-weight:800}
.ox-mega-feat small{font-size:var(--fs-200);color:var(--ink-2);line-height:1.6}
.ox-mega-feat .ox-link{margin-block-start:auto}

/* --- tools -------------------------------------------------------------- */
.ox-tools{gap:6px}
.ox-search-trigger{display:inline-flex;align-items:center;gap:8px;min-block-size:40px;padding-inline:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2);
  color:var(--ink-3);font-size:var(--fs-200);font-weight:600;cursor:pointer;transition:border-color var(--t-fast) var(--ease)}
.ox-search-trigger:hover{border-color:var(--line-2);color:var(--ink-2)}
.ox-search-trigger kbd{font-size:10px;padding:0 5px;border:1px solid var(--line-2);border-radius:5px;background:var(--surface);direction:ltr}
.ox-btn-ghost{background:transparent;color:var(--ink)!important}
.ox-btn-ghost:hover{background:var(--surface-2)}
.ox-acct-btn{display:inline-flex;align-items:center;gap:8px;min-block-size:42px;padding:3px;padding-inline-end:10px;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--surface);cursor:pointer;
  font-size:var(--fs-300);font-weight:700;color:var(--ink)}
.ox-acct-btn:hover{border-color:var(--line-2)}
.ox-ava{display:inline-grid;place-items:center;inline-size:34px;block-size:34px;border-radius:50%;flex:none;font-size:var(--fs-300);font-weight:800;color:#fff;background:linear-gradient(135deg,var(--logo-a),var(--blue))}
.ox-ava.is-lg{inline-size:44px;block-size:44px;font-size:var(--fs-500)}
.ox-body .ox-acct-menu{min-inline-size:260px;padding:8px;border-radius:16px}
.ox-acct-head{display:flex;align-items:center;gap:12px;padding:10px 10px 14px;margin-block-end:6px;border-block-end:1px solid var(--line)}
.ox-acct-head b{display:block;font-size:var(--fs-300);font-weight:800}
.ox-acct-head small{display:block;font-size:var(--fs-100);color:var(--ink-3)}
.ox-acct-menu .dropdown-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px}
.ox-acct-menu .dropdown-item i{color:var(--ink-3)}
.ox-acct-menu .dropdown-item.is-danger,.ox-acct-menu .dropdown-item.is-danger i{color:var(--red-ink)}
@media (max-width:1199px){.ox-hide-lg{display:none!important}.ox-search-trigger{padding-inline:10px}}
@media (max-width:1100px){.ox-mainnav{display:none}}

/* --- mobile sheet ------------------------------------------------------- */
.ox-lock{overflow:hidden}
.ox-sheet-panel{display:flex;flex-direction:column;gap:6px;inline-size:min(88vw,360px)}
.ox-sheet-head{display:flex;align-items:center;padding-block-end:12px;margin-block-end:6px;border-block-end:1px solid var(--line)}
.ox-sheet-list{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.ox-sheet-list a,.ox-acc-t{display:flex;align-items:center;gap:12px;inline-size:100%;min-block-size:48px;padding-inline:12px;border:0;border-radius:12px;background:transparent;
  font-size:var(--fs-400);font-weight:700;color:var(--ink)!important;text-decoration:none!important;text-align:start;cursor:pointer}
.ox-sheet-list a:hover,.ox-acc-t:hover{background:var(--surface-2)}
.ox-sheet-list i.fa-fw{color:var(--blue)}
.ox-acc-c{margin-inline-start:auto;transition:transform var(--t) var(--ease)}
.ox-acc-t[aria-expanded="true"] .ox-acc-c{transform:rotate(180deg)}
.ox-acc-p{list-style:none;margin:0 0 6px;padding:0;padding-inline-start:38px;display:grid;gap:2px}
.ox-acc-p a{min-block-size:42px;font-size:var(--fs-300);font-weight:600;color:var(--ink-2)!important}
.ox-sheet-sep{block-size:1px;background:var(--line);margin-block:8px}
.ox-sheet-foot{display:flex;flex-wrap:wrap;gap:8px;margin-block-start:auto;padding-block-start:16px}

/* --- command palette ---------------------------------------------------- */
.ox-pal{position:fixed;inset:0;z-index:1080;display:grid;place-items:start center;padding:12vh 16px 16px;background:var(--scrim);animation:ox-fade var(--t) var(--ease)}
.ox-pal[hidden]{display:none}
.ox-pal-box{inline-size:min(100%,640px);border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:var(--sh-pop);overflow:hidden;animation:ox-drop var(--t) var(--ease)}
.ox-pal-in{display:flex;align-items:center;gap:12px;padding:6px 16px;border-block-end:1px solid var(--line);color:var(--ink-3)}
.ox-pal-in input{flex:1;min-block-size:54px;border:0;background:transparent;font-family:var(--font);font-size:var(--fs-500);color:var(--ink);outline:none}
.ox-pal-list{max-block-size:min(58vh,460px);overflow-y:auto;padding:8px}
.ox-pal-grp{padding:10px 12px 4px;font-size:var(--fs-100);font-weight:800;color:var(--ink-3)}
.ox-pal-i{display:flex;align-items:center;gap:12px;inline-size:100%;min-block-size:48px;padding-inline:12px;border:0;border-radius:12px;background:transparent;text-align:start;font-size:var(--fs-300);font-weight:600;color:var(--ink);cursor:pointer}
.ox-pal-i i{inline-size:20px;text-align:center;color:var(--ink-3)}
.ox-pal-i small{margin-inline-start:auto;font-size:var(--fs-100);font-weight:500;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-inline-size:45%}
.ox-pal-i[aria-selected="true"]{background:var(--blue-tint);color:var(--blue)}
.ox-pal-i[aria-selected="true"] i{color:var(--blue)}
.ox-pal-empty{padding:18px 16px 6px;font-size:var(--fs-300);color:var(--ink-3)}
.ox-pal-foot{display:flex;flex-wrap:wrap;gap:16px;padding:10px 16px;border-block-start:1px solid var(--line);background:var(--surface-2);font-size:var(--fs-100);color:var(--ink-3)}
.ox-pal-foot kbd,.ox-pal-in kbd{font-size:10px;padding:0 5px;border:1px solid var(--line-2);border-radius:5px;background:var(--surface);margin-inline-end:3px;direction:ltr}

/* --- footer ------------------------------------------------------------- */
.ox-ftr{position:relative;margin-block-start:var(--s10);padding-block:0 var(--s6);background:var(--surface);border-block-start:1px solid var(--line);overflow-x:clip}
.ox-ftr-cta{position:relative;display:grid;gap:var(--s5);margin-block:calc(var(--s12) * -1) var(--s12);padding:clamp(24px,4vw,40px);border-radius:24px;overflow:hidden;
  background:radial-gradient(600px 300px at 15% 0%,color-mix(in srgb,var(--teal) 30%,transparent),transparent 70%),radial-gradient(700px 360px at 90% 120%,color-mix(in srgb,var(--blue) 45%,transparent),transparent 70%),#0E1A33;
  color:#EAF1FF;box-shadow:0 30px 60px -30px rgba(14,23,38,.5)}
@media (min-width:900px){.ox-ftr-cta{grid-template-columns:1fr auto;align-items:end}}
.ox-ftr-cta h2{color:#fff!important;font-size:var(--fs-800)!important;margin:var(--s3) 0 var(--s2)}
.ox-ftr-cta p{margin:0;color:#B9C8E6;font-size:var(--fs-400)}
.ox-ftr-cta .ox-plate{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:#D7E4FF}
.ox-ftr-cta-act{display:flex;flex-wrap:wrap;gap:var(--s3)}
.ox-ftr-cta .ox-btn-line{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#fff!important}
.ox-ftr-cta .ox-btn-blue{background:#fff;color:#0E1A33!important}
.ox-ftr-main{display:grid;gap:var(--s8);grid-template-columns:minmax(0,1fr)}
@media (min-width:992px){.ox-ftr-main{grid-template-columns:minmax(0,1.3fr) minmax(0,1.6fr) minmax(0,.7fr)}}
.ox-ftr-brand p{margin:var(--s4) 0;color:var(--ink-2);font-size:var(--fs-300);line-height:var(--lh-body);max-inline-size:44ch}
.ox-ftr-contact{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:var(--fs-200);color:var(--ink-2);line-height:1.7}
.ox-ftr-contact li{display:flex;gap:10px}
.ox-ftr-contact i{color:var(--blue);margin-block-start:4px;inline-size:14px;text-align:center}
.ox-ftr-contact b{display:block;color:var(--ink);font-weight:700}
.ox-ftr-cols{display:grid;gap:var(--s6);grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr))}
.ox-ftr h4{font-size:var(--fs-300)!important;font-weight:800;color:var(--ink)!important;margin-block-end:var(--s4)}
.ox-ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ox-ftr-cols a{color:var(--ink-2);font-size:var(--fs-300);text-decoration:none;transition:color var(--t-fast) var(--ease),padding var(--t) var(--ease)}
.ox-ftr-cols a:hover{color:var(--blue);padding-inline-start:4px}
.ox-ftr-trust{display:grid;align-content:start;gap:var(--s3)}
.ox-ftr-badge{display:inline-block;justify-self:start;padding:6px;border:1px solid var(--line);border-radius:14px;background:#fff}
.ox-ftr-badge img{display:block;border-radius:9px;max-inline-size:110px;block-size:auto}
.ox-ftr-status{display:inline-flex;align-items:center;gap:8px;justify-self:start;padding:6px 12px;border:1px solid var(--line);border-radius:var(--r-pill);font-size:var(--fs-200);font-weight:700;color:var(--ink-2)!important;text-decoration:none!important}
.ox-ftr-bottom{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3);margin-block-start:var(--s10);padding-block:var(--s5) clamp(60px,10vw,150px);border-block-start:1px solid var(--line);font-size:var(--fs-200);color:var(--ink-3)}
.ox-ftr-social,.ox-ftr-social ul{display:flex;gap:6px;margin:0;padding:0;list-style:none}
.ox-ftr-social a{display:inline-grid;place-items:center;inline-size:34px;block-size:34px;border-radius:10px;border:1px solid var(--line);color:var(--ink-2)}
.ox-chipbtn{display:inline-flex;align-items:center;gap:6px;min-block-size:34px;padding-inline:12px;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--surface);font-size:var(--fs-200);font-weight:600;color:var(--ink-2);cursor:pointer}
.ox-chipbtn:hover{border-color:var(--line-2);color:var(--ink)}
.ox-ftr-ghost{position:absolute;inset-inline:0;inset-block-end:-.16em;z-index:0;font-family:var(--font);font-weight:800;font-size:clamp(90px,19vw,280px);line-height:1;text-align:center;letter-spacing:.05em;
  color:transparent;-webkit-text-stroke:1px color-mix(in srgb,var(--line-2) 70%,transparent);pointer-events:none;user-select:none;direction:ltr}
.ox-ftr .ox-wrap{position:relative;z-index:1}
.ox-ftr{overflow:hidden}
.ox-ftr-cta{margin-block-start:var(--s12)}

/* --- store mega: core products + filterable location board ------------- */
.ox-body .ox-mega.ox-mega--store{inline-size:min(96vw,1060px);grid-template-columns:minmax(0,1fr);padding:12px}
.ox-store{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
@media (min-width:900px){.ox-store{grid-template-columns:270px minmax(0,1fr)}}
.ox-store-h{padding:4px 10px 8px;font-size:var(--fs-200);font-weight:800;color:var(--ink-3)}
.ox-store-h b{color:var(--blue)}
.ox-store-core{display:grid;align-content:start;gap:2px;padding:6px;border-radius:14px;background:var(--surface-2);max-block-size:min(62vh,520px);overflow-y:auto}
.ox-store-core .ox-mega-i{padding:9px 10px}
.ox-store-core .ox-mega-ic{inline-size:34px;block-size:34px;font-size:14px}
.ox-store-core .ox-mega-i:hover{background:var(--surface)}
.ox-store-loc{display:grid;grid-template-rows:auto minmax(0,1fr) auto;min-inline-size:0}
.ox-store-top{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding-inline-end:4px}
.ox-store-top .ox-store-h{padding-block-end:0}
.ox-store-filter{position:relative;margin:0 0 0 0;margin-inline-start:auto;flex:0 1 240px}
.ox-store-filter i{position:absolute;inset-inline-start:12px;top:50%;transform:translateY(-50%);font-size:13px;color:var(--ink-3);pointer-events:none}
.ox-store-filter input{inline-size:100%;min-block-size:38px;padding-inline:34px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);font-family:var(--font);font-size:var(--fs-300);color:var(--ink)}
.ox-store-filter input:focus{outline:none;border-color:var(--blue);background:var(--surface);box-shadow:0 0 0 3px var(--blue-tint)}
.ox-store-regions{display:grid;gap:14px;max-block-size:min(56vh,470px);overflow-y:auto;padding:12px 4px 4px;scrollbar-width:thin}
.ox-store-reg h5{display:flex;align-items:center;gap:8px;margin:0 0 8px;font-size:var(--fs-200)!important;font-weight:800;color:var(--ink)}
.ox-store-reg h5 span{font-size:10px;padding:0 6px;border-radius:var(--r-pill);background:var(--surface-2);color:var(--ink-3)}
.ox-store-chips{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px}
.ox-city{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:8px 11px;border:1px solid var(--line);border-radius:10px;background:var(--surface);
  color:var(--ink)!important;text-decoration:none!important;transition:border-color var(--t-fast) var(--ease),background-color var(--t-fast) var(--ease),transform var(--t-fast) var(--ease)}
.ox-city b{font-size:var(--fs-300);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ox-city small{font-size:var(--fs-100);color:var(--ink-3);white-space:nowrap}
.ox-city:hover,.ox-city:focus-visible{border-color:color-mix(in srgb,var(--blue) 40%,transparent);background:var(--blue-tint);transform:translateY(-1px)}
.ox-city[hidden],.ox-store-reg[hidden]{display:none}
.ox-store-none{margin:12px 6px 0;font-size:var(--fs-300);color:var(--ink-3)}
.ox-acc-filter input{inline-size:100%;min-block-size:40px;margin-block:4px;padding-inline:12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);font-family:var(--font);font-size:var(--fs-300);color:var(--ink)}
.ox-acc-p li[hidden]{display:none}

/* the store board is wider than any single menu item: centre it under the
   header in viewport coordinates instead of anchoring it to its trigger */
.ox-body .ox-mega.ox-mega--store{position:fixed;left:50%!important;right:auto!important;margin-block-start:0;translate:-50% 0}

/* ---- set from the admin (قالب کلاینت اکسین) ------------------------------ */
.ox-ann{--ann:var(--blue);position:relative;z-index:41;background:var(--ann);color:#fff;font-size:var(--fs-300);font-weight:600}
.ox-ann.is-teal{--ann:var(--teal)}.ox-ann.is-amber{--ann:var(--amber)}.ox-ann.is-red{--ann:var(--red)}.ox-ann.is-ink{--ann:#0E1726}
.ox-ann[hidden]{display:none}
.ox-ann-in{display:flex;align-items:center;justify-content:center;gap:12px;max-inline-size:var(--wrap);margin-inline:auto;padding:8px 16px;min-block-size:40px;text-align:center}
.ox-ann-in>a,.ox-ann-in>span{flex:1;color:#fff!important;text-decoration:none}
.ox-ann-in>a:hover{text-decoration:underline}
.ox-ann-x{display:grid;place-items:center;flex:none;inline-size:32px;block-size:32px;border:0;border-radius:8px;background:rgba(255,255,255,.14);color:#fff;cursor:pointer}
.ox-ann-x:hover{background:rgba(255,255,255,.24)}
.ox-lockup--img{display:inline-flex;align-items:center}
.ox-logo-img{display:block;block-size:var(--logo-h,40px);inline-size:auto;max-inline-size:220px;object-fit:contain}
.ox-logo-img.is-dark{display:none}
:root[data-theme="dark"] .ox-logo-img.has-dark{display:none}
:root[data-theme="dark"] .ox-logo-img.is-dark{display:block}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .ox-logo-img.has-dark{display:none}:root:not([data-theme="light"]) .ox-logo-img.is-dark{display:block}}
.oxf-badge.is-code{display:inline-block;padding:6px;border-radius:12px;background:#fff}
.oxf-badge.is-code img{max-inline-size:120px;block-size:auto}
.oxf-custom{position:relative;z-index:1}
@media (max-width:767px){.ox-ann-in{font-size:var(--fs-200);padding:6px 12px}.ox-logo-img{max-inline-size:150px}}

/* ---- login: aurora + node network + showcase (login.tpl) ------------------- */
.ox-auth{background:#060A18;isolation:isolate}
.ox-lg-aurora{position:fixed;inset:-20%;z-index:-1;pointer-events:none;filter:blur(70px) saturate(1.25);opacity:.95}
.ox-lg-aurora i{position:absolute;border-radius:50%;mix-blend-mode:screen;will-change:transform}
.ox-lg-aurora i:nth-child(1){inline-size:52vmax;block-size:52vmax;top:-6%;left:-4%;background:radial-gradient(circle,#1463D8 0%,rgba(20,99,216,0) 68%);animation:ox-au1 22s ease-in-out infinite alternate}
.ox-lg-aurora i:nth-child(2){inline-size:46vmax;block-size:46vmax;top:30%;right:-8%;background:radial-gradient(circle,#7C3AED 0%,rgba(124,58,237,0) 68%);animation:ox-au2 26s ease-in-out infinite alternate}
.ox-lg-aurora i:nth-child(3){inline-size:40vmax;block-size:40vmax;bottom:-12%;left:22%;background:radial-gradient(circle,#0EA5A4 0%,rgba(14,165,164,0) 66%);animation:ox-au3 20s ease-in-out infinite alternate}
.ox-lg-aurora i:nth-child(4){inline-size:26vmax;block-size:26vmax;top:8%;left:46%;background:radial-gradient(circle,rgba(255,122,24,.75) 0%,rgba(255,122,24,0) 66%);animation:ox-au4 18s ease-in-out infinite alternate}
@keyframes ox-au1{to{transform:translate(14vw,10vh) scale(1.15)}}
@keyframes ox-au2{to{transform:translate(-16vw,-12vh) scale(.9)}}
@keyframes ox-au3{to{transform:translate(10vw,-14vh) scale(1.2)}}
@keyframes ox-au4{to{transform:translate(-12vw,16vh) scale(1.3)}}
.ox-auth::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px) 0 0/56px 56px,linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px) 0 0/56px 56px;
  -webkit-mask-image:radial-gradient(ellipse at 50% 40%,#000 0%,transparent 75%);mask-image:radial-gradient(ellipse at 50% 40%,#000 0%,transparent 75%)}
.ox-netflow{z-index:0}
.ox-auth-fx{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.16;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.ox-auth .ox-auth-center{z-index:2}
.ox-auth .ox-auth-card{background:color-mix(in srgb,var(--surface) 92%,transparent);border-color:rgba(255,255,255,.18);
  box-shadow:0 40px 90px -30px rgba(2,6,23,.8),0 0 0 1px rgba(255,255,255,.08),0 0 80px -20px rgba(96,165,250,.35),inset 0 1px 0 rgba(255,255,255,.5)}
:root[data-theme="dark"] .ox-auth .ox-auth-card{background:color-mix(in srgb,var(--surface) 86%,transparent)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .ox-auth .ox-auth-card{background:color-mix(in srgb,var(--surface) 86%,transparent)}}
.ox-auth .ox-auth-pill{background:rgba(10,16,32,.5);border:1px solid rgba(255,255,255,.12);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.ox-auth .ox-auth-pill button,.ox-auth .ox-auth-pill a{color:#DBEAFE!important}
.ox-auth .ox-auth-pill button:hover,.ox-auth .ox-auth-pill a:hover{background:rgba(255,255,255,.1);color:#fff!important}

/* showcase */
.ox-lg-stage{display:none}
@media (min-width:1100px){
  .ox-auth .ox-auth-center{inline-size:46%;margin-inline-start:0}
  .ox-lg-stage{position:fixed;inset-block:0;inset-inline-end:0;inline-size:54%;z-index:1;display:flex;flex-direction:column;justify-content:center;gap:34px;padding:48px clamp(32px,5vw,90px);color:#E2E8F0}
}
.ox-lg-copy{max-inline-size:520px}
.ox-lg-eyebrow{display:inline-flex;align-items:center;gap:8px;padding:5px 14px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);font-size:13px;font-weight:700;color:#A7F3D0}
.ox-body .ox-lg-copy h2{margin:16px 0 10px;font-size:clamp(1.8rem,2.6vw,2.6rem);font-weight:900;line-height:1.3;color:#fff;
  background:linear-gradient(90deg,#fff 30%,#BFDBFE 60%,#DDD6FE);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.ox-lg-copy p{margin:0;font-size:15px;line-height:2;color:#B6C3D8}
.ox-lg-board{position:relative;display:grid;grid-template-columns:1.25fr 1fr;grid-template-rows:auto auto auto;gap:16px;max-inline-size:600px}
.ox-lg-card{position:relative;padding:16px 18px;border-radius:20px;background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 30px 60px -30px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.18);
  animation:ox-lg-bob 7s ease-in-out infinite;transition:translate .25s ease-out}
.ox-lg-card:nth-child(2){animation-delay:-2s}.ox-lg-card:nth-child(3){animation-delay:-4s}.ox-lg-card:nth-child(4){animation-delay:-1s}
@keyframes ox-lg-bob{50%{transform:translateY(-8px)}}
.ox-lg-card-h{display:flex;align-items:center;gap:8px;margin-block-end:10px;font-size:13px;font-weight:700;color:#CBD5E1}
.ox-lg-card-h i{color:#93C5FD}
.ox-lg-card-h b{margin-inline-start:auto;font:800 18px/1 var(--mono);color:#fff}
.ox-lg-card.is-server{grid-row:span 2;display:flex;flex-direction:column;justify-content:space-between;padding:10px 14px 14px;
  background:radial-gradient(300px 200px at 70% 0%,rgba(1,169,130,.22),transparent 70%),linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.03))}
.ox-lg-card.is-server .oxh-scene{block-size:190px}
.ox-lg-srvmeta{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12.5px;color:#A7F3D0}
.ox-lg-srvmeta b{font:700 12.5px/1 var(--mono);color:#E2E8F0}
.ox-lg-srvmeta span{display:inline-flex;align-items:center;gap:6px}
.ox-lg-spark{display:block;inline-size:100%;block-size:64px}
.ox-lg-card.is-uptime{display:flex;align-items:center;gap:14px}
.ox-lg-ring{position:relative;display:grid;place-items:center;flex:none;inline-size:64px;block-size:64px}
.ox-lg-ring svg{position:absolute;inset:0;transform:rotate(-90deg)}
.ox-lg-ring circle{fill:none;stroke-width:3.2}
.ox-lg-ring .bg{stroke:rgba(255,255,255,.12)}
.ox-lg-ring .fg{stroke:#34D399;stroke-linecap:round;stroke-dasharray:99.99 100;animation:ox-lg-ring 2.4s ease-out both}
@keyframes ox-lg-ring{from{stroke-dasharray:0 100}}
.ox-lg-ring b{position:relative;font-size:11px;font-weight:900;color:#fff}
.ox-lg-uptx{display:flex;flex-direction:column;line-height:1.7}
.ox-lg-uptx b{font-size:14px;color:#fff}
.ox-lg-uptx small{font-size:12px;color:#A5B4CB}
.ox-lg-card.is-locs{grid-column:1/-1}
.ox-lg-card.is-locs ul{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0;padding:0;list-style:none}
.ox-lg-card.is-locs li{display:flex;align-items:center;gap:7px;padding:8px 10px;border-radius:12px;background:rgba(255,255,255,.06);font-size:12.5px;font-weight:700;color:#E2E8F0}
.ox-lg-card.is-locs img{inline-size:20px;block-size:15px;border-radius:3px;object-fit:cover}
.ox-lg-card.is-locs .ox-live{margin-inline-start:auto}
.ox-lg-toast{position:absolute;inset-block-start:-26px;inset-inline-start:42%;z-index:2;display:flex;align-items:center;gap:10px;padding:10px 14px 10px 16px;border-radius:14px;
  background:rgba(255,255,255,.94);color:#0E1726;font-size:13px;font-weight:700;box-shadow:0 24px 50px -20px rgba(0,0,0,.6);white-space:nowrap;
  transition:opacity .4s ease,transform .4s ease,translate .25s ease-out}
.ox-lg-toast.is-out{opacity:0;transform:translateY(-8px)}
.ox-lg-toast-ic{display:grid;place-items:center;inline-size:26px;block-size:26px;border-radius:50%;background:linear-gradient(135deg,#34D399,#0E9384);color:#fff;font-size:12px}
@media (prefers-reduced-motion:reduce){.ox-lg-aurora i,.ox-lg-card{animation:none}}

/* --- logo: a size up everywhere (header, mobile sheet, footer) --------- */
/* .ox-logo svg in oxin.css (28px) is more specific than .ox-mark, hence the .ox-logo prefix */
.ox-logo .ox-mark,.ox-mark{inline-size:56px;block-size:38px}
.ox-logo .ox-lockup--sm .ox-mark{inline-size:46px;block-size:31px}
.ox-logo .ox-lockup--lg .ox-mark{inline-size:76px;block-size:52px}
.ox-lockup{gap:12px}
.ox-wordmark b{font-size:var(--fs-600)}
.ox-lockup--sm .ox-wordmark b{font-size:var(--fs-500)}
.ox-lockup--lg .ox-wordmark b{font-size:var(--fs-700)}
.ox-wordmark small{font-size:11px}
.ox-lockup--img{--logo-scale:1.25}
.ox-lockup--img .ox-logo-img{block-size:calc(var(--logo-h,40px) * var(--logo-scale))}
@media (max-width:767px){.ox-logo .ox-mark{inline-size:48px;block-size:33px}.ox-wordmark b{font-size:var(--fs-500)}}

/* --- theme switch icon (inline SVG, see oxin.js paintTheme) ------------ */
.ox-ti{inline-size:19px;block-size:19px;display:block}

/* --- "نمایندگی": announced, not open yet — hover/focus shows a note ------ */
.ox-mi-soon .ox-mi-t{cursor:default;gap:7px}
.ox-mi-soon .ox-mi-t>i{font-size:.9em;opacity:.7}
.ox-soon-tip{position:absolute;inset-block-start:calc(100% + 10px);inset-inline-start:50%;translate:50% 4px;z-index:1050;display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:var(--sh-2,0 12px 30px rgba(15,23,42,.14));color:var(--ink);font-size:var(--fs-200);font-weight:700;white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s,translate .18s,visibility .18s}
.ox-soon-tip::before{content:"";position:absolute;inset-block-start:-6px;inset-inline-start:50%;margin-inline-start:-6px;inline-size:12px;block-size:12px;border-block-start:1px solid var(--line);border-inline-start:1px solid var(--line);background:var(--surface);rotate:45deg}
.ox-soon-tip i{color:var(--amber,#f59e0b)}
.ox-mi-soon .ox-mi-t:hover .ox-soon-tip,.ox-mi-soon .ox-mi-t:focus .ox-soon-tip{opacity:1;visibility:visible;translate:50% 0}
.ox-acc-soon .ox-acc-t{cursor:default;flex-wrap:wrap}
.ox-acc-soon .ox-acc-t small{flex-basis:100%;margin-inline-start:30px;color:var(--ink-3);font-size:var(--fs-100);font-weight:500}

/* the header gained an item: the shortcut hint stays on one line, and gives way on narrower screens */
.ox-search-trigger kbd{white-space:nowrap}
@media (max-width:1399px){.ox-search-trigger kbd{display:none}}

/* the header carries nine items: on mid-size screens the items tighten, search becomes an icon,
   and the mobile menu takes over a little earlier */
@media (max-width:1439px){.ox-mi-t{padding-inline:9px}.ox-search-trigger>span{display:none}.ox-mi-soon .ox-mi-t>i:first-child{display:none}}
@media (max-width:1180px){.ox-mainnav{display:none}}
@media (max-width:1180px){.ox-only-mob{display:inline-grid!important}}
