@inploi/plugin-job-search 0.0.4 → 0.0.6

package/dist/plugin-job-search.cjs

@@ -514,7 +514,75 @@ function C$1(t2, l2, c4, p2, u2) {
   return B2 || ("string" == typeof H2 ? B2 = s$1(H2) : null != H2 && false !== H2 && true !== H2 && (B2 = C$1(H2, l2, "svg" === E2 || "foreignObject" !== E2 && c4, p2, t2))), d$1 && d$1(t2), t2.__ = void 0, m$1 && m$1(t2), !B2 && S.has(E2) ? q2 + "/>" : q2 + ">" + B2 + "</" + E2 + ">";
 }
 var S = /* @__PURE__ */ new Set(["area", "base", "br", "col", "command", "embed", "hr", "img", "input", "keygen", "link", "meta", "param", "source", "track", "wbr"]);
-var t, r$2, u$1, i, o = 0, f$3 = [], c$1 = [], e$2 = l$2.__b, a = l$2.__r, v = l$2.diffed, l = l$2.__c, m = l$2.unmount;
+var f$3 = 0;
+function u$1(e2, t2, n2, o2, i2, u2) {
+  var a2, c4, p2 = {};
+  for (c4 in t2)
+    "ref" == c4 ? a2 = t2[c4] : p2[c4] = t2[c4];
+  var l2 = { type: e2, props: p2, key: n2, ref: a2, __k: null, __: null, __b: 0, __e: null, __d: void 0, __c: null, constructor: void 0, __v: --f$3, __i: -1, __u: 0, __source: i2, __self: u2 };
+  if ("function" == typeof e2 && (a2 = e2.defaultProps))
+    for (c4 in a2)
+      void 0 === p2[c4] && (p2[c4] = a2[c4]);
+  return l$2.vnode && l$2.vnode(l2), l2;
+}
+const Fallback = ({
+  error,
+  resetError
+}) => {
+  return u$1("div", {
+    style: {
+      padding: "0 1rem",
+      fontSize: "1rem",
+      color: "#333333",
+      fontFamily: "'system-ui' 'Helvetica'"
+    },
+    children: ["Something went wrong.", u$1("br", {}), ' Error Message: "', error.message, '"', u$1("button", {
+      onClick: resetError,
+      style: {
+        background: "#efefef",
+        border: "none",
+        cursor: "pointer",
+        padding: "0.5rem 1rem"
+      },
+      children: "Retry"
+    })]
+  });
+};
+class ErrorBoundary extends b$2 {
+  constructor() {
+    super(...arguments);
+    __publicField(this, "state", {
+      error: null
+    });
+  }
+  static getDerivedStateFromError(error) {
+    return {
+      error: error.message
+    };
+  }
+  componentDidCatch(error) {
+    this.setState({
+      error
+    });
+  }
+  render() {
+    if (this.state.error) {
+      const {
+        Fallback: Fallback2
+      } = this.props;
+      return u$1(Fallback2, {
+        error: this.state.error,
+        resetError: () => {
+          this.setState({
+            error: null
+          });
+        }
+      });
+    }
+    return this.props.children;
+  }
+}
+var t, r$2, u, i, o = 0, f$2 = [], c$1 = [], e$2 = l$2.__b, a = l$2.__r, v = l$2.diffed, l = l$2.__c, m = l$2.unmount;
 function d(t2, u2) {
   l$2.__h && l$2.__h(r$2, t2, o || u2), o = 0;
   var i2 = r$2.__H || (r$2.__H = { __: [], __h: [] });
@@ -616,7 +684,7 @@ function V$1() {
   return n2.__;
 }
 function b() {
-  for (var t2; t2 = f$3.shift(); )
+  for (var t2; t2 = f$2.shift(); )
     if (t2.__P && t2.__H)
       try {
         t2.__H.__h.forEach(k$3), t2.__H.__h.forEach(w$1), t2.__H.__h = [];
@@ -629,15 +697,15 @@ l$2.__b = function(n2) {
 }, l$2.__r = function(n2) {
   a && a(n2), t = 0;
   var i2 = (r$2 = n2.__c).__H;
-  i2 && (u$1 === r$2 ? (i2.__h = [], r$2.__h = [], i2.__.forEach(function(n3) {
+  i2 && (u === r$2 ? (i2.__h = [], r$2.__h = [], i2.__.forEach(function(n3) {
     n3.__N && (n3.__ = n3.__N), n3.__V = c$1, n3.__N = n3.i = void 0;
-  })) : (i2.__h.forEach(k$3), i2.__h.forEach(w$1), i2.__h = [], t = 0)), u$1 = r$2;
+  })) : (i2.__h.forEach(k$3), i2.__h.forEach(w$1), i2.__h = [], t = 0)), u = r$2;
 }, l$2.diffed = function(t2) {
   v && v(t2);
   var o2 = t2.__c;
-  o2 && o2.__H && (o2.__H.__h.length && (1 !== f$3.push(o2) && i === l$2.requestAnimationFrame || ((i = l$2.requestAnimationFrame) || j$1)(b)), o2.__H.__.forEach(function(n2) {
+  o2 && o2.__H && (o2.__H.__h.length && (1 !== f$2.push(o2) && i === l$2.requestAnimationFrame || ((i = l$2.requestAnimationFrame) || j$1)(b)), o2.__H.__.forEach(function(n2) {
     n2.i && (n2.__H = n2.i), n2.__V !== c$1 && (n2.__ = n2.__V), n2.i = void 0, n2.__V = c$1;
-  })), u$1 = r$2 = null;
+  })), u = r$2 = null;
 }, l$2.__c = function(t2, r2) {
   r2.some(function(t3) {
     try {
@@ -2140,6 +2208,14 @@ var ValiError = class extends Error {
     this.issues = issues;
   }
 };
+function coerce(schema, action) {
+  return {
+    ...schema,
+    _parse(input, info) {
+      return schema._parse(action(input), info);
+    }
+  };
+}
 function getIssues(issues) {
   return { issues };
 }
@@ -2613,7 +2689,7 @@ const getRelativeTimeDifference = ({
   return diffIn.months < 0 ? "a long time ago" : "in a long time";
 };
 const SEVEN_DAYS_MS = 1e3 * 60 * 60 * 24 * 7;
-const AvailablePropertiesSchema = record(array(string()));
+const AvailablePropertiesSchema = record(array(coerce(string(), String)));
 const PaginationSchema = object({
   total: number(),
   current_page: number(),
@@ -2621,7 +2697,7 @@ const PaginationSchema = object({
   last_page: number()
 });
 const payPeriods = {
-  ANNUALY: "per year",
+  ANNUALLY: "per year",
   DAILY: "per day",
   HOURLY: "per hour",
   MONTHLY: "per month",
@@ -2633,14 +2709,14 @@ const JobPayloadSchema = object({
   company_logo: string(),
   employment_type: union([literal("FULL_TIME"), literal("PART_TIME"), literal("TEMPORARY"), literal("CONTRACTOR"), literal("INTERN"), literal("VOLUNTEER"), literal("OTHER")]),
   location_type: union([literal("LOCATION"), literal("REMOTE"), literal("HYBRID")]),
-  pay_type: union([literal("ANNUALY"), literal("HOURLY"), literal("MONTHLY"), literal("WEEKLY"), literal("DAILY")]),
+  pay_type: union([literal("ANNUALLY"), literal("HOURLY"), literal("MONTHLY"), literal("WEEKLY"), literal("DAILY")]),
   pay_currency: string(),
   // Whether to mask the pay and show as "competitive"
   pay_mask: boolean(),
   // Whether to display pay at all
   pay_display: boolean(),
   // Decimal numeric string e.g. "12.70"
-  pay: string(),
+  pay: nullable(string()),
   // Decimal numeric string e.g. "12.70"
   pay_min: nullable(string()),
   // Decimal numeric string e.g. "12.70"
@@ -2654,7 +2730,7 @@ const JobPayloadSchema = object({
   // E.g.: Any varchar, e.g.: "Permanent contract"
   contract_type: nullable(string()),
   created_at: string(),
-  custom_data: record(any())
+  custom_data: nullable(record(any()))
 });
 const JobSchema = transform(JobPayloadSchema, (schema) => {
   const isNew = new Date(schema.created_at).getTime() > Date.now() - SEVEN_DAYS_MS;
@@ -2662,6 +2738,17 @@ const JobSchema = transform(JobPayloadSchema, (schema) => {
     style: "currency",
     currency: schema.pay_currency
   });
+  const pay = (() => {
+    if (schema.pay_display === false)
+      return void 0;
+    if (schema.pay_mask)
+      return "Competitive";
+    if (schema.pay_max && schema.pay_min)
+      return numberFormatter.formatRange(+schema.pay_min, +schema.pay_max);
+    if (schema.pay)
+      return [numberFormatter.format(+schema.pay), payPeriods[schema.pay_type]].join(" ");
+    throw new Error("Invalid pay data");
+  })();
   return {
     id: schema.id,
     isNew,
@@ -2671,7 +2758,7 @@ const JobSchema = transform(JobPayloadSchema, (schema) => {
     },
     employmentType: schema.employment_type,
     locationType: schema.location_type,
-    pay: !schema.pay_display ? void 0 : schema.pay_mask ? "Competitive" : schema.pay_max && schema.pay_min ? [numberFormatter.formatRange(+schema.pay_min, +schema.pay_max), payPeriods[schema.pay_type]].join(" ") : [numberFormatter.format(+schema.pay), payPeriods[schema.pay_type]].join(" "),
+    pay,
     description: schema.description,
     title: schema.title,
     coordinates: schema.coordinates,
@@ -2699,7 +2786,6 @@ const getJobSearchResults = async ({
   filters
 }) => {
   try {
-    console.log(filters);
     const response = await apiClient.fetch("/search", {
       method: "POST",
       body: JSON.stringify({
@@ -2790,149 +2876,138 @@ const defineConfig = (options) => {
   return { compose: compose1, cva: cva1, cx: cx1 };
 };
 const { compose, cva, cx } = defineConfig();
-var f$2 = 0;
-function u(e2, t2, n2, o2, i2, u2) {
-  var a2, c4, p2 = {};
-  for (c4 in t2)
-    "ref" == c4 ? a2 = t2[c4] : p2[c4] = t2[c4];
-  var l2 = { type: e2, props: p2, key: n2, ref: a2, __k: null, __: null, __b: 0, __e: null, __d: void 0, __c: null, constructor: void 0, __v: --f$2, __i: -1, __u: 0, __source: i2, __self: u2 };
-  if ("function" == typeof e2 && (a2 = e2.defaultProps))
-    for (c4 in a2)
-      void 0 === p2[c4] && (p2[c4] = a2[c4]);
-  return l$2.vnode && l$2.vnode(l2), l2;
-}
 const icons = {
-  briefcase: u(g$3, {
-    children: [u("path", {
+  briefcase: u$1(g$3, {
+    children: [u$1("path", {
       d: "M17.25 7.75H6.75C5.64543 7.75 4.75 8.64543 4.75 9.75V16.25C4.75 17.3546 5.64543 18.25 6.75 18.25H17.25C18.3546 18.25 19.25 17.3546 19.25 16.25V9.75C19.25 8.64543 18.3546 7.75 17.25 7.75Z"
-    }), u("path", {
+    }), u$1("path", {
       d: "M4.75 11.75H19.25"
-    }), u("path", {
+    }), u$1("path", {
       d: "M13.25 12.25V13.25H10.75V12.25H13.25Z"
-    }), u("path", {
+    }), u$1("path", {
       d: "M9.25 7.5V6.25C9.25 5.42157 9.92157 4.75 10.75 4.75H13.25C14.0784 4.75 14.75 5.42157 14.75 6.25V7.5"
     })]
   }),
-  brand: u(g$3, {
-    children: [u("path", {
+  brand: u$1(g$3, {
+    children: [u$1("path", {
       d: "M18.45 13.9901C18.1288 15.031 17.5574 15.9886 16.773 16.773C15.5071 18.0388 13.7902 18.75 12 18.75C10.2098 18.75 8.49289 18.0388 7.22702 16.773C6.44262 15.9886 5.87122 15.031 5.55003 13.9901"
-    }), u("path", {
+    }), u$1("path", {
       d: "M9.87868 14.8713C10.1573 15.1499 10.488 15.3709 10.8519 15.5216C11.2159 15.6724 11.606 15.75 12 15.75C12.394 15.75 12.7841 15.6724 13.1481 15.5216C13.512 15.3709 13.8427 15.1499 14.1213 14.8713"
-    }), u("path", {
+    }), u$1("path", {
       d: "M17.0791 7.55413C16.7038 7.12546 16.2758 6.74602 15.8053 6.42486"
-    }), u("path", {
+    }), u$1("path", {
       d: "M12.8451 5.30311C12.2799 5.23179 11.7079 5.2323 11.1428 5.30465"
-    }), u("path", {
+    }), u$1("path", {
       d: "M8.25666 6.38307C7.78259 6.69901 7.35043 7.07369 6.97047 7.49818"
-    }), u("circle", {
+    }), u$1("circle", {
       cx: "18.75",
       cy: "12",
       r: "2"
-    }), u("circle", {
+    }), u$1("circle", {
       cx: "5.25",
       cy: "12",
       r: "2"
     })]
   }),
-  building: u(g$3, {
-    children: [u("path", {
+  building: u$1(g$3, {
+    children: [u$1("path", {
       d: "M16.75 10.25H13.75"
-    }), u("path", {
+    }), u$1("path", {
       d: "M16.75 13.25H13.75"
-    }), u("path", {
+    }), u$1("path", {
       d: "M3 18.25H5.25006M5.25006 18.25V14.25C5.25006 13.1454 6.14549 12.25 7.25006 12.25H10.2501L10.25 8.25003C10.25 6.59316 11.5932 5.25 13.25 5.25H17.25C18.9069 5.25 20.25 6.59315 20.25 8.25V18.25H5.25006Z"
-    }), u("path", {
+    }), u$1("path", {
       d: "M10.25 12.25V18.25"
     })]
   }),
-  circles: u(g$3, {
-    children: [u("path", {
+  circles: u$1(g$3, {
+    children: [u$1("path", {
       d: "M16.773 16.773C15.829 17.717 14.6262 18.3599 13.3169 18.6203C12.0075 18.8808 10.6503 18.7471 9.41689 18.2362C8.18349 17.7253 7.12928 16.8601 6.38758 15.7501C5.64588 14.6401 5.25 13.335 5.25 12C5.25 10.665 5.64588 9.35993 6.38758 8.2499C7.12928 7.13987 8.18349 6.27471 9.41689 5.76381C10.6503 5.25292 12.0075 5.11925 13.3169 5.3797C14.6262 5.64015 15.829 6.28302 16.773 7.22703"
-    }), u("path", {
+    }), u$1("path", {
       d: "M9.34835 9.34835C9.8728 8.8239 10.541 8.46675 11.2684 8.32206C11.9958 8.17736 12.7498 8.25162 13.4351 8.53545C14.1203 8.81928 14.706 9.29993 15.118 9.91661C15.5301 10.5333 15.75 11.2583 15.75 12C15.75 12.7417 15.5301 13.4667 15.118 14.0834C14.706 14.7001 14.1203 15.1807 13.4351 15.4645C12.7498 15.7484 11.9958 15.8226 11.2684 15.6779C10.541 15.5333 9.8728 15.1761 9.34835 14.6517"
     })]
   }),
-  clock: u(g$3, {
-    children: [u("path", {
+  clock: u$1(g$3, {
+    children: [u$1("path", {
       d: "M14 9L12 13L9.5 12"
-    }), u("path", {
+    }), u$1("path", {
       d: "M18.75 12C18.75 15.7279 15.7279 18.75 12 18.75C8.27208 18.75 5.25 15.7279 5.25 12C5.25 8.27208 8.27208 5.25 12 5.25C15.7279 5.25 18.75 8.27208 18.75 12Z"
     })]
   }),
-  filter: u(g$3, {
-    children: u("path", {
+  filter: u$1(g$3, {
+    children: u$1("path", {
       d: "M19.25 7H4.75V8.5L10.25 12.25V17.5H13.75V12.25L19.25 8.5V7Z"
     })
   }),
-  globe: u(g$3, {
-    children: [u("path", {
+  globe: u$1(g$3, {
+    children: [u$1("path", {
       d: "M5 13.75H19"
-    }), u("path", {
+    }), u$1("path", {
       d: "M5 10.25H19"
-    }), u("path", {
+    }), u$1("path", {
       d: "M12 4.75C15.5 9.25 15.5 14.75 12.0001 19.25C8.50012 14.75 8.50005 9.25 12 4.75Z"
-    }), u("circle", {
+    }), u$1("circle", {
       cx: "12",
       cy: "12",
       r: "7.25"
     })]
   }),
-  magnifier: u(g$3, {
-    children: [u("path", {
+  magnifier: u$1(g$3, {
+    children: [u$1("path", {
       d: "M15.5659 15.5659C14.4875 16.6442 13.025 17.25 11.5 17.25C9.97501 17.25 8.51247 16.6442 7.43414 15.5659C6.3558 14.4875 5.75 13.025 5.75 11.5C5.75 9.97501 6.3558 8.51247 7.43414 7.43414C8.51247 6.3558 9.97501 5.75 11.5 5.75C13.025 5.75 14.4875 6.3558 15.5659 7.43414C16.6442 8.51247 17.25 9.97501 17.25 11.5C17.25 13.025 16.6442 14.4875 15.5659 15.5659L15.5659 15.5659Z"
-    }), u("path", {
+    }), u$1("path", {
       d: "M11.5 8.75C11.8611 8.75 12.2187 8.82113 12.5524 8.95933C12.886 9.09753 13.1892 9.3001 13.4445 9.55546C13.6999 9.81082 13.9025 10.114 14.0407 10.4476C14.1789 10.7813 14.25 11.1389 14.25 11.5"
-    }), u("path", {
+    }), u$1("path", {
       d: "M16 16L19 19"
     })]
   }),
-  mapPin: u(g$3, {
-    children: u(g$3, {
-      children: [u("circle", {
+  mapPin: u$1(g$3, {
+    children: u$1(g$3, {
+      children: [u$1("circle", {
         cx: "12",
         cy: "9",
         r: "2"
-      }), u("path", {
+      }), u$1("path", {
         d: "M16.2426 16.8358C17.0818 17.1155 17.6532 17.4719 17.8847 17.8598C18.1162 18.2478 17.9974 18.6499 17.5433 19.0154C17.0892 19.3808 16.3201 19.6932 15.3334 19.9129C14.3467 20.1327 13.1867 20.25 12 20.25C10.8133 20.25 9.65327 20.1327 8.66658 19.9129C7.67988 19.6932 6.91085 19.3808 6.45672 19.0154C6.0026 18.6499 5.88378 18.2478 6.11529 17.8598C6.3468 17.4719 6.91825 17.1155 7.75736 16.8358"
-      }), u("path", {
+      }), u$1("path", {
         d: "M17.25 9C17.25 13.3995 12 16.75 12 16.75C12 16.75 6.75 13.3995 6.75 9C6.75 6.10051 9.10051 3.75 12 3.75C14.8995 3.75 17.25 6.10051 17.25 9Z"
       })]
     })
   }),
-  sunset: u(g$3, {
-    children: [u("path", {
+  sunset: u$1(g$3, {
+    children: [u$1("path", {
       d: "M18.5 8.5L17.5 9.5"
-    }), u("path", {
+    }), u$1("path", {
       d: "M5.5 8.5L6.5 9.5"
-    }), u("path", {
+    }), u$1("path", {
       d: "M12 6L12 7.5"
-    }), u("path", {
+    }), u$1("path", {
       d: "M7.5 15.25L7.5 14.25C7.5 13.6591 7.6164 13.0739 7.84254 12.5279C8.06869 11.982 8.40016 11.4859 8.81802 11.068C9.23588 10.6502 9.73196 10.3187 10.2779 10.0925C10.8239 9.8664 11.4091 9.75 12 9.75C12.5909 9.75 13.1761 9.8664 13.7221 10.0925C14.268 10.3187 14.7641 10.6502 15.182 11.068C15.5998 11.4859 15.9313 11.982 16.1575 12.5279C16.3836 13.0739 16.5 13.6591 16.5 14.25V15.25"
-    }), u("path", {
+    }), u$1("path", {
       d: "M20.25 15.25H12H3.75"
-    }), u("path", {
+    }), u$1("path", {
       d: "M16.25 18.25H12L7.75 18.25"
     })]
   }),
-  x: u("path", {
+  x: u$1("path", {
     d: "M8 8l8 8M8 16l8 -8"
   }),
-  "chevron-right": u("path", {
+  "chevron-right": u$1("path", {
     d: "M11 8L15 12L11 16"
   })
 };
 const IconSpritesheet = ({
   theme
 }) => {
-  return u("svg", {
+  return u$1("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     style: {
       display: "none"
     },
-    children: u("defs", {
-      children: Object.entries(icons).map(([name, icon]) => u("symbol", {
+    children: u$1("defs", {
+      children: Object.entries(icons).map(([name, icon]) => u$1("symbol", {
         id: `i-icon-${name}`,
-        children: u("g", {
+        children: u$1("g", {
           fill: "none",
           "stroke-width": theme.mode === "dark" && theme.highcontrast != true ? "1" : "1.5",
           "stroke-linecap": "round",
@@ -2948,12 +3023,12 @@ const Icon = ({
   name,
   ...props
 }) => {
-  return u("svg", {
+  return u$1("svg", {
     viewBox: "0 0 24 24",
     width: 24,
     height: 24,
     ...props,
-    children: u("use", {
+    children: u$1("use", {
       href: `#i-icon-${name}`
     })
   });
@@ -3007,6 +3082,7 @@ const btnNextClass = cva({
     }
   }
 });
+const getSelectedValues = (current) => typeof current.value === "string" ? [current.value] : current.value ?? [];
 const Filter = ({
   filterKey,
   title,
@@ -3019,10 +3095,10 @@ const Filter = ({
   icon,
   state
 }) => {
-  const selectedValues = typeof current.value === "string" ? [current.value] : current.value ?? [];
+  const selectedValues = getSelectedValues(current);
   const hasValue = selectedValues.length > 0;
   const showClearButton = hasValue && active == false;
-  return u("section", {
+  return u$1("section", {
     "data-filter-key": filterKey,
     role: "tab",
     "aria-label": title,
@@ -3030,40 +3106,39 @@ const Filter = ({
     class: wrapperClass$1({
       hasValue
     }),
-    children: [u("div", {
+    children: [u$1("div", {
       class: "w-full min-w-0 flex-1",
-      children: [u("button", {
+      children: [u$1("button", {
         "aria-label": active ? "Close filter" : "Open filter",
         class: "ease-expo-out fr rounded-section flex w-full items-center gap-2 px-4 py-4 transition-all duration-300",
         onClick: () => onActiveChange(!active),
-        children: [u(Icon, {
+        children: [u$1(Icon, {
           class: iconClass({
             hasValue
           }),
           name: icon
-        }), u("p", {
+        }), u$1("p", {
           class: textClass({
             hasValue
           }),
           children: title
         })]
-      }), u(FilterInner, {
+      }), u$1(FilterInner, {
         active,
         current,
         onValueChange,
         suggestions,
         onActiveChange,
         onSkip,
-        state,
-        selectedValues
+        state
       })]
-    }), showClearButton && u("div", {
+    }), showClearButton && u$1("div", {
       class: "flex flex-none items-center justify-center p-4",
-      children: u("button", {
+      children: u$1("button", {
         "aria-label": "Clear",
         class: "fr touch-hitbox ease-expo-out hover:bg-interactive-accent-bg-hover text-interactive-accent-text rounded-interactive relative cursor-pointer p-1 transition-all duration-300 active:scale-95",
         onClick: () => onValueChange(void 0),
-        children: u(Icon, {
+        children: u$1(Icon, {
           name: "x"
         })
       })
@@ -3083,48 +3158,59 @@ const FilterInner = ({
   onValueChange,
   onActiveChange,
   onSkip,
-  state,
-  selectedValues
+  state
 }) => {
   const currentRef = _(null);
+  const [internalValue, setInternalValue] = h(current);
+  p$2(() => {
+    setInternalValue(current);
+  }, [current]);
+  const selectedValues = getSelectedValues(internalValue);
   const hasValue = selectedValues.length > 0;
   if (active)
-    return u("div", {
+    return u$1("div", {
       class: "-mt-4 pt-2",
-      children: [u("ul", {
-        "aria-label": "Filter options",
-        class: "hide-scrollbars flex select-none gap-1.5 overflow-x-auto px-4 pb-1 pt-2",
-        children: state === "loading" ? u("li", {
+      children: [state === "loading" ? u$1("div", {
+        class: "flex px-4 pb-1 pt-2",
+        children: u$1("div", {
           "aria-hidden": true,
           class: tagClass$1({
             size: "lg",
             active: false,
             class: "animate-skeleton"
           }),
-          children: u("span", {
+          children: u$1("span", {
             class: "inline-block w-[10ch]"
           })
-        }) : suggestions.map((suggestion, k2) => {
+        })
+      }) : u$1("ul", {
+        "aria-label": "Filter options",
+        class: "hide-scrollbars flex select-none gap-1.5 overflow-x-auto px-4 pb-1 pt-2",
+        children: suggestions.map((suggestion, k2) => {
           const active2 = selectedValues.includes(suggestion.value);
-          return u("li", {
+          return u$1("li", {
             style: {
               animationDelay: k2 * 0.01 + "s"
             },
             class: "animate-appear-tag origin-top",
-            children: u("button", {
+            children: u$1("button", {
               "data-filter": true,
               "data-current-value": active2 ? "true" : void 0,
               onClick: () => {
                 switch (current.select) {
                   case "many": {
-                    const newValue = toggleInArray(current.value ?? [], suggestion.value);
-                    onValueChange({
-                      select: current.select,
-                      value: newValue.length > 0 ? newValue : void 0
+                    const newValue = toggleInArray(selectedValues, suggestion.value);
+                    setInternalValue({
+                      select: "many",
+                      value: newValue
                     });
                     break;
                   }
                   case "one":
+                    setInternalValue({
+                      select: "one",
+                      value: suggestion.value
+                    });
                     onValueChange({
                       select: current.select,
                       value: suggestion.value
@@ -3142,33 +3228,38 @@ const FilterInner = ({
             })
           }, suggestion.value);
         })
-      }), u("div", {
+      }), u$1("div", {
         class: "flex justify-end p-2",
-        children: u("button", {
+        children: u$1("button", {
           class: btnNextClass({
             hasValue
           }),
-          onClick: () => onSkip(),
-          children: [hasValue ? "Done" : "Skip", " ", u(Icon, {
+          onClick: () => {
+            if (hasValue) {
+              onValueChange(internalValue);
+            }
+            onSkip();
+          },
+          children: [hasValue ? "Done" : "Skip", " ", u$1(Icon, {
             name: "chevron-right"
           })]
         }, hasValue ? "done" : "skip")
       })]
     });
   if (hasValue)
-    return u("button", {
+    return u$1("button", {
       "aria-label": "Current value",
       tabIndex: -1,
       "data-current-value": "true",
       ref: currentRef,
       class: "fr -mt-4 w-full select-none overflow-hidden px-4 pb-4 pt-2 focus:outline-none",
       onClick: () => onActiveChange(true),
-      children: u("ul", {
+      children: u$1("ul", {
         class: "flex flex-wrap gap-1",
         children: suggestions.filter((s2) => selectedValues.includes(s2.value)).map((suggestion) => {
-          return u("li", {
+          return u$1("li", {
             class: "animate-selected-tag block max-w-full",
-            children: u("span", {
+            children: u$1("span", {
               class: tagClass$1({
                 size: "sm",
                 active: true
@@ -3207,6 +3298,75 @@ const useFilterKeyboardFocus = (activeKey, ref) => {
       focusFirstAvailableOption(keyToFocus, ref);
   }, [activeKey, previousActiveKey, ref]);
 };
+const filterIcons = {
+  contract_type: "clock",
+  title: "magnifier",
+  city: "mapPin",
+  town: "mapPin",
+  address_1: "mapPin",
+  address_2: "mapPin",
+  country: "mapPin",
+  company_name: "briefcase",
+  category: "briefcase"
+};
+const FilterSection = ({
+  properties,
+  values,
+  availableProperties,
+  onFilterValueChange,
+  state,
+  parentRef
+}) => {
+  var _a;
+  const [activeKey, setActiveKey] = h((_a = properties[0]) == null ? void 0 : _a.key);
+  useFilterKeyboardFocus(activeKey, parentRef);
+  return u$1("div", {
+    role: "tablist",
+    class: "grid items-stretch gap-2 px-4 md:flex md:flex-col md:px-0",
+    children: properties.map((property) => {
+      var _a2;
+      return u$1(ErrorBoundary, {
+        Fallback,
+        children: u$1(Filter, {
+          icon: property.icon ?? filterIcons[property.key] ?? "filter",
+          filterKey: property.key,
+          title: property.label,
+          suggestions: ((_a2 = availableProperties == null ? void 0 : availableProperties[property.key]) == null ? void 0 : _a2.map((property2) => ({
+            label: property2,
+            value: property2
+          }))) ?? [],
+          onActiveChange: (active) => setActiveKey(active ? property.key : void 0),
+          active: activeKey === property.key,
+          current: values[property.key] ?? {
+            select: property.select,
+            value: void 0
+          },
+          state,
+          onValueChange: (value) => {
+            const newState = onFilterValueChange(property, value, activeKey);
+            setActiveKey(newState.newActiveKey);
+          },
+          onSkip: () => {
+            var _a3;
+            const currentIndex = properties.findIndex((p2) => p2.key === activeKey);
+            const nextPropertyKey = currentIndex !== -1 ? (_a3 = properties[currentIndex + 1]) == null ? void 0 : _a3.key : void 0;
+            setActiveKey(nextPropertyKey);
+          }
+        })
+      }, property.key);
+    })
+  });
+};
+const SkeletonText = ({
+  chars
+}) => {
+  return u$1("span", {
+    style: {
+      width: chars + "ch"
+    },
+    class: "rounded-job-tag inline-block h-[1lh] bg-[currentColor] opacity-25"
+  });
+};
 const wrapperClass = cva({
   base: "rounded-job-card bg-job-card-bg ring-width-job-card ring-job-card-stroke active:bg-job-card-bg-active active:ring-job-card-stroke-active flex gap-4 fr ease-expo-out min-w-0 p-4 transition-all duration-500"
 });
@@ -3228,57 +3388,118 @@ const tagClass = cva({
 const JobCard = ({
   job
 }) => {
-  return u("a", {
+  return u$1("a", {
     href: "",
     class: wrapperClass(),
-    children: [u("div", {
+    children: [u$1("div", {
       class: "flex flex-1 flex-col gap-4",
-      children: [u("div", {
+      children: [u$1("div", {
         class: "flex flex-col items-start gap-1",
-        children: [job.isNew ? u("span", {
+        children: [job.isNew ? u$1("span", {
           class: badgeClass(),
           children: "NEW"
-        }) : u("p", {
+        }) : u$1("p", {
           class: "text-style-job-card-info text-copy-job-info",
           children: ["Posted ", job.relativePostedDate]
-        }), u("div", {
+        }), u$1("div", {
           class: "flex flex-col gap-1",
-          children: [u("p", {
+          children: [u$1("p", {
             class: "text-style-job-card-title text-copy-neutral",
             children: job.title
-          }), u("p", {
+          }), u$1("p", {
             class: "text-style-job-card text-copy-neutral-lowcontrast",
             children: job.company.name
           })]
         })]
-      }), u("div", {
+      }), u$1("div", {
         class: "flex flex-col items-start gap-2",
-        children: [job.pay && u("span", {
+        children: [job.pay && u$1("span", {
           class: tagClass({
             colorScheme: "monetary"
           }),
           children: job.pay
-        }), u("div", {
+        }), u$1("div", {
           class: "flex items-center gap-2",
-          children: job.contractType && u("span", {
+          children: job.contractType && u$1("span", {
             class: tagClass(),
             children: job.contractType
           })
         })]
       })]
-    }), u("div", {
+    }), u$1("div", {
       class: "flex items-center",
-      children: u(Icon, {
+      children: u$1(Icon, {
         name: "chevron-right",
         class: "text-copy-neutral-icon"
       })
     })]
   });
 };
-const filterIcons = {
-  contract_type: "clock",
-  city: "mapPin",
-  title: "magnifier"
+const JobCardSkeleton = ({
+  animationDelay,
+  seed
+}) => {
+  return u$1("div", {
+    "aria-hidden": true,
+    style: {
+      animationDelay: animationDelay + "s"
+    },
+    class: wrapperClass({
+      class: "animate-skeleton"
+    }),
+    children: [u$1("div", {
+      class: "flex flex-1 flex-col gap-4",
+      children: [u$1("div", {
+        class: "flex flex-col items-start gap-1",
+        children: [u$1("p", {
+          class: "text-style-job-card-info text-copy-job-info",
+          children: u$1(SkeletonText, {
+            chars: 12
+          })
+        }), u$1("div", {
+          class: "flex flex-col gap-1",
+          children: [u$1("p", {
+            class: "text-style-job-card-title text-copy-neutral",
+            children: u$1(SkeletonText, {
+              chars: 13 + (seed + 5) * seed % 7
+            })
+          }), u$1("p", {
+            class: "text-style-job-card text-copy-neutral-lowcontrast",
+            children: u$1(SkeletonText, {
+              chars: 7 + seed * seed % 3
+            })
+          })]
+        })]
+      }), u$1("div", {
+        class: "flex flex-col items-start gap-2",
+        children: [u$1("span", {
+          class: tagClass({
+            colorScheme: "default",
+            class: "h-[1lh] w-[10ch]"
+          })
+        }), u$1("div", {
+          class: "flex items-center gap-2",
+          children: [u$1("span", {
+            class: tagClass({
+              colorScheme: "default",
+              class: "h-[1lh] w-[6ch]"
+            })
+          }), u$1("span", {
+            class: tagClass({
+              colorScheme: "default",
+              class: "h-[1lh] w-[8ch]"
+            })
+          })]
+        })]
+      })]
+    }), u$1("div", {
+      class: "flex items-center",
+      children: u$1(Icon, {
+        name: "chevron-right",
+        class: "text-copy-neutral-icon"
+      })
+    })]
+  });
 };
 const propertiesToDefaultValues = (properties) => properties.reduce((acc, property) => {
   switch (property.select) {
@@ -3333,7 +3554,6 @@ const nextStateFromValue = ({
     default:
       exhaustive(value);
   }
-  throw new Error("unreachable");
 };
 const resultCountString = (results) => {
   switch (results) {
@@ -3350,12 +3570,12 @@ const JobSearch = ({
   logger,
   params
 }) => {
-  var _a;
   const appRef = _(null);
   const [values, setValues] = h(() => propertiesToDefaultValues(params.properties));
   const {
     data,
-    isLoading
+    isLoading,
+    error
   } = useSWR(JSON.stringify(values), () => getJobSearchResults({
     apiClient,
     logger,
@@ -3366,81 +3586,76 @@ const JobSearch = ({
     revalidateOnReconnect: false,
     revalidateIfStale: false
   });
+  if (error) {
+    console.log(error.message);
+  }
   const availableProperties = data == null ? void 0 : data.data.available_properties;
-  const [activeKey, setActiveKey] = h((_a = params.properties[0]) == null ? void 0 : _a.key);
-  useFilterKeyboardFocus(activeKey, appRef);
-  return u(g$3, {
-    children: [u(IconSpritesheet, {
+  return u$1(g$3, {
+    children: [u$1(IconSpritesheet, {
       theme: params.theme
-    }), u("div", {
+    }), u$1("div", {
       ref: appRef,
       id: JOB_SEARCH_SCOPE_ELEMENT_ID,
-      children: u("div", {
+      children: u$1("div", {
         class: "bg-app mx-auto flex min-h-screen max-w-screen-lg flex-col gap-4 py-6 md:grid md:grid-cols-3 md:px-4",
-        children: [u("div", {
-          role: "tablist",
-          class: "grid items-stretch gap-2 px-4 md:flex md:flex-col md:px-0",
-          children: params.properties.map((property) => {
-            var _a2;
-            return u(Filter, {
-              icon: filterIcons[property.key] ?? "filter",
-              filterKey: property.key,
-              title: property.label,
-              suggestions: ((_a2 = availableProperties == null ? void 0 : availableProperties[property.key]) == null ? void 0 : _a2.map((property2) => ({
-                label: property2,
-                value: property2
-              }))) ?? [],
-              onActiveChange: (active) => setActiveKey(active ? property.key : void 0),
-              active: activeKey === property.key,
-              current: values[property.key] ?? {
-                select: property.select,
-                value: void 0
-              },
-              state: isLoading && !(data == null ? void 0 : data.data.available_properties) ? "loading" : "loaded",
-              onValueChange: (value) => {
-                const {
-                  newActiveKey,
-                  newValue
-                } = nextStateFromValue({
-                  property,
-                  activeKey,
-                  value,
-                  properties: params.properties,
-                  values
-                });
-                setActiveKey(newActiveKey);
-                setValues({
-                  ...values,
-                  [property.key]: newValue
-                });
-              },
-              onSkip: () => {
-                var _a3;
-                const currentIndex = params.properties.findIndex((p2) => p2.key === activeKey);
-                const nextPropertyKey = currentIndex !== -1 ? (_a3 = params.properties[currentIndex + 1]) == null ? void 0 : _a3.key : void 0;
-                setActiveKey(nextPropertyKey);
-              }
-            }, property.key);
+        children: [u$1(ErrorBoundary, {
+          Fallback,
+          children: u$1(FilterSection, {
+            onFilterValueChange: (property, value, activeKey) => {
+              const {
+                newActiveKey,
+                newValue
+              } = nextStateFromValue({
+                property,
+                activeKey,
+                value,
+                properties: params.properties,
+                values
+              });
+              setValues({
+                ...values,
+                [property.key]: newValue
+              });
+              return {
+                newActiveKey,
+                newValue
+              };
+            },
+            availableProperties,
+            values,
+            properties: params.properties,
+            state: isLoading && !(data == null ? void 0 : data.data.available_properties) ? "loading" : "loaded",
+            parentRef: appRef
           })
-        }), u("section", {
+        }), u$1("div", {
           class: "md:col-span-2",
-          children: u("div", {
+          children: u$1("section", {
             class: "bg-section-strong-bg ring-section-weak-stroke rounded-section ring-px lg:ring-width-section flex flex-col gap-4 p-4",
-            children: [data && u("p", {
+            children: [isLoading && !(data == null ? void 0 : data.data) && u$1("div", {
+              class: "flex flex-col gap-3",
+              children: [u$1("p", {
+                class: "text-copy-accent-lowcontrast animate-skeleton text-center",
+                children: u$1(SkeletonText, {
+                  chars: 8
+                })
+              }), Array.from({
+                length: 4
+              }).map((_2, i2) => u$1(JobCardSkeleton, {
+                seed: i2,
+                animationDelay: (i2 - 4) * 0.1
+              }, i2))]
+            }), data && u$1("p", {
               class: "text-copy-accent-lowcontrast text-center",
               children: resultCountString(data.pagination.total)
-            }), u("ul", {
+            }), u$1("ul", {
               class: "flex flex-col gap-3",
               children: data == null ? void 0 : data.data.results.map((job) => {
-                return u("li", {
-                  children: u(JobCard, {
+                return u$1("li", {
+                  children: u$1(JobCard, {
                     job
                   })
                 }, job.id);
               })
-            }), u("p", {
-              class: "text-copy-accent-lowcontrast text-style-job-card-info text-center",
-              children: "You've reached the end of the list."
             })]
           })
         })]
@@ -3448,7 +3663,7 @@ const JobSearch = ({
     })]
   });
 };
-const tailwind = "#ijs {\n	font-size: 16px;\n	font-family: sans-serif;\n		--tw-content: '';\n		font-family:\n			system-ui,\n			-apple-system,\n			BlinkMacSystemFont,\n			Segoe UI,\n			Roboto,\n			Oxygen,\n			Ubuntu,\n			Cantarell,\n			Open Sans,\n			Helvetica Neue,\n			sans-serif;\n}\n\n		#ijs * {\n			box-sizing: border-box;\n			border-style: solid;\n			border-width: 0;\n			-webkit-tap-highlight-color: transparent;\n		}\n\n		#ijs ::before,\n		#ijs ::after {\n			box-sizing: border-box;\n		}\n\n		#ijs :is(a) {\n			text-decoration: none;\n		}\n\n		#ijs :is(ul, ol) {\n			list-style: none;\n			padding: 0;\n			margin: 0;\n		}\n\n		#ijs :is(p) {\n			margin: 0;\n			padding: 0;\n		}\n\n		#ijs :is(li) {\n			margin: 0;\n			padding: 0;\n			list-style: none;\n		}\n\n		#ijs :is(button) {\n			display: block;\n			margin: 0;\n			padding: 0;\n			border: unset;\n			background: unset;\n			text-align: unset;\n		}\n\n		#ijs :is(svg) {\n			display: block;\n		}\n\n		#ijs *, #ijs ::before, #ijs ::after {\n	--tw-border-spacing-x: 0;\n	--tw-border-spacing-y: 0;\n	--tw-translate-x: 0;\n	--tw-translate-y: 0;\n	--tw-rotate: 0;\n	--tw-skew-x: 0;\n	--tw-skew-y: 0;\n	--tw-scale-x: 1;\n	--tw-scale-y: 1;\n	--tw-pan-x:  ;\n	--tw-pan-y:  ;\n	--tw-pinch-zoom:  ;\n	--tw-scroll-snap-strictness: proximity;\n	--tw-gradient-from-position:  ;\n	--tw-gradient-via-position:  ;\n	--tw-gradient-to-position:  ;\n	--tw-ordinal:  ;\n	--tw-slashed-zero:  ;\n	--tw-numeric-figure:  ;\n	--tw-numeric-spacing:  ;\n	--tw-numeric-fraction:  ;\n	--tw-ring-inset:  ;\n	--tw-ring-offset-width: 0px;\n	--tw-ring-offset-color: #fff;\n	--tw-ring-color: rgb(59 130 246 / 0.5);\n	--tw-ring-offset-shadow: 0 0 #0000;\n	--tw-ring-shadow: 0 0 #0000;\n	--tw-shadow: 0 0 #0000;\n	--tw-shadow-colored: 0 0 #0000;\n	--tw-blur:  ;\n	--tw-brightness:  ;\n	--tw-contrast:  ;\n	--tw-grayscale:  ;\n	--tw-hue-rotate:  ;\n	--tw-invert:  ;\n	--tw-saturate:  ;\n	--tw-sepia:  ;\n	--tw-drop-shadow:  ;\n	--tw-backdrop-blur:  ;\n	--tw-backdrop-brightness:  ;\n	--tw-backdrop-contrast:  ;\n	--tw-backdrop-grayscale:  ;\n	--tw-backdrop-hue-rotate:  ;\n	--tw-backdrop-invert:  ;\n	--tw-backdrop-opacity:  ;\n	--tw-backdrop-saturate:  ;\n	--tw-backdrop-sepia:  ;\n}\n\n		#ijs ::backdrop {\n	--tw-border-spacing-x: 0;\n	--tw-border-spacing-y: 0;\n	--tw-translate-x: 0;\n	--tw-translate-y: 0;\n	--tw-rotate: 0;\n	--tw-skew-x: 0;\n	--tw-skew-y: 0;\n	--tw-scale-x: 1;\n	--tw-scale-y: 1;\n	--tw-pan-x:  ;\n	--tw-pan-y:  ;\n	--tw-pinch-zoom:  ;\n	--tw-scroll-snap-strictness: proximity;\n	--tw-gradient-from-position:  ;\n	--tw-gradient-via-position:  ;\n	--tw-gradient-to-position:  ;\n	--tw-ordinal:  ;\n	--tw-slashed-zero:  ;\n	--tw-numeric-figure:  ;\n	--tw-numeric-spacing:  ;\n	--tw-numeric-fraction:  ;\n	--tw-ring-inset:  ;\n	--tw-ring-offset-width: 0px;\n	--tw-ring-offset-color: #fff;\n	--tw-ring-color: rgb(59 130 246 / 0.5);\n	--tw-ring-offset-shadow: 0 0 #0000;\n	--tw-ring-shadow: 0 0 #0000;\n	--tw-shadow: 0 0 #0000;\n	--tw-shadow-colored: 0 0 #0000;\n	--tw-blur:  ;\n	--tw-brightness:  ;\n	--tw-contrast:  ;\n	--tw-grayscale:  ;\n	--tw-hue-rotate:  ;\n	--tw-invert:  ;\n	--tw-saturate:  ;\n	--tw-sepia:  ;\n	--tw-drop-shadow:  ;\n	--tw-backdrop-blur:  ;\n	--tw-backdrop-brightness:  ;\n	--tw-backdrop-contrast:  ;\n	--tw-backdrop-grayscale:  ;\n	--tw-backdrop-hue-rotate:  ;\n	--tw-backdrop-invert:  ;\n	--tw-backdrop-opacity:  ;\n	--tw-backdrop-saturate:  ;\n	--tw-backdrop-sepia:  ;\n}\n\n		#ijs .container {\n	width: 100%;\n}\n\n		@media (min-width: 640px) {\n\n	#ijs .container {\n		max-width: 640px;\n	}\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .container {\n		max-width: 768px;\n	}\n}\n\n		@media (min-width: 1024px) {\n\n	#ijs .container {\n		max-width: 1024px;\n	}\n}\n\n		@media (min-width: 1280px) {\n\n	#ijs .container {\n		max-width: 1280px;\n	}\n}\n\n		@media (min-width: 1536px) {\n\n	#ijs .container {\n		max-width: 1536px;\n	}\n}\n\n		#ijs .visible {\n	visibility: visible;\n}\n\n		#ijs .invisible {\n	visibility: hidden;\n}\n\n		#ijs .collapse {\n	visibility: collapse;\n}\n\n		#ijs .static {\n	position: static;\n}\n\n		#ijs .fixed {\n	position: fixed;\n}\n\n		#ijs .absolute {\n	position: absolute;\n}\n\n		#ijs .relative {\n	position: relative;\n}\n\n		#ijs .sticky {\n	position: sticky;\n}\n\n		#ijs .isolate {\n	isolation: isolate;\n}\n\n		#ijs .m-2 {\n	margin: 0.5rem;\n}\n\n		#ijs .m-9 {\n	margin: 2.25rem;\n}\n\n		#ijs .mx-auto {\n	margin-left: auto;\n	margin-right: auto;\n}\n\n		#ijs .-mt-4 {\n	margin-top: -1rem;\n}\n\n		#ijs .block {\n	display: block;\n}\n\n		#ijs .inline-block {\n	display: inline-block;\n}\n\n		#ijs .inline {\n	display: inline;\n}\n\n		#ijs .flex {\n	display: flex;\n}\n\n		#ijs .inline-flex {\n	display: inline-flex;\n}\n\n		#ijs .table {\n	display: table;\n}\n\n		#ijs .table-row {\n	display: table-row;\n}\n\n		#ijs .flow-root {\n	display: flow-root;\n}\n\n		#ijs .grid {\n	display: grid;\n}\n\n		#ijs .inline-grid {\n	display: inline-grid;\n}\n\n		#ijs .contents {\n	display: contents;\n}\n\n		#ijs .list-item {\n	display: list-item;\n}\n\n		#ijs .\\!hidden {\n	display: none !important;\n}\n\n		#ijs .hidden {\n	display: none;\n}\n\n		#ijs .h-8 {\n	height: 2rem;\n}\n\n		#ijs .min-h-screen {\n	min-height: 100vh;\n}\n\n		#ijs .w-\\[10ch\\] {\n	width: 10ch;\n}\n\n		#ijs .w-full {\n	width: 100%;\n}\n\n		#ijs .min-w-0 {\n	min-width: 0px;\n}\n\n		#ijs .max-w-full {\n	max-width: 100%;\n}\n\n		#ijs .max-w-screen-lg {\n	max-width: 1024px;\n}\n\n		#ijs .flex-1 {\n	flex: 1 1 0%;\n}\n\n		#ijs .flex-none {\n	flex: none;\n}\n\n		#ijs .flex-shrink {\n	flex-shrink: 1;\n}\n\n		#ijs .shrink {\n	flex-shrink: 1;\n}\n\n		#ijs .flex-grow {\n	flex-grow: 1;\n}\n\n		#ijs .grow {\n	flex-grow: 1;\n}\n\n		#ijs .border-collapse {\n	border-collapse: collapse;\n}\n\n		#ijs .origin-top {\n	transform-origin: top;\n}\n\n		#ijs .transform {\n	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n		@keyframes appear-tag {\n\n	0% {\n		transform: scale(0.9);\n	}\n\n	100% {\n		transform: scale(1);\n	}\n}\n\n		#ijs .animate-appear-tag {\n	animation: appear-tag 0.6s cubic-bezier(0.16, 1, 0.3, 1) both;\n}\n\n		@keyframes selected-tag {\n\n	0% {\n		transform: scale(1.11);\n	}\n\n	100% {\n		transform: scale(1);\n	}\n}\n\n		#ijs .animate-selected-tag {\n	animation: selected-tag 0.9s cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n		@keyframes skeleton {\n\n	0% {\n		opacity: 0.2;\n	}\n\n	50% {\n		opacity: 0.5;\n	}\n\n	100% {\n		opacity: 0.3;\n	}\n}\n\n		#ijs .animate-skeleton {\n	animation: skeleton 1s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n}\n\n		#ijs .cursor-pointer {\n	cursor: pointer;\n}\n\n		#ijs .select-none {\n	-webkit-user-select: none;\n	   -moz-user-select: none;\n	        user-select: none;\n}\n\n		#ijs .resize {\n	resize: both;\n}\n\n		#ijs .flex-col {\n	flex-direction: column;\n}\n\n		#ijs .flex-wrap {\n	flex-wrap: wrap;\n}\n\n		#ijs .items-start {\n	align-items: flex-start;\n}\n\n		#ijs .items-center {\n	align-items: center;\n}\n\n		#ijs .items-stretch {\n	align-items: stretch;\n}\n\n		#ijs .justify-end {\n	justify-content: flex-end;\n}\n\n		#ijs .justify-center {\n	justify-content: center;\n}\n\n		#ijs .gap-1 {\n	gap: 0.25rem;\n}\n\n		#ijs .gap-1\\.5 {\n	gap: 0.375rem;\n}\n\n		#ijs .gap-2 {\n	gap: 0.5rem;\n}\n\n		#ijs .gap-3 {\n	gap: 0.75rem;\n}\n\n		#ijs .gap-4 {\n	gap: 1rem;\n}\n\n		#ijs .overflow-hidden {\n	overflow: hidden;\n}\n\n		#ijs .overflow-x-auto {\n	overflow-x: auto;\n}\n\n		#ijs .truncate {\n	overflow: hidden;\n	text-overflow: ellipsis;\n	white-space: nowrap;\n}\n\n		#ijs .whitespace-nowrap {\n	white-space: nowrap;\n}\n\n		#ijs .rounded-interactive {\n	border-radius: var(--i-radius-interactive);\n}\n\n		#ijs .rounded-job-card {\n	border-radius: var(--i-radius-job-card);\n}\n\n		#ijs .rounded-job-tag {\n	border-radius: var(--i-radius-job-tag);\n}\n\n		#ijs .rounded-section {\n	border-radius: var(--i-radius-section);\n}\n\n		#ijs .rounded-tag {\n	border-radius: var(--i-radius-job-tag);\n}\n\n		#ijs .border {\n	border-width: 1px;\n}\n\n		#ijs .bg-app {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-app-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .bg-job-card-bg {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-job-card-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .bg-section-strong-bg {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-section-strong-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .bg-section-weak-bg {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-section-weak-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .bg-tag-accent-strong-bg {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-tag-accent-strong-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .bg-tag-monetary-weak-bg {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-tag-monetary-weak-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .bg-tag-neutral-strong-bg {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-tag-neutral-strong-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .bg-tag-neutral-weak-bg {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-tag-neutral-weak-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .p-1 {\n	padding: 0.25rem;\n}\n\n		#ijs .p-2 {\n	padding: 0.5rem;\n}\n\n		#ijs .p-4 {\n	padding: 1rem;\n}\n\n		#ijs .px-2 {\n	padding-left: 0.5rem;\n	padding-right: 0.5rem;\n}\n\n		#ijs .px-3 {\n	padding-left: 0.75rem;\n	padding-right: 0.75rem;\n}\n\n		#ijs .px-4 {\n	padding-left: 1rem;\n	padding-right: 1rem;\n}\n\n		#ijs .px-5 {\n	padding-left: 1.25rem;\n	padding-right: 1.25rem;\n}\n\n		#ijs .py-1 {\n	padding-top: 0.25rem;\n	padding-bottom: 0.25rem;\n}\n\n		#ijs .py-2 {\n	padding-top: 0.5rem;\n	padding-bottom: 0.5rem;\n}\n\n		#ijs .py-4 {\n	padding-top: 1rem;\n	padding-bottom: 1rem;\n}\n\n		#ijs .py-6 {\n	padding-top: 1.5rem;\n	padding-bottom: 1.5rem;\n}\n\n		#ijs .pb-1 {\n	padding-bottom: 0.25rem;\n}\n\n		#ijs .pb-4 {\n	padding-bottom: 1rem;\n}\n\n		#ijs .pl-3 {\n	padding-left: 0.75rem;\n}\n\n		#ijs .pr-1 {\n	padding-right: 0.25rem;\n}\n\n		#ijs .pt-2 {\n	padding-top: 0.5rem;\n}\n\n		#ijs .text-center {\n	text-align: center;\n}\n\n		#ijs .text-justify {\n	text-align: justify;\n}\n\n		#ijs .font-family-filter {\n	font-family: var(--i-font-filter);\n}\n\n		#ijs .font-family-tag {\n	font-family: var(--i-font-tag);\n}\n\n		#ijs .text-style-filter {\n	font-size: 1rem;\n	line-height: 1.5rem;\n	letter-spacing: -0.01em;\n}\n\n		#ijs .text-style-job-card {\n	font-size: 0.875rem;\n	line-height: 1.125rem;\n}\n\n		#ijs .text-style-job-card-info {\n	font-size: 0.75rem;\n	line-height: 1.125rem;\n}\n\n		#ijs .text-style-job-card-title {\n	font-size: 1.125rem;\n	line-height: 1.5rem;\n}\n\n		#ijs .text-style-tag {\n	font-size: 0.875rem;\n	line-height: 1.5rem;\n}\n\n		#ijs .font-weight-filter {\n	font-weight: var(--i-weight-filter);\n}\n\n		#ijs .font-weight-tag {\n	font-weight: var(--i-weight-tag);\n}\n\n		#ijs .uppercase {\n	text-transform: uppercase;\n}\n\n		#ijs .lowercase {\n	text-transform: lowercase;\n}\n\n		#ijs .capitalize {\n	text-transform: capitalize;\n}\n\n		#ijs .italic {\n	font-style: italic;\n}\n\n		#ijs .ordinal {\n	--tw-ordinal: ordinal;\n	font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);\n}\n\n		#ijs .text-copy-accent {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-copy-accent) / var(--tw-text-opacity));\n}\n\n		#ijs .text-copy-accent-icon {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-copy-accent-icon) / var(--tw-text-opacity));\n}\n\n		#ijs .text-copy-accent-lowcontrast {\n	color: oklch(var(--i-copy-accent-lowcontrast) / 0.67);\n}\n\n		#ijs .text-copy-job-info {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-copy-info) / var(--tw-text-opacity));\n}\n\n		#ijs .text-copy-neutral {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-copy) / var(--tw-text-opacity));\n}\n\n		#ijs .text-copy-neutral-icon {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-copy-icon) / var(--tw-text-opacity));\n}\n\n		#ijs .text-copy-neutral-lowcontrast {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-copy-lowcontrast) / var(--tw-text-opacity));\n}\n\n		#ijs .text-interactive-accent-text {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-interactive-accent-text) / var(--tw-text-opacity));\n}\n\n		#ijs .text-interactive-neutral-text {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-interactive-neutral-text) / var(--tw-text-opacity));\n}\n\n		#ijs .text-tag-accent-strong-copy {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-tag-accent-strong-copy) / var(--tw-text-opacity));\n}\n\n		#ijs .text-tag-monetary-weak-copy {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-tag-monetary-weak-copy) / var(--tw-text-opacity));\n}\n\n		#ijs .text-tag-neutral-strong-copy {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-tag-neutral-strong-copy) / var(--tw-text-opacity));\n}\n\n		#ijs .text-tag-neutral-weak-copy {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-tag-neutral-weak-copy) / var(--tw-text-opacity));\n}\n\n		#ijs .shadow {\n	--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n	--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n		#ijs .outline {\n	outline-style: solid;\n}\n\n		#ijs .ring-px {\n	--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n	--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n	box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n		#ijs .ring-width-job-card {\n	--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n	--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(var(--i-job-card-stroke-width) + var(--tw-ring-offset-width)) var(--tw-ring-color);\n	box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n		#ijs .ring-width-section {\n	--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n	--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(var(--i-section-stroke-width) + var(--tw-ring-offset-width)) var(--tw-ring-color);\n	box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n		#ijs .ring-job-card-stroke {\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-job-card-stroke-color) / var(--tw-ring-opacity));\n}\n\n		#ijs .ring-section-strong-stroke {\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-section-strong-stroke-color) / var(--tw-ring-opacity));\n}\n\n		#ijs .ring-section-weak-stroke {\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-section-weak-stroke-color) / var(--tw-ring-opacity));\n}\n\n		#ijs .ring-tag-accent-strong-stroke {\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-tag-accent-strong-stroke-color) / var(--tw-ring-opacity));\n}\n\n		#ijs .ring-tag-neutral-strong-stroke {\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-tag-neutral-strong-stroke-color) / var(--tw-ring-opacity));\n}\n\n		#ijs .ring-tag-neutral-weak-stroke {\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-tag-neutral-weak-stroke-color) / var(--tw-ring-opacity));\n}\n\n		#ijs .blur {\n	--tw-blur: blur(8px);\n	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n\n		#ijs .grayscale {\n	--tw-grayscale: grayscale(100%);\n	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n\n		#ijs .invert {\n	--tw-invert: invert(100%);\n	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n\n		#ijs .sepia {\n	--tw-sepia: sepia(100%);\n	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n\n		#ijs .filter {\n	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n\n		#ijs .backdrop-filter {\n	-webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n	        backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n}\n\n		#ijs .transition {\n	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n	transition-duration: 150ms;\n}\n\n		#ijs .transition-all {\n	transition-property: all;\n	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n	transition-duration: 150ms;\n}\n\n		#ijs .duration-1000 {\n	transition-duration: 1000ms;\n}\n\n		#ijs .duration-300 {\n	transition-duration: 300ms;\n}\n\n		#ijs .duration-500 {\n	transition-duration: 500ms;\n}\n\n		#ijs .ease-expo-out {\n	transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n		#ijs .font-style-filter {\n	font-style: var(--i-style-filter);\n}\n\n		#ijs .font-style-tag {\n	font-style: var(--i-style-filter);\n}\n\n		#ijs .fr {\n	outline: none;\n}\n\n		#ijs .fr:focus {\n	outline: none;\n}\n\n		#ijs .fr:focus-visible {\n	outline: none;\n	--tw-ring-offset-width: 1px;\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-a-7) / 1);\n	--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n	box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n		#ijs .hide-scrollbars::-webkit-scrollbar {\n	display: none;\n}\n\n		#ijs .hide-scrollbars {\n	scrollbar-width: none;\n	-ms-overflow-style: none;\n}\n\n		#ijs .touch-hitbox::before {\n	content: '';\n	position: absolute;\n	display: block;\n	top: 50%;\n	left: 50%;\n	transform: translate(-50%, -50%);\n	width: 100%;\n	height: 100%;\n	min-height: 44px;\n	min-width: 44px;\n	z-index: 9999;\n}\n\n		#ijs .\\[a-zA-Z0-9-_\\:\\.\\$\\@\\?\\] {\n	a-z-a--z0-9-_: .$@?;\n}\n\n		#ijs .hover\\:bg-interactive-accent-bg-hover:hover {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-interactive-accent-bg-hover) / var(--tw-bg-opacity));\n}\n\n		#ijs .hover\\:bg-interactive-neutral-bg-hover:hover {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-interactive-neutral-bg-hover) / var(--tw-bg-opacity));\n}\n\n		#ijs .focus\\:outline-none:focus {\n	outline: 2px solid transparent;\n	outline-offset: 2px;\n}\n\n		#ijs .active\\:scale-95:active {\n	--tw-scale-x: .95;\n	--tw-scale-y: .95;\n	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n		#ijs .active\\:bg-job-card-bg-active:active {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-job-card-bg-active) / var(--tw-bg-opacity));\n}\n\n		#ijs .active\\:ring-job-card-stroke-active:active {\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-job-card-stroke-color-active) / var(--tw-ring-opacity));\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .md\\:col-span-2 {\n		grid-column: span 2 / span 2;\n	}\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .md\\:flex {\n		display: flex;\n	}\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .md\\:grid {\n		display: grid;\n	}\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .md\\:grid-cols-3 {\n		grid-template-columns: repeat(3, minmax(0, 1fr));\n	}\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .md\\:flex-col {\n		flex-direction: column;\n	}\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .md\\:px-0 {\n		padding-left: 0px;\n		padding-right: 0px;\n	}\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .md\\:px-4 {\n		padding-left: 1rem;\n		padding-right: 1rem;\n	}\n}\n\n		@media (min-width: 1024px) {\n\n	#ijs .lg\\:ring-width-section {\n		--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n		--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(var(--i-section-stroke-width) + var(--tw-ring-offset-width)) var(--tw-ring-color);\n		box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n	}\n}\n";
+const tailwind = "#ijs {\n	font-size: 16px;\n	font-family: sans-serif;\n		--tw-content: '';\n		font-family:\n			system-ui,\n			-apple-system,\n			BlinkMacSystemFont,\n			Segoe UI,\n			Roboto,\n			Oxygen,\n			Ubuntu,\n			Cantarell,\n			Open Sans,\n			Helvetica Neue,\n			sans-serif;\n}\n\n		#ijs * {\n			box-sizing: border-box;\n			border-style: solid;\n			border-width: 0;\n			-webkit-tap-highlight-color: transparent;\n		}\n\n		#ijs ::before,\n		#ijs ::after {\n			box-sizing: border-box;\n		}\n\n		#ijs :is(a) {\n			text-decoration: none;\n		}\n\n		#ijs :is(ul, ol) {\n			list-style: none;\n			padding: 0;\n			margin: 0;\n		}\n\n		#ijs :is(p) {\n			margin: 0;\n			padding: 0;\n		}\n\n		#ijs :is(li) {\n			margin: 0;\n			padding: 0;\n			list-style: none;\n		}\n\n		#ijs :is(button) {\n			display: block;\n			margin: 0;\n			padding: 0;\n			border: unset;\n			background: unset;\n			text-align: unset;\n		}\n\n		#ijs :is(svg) {\n			display: block;\n		}\n\n		#ijs *, #ijs ::before, #ijs ::after {\n	--tw-border-spacing-x: 0;\n	--tw-border-spacing-y: 0;\n	--tw-translate-x: 0;\n	--tw-translate-y: 0;\n	--tw-rotate: 0;\n	--tw-skew-x: 0;\n	--tw-skew-y: 0;\n	--tw-scale-x: 1;\n	--tw-scale-y: 1;\n	--tw-pan-x:  ;\n	--tw-pan-y:  ;\n	--tw-pinch-zoom:  ;\n	--tw-scroll-snap-strictness: proximity;\n	--tw-gradient-from-position:  ;\n	--tw-gradient-via-position:  ;\n	--tw-gradient-to-position:  ;\n	--tw-ordinal:  ;\n	--tw-slashed-zero:  ;\n	--tw-numeric-figure:  ;\n	--tw-numeric-spacing:  ;\n	--tw-numeric-fraction:  ;\n	--tw-ring-inset:  ;\n	--tw-ring-offset-width: 0px;\n	--tw-ring-offset-color: #fff;\n	--tw-ring-color: rgb(59 130 246 / 0.5);\n	--tw-ring-offset-shadow: 0 0 #0000;\n	--tw-ring-shadow: 0 0 #0000;\n	--tw-shadow: 0 0 #0000;\n	--tw-shadow-colored: 0 0 #0000;\n	--tw-blur:  ;\n	--tw-brightness:  ;\n	--tw-contrast:  ;\n	--tw-grayscale:  ;\n	--tw-hue-rotate:  ;\n	--tw-invert:  ;\n	--tw-saturate:  ;\n	--tw-sepia:  ;\n	--tw-drop-shadow:  ;\n	--tw-backdrop-blur:  ;\n	--tw-backdrop-brightness:  ;\n	--tw-backdrop-contrast:  ;\n	--tw-backdrop-grayscale:  ;\n	--tw-backdrop-hue-rotate:  ;\n	--tw-backdrop-invert:  ;\n	--tw-backdrop-opacity:  ;\n	--tw-backdrop-saturate:  ;\n	--tw-backdrop-sepia:  ;\n}\n\n		#ijs ::backdrop {\n	--tw-border-spacing-x: 0;\n	--tw-border-spacing-y: 0;\n	--tw-translate-x: 0;\n	--tw-translate-y: 0;\n	--tw-rotate: 0;\n	--tw-skew-x: 0;\n	--tw-skew-y: 0;\n	--tw-scale-x: 1;\n	--tw-scale-y: 1;\n	--tw-pan-x:  ;\n	--tw-pan-y:  ;\n	--tw-pinch-zoom:  ;\n	--tw-scroll-snap-strictness: proximity;\n	--tw-gradient-from-position:  ;\n	--tw-gradient-via-position:  ;\n	--tw-gradient-to-position:  ;\n	--tw-ordinal:  ;\n	--tw-slashed-zero:  ;\n	--tw-numeric-figure:  ;\n	--tw-numeric-spacing:  ;\n	--tw-numeric-fraction:  ;\n	--tw-ring-inset:  ;\n	--tw-ring-offset-width: 0px;\n	--tw-ring-offset-color: #fff;\n	--tw-ring-color: rgb(59 130 246 / 0.5);\n	--tw-ring-offset-shadow: 0 0 #0000;\n	--tw-ring-shadow: 0 0 #0000;\n	--tw-shadow: 0 0 #0000;\n	--tw-shadow-colored: 0 0 #0000;\n	--tw-blur:  ;\n	--tw-brightness:  ;\n	--tw-contrast:  ;\n	--tw-grayscale:  ;\n	--tw-hue-rotate:  ;\n	--tw-invert:  ;\n	--tw-saturate:  ;\n	--tw-sepia:  ;\n	--tw-drop-shadow:  ;\n	--tw-backdrop-blur:  ;\n	--tw-backdrop-brightness:  ;\n	--tw-backdrop-contrast:  ;\n	--tw-backdrop-grayscale:  ;\n	--tw-backdrop-hue-rotate:  ;\n	--tw-backdrop-invert:  ;\n	--tw-backdrop-opacity:  ;\n	--tw-backdrop-saturate:  ;\n	--tw-backdrop-sepia:  ;\n}\n\n		#ijs .container {\n	width: 100%;\n}\n\n		@media (min-width: 640px) {\n\n	#ijs .container {\n		max-width: 640px;\n	}\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .container {\n		max-width: 768px;\n	}\n}\n\n		@media (min-width: 1024px) {\n\n	#ijs .container {\n		max-width: 1024px;\n	}\n}\n\n		@media (min-width: 1280px) {\n\n	#ijs .container {\n		max-width: 1280px;\n	}\n}\n\n		@media (min-width: 1536px) {\n\n	#ijs .container {\n		max-width: 1536px;\n	}\n}\n\n		#ijs .visible {\n	visibility: visible;\n}\n\n		#ijs .invisible {\n	visibility: hidden;\n}\n\n		#ijs .collapse {\n	visibility: collapse;\n}\n\n		#ijs .static {\n	position: static;\n}\n\n		#ijs .fixed {\n	position: fixed;\n}\n\n		#ijs .absolute {\n	position: absolute;\n}\n\n		#ijs .relative {\n	position: relative;\n}\n\n		#ijs .sticky {\n	position: sticky;\n}\n\n		#ijs .isolate {\n	isolation: isolate;\n}\n\n		#ijs .m-2 {\n	margin: 0.5rem;\n}\n\n		#ijs .m-9 {\n	margin: 2.25rem;\n}\n\n		#ijs .mx-auto {\n	margin-left: auto;\n	margin-right: auto;\n}\n\n		#ijs .-mt-4 {\n	margin-top: -1rem;\n}\n\n		#ijs .block {\n	display: block;\n}\n\n		#ijs .inline-block {\n	display: inline-block;\n}\n\n		#ijs .inline {\n	display: inline;\n}\n\n		#ijs .flex {\n	display: flex;\n}\n\n		#ijs .inline-flex {\n	display: inline-flex;\n}\n\n		#ijs .table {\n	display: table;\n}\n\n		#ijs .table-row {\n	display: table-row;\n}\n\n		#ijs .flow-root {\n	display: flow-root;\n}\n\n		#ijs .grid {\n	display: grid;\n}\n\n		#ijs .inline-grid {\n	display: inline-grid;\n}\n\n		#ijs .contents {\n	display: contents;\n}\n\n		#ijs .list-item {\n	display: list-item;\n}\n\n		#ijs .\\!hidden {\n	display: none !important;\n}\n\n		#ijs .hidden {\n	display: none;\n}\n\n		#ijs .h-8 {\n	height: 2rem;\n}\n\n		#ijs .h-\\[1lh\\] {\n	height: 1lh;\n}\n\n		#ijs .min-h-screen {\n	min-height: 100vh;\n}\n\n		#ijs .w-\\[10ch\\] {\n	width: 10ch;\n}\n\n		#ijs .w-\\[6ch\\] {\n	width: 6ch;\n}\n\n		#ijs .w-\\[8ch\\] {\n	width: 8ch;\n}\n\n		#ijs .w-full {\n	width: 100%;\n}\n\n		#ijs .min-w-0 {\n	min-width: 0px;\n}\n\n		#ijs .max-w-full {\n	max-width: 100%;\n}\n\n		#ijs .max-w-screen-lg {\n	max-width: 1024px;\n}\n\n		#ijs .flex-1 {\n	flex: 1 1 0%;\n}\n\n		#ijs .flex-none {\n	flex: none;\n}\n\n		#ijs .flex-shrink {\n	flex-shrink: 1;\n}\n\n		#ijs .shrink {\n	flex-shrink: 1;\n}\n\n		#ijs .flex-grow {\n	flex-grow: 1;\n}\n\n		#ijs .grow {\n	flex-grow: 1;\n}\n\n		#ijs .border-collapse {\n	border-collapse: collapse;\n}\n\n		#ijs .origin-top {\n	transform-origin: top;\n}\n\n		#ijs .transform {\n	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n		@keyframes appear-tag {\n\n	0% {\n		transform: scale(0.9);\n	}\n\n	100% {\n		transform: scale(1);\n	}\n}\n\n		#ijs .animate-appear-tag {\n	animation: appear-tag 0.6s cubic-bezier(0.16, 1, 0.3, 1) both;\n}\n\n		@keyframes selected-tag {\n\n	0% {\n		transform: scale(1.11);\n	}\n\n	100% {\n		transform: scale(1);\n	}\n}\n\n		#ijs .animate-selected-tag {\n	animation: selected-tag 0.9s cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n		@keyframes skeleton {\n\n	0% {\n		opacity: 0.2;\n	}\n\n	50% {\n		opacity: 0.5;\n	}\n\n	100% {\n		opacity: 0.3;\n	}\n}\n\n		#ijs .animate-skeleton {\n	animation: skeleton 1s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n}\n\n		#ijs .cursor-pointer {\n	cursor: pointer;\n}\n\n		#ijs .select-none {\n	-webkit-user-select: none;\n	   -moz-user-select: none;\n	        user-select: none;\n}\n\n		#ijs .resize {\n	resize: both;\n}\n\n		#ijs .flex-col {\n	flex-direction: column;\n}\n\n		#ijs .flex-wrap {\n	flex-wrap: wrap;\n}\n\n		#ijs .items-start {\n	align-items: flex-start;\n}\n\n		#ijs .items-center {\n	align-items: center;\n}\n\n		#ijs .items-stretch {\n	align-items: stretch;\n}\n\n		#ijs .justify-end {\n	justify-content: flex-end;\n}\n\n		#ijs .justify-center {\n	justify-content: center;\n}\n\n		#ijs .gap-1 {\n	gap: 0.25rem;\n}\n\n		#ijs .gap-1\\.5 {\n	gap: 0.375rem;\n}\n\n		#ijs .gap-2 {\n	gap: 0.5rem;\n}\n\n		#ijs .gap-3 {\n	gap: 0.75rem;\n}\n\n		#ijs .gap-4 {\n	gap: 1rem;\n}\n\n		#ijs .overflow-hidden {\n	overflow: hidden;\n}\n\n		#ijs .overflow-x-auto {\n	overflow-x: auto;\n}\n\n		#ijs .truncate {\n	overflow: hidden;\n	text-overflow: ellipsis;\n	white-space: nowrap;\n}\n\n		#ijs .whitespace-nowrap {\n	white-space: nowrap;\n}\n\n		#ijs .rounded-interactive {\n	border-radius: var(--i-radius-interactive);\n}\n\n		#ijs .rounded-job-card {\n	border-radius: var(--i-radius-job-card);\n}\n\n		#ijs .rounded-job-tag {\n	border-radius: var(--i-radius-job-tag);\n}\n\n		#ijs .rounded-section {\n	border-radius: var(--i-radius-section);\n}\n\n		#ijs .rounded-tag {\n	border-radius: var(--i-radius-job-tag);\n}\n\n		#ijs .border {\n	border-width: 1px;\n}\n\n		#ijs .bg-\\[currentColor\\] {\n	background-color: currentColor;\n}\n\n		#ijs .bg-app {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-app-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .bg-job-card-bg {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-job-card-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .bg-section-strong-bg {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-section-strong-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .bg-section-weak-bg {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-section-weak-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .bg-tag-accent-strong-bg {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-tag-accent-strong-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .bg-tag-monetary-weak-bg {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-tag-monetary-weak-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .bg-tag-neutral-strong-bg {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-tag-neutral-strong-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .bg-tag-neutral-weak-bg {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-tag-neutral-weak-bg) / var(--tw-bg-opacity));\n}\n\n		#ijs .p-1 {\n	padding: 0.25rem;\n}\n\n		#ijs .p-2 {\n	padding: 0.5rem;\n}\n\n		#ijs .p-4 {\n	padding: 1rem;\n}\n\n		#ijs .px-2 {\n	padding-left: 0.5rem;\n	padding-right: 0.5rem;\n}\n\n		#ijs .px-3 {\n	padding-left: 0.75rem;\n	padding-right: 0.75rem;\n}\n\n		#ijs .px-4 {\n	padding-left: 1rem;\n	padding-right: 1rem;\n}\n\n		#ijs .px-5 {\n	padding-left: 1.25rem;\n	padding-right: 1.25rem;\n}\n\n		#ijs .py-1 {\n	padding-top: 0.25rem;\n	padding-bottom: 0.25rem;\n}\n\n		#ijs .py-2 {\n	padding-top: 0.5rem;\n	padding-bottom: 0.5rem;\n}\n\n		#ijs .py-4 {\n	padding-top: 1rem;\n	padding-bottom: 1rem;\n}\n\n		#ijs .py-6 {\n	padding-top: 1.5rem;\n	padding-bottom: 1.5rem;\n}\n\n		#ijs .pb-1 {\n	padding-bottom: 0.25rem;\n}\n\n		#ijs .pb-4 {\n	padding-bottom: 1rem;\n}\n\n		#ijs .pl-3 {\n	padding-left: 0.75rem;\n}\n\n		#ijs .pr-1 {\n	padding-right: 0.25rem;\n}\n\n		#ijs .pt-2 {\n	padding-top: 0.5rem;\n}\n\n		#ijs .text-center {\n	text-align: center;\n}\n\n		#ijs .text-justify {\n	text-align: justify;\n}\n\n		#ijs .font-family-filter {\n	font-family: var(--i-font-filter);\n}\n\n		#ijs .font-family-tag {\n	font-family: var(--i-font-tag);\n}\n\n		#ijs .text-style-filter {\n	font-size: 1rem;\n	line-height: 1.5rem;\n	letter-spacing: -0.01em;\n}\n\n		#ijs .text-style-job-card {\n	font-size: 0.875rem;\n	line-height: 1.125rem;\n}\n\n		#ijs .text-style-job-card-info {\n	font-size: 0.75rem;\n	line-height: 1.125rem;\n}\n\n		#ijs .text-style-job-card-title {\n	font-size: 1.125rem;\n	line-height: 1.5rem;\n}\n\n		#ijs .text-style-tag {\n	font-size: 0.875rem;\n	line-height: 1.5rem;\n}\n\n		#ijs .font-weight-filter {\n	font-weight: var(--i-weight-filter);\n}\n\n		#ijs .font-weight-tag {\n	font-weight: var(--i-weight-tag);\n}\n\n		#ijs .uppercase {\n	text-transform: uppercase;\n}\n\n		#ijs .lowercase {\n	text-transform: lowercase;\n}\n\n		#ijs .capitalize {\n	text-transform: capitalize;\n}\n\n		#ijs .italic {\n	font-style: italic;\n}\n\n		#ijs .ordinal {\n	--tw-ordinal: ordinal;\n	font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);\n}\n\n		#ijs .text-copy-accent {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-copy-accent) / var(--tw-text-opacity));\n}\n\n		#ijs .text-copy-accent-icon {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-copy-accent-icon) / var(--tw-text-opacity));\n}\n\n		#ijs .text-copy-accent-lowcontrast {\n	color: oklch(var(--i-copy-accent-lowcontrast) / 0.67);\n}\n\n		#ijs .text-copy-job-info {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-copy-info) / var(--tw-text-opacity));\n}\n\n		#ijs .text-copy-neutral {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-copy) / var(--tw-text-opacity));\n}\n\n		#ijs .text-copy-neutral-icon {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-copy-icon) / var(--tw-text-opacity));\n}\n\n		#ijs .text-copy-neutral-lowcontrast {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-copy-lowcontrast) / var(--tw-text-opacity));\n}\n\n		#ijs .text-interactive-accent-text {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-interactive-accent-text) / var(--tw-text-opacity));\n}\n\n		#ijs .text-interactive-neutral-text {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-interactive-neutral-text) / var(--tw-text-opacity));\n}\n\n		#ijs .text-tag-accent-strong-copy {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-tag-accent-strong-copy) / var(--tw-text-opacity));\n}\n\n		#ijs .text-tag-monetary-weak-copy {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-tag-monetary-weak-copy) / var(--tw-text-opacity));\n}\n\n		#ijs .text-tag-neutral-strong-copy {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-tag-neutral-strong-copy) / var(--tw-text-opacity));\n}\n\n		#ijs .text-tag-neutral-weak-copy {\n	--tw-text-opacity: 1;\n	color: oklch(var(--i-tag-neutral-weak-copy) / var(--tw-text-opacity));\n}\n\n		#ijs .opacity-25 {\n	opacity: 0.25;\n}\n\n		#ijs .shadow {\n	--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n	--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n		#ijs .outline {\n	outline-style: solid;\n}\n\n		#ijs .ring-px {\n	--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n	--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n	box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n		#ijs .ring-width-job-card {\n	--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n	--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(var(--i-job-card-stroke-width) + var(--tw-ring-offset-width)) var(--tw-ring-color);\n	box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n		#ijs .ring-width-section {\n	--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n	--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(var(--i-section-stroke-width) + var(--tw-ring-offset-width)) var(--tw-ring-color);\n	box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n		#ijs .ring-job-card-stroke {\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-job-card-stroke-color) / var(--tw-ring-opacity));\n}\n\n		#ijs .ring-section-strong-stroke {\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-section-strong-stroke-color) / var(--tw-ring-opacity));\n}\n\n		#ijs .ring-section-weak-stroke {\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-section-weak-stroke-color) / var(--tw-ring-opacity));\n}\n\n		#ijs .ring-tag-accent-strong-stroke {\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-tag-accent-strong-stroke-color) / var(--tw-ring-opacity));\n}\n\n		#ijs .ring-tag-neutral-strong-stroke {\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-tag-neutral-strong-stroke-color) / var(--tw-ring-opacity));\n}\n\n		#ijs .ring-tag-neutral-weak-stroke {\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-tag-neutral-weak-stroke-color) / var(--tw-ring-opacity));\n}\n\n		#ijs .blur {\n	--tw-blur: blur(8px);\n	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n\n		#ijs .grayscale {\n	--tw-grayscale: grayscale(100%);\n	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n\n		#ijs .invert {\n	--tw-invert: invert(100%);\n	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n\n		#ijs .sepia {\n	--tw-sepia: sepia(100%);\n	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n\n		#ijs .filter {\n	filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n\n		#ijs .backdrop-filter {\n	-webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n	        backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n}\n\n		#ijs .transition {\n	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n	transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n	transition-duration: 150ms;\n}\n\n		#ijs .transition-all {\n	transition-property: all;\n	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n	transition-duration: 150ms;\n}\n\n		#ijs .duration-1000 {\n	transition-duration: 1000ms;\n}\n\n		#ijs .duration-300 {\n	transition-duration: 300ms;\n}\n\n		#ijs .duration-500 {\n	transition-duration: 500ms;\n}\n\n		#ijs .ease-expo-out {\n	transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n		#ijs .font-style-filter {\n	font-style: var(--i-style-filter);\n}\n\n		#ijs .font-style-tag {\n	font-style: var(--i-style-filter);\n}\n\n		#ijs .fr {\n	outline: none;\n}\n\n		#ijs .fr:focus {\n	outline: none;\n}\n\n		#ijs .fr:focus-visible {\n	outline: none;\n	--tw-ring-offset-width: 1px;\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-a-7) / 1);\n	--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n	box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n		#ijs .hide-scrollbars::-webkit-scrollbar {\n	display: none;\n}\n\n		#ijs .hide-scrollbars {\n	scrollbar-width: none;\n	-ms-overflow-style: none;\n}\n\n		#ijs .touch-hitbox::before {\n	content: '';\n	position: absolute;\n	display: block;\n	top: 50%;\n	left: 50%;\n	transform: translate(-50%, -50%);\n	width: 100%;\n	height: 100%;\n	min-height: 44px;\n	min-width: 44px;\n	z-index: 9999;\n}\n\n		#ijs .\\[a-zA-Z0-9-_\\:\\.\\$\\@\\?\\] {\n	a-z-a--z0-9-_: .$@?;\n}\n\n		#ijs .hover\\:bg-interactive-accent-bg-hover:hover {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-interactive-accent-bg-hover) / var(--tw-bg-opacity));\n}\n\n		#ijs .hover\\:bg-interactive-neutral-bg-hover:hover {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-interactive-neutral-bg-hover) / var(--tw-bg-opacity));\n}\n\n		#ijs .focus\\:outline-none:focus {\n	outline: 2px solid transparent;\n	outline-offset: 2px;\n}\n\n		#ijs .active\\:scale-95:active {\n	--tw-scale-x: .95;\n	--tw-scale-y: .95;\n	transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n\n		#ijs .active\\:bg-job-card-bg-active:active {\n	--tw-bg-opacity: 1;\n	background-color: oklch(var(--i-job-card-bg-active) / var(--tw-bg-opacity));\n}\n\n		#ijs .active\\:ring-job-card-stroke-active:active {\n	--tw-ring-opacity: 1;\n	--tw-ring-color: oklch(var(--i-job-card-stroke-color-active) / var(--tw-ring-opacity));\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .md\\:col-span-2 {\n		grid-column: span 2 / span 2;\n	}\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .md\\:flex {\n		display: flex;\n	}\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .md\\:grid {\n		display: grid;\n	}\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .md\\:grid-cols-3 {\n		grid-template-columns: repeat(3, minmax(0, 1fr));\n	}\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .md\\:flex-col {\n		flex-direction: column;\n	}\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .md\\:px-0 {\n		padding-left: 0px;\n		padding-right: 0px;\n	}\n}\n\n		@media (min-width: 768px) {\n\n	#ijs .md\\:px-4 {\n		padding-left: 1rem;\n		padding-right: 1rem;\n	}\n}\n\n		@media (min-width: 1024px) {\n\n	#ijs .lg\\:ring-width-section {\n		--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n		--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(var(--i-section-stroke-width) + var(--tw-ring-offset-width)) var(--tw-ring-color);\n		box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n	}\n}\n";
 const match = (m2) => {
   const patterns = [];
   const i2 = (m22) => ({
@@ -6845,17 +7060,9 @@ const generateColorThemeCss = (theme) => {
 ${colorsCss.concat(tokenCss).join("\n")}
 }`;
 };
+const FILTER_KEYS = ["company_id", "company_name", "industry", "employment_type", "location_type", "pay_type", "pay_currency", "pay_mask", "pay", "pay_min", "pay_max", "title", "category", "skills", "address_1", "address_2", "town", "city", "postcode", "country", "contract_type", "pay_display"];
 const createJobSearchDomManager = () => {
   return {
-    addStyle: (css, id) => {
-      const head = document.head;
-      const existing = head.querySelector(`style#${id}`);
-      existing == null ? void 0 : existing.remove();
-      const element = document.createElement("style");
-      element.id = id;
-      element.innerHTML = css;
-      head.appendChild(element);
-    },
     getRenderTargetElement: () => {
       const element = document.body.querySelector(`#${JOB_SEARCH_ELEMENT_ID}`);
       invariant(element, `Element with id ${JOB_SEARCH_ELEMENT_ID} not found.`);
@@ -6874,7 +7081,9 @@ const jobSearchPlugin = (params) => sdk.createPlugin(({
   }, tailwind), y$2("style", {
     id: "inploi-job-search-theme"
   }, generateColorThemeCss(params.theme))];
-  const App = y$2(g$3, {}, [styleElements, y$2(JobSearch, {
+  const App = y$2(ErrorBoundary, {
+    Fallback
+  }, [styleElements, y$2(JobSearch, {
     params,
     apiClient,
     logger,
@@ -6885,7 +7094,7 @@ const jobSearchPlugin = (params) => sdk.createPlugin(({
      *  Useful when server-side rendering to avoid CLS.
      */
     renderToString: () => {
-      return b$1(App);
+      return b$1(y$2(g$3, {}, App));
     },
     /** Renders the Job Search Plugin inside the container element. */
     render: async () => {
@@ -6894,5 +7103,6 @@ const jobSearchPlugin = (params) => sdk.createPlugin(({
     }
   };
 });
+exports.FILTER_KEYS = FILTER_KEYS;
 exports.createJobSearchDomManager = createJobSearchDomManager;
 exports.jobSearchPlugin = jobSearchPlugin;