@cn-npm/search-autocomplete 0.2.19 → 0.2.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/bundle.js +8 -11
  2. package/package.json +3 -2
  3. package/src/components/Loader/Loader.module.scss +1 -1
  4. package/src/components/SearchAutocomplete/SearchAutocomplete.module.scss +1 -1
  5. package/src/components/SearchAutocomplete/SearchAutocomplete.tsx +22 -25
  6. package/src/components/SearchAutocompleteSection/SearchAutocompleteSection.module.scss +16 -16
  7. package/src/components/SearchAutocompleteSection/SearchAutocompleteSection.tsx +4 -4
  8. package/src/components/SearchAutocompleteTag/SearchAutocompleteTag.module.scss +2 -2
  9. package/src/index.css +4 -4
  10. package/tailwind.config.js +5 -2
  11. package/npmkey +0 -3
package/dist/bundle.js CHANGED
@@ -122,7 +122,7 @@ var css_248z$4 = ".SearchAutocomplete-module_SearchAutocomplete__7VjKd {\n po
122
122
  var styles$3 = {"SearchAutocomplete":"SearchAutocomplete-module_SearchAutocomplete__7VjKd"};
123
123
  styleInject(css_248z$4);
124
124
 
125
- var css_248z$3 = ".SearchAutocompleteTag-module_SearchAutocompleteTag__edz93 {\n\n margin: 0.25rem;\n\n display: inline-block;\n\n border-radius: 0.5rem;\n\n --tw-bg-opacity: 1;\n\n background-color: rgb(242 243 247 / var(--tw-bg-opacity));\n\n padding-top: 0.5rem;\n\n padding-bottom: 0.5rem;\n\n padding-left: 0.75rem;\n\n padding-right: 0.75rem;\n\n text-align: left;\n\n font-family: sofia-pro, sans-serif;\n\n font-size: 1rem;\n\n font-weight: 400;\n\n line-height: 1.5rem;\n\n letter-spacing: 0em;\n\n --tw-text-opacity: 1;\n\n color: rgb(0 25 54 / var(--tw-text-opacity));\n\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n\n --tw-ring-color: transparent;\n\n --tw-ring-offset-width: 2px;\n\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, outline-color, focus-color;\n\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n transition-duration: 150ms\n}\n\n.SearchAutocompleteTag-module_SearchAutocompleteTag__edz93:hover {\n\n --tw-bg-opacity: 1;\n\n background-color: rgb(230 232 239 / var(--tw-bg-opacity))\n}\n\n.highlighted-text {\n\n font-weight: 600\n}";
125
+ var css_248z$3 = ".SearchAutocompleteTag-module_SearchAutocompleteTag__edz93 {\n\n margin: 0.25rem;\n\n display: inline-block;\n\n border-radius: 0.5rem;\n\n --tw-bg-opacity: 1;\n\n background-color: rgb(242 243 247 / var(--tw-bg-opacity));\n\n padding-top: 0.5rem;\n\n padding-bottom: 0.5rem;\n\n padding-left: 0.75rem;\n\n padding-right: 0.75rem;\n\n text-align: left;\n\n font-family: sofia-pro, sans-serif;\n\n font-size: 1rem;\n\n font-weight: 400;\n\n line-height: 1.5rem;\n\n letter-spacing: 0em;\n\n --tw-text-opacity: 1;\n\n color: rgb(0 25 54 / var(--tw-text-opacity));\n\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n\n --tw-ring-color: transparent;\n\n --tw-ring-offset-width: 2px;\n\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, outline-color, focus-color;\n\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n transition-duration: 150ms\n}\n\n.SearchAutocompleteTag-module_SearchAutocompleteTag__edz93:hover {\n\n --tw-bg-opacity: 1;\n\n background-color: rgb(230 232 239 / var(--tw-bg-opacity))\n}\n\n.highlighted-text {\n\n font-weight: 600\n}";
126
126
  var styles$2 = {"SearchAutocompleteTag":"SearchAutocompleteTag-module_SearchAutocompleteTag__edz93"};
127
127
  styleInject(css_248z$3);
128
128
 
@@ -177,7 +177,7 @@ var resultsLimit = function (title) {
177
177
  };
