@charset "UTF-8";
/***** Normalize.css *****/
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
}

main {
  display: block;
}

h1 {
  font-size: 2em;
  margin: 0.67em 0;
  color: #f7921d
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

pre {
  font-family: monospace, monospace;
  font-size: 1em;
}

a {
  background-color: transparent;
}

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted;
}

b,
strong {
  font-weight: bolder;
}

code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

img {
  border-style: none;
}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}

button,
input {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
}

progress {
  vertical-align: baseline;
}

textarea {
  overflow: auto;
}

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

details {
  display: block;
}

summary {
  display: list-item;
}

template {
  display: none;
}

[hidden] {
  display: none;
}

/***** Base *****/
* {
  box-sizing: border-box;
}

body {
  background-color: #FFFFFF;
  color: rgba(5, 5, 5, 1);
  font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

@media (min-width: 1024px) {
  body > main {
    min-height: 65vh;
  }
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
  margin-top: 0;
}

h1 {
  font-size: 32px;
  color: #f7921d
}

h2 {
  font-size: 22px;
}

h3 {
  font-size: 18px;
  font-weight: 600;
}

h4 {
  font-size: 16px;
}

a {
  color: rgba(0, 156, 220, 1);
  text-decoration: none;
}

a:visited {
  color: rgba(153, 51, 204, 1);
}

a:hover, a:active, a:focus {
  text-decoration: underline;
}

input,
textarea {
  color: #000;
  font-size: 14px;
}

input {
  max-width: 100%;
  box-sizing: border-box;
  transition: border 0.12s ease-in-out;
}

input:not([type="checkbox"]) {
  outline: none;
}

input:not([type="checkbox"]):focus {
  border: 1px solid rgba(0, 156, 220, 1);
}

input[disabled] {
  background-color: #ddd;
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23CCC' d='M0 0h10L5 6 0 0z'/%3E%3C/svg%3E%0A") no-repeat #fff;
  background-position: right 10px center;
  border: 1px solid #87929D;
  border-radius: 4px;
  padding: 8px 30px 8px 10px;
  outline: none;
  color: #555;
  width: 100%;
}

select:focus {
  border: 1px solid rgba(0, 156, 220, 1);
}

select::-ms-expand {
  display: none;
}

textarea {
  border: 1px solid #87929D;
  border-radius: 2px;
  resize: vertical;
  width: 100%;
  outline: none;
  padding: 10px;
}

textarea:focus {
  border: 1px solid rgba(0, 156, 220, 1);
}

.container {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 5%;
}

@media (min-width: 1160px) {
  .container {
    padding: 0;
    width: 90%;
  }
}

.container-divider {
  border-top: 1px solid #ddd;
  margin-bottom: 20px;
}

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.error-page {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 5%;
}

@media (min-width: 1160px) {
  .error-page {
    padding: 0;
    width: 90%;
  }
}

.visibility-hidden {
  border: 0;
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;
}

/***** Buttons *****/
.button, .split-button button, .section-subscribe button, .article-subscribe button, .community-follow button, .requests-table-toolbar .organization-subscribe button, .subscriptions-subscribe button, .pagination-next-link, .pagination-prev-link, .pagination-first-link, .pagination-last-link {
  background-color: transparent;
  border: 1px solid rgba(0, 156, 220, 1);
  border-radius: 4px;
  color: rgba(0, 156, 220, 1);
  cursor: pointer;
  display: inline-block;
  font-size: 12px;
  line-height: 2.34;
  margin: 0;
  padding: 0 20px;
  text-align: center;
  transition: background-color .12s ease-in-out, border-color .12s ease-in-out, color .15s ease-in-out;
  user-select: none;
  white-space: nowrap;
  width: 100%;
  -webkit-touch-callout: none;
}

@media (min-width: 768px) {
  .button, .split-button button, .section-subscribe button, .article-subscribe button, .community-follow button, .requests-table-toolbar .organization-subscribe button, .subscriptions-subscribe button, .pagination-next-link, .pagination-prev-link, .pagination-first-link, .pagination-last-link {
    width: auto;
  }
}

.button:visited, .split-button button:visited, .section-subscribe button:visited, .article-subscribe button:visited, .community-follow button:visited, .requests-table-toolbar .organization-subscribe button:visited, .subscriptions-subscribe button:visited, .pagination-next-link:visited, .pagination-prev-link:visited, .pagination-first-link:visited, .pagination-last-link:visited {
  color: rgba(0, 156, 220, 1);
}

.button:hover, .split-button button:hover, .section-subscribe button:hover, .article-subscribe button:hover, .community-follow button:hover, .requests-table-toolbar .organization-subscribe button:hover, .subscriptions-subscribe button:hover, .pagination-next-link:hover, .pagination-prev-link:hover, .pagination-first-link:hover, .pagination-last-link:hover, .button:active, .split-button button:active, .section-subscribe button:active, .article-subscribe button:active, .community-follow button:active, .requests-table-toolbar .organization-subscribe button:active, .subscriptions-subscribe button:active, .pagination-next-link:active, .pagination-prev-link:active, .pagination-first-link:active, .pagination-last-link:active, .button:focus, .split-button button:focus, .section-subscribe button:focus, .article-subscribe button:focus, .community-follow button:focus, .requests-table-toolbar .organization-subscribe button:focus, .subscriptions-subscribe button:focus, .pagination-next-link:focus, .pagination-prev-link:focus, .pagination-first-link:focus, .pagination-last-link:focus, .button.button-primary, .split-button button.button-primary, .section-subscribe button.button-primary, .section-subscribe button[data-selected="true"], .article-subscribe button.button-primary, .article-subscribe button[data-selected="true"], .community-follow button.button-primary, .requests-table-toolbar .organization-subscribe button.button-primary, .requests-table-toolbar .organization-subscribe button[data-selected="true"], .subscriptions-subscribe button.button-primary, .subscriptions-subscribe button[data-selected="true"], .button-primary.pagination-next-link, .button-primary.pagination-prev-link, .button-primary.pagination-first-link, .button-primary.pagination-last-link {
  background-color: rgba(0, 156, 220, 1);
  color: #FFFFFF;
  text-decoration: none;
}

.button.button-primary:hover, .split-button button:hover, .section-subscribe button.button-primary:hover, .section-subscribe button:hover[data-selected="true"], .article-subscribe button.button-primary:hover, .article-subscribe button:hover[data-selected="true"], .community-follow button.button-primary:hover, .requests-table-toolbar .organization-subscribe button.button-primary:hover, .requests-table-toolbar .organization-subscribe button:hover[data-selected="true"], .subscriptions-subscribe button.button-primary:hover, .subscriptions-subscribe button:hover[data-selected="true"], .button-primary.pagination-next-link:hover, .button-primary.pagination-prev-link:hover, .button-primary.pagination-first-link:hover, .button-primary.pagination-last-link:hover, .button.button-primary:focus, .split-button button.button-primary:focus, .section-subscribe button.button-primary:focus, .section-subscribe button:focus[data-selected="true"], .article-subscribe button.button-primary:focus, .article-subscribe button:focus[data-selected="true"], .community-follow button.button-primary:focus, .requests-table-toolbar .organization-subscribe button.button-primary:focus, .requests-table-toolbar .organization-subscribe button:focus[data-selected="true"], .subscriptions-subscribe button.button-primary:focus, .subscriptions-subscribe button:focus[data-selected="true"], .button-primary.pagination-next-link:focus, .button-primary.pagination-prev-link:focus, .button-primary.pagination-first-link:focus, .button-primary.pagination-last-link:focus, .button.button-primary:active, .split-button button.button-primary:active, .section-subscribe button.button-primary:active, .section-subscribe button:active[data-selected="true"], .article-subscribe button.button-primary:active, .article-subscribe button:active[data-selected="true"], .community-follow button.button-primary:active, .requests-table-toolbar .organization-subscribe button.button-primary:active, .requests-table-toolbar .organization-subscribe button:active[data-selected="true"], .subscriptions-subscribe button.button-primary:active, .subscriptions-subscribe button:active[data-selected="true"], .button-primary.pagination-next-link:active, .button-primary.pagination-prev-link:active, .button-primary.pagination-first-link:active, .button-primary.pagination-last-link:active {
  background-color: #005476;
  border-color: #005476;
}

.button[data-disabled], .split-button button[data-disabled], .section-subscribe button[data-disabled], .article-subscribe button[data-disabled], .community-follow button[data-disabled], .requests-table-toolbar .organization-subscribe button[data-disabled], .subscriptions-subscribe button[data-disabled], .pagination-next-link[data-disabled], .pagination-prev-link[data-disabled], .pagination-first-link[data-disabled], .pagination-last-link[data-disabled] {
  cursor: default;
}

.button-large, input[type="submit"] {
  cursor: pointer;
  background-color: rgba(0, 156, 220, 1);
  border: 0;
  border-radius: 4px;
  color: #FFFFFF;
  font-size: 14px;
  line-height: 2.72;
  min-width: 190px;
  padding: 0 1.9286em;
  width: 100%;
}

@media (min-width: 768px) {
  .button-large, input[type="submit"] {
    width: auto;
  }
}

.button-large:visited, input[type="submit"]:visited {
  color: #FFFFFF;
}

.button-large:hover, .button-large:active, .button-large:focus, input[type="submit"]:hover, input[type="submit"]:active, input[type="submit"]:focus {
  background-color: #005476;
}

.button-large[disabled], input[type="submit"][disabled] {
  background-color: #ddd;
}

.button-secondary {
  color: #383838;
  border: 1px solid #87929D;
  background-color: transparent;
}

.button-secondary:visited {
  color: #383838;
}

.button-secondary:hover, .button-secondary:focus, .button-secondary:active {
  color: rgba(5, 5, 5, 1);
  border: 1px solid #87929D;
  background-color: #f7f7f7;
}

/***** Split button *****/
.split-button {
  display: flex;
}

.split-button button {
  background-color: rgba(0, 156, 220, 1);
  border: 0;
  color: #FFFFFF;
  height: 32px;
  line-height: 16px;
  outline-color: rgba(0, 156, 220, 1);
}

[dir="rtl"] .split-button button:not(:only-child):first-child {
  border-left: 1px solid #FFFFFF;
  border-top-left-radius: unset;
  border-bottom-left-radius: unset;
}

[dir="ltr"] .split-button button:not(:only-child):first-child {
  border-right: 1px solid #FFFFFF;
  border-top-right-radius: unset;
  border-bottom-right-radius: unset;
}

.split-button button:not(:only-child):last-child {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 26px;
  min-width: 26px;
  max-width: 26px;
  padding: 0;
}

[dir="rtl"] .split-button button:not(:only-child):last-child {
  border-top-right-radius: unset;
  border-bottom-right-radius: unset;
}

[dir="ltr"] .split-button button:not(:only-child):last-child {
  border-top-left-radius: unset;
  border-bottom-left-radius: unset;
}

/***** Tables *****/
.table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
}

@media (min-width: 768px) {
  .table {
    table-layout: auto;
  }
}

.table th,
.table th a {
  color: #383838;
  font-size: 13px;
  text-align: left;
}

[dir="rtl"] .table th, [dir="rtl"]
.table th a {
  text-align: right;
}

.table tr {
  border-bottom: 1px solid #ddd;
  display: block;
  padding: 20px 0;
}

@media (min-width: 768px) {
  .table tr {
    display: table-row;
  }
}

.table td {
  display: block;
}

@media (min-width: 768px) {
  .table td {
    display: table-cell;
  }
}

@media (min-width: 1024px) {
  .table td, .table th {
    padding: 20px 30px;
  }
}

@media (min-width: 768px) {
  .table td, .table th {
    padding: 10px 20px;
    height: 60px;
  }
}

/***** Forms *****/
.form {
  max-width: 650px;
}

.form-field ~ .form-field {
  margin-top: 25px;
}

.form-field label {
  display: block;
  font-size: 13px;
  margin-bottom: 5px;
}

.form-field input {
  border: 1px solid #87929D;
  border-radius: 4px;
  padding: 10px;
  width: 100%;
}

.form-field input:focus {
  border: 1px solid rgba(0, 156, 220, 1);
}

.form-field input[type="text"] {
  border: 1px solid #87929D;
  border-radius: 4px;
}

.form-field input[type="text"]:focus {
  border: 1px solid rgba(0, 156, 220, 1);
}

.form-field input[type="checkbox"] {
  width: auto;
}

.form-field .nesty-input {
  border-radius: 4px;
  border: 1px solid #87929D;
  height: 40px;
  line-height: 40px;
  outline: none;
  vertical-align: middle;
}

.form-field .nesty-input:focus {
  border: 1px solid rgba(0, 156, 220, 1);
  text-decoration: none;
}

.form-field .hc-multiselect-toggle {
  border: 1px solid #87929D;
}

.form-field .hc-multiselect-toggle:focus {
  outline: none;
  border: 1px solid rgba(0, 156, 220, 1);
  text-decoration: none;
}

.form-field textarea {
  vertical-align: middle;
}

.form-field input[type="checkbox"] + label {
  margin: 0 0 0 10px;
}

.form-field .optional {
  color: #383838;
  margin-left: 4px;
}

.form-field p {
  color: #383838;
  font-size: 12px;
  margin: 5px 0;
}

.form footer {
  margin-top: 40px;
  padding-top: 30px;
}

.form footer a {
  color: #383838;
  cursor: pointer;
  margin-right: 15px;
}

.form .suggestion-list {
  font-size: 13px;
  margin-top: 30px;
}

.form .suggestion-list label {
  border-bottom: 1px solid #ddd;
  display: block;
  padding-bottom: 5px;
}

.form .suggestion-list li {
  padding: 10px 0;
}

.form .suggestion-list li a:visited {
  color: rgba(153, 51, 204, 1);
}

/***** Header *****/
.header {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 5%;
  position: relative;
  align-items: center;
  display: flex;
  height: 71px;
  justify-content: space-between;
}

@media (min-width: 1160px) {
  .header {
    padding: 0;
    width: 90%;
  }
}

.logo img {
  max-height: 37px;
  vertical-align: middle;
}

.logo span {
  margin: 0 10px;
  color: rgba(0, 156, 220, 1);
}

.logo a {
  display: inline-block;
}

.logo a:hover, .logo a:focus, .logo a:active {
  text-decoration: none;
}

.user-nav {
  display: inline-block;
  position: absolute;
  white-space: nowrap;
}

@media (min-width: 768px) {
  .user-nav {
    position: relative;
  }
}

.user-nav[aria-expanded="true"] {
  background-color: #fff;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.15), 0 4px 10px 0 rgba(0, 0, 0, 0.1);
  border: solid 1px #ddd;
  right: 0;
  left: 0;
  top: 71px;
  z-index: 1;
}

.user-nav[aria-expanded="true"] > a {
  display: block;
  margin: 20px;
}

.user-nav[aria-expanded="true"] > .user-nav-list li {
  display: block;
}

.user-nav[aria-expanded="true"] > .user-nav-list a {
  display: block;
  margin: 20px;
}

.user-nav-list {
  display: block;
  list-style: none;
}

.user-nav-list > li {
  display: inline-block;
}

@media (max-width: 768px) {
  .nav-wrapper-desktop {
    display: none;
  }
}

@media (min-width: 768px) {
  .nav-wrapper-desktop {
    display: none;
  }
}

@media (min-width: 1024px) {
  .nav-wrapper-desktop {
    display: inline-block;
  }
}

.nav-wrapper-desktop a {
  border: 0;
  color: rgba(0, 156, 220, 1);
  display: none;
  font-size: 14px;
  padding: 0 20px 0 0;
  width: auto;
}

@media (min-width: 768px) {
  .nav-wrapper-desktop a {
    display: inline-block;
  }
}

[dir="rtl"] .nav-wrapper-desktop a {
  padding: 0 0 0 20px;
}

.nav-wrapper-desktop a:hover, .nav-wrapper-desktop a:focus, .nav-wrapper-desktop a:active {
  background-color: transparent;
  color: rgba(0, 156, 220, 1);
  text-decoration: underline;
}

@media (min-width: 1024px) {
  .nav-wrapper-mobile {
    display: none;
  }
}

.nav-wrapper-mobile .menu-button-mobile {
  background: none;
  border: 0;
  width: auto;
  min-width: 71px;
  cursor: pointer;
}

.nav-wrapper-mobile .menu-button-mobile .icon-menu {
  padding: 7px;
  vertical-align: middle;
  width: 30px;
  height: 30px;
  border-radius: 50%;
}

.nav-wrapper-mobile .menu-button-mobile[aria-expanded="true"] .icon-menu {
  background: #f3f3f3;
}

.nav-wrapper-mobile .menu-list-mobile {
  position: absolute;
  background-color: #fff;
  box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.15);
  border-top: solid 1px #ddd;
  border-bottom: solid 1px #ddd;
  right: 0;
  left: 0;
  top: 71px;
  z-index: 2;
}

.nav-wrapper-mobile .menu-list-mobile[aria-expanded="false"] {
  display: none;
}

.nav-wrapper-mobile .menu-list-mobile[aria-expanded="true"] {
  display: block;
}

.nav-wrapper-mobile .menu-list-mobile-items .item {
  margin: 4px 0;
}

.nav-wrapper-mobile .menu-list-mobile-items li:empty:not(.nav-divider) {
  display: none;
}

.nav-wrapper-mobile .menu-list-mobile-items .nav-divider {
  border-bottom: 0.1px solid #ddd;
  padding: 0;
}

.nav-wrapper-mobile .menu-list-mobile-items .nav-divider:last-child {
  display: none;
}

.nav-wrapper-mobile .menu-list-mobile-items button {
  background: none;
  border: none;
  padding: 8px 24px;
  width: 100%;
  height: 100%;
  color: rgba(5, 5, 5, 1);
  cursor: pointer;
  text-align: start;
}

.nav-wrapper-mobile .menu-list-mobile-items button:active, .nav-wrapper-mobile .menu-list-mobile-items button:focus, .nav-wrapper-mobile .menu-list-mobile-items button:hover {
  background-color: #f3f3f3;
  text-decoration: underline;
}

.nav-wrapper-mobile .menu-list-mobile-items a {
  display: block;
  padding: 8px 24px;
  width: 100%;
  height: 100%;
  color: rgba(5, 5, 5, 1);
}

.nav-wrapper-mobile .menu-list-mobile-items a:active, .nav-wrapper-mobile .menu-list-mobile-items a:focus, .nav-wrapper-mobile .menu-list-mobile-items a:hover {
  background-color: #f3f3f3;
}

.nav-wrapper-mobile .menu-list-mobile-items .my-profile {
  display: flex;
  line-height: 1.5;
}

.nav-wrapper-mobile .menu-list-mobile-items .my-profile .my-profile-tooltip {
  font-size: 12px;
  color: #68737D;
}

.nav-wrapper-mobile .menu-list-mobile-items .menu-profile-avatar {
  height: 20px;
  width: 20px;
  border-radius: 50%;
  display: inline-block;
  margin-right: 8px;
  margin-top: 1px;
}

[dir="rtl"] .nav-wrapper-mobile .menu-list-mobile-items .menu-profile-avatar {
  margin-right: 0;
  margin-left: 8px;
}

.skip-navigation {
  align-items: center;
  background-color: black;
  color: white;
  display: flex;
  font-size: 14px;
  justify-content: center;
  left: -999px;
  margin: 20px;
  padding: 20px;
  overflow: hidden;
  position: absolute;
  top: auto;
  z-index: -999;
}

[dir="rtl"] .skip-navigation {
  left: initial;
  right: -999px;
}

.skip-navigation:focus, .skip-navigation:active {
  left: auto;
  overflow: auto;
  text-align: center;
  text-decoration: none;
  top: auto;
  z-index: 999;
}

[dir="rtl"] .skip-navigation:focus, [dir="rtl"] .skip-navigation:active {
  left: initial;
  right: auto;
}

/***** User info in header *****/
.user-info {
  display: inline-block;
}

.user-info .dropdown-toggle::after {
  display: none;
}

@media (min-width: 768px) {
  .user-info .dropdown-toggle::after {
    display: inline-block;
  }
}

.user-info > button {
  border: 0;
  color: rgba(0, 156, 220, 1);
  min-width: 0;
  padding: 0;
  white-space: nowrap;
}

.user-info > button:hover, .user-info > button:focus {
  color: rgba(0, 156, 220, 1);
  background-color: transparent;
}

.user-info > button::after {
  color: rgba(0, 156, 220, 1);
  padding-right: 15px;
}

[dir="rtl"] .user-info > button::after {
  padding-left: 15px;
  padding-right: 0;
}

#user #user-name {
  display: none;
  font-size: 14px;
}

@media (min-width: 768px) {
  #user #user-name {
    display: inline-block;
  }
}

#user #user-name:hover {
  text-decoration: underline;
}

/***** User avatar *****/
.user-avatar {
  height: 25px;
  width: 25px;
  border-radius: 50%;
  display: inline-block;
  vertical-align: middle;
}

.avatar {
  display: inline-block;
  position: relative;
}

.avatar img {
  height: 40px;
  width: 40px;
}

.avatar .icon-agent {
  color: rgba(0, 156, 220, 1);
  border: 2px solid #fff;
  border-radius: 50%;
  bottom: -4px;
  background-color: #FFFFFF;
  font-size: 17px;
  height: 17px;
  line-height: 17px;
  position: absolute;
  right: -2px;
  text-align: center;
  width: 17px;
}

