@newskit-render/standalone-components 2.1.6-alpha.0 → 2.2.0-alpha.0

package/README.md

@@ -320,6 +320,22 @@ export const baseContext: BaseContextOptions = {
   },
   searchBar: {
     spaceStack: { xs: 'space060', sm: 'space080' },
+    color: 'inkBase',
+    placeholder: {
+      color: 'inkSubtle',
+      typographyPreset: 'utilityBody030',
+    },
+    icon: {
+      color: 'inkBrand010',
+      position: 'right' as const,
+    },
+    autocomplete: {
+      color: 'interactivePrimary030',
+    },
+    border: {
+      style: '1px solid',
+      color: 'interactiveInput020',
+    },
   },
   contentListView: {
     introduction: {
@@ -429,6 +445,18 @@ export const baseContext: BaseContextOptions = {
 5. searchBar: Property used to style the search bar container
 
    - spaceStack: MQ
+   - color: string - Search bar input text color
+   - placeholder
+     - color: string - Placeholder text color
+     - typographyPreset: string
+   - icon
+     - color: string - Search icon color
+     - position: string - Position of the icon relative to the search input text.
+   - autocomplete
+     - color: string - Autocomplete results text color
+   - border
+     - style: string - Style of the search bar border.
+     - color: string - Border color.
 
 6. contentListView: Property used to style the results table
 

package/dist/cjs/help-hub/components/SearchBar/SearchBar.js

@@ -14,9 +14,10 @@ var Autocomplete_1 = require("./components/Autocomplete");
 var AlgoliaTheme_1 = require("./components/AlgoliaTheme");
 var StyledBlock = (0, newskit_1.styled)(newskit_1.Block)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin: 0 auto;\n  max-width: 560px;\n  width: 100%;\n  & .aa-Panel {\n    z-index: 2;\n    width: 100%;\n    max-width: 560px;\n  }\n  & .aa-Form {\n    z-index: 2;\n  }\n"], ["\n  margin: 0 auto;\n  max-width: 560px;\n  width: 100%;\n  & .aa-Panel {\n    z-index: 2;\n    width: 100%;\n    max-width: 560px;\n  }\n  & .aa-Form {\n    z-index: 2;\n  }\n"])));
 var SearchBar = function (_a) {
-    var _b = _a.placeholder, placeholder = _b === void 0 ? 'Search' : _b, _c = _a.baseUrl, baseUrl = _c === void 0 ? '' : _c;
+    var _b = _a.placeholder, placeholder = _b === void 0 ? 'Search' : _b, _c = _a.baseUrl, baseUrl = _c === void 0 ? '' : _c, overrides = _a.overrides;
+    var theme = (0, newskit_1.useTheme)();
     return (react_1.default.createElement(StyledBlock, null,
-        react_1.default.createElement(newskit_1.Global, { styles: AlgoliaTheme_1.AlgoliaStyling }),
+        react_1.default.createElement(newskit_1.Global, { styles: (0, AlgoliaTheme_1.getAlgoliaStyling)(overrides, theme) }),
         react_1.default.createElement(Autocomplete_1.Autocomplete, { placeholder: placeholder, openOnFocus: true, debug: false, baseUrl: baseUrl })));
 };
 exports.SearchBar = SearchBar;

package/dist/cjs/help-hub/components/SearchBar/SearchBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchBar.js","sourceRoot":"","sources":["../../../../../src/help-hub/components/SearchBar/SearchBar.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,gDAAyB;AACzB,mCAA+C;AAC/C,0DAAwD;AACxD,0DAA0D;AAG1D,IAAM,WAAW,GAAG,IAAA,gBAAM,EAAC,eAAK,CAAC,qPAAA,kLAYhC,IAAA,CAAA;AAEM,IAAM,SAAS,GAA6B,UAAC,EAGnD;QAFC,mBAAsB,EAAtB,WAAW,mBAAG,QAAQ,KAAA,EACtB,eAAY,EAAZ,OAAO,mBAAG,EAAE,KAAA;IAEZ,OAAO,CACL,8BAAC,WAAW;QACV,8BAAC,gBAAM,IAAC,MAAM,EAAE,6BAAc,GAAI;QAClC,8BAAC,2BAAY,IACX,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,IAAI,EACjB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,GAChB,CACU,CACf,CAAA;AACH,CAAC,CAAA;AAfY,QAAA,SAAS,aAerB;AAED,kBAAe,iBAAS,CAAA"}
+{"version":3,"file":"SearchBar.js","sourceRoot":"","sources":["../../../../../src/help-hub/components/SearchBar/SearchBar.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,gDAAyB;AACzB,mCAAyD;AACzD,0DAAwD;AACxD,0DAA6D;AAG7D,IAAM,WAAW,GAAG,IAAA,gBAAM,EAAC,eAAK,CAAC,qPAAA,kLAYhC,IAAA,CAAA;AAEM,IAAM,SAAS,GAA6B,UAAC,EAInD;QAHC,mBAAsB,EAAtB,WAAW,mBAAG,QAAQ,KAAA,EACtB,eAAY,EAAZ,OAAO,mBAAG,EAAE,KAAA,EACZ,SAAS,eAAA;IAET,IAAM,KAAK,GAAG,IAAA,kBAAQ,GAAE,CAAA;IAExB,OAAO,CACL,8BAAC,WAAW;QACV,8BAAC,gBAAM,IAAC,MAAM,EAAE,IAAA,gCAAiB,EAAC,SAAS,EAAE,KAAK,CAAC,GAAI;QACvD,8BAAC,2BAAY,IACX,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,IAAI,EACjB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,GAChB,CACU,CACf,CAAA;AACH,CAAC,CAAA;AAlBY,QAAA,SAAS,aAkBrB;AAED,kBAAe,iBAAS,CAAA"}

package/dist/cjs/help-hub/components/SearchBar/components/AlgoliaTheme.d.ts

@@ -1 +1,3 @@
-export declare const AlgoliaStyling: import("newskit").SerializedStyles;
+import { Theme } from 'newskit';
+import { SearchBarOverrides } from '../types';
+export declare const getAlgoliaStyling: (overrides: SearchBarOverrides, theme: Theme) => import("newskit").SerializedStyles;

package/dist/cjs/help-hub/components/SearchBar/components/AlgoliaTheme.js

@@ -4,8 +4,13 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
     return cooked;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.AlgoliaStyling = void 0;
+exports.getAlgoliaStyling = void 0;
 var newskit_1 = require("newskit");
-exports.AlgoliaStyling = (0, newskit_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  /*! @algolia/autocomplete-theme-classic 1.6.3 | MIT License | \u00A9 Algolia, Inc. and contributors | https://github.com/algolia/autocomplete */\n  /* ---------------- */\n  /* 1.  CSS Variables */\n  /* 2.  Dark Mode */\n  /* 3.  Autocomplete */\n  /* 4.  Panel */\n  /* 5.  Sources */\n  /* 6.  Hit Layout */\n  /* 7.  Panel Header */\n  /* 8.  Panel Footer */\n  /* 9.  Detached Mode */\n  /* 10. Gradients */\n  /* 11. Utilities */\n  /* ---------------- */\n  /* Note: */\n  /* This theme reflects the markup structure of autocomplete with SCSS indentation. */\n  /* We use the SASS  function to keep specificity low. */\n  /* ---------------- */\n  /* 1. CSS Variables */\n  /* ---------------- */\n  :root {\n    /* Newskit */\n    --aa-newskit-input-border-color: 204, 204, 204;\n    --aa-newskit-placeholder-color: 106, 106, 106;\n    /* Input */\n    --aa-search-input-height: 44px;\n    --aa-input-icon-size: 20px;\n    /* Size and spacing */\n    --aa-base-unit: 16;\n    --aa-spacing-factor: 1;\n    --aa-spacing: calc(var(--aa-base-unit) * var(--aa-spacing-factor) * 1px);\n    --aa-spacing-half: calc(var(--aa-spacing) / 2);\n    --aa-panel-max-height: 650px;\n    /* Z-index */\n    --aa-base-z-index: 9999;\n    /* Font */\n    --aa-font-size: calc(var(--aa-base-unit) * 1px);\n    --aa-font-family: inherit;\n    --aa-font-weight-medium: 500;\n    --aa-font-weight-semibold: 600;\n    --aa-font-weight-bold: 700;\n    /* Icons */\n    --aa-icon-size: 20px;\n    --aa-icon-stroke-width: 1.6;\n    --aa-icon-color-rgb: 119, 119, 163;\n    --aa-icon-color-alpha: 1;\n    --aa-action-icon-size: 20px;\n    /* Text colors */\n    --aa-text-color-rgb: 38, 38, 39;\n    --aa-text-color-alpha: 1;\n    --aa-primary-color-rgb: 62, 52, 211;\n    --aa-primary-color-alpha: 0.2;\n    --aa-muted-color-rgb: 128, 126, 163;\n    --aa-muted-color-alpha: 0.6;\n    /* Border colors */\n    --aa-panel-border-color-rgb: 128, 126, 163;\n    --aa-panel-border-color-alpha: 0.3;\n    --aa-input-border-color-rgb: 145, 145, 145;\n    --aa-input-border-color-alpha: 0.8;\n    /* Background colors */\n    --aa-background-color-rgb: 255, 255, 255;\n    --aa-background-color-alpha: 1;\n    --aa-input-background-color-rgb: 255, 255, 255;\n    --aa-input-background-color-alpha: 1;\n    --aa-selected-color-rgb: 179, 173, 214;\n    --aa-selected-color-alpha: 0.205;\n    --aa-description-highlight-background-color-rgb: 245, 223, 77;\n    --aa-description-highlight-background-color-alpha: 0.5;\n    /* Detached mode */\n    --aa-detached-media-query: (max-width: 680px);\n    --aa-detached-modal-media-query: (min-width: 680px);\n    --aa-detached-modal-max-width: 680px;\n    --aa-detached-modal-max-height: 500px;\n    --aa-overlay-color-rgb: 115, 114, 129;\n    --aa-overlay-color-alpha: 0.4;\n    /* Shadows */\n    --aa-panel-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n      0 6px 16px -4px rgba(35, 38, 59, 0.15);\n    /* Scrollbar */\n    --aa-scrollbar-width: 13px;\n    --aa-scrollbar-track-background-color-rgb: 234, 234, 234;\n    --aa-scrollbar-track-background-color-alpha: 1;\n    --aa-scrollbar-thumb-background-color-rgb: var(--aa-background-color-rgb);\n    --aa-scrollbar-thumb-background-color-alpha: 1;\n    /* Touch screens */\n  }\n  @media (hover: none) and (pointer: coarse) {\n    :root {\n      --aa-spacing-factor: 1.2;\n      --aa-action-icon-size: 22px;\n    }\n  }\n  /* ---------------- */\n  /* 2. Dark Mode */\n  /* ---------------- */\n  body {\n    /* stylelint-disable selector-no-qualifying-type, selector-class-pattern */\n    /* stylelint-enable selector-no-qualifying-type, selector-class-pattern */\n  }\n  body[data-theme='dark'],\n  body.dark {\n    /* Text colors */\n    --aa-text-color-rgb: 183, 192, 199;\n    --aa-primary-color-rgb: 146, 138, 255;\n    --aa-muted-color-rgb: 146, 138, 255;\n    /* Background colors */\n    --aa-input-background-color-rgb: 0, 3, 9;\n    --aa-background-color-rgb: 21, 24, 42;\n    --aa-selected-color-rgb: 146, 138, 255;\n    --aa-selected-color-alpha: 0.25;\n    --aa-description-highlight-background-color-rgb: 0 255 255;\n    --aa-description-highlight-background-color-alpha: 0.25;\n    /* Icons */\n    --aa-icon-color-rgb: 119, 119, 163;\n    /* Shadows */\n    --aa-panel-shadow: inset 1px 1px 0 0 rgb(44, 46, 64),\n      0 3px 8px 0 rgb(0, 3, 9);\n    /* Scrollbar */\n    --aa-scrollbar-track-background-color-rgb: 44, 46, 64;\n    --aa-scrollbar-thumb-background-color-rgb: var(--aa-background-color-rgb);\n  }\n  /* Reset for  */\n  .aa-Panel *,\n  .aa-Autocomplete *,\n  .aa-DetachedFormContainer * {\n    box-sizing: border-box;\n  }\n  /* Init for  */\n  .aa-Panel,\n  .aa-Autocomplete,\n  .aa-DetachedFormContainer {\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    font-size: 16px;\n    font-size: var(--aa-font-size);\n    font-weight: normal;\n    line-height: 1em;\n    margin: 0;\n    padding: 0;\n    text-align: left;\n  }\n  /* ---------------- */\n  /* 3. Autocomplete */\n  /* ---------------- */\n  .aa-Autocomplete,\n  .aa-DetachedFormContainer {\n    /* Search box */\n  }\n  .aa-Form {\n    align-items: center;\n    background-color: white;\n    background-color: rgba(\n      var(--aa-input-background-color-rgb),\n      var(--aa-input-background-color-alpha)\n    );\n    border: 1px solid rgba(145, 145, 145, 1);\n    border: 1px solid rgba(var(--aa-newskit-input-border-color), 1);\n    border-radius: 8px;\n    display: flex;\n    line-height: 1em;\n    margin: 0;\n    position: relative;\n    width: 100%;\n  }\n  .aa-Form[focus-within] {\n    border-color: #cccccc;\n    border-color: rgba(var(--aa-newskit-input-border-color), 1);\n  }\n  .aa-Form:focus-within {\n    border-color: #cccccc;\n    border-color: rgba(var(--aa-newskit-input-border-color), 1);\n  }\n  .aa-InputWrapperPrefix {\n    align-items: center;\n    display: flex;\n    flex-shrink: 0;\n    height: 44px;\n    height: var(--aa-search-input-height);\n    order: 3;\n    /* Container for search and loading icons */\n  }\n  .aa-Label,\n  .aa-LoadingIndicator {\n    cursor: auto;\n    cursor: initial;\n    flex-shrink: 0;\n    height: 100%;\n    padding: 0;\n    text-align: left;\n  }\n  .aa-Label svg,\n  .aa-LoadingIndicator svg {\n    color: #3358cc;\n    fill: #3358cc;\n    position: relative;\n    top: 1px;\n    height: auto;\n    max-height: 20px;\n    max-height: var(--aa-input-icon-size);\n    stroke-width: 1.6;\n    stroke-width: var(--aa-icon-stroke-width);\n    width: 20px;\n    width: var(--aa-input-icon-size);\n  }\n  .aa-SubmitButton,\n  .aa-LoadingIndicator {\n    height: 100%;\n    padding-left: 11px;\n    padding-left: calc(var(--aa-spacing) * 0.75 - 1px);\n    padding-right: 8px;\n    padding-right: var(--aa-spacing-half);\n    width: 47px;\n    width: calc(var(--aa-spacing) * 1.75 + var(--aa-icon-size) - 1px);\n  }\n  @media (hover: none) and (pointer: coarse) {\n    .aa-SubmitButton,\n    .aa-LoadingIndicator {\n      padding-left: 3px;\n      padding-left: calc(var(--aa-spacing-half) / 2 - 1px);\n      width: 39px;\n      width: calc(var(--aa-icon-size) + var(--aa-spacing) * 1.25 - 1px);\n    }\n  }\n  .aa-SubmitButton {\n    -webkit-appearance: none;\n    -moz-appearance: none;\n    appearance: none;\n    background: none;\n    border: 0;\n    margin: 0;\n  }\n  .aa-SubmitButton svg {\n    cursor: pointer;\n  }\n  .aa-SubmitButton:disabled svg {\n    cursor: not-allowed;\n  }\n\n  .aa-LoadingIndicator {\n    align-items: center;\n    display: flex;\n    justify-content: center;\n  }\n  .aa-LoadingIndicator[hidden] {\n    display: none;\n  }\n  .aa-InputWrapper {\n    order: 1;\n    position: relative;\n    width: 100%;\n    /* Search box input (with placeholder and query) */\n  }\n  .aa-Input {\n    -webkit-appearance: none;\n    -moz-appearance: none;\n    appearance: none;\n    background: none;\n    border: 0;\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    font: inherit;\n    height: 44px;\n    height: var(--aa-search-input-height);\n    padding: 0;\n    width: 100%;\n    /* Focus is set and styled on the parent, it isn't necessary here */\n    /* Remove native appearence */\n    padding-left: calc(var(--aa-spacing) * 0.75 - 1px);\n  }\n  .aa-Input::-moz-placeholder {\n    color: rgba(106, 106, 106, 1);\n    color: rgba(\n      var(--aa-newskit-placeholder-color),\n      var(--aa-text-color-alpha)\n    );\n    opacity: 1;\n  }\n  .aa-Input:-ms-input-placeholder {\n    color: rgba(106, 106, 106, 1);\n    color: rgba(\n      var(--aa-newskit-placeholder-color),\n      var(--aa-text-color-alpha)\n    );\n    opacity: 1;\n  }\n  .aa-Input::placeholder {\n    color: rgba(106, 106, 106, 1);\n    color: rgba(\n      var(--aa-newskit-placeholder-color),\n      var(--aa-text-color-alpha)\n    );\n    opacity: 1;\n  }\n  .aa-Input:focus {\n    border-color: none;\n    box-shadow: none;\n    outline: none;\n  }\n  .aa-Input::-webkit-search-decoration,\n  .aa-Input::-webkit-search-cancel-button,\n  .aa-Input::-webkit-search-results-button,\n  .aa-Input::-webkit-search-results-decoration {\n    -webkit-appearance: none;\n    appearance: none;\n  }\n  .aa-InputWrapperSuffix {\n    align-items: center;\n    display: flex;\n    height: 44px;\n    height: var(--aa-search-input-height);\n    order: 2;\n    /* Accelerator to clear the query */\n  }\n  .aa-ClearButton {\n    align-items: center;\n    background: none;\n    border: 0;\n    color: rgba(128, 126, 163, 0.6);\n    color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n    cursor: pointer;\n    display: flex;\n    height: 100%;\n    margin: 0;\n    padding: 0;\n  }\n  .aa-ClearButton:hover,\n  .aa-ClearButton:focus {\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n  }\n  .aa-ClearButton[hidden] {\n    display: none;\n  }\n  .aa-ClearButton svg {\n    stroke-width: 1.6;\n    stroke-width: var(--aa-icon-stroke-width);\n    width: 20px;\n    width: var(--aa-icon-size);\n  }\n  /* ---------------- */\n  /* 4. Panel */\n  /* ---------------- */\n  .aa-Panel {\n    background-color: white;\n    background-color: rgba(\n      var(--aa-background-color-rgb),\n      var(--aa-background-color-alpha)\n    );\n    border-radius: 4px;\n    border-radius: calc(var(--aa-spacing) / 4);\n    box-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n      0 6px 16px -4px rgba(35, 38, 59, 0.15);\n    box-shadow: var(--aa-panel-shadow);\n    margin: 8px 0 0;\n    overflow: hidden;\n    position: absolute;\n    transition: opacity 200ms ease-in, filter 200ms ease-in;\n    /* When a request isn't resolved yet */\n  }\n  @media screen and (prefers-reduced-motion) {\n    .aa-Panel {\n      transition: none;\n    }\n  }\n  .aa-Panel button {\n    -webkit-appearance: none;\n    -moz-appearance: none;\n    appearance: none;\n    background: none;\n    border: 0;\n    margin: 0;\n    padding: 0;\n  }\n  .aa-PanelLayout {\n    height: 100%;\n    margin: 0;\n    max-height: 650px;\n    max-height: var(--aa-panel-max-height);\n    overflow-y: auto;\n    padding: 0;\n    position: relative;\n    text-align: left;\n  }\n  .aa-PanelLayoutColumns--twoGolden {\n    display: grid;\n    grid-template-columns: 39.2% auto;\n    overflow: hidden;\n    padding: 0;\n  }\n  .aa-PanelLayoutColumns--two {\n    display: grid;\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n    overflow: hidden;\n    padding: 0;\n  }\n  .aa-PanelLayoutColumns--three {\n    display: grid;\n    grid-template-columns: repeat(3, minmax(0, 1fr));\n    overflow: hidden;\n    padding: 0;\n  }\n  .aa-Panel--stalled .aa-Source {\n    filter: grayscale(1);\n    opacity: 0.8;\n  }\n  .aa-Panel--scrollable {\n    margin: 0;\n    max-height: 650px;\n    max-height: var(--aa-panel-max-height);\n    overflow-x: hidden;\n    overflow-y: auto;\n    padding: 8px;\n    padding: var(--aa-spacing-half);\n    scrollbar-color: white #eaeaea;\n    scrollbar-color: rgba(\n        var(--aa-scrollbar-thumb-background-color-rgb),\n        var(--aa-scrollbar-thumb-background-color-alpha)\n      )\n      rgba(\n        var(--aa-scrollbar-track-background-color-rgb),\n        var(--aa-scrollbar-track-background-color-alpha)\n      );\n    scrollbar-width: thin;\n  }\n  .aa-Panel--scrollable::-webkit-scrollbar {\n    width: 13px;\n    width: var(--aa-scrollbar-width);\n  }\n  .aa-Panel--scrollable::-webkit-scrollbar-track {\n    background-color: #eaeaea;\n    background-color: rgba(\n      var(--aa-scrollbar-track-background-color-rgb),\n      var(--aa-scrollbar-track-background-color-alpha)\n    );\n  }\n  .aa-Panel--scrollable::-webkit-scrollbar-thumb {\n    background-color: white;\n    background-color: rgba(\n      var(--aa-scrollbar-thumb-background-color-rgb),\n      var(--aa-scrollbar-thumb-background-color-alpha)\n    );\n    border-color: #eaeaea;\n    border-color: rgba(\n      var(--aa-scrollbar-track-background-color-rgb),\n      var(--aa-scrollbar-track-background-color-alpha)\n    );\n    border-radius: 9999px;\n    border-style: solid;\n    border-width: 3px 2px 3px 3px;\n  }\n  /* ---------------- */\n  /* 5. Sources */\n  /* Each source can be styled independently */\n  /* ---------------- */\n  .aa-Source {\n    margin: 0;\n    padding: 0;\n    position: relative;\n    width: 100%;\n    /* List of results inside the source */\n    /* Source title */\n    /* See all button */\n  }\n  .aa-Source:empty {\n    /* Hide empty section */\n    display: none;\n  }\n  .aa-SourceNoResults {\n    font-size: 1em;\n    margin: 0;\n    padding: 16px;\n    padding: var(--aa-spacing);\n  }\n  .aa-List {\n    list-style: none;\n    margin: 0;\n    padding: 0;\n    position: relative;\n  }\n  .aa-SourceHeader {\n    margin: 8px 0.5em 8px 0;\n    margin: var(--aa-spacing-half) 0.5em var(--aa-spacing-half) 0;\n    padding: 0;\n    position: relative;\n    /* Hide empty header */\n    /* Title typography */\n    /* Line separator */\n  }\n  .aa-SourceHeader:empty {\n    display: none;\n  }\n  .aa-SourceHeaderTitle {\n    background: white;\n    background: rgba(\n      var(--aa-background-color-rgb),\n      var(--aa-background-color-alpha)\n    );\n    color: #3e34d3;\n    color: rgba(var(--aa-primary-color-rgb), 1);\n    display: inline-block;\n    font-size: 0.8em;\n    font-weight: 600;\n    font-weight: var(--aa-font-weight-semibold);\n    margin: 0;\n    padding: 0 8px 0 0;\n    padding: 0 var(--aa-spacing-half) 0 0;\n    position: relative;\n    z-index: 9999;\n    z-index: var(--aa-base-z-index);\n  }\n  .aa-SourceHeaderLine {\n    border-bottom: solid 1px #3e34d3;\n    border-bottom: solid 1px rgba(var(--aa-primary-color-rgb), 1);\n    display: block;\n    height: 2px;\n    left: 0;\n    margin: 0;\n    opacity: 0.3;\n    padding: 0;\n    position: absolute;\n    right: 0;\n    top: 8px;\n    top: var(--aa-spacing-half);\n    z-index: 9998;\n    z-index: calc(var(--aa-base-z-index) - 1);\n  }\n  .aa-SourceFooterSeeAll {\n    background: linear-gradient(180deg, white, rgba(128, 126, 163, 0.14));\n    background: linear-gradient(\n      180deg,\n      rgba(var(--aa-background-color-rgb), var(--aa-background-color-alpha)),\n      rgba(128, 126, 163, 0.14)\n    );\n    border: 1px solid rgba(128, 126, 163, 0.6);\n    border: 1px solid\n      rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n    border-radius: 5px;\n    box-shadow: inset 0 0 2px #fff, 0 2px 2px -1px rgba(76, 69, 88, 0.15);\n    color: inherit;\n    font-size: 0.95em;\n    font-weight: 500;\n    font-weight: var(--aa-font-weight-medium);\n    padding: 0.475em 1em 0.6em;\n    text-decoration: none;\n  }\n  .aa-SourceFooterSeeAll:focus,\n  .aa-SourceFooterSeeAll:hover {\n    border: 1px solid #3e34d3;\n    border: 1px solid #cccccc;\n    color: #3e34d3;\n    color: rgba(var(--aa-primary-color-rgb), 1);\n  }\n  /* ---------------- */\n  /* 6. Hit Layout */\n  /* ---------------- */\n  .aa-Item {\n    align-items: center;\n    border-radius: 3px;\n    cursor: pointer;\n    display: grid;\n    min-height: 40px;\n    min-height: calc(var(--aa-spacing) * 2.5);\n    padding: 4px;\n    padding: calc(var(--aa-spacing-half) / 2);\n    /* When the result is active */\n    /* The result type icon inlined SVG or image */\n    /* wrap hit with url but we don't need to see it */\n    /* Secondary click actions */\n  }\n  .aa-Item[aria-selected='true'] {\n    background-color: rgba(179, 173, 214, 0.205);\n    background-color: rgba(\n      var(--aa-selected-color-rgb),\n      var(--aa-selected-color-alpha)\n    );\n  }\n  .aa-Item[aria-selected='true'] .aa-ItemActionButton,\n  .aa-Item[aria-selected='true'] .aa-ActiveOnly {\n    visibility: visible;\n  }\n  .aa-ItemIcon {\n    align-items: center;\n    background: white;\n    background: rgba(\n      var(--aa-background-color-rgb),\n      var(--aa-background-color-alpha)\n    );\n    border-radius: 3px;\n    box-shadow: inset 0 0 0 1px rgba(128, 126, 163, 0.3);\n    box-shadow: inset 0 0 0 1px\n      rgba(var(--aa-panel-border-color-rgb), var(--aa-panel-border-color-alpha));\n    color: #7777a3;\n    color: rgba(var(--aa-icon-color-rgb), var(--aa-icon-color-alpha));\n    display: flex;\n    flex-shrink: 0;\n    font-size: 0.7em;\n    height: 28px;\n    height: calc(var(--aa-icon-size) + var(--aa-spacing-half));\n    justify-content: center;\n    overflow: hidden;\n    stroke-width: 1.6;\n    stroke-width: var(--aa-icon-stroke-width);\n    text-align: center;\n    width: 28px;\n    width: calc(var(--aa-icon-size) + var(--aa-spacing-half));\n  }\n  .aa-ItemIcon img {\n    height: auto;\n    max-height: 20px;\n    max-height: calc(var(--aa-icon-size) + var(--aa-spacing-half) - 8px);\n    max-width: 20px;\n    max-width: calc(var(--aa-icon-size) + var(--aa-spacing-half) - 8px);\n    width: auto;\n  }\n  .aa-ItemIcon svg {\n    height: 20px;\n    height: var(--aa-icon-size);\n    width: 20px;\n    width: var(--aa-icon-size);\n  }\n  .aa-ItemIcon--alignTop {\n    align-self: flex-start;\n  }\n  .aa-ItemIcon--noBorder {\n    background: none;\n    box-shadow: none;\n  }\n  .aa-ItemIcon--picture {\n    height: 96px;\n    width: 96px;\n  }\n  .aa-ItemIcon--picture img {\n    max-height: 100%;\n    max-width: 100%;\n    padding: 8px;\n    padding: var(--aa-spacing-half);\n  }\n  .aa-ItemContent {\n    align-items: center;\n    cursor: pointer;\n    display: grid;\n    grid-gap: 8px;\n    gap: 8px;\n    grid-gap: var(--aa-spacing-half);\n    gap: var(--aa-spacing-half);\n    grid-auto-flow: column;\n    line-height: 1.25em;\n    overflow: hidden;\n  }\n  .aa-ItemContent:empty {\n    display: none;\n  }\n  .aa-ItemContent mark {\n    background: none;\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    font-style: normal;\n    font-weight: 700;\n    font-weight: var(--aa-font-weight-bold);\n  }\n  .aa-ItemContent--dual {\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    text-align: left;\n  }\n  .aa-ItemContent--dual .aa-ItemContentTitle,\n  .aa-ItemContent--dual .aa-ItemContentSubtitle {\n    display: block;\n  }\n  .aa-ItemContent--indented {\n    padding-left: 36px;\n    padding-left: calc(var(--aa-icon-size) + var(--aa-spacing));\n  }\n  .aa-ItemContentBody {\n    display: grid;\n    grid-gap: 4px;\n    gap: 4px;\n    grid-gap: calc(var(--aa-spacing-half) / 2);\n    gap: calc(var(--aa-spacing-half) / 2);\n  }\n  .aa-ItemContentTitle {\n    display: inline-block;\n    margin: 0 0.5em 0 0;\n    max-width: 100%;\n    overflow: hidden;\n    padding: 0;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n  .aa-ItemContentSubtitle {\n    font-size: 0.92em;\n  }\n  .aa-ItemContentSubtitleIcon::before {\n    border-color: rgba(128, 126, 163, 0.64);\n    border-color: rgba(var(--aa-muted-color-rgb), 0.64);\n    border-style: solid;\n    content: '';\n    display: inline-block;\n    left: 1px;\n    position: relative;\n    top: -3px;\n  }\n  .aa-ItemContentSubtitle--inline .aa-ItemContentSubtitleIcon::before {\n    border-width: 0 0 1.5px;\n    margin-left: 8px;\n    margin-left: var(--aa-spacing-half);\n    margin-right: 4px;\n    margin-right: calc(var(--aa-spacing-half) / 2);\n    width: 10px;\n    width: calc(var(--aa-spacing-half) + 2px);\n  }\n  .aa-ItemContentSubtitle--standalone {\n    align-items: center;\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    display: grid;\n    grid-gap: 8px;\n    gap: 8px;\n    grid-gap: var(--aa-spacing-half);\n    gap: var(--aa-spacing-half);\n    grid-auto-flow: column;\n    justify-content: start;\n  }\n  .aa-ItemContentSubtitle--standalone .aa-ItemContentSubtitleIcon::before {\n    border-radius: 0 0 0 3px;\n    border-width: 0 0 1.5px 1.5px;\n    height: 8px;\n    height: var(--aa-spacing-half);\n    width: 8px;\n    width: var(--aa-spacing-half);\n  }\n  .aa-ItemContentSubtitleCategory {\n    color: #807ea3;\n    color: rgba(var(--aa-muted-color-rgb), 1);\n    font-weight: 500;\n  }\n  .aa-ItemContentDescription {\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    font-size: 0.85em;\n    max-width: 100%;\n    overflow-x: hidden;\n    text-overflow: ellipsis;\n  }\n  .aa-ItemContentDescription:empty {\n    display: none;\n  }\n  .aa-ItemContentDescription mark {\n    background: rgba(245, 223, 77, 0.5);\n    background: rgba(\n      var(--aa-description-highlight-background-color-rgb),\n      var(--aa-description-highlight-background-color-alpha)\n    );\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    font-style: normal;\n    font-weight: 500;\n    font-weight: var(--aa-font-weight-medium);\n  }\n  .aa-ItemContentDash {\n    color: rgba(128, 126, 163, 0.6);\n    color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n    display: none;\n    opacity: 0.4;\n  }\n  .aa-ItemContentTag {\n    background-color: rgba(62, 52, 211, 0.2);\n    background-color: rgba(\n      var(--aa-primary-color-rgb),\n      var(--aa-primary-color-alpha)\n    );\n    border-radius: 3px;\n    margin: 0 0.4em 0 0;\n    padding: 0.08em 0.3em;\n  }\n  .aa-ItemWrapper,\n  .aa-ItemLink {\n    align-items: center;\n    color: inherit;\n    display: grid;\n    grid-gap: 4px;\n    gap: 4px;\n    grid-gap: calc(var(--aa-spacing-half) / 2);\n    gap: calc(var(--aa-spacing-half) / 2);\n    grid-auto-flow: column;\n    justify-content: space-between;\n    width: 100%;\n  }\n  .aa-ItemLink {\n    color: inherit;\n    text-decoration: none;\n  }\n  .aa-ItemActions {\n    display: grid;\n    grid-auto-flow: column;\n    height: 100%;\n    justify-self: end;\n    margin: 0 -5.3333333333px;\n    margin: 0 calc(var(--aa-spacing) / -3);\n    padding: 0 2px 0 0;\n  }\n  .aa-ItemActionButton {\n    align-items: center;\n    background: none;\n    border: 0;\n    color: rgba(128, 126, 163, 0.6);\n    color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n    cursor: pointer;\n    display: flex;\n    flex-shrink: 0;\n    padding: 0;\n  }\n  .aa-ItemActionButton:hover svg,\n  .aa-ItemActionButton:focus svg {\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n  }\n  @media (hover: none) and (pointer: coarse) {\n    .aa-ItemActionButton:hover svg,\n    .aa-ItemActionButton:focus svg {\n      color: inherit;\n    }\n  }\n  .aa-ItemActionButton svg {\n    color: rgba(128, 126, 163, 0.6);\n    color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n    margin: 0;\n    margin: 5.3333333333px;\n    margin: calc(var(--aa-spacing) / 3);\n    stroke-width: 1.6;\n    stroke-width: var(--aa-icon-stroke-width);\n    width: 20px;\n    width: var(--aa-action-icon-size);\n  }\n  .aa-ActiveOnly {\n    visibility: hidden;\n  }\n  /*---------------- */\n  /* 7. Panel Header */\n  /*---------------- */\n  .aa-PanelHeader {\n    align-items: center;\n    background: #3e34d3;\n    background: rgba(var(--aa-primary-color-rgb), 1);\n    color: #fff;\n    display: grid;\n    height: var(--aa-modal-header-height);\n    margin: 0;\n    padding: 8px 16px;\n    padding: var(--aa-spacing-half) var(--aa-spacing);\n    position: relative;\n  }\n  .aa-PanelHeader::after {\n    background-image: linear-gradient(white, rgba(255, 255, 255, 0));\n    background-image: linear-gradient(\n      rgba(var(--aa-background-color-rgb), 1),\n      rgba(var(--aa-background-color-rgb), 0)\n    );\n    bottom: -8px;\n    bottom: calc(var(--aa-spacing-half) * -1);\n    content: '';\n    height: 8px;\n    height: var(--aa-spacing-half);\n    left: 0;\n    pointer-events: none;\n    position: absolute;\n    right: 0;\n    z-index: 9999;\n    z-index: var(--aa-base-z-index);\n  }\n  /*---------------- */\n  /* 8. Panel Footer */\n  /*---------------- */\n  .aa-PanelFooter {\n    background-color: white;\n    background-color: rgba(\n      var(--aa-background-color-rgb),\n      var(--aa-background-color-alpha)\n    );\n    box-shadow: inset 0 1px 0 rgba(128, 126, 163, 0.3);\n    box-shadow: inset 0 1px 0\n      rgba(var(--aa-panel-border-color-rgb), var(--aa-panel-border-color-alpha));\n    display: flex;\n    justify-content: space-between;\n    margin: 0;\n    padding: 16px;\n    padding: var(--aa-spacing);\n    position: relative;\n    z-index: 9999;\n    z-index: var(--aa-base-z-index);\n  }\n  .aa-PanelFooter::after {\n    background-image: linear-gradient(\n      rgba(255, 255, 255, 0),\n      rgba(128, 126, 163, 0.6)\n    );\n    background-image: linear-gradient(\n      rgba(var(--aa-background-color-rgb), 0),\n      rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha))\n    );\n    content: '';\n    height: 16px;\n    height: var(--aa-spacing);\n    left: 0;\n    opacity: 0.12;\n    pointer-events: none;\n    position: absolute;\n    right: 0;\n    top: -16px;\n    top: calc(var(--aa-spacing) * -1);\n    z-index: 9998;\n    z-index: calc(var(--aa-base-z-index) - 1);\n  }\n  /*---------------- */\n  /* 9. Detached Mode */\n  /*---------------- */\n  .aa-DetachedContainer {\n    background: white;\n    background: rgba(\n      var(--aa-background-color-rgb),\n      var(--aa-background-color-alpha)\n    );\n    bottom: 0;\n    box-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n      0 6px 16px -4px rgba(35, 38, 59, 0.15);\n    box-shadow: var(--aa-panel-shadow);\n    display: flex;\n    flex-direction: column;\n    left: 0;\n    margin: 0;\n    overflow: hidden;\n    padding: 0;\n    position: fixed;\n    right: 0;\n    top: 0;\n    z-index: 9999;\n    z-index: var(--aa-base-z-index);\n  }\n  .aa-DetachedContainer::after {\n    height: 32px;\n  }\n  .aa-DetachedContainer .aa-SourceHeader {\n    margin: 8px 0 8px 2px;\n    margin: var(--aa-spacing-half) 0 var(--aa-spacing-half) 2px;\n  }\n  .aa-DetachedContainer .aa-Panel {\n    background-color: white;\n    background-color: rgba(\n      var(--aa-background-color-rgb),\n      var(--aa-background-color-alpha)\n    );\n    border-radius: 0;\n    box-shadow: none;\n    flex-grow: 1;\n    margin: 0;\n    padding: 0;\n    position: relative;\n  }\n  .aa-DetachedContainer .aa-PanelLayout {\n    bottom: 0;\n    box-shadow: none;\n    left: 0;\n    margin: 0;\n    max-height: none;\n    overflow-y: auto;\n    position: absolute;\n    right: 0;\n    top: 0;\n    width: 100%;\n  }\n  .aa-DetachedFormContainer {\n    border-bottom: solid 1px rgba(128, 126, 163, 0.3);\n    border-bottom: solid 1px\n      rgba(var(--aa-panel-border-color-rgb), var(--aa-panel-border-color-alpha));\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n    margin: 0;\n    padding: 8px;\n    padding: var(--aa-spacing-half);\n  }\n  .aa-DetachedCancelButton {\n    background: none;\n    border: 0;\n    border-radius: 3px;\n    color: inherit;\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    cursor: pointer;\n    font: inherit;\n    margin: 0 0 0 8px;\n    margin: 0 0 0 var(--aa-spacing-half);\n    padding: 0 8px;\n    padding: 0 var(--aa-spacing-half);\n  }\n  .aa-DetachedCancelButton:hover,\n  .aa-DetachedCancelButton:focus {\n    box-shadow: inset 0 0 0 1px rgba(128, 126, 163, 0.3);\n    box-shadow: inset 0 0 0 1px\n      rgba(var(--aa-panel-border-color-rgb), var(--aa-panel-border-color-alpha));\n  }\n  .aa-DetachedContainer--modal {\n    border-radius: 6px;\n    bottom: inherit;\n    height: auto;\n    margin: 0 auto;\n    max-width: 680px;\n    max-width: var(--aa-detached-modal-max-width);\n    position: absolute;\n    top: 3%;\n  }\n  .aa-DetachedContainer--modal .aa-PanelLayout {\n    max-height: 500px;\n    max-height: var(--aa-detached-modal-max-height);\n    padding-bottom: 8px;\n    padding-bottom: var(--aa-spacing-half);\n    position: static;\n  }\n  /* Search Button */\n  .aa-DetachedSearchButton {\n    align-items: center;\n    background-color: white;\n    background-color: rgba(\n      var(--aa-input-background-color-rgb),\n      var(--aa-input-background-color-alpha)\n    );\n    border: 1px solid rgba(128, 126, 163, 0.8);\n    border: 1px solid\n      rgba(var(--aa-input-border-color-rgb), var(--aa-input-border-color-alpha));\n    border-radius: 3px;\n    color: rgba(128, 126, 163, 0.6);\n    color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n    cursor: pointer;\n    display: flex;\n    font: inherit;\n    font-family: inherit;\n    font-family: var(--aa-font-family);\n    font-size: 16px;\n    font-size: var(--aa-font-size);\n    height: 44px;\n    height: var(--aa-search-input-height);\n    margin: 0;\n    padding: 0 5.5px;\n    padding: 0 calc(var(--aa-search-input-height) / 8);\n    position: relative;\n    text-align: left;\n    width: 100%;\n  }\n  .aa-DetachedSearchButton:focus {\n    border-color: #3e34d3;\n    border-color: rgba(var(--aa-primary-color-rgb), 1);\n    box-shadow: rgba(62, 52, 211, 0.2) 0 0 0 3px,\n      inset rgba(62, 52, 211, 0.2) 0 0 0 2px;\n    box-shadow: rgba(var(--aa-primary-color-rgb), var(--aa-primary-color-alpha))\n        0 0 0 3px,\n      inset rgba(var(--aa-primary-color-rgb), var(--aa-primary-color-alpha)) 0 0\n        0 2px;\n    outline: currentColor none medium;\n  }\n  .aa-DetachedSearchButtonIcon {\n    align-items: center;\n    color: #3e34d3;\n    color: rgba(var(--aa-primary-color-rgb), 1);\n    cursor: auto;\n    cursor: initial;\n    display: flex;\n    height: 100%;\n    justify-content: center;\n    width: 36px;\n    width: calc(var(--aa-icon-size) + var(--aa-spacing));\n  }\n  .aa-Detached {\n    height: 100vh;\n    overflow: hidden;\n  }\n  .aa-DetachedOverlay {\n    background-color: rgba(115, 114, 129, 0.4);\n    background-color: rgba(\n      var(--aa-overlay-color-rgb),\n      var(--aa-overlay-color-alpha)\n    );\n    height: 100vh;\n    left: 0;\n    margin: 0;\n    padding: 0;\n    position: fixed;\n    right: 0;\n    top: 0;\n    z-index: 9998;\n    z-index: calc(var(--aa-base-z-index) - 1);\n  }\n  /*---------------- */\n  /* 10. Gradients */\n  /*---------------- */\n  .aa-GradientTop,\n  .aa-GradientBottom {\n    height: 8px;\n    height: var(--aa-spacing-half);\n    left: 0;\n    pointer-events: none;\n    position: absolute;\n    right: 0;\n    z-index: 9999;\n    z-index: var(--aa-base-z-index);\n  }\n  .aa-GradientTop {\n    background-image: linear-gradient(white, rgba(255, 255, 255, 0));\n    background-image: linear-gradient(\n      rgba(var(--aa-background-color-rgb), 1),\n      rgba(var(--aa-background-color-rgb), 0)\n    );\n    top: 0;\n  }\n  .aa-GradientBottom {\n    background-image: linear-gradient(rgba(255, 255, 255, 0), white);\n    background-image: linear-gradient(\n      rgba(var(--aa-background-color-rgb), 0),\n      rgba(var(--aa-background-color-rgb), 1)\n    );\n    border-bottom-left-radius: 4px;\n    border-bottom-left-radius: calc(var(--aa-spacing) / 4);\n    border-bottom-right-radius: 4px;\n    border-bottom-right-radius: calc(var(--aa-spacing) / 4);\n    bottom: 0;\n  }\n  /*---------------- */\n  /* 11. Utilities */\n  /*---------------- */\n  @media (hover: none) and (pointer: coarse) {\n    .aa-DesktopOnly {\n      display: none;\n    }\n  }\n  @media (hover: hover) {\n    .aa-TouchOnly {\n      display: none;\n    }\n  }\n"], ["\n  /*! @algolia/autocomplete-theme-classic 1.6.3 | MIT License | \u00A9 Algolia, Inc. and contributors | https://github.com/algolia/autocomplete */\n  /* ---------------- */\n  /* 1.  CSS Variables */\n  /* 2.  Dark Mode */\n  /* 3.  Autocomplete */\n  /* 4.  Panel */\n  /* 5.  Sources */\n  /* 6.  Hit Layout */\n  /* 7.  Panel Header */\n  /* 8.  Panel Footer */\n  /* 9.  Detached Mode */\n  /* 10. Gradients */\n  /* 11. Utilities */\n  /* ---------------- */\n  /* Note: */\n  /* This theme reflects the markup structure of autocomplete with SCSS indentation. */\n  /* We use the SASS  function to keep specificity low. */\n  /* ---------------- */\n  /* 1. CSS Variables */\n  /* ---------------- */\n  :root {\n    /* Newskit */\n    --aa-newskit-input-border-color: 204, 204, 204;\n    --aa-newskit-placeholder-color: 106, 106, 106;\n    /* Input */\n    --aa-search-input-height: 44px;\n    --aa-input-icon-size: 20px;\n    /* Size and spacing */\n    --aa-base-unit: 16;\n    --aa-spacing-factor: 1;\n    --aa-spacing: calc(var(--aa-base-unit) * var(--aa-spacing-factor) * 1px);\n    --aa-spacing-half: calc(var(--aa-spacing) / 2);\n    --aa-panel-max-height: 650px;\n    /* Z-index */\n    --aa-base-z-index: 9999;\n    /* Font */\n    --aa-font-size: calc(var(--aa-base-unit) * 1px);\n    --aa-font-family: inherit;\n    --aa-font-weight-medium: 500;\n    --aa-font-weight-semibold: 600;\n    --aa-font-weight-bold: 700;\n    /* Icons */\n    --aa-icon-size: 20px;\n    --aa-icon-stroke-width: 1.6;\n    --aa-icon-color-rgb: 119, 119, 163;\n    --aa-icon-color-alpha: 1;\n    --aa-action-icon-size: 20px;\n    /* Text colors */\n    --aa-text-color-rgb: 38, 38, 39;\n    --aa-text-color-alpha: 1;\n    --aa-primary-color-rgb: 62, 52, 211;\n    --aa-primary-color-alpha: 0.2;\n    --aa-muted-color-rgb: 128, 126, 163;\n    --aa-muted-color-alpha: 0.6;\n    /* Border colors */\n    --aa-panel-border-color-rgb: 128, 126, 163;\n    --aa-panel-border-color-alpha: 0.3;\n    --aa-input-border-color-rgb: 145, 145, 145;\n    --aa-input-border-color-alpha: 0.8;\n    /* Background colors */\n    --aa-background-color-rgb: 255, 255, 255;\n    --aa-background-color-alpha: 1;\n    --aa-input-background-color-rgb: 255, 255, 255;\n    --aa-input-background-color-alpha: 1;\n    --aa-selected-color-rgb: 179, 173, 214;\n    --aa-selected-color-alpha: 0.205;\n    --aa-description-highlight-background-color-rgb: 245, 223, 77;\n    --aa-description-highlight-background-color-alpha: 0.5;\n    /* Detached mode */\n    --aa-detached-media-query: (max-width: 680px);\n    --aa-detached-modal-media-query: (min-width: 680px);\n    --aa-detached-modal-max-width: 680px;\n    --aa-detached-modal-max-height: 500px;\n    --aa-overlay-color-rgb: 115, 114, 129;\n    --aa-overlay-color-alpha: 0.4;\n    /* Shadows */\n    --aa-panel-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n      0 6px 16px -4px rgba(35, 38, 59, 0.15);\n    /* Scrollbar */\n    --aa-scrollbar-width: 13px;\n    --aa-scrollbar-track-background-color-rgb: 234, 234, 234;\n    --aa-scrollbar-track-background-color-alpha: 1;\n    --aa-scrollbar-thumb-background-color-rgb: var(--aa-background-color-rgb);\n    --aa-scrollbar-thumb-background-color-alpha: 1;\n    /* Touch screens */\n  }\n  @media (hover: none) and (pointer: coarse) {\n    :root {\n      --aa-spacing-factor: 1.2;\n      --aa-action-icon-size: 22px;\n    }\n  }\n  /* ---------------- */\n  /* 2. Dark Mode */\n  /* ---------------- */\n  body {\n    /* stylelint-disable selector-no-qualifying-type, selector-class-pattern */\n    /* stylelint-enable selector-no-qualifying-type, selector-class-pattern */\n  }\n  body[data-theme='dark'],\n  body.dark {\n    /* Text colors */\n    --aa-text-color-rgb: 183, 192, 199;\n    --aa-primary-color-rgb: 146, 138, 255;\n    --aa-muted-color-rgb: 146, 138, 255;\n    /* Background colors */\n    --aa-input-background-color-rgb: 0, 3, 9;\n    --aa-background-color-rgb: 21, 24, 42;\n    --aa-selected-color-rgb: 146, 138, 255;\n    --aa-selected-color-alpha: 0.25;\n    --aa-description-highlight-background-color-rgb: 0 255 255;\n    --aa-description-highlight-background-color-alpha: 0.25;\n    /* Icons */\n    --aa-icon-color-rgb: 119, 119, 163;\n    /* Shadows */\n    --aa-panel-shadow: inset 1px 1px 0 0 rgb(44, 46, 64),\n      0 3px 8px 0 rgb(0, 3, 9);\n    /* Scrollbar */\n    --aa-scrollbar-track-background-color-rgb: 44, 46, 64;\n    --aa-scrollbar-thumb-background-color-rgb: var(--aa-background-color-rgb);\n  }\n  /* Reset for  */\n  .aa-Panel *,\n  .aa-Autocomplete *,\n  .aa-DetachedFormContainer * {\n    box-sizing: border-box;\n  }\n  /* Init for  */\n  .aa-Panel,\n  .aa-Autocomplete,\n  .aa-DetachedFormContainer {\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    font-size: 16px;\n    font-size: var(--aa-font-size);\n    font-weight: normal;\n    line-height: 1em;\n    margin: 0;\n    padding: 0;\n    text-align: left;\n  }\n  /* ---------------- */\n  /* 3. Autocomplete */\n  /* ---------------- */\n  .aa-Autocomplete,\n  .aa-DetachedFormContainer {\n    /* Search box */\n  }\n  .aa-Form {\n    align-items: center;\n    background-color: white;\n    background-color: rgba(\n      var(--aa-input-background-color-rgb),\n      var(--aa-input-background-color-alpha)\n    );\n    border: 1px solid rgba(145, 145, 145, 1);\n    border: 1px solid rgba(var(--aa-newskit-input-border-color), 1);\n    border-radius: 8px;\n    display: flex;\n    line-height: 1em;\n    margin: 0;\n    position: relative;\n    width: 100%;\n  }\n  .aa-Form[focus-within] {\n    border-color: #cccccc;\n    border-color: rgba(var(--aa-newskit-input-border-color), 1);\n  }\n  .aa-Form:focus-within {\n    border-color: #cccccc;\n    border-color: rgba(var(--aa-newskit-input-border-color), 1);\n  }\n  .aa-InputWrapperPrefix {\n    align-items: center;\n    display: flex;\n    flex-shrink: 0;\n    height: 44px;\n    height: var(--aa-search-input-height);\n    order: 3;\n    /* Container for search and loading icons */\n  }\n  .aa-Label,\n  .aa-LoadingIndicator {\n    cursor: auto;\n    cursor: initial;\n    flex-shrink: 0;\n    height: 100%;\n    padding: 0;\n    text-align: left;\n  }\n  .aa-Label svg,\n  .aa-LoadingIndicator svg {\n    color: #3358cc;\n    fill: #3358cc;\n    position: relative;\n    top: 1px;\n    height: auto;\n    max-height: 20px;\n    max-height: var(--aa-input-icon-size);\n    stroke-width: 1.6;\n    stroke-width: var(--aa-icon-stroke-width);\n    width: 20px;\n    width: var(--aa-input-icon-size);\n  }\n  .aa-SubmitButton,\n  .aa-LoadingIndicator {\n    height: 100%;\n    padding-left: 11px;\n    padding-left: calc(var(--aa-spacing) * 0.75 - 1px);\n    padding-right: 8px;\n    padding-right: var(--aa-spacing-half);\n    width: 47px;\n    width: calc(var(--aa-spacing) * 1.75 + var(--aa-icon-size) - 1px);\n  }\n  @media (hover: none) and (pointer: coarse) {\n    .aa-SubmitButton,\n    .aa-LoadingIndicator {\n      padding-left: 3px;\n      padding-left: calc(var(--aa-spacing-half) / 2 - 1px);\n      width: 39px;\n      width: calc(var(--aa-icon-size) + var(--aa-spacing) * 1.25 - 1px);\n    }\n  }\n  .aa-SubmitButton {\n    -webkit-appearance: none;\n    -moz-appearance: none;\n    appearance: none;\n    background: none;\n    border: 0;\n    margin: 0;\n  }\n  .aa-SubmitButton svg {\n    cursor: pointer;\n  }\n  .aa-SubmitButton:disabled svg {\n    cursor: not-allowed;\n  }\n\n  .aa-LoadingIndicator {\n    align-items: center;\n    display: flex;\n    justify-content: center;\n  }\n  .aa-LoadingIndicator[hidden] {\n    display: none;\n  }\n  .aa-InputWrapper {\n    order: 1;\n    position: relative;\n    width: 100%;\n    /* Search box input (with placeholder and query) */\n  }\n  .aa-Input {\n    -webkit-appearance: none;\n    -moz-appearance: none;\n    appearance: none;\n    background: none;\n    border: 0;\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    font: inherit;\n    height: 44px;\n    height: var(--aa-search-input-height);\n    padding: 0;\n    width: 100%;\n    /* Focus is set and styled on the parent, it isn't necessary here */\n    /* Remove native appearence */\n    padding-left: calc(var(--aa-spacing) * 0.75 - 1px);\n  }\n  .aa-Input::-moz-placeholder {\n    color: rgba(106, 106, 106, 1);\n    color: rgba(\n      var(--aa-newskit-placeholder-color),\n      var(--aa-text-color-alpha)\n    );\n    opacity: 1;\n  }\n  .aa-Input:-ms-input-placeholder {\n    color: rgba(106, 106, 106, 1);\n    color: rgba(\n      var(--aa-newskit-placeholder-color),\n      var(--aa-text-color-alpha)\n    );\n    opacity: 1;\n  }\n  .aa-Input::placeholder {\n    color: rgba(106, 106, 106, 1);\n    color: rgba(\n      var(--aa-newskit-placeholder-color),\n      var(--aa-text-color-alpha)\n    );\n    opacity: 1;\n  }\n  .aa-Input:focus {\n    border-color: none;\n    box-shadow: none;\n    outline: none;\n  }\n  .aa-Input::-webkit-search-decoration,\n  .aa-Input::-webkit-search-cancel-button,\n  .aa-Input::-webkit-search-results-button,\n  .aa-Input::-webkit-search-results-decoration {\n    -webkit-appearance: none;\n    appearance: none;\n  }\n  .aa-InputWrapperSuffix {\n    align-items: center;\n    display: flex;\n    height: 44px;\n    height: var(--aa-search-input-height);\n    order: 2;\n    /* Accelerator to clear the query */\n  }\n  .aa-ClearButton {\n    align-items: center;\n    background: none;\n    border: 0;\n    color: rgba(128, 126, 163, 0.6);\n    color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n    cursor: pointer;\n    display: flex;\n    height: 100%;\n    margin: 0;\n    padding: 0;\n  }\n  .aa-ClearButton:hover,\n  .aa-ClearButton:focus {\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n  }\n  .aa-ClearButton[hidden] {\n    display: none;\n  }\n  .aa-ClearButton svg {\n    stroke-width: 1.6;\n    stroke-width: var(--aa-icon-stroke-width);\n    width: 20px;\n    width: var(--aa-icon-size);\n  }\n  /* ---------------- */\n  /* 4. Panel */\n  /* ---------------- */\n  .aa-Panel {\n    background-color: white;\n    background-color: rgba(\n      var(--aa-background-color-rgb),\n      var(--aa-background-color-alpha)\n    );\n    border-radius: 4px;\n    border-radius: calc(var(--aa-spacing) / 4);\n    box-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n      0 6px 16px -4px rgba(35, 38, 59, 0.15);\n    box-shadow: var(--aa-panel-shadow);\n    margin: 8px 0 0;\n    overflow: hidden;\n    position: absolute;\n    transition: opacity 200ms ease-in, filter 200ms ease-in;\n    /* When a request isn't resolved yet */\n  }\n  @media screen and (prefers-reduced-motion) {\n    .aa-Panel {\n      transition: none;\n    }\n  }\n  .aa-Panel button {\n    -webkit-appearance: none;\n    -moz-appearance: none;\n    appearance: none;\n    background: none;\n    border: 0;\n    margin: 0;\n    padding: 0;\n  }\n  .aa-PanelLayout {\n    height: 100%;\n    margin: 0;\n    max-height: 650px;\n    max-height: var(--aa-panel-max-height);\n    overflow-y: auto;\n    padding: 0;\n    position: relative;\n    text-align: left;\n  }\n  .aa-PanelLayoutColumns--twoGolden {\n    display: grid;\n    grid-template-columns: 39.2% auto;\n    overflow: hidden;\n    padding: 0;\n  }\n  .aa-PanelLayoutColumns--two {\n    display: grid;\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n    overflow: hidden;\n    padding: 0;\n  }\n  .aa-PanelLayoutColumns--three {\n    display: grid;\n    grid-template-columns: repeat(3, minmax(0, 1fr));\n    overflow: hidden;\n    padding: 0;\n  }\n  .aa-Panel--stalled .aa-Source {\n    filter: grayscale(1);\n    opacity: 0.8;\n  }\n  .aa-Panel--scrollable {\n    margin: 0;\n    max-height: 650px;\n    max-height: var(--aa-panel-max-height);\n    overflow-x: hidden;\n    overflow-y: auto;\n    padding: 8px;\n    padding: var(--aa-spacing-half);\n    scrollbar-color: white #eaeaea;\n    scrollbar-color: rgba(\n        var(--aa-scrollbar-thumb-background-color-rgb),\n        var(--aa-scrollbar-thumb-background-color-alpha)\n      )\n      rgba(\n        var(--aa-scrollbar-track-background-color-rgb),\n        var(--aa-scrollbar-track-background-color-alpha)\n      );\n    scrollbar-width: thin;\n  }\n  .aa-Panel--scrollable::-webkit-scrollbar {\n    width: 13px;\n    width: var(--aa-scrollbar-width);\n  }\n  .aa-Panel--scrollable::-webkit-scrollbar-track {\n    background-color: #eaeaea;\n    background-color: rgba(\n      var(--aa-scrollbar-track-background-color-rgb),\n      var(--aa-scrollbar-track-background-color-alpha)\n    );\n  }\n  .aa-Panel--scrollable::-webkit-scrollbar-thumb {\n    background-color: white;\n    background-color: rgba(\n      var(--aa-scrollbar-thumb-background-color-rgb),\n      var(--aa-scrollbar-thumb-background-color-alpha)\n    );\n    border-color: #eaeaea;\n    border-color: rgba(\n      var(--aa-scrollbar-track-background-color-rgb),\n      var(--aa-scrollbar-track-background-color-alpha)\n    );\n    border-radius: 9999px;\n    border-style: solid;\n    border-width: 3px 2px 3px 3px;\n  }\n  /* ---------------- */\n  /* 5. Sources */\n  /* Each source can be styled independently */\n  /* ---------------- */\n  .aa-Source {\n    margin: 0;\n    padding: 0;\n    position: relative;\n    width: 100%;\n    /* List of results inside the source */\n    /* Source title */\n    /* See all button */\n  }\n  .aa-Source:empty {\n    /* Hide empty section */\n    display: none;\n  }\n  .aa-SourceNoResults {\n    font-size: 1em;\n    margin: 0;\n    padding: 16px;\n    padding: var(--aa-spacing);\n  }\n  .aa-List {\n    list-style: none;\n    margin: 0;\n    padding: 0;\n    position: relative;\n  }\n  .aa-SourceHeader {\n    margin: 8px 0.5em 8px 0;\n    margin: var(--aa-spacing-half) 0.5em var(--aa-spacing-half) 0;\n    padding: 0;\n    position: relative;\n    /* Hide empty header */\n    /* Title typography */\n    /* Line separator */\n  }\n  .aa-SourceHeader:empty {\n    display: none;\n  }\n  .aa-SourceHeaderTitle {\n    background: white;\n    background: rgba(\n      var(--aa-background-color-rgb),\n      var(--aa-background-color-alpha)\n    );\n    color: #3e34d3;\n    color: rgba(var(--aa-primary-color-rgb), 1);\n    display: inline-block;\n    font-size: 0.8em;\n    font-weight: 600;\n    font-weight: var(--aa-font-weight-semibold);\n    margin: 0;\n    padding: 0 8px 0 0;\n    padding: 0 var(--aa-spacing-half) 0 0;\n    position: relative;\n    z-index: 9999;\n    z-index: var(--aa-base-z-index);\n  }\n  .aa-SourceHeaderLine {\n    border-bottom: solid 1px #3e34d3;\n    border-bottom: solid 1px rgba(var(--aa-primary-color-rgb), 1);\n    display: block;\n    height: 2px;\n    left: 0;\n    margin: 0;\n    opacity: 0.3;\n    padding: 0;\n    position: absolute;\n    right: 0;\n    top: 8px;\n    top: var(--aa-spacing-half);\n    z-index: 9998;\n    z-index: calc(var(--aa-base-z-index) - 1);\n  }\n  .aa-SourceFooterSeeAll {\n    background: linear-gradient(180deg, white, rgba(128, 126, 163, 0.14));\n    background: linear-gradient(\n      180deg,\n      rgba(var(--aa-background-color-rgb), var(--aa-background-color-alpha)),\n      rgba(128, 126, 163, 0.14)\n    );\n    border: 1px solid rgba(128, 126, 163, 0.6);\n    border: 1px solid\n      rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n    border-radius: 5px;\n    box-shadow: inset 0 0 2px #fff, 0 2px 2px -1px rgba(76, 69, 88, 0.15);\n    color: inherit;\n    font-size: 0.95em;\n    font-weight: 500;\n    font-weight: var(--aa-font-weight-medium);\n    padding: 0.475em 1em 0.6em;\n    text-decoration: none;\n  }\n  .aa-SourceFooterSeeAll:focus,\n  .aa-SourceFooterSeeAll:hover {\n    border: 1px solid #3e34d3;\n    border: 1px solid #cccccc;\n    color: #3e34d3;\n    color: rgba(var(--aa-primary-color-rgb), 1);\n  }\n  /* ---------------- */\n  /* 6. Hit Layout */\n  /* ---------------- */\n  .aa-Item {\n    align-items: center;\n    border-radius: 3px;\n    cursor: pointer;\n    display: grid;\n    min-height: 40px;\n    min-height: calc(var(--aa-spacing) * 2.5);\n    padding: 4px;\n    padding: calc(var(--aa-spacing-half) / 2);\n    /* When the result is active */\n    /* The result type icon inlined SVG or image */\n    /* wrap hit with url but we don't need to see it */\n    /* Secondary click actions */\n  }\n  .aa-Item[aria-selected='true'] {\n    background-color: rgba(179, 173, 214, 0.205);\n    background-color: rgba(\n      var(--aa-selected-color-rgb),\n      var(--aa-selected-color-alpha)\n    );\n  }\n  .aa-Item[aria-selected='true'] .aa-ItemActionButton,\n  .aa-Item[aria-selected='true'] .aa-ActiveOnly {\n    visibility: visible;\n  }\n  .aa-ItemIcon {\n    align-items: center;\n    background: white;\n    background: rgba(\n      var(--aa-background-color-rgb),\n      var(--aa-background-color-alpha)\n    );\n    border-radius: 3px;\n    box-shadow: inset 0 0 0 1px rgba(128, 126, 163, 0.3);\n    box-shadow: inset 0 0 0 1px\n      rgba(var(--aa-panel-border-color-rgb), var(--aa-panel-border-color-alpha));\n    color: #7777a3;\n    color: rgba(var(--aa-icon-color-rgb), var(--aa-icon-color-alpha));\n    display: flex;\n    flex-shrink: 0;\n    font-size: 0.7em;\n    height: 28px;\n    height: calc(var(--aa-icon-size) + var(--aa-spacing-half));\n    justify-content: center;\n    overflow: hidden;\n    stroke-width: 1.6;\n    stroke-width: var(--aa-icon-stroke-width);\n    text-align: center;\n    width: 28px;\n    width: calc(var(--aa-icon-size) + var(--aa-spacing-half));\n  }\n  .aa-ItemIcon img {\n    height: auto;\n    max-height: 20px;\n    max-height: calc(var(--aa-icon-size) + var(--aa-spacing-half) - 8px);\n    max-width: 20px;\n    max-width: calc(var(--aa-icon-size) + var(--aa-spacing-half) - 8px);\n    width: auto;\n  }\n  .aa-ItemIcon svg {\n    height: 20px;\n    height: var(--aa-icon-size);\n    width: 20px;\n    width: var(--aa-icon-size);\n  }\n  .aa-ItemIcon--alignTop {\n    align-self: flex-start;\n  }\n  .aa-ItemIcon--noBorder {\n    background: none;\n    box-shadow: none;\n  }\n  .aa-ItemIcon--picture {\n    height: 96px;\n    width: 96px;\n  }\n  .aa-ItemIcon--picture img {\n    max-height: 100%;\n    max-width: 100%;\n    padding: 8px;\n    padding: var(--aa-spacing-half);\n  }\n  .aa-ItemContent {\n    align-items: center;\n    cursor: pointer;\n    display: grid;\n    grid-gap: 8px;\n    gap: 8px;\n    grid-gap: var(--aa-spacing-half);\n    gap: var(--aa-spacing-half);\n    grid-auto-flow: column;\n    line-height: 1.25em;\n    overflow: hidden;\n  }\n  .aa-ItemContent:empty {\n    display: none;\n  }\n  .aa-ItemContent mark {\n    background: none;\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    font-style: normal;\n    font-weight: 700;\n    font-weight: var(--aa-font-weight-bold);\n  }\n  .aa-ItemContent--dual {\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    text-align: left;\n  }\n  .aa-ItemContent--dual .aa-ItemContentTitle,\n  .aa-ItemContent--dual .aa-ItemContentSubtitle {\n    display: block;\n  }\n  .aa-ItemContent--indented {\n    padding-left: 36px;\n    padding-left: calc(var(--aa-icon-size) + var(--aa-spacing));\n  }\n  .aa-ItemContentBody {\n    display: grid;\n    grid-gap: 4px;\n    gap: 4px;\n    grid-gap: calc(var(--aa-spacing-half) / 2);\n    gap: calc(var(--aa-spacing-half) / 2);\n  }\n  .aa-ItemContentTitle {\n    display: inline-block;\n    margin: 0 0.5em 0 0;\n    max-width: 100%;\n    overflow: hidden;\n    padding: 0;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n  .aa-ItemContentSubtitle {\n    font-size: 0.92em;\n  }\n  .aa-ItemContentSubtitleIcon::before {\n    border-color: rgba(128, 126, 163, 0.64);\n    border-color: rgba(var(--aa-muted-color-rgb), 0.64);\n    border-style: solid;\n    content: '';\n    display: inline-block;\n    left: 1px;\n    position: relative;\n    top: -3px;\n  }\n  .aa-ItemContentSubtitle--inline .aa-ItemContentSubtitleIcon::before {\n    border-width: 0 0 1.5px;\n    margin-left: 8px;\n    margin-left: var(--aa-spacing-half);\n    margin-right: 4px;\n    margin-right: calc(var(--aa-spacing-half) / 2);\n    width: 10px;\n    width: calc(var(--aa-spacing-half) + 2px);\n  }\n  .aa-ItemContentSubtitle--standalone {\n    align-items: center;\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    display: grid;\n    grid-gap: 8px;\n    gap: 8px;\n    grid-gap: var(--aa-spacing-half);\n    gap: var(--aa-spacing-half);\n    grid-auto-flow: column;\n    justify-content: start;\n  }\n  .aa-ItemContentSubtitle--standalone .aa-ItemContentSubtitleIcon::before {\n    border-radius: 0 0 0 3px;\n    border-width: 0 0 1.5px 1.5px;\n    height: 8px;\n    height: var(--aa-spacing-half);\n    width: 8px;\n    width: var(--aa-spacing-half);\n  }\n  .aa-ItemContentSubtitleCategory {\n    color: #807ea3;\n    color: rgba(var(--aa-muted-color-rgb), 1);\n    font-weight: 500;\n  }\n  .aa-ItemContentDescription {\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    font-size: 0.85em;\n    max-width: 100%;\n    overflow-x: hidden;\n    text-overflow: ellipsis;\n  }\n  .aa-ItemContentDescription:empty {\n    display: none;\n  }\n  .aa-ItemContentDescription mark {\n    background: rgba(245, 223, 77, 0.5);\n    background: rgba(\n      var(--aa-description-highlight-background-color-rgb),\n      var(--aa-description-highlight-background-color-alpha)\n    );\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    font-style: normal;\n    font-weight: 500;\n    font-weight: var(--aa-font-weight-medium);\n  }\n  .aa-ItemContentDash {\n    color: rgba(128, 126, 163, 0.6);\n    color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n    display: none;\n    opacity: 0.4;\n  }\n  .aa-ItemContentTag {\n    background-color: rgba(62, 52, 211, 0.2);\n    background-color: rgba(\n      var(--aa-primary-color-rgb),\n      var(--aa-primary-color-alpha)\n    );\n    border-radius: 3px;\n    margin: 0 0.4em 0 0;\n    padding: 0.08em 0.3em;\n  }\n  .aa-ItemWrapper,\n  .aa-ItemLink {\n    align-items: center;\n    color: inherit;\n    display: grid;\n    grid-gap: 4px;\n    gap: 4px;\n    grid-gap: calc(var(--aa-spacing-half) / 2);\n    gap: calc(var(--aa-spacing-half) / 2);\n    grid-auto-flow: column;\n    justify-content: space-between;\n    width: 100%;\n  }\n  .aa-ItemLink {\n    color: inherit;\n    text-decoration: none;\n  }\n  .aa-ItemActions {\n    display: grid;\n    grid-auto-flow: column;\n    height: 100%;\n    justify-self: end;\n    margin: 0 -5.3333333333px;\n    margin: 0 calc(var(--aa-spacing) / -3);\n    padding: 0 2px 0 0;\n  }\n  .aa-ItemActionButton {\n    align-items: center;\n    background: none;\n    border: 0;\n    color: rgba(128, 126, 163, 0.6);\n    color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n    cursor: pointer;\n    display: flex;\n    flex-shrink: 0;\n    padding: 0;\n  }\n  .aa-ItemActionButton:hover svg,\n  .aa-ItemActionButton:focus svg {\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n  }\n  @media (hover: none) and (pointer: coarse) {\n    .aa-ItemActionButton:hover svg,\n    .aa-ItemActionButton:focus svg {\n      color: inherit;\n    }\n  }\n  .aa-ItemActionButton svg {\n    color: rgba(128, 126, 163, 0.6);\n    color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n    margin: 0;\n    margin: 5.3333333333px;\n    margin: calc(var(--aa-spacing) / 3);\n    stroke-width: 1.6;\n    stroke-width: var(--aa-icon-stroke-width);\n    width: 20px;\n    width: var(--aa-action-icon-size);\n  }\n  .aa-ActiveOnly {\n    visibility: hidden;\n  }\n  /*---------------- */\n  /* 7. Panel Header */\n  /*---------------- */\n  .aa-PanelHeader {\n    align-items: center;\n    background: #3e34d3;\n    background: rgba(var(--aa-primary-color-rgb), 1);\n    color: #fff;\n    display: grid;\n    height: var(--aa-modal-header-height);\n    margin: 0;\n    padding: 8px 16px;\n    padding: var(--aa-spacing-half) var(--aa-spacing);\n    position: relative;\n  }\n  .aa-PanelHeader::after {\n    background-image: linear-gradient(white, rgba(255, 255, 255, 0));\n    background-image: linear-gradient(\n      rgba(var(--aa-background-color-rgb), 1),\n      rgba(var(--aa-background-color-rgb), 0)\n    );\n    bottom: -8px;\n    bottom: calc(var(--aa-spacing-half) * -1);\n    content: '';\n    height: 8px;\n    height: var(--aa-spacing-half);\n    left: 0;\n    pointer-events: none;\n    position: absolute;\n    right: 0;\n    z-index: 9999;\n    z-index: var(--aa-base-z-index);\n  }\n  /*---------------- */\n  /* 8. Panel Footer */\n  /*---------------- */\n  .aa-PanelFooter {\n    background-color: white;\n    background-color: rgba(\n      var(--aa-background-color-rgb),\n      var(--aa-background-color-alpha)\n    );\n    box-shadow: inset 0 1px 0 rgba(128, 126, 163, 0.3);\n    box-shadow: inset 0 1px 0\n      rgba(var(--aa-panel-border-color-rgb), var(--aa-panel-border-color-alpha));\n    display: flex;\n    justify-content: space-between;\n    margin: 0;\n    padding: 16px;\n    padding: var(--aa-spacing);\n    position: relative;\n    z-index: 9999;\n    z-index: var(--aa-base-z-index);\n  }\n  .aa-PanelFooter::after {\n    background-image: linear-gradient(\n      rgba(255, 255, 255, 0),\n      rgba(128, 126, 163, 0.6)\n    );\n    background-image: linear-gradient(\n      rgba(var(--aa-background-color-rgb), 0),\n      rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha))\n    );\n    content: '';\n    height: 16px;\n    height: var(--aa-spacing);\n    left: 0;\n    opacity: 0.12;\n    pointer-events: none;\n    position: absolute;\n    right: 0;\n    top: -16px;\n    top: calc(var(--aa-spacing) * -1);\n    z-index: 9998;\n    z-index: calc(var(--aa-base-z-index) - 1);\n  }\n  /*---------------- */\n  /* 9. Detached Mode */\n  /*---------------- */\n  .aa-DetachedContainer {\n    background: white;\n    background: rgba(\n      var(--aa-background-color-rgb),\n      var(--aa-background-color-alpha)\n    );\n    bottom: 0;\n    box-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n      0 6px 16px -4px rgba(35, 38, 59, 0.15);\n    box-shadow: var(--aa-panel-shadow);\n    display: flex;\n    flex-direction: column;\n    left: 0;\n    margin: 0;\n    overflow: hidden;\n    padding: 0;\n    position: fixed;\n    right: 0;\n    top: 0;\n    z-index: 9999;\n    z-index: var(--aa-base-z-index);\n  }\n  .aa-DetachedContainer::after {\n    height: 32px;\n  }\n  .aa-DetachedContainer .aa-SourceHeader {\n    margin: 8px 0 8px 2px;\n    margin: var(--aa-spacing-half) 0 var(--aa-spacing-half) 2px;\n  }\n  .aa-DetachedContainer .aa-Panel {\n    background-color: white;\n    background-color: rgba(\n      var(--aa-background-color-rgb),\n      var(--aa-background-color-alpha)\n    );\n    border-radius: 0;\n    box-shadow: none;\n    flex-grow: 1;\n    margin: 0;\n    padding: 0;\n    position: relative;\n  }\n  .aa-DetachedContainer .aa-PanelLayout {\n    bottom: 0;\n    box-shadow: none;\n    left: 0;\n    margin: 0;\n    max-height: none;\n    overflow-y: auto;\n    position: absolute;\n    right: 0;\n    top: 0;\n    width: 100%;\n  }\n  .aa-DetachedFormContainer {\n    border-bottom: solid 1px rgba(128, 126, 163, 0.3);\n    border-bottom: solid 1px\n      rgba(var(--aa-panel-border-color-rgb), var(--aa-panel-border-color-alpha));\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n    margin: 0;\n    padding: 8px;\n    padding: var(--aa-spacing-half);\n  }\n  .aa-DetachedCancelButton {\n    background: none;\n    border: 0;\n    border-radius: 3px;\n    color: inherit;\n    color: #262627;\n    color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    cursor: pointer;\n    font: inherit;\n    margin: 0 0 0 8px;\n    margin: 0 0 0 var(--aa-spacing-half);\n    padding: 0 8px;\n    padding: 0 var(--aa-spacing-half);\n  }\n  .aa-DetachedCancelButton:hover,\n  .aa-DetachedCancelButton:focus {\n    box-shadow: inset 0 0 0 1px rgba(128, 126, 163, 0.3);\n    box-shadow: inset 0 0 0 1px\n      rgba(var(--aa-panel-border-color-rgb), var(--aa-panel-border-color-alpha));\n  }\n  .aa-DetachedContainer--modal {\n    border-radius: 6px;\n    bottom: inherit;\n    height: auto;\n    margin: 0 auto;\n    max-width: 680px;\n    max-width: var(--aa-detached-modal-max-width);\n    position: absolute;\n    top: 3%;\n  }\n  .aa-DetachedContainer--modal .aa-PanelLayout {\n    max-height: 500px;\n    max-height: var(--aa-detached-modal-max-height);\n    padding-bottom: 8px;\n    padding-bottom: var(--aa-spacing-half);\n    position: static;\n  }\n  /* Search Button */\n  .aa-DetachedSearchButton {\n    align-items: center;\n    background-color: white;\n    background-color: rgba(\n      var(--aa-input-background-color-rgb),\n      var(--aa-input-background-color-alpha)\n    );\n    border: 1px solid rgba(128, 126, 163, 0.8);\n    border: 1px solid\n      rgba(var(--aa-input-border-color-rgb), var(--aa-input-border-color-alpha));\n    border-radius: 3px;\n    color: rgba(128, 126, 163, 0.6);\n    color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n    cursor: pointer;\n    display: flex;\n    font: inherit;\n    font-family: inherit;\n    font-family: var(--aa-font-family);\n    font-size: 16px;\n    font-size: var(--aa-font-size);\n    height: 44px;\n    height: var(--aa-search-input-height);\n    margin: 0;\n    padding: 0 5.5px;\n    padding: 0 calc(var(--aa-search-input-height) / 8);\n    position: relative;\n    text-align: left;\n    width: 100%;\n  }\n  .aa-DetachedSearchButton:focus {\n    border-color: #3e34d3;\n    border-color: rgba(var(--aa-primary-color-rgb), 1);\n    box-shadow: rgba(62, 52, 211, 0.2) 0 0 0 3px,\n      inset rgba(62, 52, 211, 0.2) 0 0 0 2px;\n    box-shadow: rgba(var(--aa-primary-color-rgb), var(--aa-primary-color-alpha))\n        0 0 0 3px,\n      inset rgba(var(--aa-primary-color-rgb), var(--aa-primary-color-alpha)) 0 0\n        0 2px;\n    outline: currentColor none medium;\n  }\n  .aa-DetachedSearchButtonIcon {\n    align-items: center;\n    color: #3e34d3;\n    color: rgba(var(--aa-primary-color-rgb), 1);\n    cursor: auto;\n    cursor: initial;\n    display: flex;\n    height: 100%;\n    justify-content: center;\n    width: 36px;\n    width: calc(var(--aa-icon-size) + var(--aa-spacing));\n  }\n  .aa-Detached {\n    height: 100vh;\n    overflow: hidden;\n  }\n  .aa-DetachedOverlay {\n    background-color: rgba(115, 114, 129, 0.4);\n    background-color: rgba(\n      var(--aa-overlay-color-rgb),\n      var(--aa-overlay-color-alpha)\n    );\n    height: 100vh;\n    left: 0;\n    margin: 0;\n    padding: 0;\n    position: fixed;\n    right: 0;\n    top: 0;\n    z-index: 9998;\n    z-index: calc(var(--aa-base-z-index) - 1);\n  }\n  /*---------------- */\n  /* 10. Gradients */\n  /*---------------- */\n  .aa-GradientTop,\n  .aa-GradientBottom {\n    height: 8px;\n    height: var(--aa-spacing-half);\n    left: 0;\n    pointer-events: none;\n    position: absolute;\n    right: 0;\n    z-index: 9999;\n    z-index: var(--aa-base-z-index);\n  }\n  .aa-GradientTop {\n    background-image: linear-gradient(white, rgba(255, 255, 255, 0));\n    background-image: linear-gradient(\n      rgba(var(--aa-background-color-rgb), 1),\n      rgba(var(--aa-background-color-rgb), 0)\n    );\n    top: 0;\n  }\n  .aa-GradientBottom {\n    background-image: linear-gradient(rgba(255, 255, 255, 0), white);\n    background-image: linear-gradient(\n      rgba(var(--aa-background-color-rgb), 0),\n      rgba(var(--aa-background-color-rgb), 1)\n    );\n    border-bottom-left-radius: 4px;\n    border-bottom-left-radius: calc(var(--aa-spacing) / 4);\n    border-bottom-right-radius: 4px;\n    border-bottom-right-radius: calc(var(--aa-spacing) / 4);\n    bottom: 0;\n  }\n  /*---------------- */\n  /* 11. Utilities */\n  /*---------------- */\n  @media (hover: none) and (pointer: coarse) {\n    .aa-DesktopOnly {\n      display: none;\n    }\n  }\n  @media (hover: hover) {\n    .aa-TouchOnly {\n      display: none;\n    }\n  }\n"])));
+var getAlgoliaStyling = function (overrides, theme) {
+    return (0, newskit_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    /*! @algolia/autocomplete-theme-classic 1.6.3 | MIT License | \u00A9 Algolia, Inc. and contributors | https://github.com/algolia/autocomplete */\n    /* ---------------- */\n    /* 1.  CSS Variables */\n    /* 2.  Dark Mode */\n    /* 3.  Autocomplete */\n    /* 4.  Panel */\n    /* 5.  Sources */\n    /* 6.  Hit Layout */\n    /* 7.  Panel Header */\n    /* 8.  Panel Footer */\n    /* 9.  Detached Mode */\n    /* 10. Gradients */\n    /* 11. Utilities */\n    /* ---------------- */\n    /* Note: */\n    /* This theme reflects the markup structure of autocomplete with SCSS indentation. */\n    /* We use the SASS  function to keep specificity low. */\n    /* ---------------- */\n    /* 1. CSS Variables */\n    /* ---------------- */\n    :root {\n      /* Newskit */\n      --aa-newskit-input-border-color: 204, 204, 204;\n      --aa-newskit-placeholder-color: 106, 106, 106;\n      /* Input */\n      --aa-search-input-height: 44px;\n      --aa-input-icon-size: 20px;\n      /* Size and spacing */\n      --aa-base-unit: 16;\n      --aa-spacing-factor: 1;\n      --aa-spacing: calc(var(--aa-base-unit) * var(--aa-spacing-factor) * 1px);\n      --aa-spacing-half: calc(var(--aa-spacing) / 2);\n      --aa-panel-max-height: 650px;\n      /* Z-index */\n      --aa-base-z-index: 9999;\n      /* Font */\n      --aa-font-size: calc(var(--aa-base-unit) * 1px);\n      --aa-font-family: inherit;\n      --aa-font-weight-medium: 500;\n      --aa-font-weight-semibold: 600;\n      --aa-font-weight-bold: 700;\n      /* Icons */\n      --aa-icon-size: 20px;\n      --aa-icon-stroke-width: 1.6;\n      --aa-icon-color-rgb: 119, 119, 163;\n      --aa-icon-color-alpha: 1;\n      --aa-action-icon-size: 20px;\n      /* Text colors */\n      --aa-text-color-rgb: 38, 38, 39;\n      --aa-text-color-alpha: 1;\n      --aa-primary-color-rgb: 62, 52, 211;\n      --aa-primary-color-alpha: 0.2;\n      --aa-muted-color-rgb: 128, 126, 163;\n      --aa-muted-color-alpha: 0.6;\n      /* Border colors */\n      --aa-panel-border-color-rgb: 128, 126, 163;\n      --aa-panel-border-color-alpha: 0.3;\n      --aa-input-border-color-rgb: 145, 145, 145;\n      --aa-input-border-color-alpha: 0.8;\n      /* Background colors */\n      --aa-background-color-rgb: 255, 255, 255;\n      --aa-background-color-alpha: 1;\n      --aa-input-background-color-rgb: 255, 255, 255;\n      --aa-input-background-color-alpha: 1;\n      --aa-selected-color-rgb: 179, 173, 214;\n      --aa-selected-color-alpha: 0.205;\n      --aa-description-highlight-background-color-rgb: 245, 223, 77;\n      --aa-description-highlight-background-color-alpha: 0.5;\n      /* Detached mode */\n      --aa-detached-media-query: (max-width: 680px);\n      --aa-detached-modal-media-query: (min-width: 680px);\n      --aa-detached-modal-max-width: 680px;\n      --aa-detached-modal-max-height: 500px;\n      --aa-overlay-color-rgb: 115, 114, 129;\n      --aa-overlay-color-alpha: 0.4;\n      /* Shadows */\n      --aa-panel-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n        0 6px 16px -4px rgba(35, 38, 59, 0.15);\n      /* Scrollbar */\n      --aa-scrollbar-width: 13px;\n      --aa-scrollbar-track-background-color-rgb: 234, 234, 234;\n      --aa-scrollbar-track-background-color-alpha: 1;\n      --aa-scrollbar-thumb-background-color-rgb: var(--aa-background-color-rgb);\n      --aa-scrollbar-thumb-background-color-alpha: 1;\n      /* Touch screens */\n    }\n    @media (hover: none) and (pointer: coarse) {\n      :root {\n        --aa-spacing-factor: 1.2;\n        --aa-action-icon-size: 22px;\n      }\n    }\n    /* ---------------- */\n    /* 2. Dark Mode */\n    /* ---------------- */\n    body {\n      /* stylelint-disable selector-no-qualifying-type, selector-class-pattern */\n      /* stylelint-enable selector-no-qualifying-type, selector-class-pattern */\n    }\n    body[data-theme='dark'],\n    body.dark {\n      /* Text colors */\n      --aa-text-color-rgb: 183, 192, 199;\n      --aa-primary-color-rgb: 146, 138, 255;\n      --aa-muted-color-rgb: 146, 138, 255;\n      /* Background colors */\n      --aa-input-background-color-rgb: 0, 3, 9;\n      --aa-background-color-rgb: 21, 24, 42;\n      --aa-selected-color-rgb: 146, 138, 255;\n      --aa-selected-color-alpha: 0.25;\n      --aa-description-highlight-background-color-rgb: 0 255 255;\n      --aa-description-highlight-background-color-alpha: 0.25;\n      /* Icons */\n      --aa-icon-color-rgb: 119, 119, 163;\n      /* Shadows */\n      --aa-panel-shadow: inset 1px 1px 0 0 rgb(44, 46, 64),\n        0 3px 8px 0 rgb(0, 3, 9);\n      /* Scrollbar */\n      --aa-scrollbar-track-background-color-rgb: 44, 46, 64;\n      --aa-scrollbar-thumb-background-color-rgb: var(--aa-background-color-rgb);\n    }\n    /* Reset for  */\n    .aa-Panel *,\n    .aa-Autocomplete *,\n    .aa-DetachedFormContainer * {\n      box-sizing: border-box;\n    }\n    /* Init for  */\n    .aa-Panel,\n    .aa-Autocomplete,\n    .aa-DetachedFormContainer {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-size: 16px;\n      font-size: var(--aa-font-size);\n      font-weight: normal;\n      line-height: 1em;\n      margin: 0;\n      padding: 0;\n      text-align: left;\n    }\n    /* ---------------- */\n    /* 3. Autocomplete */\n    /* ---------------- */\n    .aa-Autocomplete,\n    .aa-DetachedFormContainer {\n      /* Search box */\n    }\n    .aa-Form {\n      align-items: center;\n      background-color: white;\n      background-color: rgba(\n        var(--aa-input-background-color-rgb),\n        var(--aa-input-background-color-alpha)\n      );\n      border: ", ";\n      ", ";\n      border-radius: 8px;\n      display: flex;\n      flex-direction: ", ";\n      line-height: 1em;\n      margin: 0;\n      position: relative;\n      width: 100%;\n    }\n    .aa-Form[focus-within] {\n      ", ";\n    }\n    .aa-Form:focus-within {\n      ", ";\n    }\n    .aa-InputWrapperPrefix {\n      align-items: center;\n      display: flex;\n      flex-shrink: 0;\n      height: 44px;\n      height: var(--aa-search-input-height);\n      order: 3;\n      /* Container for search and loading icons */\n    }\n    .aa-Label,\n    .aa-LoadingIndicator {\n      cursor: auto;\n      cursor: initial;\n      flex-shrink: 0;\n      height: 100%;\n      padding: 0;\n      text-align: left;\n    }\n    .aa-Label svg,\n    .aa-LoadingIndicator svg {\n      ", "\n      ", "\n    position: relative;\n      top: 1px;\n      height: auto;\n      max-height: 20px;\n      max-height: var(--aa-input-icon-size);\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      width: 20px;\n      width: var(--aa-input-icon-size);\n    }\n    .aa-SubmitButton,\n    .aa-LoadingIndicator {\n      height: 100%;\n      padding-left: 11px;\n      padding-left: calc(var(--aa-spacing) * 0.75 - 1px);\n      padding-right: 8px;\n      padding-right: var(--aa-spacing-half);\n      width: 47px;\n      width: calc(var(--aa-spacing) * 1.75 + var(--aa-icon-size) - 1px);\n    }\n    @media (hover: none) and (pointer: coarse) {\n      .aa-SubmitButton,\n      .aa-LoadingIndicator {\n        padding-left: 3px;\n        padding-left: calc(var(--aa-spacing-half) / 2 - 1px);\n        width: 39px;\n        width: calc(var(--aa-icon-size) + var(--aa-spacing) * 1.25 - 1px);\n      }\n    }\n    .aa-SubmitButton {\n      -webkit-appearance: none;\n      -moz-appearance: none;\n      appearance: none;\n      background: none;\n      border: 0;\n      margin: 0;\n    }\n    .aa-SubmitButton svg {\n      cursor: pointer;\n    }\n    .aa-SubmitButton:disabled svg {\n      cursor: not-allowed;\n    }\n\n    .aa-LoadingIndicator {\n      align-items: center;\n      display: flex;\n      justify-content: center;\n    }\n    .aa-LoadingIndicator[hidden] {\n      display: none;\n    }\n    .aa-InputWrapper {\n      order: 1;\n      position: relative;\n      width: 100%;\n      /* Search box input (with placeholder and query) */\n    }\n    .aa-Input {\n      -webkit-appearance: none;\n      -moz-appearance: none;\n      appearance: none;\n      background: none;\n      border: 0;\n      ", "\n      font: inherit;\n      height: 44px;\n      height: var(--aa-search-input-height);\n      padding: 0;\n      width: 100%;\n      /* Focus is set and styled on the parent, it isn't necessary here */\n      /* Remove native appearence */\n      padding-left: calc(var(--aa-spacing) * 0.75 - 1px);\n    }\n    .aa-Input::-moz-placeholder {\n      ", "\n      opacity: 1;\n    }\n    .aa-Input:-ms-input-placeholder {\n      color: rgba(106, 106, 106, 1);\n      color: rgba(\n        var(--aa-newskit-placeholder-color),\n        var(--aa-text-color-alpha)\n      );\n      opacity: 1;\n    }\n    .aa-Input::placeholder {\n      ", "\n      opacity: 1;\n    }\n    .aa-Input:focus {\n      border-color: none;\n      box-shadow: none;\n      outline: none;\n    }\n    .aa-Input::-webkit-search-decoration,\n    .aa-Input::-webkit-search-cancel-button,\n    .aa-Input::-webkit-search-results-button,\n    .aa-Input::-webkit-search-results-decoration {\n      -webkit-appearance: none;\n      appearance: none;\n    }\n    .aa-InputWrapperSuffix {\n      align-items: center;\n      display: flex;\n      height: 44px;\n      height: var(--aa-search-input-height);\n      order: 2;\n      /* Accelerator to clear the query */\n    }\n    .aa-ClearButton {\n      align-items: center;\n      background: none;\n      border: 0;\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      cursor: pointer;\n      display: flex;\n      height: 100%;\n      margin: 0;\n      padding: 0;\n    }\n    .aa-ClearButton:hover,\n    .aa-ClearButton:focus {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    }\n    .aa-ClearButton[hidden] {\n      display: none;\n    }\n    .aa-ClearButton svg {\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      width: 20px;\n      width: var(--aa-icon-size);\n    }\n    /* ---------------- */\n    /* 4. Panel */\n    /* ---------------- */\n    .aa-Panel {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      border-radius: 4px;\n      border-radius: calc(var(--aa-spacing) / 4);\n      box-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n        0 6px 16px -4px rgba(35, 38, 59, 0.15);\n      box-shadow: var(--aa-panel-shadow);\n      margin: 8px 0 0;\n      overflow: hidden;\n      position: absolute;\n      transition: opacity 200ms ease-in, filter 200ms ease-in;\n      /* When a request isn't resolved yet */\n    }\n    @media screen and (prefers-reduced-motion) {\n      .aa-Panel {\n        transition: none;\n      }\n    }\n    .aa-Panel button {\n      -webkit-appearance: none;\n      -moz-appearance: none;\n      appearance: none;\n      background: none;\n      border: 0;\n      margin: 0;\n      padding: 0;\n    }\n    .aa-PanelLayout {\n      height: 100%;\n      margin: 0;\n      max-height: 650px;\n      max-height: var(--aa-panel-max-height);\n      overflow-y: auto;\n      padding: 0;\n      position: relative;\n      text-align: left;\n    }\n    .aa-PanelLayoutColumns--twoGolden {\n      display: grid;\n      grid-template-columns: 39.2% auto;\n      overflow: hidden;\n      padding: 0;\n    }\n    .aa-PanelLayoutColumns--two {\n      display: grid;\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n      overflow: hidden;\n      padding: 0;\n    }\n    .aa-PanelLayoutColumns--three {\n      display: grid;\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n      overflow: hidden;\n      padding: 0;\n    }\n    .aa-Panel--stalled .aa-Source {\n      filter: grayscale(1);\n      opacity: 0.8;\n    }\n    .aa-Panel--scrollable {\n      margin: 0;\n      max-height: 650px;\n      max-height: var(--aa-panel-max-height);\n      overflow-x: hidden;\n      overflow-y: auto;\n      padding: 8px;\n      padding: var(--aa-spacing-half);\n      scrollbar-color: white #eaeaea;\n      scrollbar-color: rgba(\n          var(--aa-scrollbar-thumb-background-color-rgb),\n          var(--aa-scrollbar-thumb-background-color-alpha)\n        )\n        rgba(\n          var(--aa-scrollbar-track-background-color-rgb),\n          var(--aa-scrollbar-track-background-color-alpha)\n        );\n      scrollbar-width: thin;\n    }\n    .aa-Panel--scrollable::-webkit-scrollbar {\n      width: 13px;\n      width: var(--aa-scrollbar-width);\n    }\n    .aa-Panel--scrollable::-webkit-scrollbar-track {\n      background-color: #eaeaea;\n      background-color: rgba(\n        var(--aa-scrollbar-track-background-color-rgb),\n        var(--aa-scrollbar-track-background-color-alpha)\n      );\n    }\n    .aa-Panel--scrollable::-webkit-scrollbar-thumb {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-scrollbar-thumb-background-color-rgb),\n        var(--aa-scrollbar-thumb-background-color-alpha)\n      );\n      border-color: #eaeaea;\n      border-color: rgba(\n        var(--aa-scrollbar-track-background-color-rgb),\n        var(--aa-scrollbar-track-background-color-alpha)\n      );\n      border-radius: 9999px;\n      border-style: solid;\n      border-width: 3px 2px 3px 3px;\n    }\n    /* ---------------- */\n    /* 5. Sources */\n    /* Each source can be styled independently */\n    /* ---------------- */\n    .aa-Source {\n      margin: 0;\n      padding: 0;\n      position: relative;\n      width: 100%;\n      /* List of results inside the source */\n      /* Source title */\n      /* See all button */\n    }\n    .aa-Source:empty {\n      /* Hide empty section */\n      display: none;\n    }\n    .aa-SourceNoResults {\n      font-size: 1em;\n      margin: 0;\n      padding: 16px;\n      padding: var(--aa-spacing);\n    }\n    .aa-List {\n      list-style: none;\n      margin: 0;\n      padding: 0;\n      position: relative;\n    }\n    .aa-SourceHeader {\n      margin: 8px 0.5em 8px 0;\n      margin: var(--aa-spacing-half) 0.5em var(--aa-spacing-half) 0;\n      padding: 0;\n      position: relative;\n      /* Hide empty header */\n      /* Title typography */\n      /* Line separator */\n    }\n    .aa-SourceHeader:empty {\n      display: none;\n    }\n    .aa-SourceHeaderTitle {\n      background: white;\n      background: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      color: #3e34d3;\n      color: rgba(var(--aa-primary-color-rgb), 1);\n      display: inline-block;\n      font-size: 0.8em;\n      font-weight: 600;\n      font-weight: var(--aa-font-weight-semibold);\n      margin: 0;\n      padding: 0 8px 0 0;\n      padding: 0 var(--aa-spacing-half) 0 0;\n      position: relative;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-SourceHeaderLine {\n      border-bottom: solid 1px #3e34d3;\n      border-bottom: solid 1px rgba(var(--aa-primary-color-rgb), 1);\n      display: block;\n      height: 2px;\n      left: 0;\n      margin: 0;\n      opacity: 0.3;\n      padding: 0;\n      position: absolute;\n      right: 0;\n      top: 8px;\n      top: var(--aa-spacing-half);\n      z-index: 9998;\n      z-index: calc(var(--aa-base-z-index) - 1);\n    }\n    .aa-SourceFooterSeeAll {\n      background: linear-gradient(180deg, white, rgba(128, 126, 163, 0.14));\n      background: linear-gradient(\n        180deg,\n        rgba(var(--aa-background-color-rgb), var(--aa-background-color-alpha)),\n        rgba(128, 126, 163, 0.14)\n      );\n      border: 1px solid rgba(128, 126, 163, 0.6);\n      border: 1px solid\n        rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      border-radius: 5px;\n      box-shadow: inset 0 0 2px #fff, 0 2px 2px -1px rgba(76, 69, 88, 0.15);\n      color: inherit;\n      font-size: 0.95em;\n      font-weight: 500;\n      font-weight: var(--aa-font-weight-medium);\n      padding: 0.475em 1em 0.6em;\n      text-decoration: none;\n    }\n    .aa-SourceFooterSeeAll:focus,\n    .aa-SourceFooterSeeAll:hover {\n      border: 1px solid #3e34d3;\n      border: 1px solid #cccccc;\n      color: #3e34d3;\n      color: rgba(var(--aa-primary-color-rgb), 1);\n    }\n    /* ---------------- */\n    /* 6. Hit Layout */\n    /* ---------------- */\n    .aa-Item {\n      align-items: center;\n      border-radius: 3px;\n      cursor: pointer;\n      display: grid;\n      min-height: 40px;\n      min-height: calc(var(--aa-spacing) * 2.5);\n      padding: 4px;\n      padding: calc(var(--aa-spacing-half) / 2);\n      /* When the result is active */\n      /* The result type icon inlined SVG or image */\n      /* wrap hit with url but we don't need to see it */\n      /* Secondary click actions */\n    }\n    .aa-Item[aria-selected='true'] {\n      background-color: rgba(179, 173, 214, 0.205);\n      background-color: rgba(\n        var(--aa-selected-color-rgb),\n        var(--aa-selected-color-alpha)\n      );\n    }\n    .aa-Item[aria-selected='true'] .aa-ItemActionButton,\n    .aa-Item[aria-selected='true'] .aa-ActiveOnly {\n      visibility: visible;\n    }\n    .aa-ItemIcon {\n      align-items: center;\n      background: white;\n      background: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      border-radius: 3px;\n      box-shadow: inset 0 0 0 1px rgba(128, 126, 163, 0.3);\n      box-shadow: inset 0 0 0 1px\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n      color: #7777a3;\n      color: rgba(var(--aa-icon-color-rgb), var(--aa-icon-color-alpha));\n      display: flex;\n      flex-shrink: 0;\n      font-size: 0.7em;\n      height: 28px;\n      height: calc(var(--aa-icon-size) + var(--aa-spacing-half));\n      justify-content: center;\n      overflow: hidden;\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      text-align: center;\n      width: 28px;\n      width: calc(var(--aa-icon-size) + var(--aa-spacing-half));\n    }\n    .aa-ItemIcon img {\n      height: auto;\n      max-height: 20px;\n      max-height: calc(var(--aa-icon-size) + var(--aa-spacing-half) - 8px);\n      max-width: 20px;\n      max-width: calc(var(--aa-icon-size) + var(--aa-spacing-half) - 8px);\n      width: auto;\n    }\n    .aa-ItemIcon svg {\n      height: 20px;\n      height: var(--aa-icon-size);\n      width: 20px;\n      width: var(--aa-icon-size);\n    }\n    .aa-ItemIcon--alignTop {\n      align-self: flex-start;\n    }\n    .aa-ItemIcon--noBorder {\n      background: none;\n      box-shadow: none;\n    }\n    .aa-ItemIcon--picture {\n      height: 96px;\n      width: 96px;\n    }\n    .aa-ItemIcon--picture img {\n      max-height: 100%;\n      max-width: 100%;\n      padding: 8px;\n      padding: var(--aa-spacing-half);\n    }\n    .aa-ItemContent {\n      align-items: center;\n      cursor: pointer;\n      display: grid;\n      grid-gap: 8px;\n      gap: 8px;\n      grid-gap: var(--aa-spacing-half);\n      gap: var(--aa-spacing-half);\n      grid-auto-flow: column;\n      line-height: 1.25em;\n      overflow: hidden;\n    }\n    .aa-ItemContent:empty {\n      display: none;\n    }\n    .aa-ItemContent mark {\n      background: none;\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-style: normal;\n      font-weight: 700;\n      font-weight: var(--aa-font-weight-bold);\n    }\n    .aa-ItemContent--dual {\n      display: flex;\n      flex-direction: column;\n      justify-content: space-between;\n      text-align: left;\n    }\n    .aa-ItemContent--dual .aa-ItemContentTitle,\n    .aa-ItemContent--dual .aa-ItemContentSubtitle {\n      display: block;\n    }\n    .aa-ItemContent--indented {\n      padding-left: 36px;\n      padding-left: calc(var(--aa-icon-size) + var(--aa-spacing));\n    }\n    .aa-ItemContentBody {\n      display: grid;\n      grid-gap: 4px;\n      gap: 4px;\n      grid-gap: calc(var(--aa-spacing-half) / 2);\n      gap: calc(var(--aa-spacing-half) / 2);\n    }\n    .aa-ItemContentTitle {\n      ", "\n      display: inline-block;\n      margin: 0 0.5em 0 0;\n      max-width: 100%;\n      overflow: hidden;\n      padding: 0;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n    .aa-ItemContentSubtitle {\n      font-size: 0.92em;\n    }\n    .aa-ItemContentSubtitleIcon::before {\n      border-color: rgba(128, 126, 163, 0.64);\n      border-color: rgba(var(--aa-muted-color-rgb), 0.64);\n      border-style: solid;\n      content: '';\n      display: inline-block;\n      left: 1px;\n      position: relative;\n      top: -3px;\n    }\n    .aa-ItemContentSubtitle--inline .aa-ItemContentSubtitleIcon::before {\n      border-width: 0 0 1.5px;\n      margin-left: 8px;\n      margin-left: var(--aa-spacing-half);\n      margin-right: 4px;\n      margin-right: calc(var(--aa-spacing-half) / 2);\n      width: 10px;\n      width: calc(var(--aa-spacing-half) + 2px);\n    }\n    .aa-ItemContentSubtitle--standalone {\n      align-items: center;\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      display: grid;\n      grid-gap: 8px;\n      gap: 8px;\n      grid-gap: var(--aa-spacing-half);\n      gap: var(--aa-spacing-half);\n      grid-auto-flow: column;\n      justify-content: start;\n    }\n    .aa-ItemContentSubtitle--standalone .aa-ItemContentSubtitleIcon::before {\n      border-radius: 0 0 0 3px;\n      border-width: 0 0 1.5px 1.5px;\n      height: 8px;\n      height: var(--aa-spacing-half);\n      width: 8px;\n      width: var(--aa-spacing-half);\n    }\n    .aa-ItemContentSubtitleCategory {\n      color: #807ea3;\n      color: rgba(var(--aa-muted-color-rgb), 1);\n      font-weight: 500;\n    }\n    .aa-ItemContentDescription {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-size: 0.85em;\n      max-width: 100%;\n      overflow-x: hidden;\n      text-overflow: ellipsis;\n    }\n    .aa-ItemContentDescription:empty {\n      display: none;\n    }\n    .aa-ItemContentDescription mark {\n      background: rgba(245, 223, 77, 0.5);\n      background: rgba(\n        var(--aa-description-highlight-background-color-rgb),\n        var(--aa-description-highlight-background-color-alpha)\n      );\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-style: normal;\n      font-weight: 500;\n      font-weight: var(--aa-font-weight-medium);\n    }\n    .aa-ItemContentDash {\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      display: none;\n      opacity: 0.4;\n    }\n    .aa-ItemContentTag {\n      background-color: rgba(62, 52, 211, 0.2);\n      background-color: rgba(\n        var(--aa-primary-color-rgb),\n        var(--aa-primary-color-alpha)\n      );\n      border-radius: 3px;\n      margin: 0 0.4em 0 0;\n      padding: 0.08em 0.3em;\n    }\n    .aa-ItemWrapper,\n    .aa-ItemLink {\n      align-items: center;\n      color: inherit;\n      display: grid;\n      grid-gap: 4px;\n      gap: 4px;\n      grid-gap: calc(var(--aa-spacing-half) / 2);\n      gap: calc(var(--aa-spacing-half) / 2);\n      grid-auto-flow: column;\n      justify-content: space-between;\n      width: 100%;\n    }\n    .aa-ItemLink {\n      color: inherit;\n      text-decoration: none;\n    }\n    .aa-ItemActions {\n      display: grid;\n      grid-auto-flow: column;\n      height: 100%;\n      justify-self: end;\n      margin: 0 -5.3333333333px;\n      margin: 0 calc(var(--aa-spacing) / -3);\n      padding: 0 2px 0 0;\n    }\n    .aa-ItemActionButton {\n      align-items: center;\n      background: none;\n      border: 0;\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      cursor: pointer;\n      display: flex;\n      flex-shrink: 0;\n      padding: 0;\n    }\n    .aa-ItemActionButton:hover svg,\n    .aa-ItemActionButton:focus svg {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    }\n    @media (hover: none) and (pointer: coarse) {\n      .aa-ItemActionButton:hover svg,\n      .aa-ItemActionButton:focus svg {\n        color: inherit;\n      }\n    }\n    .aa-ItemActionButton svg {\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      margin: 0;\n      margin: 5.3333333333px;\n      margin: calc(var(--aa-spacing) / 3);\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      width: 20px;\n      width: var(--aa-action-icon-size);\n    }\n    .aa-ActiveOnly {\n      visibility: hidden;\n    }\n    /*---------------- */\n    /* 7. Panel Header */\n    /*---------------- */\n    .aa-PanelHeader {\n      align-items: center;\n      background: #3e34d3;\n      background: rgba(var(--aa-primary-color-rgb), 1);\n      color: #fff;\n      display: grid;\n      height: var(--aa-modal-header-height);\n      margin: 0;\n      padding: 8px 16px;\n      padding: var(--aa-spacing-half) var(--aa-spacing);\n      position: relative;\n    }\n    .aa-PanelHeader::after {\n      background-image: linear-gradient(white, rgba(255, 255, 255, 0));\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 1),\n        rgba(var(--aa-background-color-rgb), 0)\n      );\n      bottom: -8px;\n      bottom: calc(var(--aa-spacing-half) * -1);\n      content: '';\n      height: 8px;\n      height: var(--aa-spacing-half);\n      left: 0;\n      pointer-events: none;\n      position: absolute;\n      right: 0;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    /*---------------- */\n    /* 8. Panel Footer */\n    /*---------------- */\n    .aa-PanelFooter {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      box-shadow: inset 0 1px 0 rgba(128, 126, 163, 0.3);\n      box-shadow: inset 0 1px 0\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n      display: flex;\n      justify-content: space-between;\n      margin: 0;\n      padding: 16px;\n      padding: var(--aa-spacing);\n      position: relative;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-PanelFooter::after {\n      background-image: linear-gradient(\n        rgba(255, 255, 255, 0),\n        rgba(128, 126, 163, 0.6)\n      );\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 0),\n        rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha))\n      );\n      content: '';\n      height: 16px;\n      height: var(--aa-spacing);\n      left: 0;\n      opacity: 0.12;\n      pointer-events: none;\n      position: absolute;\n      right: 0;\n      top: -16px;\n      top: calc(var(--aa-spacing) * -1);\n      z-index: 9998;\n      z-index: calc(var(--aa-base-z-index) - 1);\n    }\n    /*---------------- */\n    /* 9. Detached Mode */\n    /*---------------- */\n    .aa-DetachedContainer {\n      background: white;\n      background: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      bottom: 0;\n      box-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n        0 6px 16px -4px rgba(35, 38, 59, 0.15);\n      box-shadow: var(--aa-panel-shadow);\n      display: flex;\n      flex-direction: column;\n      left: 0;\n      margin: 0;\n      overflow: hidden;\n      padding: 0;\n      position: fixed;\n      right: 0;\n      top: 0;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-DetachedContainer::after {\n      height: 32px;\n    }\n    .aa-DetachedContainer .aa-SourceHeader {\n      margin: 8px 0 8px 2px;\n      margin: var(--aa-spacing-half) 0 var(--aa-spacing-half) 2px;\n    }\n    .aa-DetachedContainer .aa-Panel {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      border-radius: 0;\n      box-shadow: none;\n      flex-grow: 1;\n      margin: 0;\n      padding: 0;\n      position: relative;\n    }\n    .aa-DetachedContainer .aa-PanelLayout {\n      bottom: 0;\n      box-shadow: none;\n      left: 0;\n      margin: 0;\n      max-height: none;\n      overflow-y: auto;\n      position: absolute;\n      right: 0;\n      top: 0;\n      width: 100%;\n    }\n    .aa-DetachedFormContainer {\n      border-bottom: solid 1px rgba(128, 126, 163, 0.3);\n      border-bottom: solid 1px\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n      display: flex;\n      flex-direction: row;\n      justify-content: space-between;\n      margin: 0;\n      padding: 8px;\n      padding: var(--aa-spacing-half);\n    }\n    .aa-DetachedCancelButton {\n      background: none;\n      border: 0;\n      border-radius: 3px;\n      color: inherit;\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      cursor: pointer;\n      font: inherit;\n      margin: 0 0 0 8px;\n      margin: 0 0 0 var(--aa-spacing-half);\n      padding: 0 8px;\n      padding: 0 var(--aa-spacing-half);\n    }\n    .aa-DetachedCancelButton:hover,\n    .aa-DetachedCancelButton:focus {\n      box-shadow: inset 0 0 0 1px rgba(128, 126, 163, 0.3);\n      box-shadow: inset 0 0 0 1px\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n    }\n    .aa-DetachedContainer--modal {\n      border-radius: 6px;\n      bottom: inherit;\n      height: auto;\n      margin: 0 auto;\n      max-width: 680px;\n      max-width: var(--aa-detached-modal-max-width);\n      position: absolute;\n      top: 3%;\n    }\n    .aa-DetachedContainer--modal .aa-PanelLayout {\n      max-height: 500px;\n      max-height: var(--aa-detached-modal-max-height);\n      padding-bottom: 8px;\n      padding-bottom: var(--aa-spacing-half);\n      position: static;\n    }\n    /* Search Button */\n    .aa-DetachedSearchButton {\n      align-items: center;\n      background-color: white;\n      background-color: rgba(\n        var(--aa-input-background-color-rgb),\n        var(--aa-input-background-color-alpha)\n      );\n      border: 1px solid rgba(128, 126, 163, 0.8);\n      border: 1px solid\n        rgba(\n          var(--aa-input-border-color-rgb),\n          var(--aa-input-border-color-alpha)\n        );\n      border-radius: 3px;\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      cursor: pointer;\n      display: flex;\n      font: inherit;\n      font-family: inherit;\n      font-family: var(--aa-font-family);\n      font-size: 16px;\n      font-size: var(--aa-font-size);\n      height: 44px;\n      height: var(--aa-search-input-height);\n      margin: 0;\n      padding: 0 5.5px;\n      padding: 0 calc(var(--aa-search-input-height) / 8);\n      position: relative;\n      text-align: left;\n      width: 100%;\n    }\n    .aa-DetachedSearchButton:focus {\n      border-color: #3e34d3;\n      border-color: rgba(var(--aa-primary-color-rgb), 1);\n      box-shadow: rgba(62, 52, 211, 0.2) 0 0 0 3px,\n        inset rgba(62, 52, 211, 0.2) 0 0 0 2px;\n      box-shadow: rgba(\n            var(--aa-primary-color-rgb),\n            var(--aa-primary-color-alpha)\n          )\n          0 0 0 3px,\n        inset rgba(var(--aa-primary-color-rgb), var(--aa-primary-color-alpha)) 0\n          0 0 2px;\n      outline: currentColor none medium;\n    }\n    .aa-DetachedSearchButtonIcon {\n      align-items: center;\n      color: #3e34d3;\n      color: rgba(var(--aa-primary-color-rgb), 1);\n      cursor: auto;\n      cursor: initial;\n      display: flex;\n      height: 100%;\n      justify-content: center;\n      width: 36px;\n      width: calc(var(--aa-icon-size) + var(--aa-spacing));\n    }\n    .aa-Detached {\n      height: 100vh;\n      overflow: hidden;\n    }\n    .aa-DetachedOverlay {\n      background-color: rgba(115, 114, 129, 0.4);\n      background-color: rgba(\n        var(--aa-overlay-color-rgb),\n        var(--aa-overlay-color-alpha)\n      );\n      height: 100vh;\n      left: 0;\n      margin: 0;\n      padding: 0;\n      position: fixed;\n      right: 0;\n      top: 0;\n      z-index: 9998;\n      z-index: calc(var(--aa-base-z-index) - 1);\n    }\n    /*---------------- */\n    /* 10. Gradients */\n    /*---------------- */\n    .aa-GradientTop,\n    .aa-GradientBottom {\n      height: 8px;\n      height: var(--aa-spacing-half);\n      left: 0;\n      pointer-events: none;\n      position: absolute;\n      right: 0;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-GradientTop {\n      background-image: linear-gradient(white, rgba(255, 255, 255, 0));\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 1),\n        rgba(var(--aa-background-color-rgb), 0)\n      );\n      top: 0;\n    }\n    .aa-GradientBottom {\n      background-image: linear-gradient(rgba(255, 255, 255, 0), white);\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 0),\n        rgba(var(--aa-background-color-rgb), 1)\n      );\n      border-bottom-left-radius: 4px;\n      border-bottom-left-radius: calc(var(--aa-spacing) / 4);\n      border-bottom-right-radius: 4px;\n      border-bottom-right-radius: calc(var(--aa-spacing) / 4);\n      bottom: 0;\n    }\n    /*---------------- */\n    /* 11. Utilities */\n    /*---------------- */\n    @media (hover: none) and (pointer: coarse) {\n      .aa-DesktopOnly {\n        display: none;\n      }\n    }\n    @media (hover: hover) {\n      .aa-TouchOnly {\n        display: none;\n      }\n    }\n  "], ["\n    /*! @algolia/autocomplete-theme-classic 1.6.3 | MIT License | \u00A9 Algolia, Inc. and contributors | https://github.com/algolia/autocomplete */\n    /* ---------------- */\n    /* 1.  CSS Variables */\n    /* 2.  Dark Mode */\n    /* 3.  Autocomplete */\n    /* 4.  Panel */\n    /* 5.  Sources */\n    /* 6.  Hit Layout */\n    /* 7.  Panel Header */\n    /* 8.  Panel Footer */\n    /* 9.  Detached Mode */\n    /* 10. Gradients */\n    /* 11. Utilities */\n    /* ---------------- */\n    /* Note: */\n    /* This theme reflects the markup structure of autocomplete with SCSS indentation. */\n    /* We use the SASS  function to keep specificity low. */\n    /* ---------------- */\n    /* 1. CSS Variables */\n    /* ---------------- */\n    :root {\n      /* Newskit */\n      --aa-newskit-input-border-color: 204, 204, 204;\n      --aa-newskit-placeholder-color: 106, 106, 106;\n      /* Input */\n      --aa-search-input-height: 44px;\n      --aa-input-icon-size: 20px;\n      /* Size and spacing */\n      --aa-base-unit: 16;\n      --aa-spacing-factor: 1;\n      --aa-spacing: calc(var(--aa-base-unit) * var(--aa-spacing-factor) * 1px);\n      --aa-spacing-half: calc(var(--aa-spacing) / 2);\n      --aa-panel-max-height: 650px;\n      /* Z-index */\n      --aa-base-z-index: 9999;\n      /* Font */\n      --aa-font-size: calc(var(--aa-base-unit) * 1px);\n      --aa-font-family: inherit;\n      --aa-font-weight-medium: 500;\n      --aa-font-weight-semibold: 600;\n      --aa-font-weight-bold: 700;\n      /* Icons */\n      --aa-icon-size: 20px;\n      --aa-icon-stroke-width: 1.6;\n      --aa-icon-color-rgb: 119, 119, 163;\n      --aa-icon-color-alpha: 1;\n      --aa-action-icon-size: 20px;\n      /* Text colors */\n      --aa-text-color-rgb: 38, 38, 39;\n      --aa-text-color-alpha: 1;\n      --aa-primary-color-rgb: 62, 52, 211;\n      --aa-primary-color-alpha: 0.2;\n      --aa-muted-color-rgb: 128, 126, 163;\n      --aa-muted-color-alpha: 0.6;\n      /* Border colors */\n      --aa-panel-border-color-rgb: 128, 126, 163;\n      --aa-panel-border-color-alpha: 0.3;\n      --aa-input-border-color-rgb: 145, 145, 145;\n      --aa-input-border-color-alpha: 0.8;\n      /* Background colors */\n      --aa-background-color-rgb: 255, 255, 255;\n      --aa-background-color-alpha: 1;\n      --aa-input-background-color-rgb: 255, 255, 255;\n      --aa-input-background-color-alpha: 1;\n      --aa-selected-color-rgb: 179, 173, 214;\n      --aa-selected-color-alpha: 0.205;\n      --aa-description-highlight-background-color-rgb: 245, 223, 77;\n      --aa-description-highlight-background-color-alpha: 0.5;\n      /* Detached mode */\n      --aa-detached-media-query: (max-width: 680px);\n      --aa-detached-modal-media-query: (min-width: 680px);\n      --aa-detached-modal-max-width: 680px;\n      --aa-detached-modal-max-height: 500px;\n      --aa-overlay-color-rgb: 115, 114, 129;\n      --aa-overlay-color-alpha: 0.4;\n      /* Shadows */\n      --aa-panel-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n        0 6px 16px -4px rgba(35, 38, 59, 0.15);\n      /* Scrollbar */\n      --aa-scrollbar-width: 13px;\n      --aa-scrollbar-track-background-color-rgb: 234, 234, 234;\n      --aa-scrollbar-track-background-color-alpha: 1;\n      --aa-scrollbar-thumb-background-color-rgb: var(--aa-background-color-rgb);\n      --aa-scrollbar-thumb-background-color-alpha: 1;\n      /* Touch screens */\n    }\n    @media (hover: none) and (pointer: coarse) {\n      :root {\n        --aa-spacing-factor: 1.2;\n        --aa-action-icon-size: 22px;\n      }\n    }\n    /* ---------------- */\n    /* 2. Dark Mode */\n    /* ---------------- */\n    body {\n      /* stylelint-disable selector-no-qualifying-type, selector-class-pattern */\n      /* stylelint-enable selector-no-qualifying-type, selector-class-pattern */\n    }\n    body[data-theme='dark'],\n    body.dark {\n      /* Text colors */\n      --aa-text-color-rgb: 183, 192, 199;\n      --aa-primary-color-rgb: 146, 138, 255;\n      --aa-muted-color-rgb: 146, 138, 255;\n      /* Background colors */\n      --aa-input-background-color-rgb: 0, 3, 9;\n      --aa-background-color-rgb: 21, 24, 42;\n      --aa-selected-color-rgb: 146, 138, 255;\n      --aa-selected-color-alpha: 0.25;\n      --aa-description-highlight-background-color-rgb: 0 255 255;\n      --aa-description-highlight-background-color-alpha: 0.25;\n      /* Icons */\n      --aa-icon-color-rgb: 119, 119, 163;\n      /* Shadows */\n      --aa-panel-shadow: inset 1px 1px 0 0 rgb(44, 46, 64),\n        0 3px 8px 0 rgb(0, 3, 9);\n      /* Scrollbar */\n      --aa-scrollbar-track-background-color-rgb: 44, 46, 64;\n      --aa-scrollbar-thumb-background-color-rgb: var(--aa-background-color-rgb);\n    }\n    /* Reset for  */\n    .aa-Panel *,\n    .aa-Autocomplete *,\n    .aa-DetachedFormContainer * {\n      box-sizing: border-box;\n    }\n    /* Init for  */\n    .aa-Panel,\n    .aa-Autocomplete,\n    .aa-DetachedFormContainer {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-size: 16px;\n      font-size: var(--aa-font-size);\n      font-weight: normal;\n      line-height: 1em;\n      margin: 0;\n      padding: 0;\n      text-align: left;\n    }\n    /* ---------------- */\n    /* 3. Autocomplete */\n    /* ---------------- */\n    .aa-Autocomplete,\n    .aa-DetachedFormContainer {\n      /* Search box */\n    }\n    .aa-Form {\n      align-items: center;\n      background-color: white;\n      background-color: rgba(\n        var(--aa-input-background-color-rgb),\n        var(--aa-input-background-color-alpha)\n      );\n      border: ", ";\n      ", ";\n      border-radius: 8px;\n      display: flex;\n      flex-direction: ", ";\n      line-height: 1em;\n      margin: 0;\n      position: relative;\n      width: 100%;\n    }\n    .aa-Form[focus-within] {\n      ", ";\n    }\n    .aa-Form:focus-within {\n      ", ";\n    }\n    .aa-InputWrapperPrefix {\n      align-items: center;\n      display: flex;\n      flex-shrink: 0;\n      height: 44px;\n      height: var(--aa-search-input-height);\n      order: 3;\n      /* Container for search and loading icons */\n    }\n    .aa-Label,\n    .aa-LoadingIndicator {\n      cursor: auto;\n      cursor: initial;\n      flex-shrink: 0;\n      height: 100%;\n      padding: 0;\n      text-align: left;\n    }\n    .aa-Label svg,\n    .aa-LoadingIndicator svg {\n      ", "\n      ", "\n    position: relative;\n      top: 1px;\n      height: auto;\n      max-height: 20px;\n      max-height: var(--aa-input-icon-size);\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      width: 20px;\n      width: var(--aa-input-icon-size);\n    }\n    .aa-SubmitButton,\n    .aa-LoadingIndicator {\n      height: 100%;\n      padding-left: 11px;\n      padding-left: calc(var(--aa-spacing) * 0.75 - 1px);\n      padding-right: 8px;\n      padding-right: var(--aa-spacing-half);\n      width: 47px;\n      width: calc(var(--aa-spacing) * 1.75 + var(--aa-icon-size) - 1px);\n    }\n    @media (hover: none) and (pointer: coarse) {\n      .aa-SubmitButton,\n      .aa-LoadingIndicator {\n        padding-left: 3px;\n        padding-left: calc(var(--aa-spacing-half) / 2 - 1px);\n        width: 39px;\n        width: calc(var(--aa-icon-size) + var(--aa-spacing) * 1.25 - 1px);\n      }\n    }\n    .aa-SubmitButton {\n      -webkit-appearance: none;\n      -moz-appearance: none;\n      appearance: none;\n      background: none;\n      border: 0;\n      margin: 0;\n    }\n    .aa-SubmitButton svg {\n      cursor: pointer;\n    }\n    .aa-SubmitButton:disabled svg {\n      cursor: not-allowed;\n    }\n\n    .aa-LoadingIndicator {\n      align-items: center;\n      display: flex;\n      justify-content: center;\n    }\n    .aa-LoadingIndicator[hidden] {\n      display: none;\n    }\n    .aa-InputWrapper {\n      order: 1;\n      position: relative;\n      width: 100%;\n      /* Search box input (with placeholder and query) */\n    }\n    .aa-Input {\n      -webkit-appearance: none;\n      -moz-appearance: none;\n      appearance: none;\n      background: none;\n      border: 0;\n      ", "\n      font: inherit;\n      height: 44px;\n      height: var(--aa-search-input-height);\n      padding: 0;\n      width: 100%;\n      /* Focus is set and styled on the parent, it isn't necessary here */\n      /* Remove native appearence */\n      padding-left: calc(var(--aa-spacing) * 0.75 - 1px);\n    }\n    .aa-Input::-moz-placeholder {\n      ", "\n      opacity: 1;\n    }\n    .aa-Input:-ms-input-placeholder {\n      color: rgba(106, 106, 106, 1);\n      color: rgba(\n        var(--aa-newskit-placeholder-color),\n        var(--aa-text-color-alpha)\n      );\n      opacity: 1;\n    }\n    .aa-Input::placeholder {\n      ", "\n      opacity: 1;\n    }\n    .aa-Input:focus {\n      border-color: none;\n      box-shadow: none;\n      outline: none;\n    }\n    .aa-Input::-webkit-search-decoration,\n    .aa-Input::-webkit-search-cancel-button,\n    .aa-Input::-webkit-search-results-button,\n    .aa-Input::-webkit-search-results-decoration {\n      -webkit-appearance: none;\n      appearance: none;\n    }\n    .aa-InputWrapperSuffix {\n      align-items: center;\n      display: flex;\n      height: 44px;\n      height: var(--aa-search-input-height);\n      order: 2;\n      /* Accelerator to clear the query */\n    }\n    .aa-ClearButton {\n      align-items: center;\n      background: none;\n      border: 0;\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      cursor: pointer;\n      display: flex;\n      height: 100%;\n      margin: 0;\n      padding: 0;\n    }\n    .aa-ClearButton:hover,\n    .aa-ClearButton:focus {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    }\n    .aa-ClearButton[hidden] {\n      display: none;\n    }\n    .aa-ClearButton svg {\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      width: 20px;\n      width: var(--aa-icon-size);\n    }\n    /* ---------------- */\n    /* 4. Panel */\n    /* ---------------- */\n    .aa-Panel {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      border-radius: 4px;\n      border-radius: calc(var(--aa-spacing) / 4);\n      box-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n        0 6px 16px -4px rgba(35, 38, 59, 0.15);\n      box-shadow: var(--aa-panel-shadow);\n      margin: 8px 0 0;\n      overflow: hidden;\n      position: absolute;\n      transition: opacity 200ms ease-in, filter 200ms ease-in;\n      /* When a request isn't resolved yet */\n    }\n    @media screen and (prefers-reduced-motion) {\n      .aa-Panel {\n        transition: none;\n      }\n    }\n    .aa-Panel button {\n      -webkit-appearance: none;\n      -moz-appearance: none;\n      appearance: none;\n      background: none;\n      border: 0;\n      margin: 0;\n      padding: 0;\n    }\n    .aa-PanelLayout {\n      height: 100%;\n      margin: 0;\n      max-height: 650px;\n      max-height: var(--aa-panel-max-height);\n      overflow-y: auto;\n      padding: 0;\n      position: relative;\n      text-align: left;\n    }\n    .aa-PanelLayoutColumns--twoGolden {\n      display: grid;\n      grid-template-columns: 39.2% auto;\n      overflow: hidden;\n      padding: 0;\n    }\n    .aa-PanelLayoutColumns--two {\n      display: grid;\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n      overflow: hidden;\n      padding: 0;\n    }\n    .aa-PanelLayoutColumns--three {\n      display: grid;\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n      overflow: hidden;\n      padding: 0;\n    }\n    .aa-Panel--stalled .aa-Source {\n      filter: grayscale(1);\n      opacity: 0.8;\n    }\n    .aa-Panel--scrollable {\n      margin: 0;\n      max-height: 650px;\n      max-height: var(--aa-panel-max-height);\n      overflow-x: hidden;\n      overflow-y: auto;\n      padding: 8px;\n      padding: var(--aa-spacing-half);\n      scrollbar-color: white #eaeaea;\n      scrollbar-color: rgba(\n          var(--aa-scrollbar-thumb-background-color-rgb),\n          var(--aa-scrollbar-thumb-background-color-alpha)\n        )\n        rgba(\n          var(--aa-scrollbar-track-background-color-rgb),\n          var(--aa-scrollbar-track-background-color-alpha)\n        );\n      scrollbar-width: thin;\n    }\n    .aa-Panel--scrollable::-webkit-scrollbar {\n      width: 13px;\n      width: var(--aa-scrollbar-width);\n    }\n    .aa-Panel--scrollable::-webkit-scrollbar-track {\n      background-color: #eaeaea;\n      background-color: rgba(\n        var(--aa-scrollbar-track-background-color-rgb),\n        var(--aa-scrollbar-track-background-color-alpha)\n      );\n    }\n    .aa-Panel--scrollable::-webkit-scrollbar-thumb {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-scrollbar-thumb-background-color-rgb),\n        var(--aa-scrollbar-thumb-background-color-alpha)\n      );\n      border-color: #eaeaea;\n      border-color: rgba(\n        var(--aa-scrollbar-track-background-color-rgb),\n        var(--aa-scrollbar-track-background-color-alpha)\n      );\n      border-radius: 9999px;\n      border-style: solid;\n      border-width: 3px 2px 3px 3px;\n    }\n    /* ---------------- */\n    /* 5. Sources */\n    /* Each source can be styled independently */\n    /* ---------------- */\n    .aa-Source {\n      margin: 0;\n      padding: 0;\n      position: relative;\n      width: 100%;\n      /* List of results inside the source */\n      /* Source title */\n      /* See all button */\n    }\n    .aa-Source:empty {\n      /* Hide empty section */\n      display: none;\n    }\n    .aa-SourceNoResults {\n      font-size: 1em;\n      margin: 0;\n      padding: 16px;\n      padding: var(--aa-spacing);\n    }\n    .aa-List {\n      list-style: none;\n      margin: 0;\n      padding: 0;\n      position: relative;\n    }\n    .aa-SourceHeader {\n      margin: 8px 0.5em 8px 0;\n      margin: var(--aa-spacing-half) 0.5em var(--aa-spacing-half) 0;\n      padding: 0;\n      position: relative;\n      /* Hide empty header */\n      /* Title typography */\n      /* Line separator */\n    }\n    .aa-SourceHeader:empty {\n      display: none;\n    }\n    .aa-SourceHeaderTitle {\n      background: white;\n      background: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      color: #3e34d3;\n      color: rgba(var(--aa-primary-color-rgb), 1);\n      display: inline-block;\n      font-size: 0.8em;\n      font-weight: 600;\n      font-weight: var(--aa-font-weight-semibold);\n      margin: 0;\n      padding: 0 8px 0 0;\n      padding: 0 var(--aa-spacing-half) 0 0;\n      position: relative;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-SourceHeaderLine {\n      border-bottom: solid 1px #3e34d3;\n      border-bottom: solid 1px rgba(var(--aa-primary-color-rgb), 1);\n      display: block;\n      height: 2px;\n      left: 0;\n      margin: 0;\n      opacity: 0.3;\n      padding: 0;\n      position: absolute;\n      right: 0;\n      top: 8px;\n      top: var(--aa-spacing-half);\n      z-index: 9998;\n      z-index: calc(var(--aa-base-z-index) - 1);\n    }\n    .aa-SourceFooterSeeAll {\n      background: linear-gradient(180deg, white, rgba(128, 126, 163, 0.14));\n      background: linear-gradient(\n        180deg,\n        rgba(var(--aa-background-color-rgb), var(--aa-background-color-alpha)),\n        rgba(128, 126, 163, 0.14)\n      );\n      border: 1px solid rgba(128, 126, 163, 0.6);\n      border: 1px solid\n        rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      border-radius: 5px;\n      box-shadow: inset 0 0 2px #fff, 0 2px 2px -1px rgba(76, 69, 88, 0.15);\n      color: inherit;\n      font-size: 0.95em;\n      font-weight: 500;\n      font-weight: var(--aa-font-weight-medium);\n      padding: 0.475em 1em 0.6em;\n      text-decoration: none;\n    }\n    .aa-SourceFooterSeeAll:focus,\n    .aa-SourceFooterSeeAll:hover {\n      border: 1px solid #3e34d3;\n      border: 1px solid #cccccc;\n      color: #3e34d3;\n      color: rgba(var(--aa-primary-color-rgb), 1);\n    }\n    /* ---------------- */\n    /* 6. Hit Layout */\n    /* ---------------- */\n    .aa-Item {\n      align-items: center;\n      border-radius: 3px;\n      cursor: pointer;\n      display: grid;\n      min-height: 40px;\n      min-height: calc(var(--aa-spacing) * 2.5);\n      padding: 4px;\n      padding: calc(var(--aa-spacing-half) / 2);\n      /* When the result is active */\n      /* The result type icon inlined SVG or image */\n      /* wrap hit with url but we don't need to see it */\n      /* Secondary click actions */\n    }\n    .aa-Item[aria-selected='true'] {\n      background-color: rgba(179, 173, 214, 0.205);\n      background-color: rgba(\n        var(--aa-selected-color-rgb),\n        var(--aa-selected-color-alpha)\n      );\n    }\n    .aa-Item[aria-selected='true'] .aa-ItemActionButton,\n    .aa-Item[aria-selected='true'] .aa-ActiveOnly {\n      visibility: visible;\n    }\n    .aa-ItemIcon {\n      align-items: center;\n      background: white;\n      background: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      border-radius: 3px;\n      box-shadow: inset 0 0 0 1px rgba(128, 126, 163, 0.3);\n      box-shadow: inset 0 0 0 1px\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n      color: #7777a3;\n      color: rgba(var(--aa-icon-color-rgb), var(--aa-icon-color-alpha));\n      display: flex;\n      flex-shrink: 0;\n      font-size: 0.7em;\n      height: 28px;\n      height: calc(var(--aa-icon-size) + var(--aa-spacing-half));\n      justify-content: center;\n      overflow: hidden;\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      text-align: center;\n      width: 28px;\n      width: calc(var(--aa-icon-size) + var(--aa-spacing-half));\n    }\n    .aa-ItemIcon img {\n      height: auto;\n      max-height: 20px;\n      max-height: calc(var(--aa-icon-size) + var(--aa-spacing-half) - 8px);\n      max-width: 20px;\n      max-width: calc(var(--aa-icon-size) + var(--aa-spacing-half) - 8px);\n      width: auto;\n    }\n    .aa-ItemIcon svg {\n      height: 20px;\n      height: var(--aa-icon-size);\n      width: 20px;\n      width: var(--aa-icon-size);\n    }\n    .aa-ItemIcon--alignTop {\n      align-self: flex-start;\n    }\n    .aa-ItemIcon--noBorder {\n      background: none;\n      box-shadow: none;\n    }\n    .aa-ItemIcon--picture {\n      height: 96px;\n      width: 96px;\n    }\n    .aa-ItemIcon--picture img {\n      max-height: 100%;\n      max-width: 100%;\n      padding: 8px;\n      padding: var(--aa-spacing-half);\n    }\n    .aa-ItemContent {\n      align-items: center;\n      cursor: pointer;\n      display: grid;\n      grid-gap: 8px;\n      gap: 8px;\n      grid-gap: var(--aa-spacing-half);\n      gap: var(--aa-spacing-half);\n      grid-auto-flow: column;\n      line-height: 1.25em;\n      overflow: hidden;\n    }\n    .aa-ItemContent:empty {\n      display: none;\n    }\n    .aa-ItemContent mark {\n      background: none;\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-style: normal;\n      font-weight: 700;\n      font-weight: var(--aa-font-weight-bold);\n    }\n    .aa-ItemContent--dual {\n      display: flex;\n      flex-direction: column;\n      justify-content: space-between;\n      text-align: left;\n    }\n    .aa-ItemContent--dual .aa-ItemContentTitle,\n    .aa-ItemContent--dual .aa-ItemContentSubtitle {\n      display: block;\n    }\n    .aa-ItemContent--indented {\n      padding-left: 36px;\n      padding-left: calc(var(--aa-icon-size) + var(--aa-spacing));\n    }\n    .aa-ItemContentBody {\n      display: grid;\n      grid-gap: 4px;\n      gap: 4px;\n      grid-gap: calc(var(--aa-spacing-half) / 2);\n      gap: calc(var(--aa-spacing-half) / 2);\n    }\n    .aa-ItemContentTitle {\n      ", "\n      display: inline-block;\n      margin: 0 0.5em 0 0;\n      max-width: 100%;\n      overflow: hidden;\n      padding: 0;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n    .aa-ItemContentSubtitle {\n      font-size: 0.92em;\n    }\n    .aa-ItemContentSubtitleIcon::before {\n      border-color: rgba(128, 126, 163, 0.64);\n      border-color: rgba(var(--aa-muted-color-rgb), 0.64);\n      border-style: solid;\n      content: '';\n      display: inline-block;\n      left: 1px;\n      position: relative;\n      top: -3px;\n    }\n    .aa-ItemContentSubtitle--inline .aa-ItemContentSubtitleIcon::before {\n      border-width: 0 0 1.5px;\n      margin-left: 8px;\n      margin-left: var(--aa-spacing-half);\n      margin-right: 4px;\n      margin-right: calc(var(--aa-spacing-half) / 2);\n      width: 10px;\n      width: calc(var(--aa-spacing-half) + 2px);\n    }\n    .aa-ItemContentSubtitle--standalone {\n      align-items: center;\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      display: grid;\n      grid-gap: 8px;\n      gap: 8px;\n      grid-gap: var(--aa-spacing-half);\n      gap: var(--aa-spacing-half);\n      grid-auto-flow: column;\n      justify-content: start;\n    }\n    .aa-ItemContentSubtitle--standalone .aa-ItemContentSubtitleIcon::before {\n      border-radius: 0 0 0 3px;\n      border-width: 0 0 1.5px 1.5px;\n      height: 8px;\n      height: var(--aa-spacing-half);\n      width: 8px;\n      width: var(--aa-spacing-half);\n    }\n    .aa-ItemContentSubtitleCategory {\n      color: #807ea3;\n      color: rgba(var(--aa-muted-color-rgb), 1);\n      font-weight: 500;\n    }\n    .aa-ItemContentDescription {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-size: 0.85em;\n      max-width: 100%;\n      overflow-x: hidden;\n      text-overflow: ellipsis;\n    }\n    .aa-ItemContentDescription:empty {\n      display: none;\n    }\n    .aa-ItemContentDescription mark {\n      background: rgba(245, 223, 77, 0.5);\n      background: rgba(\n        var(--aa-description-highlight-background-color-rgb),\n        var(--aa-description-highlight-background-color-alpha)\n      );\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-style: normal;\n      font-weight: 500;\n      font-weight: var(--aa-font-weight-medium);\n    }\n    .aa-ItemContentDash {\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      display: none;\n      opacity: 0.4;\n    }\n    .aa-ItemContentTag {\n      background-color: rgba(62, 52, 211, 0.2);\n      background-color: rgba(\n        var(--aa-primary-color-rgb),\n        var(--aa-primary-color-alpha)\n      );\n      border-radius: 3px;\n      margin: 0 0.4em 0 0;\n      padding: 0.08em 0.3em;\n    }\n    .aa-ItemWrapper,\n    .aa-ItemLink {\n      align-items: center;\n      color: inherit;\n      display: grid;\n      grid-gap: 4px;\n      gap: 4px;\n      grid-gap: calc(var(--aa-spacing-half) / 2);\n      gap: calc(var(--aa-spacing-half) / 2);\n      grid-auto-flow: column;\n      justify-content: space-between;\n      width: 100%;\n    }\n    .aa-ItemLink {\n      color: inherit;\n      text-decoration: none;\n    }\n    .aa-ItemActions {\n      display: grid;\n      grid-auto-flow: column;\n      height: 100%;\n      justify-self: end;\n      margin: 0 -5.3333333333px;\n      margin: 0 calc(var(--aa-spacing) / -3);\n      padding: 0 2px 0 0;\n    }\n    .aa-ItemActionButton {\n      align-items: center;\n      background: none;\n      border: 0;\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      cursor: pointer;\n      display: flex;\n      flex-shrink: 0;\n      padding: 0;\n    }\n    .aa-ItemActionButton:hover svg,\n    .aa-ItemActionButton:focus svg {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    }\n    @media (hover: none) and (pointer: coarse) {\n      .aa-ItemActionButton:hover svg,\n      .aa-ItemActionButton:focus svg {\n        color: inherit;\n      }\n    }\n    .aa-ItemActionButton svg {\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      margin: 0;\n      margin: 5.3333333333px;\n      margin: calc(var(--aa-spacing) / 3);\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      width: 20px;\n      width: var(--aa-action-icon-size);\n    }\n    .aa-ActiveOnly {\n      visibility: hidden;\n    }\n    /*---------------- */\n    /* 7. Panel Header */\n    /*---------------- */\n    .aa-PanelHeader {\n      align-items: center;\n      background: #3e34d3;\n      background: rgba(var(--aa-primary-color-rgb), 1);\n      color: #fff;\n      display: grid;\n      height: var(--aa-modal-header-height);\n      margin: 0;\n      padding: 8px 16px;\n      padding: var(--aa-spacing-half) var(--aa-spacing);\n      position: relative;\n    }\n    .aa-PanelHeader::after {\n      background-image: linear-gradient(white, rgba(255, 255, 255, 0));\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 1),\n        rgba(var(--aa-background-color-rgb), 0)\n      );\n      bottom: -8px;\n      bottom: calc(var(--aa-spacing-half) * -1);\n      content: '';\n      height: 8px;\n      height: var(--aa-spacing-half);\n      left: 0;\n      pointer-events: none;\n      position: absolute;\n      right: 0;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    /*---------------- */\n    /* 8. Panel Footer */\n    /*---------------- */\n    .aa-PanelFooter {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      box-shadow: inset 0 1px 0 rgba(128, 126, 163, 0.3);\n      box-shadow: inset 0 1px 0\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n      display: flex;\n      justify-content: space-between;\n      margin: 0;\n      padding: 16px;\n      padding: var(--aa-spacing);\n      position: relative;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-PanelFooter::after {\n      background-image: linear-gradient(\n        rgba(255, 255, 255, 0),\n        rgba(128, 126, 163, 0.6)\n      );\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 0),\n        rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha))\n      );\n      content: '';\n      height: 16px;\n      height: var(--aa-spacing);\n      left: 0;\n      opacity: 0.12;\n      pointer-events: none;\n      position: absolute;\n      right: 0;\n      top: -16px;\n      top: calc(var(--aa-spacing) * -1);\n      z-index: 9998;\n      z-index: calc(var(--aa-base-z-index) - 1);\n    }\n    /*---------------- */\n    /* 9. Detached Mode */\n    /*---------------- */\n    .aa-DetachedContainer {\n      background: white;\n      background: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      bottom: 0;\n      box-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n        0 6px 16px -4px rgba(35, 38, 59, 0.15);\n      box-shadow: var(--aa-panel-shadow);\n      display: flex;\n      flex-direction: column;\n      left: 0;\n      margin: 0;\n      overflow: hidden;\n      padding: 0;\n      position: fixed;\n      right: 0;\n      top: 0;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-DetachedContainer::after {\n      height: 32px;\n    }\n    .aa-DetachedContainer .aa-SourceHeader {\n      margin: 8px 0 8px 2px;\n      margin: var(--aa-spacing-half) 0 var(--aa-spacing-half) 2px;\n    }\n    .aa-DetachedContainer .aa-Panel {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      border-radius: 0;\n      box-shadow: none;\n      flex-grow: 1;\n      margin: 0;\n      padding: 0;\n      position: relative;\n    }\n    .aa-DetachedContainer .aa-PanelLayout {\n      bottom: 0;\n      box-shadow: none;\n      left: 0;\n      margin: 0;\n      max-height: none;\n      overflow-y: auto;\n      position: absolute;\n      right: 0;\n      top: 0;\n      width: 100%;\n    }\n    .aa-DetachedFormContainer {\n      border-bottom: solid 1px rgba(128, 126, 163, 0.3);\n      border-bottom: solid 1px\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n      display: flex;\n      flex-direction: row;\n      justify-content: space-between;\n      margin: 0;\n      padding: 8px;\n      padding: var(--aa-spacing-half);\n    }\n    .aa-DetachedCancelButton {\n      background: none;\n      border: 0;\n      border-radius: 3px;\n      color: inherit;\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      cursor: pointer;\n      font: inherit;\n      margin: 0 0 0 8px;\n      margin: 0 0 0 var(--aa-spacing-half);\n      padding: 0 8px;\n      padding: 0 var(--aa-spacing-half);\n    }\n    .aa-DetachedCancelButton:hover,\n    .aa-DetachedCancelButton:focus {\n      box-shadow: inset 0 0 0 1px rgba(128, 126, 163, 0.3);\n      box-shadow: inset 0 0 0 1px\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n    }\n    .aa-DetachedContainer--modal {\n      border-radius: 6px;\n      bottom: inherit;\n      height: auto;\n      margin: 0 auto;\n      max-width: 680px;\n      max-width: var(--aa-detached-modal-max-width);\n      position: absolute;\n      top: 3%;\n    }\n    .aa-DetachedContainer--modal .aa-PanelLayout {\n      max-height: 500px;\n      max-height: var(--aa-detached-modal-max-height);\n      padding-bottom: 8px;\n      padding-bottom: var(--aa-spacing-half);\n      position: static;\n    }\n    /* Search Button */\n    .aa-DetachedSearchButton {\n      align-items: center;\n      background-color: white;\n      background-color: rgba(\n        var(--aa-input-background-color-rgb),\n        var(--aa-input-background-color-alpha)\n      );\n      border: 1px solid rgba(128, 126, 163, 0.8);\n      border: 1px solid\n        rgba(\n          var(--aa-input-border-color-rgb),\n          var(--aa-input-border-color-alpha)\n        );\n      border-radius: 3px;\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      cursor: pointer;\n      display: flex;\n      font: inherit;\n      font-family: inherit;\n      font-family: var(--aa-font-family);\n      font-size: 16px;\n      font-size: var(--aa-font-size);\n      height: 44px;\n      height: var(--aa-search-input-height);\n      margin: 0;\n      padding: 0 5.5px;\n      padding: 0 calc(var(--aa-search-input-height) / 8);\n      position: relative;\n      text-align: left;\n      width: 100%;\n    }\n    .aa-DetachedSearchButton:focus {\n      border-color: #3e34d3;\n      border-color: rgba(var(--aa-primary-color-rgb), 1);\n      box-shadow: rgba(62, 52, 211, 0.2) 0 0 0 3px,\n        inset rgba(62, 52, 211, 0.2) 0 0 0 2px;\n      box-shadow: rgba(\n            var(--aa-primary-color-rgb),\n            var(--aa-primary-color-alpha)\n          )\n          0 0 0 3px,\n        inset rgba(var(--aa-primary-color-rgb), var(--aa-primary-color-alpha)) 0\n          0 0 2px;\n      outline: currentColor none medium;\n    }\n    .aa-DetachedSearchButtonIcon {\n      align-items: center;\n      color: #3e34d3;\n      color: rgba(var(--aa-primary-color-rgb), 1);\n      cursor: auto;\n      cursor: initial;\n      display: flex;\n      height: 100%;\n      justify-content: center;\n      width: 36px;\n      width: calc(var(--aa-icon-size) + var(--aa-spacing));\n    }\n    .aa-Detached {\n      height: 100vh;\n      overflow: hidden;\n    }\n    .aa-DetachedOverlay {\n      background-color: rgba(115, 114, 129, 0.4);\n      background-color: rgba(\n        var(--aa-overlay-color-rgb),\n        var(--aa-overlay-color-alpha)\n      );\n      height: 100vh;\n      left: 0;\n      margin: 0;\n      padding: 0;\n      position: fixed;\n      right: 0;\n      top: 0;\n      z-index: 9998;\n      z-index: calc(var(--aa-base-z-index) - 1);\n    }\n    /*---------------- */\n    /* 10. Gradients */\n    /*---------------- */\n    .aa-GradientTop,\n    .aa-GradientBottom {\n      height: 8px;\n      height: var(--aa-spacing-half);\n      left: 0;\n      pointer-events: none;\n      position: absolute;\n      right: 0;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-GradientTop {\n      background-image: linear-gradient(white, rgba(255, 255, 255, 0));\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 1),\n        rgba(var(--aa-background-color-rgb), 0)\n      );\n      top: 0;\n    }\n    .aa-GradientBottom {\n      background-image: linear-gradient(rgba(255, 255, 255, 0), white);\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 0),\n        rgba(var(--aa-background-color-rgb), 1)\n      );\n      border-bottom-left-radius: 4px;\n      border-bottom-left-radius: calc(var(--aa-spacing) / 4);\n      border-bottom-right-radius: 4px;\n      border-bottom-right-radius: calc(var(--aa-spacing) / 4);\n      bottom: 0;\n    }\n    /*---------------- */\n    /* 11. Utilities */\n    /*---------------- */\n    @media (hover: none) and (pointer: coarse) {\n      .aa-DesktopOnly {\n        display: none;\n      }\n    }\n    @media (hover: hover) {\n      .aa-TouchOnly {\n        display: none;\n      }\n    }\n  "])), overrides.border.style, (0, newskit_1.getColorCssFromTheme)('border-color', overrides.border.color)({ theme: theme }), overrides.icon.position === 'left'
+        ? 'row-reverse'
+        : 'row', (0, newskit_1.getColorCssFromTheme)('border-color', overrides.border.color)({ theme: theme }), (0, newskit_1.getColorCssFromTheme)('border-color', overrides.border.color)({ theme: theme }), (0, newskit_1.getColorCssFromTheme)('color', overrides.icon.color)({ theme: theme }), (0, newskit_1.getColorCssFromTheme)('fill', overrides.icon.color)({ theme: theme }), (0, newskit_1.getColorCssFromTheme)('color', overrides.color)({ theme: theme }), (0, newskit_1.getColorCssFromTheme)('color', overrides.placeholder.color)({ theme: theme }), (0, newskit_1.getColorCssFromTheme)('color', overrides.placeholder.color)({ theme: theme }), (0, newskit_1.getColorCssFromTheme)('color', overrides.autocomplete.color)({ theme: theme }));
+};
+exports.getAlgoliaStyling = getAlgoliaStyling;
 var templateObject_1;
 //# sourceMappingURL=AlgoliaTheme.js.map

package/dist/cjs/help-hub/components/SearchBar/components/AlgoliaTheme.js.map

@@ -1 +1 @@
-{"version":3,"file":"AlgoliaTheme.js","sourceRoot":"","sources":["../../../../../../src/help-hub/components/SearchBar/components/AlgoliaTheme.tsx"],"names":[],"mappings":";;;;;;;AAAA,mCAA6B;AAEhB,QAAA,cAAc,OAAG,aAAG,2p/BAAA,ul/BAonChC,KAAA"}
+{"version":3,"file":"AlgoliaTheme.js","sourceRoot":"","sources":["../../../../../../src/help-hub/components/SearchBar/components/AlgoliaTheme.tsx"],"names":[],"mappings":";;;;;;;AAAA,mCAA0D;AAGnD,IAAM,iBAAiB,GAAG,UAC/B,SAA6B,EAC7B,KAAY;IAEZ,WAAO,aAAG,q/iCAAA,shLA4JI,EAAsB,WAC9B,EAGU,4EAGM,EAET,0IAOP,EAGU,+CAGV,EAGU,ofAsBV,EAA8D,UAC9D,EAA6D,+rDAiE7D,EAAyD,iWAWzD,EAAqE,yRAYrE,EAAqE,ktWA2YrE,EAAsE,4mbAyd3E,KA5+Ba,SAAS,CAAC,MAAM,CAAC,KAAK,EAC9B,IAAA,8BAAoB,EACpB,cAAc,EACd,SAAS,CAAC,MAAM,CAAC,KAAK,CACvB,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAGM,SAAS,CAAC,IAAI,CAAC,QAAQ,KAAK,MAAM;QAClD,CAAC,CAAC,aAAa;QACf,CAAC,CAAC,KAAK,EAOP,IAAA,8BAAoB,EACpB,cAAc,EACd,SAAS,CAAC,MAAM,CAAC,KAAK,CACvB,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAGV,IAAA,8BAAoB,EACpB,cAAc,EACd,SAAS,CAAC,MAAM,CAAC,KAAK,CACvB,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAsBV,IAAA,8BAAoB,EAAC,OAAO,EAAE,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAC9D,IAAA,8BAAoB,EAAC,MAAM,EAAE,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAiE7D,IAAA,8BAAoB,EAAC,OAAO,EAAE,SAAS,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAWzD,IAAA,8BAAoB,EAAC,OAAO,EAAE,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAYrE,IAAA,8BAAoB,EAAC,OAAO,EAAE,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EA2YrE,IAAA,8BAAoB,EAAC,OAAO,EAAE,SAAS,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAyd3E;AACH,CAAC,CAAA;AA7oCY,QAAA,iBAAiB,qBA6oC7B"}

package/dist/cjs/help-hub/components/SearchBar/defaults.d.ts

@@ -0,0 +1,17 @@
+export declare const searchBarDefaults: {
+    color: string;
+    placeholder: {
+        color: string;
+        typographyPreset: string;
+    };
+    icon: {
+        color: string;
+        position: "right";
+    };
+    autocomplete: {
+        color: string;
+    };
+    border: {
+        color: string;
+    };
+};

package/dist/cjs/help-hub/components/SearchBar/defaults.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.searchBarDefaults = void 0;
+exports.searchBarDefaults = {
+    color: 'inkBase',
+    placeholder: {
+        color: 'inkSubtle',
+        typographyPreset: 'utilityBody030',
+    },
+    icon: {
+        color: 'inkBrand010',
+        position: 'right',
+    },
+    autocomplete: {
+        color: 'interactivePrimary030',
+    },
+    border: {
+        color: 'interactiveInput020',
+    },
+};
+//# sourceMappingURL=defaults.js.map

package/dist/cjs/help-hub/components/SearchBar/defaults.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"defaults.js","sourceRoot":"","sources":["../../../../../src/help-hub/components/SearchBar/defaults.ts"],"names":[],"mappings":";;;AAAa,QAAA,iBAAiB,GAAG;IAC/B,KAAK,EAAE,SAAS;IAChB,WAAW,EAAE;QACX,KAAK,EAAE,WAAW;QAClB,gBAAgB,EAAE,gBAAgB;KACnC;IACD,IAAI,EAAE;QACJ,KAAK,EAAE,aAAa;QACpB,QAAQ,EAAE,OAAgB;KAC3B;IACD,YAAY,EAAE;QACZ,KAAK,EAAE,uBAAuB;KAC/B;IACD,MAAM,EAAE;QACN,KAAK,EAAE,qBAAqB;KAC7B;CACF,CAAA"}

package/dist/cjs/help-hub/components/SearchBar/types.d.ts

@@ -1,4 +1,25 @@
+import { MQ } from 'newskit';
 export type SearchBarProps = {
     placeholder?: string;
     baseUrl?: string;
+    overrides: SearchBarOverrides;
+};
+export type SearchBarOverrides = {
+    marginBlockEnd?: MQ<string>;
+    color: string;
+    placeholder: {
+        color: string;
+        typographyPreset: string;
+    };
+    border: {
+        style: string;
+        color: string;
+    };
+    icon: {
+        color: string;
+        position: 'right' | 'left';
+    };
+    autocomplete: {
+        color: string;
+    };
 };

package/dist/cjs/help-hub/context/baseContext.js

@@ -65,7 +65,23 @@ exports.baseContext = {
         showDivider: false,
     },
     searchBar: {
-        spaceStack: { xs: 'space060', sm: 'space080' },
+        marginBlockEnd: { xs: 'space060', sm: 'space080' },
+        color: 'inkBase',
+        placeholder: {
+            color: 'inkSubtle',
+            typographyPreset: 'utilityBody030',
+        },
+        icon: {
+            color: 'inkBrand010',
+            position: 'right',
+        },
+        autocomplete: {
+            color: 'interactivePrimary030',
+        },
+        border: {
+            style: '1px solid',
+            color: 'interactiveInput020',
+        },
     },
     contentListView: {
         introduction: {

package/dist/cjs/help-hub/context/baseContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"baseContext.js","sourceRoot":"","sources":["../../../../src/help-hub/context/baseContext.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"baseContext.js","sourceRoot":"","sources":["../../../../src/help-hub/context/baseContext.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/help-hub/context/types.d.ts

@@ -1,4 +1,5 @@
 import { FooterContext, FooterContextOverrides, HeaderProps, NavigationPrimaryProps, SEOProps } from '@newskit-render/shared-components';
+import { SearchBarOverrides } from '../components/SearchBar/types';
 import { MQ } from 'newskit';
 import { ReactNode } from 'react';
 import { Hit } from '../types';
@@ -30,9 +31,6 @@ export interface BaseContextOptions {
     searchResultEmpty: string;
     spaceStack: MQ<string>;
 }
-interface SearchBarOverrides {
-    spaceStack: MQ<string>;
-}
 interface ContentListViewOverrides {
     introduction: {
         spaceStack: string;

package/dist/cjs/help-hub/context/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/help-hub/context/types.ts"],"names":[],"mappings":";;;AAiBA,IAAY,YAIX;AAJD,WAAY,YAAY;IACtB,2CAA6B,CAAA;IAC7B,2CAA6B,CAAA;IAC7B,2CAA6B,CAAA;AAC/B,CAAC,EAJW,YAAY,GAAZ,oBAAY,KAAZ,oBAAY,QAIvB"}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/help-hub/context/types.ts"],"names":[],"mappings":";;;AAkBA,IAAY,YAIX;AAJD,WAAY,YAAY;IACtB,2CAA6B,CAAA;IAC7B,2CAA6B,CAAA;IAC7B,2CAA6B,CAAA;AAC/B,CAAC,EAJW,YAAY,GAAZ,oBAAY,KAAZ,oBAAY,QAIvB"}

package/dist/cjs/help-hub/pages/ArticlePage.js

@@ -36,7 +36,7 @@ exports.articlePageContext = {
     },
 };
 var PageContent = function () {
-    var _a = (0, context_1.useHelpHubContext)(types_1.PagesNameMap.articlePage), title = _a.title, introductionProps = _a.introductionProps, content = _a.content, inputPlaceholder = _a.inputPlaceholder, articleNotFound = _a.articleNotFound, baseUrl = _a.baseUrl;
+    var _a = (0, context_1.useHelpHubContext)(types_1.PagesNameMap.articlePage), title = _a.title, introductionProps = _a.introductionProps, content = _a.content, inputPlaceholder = _a.inputPlaceholder, articleNotFound = _a.articleNotFound, baseUrl = _a.baseUrl, searchBar = _a.searchBar;
     var xssOptions = {
         whiteList: { p: [], a: ['href'], br: [], img: [], b: [], strong: [] },
         stripIgnoreTag: true,
@@ -45,7 +45,7 @@ var PageContent = function () {
     var sanitizedArticleContent = (0, xss_1.default)(content, xssOptions);
     var hasContent = sanitizedArticleContent.replace(/\s/g, '').length;
     return hasContent ? (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(SearchBar_1.SearchBar, { placeholder: inputPlaceholder, baseUrl: baseUrl }),
+        react_1.default.createElement(SearchBar_1.SearchBar, { placeholder: inputPlaceholder, baseUrl: baseUrl, overrides: searchBar }),
         react_1.default.createElement(newskit_1.Block, { spaceStack: { xs: 'space070' } }),
         react_1.default.createElement(shared_components_1.Introduction, __assign({ title: title }, introductionProps, { innerHTML: sanitizedArticleContent })),
         react_1.default.createElement(newskit_1.Block, { spaceStack: { xs: 'space070' } }))) : (react_1.default.createElement(newskit_1.GridLayout, { rowGap: 'space060', alignContent: "center", overrides: {
@@ -53,7 +53,7 @@ var PageContent = function () {
             marginBlockEnd: 'space070',
         } },
         react_1.default.createElement(shared_components_1.Introduction, { title: articleNotFound, titleOverrides: introductionProps.titleOverrides }),
-        react_1.default.createElement(SearchBar_1.SearchBar, { placeholder: inputPlaceholder })));
+        react_1.default.createElement(SearchBar_1.SearchBar, { placeholder: inputPlaceholder, overrides: searchBar })));
 };
 exports.PageContent = PageContent;
 var ArticlePage = function (_a) {

package/dist/cjs/help-hub/pages/ArticlePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"ArticlePage.js","sourceRoot":"","sources":["../../../../src/help-hub/pages/ArticlePage.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ArticlePage.js","sourceRoot":"","sources":["../../../../src/help-hub/pages/ArticlePage.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/help-hub/pages/LandingPage.js

@@ -43,8 +43,8 @@ var PageContent = function () {
     var _a = (0, context_1.useHelpHubContext)(types_1.PagesNameMap.landingPage), baseUrl = _a.baseUrl, header = _a.header, inputPlaceholder = _a.inputPlaceholder, articlesTabelInfo = _a.articlesTabelInfo, mostReadArticles = _a.mostReadArticles, searchBar = _a.searchBar, spaceStack = _a.spaceStack;
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(shared_components_1.Header, __assign({}, header)),
-        react_1.default.createElement(SearchBar_1.SearchBar, { placeholder: inputPlaceholder, baseUrl: baseUrl }),
-        react_1.default.createElement(newskit_1.Block, { spaceStack: searchBar.spaceStack }),
+        react_1.default.createElement(SearchBar_1.SearchBar, { placeholder: inputPlaceholder, baseUrl: baseUrl, overrides: searchBar }),
+        react_1.default.createElement(newskit_1.Block, { spaceStack: searchBar.marginBlockEnd }),
         react_1.default.createElement(shared_components_1.Introduction, __assign({}, articlesTabelInfo)),
         react_1.default.createElement(shared_components_1.ContentListView, { spaceStack: "space010" }, (0, helpers_1.transformHits)(mostReadArticles, baseUrl).map(function (item, i) {
             return (react_1.default.createElement(shared_components_1.ListItem, { key: i, item: item, listItemProps: {