178
178
  var SearchAutocompleteSection = function (props) {
179
179
  var _a;
180
- return (jsxRuntime.jsxs("div", __assign({ className: classNames__default["default"](styles$1.SearchAutocompleteSection, "autocomplete-section"), "data-testid": "searchAutocompleteSection" }, { children: [jsxRuntime.jsx("h2", __assign({ className: "sa-text-night-sky-800 sa-mb-2 sa-text-base", "data-testid": "searchResultTitle" }, { children: props.title })), jsxRuntime.jsx("div", __assign({ className: "sa-flow-root" }, { children: jsxRuntime.jsxs("div", __assign({ className: "sa-m-1 sa-flex sa-flex-wrap autocomplete-section", "data-testid": "searchTag" }, { children: [(props.results == null || props.results.length === 0) && (jsxRuntime.jsx("p", __assign({ className: "sa-pl-3" }, { children: "No results found" }))), props.results &&
180
+ return (jsxRuntime.jsxs("div", __assign({ className: classNames__default["default"](styles$1.SearchAutocompleteSection, "autocomplete-section"), "data-testid": "searchAutocompleteSection" }, { children: [jsxRuntime.jsx("h2", __assign({ className: "text-night-sky-800 mb-2 text-base", "data-testid": "searchResultTitle" }, { children: props.title })), jsxRuntime.jsx("div", __assign({ className: "flow-root" }, { children: jsxRuntime.jsxs("div", __assign({ className: "-m-1 flex flex-wrap autocomplete-section", "data-testid": "searchTag" }, { children: [(props.results == null || props.results.length === 0) && (jsxRuntime.jsx("p", __assign({ className: "pl-3" }, { children: "No results found" }))), props.results &&
181
181
  props.results.length > 0 &&
182
182
  ((_a = props.results) === null || _a === void 0 ? void 0 : _a.slice(0, resultsLimit(props.title || "")).map(function (results) { return (jsxRuntime.jsx(SearchAutocompleteTag, { section: props.title || "", searchTerm: props.searchTerm, ein: results.ein, name: results.title, url: results.url }, results.url)); }))] })) }))] })));
183
183
  };
@@ -268,11 +268,11 @@ var SearchAutocomplete = function (props) {
268
268
  React__default["default"].useEffect(function () {
269
269
  var tags = document.querySelectorAll(".autocomplete-tag, .autocomplete-custom-search");
270
270
  tags.forEach(function (x, i) {
271
- x.classList.remove("autocomplete-selected", "!sa-bg-grey-100", "!sa-ring-blue-600");
271
+ x.classList.remove("autocomplete-selected", "!bg-grey-100", "!ring-blue-600");
272
272
  if (i + 1 === selectedTag) {
273
273
  x.classList.add("autocomplete-selected", tags[i].classList.contains("autocomplete-tag")
274
- ? "!sa-bg-grey-100"
275
- : "sa-none", "!sa-ring-blue-600");
274
+ ? "!bg-grey-100"
275
+ : "none", "!ring-blue-600");
276
276
  x.scrollIntoView({
277
277
  behavior: "smooth",
278
278
  });
@@ -313,9 +313,6 @@ var SearchAutocomplete = function (props) {
313
313
  axios__default["default"]({
314
314
  signal: controller.signal,
315
315
  url: "https://graph.charitynavigator.org/graphql",
316
- params: {
317
- user_key: "67a233b3ae2f5690bce775c1760925f2",
318
- },
319
316
  method: "post",
320
317
  data: {
321
318
  query: "\n query SearchQuery {\n searchAutocomplete(term: \"".concat(searchTerm, "\") {\n title\n results {\n ein\n title\n url\n }\n }\n }\n "),
@@ -395,12 +392,12 @@ var SearchAutocomplete = function (props) {
395
392
  }
396
393
  }
397
394
  };
398
- return (jsxRuntime.jsxs("div", __assign({ className: classNames__default["default"](styles$3.SearchAutocomplete, "autocomplete"), "data-testid": "SearchAutocomplete" }, { children: [jsxRuntime.jsxs("form", __assign({ action: "/search?q=".concat(searchTerm), className: "sa-flex sa-font-sofia-pro", autoComplete: "off" }, { children: [jsxRuntime.jsx("label", __assign({ htmlFor: "search", className: "sa-hidden" }, { children: label })), jsxRuntime.jsxs("div", __assign({ className: "sa-relative sa-flex sa-flex-grow" }, { children: [jsxRuntime.jsx(reactDebounceInput.DebounceInput, { type: "text", name: "q", id: "search", placeholder: label, className: "sa-flex-auto sa-pr-0 sa-items-stretch sa-flex-grow sa-text-night-sky-800 sa-ring-0 sa-py-0 sa-shadow-none sa-focus:ring-0 sa-bg-white sa-transition-colors sa-border-opacity-100 sa-hover:bg-grey-100 sa-hover:border-grey-500 sa-hover:border-opacity-50 sa-focus:bg-grey-100 sa-focus:border-blue-400 sa-inline-block sm:sa-text-sm sa-border-grey-500 sa-rounded-md sa-rounded-tr-none sa-rounded-br-none sa-placeholder:text-gray-600", debounceTimeout: 300, minLength: 2, value: searchTerm, onChange: function (e) { return setSearchTerm(e.target.value); }, onClick: function () { return setOpen(true); }, onFocus: function () { return setOpen(true); }, onBlur: function () { return setOpen(false); }, onKeyDown: function (e) { return keyDownHandler(e); } }), searchTerm !== "" && (jsxRuntime.jsx("button", __assign({ type: "button", className: "sa-absolute sa-right-3 sa-top-[50%] -sa-translate-y-[50%] sa-text-night-sky-800 hover:sa-text-blue-500 sa-transition-colors !sa-bg-[transparent] sa-cursor-pointer", onClick: clearSearch }, { children: jsxRuntime.jsx(SvgCircleClose, { className: "sa-fill-night-sky-800 hover:sa-fill-blue-500 sa-h-4 sa-w-4" }) })))] })), jsxRuntime.jsx("button", __assign({ type: "submit", className: "sa-inline-flex sa-transition-colors sa-items-center sa-justify-center sa-px-4 sa-h-[38px] sa-font-medium sa-rounded-md sa-shadow-sm sa-border sa-border-blue-500 sa-text-white sa-bg-blue-500 hover:sa-bg-blue-600 hover:sa-border-blue-600 focus:sa-outline-none focus:sa-ring-2 focus:sa-ring-offset-2 focus:sa-ring-blue-500 sm:sa-text-sm sa-rounded-tl-none sa-rounded-bl-none" }, { children: jsxRuntime.jsx(SvgSearch, { className: "sa-fill-white sa-h-4 sa-w-4" }) }))] })), jsxRuntime.jsx("div", __assign({ className: "sa-relative" }, { children: jsxRuntime.jsx(CSSTransition__default["default"], __assign({ mountOnEnter: true, unmountOnExit: true, in: open, timeout: 300, classNames: "sa-fade-slide", "data-testid": "searchResults" }, { children: jsxRuntime.jsxs("div", __assign({ className: classNames__default["default"]("search-results-container sa-absolute sa-top-0 sa-left-1/2 -sa-translate-x-1/2 sa-mt-2 sa-bg-white sa-py-5 sa-rounded-[1.25rem] sa-z-50 sa-shadow-lg sa-border border-[#a6abbd] sa-border-opacity-60 sa-w-full tablet:sa-w-[70vw] sa-min-h-[8rem] sa-overflow-hidden") }, { children: [jsxRuntime.jsxs(ErrorBoundary, { children: [loading && (jsxRuntime.jsx(Loader, { "data-testid": "Loader", className: "sa-absolute sa-top-5 sa-right-5" })), jsxRuntime.jsxs("div", __assign({ className: "sa-px-6 sa-h-full sa-mb-12 sa-max-h-[70vh] sa-overflow-y-auto", "data-testid": "Sections" }, { children: [hasError && (jsxRuntime.jsx("p", { children: "Sorry, there was a problem. Please try your search again." })), searchData.data &&
395
+ return (jsxRuntime.jsxs("div", __assign({ className: classNames__default["default"](styles$3.SearchAutocomplete, "autocomplete"), "data-testid": "SearchAutocomplete" }, { children: [jsxRuntime.jsxs("form", __assign({ action: "/search?q=".concat(searchTerm), className: "flex font-sofia-pro", autoComplete: "off" }, { children: [jsxRuntime.jsx("label", __assign({ htmlFor: "search", className: "hidden" }, { children: label })), jsxRuntime.jsxs("div", __assign({ className: "relative flex flex-grow" }, { children: [jsxRuntime.jsx(reactDebounceInput.DebounceInput, { type: "text", name: "q", id: "search", placeholder: label, className: "form-input flex-auto pr-0 items-stretch flex-grow text-night-sky-800 ring-0 py-0 shadow-none focus:ring-0 bg-white transition-colors border-opacity-100 hover:bg-grey-100 hover:border-grey-500 hover:border-opacity-50 focus:bg-grey-100 focus:border-blue-400 inline-block sm:text-sm border-grey-500 rounded-md rounded-tr-none rounded-br-none placeholder:text-gray-600", debounceTimeout: 300, minLength: 2, value: searchTerm, onChange: function (e) { return setSearchTerm(e.target.value); }, onClick: function () { return setOpen(true); }, onFocus: function () { return setOpen(true); }, onBlur: function () { return setOpen(false); }, onKeyDown: function (e) { return keyDownHandler(e); } }), searchTerm !== "" && (jsxRuntime.jsx("button", __assign({ type: "button", className: "absolute right-3 top-[50%] -translate-y-[50%] text-night-sky-800 hover:text-blue-500 transition-colors !bg-[transparent] cursor-pointer", onClick: clearSearch }, { children: jsxRuntime.jsx(SvgCircleClose, { className: "fill-night-sky-800 hover:fill-blue-500 h-4 w-4" }) })))] })), jsxRuntime.jsx("button", __assign({ type: "submit", className: "inline-flex transition-colors items-center justify-center px-4 h-[38px] font-medium rounded-md shadow-sm border border-blue-500 text-white bg-blue-500 hover:bg-blue-600 hover:border-blue-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:text-sm rounded-tl-none rounded-bl-none" }, { children: jsxRuntime.jsx(SvgSearch, { className: "fill-white h-4 w-4" }) }))] })), jsxRuntime.jsx("div", __assign({ className: "relative" }, { children: jsxRuntime.jsx(CSSTransition__default["default"], __assign({ mountOnEnter: true, unmountOnExit: true, in: open, timeout: 300, classNames: "fade-slide", "data-testid": "searchResults" }, { children: jsxRuntime.jsxs("div", __assign({ className: classNames__default["default"]("search-results-container absolute top-0 left-1/2 -translate-x-1/2 mt-2 bg-white py-5 rounded-[1.25rem] z-50 shadow-lg border border-[#a6abbd] border-opacity-60 w-full tablet:w-[70vw] min-h-[8rem] overflow-hidden") }, { children: [jsxRuntime.jsxs(ErrorBoundary, { children: [loading && (jsxRuntime.jsx(Loader, { "data-testid": "Loader", className: "absolute top-5 right-5" })), jsxRuntime.jsxs("div", __assign({ className: "px-6 h-full mb-12 max-h-[70vh] overflow-y-auto", "data-testid": "Sections" }, { children: [hasError && (jsxRuntime.jsx("p", { children: "Sorry, there was a problem. Please try your search again." })), searchData.data &&
399
396
  searchData.data.searchAutocomplete &&
400
- searchData.data.searchAutocomplete.map(function (section) { return (jsxRuntime.jsx(SearchAutocompleteSection, { searchTerm: searchTerm, title: section.title, results: section.results }, section.title)); })] }))] }), jsxRuntime.jsx("div", __assign({ className: "sa-border-t sa-border-[#a6abbd] sa-border-opacity-60 sa-flex sa-items-center sa-absolute sa-bottom-0 sa-left-0 sa-w-full sa-bg-white sa-h-16" }, { children: jsxRuntime.jsxs("a", __assign({ href: "/search?q=".concat(searchTerm), className: "sa-px-3 sa-py-1 sa-ml-6 sa-flex sa-items-center sa-space-x-3 sa-ring-1 sa-ring-offset-2 sa-ring-transparent sa-transition-colors sa-text-blue-500 hover:sa-text-blue-600 sa-rounded-lg autocomplete-custom-search" }, { children: [jsxRuntime.jsx(SvgSearch, { className: "sa-fill-blue-500 hover:sa-fill-blue-600 sa-h-4 sa-w-4" }), jsxRuntime.jsx("span", __assign({ className: "sa-font-semibold sa-text-[1.125rem] " }, { children: searchTerm === "" ? "Custom Search" : "View All Results" }))] })) }))] })) })) }))] })));
397
+ searchData.data.searchAutocomplete.map(function (section) { return (jsxRuntime.jsx(SearchAutocompleteSection, { searchTerm: searchTerm, title: section.title, results: section.results }, section.title)); })] }))] }), jsxRuntime.jsx("div", __assign({ className: "border-t border-[#a6abbd] border-opacity-60 flex items-center absolute bottom-0 left-0 w-full bg-white h-16" }, { children: jsxRuntime.jsxs("a", __assign({ href: "/search?q=".concat(searchTerm), className: "px-3 py-1 ml-6 flex items-center space-x-3 ring-1 ring-offset-2 ring-transparent transition-colors text-blue-500 hover:text-blue-600 rounded-lg autocomplete-custom-search" }, { children: [jsxRuntime.jsx(SvgSearch, { className: "fill-blue-500 hover:fill-blue-600 h-4 w-4" }), jsxRuntime.jsx("span", __assign({ className: "font-semibold text-[1.125rem] " }, { children: searchTerm === "" ? "Custom Search" : "View All Results" }))] })) }))] })) })) }))] })));
401
398
  };
402
399
 
403
- var css_248z = "/*\n! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com\n*//*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\n\n*,\n::before,\n::after {\n box-sizing: border-box; /* 1 */\n border-width: 0; /* 2 */\n border-style: solid; /* 2 */\n border-color: currentColor; /* 2 */\n}\n\n::before,\n::after {\n --tw-content: '';\n}\n\n/*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user's configured `sans` font-family by default.\n5. Use the user's configured `sans` font-feature-settings by default.\n6. Use the user's configured `sans` font-variation-settings by default.\n7. Disable tap highlights on iOS\n*/\n\nhtml,\n:host {\n line-height: 1.5; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */ /* 3 */\n tab-size: 4; /* 3 */\n font-family: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"; /* 4 */\n font-feature-settings: normal; /* 5 */\n font-variation-settings: normal; /* 6 */\n -webkit-tap-highlight-color: transparent; /* 7 */\n}\n\n/*\n1. Remove the margin in all browsers.\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\n*/\n\nbody {\n margin: 0; /* 1 */\n line-height: inherit; /* 2 */\n}\n\n/*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\n\nhr {\n height: 0; /* 1 */\n color: inherit; /* 2 */\n border-top-width: 1px; /* 3 */\n}\n\n/*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n}\n\n/*\nRemove the default font size and weight for headings.\n*/\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n font-size: inherit;\n font-weight: inherit;\n}\n\n/*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\n\na {\n color: inherit;\n text-decoration: inherit;\n}\n\n/*\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/*\n1. Use the user's configured `mono` font-family by default.\n2. Use the user's configured `mono` font-feature-settings by default.\n3. Use the user's configured `mono` font-variation-settings by default.\n4. Correct the odd `em` font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace; /* 1 */\n font-feature-settings: normal; /* 2 */\n font-variation-settings: normal; /* 3 */\n font-size: 1em; /* 4 */\n}\n\n/*\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n font-size: 80%;\n}\n\n/*\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\n\ntable {\n text-indent: 0; /* 1 */\n border-color: inherit; /* 2 */\n border-collapse: collapse; /* 3 */\n}\n\n/*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-feature-settings: inherit; /* 1 */\n font-variation-settings: inherit; /* 1 */\n font-size: 100%; /* 1 */\n font-weight: inherit; /* 1 */\n line-height: inherit; /* 1 */\n color: inherit; /* 1 */\n margin: 0; /* 2 */\n padding: 0; /* 3 */\n}\n\n/*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\n\nbutton,\nselect {\n text-transform: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\n\nbutton,\n[type='button'],\n[type='reset'],\n[type='submit'] {\n -webkit-appearance: button; /* 1 */\n background-color: transparent; /* 2 */\n background-image: none; /* 2 */\n}\n\n/*\nUse the modern Firefox focus style for all focusable elements.\n*/\n\n:-moz-focusring {\n outline: auto;\n}\n\n/*\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\n\n:-moz-ui-invalid {\n box-shadow: none;\n}\n\n/*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n vertical-align: baseline;\n}\n\n/*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n height: auto;\n}\n\n/*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type='search'] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to `inherit` in Safari.\n*/\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n display: list-item;\n}\n\n/*\nRemoves the default spacing and border for appropriate elements.\n*/\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n margin: 0;\n}\n\nfieldset {\n margin: 0;\n padding: 0;\n}\n\nlegend {\n padding: 0;\n}\n\nol,\nul,\nmenu {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n/*\nReset default styling for dialogs.\n*/\ndialog {\n padding: 0;\n}\n\n/*\nPrevent resizing textareas horizontally by default.\n*/\n\ntextarea {\n resize: vertical;\n}\n\n/*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user's configured gray 400 color.\n*/\n\ninput::placeholder,\ntextarea::placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n\n/*\nSet the default cursor for buttons.\n*/\n\nbutton,\n[role=\"button\"] {\n cursor: pointer;\n}\n\n/*\nMake sure disabled buttons don't get the pointer cursor.\n*/\n:disabled {\n cursor: default;\n}\n\n/*\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\n This can trigger a poorly considered lint error in some tools but is included by design.\n*/\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n display: block; /* 1 */\n vertical-align: middle; /* 2 */\n}\n\n/*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\n\nimg,\nvideo {\n max-width: 100%;\n height: auto;\n}\n\n/* Make elements with the HTML hidden attribute stay hidden by default */\n[hidden] {\n display: none;\n}\n @import url(\"https://p.typekit.net/p.css?s=1&k=etf0mna&ht=tk&f=24536.24553.24554.24558.24559.24539.24540.24545.24546.24547.24548.24549.24552.24580.24581.24586.24587.24588.24589.24590.24591&a=27633482&app=typekit&e=css\");\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/745ea3/00000000000000007735a146/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/745ea3/00000000000000007735a146/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/745ea3/00000000000000007735a146/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/cdf40b/00000000000000007735a147/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/cdf40b/00000000000000007735a147/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/cdf40b/00000000000000007735a147/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/691282/00000000000000007735a149/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/691282/00000000000000007735a149/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/691282/00000000000000007735a149/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/54ce76/00000000000000007735a154/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/54ce76/00000000000000007735a154/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/54ce76/00000000000000007735a154/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/9f41be/00000000000000007735a157/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/9f41be/00000000000000007735a157/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/9f41be/00000000000000007735a157/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/5d97ff/00000000000000007735f999/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/5d97ff/00000000000000007735f999/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/5d97ff/00000000000000007735f999/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/66e20c/00000000000000007735f993/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/66e20c/00000000000000007735f993/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/66e20c/00000000000000007735f993/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/19ced7/00000000000000007735f992/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/19ced7/00000000000000007735f992/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/19ced7/00000000000000007735f992/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/33e8a4/00000000000000007735f99b/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/33e8a4/00000000000000007735f99b/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/33e8a4/00000000000000007735f99b/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/b718ff/00000000000000007735f98d/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/b718ff/00000000000000007735f98d/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/b718ff/00000000000000007735f98d/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/c09857/00000000000000007735f98c/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/c09857/00000000000000007735f98c/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/c09857/00000000000000007735f98c/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/262452/00000000000000007735f99a/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/262452/00000000000000007735f99a/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/262452/00000000000000007735f99a/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 600;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/36f509/00000000000000007735f994/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/36f509/00000000000000007735f994/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/36f509/00000000000000007735f994/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 600;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/8b3e11/00000000000000007735a150/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/8b3e11/00000000000000007735a150/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/8b3e11/00000000000000007735a150/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/2fe268/00000000000000007735a153/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/2fe268/00000000000000007735a153/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/2fe268/00000000000000007735a153/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/a33c9d/00000000000000007735a15e/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/a33c9d/00000000000000007735a15e/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/a33c9d/00000000000000007735a15e/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/fa5448/00000000000000007735a161/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/fa5448/00000000000000007735a161/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/fa5448/00000000000000007735a161/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/cf0830/00000000000000007735a162/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/cf0830/00000000000000007735a162/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/cf0830/00000000000000007735a162/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/7da024/00000000000000007735a164/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/7da024/00000000000000007735a164/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/7da024/00000000000000007735a164/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/ef0e2d/00000000000000007735a166/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/ef0e2d/00000000000000007735a166/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/ef0e2d/00000000000000007735a166/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 600;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/1ff8be/00000000000000007735a168/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/1ff8be/00000000000000007735a168/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/1ff8be/00000000000000007735a168/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 600;\n font-stretch: normal;\n }\n\n*, ::before, ::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::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.sa-absolute {\n position: absolute;\n}\n.sa-relative {\n position: relative;\n}\n.sa-bottom-0 {\n bottom: 0px;\n}\n.sa-left-0 {\n left: 0px;\n}\n.sa-left-1\\/2 {\n left: 50%;\n}\n.sa-right-3 {\n right: 0.75rem;\n}\n.sa-right-5 {\n right: 1.25rem;\n}\n.sa-top-0 {\n top: 0px;\n}\n.sa-top-5 {\n top: 1.25rem;\n}\n.sa-top-\\[50\\%\\] {\n top: 50%;\n}\n.sa-z-50 {\n z-index: 50;\n}\n.sa-m-1 {\n margin: 0.25rem;\n}\n.sa-mb-12 {\n margin-bottom: 3rem;\n}\n.sa-mb-2 {\n margin-bottom: 0.5rem;\n}\n.sa-ml-6 {\n margin-left: 1.5rem;\n}\n.sa-mt-2 {\n margin-top: 0.5rem;\n}\n.sa-inline-block {\n display: inline-block;\n}\n.sa-flex {\n display: flex;\n}\n.sa-inline-flex {\n display: inline-flex;\n}\n.sa-flow-root {\n display: flow-root;\n}\n.sa-hidden {\n display: none;\n}\n.sa-h-16 {\n height: 4rem;\n}\n.sa-h-4 {\n height: 1rem;\n}\n.sa-h-\\[38px\\] {\n height: 38px;\n}\n.sa-h-full {\n height: 100%;\n}\n.sa-max-h-\\[70vh\\] {\n max-height: 70vh;\n}\n.sa-min-h-\\[8rem\\] {\n min-height: 8rem;\n}\n.sa-w-4 {\n width: 1rem;\n}\n.sa-w-full {\n width: 100%;\n}\n.sa-flex-auto {\n flex: 1 1 auto;\n}\n.sa-flex-grow {\n flex-grow: 1;\n}\n.-sa-translate-x-1\\/2 {\n --tw-translate-x: -50%;\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.-sa-translate-y-\\[50\\%\\] {\n --tw-translate-y: -50%;\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.sa-cursor-pointer {\n cursor: pointer;\n}\n.sa-flex-wrap {\n flex-wrap: wrap;\n}\n.sa-items-center {\n align-items: center;\n}\n.sa-items-stretch {\n align-items: stretch;\n}\n.sa-justify-center {\n justify-content: center;\n}\n.sa-space-x-3 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(0.75rem * var(--tw-space-x-reverse));\n margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));\n}\n.sa-overflow-hidden {\n overflow: hidden;\n}\n.sa-overflow-y-auto {\n overflow-y: auto;\n}\n.sa-rounded-\\[1\\.25rem\\] {\n border-radius: 1.25rem;\n}\n.sa-rounded-lg {\n border-radius: 0.5rem;\n}\n.sa-rounded-md {\n border-radius: 0.375rem;\n}\n.sa-rounded-bl-none {\n border-bottom-left-radius: 0px;\n}\n.sa-rounded-br-none {\n border-bottom-right-radius: 0px;\n}\n.sa-rounded-tl-none {\n border-top-left-radius: 0px;\n}\n.sa-rounded-tr-none {\n border-top-right-radius: 0px;\n}\n.sa-border {\n border-width: 1px;\n}\n.sa-border-t {\n border-top-width: 1px;\n}\n.sa-border-\\[\\#a6abbd\\] {\n --tw-border-opacity: 1;\n border-color: rgb(166 171 189 / var(--tw-border-opacity));\n}\n.sa-border-blue-500 {\n --tw-border-opacity: 1;\n border-color: rgb(53 95 254 / var(--tw-border-opacity));\n}\n.sa-border-grey-500 {\n --tw-border-opacity: 1;\n border-color: rgb(155 163 192 / var(--tw-border-opacity));\n}\n.sa-border-opacity-100 {\n --tw-border-opacity: 1;\n}\n.sa-border-opacity-60 {\n --tw-border-opacity: 0.6;\n}\n.\\!sa-bg-\\[transparent\\] {\n background-color: transparent !important;\n}\n.\\!sa-bg-grey-100 {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(230 232 239 / var(--tw-bg-opacity)) !important;\n}\n.sa-bg-blue-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(53 95 254 / var(--tw-bg-opacity));\n}\n.sa-bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity));\n}\n.sa-fill-blue-500 {\n fill: #355FFE;\n}\n.sa-fill-night-sky-800 {\n fill: #001936;\n}\n.sa-fill-white {\n fill: #FFFFFF;\n}\n.sa-px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.sa-px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.sa-px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.sa-py-0 {\n padding-top: 0px;\n padding-bottom: 0px;\n}\n.sa-py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n}\n.sa-py-5 {\n padding-top: 1.25rem;\n padding-bottom: 1.25rem;\n}\n.sa-pl-3 {\n padding-left: 0.75rem;\n}\n.sa-pr-0 {\n padding-right: 0px;\n}\n.sa-font-sofia-pro {\n font-family: sofia-pro, sans-serif;\n}\n.sa-text-\\[1\\.125rem\\] {\n font-size: 1.125rem;\n}\n.sa-text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.sa-font-medium {\n font-weight: 500;\n}\n.sa-font-semibold {\n font-weight: 600;\n}\n.sa-text-blue-500 {\n --tw-text-opacity: 1;\n color: rgb(53 95 254 / var(--tw-text-opacity));\n}\n.sa-text-night-sky-800 {\n --tw-text-opacity: 1;\n color: rgb(0 25 54 / var(--tw-text-opacity));\n}\n.sa-text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity));\n}\n.sa-shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px 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.sa-shadow-none {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.sa-shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --tw-shadow-colored: 0 1px 2px 0 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.sa-ring-0 {\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(0px + 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.sa-ring-1 {\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.\\!sa-ring-blue-600 {\n --tw-ring-opacity: 1 !important;\n --tw-ring-color: rgb(35 74 224 / var(--tw-ring-opacity)) !important;\n}\n.sa-ring-transparent {\n --tw-ring-color: transparent;\n}\n.sa-ring-offset-2 {\n --tw-ring-offset-width: 2px;\n}\n.sa-transition-colors {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, outline-color, focus-color;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n\n/* Search Results Container Styles */\n.fade-slide-enter {\n --tw-translate-y: -0.75rem;\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 opacity: 0;\n}\n\n.fade-slide-enter-active,\n.fade-slide-enter-done {\n --tw-translate-y: 0px;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\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 opacity: 1;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 300ms;\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n.fade-slide-exit {\n --tw-translate-y: 0px;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\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 opacity: 1;\n}\n\n.fade-slide-exit-active,\n.fade-slide-exit-done {\n --tw-translate-y: -0.75rem;\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 opacity: 0;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 300ms;\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n.hover\\:sa-border-blue-600:hover {\n --tw-border-opacity: 1;\n border-color: rgb(35 74 224 / var(--tw-border-opacity));\n}\n\n.hover\\:sa-bg-blue-600:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(35 74 224 / var(--tw-bg-opacity));\n}\n\n.hover\\:sa-fill-blue-500:hover {\n fill: #355FFE;\n}\n\n.hover\\:sa-fill-blue-600:hover {\n fill: #234AE0;\n}\n\n.hover\\:sa-text-blue-500:hover {\n --tw-text-opacity: 1;\n color: rgb(53 95 254 / var(--tw-text-opacity));\n}\n\n.hover\\:sa-text-blue-600:hover {\n --tw-text-opacity: 1;\n color: rgb(35 74 224 / var(--tw-text-opacity));\n}\n\n.focus\\:sa-outline-none:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n\n.focus\\:sa-ring-2:focus {\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(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.focus\\:sa-ring-blue-500:focus {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(53 95 254 / var(--tw-ring-opacity));\n}\n\n.focus\\:sa-ring-offset-2:focus {\n --tw-ring-offset-width: 2px;\n}\n\n@media (min-width: 1000px) {\n\n .tablet\\:sa-w-\\[70vw\\] {\n width: 70vw;\n }\n}\n";
400
+ var css_248z = "/*\n! tailwindcss v3.1.8 | MIT License | https://tailwindcss.com\n*//*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\n\n*,\n::before,\n::after {\n box-sizing: border-box; /* 1 */\n border-width: 0; /* 2 */\n border-style: solid; /* 2 */\n border-color: currentColor; /* 2 */\n}\n\n::before,\n::after {\n --tw-content: '';\n}\n\n/*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user's configured `sans` font-family by default.\n*/\n\nhtml {\n line-height: 1.5; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */ /* 3 */\n tab-size: 4; /* 3 */\n font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"; /* 4 */\n}\n\n/*\n1. Remove the margin in all browsers.\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\n*/\n\nbody {\n margin: 0; /* 1 */\n line-height: inherit; /* 2 */\n}\n\n/*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\n\nhr {\n height: 0; /* 1 */\n color: inherit; /* 2 */\n border-top-width: 1px; /* 3 */\n}\n\n/*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n}\n\n/*\nRemove the default font size and weight for headings.\n*/\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n font-size: inherit;\n font-weight: inherit;\n}\n\n/*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\n\na {\n color: inherit;\n text-decoration: inherit;\n}\n\n/*\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/*\n1. Use the user's configured `mono` font family by default.\n2. Correct the odd `em` font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/*\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n font-size: 80%;\n}\n\n/*\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\n\ntable {\n text-indent: 0; /* 1 */\n border-color: inherit; /* 2 */\n border-collapse: collapse; /* 3 */\n}\n\n/*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-size: 100%; /* 1 */\n font-weight: inherit; /* 1 */\n line-height: inherit; /* 1 */\n color: inherit; /* 1 */\n margin: 0; /* 2 */\n padding: 0; /* 3 */\n}\n\n/*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\n\nbutton,\nselect {\n text-transform: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\n\nbutton,\n[type='button'],\n[type='reset'],\n[type='submit'] {\n -webkit-appearance: button; /* 1 */\n background-color: transparent; /* 2 */\n background-image: none; /* 2 */\n}\n\n/*\nUse the modern Firefox focus style for all focusable elements.\n*/\n\n:-moz-focusring {\n outline: auto;\n}\n\n/*\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\n\n:-moz-ui-invalid {\n box-shadow: none;\n}\n\n/*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n vertical-align: baseline;\n}\n\n/*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n height: auto;\n}\n\n/*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type='search'] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to `inherit` in Safari.\n*/\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n display: list-item;\n}\n\n/*\nRemoves the default spacing and border for appropriate elements.\n*/\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n margin: 0;\n}\n\nfieldset {\n margin: 0;\n padding: 0;\n}\n\nlegend {\n padding: 0;\n}\n\nol,\nul,\nmenu {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n/*\nPrevent resizing textareas horizontally by default.\n*/\n\ntextarea {\n resize: vertical;\n}\n\n/*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user's configured gray 400 color.\n*/\n\ninput::placeholder,\ntextarea::placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n\n/*\nSet the default cursor for buttons.\n*/\n\nbutton,\n[role=\"button\"] {\n cursor: pointer;\n}\n\n/*\nMake sure disabled buttons don't get the pointer cursor.\n*/\n:disabled {\n cursor: default;\n}\n\n/*\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\n This can trigger a poorly considered lint error in some tools but is included by design.\n*/\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n display: block; /* 1 */\n vertical-align: middle; /* 2 */\n}\n\n/*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\n\nimg,\nvideo {\n max-width: 100%;\n height: auto;\n}\n @import url(\"https://p.typekit.net/p.css?s=1&k=etf0mna&ht=tk&f=24536.24553.24554.24558.24559.24539.24540.24545.24546.24547.24548.24549.24552.24580.24581.24586.24587.24588.24589.24590.24591&a=27633482&app=typekit&e=css\");\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/745ea3/00000000000000007735a146/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/745ea3/00000000000000007735a146/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/745ea3/00000000000000007735a146/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/cdf40b/00000000000000007735a147/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/cdf40b/00000000000000007735a147/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/cdf40b/00000000000000007735a147/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/691282/00000000000000007735a149/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/691282/00000000000000007735a149/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/691282/00000000000000007735a149/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/54ce76/00000000000000007735a154/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/54ce76/00000000000000007735a154/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/54ce76/00000000000000007735a154/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-soft\";\n src: url(\"https://use.typekit.net/af/9f41be/00000000000000007735a157/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/9f41be/00000000000000007735a157/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/9f41be/00000000000000007735a157/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/5d97ff/00000000000000007735f999/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/5d97ff/00000000000000007735f999/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/5d97ff/00000000000000007735f999/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/66e20c/00000000000000007735f993/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/66e20c/00000000000000007735f993/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/66e20c/00000000000000007735f993/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/19ced7/00000000000000007735f992/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/19ced7/00000000000000007735f992/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/19ced7/00000000000000007735f992/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/33e8a4/00000000000000007735f99b/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/33e8a4/00000000000000007735f99b/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/33e8a4/00000000000000007735f99b/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/b718ff/00000000000000007735f98d/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/b718ff/00000000000000007735f98d/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/b718ff/00000000000000007735f98d/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/c09857/00000000000000007735f98c/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/c09857/00000000000000007735f98c/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/c09857/00000000000000007735f98c/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/262452/00000000000000007735f99a/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/262452/00000000000000007735f99a/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/262452/00000000000000007735f99a/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 600;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro\";\n src: url(\"https://use.typekit.net/af/36f509/00000000000000007735f994/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/36f509/00000000000000007735f994/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/36f509/00000000000000007735f994/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 600;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/8b3e11/00000000000000007735a150/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/8b3e11/00000000000000007735a150/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/8b3e11/00000000000000007735a150/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/2fe268/00000000000000007735a153/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/2fe268/00000000000000007735a153/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/2fe268/00000000000000007735a153/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 700;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/a33c9d/00000000000000007735a15e/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/a33c9d/00000000000000007735a15e/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/a33c9d/00000000000000007735a15e/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/fa5448/00000000000000007735a161/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/fa5448/00000000000000007735a161/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/fa5448/00000000000000007735a161/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 500;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/cf0830/00000000000000007735a162/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/cf0830/00000000000000007735a162/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/cf0830/00000000000000007735a162/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/7da024/00000000000000007735a164/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/7da024/00000000000000007735a164/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/7da024/00000000000000007735a164/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 400;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/ef0e2d/00000000000000007735a166/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/ef0e2d/00000000000000007735a166/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/ef0e2d/00000000000000007735a166/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: normal;\n font-weight: 600;\n font-stretch: normal;\n }\n\n @font-face {\n font-family: \"sofia-pro-condensed\";\n src: url(\"https://use.typekit.net/af/1ff8be/00000000000000007735a168/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff2\"),\n url(\"https://use.typekit.net/af/1ff8be/00000000000000007735a168/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"woff\"),\n url(\"https://use.typekit.net/af/1ff8be/00000000000000007735a168/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3\")\n format(\"opentype\");\n font-display: auto;\n font-style: italic;\n font-weight: 600;\n font-stretch: normal;\n }\n\n*, ::before, ::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-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::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-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.form-input,.form-textarea,.form-select,.form-multiselect {\n appearance: none;\n background-color: #fff;\n border-color: #6b7280;\n border-width: 1px;\n border-radius: 0px;\n padding-top: 0.5rem;\n padding-right: 0.75rem;\n padding-bottom: 0.5rem;\n padding-left: 0.75rem;\n font-size: 1rem;\n line-height: 1.5rem;\n --tw-shadow: 0 0 #0000;\n}\n.form-input:focus, .form-textarea:focus, .form-select:focus, .form-multiselect:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: #2563eb;\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);\n border-color: #2563eb;\n}\n.form-input::placeholder,.form-textarea::placeholder {\n color: #6b7280;\n opacity: 1;\n}\n.form-input::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n}\n.form-input::-webkit-date-and-time-value {\n min-height: 1.5em;\n}\n.form-input::-webkit-datetime-edit,.form-input::-webkit-datetime-edit-year-field,.form-input::-webkit-datetime-edit-month-field,.form-input::-webkit-datetime-edit-day-field,.form-input::-webkit-datetime-edit-hour-field,.form-input::-webkit-datetime-edit-minute-field,.form-input::-webkit-datetime-edit-second-field,.form-input::-webkit-datetime-edit-millisecond-field,.form-input::-webkit-datetime-edit-meridiem-field {\n padding-top: 0;\n padding-bottom: 0;\n}\n.static {\n position: static;\n}\n.absolute {\n position: absolute;\n}\n.relative {\n position: relative;\n}\n.right-3 {\n right: 0.75rem;\n}\n.top-\\[50\\%\\] {\n top: 50%;\n}\n.top-0 {\n top: 0px;\n}\n.left-1\\/2 {\n left: 50%;\n}\n.top-5 {\n top: 1.25rem;\n}\n.right-5 {\n right: 1.25rem;\n}\n.bottom-0 {\n bottom: 0px;\n}\n.left-0 {\n left: 0px;\n}\n.z-50 {\n z-index: 50;\n}\n.-m-1 {\n margin: -0.25rem;\n}\n.mb-12 {\n margin-bottom: 3rem;\n}\n.mt-2 {\n margin-top: 0.5rem;\n}\n.ml-6 {\n margin-left: 1.5rem;\n}\n.mb-2 {\n margin-bottom: 0.5rem;\n}\n.block {\n display: block;\n}\n.inline-block {\n display: inline-block;\n}\n.flex {\n display: flex;\n}\n.inline-flex {\n display: inline-flex;\n}\n.table {\n display: table;\n}\n.flow-root {\n display: flow-root;\n}\n.hidden {\n display: none;\n}\n.h-full {\n height: 100%;\n}\n.h-4 {\n height: 1rem;\n}\n.h-\\[38px\\] {\n height: 38px;\n}\n.h-16 {\n height: 4rem;\n}\n.max-h-\\[70vh\\] {\n max-height: 70vh;\n}\n.min-h-\\[8rem\\] {\n min-height: 8rem;\n}\n.w-4 {\n width: 1rem;\n}\n.w-full {\n width: 100%;\n}\n.flex-auto {\n flex: 1 1 auto;\n}\n.flex-grow {\n flex-grow: 1;\n}\n.-translate-y-\\[50\\%\\] {\n --tw-translate-y: -50%;\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.-translate-x-1\\/2 {\n --tw-translate-x: -50%;\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.cursor-pointer {\n cursor: pointer;\n}\n.flex-wrap {\n flex-wrap: wrap;\n}\n.items-center {\n align-items: center;\n}\n.items-stretch {\n align-items: stretch;\n}\n.justify-center {\n justify-content: center;\n}\n.space-x-3 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(0.75rem * var(--tw-space-x-reverse));\n margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));\n}\n.overflow-hidden {\n overflow: hidden;\n}\n.overflow-y-auto {\n overflow-y: auto;\n}\n.rounded-md {\n border-radius: 0.375rem;\n}\n.rounded-\\[1\\.25rem\\] {\n border-radius: 1.25rem;\n}\n.rounded-lg {\n border-radius: 0.5rem;\n}\n.rounded-tr-none {\n border-top-right-radius: 0px;\n}\n.rounded-br-none {\n border-bottom-right-radius: 0px;\n}\n.rounded-tl-none {\n border-top-left-radius: 0px;\n}\n.rounded-bl-none {\n border-bottom-left-radius: 0px;\n}\n.border {\n border-width: 1px;\n}\n.border-t {\n border-top-width: 1px;\n}\n.border-grey-500 {\n --tw-border-opacity: 1;\n border-color: rgb(155 163 192 / var(--tw-border-opacity));\n}\n.border-blue-500 {\n --tw-border-opacity: 1;\n border-color: rgb(53 95 254 / var(--tw-border-opacity));\n}\n.border-\\[\\#a6abbd\\] {\n --tw-border-opacity: 1;\n border-color: rgb(166 171 189 / var(--tw-border-opacity));\n}\n.border-opacity-100 {\n --tw-border-opacity: 1;\n}\n.border-opacity-60 {\n --tw-border-opacity: 0.6;\n}\n.\\!bg-grey-100 {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(230 232 239 / var(--tw-bg-opacity)) !important;\n}\n.bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity));\n}\n.\\!bg-\\[transparent\\] {\n background-color: transparent !important;\n}\n.bg-blue-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(53 95 254 / var(--tw-bg-opacity));\n}\n.bg-grey-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(230 232 239 / var(--tw-bg-opacity));\n}\n.fill-night-sky-800 {\n fill: #001936;\n}\n.fill-white {\n fill: #FFFFFF;\n}\n.fill-blue-500 {\n fill: #355FFE;\n}\n.px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.py-0 {\n padding-top: 0px;\n padding-bottom: 0px;\n}\n.px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.py-5 {\n padding-top: 1.25rem;\n padding-bottom: 1.25rem;\n}\n.px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n}\n.pr-0 {\n padding-right: 0px;\n}\n.pl-3 {\n padding-left: 0.75rem;\n}\n.font-sofia-pro {\n font-family: sofia-pro, sans-serif;\n}\n.text-\\[1\\.125rem\\] {\n font-size: 1.125rem;\n}\n.text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\n.font-medium {\n font-weight: 500;\n}\n.font-semibold {\n font-weight: 600;\n}\n.text-night-sky-800 {\n --tw-text-opacity: 1;\n color: rgb(0 25 54 / var(--tw-text-opacity));\n}\n.text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity));\n}\n.text-blue-500 {\n --tw-text-opacity: 1;\n color: rgb(53 95 254 / var(--tw-text-opacity));\n}\n.shadow-none {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --tw-shadow-colored: 0 1px 2px 0 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.shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px 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.ring-0 {\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(0px + 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.ring-1 {\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.\\!ring-blue-600 {\n --tw-ring-opacity: 1 !important;\n --tw-ring-color: rgb(35 74 224 / var(--tw-ring-opacity)) !important;\n}\n.ring-transparent {\n --tw-ring-color: transparent;\n}\n.ring-offset-2 {\n --tw-ring-offset-width: 2px;\n}\n.transition-colors {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, outline-color, focus-color;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n\n/* Search Results Container Styles */\n.fade-slide-enter {\n --tw-translate-y: -0.75rem;\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 opacity: 0;\n}\n\n.fade-slide-enter-active, \n.fade-slide-enter-done {\n --tw-translate-y: 0px;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\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 opacity: 1;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 300ms;\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n.fade-slide-exit {\n --tw-translate-y: 0px;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\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 opacity: 1;\n}\n\n.fade-slide-exit-active, \n.fade-slide-exit-done {\n --tw-translate-y: -0.75rem;\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 opacity: 0;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 300ms;\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n.hover\\:border-grey-500:hover {\n --tw-border-opacity: 1;\n border-color: rgb(155 163 192 / var(--tw-border-opacity));\n}\n\n.hover\\:border-blue-600:hover {\n --tw-border-opacity: 1;\n border-color: rgb(35 74 224 / var(--tw-border-opacity));\n}\n\n.hover\\:border-opacity-50:hover {\n --tw-border-opacity: 0.5;\n}\n\n.hover\\:bg-grey-100:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(230 232 239 / var(--tw-bg-opacity));\n}\n\n.hover\\:bg-blue-600:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(35 74 224 / var(--tw-bg-opacity));\n}\n\n.hover\\:fill-blue-500:hover {\n fill: #355FFE;\n}\n\n.hover\\:fill-blue-600:hover {\n fill: #234AE0;\n}\n\n.hover\\:text-blue-500:hover {\n --tw-text-opacity: 1;\n color: rgb(53 95 254 / var(--tw-text-opacity));\n}\n\n.hover\\:text-blue-600:hover {\n --tw-text-opacity: 1;\n color: rgb(35 74 224 / var(--tw-text-opacity));\n}\n\n.focus\\:border-blue-400:focus {\n --tw-border-opacity: 1;\n border-color: rgb(72 112 254 / var(--tw-border-opacity));\n}\n\n.focus\\:bg-grey-100:focus {\n --tw-bg-opacity: 1;\n background-color: rgb(230 232 239 / var(--tw-bg-opacity));\n}\n\n.focus\\:outline-none:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n\n.focus\\:ring-0:focus {\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(0px + 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.focus\\:ring-2:focus {\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(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.focus\\:ring-blue-500:focus {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(53 95 254 / var(--tw-ring-opacity));\n}\n\n.focus\\:ring-offset-2:focus {\n --tw-ring-offset-width: 2px;\n}\n\n@media (min-width: 1000px) {\n\n .tablet\\:w-\\[70vw\\] {\n width: 70vw;\n }\n}\n";
404
401
  styleInject(css_248z);
405
402
 
406
403
  exports.SearchAutocomplete = SearchAutocomplete;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cn-npm/search-autocomplete",
3
- "version": "0.2.19",
3
+ "version": "0.2.21",
4
4
  "main": "dist/bundle.js",
5
5
  "peerDependencies": {
6
6
  "@headlessui/react": "^1.7.1",
@@ -70,6 +70,7 @@
70
70
  "@storybook/react": "^6.5.10",
71
71
  "@storybook/testing-library": "^0.0.13",
72
72
  "@svgr/rollup": "^6.3.1",
73
+ "@tailwindcss/forms": "^0.5.2",
73
74
  "@testing-library/jest-dom": "^5.16.5",
74
75
  "@testing-library/react": "^13.3.0",
75
76
  "@testing-library/user-event": "^13.5.0",
@@ -100,7 +101,7 @@
100
101
  "rollup-plugin-postcss": "^4.0.2",
101
102
  "rollup-plugin-svg": "^2.0.0",
102
103
  "sass": "^1.54.3",
103
- "tailwindcss": "^3.4.1",
104
+ "tailwindcss": "^3.1.8",
104
105
  "typescript": "^4.7.4",
105
106
  "web-vitals": "^2.1.4",
106
107
  "webpack": "^5.74.0"
package/src/components/Loader/Loader.module.scss CHANGED
@@ -7,7 +7,7 @@
7
7
  border-right: 3px solid transparent;
8
8
  box-sizing: border-box;
9
9
  animation: rotation 1s linear infinite;
10
- @apply sa-border-t-blue-500;
10
+ @apply border-t-blue-500;
11
11
  }
12
12
 
13
13
  // Rotation animation
package/src/components/SearchAutocomplete/SearchAutocomplete.module.scss CHANGED
@@ -1,3 +1,3 @@
1
1
  .SearchAutocomplete {
2
- @apply sa-relative sa-font-sofia-pro;
2
+ @apply relative font-sofia-pro;
3
3
  }
package/src/components/SearchAutocomplete/SearchAutocomplete.tsx CHANGED
@@ -41,16 +41,16 @@ const SearchAutocomplete: FC<SearchAutocompleteProps> = (props) => {
41
41
  tags.forEach((x, i) => {
42
42
  x.classList.remove(
43
43
  "autocomplete-selected",
44
- "!sa-bg-grey-100",
45
- "!sa-ring-blue-600"
44
+ "!bg-grey-100",
45
+ "!ring-blue-600"
46
46
  );
47
47
  if (i + 1 === selectedTag) {
48
48
  x.classList.add(
49
49
  "autocomplete-selected",
50
50
  tags[i].classList.contains("autocomplete-tag")
51
- ? "!sa-bg-grey-100"
52
- : "sa-none",
53
- "!sa-ring-blue-600"
51
+ ? "!bg-grey-100"
52
+ : "none",
53
+ "!ring-blue-600"
54
54
  );
55
55
  x.scrollIntoView({
56
56
  behavior: "smooth",
@@ -101,9 +101,6 @@ const SearchAutocomplete: FC<SearchAutocompleteProps> = (props) => {
101
101
  axios({
102
102
  signal: controller.signal,
103
103
  url: `https://graph.charitynavigator.org/graphql`,
104
- params: {
105
- user_key: "67a233b3ae2f5690bce775c1760925f2",
106
- },
107
104
  method: "post",
108
105
  data: {
109
106
  query: `
@@ -208,19 +205,19 @@ const SearchAutocomplete: FC<SearchAutocompleteProps> = (props) => {
208
205
  >
209
206
  <form
210
207
  action={`/search?q=${searchTerm}`}
211
- className="sa-flex sa-font-sofia-pro"
208
+ className="flex font-sofia-pro"
212
209
  autoComplete="off"
213
210
  >
214
- <label htmlFor="search" className="sa-hidden">
211
+ <label htmlFor="search" className="hidden">
215
212
  {label}
216
213
  </label>
217
- <div className="sa-relative sa-flex sa-flex-grow">
214
+ <div className="relative flex flex-grow">
218
215
  <DebounceInput
219
216
  type="text"
220
217
  name="q"
221
218
  id="search"
222
219
  placeholder={label}
223
- className="sa-flex-auto sa-pr-0 sa-items-stretch sa-flex-grow sa-text-night-sky-800 sa-ring-0 sa-py-0 sa-shadow-none sa-focus:ring-0 sa-bg-white sa-transition-colors sa-border-opacity-100 sa-hover:bg-grey-100 sa-hover:border-grey-500 sa-hover:border-opacity-50 sa-focus:bg-grey-100 sa-focus:border-blue-400 sa-inline-block sm:sa-text-sm sa-border-grey-500 sa-rounded-md sa-rounded-tr-none sa-rounded-br-none sa-placeholder:text-gray-600"
220
+ className="form-input flex-auto pr-0 items-stretch flex-grow text-night-sky-800 ring-0 py-0 shadow-none focus:ring-0 bg-white transition-colors border-opacity-100 hover:bg-grey-100 hover:border-grey-500 hover:border-opacity-50 focus:bg-grey-100 focus:border-blue-400 inline-block sm:text-sm border-grey-500 rounded-md rounded-tr-none rounded-br-none placeholder:text-gray-600"
224
221
  debounceTimeout={300}
225
222
  minLength={2}
226
223
  value={searchTerm}
@@ -233,43 +230,43 @@ const SearchAutocomplete: FC<SearchAutocompleteProps> = (props) => {
233
230
  {searchTerm !== "" && (
234
231
  <button
235
232
  type="button"
236
- className="sa-absolute sa-right-3 sa-top-[50%] -sa-translate-y-[50%] sa-text-night-sky-800 hover:sa-text-blue-500 sa-transition-colors !sa-bg-[transparent] sa-cursor-pointer"
233
+ className="absolute right-3 top-[50%] -translate-y-[50%] text-night-sky-800 hover:text-blue-500 transition-colors !bg-[transparent] cursor-pointer"
237
234
  onClick={clearSearch}
238
235
  >
239
- <CircleCloseIcon className="sa-fill-night-sky-800 hover:sa-fill-blue-500 sa-h-4 sa-w-4" />
236
+ <CircleCloseIcon className="fill-night-sky-800 hover:fill-blue-500 h-4 w-4" />
240
237
  </button>
241
238
  )}
242
239
  </div>
243
240
  <button
244
241
  type="submit"
245
- className="sa-inline-flex sa-transition-colors sa-items-center sa-justify-center sa-px-4 sa-h-[38px] sa-font-medium sa-rounded-md sa-shadow-sm sa-border sa-border-blue-500 sa-text-white sa-bg-blue-500 hover:sa-bg-blue-600 hover:sa-border-blue-600 focus:sa-outline-none focus:sa-ring-2 focus:sa-ring-offset-2 focus:sa-ring-blue-500 sm:sa-text-sm sa-rounded-tl-none sa-rounded-bl-none"
242
+ className="inline-flex transition-colors items-center justify-center px-4 h-[38px] font-medium rounded-md shadow-sm border border-blue-500 text-white bg-blue-500 hover:bg-blue-600 hover:border-blue-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:text-sm rounded-tl-none rounded-bl-none"
246
243
  >
247
- <SearchIcon className="sa-fill-white sa-h-4 sa-w-4" />
244
+ <SearchIcon className="fill-white h-4 w-4" />
248
245
  </button>
249
246
  </form>
250
- <div className="sa-relative">
247
+ <div className="relative">
251
248
  <CSSTransition
252
249
  mountOnEnter
253
250
  unmountOnExit
254
251
  in={open}
255
252
  timeout={300}
256
- classNames="sa-fade-slide"
253
+ classNames="fade-slide"
257
254
  data-testid="searchResults"
258
255
  >
259
256
  <div
260
257
  className={classNames(
261
- "search-results-container sa-absolute sa-top-0 sa-left-1/2 -sa-translate-x-1/2 sa-mt-2 sa-bg-white sa-py-5 sa-rounded-[1.25rem] sa-z-50 sa-shadow-lg sa-border border-[#a6abbd] sa-border-opacity-60 sa-w-full tablet:sa-w-[70vw] sa-min-h-[8rem] sa-overflow-hidden"
258
+ "search-results-container absolute top-0 left-1/2 -translate-x-1/2 mt-2 bg-white py-5 rounded-[1.25rem] z-50 shadow-lg border border-[#a6abbd] border-opacity-60 w-full tablet:w-[70vw] min-h-[8rem] overflow-hidden"
262
259
  )}
263
260
  >
264
261
  <ErrorBoundary>
265
262
  {loading && (
266
263
  <Loader
267
264
  data-testid="Loader"
268
- className="sa-absolute sa-top-5 sa-right-5"
265
+ className="absolute top-5 right-5"
269
266
  />
270
267
  )}
271
268
  <div
272
- className="sa-px-6 sa-h-full sa-mb-12 sa-max-h-[70vh] sa-overflow-y-auto"
269
+ className="px-6 h-full mb-12 max-h-[70vh] overflow-y-auto"
273
270
  data-testid="Sections"
274
271
  >
275
272
  {hasError && (
@@ -289,13 +286,13 @@ const SearchAutocomplete: FC<SearchAutocompleteProps> = (props) => {
289
286
  ))}
290
287
  </div>
291
288
  </ErrorBoundary>
292
- <div className="sa-border-t sa-border-[#a6abbd] sa-border-opacity-60 sa-flex sa-items-center sa-absolute sa-bottom-0 sa-left-0 sa-w-full sa-bg-white sa-h-16">
289
+ <div className="border-t border-[#a6abbd] border-opacity-60 flex items-center absolute bottom-0 left-0 w-full bg-white h-16">
293
290
  <a
294
291
  href={`/search?q=${searchTerm}`}
295
- className="sa-px-3 sa-py-1 sa-ml-6 sa-flex sa-items-center sa-space-x-3 sa-ring-1 sa-ring-offset-2 sa-ring-transparent sa-transition-colors sa-text-blue-500 hover:sa-text-blue-600 sa-rounded-lg autocomplete-custom-search"
292
+ className="px-3 py-1 ml-6 flex items-center space-x-3 ring-1 ring-offset-2 ring-transparent transition-colors text-blue-500 hover:text-blue-600 rounded-lg autocomplete-custom-search"
296
293
  >
297
- <SearchIcon className="sa-fill-blue-500 hover:sa-fill-blue-600 sa-h-4 sa-w-4" />
298
- <span className="sa-font-semibold sa-text-[1.125rem] ">
294
+ <SearchIcon className="fill-blue-500 hover:fill-blue-600 h-4 w-4" />
295
+ <span className="font-semibold text-[1.125rem] ">
299
296
  {searchTerm === "" ? "Custom Search" : "View All Results"}
300
297
  </span>
301
298
  </a>
package/src/components/SearchAutocompleteSection/SearchAutocompleteSection.module.scss CHANGED
@@ -1,64 +1,64 @@
1
1
  .SearchAutocompleteSection {
2
- @apply sa-font-sofia-pro sa-mb-6;
2
+ @apply font-sofia-pro mb-6;
3
3
  }
4
4
 
5
5
  // Hide results over 5 on mobile
6
6
  :global(.autocomplete-section a:nth-child(6)) {
7
- @apply sa-hidden tablet:sa-inline-block;
7
+ @apply hidden tablet:inline-block;
8
8
  }
9
9
 
10
10
  :global(.autocomplete-section a:nth-child(7)) {
11
- @apply sa-hidden tablet:sa-inline-block;
11
+ @apply hidden tablet:inline-block;
12
12
  }
13
13
 
14
14
  :global(.autocomplete-section a:nth-child(8)) {
15
- @apply sa-hidden tablet:sa-inline-block;
15
+ @apply hidden tablet:inline-block;
16
16
  }
17
17
 
18
18
  :global(.autocomplete-section a:nth-child(9)) {
19
- @apply sa-hidden tablet:sa-inline-block;
19
+ @apply hidden tablet:inline-block;
20
20
  }
21
21
 
22
22
  :global(.autocomplete-section a:nth-child(10)) {
23
- @apply sa-hidden tablet:sa-inline-block;
23
+ @apply hidden tablet:inline-block;
24
24
  }
25
25
 
26
26
  :global(.autocomplete-section a:nth-child(11)) {
27
- @apply sa-hidden tablet:sa-inline-block;
27
+ @apply hidden tablet:inline-block;
28
28
  }
29
29
 
30
30
  :global(.autocomplete-section a:nth-child(12)) {
31
- @apply sa-hidden tablet:sa-inline-block;
31
+ @apply hidden tablet:inline-block;
32
32
  }
33
33
 
34
34
  :global(.autocomplete-section a:nth-child(13)) {
35
- @apply sa-hidden tablet:sa-inline-block;
35
+ @apply hidden tablet:inline-block;
36
36
  }
37
37
 
38
38
  :global(.autocomplete-section a:nth-child(14)) {
39
- @apply sa-hidden tablet:sa-inline-block;
39
+ @apply hidden tablet:inline-block;
40
40
  }
41
41
 
42
42
  :global(.autocomplete-section a:nth-child(15)) {
43
- @apply sa-hidden tablet:sa-inline-block;
43
+ @apply hidden tablet:inline-block;
44
44
  }
45
45
 
46
46
  :global(.autocomplete-section a:nth-child(16)) {
47
- @apply sa-hidden tablet:sa-inline-block;
47
+ @apply hidden tablet:inline-block;
48
48
  }
49
49
 
50
50
  :global(.autocomplete-section a:nth-child(17)) {
51
- @apply sa-hidden tablet:sa-inline-block;
51
+ @apply hidden tablet:inline-block;
52
52
  }
53
53
 
54
54
  :global(.autocomplete-section a:nth-child(18)) {
55
- @apply sa-hidden tablet:sa-inline-block;
55
+ @apply hidden tablet:inline-block;
56
56
  }
57
57
 
58
58
  :global(.autocomplete-section a:nth-child(19)) {
59
- @apply sa-hidden tablet:sa-inline-block;
59
+ @apply hidden tablet:inline-block;
60
60
  }
61
61
 
62
62
  :global(.autocomplete-section a:nth-child(20)) {
63
- @apply sa-hidden tablet:sa-inline-block;
63
+ @apply hidden tablet:inline-block;
64
64
  }
package/src/components/SearchAutocompleteSection/SearchAutocompleteSection.tsx CHANGED
@@ -39,18 +39,18 @@ const SearchAutocompleteSection: FC<SearchAutocompleteSectionProps> = (
39
39
  data-testid="searchAutocompleteSection"
40
40
  >
41
41
  <h2
42
- className="sa-text-night-sky-800 sa-mb-2 sa-text-base"
42
+ className="text-night-sky-800 mb-2 text-base"
43
43
  data-testid="searchResultTitle"
44
44
  >
45
45
  {props.title}
46
46
  </h2>
47
- <div className="sa-flow-root">
47
+ <div className="flow-root">
48
48
  <div
49
- className="sa-m-1 sa-flex sa-flex-wrap autocomplete-section"
49
+ className="-m-1 flex flex-wrap autocomplete-section"
50
50
  data-testid="searchTag"
51
51
  >
52
52
  {(props.results == null || props.results.length === 0) && (
53
- <p className="sa-pl-3">No results found</p>
53
+ <p className="pl-3">No results found</p>
54
54
  )}
55
55
  {props.results &&
56
56
  props.results!.length > 0 &&
package/src/components/SearchAutocompleteTag/SearchAutocompleteTag.module.scss CHANGED
@@ -1,6 +1,6 @@
1
1
  .SearchAutocompleteTag {
2
- @apply sa-inline-block sa-font-sofia-pro sa-font-normal sa-text-base sa-leading-6 sa-tracking-normal sa-text-left sa-transition-colors sa-text-night-sky-800 sa-bg-grey-50 hover:sa-bg-grey-100 sa-rounded-lg sa-pt-2 sa-pb-2 sa-pl-3 sa-pr-3 sa-m-1 sa-ring-1 sa-ring-offset-2 sa-ring-transparent;
2
+ @apply inline-block font-sofia-pro font-normal text-base leading-6 tracking-normal text-left transition-colors text-night-sky-800 bg-grey-50 hover:bg-grey-100 rounded-lg pt-2 pb-2 pl-3 pr-3 m-1 ring ring-1 ring-offset-2 ring-transparent;
3
3
  }
4
4
  :global(.highlighted-text) {
5
- @apply sa-font-semibold;
5
+ @apply font-semibold;
6
6
  }
package/src/index.css CHANGED
@@ -302,19 +302,19 @@
302
302
 
303
303
  /* Search Results Container Styles */
304
304
  .fade-slide-enter {
305
- @apply sa-opacity-0 -sa-translate-y-3 sa-scale-95;
305
+ @apply opacity-0 -translate-y-3 scale-95;
306
306
  }
307
307
 
308
308
  .fade-slide-enter-active,
309
309
  .fade-slide-enter-done {
310
- @apply sa-opacity-100 sa-transition-all sa-duration-300 sa-ease-out sa-translate-y-0 sa-scale-100;
310
+ @apply opacity-100 transition-all duration-300 ease-out translate-y-0 scale-100;
311
311
  }
312
312
 
313
313
  .fade-slide-exit {
314
- @apply sa-opacity-100 sa-translate-y-0 sa-scale-100;
314
+ @apply opacity-100 translate-y-0 scale-100;
315
315
  }
316
316
 
317
317
  .fade-slide-exit-active,
318
318
  .fade-slide-exit-done {
319
- @apply sa-opacity-0 sa-transition-all sa-duration-300 sa-ease-out -sa-translate-y-3 sa-scale-95;
319
+ @apply opacity-0 transition-all duration-300 ease-out -translate-y-3 scale-95;
320
320
  }
package/tailwind.config.js CHANGED
@@ -2,7 +2,6 @@ const colors = require("tailwindcss/colors");
2
2
 
3
3
  /** @type {import('tailwindcss').Config} */
4
4
  module.exports = {
5
- prefix: "sa-",
6
5
  content: ["./src/**/*.{js,jsx,ts,tsx}"],
7
6
  theme: {
8
7
  screens: {
@@ -90,5 +89,9 @@ module.exports = {
90
89
  },
91
90
  },
92
91
  },
93
- plugins: [],
92
+ plugins: [
93
+ require("@tailwindcss/forms")({
94
+ strategy: "class", // only generate classes
95
+ }),
96
+ ],
94
97
  };
package/npmkey DELETED
@@ -1,3 +0,0 @@
1
- Need to give this to Gorilla Group so they can update their
2
- process to download from the private repo
3
- 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