/***** Footer *****/
/* AIWFM-FTR-001 START: dark responsive legal and social footer (Kean) */
.footer {
  box-sizing: border-box;
  margin-top: 0;
  color: var(--aiwfm-color-surface, #fff);
  background: var(--aiwfm-color-neutral-dark, #323439);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 14px;
  line-height: 20px;
}

.footer a,
.footer a:visited {
  color: var(--aiwfm-color-surface, #fff);
}

.footer-inner {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  max-width: var(--aiwfm-content-max-width, 1400px);
  margin: 0 auto;
  padding: 40px 80px;
}

.footer-top,
.footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

.footer-home-link {
  flex: 0 0 auto;
  text-decoration: none;
}

.footer-legal-list,
.footer-social-list {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}

.footer-legal-list {
  flex-wrap: wrap;
  justify-content: flex-end;
  row-gap: 8px;
}

.footer-legal-list li {
  display: flex;
  align-items: center;
}

.footer-legal-list li + li::before {
  margin: 0 12px;
  color: rgb(255 255 255 / 45%);
  content: "|";
}

.footer-legal-link,
.footer-home-link {
  text-underline-offset: 3px;
}

.footer-legal-link:hover,
.footer-home-link:hover {
  text-decoration: underline;
}

.footer-divider {
  width: 100%;
  border-top: 1px solid rgb(255 255 255 / 16%);
}

.footer-social-list {
  gap: 20px;
}

.footer-social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 36px;
  height: 36px;
  background: rgb(255 255 255 / 10%);
  border-radius: 50%;
  transition: background-color 160ms ease, transform 160ms ease;
}

.footer-social-link:hover {
  background: rgb(255 255 255 / 20%);
  transform: translateY(-1px);
}

.footer-social-link:active {
  background: rgb(255 255 255 / 26%);
  transform: translateY(0);
}

.footer-social-icon {
  display: block;
  flex: 0 0 auto;
  max-width: 18px;
  max-height: 18px;
  object-fit: contain;
}

.footer a:focus-visible {
  outline: 2px solid var(--aiwfm-color-surface, #fff);
  outline-offset: 4px;
  border-radius: 4px;
}

.footer-social-link:focus-visible {
  border-radius: 50%;
}

.footer-copyright {
  flex: 0 0 auto;
  margin: 0;
  color: var(--aiwfm-color-surface, #fff);
  white-space: nowrap;
}

@media (max-width: 1023px) {
  .footer-inner {
    padding: 36px 48px;
  }

  .footer-top {
    align-items: flex-start;
    flex-direction: column;
    gap: 16px;
  }

  .footer-legal-list {
    justify-content: flex-start;
  }
}

@media (max-width: 767px) {
  .footer-inner {
    gap: 24px;
    padding: 32px var(--aiwfm-page-gutter-mobile, 20px);
  }

  .footer-bottom {
    align-items: flex-start;
    flex-direction: column;
    gap: 24px;
  }

  .footer-legal-list {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }

  .footer-legal-list li + li::before {
    content: none;
  }

  .footer-social-list {
    flex-wrap: wrap;
    gap: 12px;
  }

  .footer-copyright {
    white-space: normal;
  }
}

@media (prefers-reduced-motion: reduce) {
  .footer-social-link {
    transition: none;
  }
}
/* AIWFM-FTR-001 END (Kean) */

.powered-by-zendesk a,
.powered-by-zendesk a:visited {
  color: #383838;
}

/***** Breadcrumbs *****/
.breadcrumbs {
  margin: 0 0 15px 0;
  padding: 0;
}

@media (min-width: 768px) {
  .breadcrumbs {
    margin: 0;
  }
}

.breadcrumbs li {
  color: #383838;
  display: inline;
  font-size: 13px;
  max-width: 450px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.breadcrumbs li + li::before {
  content: ">";
  margin: 0 4px;
}

.breadcrumbs li a:visited {
  color: rgba(0, 156, 220, 1);
}

/***** Search field *****/
.search-container {
  position: relative;
}

.search {
  border-color: #87929D;
  border-radius: 30px;
  border-style: solid;
  border-width: 1px;
  display: flex;
  position: relative;
  transition: border 0.12s ease-in-out;
}

.search:focus-within {
  border-color: rgba(0, 156, 220, 1);
}

.search input[type="search"],
.search .clear-button {
  background-color: #fff;
  border-radius: 30px;
  border: none;
}

.search-full input[type="search"],
.search-full .clear-button {
  border-color: #fff;
}

.search input[type="search"] {
  appearance: none;
  -webkit-appearance: none;
  box-sizing: border-box;
  color: #666;
  flex: 1 1 auto;
  height: 40px;
  width: 100%;
}

.search input[type="search"]:focus {
  color: #555;
}

.search input[type="search"]::-webkit-search-decoration, .search input[type="search"]::-webkit-search-cancel-button, .search input[type="search"]::-webkit-search-results-button, .search input[type="search"]::-webkit-search-results-decoration {
  -webkit-appearance: none;
}

.search input[type="search"]:-webkit-autofill, .search input[type="search"]:-webkit-autofill:hover, .search input[type="search"]:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #fff inset;
}

.search .clear-button {
  align-items: center;
  box-sizing: border-box;
  color: #777;
  cursor: pointer;
  display: none;
  flex: none;
  justify-content: center;
  padding: 0 15px;
}

.search .clear-button:hover {
  background-color: rgba(0, 156, 220, 1);
  color: #fff;
}

.search .clear-button:focus {
  outline: 0;
  box-shadow: 0 0 0 3px rgba(0, 156, 220, 1);
}

.search-has-value .clear-button {
  display: flex;
}

[dir="ltr"] .search input[type="search"] {
  padding-left: 40px;
  padding-right: 20px;
}

[dir="ltr"] .search-has-value input[type="search"] {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
  border-right-color: transparent;
}

[dir="ltr"] .search-has-value input[type="search"]:focus {
  border-right-color: rgba(0, 156, 220, 1);
}

[dir="ltr"] .search .clear-button {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  border-left-color: transparent;
}

[dir="ltr"] .search .clear-button:focus {
  border-left-color: rgba(0, 156, 220, 1);
}

[dir="rtl"] .search input[type="search"] {
  padding-left: 20px;
  padding-right: 40px;
}

[dir="rtl"] .search-has-value input[type="search"] {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  border-left-color: transparent;
}

[dir="rtl"] .search-has-value input[type="search"]:focus {
  border-left-color: rgba(0, 156, 220, 1);
}

[dir="rtl"] .search .clear-button {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
  border-right-color: transparent;
}

[dir="rtl"] .search .clear-button:focus {
  border-right-color: rgba(0, 156, 220, 1);
}

.search-icon {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  position: absolute;
  left: 15px;
  z-index: 1;
  width: 18px;
  height: 18px;
  color: #777;
  pointer-events: none;
  display: none;
}

[dir="rtl"] .search-icon {
  left: auto;
  right: 15px;
}

/***** Hero component *****/
.hero {
  background-image: url(/hc/theming_assets/01KG84F5H6QFNCCKMCG0FYD0YG);
  background-position: center;
  background-size: cover;
  height: 300px;
  padding: 0 20px;
  text-align: center;
  width: 100%;
}

.hero-inner {
  position: relative;
  top: 40%;
  transform: translateY(-50%);
  max-width: 850px;
  margin: 0 auto;
}

.page-header {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 10px 0;
}

@media (min-width: 768px) {
  .page-header {
    align-items: baseline;
    flex-direction: row;
    margin: 0;
  }
}

.page-header .section-subscribe {
  flex-shrink: 0;
  margin-bottom: 10px;
}

@media (min-width: 768px) {
  .page-header .section-subscribe {
    margin-bottom: 0;
  }
}

.page-header h1 {
  flex-grow: 1;
  margin-bottom: 10px;
  color: #0089d7; 
}

.page-header-description {
  font-style: italic;
  margin: 0 0 30px 0;
  word-break: break-word;
}

@media (min-width: 1024px) {
  .page-header-description {
    flex-basis: 100%;
  }
}

.page-header .icon-lock {
  height: 20px;
  width: 20px;
  position: relative;
  left: -5px;
  vertical-align: baseline;
}

.sub-nav {
  align-items: baseline;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  gap: 15px 30px;
  justify-content: space-between;
  margin-bottom: 55px;
}

@media (min-width: 768px) {
  .sub-nav {
    flex-direction: row;
  }
}

.sub-nav .breadcrumbs {
  margin: 0;
}

.sub-nav .search-container {
  max-width: 300px;
  width: 100%;
}

@media (min-width: 768px) {
  .sub-nav .search-container {
    flex: 0 1 300px;
  }
}

.sub-nav input[type="search"]::after {
  font-size: 15px;
}

/***** Blocks *****/
/* Used in Homepage#categories and Community#topics */
.blocks-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  list-style: none;
  padding: 0;
}

@media (min-width: 768px) {
  .blocks-list {
    margin: 0 -15px;
  }
}

.blocks-item {
  border: 1px solid rgba(0, 156, 220, 1);
  border-radius: 4px;
  box-sizing: border-box;
  color:  rgba(0, 156, 220, 1);
  display: flex;
  flex: 1 0 340px;
  margin: 0 0 30px;
  max-width: 100%;
  text-align: center;
}

@media (min-width: 768px) {
  .blocks-item {
    margin: 0 15px 30px;
  }
}

.blocks-item:hover, .blocks-item:focus, .blocks-item:active {
  background-color: rgba(0, 156, 220, 1);
}

.blocks-item:hover *, .blocks-item:focus *, .blocks-item:active * {
  color: #FFFFFF;
  text-decoration: none;
}

.blocks-item-internal {
 /* background-color: transparent; */
  background-color: #fff0e6;
  border: 1px solid #ddd;
}

.blocks-item-internal .icon-lock {
  height: 15px;
  width: 15px;
  bottom: 5px;
  position: relative;
}

.blocks-item-internal a {
  color: rgba(5, 5, 5, 1);
}

.blocks-item-link {
  color: rgba(0, 156, 220, 1);
  padding: 20px 30px;
  display: flex;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  border-radius: inherit;
}

.blocks-item-link:visited, .blocks-item-link:hover, .blocks-item-link:active {
  color: inherit;
  text-decoration: none;
}

.blocks-item-link:focus {
  outline: 0;
  box-shadow: 0 0 0 3px rgba(0, 156, 220, 1);
  text-decoration: none;
}

.blocks-item-title {
  margin-bottom: 0;
  font-size: 16px;
  font-weight:bold;
}

.blocks-item-description {
  margin: 0;
}

.blocks-item-description:not(:empty) {
  margin-top: 10px;
}

/***** Homepage *****/
.section {
  margin-bottom: 40px;
}

@media (min-width: 768px) {
  .section {
    margin-bottom: 60px;
  }
}

.home-section h2 {
  margin-bottom: 10px;
  text-align: center;
}

/***** Promoted articles *****/
.promoted-articles {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}

@media (min-width: 1024px) {
  .promoted-articles {
    flex-direction: row;
  }
}

.promoted-articles-item {
  flex: 1 0 auto;
}

@media (min-width: 1024px) {
  .promoted-articles-item {
    align-self: flex-end;
    flex: 0 0 auto;
    padding-right: 30px;
    width: 33%;
    /* Three columns on desktop */
  }
  [dir="rtl"] .promoted-articles-item {
    padding: 0 0 0 30px;
  }
}

.promoted-articles-item:nth-child(3n) {
  padding-right: 0;
}

.promoted-articles-item a {
  display: block;
  border-bottom: 1px solid #ddd;
  padding: 15px 0;
}

.promoted-articles-item .icon-lock {
  vertical-align: baseline;
}

.promoted-articles-item:last-child a {
  border: 0;
}

@media (min-width: 1024px) {
  .promoted-articles-item:last-child a {
    border-bottom: 1px solid #ddd;
  }
}

/***** Community section in homepage *****/
.community {
  text-align: center;
}

.community-image {
  min-height: 300px;
  margin-top: 32px;
  background-image: url(/hc/theming_assets/01KG0N3NAY7XEG6XZ98FQVSJ0S);
  background-position: center;
  background-repeat: no-repeat;
  max-width: 100%;
}

.community a {
  color: rgba(0, 156, 220, 1);
  text-decoration: underline;
}

.community a:visited {
  color: rgba(153, 51, 204, 1);
}

.community a:hover, .community a:active, .community a:focus {
  color: #0F3554;
}

.community,
.activity {
  border-top: 1px solid #ddd;
  padding: 30px 0;
}

/***** Recent activity *****/
.recent-activity-header {
  margin-bottom: 10px;
  text-align: center;
}

.recent-activity-list {
  padding: 0;
}

.recent-activity-item {
  border-bottom: 1px solid #ddd;
  overflow: auto;
  padding: 20px 0;
}

.recent-activity-item-parent {
  font-size: 16px;
  font-weight: 600;
}

.recent-activity-item-parent, .recent-activity-item-link {
  margin: 6px 0;
  display: inline-block;
  width: 100%;
}

@media (min-width: 768px) {
  .recent-activity-item-parent, .recent-activity-item-link {
    width: 70%;
    margin: 0;
  }
}

.recent-activity-item-link {
  font-size: 14px;
}

.recent-activity-item-meta {
  color: rgba(5, 5, 5, 1);
  margin: 15px 0 0 0;
  float: none;
}

@media (min-width: 768px) {
  .recent-activity-item-meta {
    margin: 0;
    float: right;
  }
  [dir="rtl"] .recent-activity-item-meta {
    float: left;
  }
}

.recent-activity-item-time, .recent-activity-item-comment {
  display: inline-block;
  font-size: 13px;
}

.recent-activity-item-comment {
  padding-left: 5px;
}

[dir="rtl"] .recent-activity-item-comment {
  padding: 0 5px 0 0;
}

.recent-activity-item-comment::before {
  display: inline-block;
}

.recent-activity-controls {
  padding-top: 15px;
}

.recent-activity-controls a {
  color: rgba(0, 156, 220, 1);
  text-decoration: underline;
}

.recent-activity-controls a:visited {
  color: rgba(153, 51, 204, 1);
}

.recent-activity-controls a:hover, .recent-activity-controls a:active, .recent-activity-controls a:focus {
  color: #0F3554;
}

.recent-activity-accessibility-label {
  border: 0;
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;
}

.recent-activity-comment-icon svg {
  vertical-align: middle;
  color: rgba(0, 156, 220, 1);
  width: 16px;
  height: 16px;
}

.recent-activity-comment-icon:after {
  content: attr(data-comment-count);
  margin-left: 3px;
}

[dir="rtl"] .recent-activity-comment-icon:after {
  margin-left: 0;
  margin-right: 3px;
}

/***** Category pages *****/
.category-container {
  display: flex;
  justify-content: flex-end;
}

.category-content {
  flex: 1;
}

@media (min-width: 1024px) {
  .category-content {
    flex: 0 0 80%;
  }
}

.section-tree {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
}

@media (min-width: 768px) {
  .section-tree {
    flex-direction: row;
  }
}

.section-tree .section {
  flex: initial;
}

@media (min-width: 768px) {
  .section-tree .section {
    flex: 0 0 45%;
    /* Two columns for tablet and desktop. Leaving 5% separation between columns */
  }
}

.section-tree-title {
  margin-bottom: 0;
  font-size: 18px;
  font-weight: 600;
}

.section-tree-title a {
  color: #f7921e;
}

.section-tree .see-all-articles {
  display: block;
  padding: 15px 0;
}

.article-list-item {
  font-size: 16px;
  padding: 15px 0;
}

.article-list-item a {
  color: #0089d7;
}

.icon-star {
  color: rgba(0, 156, 220, 1);
  font-size: 18px;
}

/***** Section pages *****/
.section-container {
  display: flex;
  justify-content: flex-end;
}


.section-content {
  flex: 1;
}

@media (min-width: 1024px) {
  .section-content {
    flex: 1;
    min-width: 0;
  }
}

.section-list {
  margin: 40px 0;
}

.section-list-item {
  border-bottom: 1px solid #ddd;
  font-size: 16px;
  padding: 15px 0;
}

.section-list-item:first-child {
  border-top: 1px solid #ddd;
}

.section-list-item a {
  align-items: center;
  color: rgba(5, 5, 5, 1);
  display: flex;
  justify-content: space-between;
}

.see-all-sections-trigger {
  cursor: pointer;
  display: block;
  padding: 15px;
  text-align: center;
}

.see-all-sections-trigger[aria-hidden="true"] {
  display: none;
}

/***** Article *****/
.article {
  /*
  * The article grid is defined this way to optimize readability:
  * Sidebar | Content | Free space
  * 17%     | 66%     | 17%
  */
  flex: 1 0 auto;
}

@media (min-width: 1024px) {
  .article {
    flex: 1 0 66%;
    max-width: 66%;
    min-width: 640px;
    padding: 0 30px;
  }
}

.article-container {
  display: flex;
  flex-direction: column;
}

@media (min-width: 1024px) {
  .article-container {
    flex-direction: row;
    gap: var(--aiwfm-space-24);
  }
}

.article-header {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 40px;
  margin-top: 20px;
}

@media (min-width: 768px) {
  .article-header {
    flex-direction: row;
    margin-top: 0;
  }
}

.article-avatar {
  margin-right: 10px;
}

.article-author {
  margin-bottom: 10px;
}

@media (min-width: 768px) {
  .article-title {
    flex-basis: 100%;
    /* Take entire row */
  }
}

.article-title .icon-lock {
  position: relative;
  left: -5px;
  vertical-align: baseline;
}

.article [role="button"] {
  flex-shrink: 0;
  /*Avoid collapsing elements in Safari (https://github.com/philipwalton/flexbugs#1-minimum-content-sizing-of-flex-items-not-honored)*/
  width: 100%;
}

@media (min-width: 768px) {
  .article [role="button"] {
    width: auto;
  }
}

.article-info {
  max-width: 100%;
}

.article-meta {
  display: inline-block;
  vertical-align: middle;
}

.article-body a {
  color: rgba(0, 156, 220, 1);
  text-decoration: underline;
}

.article-body a:visited {
  color: rgba(153, 51, 204, 1);
}

.article-body a:hover, .article-body a:active, .article-body a:focus {
  color: #0F3554;
}

.article-body img {
  height: auto;
  max-width: 100%;
}

/* AIWFM-ARTICLE-001 START -----------------------------------------------------
   Article body: constrain embedded iframes/videos so fixed-width embeds (a
   representative article has a hardcoded 640px iframe) do not cause
   horizontal overflow at narrow widths. Tracked as a known defect under
   AIWFM-RESP-001/AIWFM-ARTICLE-001 in ../ZENDESK_DESIGN_UPDATE_CHECKLIST.md.
   The full Figma visual redesign for this page has not started; this is a
   narrow responsiveness fix only.
   Figma reference: WFM Support site, "Article Page" (WFM Responsive flow)
   Audit/checklist: ../ZENDESK_UPDATE_LOG.md
   -------------------------------------------------------------------------- */
.article-body iframe,
.article-body embed,
.article-body video {
  max-width: 100%;
}
/* AIWFM-ARTICLE-001 END ------------------------------------------------------- */

/* AIWFM-ARTICLE-001 START -----------------------------------------------------
   Article header: title + beige metadata/follow row (slice 1 of the full
   AIWFM-ARTICLE-001 scope; body/sidebar/footer styling follow separately).
   Desktop only for now — tablet/mobile frames for this block not yet read.
   Figma reference: WFM Support site, node 8104:17566 ("Title / Info")
   Audit/checklist: ../ZENDESK_UPDATE_LOG.md
   -------------------------------------------------------------------------- */
.aiwfm-article-header {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: var(--aiwfm-space-16);
  justify-content: flex-start;
}

.aiwfm-article-title {
  color: var(--aiwfm-color-text);
  flex-basis: auto;
  font-family: var(--aiwfm-font-family-base);
  font-size: 32px;
  font-weight: var(--aiwfm-font-weight-semibold);
  letter-spacing: var(--aiwfm-letter-spacing-tight);
  line-height: 48px;
  margin: 0;
}

.aiwfm-article-info-buttons {
  align-items: center;
  align-self: stretch;
  background: var(--aiwfm-color-surface-beige);
  border-radius: var(--aiwfm-radius-card);
  display: flex;
  flex-wrap: wrap;
  gap: var(--aiwfm-space-16);
  justify-content: space-between;
  padding: var(--aiwfm-space-16) var(--aiwfm-space-20);
}

.aiwfm-article-meta-group {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: var(--aiwfm-space-24);
  list-style: none;
  margin: 0;
  padding: 0;
}

.aiwfm-article-meta-item {
  align-items: center;
  color: #323439;
  display: flex;
  flex-shrink: 0;
  font-family: var(--aiwfm-font-family-base);
  font-size: 15px;
  font-weight: 500;
  gap: 8px;
  line-height: 20px;
  white-space: nowrap;
}

.aiwfm-article-meta-icon {
  flex-shrink: 0;
  height: 17px;
  width: 17px;
}

.aiwfm-article-info-buttons .article-subscribe button {
  background: transparent;
  border: 1px solid var(--aiwfm-color-border);
  border-radius: 8px;
  color: rgba(0, 156, 220, 1);
  display: flex;
  gap: var(--aiwfm-space-4);
  height: 36px;
  justify-content: center;
  align-items: center;
  min-width: 60px;
  padding: 0 var(--aiwfm-space-16);
}

/* AIWFM-QA-FIX-001: the baseline shared subscribe-button rule (around line 385)
   sets color: #FFFFFF (white) whenever this button matches :focus,
   :hover, :active, or [data-selected="true"] - intended for baseline's
   filled-blue "selected" look. This card's background stays transparent at
   every state above, so that white text becomes invisible once the button
   regains focus after a Follow -> Unfollow toggle (Zendesk's subscribe widget
   never blurs the button once its AJAX toggle completes, so :focus keeps
   matching after the click). Re-assert the readable brand color at matching
   specificity for every one of those states so the label never goes
   white-on-transparent. */
.aiwfm-article-info-buttons .article-subscribe button:focus,
.aiwfm-article-info-buttons .article-subscribe button:hover,
.aiwfm-article-info-buttons .article-subscribe button:active,
.aiwfm-article-info-buttons .article-subscribe button[data-selected="true"] {
  color: rgba(0, 156, 220, 1);
}
/* AIWFM-ARTICLE-001 END ------------------------------------------------------- */

/* AIWFM-ARTICLE-001 START -----------------------------------------------------
   Article body: heading/paragraph typography + "Was this article helpful?"
   survey box (slice 2 of the full AIWFM-ARTICLE-001 scope; sidebar/footer
   still to follow separately). Desktop only for now.
   Figma reference: WFM Support site, Article Page body content + "Survey"
   node dev-mode CSS export (logged in ../ZENDESK_UPDATE_LOG.md).
   Audit/checklist: ../ZENDESK_UPDATE_LOG.md
   -------------------------------------------------------------------------- */
.article-body h2 {
  color: var(--aiwfm-color-text);
  font-family: var(--aiwfm-font-family-base);
  font-size: 20px;
  font-weight: var(--aiwfm-font-weight-semibold);
  letter-spacing: var(--aiwfm-letter-spacing-tight);
  line-height: 32px;
}

@media (min-width: 768px) {
  .article-body h2 {
    font-size: 24px;
  }
}

.article-body h3 {
  color: var(--aiwfm-color-text);
  font-family: var(--aiwfm-font-family-base);
  font-size: 18px;
  font-weight: var(--aiwfm-font-weight-semibold);
  letter-spacing: var(--aiwfm-letter-spacing-tight);
  line-height: 32px;
}

@media (min-width: 768px) {
  .article-body h3 {
    font-size: 22px;
  }
}

.article-body h4 {
  color: var(--aiwfm-color-text);
  font-family: var(--aiwfm-font-family-base);
  font-size: 18px;
  font-weight: var(--aiwfm-font-weight-semibold);
  letter-spacing: var(--aiwfm-letter-spacing-tight);
  line-height: 32px;
}

.article-body p {
  color: var(--aiwfm-color-text);
  font-family: var(--aiwfm-font-family-base);
  font-size: 16px;
  font-weight: var(--aiwfm-font-weight-regular);
  line-height: 24px;
}

.article-body strong,
.article-body b {
  font-weight: var(--aiwfm-font-weight-semibold);
}

.article-votes {
  align-items: center;
  background: var(--aiwfm-color-surface-beige);
  border-radius: var(--aiwfm-radius-card);
  border-top: none;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
  padding: var(--aiwfm-space-20);
  text-align: left;
}

.article-votes-question {
  color: var(--aiwfm-color-text);
  flex: 1 1 auto;
  font-family: var(--aiwfm-font-family-base);
  font-size: 15px;
  font-weight: 500;
  line-height: 20px;
  min-width: 160px;
}

@media (min-width: 768px) {
  .article-votes-question {
    font-size: 16px;
    line-height: 24px;
  }
}

.article-votes-controls {
  align-items: center;
  display: flex;
  flex-shrink: 0;
  gap: var(--aiwfm-space-16);
}

.article-votes-controls .article-vote {
  align-items: center;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  color: #000;
  display: flex;
  font-family: var(--aiwfm-font-family-base);
  font-size: 14px;
  font-weight: 500;
  gap: 8px;
  height: 36px;
  justify-content: center;
  line-height: 20px;
  margin: 0;
  min-width: 60px;
  padding: 0 18px;
}

@media (min-width: 768px) {
  .article-votes-controls .article-vote {
    font-size: 15px;
    padding: 0 var(--aiwfm-space-16);
  }
}

.article-votes-controls .article-vote::before {
  content: "";
  display: inline-block;
  flex-shrink: 0;
  height: 20px;
  width: 20px;
}

.article-votes-controls .article-vote-up::before {
  background: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath d='M17.6469 8.00732C17.2752 7.49065 16.4994 6.87567 14.9202 6.87567H12.2902V4.80317C12.2902 3.75651 11.7701 2.78484 10.8993 2.20318C10.4018 1.87151 9.7902 1.78649 9.22186 1.96982C8.65186 2.15315 8.20513 2.57899 7.98763 3.16316L6.21436 8.54234H3.75098C2.71764 8.54234 1.87598 9.38317 1.87598 10.4173V16.2507C1.87598 17.2848 2.71764 18.1257 3.75098 18.1257H13.2544C15.3344 18.1257 15.8435 17.1148 16.2193 15.989L17.8852 10.989C18.2744 9.81898 18.1894 8.75982 17.6469 8.00732ZM3.12516 16.2507V10.4173C3.12516 10.0723 3.406 9.79234 3.75016 9.79234H5.41683V16.8757H3.75016C3.406 16.8757 3.12516 16.5957 3.12516 16.2507ZM16.6977 10.5932L15.0318 15.5932C14.736 16.4823 14.5502 16.8757 13.2535 16.8757H6.66683V9.79234C6.93683 9.79234 7.17521 9.61899 7.25938 9.36316L9.1652 3.57901C9.24103 3.37818 9.40018 3.22569 9.60435 3.15985C9.80852 3.09319 10.0268 3.12483 10.2051 3.24317C10.7276 3.5915 11.0393 4.17484 11.0393 4.80317V7.50067C11.0393 7.84567 11.3193 8.12567 11.6643 8.12567H14.9193C15.4993 8.12567 16.2676 8.23149 16.6326 8.73816C16.9293 9.14983 16.9543 9.82651 16.6977 10.5932Z' fill='%23000000'/%3E %3C/svg%3E") no-repeat center / 20px 20px;
}

.article-votes-controls .article-vote-down::before {
  background: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath d='M16.2496 1.875H6.74623C4.66623 1.875 4.15708 2.88585 3.78125 4.01169L2.1154 9.01169C1.7254 10.1817 1.81042 11.2409 2.35292 11.9934C2.72459 12.51 3.5004 13.125 5.07957 13.125H7.70957V15.1975C7.70957 16.2442 8.22963 17.2159 9.10046 17.7975C9.42546 18.0142 9.7996 18.1258 10.1779 18.1258C10.3788 18.1258 10.5804 18.0941 10.7779 18.0308C11.3479 17.8475 11.7946 17.4216 12.0121 16.8375L13.7854 11.4583H16.2488C17.2821 11.4583 18.1238 10.6175 18.1238 9.58333V3.75C18.1246 2.71583 17.2829 1.875 16.2496 1.875ZM12.7404 10.6375L10.8346 16.4217C10.7587 16.6225 10.5996 16.775 10.3954 16.8408C10.1904 16.9067 9.97213 16.8758 9.79463 16.7575C9.27213 16.4092 8.96049 15.8258 8.96049 15.1975V12.5C8.96049 12.155 8.68049 11.875 8.33549 11.875H5.08048C4.50048 11.875 3.73212 11.7692 3.36712 11.2625C3.07046 10.85 3.04546 10.1742 3.30212 9.40669L4.96798 4.40669C5.26381 3.51752 5.44957 3.12419 6.74623 3.12419H13.3329V10.2075C13.0629 10.2092 12.8246 10.3817 12.7404 10.6375ZM16.8746 9.58333C16.8746 9.92833 16.5938 10.2083 16.2496 10.2083H14.5829V3.125H16.2496C16.5938 3.125 16.8746 3.405 16.8746 3.75V9.58333Z' fill='%23000000'/%3E %3C/svg%3E") no-repeat center / 20px 20px;
}

.article-votes-count {
  display: none;
}
/* AIWFM-ARTICLE-001 END ------------------------------------------------------- */

.article-body ul,
.article-body ol {
  padding-left: 20px;
  list-style-position: outside;
  margin: 20px 0 20px 20px;
}

[dir="rtl"] .article-body ul, [dir="rtl"]
.article-body ol {
  padding-right: 20px;
  padding-left: 0;
  margin-left: 0;
  margin-right: 20px;
}

.article-body ul > ul,
.article-body ol > ol,
.article-body ol > ul,
.article-body ul > ol,
.article-body li > ul,
.article-body li > ol {
  margin: 0;
}

.article-body ul {
  list-style-type: disc;
}

.article-body :not(pre) > code {
  background: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}

.article-body pre {
  background: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
}

.article-body blockquote {
  border-left: 1px solid #ddd;
  color: #383838;
  font-style: italic;
  padding: 0 15px;
}

.article-body > p:last-child {
  margin-bottom: 0;
}

.article-content {
  line-height: 1.6;
  margin: 40px 0;
  word-wrap: break-word;
}

.article-footer {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding-bottom: 20px;
}

.article-comment-count {
  color: #383838;
}

.article-comment-count:hover {
  text-decoration: none;
}

.article-comment-count-icon {
  vertical-align: middle;
  color: rgba(0, 156, 220, 1);
  width: 18px;
  height: 18px;
}

.article-relatives {
  border-top: 1px solid #ddd;
  display: flex;
  flex-direction: column;
  padding: 20px 0;
}

@media (min-width: 768px) {
  .article-relatives {
    flex-direction: row;
  }
}

.article-relatives > * {
  flex: 1 0 50%;
  min-width: 50%;
  overflow-wrap: break-word;
  margin-right: 0;
}

.article-relatives > *:last-child {
  padding: 0;
}

@media (min-width: 768px) {
  .article-relatives > * {
    padding-right: 20px;
  }
}

.article-votes {
  border-top: 1px solid #ddd;
  padding: 30px 0;
  text-align: center;
}

.article-vote {
  margin: 10px 5px;
  min-width: 90px;
  width: auto;
}

.article-more-questions {
  margin: 10px 0 20px;
  text-align: center;
}

.article-more-questions a {
  color: rgba(0, 156, 220, 1);
  text-decoration: underline;
}

.article-more-questions a:visited {
  color: rgba(153, 51, 204, 1);
}

.article-more-questions a:hover, .article-more-questions a:active, .article-more-questions a:focus {
  color: #0F3554;
}

.article-return-to-top {
  border-top: 1px solid #87929D;
}

@media (min-width: 1024px) {
  .article-return-to-top {
    display: none;
  }
}

.article-return-to-top a {
  color: rgba(5, 5, 5, 1);
  display: block;
  padding: 20px 0;
}

.article-return-to-top a:hover, .article-return-to-top a:focus {
  text-decoration: none;
}

.article-return-to-top-icon {
  transform: rotate(0.5turn);
}

.article td > p:first-child,
.article th > p:first-child {
  margin-top: 0;
}

.article td > p:last-child,
.article th > p:last-child {
  margin-bottom: 0;
}

.sidenav-title {
  font-size: 15px;
  position: relative;
  font-weight: 600;
}

.sidenav-item {
  display: block;
  margin-top: 10px;
  margin-bottom: 16px;
}

.recent-articles li,
.related-articles li {
  margin-bottom: 15px;
}

/***** Attachments *****/
/* Styles attachments inside posts, articles and comments */
.attachments .attachment-item {
  padding-left: 20px;
  position: relative;
  margin-bottom: 10px;
}

.attachments .attachment-item:last-child {
  margin-bottom: 0;
}

.attachments .attachment-item .attachment-icon {
  color: rgba(5, 5, 5, 1);
  left: 0;
  position: absolute;
  top: 5px;
}

[dir="rtl"] .attachments .attachment-item {
  padding-left: 0;
  padding-right: 20px;
}

[dir="rtl"] .attachments .attachment-item .attachment-icon {
  left: auto;
  right: 0;
}

.upload-dropzone span {
  color: #383838;
}

/***** Social share links *****/
.share {
  padding: 0;
  white-space: nowrap;
}

.share li, .share a {
  display: inline-block;
}

.share li {
  height: 25px;
  width: 25px;
}

.share a {
  color: #383838;
}

.share a:hover {
  text-decoration: none;
  color: rgba(0, 156, 220, 1);
}

.share a svg {
  height: 18px;
  width: 18px;
  display: block;
}

/***** Comments *****/
/* Styles comments inside articles, posts and requests */
.comment {
  border-bottom: 1px solid #ddd;
  padding: 20px 0;
}

.comment-heading, .recent-articles-title,
.related-articles-title {
  margin-bottom: 5px;
  margin-top: 0;
  font-size: 18px;
  font-weight: 600;
}

.comment-overview {
  border-bottom: 1px solid #ddd;
  border-top: 1px solid #ddd;
  padding: 20px 0;
}

.comment-overview p {
  margin-top: 0;
}

.comment-callout {
  color: #383838;
  display: inline-block;
  font-size: 13px;
  margin-bottom: 0;
}

.comment-callout a {
  color: rgba(0, 156, 220, 1);
  text-decoration: underline;
}

.comment-callout a:visited {
  color: rgba(153, 51, 204, 1);
}

.comment-callout a:hover, .comment-callout a:active, .comment-callout a:focus {
  color: #0F3554;
}

.comment-sorter {
  display: inline-block;
  float: right;
}

.comment-sorter .dropdown-toggle {
  color: #383838;
  font-size: 13px;
}

[dir="rtl"] .comment-sorter {
  float: left;
}

.comment-wrapper {
  display: flex;
  position: relative;
}

.comment-wrapper.comment-official {
  border: 1px solid rgba(0, 156, 220, 1);
  padding: 40px 20px 20px;
}

@media (min-width: 768px) {
  .comment-wrapper.comment-official {
    padding-top: 20px;
  }
}

.comment-info {
  min-width: 0;
  padding-right: 20px;
  width: 100%;
}

[dir="rtl"] .comment-info {
  padding-right: 0;
  padding-left: 20px;
}

.comment-author {
  align-items: flex-end;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

@media (min-width: 768px) {
  .comment-author {
    justify-content: space-between;
  }
}

.comment-avatar {
  margin-right: 10px;
}

[dir="rtl"] .comment-avatar {
  margin-left: 10px;
  margin-right: 0;
}

.comment-meta {
  flex: 1 0 auto;
}

.comment-labels {
  flex-basis: 100%;
}

@media (min-width: 768px) {
  .comment-labels {
    flex-basis: auto;
  }
}

.comment .status-label:not(.status-label-official) {
  margin-top: 10px;
}

@media (min-width: 768px) {
  .comment .status-label:not(.status-label-official) {
    margin-top: 0;
  }
}

.comment-form {
  display: flex;
  padding-top: 30px;
  word-wrap: break-word;
}

.comment-container {
  width: 100%;
}

.comment-form-controls {
  display: none;
  margin-top: 10px;
  text-align: left;
}

@media (min-width: 768px) {
  [dir="ltr"] .comment-form-controls {
    text-align: right;
  }
}

.comment-form-controls input[type="submit"] {
  margin-top: 15px;
}

@media (min-width: 1024px) {
  .comment-form-controls input[type="submit"] {
    margin-left: 15px;
  }
  [dir="rtl"] .comment-form-controls input[type="submit"] {
    margin-left: 0;
    margin-right: 15px;
  }
}

.comment-form-controls input[type="checkbox"] {
  margin-right: 5px;
}

.comment-form-controls input[type="checkbox"] [dir="rtl"] {
  margin-left: 5px;
}

.comment-ccs {
  display: none;
}

.comment-ccs + textarea {
  margin-top: 10px;
}

.comment-attachments {
  margin-top: 10px;
}

.comment-attachments a {
  color: rgba(0, 156, 220, 1);
}

.comment-body {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
  line-height: 1.6;
  overflow-x: auto;
}

.comment-body a {
  color: rgba(0, 156, 220, 1);
  text-decoration: underline;
}

.comment-body a:visited {
  color: rgba(153, 51, 204, 1);
}

.comment-body a:hover, .comment-body a:active, .comment-body a:focus {
  color: #0F3554;
}

.comment-body img {
  height: auto;
  max-width: 100%;
}

.comment-body ul,
.comment-body ol {
  padding-left: 20px;
  list-style-position: outside;
  margin: 20px 0 20px 20px;
}

[dir="rtl"] .comment-body ul, [dir="rtl"]
.comment-body ol {
  padding-right: 20px;
  padding-left: 0;
  margin-left: 0;
  margin-right: 20px;
}

.comment-body ul > ul,
.comment-body ol > ol,
.comment-body ol > ul,
.comment-body ul > ol,
.comment-body li > ul,
.comment-body li > ol {
  margin: 0;
}

.comment-body ul {
  list-style-type: disc;
}

.comment-body :not(pre) > code {
  background: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}

.comment-body pre {
  background: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
}

.comment-body blockquote {
  border-left: 1px solid #ddd;
  color: #383838;
  font-style: italic;
  padding: 0 15px;
}

.comment-mark-as-solved {
  display: inline-block;
}

/***** Vote *****/
/* Used in article comments, post comments and post */
.vote {
  display: flex;
  flex-direction: column;
  text-align: center;
}

.vote a:active, .vote a:hover, .vote a:focus {
  text-decoration: none;
}

.vote-sum {
  color: #383838;
  display: block;
  margin: 3px 0;
}

[dir="rtl"] .vote-sum {
  direction: ltr;
  unicode-bidi: bidi-override;
}

.vote-up svg {
  transform: scale(1, -1);
}

.vote-up:hover,
.vote-down:hover {
  color: rgba(0, 156, 220, 1);
}

.vote-up, .vote-down {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: transparent;
  border: none;
  color: #383838;
  cursor: pointer;
  min-height: 35px;
  min-width: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vote-voted {
  color: rgba(0, 156, 220, 1);
}

.vote-voted:hover {
  color: #005476;
}

/***** Actions *****/
/* Styles admin and en user actions(edit, delete, change status) in comments and posts */
.actions {
  text-align: center;
  flex-shrink: 0;
  /*Avoid collapsing elements in Safari*/
}

.actions button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: transparent;
  border: none;
  cursor: pointer;
  min-height: 35px;
  min-width: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/***** Community *****/
.community-hero {
  background-image: url(/hc/theming_assets/01KG0N3MXBYTKVVPJNM2J0RT6S);
  margin-bottom: 10px;
}

.community-footer {
  padding-top: 50px;
  text-align: center;
}

.community-footer-title {
  font-size: 16px;
  margin-bottom: 20px;
}

.community-featured-posts .title {
  font-size: 18px;
  font-weight: 600;
}

.community-featured-posts, .community-activity {
  padding-top: 40px;
  width: 100%;
}

.community-header {
  margin-bottom: 30px;
}

.community-header .title {
  margin-bottom: 0;
  font-size: 16px;
}

.post-to-community {
  margin-top: 10px;
}

@media (min-width: 768px) {
  .post-to-community {
    margin: 0;
  }
}

/* Community topics grid */
.topics {
  max-width: none;
  width: 100%;
}

.topics-item .meta-group {
  justify-content: center;
  margin-top: 20px;
}

/* Community topic page */
.topic-header {
  border-bottom: 1px solid #ddd;
  font-size: 13px;
}

@media (min-width: 768px) {
  .topic-header {
    padding-bottom: 10px;
  }
}

.topic-header .dropdown {
  display: block;
  border-top: 1px solid #ddd;
  padding: 10px 0;
}

@media (min-width: 768px) {
  .topic-header .dropdown {
    border-top: 0;
    display: inline-block;
    margin-right: 20px;
    padding: 0;
  }
}

.no-posts-with-filter {
  margin-top: 20px;
  margin-bottom: 20px;
}

/* Topic, post and user follow button */
.community-follow {
  margin-bottom: 10px;
  width: 100%;
}

@media (min-width: 768px) {
  .community-follow {
    margin-bottom: 0;
    width: auto;
  }
}

.community-follow button {
  line-height: 30px;
  padding: 0 10px 0 15px;
  position: relative;
  width: 100%;
}

@media (min-width: 768px) {
  .community-follow button {
    width: auto;
  }
}

.community-follow button:hover {
  background-color: rgba(0, 156, 220, 1);
}

.community-follow button:hover::after, .community-follow button:focus::after {
  border-color: #FFFFFF;
  color: #FFFFFF;
}

.community-follow button[data-selected="true"] {
  background-color: rgba(0, 156, 220, 1);
  color: #FFFFFF;
}

.community-follow button[data-selected="true"]::after {
  border-left: 1px solid #FFFFFF;
  color: #FFFFFF;
}

.community-follow button[data-selected="true"]:hover {
  background-color: #005476;
  border-color: #005476;
}

.community-follow button::after {
  border-left: 1px solid rgba(0, 156, 220, 1);
  content: attr(data-follower-count);
  color: rgba(0, 156, 220, 1);
  display: inline-block;
  font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
  margin-left: 15px;
  padding-left: 10px;
  position: absolute;
  right: 10px;
}

@media (min-width: 768px) {
  .community-follow button::after {
    position: static;
  }
}

[dir="rtl"] .community-follow button::after {
  border-left: 0;
  border-right: 1px solid rgba(0, 156, 220, 1);
  margin: 0 10px 0 0;
  padding: 0 10px 0 0;
}

/***** Striped list *****/
/* Used in community posts list and requests list */
.striped-list {
  padding: 0;
}

.striped-list-item {
  align-items: flex-start;
  border-bottom: 1px solid #ddd;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 20px 0;
}

@media (min-width: 768px) {
  .striped-list-item {
    align-items: center;
    flex-direction: row;
  }
}

.striped-list-info {
  flex: 2;
}

.striped-list-title {
  color: rgba(0, 156, 220, 1);
  margin-bottom: 10px;
  margin-right: 5px;
}

.striped-list-title:hover, .striped-list-title:focus, .striped-list-title:active {
  text-decoration: underline;
}

.striped-list-title:visited {
  color: rgba(153, 51, 204, 1);
}

.striped-list .meta-group {
  margin: 5px 0;
}

.striped-list-count {
  color: #383838;
  font-size: 13px;
  justify-content: flex-start;
  text-transform: capitalize;
}

@media (min-width: 768px) {
  .striped-list-count {
    display: flex;
    flex: 1;
    justify-content: space-around;
  }
}

.striped-list-count-item::after {
  content: "·";
  display: inline-block;
  padding: 0 5px;
}

@media (min-width: 768px) {
  .striped-list-count-item::after {
    display: none;
  }
}

.striped-list-count-item:last-child::after {
  display: none;
}

.striped-list-number {
  text-align: center;
}

@media (min-width: 768px) {
  .striped-list-number {
    color: rgba(5, 5, 5, 1);
    display: block;
  }
}

/***** Status labels *****/
/* Styles labels used in posts, articles and requests */
.status-label {
  background-color: #038153;
  border-radius: 4px;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  margin-right: 2px;
  padding: 3px 10px;
  vertical-align: middle;
  white-space: nowrap;
  display: inline-block;
}

.status-label:hover, .status-label:active, .status-label:focus {
  text-decoration: none;
}

.status-label-pinned, .status-label-featured, .status-label-official {
  background-color: rgba(0, 156, 220, 1);
}

.status-label-official {
  border-radius: 0;
  margin-right: 0;
  position: absolute;
  right: 0;
  text-align: center;
  top: 0;
  width: 100%;
}

@media (min-width: 768px) {
  .status-label-official {
    border-radius: 0 0 4px 4px;
    right: 30px;
    width: auto;
  }
}

[dir="rtl"] .status-label-official {
  left: 30px;
  right: auto;
}

.status-label-not-planned, .status-label-closed {
  background-color: #e9ebed;
  color: #383838;
}

.status-label-pending, .status-label-pending-moderation {
  background-color: #1f73b7;
  text-align: center;
}

.status-label-open {
  background-color: #c72a1c;
}

.status-label-solved {
  background-color: #68737d;
}

.status-label-new {
  background-color: #ffb648;
  color: #703b15;
}

.status-label-hold {
  background-color: #000;
}

.status-label-request {
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 768px) {
  .status-label-request {
    max-width: 150px;
  }
}

/***** Post *****/
/*
* The post grid is defined this way:
* Content | Sidebar
* 70%     | 30%
*/
.post {
  flex: 1;
  margin-bottom: 10px;
}

@media (min-width: 1024px) {
  .post {
    flex: 1 0 70%;
    max-width: 70%;
  }
}

.post-container {
  display: flex;
  flex-direction: column;
}

@media (min-width: 1024px) {
  .post-container {
    flex-direction: row;
  }
}

.post-header {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-bottom: 10px;
}

@media (min-width: 768px) {
  .post-header {
    align-items: baseline;
    flex-direction: row;
  }
}

.post-header .status-label {
  vertical-align: super;
}

.post-title {
  margin-bottom: 20px;
  width: 100%;
}

@media (min-width: 768px) {
  .post-title {
    margin-bottom: 0;
    padding-right: 10px;
  }
}

.post-title h1 {
  display: inline;
  vertical-align: middle;
}

@media (min-width: 768px) {
  .post-title h1 {
    margin-right: 5px;
  }
}

.post-author {
  align-items: flex-start;
  display: flex;
  justify-content: space-between;
}

.post-avatar {
  margin-bottom: 30px;
}

.post-content {
  font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
  line-height: 1.6;
  word-break: break-word;
}

.post-info-container {
  display: flex;
  margin-bottom: 40px;
}

.post-info {
  min-width: 0;
  padding-right: 20px;
  width: 100%;
}

[dir="rtl"] .post-info {
  padding-right: 0;
  padding-left: 20px;
}

.post-meta {
  display: inline-block;
  flex: 1;
  margin-left: 10px;
  vertical-align: middle;
}

[dir="rtl"] .post-meta {
  margin-left: 0;
  margin-right: 10px;
}

.post-body a {
  color: rgba(0, 156, 220, 1);
  text-decoration: underline;
}

.post-body a:visited {
  color: rgba(153, 51, 204, 1);
}

.post-body a:hover, .post-body a:active, .post-body a:focus {
  color: #0F3554;
}

.post-body img {
  height: auto;
  max-width: 100%;
}

.post-body ul,
.post-body ol {
  padding-left: 20px;
  list-style-position: outside;
  margin: 20px 0 20px 20px;
}

[dir="rtl"] .post-body ul, [dir="rtl"]
.post-body ol {
  padding-right: 20px;
  padding-left: 0;
  margin-left: 0;
  margin-right: 20px;
}

.post-body ul > ul,
.post-body ol > ol,
.post-body ol > ul,
.post-body ul > ol,
.post-body li > ul,
.post-body li > ol {
  margin: 0;
}

.post-body ul {
  list-style-type: disc;
}

.post-body :not(pre) > code {
  background: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}

.post-body pre {
  background: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
}

.post-body blockquote {
  border-left: 1px solid #ddd;
  color: #383838;
  font-style: italic;
  padding: 0 15px;
}

.post-footer {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding-bottom: 20px;
}

.post-comment-count {
  color: #383838;
}

.post-comment-count:hover {
  text-decoration: none;
}

.post-comment-count .icon-comments {
  color: rgba(0, 156, 220, 1);
  display: inline-block;
  width: 18px;
  height: 18px;
  margin: 5px;
  vertical-align: middle;
}

.post-sidebar {
  border-top: 1px solid #ddd;
  flex: 1;
  padding: 30px 0;
  text-align: center;
}

@media (min-width: 1024px) {
  .post-sidebar {
    border: 0;
    flex: 1 0 30%;
    padding: 0 0 0 50px;
    text-align: initial;
  }
  [dir="rtl"] .post-sidebar {
    padding: 0 50px 0 0;
  }
}

.post-sidebar-title {
  font-size: 18px;
  font-weight: 600;
}

.post-comments {
  margin-bottom: 20px;
}

@media (min-width: 1024px) {
  .post-comments {
    margin-bottom: 0;
  }
}

/***** Community Badges *****/
/* Styles labels used next to the authors of article comments, community posts, and community comments */
.community-badge-title {
  background-color: #04444d;
  border-radius: 4px;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  padding: 0px 8px;
  vertical-align: top;
  white-space: nowrap;
  display: inline-flex;
  line-height: 18px;
  vertical-align: middle;
}

.profile-info .community-badge-title {
  padding: 2px 8px;
  line-height: 20px;
}

.community-badge-container-achievements {
  display: flex;
}

.community-badge-container-achievements > .community-badge-titles {
  margin-left: calc(28px - 0.5em);
}

[dir="rtl"] .community-badge-container-achievements > .community-badge-titles {
  margin-right: calc(28px - 0.5em);
}

.community-name-and-title-badges {
  display: flex;
  flex-wrap: wrap;
}

.community-badge {
  margin: 2px;
}

.community-badge-achievements {
  display: block;
  height: 16px;
  white-space: nowrap;
  width: 16px;
}

.profile-info .community-badge-achievements {
  height: 40px;
  width: 40px;
}

.community-title-badges {
  flex-basis: 100%;
  margin-top: 15px;
}

.community-badge-achievements-rest {
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  text-align: center;
  vertical-align: top;
}

.community-badge-achievements img {
  width: 100%;
  height: 100%;
}

.community-badge-titles img {
  width: 20px;
  height: 20px;
}

.profile-info .community-badge-achievements-rest {
  line-height: 40px;
  font-size: 20px;
}

/* Navigation element that collapses on mobile */
.collapsible-nav {
  flex-direction: column;
  font-size: 14px;
  position: relative;
}

@media (min-width: 768px) {
  .collapsible-nav {
    flex-direction: row;
  }
}

.collapsible-nav-border {
  border-bottom: 1px solid #ddd;
  border-top: 1px solid #ddd;
}

@media (min-width: 768px) {
  .collapsible-nav-border {
    border-top: 0;
  }
}

.collapsible-nav-toggle {
  top: calc(45px / 2);
  transform: translateY(-50%);
  position: absolute;
  right: 0;
  padding: 0;
  border: 0;
  background: none;
  width: 25px;
  height: 25px;
  border-radius: 50%;
}

@media (min-width: 768px) {
  .collapsible-nav-toggle {
    display: none;
  }
}

[dir="rtl"] .collapsible-nav-toggle {
  left: 0;
  right: auto;
}

.collapsible-nav-toggle-icon {
  display: none;
}

.collapsible-nav-toggle[aria-expanded="false"] .chevron-icon {
  display: inline-block;
}

.collapsible-nav-toggle[aria-expanded="true"] .x-icon {
  display: inline-block;
}

.collapsible-nav-toggle:focus {
  outline: none;
  border: 1px solid rgba(0, 156, 220, 1);
}

.collapsible-nav-list {
  display: flex;
  flex-direction: column;
}

@media (min-width: 768px) {
  .collapsible-nav-list {
    flex-direction: row;
  }
}

.collapsible-nav-list li {
  color: rgba(5, 5, 5, 1);
  line-height: 45px;
  order: 1;
}

@media (min-width: 768px) {
  .collapsible-nav-list li {
    line-height: normal;
    margin-right: 30px;
  }
  [dir="rtl"] .collapsible-nav-list li {
    margin-left: 30px;
    margin-right: 0;
  }
  .collapsible-nav-list li a {
    text-decoration: none;
    padding: 15px 0;
  }
}

.collapsible-nav-list li a {
  color: rgba(5, 5, 5, 1);
  display: block;
}

@media (min-width: 768px) {
  .collapsible-nav-list li:hover {
    border-bottom: 4px solid #ddd;
  }
  .collapsible-nav-list li:hover a:not([aria-current="page"]) {
    padding: 15px 0 11px 0;
    text-decoration: none;
  }
}

.collapsible-nav-list li:not([aria-selected="true"]),
.collapsible-nav-list li:not(.current) {
  display: none;
}

@media (min-width: 768px) {
  .collapsible-nav-list li:not([aria-selected="true"]),
  .collapsible-nav-list li:not(.current) {
    display: block;
  }
}

@media (min-width: 768px) {
  .collapsible-nav-list li[aria-selected="true"] {
    padding: 15px 0 11px 0;
  }
}

.collapsible-nav-list li[aria-selected="true"],
.collapsible-nav-list li.current {
  order: 0;
  position: relative;
}

@media (min-width: 768px) {
  .collapsible-nav-list li[aria-selected="true"],
  .collapsible-nav-list li.current {
    border-bottom: 4px solid rgba(0, 156, 220, 1);
    order: 1;
  }
}

.collapsible-nav-list li[aria-selected="true"] a,
.collapsible-nav-list li.current a {
  color: rgba(5, 5, 5, 1);
}

.collapsible-nav[aria-expanded="true"] li:not([aria-selected="true"]),
.collapsible-nav[aria-expanded="true"] li:not(.current) {
  display: block;
}

/* Sidebar navigation that collapses on mobile */
.collapsible-sidebar {
  flex: 1;
  max-height: 45px;
  overflow: hidden;
  padding: 10px 0;
  position: relative;
}

@media (min-width: 1024px) {
  .collapsible-sidebar {
    max-height: none;
    padding: 0;
  }
}

.collapsible-sidebar-title {
  margin-top: 0;
}

.collapsible-sidebar-toggle {
  position: absolute;
  top: calc(45px / 2);
  transform: translateY(-50%);
  right: 0;
  padding: 0;
  border: 0;
  background: none;
  width: 25px;
  height: 25px;
  border-radius: 50%;
}

@media (min-width: 1024px) {
  .collapsible-sidebar-toggle {
    display: none;
  }
}

[dir="rtl"] .collapsible-sidebar-toggle {
  left: 0;
  right: auto;
}

.collapsible-sidebar-toggle-icon {
  display: none;
}

.collapsible-sidebar-toggle[aria-expanded="false"] .chevron-icon {
  display: inline-block;
}

.collapsible-sidebar-toggle[aria-expanded="true"] .x-icon {
  display: inline-block;
}

.collapsible-sidebar-toggle:focus {
  outline: none;
  border: 1px solid rgba(0, 156, 220, 1);
}

.collapsible-sidebar-body {
  display: none;
}

@media (min-width: 1024px) {
  .collapsible-sidebar-body {
    display: block;
  }
}

.collapsible-sidebar[aria-expanded="true"] {
  max-height: none;
}

.collapsible-sidebar[aria-expanded="true"] .collapsible-sidebar-body {
  display: block;
}

/***** My activities *****/
.my-activities-nav {
  background-color: #f2f2f2;
  margin-bottom: 20px;
}

.my-activities-sub-nav {
  margin-bottom: 30px;
}

.my-activities-table .striped-list-title {
  /* My activities tables */
  display: block;
  margin-bottom: 10px;
  max-width: 350px;
  white-space: normal;
}

@media (min-width: 1024px) {
  .my-activities-table .striped-list-title {
    margin-bottom: 0;
    max-width: 500px;
    min-width: 350px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

.my-activities-table thead {
  display: none;
}

@media (min-width: 768px) {
  .my-activities-table thead {
    display: table-header-group;
  }
}

.my-activities-table th:first-child,
.my-activities-table td:first-child {
  padding-left: 0;
}

@media (min-width: 1024px) {
  .my-activities-table th:first-child,
  .my-activities-table td:first-child {
    width: 500px;
  }
}

.my-activities-table th:last-child,
.my-activities-table td:last-child {
  padding-right: 0;
}

.my-activities-table td:not(:first-child) {
  display: none;
}

@media (min-width: 768px) {
  .my-activities-table td:not(:first-child) {
    display: table-cell;
  }
}

/* Requests table */
.requests-search {
  width: 100%;
}

.requests-table-toolbar {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
}

@media (min-width: 768px) {
  .requests-table-toolbar {
    flex-direction: row;
  }
}

.requests-table-toolbar .search {
  flex: 1;
  width: 100%;
}

.requests-table-toolbar .request-table-filter {
  width: 100%;
}

@media (min-width: 768px) {
  .requests-table-toolbar .request-table-filter {
    width: auto;
  }
}

.requests-table-toolbar .request-filter {
  display: block;
}

@media (min-width: 768px) {
  .requests-table-toolbar .request-filter {
    margin: 0 0 0 30px;
  }
  [dir="rtl"] .requests-table-toolbar .request-filter {
    margin: 0 30px 0 0;
  }
}

.requests-table-toolbar .request-filter-label {
  font-size: 13px;
  margin-top: 30px;
}

@media (min-width: 768px) {
  .requests-table-toolbar .request-filter-label {
    margin-top: 0;
  }
}

.requests-table-toolbar select {
  max-height: 40px;
  margin-bottom: 30px;
  width: 100%;
}

@media (min-width: 768px) {
  .requests-table-toolbar select {
    margin-bottom: 0;
    max-width: 300px;
    width: auto;
  }
}

@media (min-width: 768px) {
  .requests-table-toolbar .organization-subscribe {
    margin-left: 10px;
  }
  [dir="rtl"] .requests-table-toolbar .organization-subscribe {
    margin: 0 10px 0 0;
  }
}

.requests-table-toolbar .organization-subscribe button {
  line-height: 40px;
  max-height: 40px;
  padding: 0 20px;
}

.requests-table-toolbar + .requests-search-info {
  margin-top: 15px;
}

.requests-table-toolbar + .requests-search-info.meta-data::after {
  content: "";
  margin: 0;
}

.requests-table-toolbar + .requests-search-info + .requests {
  margin-top: 20px;
}

.requests-table-toolbar + .requests {
  margin-top: 40px;
}

.requests .requests-table-meta {
  display: block;
}

@media (min-width: 768px) {
  .requests .requests-table-meta {
    display: none;
  }
}

.requests .requests-table thead {
  display: none;
}

@media (min-width: 768px) {
  .requests .requests-table thead {
    display: table-header-group;
  }
}

.requests .requests-table-info {
  display: block;
}

@media (min-width: 768px) {
  .requests .requests-table-info {
    display: table-cell;
    vertical-align: middle;
    width: auto;
  }
}

.requests .requests-table .requests-link {
  position: relative;
}

.requests .requests-table .requests-sort-symbol {
  position: absolute;
  left: calc(100% + 3px);
  bottom: 0;
  font-size: 10px;
}

/* Following table */
@media (min-width: 768px) {
  .subscriptions-subscribe button {
    width: auto;
  }
}

.subscriptions-table td:last-child {
  display: block;
}

@media (min-width: 768px) {
  .subscriptions-table td:last-child {
    display: table-cell;
  }
}

.subscriptions-table td:first-child {
  display: flex;
  align-items: center;
}

.subscriptions-table .user-avatar {
  margin-right: 10px;
}

.subscriptions .striped-list-title {
  display: inline-block;
  vertical-align: middle;
}

/* Contributions table */
.contributions-table td:last-child {
  color: #383838;
  font-size: 13px;
}

@media (min-width: 768px) {
  .contributions-table td:last-child {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
  }
}

.no-activities {
  color: #383838;
}

/***** Request *****/
.request-container {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
}

@media (min-width: 1024px) {
  .request-container {
    align-items: flex-start;
    flex-direction: row;
  }
}

.request-container .comment-container {
  min-width: 0;
}

.request-breadcrumbs {
  margin-bottom: 40px;
}

@media (min-width: 1024px) {
  .request-breadcrumbs {
    margin-bottom: 60px;
  }
}

.request-main {
  flex: 1 0 auto;
  order: 1;
}

.request-main .comment-fields, .request-main .request-submit-comment {
  display: none;
}

.request-main .comment-fields.shown {
  display: block;
}

.request-main .request-submit-comment.shown {
  display: inline;
}

@media (min-width: 1024px) {
  .request-main {
    flex: 0 0 66%;
    order: 0;
    min-width: 0;
  }
}

.request-main .comment-form-controls {
  display: block;
}

.request-main .comment-ccs {
  display: block;
}

.request-main .comment-show-container {
  border-radius: 2px;
  border: 1px solid #ddd;
  color: #383838;
  text-align: inherit;
  padding: 8px 25px;
  width: 100%;
}

.request-main .comment-show-container.hidden {
  display: none;
}

.request-main .form-field.comment-ccs > ul {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom: 0;
}

.request-main .form-field.comment-ccs > ul[data-hc-focus="true"] {
  border: 1px solid rgba(0, 156, 220, 1);
}

.request-main .form-field.comment-ccs > input[type="text"] {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom: 0;
}

.request-main .comment-ccs + textarea {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  margin-top: 0;
}

.request-main .comment-ccs + textarea:focus {
  border-top: 1px solid rgba(0, 156, 220, 1);
}

.request-main input#mark_as_solved {
  display: none;
}

.request-title {
  width: 100%;
}

@media (min-width: 1024px) {
  .request-title {
    border-bottom: 1px solid #ddd;
    margin-bottom: 0;
    max-width: 66%;
    padding-bottom: 20px;
  }
}

.request-sidebar {
  border-bottom: 1px solid #ddd;
  border-top: 1px solid #ddd;
  flex: 1 0 auto;
  order: 0;
}

@media (min-width: 1024px) {
  .request-sidebar {
    background-color: #f7f7f7;
    border: 0;
    font-size: 13px;
    flex: 0 0 auto;
    padding: 0 20px;
    width: 30%;
  }
}

.request-sidebar h2 {
  font-size: 15px;
  font-weight: 600;
  position: relative;
}

@media (min-width: 1024px) {
  .request-sidebar h2 {
    display: none;
  }
}

.request-details {
  border-bottom: 1px solid #ddd;
  font-size: 0;
  margin: 0;
  padding-bottom: 20px;
}

.request-details:last-child {
  border: 0;
}

.request-details dt, .request-details dd {
  display: inline-block;
  vertical-align: top;
  font-size: 13px;
  margin: 20px 0 0 0;
}

.request-details dd {
  padding: 0 10px;
  width: 60%;
}

.request-details dd::after {
  content: "\A";
  white-space: pre;
}

.request-details dt {
  color: #383838;
  width: 40%;
}

.request-details .request-collaborators {
  display: inline-block;
}

.request-attachments dt, .request-attachments dd {
  width: 100%;
}

.request-attachments dd {
  margin: 10px 0 0 0;
}

.request-form textarea {
  min-height: 120px;
}

.request-follow-up {
  padding-top: 20px;
}

/***** Pagination *****/
.pagination {
  margin: 20px 0;
  text-align: center;
}

.pagination-next, .pagination-prev, .pagination-first, .pagination-last {
  display: inline-block;
}

.pagination-first-link, .pagination-last-link {
  padding: 0 10px;
}

.pagination-first-text, .pagination-last-text {
  border: 0;
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;
}

.pagination-next-link {
  padding-right: 10px;
}

.pagination-next-text {
  margin-right: 10px;
}

[dir="rtl"] .pagination-next-link {
  padding-left: 10px;
}

[dir="rtl"] .pagination-next-text {
  margin-left: 10px;
}

.pagination-prev-link {
  padding-left: 10px;
}

.pagination-prev-text {
  margin-left: 10px;
}

[dir="rtl"] .pagination-prev-link {
  padding-right: 10px;
}

[dir="rtl"] .pagination-prev-text {
  margin-right: 10px;
}

/***** Metadata *****/
.meta-group {
  display: block;
}

.meta-group-opposite {
  float: right;
}

[dir="rtl"] .meta-group-opposite {
  float: left;
}

.meta-group * {
  display: inline;
}

.meta-data {
  color: #383838;
  font-size: 13px;
}

.meta-data:not(:last-child)::after {
  content: "\00B7";
  margin: 0 5px;
}

/* User Profiles */
.profile-header {
  padding: 30px 0;
  background-color: #f7f7f7;
}

.profile-header .container {
  display: flex;
  flex-wrap: wrap;
}

@media (min-width: 768px) {
  .profile-header .container {
    flex-wrap: nowrap;
  }
}

.profile-header .profile-info {
  flex-basis: 100%;
  display: flex;
  flex-wrap: wrap;
  min-width: 0;
}

.profile-avatar {
  position: relative;
  line-height: 0;
  align-self: center;
  margin-right: 10px;
}

[dir="rtl"] .profile-avatar {
  margin-left: 10px;
  margin-right: 0;
}

.profile-avatar .user-avatar {
  width: 80px;
  height: 80px;
}

.profile-avatar .icon-agent {
  bottom: 0;
  right: 0;
}

.profile-header .basic-info {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex-grow: 1;
  flex-basis: 0;
  min-width: 0;
}

.profile-header .basic-info .name {
  margin: 0;
  line-height: 25px;
}

.profile-header .options {
  display: flex;
  flex-basis: 100%;
  margin-top: 12px;
  align-items: flex-start;
  flex-wrap: wrap;
}

@media (min-width: 768px) {
  .profile-header .options {
    flex-wrap: nowrap;
    flex-basis: auto;
    margin-top: 0;
    margin-left: 10px;
  }
  [dir="rtl"] .profile-header .options {
    margin-left: 0;
    margin-right: 10px;
  }
  .profile-header .options > :not(:last-child) {
    margin-bottom: 0;
    margin-right: 10px;
  }
  [dir="rtl"] .profile-header .options > :not(:last-child) {
    margin-left: 10px;
    margin-right: 0;
  }
}

.user-profile-actions {
  width: 100%;
  margin-bottom: 15px;
}

.profile-header .description {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  margin: 15px 0;
  flex-basis: 100%;
}

.profile-stats {
  font-size: 13px;
  display: flex;
  flex-direction: column;
  flex-basis: 100%;
}

.profile-stats .stat {
  display: flex;
  margin-bottom: 10px;
}

.profile-stats .stat-label {
  color: #383838;
  flex: 0 0 100px;
  margin-right: 10px;
}

[dir="rtl"] .profile-stats .stat-label {
  margin-left: 10px;
  margin-right: 0;
}

.profile-stats-activity {
  border-top: solid 1px #ddd;
  margin-top: 15px;
}

@media (min-width: 768px) {
  .profile-stats-activity {
    border-top: 0;
    flex-direction: row;
  }
}

@media (min-width: 768px) {
  .profile-stats-activity .stat {
    flex-direction: column;
  }
}

.profile-stats-activity .stat:first-child {
  margin-top: 10px;
}

@media (min-width: 768px) {
  .profile-stats-activity .stat:first-child {
    margin-top: 0;
  }
}

@media (min-width: 768px) {
  .profile-stats-activity .stat:not(:last-child) {
    margin-right: 40px;
  }
  [dir="rtl"] .profile-stats-activity .stat:not(:last-child) {
    margin-left: 40px;
    margin-right: 0;
  }
}

@media (min-width: 768px) {
  .profile-stats-activity .stat-label {
    flex: 0 1 auto;
  }
}

.profile-stats-counters {
  border-bottom: solid 1px #ddd;
}

@media (min-width: 768px) {
  .profile-stats-counters {
    flex: 0 0 200px;
    border-bottom: 0;
    margin-left: 40px;
  }
  [dir="rtl"] .profile-stats-counters {
    margin-left: 0;
    margin-right: 40px;
  }
}

@media (min-width: 1024px) {
  .profile-stats-counters {
    flex: 0 0 270px;
    margin-left: 60px;
  }
  [dir="rtl"] .profile-stats-counters {
    margin-right: 60px;
    margin-left: 0;
  }
}

@media (min-width: 768px) {
  .profile-stats-counters .stat {
    flex-direction: column;
  }
}

@media (min-width: 1024px) {
  .profile-stats-counters .stat {
    flex-direction: row;
  }
}

@media (min-width: 768px) {
  .profile-stats-counters .stat:not(:last-child) {
    margin-bottom: 15px;
  }
}

@media (min-width: 768px) {
  .profile-stats-counters .stat-label {
    flex: 0 1 auto;
  }
}

@media (min-width: 1024px) {
  .profile-stats-counters .stat-label {
    flex: 0 0 100px;
  }
}

.profile-private-badge {
  flex-basis: 100%;
  border: solid 1px rgba(0, 156, 220, 1);
  border-radius: 4px;
  color: rgba(0, 156, 220, 1);
  padding: 5px 20px;
  font-size: 12px;
  text-align: center;
}

.profile-private-badge .profile-private-icon {
  margin-left: 5px;
  line-height: 15px;
}

@media (min-width: 768px) {
  .profile-private-badge {
    flex-basis: auto;
  }
}

.profile-nav {
  background-color: #f2f2f2;
  margin-bottom: 37px;
}

.profile-section {
  width: 100%;
}

@media (min-width: 1024px) {
  .profile-section {
    width: calc(100% - 330px);
  }
}

.profile-section-header {
  display: flex;
  flex-wrap: wrap;
}

.profile-section-title {
  flex-basis: 100%;
  margin-bottom: 0;
}

.profile-section-description {
  flex-basis: 100%;
  padding: 10px 0;
  color: #383838;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (min-width: 768px) {
  .profile-section-description {
    flex: 1 0 50%;
    padding-bottom: 0;
  }
}

.profile-section-sorter {
  flex-basis: 100%;
  border-top: solid 1px #eee;
  font-size: 13px;
}

.profile-section-sorter .dropdown-toggle {
  padding: 10px 0;
  width: 100%;
}

.profile-section-sorter .dropdown-toggle::after {
  position: absolute;
  right: 0;
}

[dir="rtl"] .profile-section-sorter .dropdown-toggle::after {
  left: 0;
  right: initial;
}

@media (min-width: 768px) {
  .profile-section-sorter .dropdown-toggle::after {
    position: relative;
  }
}

@media (min-width: 768px) {
  .profile-section-sorter {
    flex: 0 1 auto;
    padding-top: 0;
    border-top: 0;
    margin-left: 20px;
  }
  [dir="rtl"] .profile-section-sorter {
    margin-left: 0;
    margin-right: 20px;
  }
}

.profile-badges-items {
  margin-top: 25px;
}

.profile-badges-item {
  border-top: 1px solid #ddd;
  display: flex;
  flex: 1;
  flex-direction: row;
  justify-content: flex-start;
  padding: 27px 12px;
}

.profile-badges-item > div {
  padding-right: 12px;
  padding-left: 12px;
}

.profile-badges-item-image {
  height: 40px;
  width: 40px;
  margin-right: 12px;
}

.profile-badges-item-image img {
  max-height: 40px;
}

[dir="rtl"] .profile-badges-item-image {
  margin-left: 12px;
  margin-right: 0;
}

.profile-badges-item-title, .profile-badges-item-metadata-title {
  font-size: 15px;
  margin-bottom: 10px;
}

.profile-badges-item-title {
  font-weight: 600;
}

.profile-badges-item-description, .profile-badges-item-metadata-description {
  color: #383838;
  font-size: 13px;
  margin: 0;
}

.profile-badges-item-metadata {
  margin-left: auto;
  text-align: right;
}

[dir="rtl"] .profile-badges-item-metadata {
  margin-left: 0;
  margin-right: auto;
  text-align: left;
}

.profile-contribution {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  padding: 20px 0;
  position: relative;
}

.profile-contribution-header {
  margin-bottom: 5px;
}

.profile-contribution-title {
  margin: 0 0 5px 0;
  display: inline;
  line-height: 21px;
  font-size: 15px;
  vertical-align: middle;
}

.profile-contribution-body {
  margin: 10px 0;
}

.profile-contribution-list > .profile-contribution {
  border-top: 1px solid #eee;
}

@media (min-width: 768px) {
  .profile-contribution-list > .profile-contribution {
    padding-left: 30px;
  }
  [dir="rtl"] .profile-contribution-list > .profile-contribution {
    padding-right: 30px;
    padding-left: 0;
  }
}

.profile-contribution-list > .profile-contribution:last-child {
  border-bottom: 1px solid #eee;
}

.profile-contribution-icon {
  left: 0;
  position: absolute;
  color: #ccc;
  line-height: 25px;
}

[dir="rtl"] .profile-contribution-icon {
  right: 0;
}

.profile-contribution-icon svg {
  vertical-align: middle;
}

.profile-contribution-list .profile-contribution-header {
  margin-left: 30px;
}

[dir="rtl"] .profile-contribution-list .profile-contribution-header {
  padding-right: 30px;
  padding-left: 0;
}

@media (min-width: 768px) {
  .profile-contribution-list .profile-contribution-header {
    margin-left: 0;
  }
  [dir="rtl"] .profile-contribution-list .profile-contribution-header {
    padding-right: 0;
  }
}

.profile-comments .profile-contribution-breadcrumbs {
  margin-left: 30px;
}

[dir="rtl"] .profile-comments .profile-contribution-breadcrumbs {
  padding-right: 30px;
  padding-left: 0;
}

@media (min-width: 768px) {
  .profile-comments .profile-contribution-breadcrumbs {
    margin-left: 0;
  }
  [dir="rtl"] .profile-comments .profile-contribution-breadcrumbs {
    padding-right: 0;
  }
}

.profile-section .no-activity,
.profile-section .private-activity {
  display: block;
  margin-top: 40px;
  color: #999;
}

.private-activity-icon {
  margin-right: 10px;
}

[dir="rtl"] .private-activity-icon {
  margin-right: 0;
  margin-left: 10px;
}

.profile-activity-list {
  margin-top: 25px;
}

.profile-activity {
  position: relative;
  padding-bottom: 30px;
}

@media (min-width: 768px) {
  .profile-activity {
    padding-left: 20px;
  }
  [dir="rtl"] .profile-activity {
    padding-right: 20px;
    padding-left: 0;
  }
}

@media (min-width: 768px) {
  .profile-activity:not(:last-child) {
    border-left: 1px solid #ddd;
  }
  [dir="rtl"] .profile-activity:not(:last-child) {
    border-left: 0;
    border-right: 1px solid #ddd;
  }
}

.profile-activity-header {
  display: flex;
  align-items: center;
  margin-left: 35px;
}

[dir="rtl"] .profile-activity-header {
  margin-left: 0;
  margin-right: 35px;
}

@media (min-width: 768px) {
  .profile-activity-header {
    margin-left: 0;
  }
  [dir="rtl"] .profile-activity-header {
    margin-right: 0;
  }
}

.profile-activity-header .user-avatar {
  width: 40px;
  height: 40px;
  margin-right: 10px;
  min-width: 40px;
  align-self: flex-start;
}

[dir="rtl"] .profile-activity-header .user-avatar {
  margin-left: 10px;
  margin-right: 0;
}

.profile-activity-description {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  margin: 0;
  min-width: 0;
  width: 100%;
}

.profile-activity-description span:first-child {
  font-weight: 600;
  display: inline;
}

.profile-activity-contribution {
  padding: 20px;
  margin-top: 10px;
  border-radius: 8px;
  background-color: #f7f7f7;
}

@media (min-width: 768px) {
  .profile-activity-contribution {
    margin-top: 0;
    margin-left: 50px;
  }
  [dir="rtl"] .profile-activity-contribution {
    margin-left: 0;
    margin-right: 50px;
  }
}

.profile-activity-icon {
  position: absolute;
  left: 0;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background-size: 14px 14px;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  background-position: 50% 50%;
  text-align: center;
  color: #ccc;
}

[dir="rtl"] .profile-activity-icon {
  right: 0;
}

@media (min-width: 768px) {
  .profile-activity-icon {
    left: -14px;
  }
  [dir="rtl"] .profile-activity-icon {
    right: -14px;
  }
}

.profile-activity-icon svg {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  width: 1em;
  height: 1em;
  margin: auto;
}

/***** Search results *****/
.search-results {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
}

@media (min-width: 1024px) {
  .search-results {
    flex-direction: row;
  }
}

.search-results-column {
  flex: 1;
}

@media (min-width: 1024px) {
  .search-results-column {
    flex: 0 0 75%;
  }
}

.search-results-sidebar {
  border-top: 1px solid #ddd;
  flex: 1 0 auto;
  margin-bottom: 20px;
  padding: 0;
}

@media (min-width: 1024px) {
  .search-results-sidebar {
    border: 0;
    flex: 0 0 20%;
    height: auto;
  }
}

.search-results-sidebar .sidenav-item {
  border-radius: 4px;
  padding: 10px 36px;
  margin-bottom: 4px;
  color: rgba(5, 5, 5, 1);
}

.search-results-sidebar .sidenav-item:hover, .search-results-sidebar .sidenav-item.current {
  background-color: #e9ebed;
  text-decoration: none;
}

.search-results-sidebar .sidenav-subitem {
  unicode-bidi: embed;
}

.search-results-sidebar .sidenav-tag {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  flex-grow: 0;
}

.search-results-sidebar .sidenav-tag .content-tag {
  background: #E9EBED;
  border-radius: 4px;
  padding: 4px 12px;
  text-decoration: none;
}

.search-results-sidebar .sidenav-tag .content-tag .label {
  font-style: normal;
  font-weight: 600;
  font-size: 12px;
  line-height: 24px;
  text-align: center;
  letter-spacing: -0.000427656px;
  color: #49545C;
  flex-grow: 0;
  vertical-align: middle;
  display: inline-block;
}

.search-results-sidebar .sidenav-tag .content-tag .close-icon {
  color: #555555;
  vertical-align: middle;
  display: inline-block;
}

.search-results-sidebar .collapsible-sidebar {
  margin-bottom: 30px;
}

.search-results-sidebar .collapsible-sidebar[aria-expanded="false"] .multibrand-filter-list {
  display: none;
}

@media (min-width: 1024px) {
  .search-results-sidebar .collapsible-sidebar[aria-expanded="false"] .multibrand-filter-list {
    display: block;
  }
}

.search-results-sidebar .multibrand-filter-list--collapsed li:nth-child(1n + 6) {
  display: none;
}

.search-results-sidebar .multibrand-filter-list .doc-count {
  color: #666;
}

.search-results-sidebar .see-all-filters {
  background: none;
  border: none;
  cursor: pointer;
  display: block;
  padding: 10px;
  color: rgba(0, 156, 220, 1);
}

.search-results-sidebar .see-all-filters[aria-hidden="true"] {
  display: none;
}

.search-results-sidebar .see-all-filters:hover {
  text-decoration: underline;
}

.search-results-sidebar .see-all-filters::after {
  content: ' \2304';
  font-weight: bold;
}

.search-results-subheading {
  font-size: 18px;
  font-weight: 600;
}

.search-results-list {
  margin-bottom: 25px;
}

.search-results-list > li {
  padding: 20px 0;
}

.search-results-list > li:first-child {
  border-top: 1px solid #ddd;
}

.search-results-list > li h2 {
  margin-bottom: 0;
}

.search-results .meta-group {
  display: block;
  align-items: center;
  clear: both;
  color: #666;
}

@media (min-width: 1024px) {
  .search-results .meta-group {
    display: flex;
  }
}

.search-results .meta-group > li {
  display: block;
}

@media (min-width: 1024px) {
  .search-results .meta-group > li {
    display: inline;
  }
}

@media (min-width: 1024px) {
  .search-results .meta-group li:first-child {
    flex: 1;
  }
}

.search-results .meta-group .meta-data {
  color: inherit;
}

[dir="ltr"] .search-results .meta-group .meta-data:not(:last-child) {
  margin-right: 20px;
}

[dir="rtl"] .search-results .meta-group .meta-data:not(:last-child) {
  margin-left: 20px;
}

.search-results .meta-group .meta-data::after {
  content: none;
}

.search-results-description {
  margin-top: 10px;
  word-break: break-word;
}

.search-results .no-results {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 4rem;
}

.search-results .no-results .headline {
  color: #2F3941;
  font-weight: 400;
  font-size: 18px;
  line-height: 24px;
  letter-spacing: -0.45px;
}

.search-results .no-results .action-prompt {
  color: #68737D;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.154px;
}

.search-results .no-results .action-prompt a {
  color: #1F73B7;
}

.search-results .no-results .action-prompt a:visited {
  color: #1F73B7;
}

.search-result-title {
  font-size: 16px;
  display: inline-block;
}

[dir="ltr"] .search-result-icons {
  float: right;
}

[dir="rtl"] .search-result-icons {
  float: left;
}

.search-result-votes, .search-result-meta-count {
  color: #383838;
  display: inline-block;
  font-size: 13px;
  padding: 4px 5px;
  position: relative;
}

.search-result-votes-icon, .search-result-meta-count-icon {
  color: rgba(0, 156, 220, 1);
  vertical-align: middle;
  width: 13px;
  height: 13px;
}

[dir="ltr"] .search-result-votes, [dir="ltr"] .search-result-meta-count {
  margin-left: 5px;
}

[dir="ltr"] .search-result-votes::before, [dir="ltr"] .search-result-meta-count::before {
  margin-right: 3px;
}

[dir="rtl"] .search-result-votes, [dir="rtl"] .search-result-meta-count {
  margin-right: 5px;
}

[dir="rtl"] .search-result-votes::before, [dir="rtl"] .search-result-meta-count::before {
  margin-left: 3px;
}

.search-result .meta-group {
  align-items: center;
}

.search-result-breadcrumbs {
  margin: 0;
}

@media (min-width: 1024px) {
  .search-result-breadcrumbs {
    display: table-row;
  }
}

@media (min-width: 1024px) {
  .search-result-breadcrumbs li {
    display: table-cell;
  }
}

/* By default use bold instead of italic to highlight */
.search-results-description em {
  font-style: normal;
  font-weight: bold;
}

/* Add a yellow background for Chinese */
html[lang|="zh"] .search-results-description em {
  font-style: normal;
  background: yellow;
}

/***** Notifications *****/
.notification {
  border: 1px solid;
  display: table;
  font-family: sans-serif;
  font-size: 12px;
  padding: 13px 15px;
  transition: height .2s;
  width: 100%;
  color: #555;
}

.notification a {
  color: #158ec2;
}

.notification-inner {
  margin: 0 auto;
  padding: 0 20px;
  max-width: 980px;
}

.notification-icon, .notification-text, .notification-dismiss {
  display: table-cell;
  vertical-align: middle;
}

.notification-text {
  padding: 0 15px;
  width: 100%;
}

.notification + .notification {
  margin-bottom: -1px;
  position: relative;
  top: -1px;
}

/* Error */
.notification-error {
  background: #ffeded;
  border-color: #f7cbcb;
}

.notification-error .notification-icon::before, .notification-error .notification-inline.notification-error::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cg fill='none' stroke='%23555555'%3E%3Ccircle cx='5.5' cy='6.5' r='5'/%3E%3Cpath stroke-linecap='round' d='M5.5 3.5v3'/%3E%3C/g%3E%3Ccircle cx='5.5' cy='9' r='1' fill='%23555555'/%3E%3C/svg%3E");
}

/* Notice */
.notification-notice {
  background: #dbf3ff;
  border-color: #b5e0f5;
}

.notification-notice .notification-icon::before, .notification-notice .notification-inline.notification-error::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cg fill='none' stroke='%23555555'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M3.5 6l2 2L9 4.5'/%3E%3Ccircle cx='6' cy='6' r='5.5'/%3E%3C/g%3E%3C/svg%3E");
}

/* Alert / Lock */
.notification-alert {
  color: #ad5e18;
  background: #fff8ed;
  border-color: #fcdba9;
}

.notification-alert .notification-icon::before, .notification-alert .notification-inline.notification-error::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%23ad5e18' stroke-linecap='round' d='M5.06 1.27l-4.5 8.5c-.18.33.06.73.44.73h9c.38 0 .62-.4.44-.73l-4.5-8.5a.494.494 0 00-.88 0zM5.5 4v2'/%3E%3Ccircle cx='5.5' cy='8' r='.8' fill='%23ad5e18'/%3E%3C/svg%3E");
}

.notification-icon::before, .notification-inline.notification-error::before {
  background-size: cover;
  content: "";
  display: inline-block;
  height: 14px;
  width: 14px;
  vertical-align: middle;
}

/* Dismiss button */
.notification-dismiss, a.notification-dismiss {
  color: #555;
  cursor: pointer;
  opacity: .6;
  transition: opacity 100ms ease;
  text-decoration: none !important;
}

.notification-dismiss:hover {
  opacity: 1;
}

/* Inline notifications */
.notification-inline {
  border-radius: 4px;
  line-height: 14px;
  margin-top: 5px;
  padding: 5px;
  position: relative;
  text-align: left;
  vertical-align: middle;
}

[dir="rtl"] .notification-inline {
  text-align: right;
}

.notification-inline[aria-hidden="true"] {
  display: none;
}

.notification-inline.notification-error::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cg fill='none' stroke='%23e35b66'%3E%3Ccircle cx='5.5' cy='6.5' r='5'/%3E%3Cpath stroke-linecap='round' d='M5.5 3.5v3'/%3E%3C/g%3E%3Ccircle cx='5.5' cy='9' r='1' fill='%23e35b66'/%3E%3C/svg%3E");
  margin: -2px 5px 0 0;
}

[dir="rtl"] .notification-inline.notification-error::before {
  margin: 0 0 0 5px;
}

.notification-inline.notification-error {
  background-color: #fff0f1;
  border: 1px solid #e35b66;
  color: #cc3340;
}

.notification-inline.notification-large {
  padding: 13px 15px;
  margin-bottom: 25px;
}

.notification-left-aligned {
  text-align: left;
  padding-left: 0;
}

html[dir="rtl"] .notification-left-aligned {
  text-align: right;
  padding-left: auto;
  padding-right: 0;
}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-toggle {
  cursor: pointer;
  background: none;
  border: 0;
  display: inline-block;
  padding: 0;
  text-align: initial;
  vertical-align: middle;
}

.dropdown-toggle:hover {
  text-decoration: none;
}

.dropdown-toggle > * {
  display: inline-block;
}

.dropdown-menu {
  background: #fff;
  border: 1px solid #87929D;
  border-radius: 3px;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
  display: none;
  font-size: 14px;
  font-style: normal;
  font-weight: normal;
  left: 0;
  margin-top: 1px;
  min-width: 170px;
  padding: 10px 0;
  position: absolute;
  text-align: left;
  z-index: 1000;
}

[dir="rtl"] .dropdown-menu {
  text-align: right;
}

.dropdown-menu[aria-expanded="true"] {
  display: block;
}

.dropdown-menu [role="separator"] {
  border-bottom: 1px solid #e9ebed;
  margin: 4px 0;
}

.dropdown-menu [role="menuitem"] {
  color: #333;
  cursor: pointer;
  display: block;
  padding: 7px 40px 7px 20px;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
  -webkit-appearance: none;
  text-align: start;
  line-height: inherit;
  width: 100%;
}

[dir="rtl"] .dropdown-menu [role="menuitem"] {
  padding: 7px 20px 7px 40px;
}

.dropdown-menu [role="menuitem"]:hover, .dropdown-menu [role="menuitem"]:focus {
  background: #f3f3f3;
  text-decoration: none;
  color: #333;
}

.dropdown-menu [role="menuitem"][aria-selected="true"] {
  cursor: default;
}

.dropdown-menu [role="menuitem"][aria-selected="true"]::after {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M1 7l3 3 7-7'%3E%3C/path%3E%3C/svg%3E");
  display: inline-block;
  height: 12px;
  margin-left: 10px;
  width: 12px;
}

[dir="rtl"] .dropdown-menu [role="menuitem"][aria-selected="true"]::after {
  margin-left: 0;
  margin-right: 10px;
  float: left;
}

.dropdown-menu [role="menuitem"][hidden], .dropdown-menu [role="menuitem"][aria-hidden="true"] {
  display: none !important;
}

.dropdown-menu-end {
  left: auto;
  right: 0;
}

.dropdown-menu-top {
  bottom: 100%;
  margin-bottom: 1px;
}

[dir="rtl"] .dropdown-menu {
  left: auto;
  right: 0;
  text-align: right;
}

[dir="rtl"] .dropdown-menu-end {
  left: 0;
  right: auto;
}

.dropdown-chevron-icon {
  vertical-align: middle;
}

.content-tags > p {
  color: #68737D;
  margin-top: 32px;
  margin-bottom: 4px;
}

.content-tags-add-hint {
  color: #68737D;
  font-size: 14px;
}

.content-tag-list {
  display: flex;
  flex-wrap: wrap;
  word-break: break-word;
}

.content-tag-list li {
  border-right: 1px solid #C2C8CC;
  margin-bottom: 4px;
}

[dir="ltr"] .content-tag-list li {
  padding-right: 8px;
  margin-right: 8px;
}

[dir="rtl"] .content-tag-list li {
  padding-left: 8px;
  margin-left: 8px;
}

.content-tag-list li:last-child {
  border: none;
}

/***** WYSIWYG Editor *****/
#hc-wysiwyg {
  border: 1px solid #87929D;
}

/***** Upload Dropzone *****/
.upload-dropzone {
  border: 1px solid #87929D;
}

/***** Custom Header Text Code by Matt *****/

.abvs-headtext {
  color: #FFFFFF;
}

.abvs-headtext h1 {
  font-size: 32px;
  color: #000000;
  margin: 0px 0px 24px 0px;
 /* text-shadow: 1px 1px 1px black, 0 0 0.01em #0089d7, 0 0 0.01em #0089d7; */
}

/* AIWFM-HERO-001 START: remove unintended mobile heading shadow */
@media (max-width: 768px) {
  .abvs-headtext h1 {
    margin: 0 0 10px;
    color: #000000;
    font-size: 24px;
    text-shadow: none;
  }
}
/* AIWFM-HERO-001 END */

.abvs-subtext {
  color: #ffffff;
}

.abvs-subtext h3 {
  font-size: 14px;
  color: #000000;
  margin: 84px 0px 0px 0px; 
  font-style:italic;
 /* text-shadow: 1px 1px 2px black, 0 0 0.01em #0089d7, 0 0 0.01em #0089d7; */
}

@media (max-width: 768px) {
.abvs-subtext h3 {
  font-size: 12px;
  color: #ffffff;
  margin: 112px 0px 10px 0px; 
  font-style:italic;
  text-shadow: 1px 1px 2px black, 0 0 0.01em #0089d7, 0 0 0.01em #0089d7;
	}
}
/*MW-Notificaiton Banner CSS */
/* Common, default styles for the notification box */

/* change the background color by editing "background"  */
/* change the text color by editing "color"  */
.ns-box {
	position: relative;
	background: rgba(153, 51, 204,0.85);
	padding: 5px 1px 1px 20px;
	line-height: 1.4;
	z-index: 1000;
	pointer-events: none;
	color: rgba(250,251,255,0.95);
	font-size: 85%;
  border-bottom: 1px solid #DDD;
}

.ns-box.ns-show {
	pointer-events: auto;
}

.ns-box a {
	color: inherit;
  opacity: 0.7;
	font-weight: 700;
}

.ns-box a:hover,
.ns-box a:focus {
	opacity: 1;
}

.ns-box p {
    margin: 0;
}

.ns-box.ns-show,
.ns-box.ns-visible {
	pointer-events: auto;
}

.ns-close {
	width: 20px;
	height: 20px;
	position: absolute;
	right: 4px;
	top: 4px;
	overflow: hidden;
	text-indent: 100%;
	cursor: pointer;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.ns-close:hover,
.ns-close:focus {
	outline: none;
}

.ns-close::before,
.ns-close::after {
	content: '';
	position: absolute;
	width: 3px;
	height: 60%;
	top: 50%;
	left: 50%;
	background: #6e6e6e;
}

.ns-close:hover::before,
.ns-close:hover::after {
	background: #fff;
}

.ns-close::before {
	-webkit-transform: translate(-50%,-50%) rotate(45deg);
	transform: translate(-50%,-50%) rotate(45deg);
}

.ns-close::after {
	-webkit-transform: translate(-50%,-50%) rotate(-45deg);
	transform: translate(-50%,-50%) rotate(-45deg);
}

.ns-box-inner i {
    color: #fff;
    font-size: 3.8em;
}

.megaphone:before {
  content:'\1F4E3';
  font-family: "entypo";
  font-size: 2.2em;
}

/* Top bar notifications */
.ns-box.ns-bar {
	top: 0;
	left: 0;
	width: 100%;
}

.ns-bar .ns-close {
	background: transparent;
	margin-top: 15px;
	right: 20px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.ns-bar .ns-close::before,
.ns-bar .ns-close::after {
	background: #b7b5b3;
}

[class^="ns-effect-"].ns-bar.ns-hide,
[class*=" ns-effect-"].ns-bar.ns-hide {
	-webkit-animation-direction: reverse;
	animation-direction: reverse;
}



/* Slide on top */
.ns-effect-slidetop {
	box-shadow: inset 5.4em 0 rgba(0,0,0,0.1);
}

.ns-effect-slidetop .icon {
	position: absolute;
	display: block;
	font-size: 109%;
	top: 50%;
	left: 1em;
	-webkit-transform: translate3d(0,-20%,0);
	transform: translate3d(0,-20%,0);
}

.ns-effect-slidetop p {
	padding: 0 3.2em;
	font-size: 1.2em;
	display: inline-block;
}

.ns-effect-slidetop .ns-close::before,
.ns-effect-slidetop .ns-close::after {
	width: 2px;
	background: #fff;
}

.ns-effect-slidetop .ns-close:hover::before,
.ns-effect-slidetop .ns-close:hover::after {
	background: #fff;
}

.ns-effect-slidetop.ns-show .icon,
.ns-effect-slidetop.ns-show p {
	-webkit-animation-name: animScaleUp;
	animation-name: animScaleUp;
	-webkit-animation-duration: 0.3s;
	animation-duration: 0.3s;
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}

.ns-effect-slidetop.ns-show p {
	-webkit-animation-name: animFade;
	animation-name: animFade;
}

@-webkit-keyframes animScaleUp {
	0% { opacity: 0; -webkit-transform: translate3d(0,-50%,0) scale3d(0,0,1); }
	100% { opacity: 1; -webkit-transform: translate3d(0,-50%,0) scale3d(1,1,1); }
}

@keyframes animScaleUp {
	0% { opacity: 0; -webkit-transform: translate3d(0,-50%,0) scale3d(0,0,1); transform: translate3d(0,-50%,0) scale3d(0,0,1); }
	100% { opacity: 1; -webkit-transform: translate3d(0,-50%,0) scale3d(1,1,1); transform: translate3d(0,-50%,0) scale3d(1,1,1); }
}

.ns-effect-slidetop.ns-show,
.ns-effect-slidetop.ns-hide {
	-webkit-animation-name: animSlideTop;
	animation-name: animSlideTop;
	-webkit-animation-duration: 0.3s;
	animation-duration: 0.3s;
}

@-webkit-keyframes animSlideTop {
	0% { -webkit-transform: translate3d(0,-100%,0); }
	100% { -webkit-transform: translate3d(0,0,0); }
}

@keyframes animSlideTop {
	0% { -webkit-transform: translate3d(0,-100%,0); transform: translate3d(0,-100%,0); }
	100% { -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); }
}

/* AIWFM-TOK-001 START: shared design tokens */
:root {
  /* Colors */
  --aiwfm-color-primary: #0040dd;
  --aiwfm-color-neutral-dark: #323439;
  --aiwfm-color-text: #000;
  --aiwfm-color-text-muted: #72757a;
  --aiwfm-color-border: #dddfe5;
  --aiwfm-color-surface: #fff;
  --aiwfm-color-icon-background: #fff3eb;
  --aiwfm-color-focus: #0040dd;
  --aiwfm-color-accent: #ff6600;
  --aiwfm-color-surface-beige: #f8f6f3; /* AIWFM-CATEGORY-001: Figma "Beige BG" */
  --aiwfm-color-section-active-bg: #f9f8f5; /* AIWFM-CATNAV-001: active section row background */

  /* Typography */
  --aiwfm-font-family-base: Inter, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif;
  --aiwfm-font-size-heading: 24px;
  --aiwfm-font-size-body: 16px;
  --aiwfm-font-size-small: 14px;
  --aiwfm-font-weight-regular: 400;
  --aiwfm-font-weight-semibold: 600;
  --aiwfm-line-height-heading: 32px;
  --aiwfm-line-height-body: 24px;
  --aiwfm-line-height-small: 20px;
  --aiwfm-letter-spacing-tight: -0.2px;

  /* Layout */
  --aiwfm-content-max-width: 1400px;
  --aiwfm-page-gutter-desktop: 36px;
  --aiwfm-page-gutter-mobile: 20px;

  /* Shared spacing */
  --aiwfm-space-4: 4px;
  --aiwfm-space-8: 8px;
  --aiwfm-space-12: 12px;
  --aiwfm-space-16: 16px;
  --aiwfm-space-20: 20px;
  --aiwfm-space-24: 24px;
  --aiwfm-space-32: 32px;
  --aiwfm-space-40: 40px;

  /* Shape */
  --aiwfm-radius-card: 16px;
  --aiwfm-radius-control: 999px;

  /* Effects */
  --aiwfm-shadow-card-hover: 0 10px 10px rgb(0 0 0 / 10%);

  /* Gradients */
  /* AIWFM-CATEGORY-001: Figma "Header Gradient [02]" colour stops, shared by the
     home hero and the category search band. Only the angle differs between the
     two (home 83.72deg, category 88.88deg), so the stops live here and each
     page supplies its own angle:
       background: linear-gradient(88.88deg, var(--aiwfm-gradient-header-stops)); */
  --aiwfm-gradient-header-stops: #fee3ce 0%, #ffe3d5 15.93%, #ffe4dd 28.34%,
    #ffe1e6 38.38%, #fedfdc 48.38%, #ffd6ca 58.17%, #ffd2b5 67.59%,
    #ffc7a2 77.77%, #fec085 87.84%, #ffc778 100%;
}
/* AIWFM-TOK-001 END */

/* AIWFM-CAT-001 START --------------------------------------------------------
   Home page: category cards
   Figma reference: WFM Support site, node 8118:2210
   Audit/checklist: ../ZENDESK_UPDATE_LOG.md
   -------------------------------------------------------------------------- */

.categories {
  box-sizing: border-box;
  width: calc(100vw - var(--aiwfm-scrollbar-width, 16px));
  max-width: var(--aiwfm-content-max-width);
  margin-left: 50%;
  padding: var(--aiwfm-space-40) var(--aiwfm-page-gutter-desktop);
  font-family: var(--aiwfm-font-family-base);
  transform: translateX(-50%);
}

.categories-heading {
  margin: 0 0 var(--aiwfm-space-24);
  color: var(--aiwfm-color-text);
  font-size: var(--aiwfm-font-size-heading);
  font-weight: var(--aiwfm-font-weight-semibold);
  line-height: var(--aiwfm-line-height-heading);
  letter-spacing: var(--aiwfm-letter-spacing-tight);
  text-align: center;
}

.categories .blocks-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 38px var(--aiwfm-space-40);
  margin: 0;
  padding: 0;
  list-style: none;
}

.categories .blocks-item {
  width: auto;
  height: 108px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: var(--aiwfm-color-surface);
  border: 1px solid var(--aiwfm-color-border);
  border-radius: var(--aiwfm-radius-card);
  transition: border-color 160ms ease, box-shadow 160ms ease,
    transform 160ms ease;
}

.categories .blocks-item:hover,
.categories .blocks-item:focus-within {
  border-color: transparent;
  box-shadow: var(--aiwfm-shadow-card-hover);
  transform: translateY(-1px);
}

.categories .blocks-item-link {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: var(--aiwfm-space-24);
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: var(--aiwfm-space-20);
  color: var(--aiwfm-color-text);
  text-align: left;
  text-decoration: none;
}

.categories .blocks-item-link:focus-visible {
  outline: 2px solid var(--aiwfm-color-focus);
  outline-offset: -3px;
}

.blocks-item-icon {
  position: relative;
  display: none;
  flex: 0 0 56px;
  width: 56px;
  height: 56px;
  background: var(--aiwfm-color-icon-background);
  border-radius: 50%;
  transition: background-color 160ms ease;
}

.blocks-item-icon::before {
  position: absolute;
  inset: 14px;
  content: "";
  background-color: var(--aiwfm-color-neutral-dark);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  transition: background-color 160ms ease;
}

.blocks-item[data-category-id="45752484277140"] .blocks-item-icon,
.blocks-item[data-category-id="45752857536916"] .blocks-item-icon,
.blocks-item[data-category-id="45752888253972"] .blocks-item-icon,
.blocks-item[data-category-id="45756927880340"] .blocks-item-icon,
.blocks-item[data-category-id="45757332766228"] .blocks-item-icon,
.blocks-item[data-category-id="45758578168724"] .blocks-item-icon {
  display: block;
}

.blocks-item[data-category-id="45752484277140"] .blocks-item-icon::before {
  -webkit-mask-image: url(/hc/theming_assets/01M00V9S56GFETVF2D50FBW3M9);
  mask-image: url(/hc/theming_assets/01M00V9S56GFETVF2D50FBW3M9);
}

.blocks-item[data-category-id="45752857536916"] .blocks-item-icon::before {
  -webkit-mask-image: url(/hc/theming_assets/01M00V9QCT4YDPVVN509E8CGY8);
  mask-image: url(/hc/theming_assets/01M00V9QCT4YDPVVN509E8CGY8);
}

.blocks-item[data-category-id="45752888253972"] .blocks-item-icon::before {
  -webkit-mask-image: url(/hc/theming_assets/01M00V9SZ34BWVJBC0AAZ7FXBX);
  mask-image: url(/hc/theming_assets/01M00V9SZ34BWVJBC0AAZ7FXBX);
}

.blocks-item[data-category-id="45756927880340"] .blocks-item-icon::before {
  -webkit-mask-image: url(/hc/theming_assets/01M00V9NHXNN1GMEAB7PS08N1J);
  mask-image: url(/hc/theming_assets/01M00V9NHXNN1GMEAB7PS08N1J);
}

.blocks-item[data-category-id="45757332766228"] .blocks-item-icon::before {
  -webkit-mask-image: url(/hc/theming_assets/01M00V9PF9XQWNCHB3RQMB19CT);
  mask-image: url(/hc/theming_assets/01M00V9PF9XQWNCHB3RQMB19CT);
}

.blocks-item[data-category-id="45758578168724"] .blocks-item-icon::before {
  -webkit-mask-image: url(/hc/theming_assets/01M00V9R8YFXM7Q4Q9FCEW1R9T);
  mask-image: url(/hc/theming_assets/01M00V9R8YFXM7Q4Q9FCEW1R9T);
}

.categories .blocks-item:hover .blocks-item-icon,
.categories .blocks-item:focus-within .blocks-item-icon {
  background-color: var(--aiwfm-color-accent);
}

.categories .blocks-item:hover .blocks-item-icon::before,
.categories .blocks-item:focus-within .blocks-item-icon::before {
  background-color: var(--aiwfm-color-surface);
}

.blocks-item-content {
  min-width: 0;
}

.categories .blocks-item-title,
.categories .blocks-item-description {
  display: block;
  color: var(--aiwfm-color-text);
  text-transform: none;
}

.categories .blocks-item-title {
  margin: 0 0 var(--aiwfm-space-4);
  font-size: var(--aiwfm-font-size-body);
  font-weight: var(--aiwfm-font-weight-semibold);
  line-height: var(--aiwfm-line-height-body);
  letter-spacing: var(--aiwfm-letter-spacing-tight);
}

.categories .blocks-item-description {
  margin: 0;
  font-size: var(--aiwfm-font-size-small);
  font-weight: var(--aiwfm-font-weight-regular);
  line-height: var(--aiwfm-line-height-small);
}

@media (max-width: 767px) {
  .categories {
    padding: var(--aiwfm-space-32) var(--aiwfm-page-gutter-mobile);
  }

  .categories .blocks-list {
    grid-template-columns: 1fr;
    gap: var(--aiwfm-space-16);
  }

  .categories .blocks-item {
    height: auto;
    min-height: 108px;
  }

  .categories .blocks-item-link {
    gap: var(--aiwfm-space-16);
  }
}

/* AIWFM-CAT-001 END ---------------------------------------------------------- (Added by Nino) */

/* AIWFM-HDR-001 START --------------------------------------------------------
   Shared announcement bar and header
   Figma reference: WFM Support site, nodes 8118:2186 and 8118:2192
   Audit/checklist: ../ZENDESK_UPDATE_LOG.md
   -------------------------------------------------------------------------- */

.aiwfm-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.aiwfm-announcement-region:empty {
  display: none;
}

.aiwfm-announcement-region .ns-box {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 52px;
  padding: var(--aiwfm-space-16) 80px;
  border: 0;
  background: #ffe0cc;
  box-shadow: none;
  color: var(--aiwfm-color-text);
  font-family: var(--aiwfm-font-family-base);
  font-size: 15px;
  font-weight: 500;
  line-height: 20px;
  pointer-events: auto;
}

.aiwfm-announcement-region .ns-box-inner {
  display: flex;
  align-items: center;
  min-width: 0;
}

.aiwfm-announcement-region .megaphone {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  margin-right: 8px;
  background: center / 20px 20px no-repeat
    url(/hc/theming_assets/01M0G9SCXWA1YSTHBZ34H3ZC33);
}

.aiwfm-announcement-region .megaphone::before {
  content: none;
}

.aiwfm-announcement-region .ns-box p,
.aiwfm-announcement-region .ns-effect-slidetop p {
  min-width: 0;
  margin: 0;
  padding: 0;
  color: inherit;
  font-size: inherit;
  line-height: inherit;
  overflow-wrap: anywhere;
}

.aiwfm-announcement-region .ns-box p > :first-child {
  margin-top: 0;
}

.aiwfm-announcement-region .ns-box p > :last-child {
  margin-bottom: 0;
}

.aiwfm-announcement-region .ns-box a {
  color: inherit;
  font-weight: 700;
  opacity: 1;
  text-decoration: none;
}

.aiwfm-announcement-region .ns-box a:hover,
.aiwfm-announcement-region .ns-box a:focus {
  color: inherit;
  opacity: 1;
  text-decoration: underline;
}

.aiwfm-announcement-region .ns-close,
.aiwfm-announcement-region .ns-bar .ns-close {
  position: relative;
  top: auto;
  right: auto;
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  margin: 0 0 0 var(--aiwfm-space-16);
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: var(--aiwfm-radius-control);
  background: center / 16px 16px no-repeat url(/hc/theming_assets/01M0G9SGATMC3113BPSAE42V1T);
  color: var(--aiwfm-color-text);
  cursor: pointer;
  text-indent: -9999px;
  transform: none;
}

.aiwfm-announcement-region .ns-close::before,
.aiwfm-announcement-region .ns-close::after {
  content: none;
}

.aiwfm-announcement-region .ns-close:hover {
  background-color: rgb(0 0 0 / 5%);
}

.aiwfm-announcement-region .ns-close:focus-visible {
  outline: 2px solid var(--aiwfm-color-focus);
  outline-offset: 2px;
}

.aiwfm-header.header {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: none;
  height: 68px;
  margin: 0;
  padding: 0 80px;
  border-bottom: 1px solid rgb(0 0 0 / 5%);
  background: var(--aiwfm-color-surface);
  color: var(--aiwfm-color-text);
  font-family: var(--aiwfm-font-family-base);
}

.aiwfm-header-brand {
  min-width: 0;
}

.aiwfm-header .aiwfm-header-brand-link,
.aiwfm-header .aiwfm-header-brand-link:hover,
.aiwfm-header .aiwfm-header-brand-link:focus,
.aiwfm-header .aiwfm-header-brand-link:active {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--aiwfm-color-text);
  text-decoration: none;
}

.aiwfm-header .aiwfm-header-brand-link:focus-visible {
  border-radius: 4px;
  outline: 2px solid var(--aiwfm-color-focus);
  outline-offset: 4px;
}

.aiwfm-header .aiwfm-header-brand-link img {
  display: block;
  width: 226px;
  max-width: 100%;
  height: auto;
  max-height: 22px;
}

.aiwfm-header-actions,
.aiwfm-header .nav-wrapper-desktop {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.aiwfm-header .aiwfm-language-toggle,
.aiwfm-header .aiwfm-user-control {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  margin: 0;
  border: 0;
  border-radius: 10px;
  color: var(--aiwfm-color-surface);
  cursor: pointer;
  text-decoration: none;
}

.aiwfm-header .aiwfm-language-toggle {
  width: 50px;
  min-width: 50px;
  padding: 9px;
  color: #000;
  background: transparent;
}

.aiwfm-header .aiwfm-user-control {
  width: 52px;
  min-width: 52px;
  padding: 9px 10px;
  background: #066fac;
}

.aiwfm-header .aiwfm-user-menu .aiwfm-user-control {
  width: 52px;
}

/* AIWFM-HDR-002: both header controls share the same grey hover/active
   background (#f5f6f9), matching the Figma spec. The profile icon
   (header-user.svg) is a fixed-white asset, so its own hover/active state
   also darkens the icon via filter so it stays visible on the light
   background, mirroring the language icon's already-dark default fill. */
.aiwfm-header .aiwfm-language-toggle:hover,
.aiwfm-header .aiwfm-language-toggle:active,
.aiwfm-header .aiwfm-user-control:hover,
.aiwfm-header .aiwfm-user-control:active,
.aiwfm-header .user-info > .aiwfm-user-control:hover,
.aiwfm-header .user-info > .aiwfm-user-control:active {
  color: #000;
  background: #f5f6f9;
  text-decoration: none;
}

.aiwfm-header .aiwfm-user-control:hover .aiwfm-header-control-icon,
.aiwfm-header .aiwfm-user-control:active .aiwfm-header-control-icon {
  filter: brightness(0);
}

.aiwfm-header .aiwfm-language-toggle:focus-visible,
.aiwfm-header .aiwfm-user-control:focus-visible,
.aiwfm-header .menu-button-mobile:focus-visible {
  outline: 2px solid var(--aiwfm-color-focus);
  outline-offset: 2px;
}

.aiwfm-header-control-icon,
.aiwfm-header-chevron {
  display: block;
}

.aiwfm-header .aiwfm-language-toggle .aiwfm-header-control-icon {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
}

.aiwfm-header .aiwfm-user-control .aiwfm-header-control-icon {
  flex: 0 0 14px;
  width: 14px;
  height: 18px;
}

.aiwfm-header .aiwfm-header-chevron {
  flex: 0 0 8px;
  width: 8px;
  height: 6px;
  margin-left: 6px;
}

.aiwfm-header .aiwfm-user-control .aiwfm-header-chevron {
  margin-left: 10px;
}

.aiwfm-header .aiwfm-language-selector:has(.aiwfm-language-menu[aria-expanded="true"])
  .aiwfm-header-chevron,
.aiwfm-header .aiwfm-user-menu:has(.dropdown-menu[aria-expanded="true"])
  .aiwfm-header-chevron {
  transform: rotate(180deg);
}

/* AIWFM-HDR-002 START: header controls turn dark charcoal only while open,
   matching the Figma "Language Selector" and "User Profile" component spec
   (background #323439 when expanded). The profile control keeps its default
   blue (#066fac, set on the base .aiwfm-user-control rule above) at rest -
   only the open/expanded state changes to charcoal, same as the language
   control. An earlier pass incorrectly made the profile control charcoal
   unconditionally; corrected per owner review. */
.aiwfm-header
  .aiwfm-language-selector:has(.aiwfm-language-menu[aria-expanded="true"])
  .aiwfm-language-toggle {
  background: #323439;
  color: #fff;
}

.aiwfm-header
  .aiwfm-language-selector:has(.aiwfm-language-menu[aria-expanded="true"])
  .aiwfm-language-toggle
  img {
  filter: brightness(0) invert(1);
}

.aiwfm-header .aiwfm-user-menu:has(.dropdown-menu[aria-expanded="true"])
  .aiwfm-user-control {
  background: #323439;
}

/* The hover/active rule below darkens the icon (filter: brightness(0)) so it
   reads against the light grey hover background. That filter must not carry
   over while the dropdown is open, since the open state's charcoal
   background needs the icon to stay its natural white - a real conflict
   when the pointer is still over the button right after opening it. This
   selector out-specifies the hover rule (5 class-levels vs. 4) so it always
   wins regardless of source order. */
.aiwfm-header .aiwfm-user-menu:has(.dropdown-menu[aria-expanded="true"])
  .aiwfm-user-control
  .aiwfm-header-control-icon {
  filter: none;
}
/* AIWFM-HDR-002 END */

.aiwfm-header .aiwfm-language-menu {
  top: calc(100% + 8px);
  right: 0;
  left: auto;
  z-index: 1000;
  box-sizing: border-box;
  width: 240px;
  min-width: 240px;
  margin: 0;
  padding: var(--aiwfm-space-20);
  overflow: hidden;
  border: 1px solid rgb(0 0 0 / 10%);
  border-radius: var(--aiwfm-radius-card);
  background: var(--aiwfm-color-surface);
  box-shadow: 0 10px 20px -10px rgb(0 0 0 / 20%);
}

.aiwfm-header .aiwfm-language-menu .aiwfm-language-option {
  box-sizing: border-box;
  display: block;
  width: 100%;
  min-height: 36px;
  padding: 8px 12px;
  border-radius: 10px;
  color: var(--aiwfm-color-neutral-dark);
  font-size: var(--aiwfm-font-size-small);
  font-weight: 500;
  line-height: var(--aiwfm-line-height-small);
  white-space: normal;
}

.aiwfm-header .aiwfm-language-menu .aiwfm-language-option:hover,
.aiwfm-header .aiwfm-language-menu .aiwfm-language-option:focus {
  background: #f5f6f9;
  color: var(--aiwfm-color-primary);
  text-decoration: none;
}

.aiwfm-header .aiwfm-language-menu .aiwfm-language-option.is-current {
  background: #f5f6f9;
  color: var(--aiwfm-color-primary);
  font-weight: var(--aiwfm-font-weight-semibold);
  cursor: default;
}

.aiwfm-header .user-info {
  display: inline-flex;
}

.aiwfm-header .user-info > .aiwfm-user-control {
  min-width: 52px;
  padding: 9px 10px;
  color: var(--aiwfm-color-surface);
  /* AIWFM-HDR-002: background intentionally omitted here — this selector's
     higher specificity (.user-info > .aiwfm-user-control) was silently
     overriding the charcoal background set below at
     .aiwfm-header .aiwfm-user-control, regardless of source order. */
}

.aiwfm-header .user-info > .aiwfm-user-control::after {
  content: none;
}

/* AIWFM-HDR-003 START: profile dropdown item styling to match Figma
   "Menu / My Account / User" component (200x36 items, 10px item radius,
   Inter 500 15px/20px black text, 8px gap, rgba divider, #0040DD CTA button
   for Sign in / Sign out). Previously these items fell back to Zendesk's
   unstyled dropdown-menu defaults. Figma reference: node 8027:784. */
.aiwfm-header .user-info > .dropdown-menu {
  display: none;
  top: calc(100% + 8px);
  right: 0;
  left: auto;
  z-index: 1000;
  flex-direction: column;
  gap: var(--aiwfm-space-8);
  width: max-content;
  min-width: 200px;
  margin: 0;
  padding: var(--aiwfm-space-20);
  border-color: rgb(0 0 0 / 10%);
  border-radius: var(--aiwfm-radius-card);
  box-shadow: 0 10px 20px -10px rgb(0 0 0 / 20%);
}

.aiwfm-header .user-info > .dropdown-menu[aria-expanded="true"] {
  display: flex;
}

.aiwfm-header .user-info > .dropdown-menu [role="menuitem"] {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 36px;
  padding: 8px 12px;
  border-radius: 10px;
  color: var(--aiwfm-color-text);
  font-family: var(--aiwfm-font-family-base);
  font-size: 15px;
  font-weight: 500;
  line-height: 20px;
  white-space: nowrap;
}

.aiwfm-header .user-info > .dropdown-menu [role="menuitem"]:hover,
.aiwfm-header .user-info > .dropdown-menu [role="menuitem"]:focus {
  background: #f5f6f9;
  color: var(--aiwfm-color-primary);
  text-decoration: none;
}

.aiwfm-header .user-info > .dropdown-menu [role="separator"] {
  width: 100%;
  height: 1px;
  margin: 0;
  border: 0;
  background: rgb(0 0 0 / 10%);
}

.aiwfm-header .user-info > .dropdown-menu .aiwfm-header-menu-cta {
  justify-content: center;
  background: var(--aiwfm-color-primary);
  color: #fff;
}

.aiwfm-header .user-info > .dropdown-menu .aiwfm-header-menu-cta:hover,
.aiwfm-header .user-info > .dropdown-menu .aiwfm-header-menu-cta:focus {
  background: var(--aiwfm-color-primary);
  filter: brightness(0.9);
  color: #fff;
  text-decoration: none;
}
/* AIWFM-HDR-003 END */

.aiwfm-header .nav-wrapper-mobile {
  display: none;
}

[dir="rtl"] .aiwfm-announcement-region .megaphone {
  margin-right: 0;
  margin-left: 8px;
}

[dir="rtl"] .aiwfm-announcement-region .ns-close,
[dir="rtl"] .aiwfm-announcement-region .ns-bar .ns-close {
  margin-right: var(--aiwfm-space-16);
  margin-left: 0;
}

[dir="rtl"] .aiwfm-header .aiwfm-language-menu,
[dir="rtl"] .aiwfm-header .user-info > .dropdown-menu {
  right: auto;
  left: 0;
}

@media (max-width: 1199px) {
  .aiwfm-announcement-region .ns-box,
  .aiwfm-header.header {
    padding-right: var(--aiwfm-page-gutter-desktop);
    padding-left: var(--aiwfm-page-gutter-desktop);
  }
}

@media (max-width: 1023px) {
  .aiwfm-header .nav-wrapper-desktop {
    display: none;
  }

  .aiwfm-header .nav-wrapper-mobile {
    display: block;
  }

  .aiwfm-header .nav-wrapper-mobile .menu-button-mobile {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    min-width: 36px;
    height: 36px;
    padding: 0;
    border-radius: 10px;
    color: var(--aiwfm-color-neutral-dark);
  }

  .aiwfm-header .nav-wrapper-mobile .menu-button-mobile .icon-menu {
    box-sizing: border-box;
    width: 32px;
    height: 32px;
    padding: 8px;
    border-radius: 10px;
  }

  .aiwfm-header .nav-wrapper-mobile .menu-list-mobile {
    top: 68px;
    z-index: 1000;
    border-color: var(--aiwfm-color-border);
    font-family: var(--aiwfm-font-family-base);
  }
}

@media (max-width: 767px) {
  .aiwfm-announcement-region .ns-box {
    align-items: flex-start;
    min-height: 48px;
    padding: 12px var(--aiwfm-page-gutter-mobile);
    font-size: var(--aiwfm-font-size-small);
  }

  .aiwfm-announcement-region .ns-box-inner {
    align-items: flex-start;
  }

  .aiwfm-announcement-region .megaphone {
    margin-top: 1px;
  }

  .aiwfm-announcement-region .ns-close,
  .aiwfm-announcement-region .ns-bar .ns-close {
    flex-basis: 28px;
    width: 28px;
    height: 28px;
    margin-left: 8px;
  }

  [dir="rtl"] .aiwfm-announcement-region .ns-close,
  [dir="rtl"] .aiwfm-announcement-region .ns-bar .ns-close {
    margin-right: 8px;
    margin-left: 0;
  }

  .aiwfm-header.header {
    height: 64px;
    padding-right: var(--aiwfm-page-gutter-mobile);
    padding-left: var(--aiwfm-page-gutter-mobile);
  }

  .aiwfm-header .aiwfm-header-brand-link {
    gap: 8px;
  }

  .aiwfm-header .aiwfm-header-brand-link img {
    width: 194px;
    max-height: 22px;
  }

  .aiwfm-header-actions {
    gap: 8px;
  }

  .aiwfm-header .nav-wrapper-mobile .menu-list-mobile {
    top: 64px;
  }
}

@media (max-width: 479px) {
  .aiwfm-header .aiwfm-header-brand-link img {
    width: 160px;
  }
}

@media (max-width: 359px) {
  .aiwfm-header .aiwfm-header-brand-link img {
    width: 145px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .aiwfm-announcement-region .ns-box,
  .aiwfm-announcement-region .ns-box * {
    animation: none !important;
    transition: none !important;
  }
}

/* AIWFM-HDR-001 END ---------------------------------------------------------- */

/* AIWFM-CATNAV-001 START ------------------------------------------------------
   Shared "Left Navigation" category-tree sidebar, used identically on the
   category and article pages (not the section page). Figma reference:
   "Left Navigation" component, WFM Support site (320px sidebar, "AI WFM"
   title, category accordion, #0040DD current-section state). The markup
   skeleton is duplicated identically in category_page.hbs and
   article_page.hbs (Curlybars has no shared-partial mechanism); the
   AIWFM-CATNAV-001 block in script.js fills it in via the Help Center API,
   since neither template context exposes the full categories collection
   needed to render the list server-side. Hidden below 1024px, matching the
   tablet/mobile Figma frames that collapse this sidebar.
   Audit/checklist: ../ZENDESK_UPDATE_LOG.md
   -------------------------------------------------------------------------- */

/* AIWFM-QA-FIX-001: below 1024px the sidebar was simply display:none with no
   way to reach it at all (QA defect #6, most visible at the 768px tablet
   breakpoint). Below, a "Categories" toggle button (markup added in
   category_page.hbs / section_page.hbs / article_page.hbs) is shown instead,
   and the sidebar becomes an off-canvas drawer driven by the same
   [aria-expanded] attribute pattern already used for
   .nav-wrapper-mobile .menu-list-mobile (see ~line 833) via the existing
   toggleNavigation()/closeNavigation() helpers in script.js. */
.aiwfm-left-nav-toggle {
  display: none;
}

@media (max-width: 1023px) {
  .aiwfm-left-nav-toggle {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: var(--aiwfm-space-8);
    width: 100%;
    margin: 0 0 var(--aiwfm-space-16);
    padding: 10px var(--aiwfm-space-16);
    border: 1px solid var(--aiwfm-color-border);
    border-radius: var(--aiwfm-radius-control);
    background: var(--aiwfm-color-surface, #fff);
    color: var(--aiwfm-color-text);
    font-family: var(--aiwfm-font-family-base);
    font-size: 14px;
    font-weight: var(--aiwfm-font-weight-semibold);
    cursor: pointer;
  }

  .aiwfm-left-nav[aria-expanded="false"] {
    display: none;
  }

  .aiwfm-left-nav[aria-expanded="true"] {
    display: block;
    width: 100%;
    margin: 0 0 var(--aiwfm-space-24);
    font-family: var(--aiwfm-font-family-base);
  }
}

/* AIWFM-QA-FIX-001: this used to be gated behind `@media (min-width: 1024px)`,
   which meant the entire sidebar's inner styling (title, category list,
   buttons, section links, etc.) only ever existed above 1024px - there was no
   way to style the mobile/tablet off-canvas drawer added above without
   duplicating all of it. Making these rules unconditional is safe: below
   1024px the top-level .aiwfm-left-nav[aria-expanded="false"] rule above
   still wins on specificity (attribute selector beats plain class) and hides
   the whole subtree, and when the drawer is opened
   (.aiwfm-left-nav[aria-expanded="true"]) these same rules now apply,
   matching the desktop styling used inside the sidebar. */
.aiwfm-left-nav {
  display: block;
  flex: 0 0 320px;
  width: 320px;
  font-family: var(--aiwfm-font-family-base);
}

.aiwfm-left-nav-title {
    margin: 0 0 var(--aiwfm-space-16);
    color: var(--aiwfm-color-text);
    font-size: 16px;
    font-weight: var(--aiwfm-font-weight-semibold);
    line-height: 24px;
  }

  .aiwfm-left-nav-group-title {
    margin: 0 0 var(--aiwfm-space-16);
    color: var(--aiwfm-color-text-muted);
    font-size: 12px;
    font-weight: var(--aiwfm-font-weight-semibold);
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }

  .aiwfm-left-nav-categories {
    display: flex;
    flex-direction: column;
    gap: var(--aiwfm-space-8);
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .aiwfm-left-nav-category-button {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: var(--aiwfm-space-12);
    width: 100%;
    padding: 10px var(--aiwfm-space-16);
    border-radius: var(--aiwfm-radius-control);
    background: var(--aiwfm-color-surface);
    color: var(--aiwfm-color-text);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    text-decoration: none;
  }

  /* Theme's global "a:visited { color: rgba(153, 51, 204, 1); }" (style.css
     line ~238) beats the single-class selector above, so every category
     link turns the browser's visited-purple once clicked. Re-assert our
     color explicitly for :visited to cancel that out. */
  .aiwfm-left-nav-category-button:visited {
    color: var(--aiwfm-color-text);
  }

  .aiwfm-left-nav-category-button:hover,
  .aiwfm-left-nav-category-button:focus {
    text-decoration: none;
  }

  .aiwfm-left-nav-category-icon {
    position: relative;
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
  }

  /* AIWFM-QA-FIX-001: no default background-color here. Only the 6 mapped
     category IDs below get a background-color (paired with their
     mask-image), so a category ID with no icon mapping renders no icon at
     all instead of a solid dark square - matching the documented intent in
     ZENDESK_UPDATE_LOG.md ("unmapped private categories remain functional
     and render without a decorative icon"). Previously this base rule set
     background-color unconditionally, so any unmapped ID (e.g. "Internal
     Doc Translations", "Pre-5.0 Documents", "Community Internal Support")
     painted a solid square because mask-image stayed at its initial value
     of none, which does not clip the background at all. */
  .aiwfm-left-nav-category-icon::before {
    position: absolute;
    inset: 0;
    content: "";
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
  }

  .aiwfm-left-nav-category-name {
    flex: 1;
    min-width: 0;
  }

  .aiwfm-left-nav-chevron {
    flex: 0 0 16px;
    color: var(--aiwfm-color-text-muted);
    transition: transform 160ms ease;
  }

  /* Driven by the button's own aria-expanded attribute (script.js keeps this
     in sync with the actual open/closed state), not the is-current/
     is-expanded classes: those classes don't get removed when a current
     category is manually collapsed again, which previously left the caret
     stuck pointing up even after the row closed. Since the chevron is a
     direct child of its own button, this naturally can't leak into a
     nested section button's caret either. */
  .aiwfm-left-nav-category-button[aria-expanded="true"] .aiwfm-left-nav-chevron {
    transform: rotate(180deg);
  }

  /* Non-current category the user manually toggled open: subtle card,
     default text color, beige background by default (Figma: article/section
     pages). Category pages override this to white just below, since
     .aiwfm-category-page is the only page-type wrapper class that exists
     for this purpose (article_page.hbs/section_page.hbs have no such
     wrapper, so beige is the correct shared default for both). */
  .aiwfm-left-nav-category.is-expanded {
    border-radius: var(--aiwfm-radius-card);
    background: var(--aiwfm-color-surface-beige);
    box-shadow: 0 1px 4px rgb(0 0 0 / 8%);
  }

  /* Category & section page override: expanded (non-current) category card
     is white, per Figma category-page spec (section pages follow the same
     style). Article page has no page-wrapper class and keeps the beige
     default above. */
  .aiwfm-category-page .aiwfm-left-nav-category.is-expanded,
  .aiwfm-section-page .aiwfm-left-nav-category.is-expanded {
    background: var(--aiwfm-color-surface);
  }

  .aiwfm-left-nav-category.is-expanded .aiwfm-left-nav-category-button,
  .aiwfm-left-nav-category.is-expanded .aiwfm-left-nav-category-button:visited {
    padding: 10px var(--aiwfm-space-16);
    font-weight: var(--aiwfm-font-weight-semibold);
  }

  .aiwfm-left-nav-category.is-expanded .aiwfm-left-nav-sections {
    padding: 0 var(--aiwfm-space-12) var(--aiwfm-space-12);
  }

  /* The true current category (Figma: solid blue header, with the
     sections list sitting directly beneath in a beige panel, both
     joined into one seamless rounded card). */
  .aiwfm-left-nav-category.is-current {
    border-radius: var(--aiwfm-radius-card);
    box-shadow: 0 1px 4px rgb(0 0 0 / 8%);
    overflow: hidden;
  }

  .aiwfm-left-nav-category.is-current .aiwfm-left-nav-category-button,
  .aiwfm-left-nav-category.is-current .aiwfm-left-nav-category-button:visited {
    padding: 10px var(--aiwfm-space-16);
    background: var(--aiwfm-color-primary);
    color: var(--aiwfm-color-surface);
    font-weight: var(--aiwfm-font-weight-semibold);
  }

  .aiwfm-left-nav-category.is-current .aiwfm-left-nav-category-icon::before {
  }

  .aiwfm-left-nav-category.is-current > .aiwfm-left-nav-category-button .aiwfm-left-nav-chevron {
    color: var(--aiwfm-color-surface);
  }

  .aiwfm-left-nav-category.is-current .aiwfm-left-nav-sections {
    margin: 0;
    padding: var(--aiwfm-space-12);
    background: var(--aiwfm-color-surface-beige);
  }

  /* Category & section pages: the current category's auto-open sections
     panel should be white (matches the manually-expanded white card look).
     Article page has no page-wrapper class and keeps the beige default
     above, which is the desired look there. */
  .aiwfm-category-page .aiwfm-left-nav-category.is-current .aiwfm-left-nav-sections,
  .aiwfm-section-page .aiwfm-left-nav-category.is-current .aiwfm-left-nav-sections {
    background: var(--aiwfm-color-surface);
  }

  .aiwfm-left-nav-sections {
    display: flex;
    flex-direction: column;
    gap: var(--aiwfm-space-4);
    margin: var(--aiwfm-space-8) 0 0;
    padding: 0;
    list-style: none;
  }

  .aiwfm-left-nav-sections[hidden] {
    display: none;
  }

  /* Section rows: same toggle pattern as category rows (button + chevron,
     whole row expands/collapses in place; the row itself never
     navigates). */
  .aiwfm-left-nav-section-button {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: var(--aiwfm-space-12);
    width: 100%;
    padding: 8px var(--aiwfm-space-12);
    /* Left corners intentionally square (0), not var(--aiwfm-radius-control):
       rounding the left corners of an element that also carries a colored
       border-left indicator makes the browser paint the corner arcs in the
       border-left color, producing a stray blue "crescent" sliver above/below
       the indicator bar instead of a clean straight bar. Right corners keep
       the normal control radius for the hover/focus affordance. */
    border-radius: 0 var(--aiwfm-radius-control) var(--aiwfm-radius-control) 0;
    border-left: 3px solid transparent;
    color: var(--aiwfm-color-text);
    font-size: 13px;
    line-height: 18px;
    text-decoration: none;
  }

  .aiwfm-left-nav-section-button:visited {
    color: var(--aiwfm-color-text);
  }

  /* No visible focus ring on click: the row's own background/left-border
     states already communicate current/expanded, so the browser's default
     blue focus outline just reads as a stray box. */
  .aiwfm-left-nav-section-button:focus,
  .aiwfm-left-nav-section-button:focus-visible {
    outline: none;
  }

  .aiwfm-left-nav-section-name {
    flex: 1;
    min-width: 0;
  }

  .aiwfm-left-nav-section-button .aiwfm-left-nav-chevron {
    flex: 0 0 16px;
  }

  /* Same aria-expanded-driven approach as the category chevron rule above:
     reflects the row's actual open/closed state (including after a current
     section is manually collapsed), instead of getting stuck via a
     permanent is-current/is-expanded class. */
  .aiwfm-left-nav-section-button[aria-expanded="true"] .aiwfm-left-nav-chevron {
    transform: rotate(180deg);
  }

  /* Bold text only for the current section, per Figma — no blue left-border
     bar. (border-left itself stays defined at 3px transparent above so
     spacing/alignment doesn't shift; it's just never given a color.) */
  .aiwfm-left-nav-section.is-current .aiwfm-left-nav-section-button,
  .aiwfm-left-nav-section.is-current .aiwfm-left-nav-section-button:visited {
    font-weight: var(--aiwfm-font-weight-semibold);
  }

  .aiwfm-left-nav-articles {
    display: flex;
    flex-direction: column;
    gap: var(--aiwfm-space-4);
    margin: 0;
    padding: 0 0 0 var(--aiwfm-space-16);
    list-style: none;
  }

  .aiwfm-left-nav-articles[hidden] {
    display: none;
  }

  .aiwfm-left-nav-articles a {
    display: block;
    padding: 8px var(--aiwfm-space-12);
    border-radius: var(--aiwfm-radius-control);
    color: var(--aiwfm-color-text);
    font-size: 13px;
    line-height: 18px;
    text-decoration: none;
  }

  .aiwfm-left-nav-articles a:visited {
    color: var(--aiwfm-color-text);
  }

  .aiwfm-left-nav-articles li.is-current a,
  .aiwfm-left-nav-articles li.is-current a:visited {
    color: var(--aiwfm-color-primary);
    font-weight: var(--aiwfm-font-weight-semibold);
    text-decoration: underline;
  }

  /* Category page only: sections render as a flat, non-expandable list
     (Figma: category page). Kept as a distinct class/selector so it never
     collides with the expandable .aiwfm-left-nav-section styling above,
     which is used on article/section pages instead. */
  .aiwfm-left-nav-section-flat > a {
    display: block;
    padding: 8px var(--aiwfm-space-12);
    border-radius: var(--aiwfm-radius-control);
    color: var(--aiwfm-color-text);
    font-size: 13px;
    line-height: 18px;
    text-decoration: none;
  }

  .aiwfm-left-nav-section-flat > a:visited {
    color: var(--aiwfm-color-text);
  }

  .aiwfm-left-nav-section-flat.is-current > a,
  .aiwfm-left-nav-section-flat.is-current > a:visited {
    font-weight: var(--aiwfm-font-weight-semibold);
  }

/* Icon mapping shared with the home page's category blocks (AIWFM-CAT-001) */
/* AIWFM-QA-FIX-001: background-color now lives here (paired with the mask-image
   below) instead of unconditionally on the base .aiwfm-left-nav-category-icon::before
   rule above, so only these 6 mapped category IDs actually paint an icon. */
.aiwfm-left-nav-category[data-category-id="45752484277140"] .aiwfm-left-nav-category-icon::before,
.aiwfm-left-nav-category[data-category-id="45752857536916"] .aiwfm-left-nav-category-icon::before,
.aiwfm-left-nav-category[data-category-id="45752888253972"] .aiwfm-left-nav-category-icon::before,
.aiwfm-left-nav-category[data-category-id="45756927880340"] .aiwfm-left-nav-category-icon::before,
.aiwfm-left-nav-category[data-category-id="45757332766228"] .aiwfm-left-nav-category-icon::before,
.aiwfm-left-nav-category[data-category-id="45758578168724"] .aiwfm-left-nav-category-icon::before {
  background-color: var(--aiwfm-color-neutral-dark);
}

.aiwfm-left-nav-category[data-category-id="45752484277140"] .aiwfm-left-nav-category-icon::before {
  -webkit-mask-image: url(/hc/theming_assets/01M00V9S56GFETVF2D50FBW3M9);
  mask-image: url(/hc/theming_assets/01M00V9S56GFETVF2D50FBW3M9);
}

.aiwfm-left-nav-category[data-category-id="45752857536916"] .aiwfm-left-nav-category-icon::before {
  -webkit-mask-image: url(/hc/theming_assets/01M00V9QCT4YDPVVN509E8CGY8);
  mask-image: url(/hc/theming_assets/01M00V9QCT4YDPVVN509E8CGY8);
}

.aiwfm-left-nav-category[data-category-id="45752888253972"] .aiwfm-left-nav-category-icon::before {
  -webkit-mask-image: url(/hc/theming_assets/01M00V9SZ34BWVJBC0AAZ7FXBX);
  mask-image: url(/hc/theming_assets/01M00V9SZ34BWVJBC0AAZ7FXBX);
}

.aiwfm-left-nav-category[data-category-id="45756927880340"] .aiwfm-left-nav-category-icon::before {
  -webkit-mask-image: url(/hc/theming_assets/01M00V9NHXNN1GMEAB7PS08N1J);
  mask-image: url(/hc/theming_assets/01M00V9NHXNN1GMEAB7PS08N1J);
}

.aiwfm-left-nav-category[data-category-id="45757332766228"] .aiwfm-left-nav-category-icon::before {
  -webkit-mask-image: url(/hc/theming_assets/01M00V9PF9XQWNCHB3RQMB19CT);
  mask-image: url(/hc/theming_assets/01M00V9PF9XQWNCHB3RQMB19CT);
}

.aiwfm-left-nav-category[data-category-id="45758578168724"] .aiwfm-left-nav-category-icon::before {
  -webkit-mask-image: url(/hc/theming_assets/01M00V9R8YFXM7Q4Q9FCEW1R9T);
  mask-image: url(/hc/theming_assets/01M00V9R8YFXM7Q4Q9FCEW1R9T);
}

/* AIWFM-QA-FIX-005: the per-category-ID rules above (background-color:
   var(--aiwfm-color-neutral-dark)) and the .is-current white-icon rule
   above them (line ~6956) share the same specificity (3 classes/attrs + 1
   pseudo-element each), so source order alone decided the winner - the
   per-category rules come later in the file, so the icon stayed dark
   charcoal even when its category was expanded/current against the solid
   blue background (reported: "Announcements" icon nearly invisible once
   highlighted). The fix must repeat the same 6 mapped category IDs (rather
   than matching any [data-category-id], which every category has) - an
   earlier draft of this fix used a bare [data-category-id] selector, which
   painted a white square on unmapped categories too (e.g. "Internal Doc
   Translations") since AIWFM-QA-FIX-001 deliberately gives those no
   background-color at all. Listing the 6 IDs explicitly keeps this scoped
   to only the categories that actually have an icon, while still winning
   on specificity (4 classes/attrs vs. the dark rule's 3) regardless of
   source order. */
.aiwfm-left-nav-category.is-current[data-category-id="45752484277140"] .aiwfm-left-nav-category-icon::before,
.aiwfm-left-nav-category.is-current[data-category-id="45752857536916"] .aiwfm-left-nav-category-icon::before,
.aiwfm-left-nav-category.is-current[data-category-id="45752888253972"] .aiwfm-left-nav-category-icon::before,
.aiwfm-left-nav-category.is-current[data-category-id="45756927880340"] .aiwfm-left-nav-category-icon::before,
.aiwfm-left-nav-category.is-current[data-category-id="45757332766228"] .aiwfm-left-nav-category-icon::before,
.aiwfm-left-nav-category.is-current[data-category-id="45758578168724"] .aiwfm-left-nav-category-icon::before {
  background-color: var(--aiwfm-color-surface);
}

/* AIWFM-CATNAV-001 END --------------------------------------------------------- */

.aiwfm-category-page {
  font-family: var(--aiwfm-font-family-base);
}

/* Figma lays the page out as full-bleed bands with 80px gutters over a 1280px
   content column; the shared baseline .container caps at 1160px, so it is
   re-capped here rather than changed globally. */
.aiwfm-category-page .container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0;
}

/* Search band -------------------------------------------------------------- */

.aiwfm-category-search-band {
  padding: var(--aiwfm-space-32) 80px;
  background: linear-gradient(88.88deg, var(--aiwfm-gradient-header-stops));
}

.aiwfm-category-search-inner {
  box-sizing: border-box;
}

.aiwfm-category-search {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  filter: drop-shadow(0 1px 4px rgb(0 0 0 / 4%));
}

.aiwfm-category-search .search-icon {
  left: var(--aiwfm-space-16);
  width: 16px;
  height: 16px;
  color: var(--aiwfm-color-neutral-dark);
}

.aiwfm-category-search input[type="search"] {
  box-sizing: border-box;
  width: 100%;
  height: 48px;
  padding-block: 0;
  padding-inline: 40px var(--aiwfm-space-16);
  border: 0;
  border-radius: var(--aiwfm-radius-control);
  background: var(--aiwfm-color-surface);
  font-size: var(--aiwfm-font-size-small);
  line-height: var(--aiwfm-line-height-small);
}

.aiwfm-category-search input[type="search"]::placeholder {
  color: var(--aiwfm-color-text-muted);
}

/* Breadcrumb row ----------------------------------------------------------- */

.aiwfm-category-breadcrumb-row {
  padding: 0 80px;
  background: var(--aiwfm-color-surface);
  border-bottom: 1px solid rgb(0 0 0 / 10%);
}

.aiwfm-category-breadcrumbs {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  min-height: 60px;
  margin-bottom: 0;
}

.aiwfm-category-breadcrumbs .breadcrumbs {
  margin: 0;
  font-size: var(--aiwfm-font-size-small);
  line-height: var(--aiwfm-line-height-small);
}

/* Content region ----------------------------------------------------------- */

.aiwfm-category-content-bg {
  padding: var(--aiwfm-space-40) 80px;
  background: var(--aiwfm-color-surface-beige);
}

.aiwfm-category-page .category-container {
  display: block;
}

.aiwfm-category-page .category-content {
  flex: none;
  width: 100%;
}

/* The left-nav sidebar (AIWFM-CATNAV-001) is hidden below 1024px, so the
   category-container only needs to become a flex row once it's visible. */
@media (min-width: 1024px) {
  .aiwfm-category-page .category-container {
    display: flex;
    align-items: flex-start;
    gap: var(--aiwfm-space-24);
  }

  .aiwfm-category-page .category-content {
    flex: 1;
    width: auto;
    min-width: 0;
  }
}

.aiwfm-category-header {
  display: block;
  margin: 0 0 var(--aiwfm-space-24);
}

.aiwfm-category-header h1 {
  margin: 0;
  color: var(--aiwfm-color-text);
  font-size: 20px;
  font-weight: var(--aiwfm-font-weight-semibold);
  line-height: 28px;
  letter-spacing: var(--aiwfm-letter-spacing-tight);
}

.aiwfm-category-header .page-header-description {
  margin: var(--aiwfm-space-4) 0 0;
  color: var(--aiwfm-color-text);
  font-size: var(--aiwfm-font-size-body);
  line-height: var(--aiwfm-line-height-body);
}

/* Section cards ------------------------------------------------------------ */

.aiwfm-category-page .section-tree {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  gap: var(--aiwfm-space-24);
}

.aiwfm-category-page .section-tree .section {
  box-sizing: border-box;
  flex: initial;
  width: 100%;
  margin: 0;
  padding: var(--aiwfm-space-16) var(--aiwfm-space-20) var(--aiwfm-space-20);
  border: 1px solid rgb(0 0 0 / 10%);
  border-radius: var(--aiwfm-radius-card);
  background: var(--aiwfm-color-surface);
}

@media (min-width: 768px) {
  .aiwfm-category-page .section-tree {
    flex-direction: row;
  }

  .aiwfm-category-page .section-tree .section {
    flex: 1 1 calc(50% - var(--aiwfm-space-24) / 2);
    width: auto;
  }
}

.aiwfm-category-page .section-tree-title {
  margin: 0 0 var(--aiwfm-space-16);
  padding-bottom: 12px;
  border-bottom: 1px solid rgb(0 0 0 / 10%);
  font-size: var(--aiwfm-font-size-body);
  font-weight: var(--aiwfm-font-weight-semibold);
  line-height: var(--aiwfm-line-height-body);
  letter-spacing: var(--aiwfm-letter-spacing-tight);
}

.aiwfm-category-page .section-tree-title a {
  color: var(--aiwfm-color-text);
}

.aiwfm-category-page .article-list {
  display: flex;
  flex-direction: column;
  gap: var(--aiwfm-space-16);
  margin: 0;
  padding: 0;
  list-style: none;
}

.aiwfm-category-page .article-list-item {
  padding: 0;
  border: 0;
  font-size: var(--aiwfm-font-size-body);
  line-height: var(--aiwfm-line-height-body);
}

.aiwfm-category-page .article-list-item a {
  color: var(--aiwfm-color-primary);
  font-weight: var(--aiwfm-font-weight-regular);
}

.aiwfm-category-page .see-all-articles {
  display: inline-block;
  margin-top: var(--aiwfm-space-16);
  color: var(--aiwfm-color-primary);
  font-size: var(--aiwfm-font-size-body);
  line-height: var(--aiwfm-line-height-body);
}

.aiwfm-category-page .section-tree .section-empty {
  display: block;
  color: var(--aiwfm-color-text-muted);
  font-size: var(--aiwfm-font-size-body);
  line-height: var(--aiwfm-line-height-body);
}

.aiwfm-category-page .category-empty {
  display: block;
  padding: var(--aiwfm-space-40);
  color: var(--aiwfm-color-text-muted);
  text-align: center;
}

/* Responsive: Figma's "WFM Responsive" flow defines tablet (~782px) and
   mobile (375px) frames for this page too — both keep the search band,
   breadcrumb row, and content background full-width, they just shrink the
   80px desktop gutter. The tablet/mobile frames also collapse the left
   category-nav sidebar; that's now handled by AIWFM-CATNAV-001's own
   `display: none` below 1024px, so only the gutter step is reproduced here. */
@media (max-width: 1199px) {
  .aiwfm-category-search-band {
    padding: var(--aiwfm-space-24) var(--aiwfm-page-gutter-desktop);
  }

  .aiwfm-category-breadcrumb-row {
    padding: 0 var(--aiwfm-page-gutter-desktop);
  }

  .aiwfm-category-content-bg {
    padding: var(--aiwfm-space-32) var(--aiwfm-page-gutter-desktop);
  }
}

@media (max-width: 767px) {
  .aiwfm-category-search-band {
    padding: var(--aiwfm-space-24) var(--aiwfm-page-gutter-mobile);
  }

  .aiwfm-category-breadcrumb-row {
    padding: 0 var(--aiwfm-page-gutter-mobile);
  }

  .aiwfm-category-content-bg {
    padding: var(--aiwfm-space-32) var(--aiwfm-page-gutter-mobile);
  }
}

/* AIWFM-CATEGORY-001 END ------------------------------------------------------ */

/* AIWFM-REQUEST-001 START -----------------------------------------------------
   Request pages (new-request form, request list, request detail): no dedicated
   Figma frames exist for these pages, so this block applies the same shared
   tokens and beige-content/breadcrumb-row pattern used on the category,
   section, and article pages for visual consistency. No Handlebars helpers,
   form fields, or JS behavior are changed — style only.
   Audit/checklist: ../ZENDESK_UPDATE_LOG.md, ../ZENDESK_DESIGN_UPDATE_CHECKLIST.md
   -------------------------------------------------------------------------- */

.aiwfm-request-page {
  font-family: var(--aiwfm-font-family-base);
}

.aiwfm-request-breadcrumb-row {
  padding: 0 var(--aiwfm-page-gutter-desktop);
  background: var(--aiwfm-color-surface);
  border-bottom: 1px solid rgb(0 0 0 / 10%);
}

.aiwfm-request-breadcrumbs {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  min-height: 60px;
  margin-bottom: 0;
}

.aiwfm-request-breadcrumbs .breadcrumbs {
  margin: 0;
  font-size: var(--aiwfm-font-size-small);
  line-height: var(--aiwfm-line-height-small);
}

.aiwfm-request-breadcrumbs .sub-nav {
  width: 100%;
  margin-bottom: 0;
}

.aiwfm-request-content-bg {
  padding: var(--aiwfm-space-40) var(--aiwfm-page-gutter-desktop);
  background: var(--aiwfm-color-surface-beige);
}

.aiwfm-request-heading {
  margin: 0 0 var(--aiwfm-space-24);
  color: var(--aiwfm-color-text);
  font-size: var(--aiwfm-font-size-heading);
  font-weight: var(--aiwfm-font-weight-semibold);
  line-height: var(--aiwfm-line-height-heading);
  letter-spacing: var(--aiwfm-letter-spacing-tight);
}

.aiwfm-request-content-bg .my-activities-header {
  margin-bottom: var(--aiwfm-space-24);
}

.aiwfm-request-content-bg .requests-table-toolbar,
.aiwfm-request-content-bg .requests,
.aiwfm-request-content-bg .request-container,
.aiwfm-request-content-bg .form {
  background: var(--aiwfm-color-surface);
  border-radius: var(--aiwfm-radius-card);
}

.aiwfm-request-content-bg .requests-table-toolbar {
  padding: var(--aiwfm-space-16) var(--aiwfm-space-20);
}

.aiwfm-request-content-bg .requests-table-toolbar + .requests {
  margin-top: var(--aiwfm-space-16);
}

.aiwfm-request-content-bg .requests-table thead th {
  color: var(--aiwfm-color-text-muted);
  font-size: var(--aiwfm-font-size-small);
}

.aiwfm-request-content-bg .requests-table td,
.aiwfm-request-content-bg .requests-table th {
  padding-inline: var(--aiwfm-space-20);
}

.aiwfm-request-content-bg .form,
.aiwfm-request-content-bg .request-container {
  padding: var(--aiwfm-space-24) var(--aiwfm-space-20);
}

@media (min-width: 1024px) {
  .aiwfm-request-content-bg .request-main {
    padding-right: var(--aiwfm-space-24);
  }

  .aiwfm-request-content-bg .request-sidebar {
    padding-left: var(--aiwfm-space-24);
    border-left: 1px solid rgb(0 0 0 / 10%);
  }
}

.aiwfm-request-content-bg .request-details dt {
  color: var(--aiwfm-color-text-muted);
  font-size: var(--aiwfm-font-size-small);
}

@media (max-width: 767px) {
  .aiwfm-request-breadcrumb-row {
    padding: 0 var(--aiwfm-page-gutter-mobile);
  }

  .aiwfm-request-content-bg {
    padding: var(--aiwfm-space-32) var(--aiwfm-page-gutter-mobile);
  }

  .aiwfm-request-content-bg .form,
  .aiwfm-request-content-bg .request-container {
    padding: var(--aiwfm-space-20) var(--aiwfm-space-16);
  }
}

/* AIWFM-REQUEST-001 END ------------------------------------------------------- */

/* AIWFM-HOME-001 START: approved Figma home-page search hero */

#main-content.hero {
  box-sizing: border-box;
  height: 248px;
  margin-bottom: 4px;
  padding: 32px 80px;
  /* AIWFM-HOME-002: reuse the shared Figma "Header Gradient [02]" stop list
     (see AIWFM-CATEGORY-001's --aiwfm-gradient-header-stops token) instead of
     a duplicated, slightly-differently-rounded stop list. Visually equivalent. */
  background-image: linear-gradient(83.72deg, var(--aiwfm-gradient-header-stops));
  background-position: center;
  background-size: cover;
  text-align: center;
}

#main-content .hero-inner {
  position: relative;
  top: auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto 48px;
  row-gap: 24px;
  align-items: center;
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
  transform: none;
}

#main-content .abvs-headtext {
  grid-row: 1;
  color: var(--aiwfm-color-text, #000);
}

#main-content .abvs-headtext h1 {
  margin: 0;
  color: var(--aiwfm-color-text, #000);
  font-family: var(--aiwfm-font-family-base);
  font-size: 32px;
  font-weight: 600;
  line-height: 48px;
  letter-spacing: -0.2px;
  text-shadow: none;
}

#main-content .search {
  grid-row: 2;
  grid-column: 1;
  justify-self: center;
  box-sizing: border-box;
  width: min(800px, 100%);
  height: 48px;
  margin: 0;
  overflow: hidden;
  background: var(--aiwfm-color-surface, #fff);
  border: 0;
  border-radius: var(--aiwfm-radius-control, 999px);
  box-shadow:
    0 1px 1.5px rgb(0 0 0 / 10%),
    0 1px 1px rgb(0 0 0 / 10%);
}

#main-content .search:focus-within {
  box-shadow:
    0 1px 1.5px rgb(0 0 0 / 10%),
    0 1px 1px rgb(0 0 0 / 10%),
    0 0 0 2px var(--aiwfm-color-focus, #0040dd);
}

#main-content .search input[type="search"] {
  height: 48px;
  padding-block: 0;
  padding-inline: 40px 16px;
  color: var(--aiwfm-color-text, #000);
  font-family: var(--aiwfm-font-family-base);
  font-size: 14px;
  font-weight: 500;
  line-height: 21px;
}

#main-content .search input[type="search"]::placeholder {
  color: var(--aiwfm-color-text-muted, #72757a);
  opacity: 1;
}

#main-content .search-icon {
  position: relative;
  top: auto;
  right: auto;
  left: auto;
  z-index: 1;
  grid-row: 2;
  grid-column: 1;
  align-self: center;
  justify-self: start;
  display: block;
  width: 16px;
  height: 16px;
  margin-inline-start: max(16px, calc((100% - 800px) / 2 + 16px));
  color: var(--aiwfm-color-text-muted, #72757a);
  transform: none;
  pointer-events: none;
}

#main-content .abvs-subtext {
  width: min(666px, 100%);
  margin: 24px auto 0;
  color: var(--aiwfm-color-text, #000);
}

#main-content .abvs-subtext p {
  margin: 0;
  color: var(--aiwfm-color-text, #000);
  font-family: var(--aiwfm-font-family-base);
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: 0;
  text-align: center;
}

@media (max-width: 767px) {
  #main-content.hero {
    height: auto;
    min-height: 248px;
    padding: 32px var(--aiwfm-page-gutter-mobile, 20px);
  }

  #main-content .abvs-headtext h1 {
    font-size: 24px;
    line-height: 32px;
  }
}

/* AIWFM-HOME-001 END */

/* AIWFM-ACT-001 START: approved Figma recent-activity section */

.home-section.activity {
  box-sizing: border-box;
  width: calc(100vw - var(--aiwfm-scrollbar-width, 16px));
  max-width: var(--aiwfm-content-max-width, 1400px);
  margin: 0 0 0 50%;
  padding: var(--aiwfm-space-40, 40px)
    var(--aiwfm-page-gutter-desktop, 36px);
  background: #f8f6f3;
  border-top: 0;
  font-family: var(--aiwfm-font-family-base);
  transform: translateX(-50%);
}

.home-section.activity .recent-activity-header {
  margin: 0 0 var(--aiwfm-space-24, 24px);
  color: var(--aiwfm-color-text, #000);
  font-size: var(--aiwfm-font-size-heading, 24px);
  font-weight: var(--aiwfm-font-weight-semibold, 600);
  line-height: var(--aiwfm-line-height-heading, 32px);
  letter-spacing: var(--aiwfm-letter-spacing-tight, -0.2px);
  text-align: center;
}

.home-section.activity .recent-activity-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.home-section.activity .recent-activity-item {
  display: grid;
  grid-template-areas:
    "parent parent"
    "link meta";
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px var(--aiwfm-space-24, 24px);
  align-items: center;
  box-sizing: border-box;
  min-height: 97px;
  padding: var(--aiwfm-space-24, 24px) 0;
  overflow: visible;
  border-bottom: 1px solid rgb(0 0 0 / 10%);
}

.home-section.activity .recent-activity-item-parent {
  grid-area: parent;
  width: auto;
  margin: 0;
  color: var(--aiwfm-color-primary, #0040dd);
  font-size: 15px;
  font-weight: 700;
  line-height: 20px;
}

.home-section.activity .recent-activity-item-parent a {
  color: inherit;
  text-decoration: none;
}

.home-section.activity .recent-activity-item-link {
  grid-area: link;
  width: auto;
  min-width: 0;
  margin: 0;
  color: var(--aiwfm-color-text, #000);
  font-size: 15px;
  font-weight: 500;
  line-height: 20px;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.home-section.activity .recent-activity-item-link:hover,
.home-section.activity .recent-activity-item-link:active,
.home-section.activity .recent-activity-item-link:focus {
  color: var(--aiwfm-color-primary, #0040dd);
}

.home-section.activity .recent-activity-item-meta {
  grid-area: meta;
  float: none;
  margin: 0;
  color: var(--aiwfm-color-text-muted, #72757a);
  font-size: 14px;
  line-height: 21px;
  white-space: nowrap;
}

.home-section.activity .recent-activity-item-time,
.home-section.activity .recent-activity-item-comment {
  font-size: inherit;
  line-height: inherit;
}

.home-section.activity .recent-activity-item-comment {
  padding-left: 8px;
}

[dir="rtl"] .home-section.activity .recent-activity-item-comment {
  padding-right: 8px;
  padding-left: 0;
}

.home-section.activity .recent-activity-comment-icon svg {
  width: 16px;
  height: 16px;
  color: currentColor;
}

.home-section.activity .recent-activity-controls {
  padding-top: var(--aiwfm-space-24, 24px);
}

.home-section.activity .recent-activity-controls a,
.home-section.activity .recent-activity-controls a:visited {
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  color: var(--aiwfm-color-primary, #0040dd);
  font-size: 15px;
  font-weight: 500;
  line-height: 20px;
  text-decoration: none;
}

.home-section.activity .recent-activity-controls a:hover,
.home-section.activity .recent-activity-controls a:active,
.home-section.activity .recent-activity-controls a:focus {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.home-section.activity .recent-activity-controls a::after {
  width: 8px;
  height: 6px;
  margin-left: 12px;
  content: "";
  background-color: currentColor;
  -webkit-mask-image: url(/hc/theming_assets/01M0JTDQPWSH7GXBHGJP467G3Q);
  mask-image: url(/hc/theming_assets/01M0JTDQPWSH7GXBHGJP467G3Q);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  transform: rotate(-90deg);
}

[dir="rtl"] .home-section.activity .recent-activity-controls a::after {
  margin-right: 12px;
  margin-left: 0;
  transform: rotate(90deg);
}

.home-section.activity a:focus-visible {
  outline: 2px solid var(--aiwfm-color-focus, #0040dd);
  outline-offset: 3px;
}

@media (max-width: 767px) {
  .home-section.activity {
    padding: var(--aiwfm-space-32, 32px)
      var(--aiwfm-page-gutter-mobile, 20px);
  }

  .home-section.activity .recent-activity-item {
    grid-template-areas:
      "parent"
      "link"
      "meta";
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    min-height: 0;
    padding: var(--aiwfm-space-20, 20px) 0;
  }

  .home-section.activity .recent-activity-item-meta {
    white-space: normal;
  }
}

/* AIWFM-ACT-001 END */

/* AIWFM-SECTION-001 START ----------------------------------------------------
   Section page: header, subsections, and article list. Reuses
   AIWFM-CATEGORY-001's gradient search band, breadcrumb row, and beige
   content background (unscoped classes shared across the page) for visual
   consistency across the category/section page family. No dedicated Figma
   frame exists for a sidebar-less section list (see ZENDESK_UPDATE_LOG.md);
   scoped only to data section_page.hbs actually exposes.
   Audit/checklist: ../ZENDESK_UPDATE_LOG.md
   -------------------------------------------------------------------------- */

.aiwfm-section-page {
  font-family: var(--aiwfm-font-family-base);
}

.aiwfm-section-page .container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0;
}

.aiwfm-section-page .section-container {
  display: block;
}

.aiwfm-section-page .section-content {
  width: 100%;
}

/* The left-nav sidebar (AIWFM-CATNAV-001) is hidden below 1024px, so the
   section-container only needs to become a flex row once it's visible. */
@media (min-width: 1024px) {
  .aiwfm-section-page .section-container {
    display: flex;
    align-items: flex-start;
    gap: var(--aiwfm-space-24);
  }

  .aiwfm-section-page .section-content {
    flex: 1;
    width: auto;
    min-width: 0;
  }
}

.aiwfm-section-page .section-list {
  display: flex;
  flex-direction: column;
  gap: var(--aiwfm-space-16);
  margin: 0 0 var(--aiwfm-space-24);
  padding: 0;
  list-style: none;
}

.aiwfm-section-page .section-list-item {
  padding: 0;
  border: 0;
  font-size: var(--aiwfm-font-size-body);
  line-height: var(--aiwfm-line-height-body);
}

.aiwfm-section-page .section-list-item a {
  display: flex;
  box-sizing: border-box;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: var(--aiwfm-space-16) var(--aiwfm-space-20);
  border: 1px solid rgb(0 0 0 / 10%);
  border-radius: var(--aiwfm-radius-card);
  background: var(--aiwfm-color-surface);
  color: var(--aiwfm-color-text);
  font-size: var(--aiwfm-font-size-body);
  font-weight: var(--aiwfm-font-weight-semibold);
  line-height: var(--aiwfm-line-height-body);
  text-decoration: none;
}

.aiwfm-section-page .section-list-item a:hover,
.aiwfm-section-page .section-list-item a:focus {
  border-color: var(--aiwfm-color-primary);
}

.aiwfm-section-page .section-list-item a svg {
  flex-shrink: 0;
  color: var(--aiwfm-color-text-muted);
}

.aiwfm-section-page .article-list {
  display: flex;
  flex-direction: column;
  gap: var(--aiwfm-space-16);
  margin: 0;
  padding: 0;
  list-style: none;
}

.aiwfm-section-page .article-list-item {
  padding: 0;
  border: 0;
  font-size: var(--aiwfm-font-size-body);
  line-height: var(--aiwfm-line-height-body);
}

.aiwfm-section-page .article-list-item a {
  color: var(--aiwfm-color-primary);
  font-weight: var(--aiwfm-font-weight-regular);
}

.aiwfm-section-page .section-empty {
  display: block;
  padding: var(--aiwfm-space-40);
  color: var(--aiwfm-color-text-muted);
  text-align: center;
}

.aiwfm-section-page a:focus-visible {
  outline: 2px solid var(--aiwfm-color-focus, #0040dd);
  outline-offset: 3px;
}

/* AIWFM-SECTION-001 END ------------------------------------------------------- */

/* AIWFM-SEARCH-001 START -----------------------------------------------------
   Search results page: header, filter sidebar, and result list. Reuses
   AIWFM-CATEGORY-001's gradient search band, breadcrumb row, and beige
   content background (unscoped classes shared across the page) for visual
   consistency across the page family. No dedicated Figma frame exists for
   this page (see ZENDESK_UPDATE_LOG.md); scoped only to data
   search_results.hbs actually exposes. Layout ratios (sidebar/column flex
   split, mobile stacking) and all collapsible-filter/toggle behavior are
   untouched - only visual skin (color, spacing, borders) is added here.
   Audit/checklist: ../ZENDESK_UPDATE_LOG.md
   -------------------------------------------------------------------------- */

.aiwfm-search-page {
  font-family: var(--aiwfm-font-family-base);
}

.aiwfm-search-page .container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0;
}

.aiwfm-search-page .search-results {
  gap: var(--aiwfm-space-24);
}

.aiwfm-search-page .search-results-column {
  min-width: 0;
}

/* Filter sidebar ------------------------------------------------------------ */

.aiwfm-search-page .search-results-sidebar {
  border-top: 0;
  margin-bottom: 0;
}

.aiwfm-search-page .filters-in-section {
  margin-bottom: var(--aiwfm-space-16);
  padding: var(--aiwfm-space-16) var(--aiwfm-space-20);
  border: 1px solid rgb(0 0 0 / 10%);
  border-radius: var(--aiwfm-radius-card);
  background: var(--aiwfm-color-surface);
}

.aiwfm-search-page .collapsible-sidebar-title {
  margin: 0 0 var(--aiwfm-space-12);
  color: var(--aiwfm-color-text);
  font-size: var(--aiwfm-font-size-body);
  font-weight: var(--aiwfm-font-weight-semibold);
  line-height: var(--aiwfm-line-height-body);
}

.aiwfm-search-page .sidenav-item {
  color: var(--aiwfm-color-text);
  font-size: var(--aiwfm-font-size-small);
  line-height: var(--aiwfm-line-height-small);
}

.aiwfm-search-page .sidenav-item:hover,
.aiwfm-search-page .sidenav-item.current {
  background-color: var(--aiwfm-color-surface-beige);
}

.aiwfm-search-page .doc-count {
  color: var(--aiwfm-color-text-muted);
}

.aiwfm-search-page .see-all-filters {
  color: var(--aiwfm-color-primary);
}

.aiwfm-search-page .sidenav-tag .content-tag {
  background: var(--aiwfm-color-surface-beige);
}

/* Result list ---------------------------------------------------------------- */

.aiwfm-search-page .search-results-list {
  display: flex;
  flex-direction: column;
  gap: var(--aiwfm-space-16);
  margin: 0 0 var(--aiwfm-space-24);
}

.aiwfm-search-page .search-results-list > li {
  padding: var(--aiwfm-space-16) var(--aiwfm-space-20);
  border: 1px solid rgb(0 0 0 / 10%);
  border-radius: var(--aiwfm-radius-card);
  background: var(--aiwfm-color-surface);
}

.aiwfm-search-page .search-result-title {
  font-size: var(--aiwfm-font-size-body);
  font-weight: var(--aiwfm-font-weight-semibold);
}

.aiwfm-search-page .results-list-item-link {
  color: var(--aiwfm-color-primary);
  text-decoration: none;
}

.aiwfm-search-page .results-list-item-link:hover,
.aiwfm-search-page .results-list-item-link:focus {
  text-decoration: underline;
}

.aiwfm-search-page .search-results .meta-group {
  color: var(--aiwfm-color-text-muted);
  font-size: var(--aiwfm-font-size-small);
  line-height: var(--aiwfm-line-height-small);
}

.aiwfm-search-page .search-results-description {
  color: var(--aiwfm-color-text);
  font-size: var(--aiwfm-font-size-small);
  line-height: var(--aiwfm-line-height-small);
}

/* Empty state ----------------------------------------------------------------- */

.aiwfm-search-page .no-results {
  padding: var(--aiwfm-space-40) 0;
}

.aiwfm-search-page .no-results .headline {
  color: var(--aiwfm-color-text);
  font-size: var(--aiwfm-font-size-body);
  font-weight: var(--aiwfm-font-weight-semibold);
  letter-spacing: normal;
}

.aiwfm-search-page .no-results .action-prompt {
  color: var(--aiwfm-color-text-muted);
  font-size: var(--aiwfm-font-size-small);
  letter-spacing: normal;
}

.aiwfm-search-page .no-results .action-prompt a {
  color: var(--aiwfm-color-primary);
}

.aiwfm-search-page a:focus-visible,
.aiwfm-search-page button:focus-visible {
  outline: 2px solid var(--aiwfm-color-focus, #0040dd);
  outline-offset: 3px;
}

/* AIWFM-SEARCH-001 END --------------------------------------------------------- */